:root {
    --brand: var(--primary-color);
    --brand-dark: #04382b;
    --brand-soft: var(--zest-soft);
    --support: #15803d;
    --support-soft: var(--zest-lime-soft);
    --surface: var(--zest-surface);
    --page: var(--zest-page);
    --ink: var(--text-color);
    --muted: var(--zest-muted);
    --line: var(--border-color);
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --primary-color: #22c55e;
    --secondary-color: #a3e635;
    --text-color: #e5e7eb;
    --background-color: #020617;
    --border-color: #263244;
    --zest-surface: #111827;
    --zest-page: #080f1f;
    --zest-muted: #a7b0bf;
    --zest-soft: rgba(34, 197, 94, 0.14);
    --zest-lime-soft: rgba(163, 230, 53, 0.13);
    --zest-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);
    --zest-shadow-soft: 0 10px 24px rgba(0, 0, 0, 0.22);
    --brand: var(--primary-color);
    --brand-dark: #16a34a;
    --brand-soft: var(--zest-soft);
    --support: #86efac;
    --support-soft: var(--zest-lime-soft);
    --surface: var(--zest-surface);
    --page: var(--zest-page);
    --ink: var(--text-color);
    --muted: var(--zest-muted);
    --line: var(--border-color);
}

:root[data-theme="dark"] body {
    background: var(--zest-page);
    color: var(--text-color);
}

:root[data-theme="dark"] .announcement-bar,
:root[data-theme="dark"] .site-footer {
    background: #020617;
}

:root[data-theme="dark"] .site-header,
:root[data-theme="dark"] .mobile-bottom-nav {
    background: rgba(17, 24, 39, 0.97);
    border-color: var(--border-color);
}

:root[data-theme="dark"] .search-form,
:root[data-theme="dark"] .search-form .form-control {
    background: #0f172a;
    color: var(--text-color);
}

:root[data-theme="dark"] .search-form .form-control::placeholder {
    color: #94a3b8;
}

:root[data-theme="dark"] .icon-action,
:root[data-theme="dark"] .navbar-toggler {
    background: #172033;
    border-color: var(--border-color);
    color: var(--text-color);
}

:root[data-theme="dark"] .nav-menu .nav-link,
:root[data-theme="dark"] .mobile-bottom-nav a {
    color: #cbd5e1;
}

:root[data-theme="dark"] .nav-menu .nav-link:hover,
:root[data-theme="dark"] .nav-menu .nav-link.active,
:root[data-theme="dark"] .mobile-bottom-nav a:hover,
:root[data-theme="dark"] .mobile-bottom-nav a:focus {
    background: var(--zest-soft);
    color: var(--primary-color);
}

:root[data-theme="dark"] .footer-brand,
:root[data-theme="dark"] .brand-logo {
    background: #f8fafc;
    border-radius: var(--zest-radius);
    padding: 4px 8px;
}

:root[data-theme="dark"] .homepage,
:root[data-theme="dark"] .category-collections-section {
    background: var(--zest-page);
}

