/* ═══════════════════════════════════════════════════════════════
   BILT — Purple / Lavender Palette  (data-palette="purple")
   All rules scoped to html[data-palette="purple"] so they only
   apply when this theme is active and don't bleed into other themes.
   ═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600&display=swap');

/* ── Dark mode (default brightness) ──────────────────────────── */
html[data-palette="purple"] {
    /* Core palette */
    --lav:            #8D7BAC;
    --lav2:           #7264a0;
    --peri:           #B8B8FE;
    --mint:           #AEE0DF;
    --surf:           #16131f;
    --surf2:          #1e1a2e;

    /* Remap core tokens to purple palette */
    --bg-void:        #0e0c14;
    --bg-panel:       #16131f;
    --bg-card:        #1e1a2e;
    --bg-card-hover:  #231f35;
    --border-dim:     rgba(141,123,172,.20);
    --border-mid:     rgba(141,123,172,.35);
    --border-active:  rgba(141,123,172,.70);
    --accent:         #8D7BAC;
    --accent-dim:     rgba(141,123,172,.10);
    --accent-glow:    rgba(141,123,172,.08);
    --text-primary:   rgba(255,255,255,.85);
    --text-secondary: rgba(255,255,255,.42);
    --text-muted:     rgba(255,255,255,.22);
    --grid-line:      rgba(141,123,172,.04);
    --scan-color:     rgba(141,123,172,.015);
    --danger:         #c85050;
    --success:        #22c55e;

    /* Border aliases */
    --border-lav:     rgba(141,123,172,.20);
    --border-lav2:    rgba(141,123,172,.35);

    /* Semantic alpha stops used throughout page CSS */
    --accent-a04:     rgba(141,123,172,.04);
    --accent-a06:     rgba(141,123,172,.06);
    --accent-a07:     rgba(141,123,172,.07);
    --accent-a08:     rgba(141,123,172,.08);
    --accent-a10:     rgba(141,123,172,.10);
    --accent-a12:     rgba(141,123,172,.12);
    --accent-a14:     rgba(141,123,172,.14);
    --accent-a15:     rgba(141,123,172,.15);
    --accent-a25:     rgba(141,123,172,.25);
    --accent-a28:     rgba(141,123,172,.28);
    --accent-a30:     rgba(141,123,172,.30);
    --accent-a35:     rgba(141,123,172,.35);
    --accent-a45:     rgba(141,123,172,.45);
    --accent-a50:     rgba(141,123,172,.50);

    /* Structural */
    --radius-xl:      24px;
    --radius-modal:   22px;
    --radius-panel:   18px;
    --radius-card:    14px;
    --radius-tile:    12px;
    --radius-input:   10px;
    --radius-sm:      8px;
    --radius-pill:    99px;

    /* Buttons */
    --btn-gradient:   linear-gradient(135deg, #8D7BAC, #B8B8FE);
    --btn-text:       #ffffff;

    /* Shadows */
    --shadow-xl:          0 32px 80px rgba(0,0,0,.50);
    --shadow-panel:       0 8px 32px rgba(0,0,0,.25);
    --shadow-card:        0 4px 16px rgba(0,0,0,.20);
    --shadow-card-sm:     0 2px 10px rgba(0,0,0,.20);
    --shadow-btn:         0 4px 18px rgba(141,123,172,.35);
    --shadow-btn-hover:   0 12px 40px rgba(141,123,172,.50);
    --shadow-btn-sm:      0 2px 10px rgba(141,123,172,.30);
    --shadow-btn-sm-hover:0 4px 18px rgba(141,123,172,.45);

    /* Font */
    --font-ui: 'Outfit', sans-serif;
}

/* ── Bright brightness modifier ───────────────────────────────── */
html[data-palette="purple"][data-theme="bright"] {
    --bg-void:        #13102a;
    --bg-panel:       #1a1730;
    --bg-card:        #232040;
    --bg-card-hover:  #2a2648;
    --surf:           #1a1730;
    --surf2:          #232040;
    --text-secondary: rgba(255,255,255,.55);
    --text-muted:     rgba(255,255,255,.30);
    --border-dim:     rgba(141,123,172,.25);
    --border-lav:     rgba(141,123,172,.25);
    --border-mid:     rgba(141,123,172,.42);
    --border-lav2:    rgba(141,123,172,.42);
}

/* ── Light brightness modifier ────────────────────────────────── */
html[data-palette="purple"][data-theme="light"] {
    --bg-void:        #f0eef8;
    --bg-panel:       #ffffff;
    --bg-card:        #f8f6ff;
    --bg-card-hover:  #f0ecff;
    --surf:           #ffffff;
    --surf2:          #f8f6ff;
    --border-dim:     rgba(141,123,172,.22);
    --border-lav:     rgba(141,123,172,.22);
    --border-mid:     rgba(141,123,172,.38);
    --border-lav2:    rgba(141,123,172,.38);
    --border-active:  rgba(141,123,172,.60);
    --accent:         #7264a0;
    --lav:            #7264a0;
    --lav2:           #5e5388;
    --accent-dim:     rgba(114,100,160,.10);
    --accent-glow:    rgba(114,100,160,.08);
    --accent-a04:     rgba(114,100,160,.04);
    --accent-a06:     rgba(114,100,160,.06);
    --accent-a07:     rgba(114,100,160,.07);
    --accent-a08:     rgba(114,100,160,.08);
    --accent-a10:     rgba(114,100,160,.10);
    --accent-a12:     rgba(114,100,160,.12);
    --accent-a14:     rgba(114,100,160,.14);
    --accent-a15:     rgba(114,100,160,.15);
    --accent-a25:     rgba(114,100,160,.25);
    --accent-a28:     rgba(114,100,160,.28);
    --accent-a30:     rgba(114,100,160,.30);
    --accent-a35:     rgba(114,100,160,.35);
    --accent-a45:     rgba(114,100,160,.45);
    --accent-a50:     rgba(114,100,160,.50);
    --text-primary:   rgba(20,15,40,.90);
    --text-secondary: rgba(20,15,40,.55);
    --text-muted:     rgba(20,15,40,.35);
    --grid-line:      rgba(114,100,160,.06);
    --btn-gradient:   linear-gradient(135deg, #7264a0, #9898d8);
    --shadow-btn:     0 4px 18px rgba(114,100,160,.35);
    --shadow-btn-hover:   0 12px 40px rgba(114,100,160,.45);
    --shadow-btn-sm:      0 2px 10px rgba(114,100,160,.28);
    --shadow-btn-sm-hover:0 4px 18px rgba(114,100,160,.40);
}

/* ── Font body override ───────────────────────────────────────── */
html[data-palette="purple"] body {
    font-family: var(--font-ui);
}

/* ── Ambient orb background (replaces theme.php grid lines) ───── */
html[data-palette="purple"] body::before {
    background:
        radial-gradient(ellipse 700px 500px at 85% -5%,  rgba(141,123,172,.13), transparent),
        radial-gradient(ellipse 500px 500px at -5% 105%, rgba(174,224,223,.08), transparent);
    background-size: auto;
    animation: biltOrbDrift 14s ease-in-out infinite;
}

/* Override theme.php's !important grid lines.
   Higher specificity (2 attributes vs 1) wins among !important declarations. */
html[data-palette="purple"][data-theme="bright"] body::before {
    background:
        radial-gradient(ellipse 700px 500px at 85% -5%,  rgba(141,123,172,.10), transparent),
        radial-gradient(ellipse 500px 500px at -5% 105%, rgba(174,224,223,.06), transparent) !important;
    background-size: auto !important;
}
html[data-palette="purple"][data-theme="light"] body::before {
    background:
        radial-gradient(ellipse 900px 600px at 85% -5%,  rgba(141,123,172,.05), transparent),
        radial-gradient(ellipse 600px 600px at -5% 110%, rgba(174,224,223,.03), transparent) !important;
    background-size: auto !important;
}

@keyframes biltOrbDrift {
    0%,100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(-18px) scale(1.02); }
}

/* Scanline override */
html[data-palette="purple"] body::after {
    background: linear-gradient(to bottom, transparent, rgba(141,123,172,.015), transparent);
    animation-duration: 9s;
}
html[data-palette="purple"][data-theme="bright"] body::after,
html[data-palette="purple"][data-theme="light"]  body::after {
    background: linear-gradient(to bottom, transparent, rgba(141,123,172,.010), transparent) !important;
    animation-duration: 9s !important;
}

/* ── Nav overrides ───────────────────────────────────────────── */
/* Font style overrides (nav.php uses italic for classic, we reset for purple) */
html[data-palette="purple"] .bilt-header-wordmark,
html[data-palette="purple"] .bilt-nav-head-title {
    font-style: normal;
    font-weight: 600;
}

/* Badge text is white on the purple accent (default theme uses black on yellow) */
html[data-palette="purple"] .bilt-nav-badge { color: #fff; }

/* Hover/active text override so white text stays readable on dark purple panel */
html[data-palette="purple"] .bilt-nav-item:hover { color: rgba(255,255,255,.85); }

/* Light mode nav adjustments */
html[data-palette="purple"][data-theme="light"] .bilt-nav-item { color: rgba(20,15,40,.60); }
html[data-palette="purple"][data-theme="light"] .bilt-ctrl-btn { color: rgba(20,15,40,.60); }
html[data-palette="purple"][data-theme="light"] .bilt-nav-item:hover { color: rgba(20,15,40,.90); }
html[data-palette="purple"][data-theme="light"] .bilt-ctrl-btn:hover { color: rgba(20,15,40,.90); }
html[data-palette="purple"][data-theme="light"] .bilt-nav-drawer { border-left-color: rgba(141,123,172,.18); }
html[data-palette="purple"][data-theme="light"] .bilt-header { background: rgba(248,246,255,0.94); }