/* Dark mode — surgical overrides for thenewmarket */

html[data-theme="dark"] {
    --bg: #0b0b0d;
    --surface: rgba(28, 28, 32, 0.78);
    --surface-solid: #1c1c20;
    --text: #f5f5f7;
    --muted: #8b8b96;
    --border: rgba(255, 255, 255, 0.10);
    --shadow: 0 12px 48px rgba(0, 0, 0, 0.45);
    --primary: #0a84ff;
    --primary-dark: #0066cc;
    --secondary: #7d7aff;
    --success: #30d158;
    --danger: #ff453a;
    --warning: #ff9f0a;
}

html[data-theme="dark"] ::selection {
    background: rgba(10, 132, 255, 0.35);
    color: #fff;
}

html[data-theme="dark"] ::placeholder {
    color: var(--muted);
    opacity: 0.7;
}

html[data-theme="dark"] .glass,
html[data-theme="dark"] .glass-card,
html[data-theme="dark"] .navbar,
html[data-theme="dark"] .mobile-menu,
html[data-theme="dark"] .cart-drawer-panel,
html[data-theme="dark"] .footer:last-of-type {
    background: linear-gradient(135deg, rgba(35, 35, 40, 0.94), rgba(20, 20, 25, 0.88));
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}

html[data-theme="dark"] .glass-card:hover {
    background: linear-gradient(135deg, rgba(40, 40, 45, 0.98), rgba(25, 25, 30, 0.92));
}

html[data-theme="dark"] .navbar {
    border-bottom-color: var(--border);
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] input:not(.form-control),
html[data-theme="dark"] textarea:not(.form-control),
html[data-theme="dark"] select:not(.form-control) {
    background: #1c1c20;
    color: var(--text);
    border-color: var(--border);
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] input:not(.form-control):focus,
html[data-theme="dark"] textarea:not(.form-control):focus,
html[data-theme="dark"] select:not(.form-control):focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(10, 132, 255, 0.25);
}

html[data-theme="dark"] .mobile-menu .container a,
html[data-theme="dark"] .mobile-menu .container button {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--border);
    color: var(--text);
}

html[data-theme="dark"] .mobile-menu a:hover,
html[data-theme="dark"] .mobile-menu button:hover {
    background: var(--surface-solid);
    color: var(--primary);
}

html[data-theme="dark"] .toast-danger {
    background: rgba(248, 113, 113, 0.85);
    color: #fff;
}

html[data-theme="dark"] .toast-success {
    background: rgba(74, 222, 128, 0.85);
    color: #fff;
}

html[data-theme="dark"] .alert-danger {
    background: rgba(239, 68, 68, 0.12);
    color: #fca5a5;
    border-color: rgba(239, 68, 68, 0.25);
}

html[data-theme="dark"] .alert-success {
    background: rgba(34, 197, 94, 0.12);
    color: #86efac;
    border-color: rgba(34, 197, 94, 0.25);
}

html[data-theme="dark"] .hero-slider {
    background: var(--bg);
}

