/**
 * tokens.css — Design tokens (variables CSS).
 * Reemplaza todos los valores hardcoded en styleNew.css y especificos.css.
 *
 * ORIGEN v1: #3e5f8a aparecía 10+ veces repartido entre styleNew.css y especificos.css.
 * CAMBIO: un solo fichero con variables → cambiar la marca en un lugar.
 */

:root {
  /* ── Colores corporativos ─────────────────────────────────── */
  --color-brand:        #3e5f8a;   /* azul CST / PEFiR */
  --color-brand-dark:   #0056b3;   /* hover, focus */
  --color-brand-light:  #dbeafe;   /* fondos suaves */

  --color-danger:       crimson;
  --color-success:      #4caf50;
  --color-warning:      orange;
  --color-info:         #6b0f1a;

  /* ── Neutros ──────────────────────────────────────────────── */
  --color-white:        #ffffff;
  --color-bg:           #f4f4f4;
  --color-surface:      #f0f0f0;
  --color-border:       gainsboro;
  --color-text:         #111111;
  --color-text-muted:   #888888;
  --color-gainsboro:    rgb(204, 202, 202);

  /* ── Tipografía ───────────────────────────────────────────── */
  --font-base:    Arial, Helvetica, sans-serif;
  --font-size-xs: 10px;
  --font-size-sm: 12px;
  --font-size-md: 16px;
  --font-size-lg: 20px;
  --font-size-xl: 22px;
  --font-size-2xl:24px;

  /* ── Espaciado ────────────────────────────────────────────── */
  --space-xs:  2px;
  --space-sm:  4px;
  --space-md:  8px;
  --space-lg:  12px;
  --space-xl:  16px;
  --space-2xl: 20px;

  /* ── Estructura ───────────────────────────────────────────── */
  --header-height:  50px;
  --footer-height:  50px;
  --sidenav-width:  250px;
  --radius-sm:      4px;
  --radius-md:      8px;
  --radius-full:    50%;

  /* ── Sombras ──────────────────────────────────────────────── */
  --shadow-sm:  0 2px 10px rgba(0,0,0,.1);
  --shadow-fab: 0px 4px 6px rgba(128,128,128,.8);

  /* ── Transiciones ─────────────────────────────────────────── */
  --transition-nav: left .3s ease, right .3s ease;

  /* ── Z-index ──────────────────────────────────────────────── */
  --z-nav:     999;
  --z-sidenav: 9998;
  --z-modal:   9999;

  /* ── Imagen de ejercicio (galería) ───────────────────────── */
  --img-thumb-w: 106px;
  --img-thumb-h: 120px;
  --img-grid-w:  90px;
  --img-grid-h:  90px;
}