/* Tipografia de Rservasroma.
 *
 * Inter (SIL Open Font License 1.1, https://github.com/rsms/inter) servida
 * desde el propio repo. Es un subset latino de la version variable: 48 KB,
 * frente a los 269 KB de vendor/lucide/lucide.woff2 que la app ya cargaba.
 * Nada de Google Fonts: la PWA funciona offline y sus usuarias pagan datos,
 * asi que la fuente se precachea en sw.js igual que el resto del vendor.
 *
 * Esta hoja va en TODAS las paginas, tambien en las que no usan Tailwind
 * (app-clientes, offline-panel, 404), para que la tipografia sea la misma
 * en la app, en el splash del APK y en las pantallas de error.
 */

@font-face {
    font-family: 'Inter';
    /* Rango recortado al que se usa en la app: font-medium(500),
       font-semibold(600), font-bold(700) y algun extrabold(800). */
    font-weight: 400 800;
    font-style: normal;
    font-display: swap;
    src: url('../vendor/fonts/inter-latin.woff2') format('woff2');
    /* Mismo subset que sirve Google para 'latin': cubre el espanol completo
       (acentos, enie, apertura de interrogacion) sin arrastrar cirilico ni
       griego. El subset latin-ext pesaba 85 KB mas y aqui no hace falta. */
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
        U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --font-brand: 'Inter', system-ui, -apple-system, BlinkMacSystemFont,
        'Segoe UI', Roboto, sans-serif;
}

html,
body {
    font-family: var(--font-brand);

    /* Sin esto Inter se ve engordada en macOS/iOS: el render por defecto de
       WebKit aplica un stem darkening que en pantallas retina sobra. */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    /* Cifras de ancho fijo en toda la app. Esto es una decision deliberada:
       casi todo numero que se muestra aqui es una hora (09:00 / 10:30), un
       precio o un contador, y con cifras proporcionales las columnas de las
       listas de citas bailan de fila en fila. Inter tiene tabulares bien
       dibujadas, asi que el coste en texto corrido es despreciable.
       Si alguna vez estorba, usar .cifras-proporcionales. */
    font-variant-numeric: tabular-nums;

    /* Ligaduras y alternativas contextuales de Inter. */
    font-feature-settings: 'liga' 1, 'calt' 1;
    font-optical-sizing: auto;
}

/* Escape para textos donde las cifras tabulares no aportan (parrafos largos). */
.cifras-proporcionales {
    font-variant-numeric: normal;
}

/* Los titulares en sans-serif necesitan tracking negativo para no verse
   sueltos; cuanto mas grande el texto, mas se nota. Los tamanos de cuerpo
   se dejan intactos: apretarlos empeora la lectura en movil. */
h1,
h2,
h3,
.text-2xl,
.text-3xl,
.text-4xl,
.text-5xl {
    letter-spacing: -0.021em;
}

.text-xl {
    letter-spacing: -0.014em;
}

.text-lg {
    letter-spacing: -0.008em;
}

/* Evita que un titular deje una palabra huerfana sola en la ultima linea.
   Los navegadores que no lo soportan simplemente lo ignoran. */
h1,
h2,
h3 {
    text-wrap: balance;
}

/* No se pone aqui un letter-spacing automatico para .uppercase: los
   componentes ya usan tracking-wide/tracking-wider de forma explicita (11
   veces) y una regla como .uppercase.text-xs tendria mas especificidad, asi
   que ganaria a la clase que el componente pidio a proposito. */