html[data-theme="dark"] .hero-slide {
    background: linear-gradient(120deg, #16161a 0%, #0b0b0d 100%);
}

@media (max-width: 1024px) {
    html[data-theme="dark"] .hero-slide {
        background: linear-gradient(120deg, #1c1c20 0%, #0f0f12 100%);
    }
}

html[data-theme="dark"] .product-card .img-preview,
html[data-theme="dark"] .just-added-card .img-preview,
html[data-theme="dark"] .cart-drawer-item img {
    background: #1c1c20;
}

html[data-theme="dark"] .img-preview,
html[data-theme="dark"] .img-placeholder {
    background: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .newsletter {
    background: linear-gradient(135deg, #13131a 0%, #0d0d12 100%);
}

html[data-theme="dark"] .just-added-section {
    background: linear-gradient(120deg, #111118 0%, #0a0a0f 100%);
}

html[data-theme="dark"] .category-card::before {
    background: linear-gradient(135deg, rgba(10, 132, 255, 0.10), rgba(125, 122, 255, 0.08));
}

html[data-theme="dark"] .category-card:hover::before {
    background: linear-gradient(135deg, rgba(10, 132, 255, 0.14), rgba(125, 122, 255, 0.10));
}

html[data-theme="dark"] .cart-float-count {
    border-color: var(--bg);
}

html[data-theme="dark"] .cart-drawer-panel {
    border-left-color: var(--border);
}

html[data-theme="dark"] .cart-drawer-empty {
    color: var(--muted);
}

html[data-theme="dark"] .stars::before {
    background: linear-gradient(90deg, #f59e0b calc(var(--rating) / 5 * 100%), #4b4b52 calc(var(--rating) / 5 * 100%));
    -webkit-background-clip: text;
    background-clip: text;
}

html[data-theme="dark"] .badge-featured {
    color: #3f2e00;
}

html[data-theme="dark"] .hero-arrow:hover,
html[data-theme="dark"] .carousel-nav:hover {
    background: var(--surface-solid);
}

html[data-theme="dark"] table,
html[data-theme="dark"] th,
html[data-theme="dark"] td {
    border-color: var(--border);
    color: var(--text);
}

html[data-theme="dark"] hr {
    border-color: var(--border);
}

html[data-theme="dark"] .footer {
    color: var(--muted);
}

html[data-theme="dark"] .footer-links a {
    color: var(--text);
}

html[data-theme="dark"] .footer-links a:hover {
    color: var(--primary);
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    padding: 0;
    border-radius: 50%;
    font-size: 1.1rem;
    line-height: 1;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--text);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.theme-toggle:hover {
    background: var(--surface);
    border-color: var(--primary);
    color: var(--primary);
}

.theme-toggle .theme-icon {
    pointer-events: none;
}

/* Respect OS preference if no localStorage choice has been made yet */
@media (prefers-color-scheme: dark) {
    html:not([data-theme]) {
        --bg: #0b0b0d;
        --surface: rgba(28, 28, 32, 0.78);
        --surface-solid: #1c1c20;
        --text: #f5f5f7;
        --muted: #8b8b96;
        --border: rgba(255, 255, 255, 0.10);
        --shadow: 0 12px 48px rgba(0, 0, 0, 0.45);
        --primary: #0a84ff;
        --primary-dark: #0066cc;
        --secondary: #7d7aff;
        --success: #30d158;
        --danger: #ff453a;
        --warning: #ff9f0a;
    }
}

html[data-theme="dark"] .product-stock-success {
    background: rgba(74, 222, 128, 0.12);
    color: #86efac;
}

html[data-theme="dark"] .product-stock-warning {
    background: rgba(251, 191, 36, 0.12);
    color: #facc15;
}

html[data-theme="dark"] .product-stock-danger {
    background: rgba(248, 113, 113, 0.12);
    color: #fca5a5;
}



html[data-theme="dark"] .mobile-bottom-nav {
    background: linear-gradient(135deg, rgba(25, 25, 30, 0.98), rgba(15, 15, 20, 0.96));
    border-top-color: rgba(255, 255, 255, 0.10);
}

html[data-theme="dark"] .mobile-bottom-nav a,
html[data-theme="dark"] .mobile-bottom-nav button {
    color: var(--muted);
}

html[data-theme="dark"] .mobile-bottom-nav a[aria-current="page"],
html[data-theme="dark"] .mobile-bottom-nav a:hover,
html[data-theme="dark"] .mobile-bottom-nav a.active,
html[data-theme="dark"] .mobile-bottom-nav button:hover,
html[data-theme="dark"] .mobile-bottom-nav button.active {
    color: var(--primary);
}

html[data-theme="dark"] .mobile-bottom-nav .cart-count {
    border-color: var(--bg);
}

html[data-theme="dark"] .cart-drawer-panel {
    background: linear-gradient(180deg, rgba(35, 35, 40, 0.98), rgba(20, 20, 25, 0.96));
    border-top-color: rgba(255, 255, 255, 0.10);
}

html[data-theme="dark"] .cart-drawer-close {
    color: var(--muted);
}

html[data-theme="dark"] .cart-drawer-item {
    border-bottom-color: var(--border);
}

html[data-theme="dark"] .cart-drawer-backdrop {
    background: rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .navbar {
    background: linear-gradient(135deg, rgba(30, 30, 35, 0.98), rgba(20, 20, 25, 0.96));
}

html[data-theme="dark"] .menu-toggle {
    background: var(--surface);
    border-color: var(--border);
}

html[data-theme="dark"] .menu-toggle span {
    background: var(--text);
}

html[data-theme="dark"] .mobile-menu {
    background: var(--surface-solid);
}

html[data-theme="dark"] .mobile-menu a,
html[data-theme="dark"] .mobile-menu button {
    background: rgba(255, 255, 255, 0.06);
    color: var(--text);
}

html[data-theme="dark"] .mobile-menu a:hover,
html[data-theme="dark"] .mobile-menu button:hover {
    background: rgba(255, 255, 255, 0.10);
    color: var(--primary);
}

html[data-theme="dark"] .mobile-menu .btn-primary,
html[data-theme="dark"] .mobile-menu .btn-primary:hover {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

html[data-theme="dark"] .mobile-menu .btn-outline,
html[data-theme="dark"] .mobile-menu .btn-outline:hover {
    background: transparent;
    color: var(--primary);
    border-color: var(--primary);
}
