/* ===============================
   VARIÁVEIS DE COR
   =============================== */
:root {
    --azul-escuro: #0F2A44;
    --azul-hover: #163D63;
    --azul-medio: #1F6FA9;
    --azul-claro: #EAF2F8;
    --cinza-claro: #F6F7F8;
    --cinza-texto: #2E2E2E;
}

/* ===============================
   BASE
   =============================== */
body {
    color: var(--cinza-texto);
    line-height: 1.7;
    background-color: #FFFFFF;
}

/* ===============================
   HEADER
   =============================== */
header {
    background-color: var(--cinza-claro) !important;
    border-bottom: 1px solid #E1E4E8;
}

/* ===============================
   MENU / NAVBAR
   =============================== */
.menu {
    background-color: var(--azul-escuro) !important;
}

.menu a {
    color: var(--cinza-claro) !important;
    transition: color 0.2s ease-in-out;
}

.menu a:hover {
    color: #A8C7E8 !important;
}

/* ===============================
   FOOTER
   =============================== */
footer {
    background-color: var(--azul-escuro) !important;
    padding: 50px 0;
    margin-top: 100px;
    color: var(--cinza-claro);
}

/* ===============================
   BOTÕES
   =============================== */

/* Botão azul principal (usado no modal "Close") */
.btn-blue {
    background-color: var(--azul-escuro) !important;
    border-color: var(--azul-escuro) !important;
    color: #FFFFFF !important;
    font-weight: 500;
    transition: background-color 0.2s ease-in-out,
                border-color 0.2s ease-in-out;
}

.btn-blue:hover {
    background-color: var(--azul-hover) !important;
    border-color: var(--azul-hover) !important;
    color: #FFFFFF !important;
}

/* Botão secundário (outline) */
.btn-outline-azul {
    background-color: transparent !important;
    border: 1px solid var(--azul-medio) !important;
    color: var(--azul-medio) !important;
    transition: background-color 0.2s ease-in-out,
                color 0.2s ease-in-out;
}

.btn-outline-azul:hover {
    background-color: var(--azul-claro) !important;
    color: var(--azul-escuro) !important;
}

/* ===============================
   TEXTO
   =============================== */
.texto-azul {
    color: var(--azul-escuro) !important;
}

.texto-azul-medio {
    color: var(--azul-medio) !important;
}

.texto-claro {
    color: var(--cinza-claro) !important;
}

/* Compatibilidade com classe antiga */
.bege {
    color: var(--cinza-claro) !important;
}

/* ===============================
   BACKGROUNDS AUXILIARES
   =============================== */
.bg-azul-claro {
    background-color: var(--azul-claro) !important;
}

/* ===============================
   POPOVER (Bootstrap)
   =============================== */
.custom-popover {
    --bs-popover-max-width: 220px;
    --bs-popover-border-color: var(--azul-medio);
    --bs-popover-header-bg: var(--azul-escuro);
    --bs-popover-header-color: #FFFFFF;
    --bs-popover-body-padding-x: 1rem;
    --bs-popover-body-padding-y: .5rem;
}
.btn-outline-azul {
    background-color: transparent !important;
    border: 2px solid #0F2A44 !important; /* CONTORNO */
    color: #0F2A44 !important;
    font-weight: 500;
}

.btn-outline-azul:hover {
    background-color: #0F2A44 !important;
    color: #FFFFFF !important;
}
.documentation-btn {
    background-color: transparent !important;
    border: 2px solid #0F2A44 !important; /* BORDA VISÍVEL */
    color: #0F2A44 !important;
}

.documentation-btn:hover,
.documentation-btn:focus {
    background-color: #0F2A44 !important;
    color: #FFFFFF !important;
    border-color: #0F2A44 !important;
}
.search-row:hover {
    background: #f8f9fa;
}

.search-row {
    transition: background 0.15s ease;
}