/**
 * Dark Mode Theme Tokens & Global Overrides
 * Source of Truth: html[data-theme="dark"]
 */

[data-theme="dark"] {
    /* ---- Theme Tokens (Dark) ---- */
    --bg: #0B0F14;
    --surface: #101826;
    --surface-2: #0E1622;
    --text: #C9D3E6;
    --heading: #EAF0FF;
    --text-muted: #8B97AE;
    --border: #223044;
    --divider: rgba(255, 255, 255, 0.05);
    --link: #7AB0FF;

    --cta-bg: #2F7BFF;
    --cta-text: #FFFFFF;
    --cta-border: #2F7BFF;

    --header-bg: rgba(11, 15, 20, 0.85);
    --header-bg-sticky: #101826;
    --header-text: #EAF0FF;
    --header-border: #223044;

    /* Sidebar / Submenu */
    --submenu-bg: #101826;
    --submenu-text: #EAF0FF;
    --submenu-border: #223044;
    --submenu-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);

    /* Legacy Map */
    --bg-page: var(--bg);
    --bg-card: var(--surface);
    --text-primary: var(--heading);
    --text-secondary: var(--text);
    --white: #101826;
    --black: #EAF0FF;
}

/* 1. Global Core Overrides */
[data-theme="dark"] html,
[data-theme="dark"] body,
[data-theme="dark"] .main-wrapper,
[data-theme="dark"] .site-content {
    background-color: var(--bg) !important;
    color: var(--text) !important;
}

/* 2. Global Section & Container Overrides */
[data-theme="dark"] section,
[data-theme="dark"] .container,
[data-theme="dark"] .wrapper {
    background-color: transparent;
}

/* Force dark on common light classes */
[data-theme="dark"] .bg-white,
[data-theme="dark"] .white-bg,
[data-theme="dark"] .light,
[data-theme="dark"] .section-light,
[data-theme="dark"] .section--light,
[data-theme="dark"] .surface-white,
[data-theme="dark"] [style*="background-color: #fff"],
[data-theme="dark"] [style*="background-color: white"],
[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background: white"] {
    background-color: var(--bg) !important;
    background-image: none !important;
}

/* Cards & Panels */
[data-theme="dark"] .card,
[data-theme="dark"] .panel,
[data-theme="dark"] .box,
[data-theme="dark"] .content-card,
[data-theme="dark"] .testimonial-card,
[data-theme="dark"] .process-card,
[data-theme="dark"] .cs-card {
    background-color: var(--surface) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}

/* 3. Global Heading & Text Reset */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] .title,
[data-theme="dark"] .heading,
[data-theme="dark"] .section-title,
[data-theme="dark"] .hero-title,
[data-theme="dark"] .page-title,
[data-theme="dark"] .block-title,
[data-theme="dark"] .section-title-large {
    color: var(--heading) !important;
    opacity: 1 !important;
}

[data-theme="dark"] p,
[data-theme="dark"] label,
[data-theme="dark"] span:not(.dm-slider),
[data-theme="dark"] li,
[data-theme="dark"] .text-muted,
[data-theme="dark"] .desc,
[data-theme="dark"] .description {
    color: var(--text);
    opacity: 1 !important;
}

/* 4. Header & Navigation Fixes */
[data-theme="dark"] .header {
    background: transparent;
}

[data-theme="dark"] .header.is-sticky {
    background-color: var(--header-bg-sticky) !important;
    border-bottom: 1px solid var(--header-border) !important;
}

[data-theme="dark"] .nav {
    background-color: var(--header-bg) !important;
    border-color: var(--header-border) !important;
}

[data-theme="dark"] .logo,
[data-theme="dark"] .nav-link,
[data-theme="dark"] .gp-nav li a {
    color: var(--header-text) !important;
}

/* Submenu Fixes */
[data-theme="dark"] .sub-menu,
[data-theme="dark"] .dropdown-menu,
[data-theme="dark"] .gp-nav .sub-menu {
    background-color: var(--submenu-bg) !important;
    border: 1px solid var(--submenu-border) !important;
    box-shadow: var(--submenu-shadow) !important;
}

[data-theme="dark"] .sub-menu li a {
    color: var(--submenu-text) !important;
}

[data-theme="dark"] .sub-menu li a:hover {
    background-color: rgba(255, 255, 255, 0.05);
    color: var(--link) !important;
}

/* 5. Search & Filter Components */
[data-theme="dark"] .category-archive__search-input,
[data-theme="dark"] .search-form input,
[data-theme="dark"] .wp-block-search__input,
[data-theme="dark"] input[type="search"] {
    background-color: var(--surface-2) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    padding: 12px 20px 12px 48px !important;
    border-radius: 100px !important;
    transition: var(--transition) !important;
}

[data-theme="dark"] .category-archive__search-input::placeholder,
[data-theme="dark"] .search-form input::placeholder {
    color: var(--text-muted) !important;
}

[data-theme="dark"] .category-archive__search-icon,
[data-theme="dark"] .search-form .search-icon {
    color: var(--text-muted) !important;
}

