/* Reset básico */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Encabezado */
header {
  background-color: #ffffff;
  color: white;
  font-family: Arial, sans-serif;
  padding-bottom: 0%;
}

.logo img {
  width: 250px;
  height: auto;
  object-fit: contain;
}


/* Footer */
footer {
  background-color:#ffffff;
  color:rgb(0, 0, 0);
  text-align:center;
  padding:20px;
  margin-top:40px;
  font-family:'Lato', sans-serif;
}
footer a {
  color:#000000;
  text-decoration:underline;
  margin-left:10px;
}

     /* === Configuraciones del menú Bootstrap === */
/* Tamaño del encabezado */
header {
  background-color: #ffffff;
  padding: 20px 0; /* Aumenta el espacio vertical */
}

.navbar {
  min-height: 100px; /* altura mínima del header */
}

.navbar-brand img {
  height: 80px; /* Ajusta el tamaño del logo */
  width: auto;
}



/* Color de los enlaces del menú */
.navbar-dark .navbar-nav .nav-link {
  background-color: #6f752c; /* 💚 color de tus botones */
  color: #fff !important;
  margin: 0 5px;
  border-radius: 4px;
  padding: 8px 16px;
  transition: background-color 0.3s ease;
}

/* Hover (al pasar el mouse) */
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  background-color: #34495e !important; /* gris-azulado de hover */
  color: #fff !important;
}

/* Dropdown menú */
.dropdown-menu {
  background-color: #01200b; /* verde oscuro original */
}

.dropdown-menu .dropdown-item {
  color: #fff;
}

.dropdown-menu .dropdown-item:hover {
  background-color: #bdc3c7;
  color: #000;
}

/* 🔧 Submenús siempre dentro de la pantalla */
.dropdown-menu {
  background-color: #6f752c;  /*aqui se cambia el color de los submenussss*/
  border-radius: 4px;
  color: #fff;
  border: none;
  min-width: 180px;
  white-space: nowrap;
  overflow: hidden;
}

/* Asegura que los submenús a la derecha no se salgan */
.nav-item.dropdown:last-child .dropdown-menu,
.navbar-nav > li:last-child .dropdown-menu {
  left: auto !important;
  right: 0 !important; /* se abre hacia la izquierda */
  transform: none !important;
}

/* Hover */
.dropdown-item {
  color: #fff;
}

.dropdown-item:hover {
  background-color: #bdc3c7;
  color: #000;
}

/* Estilo para el enlace activo del menú */
.nav-link.active {
  background-color: #636363 !important; /* mismo fondo que tenías */
  color: white !important;
  font-weight: bold;
  border-radius: 4px;
}
/*  Estilo para el enlace de activo del submenu */
.dropdown-item.active {
 background-color: #636363 !important; /* mismo fondo que tenías */
  color: white !important;
  font-weight: bold;
  border-radius: 4px;

}

/* ================================
   ⭐ MENÚ RESPONSIVO (MÓVIL)
   Color verde #6f752c
   ================================ */

/* Fondo del menú cuando se despliega */
.navbar-collapse {
  background-color: #ffffff !important; /* fondo blanco */
  padding: 15px 0;
}

/* Enlaces dentro del menú */
.navbar-nav .nav-link {
  background-color: #6f752c !important;
  color: #ffffff !important;
  margin: 5px 10px;
  border-radius: 4px;
  padding: 10px 15px;
  text-align: center;
}

/* Hover de enlaces */
.navbar-nav .nav-link:hover {
  background-color: #505525 !important;
  color: #ffffff !important;
}

/* Botón hamburguesa (fondo) */
.navbar-dark .navbar-toggler {
  background-color: #ffffff !important; /* fondo blanco */
  border: 2px solid #6f752c !important;
  border-radius: 6px;
  padding: 6px 10px;
}

/* Ícono de las 3 rayitas (verde) */
.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%236f752c' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(111,117,44,1)' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* Fondo del dropdown en móvil */
.dropdown-menu {
  background-color: #6f752c !important;
  border-radius: 4px;
  border: none;
  padding: 0;
}

/* Items del dropdown */
.dropdown-item {
  color: #ffffff !important;
  padding: 10px 15px;
  text-align: left;
}

/* Hover del dropdown */
.dropdown-item:hover {
  background-color: #505525 !important;
  color: #ffffff !important;
}

/* Item activo */
.dropdown-item.active {
  background-color: #636363 !important; /* mismo fondo que tenías */
  color: #ffffff !important;
}

/* Link activo principal */
.nav-link.active {
  background-color: #636363 !important; /* mismo fondo que tenías */

  color: #ffffff !important;
}



