/*
 * Sistema tipográfico global — Inter
 * Fuente única para todo el sistema (vistas TailAdmin y vistas Bootstrap/Argon legacy).
 * Cargar DESPUÉS de cualquier otra hoja de estilos (Bootstrap, Argon, Google Fonts) para ganar en cascada.
 */

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/Inter/Inter-VariableFont_opsz,wght.ttf') format('truetype-variations'),
         url('../fonts/Inter/Inter-VariableFont_opsz,wght.ttf') format('truetype');
}
@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/Inter/Inter-Italic-VariableFont_opsz,wght.ttf') format('truetype-variations'),
         url('../fonts/Inter/Inter-Italic-VariableFont_opsz,wght.ttf') format('truetype');
}

:root {
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --bs-body-font-family: var(--font-primary);
    --bs-font-sans-serif: var(--font-primary);
}

html, body {
    font-family: var(--font-primary) !important;
}

/* Sobreescribe cualquier otro tipo de letra heredado de Bootstrap/Argon/plugins */
body, button, input, select, textarea, .btn, .form-control, .card, .modal, .dropdown-menu,
h1, h2, h3, h4, h5, h6, p, span, a, label, table, th, td {
    font-family: var(--font-primary);
}

/*
 * ─── Íconos FontAwesome: sin regla propia, a propósito ─────────────────────
 * FontAwesome (Kit en kit.fontawesome.com) ya declara su propia
 * `font-family` con !important sobre selectores de CLASE (.fa, .fas, .far,
 * .fab, .fa-solid, etc.). Una regla de clase siempre gana en especificidad
 * sobre nuestro `body/html { font-family: Inter !important }` (selector de
 * ETIQUETA), sin importar el orden de carga — así que los íconos ya quedan
 * intactos sin que nosotros toquemos nada aquí.
 *
 * NO agregar aquí una regla `.fa, .fas, ... { font-family: ... }` "protectora":
 * ya se probó y rompe los íconos, porque adivinar el nombre de familia
 * ("Font Awesome 6 Free" vs "Pro"/"Duotone"/"Sharp", según el Kit) puede no
 * coincidir con la que el Kit realmente sirve, y al empatar en especificidad
 * con la regla real de FontAwesome, la nuestra puede ganar por orden de
 * carga y mostrar el glifo equivocado (o ninguno).
 * ───────────────────────────────────────────────────────────────────────────
 */

/*
 * ─── Escala tipográfica ─────────────────────────────────────────────────────
 * Nivel            | Tamaño          | Peso | Transformación          | Color
 * H1 (Page Title)  | 1.35rem (21.6px)| 800  | Ninguna                 | #0f172a
 * H2 (Card Title)  | 1.05–1.15rem    | 700  | Ninguna                 | #0f172a
 * H3 / Dialog Title| 0.95rem (15.2px)| 700  | Ninguna                 | #0f172a
 * Field Labels     | 0.70–0.74rem    | 700  | uppercase, ls .04em     | #475569
 * Body / Table Cell| 0.80–0.83rem    | 500–600 | Ninguna              | #334155
 * Micro / Subtitles| 0.72–0.78rem    | 500  | Ninguna                 | #64748b
 *
 * Se exponen como clases de utilidad (no se fuerza sobre h1/h2/h3/td crudos
 * para no romper tamaños/colores ya definidos en vistas existentes).
 * ───────────────────────────────────────────────────────────────────────────
 */
.tw-h1 {
    font-size: 1.35rem;
    font-weight: 800;
    color: #0f172a;
}
.tw-h2 {
    font-size: 1.1rem;
    font-weight: 700;
    color: #0f172a;
}
.tw-h3 {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
}
.tw-field-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #475569;
}
.tw-body-text {
    font-size: 0.815rem;
    font-weight: 500;
    color: #334155;
}
.tw-micro {
    font-size: 0.75rem;
    font-weight: 500;
    color: #64748b;
}
