/* ==========================================================================
   W.T.A. MAPPING - THEME SYSTEM (Dark / Light Mode)
   High-contrast, hazard & precision engineering theme architecture
   Colors matched to the official W-Apex Crimson & Titanium brand identity
   ========================================================================== */

/* Smooth transitions when switching themes */
body, header, nav, section, footer, div, a, button, input, select, textarea {
    transition: background-color 0.25s ease, border-color 0.25s ease, color 0.15s ease, box-shadow 0.25s ease;
}

/* Global Selection styling */
::selection {
    background-color: #FF3B30 !important;
    color: #FFFFFF !important;
}

/* Glow & Accent Utilities */
.glow-red, .glow-amber {
    box-shadow: 0 0 35px -5px rgba(255, 59, 48, 0.45) !important;
}

/* --------------------------------------------------------------------------
   LIGHT MODE OVERRIDES ([data-theme="light"])
   -------------------------------------------------------------------------- */
[data-theme="light"] {
    color-scheme: light;
}

[data-theme="light"] body {
    background-color: #F8FAFC !important;
    color: #1E293B !important;
}

/* Background Tokens */
[data-theme="light"] .bg-brand-dark {
    background-color: #FFFFFF !important;
}

[data-theme="light"] .bg-brand-navy {
    background-color: #F1F5F9 !important;
}

[data-theme="light"] .bg-brand-card {
    background-color: #FFFFFF !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.06), 0 1px 2px -1px rgba(0, 0, 0, 0.04) !important;
}

/* Translucent & Glass Backgrounds */
[data-theme="light"] header.bg-brand-dark\/95,
[data-theme="light"] .bg-brand-dark\/95 {
    background-color: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05) !important;
}

