html[data-theme="dark"] {

    --ks-bg-soft: #211a14;
    --ks-surface-solid: #221b15;
    --ks-ink: #ece5db;
    --ks-ink-soft: #c7bbac;
    --ks-border: rgba(255, 255, 255, 0.12);
    --ks-border-strong: rgba(255, 255, 255, 0.22);
    --ks-cream: #fff7ea;
    --ks-shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.45);
    --ks-shadow-md: 0 18px 48px rgba(0, 0, 0, 0.55);
    color-scheme: dark;
}

html[data-theme="dark"] body {
    background: #15110d !important;
    color: #ece5db !important;
}

html[data-theme="dark"] .navbar,
html[data-theme="dark"] .navbar.sticky-top {
    background:
        radial-gradient(circle at 10% -30%, rgba(255, 236, 205, 0.24), rgba(255, 236, 205, 0) 36%),
        radial-gradient(circle at 90% 8%, rgba(224, 184, 115, 0.22), rgba(224, 184, 115, 0) 34%),
        linear-gradient(135deg,
            rgba(40, 32, 24, 0.70) 0%,
            rgba(60, 46, 30, 0.44) 58%,
            rgba(111, 74, 27, 0.30) 100%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(165%) brightness(1.08);
    backdrop-filter: blur(24px) saturate(165%) brightness(1.08);
    border-bottom: 1px solid rgba(255, 233, 199, 0.14) !important;
    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.48),
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 -1px 0 rgba(224, 184, 115, 0.08) !important;
}

html[data-theme="dark"] .navbar::before {
    background:
        linear-gradient(115deg,
            rgba(255, 236, 205, 0.20) 0%,
            rgba(255, 236, 205, 0.06) 28%,
            rgba(255, 236, 205, 0.02) 58%,
            rgba(224, 184, 115, 0.10) 100%);
    opacity: 0.70;
}

html[data-theme="dark"] .navbar::after {
    background:
        linear-gradient(180deg,
            rgba(255, 236, 205, 0.12) 0%,
            rgba(255, 236, 205, 0) 48%,
            rgba(224, 184, 115, 0.08) 100%);
}

html[data-theme="dark"] .nav-links a,
html[data-theme="dark"] .navbar a,
html[data-theme="dark"] .logo a,
html[data-theme="dark"] .gradient-text {
    color: #f0e9df !important;
}

html[data-theme="dark"] .navbar .logo a {
    background: none;
    color: #f0e9df !important;
    -webkit-text-fill-color: #f0e9df;
    text-shadow: none;
}

html[data-theme="dark"] .dropdown,
html[data-theme="dark"] .sub-dropdown,
html[data-theme="dark"] .menu-overlay {
    background:
        linear-gradient(145deg,
            rgba(33, 26, 20, 0.86),
            rgba(49, 38, 28, 0.66) 58%,
            rgba(91, 63, 29, 0.42)) !important;
    -webkit-backdrop-filter: blur(20px) saturate(150%);
    backdrop-filter: blur(20px) saturate(150%);
    border-color: rgba(255, 236, 205, 0.12) !important;
}

@media (max-width: 768px) {
    html[data-theme="dark"] .navbar .nav-links {
        background:
            radial-gradient(circle at 10% -30%, rgba(255, 236, 205, 0.32), rgba(255, 236, 205, 0) 36%),
            radial-gradient(circle at 90% 8%, rgba(224, 184, 115, 0.30), rgba(224, 184, 115, 0) 34%),
            linear-gradient(135deg,
                rgba(40, 32, 24, 0.94) 0%,
                rgba(60, 46, 30, 0.88) 58%,
                rgba(111, 74, 27, 0.78) 100%) !important;
        -webkit-backdrop-filter: blur(24px) saturate(165%) brightness(1.08);
        backdrop-filter: blur(24px) saturate(165%) brightness(1.08);
        border-right: 1px solid rgba(255, 233, 199, 0.14) !important;
        box-shadow:
            20px 0 44px rgba(0, 0, 0, 0.48),
            inset 1px 0 0 rgba(255, 255, 255, 0.12),
            inset -1px 0 0 rgba(224, 184, 115, 0.08) !important;
    }
}

html[data-theme="dark"] .footer,
html[data-theme="dark"] footer.footer,
html[data-theme="dark"] .footer.bg-white {
    background: #1b1510 !important;
}

html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .checkout-total-right,
html[data-theme="dark"] .address-card-panel,
html[data-theme="dark"] #profile-container .contact-section,
html[data-theme="dark"] #profile-container .address-section {
    background: #221b15 !important;
    color: #ece5db !important;
}

html[data-theme="dark"] .text-black,
html[data-theme="dark"] .text-gray-900,
html[data-theme="dark"] .text-gray-800,
html[data-theme="dark"] .text-\[\#2d2926\],
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4 {
    color: #f0e9df !important;
}
html[data-theme="dark"] .text-gray-500,
html[data-theme="dark"] .text-gray-400,
html[data-theme="dark"] .text-gray-600,
html[data-theme="dark"] .grey-small {
    color: #b3a797 !important;
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .input-field {
    background: #2a2119 !important;
    color: #ece5db !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #8f8475 !important; }

html[data-theme="dark"] .border,
html[data-theme="dark"] .border-t,
html[data-theme="dark"] .border-b { border-color: rgba(255, 255, 255, 0.12) !important; }

html[data-theme="dark"] .address-card,
html[data-theme="dark"] .checkout-address-option {
    background: #2a2119 !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
}
html[data-theme="dark"] .address-card__name,
html[data-theme="dark"] .ca-name { color: #f0e9df !important; }
html[data-theme="dark"] .address-card__line,
html[data-theme="dark"] .address-card__phone,
html[data-theme="dark"] .ca-line { color: #c7bbac !important; }
html[data-theme="dark"] .addr-icon-btn { background: #322820 !important; color: #e7c896 !important; }
html[data-theme="dark"] .checkout-address-option:has(input:checked) { background: #2f261d !important; }

html[data-theme="dark"] .catalog-page {
    --catalog-bg: linear-gradient(180deg, #15110d 0%, #1b1510 60%, #15110d 100%);
    --catalog-card: #221b15;
    --catalog-border: rgba(255, 255, 255, 0.12);
    --catalog-text: #ece5db;
    --catalog-muted: #b3a797;
    --catalog-accent: #d2a565;
    --catalog-accent-soft: rgba(210, 165, 101, 0.16);
}
html[data-theme="dark"] .catalog-card { background: #221b15 !important; }
html[data-theme="dark"] .catalog-card__title a,
html[data-theme="dark"] .catalog-card__price { color: #f0e9df !important; }

html[data-theme="dark"] table { color: #ece5db !important; }
html[data-theme="dark"] .summary-items .font-medium { color: #f0e9df !important; }

html[data-theme="dark"] .ks-message { box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5); }

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(111, 78, 45, 0.25);
    background: transparent;
    color: #6f431b;
    cursor: pointer;
    transition: all 0.2s ease;
}
.theme-toggle:hover { background: rgba(155, 106, 51, 0.12); }
html[data-theme="dark"] .theme-toggle {
    color: #f0d49a;
    border-color: rgba(255, 255, 255, 0.18);
}
html[data-theme="dark"] .theme-toggle:hover { background: rgba(255, 255, 255, 0.08); }
