/* ───────── RDdealer · sistema de diseño ─────────
   Tokens de shadcn/ui (paleta zinc) y patrones de Tremor Raw para datos. Siempre en claro (fondo blanco); el oscuro existe solo si se pide con data-theme="dark".
   Reglas: bordes de 1px muy suaves, radio único (lg = 8px controles, xl = 12px tarjetas), sombra-sm,
   acento #2563eb solo en acciones y foco; números a la derecha y tabulares. */
:root{
  --background:#ffffff; --muted-bg:#fafafa; --subtle:#f4f4f5;            /* zinc-50 / zinc-100 */
  --foreground:#09090b; --muted:#71717a; --placeholder:#a1a1aa;          /* zinc-950 / 500 / 400 */
  --border:#e4e4e7; --input:#e4e4e7; --border-strong:#d4d4d8;             /* zinc-200 / 300 */
  --primary:#2563eb; --primary-hover:#1d4ed8; --primary-fg:#ffffff; --ring:#2563eb;
  --brand:#0B3A82;
  --ok:#15803d; --ok-bg:#f0fdf4; --warn:#b45309; --warn-bg:#fffbeb; --crit:#dc2626; --crit-bg:#fef2f2; --info-bg:#eff6ff;
  --chart-1:#2563eb; --chart-2:#60a5fa; --chart-3:#a1a1aa; --chart-4:#0B3A82; --chart-5:#dc2626;
  --radius-lg:8px; --radius-xl:12px;
  --shadow-sm:0 1px 2px 0 rgb(0 0 0 / .05);
  --sans:'Inter',ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --mono:ui-monospace,'SF Mono','JetBrains Mono',Menlo,Consolas,monospace;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --background:#09090b; --muted-bg:#09090b; --subtle:#18181b; --foreground:#fafafa; --muted:#a1a1aa; --placeholder:#71717a;
  --border:#27272a; --input:#27272a; --border-strong:#3f3f46; --primary:#3b82f6; --primary-hover:#2563eb; --ring:#3b82f6; --brand:#93c5fd;
  --ok:#4ade80; --ok-bg:rgb(34 197 94 / .12); --warn:#fbbf24; --warn-bg:rgb(245 158 11 / .12); --crit:#f87171; --crit-bg:rgb(239 68 68 / .12); --info-bg:rgb(59 130 246 / .12);
  --chart-1:#3b82f6; --chart-2:#93c5fd; --chart-3:#52525b; --chart-4:#1d4ed8; --shadow-sm:0 1px 2px 0 rgb(0 0 0 / .4); color-scheme:dark; }
/* alias usados por las vistas */
:root{ --ink:var(--foreground); --ink2:var(--muted); --ink3:var(--muted); --line:var(--border); --line2:var(--border-strong); --s1:var(--background); --s2:var(--subtle); --bg:var(--muted-bg);
  --rd:var(--chart-1); --rdbg:var(--info-bg); --blue:var(--primary); --bluebg:var(--info-bg); --red:var(--chart-5); --okbg:var(--ok-bg); --warnbg:var(--warn-bg); --critbg:var(--crit-bg); --sh1:var(--shadow-sm); --sh2:var(--shadow-sm); }

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--muted-bg);color:var(--foreground);font:14px/1.5 var(--sans);-webkit-font-smoothing:antialiased;font-feature-settings:'cv11','ss01'}
a{color:var(--primary);text-decoration:none} a:hover{text-decoration:underline;text-underline-offset:3px}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
.mono{font-family:var(--mono);font-size:.92em}
.mark{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:15px;letter-spacing:-.01em;color:var(--foreground)}
.mark img{width:24px;height:24px} .mark b{font-weight:700}
.mark:hover{text-decoration:none}

/* Button (shadcn) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:0 14px;border-radius:var(--radius-lg);border:1px solid var(--input);background:var(--background);color:var(--foreground);font-size:14px;font-weight:500;cursor:pointer;white-space:nowrap;box-shadow:var(--shadow-sm);transition:background-color .15s,border-color .15s,color .15s}
.btn:hover{background:var(--subtle);text-decoration:none}
.btn:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
.btn.pri{background:var(--primary);border-color:var(--primary);color:var(--primary-fg)} .btn.pri:hover{background:var(--primary-hover);border-color:var(--primary-hover)}
.btn.ghost{border-color:transparent;box-shadow:none;background:transparent} .btn.ghost:hover{background:var(--subtle)}
.btn.sm{height:32px;padding:0 10px;font-size:13px}
.btn.wa{color:var(--ok)}
.btn[disabled]{opacity:.5;pointer-events:none}

/* Label + Input (shadcn) */
.field{display:grid;gap:6px;margin-bottom:16px}
.field label{font-size:14px;font-weight:500;color:var(--foreground)}
.field input,.field select,.field textarea{height:36px;width:100%;border:1px solid var(--input);border-radius:var(--radius-lg);padding:0 12px;background:var(--background);box-shadow:var(--shadow-sm);transition:border-color .15s,box-shadow .15s}
.field textarea{height:auto;min-height:88px;padding:8px 12px}
.field input::placeholder,.field textarea::placeholder{color:var(--placeholder)}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--ring);box-shadow:0 0 0 1px var(--background),0 0 0 3px var(--ring)}
.field small{color:var(--muted);font-size:12.5px}