:root[data-theme="dark"] .homepage-hero {
    background: linear-gradient(135deg, #07140f 0%, #0f172a 56%, #111827 100%);
    border-color: var(--border-color);
}

:root[data-theme="dark"] .homepage-hero-copy h1,
:root[data-theme="dark"] .section-heading h2,
:root[data-theme="dark"] .category-collection-header h3 {
    color: #f8fafc;
}

:root[data-theme="dark"] .homepage-hero-copy p,
:root[data-theme="dark"] .homepage-product-description,
:root[data-theme="dark"] .why-card p {
    color: var(--zest-muted);
}

:root[data-theme="dark"] .hero-kicker,
:root[data-theme="dark"] .homepage-hero-trust span,
:root[data-theme="dark"] .hero-floating-card,
:root[data-theme="dark"] .homepage-category-card,
:root[data-theme="dark"] .homepage-product-card,
:root[data-theme="dark"] .why-card {
    background: var(--zest-surface);
    border-color: var(--border-color);
}

:root[data-theme="dark"] .hero-kicker {
    color: var(--secondary-color);
}

:root[data-theme="dark"] .homepage-hero-trust span,
:root[data-theme="dark"] .hero-floating-card strong,
:root[data-theme="dark"] .homepage-category-card,
:root[data-theme="dark"] .homepage-product-body h3 a,
:root[data-theme="dark"] .why-card h3 {
    color: var(--text-color);
}

:root[data-theme="dark"] .hero-floating-card span,
:root[data-theme="dark"] .homepage-regular-price {
    color: #94a3b8;
}

:root[data-theme="dark"] .homepage-product-media {
    background: #0f172a;
}

:root[data-theme="dark"] .homepage-section + .homepage-section,
:root[data-theme="dark"] .category-collection + .category-collection {
    border-color: var(--border-color);
}

:root[data-theme="dark"] .product-card,
:root[data-theme="dark"] .product-detail-image,
:root[data-theme="dark"] .product-detail-content,
:root[data-theme="dark"] .product-info-tabs,
:root[data-theme="dark"] .gallery-thumb {
    background: var(--zest-surface);
    border-color: var(--border-color);
    box-shadow: var(--zest-shadow-soft);
    color: var(--text-color);
}

:root[data-theme="dark"] .product-image,
:root[data-theme="dark"] .detail-price-panel,
:root[data-theme="dark"] .rating-placeholder {
    background: #0f172a;
    border-color: var(--border-color);
}

:root[data-theme="dark"] .product-title,
:root[data-theme="dark"] .product-title a,
:root[data-theme="dark"] .product-body h3,
:root[data-theme="dark"] .product-body h3 a,
:root[data-theme="dark"] .product-detail-content h1,
:root[data-theme="dark"] .detail-description h2,
:root[data-theme="dark"] .detail-cart-form .form-label {
    color: var(--text-color);
}

:root[data-theme="dark"] .product-description,
:root[data-theme="dark"] .detail-short,
:root[data-theme="dark"] .stock-note,
:root[data-theme="dark"] .detail-description p,
:root[data-theme="dark"] .detail-price-panel > span,
:root[data-theme="dark"] .rating-placeholder,
:root[data-theme="dark"] .product-info-tabs .nav-link {
    color: var(--zest-muted);
}

:root[data-theme="dark"] .price,
:root[data-theme="dark"] .read-more-link,
:root[data-theme="dark"] .detail-category,
:root[data-theme="dark"] .product-info-tabs .nav-link.active {
    color: var(--primary-color);
}

:root[data-theme="dark"] .detail-category,
:root[data-theme="dark"] .saving-text {
    background: var(--zest-soft);
}

:root[data-theme="dark"] .saving-text {
    color: var(--secondary-color);
}

:root[data-theme="dark"] .product-info-tabs .nav-tabs,
:root[data-theme="dark"] .detail-cart-form,
:root[data-theme="dark"] .detail-trust-list {
    border-color: var(--border-color);
}

:root[data-theme="dark"] .stock-ok {
    background: rgba(34, 197, 94, 0.16);
    color: #86efac;
}

:root[data-theme="dark"] .stock-low {
    background: rgba(245, 158, 11, 0.15);
    color: #fbbf24;
}

:root[data-theme="dark"] .stock-out {
    background: rgba(239, 68, 68, 0.16);
    color: #fca5a5;
}

:root[data-theme="dark"] .cart-table-card,
:root[data-theme="dark"] .cart-summary,
:root[data-theme="dark"] .checkout-card {
    background: var(--zest-surface);
    border-color: var(--border-color);
    box-shadow: var(--zest-shadow-soft);
    color: var(--text-color);
}

:root[data-theme="dark"] .cart-card-heading,
:root[data-theme="dark"] .checkout-card-heading,
:root[data-theme="dark"] .summary-heading,
:root[data-theme="dark"] .cart-row,
:root[data-theme="dark"] .summary-line,
:root[data-theme="dark"] .summary-total,
:root[data-theme="dark"] .payment-box,
:root[data-theme="dark"] .checkout-summary-item,
:root[data-theme="dark"] .checkout-trust-list {
    border-color: var(--border-color);
}

:root[data-theme="dark"] .cart-item-image,
:root[data-theme="dark"] .quantity-controls,
:root[data-theme="dark"] .summary-note,
:root[data-theme="dark"] .payment-option {
    background: #0f172a;
    border-color: var(--border-color);
}

:root[data-theme="dark"] .cart-card-heading h2,
:root[data-theme="dark"] .checkout-card-heading h2,
:root[data-theme="dark"] .summary-heading h2,
:root[data-theme="dark"] .cart-product h3 a,
:root[data-theme="dark"] .summary-line strong,
:root[data-theme="dark"] .payment-box h3,
:root[data-theme="dark"] .payment-option strong,
:root[data-theme="dark"] .checkout-summary-item span,
:root[data-theme="dark"] .checkout-form-card .form-label,
:root[data-theme="dark"] .quantity-controls strong {
    color: var(--text-color);
}

:root[data-theme="dark"] .cart-product p,
:root[data-theme="dark"] .cart-product span,
:root[data-theme="dark"] .cart-quantity-block > span,
:root[data-theme="dark"] .cart-price-block > span,
:root[data-theme="dark"] .summary-line span,
:root[data-theme="dark"] .summary-total span,
:root[data-theme="dark"] .summary-note,
:root[data-theme="dark"] .checkout-heading p,
:root[data-theme="dark"] .payment-option small,
:root[data-theme="dark"] .checkout-summary-item small {
    color: var(--zest-muted);
}

:root[data-theme="dark"] .cart-card-heading span,
:root[data-theme="dark"] .checkout-card-heading span,
:root[data-theme="dark"] .summary-heading span,
:root[data-theme="dark"] .cart-line-total,
:root[data-theme="dark"] .checkout-summary-item strong,
:root[data-theme="dark"] .summary-total strong {
    color: var(--primary-color);
}

:root[data-theme="dark"] .quantity-controls button,
:root[data-theme="dark"] .checkout-form-card .form-control {
    background: #111827;
    border-color: var(--border-color);
    color: var(--text-color);
}

:root[data-theme="dark"] .checkout-form-card .form-control:focus {
    border-color: rgba(34, 197, 94, 0.62);
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.12);
}