[data-theme="dark"] .category-archive__search-input:focus,
[data-theme="dark"] .search-form input:focus {
    border-color: var(--link) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2) !important;
}

[data-theme="dark"] .category-archive__sort-btn,
[data-theme="dark"] .gpv2-filter-btn {
    background-color: var(--surface) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    padding: 8px 16px !important;
    border-radius: 999px !important;
    transition: var(--transition) !important;
}

/* Interactive States: Hover / Active / Focus / Selected */
/* --------------------------------------------------- */

/* Nav & Menu */
[data-theme="dark"] .nav-link:hover,
[data-theme="dark"] .gp-nav li a:hover {
    color: var(--link) !important;
    background-color: rgba(255, 255, 255, 0.05) !important;
}

[data-theme="dark"] .nav-link.is-active,
[data-theme="dark"] .gp-nav li.current-menu-item>a,
[data-theme="dark"] .gp-nav li.current-page-ancestor>a {
    color: var(--link) !important;
    font-weight: 600 !important;
}

/* Sticky Header specific */
[data-theme="dark"] .header.is-sticky .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
}

/* Buttons */
[data-theme="dark"] .btn-primary:hover,
[data-theme="dark"] .gp-nav-cta:hover,
[data-theme="dark"] .ps-hero-btn:hover {
    background-color: var(--link) !important;
    border-color: var(--link) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 25px rgba(37, 99, 235, 0.3) !important;
}

[data-theme="dark"] .btn-secondary:hover {
    background-color: var(--heading) !important;
    color: var(--bg) !important;
}

/* Category & Filter States */
[data-theme="dark"] .category-archive__sort-btn:hover,
[data-theme="dark"] .gpv2-filter-btn:hover,
[data-theme="dark"] .gpv2-pill:hover {
    border-color: var(--link) !important;
    color: var(--link) !important;
}

[data-theme="dark"] .category-archive__sort-btn.is-active,
[data-theme="dark"] .gpv2-filter-btn.active,
[data-theme="dark"] .gpv2-pill.active,
[data-theme="dark"] .pagination .current {
    background-color: var(--link) !important;
    border-color: var(--link) !important;
    color: #fff !important;
}

/* Cards & Portfolio Items */
[data-theme="dark"] .category-archive__card:hover,
[data-theme="dark"] .wf-category-card:hover,
[data-theme="dark"] .cs-card:hover {
    border-color: var(--link) !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4) !important;
    transform: translateY(-4px);
}

/* Form Elements Focus */
[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
    border-color: var(--link) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15) !important;
}

/* 6. Component Bars & UI Elements (Already covered in general, but specific overrides) */

/* 7. Forms & Inputs */
[data-theme="dark"] input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]),
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    background-color: var(--surface-2) !important;
    border: 1px solid var(--border) !important;
    color: var(--heading) !important;
    border-radius: 12px;
    padding: 16px;
    font-size: 15px;
    transition: all 0.3s ease !important;
}

[data-theme="dark"] label {
    color: var(--text) !important;
    font-weight: 500 !important;
    opacity: 1 !important;
}

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

[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
    border-color: var(--link) !important;
    background-color: var(--surface) !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15) !important;
    outline: none !important;
}

/* Checkboxes & Radios */
[data-theme="dark"] input[type="checkbox"],
[data-theme="dark"] input[type="radio"] {
    accent-color: var(--link);
    background-color: var(--surface-2) !important;
    border: 1px solid var(--border) !important;
}

/* Form Submit Buttons */
[data-theme="dark"] .btn-submit,
[data-theme="dark"] button[type="submit"],
[data-theme="dark"] .premium-form .btn-submit,
[data-theme="dark"] .booking-form .btn-submit,
[data-theme="dark"] .btn-primary {
    background-color: var(--cta-bg) !important;
    color: var(--cta-text) !important;
    border: 1px solid var(--cta-border) !important;
    border-radius: 12px;
    padding: 18px 32px;
    font-weight: 600 !important;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
}

[data-theme="dark"] .btn-submit:hover,
[data-theme="dark"] button[type="submit"]:hover,
[data-theme="dark"] .btn-primary:hover {
    background-color: var(--link) !important;
    border-color: var(--link) !important;
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4) !important;
}

/* Form Wrappers (Contact & Product Photography) */
[data-theme="dark"] .contact-form-container,
[data-theme="dark"] .booking-form {
    background-color: var(--surface) !important;
    border-color: var(--border) !important;
}

/* 8. Footer Fixes */
[data-theme="dark"] .main-footer {
    background-color: var(--bg) !important;
    border-top: 1px solid var(--border) !important;
}

[data-theme="dark"] .footer-bottom {
    border-top: 1px solid var(--divider) !important;
}

/* Dark Mode Toggle UI Refinement */
.dark-mode-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
}

.dm-switch {
    width: 36px;
    height: 18px;
}

.dm-slider:before {
    height: 12px;
    width: 12px;
}