/* ═══════════════════════════════════════════════════════════
   GOURA ENTERPRISE SUITE — 6 THEMES
   Source of truth for design tokens.
   Each [data-theme] block defines the same set of tokens.
   Legacy --g-* aliases map to canonical tokens so existing
   components keep working without changes.
   ═══════════════════════════════════════════════════════════ */

/* ───────── DEFAULT (sin data-theme) → goura-light ───────── */
:root {
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-pill: 999px;
    --font-sans: 'DM Sans', 'Segoe UI Variable Text', system-ui, sans-serif;
    --font-display: 'Domine', 'Georgia', 'Playfair Display', serif;

    /* Shared semantic helpers resolved from the active theme tokens below. */
    --inverse-text: rgba(255, 255, 255, 0.92);
    --inverse-text-strong: rgba(255, 255, 255, 0.95);
    --inverse-text-muted: rgba(255, 255, 255, 0.7);
    --inverse-text-soft: rgba(255, 255, 255, 0.55);
    --inverse-text-faint: rgba(255, 255, 255, 0.35);

    --inverse-surface-soft: rgba(255, 255, 255, 0.04);
    --inverse-surface: rgba(255, 255, 255, 0.06);
    --inverse-surface-strong: rgba(255, 255, 255, 0.08);
    --inverse-surface-active: rgba(255, 255, 255, 0.12);
    --inverse-border-soft: rgba(255, 255, 255, 0.08);
    --inverse-border: rgba(255, 255, 255, 0.1);
    --inverse-border-strong: rgba(255, 255, 255, 0.2);
    --inverse-shadow: rgba(0, 0, 0, 0.25);
    --inverse-shadow-strong: rgba(0, 0, 0, 0.4);

    --surface-highlight: rgba(255, 255, 255, 0.04);
    --surface-highlight-strong: rgba(255, 255, 255, 0.08);
    --overlay-scrim: color-mix(in srgb, var(--sidebar) 55%, transparent);

    --field-bg: var(--surface);
    --field-bg-muted: var(--surface-sunken);
    --field-bg-contrast: color-mix(in srgb, var(--surface) 88%, var(--sidebar));
    --field-border: var(--border);
    --field-focus-border: var(--accent);
    --field-focus-ring: var(--g-focus-ring);
    --scroll-thumb: color-mix(in srgb, var(--border-strong) 74%, var(--text-muted));

    --g-info-border: color-mix(in srgb, var(--g-info) 28%, var(--surface));
    --g-ok-border: color-mix(in srgb, var(--g-ok) 28%, var(--surface));
    --g-warn-border: color-mix(in srgb, var(--g-warn) 28%, var(--surface));
    --g-err-border: color-mix(in srgb, var(--g-err) 28%, var(--surface));
    --danger-hover: color-mix(in srgb, var(--danger) 84%, var(--text));

    --status-dot-neutral: color-mix(in srgb, var(--border-strong) 78%, var(--surface));
    --status-dot-ok: color-mix(in srgb, var(--g-ok) 72%, var(--surface));
    --status-dot-muted: color-mix(in srgb, var(--text-muted) 58%, var(--surface));
    --status-dot-danger: color-mix(in srgb, var(--g-err) 68%, var(--surface));
    --status-dot-empty: color-mix(in srgb, var(--border) 84%, var(--surface));

    --warning-lock-border: var(--g-warn-border);
    --warning-lock-bg: color-mix(in srgb, var(--g-warn-bg) 88%, var(--surface));
    --warning-lock-fill: color-mix(in srgb, var(--g-warn-bg) 72%, var(--surface));
    --warning-lock-text: color-mix(in srgb, var(--g-warn) 76%, var(--text));

    --hero-start: color-mix(in srgb, var(--sidebar) 86%, black);
    --hero-mid: color-mix(in srgb, var(--sidebar) 64%, var(--bg));
    --hero-end: color-mix(in srgb, var(--surface-sunken) 76%, black);
    --hero-orb-accent: color-mix(in srgb, var(--accent) 34%, transparent);
    --hero-orb-danger: color-mix(in srgb, var(--danger) 18%, transparent);
    --hero-orb-info: color-mix(in srgb, var(--g-info) 14%, transparent);

    --glass-bg: rgba(255, 255, 255, 0.06);
    --glass-border: rgba(255, 255, 255, 0.1);
    --glass-highlight: rgba(255, 255, 255, 0.05);
    --glass-shadow: rgba(0, 0, 0, 0.25);

    --brand-muted: color-mix(in srgb, var(--sidebar-text) 45%, transparent);
    --brand-soft: color-mix(in srgb, var(--sidebar-text) 60%, transparent);
    --brand-faint: color-mix(in srgb, var(--sidebar-text) 20%, transparent);
    --brand-line: color-mix(in srgb, var(--sidebar-text) 10%, transparent);

    /* Filtro para el icono nativo del calendar picker (webkit). Default: none.
       Cada theme dark lo sobreescribe con invert para que el icono se vea claro. */
    --date-picker-icon-filter: none;
}

