/* ═══════════════════════════════════════════════════════════════
   AMC · HABARI — Theme System
   Semantic tokens for Light (Cloud) and Dark (Night) modes.
   ═══════════════════════════════════════════════════════════════ */

:root {
    /* ── Light Mode (Cloud Slate) ──────────────────────────────── */
    --bg-base: #f6f8fa;
    --bg-surface: #ebf0f4;
    --bg-elevated: #ffffff;

    --text-primary: #1f2328;
    --text-secondary: #656d76;
    --text-faint: #818b98;

    --border-subtle: rgba(31, 35, 40, 0.12);
    --border-strong: rgba(31, 35, 40, 0.2);

    --shadow-base: 0 4px 12px rgba(27, 31, 35, 0.08);
    --shadow-heavy: 0 8px 24px rgba(27, 31, 35, 0.12);

    /* Semantic preservation */
    --accent-glow: rgba(2, 132, 199, 0.15);

    /* Interaction Backgrounds */
    --bg-surface-hover: rgba(31, 35, 40, 0.05);
    --bg-surface-active: rgba(31, 35, 40, 0.08);

    /* Badge Text Colors */
    --badge-amc-bg: #dbeafe;
    --badge-amc-text: #1e40af;
    --badge-amc-border: #bfdbfe;

    --badge-habari-bg: #ccfbf1;
    --badge-habari-text: #115e59;
    --badge-habari-border: #99f6e4;

    --badge-global-bg: #ede9fe;
    --badge-global-text: #5b21b6;
    --badge-global-border: #ddd6fe;
}

[data-theme="dark"] {
    /* ── Dark Mode (Night Slate) ───────────────────────────────── */
    --bg-base: #0d1117;
    --bg-surface: #161b22;
    --bg-elevated: #21262d;

    --text-primary: #f0f6fc;
    --text-secondary: #8b949e;
    --text-faint: #6e7681;

    --border-subtle: rgba(240, 246, 252, 0.1);
    --border-strong: rgba(240, 246, 252, 0.15);

    --shadow-base: 0 4px 12px rgba(0, 0, 0, 0.3);
    --shadow-heavy: 0 8px 24px rgba(0, 0, 0, 0.5);

    /* Semantic preservation */
    --accent-glow: rgba(56, 189, 248, 0.15);

    /* Interaction Backgrounds */
    --bg-surface-hover: rgba(240, 246, 252, 0.05);
    --bg-surface-active: rgba(240, 246, 252, 0.1);

    /* Badge Text Colors */
    --badge-amc-bg: rgba(37, 99, 235, 0.15);
    --badge-amc-text: #93c5fd;
    --badge-amc-border: rgba(37, 99, 235, 0.3);

    --badge-habari-bg: rgba(20, 184, 166, 0.15);
    --badge-habari-text: #5eead4;
    --badge-habari-border: rgba(20, 184, 166, 0.3);

    --badge-global-bg: rgba(139, 92, 246, 0.15);
    --badge-global-text: #c4b5fd;
    --badge-global-border: rgba(139, 92, 246, 0.3);
}

/* ── Typography Override (Sample Density) ─────────────────── */
:root {
    --w-bold: 700;
    --w-extra: 800;
    --w-semi: 600;
    --w-med: 500;
}