/* Señalado de la sección actual del menú principal.
   Archivo separado para no tocar el degradado/fondo personalizado de assets/style.css. */
.nav>div:last-child a.active,
.public-menu a.active,
.nav .main-menu>a.admin-menu-link.active{
  background:var(--accent);
  color:#07111f;
  border-color:var(--accent);
  opacity:1;
  box-shadow:0 0 0 2px rgba(57,217,138,.18),0 8px 22px rgba(57,217,138,.12);
}
.public-menu a.active:hover,
.nav .main-menu>a.admin-menu-link.active:hover{
  background:var(--accent);
  color:#07111f;
}


/* Icono principal de la marca: reutiliza el favicon pequeño de /iconos. */
.brand{display:inline-flex;align-items:center;gap:8px}
.brand-icon{width:20px;height:20px;display:inline-block;object-fit:contain;flex:0 0 auto}
@media(max-width:700px){.brand-icon{width:18px;height:18px}}


/* v2: icono PNG de la marca visible en cabecera. */
.brand{display:inline-flex;align-items:center;gap:9px;line-height:1}
.brand-icon{width:28px;height:28px;display:inline-block;object-fit:contain;flex:0 0 28px;border-radius:6px}
@media(max-width:700px){.brand-icon{width:24px;height:24px;flex-basis:24px}}

/* v3: corrección emojis en menú móvil tras aplicar tema.
   El tema se carga después de style.css, por eso estas reglas viven aquí,
   que es la última hoja cargada. */
:root{
  --font-emoji:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji','Segoe UI Symbol',sans-serif;
}
.menu-emoji,
.bottom-app-icon.menu-emoji,
.sheet-menu-icon.menu-emoji{
  font-family:var(--font-emoji) !important;
  font-style:normal !important;
  font-weight:400 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  line-height:1 !important;
  opacity:1 !important;
  visibility:visible !important;
  overflow:visible !important;
  text-indent:0 !important;
  letter-spacing:normal !important;
  color:inherit !important;
  text-rendering:auto !important;
}
.menu-emoji svg,
.bottom-app-icon.menu-emoji svg,
.sheet-menu-icon.menu-emoji svg{
  display:none !important;
}
.nav .menu-emoji{
  width:1.25rem !important;
  height:1.25rem !important;
  font-size:1.08rem !important;
}
.bottom-app-icon.menu-emoji{
  width:1.55rem !important;
  height:1.25rem !important;
  font-size:1.16rem !important;
  margin-bottom:.03rem !important;
}
.sheet-menu-icon.menu-emoji{
  width:1.35rem !important;
  height:1.35rem !important;
  font-size:1.15rem !important;
}

/* v3: el elemento activo del submenú Más se renderiza como <span>,
   no como <a>; por eso debe recibir exactamente la misma caja visual. */
