/* Tema visual. Base interna Herme + tipografías de cashdisplay.com (Outfit y Hanken Grotesk).
   Para cambiar colores, letras o tamaños, tocar solo este archivo. */

@font-face {
  font-family: 'Outfit';
  src: url('../vendor/fuentes/outfit-latin.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
}
@font-face {
  font-family: 'Hanken Grotesk';
  src: url('../vendor/fuentes/hanken-grotesk-latin.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
}

.ts-app {
  /* Colores (base Herme) */
  --ts-rojo: #CE142C;
  --ts-rojo-oscuro: #a80f23;
  --ts-rojo-suave: #fbeef0;
  --ts-fondo: #f4f3f0;
  --ts-tarjeta: #fff;
  --ts-texto: #1c1c1a;
  --ts-texto-suave: #66645e; /* 5,9:1 sobre blanco */
  --ts-borde: #e6e4df;
  --ts-borde-fuerte: #cfccc5;
  --ts-hover: #f7f6f3;
  --ts-ambar: #8a5a10; /* texto ámbar legible (5,6:1) */
  --ts-ambar-fondo: #fdf3e1;
  --ts-ambar-borde: #f0d9a8;
  --ts-verde: #256b29;
  --ts-verde-fondo: #e8f3e8;
  --ts-error-fondo: #fbe9eb;
  --ts-fondo-3d: #f4f3f0;

  /* Formas: radios 12/8, sin sombras */
  --ts-radio: 12px;
  --ts-radio-peq: 8px;

  /* Espaciado (ritmo de 4/8 px) */
  --ts-e1: 4px;
  --ts-e2: 8px;
  --ts-e3: 12px;
  --ts-e4: 16px;
  --ts-e5: 24px;

  /* Letra */
  --ts-letra: 'Hanken Grotesk', 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
  --ts-letra-titulos: 'Outfit', 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
  --ts-t-mini: 12px;
  --ts-t-peq: 13px;
  --ts-t-base: 14px;
  --ts-t-media: 16px;
  --ts-t-titulo: 19px;
  --ts-t-cifra: 30px;

  /* Movimiento */
  --ts-transicion: 150ms ease-out;
}