@font-face {
    font-family: 'Archivo';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    font-stretch: 62% 125%;
    src: url("../../fonts/archivo-latin-standard-normal-Wa7z_Iw.woff2") format('woff2-variations');
}

/* Tokens de Afila (DESIGN.md › Colors). :root = panel (oscuro); .theme-reserva = reserva del cliente (claro). */
:root {
    --brand-bg: #16171A;
    --brand-surface: #1F2125;
    --brand-raised: #26292E;
    --brand-line: #2E3136;
    --brand-edge: #6B6F78; /* contorno de controles: 3,6:1 sobre el fondo, 3,2:1 sobre superficies */
    --brand-error: #FF8A7A;
    --brand-text: #F2F2F0;
    --brand-muted: #A2A4AB;
    --brand-accent: #3FD69B;
    --brand-accent-tint: #1B2C25;
    --brand-on-accent: #06261A;
    --brand-warning: #F2C14E;
    --brand-accent-ink: #3FD69B;
    --brand-warning-ink: #F2C14E;
    --brand-focus: #3FD69B;
    --brand-shadow: rgb(0 0 0 / 0.55);
    --brand-font: 'Archivo', system-ui, sans-serif;
    color-scheme: dark;
}

/* Reserva (claro): el menta solo rellena; como texto, contorno o foco usa --brand-accent-ink (5,7:1). */
.theme-reserva {
    --brand-bg: #F3F4F2;
    --brand-surface: #FFFFFF;
    --brand-raised: #E9EAE7;
    --brand-line: #D9DAD6;
    --brand-edge: #7A7E87;
    --brand-error: #B42318;
    --brand-text: #16171A;
    --brand-muted: #575A61;
    --brand-accent: #3FD69B;
    --brand-accent-tint: #DDF5E9;
    --brand-on-accent: #06261A;
    --brand-warning: #A86F00;
    --brand-accent-ink: #0A6E4C;
    --brand-warning-ink: #8A5300;
    --brand-focus: #0A6E4C;
    --brand-shadow: rgb(22 23 26 / 0.18);
    color-scheme: light;
}