/* Sistema — tokens de tema. Generado a partir del diseño aprobado; no editar valores a mano sin repetir la verificación de contraste (AA texto, 3:1 controles).
   Selección: <html data-theme="claro|rosa|oscuro|taller|legacy" data-cvd="off|on" data-textsize="base|big" data-contrast="normal|high" data-motion="full|reduced">
   Cargar ANTES de sistema-skin.css y DESPUÉS de app.min.css. Sustituye al archivo css/themes/{nstyle}.css. */

:root,
html[data-theme="claro"] {
  color-scheme: light;
  --bg: #F4F5FA;
  --surface: #FFFFFF;
  --surface2: #F8F9FC;
  --border: #E4E6F0;
  --border-strong: #CDD1E0;
  --text: #1A1F36;
  --text2: #565D78;
  --text3: #666D8A;
  --control-border: #8189A3;
  --primary: #5B52E0;
  --primary-hover: #4A41CC;
  --on-primary: #FFFFFF;
  --primary-soft: #ECEBFC;
  --primary-soft-text: #3F37B5;
  --accent: #5B52E0;
  --sb-bg: #FFFFFF;
  --sb-border: #E4E6F0;
  --sb-text: #3E4560;
  --sb-text-active: #3F37B5;
  --sb-icon: #7A8099;
  --sb-active-bg: #ECEBFC;
  --sb-accent: #5B52E0;
  --sb-hover: #F4F5FA;
  --sb-section: #666D8A;
  --hd-bg: #FFFFFF;
  --logo-bg: #5B52E0;
  --logo-fg: #FFFFFF;
  --success: #14866D;
  --success-soft: #DDF3EC;
  --success-text: #0C6551;
  --warning: #D99100;
  --warning-soft: #FFF1D1;
  --warning-text: #8A5A00;
  --danger: #D23A5F;
  --danger-soft: #FDE5EB;
  --danger-text: #A8213F;
  --info: #2B6FD6;
  --info-soft: #E2EDFC;
  --info-text: #1D55AE;
  --neutral-soft: #ECEEF4;
  --neutral-text: #565D78;
  --row-hover: #F8F9FC;
  --shadow: 0 1px 2px rgba(26,31,54,0.04);
  --font-display: 'IBM Plex Sans', system-ui, sans-serif;
  --display-weight: 600;
  --on-danger: #FFFFFF;
  --scrim: rgba(30,24,50,0.45);
}

html[data-theme="rosa"] {
  color-scheme: light;
  --bg: #FAF3F6;
  --surface: #FFFFFF;
  --surface2: #FBF6F9;
  --border: #EEDFE7;
  --border-strong: #DDC6D4;
  --text: #2D1B36;
  --text2: #6A5473;
  --text3: #7C6788;
  --control-border: #9C84A8;
  --primary: #B0306A;
  --primary-hover: #962758;
  --on-primary: #FFFFFF;
  --primary-soft: #FBE7F0;
  --primary-soft-text: #8C2354;
  --accent: #7B4FC0;
  --sb-bg: #3E2253;
  --sb-border: #4D2F66;
  --sb-text: #E4D3EC;
  --sb-text-active: #FFFFFF;
  --sb-icon: #C3A7D3;
  --sb-active-bg: rgba(255,255,255,0.10);
  --sb-accent: #F4A6C6;
  --sb-hover: rgba(255,255,255,0.06);
  --sb-section: #B79ACB;
  --hd-bg: #FFFFFF;
  --logo-bg: #F4A6C6;
  --logo-fg: #3E2253;
  --success: #2F8062;
  --success-soft: #E2F3EA;
  --success-text: #1F6247;
  --warning: #C98A1B;
  --warning-soft: #FBEFD8;
  --warning-text: #8A5A0A;
  --danger: #D13B2B;
  --danger-soft: #FDE6E1;
  --danger-text: #A02417;
  --info: #6D45B5;
  --info-soft: #EFE8FA;
  --info-text: #55329A;
  --neutral-soft: #F1E9EE;
  --neutral-text: #6A5473;
  --row-hover: #FDF8FB;
  --shadow: 0 1px 2px rgba(62,34,83,0.05);
  --font-display: 'Fraunces', Georgia, serif;
  --display-weight: 600;
  --on-danger: #FFFFFF;
  --scrim: rgba(30,24,50,0.45);
}

