/* ============================================================
   ABISOL THEME — shared palette tokens + palette switcher
   Loaded by every page. Default palette: Signal Navy.
   Visitors can switch palette from the corner button; the choice
   is saved (localStorage "abisol-theme") and follows them across
   pages. The palette is set on <html data-palette="…"> by theme.js.

   Pages map their own variables onto these --abi-* tokens, so a
   palette change re-colours every page. Status colours (pass /
   partial / fail, error red) are deliberately NOT tokens: they
   carry meaning and stay the same in every palette.
   ============================================================ */

/* Signal Navy (default) */
:root,
:root[data-palette="signal-navy"] {
    --abi-navy: #101B36;
    --abi-navy-deep: #0A1226;
    --abi-navy-soft: #1A2850;
    --abi-primary: #2452D9;
    --abi-primary-dark: #1B3FAE;
    --abi-primary-light: #6C8EED;
    --abi-primary-tint: #E8EDFB;
    --abi-on-primary: #FFFFFF;
    --abi-accent: #1F8A70;
    --abi-accent-dark: #166B56;
    --abi-accent-light: #5CC8A6;
    --abi-accent-tint: #E3F2EE;
    --abi-accent-ink: #14574A;
    --abi-paper: #F7F5F0;
    --abi-surface: #FFFFFF;
    --abi-ink: #14171C;
    --abi-text: #3A404A;
    --abi-muted: #5B6472;
    --abi-line: #E4E1D8;
    --abi-line-strong: #D3CEC0;
}

/* Slate Ops — cooler steel-blue / verdigris */
:root[data-palette="slate-ops"] {
    --abi-navy: #1B2430;
    --abi-navy-deep: #121820;
    --abi-navy-soft: #263243;
    --abi-primary: #3E6E96;
    --abi-primary-dark: #2C5170;
    --abi-primary-light: #7CA3C2;
    --abi-primary-tint: #E5EDF3;
    --abi-on-primary: #FFFFFF;
    --abi-accent: #4A9B8E;
    --abi-accent-dark: #367569;
    --abi-accent-light: #8CC9BE;
    --abi-accent-tint: #E3F1EE;
    --abi-accent-ink: #2B5E55;
    --abi-paper: #F4F6F5;
    --abi-surface: #FFFFFF;
    --abi-ink: #10151C;
    --abi-text: #3A424C;
    --abi-muted: #5B6570;
    --abi-line: #DCE3E2;
    --abi-line-strong: #C7D0CE;
}

/* Ink & Brass — navy + brass, executive-consulting feel */
:root[data-palette="ink-brass"] {
    --abi-navy: #1B2A41;
    --abi-navy-deep: #111B2B;
    --abi-navy-soft: #263955;
    --abi-primary: #6B5423;
    --abi-primary-dark: #4C3B18;
    --abi-primary-light: #C2A46B;
    --abi-primary-tint: #F1EBDD;
    --abi-on-primary: #FFFFFF;
    --abi-accent: #2F6F5E;
    --abi-accent-dark: #24564A;
    --abi-accent-light: #7FBFAA;
    --abi-accent-tint: #E2EFEB;
    --abi-accent-ink: #22504A;
    --abi-paper: #F6F4EF;
    --abi-surface: #FFFFFF;
    --abi-ink: #14171C;
    --abi-text: #3D3A33;
    --abi-muted: #5F5A4E;
    --abi-line: #E8E3D6;
    --abi-line-strong: #D8CFB8;
}

/* Pitch Green — the sector pages' original navy / green / gold */
:root[data-palette="pitch-green"] {
    --abi-navy: #0F2547;
    --abi-navy-deep: #0B1D3A;
    --abi-navy-soft: #153259;
    --abi-primary: #4CB891;
    --abi-primary-dark: #2F8F6E;
    --abi-primary-light: #8FE0C0;
    --abi-primary-tint: #E4F4ED;
    --abi-on-primary: #06251B;
    --abi-accent: #D9AC4B;
    --abi-accent-dark: #8A6A1C;
    --abi-accent-light: #F2CE7B;
    --abi-accent-tint: #FAF0CD;
    --abi-accent-ink: #8A6A1C;
    --abi-paper: #F1F3F8;
    --abi-surface: #FFFFFF;
    --abi-ink: #0F2547;
    --abi-text: #2C3A52;
    --abi-muted: #5D6C86;
    --abi-line: #E2E7F0;
    --abi-line-strong: #C8D0DE;
}

:root {
    --abi-font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ============================================================
   PALETTE SWITCHER UI (markup injected by theme.js)
   ============================================================ */
.theme-switcher {
    font-family: var(--abi-font);
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 9998;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.theme-switcher-toggle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 2px solid var(--abi-line);
    background: var(--abi-surface);
    box-shadow: 0 20px 25px -5px rgba(0,0,0,.1), 0 8px 10px -6px rgba(0,0,0,.04);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s cubic-bezier(.4,0,.2,1);
    color: var(--abi-ink);
}

.theme-switcher-toggle:hover {
    transform: scale(1.1);
    border-color: var(--abi-primary);
    box-shadow: 0 0 20px color-mix(in srgb, var(--abi-primary) 30%, transparent);
}

.theme-switcher-toggle svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
}

.theme-panel {
    display: none;
    background: var(--abi-surface);
    border: 1px solid var(--abi-line);
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 20px 25px -5px rgba(0,0,0,.1), 0 8px 10px -6px rgba(0,0,0,.04);
    min-width: 200px;
}

.theme-panel.is-open {
    display: block;
    animation: fadeInUp 0.25s ease-out;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.theme-panel-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: var(--abi-muted);
    margin-bottom: 12px;
}

.theme-options {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.theme-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    cursor: pointer;
    border: 2px solid transparent;
    background: none;
    width: 100%;
    text-align: left;
    font-family: inherit;
    transition: all .3s cubic-bezier(.4,0,.2,1);
}

.theme-option:hover {
    background: var(--abi-paper);
}

.theme-option.active {
    border-color: var(--abi-primary);
    background: var(--abi-paper);
}

.theme-swatch {
    display: flex;
    gap: 3px;
    flex-shrink: 0;
}

.theme-swatch span {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid rgba(0,0,0,0.1);
}

.theme-option-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--abi-ink);
}

@media (max-width: 768px) {
    .theme-switcher {
        bottom: 72px;
        right: 16px;
    }

    .theme-switcher-toggle {
        width: 42px;
        height: 42px;
    }

@media print {
    .theme-switcher { display: none !important; }
}