/* ═══════════════════════════════════════════════════════════
   CLAROS
   ═══════════════════════════════════════════════════════════ */

/* ─── GOURA-LIGHT — default diurno ───
   Off-white + sidebar azul tinta + acento carmín */
[data-theme="goura-light"] {
    color-scheme: light;

    --bg: #FAFAF8;
    --bg-raised: #FFFFFF;
    --surface: #FFFFFF;
    --surface-sunken: #F1F1ED;

    --sidebar: #0F1A36;
    --sidebar-text: #FAFAF8;
    --sidebar-muted: rgba(250, 250, 248, 0.6);
    --topbar: #FFFFFF;

    --border: #E5E5E0;
    --border-strong: #CDCDC6;

    --text: #0F1A36;
    --text-muted: #4A5468;
    --text-faint: #8A92A5;

    --accent: #C8342A;
    --accent-hover: #A82820;
    --accent-contrast: #FFFFFF;
    --accent-soft: rgba(200, 52, 42, 0.1);

    --success: #1F7A3C;
    --warning: #B35A00;
    --danger: #C8342A;

    --shadow: 0 1px 3px rgba(15, 26, 54, 0.08);
    --shadow-lg: 0 8px 24px rgba(15, 26, 54, 0.12);

    /* Legacy --g-* aliases */
    --g-nav: var(--sidebar);
    --g-create: var(--accent);
    --g-accent: var(--accent);
    --g-consult: #1F2B4A;
    --g-risk: var(--danger);
    --g-surface: var(--surface);
    --g-surface-sec: var(--surface-sunken);
    --g-surface-sub: var(--bg);
    --g-border-strong: var(--border-strong);
    --g-border: var(--border);
    --g-text: var(--text);
    --g-text-sec: var(--text-muted);
    --g-text-muted: var(--text-faint);
    --g-danger-bg: rgba(200, 52, 42, 0.1);
    --g-danger-fg: var(--danger);
    --g-ok: var(--success);
    --g-ok-bg: rgba(31, 122, 60, 0.12);
    --g-warn: var(--warning);
    --g-warn-bg: rgba(179, 90, 0, 0.12);
    --g-err: var(--danger);
    --g-err-bg: rgba(200, 52, 42, 0.1);
    --g-info: #2A5A8A;
    --g-info-bg: rgba(42, 90, 138, 0.1);
    --g-selected-bg: rgba(200, 52, 42, 0.08);
    --g-focus-ring: rgba(200, 52, 42, 0.18);
    /* app.css bridge */
    --bg-elevated: var(--surface);
    --bg-elevated-strong: var(--surface-sunken);
    --accent-strong: var(--accent);
}

/* ─── PAPER — crema cálida ───
   Menos contraste, jornadas largas */
