/*
 * DIGITPL - correzioni responsive del menu principale.
 *
 * Obiettivi:
 * - evitare overflow/orizzontali su Safari/macOS e Safari/iPadOS;
 * - passare automaticamente al menu compatto quando le voci non entrano;
 * - mantenere accessibili i sottomenu, compresi quelli multilivello;
 * - non modificare dimensioni/font dei pulsanti o delle voci di menu.
 */

/* Safari e flexbox: consentire ai figli di restringersi realmente. */
#js-header .navbar,
#js-header .navbar > .container,
#js-header .navbar-collapse,
#js-header #navBar,
#js-header #navBar .navbar-nav,
#js-header #navBar .nav-item {
  min-width: 0;
}

#js-header .navbar > .container {
  width: 100%;
}

#js-header .navbar-brand {
  flex: 0 0 auto;
  -webkit-flex: 0 0 auto;
}

/* Spazio reale a destra del badge notifiche.
   Nel tema base i badge sono position:absolute con right:0 e
   transform:translate(50%,-50%): il padding del link non puo' quindi
   spostarli dal bordo della navbar. Sul menu desktop annulliamo la
   traslazione orizzontale e manteniamo il badge interamente dentro
   l'header con un margine visivo dal bordo destro. */
#js-header .navbar:not(.digitpl-nav-compact) #tot_not {
  right: 14px !important;
  -webkit-transform: translate(0, -50%) !important;
  -ms-transform: translate(0, -50%) !important;
  transform: translate(0, -50%) !important;
}

/* Sui desktop utilizziamo tutta la larghezza disponibile dell'header.
   Questo ritarda il passaggio al menu compatto senza forzare il wrapping. */
@media (min-width: 992px) {
  #js-header .navbar > .container {
    max-width: 100%;
    padding-left: 24px;
    padding-right: 24px;
  }

  #js-header .navbar:not(.digitpl-nav-compact) #navBar .navbar-nav {
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
  }

  #js-header .navbar:not(.digitpl-nav-compact) #navBar > .navbar-nav > .nav-item > .nav-link {
    white-space: nowrap;
  }
}

/* Stato compatto: viene applicato da digitpl-responsive-menu.js quando
   il viewport è mobile/tablet oppure quando le voci non entrano nello spazio. */
#js-header .navbar.digitpl-nav-compact {
  flex-wrap: wrap !important;
  -webkit-flex-wrap: wrap !important;
}

#js-header .navbar.digitpl-nav-compact > .container {
  position: relative;
  flex-wrap: wrap !important;
  -webkit-flex-wrap: wrap !important;
}

#js-header .navbar.digitpl-nav-compact .navbar-toggler {
  display: block !important;
  z-index: 1201;
  right: 15px !important;
}

#js-header .navbar.digitpl-nav-compact .navbar-collapse {
  flex: 0 0 100% !important;
  -webkit-flex: 0 0 100% !important;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  align-items: stretch !important;
  -webkit-align-items: stretch !important;
}

/* Bootstrap forza display:flex sopra i 992 px per navbar-expand-lg.
   Queste regole permettono il collapse anche quando DIGITPL decide di
   compattare il menu a una larghezza desktop intermedia. */
#js-header .navbar.digitpl-nav-compact .navbar-collapse.collapse:not(.show) {
  display: none !important;
}

#js-header .navbar.digitpl-nav-compact .navbar-collapse.collapse.show {
  display: block !important;
}

#js-header .navbar.digitpl-nav-compact .navbar-collapse.collapsing {
  display: block !important;
  overflow: hidden;
}

#js-header .navbar.digitpl-nav-compact #navBar {
  max-height: calc(100vh - 78px);
  max-height: calc(100dvh - 78px);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#js-header .navbar.digitpl-nav-compact #navBar > .navbar-nav {
  width: 100%;
  flex-direction: column !important;
  -webkit-flex-direction: column !important;
  align-items: stretch !important;
  -webkit-align-items: stretch !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-top: 8px;
  padding-bottom: 8px;
}

#js-header .navbar.digitpl-nav-compact #navBar .nav-item {
  width: 100%;
  max-width: 100%;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#js-header .navbar.digitpl-nav-compact #navBar .nav-link {
  display: block;
  width: 100%;
  max-width: 100%;
  white-space: normal !important;
  overflow-wrap: break-word;
  word-break: normal;
  padding-top: 9px !important;
  padding-bottom: 9px !important;
}

/* I sottomenu del componente Gravity diventano elementi del flusso normale.
   Il plugin continua a gestirne apertura/chiusura tramite display. */
#js-header .navbar.digitpl-nav-compact #navBar .hs-sub-menu,
#js-header .navbar.digitpl-nav-compact #navBar .hs-mega-menu {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  -webkit-transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 0 0 16px !important;
  box-shadow: none !important;
  border-top: 0 !important;
  background-color: transparent !important;
  visibility: visible !important;
}

#js-header .navbar.digitpl-nav-compact #navBar .hs-sub-menu .dropdown-item,
#js-header .navbar.digitpl-nav-compact #navBar .hs-mega-menu .dropdown-item {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  white-space: normal !important;
  background-color: transparent;
}

#js-header .navbar.digitpl-nav-compact #navBar .hs-sub-menu .nav-link,
#js-header .navbar.digitpl-nav-compact #navBar .hs-mega-menu .nav-link {
  color: #ffffff !important;
}

/* Sottomenu multilivello usati in ATTI/NOMINE (Lavori Aula e Presidente).
   Su touch/Safari vengono mostrati in linea quando il menu principale è compatto,
   evitando menu laterali fuori viewport e dipendenza dall'hover. */
#js-header .navbar.digitpl-nav-compact #navBar .nomine-child-menu {
  display: block !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 0 0 16px !important;
  box-shadow: none !important;
  border-top: 0 !important;
  background-color: transparent !important;
}

#js-header .navbar.digitpl-nav-compact #navBar .nomine-child-menu .dropdown-item {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  white-space: normal !important;
}

/* Evita che il badge notifiche o la matricola allarghino il flex container su Safari. */
#js-header .navbar.digitpl-nav-compact #nav-link--notifiche,
#js-header .navbar.digitpl-nav-compact #nav-link--user {
  max-width: 100%;
}

/* iOS/Safari può aumentare automaticamente il testo: il menu deve mantenere
   le proporzioni previste dal layout. */
@supports (-webkit-touch-callout: none) {
  #js-header {
    -webkit-text-size-adjust: 100%;
  }
}
