:root {
    color-scheme: light;
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --primary-green: #2fa982;
    --primary-green-dark: #238568;
    --primary-green-light: #244b42;
    --primary-green-lighter: #1d3b35;
    --secondary-yellow: #e4ad45;
    --secondary-yellow-dark: #c58c29;
    --secondary-yellow-light: #493c25;
    --accent-red: #ef7777;
    --accent-red-dark: #d85f5f;
    --accent-orange: #ed975b;
    --text-dark: #e7eceb;
    --text-medium: #b4c0bd;
    --text-light: #8f9e9a;
    --text-white: #f7faf9;
    --bg-light: #1d2828;
    --bg-white: #263332;
    --bg-light-gray: #202d2c;
    --bg-medium-gray: #344241;
    --border-light: #3a4a48;
    --border-medium: #4a5c59;
    --border-dark: #687976;
    --success-color: #45bd91;
    --warning-color: #e4ad45;
    --error-color: #ef7777;
    --info-color: #73a8e8;
    --shadow-sm: 0 1px 2px rgba(5, 12, 12, 0.22);
    --shadow-md: 0 4px 10px rgba(5, 12, 12, 0.28);
    --shadow-lg: 0 12px 24px rgba(5, 12, 12, 0.32);
    --shadow-xl: 0 20px 34px rgba(5, 12, 12, 0.36);
    --shadow-2xl: 0 28px 54px rgba(5, 12, 12, 0.44);
}

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

:root[data-theme="dark"] .card,
:root[data-theme="dark"] .account-card,
:root[data-theme="dark"] .product-card,
:root[data-theme="dark"] .cart-item,
:root[data-theme="dark"] .order-card,
:root[data-theme="dark"] .modal-content,
:root[data-theme="dark"] .popup-content,
:root[data-theme="dark"] .tabs-container,
:root[data-theme="dark"] .settings-block {
    background-color: var(--bg-white);
    border-color: var(--border-light);
    color: var(--text-dark);
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea {
    background-color: #202c2b;
    border-color: var(--border-medium);
    color: var(--text-dark);
}

:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
    color: #879592;
}

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

:root[data-theme="dark"] .text-medium {
    color: var(--text-medium) !important;
}

:root[data-theme="dark"] .site-header-shell {
    filter: saturate(0.82) brightness(0.88);
    border-bottom: 0 !important;
    box-shadow: 0 4px 14px rgba(35, 133, 104, 0.18) !important;
}

:root[data-theme="dark"] #account-menu,
:root[data-theme="dark"] #sidebar,
:root[data-theme="dark"] .live-search-results,
:root[data-theme="dark"] .dropdown-menu {
    background: #263332;
    border-color: var(--border-light);
    color: var(--text-dark);
}

:root[data-theme="dark"] img {
    filter: brightness(0.92);
}

:root[data-theme="dark"] .btn-primary,
:root[data-theme="dark"] .back-to-top {
    filter: saturate(0.88) brightness(0.94);
}

:root[data-theme="dark"] .checkout-card-body,
:root[data-theme="dark"] .account-map-dialog,
:root[data-theme="dark"] .order-managed-customer-note,
:root[data-theme="dark"] .product-card-qty-controls,
:root[data-theme="dark"] .cart-list-qty-btn,
:root[data-theme="dark"] .qty-plus,
:root[data-theme="dark"] .qty-minus,
:root[data-theme="dark"] .home-category-chip,
:root[data-theme="dark"] .cart-offer-chip,
:root[data-theme="dark"] .cart-offer-side > span {
    background-color: var(--bg-white) !important;
    border-color: var(--border-light) !important;
    color: var(--text-dark);
}

:root[data-theme="dark"] .danger-zone {
    background: #3a292a;
    border-color: #684044;
}

:root[data-theme="dark"] .checkout-coupon-notice,
:root[data-theme="dark"] .checkout-review-attention {
    background-color: #403824 !important;
    border-color: #79642f;
    color: #f0db9c;
}

