/*
Theme Name:   Storefront Child - Dark Theme
Theme URI:    https://woocommerce.com/storefront/
Description:  Dark theme variant of Storefront
Author:       Custom
Template:     storefront
Version:      1.0.1
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  storefront-child
*/

/* ===================================
   Dark Theme Styles
   =================================== */

/* Base Colors */
:root {
    --dark-bg-primary: #1a1a1a;
    --dark-bg-secondary: #2d2d2d;
    --dark-bg-tertiary: #3a3a3a;
    --dark-text-primary: #e0e0e0;
    --dark-text-secondary: #b0b0b0;
    --dark-border: #404040;
    --dark-accent: #4a9eff;
    --dark-accent-hover: #6bb0ff;
}

/* Body and Main Background */
body,
body.woocommerce-page {
    background-color: var(--dark-bg-primary) !important;
    color: var(--dark-text-primary) !important;
}

/* Header */
.site-header,
.main-navigation,
.storefront-primary-navigation {
    background-color: var(--dark-bg-secondary) !important;
    border-bottom-color: var(--dark-border) !important;
}

.site-title a,
.site-description,
.main-navigation ul li a,
.site-header-cart .cart-contents {
    color: var(--dark-text-primary) !important;
}

.main-navigation ul li a:hover {
    color: var(--dark-accent-hover) !important;
}

/* Content Areas */
.site-content,
.content-area,
.widget-area {
    background-color: var(--dark-bg-primary) !important;
}

article,
.hentry,
.type-post,
.type-page,
.type-product {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.entry-title,
.product_title {
    color: var(--dark-text-primary) !important;
}

/* Text and Paragraphs */
p, li, span, div,
.entry-content,
.entry-summary,
.woocommerce-product-details__short-description {
    color: var(--dark-text-primary) !important;
}

a {
    color: var(--dark-accent) !important;
}

a:hover {
    color: var(--dark-accent-hover) !important;
}

/* Sidebar and Widgets */
.widget,
.widget-area .widget {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

.widget-title,
.widget h3 {
    color: var(--dark-text-primary) !important;
    border-bottom-color: var(--dark-border) !important;
}

.widget a {
    color: var(--dark-text-secondary) !important;
}

.widget a:hover {
    color: var(--dark-accent-hover) !important;
}

/* Footer */
.site-footer,
.storefront-footer {
    background-color: var(--dark-bg-secondary) !important;
    border-top-color: var(--dark-border) !important;
    color: var(--dark-text-secondary) !important;
}

.site-info,
.site-footer .widget {
    color: var(--dark-text-secondary) !important;
}

/* WooCommerce Products */
.woocommerce ul.products li.product,
.product {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h3 {
    color: var(--dark-text-primary) !important;
}

.price,
.woocommerce .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--dark-accent) !important;
}

/* Buttons */
button,
.button,
input[type="button"],
input[type="submit"],
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    background-color: var(--dark-accent) !important;
    color: #ffffff !important;
    border-color: var(--dark-accent) !important;
}

button:hover,
.button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background-color: var(--dark-accent-hover) !important;
    border-color: var(--dark-accent-hover) !important;
}

.button.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
}

/* Forms and Inputs */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
select,
textarea,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
    background-color: var(--dark-bg-tertiary) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-accent) !important;
}