[data-theme="paper"] {
    color-scheme: light;

    --bg: #F4EFE6;
    --bg-raised: #FAF6EC;
    --surface: #FAF6EC;
    --surface-sunken: #EDE7DA;

    --sidebar: #2A2118;
    --sidebar-text: #F4EFE6;
    --sidebar-muted: rgba(244, 239, 230, 0.62);
    --topbar: #FAF6EC;

    --border: #DFD5C4;
    --border-strong: #C6B99F;

    --text: #2A2118;
    --text-muted: #6B5F4E;
    --text-faint: #9C907F;

    --accent: #B33028;
    --accent-hover: #931F18;
    --accent-contrast: #FAF6EC;
    --accent-soft: rgba(179, 48, 40, 0.1);

    --success: #5A6B1F;
    --warning: #8F5A14;
    --danger: #B33028;

    --shadow: 0 1px 3px rgba(42, 33, 24, 0.1);
    --shadow-lg: 0 8px 24px rgba(42, 33, 24, 0.16);

    --g-nav: var(--sidebar);
    --g-create: var(--accent);
    --g-accent: var(--accent);
    --g-consult: #3A2A1D;
    --g-risk: var(--danger);
    --g-surface: var(--surface);
    --g-surface-sec: var(--surface-sunken);
    --g-surface-sub: var(--bg);
    --g-border-strong: var(--border-strong);
    --g-border: var(--border);
    --g-text: var(--text);
    --g-text-sec: var(--text-muted);
    --g-text-muted: var(--text-faint);
    --g-danger-bg: rgba(179, 48, 40, 0.1);
    --g-danger-fg: var(--danger);
    --g-ok: var(--success);
    --g-ok-bg: rgba(90, 107, 31, 0.14);
    --g-warn: var(--warning);
    --g-warn-bg: rgba(143, 90, 20, 0.12);
    --g-err: var(--danger);
    --g-err-bg: rgba(179, 48, 40, 0.1);
    --g-info: #6B5F4E;
    --g-info-bg: rgba(107, 95, 78, 0.12);
    --g-selected-bg: rgba(179, 48, 40, 0.08);
    --g-focus-ring: rgba(179, 48, 40, 0.2);
    --bg-elevated: var(--surface);
    --bg-elevated-strong: var(--surface-sunken);
    --accent-strong: var(--accent);
}

/* ─── CLOUD — gris-azul corporativo ───
   Look financiero, acento monocromo azul */
[data-theme="cloud"] {
    color-scheme: light;

    --bg: #EEF1F6;
    --bg-raised: #FFFFFF;
    --surface: #FFFFFF;
    --surface-sunken: #E2E6EE;

    --sidebar: #0F1A36;
    --sidebar-text: #EEF1F6;
    --sidebar-muted: rgba(238, 241, 246, 0.58);
    --topbar: #FFFFFF;

    --border: #D4D9E3;
    --border-strong: #B8C0CE;

    --text: #0F1A36;
    --text-muted: #445068;
    --text-faint: #7A8498;

    --accent: #0F1A36;
    --accent-hover: #1F2B52;
    --accent-contrast: #FFFFFF;
    --accent-soft: rgba(15, 26, 54, 0.08);

    --success: #1F6B4A;
    --warning: #8A5A00;
    --danger: #B8322A;

    --shadow: 0 1px 3px rgba(15, 26, 54, 0.08);
    --shadow-lg: 0 8px 24px rgba(15, 26, 54, 0.14);

    --g-nav: var(--sidebar);
    --g-create: var(--accent);
    --g-accent: var(--accent);
    --g-consult: #1F2B52;
    --g-risk: var(--danger);
    --g-surface: var(--surface);
    --g-surface-sec: var(--surface-sunken);
    --g-surface-sub: var(--bg);
    --g-border-strong: var(--border-strong);
    --g-border: var(--border);
    --g-text: var(--text);
    --g-text-sec: var(--text-muted);
    --g-text-muted: var(--text-faint);
    --g-danger-bg: rgba(184, 50, 42, 0.1);
    --g-danger-fg: var(--danger);
    --g-ok: var(--success);
    --g-ok-bg: rgba(31, 107, 74, 0.12);
    --g-warn: var(--warning);
    --g-warn-bg: rgba(138, 90, 0, 0.12);
    --g-err: var(--danger);
    --g-err-bg: rgba(184, 50, 42, 0.1);
    --g-info: #2A5A8A;
    --g-info-bg: rgba(42, 90, 138, 0.1);
    --g-selected-bg: rgba(15, 26, 54, 0.07);
    --g-focus-ring: rgba(15, 26, 54, 0.2);
    --bg-elevated: var(--surface);
    --bg-elevated-strong: var(--surface-sunken);
    --accent-strong: var(--accent);
}

/* ═══════════════════════════════════════════════════════════
   OSCUROS
   ═══════════════════════════════════════════════════════════ */

/* ─── GOURA-DARK — default nocturno ───
   Azul tinta + carmín subido para contraste AA */