/* Night-theme contrast fixes for storefront categories. */
:root[data-theme="dark"] .home-category-strip {
    background: linear-gradient(180deg, #202d2c 0%, #1b2726 100%);
    border-top-color: rgba(75, 190, 151, 0.2);
    border-bottom-color: #344744;
    box-shadow: none;
}

:root[data-theme="dark"] .home-category-chip-live {
    color: #c9f7e5 !important;
    background:
        linear-gradient(180deg, rgba(75, 190, 151, 0.16), rgba(75, 190, 151, 0.04)),
        linear-gradient(135deg, #29473f, #233a35) !important;
    border-color: #43856f !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 7px 17px rgba(5, 12, 12, 0.24);
}

:root[data-theme="dark"] .home-category-chip-soon,
:root[data-theme="dark"] .home-category-chip-tease {
    color: #899492 !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0)),
        repeating-linear-gradient(-45deg, #262e2f, #262e2f 8px, #222a2b 8px, #222a2b 16px) !important;
    border-color: #3b4546 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 5px 12px rgba(5, 12, 12, 0.16);
    opacity: 0.68;
    cursor: not-allowed;
}

:root[data-theme="dark"] .home-category-chip-live.is-active {
    color: #f1fff9 !important;
    background: linear-gradient(135deg, #28745e, #245f50) !important;
    border-color: #52b996 !important;
}

:root[data-theme="dark"] .home-category-chip-live .home-category-chip-text {
    color: inherit !important;
    opacity: 1;
    filter: none;
}

:root[data-theme="dark"] .home-category-chip-live .home-category-chip-icon {
    color: #dff8ef;
    background: #365b50 !important;
}

:root[data-theme="dark"] .home-category-chip-soon .home-category-chip-text,
:root[data-theme="dark"] .home-category-chip-tease .home-category-chip-text {
    color: inherit !important;
    filter: grayscale(1);
}

:root[data-theme="dark"] .home-category-chip-soon .home-category-chip-icon,
:root[data-theme="dark"] .home-category-chip-tease .home-category-chip-icon {
    color: #87918f;
    background: #303839 !important;
    box-shadow: none;
}

/* Account address and order text must remain readable on dark cards. */
:root[data-theme="dark"] #accountOpenMapBtn,
:root[data-theme="dark"] .geo-map-btn {
    background: #30403e !important;
    border-color: #536763 !important;
    color: #edf5f2 !important;
}

:root[data-theme="dark"] #accountOpenMapBtn:hover,
:root[data-theme="dark"] .geo-map-btn:hover {
    background: #394c48 !important;
}

:root[data-theme="dark"] #accountOpenMapBtn.is-set,
:root[data-theme="dark"] .geo-map-btn.is-set {
    background: #25483d !important;
    border-color: #42a47f !important;
    color: #bcebd9 !important;
}

:root[data-theme="dark"] .order-product-meta,
:root[data-theme="dark"] .order-product-qty {
    color: #c4d0cd !important;
}

:root[data-theme="dark"] .order-product-total {
    background: #24473b !important;
    border-color: #3c745f !important;
    color: #d8f4e8 !important;
}

:root[data-theme="dark"] .order-toggle-btn {
    color: #d9ebe5 !important;
    border-color: #536763 !important;
}

/* Header search keeps typed text and placeholder clear in the night palette. */
:root[data-theme="dark"] .search-bar,
:root[data-theme="dark"] .search-bar:focus-within {
    background-color: #eef4f2;
    border-color: rgba(210, 235, 227, 0.72);
    box-shadow: 0 5px 16px rgba(5, 12, 12, 0.24);
}

:root[data-theme="dark"] #searchbar {
    background-color: transparent;
    color: #172421 !important;
    caret-color: #16795e;
}

:root[data-theme="dark"] #searchbar::placeholder {
    color: #60706c !important;
    opacity: 1;
}

:root[data-theme="dark"] #search-logo {
    color: #50635e;
}

/* Live-search results share the dark dropdown surface, so interactive rows
   and their text must not retain the light-theme palette. */
:root[data-theme="dark"] .search-results,
:root[data-theme="dark"] .live-search-results {
    background: #263332;
    border-color: #435451;
}

:root[data-theme="dark"] .search-result-item:hover,
:root[data-theme="dark"] .search-result-item.selected {
    background: #30403e;
    border-color: #526662;
    box-shadow: 0 2px 5px rgba(5, 12, 12, 0.3);
}

:root[data-theme="dark"] .search-result-title {
    color: #edf5f2;
}

:root[data-theme="dark"] .search-no-results {
    color: #bdc9c6;
}

:root[data-theme="dark"] .search-no-results::before {
    color: #91a29e;
}

:root[data-theme="dark"] .search-results::-webkit-scrollbar-track {
    background: #202d2c;
}

:root[data-theme="dark"] .search-results::-webkit-scrollbar-thumb {
    background: #526662;
}

@media (prefers-reduced-motion: no-preference) {
    body,
    .card,
    input,
    select,
    textarea {
        transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
    }
}