/* Tables */
table,
.woocommerce table.shop_table {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

table th,
.woocommerce table.shop_table th {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
}

table td,
.woocommerce table.shop_table td {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

table tbody,
.woocommerce table.shop_table tbody {
    background-color: var(--dark-bg-secondary) !important;
}

/* My Account Downloads Table */
.woocommerce-account table.shop_table,
.woocommerce-MyAccount-downloads table,
table.my_account_orders,
table.woocommerce-orders-table {
    background-color: var(--dark-bg-secondary) !important;
}

.woocommerce-account table.shop_table tbody,
.woocommerce-MyAccount-downloads tbody,
table.my_account_orders tbody,
table.woocommerce-orders-table tbody {
    background-color: var(--dark-bg-secondary) !important;
}

.woocommerce-account table.shop_table tbody tr,
.woocommerce-MyAccount-downloads tbody tr,
table.my_account_orders tbody tr,
table.woocommerce-orders-table tbody tr {
    background-color: var(--dark-bg-secondary) !important;
}

.woocommerce-account table.shop_table td,
.woocommerce-MyAccount-downloads td,
table.my_account_orders td,
table.woocommerce-orders-table td,
td.download-product,
td.download-remaining,
td.download-expires,
td.download-file {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-primary) !important;
}

/* Cart */
.woocommerce-cart .cart-collaterals,
.woocommerce-cart .woocommerce {
    background-color: var(--dark-bg-primary) !important;
}

.woocommerce .cart-collaterals .cart_totals,
.woocommerce .cart-collaterals .shipping_calculator {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
}

/* Checkout */
.woocommerce-checkout #payment,
.woocommerce-checkout .woocommerce-checkout-review-order {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
}

/* Notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
    border-top-color: var(--dark-accent) !important;
}

/* WooCommerce Block-based Notices */
.wc-block-store-notice,
.wc-block-components-notice-banner {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
    border-color: var(--dark-border) !important;
}

.wc-block-components-notice-banner__content,
.wc-block-components-notice-banner__content div,
.wc-block-components-notice-banner__content p {
    color: var(--dark-text-primary) !important;
}

.wc-block-components-notice-banner.is-error {
    background-color: #4a2020 !important;
    border-left-color: #ff4444 !important;
}

.wc-block-components-notice-banner.is-success {
    background-color: #204a20 !important;
    border-left-color: #44ff44 !important;
}

.wc-block-components-notice-banner.is-info {
    background-color: var(--dark-bg-tertiary) !important;
    border-left-color: var(--dark-accent) !important;
}

.wc-block-components-notice-banner svg {
    fill: var(--dark-text-primary) !important;
}

/* Breadcrumbs */
.woocommerce-breadcrumb,
.storefront-breadcrumb {
    color: var(--dark-text-secondary) !important;
}

.woocommerce-breadcrumb a {
    color: var(--dark-text-secondary) !important;
}

/* Pagination */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-primary) !important;
    border-color: var(--dark-border) !important;
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
    background-color: var(--dark-accent) !important;
    color: #ffffff !important;
}

/* Reviews and Ratings */
.woocommerce #reviews #comments ol.commentlist li,
.woocommerce #reviews #comments {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
}

.woocommerce .star-rating span,
.woocommerce p.stars a {
    color: var(--dark-accent) !important;
}

/* Product Images */
.woocommerce div.product div.images,
.woocommerce #content div.product div.images {
    background-color: var(--dark-bg-secondary) !important;
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs li,
.woocommerce div.product .woocommerce-tabs ul.tabs {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: var(--dark-text-secondary) !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--dark-text-primary) !important;
    background-color: var(--dark-bg-primary) !important;
}

.woocommerce div.product .woocommerce-tabs .panel {
    background-color: var(--dark-bg-primary) !important;
    color: var(--dark-text-primary) !important;
}

/* Search */
.site-search,
.widget_product_search form {
    background-color: var(--dark-bg-secondary) !important;
}

/* Overlay and Modals */
.storefront-overlay,
.widget_shopping_cart {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-primary) !important;
}

/* Additional Adjustments */
hr {
    border-color: var(--dark-border) !important;
}

blockquote {
    background-color: var(--dark-bg-tertiary) !important;
    border-left-color: var(--dark-accent) !important;
    color: var(--dark-text-secondary) !important;
}

pre,
code {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
}

/* Mobile Menu */
.main-navigation ul.menu ul,
.main-navigation ul.nav-menu ul {
    background-color: var(--dark-bg-tertiary) !important;
}

/* Product Categories */
.woocommerce .widget_product_categories ul li,
.woocommerce .widget_layered_nav ul li {
    border-bottom-color: var(--dark-border) !important;
}

/* Image Overlays - prevent white backgrounds showing */
img {
    opacity: 0.95;
}

.woocommerce ul.products li.product img {
    background-color: var(--dark-bg-tertiary) !important;
}

/* ===================================
   WooCommerce New Product Notifications - Dark Theme Override
   =================================== */

/* WCNPN Subscription Form */
.wcnpn-subscription-form {
    background-color: var(--dark-bg-secondary) !important;
    border-color: var(--dark-border) !important;
}

.wcnpn-form-title {
    color: var(--dark-text-primary) !important;
}

.wcnpn-form-description {
    color: var(--dark-text-secondary) !important;
}

.wcnpn-email-input {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
    border-color: var(--dark-border) !important;
}

.wcnpn-email-input::placeholder {
    color: #888 !important;
}

.wcnpn-email-input:focus {
    background-color: var(--dark-bg-secondary) !important;
    border-color: #96588a !important;
}

/* Messages */
.wcnpn-message.success {
    background-color: #1a3a1a !important;
    border-color: #2d5a2d !important;
    color: #90ee90 !important;
}

.wcnpn-message.error {
    background-color: #3a1a1a !important;
    border-color: #5a2d2d !important;
    color: #ff6b6b !important;
}