html[data-theme="oscuro"] {
  color-scheme: dark;
  --bg: #0D1117;
  --surface: #151B23;
  --surface2: #1A212B;
  --border: #262E3A;
  --border-strong: #364050;
  --text: #E7EBF2;
  --text2: #A4AEBE;
  --text3: #8591A3;
  --control-border: #64718A;
  --primary: #8E8CFF;
  --primary-hover: #A5A3FF;
  --on-primary: #0E0F2B;
  --primary-soft: rgba(142,140,255,0.14);
  --primary-soft-text: #B8B7FF;
  --accent: #8E8CFF;
  --sb-bg: #0A0D12;
  --sb-border: #1D2430;
  --sb-text: #B6BFCD;
  --sb-text-active: #FFFFFF;
  --sb-icon: #7C8798;
  --sb-active-bg: rgba(142,140,255,0.12);
  --sb-accent: #8E8CFF;
  --sb-hover: rgba(255,255,255,0.04);
  --sb-section: #7C8798;
  --hd-bg: #0D1117;
  --logo-bg: #8E8CFF;
  --logo-fg: #0E0F2B;
  --success: #3DD68C;
  --success-soft: rgba(61,214,140,0.14);
  --success-text: #6FE3A8;
  --warning: #F2B84B;
  --warning-soft: rgba(242,184,75,0.14);
  --warning-text: #F5CC7F;
  --danger: #FF6B6B;
  --danger-soft: rgba(255,107,107,0.14);
  --danger-text: #FF9A9A;
  --info: #5CC8FF;
  --info-soft: rgba(92,200,255,0.14);
  --info-text: #8FDAFF;
  --neutral-soft: rgba(164,174,190,0.14);
  --neutral-text: #A4AEBE;
  --row-hover: #1A212B;
  --shadow: none;
  --font-display: 'IBM Plex Sans', system-ui, sans-serif;
  --display-weight: 600;
  --on-danger: #1B0A04;
  --scrim: rgba(0,0,0,0.62);
}

html[data-theme="taller"] {
  color-scheme: light;
  --bg: #F2EDE1;
  --surface: #FFFDF8;
  --surface2: #F8F4EA;
  --border: #E0D8C5;
  --border-strong: #CBC0A6;
  --text: #1D2420;
  --text2: #58625C;
  --text3: #687269;
  --control-border: #8A8062;
  --primary: #0E6B5C;
  --primary-hover: #0A5448;
  --on-primary: #FFFFFF;
  --primary-soft: #DCEEE8;
  --primary-soft-text: #0B5446;
  --accent: #B07A0A;
  --sb-bg: #12332E;
  --sb-border: #1C443D;
  --sb-text: #CFE0DA;
  --sb-text-active: #FFFFFF;
  --sb-icon: #8FB3A9;
  --sb-active-bg: rgba(255,255,255,0.08);
  --sb-accent: #F2B134;
  --sb-hover: rgba(255,255,255,0.05);
  --sb-section: #8FB3A9;
  --hd-bg: #FFFDF8;
  --logo-bg: #F2B134;
  --logo-fg: #12332E;
  --success: #2E7D4F;
  --success-soft: #E0F0E5;
  --success-text: #1F6139;
  --warning: #D9930D;
  --warning-soft: #FBEBC8;
  --warning-text: #85580A;
  --danger: #C8341E;
  --danger-soft: #FBE2DB;
  --danger-text: #9B2412;
  --info: #2F5FA8;
  --info-soft: #E1E9F5;
  --info-text: #264C86;
  --neutral-soft: #ECE6D6;
  --neutral-text: #58625C;
  --row-hover: #FAF6EC;
  --shadow: 0 1px 2px rgba(29,36,32,0.05);
  --font-display: 'Bricolage Grotesque', system-ui, sans-serif;
  --display-weight: 600;
  --on-danger: #FFFFFF;
  --scrim: rgba(30,24,50,0.45);
}