.bottom-more-sheet a,
.bottom-more-sheet .current-menu-item{
  display:flex !important;
  align-items:center !important;
  gap:.55rem !important;
  min-height:2.85rem !important;
  padding:.72rem .85rem !important;
  border:1px solid #dbe5f1 !important;
  border-radius:.95rem !important;
  background:linear-gradient(180deg,#ffffff 0%,#f7faff 100%) !important;
  color:#10213f !important;
  font-size:.92rem !important;
  font-weight:900 !important;
  text-decoration:none !important;
  box-shadow:none !important;
}
.bottom-more-sheet a.active,
.bottom-more-sheet .current-menu-item.active{
  background:linear-gradient(180deg,#e9f8f2 0%,#dff2ff 100%) !important;
  border-color:#bfe8d5 !important;
  color:#08264f !important;
  border-radius:.95rem !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 .28rem .85rem rgba(20,60,96,.08) !important;
  opacity:1 !important;
}
.bottom-more-sheet .current-menu-item.active .sheet-menu-icon{
  color:inherit !important;
}

/* v4: iconos Noto Emoji locales como SVG, idénticos en escritorio y móvil. */
.menu-icon-img,
.menu-icon,
.bottom-app-icon,
.sheet-menu-icon{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  overflow:visible !important;
  line-height:1 !important;
}
.menu-icon-img img,
.menu-icon img,
.bottom-app-icon img,
.sheet-menu-icon img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  opacity:1 !important;
  visibility:visible !important;
  filter:none !important;
}
.nav .menu-icon-img,
.nav .menu-icon{
  width:1.22rem !important;
  height:1.22rem !important;
}
.bottom-app-icon,
.bottom-app-icon.menu-icon-img{
  width:1.75rem !important;
  height:1.75rem !important;
  margin-bottom:.03rem !important;
}
.sheet-menu-icon,
.sheet-menu-icon.menu-icon-img{
  width:1.55rem !important;
  height:1.55rem !important;
}
.public-menu a,
.public-menu .current-menu-item,
.nav .main-menu>a.admin-menu-link,
.nav .main-menu>span.admin-menu-link,
.bottom-app-item,
.bottom-more-sheet a,
.bottom-more-sheet .current-menu-item{
  gap:.5rem !important;
}

/* v5: escritorio con SVG local; móvil con emoji nativo del sistema.
   En iOS esto permite usar Apple Color Emoji, que se ve mejor que cualquier fuente web. */
.menu-icon-hybrid .nav-icon-native{
  display:none !important;
}
.menu-icon-hybrid .nav-icon-svg{
  display:block !important;
}
@media (max-width:700px), (max-width:950px) and (max-height:520px) and (hover:none) and (pointer:coarse){
  .menu-icon-hybrid .nav-icon-svg{
    display:none !important;
  }
  .menu-icon-hybrid .nav-icon-native{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:100% !important;
    font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji','Segoe UI Symbol',sans-serif !important;
    font-style:normal !important;
    font-weight:400 !important;
    line-height:1 !important;
    color:inherit !important;
    text-rendering:auto !important;
    -webkit-font-smoothing:antialiased !important;
  }
}

/* v6: evitar que el menú móvil aparezca en escritorio al reducir solo la altura.
   El modo landscape móvil se conserva usando dispositivos táctiles/coarse pointer. */
.bottom-app-menu,
.bottom-more-sheet,
.bottom-more-backdrop{
  display:none !important;
}
@media (max-width:700px), (max-width:950px) and (max-height:520px) and (hover:none) and (pointer:coarse){
  body.menu-mode-bottom_app .bottom-app-menu{
    display:grid !important;
  }
  body.menu-mode-bottom_app .bottom-more-sheet:not([hidden]){
    display:block !important;
  }
  body.menu-mode-bottom_app .bottom-more-backdrop:not([hidden]){
    display:block !important;
  }
}

/* v8: Admin diferenciado cuando hay sesión iniciada */
.nav .main-menu>a.admin-menu-link.admin-session-active,
.nav .main-menu>span.admin-menu-link.admin-session-active{
  background:linear-gradient(135deg,rgba(11,45,92,.98),rgba(13,71,137,.94)) !important;
  border-color:rgba(255,255,255,.34) !important;
  color:#fff !important;
  box-shadow:0 .65rem 1.35rem rgba(11,45,92,.28),0 0 0 1px rgba(255,255,255,.08) inset !important;
}
.nav .main-menu>a.admin-menu-link.admin-session-active::after,
.nav .main-menu>span.admin-menu-link.admin-session-active::after{
  content:"";
  width:.48rem;
  height:.48rem;
  border-radius:999px;
  background:#39d98a;
  box-shadow:0 0 0 .16rem rgba(57,217,138,.18);
  flex:0 0 auto;
}
.nav .main-menu>a.admin-menu-link.admin-session-active:hover{
  transform:translateY(-1px);
  filter:brightness(1.05);
}

/* v10: en el menú móvil "Más", la marca de sesión admin no altera la caja del item. */
.bottom-more-sheet a.admin-menu-link.admin-session-active,
.bottom-more-sheet span.admin-menu-link.admin-session-active{
  position:relative !important;
  padding-right:2.05rem !important;
}
.bottom-more-sheet a.admin-menu-link.admin-session-active::after,
.bottom-more-sheet span.admin-menu-link.admin-session-active::after{
  content:"";
  position:absolute;
  right:.95rem;
  top:50%;
  transform:translateY(-50%);
  width:.48rem;
  height:.48rem;
  border-radius:999px;
  background:#39d98a;
  box-shadow:0 0 0 .16rem rgba(57,217,138,.18);
}
@media (max-width:700px), (max-width:950px) and (max-height:520px) and (hover:none) and (pointer:coarse){
  .bottom-more-sheet{
    padding-bottom:calc(1rem + env(safe-area-inset-bottom)) !important;
  }
  .bottom-more-sheet a.admin-menu-link.admin-session-active,
  .bottom-more-sheet span.admin-menu-link.admin-session-active{
    background:linear-gradient(180deg,#ffffff 0%,#f7faff 100%) !important;
    border-color:#dbe5f1 !important;
    color:#10213f !important;
    box-shadow:none !important;
  }
  .bottom-more-sheet a.admin-menu-link.admin-session-active.active,
  .bottom-more-sheet span.admin-menu-link.admin-session-active.active{
    background:linear-gradient(180deg,#e9f8f2 0%,#dff2ff 100%) !important;
    border-color:#bfe8d5 !important;
    color:#08264f !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 .28rem .85rem rgba(20,60,96,.08) !important;
  }
}

/* v9: iconos híbridos también en el menú interno de administración */
.admin-menu .admin-menu-icon,
.admin-menu .admin-menu-icon.menu-icon-img{
  width:1.3rem !important;
  height:1.3rem !important;
}
@media (max-width:700px), (max-width:950px) and (max-height:520px) and (hover:none) and (pointer:coarse){
  .admin-menu .admin-menu-icon,
  .admin-menu .admin-menu-icon.menu-icon-img{
    width:1.2rem !important;
    height:1.2rem !important;
  }
}

/* v11: corregir item Admin dentro de la hoja móvil "Más" cuando hay sesión activa.
   El indicador verde no debe afectar al flujo ni desplazar el texto. */
@media (max-width:700px), (max-width:950px) and (max-height:520px) and (hover:none) and (pointer:coarse){
  .bottom-more-sheet a,
  .bottom-more-sheet span.current-menu-item,
  .bottom-more-sheet span.admin-menu-link{
    display:flex !important;
    align-items:center !important;
    gap:.55rem !important;
    width:100% !important;
    min-height:2.85rem !important;
    padding:.72rem .85rem !important;
    border:1px solid #dbe5f1 !important;
    border-radius:.95rem !important;
    background:linear-gradient(180deg,#ffffff 0%,#f7faff 100%) !important;
    color:#10213f !important;
    font-size:.92rem !important;
    font-weight:900 !important;
    line-height:1.1 !important;
    text-decoration:none !important;
    box-shadow:none !important;
	margin-bottom: .2rem;
  }
  .bottom-more-sheet a.admin-menu-link.admin-session-active,
  .bottom-more-sheet span.admin-menu-link.admin-session-active{
    position:relative !important;
    padding-right:2.2rem !important;
    padding-bottom:.72rem !important;
  }
  .bottom-more-sheet a.admin-menu-link.admin-session-active::after,
  .bottom-more-sheet span.admin-menu-link.admin-session-active::after{
    content:"" !important;
    position:absolute !important;
    right:.95rem !important;
    top:50% !important;
    bottom:auto !important;
    transform:translateY(-50%) !important;
    width:.48rem !important;
    height:.48rem !important;
    border-radius:999px !important;
    background:#39d98a !important;
    box-shadow:0 0 0 .16rem rgba(57,217,138,.18) !important;
    flex:0 0 auto !important;
  }
  .bottom-more-sheet .sheet-menu-icon,
  .bottom-more-sheet .bottom-sheet-icon,
  .bottom-more-sheet .nav-icon{
    flex:0 0 1.35rem !important;
    width:1.35rem !important;
    height:1.35rem !important;
    margin:0 !important;
  }
  .bottom-more-sheet .admin-menu-link.active,
  .bottom-more-sheet .current-menu-item.active{
    background:linear-gradient(180deg,#e9f8f2 0%,#dff2ff 100%) !important;
    border-color:#bfe8d5 !important;
    color:#08264f !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 .28rem .85rem rgba(20,60,96,.08) !important;
  }
}

/* v12: el enlace Admin del menú móvil "Más" debe comportarse como una opción normal
   también cuando no hay sesión iniciada. Neutraliza reglas del menú hamburguesa. */
@media (max-width:700px), (max-width:950px) and (max-height:520px) and (hover:none) and (pointer:coarse){
  body.menu-mode-bottom_app .bottom-more-sheet a.admin-menu-link,
  body.menu-mode-bottom_app .bottom-more-sheet span.admin-menu-link{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:.55rem !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    min-height:2.85rem !important;
    max-height:none !important;
    margin:0 !important;
    padding:.72rem .85rem !important;
    border-width:1px !important;
    border-style:solid !important;
    border-color:#dbe5f1 !important;
    border-radius:.95rem !important;
    background:linear-gradient(180deg,#ffffff 0%,#f7faff 100%) !important;
    color:#10213f !important;
    font-size:.92rem !important;
    font-weight:900 !important;
    line-height:1.1 !important;
    text-align:left !important;
    text-decoration:none !important;
    box-shadow:none !important;
  }
  body.menu-mode-bottom_app .bottom-more-sheet a.admin-menu-link .sheet-menu-label,
  body.menu-mode-bottom_app .bottom-more-sheet span.admin-menu-link .sheet-menu-label{
    display:block !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    margin:0 !important;
    line-height:1.1 !important;
    text-align:left !important;
  }
  body.menu-mode-bottom_app .bottom-more-sheet a.admin-menu-link .sheet-menu-icon,
  body.menu-mode-bottom_app .bottom-more-sheet span.admin-menu-link .sheet-menu-icon{
    display:inline-flex !important;
    flex:0 0 1.35rem !important;
    width:1.35rem !important;
    height:1.35rem !important;
    margin:0 !important;
    align-items:center !important;
    justify-content:center !important;
  }
  body.menu-mode-bottom_app .bottom-more-sheet a.admin-menu-link.admin-session-active,
  body.menu-mode-bottom_app .bottom-more-sheet span.admin-menu-link.admin-session-active{
    padding-right:2.2rem !important;
  }
  body.menu-mode-bottom_app .bottom-more-sheet a.admin-menu-link.active,
  body.menu-mode-bottom_app .bottom-more-sheet span.admin-menu-link.active{
    background:linear-gradient(180deg,#e9f8f2 0%,#dff2ff 100%) !important;
    border-color:#bfe8d5 !important;
    color:#08264f !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 .28rem .85rem rgba(20,60,96,.08) !important;
  }
}