@font-face {
    font-family: "Outfit";
    src: url("/fonts/outfit/static/Outfit-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Outfit";
    src: url("/fonts/outfit/static/Outfit-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

:root {
    --color-verde-institucional: #005f1d;
    --color-verde-oscuro: #003b14;
    --color-verde-suave: #e6efe8;
    --color-amarillo-institucional: #ffff00;
    --color-rojo-institucional: #ff0000;
    --color-piel: #ffcc99;
    --color-marron: #663300;
    --color-gris-claro: #d3d3d3;
    --color-blanco: #ffffff;
    --color-negro: #000000;
    --color-fondo-global: #f8f9fa;
    --color-texto-global: #212529;
    --color-texto-panel-principal: #0b3a1b;
    --color-texto-neutro-principal: #0f172a;
    --color-texto-neutro-secundario: #1f2937;
    --color-texto-neutro-descriptivo: #374151;
    --color-estado-rosa: #be185d;
    --color-estado-celeste: #0369a1;
    --color-estado-ambar: #b45309;
    --color-verde-hover: #004819;
    --color-peligro: #dc3545;
    --color-estado-online: #00c853;
    --color-notificacion-exito-fondo: #e6f4ea;
    --color-notificacion-error-fondo: #fde8e8;
    --color-notificacion-advertencia-fondo: #fff7cc;
    --color-notificacion-info-fondo: #e1f4f8;
    --color-notificacion-advertencia: #b37600;
    --color-notificacion-info: #0b7285;
    --navbar-height: 88px;
}

body {
    font-family: "Outfit", "Roboto", "Segoe UI", Arial, sans-serif;
    background-color: var(--color-fondo-global);
    color: var(--color-texto-global);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

main {
    flex: 1 0 auto;
    width: 100%;
}