/* Legacy: la paleta del tema heredado por omisión (css/themes/dark.css: menú oscuro #1E1E2C, índigo #5E72E4,
   texto #32325D) llevada a los mismos tokens. Los tonos se oscurecieron lo justo para pasar contraste AA. */
html[data-theme="legacy"] {
  color-scheme: light;
  --bg: #F0F2F7;
  --surface: #FFFFFF;
  --surface2: #F7F9FC;
  --border: #E2E9EC;
  --border-strong: #CED4DA;
  --text: #32325D;
  --text2: #525F7F;
  --text3: #5E6A83;
  --control-border: #7C8BA1;
  --primary: #5063DB;
  --primary-hover: #4354C8;
  --on-primary: #FFFFFF;
  --primary-soft: #E9ECFC;
  --primary-soft-text: #3847B8;
  --accent: #5063DB;
  --sb-bg: #1E1E2C;
  --sb-border: #2A2A3C;
  --sb-text: #A2A3B7;
  --sb-text-active: #FFFFFF;
  --sb-icon: #2BA4E8;
  --sb-active-bg: #1B1B27;
  --sb-accent: #5E72E4;
  --sb-hover: rgba(255,255,255,0.04);
  --sb-section: #8A97AD;
  --hd-bg: #FFFFFF;
  --logo-bg: #1E1E2C;
  --logo-fg: #FFFFFF;
  --success: #1FA971;
  --success-soft: #DDF7EC;
  --success-text: #0F6B45;
  --warning: #E0562F;
  --warning-soft: #FEE9E2;
  --warning-text: #9A300E;
  --danger: #D92550;
  --danger-soft: #FDE3E8;
  --danger-text: #AD1538;
  --info: #2196F3;
  --info-soft: #E1F0FD;
  --info-text: #0B5A9E;
  --neutral-soft: #EEF1F5;
  --neutral-text: #525F7F;
  --row-hover: #F7F9FC;
  --shadow: 0 0 13px 0 rgba(31,17,173,0.08);
  --font-display: 'Open Sans', system-ui, sans-serif;
  --display-weight: 600;
  --on-danger: #FFFFFF;
  --scrim: rgba(30,30,44,0.5);
}

/* ---- Daltonismo: paleta separada por tipo de visión; ortogonal al tema (sólo depende de si el tema es claro u oscuro) ---- */
html[data-cvd="on"],
html[data-cvd="on"][data-theme="claro"],
html[data-cvd="on"][data-theme="rosa"],
html[data-cvd="on"][data-theme="taller"] {
  --success: #0A5FA8;
  --success-soft: #E1EEF8;
  --success-text: #004A77;
  --warning: #F0A800;
  --warning-soft: #FFF0C7;
  --warning-text: #7A5200;
  --danger: #C2410C;
  --danger-soft: #FDE6DC;
  --danger-text: #8A2A0B;
  --info: #7B8196;
  --info-soft: #ECEDF2;
  --info-text: #4F566B;
}

html[data-cvd="on"][data-theme="oscuro"] {
  --success: #4DA3FF;
  --success-soft: rgba(77,163,255,0.16);
  --success-text: #8CC4FF;
  --warning: #F5C400;
  --warning-soft: rgba(245,196,0,0.14);
  --warning-text: #FFE066;
  --danger: #FF5A5A;
  --danger-soft: rgba(255,90,90,0.16);
  --danger-text: #FF9C9C;
  --info: #C9CCD6;
  --info-soft: rgba(201,204,214,0.14);
  --info-text: #D9DCE5;
}

/* Patrones redundantes (se usan en barras y leyendas cuando data-cvd="on") */
html {
  --pat-success: repeating-linear-gradient(45deg, rgba(255,255,255,0.6) 0 3px, transparent 3px 6px);
  --pat-warning: repeating-linear-gradient(90deg, rgba(0,0,0,0.45) 0 2px, transparent 2px 5px);
  --pat-danger: repeating-linear-gradient(-45deg, rgba(255,255,255,0.6) 0 3px, transparent 3px 6px);
  --pat-neutral: radial-gradient(rgba(255,255,255,0.75) 1.2px, transparent 1.6px) 0 0 / 6px 6px;
}

