/* ============================================================
    Estilo da Barra de Navegação (navbar.css)
    ============================================================ */

/* Navbar Principal */
.navbar-custom {
  background-color: var(--bg-1);
  box-shadow: var(--box-shadow);
  transition: all 0.3s ease-in-out;
  padding: 0.8rem 1rem;
  position: sticky; /* Mudado de fixed para sticky: resolve a faixa preta e mantém o menu no topo */
  top: 0;
  width: 100%;
  z-index: 1000;
}

/* Marca / Logo */
.navbar-custom .navbar-brand {
  color: var(--principal);
  font-weight: 700;
  font-size: 1.5rem;
  transition: transform 0.3s ease;
}

.navbar-custom .navbar-brand:hover {
  color: var(--principal);
  transform: scale(1.02);
}

/* Ajuste de tamanho para a imagem da logo */
.navbar-custom .navbar-brand img {
  height: 40px;
  width: auto;
}

/* Links de Navegação */
.navbar-custom .nav-link {
  color: var(--text-1);
  font-weight: 500;
  margin: 0 0.2rem;
  border-bottom: 2px solid transparent;
  transition: color 0.3s ease, border-bottom-color 0.3s ease;
}

.navbar-custom .nav-link:hover,
.navbar-custom .nav-link.active {
  color: var(--principal);
  border-bottom-color: var(--principal);
}

/* Botão Mobile (Toggler) */
.navbar-custom .navbar-toggler {
  border-color: transparent;
  padding: 0.5rem;
}

/* Ícone do menu hambúrguer com a cor --principal (#d6162f = 214, 22, 47) */
.navbar-custom .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(214, 22, 47, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Dropdown Menu */
.navbar-custom .dropdown-menu {
  background-color: var(--bg-1);
  border: none;
  border-radius: 8px;
  box-shadow: var(--box-shadow);
}

.navbar-custom .dropdown-item {
  color: var(--text-1);
  padding: 0.7rem 1.5rem;
  transition: all 0.2s;
}

.navbar-custom .dropdown-item:hover {
  background-color: var(--principal);
  color: #fff;
  padding-left: 1.8rem; /* Efeito de deslocamento suave */
}