/**
 * IAO - Submenu sticky (LOGICA + CSS MINIMO)
 *
 * Obiettivo:
 * - Il tema NON deve imporre stili di layout (align, colori, padding, tipografia, ecc.).
 * - Elementor controlla l’aspetto tramite i container che hai creato.
 *
 * Questo file contiene SOLO il minimo indispensabile “funzionale”:
 * - spacer anti-jump (creato via JS)
 * - regola sticky basata su body.is-subnav-sticky e variabile --subnav-top (calcolata dal JS)
 *
 * Tutto il resto (background, border, shadow, animazioni, shift, active state) lo gestisci tu in Elementor.
 */

:root{
  /* impostata dinamicamente dal JS (header + adminbar) */
  --subnav-top: 0px;
}

.sub-nav-spacer{
  height: 0px;
}

/* Titolo: comportamento (non layout)
 * - visibile SOLO quando il submenu è sticky
 * - non modifica l’allineamento: agisce solo su opacity/transform/pointer-events
 */
.sub-nav-title{
  opacity: 0;
  transform: translateX(-10px);
  pointer-events: none;
  transition: opacity 220ms ease, transform 220ms ease;
}

/* Sticky state: solo posizionamento. Aspetto/animazioni demandati a Elementor */
body.is-subnav-sticky .sub-nav-wrapper{
  position: fixed;
  top: var(--subnav-top);
  left: 0;
  right: 0;
  width: 100%;
  z-index: 999;
}

body.is-subnav-sticky .sub-nav-title{
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}

@media (prefers-reduced-motion: reduce){
  .sub-nav-title{
    transition: none !important;
    transform: none !important;
  }
}