/* ============================================================
   MonTech · Tokens de diseño
   Colores de la marca MonTech (hoja de marca):
     azul institucional #1c2a4a   naranja #dc6e0c   naranja oscuro #8a310c
   Fondo gris muy claro, barra lateral blanca, tarjetas blancas con
   borde fino. Tipografía: Proxima Nova (si está instalada) o Metropolis.
   ============================================================ */

:root {
  color-scheme: light;

  /* ---- Marca (los nombres --mt-* se conservan: los usa todo el sistema) ---- */
  --mt-navy-900: #1c2a4a;
  --mt-navy-850: #17233f;
  --mt-navy-800: #374460;
  --mt-navy-700: #45506b;
  --mt-navy-600: #576179;
  --mt-navy-500: #727b8f;
  --mt-navy-400: #9299a8;
  --mt-navy-200: #c9ccd4;
  --mt-navy-100: #e4e5e9;
  --mt-navy-050: #f1f2f4;

  --mt-orange-700: #804007;
  --mt-orange-600: #bb5e0a;
  --mt-orange-500: #dc6e0c;
  --mt-orange-400: #e28533;
  --mt-orange-300: #e69a55;
  --mt-orange-100: #faebdd;
  --mt-orange-050: #fdf5ee;

  --mt-gold-500: #f7c347;
  --mt-gold-300: #fadc8e;
  --mt-gold-100: #fef6e0;

  /* ---- Superficies ---- */
  --bg-app: #f3f4f7;
  --bg-surface: #ffffff;
  --bg-elevated: #ffffff;
  --bg-muted: #f7f8fa;
  --bg-inset: #eef0f4;
  --bg-nav: #ffffff;
  --bg-nav-active: rgba(220, 110, 12, 0.09);
  --bg-nav-hover: #f2f3f7;
  --scrim: rgba(10, 22, 41, 0.38);

  --border: #e5e8ee;
  --border-strong: #d3d8e1;
  --border-nav: #e7eaf0;

  /* ---- Texto ---- */
  --text-primary: #111a2e;
  --text-secondary: #4a5468;
  --text-muted: #788197;
  --text-inverse: #ffffff;
  --text-nav: #3c465c;
  --text-nav-active: #ac5609;
  --text-brand: #a55209;

  /* ---- Marca aplicada ---- */
  --brand: #dc6e0c;
  --brand-hover: #bb5e0a;
  --brand-soft: rgba(220, 110, 12, 0.1);
  --brand-ink: #804007;
  --brand-ring: rgba(220, 110, 12, 0.2);
  --accent: #1c2a4a;
  --accent-soft: rgba(28, 42, 74, 0.08);
  --gold: #8a310c;

  /* ---- Estados ---- */
  --ok: #1f9d62;
  --ok-soft: #e7f6ee;
  --ok-ink: #13744a;
  --warn: #d48806;
  --warn-soft: #fdf3e1;
  --warn-ink: #8a5700;
  --danger: #d64545;
  --danger-soft: #fdecec;
  --danger-ink: #a52d2d;
  --info: #3b6b8f;
  --info-soft: #eaf1f7;
  --info-ink: #24506f;
  --neutral-soft: #eff1f5;
  --neutral-ink: #4a5468;

  /* ---- Datos / gráficas ---- */
  --c1: #dc6e0c;
  --c2: #1c2a4a;
  --c3: #f7c347;
  --c4: #5f7d95;
  --c5: #9fb0d0;
  --c6: #a86b8c;
  --c7: #3aa876;
  --c8: #9aa5a8;
  --grid: #eceef3;
  --bar-muted: #e3e7ee;

  /* ---- Forma ---- */
  --r-xs: 4px;
  --r-sm: 7px;
  --r: 10px;
  --r-lg: 14px;
  --r-xl: 18px;
  --r-full: 999px;

  --sh-1: 0 1px 2px rgba(17, 26, 46, 0.04);
  --sh-2: 0 1px 2px rgba(17, 26, 46, 0.05), 0 6px 16px -4px rgba(17, 26, 46, 0.08);
  --sh-3: 0 24px 48px -12px rgba(17, 26, 46, 0.22), 0 4px 12px rgba(17, 26, 46, 0.06);
  --sh-nav: none;

  /* ---- Tipografía ---- */
  /* Proxima Nova es la tipografía del manual de marca. Si está instalada
     en el equipo se usa tal cual; si no, entra Metropolis, servida desde
     /fonts (css/tipografia.css), que respeta las mismas proporciones. */
  --font: "Proxima Nova", "Proxima Nova Alt", "Metropolis", "Avenir Next",
    "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: "SF Mono", ui-monospace, "JetBrains Mono", Menlo, Consolas, monospace;

  --fs-11: 11px;
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-15: 15px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-20: 20px;
  --fs-24: 24px;
  --fs-30: 30px;
  --fs-38: 38px;

  /* ---- Espaciado ---- */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-7: 32px;
  --s-8: 40px;
  --s-9: 56px;

  /* ---- Layout ---- */
  --nav-w: 252px;
  --nav-w-collapsed: 76px;
  --topbar-h: 68px;
  --maxw: 1560px;

  --t-fast: 120ms cubic-bezier(0.4, 0, 0.2, 1);
  --t: 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* ============================================================
   Tema oscuro — mismos roles, sobre un gris petróleo casi negro
   ============================================================ */
[data-theme="dark"] {
  color-scheme: dark;

  --bg-app: #090e18;
  --bg-surface: #0f1524;
  --bg-elevated: #141b2c;
  --bg-muted: #121828;
  --bg-inset: #182033;
  --bg-nav: #0f1524;
  --bg-nav-active: rgba(220, 110, 12, 0.15);
  --bg-nav-hover: #151c2d;
  --scrim: rgba(0, 0, 0, 0.55);

  --border: #1e2638;
  --border-strong: #2b3449;
  --border-nav: #1e2638;

  --text-primary: #e8ebf2;
  --text-secondary: #a9b0c0;
  --text-muted: #7e879a;
  --text-inverse: #090e18;
  --text-nav: #b4bbc9;
  --text-nav-active: #ebab72;
  --text-brand: #e89f5f;

  --brand: #dc6e0c;
  --brand-hover: #e07f29;
  --brand-soft: rgba(220, 110, 12, 0.16);
  --brand-ink: #eaa86d;
  --brand-ring: rgba(220, 110, 12, 0.3);
  --accent: #828a9b;
  --accent-soft: rgba(160, 172, 200, 0.14);

  --ok: #3cc98a;
  --ok-soft: rgba(60, 201, 138, 0.14);
  --ok-ink: #72dcac;
  --warn: #f0b44c;
  --warn-soft: rgba(240, 180, 76, 0.14);
  --warn-ink: #f6ca7c;
  --danger: #f07575;
  --danger-soft: rgba(240, 117, 117, 0.15);
  --danger-ink: #ff9f9f;
  --info: #7fb0d6;
  --info-soft: rgba(127, 176, 214, 0.15);
  --info-ink: #aacbe6;
  --neutral-soft: #182033;
  --neutral-ink: #a9b0c0;

  --c1: #e07f29;
  --c2: #999fae;
  --c3: #f0b44c;
  --c4: #86a6c0;
  --c5: #4a5f8f;
  --c6: #cf94b3;
  --c7: #57c98f;
  --c8: #8d94a3;
  --grid: #1b2233;
  --bar-muted: #222a3b;

  --sh-1: 0 1px 2px rgba(0, 0, 0, 0.35);
  --sh-2: 0 2px 4px rgba(0, 0, 0, 0.3), 0 8px 20px -6px rgba(0, 0, 0, 0.45);
  --sh-3: 0 24px 48px -12px rgba(0, 0, 0, 0.65), 0 4px 12px rgba(0, 0, 0, 0.4);
}