/* navbar-scorri.css
   Barra di navigazione di www (nav-light, nav-business, nav-woocommerce).
   Si aggiunge a piantando.css senza modificarlo: piantando.css e' condiviso
   con hub, Bird House e gli altri siti, questo foglio e' caricato solo dai
   blocchi nav di www e agisce solo sulle barre con la classe .navbar-scorri.

   Valori in px e non in rem: dentro WordPress (shop) la radice e' 16px,
   sul sito statico 20px; in px la barra e' identica nei due casi.

   1) nascondi scorrendo in basso, ricompare risalendo (classe messa da
      navbar-scorri.js);
   2) tra 992 e 1199.98px barra bassa come sotto 992 (70px in cima,
      68px dopo lo scorrimento);
   3) sfondo pieno dopo lo scorrimento, chiaro e scuro. */

/* ---------- 1. nascondi / mostra ---------- */
nav.navbar.fixed-top.navbar-scorri {
  transition: background-color 0.3s ease, box-shadow 0.3s ease, padding 0.3s ease, transform 0.25s ease !important;
}

/* Nessun transform fuori dallo stato nascosto: un transform sulla barra
   farebbe da contenitore all'offcanvas (position:fixed) che sta dentro. */
nav.navbar.fixed-top.navbar-scorri.navbar-nascosta {
  transform: translateY(-100%);
  box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
  nav.navbar.fixed-top.navbar-scorri {
    transition: none !important;
  }
}

/* ---------- 3. sfondo pieno dopo lo scorrimento ---------- */
/* Stessi colori di piantando.css, senza trasparenza. Con lo sfondo opaco
   la sfocatura non si vede piu': si toglie, costa GPU sui tablet. */
nav.navbar.fixed-top.navbar-scorri.navbar-light.navbar-scrolled {
  background-color: rgb(255, 255, 255) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

nav.navbar.fixed-top.navbar-scorri.navbar-dark.navbar-scrolled {
  background-color: rgb(39, 39, 39) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ---------- 2. tablet orizzontali, 992-1199.98px ---------- */
/* Il menu resta esteso (navbar-expand-lg): a 992px le quattro voci
   occupano circa 330px e c'e' spazio. Si tolgono solo i vuoti verticali:
   py-lg-3 della barra (15px), 0.8rem dello stato scrolled (16px) e 24px
   sopra e sotto le voci. Risultato: contenitore 60px come sotto 992. */
@media (min-width: 992px) and (max-width: 1199.98px) {
  nav.navbar.fixed-top.navbar-scorri {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }

  nav.navbar.fixed-top.navbar-scorri.navbar-scrolled {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  nav.navbar.navbar-scorri .navbar-brand {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  nav.navbar.navbar-scorri .offcanvas-body .navbar-nav > .nav-item > .nav-link {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }
}