/* =====================================================================================
   TOP BAR + HEADER ENTRAMBI FISSI IN ALTO + LOGO SCALING E HEADER BACKGROUND MENO OPACO
   ===================================================================================== */

/* 1. Barra Top fissa incollatina in cima a 0px */
#sp-top-wrapper,
#sp-top-bar {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 10000 !important;
}

/* 2. Header fisso su DESKTOP (Top Bar 40px) */
#sp-header-wrapper,
#sp-header {
  position: fixed !important;
  top: 40px !important; 
  left: 0 !important;
  width: 100% !important;
  z-index: 9999 !important;
  background-color: rgba(255, 255, 255, 0.7) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  /* box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08); */
  padding-top: 0px;
  padding-bottom: 12px;
}

/* Altezza 85px applicata SOLO in modalità Desktop */
@media (min-width: 992px) {
  #sp-header {
    height: 85px !important;
  }
}

/* 3. Header fisso su MOBILE / TABLET (Top Bar 60px) */
@media (max-width: 991.98px) {
  #sp-header-wrapper,
  #sp-header {
    top: 60px !important;
  }
  
  body {
    padding-top: 145px !important; /* Spaziatura adeguata ai 20px extra della top bar */
  }
}

/* 4. Spaziatura iniziale body DESKTOP */
body {
  padding-top: 125px !important; 
}

/* 5. Keyframes Scalatura Logo DESKTOP (70px -> 50px) */
@keyframes shrink-logo-scroll {
  from {
    max-height: 70px;
  }
  to {
    max-height: 50px;
  }
}

/* 6. Keyframes Scalatura Logo MOBILE (55px -> 40px) */
@keyframes shrink-logo-scroll-mobile {
  from {
    max-height: 55px;
  }
  to {
    max-height: 40px;
  }
}

/* Applicazione Scalatura Logo DESKTOP */
#sp-header .logo img,
#sp-header .navbar-brand img {
  max-height: 70px;
  width: auto;
  display: block;
  animation: shrink-logo-scroll linear both;
  animation-timeline: scroll(root block);
  animation-range: 0px 80px;
}

/* Applicazione Scalatura Logo MOBILE (Sovrascrive le regole statiche di Helix) */
@media (max-width: 991.98px) {
  #sp-header .logo img,
  #sp-header .navbar-brand img,
  #sp-header .mobile-logo img,
  .logo-image img {
    height: auto !important;
    animation: shrink-logo-scroll-mobile linear both !important;
    animation-timeline: scroll(root block) !important;
    animation-range: 0px 80px !important;
  }
}


/* —————————————— */

/* TCG: colori voci menu e link - aggira bug helix su siti multistyle o multilingua */

/* Stato normale */
#sp-header .sp-megamenu-parent > li > a,
#sp-header .sp-megamenu-parent > li > span {
  color: #4a8a28 !important;
}

/* Hover / Mouse sopra */
#sp-header .sp-megamenu-parent > li:hover > a,
#sp-header .sp-megamenu-parent > li > a:hover {
  color: #a95d25 !important; /* Colore Hover */
}

/* Voce di menu Attiva o Default (Pagina principale di lingua) */
#sp-header .sp-megamenu-parent > li.active > a,
#sp-header .sp-megamenu-parent > li.default > a,
#sp-header .sp-megamenu-parent > li.active > span,
#sp-header .sp-megamenu-parent > li.default > span {
  color: #a95d25 !important; /* Inserisci il tuo colore Active */
  font-weight: 600;
}

/* Voci del sottomenu */
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a {
  color: #555555 !important;
}

/* Hover sottomenu */
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item.active > a {
  color: #007bff !important;
}

/* Link stato normale */
a {
  color: #4a8a28 !important;
  text-decoration: none;
}

/* Link in Hover (On cover) */
a:hover,
a:focus {
  color: #a95d25 !important;
  text-decoration: underline;
}

/* ===================================================
   MENU OFFCANVAS MOBILE (HELIX ULTIMATE)
   =================================================== */

