/* ==========================================================================
   DESIGN TOKENS — Capa de Humanización · Minor Feasibility Analyst
   --------------------------------------------------------------------------
   Lenguaje visual: claro y frío, una sola tipografía sans, tres tamaños
   de letra como máximo. La jerarquía se construye con versalitas (labels)
   vs. minúscula grande (contenido), peso y opacidad — no con más tamaños.
   Acentos: cian (activo/positivo), coral (énfasis/medio), naranja
   (emergencia/riesgo) — usar el naranja con cuentagotas.
   ========================================================================== */

:root {
  /* ---- Tipografía: UNA familia, TRES tamaños ---- */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --text-label: 0.75rem;     /* 12px — eyebrows, mayúsculas, meta, pastillas */
  --text-body:  1rem;        /* 16px — contenido, cifras, párrafos */
  --text-display: 1.75rem;   /* 28px — titulares, veredictos, nombre de hotel */

  --weight-regular: 430;
  --weight-medium: 560;
  --weight-bold: 680;

  --tracking-label: 0.055em;

  /* ---- Fondo: blanco roto, frío, azulado-grisáceo — nunca cálido ---- */
  --bg: #F2F4F7;
  --bg-raised: #FFFFFF;
  --bg-sunken: #E8EBEF;
  --bg-image-wash: linear-gradient(175deg, #EEF1F5 0%, #E4E8ED 100%);

  /* ---- Tinta: un solo color de texto, jerarquía por opacidad ---- */
  --ink: #0F1620;
  --ink-100: rgba(15, 22, 32, 1);
  --ink-70:  rgba(15, 22, 32, 0.70);
  --ink-45:  rgba(15, 22, 32, 0.45);
  --ink-25:  rgba(15, 22, 32, 0.25);
  --ink-12:  rgba(15, 22, 32, 0.12);
  --ink-06:  rgba(15, 22, 32, 0.06);

  --line: rgba(15, 22, 32, 0.10);
  --line-strong: rgba(15, 22, 32, 0.16);

  /* ---- Acentos de acción (CTA): cian + naranja saturado ---- */
  --cyan: #0BA5B8;
  --cyan-ink: #065A66;
  --cyan-wash: rgba(11, 165, 184, 0.10);
  --cyan-wash-strong: rgba(11, 165, 184, 0.18);

  --coral: #FF6452;
  --coral-ink: #B23324;
  --coral-wash: rgba(255, 100, 82, 0.10);
  --coral-wash-strong: rgba(255, 100, 82, 0.18);

  --orange: #F2560C;
  --orange-ink: #9A3005;
  --orange-wash: rgba(242, 86, 12, 0.10);
  --orange-wash-strong: rgba(242, 86, 12, 0.20);

  /* ---- Verde: reservado solo para veredicto/estado positivo ---- */
  --green: #1C9A6C;
  --green-ink: #0F6B49;
  --green-wash: rgba(28, 154, 108, 0.10);
  --green-wash-strong: rgba(28, 154, 108, 0.18);

  /* ---- Escala de veredicto ---- */
  --verdict-favorable: var(--green);
  --verdict-favorable-wash: var(--green-wash);
  --verdict-mixto: var(--ink-45);
  --verdict-mixto-wash: var(--ink-06);
  --verdict-debil: var(--coral);
  --verdict-debil-wash: var(--coral-wash);
  --verdict-critico: var(--orange);
  --verdict-critico-wash: var(--orange-wash);

  /* ---- Espaciado y forma ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;

  --shadow-card: 0 1px 2px rgba(15, 22, 32, 0.04), 0 8px 24px -12px rgba(15, 22, 32, 0.12);
  --shadow-dock: 0 -8px 24px -8px rgba(15, 22, 32, 0.14);

  --content-max: 1180px;
  --nav-h: 56px;
  /* Homóloga a la cabecera, literalmente (no un valor parecido a mano):
     si --nav-h cambia algún día, la barra del chat la sigue sola. */
  --dock-h-collapsed: var(--nav-h);
}