/* Cinco destinos del plan aprobado. El menú lateral conserva las secciones
   secundarias; al abrirlo, academia-ux vuelve inert los hermanos de sidebar. */
.ac-navegacion-movil { display: none; }

@media (max-width: 760px) {
  .ac-navegacion-movil {
    display: flex;
    position: fixed;
    inset: auto 0 0;
    z-index: 35;
    background: var(--ac-nivel-1);
    border-top: 1px solid var(--ac-borde);
    padding: 5px max(6px, env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left));
  }
  .ac-navegacion-movil__enlace {
    flex: 1;
    min-width: 0;
    min-height: 52px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: var(--ac-texto-suave);
    font-size: 11px;
    line-height: 1.2;
    font-weight: 600;
    text-decoration: none;
    border-radius: 6px;
  }
  .ac-navegacion-movil__enlace.is-activo,
  .ac-navegacion-movil__enlace:hover {
    color: var(--ac-acento);
    background: var(--ac-acento-suave);
    text-decoration: none;
  }
  .ac-navegacion-movil__enlace:focus-visible {
    outline: 2px solid var(--ac-acento);
    outline-offset: -2px;
  }
  /* El tema heredado declara padding !important en .content; esta reserva
     supera esa regla para que el último control no quede bajo las pestañas. */
  .cc-app:has(> .ac-navegacion-movil) .main > .content {
    padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important;
  }
  html:has(.ac-navegacion-movil) {
    scroll-padding-bottom: calc(88px + env(safe-area-inset-bottom));
  }
}