/* Alert */
.msg{padding:10px 12px;border-radius:var(--radius-lg);font-size:13.5px;margin-bottom:14px;border:1px solid var(--border)}
.msg.err{background:var(--crit-bg);color:var(--crit);border-color:transparent} .msg.ok{background:var(--ok-bg);color:var(--ok);border-color:transparent} .msg.info{background:var(--info-bg);color:var(--primary);border-color:transparent}

/* Badge (Tremor) */
.tag{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;font-size:12px;font-weight:500;background:var(--subtle);color:var(--muted);white-space:nowrap;border:1px solid var(--border)}
.tag.ok{background:var(--ok-bg);color:var(--ok);border-color:transparent} .tag.warn{background:var(--warn-bg);color:var(--warn);border-color:transparent} .tag.crit{background:var(--crit-bg);color:var(--crit);border-color:transparent} .tag.rd{background:var(--info-bg);color:var(--primary);border-color:transparent}

/* Card */
.card{background:var(--background);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}

/* Montos: una moneda por línea, siempre etiquetada */
.money{display:grid;gap:2px}
.money .m{display:flex;justify-content:space-between;gap:12px;font-variant-numeric:tabular-nums}
.money .m span{color:var(--muted);font-size:12px}

/* Charts (Tremor) */
.chart{position:relative;height:var(--h,180px);border-bottom:1px solid var(--border);margin-top:22px}
.chart .bars{position:absolute;inset:0;display:flex;gap:8px;align-items:flex-end}
.chart .b{flex:1;min-width:0;height:100%;position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.chart .b i{display:block;width:60%;max-width:40px;border-radius:4px 4px 0 0}
.chart .b .t{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;margin-bottom:4px}
.chx{display:flex;gap:8px;font-size:11.5px;color:var(--muted);margin-top:6px}
.chx span{flex:1;min-width:0;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbs{display:grid;gap:10px}
.hb{display:grid;grid-template-columns:minmax(0,170px) minmax(0,1fr) auto;gap:12px;align-items:center;font-size:13px}
.hb .l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--foreground)}
.hb .tk{height:6px;background:var(--subtle);border-radius:99px;overflow:hidden}
.hb .tk i{display:block;height:100%;border-radius:99px}
.hb b{font-weight:500;color:var(--foreground)}
.dwrap{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.donut{width:140px;height:140px;border-radius:50%;flex:none;position:relative}
.donut::after{content:'';position:absolute;inset:16px;border-radius:50%;background:var(--background)}
.donut .c{position:absolute;inset:0;display:grid;place-items:center;text-align:center;z-index:1;font-size:12px;color:var(--muted)}
.donut .c b{display:block;font-size:18px;color:var(--foreground);font-weight:600}
.lg{display:grid;gap:8px;flex:1;min-width:180px;font-size:13px}
.lg div{display:grid;grid-template-columns:8px minmax(0,1fr) auto;gap:10px;align-items:center}
.lg i{width:8px;height:8px;border-radius:2px} .lg small{color:var(--muted);font-weight:400}
#toast{position:fixed;right:20px;bottom:20px;transform:translateY(12px);opacity:0;background:var(--background);color:var(--foreground);border:1px solid var(--border);box-shadow:0 10px 15px -3px rgb(0 0 0 / .1),0 4px 6px -4px rgb(0 0 0 / .1);padding:12px 16px;border-radius:var(--radius-lg);font-size:14px;transition:.2s;z-index:99;pointer-events:none}
#toast.on{opacity:1;transform:none}
@media(max-width:640px){.hb{grid-template-columns:minmax(0,1fr) auto}.hb .tk{grid-column:1/-1;grid-row:2}#toast{left:16px;right:16px}}
@media (prefers-reduced-motion: reduce){*{transition:none!important}}