[data-theme="light"] #mobileMenu,
[data-theme="light"] .bg-brand-navy\/98 {
    background-color: rgba(255, 255, 255, 0.98) !important;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .bg-brand-dark\/80 {
    background-color: #FFFFFF !important;
}

[data-theme="light"] .bg-brand-navy\/60,
[data-theme="light"] .bg-brand-navy\/40 {
    background-color: #F8FAFC !important;
}

[data-theme="light"] .bg-brand-navy\/80 {
    background-color: #F1F5F9 !important;
}

[data-theme="light"] .bg-slate-900,
[data-theme="light"] .bg-slate-950 {
    background-color: #F1F5F9 !important;
}

/* Border Tokens */
[data-theme="light"] .border-brand-border,
[data-theme="light"] .border-brand-border\/70,
[data-theme="light"] .border-brand-border\/60,
[data-theme="light"] .border-brand-border\/40 {
    border-color: #E2E8F0 !important;
}

[data-theme="light"] .divide-brand-border > :not([hidden]) ~ :not([hidden]) {
    border-color: #E2E8F0 !important;
}

/* Typography Overrides */
[data-theme="light"] h1.text-white,
[data-theme="light"] h2.text-white,
[data-theme="light"] h3.text-white,
[data-theme="light"] h4.text-white,
[data-theme="light"] h5.text-white,
[data-theme="light"] .text-white:not(.btn-keep-white):not(.badge-keep-white):not([class*="bg-blue"]):not([class*="bg-emerald"]):not([class*="bg-amber"]):not([class*="bg-red"]):not([class*="bg-brand-amber"]) {
    color: #0F172A !important;
}

[data-theme="light"] .text-slate-200,
[data-theme="light"] .text-slate-300 {
    color: #334155 !important;
}

[data-theme="light"] .text-slate-400 {
    color: #64748B !important;
}

[data-theme="light"] .text-brand-steel {
    color: #64748B !important;
}

/* Brand Crimson Accent for light backgrounds */
[data-theme="light"] .text-brand-amber,
[data-theme="light"] .text-brand-red {
    color: #DC2626 !important;
}

/* Navigation Link Hover in Light Mode */
[data-theme="light"] nav a.text-slate-300:hover {
    color: #DC2626 !important;
}

/* Section Gradients in Light Mode */
[data-theme="light"] .pointer-events-none.bg-gradient-to-b {
    background: linear-gradient(to bottom, rgba(248, 250, 252, 0.3), rgba(248, 250, 252, 0.85), #F8FAFC) !important;
}

[data-theme="light"] .bg-gradient-to-b.from-brand-dark,
[data-theme="light"] .bg-gradient-to-b.from-brand-dark.via-brand-navy\/60.to-brand-dark {
    background-image: linear-gradient(to bottom, #FFFFFF, #F1F5F9, #FFFFFF) !important;
}

[data-theme="light"] .bg-gradient-to-r.from-brand-navy.via-brand-card.to-brand-navy {
    background-image: linear-gradient(to right, #F8FAFC, #FFFFFF, #F8FAFC) !important;
}

[data-theme="light"] .bg-gradient-to-br.from-brand-navy {
    background-image: linear-gradient(to bottom right, #FFFFFF, #F1F5F9) !important;
}

/* Technical Radar Grid */
[data-theme="light"] .radar-grid {
    background-image: 
        linear-gradient(to right, rgba(0, 0, 0, 0.05) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(0, 0, 0, 0.05) 1px, transparent 1px) !important;
}

/* Form Inputs, Selects, Sliders */
[data-theme="light"] input:not([type="range"]),
[data-theme="light"] select,
[data-theme="light"] textarea {
    background-color: #FFFFFF !important;
    border-color: #CBD5E1 !important;
    color: #0F172A !important;
}

[data-theme="light"] input:not([type="range"])::placeholder,
[data-theme="light"] textarea::placeholder {
    color: #94A3B8 !important;
}

/* Range sliders */
[data-theme="light"] input[type="range"] {
    background-color: #CBD5E1 !important;
}

/* Tables */
[data-theme="light"] table {
    background-color: #FFFFFF !important;
}

[data-theme="light"] thead tr {
    background-color: #F8FAFC !important;
}

[data-theme="light"] thead th {
    color: #475569 !important;
}

[data-theme="light"] tbody tr {
    background-color: #FFFFFF !important;
}

[data-theme="light"] tbody tr:hover {
    background-color: #F8FAFC !important;
}

/* Footer in Light Mode */
[data-theme="light"] footer.bg-brand-dark {
    background-color: #F1F5F9 !important;
    border-color: #CBD5E1 !important;
}

[data-theme="light"] footer .font-bold.text-white {
    color: #0F172A !important;
}

/* Crimson Action Buttons stay crisp & white text */
[data-theme="light"] .bg-brand-amber,
[data-theme="light"] .bg-brand-red {
    background-color: #DC2626 !important;
    color: #FFFFFF !important;
}

[data-theme="light"] .bg-brand-amber:hover,
[data-theme="light"] .bg-brand-red:hover {
    background-color: #B91C1C !important;
}

/* Cards & Badges in Light Mode */
[data-theme="light"] .bg-brand-card.border-brand-border {
    border-color: #E2E8F0 !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Special High-Risk Boxes */
[data-theme="light"] .bg-red-950\/30 {
    background-color: #FEF2F2 !important;
    border-color: #FECACA !important;
}

[data-theme="light"] .bg-blue-950\/20 {
    background-color: #EFF6FF !important;
    border-color: #BFDBFE !important;
}

[data-theme="light"] .bg-emerald-950\/30 {
    background-color: #ECFDF5 !important;
    border-color: #A7F3D0 !important;
}

/* Code / Monospace snippet boxes */
[data-theme="light"] pre,
[data-theme="light"] code.block {
    background-color: #F8FAFC !important;
    color: #0F172A !important;
    border-color: #E2E8F0 !important;
}

/* Theme Toggle Button Styling */
.theme-toggle-btn {
    cursor: pointer;
    user-select: none;
    position: relative;
}

/* Toggle icon display */
[data-theme="light"] .theme-icon-sun {
    display: none !important;
}
[data-theme="light"] .theme-icon-moon {
    display: inline-block !important;
}

:not([data-theme="light"]) .theme-icon-sun {
    display: inline-block !important;
}
:not([data-theme="light"]) .theme-icon-moon {
    display: none !important;
}