/* Paleta da campanha (extraída de identidade_visual/) */
:root {
    --cor-primaria: #0053a5;      /* azul */
    --cor-primaria-escura: #003d7a;
    --cor-destaque: #ff6100;      /* laranja */
    --cor-destaque-escura: #cc4e00;
    --cor-clara: #ffffff;
}

body {
    background-color: #f5f5f5;
}

.bg-campanha {
    background-color: var(--cor-primaria) !important;
}

.navbar {
    position: relative;
    /* altura mínima maior para caber a logo sem ela ser cortada no topo da página */
    min-height: 140px;
}

/* Logo flutuante: fica mais pro lado da área branca do conteúdo do que
   do azul do menu — por isso fica fora do fluxo normal (absolute) e
   ancorada à borda inferior do menu (bottom negativo). */
.navbar-logo-flutuante {
    position: absolute;
    left: 1.5rem;
    bottom: -100px;
    width: 176px;
    height: 176px;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
    z-index: 20;
}

.navbar-conteudo-com-logo {
    padding-left: 220px;
}

.conteudo-principal {
    padding-top: 8rem;
    padding-bottom: 1.5rem;
}

/* --- Celular / tablet (abaixo do breakpoint lg do Bootstrap) --- */
@media (max-width: 991.98px) {
    .navbar {
        min-height: 0;
    }
    /* logo deixa de flutuar: fica pequena, no fluxo, ao lado do botão do menu */
    .navbar-logo-flutuante {
        position: static;
        width: 48px;
        height: 48px;
        bottom: auto;
        left: auto;
        margin: 0 .5rem 0 .25rem;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    }
    .navbar-conteudo-com-logo {
        padding-left: .75rem;
    }
    .conteudo-principal {
        padding-top: 1.25rem;
    }
    .navbar-collapse .navbar-nav .nav-link {
        padding-top: .5rem;
        padding-bottom: .5rem;
    }
}

/* Destaque de página atual no menu: só acende (fica branco cheio), sem traço embaixo */
.navbar .nav-link.active {
    color: var(--cor-clara) !important;
    font-weight: 600;
}

a {
    color: var(--cor-primaria);
}

a:hover {
    color: var(--cor-destaque);
}

/* Botões de ação principal usam o laranja de destaque da campanha */
.btn-primary {
    --bs-btn-bg: var(--cor-destaque);
    --bs-btn-border-color: var(--cor-destaque);
    --bs-btn-hover-bg: var(--cor-destaque-escura);
    --bs-btn-hover-border-color: var(--cor-destaque-escura);
    --bs-btn-active-bg: var(--cor-destaque-escura);
    --bs-btn-active-border-color: var(--cor-destaque-escura);
    --bs-btn-color: var(--cor-clara);
    --bs-btn-hover-color: var(--cor-clara);
    --bs-btn-active-color: var(--cor-clara);
}

.btn-outline-light:hover {
    --bs-btn-hover-color: var(--cor-primaria);
}

.legenda-cor {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}
