/* ═══════════════════════════════════════════════════════════════
   LiveTracker Pro — global-theme.css
   Single source of truth for all CSS custom properties.
   Loaded first on both frontend and admin so every component
   inherits a consistent token set.  Brand colors are overridden
   at runtime by Branding::rootStyle() (inline <style id="brand-vars">).
   ═══════════════════════════════════════════════════════════════ */

/* ── Light mode (default) ───────────────────────────────────── */
:root {
    /* ── Brand palette (overridden by Branding::rootStyle()) ── */
    --primary:       #1E3A8A;
    --primary-light: #2563EB;
    --primary-dark:  #1e3370;
    --accent:        #22C55E;
    --accent-dark:   #16a34a;
    --wa-green:      #25D366;
    --wa-dark:       #128C7E;
    --danger:        #dc2626;
    --danger-bg:     #fef2f2;
    --warning:       #f59e0b;
    --info:          #3b82f6;

    /* ── Surfaces ─────────────────────────────────────────── */
    --bg:            #F8FAFC;
    --bg-card:       #ffffff;
    --bg-secondary:  #f1f5f9;

    /* ── Typography ───────────────────────────────────────── */
    --text:          #0f172a;
    --text-muted:    #64748b;

    /* ── Borders ──────────────────────────────────────────── */
    --border:        #e2e8f0;

    /* ── Elevation ────────────────────────────────────────── */
    --shadow-sm:  0 1px 3px rgba(0,0,0,.08);
    --shadow:     0 4px 16px rgba(0,0,0,.10);
    --shadow-md:  0 4px 16px rgba(0,0,0,.10);
    --shadow-lg:  0 10px 40px rgba(0,0,0,.14);

    /* ── Shape ────────────────────────────────────────────── */
    --radius-xs: 6px;
    --radius-sm: 8px;
    --radius:    12px;
    --radius-lg: 20px;

    /* ── Typography ───────────────────────────────────────── */
    --font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont,
            'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
            sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
    --font-mono: 'Fira Code', ui-monospace, SFMono-Regular, Menlo,
                 Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;

    /* ── Layout ───────────────────────────────────────────── */
    --header-h:  64px;
    --sidebar-w: 260px;
    --topbar-h:  60px;
    --transition: all .2s ease;

    /* ── z-index scale ────────────────────────────────────── */
    --z-header:   1050;
    --z-dropdown: 1055;
    --z-wa-float: 1060;
    --z-modal:    1070;
    --z-toast:    1080;
}

/* ── Dark mode ──────────────────────────────────────────────── */
[data-bs-theme="dark"] {
    --bg:           #0a0f1e;
    --bg-card:      #111827;
    --bg-secondary: #1f2937;
    --text:         #f1f5f9;
    --text-muted:   #94a3b8;
    --border:       #1f2937;
    --danger-bg:    #1f0a0a;
    --shadow-sm:    0 1px 3px rgba(0,0,0,.25);
    --shadow:       0 4px 16px rgba(0,0,0,.40);
    --shadow-md:    0 4px 16px rgba(0,0,0,.40);
    --shadow-lg:    0 10px 40px rgba(0,0,0,.50);
}

/* ── Verified / trust labels (dark mode contrast fix) ───────── */
[data-bs-theme="dark"] .verified-text,
[data-bs-theme="dark"] .result-verified,
[data-bs-theme="dark"] .badge-verified {
    color: #4ADE80 !important;
}

/* ── Global focus ring (accessibility) ─────────────────────── */
:focus-visible {
    outline: 2px solid var(--primary-light);
    outline-offset: 2px;
}

/* ── Selection color ────────────────────────────────────────── */
::selection {
    background: rgba(37, 99, 235, .18);
    color: var(--text);
}
