/*
 * Contrato estrutural independente da navbar móvel.
 *
 * Este ficheiro é carregado depois das folhas de estilo das páginas. As
 * declarações críticas usam !important de propósito: nenhuma regra visual,
 * estado de hover ou componente futuro deve transformar o menu num painel de
 * altura total.
 */
@media (max-width:860px) {
  body .nav-shell .navbar {
    position:relative !important;
  }

  body .nav-shell .navbar .site-primary-nav,
  body .nav-shell .navbar .site-primary-nav:hover {
    position:absolute !important;
    z-index:120 !important;
    inset:auto 0 auto auto !important;
    top:calc(100% + 8px) !important;
    width:min(360px,calc(100vw - 24px)) !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    max-height:min(320px,calc(100dvh - 96px)) !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    align-items:stretch !important;
    align-content:start !important;
    gap:4px 6px !important;
    box-sizing:border-box !important;
    margin:0 !important;
    padding:10px !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    color:#334449;
    background:var(--white,#fff);
    border:1px solid var(--line,#d7d3c7);
    border-radius:0;
    box-shadow:0 18px 38px rgba(8,42,52,.16);
    contain:layout;
  }

  body .nav-shell .navbar .site-primary-nav:not(.open) {
    display:none !important;
  }

  body .nav-shell .navbar .site-primary-nav.open {
    display:grid !important;
  }

  body .nav-shell .navbar .site-primary-nav > a,
  body .nav-shell .navbar .site-primary-nav .nav-cta {
    min-width:0 !important;
    min-height:42px !important;
    height:auto !important;
    display:flex !important;
    align-items:center !important;
    margin:0 !important;
    padding:9px 10px !important;
    overflow-wrap:anywhere;
    line-height:1.25 !important;
    text-align:left;
  }

  body .nav-shell .navbar .site-primary-nav .nav-cta {
    grid-column:1/-1 !important;
    justify-content:center;
    text-align:center;
  }

  body.course-lesson-page .course-site-header .navbar .site-primary-nav {
    top:calc(100% + var(--course-context-nav-height,52px) + 8px) !important;
    max-height:min(320px,calc(100dvh - var(--course-main-nav-height,72px) - var(--course-context-nav-height,52px) - 24px)) !important;
  }
}
