/* ============================================================
   DilutionWatch — manage.html theme overlay · 2026-07-01
   Load LAST: styles.css → pulse.css → responsive.css →
              dashboard.css → manage-theme.css
   Purpose: align the app with the site-wide refined system
   WITHOUT touching dashboard.css structure or manage.js hooks.
   Dark tokens only — light theme keeps its own overrides.
   Rule: nothing pill-shaped. Tags/badges 4px, buttons 8px,
   cards 10-12px. Circles allowed only for dots/spinners/thumbs.
   Revert = delete this file's <link> in manage.html.
   ============================================================ */

:root {
    /* backgrounds — flatten the purple-navy to the site's blue-black */
    --bg-body: #0a0e16;
    --bg-nav: #0a0e16;
    --nav-bg: rgba(10, 14, 22, 0.88);
    --bg-surface: #0e131d;
    --bg-surface-alt: #131926;
    --bg-surface-gradient: #0e131d;
    --bg-elevated: #131926;
    --bg-input: #0b0f18;
    --section-bg: rgba(11, 15, 24, 0.5);
    --card-bg: #0e131d;
    --metric-bg: rgba(0, 0, 0, 0.22);
    --input-bg: rgba(0, 0, 0, 0.3);
    --input-border: rgba(151, 163, 182, 0.16);

    /* text */
    --text-primary: #e9eef6;
    --text-secondary: #b3bdcc;
    --text-muted: #7d899c;

    /* borders — hairlines, not slate slabs */
    --border: rgba(151, 163, 182, 0.2);
    --border-subtle: rgba(151, 163, 182, 0.11);
    --border-accent: rgba(122, 167, 240, 0.3);

    /* accent — glow killed */
    --accent: #3b82f6;
    --accent-hover: #2f6fe0;
    --accent-light: #7aa7f0;
    --accent-glow: rgba(59, 130, 246, 0.18);
    --accent-subtle: rgba(59, 130, 246, 0.1);
    --accent-bg: rgba(59, 130, 246, 0.07);

    /* status — desaturated a notch from neon */
    --color-red: #e2606c;
    --color-green: #34b98a;
    --color-orange: #e08745;
    --color-yellow: #d9a03f;
    --color-purple: #8b5cf6;

    /* shadows — depth without glow */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.45);
    --shadow-accent: 0 0 0 1px rgba(122, 167, 240, 0.16);

    /* body backdrop — one quiet radial, grid almost gone */
    --body-radial-1: radial-gradient(ellipse 80% 50% at 50% -5%, rgba(23, 37, 64, 0.5) 0%, transparent 60%);
    --body-radial-2: none;
    --body-radial-3: none;
    --grid-line: rgba(122, 167, 240, 0.012);

    /* styles.css compat tokens */
    --bg-dark: #0a0e16;
    --bg-card: #0e131d;
    --border-light: rgba(151, 163, 182, 0.22);

    /* risk tints — same hues on the blue-black base */
    --risk-tint-red: #1d1418;
    --risk-tint-orange: #1d1814;
    --risk-tint-yellow: #1d1a12;
    --risk-tint-green: #121d18;
    --risk-tint-blue: #12182a;
    --risk-tint-purple: #191430;

    --scrollbar-track: #0b0f18;
    --scrollbar-thumb: #2a3446;
    --divider: linear-gradient(90deg, transparent, rgba(151,163,182,0.2), transparent);
}

/* typography — match the rest of the site */
body {
    font-family: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* ── DE-PILL SWEEP ─────────────────────────────────────────── */
/* severity filter chips: flat rectangular tags */
.severity-pill {
    border-radius: 6px;
    padding: 8px 14px;
}
/* named pill/badge offenders */
.onboarding-pill { border-radius: 6px !important; }
.sub-tier-badge { border-radius: 4px !important; font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 600; letter-spacing: 0.08em; }
.slider-value { border-radius: 6px !important; font-family: 'JetBrains Mono', ui-monospace, monospace; }
/* toggle switches: rounded-rect, still reads as a switch */
.switch-slider { border-radius: 7px !important; }
.switch-slider:before { border-radius: 5px !important; }
/* any straggler pills that slipped through (belt and suspenders);
   excludes circles (50%), which are dots/spinners/slider thumbs */
[class*="badge"], [class*="tag"], [class*="chip"] { border-radius: 4px; }
.risk-badge, .score-badge, .tier-badge, .category-badge, .filing-badge, .status-badge { border-radius: 4px !important; }

/* mono for data — scores, metrics, tickers */
.score-badge, .metric-value, .ticker-symbol, .stat-value,
.dilution-score, .score-value, .pulse-score, .tl-card-sym {
    font-family: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}

/* cards: flat surface + hairline instead of gradient + glow */
.ticker-card, .dashboard-section, .preference-group, .modal-content,
.login-card, .onboarding-card {
    background: var(--card-bg);
    box-shadow: var(--shadow-sm);
}
.ticker-card:hover {
    box-shadow: var(--shadow-md);
}

/* pulse feed: tone the hardcoded navy gradients to flat surfaces */
.pulse-item, .pulse-card {
    background: var(--bg-surface) !important;
    border-color: var(--border-subtle) !important;
}

/* buttons: kill glow hovers app-wide (transitions/layout untouched) */
button:hover, .btn:hover, a.btn:hover {
    box-shadow: none;
}
.btn-primary, button[type="submit"] {
    border-radius: 8px;
}

/* light theme: only neutralize the de-pill (colors stay as-is) */
html[data-theme="light"] .severity-pill { border-radius: 6px; }
html[data-theme="light"] .sub-tier-badge,
html[data-theme="light"] .onboarding-pill { border-radius: 4px !important; }

/* forecast tab — Dilution Storm Radar de-pill (styles.css .radar-signal-pill is 12px) */
.radar-signal-pill { border-radius: 4px !important; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 0.68em !important; letter-spacing: 0.04em; }
.forecast-prob-badge { border-radius: 6px !important; font-family: 'JetBrains Mono', ui-monospace, monospace; }
/* generic pill-class catch-all (dots stay circular) */
[class*="pill"]:not(.pill-dot):not([class*="dot"]) { border-radius: 6px; }