/* nav_Bar.css - Compatible con Bootstrap */

/* Reset básico pero sin conflictos con Bootstrap */
*:not(i) {
  font-family: "Poppins", sans-serif;
}

/* Navbar personalizado que NO interfiere con Bootstrap */
.navbar {
  background-color: #F2CC0C !important;
  padding: 1rem 0 !important;
  /* Removido position: fixed para evitar conflictos */
}

/* Logo personalizado */
.navbar-brand img {
  height: 100px !important;
  width: auto !important;
  border-radius: 10px;
  margin-right: 15px;
}

/* Enlaces del navbar */
.navbar-nav .nav-link {
  color: #333 !important;
  font-weight: 600 !important;
  font-size: 1.1rem !important;
  margin: 0 10px !important;
  transition: all 0.3s ease;
}

.navbar-nav .nav-link:hover {
  color: #000 !important;
  border-bottom: 2px solid #333;
  transform: translateY(-2px);
}

/* Botón toggler personalizado */
.navbar-toggler {
  border: 2px solid #333 !important;
  padding: 8px 12px !important;
}

.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%2833, 37, 41, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

.navbar-toggler:focus {
  box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.25) !important;
}

/* Contenido principal - agregar margen si necesitas espacio */
.main-content {
  padding-top: 2rem;
}

/* Responsive adjustments */
@media only screen and (max-width: 991px) {
  .navbar-nav {
    text-align: center;
    padding: 1rem 0;
  }
  
  .navbar-nav .nav-link {
    margin: 5px 0 !important;
    padding: 10px 0 !important;
  }
}

@media only screen and (max-width: 767px) {
  .navbar-brand img {
    height: 45px !important;
  }
  
  .navbar-nav .nav-link {
    font-size: 1rem !important;
  }
}

@media only screen and (max-width: 575px) {
  .navbar {
    padding: 0.5rem 0 !important;
  }
  
  .navbar-brand img {
    height: 40px !important;
  }
}