:root[data-theme="dark"] .content-page,
:root[data-theme="dark"] .trust-content-grid article,
:root[data-theme="dark"] .contact-form-card {
    background: var(--zest-surface);
    border-color: var(--border-color);
    box-shadow: var(--zest-shadow-soft);
    color: var(--text-color);
}

:root[data-theme="dark"] .trust-content-grid article,
:root[data-theme="dark"] .contact-note {
    background: #0f172a;
}

:root[data-theme="dark"] .policy-section,
:root[data-theme="dark"] .contact-note {
    border-color: var(--border-color);
}

:root[data-theme="dark"] .content-page h1,
:root[data-theme="dark"] .content-page h2,
:root[data-theme="dark"] .contact-form-card h2,
:root[data-theme="dark"] .contact-form-card .form-label {
    color: var(--text-color);
}

:root[data-theme="dark"] .content-page p,
:root[data-theme="dark"] .policy-section ul,
:root[data-theme="dark"] .contact-note,
:root[data-theme="dark"] .section-heading p,
:root[data-theme="dark"] .contact-form-card > p {
    color: var(--zest-muted);
}

:root[data-theme="dark"] .content-page > span,
:root[data-theme="dark"] .support-list a {
    color: var(--primary-color);
}

:root[data-theme="dark"] .contact-form-card .form-control {
    background: #0f172a;
    border-color: var(--border-color);
    color: var(--text-color);
}
