/* =========================================================================
   OpoData · Design Tokens — fuente ÚNICA de estilo.
   El child theme y todas las plantillas beben de aquí (no hardcodear colores).
   @import url('.../design-tokens.css') o encolar antes que el style del tema.
   ========================================================================= */

:root {
  /* ---- Color · marca ---- */
  --opd-navy:        #0E3A46;  /* base / superficies oscuras / texto sobre claro */
  --opd-navy-soft:   #14505E;  /* navy un paso más claro (barras internas, chips) */
  --opd-navy-deep:   #0A2C36;  /* navy profundo (cajas dentro de hero) */
  --opd-amber:       #FFC534;  /* acento · oportunidad · CTAs */
  --opd-amber-bg:    #FFF3D6;  /* fondo suave del acento (badges "aprox") */
  --opd-amber-ink:   #7A5B0A;  /* texto sobre amber-bg */
  --opd-paper:       #F2F5F4;  /* superficie clara / secciones */
  --opd-ink:         #0A1F26;  /* tinta · texto principal */

  /* ---- Color · neutros y utilidad ---- */
  --opd-muted:       #4A5B60;  /* texto secundario */
  --opd-faint:       #8A9A9E;  /* texto terciario / pies */
  --opd-line:        #E4EAE9;  /* hairlines / bordes */
  --opd-track:       #DDE5E4;  /* fondo de barras */
  --opd-chip:        #E7EDEC;  /* chips neutros */
  --opd-sky:         #9DB4BB;  /* texto sobre navy (secundario) */
  --opd-cloud:       #CFE0E3;  /* texto sobre navy (cuerpo) */

  /* ---- Color · semántico (banda / confianza) ---- */
  --opd-ok:          #0F6E56;  /* dato sólido / confianza alta */
  --opd-ok-bg:       #E1F0E9;
  --opd-warn:        #7A5B0A;  /* estimación / confianza media */
  --opd-warn-bg:     #FFF3D6;
  --opd-danger:      #A3352D;  /* restas (IRPF, cotización) */

  /* ---- Tipografía ---- */
  --opd-font-title:  'Space Grotesk', system-ui, sans-serif; /* titulares + logo */
  --opd-font-body:   'Inter', system-ui, sans-serif;         /* texto corrido */
  --opd-font-mono:   'IBM Plex Mono', ui-monospace, monospace;/* CIFRAS (regla: todo dato en mono) */
  --opd-weight-reg:  400;
  --opd-weight-med:  500;

  /* Escala tipográfica */
  --opd-fs-hero:     28px;
  --opd-fs-h1:       22px;
  --opd-fs-h2:       19px;
  --opd-fs-h3:       16px;
  --opd-fs-body:     15px;
  --opd-fs-sm:       13px;
  --opd-fs-xs:       12px;
  --opd-fs-xxs:      11px;
  --opd-lh-tight:    1.25;
  --opd-lh-body:     1.6;

  /* ---- Layout ---- */
  --opd-radius-sm:   8px;
  --opd-radius:      12px;
  --opd-radius-lg:   16px;
  --opd-radius-pill: 20px;
  --opd-space-xs:    6px;
  --opd-space-sm:    10px;
  --opd-space-md:    16px;
  --opd-space-lg:    24px;
  --opd-space-xl:    40px;
  --opd-maxw:        1080px;   /* ancho máximo de contenido */
  --opd-maxw-read:   680px;    /* ancho de lectura (fichas/guías) */

  /* ---- Estética ---- */
  --opd-border:      0.5px solid var(--opd-line);
  --opd-shadow:      none;      /* diseño plano: sin sombras decorativas */
}

/* Utilidades base opcionales (el child theme puede reutilizarlas) */
.opd-mono  { font-family: var(--opd-font-mono); }
.opd-title { font-family: var(--opd-font-title); font-weight: var(--opd-weight-med); }
.opd-body  { font-family: var(--opd-font-body); }

/* Badge de confianza del dato (coherente con la metodología) */
.opd-badge-ok   { background: var(--opd-ok-bg);   color: var(--opd-ok);   font-size: var(--opd-fs-xxs); padding: 1px 7px; border-radius: 10px; }
.opd-badge-warn { background: var(--opd-warn-bg); color: var(--opd-warn); font-size: var(--opd-fs-xxs); padding: 1px 7px; border-radius: 10px; }