/* 1. Sfondo del pannello laterale */
.offcanvas-menu {
  background-color: #ffffff !important; /* Modifica con il colore di sfondo desiderato */
}

/* 2. Voci di primo livello (Stato Normale) */
.offcanvas-menu .offcanvas-inner ul.menu > li a,
.offcanvas-menu .offcanvas-inner ul.menu > li span {
  color: #4a8a28 !important;
}

/* 3. Voci di primo livello (Hover / Tap) */
.offcanvas-menu .offcanvas-inner ul.menu > li a:hover,
.offcanvas-menu .offcanvas-inner ul.menu > li:hover > a {
  color: #a95d25 !important; /* Colore Hover */
}

/* 4. Voce di primo livello Attiva (Pagina Corrente) */
.offcanvas-menu .offcanvas-inner ul.menu > li.active > a,
.offcanvas-menu .offcanvas-inner ul.menu > li.active > span {
  color: #a95d25 !important; /* Colore Active */
  font-weight: 600;
}

/* 5. Sottomenu / Voci Figlio (Stato Normale) */
.offcanvas-menu .offcanvas-inner ul.menu ul.nav-child li a {
  color: #666666 !important;
}

/* 6. Sottomenu / Voci Figlio (Hover & Active) */
.offcanvas-menu .offcanvas-inner ul.menu ul.nav-child li a:hover,
.offcanvas-menu .offcanvas-inner ul.menu ul.nav-child li.active > a {
  color: #007bff !important;
}

/* 7. Icona + / - (Freccia di espansione sottomenu) */
.offcanvas-menu .offcanvas-inner ul.menu li .offcanvas-menu-toggler {
  color: #333333 !important;
}

/* ===================================================
   COLORE BURGER ICON (HELIX ULTIMATE)
   =================================================== */

/* Colore delle barrette in stato normale */
#sp-header #offcanvas-toggler span,
#sp-header .burger-icon span,
.offcanvas-toggler span {
  background-color: #4a8a28 !important; /* Sostituisci con il colore desiderato */
}

/* Colore delle barrette al passaggio del mouse (Hover) */
#sp-header #offcanvas-toggler:hover span,
#sp-header .burger-icon:hover span,
.offcanvas-toggler:hover span {
  background-color: #a95d25 !important; /* Sostituisci con il colore hover desiderato */
}

/* ———————————————————————————— */

/* TCG: adjust header height on mobile - setup panel in backend doesn't work - KEEP IT */
/*
@media (max-width:575px) {
#sp-header {
	height: 60px;
	line-height: 60px;
	}
}
@media (min-width:576px) and (max-width:991px) {
#sp-header {
	height: 70px;
	line-height: 70px;
	}
}

/* TCG: header setup - Configurazione altezza Header su Mobile e Tablet */
@media (max-width: 991.98px) {
  #sp-header {
    height: 70px !important; /* Imposta l'altezza desiderata */
  }
  
  /* Mantiene il logo e l'icona burger allineati alla nuova altezza */
  #sp-header .logo,
  #sp-header #offcanvas-toggler {
    height: 70px;
    display: flex;
    align-items: center;
  }
}

*/
/* TCG: widgetkit: */
.uk-scope .uk-margin {
	margin-bottom: 5px !important;
}

/* TCG: center title bottom modules */
#sp-bottom .sp-module .sp-module-title {
	text-align: center;
}

#sp-copyright p {
	margin-bottom: 0.1rem;
}

/*
#sp-copyright {
	background: #4d0d16;
}
*/

/* TCG: widgetkit: change overlay color fill for bottles slider */
.uk-scope .uk-overlay-primary {
	background: rgba(77,13,22,.4) !important;
}

/* TCG: widgetkit: change font family for h1 header */
.uk-scope .uk-h1, .uk-scope h1, .uk-h2 {
	font-family: Alkatra, sans-serif !important;
}

/* TCG: GDPR: center footer main menu */
.cc-revoke.cc-center {
	margin-left: -85px !important;
}