[data-theme="goura-dark"] {
    color-scheme: dark;

    --bg: #0F1A36;
    --bg-raised: #18254A;
    --surface: #18254A;
    --surface-sunken: #0B1428;

    --sidebar: #0A1228;
    --sidebar-text: #FAFAF8;
    --sidebar-muted: rgba(250, 250, 248, 0.55);
    --topbar: #0A1228;

    --border: #283553;
    --border-strong: #3B4A6F;

    --text: #FAFAF8;
    --text-muted: #A9B2C5;
    --text-faint: #6B7696;

    --accent: #E85A4F;
    --accent-hover: #F47266;
    --accent-contrast: #FFFFFF;
    --accent-soft: rgba(232, 90, 79, 0.18);

    --success: #5ED4B5;
    --warning: #F0C060;
    --danger: #E85A4F;

    --shadow: 0 1px 3px rgba(0, 0, 0, 0.32);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.48);

    --g-nav: var(--sidebar);
    --g-create: var(--accent);
    --g-accent: var(--accent);
    --g-consult: #14203E;
    --g-risk: var(--danger);
    --g-surface: var(--surface);
    --g-surface-sec: #1F2C52;
    --g-surface-sub: #152043;
    --g-border-strong: var(--border-strong);
    --g-border: var(--border);
    --g-text: var(--text);
    --g-text-sec: var(--text-muted);
    --g-text-muted: var(--text-faint);
    --g-danger-bg: rgba(232, 90, 79, 0.16);
    --g-danger-fg: var(--danger);
    --g-ok: var(--success);
    --g-ok-bg: rgba(94, 212, 181, 0.16);
    --g-warn: var(--warning);
    --g-warn-bg: rgba(240, 192, 96, 0.16);
    --g-err: var(--danger);
    --g-err-bg: rgba(232, 90, 79, 0.16);
    --g-info: #6DB8FF;
    --g-info-bg: rgba(109, 184, 255, 0.14);
    --g-selected-bg: rgba(232, 90, 79, 0.16);
    --g-focus-ring: rgba(232, 90, 79, 0.28);
    --bg-elevated: var(--surface);
    --bg-elevated-strong: var(--surface-sunken);
    --accent-strong: var(--accent);
    --date-picker-icon-filter: invert(0.92) hue-rotate(180deg) brightness(1.15);
}

/* ─── MIDNIGHT — casi negro, OLED ───
   Óptimo para poca luz */
[data-theme="midnight"] {
    color-scheme: dark;

    --bg: #0A0F1F;
    --bg-raised: #131A2E;
    --surface: #131A2E;
    --surface-sunken: #060A15;

    --sidebar: #050810;
    --sidebar-text: #F0F4FB;
    --sidebar-muted: rgba(240, 244, 251, 0.52);
    --topbar: #050810;

    --border: #1E2540;
    --border-strong: #323B58;

    --text: #F0F4FB;
    --text-muted: #A0A8BE;
    --text-faint: #666D85;

    --accent: #E85A4F;
    --accent-hover: #F47266;
    --accent-contrast: #FFFFFF;
    --accent-soft: rgba(232, 90, 79, 0.2);

    --success: #5ED4B5;
    --warning: #F0C060;
    --danger: #E85A4F;

    --shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.65);

    --g-nav: var(--sidebar);
    --g-create: var(--accent);
    --g-accent: var(--accent);
    --g-consult: #0F1628;
    --g-risk: var(--danger);
    --g-surface: var(--surface);
    --g-surface-sec: #1A2138;
    --g-surface-sub: #10162A;
    --g-border-strong: var(--border-strong);
    --g-border: var(--border);
    --g-text: var(--text);
    --g-text-sec: var(--text-muted);
    --g-text-muted: var(--text-faint);
    --g-danger-bg: rgba(232, 90, 79, 0.18);
    --g-danger-fg: var(--danger);
    --g-ok: var(--success);
    --g-ok-bg: rgba(94, 212, 181, 0.18);
    --g-warn: var(--warning);
    --g-warn-bg: rgba(240, 192, 96, 0.18);
    --g-err: var(--danger);
    --g-err-bg: rgba(232, 90, 79, 0.18);
    --g-info: #6DB8FF;
    --g-info-bg: rgba(109, 184, 255, 0.16);
    --g-selected-bg: rgba(232, 90, 79, 0.18);
    --g-focus-ring: rgba(232, 90, 79, 0.3);
    --bg-elevated: var(--surface);
    --bg-elevated-strong: var(--surface-sunken);
    --accent-strong: var(--accent);
    --date-picker-icon-filter: invert(0.94) hue-rotate(180deg) brightness(1.2);
}

/* ─── SLATE — carbón neutro, sin azul ───
   Acento ámbar para fatiga visual */
