/*
 * JCM Básculas y Balanzas: tokens de diseño.
 *
 * Todos los colores del sitio salen de aquí. Para cambiar la paleta, edita
 * solo este archivo: style, banner, component, touchTouch y contacto usan
 * estas variables (las genera tools/tokenizar-css.py).
 *
 * Valores actuales = colores del sitio antes de la renovación (fase 2a).
 * La dirección visual definitiva se aplica en la fase 2b cambiando estos valores.
 */
:root {
  /* Marca */
  --color-marca: #cc0000;          /* botones, franjas, acentos (antes: #c00, red, #e31e24…) */
  --color-marca-oscuro: #990000;   /* hover y sombras de la marca */

  /* Neutros */
  --color-tinta: #000000;          /* títulos y texto de máximo contraste */
  --color-oscuro: #1d1d1d;         /* fondos oscuros, texto del menú */
  --color-texto: #666666;          /* texto corrido (antes #949494: 2,8:1, no cumplía WCAG AA) */
  --color-texto-invertido: #ffffff;/* texto sobre marca u oscuro */
  --color-fondo: #ffffff;          /* fondo de página y tarjetas */
  --color-superficie: #f7f7f7;     /* bandas y bloques suaves */
  --color-borde: #dddddd;          /* líneas y separadores */

  /* Detalle de la ficha (fase 7): fondo rojo de marca con texto blanco */
  --color-detalle-fondo: var(--color-marca);
  --color-detalle-texto: var(--color-texto-invertido);
  --color-detalle-franja: color-mix(in srgb, var(--color-marca) 88%, #000);   /* filas alternas */
  --color-detalle-resalte: var(--color-marca-oscuro);                          /* fila bajo el cursor */

  /* Funcionales */
  --color-info: #03a9f4;           /* resaltes de tabla y fichas */
  --color-info-suave: #b3e5fc;
  --color-whatsapp: #01e675;
  --color-aviso: #ffd200;
}