/* ==========================================================
   THEME: meta
   Professional dark theme modeled on Meta Business Suite's
   design language and Meta's own dark-mode palette: near-black
   canvas, raised dark cards with subtle shadows, Meta blue
   accent, pill-shaped nav with soft-blue active state, and
   quiet, high-contrast typography.
   Surface/text values from Meta's actual dark-mode tokens
   (#18191A canvas, #242526 cards, #E4E6EB text). Accent stays
   Meta blue (#0866FF) to match the light variant's branding.
   ========================================================== */
:root {
    /* --- Core surfaces (Meta's own dark-mode values) --- */
    --theme-bg: #18191a;               /* page canvas */
    --theme-surface: #242526;          /* card/panel background */
    --theme-surface-raised: #3a3b3c;   /* hover fills, dropdowns */
    --theme-border: #3e4042;           /* card/divider borders */
    --theme-sidebar-bg: #242526;       /* sidebar background */

    /* --- Text --- */
    --theme-text: #e4e6eb;             /* primary text */
    --theme-text-muted: #b0b3b8;       /* secondary text */
    --theme-text-faint: #8a8d91;       /* faintest text / table headers */

    /* --- Brand / primary accent (Meta blue, unchanged from light) --- */
    --theme-primary: #0866ff;
    --theme-primary-hover: #2e7cff;    /* lighter on hover - reads better on dark */
    --theme-primary-soft: rgba(8, 102, 255, 0.20); /* active nav pill, focus rings */

    /* --- Stat card icon badge colors (soft-tint bg + bright fg for dark) --- */
    --theme-badge-green-bg: rgba(28, 127, 63, 0.22);
    --theme-badge-green-fg: #4bd07a;
    --theme-badge-purple-bg: rgba(111, 66, 193, 0.22);
    --theme-badge-purple-fg: #a98af5;
    --theme-badge-amber-bg: rgba(178, 94, 9, 0.22);
    --theme-badge-amber-fg: #f7b955;
    --theme-badge-blue-bg: rgba(8, 102, 255, 0.20);
    --theme-badge-blue-fg: #5b9bff;

    /* --- Status colors (soft-tint bg + strong fg, dark-mode) --- */
    --theme-success-bg: rgba(28, 127, 63, 0.22);
    --theme-success-fg: #4bd07a;
    --theme-warning-bg: rgba(178, 94, 9, 0.22);
    --theme-warning-fg: #f7b955;
    --theme-danger-bg: rgba(197, 48, 48, 0.22);
    --theme-danger-fg: #f47171;

    /* --- Shape (Meta uses generous 8-12px rounding) --- */
    --theme-radius-sm: 8px;
    --theme-radius-md: 10px;
    --theme-radius-lg: 12px;
    --theme-radius-pill: 999px;

    /* --- Elevation (deeper shadows read correctly on a dark canvas) --- */
    --theme-card-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    --theme-card-shadow-hover: 0 2px 10px rgba(0, 0, 0, 0.45);

    /* --- Sidebar --- */
    --theme-sidebar-width: 264px;
}