[data-theme="slate"] {
    color-scheme: dark;

    --bg: #1A1D24;
    --bg-raised: #24282F;
    --surface: #24282F;
    --surface-sunken: #121418;

    --sidebar: #0F1114;
    --sidebar-text: #EFEFEC;
    --sidebar-muted: rgba(239, 239, 236, 0.55);
    --topbar: #0F1114;

    --border: #2F3239;
    --border-strong: #454A54;

    --text: #EFEFEC;
    --text-muted: #A8ACB2;
    --text-faint: #70737A;

    --accent: #E8A547;
    --accent-hover: #F3B558;
    --accent-contrast: #1A1D24;
    --accent-soft: rgba(232, 165, 71, 0.18);

    --success: #5ED4B5;
    --warning: #E8A547;
    --danger: #E85A4F;

    --shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.55);

    --g-nav: var(--sidebar);
    --g-create: var(--accent);
    --g-accent: var(--accent);
    --g-consult: #2A2E36;
    --g-risk: var(--danger);
    --g-surface: var(--surface);
    --g-surface-sec: #2A2E36;
    --g-surface-sub: #1D2026;
    --g-border-strong: var(--border-strong);
    --g-border: var(--border);
    --g-text: var(--text);
    --g-text-sec: var(--text-muted);
    --g-text-muted: var(--text-faint);
    --g-danger-bg: rgba(232, 90, 79, 0.16);
    --g-danger-fg: var(--danger);
    --g-ok: var(--success);
    --g-ok-bg: rgba(94, 212, 181, 0.16);
    --g-warn: var(--warning);
    --g-warn-bg: rgba(232, 165, 71, 0.16);
    --g-err: var(--danger);
    --g-err-bg: rgba(232, 90, 79, 0.16);
    --g-info: #8BB4D8;
    --g-info-bg: rgba(139, 180, 216, 0.14);
    --g-selected-bg: rgba(232, 165, 71, 0.16);
    --g-focus-ring: rgba(232, 165, 71, 0.28);
    --bg-elevated: var(--surface);
    --bg-elevated-strong: var(--surface-sunken);
    --accent-strong: var(--accent);
    --date-picker-icon-filter: invert(0.92) hue-rotate(180deg) brightness(1.15);
}

/* ═══════════════════════════════════════════════════════════
   DEFAULT FALLBACK — si no hay data-theme, usa goura-light
   ═══════════════════════════════════════════════════════════ */
html:not([data-theme]) {
    color-scheme: light;
    --bg: #FAFAF8;
    --bg-raised: #FFFFFF;
    --surface: #FFFFFF;
    --surface-sunken: #F1F1ED;
    --sidebar: #0F1A36;
    --sidebar-text: #FAFAF8;
    --sidebar-muted: rgba(250, 250, 248, 0.6);
    --topbar: #FFFFFF;
    --border: #E5E5E0;
    --border-strong: #CDCDC6;
    --text: #0F1A36;
    --text-muted: #4A5468;
    --text-faint: #8A92A5;
    --accent: #C8342A;
    --accent-hover: #A82820;
    --accent-contrast: #FFFFFF;
    --accent-soft: rgba(200, 52, 42, 0.1);
    --success: #1F7A3C;
    --warning: #B35A00;
    --danger: #C8342A;
    --shadow: 0 1px 3px rgba(15, 26, 54, 0.08);
    --shadow-lg: 0 8px 24px rgba(15, 26, 54, 0.12);
    --g-nav: var(--sidebar);
    --g-create: var(--accent);
    --g-accent: var(--accent);
    --g-consult: #1F2B4A;
    --g-risk: var(--danger);
    --g-surface: var(--surface);
    --g-surface-sec: var(--surface-sunken);
    --g-surface-sub: var(--bg);
    --g-border-strong: var(--border-strong);
    --g-border: var(--border);
    --g-text: var(--text);
    --g-text-sec: var(--text-muted);
    --g-text-muted: var(--text-faint);
    --g-danger-bg: rgba(200, 52, 42, 0.1);
    --g-danger-fg: var(--danger);
    --g-ok: var(--success);
    --g-ok-bg: rgba(31, 122, 60, 0.12);
    --g-warn: var(--warning);
    --g-warn-bg: rgba(179, 90, 0, 0.12);
    --g-err: var(--danger);
    --g-err-bg: rgba(200, 52, 42, 0.1);
    --g-info: #2A5A8A;
    --g-info-bg: rgba(42, 90, 138, 0.1);
    --g-selected-bg: rgba(200, 52, 42, 0.08);
    --g-focus-ring: rgba(200, 52, 42, 0.18);
    --bg-elevated: var(--surface);
    --bg-elevated-strong: var(--surface-sunken);
    --accent-strong: var(--accent);
}