/* ---- Gráficas (paleta categórica validada: ΔE CVD adyacente ≥ 8.4, visión normal ≥ 19.3) ----
   Orden fijo de series: 1..8, nunca cíclico. Más de 8 → "Otros". Los estados (pagada, vencida…) usan --success/--warning/--danger, no --chart-N.
   En claro, los slots 3, 4 y 5 quedan por debajo de 3:1: etiquetas directas visibles y vista de tabla son obligatorias. */
:root, html[data-theme="claro"], html[data-theme="rosa"], html[data-theme="taller"] {
  --chart-1: #2a78d6; --chart-2: #eb6834; --chart-3: #1baf7a; --chart-4: #eda100;
  --chart-5: #e87ba4; --chart-6: #008300; --chart-7: #4a3aa7; --chart-8: #e34948;
  --chart-seq-1: #cde2fb;
  --chart-seq-2: #9ec5f4;
  --chart-seq-3: #6da7ec;
  --chart-seq-4: #3987e5;
  --chart-seq-5: #256abf;
  --chart-seq-6: #184f95;
  --chart-seq-7: #0d366b;
  --chart-ord-1: #86b6ef; --chart-ord-2: #5598e7; --chart-ord-3: #256abf; --chart-ord-4: #184f95; --chart-ord-5: #0d366b;
  --chart-div-neg-3: #980a19; --chart-div-neg-2: #da5450; --chart-div-neg-1: #fea79f; --chart-div-mid: #f0efec;
  --chart-div-pos-1: #9ec5f4; --chart-div-pos-2: #3987e5; --chart-div-pos-3: #184f95;
}
html[data-theme="oscuro"] {
  --chart-1: #3987e5; --chart-2: #d95926; --chart-3: #199e70; --chart-4: #c98500;
  --chart-5: #d55181; --chart-6: #008300; --chart-7: #9085e9; --chart-8: #e66767;
  --chart-seq-1: #0d366b;
  --chart-seq-2: #184f95;
  --chart-seq-3: #256abf;
  --chart-seq-4: #3987e5;
  --chart-seq-5: #6da7ec;
  --chart-seq-6: #9ec5f4;
  --chart-seq-7: #cde2fb;
  --chart-ord-1: #184f95; --chart-ord-2: #256abf; --chart-ord-3: #3987e5; --chart-ord-4: #6da7ec; --chart-ord-5: #9ec5f4;
  --chart-div-neg-3: #fea79f; --chart-div-neg-2: #da5450; --chart-div-neg-1: #980a19; --chart-div-mid: #383835;
  --chart-div-pos-1: #184f95; --chart-div-pos-2: #3987e5; --chart-div-pos-3: #9ec5f4;
}
html {
  --chart-grid: var(--border);
  --chart-axis: var(--border-strong);
  --chart-label: var(--text2);
  --chart-muted: var(--text3);
  --chart-surface: var(--surface);
  --chart-gap: var(--surface);
}

/* ---- Tipografía y accesibilidad ---- */
html { --fs-body: 14px; --lh-body: 21px; }
html[data-textsize="big"] { --fs-body: 16px; --lh-body: 24px; }
html[data-contrast="high"] {
  --text2: var(--text);
  --text3: var(--text2);
  --border: var(--border-strong);
  --control-border: var(--text2);
}
html[data-motion="reduced"] *, html[data-motion="reduced"] *::before, html[data-motion="reduced"] *::after {
  transition: none !important; animation: none !important; scroll-behavior: auto !important;
}
@media (prefers-reduced-motion: reduce) {
  html:not([data-motion="full"]) *, html:not([data-motion="full"]) *::before, html:not([data-motion="full"]) *::after {
    transition: none !important; animation: none !important;
  }
}
