/* NAVBAR PRIMÁRIA — vermelha, sempre no topo */
.navbar-principal {
    position: relative;
    z-index: 20;
    background: #1a1a1a;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 24px;
    border-bottom: 2px solid #ffb400;
    box-shadow: 0 4px 18px rgba(255, 180, 0, 0.12);
}
.navbar-principal .brand-link {
    position: absolute;
    left: 24px;
    top: 50%;
    transform: translateY(-50%);
    color: #fff;
    font-weight: 900;
    letter-spacing: 2px;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
}
.navbar-principal .brand-link::before {
    content: '⚡';
    filter: drop-shadow(0 0 4px #ffb400);
}
.nav-principal-list { display: flex; gap: 12px; list-style: none; margin: 0; padding: 0; }
.nav-principal-list .nav-link {
    color: #ccc;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.85rem;
    padding: 6px 18px;
    border: 1px solid #444;
    border-radius: 20px;
    transition: 0.2s ease;
}
.nav-principal-list .nav-link:hover,
.nav-principal-list .nav-link.show {
    background: #ffb400;
    color: #000;
    border-color: #ffb400;
}

/* Dropdown "Campeonatos" no mesmo padrão visual do seletor de campeonato da subnav */
.navbar-principal .dropdown-menu {
    background: #222;
    border: 1px solid #444;
    border-radius: 6px;
    padding: 6px 0;
    margin-top: 12px;
    min-width: 240px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.5);
}
.navbar-principal .dropdown-item {
    color: #ccc !important;
    font-weight: 600;
    font-size: 0.85rem;
    padding: 9px 20px;
}
.navbar-principal .dropdown-item:hover,
.navbar-principal .dropdown-item:focus {
    background: #333;
    color: #ffb400 !important;
}
.navbar-principal .dropdown-item.disabled { color: #555 !important; opacity: 0.6; }

/* SUB-NAV — escura/dourada, só aparece dentro do campeonato */
.subnav-campeonato {
    background: #1a1a1a;
    border-bottom: 2px solid #ffb400;
    padding: 14px 20px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
}
.subnav-campeonato .dropdown-camp { justify-self: start; }
.subnav-campeonato .subnav-tabs { justify-self: center; }
.subnav-campeonato .subnav-retorno { justify-self: end; }

@media (max-width: 900px) {
    .subnav-campeonato { grid-template-columns: 1fr; justify-items: center; text-align: center; }
    .subnav-campeonato .dropdown-camp,
    .subnav-campeonato .subnav-tabs,
    .subnav-campeonato .subnav-retorno { justify-self: center; }
}
.subnav-titulo { color: #ffb400; font-weight: bold; text-transform: uppercase; letter-spacing: 1px; }

/* Seletor de campeonato embutido no título da subnav */
.dropdown-camp { position: relative; }
.subnav-titulo-link {
    background: none;
    border: none;
    color: #ffb400;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1rem;
    cursor: pointer;
    padding: 4px 0;
    display: flex;
    align-items: center;
    gap: 6px;
}
.subnav-titulo-link .caret { font-size: 0.7rem; transition: transform 0.2s; }
.dropdown-camp.open .caret { transform: rotate(180deg); }
.subnav-camp-menu {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 240px;
    background: #222;
    border: 1px solid #444;
    border-radius: 6px;
    list-style: none;
    margin: 0;
    padding: 6px 0;
    z-index: 50;
    box-shadow: 0 8px 20px rgba(0,0,0,0.5);
}
.dropdown-camp.open .subnav-camp-menu { display: block; }
.subnav-camp-menu li a {
    display: block;
    padding: 8px 16px;
    color: #ccc;
    text-decoration: none;
    font-size: 0.85rem;
}
.subnav-camp-menu li a:hover { background: #333; color: #ffb400; }
.subnav-camp-empty { display: block; padding: 8px 16px; color: #666; font-size: 0.8rem; }
.subnav-tabs { display: flex; gap: 8px; }
.subnav-tab {
    color: #ccc; text-decoration: none; padding: 6px 16px;
    border: 1px solid #444; border-radius: 20px; font-size: 0.85rem;
    text-transform: uppercase; font-weight: bold;
}
.subnav-tab.active { background: #ffb400; color: #000; border-color: #ffb400; }
.subnav-tab:hover:not(.active) { border-color: #ffb400; color: #ffb400; }

/* Links de retorno — aumentados de 0.8rem para 0.95rem e com mais destaque */
.subnav-retorno { display: flex; gap: 20px; }
.subnav-retorno a {
    color: #bbb;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 600;
}
.subnav-retorno a:hover { color: #ffb400; }
