/* TIPOGRAFÍA CENTRAL DEL ERP — edición manual.
   1. Familia: cambiar --erp-font-family.
   2. Escala compatible: mantiene los valores anteriores para pantallas aún no adaptadas.
   3. Roles: botones, navegación y campos son independientes aunque compartan tamaño.
   4. Escala común de módulos adaptados: editar su bloque, no el CSS local.
   5. Móvil: revisar siempre las sobrescrituras hasta 620px.
   Guía centralizada: harness/context/ui/guia-tipografia-erp.md (desde la raíz de la solución). Valores rem equivalen a px con raíz de 16px.
   Este archivo no descarga fuentes ni ejecuta comprobadores. */
:root {
    /* FAMILIA: una sola fuente de verdad para HTML y controles. */
    --erp-font-family: "Segoe UI", Arial, sans-serif;

    /* Roles tipográficos compartidos; importes separados para conservar su jerarquía financiera. */
    --erp-font-size-micro: .625rem; /* 10px con raiz de 16px */
    --erp-font-size-caption: .6875rem; /* 11px con raiz de 16px */
    --erp-font-size-label: .6875rem; /* 11px con raiz de 16px */
    --erp-font-size-body: .75rem; /* 12px con raiz de 16px */
    --erp-font-size-section-title: 1rem; /* 16px con raiz de 16px */
    --erp-font-size-page-title: 1.125rem; /* 18px con raiz de 16px */
    --erp-font-size-hero-title: 1.4375rem; /* 23px con raiz de 16px */
    --erp-font-size-financial: 1.125rem; /* 18px con raiz de 16px */
    --erp-font-size-financial-emphasis: 1.375rem; /* 22px con raiz de 16px */
    --erp-font-size-financial-compact: 1.0625rem; /* 17px con raiz de 16px */
    --erp-font-size-financial-dock-label: clamp(.625rem, 2.6vw, .75rem);
    --erp-font-size-financial-dock-value: clamp(.6875rem, 3.5vw, .9375rem);
    --erp-font-size-financial-dock-emphasis: clamp(.8125rem, 4vw, 1.125rem);
    --erp-line-height-micro: 1.4;
    --erp-line-height-caption: 1.4;
    --erp-line-height-label: 1.4;
    --erp-line-height-body: 1.5;
    --erp-line-height-heading: 1.25;
    --erp-line-height-hero: 1.15;

    /* PESOS: cuerpo normal; etiquetas/acciones; títulos y datos destacados. */
    --erp-font-weight-body: 400;
    --erp-font-weight-label: 600;
    --erp-font-weight-action: 600;
    --erp-font-weight-heading: 650;

    /* ROLES DE CONTROLES: valor compatible por defecto, consumidos por los módulos adaptados.
       Cambiar action afecta botones; navigation al regreso; field a inputs/select/textarea. */
    --erp-font-size-action: var(--erp-font-size-body);
    --erp-font-size-navigation: var(--erp-font-size-label);
    --erp-font-size-field: var(--erp-font-size-body);
}

/* ESCALA COMPATIBLE MÓVIL: mismos valores trasladados desde tokens.css. */
@media (max-width: 620px) {
    /* Ajusta los roles de lectura en pantallas pequeñas; las etiquetas micro siguen siendo auxiliares. */
    :root {
        --erp-font-size-caption: .75rem; /* 12px con raiz de 16px */
        --erp-font-size-label: .75rem; /* 12px con raiz de 16px */
        --erp-font-size-body: .875rem; /* 14px con raiz de 16px */
        --erp-font-size-section-title: .9375rem; /* 15px con raiz de 16px */
        --erp-font-size-page-title: 1rem; /* 16px con raiz de 16px */
        --erp-font-size-hero-title: 1.3125rem; /* 21px con raiz de 16px */
        --erp-font-size-financial: 1.0625rem; /* 17px con raiz de 16px */
        --erp-font-size-financial-emphasis: 1.3125rem; /* 21px con raiz de 16px */
        --erp-font-size-financial-compact: 1rem; /* 16px con raiz de 16px */
    }
}

/* ESCALA COMÚN APROBADA: módulos adaptados y sus listados.
   Productos adopta estos mismos roles en su rediseño, sin duplicar tamaños locales.
   Editar estos roles centralmente; las pantallas ajenas mantienen la escala compatible. */
.factura-page,
.permisos-page,
.cambio-page,
.cambiolista-page,
.cargacamion-page,
.cargacamionlista-page,
.productos-page {
    /* LECTURA Y DATOS */
    --erp-font-size-body: 0.875rem; /* 14px con raíz de 16px */
    --erp-font-size-label: 0.8125rem; /* 13px con raíz de 16px */
    --erp-font-size-caption: 0.75rem; /* 12px con raíz de 16px */
    --erp-font-size-micro: 0.6875rem; /* 11px con raíz de 16px */

    /* CONTROLES Y NAVEGACIÓN: editar cada función por separado. */
    --erp-font-size-action: 0.875rem; /* 14px con raíz de 16px */
    --erp-font-size-navigation: 0.875rem; /* 14px con raíz de 16px */
    --erp-font-size-field: 0.875rem; /* 14px con raíz de 16px */

    /* TÍTULOS: conserva el título de navbar aprobado; sección superior a body. */
    --erp-font-size-section-title: 1.125rem; /* 18px con raíz de 16px */
    --erp-font-size-page-title: 1.25rem; /* 20px con raíz de 16px */
    --erp-font-size-hero-title: 1.4375rem; /* 23px con raíz de 16px */

    /* IMPORTES: normal, énfasis y vista compacta. */
    --erp-font-size-financial: 1.125rem; /* 18px con raíz de 16px */
    --erp-font-size-financial-emphasis: 1.375rem; /* 22px con raíz de 16px */
    --erp-font-size-financial-compact: 1.0625rem; /* 17px con raíz de 16px */
}

/* ESCALA COMÚN MÓVIL: campos de 16px sin agrandar toda la lectura.
   700px cubre el layout móvil de Facturación; rem respeta preferencias del navegador. */
@media (max-width: 700px) {
.factura-page,
.permisos-page,
.cambio-page,
.cambiolista-page,
.cargacamion-page,
.cargacamionlista-page,
.productos-page {
    --erp-font-size-field: 1rem; /* 16px con raíz de 16px */
    --erp-font-size-hero-title: 1.3125rem; /* 21px */
    --erp-font-size-financial: 1.25rem; /* 20px */
    --erp-font-size-financial-compact: 1.125rem; /* 18px */
}
    /* Campo, solo Facturación: producto e importes prioritarios, sin reducirlos por viewport. */
    .factura-page {
        --erp-font-size-product: .9375rem; /* 15px */
        --erp-font-size-financial-dock-label: .75rem; /* 12px */
        --erp-font-size-financial-dock-value: .875rem; /* 14px */
        --erp-font-size-financial-dock-emphasis: 1.25rem; /* 20px */
    }
}

/* APLICACIÓN DE FAMILIA: no fuerza el tamaño de pantallas antiguas ni impresión. */
html,
body {
    font-family: var(--erp-font-family);
}

button,
input,
select,
textarea {
    font-family: inherit;
}
