/*
    Tokens de diseño Progre+
    ------------------------
    Recogen la paleta y las escalas que la aplicación ya usa, para poder
    referenciarlas por nombre en vez de repetir el valor hexadecimal.
    Este archivo NO cambia nada por sí solo: solo declara variables.
*/

:root {
    /* Marca */
    --pgs-azul: #003386;
    --pgs-azul-oscuro: #063b70;
    --pgs-azul-profundo: #0a4175;
    --pgs-azul-suave: #e8eef7;

    /* Estado */
    --pgs-exito: #4caf50;
    --pgs-exito-vivo: #17ff44;
    --pgs-error: #f44336;
    /* El rojo de estado no alcanza contraste como texto sobre blanco: esta es su variante legible. */
    --pgs-error-texto: #b3261e;
    --pgs-aviso: #ff9800;
    --pgs-info: #00bcd4;

    /* Neutros */
    --pgs-blanco: #ffffff;
    --pgs-gris-borde: #d2d2d2;
    --pgs-gris-fondo: #f2f3f3;
    --pgs-gris-texto: #333333;
    --pgs-gris-tenue: #6b7280;

    /* Escala de espaciado (múltiplos de 4px) */
    --pgs-espacio-1: 4px;
    --pgs-espacio-2: 8px;
    --pgs-espacio-3: 12px;
    --pgs-espacio-4: 16px;
    --pgs-espacio-5: 24px;
    --pgs-espacio-6: 32px;

    /* Radios y elevación */
    --pgs-radio: 4px;
    --pgs-radio-grande: 8px;
    --pgs-sombra: 0 1px 3px rgba(0, 0, 0, .12);
    --pgs-sombra-elevada: 0 4px 12px rgba(0, 0, 0, .15);

    /* Foco: se usa para que el teclado tenga un indicador visible */
    --pgs-foco: #1a6dff;
    --pgs-foco-grosor: 3px;

    /* Transición estándar */
    --pgs-transicion: 150ms ease-in-out;
}