/* =========================================================
   Innovando Swiss - Dropdown UX (Flatsome) - v4 "Extra Slow"
   Autore: Flo
   - Barra verticale bianca animata (15px)
   - Dropdown con comparsa extra morbida (fade + slide up 700ms)
   ========================================================= */

/* ===========================
   Variabili personalizzabili
   =========================== */
:root {
  --dropdown-indicator-color: #fff;
  --dropdown-indicator-width: 15px;
  --dropdown-anim-duration: 700ms;       /* durata extra lenta */
  --dropdown-fade-duration: 240ms;
  --dropdown-left-gap: 0em;
  --dropdown-padding-left: 1.2em;
  --dropdown-radius: 0px;
  --focus-ring: rgba(255,255,255,.35);
}

/* =========================================================
   Voci del dropdown + barra verticale
   ========================================================= */
.header .header-nav .nav-dropdown li > a {
  position: relative;
  padding-left: calc(var(--dropdown-padding-left) + var(--dropdown-indicator-width));
  transition: color 180ms ease, background-color 180ms ease;
}

.header .header-nav .nav-dropdown li > a::before {
  content: "";
  position: absolute;
  left: var(--dropdown-left-gap);
  top: 50%;
  transform: translateY(-50%) scaleY(0);
  transform-origin: center top;
  width: var(--dropdown-indicator-width);
  height: 100%;
  background: var(--dropdown-indicator-color);
  border-radius: var(--dropdown-radius);
  opacity: 0.95;
  transition: transform 320ms ease-out;
  pointer-events: none;
}

.header .header-nav .nav-dropdown li:hover > a::before,
.header .header-nav .nav-dropdown li > a:focus::before,
.header .header-nav .nav-dropdown li.current-menu-item > a::before,
.header .header-nav .nav-dropdown li.current-menu-ancestor > a::before {
  transform: translateY(-50%) scaleY(1);
}

.header .header-nav .nav-dropdown li > a:focus {
  outline: none;
  box-shadow: inset 0 0 0 2px var(--focus-ring);
  border-radius: 4px;
}

/* RTL */
.rtl .header .header-nav .nav-dropdown li > a {
  padding-right: calc(var(--dropdown-padding-left) + var(--dropdown-indicator-width));
  padding-left: 0.9em;
}
.rtl .header .header-nav .nav-dropdown li > a::before {
  left: auto;
  right: var(--dropdown-left-gap);
}

/* =========================================================
   Dropdown nascosto (stato base)
   ========================================================= */
.header .header-nav .nav-dropdown {
  visibility: hidden;
  opacity: 0;
  transform: translateY(22px);
  will-change: transform, opacity;
  transition: opacity var(--dropdown-fade-duration) ease;
}

/* Keyframes extra slow */
@keyframes menuExtraSlowUp {
  0%   { transform: translateY(24px); opacity: 0; }
  30%  { transform: translateY(10px); opacity: 0.4; }
  60%  { transform: translateY(3px);  opacity: 0.85; }
  85%  { transform: translateY(-2px); opacity: 1; }
  100% { transform: translateY(0);    opacity: 1; }
}

/* =========================================================
   Stati aperti del dropdown
   ========================================================= */
.header .header-nav li:hover > .nav-dropdown,
.header .header-nav li.nav-hover > .nav-dropdown,
.header .header-nav li.nav-dropdown-active > .nav-dropdown,
.header .header-nav li.current-dropdown > .nav-dropdown,
.header .header-nav li.active-dropdown > .nav-dropdown,
.header .header-nav li.open > .nav-dropdown,
.header .header-nav li.is-active > .nav-dropdown,
.header .header-nav li:hover > .nav-dropdown.nav-dropdown-default,
.header .header-nav li:hover > .nav-dropdown.nav-dropdown-large,
.header .header-nav li:hover > .nav-dropdown.nav-dropdown-mega {
  visibility: visible !important;
  opacity: 1 !important;
  animation: menuExtraSlowUp var(--dropdown-anim-duration) cubic-bezier(.25,.8,.25,1);
  transform: translateY(0) !important;
}

/* Mega menu */
.header .ux-megamenu .nav-dropdown {
  will-change: transform, opacity;
}

/* =========================================================
   Riduzione movimento
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
  .header .header-nav .nav-dropdown,
  .header .header-nav li:hover > .nav-dropdown,
  .header .header-nav li.nav-hover > .nav-dropdown,
  .header .header-nav li.nav-dropdown-active > .nav-dropdown,
  .header .header-nav li.current-dropdown > .nav-dropdown,
  .header .header-nav li.active-dropdown > .nav-dropdown,
  .header .header-nav li.open > .nav-dropdown,
  .header .header-nav li.is-active > .nav-dropdown {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition: none !important;
  }
  .header .header-nav .nav-dropdown li > a::before {
    transition: none !important;
  }
}

/* =========================================================
   Ritocchi opzionali
   ========================================================= */
/* Solo hover (no stato attivo)
.header .header-nav .nav-dropdown li.current-menu-item > a::before,
.header .header-nav .nav-dropdown li.current-menu-ancestor > a::before {
  transform: translateY(-50%) scaleY(0);
}
*/

/* Barra a destra
.header .header-nav .nav-dropdown li > a {
  padding-right: calc(var(--dropdown-padding-left) + var(--dropdown-indicator-width));
  padding-left: 0.9em;
}
.header .header-nav .nav-dropdown li > a::before {
  left: auto;
  right: var(--dropdown-left-gap);
}
*/