/* =========================================================
   03_MENU_PRINCIPAL — EST1
   Paso 1: texto blanco + menú centrado
   ========================================================= */

/* 1) Centrar el menú principal
.navbar-nav,
.region-primary-menu .menu,
.region-primary-menu nav ul{
  display: flex !important;
  align-items: center;
  width: 100%;
}
*/

/* 1) Centrar SOLO el menú principal (no tocar otras navbars) */
.region-primary-menu .navbar-nav,
.region-primary-menu .menu,
.region-primary-menu nav ul{
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  width: 100%;
}



/* 2) Texto del menú en blanco */
.navbar-nav .nav-link,
.region-primary-menu a,
.region-primary-menu .menu a{
  color: #ffffff !important;
  font-weight: 600;
}

/* 3) Hover y activo: mantener blanco */
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus,
.navbar-nav .nav-link.is-active,
.region-primary-menu a:hover,
.region-primary-menu a.is-active{
  color: #ffffff !important;
  text-decoration: none;
}

/* =========================================================
   FIX CENTRADO REAL DEL MENÚ PRINCIPAL (Barrio / Bootstrap)
   ========================================================= */

/* 1) El contenedor del menú debe ocupar todo el ancho */
.region-primary-menu .navbar-collapse{
  display: flex !important;
  justify-content: center !important;
}

/* 2) El <ul> del menú no debe empujar a la izquierda */
.region-primary-menu .navbar-nav{
  margin: 0 auto !important;   /* CLAVE */
  float: none !important;
}

/* 3) Evitar que algún align por defecto lo mueva */
.region-primary-menu .navbar-nav.ms-auto,
.region-primary-menu .navbar-nav.me-auto{
  margin-left: auto !important;
  margin-right: auto !important;
}

/* =========================================================
   03_MENU_PRINCIPAL — Paso 2: estilo botón
   ========================================================= */

:root{
  --est1-primary: #871515;
  --est1-primary-hover: #B51C1C;
}

/* Enlaces del menú como botones */
.navbar-nav .nav-link,
.region-primary-menu a{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 7px 10px !important;      /* tamaño del botón */
  margin: 4px 5px 4px 0 !important;   /* separación entre botones */
  border-radius: 0 !important;        /* cuadrado */

  background: var(--est1-primary) !important;
  border: 1px solid var(--est1-primary) !important;
  color: #fff !important;

	font-size: 0.9rem !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  line-height: 1 !important;

  transition: background-color .15s ease, color .15s ease, border-color .15s ease !important;
}

/* Hover/focus */
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus,
.region-primary-menu a:hover,
.region-primary-menu a:focus{
  background: #fff !important;
  color: var(--est1-primary) !important;
  border-color: var(--est1-primary) !important;
  outline: none !important;
}

/* Activo */
.navbar-nav .nav-link.is-active,
.navbar-nav .nav-item.active > .nav-link,
.region-primary-menu a.is-active{
  background: #fff !important;
  color: var(--est1-primary) !important;
  border-color: var(--est1-primary) !important;
}

/* En móvil: un poco más compacto */
@media (max-width: 768px){
  .navbar-nav .nav-link,
  .region-primary-menu a{
    padding: 9px 12px !important;
    margin: 5px 6px 5px 0 !important;
  }
}

/* =========================================================
   03_MENU_PRINCIPAL — Quitar estado activo visual
   ========================================================= */

/* Estado activo = mismo estilo que botón normal */
.navbar-nav .nav-link.is-active,
.navbar-nav .nav-item.active > .nav-link,
.region-primary-menu a.is-active{
  background: var(--est1-primary) !important;
  color: #ffffff !important;
  border-color: var(--est1-primary) !important;
}

/* Evitar cambios en focus persistente */
.navbar-nav .nav-link:focus-visible{
  outline: none !important;
  box-shadow: none !important;
}

/* =========================================================
   FIX: Quitar fondo azul en Submenús (Dropdowns)
   ========================================================= */

/* Elimina el fondo azul de Bootstrap en los elementos del submenú */
.dropdown-menu .dropdown-item.is-active, 
.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active {
  background-color: #f2f2f2 !important; /* O el color que desees para el activo */
  color: #ffffff !important;
}

/* Si prefieres que el submenú NO tenga fondo distinto cuando está activo 
   y se vea igual al resto de las opciones del dropdown: */
.region-primary-menu .dropdown-menu a.is-active {
  background-color: #f2f2f2 !important; 
  color: #ffffff !important;
}

/* Evitar el azul de Bootstrap al pasar el mouse en submenús */
.dropdown-menu a:hover, 
.dropdown-menu a:focus {
  background-color: #f2f2f2 !important;
  color: #000  !important;
}

/* Fondo completo y centrado real del menú principal */
#navbar-main {
  background-color: var(--est1-primary) !important;
}

#navbar-main .container,
#navbar-main .container-fluid,
#navbar-main #block-est1-main-menu {
  width: 100% !important;
}

#navbar-main #block-est1-main-menu .navbar-nav {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}