/* ==========================================================================
   Tipografías que faltaban: iconos y capa UX v2 del panel.

   Complementa a `fuentes.css`, que NO se toca porque lo genera
   `thecodtlabs-audit/bajar_fuentes.py` y ya trae Fraunces, IBM Plex Mono,
   Montserrat y Poppins autoalojadas.

   POR QUÉ HACÍA FALTA: `admin.html` era la única página de la plataforma que
   nunca recibió ese tratamiento — seguía pidiendo sus fuentes a
   fonts.googleapis.com. Y la CSP del host de plataforma es
   `style-src 'self' 'unsafe-inline'`, sin Google. Resultado, medido en
   producción:

     · cero `FontFace` registradas,
     · el texto en Manrope medía exactamente lo mismo que en la fuente de
       reserva (308 px los dos),
     · cinco violaciones de CSP en consola,
     · y donde hay iconos se leía la palabra («delete», «photo_camera») en vez
       del símbolo. En los siete negocios.

   Cómo comprobarlo bien: `document.fonts.check()` NO vale — devuelve `true`
   también si la fuente está instalada en el equipo de quien mira, y por eso me
   dio verde durante días sobre una página donde estaban bloqueadas. Lo fiable
   es contar las `FontFace` registradas y medir el ancho de un texto contra la
   fuente de reserva.
   ========================================================================== */

/* ── Iconos ────────────────────────────────────────────────────────────────
   RECORTADA a los 24 iconos que se usan de verdad: 25 KB en vez de los 3,97 MB
   del archivo completo, que trae 6.607. Al añadir un icono nuevo hay que
   regenerarla:  python scripts/subconjunto-iconos.py
   El guion comprueba que los glifos están dentro antes de dar por buena la
   fuente — el primer intento produjo un archivo con las letras y ningún icono. */
@font-face {
  font-family: 'Material Symbols Outlined';
  src: url('/fonts/material-symbols.woff2?v=2') format('woff2');
  font-weight: 100 700;
  font-style: normal;
  font-display: block;   /* block y no swap: un icono a medias es un jeroglífico */
}

/* ── Capa UX v2 ───────────────────────────────────────────────────────────
   Manrope lleva el cuerpo, los botones y las cifras. Petrona y Urbanist son
   las del tema Pétalo, que tiene tipografía propia.
   Fraunces (los titulares) NO se declara aquí: ya viene en `fuentes.css`. */
@font-face {
  font-family: 'Manrope';
  src: url('/fonts/manrope.woff2') format('woff2-variations'),
       url('/fonts/manrope.woff2') format('woff2');
  font-weight: 400 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Petrona';
  src: url('/fonts/petrona.woff2') format('woff2-variations'),
       url('/fonts/petrona.woff2') format('woff2');
  font-weight: 400 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Urbanist';
  src: url('/fonts/urbanist.woff2') format('woff2-variations'),
       url('/fonts/urbanist.woff2') format('woff2');
  font-weight: 400 700; font-style: normal; font-display: swap;
}

/* La CLASE, no solo la fuente. Esto lo traía la hoja de Google —que además de
   la @font-face define `.material-symbols-outlined`—, y al quitar el enlace
   nadie le decía al <span> qué tipografía usar: seguía saliendo la palabra
   aunque la fuente estuviera cargada. `admin.css` solo ajustaba los ejes
   variables, nunca la familia.
   `font-feature-settings: 'liga'` es lo que convierte «delete» en el dibujo. */
.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}
