/* Tipografia autohospedada (mismo criterio que Tailwind/Alpine — sin CDN) */
@font-face {
    font-family: 'Fraunces';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('/static/fonts/fraunces-variable.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122;
}
@font-face {
    font-family: 'IBM Plex Sans';
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url('/static/fonts/plex-sans-variable.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122;
}
@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/static/fonts/plex-mono-400-normal.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122;
}
@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('/static/fonts/plex-mono-500-normal.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122;
}

:root {
    /* Neutros fijos — identidad de PH Agent, igual en todos los tenants */
    --color-bg: #F7F5F1;
    --color-surface: #FFFFFF;
    --color-border: #E4E0D8;
    --color-ink: #22201C;
    --color-ink-muted: #6B655C;

    /* Estados fijos y reservados — nunca los sobreescribe un tenant, para que
       "en mora"/"alerta" nunca se confundan con el acento elegido por un tenant. */
    --color-success: #1F7A4D;
    --color-success-bg: #E8F3EC;
    --color-warning: #B7791F;
    --color-warning-bg: #FBF0DD;
    --color-danger: #B3261E;
    --color-danger-bg: #FBE9E7;

    /* Acento por tenant — sobreescrito por base.html con el valor guardado en
       tenants.metadata.color_acento (ver Maestro). Este es el default de fábrica. */
    --color-acento: #0F5C56;
    --color-acento-fg: #FFFFFF;

    --font-display: 'Fraunces', ui-serif, serif;
    --font-body: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
    --font-mono: 'IBM Plex Mono', ui-monospace, monospace;
}

/* Tipografia global — solo tipografia en esta fase, los colores de fondo
   siguen siendo los de Tailwind hasta que se confirme el rediseño visual
   (fase 2, pendiente). Selector de elemento (no utilidad de Tailwind) para
   que aplique en todo el panel sin tocar cada template. */
body {
    font-family: var(--font-body);
}
h1, h2, h3, h4 {
    font-family: var(--font-display);
}

/* Cifras monetarias — el elemento de firma visual: la misma tipografia y el
   mismo tratamiento numerico en cada pantalla que muestra un valor en pesos. */
.cifra {
    font-family: var(--font-display);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

/* Red de seguridad: una tabla con table-layout:auto puede ignorar width:100%
   y crecer más allá de su contenedor si el contenido no cabe (ej. texto libre
   largo, o el cambio de fuente de esta sesión ensanchando columnas que antes
   apenas cabían) — max-width sí lo respeta el algoritmo de layout de tablas,
   a diferencia de width. Complementa (no reemplaza) los div.overflow-x-auto
   ya usados en cada tabla ancha del panel. */
table { max-width: 100%; }

/* Sidebar: scroll sin barra visible */
.sidebar-scroll { scrollbar-width: none; -ms-overflow-style: none; }
.sidebar-scroll::-webkit-scrollbar { display: none; }

@media print {
    aside, header, nav, .print-hide { display: none !important; }
    main { padding: 0 !important; margin: 0 !important; }
    body { background: white !important; }
    .flex.h-screen { display: block !important; height: auto !important; overflow: visible !important; }
    .flex-1.overflow-auto { overflow: visible !important; }
    a[href="/app/personas"] { display: none !important; }
    form[onsubmit*="confirm"] { display: none !important; }
    button[type="submit"], [x-data] [x-on\:click], button[onclick*="modal"] { display: none !important; }
}