/* =============================================================================
   portal_empleado - tokens del diseño bento (prefijo --emp-).
   Paleta celeste/azul respetando el look actual del portal.
   Dark se activa con [data-theme="dark"] en <html>.
   ============================================================================= */
:root {
    --emp-accent: #1565C0;
    --emp-accent-ink: #FFFFFF;
    --emp-ok: #2E7D32;
    --emp-warn: #E65100;
    --emp-bad: #C62828;
    --emp-info: #42A5F5;

    --emp-radius: 16px;
    --emp-radius-sm: 12px;
    --emp-radius-xs: 8px;

    --emp-font-display: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --emp-font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

    /* Light (default) — celeste pastel, mismo look que el portal actual */
    --emp-bg: #EBF4FC;
    --emp-bg-raised: #E3F2FD;
    --emp-card: #FFFFFF;
    --emp-card-2: #F5FAFE;
    --emp-border: #BBDEFB;
    --emp-border-strong: #90CAF9;
    --emp-ink: #0D2137;
    --emp-ink-mid: #5C7A99;
    --emp-ink-dim: #8EAEC7;
    --emp-ink-faint: #C8DCEF;
    --emp-hair: rgba(21, 101, 192, 0.08);
    --emp-grid-dot: rgba(21, 101, 192, 0.04);
    --emp-glow: 0 10px 30px rgba(21, 101, 192, 0.18);
    --emp-chip-bg: rgba(21, 101, 192, 0.06);
    --emp-chip-border: rgba(21, 101, 192, 0.12);
}

:root[data-theme="dark"] {
    --emp-bg: #0D1B2A;
    --emp-bg-raised: #112236;
    --emp-card: #132238;
    --emp-card-2: #17294A;
    --emp-border: #1E3A5F;
    --emp-border-strong: #2A4D78;
    --emp-ink: #D4E4F7;
    --emp-ink-mid: #8EAEC7;
    --emp-ink-dim: #5C7A99;
    --emp-ink-faint: #2A4461;
    --emp-hair: rgba(255, 255, 255, 0.06);
    --emp-grid-dot: rgba(255, 255, 255, 0.04);
    --emp-glow: 0 0 40px rgba(66, 165, 245, 0.15);
    --emp-chip-bg: rgba(255, 255, 255, 0.04);
    --emp-chip-border: rgba(255, 255, 255, 0.08);
}