/* GENERADO por scripts/tokens.mjs a partir de diseno/_ds/leadsrenova-design-system-cf6403c3-9bb2-4fa2-bcbb-3c3eb3215018/tokens/ — no editar a mano. */

/* ---- tokens/colors.css ---- */
:root{
/* Brand anchor — navy as ink, not paint */
--navy:#1C244B;--navy-light:#2A3660;--navy-dark:#151D3A;
/* Surfaces (light mode) */
--bg-canvas:#F1F3F7;--surface-card:#FFFFFF;--border-card:#DBE2EC;
/* Text */
--text-title:#1C244B;--text-body:#4A5568;--text-muted:#718096;
/* Support greys (charts, secondary series) */
--grey-500:#64748B;--grey-400:#94A3B8;--grey-300:#CBD5E1;--grey-200:#E2E8F0;
/* Functional accents — budgeted, never judging metrics */
--ok:#10B981;--ok-bg:#ECFDF5;--warn:#B45309;--warn-bg:#FFFBEB;--danger:#B91C1C;--danger-bg:#FEF2F2;
/* Semantic aliases */
--accent:var(--navy);--chart-primary:var(--navy);--chart-secondary:var(--grey-500);--chart-tertiary:var(--grey-400);--chart-grid:#E2E8F0;
--focus-ring:rgba(28,36,75,.35);
/* Categorical (composición por categorías): matiz + valor distintos, sobrios; el navy sigue siendo el ancla */
--cat-1:#1C244B;--cat-2:#E8A427;--cat-3:#17968A;--cat-4:#64A8DC;--cat-5:#C24D22;--cat-6:#7B5BB5;--cat-7:#7CB454;--cat-8:#D96B8F;--cat-9:#99A83D;--cat-10:#DC2626;
}
.dark,[data-theme="dark"]{
--bg-canvas:#0F1428;--surface-card:#1C244B;--border-card:#2A3660;
--text-title:#E5E7EB;--text-body:#C3C9D6;--text-muted:#8B93A7;
--grey-500:#8B93A7;--grey-400:#6B7490;--grey-300:#3A4570;--grey-200:#2A3660;
--chart-grid:#2A3660;--focus-ring:rgba(229,231,235,.35);
--ok-bg:rgba(16,185,129,.12);--warn:#D97706;--warn-bg:rgba(217,119,6,.12);--danger:#DC2626;--danger-bg:rgba(220,38,38,.12);
--cat-1:#8FA6E8;--cat-2:#F0B23C;--cat-3:#2BB8A8;--cat-4:#6FB3E8;--cat-5:#E06A3B;--cat-6:#9F7FDB;--cat-7:#8FC968;--cat-8:#E787A6;--cat-9:#B5C24E;--cat-10:#E85454;
}

/* ---- tokens/typography.css ---- */
:root{
--font-sans:'Poppins',-apple-system,'Segoe UI',sans-serif;
/* KPI figures — the protagonists */
--text-kpi:600 34px/1.15 var(--font-sans);--text-kpi-sm:600 26px/1.2 var(--font-sans);
/* Headings */
--text-h1:600 24px/1.3 var(--font-sans);--text-h2:600 18px/1.35 var(--font-sans);--text-h3:600 15px/1.4 var(--font-sans);
/* Body & support */
--text-body-md:400 14px/1.55 var(--font-sans);--text-body-sm:400 13px/1.5 var(--font-sans);
--text-sub:500 12px/1.4 var(--font-sans);
/* Uppercase labels */
--text-label:600 11px/1.3 var(--font-sans);--label-tracking:.08em;
--num-tabular:"tnum" 1,"lnum" 1; /* @kind other */
}

/* ---- tokens/layout.css ---- */
:root{
/* Spacing */
--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;
--card-pad:24px;--card-pad-mobile:16px;
/* Page frame — desktop */
--page-pad-x:64px;--page-pad-y:32px;
/* Radii — contained, professional */
--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-pill:999px;
/* Shadows — barely perceptible */
--shadow-card:0 1px 3px rgba(28,36,75,.08),0 5px 14px rgba(28,36,75,.07);
--shadow-pop:0 4px 16px rgba(28,36,75,.10),0 2px 4px rgba(28,36,75,.06);
--shadow-bar:0 -2px 12px rgba(15,20,40,.18); /* mobile bottom bar, lifts off the canvas */
/* Motion */
--ease:cubic-bezier(.4,0,.2,1); /* @kind other */
--dur:160ms; /* @kind other */
--dur-slow:200ms; /* @kind other */
/* Touch — mobile only; desktop keeps its 30px icon buttons */
--tap-min:44px;
/* Mobile chrome */
--brand-strip-h:52px; /* top navy strip: brand anchor, no controls */
--nav-bar-h:64px; /* bottom bar: stepper + nav + refrescar (thumb zone) */
/* Smallest legible step — 10px on desktop, never below 11px under the finger */
--text-micro:10px;
}
/* Mobile <768px — same breakpoint at which DataTable flips to stacked cards */
@media (max-width:767px){
:root{
--card-pad:var(--card-pad-mobile);
--page-pad-x:16px;--page-pad-y:20px;
--text-micro:11px;
}
}
/* Same values forced by class, for previewing the 375px frame inside a wide viewport */
html.lr-movil{
--card-pad:var(--card-pad-mobile);
--page-pad-x:16px;--page-pad-y:20px;
--text-micro:11px;
}

/* ---- tokens/base.css ---- */
body{margin:0;font-family:var(--font-sans);background:var(--bg-canvas);color:var(--text-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{color:var(--text-title);margin:0}
a{color:var(--navy);text-decoration:none}a:hover{color:var(--navy-light);text-decoration:underline}
.dark a,[data-theme="dark"] a{color:#AEB8DC}.dark a:hover,[data-theme="dark"] a:hover{color:#E5E7EB}
::selection{background:rgba(28,36,75,.15)}
/* Touch floor below 768px: every control reaches --tap-min (44px). Desktop keeps its 30px icon buttons. */
@media (max-width:767px){button,input,select,textarea,[role="button"]{min-height:var(--tap-min)}}
html.lr-movil button,html.lr-movil input,html.lr-movil select,html.lr-movil textarea,html.lr-movil [role="button"]{min-height:var(--tap-min)}