/* Canonical feedback, loaded once outside frozen auth; no layout transforms. */

:root {
  /* 29/9: i valori vengono dai gettoni del movimento (tbp-tokens.css), uguali a prima. */
  --tbp-press-duration: var(--tbp-moto-breve, 160ms);
  --tbp-press-ease: var(--tbp-moto-curva, cubic-bezier(.22, 1, .36, 1));
  --tbp-press-scale: var(--tbp-moto-premuto, .97);
  --tbp-press-shift: 1px;
}

.tbp-pressable {
  transform-origin: center !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* Tonal feedback stays visible with reduced motion, without moving the control. */
html body .tbp-pressable.is-tbp-pressed {
  filter: brightness(.91) !important;
}

/* Fallback for browsers without Web Animations on individual transforms. */
.tbp-pressable:not(.tbp-pressable--animated) {
  scale: 1;
  translate: 0 0;
  transition: none !important;
}

.tbp-pressable:not(.tbp-pressable--animated).is-tbp-pressed {
  scale: var(--tbp-press-scale);
  translate: 0 var(--tbp-press-shift);
  transition: scale 80ms var(--tbp-press-ease), translate 80ms var(--tbp-press-ease), filter 80ms var(--tbp-press-ease) !important;
}

.tbp-pressable:not(.tbp-pressable--animated).is-tbp-releasing {
  transition: scale var(--tbp-press-duration) var(--tbp-press-ease), translate var(--tbp-press-duration) var(--tbp-press-ease), filter 80ms var(--tbp-press-ease) !important;
}

/* Touch icons: one unmistakable press/rebound, no loop or synthetic click delay. */
html body .tbp-pressable.tbp-touch-icon-feedback.is-tbp-pressed {
  opacity: 1 !important;
  filter: brightness(.76) !important;
}
html body .tbp-touch-icon-art { transform-origin:center !important; }
html body .tbp-pressable.tbp-touch-icon-feedback:not(.tbp-pressable--animated) {
  scale:1;
  translate:0 0;
}
html body .tbp-pressable.tbp-touch-icon-feedback:not(.tbp-pressable--animated).is-tbp-pressed .tbp-touch-icon-art {
  scale:.82;
  translate:0 3px;
  transition:scale 60ms var(--tbp-press-ease), translate 60ms var(--tbp-press-ease);
}
html body .tbp-pressable.tbp-touch-icon-feedback.is-tbp-releasing {
  opacity: 1 !important;
}
@keyframes tbp-touch-icon-rebound {
  0% { scale: .82; translate: 0 3px; }
  32% { scale: 1.16; translate: 0 -6px; }
  60% { scale: .96; translate: 0 1px; }
  80% { scale: 1.035; translate: 0 -1px; }
  100% { scale: 1; translate: 0 0; }
}
html body .tbp-pressable.tbp-touch-icon-feedback:not(.tbp-pressable--animated).is-tbp-releasing .tbp-touch-icon-art {
  animation: tbp-touch-icon-rebound 520ms var(--tbp-press-ease) both;
  transition: none !important;
}

/* Keyboard focus is visible before the first interaction. */
/* [tabindex="-1"] escluso (23/9): sono gli avvisi che il sito mette a fuoco da solo per i lettori
   di schermo, non si raggiungono col tasto Tab; l'anello li trasformava in un doppio bordo. */
html body:not(.login):not(.registrazione) :is(a[href], button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 3px solid var(--tbp-focus-color, #084828) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 3px #fff !important;
}

html body .tbp-pressable:is(:disabled, [aria-disabled="true"]) {
  cursor: not-allowed;
  filter: none !important;
}
html body .tbp-pressable:is([aria-busy="true"], .loading, .is-loading) {
  cursor: progress;
  filter: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html body .tbp-touch-icon-art,
  html body .tbp-pressable,
  html body .tbp-pressable.is-tbp-pressed,
  html body .tbp-pressable.is-tbp-releasing {
    animation: none !important;
    scale: 1 !important;
    translate: 0 0 !important;
    transition-duration: .01ms !important;
  }
}

/* ------------------------------------------------------------------------
 * Movimento 29/9 notte (kit rilascio/motion-29-9). Solo durate, curve,
 * stati e proprieta' animate: nessuna misura o posizione cambia.
 * ------------------------------------------------------------------------ */

/* Home: «Scopri le esperienze» e «Diventa Mastro» stanno nella fascia sopra
   la mappa, che ha pointer-events: none (tbp-home-map.css) per lasciare il dito
   alla mappa. Dalla pubblicazione del 29/9 alle 23:27 i due bottoni non avevano
   pointer-events: auto e non si potevano toccare, al telefono e al computer.
   Non cambia nessuna misura. */
html body.tbp-home-map .tbp-home-map__azioni,
html body.tbp-home-map .tbp-home-map__azione {
  pointer-events: auto;
}

/* Schede del catalogo: ora rispondono al tocco come i bottoni, ma piu' piano
   (una scheda grande che si stringe del 3 % sembra un salto). */
html body :is(.tbp-exp-card, .tbp-discovery-card) {
  --tbp-moto-premuto: .985;
  --tbp-press-shift: 0px;
}
html body .tbp-pressable:is(.tbp-exp-card, .tbp-discovery-card).is-tbp-pressed {
  filter: none !important;
}

/* Disattivato: grigio neutro e fermo, uguale in tutto il sito (REGOLE-DESIGN).
   Prima: lo stesso bottone al 45 % (oro sbiadito, verde slavato).
   :not(#tbp-x) serve solo a pesare quanto le regole dei bottoni con #id. */
html body :is(.tbp-btn, .tbp-btn--premium, button.button, .woocommerce-Button, .tbp-exp-card__buy):is(:disabled, [aria-disabled="true"]):not(#tbp-x) {
  opacity: 1 !important;
  background: var(--tbp-spento-fondo, #E4E7E5) !important;
  border-color: transparent !important;
  color: var(--tbp-spento-testo, #6B7470) !important;
  -webkit-text-fill-color: var(--tbp-spento-testo, #6B7470) !important;
  -webkit-text-stroke: 0 !important;
  text-shadow: none !important;
  box-shadow: none !important;
  filter: none !important;
  cursor: not-allowed;
}
html body :is(.tbp-btn, .tbp-btn--premium, button.button, .woocommerce-Button, .tbp-exp-card__buy):is(:disabled, [aria-disabled="true"]):not(#tbp-x)::after {
  animation: none !important;
  opacity: 0 !important;
}

/* Cassetto del menu (Flatsome): prima 500 ms per il pannello e le voci che
   entravano una ogni 100 ms, l'ultima dopo 1 secondo. Ora 240 ms e 30 ms fra
   una voce e l'altra: il menu e' pronto in un terzo di secondo. */
html body .mfp-wrap.off-canvas .mfp-content {
  transition: transform var(--tbp-moto-medio) var(--tbp-moto-curva), opacity var(--tbp-moto-breve) var(--tbp-moto-curva);
}
html body .mfp-bg.off-canvas {
  transition: opacity var(--tbp-moto-medio) var(--tbp-moto-curva);
}
html body .mfp-removing.mfp-wrap.off-canvas .mfp-content,
html body .mfp-removing.mfp-bg.off-canvas {
  transition-duration: var(--tbp-moto-breve);
  transition-timing-function: var(--tbp-moto-esce);
}
html body .off-canvas .nav-anim > li {
  transition-duration: var(--tbp-moto-medio) !important;
  transition-timing-function: var(--tbp-moto-curva) !important;
  transition-delay: 0ms !important;
}
html body .off-canvas .nav-anim > li:nth-child(2) { transition-delay: 30ms !important; }
html body .off-canvas .nav-anim > li:nth-child(3) { transition-delay: 60ms !important; }
html body .off-canvas .nav-anim > li:nth-child(4) { transition-delay: 90ms !important; }
html body .off-canvas .nav-anim > li:nth-child(5) { transition-delay: 120ms !important; }
html body .off-canvas .nav-anim > li:nth-child(6) { transition-delay: 150ms !important; }
html body .off-canvas .nav-anim > li:nth-child(n+7) { transition-delay: 180ms !important; }

/* Bottoni generici di Flatsome: prima 300 ms con la curva «ease» del browser.
   Ora le stesse proprieta' in «breve» con la curva del sito. Le regole dei
   componenti con selettori piu' precisi continuano a vincere. */
html body :is(button, .button, input[type="submit"], input[type="button"], input[type="reset"]) {
  transition: color var(--tbp-moto-breve) var(--tbp-moto-curva), background-color var(--tbp-moto-breve) var(--tbp-moto-curva), border-color var(--tbp-moto-breve) var(--tbp-moto-curva), box-shadow var(--tbp-moto-breve) var(--tbp-moto-curva), opacity var(--tbp-moto-breve) var(--tbp-moto-curva), transform var(--tbp-moto-breve) var(--tbp-moto-curva);
}

/* «transition: all» del tema vecchio: animava anche i cambi di tema e di misura. */
html body #masthead ul > li > a,
html body .bottone,
html body a.bottone {
  transition: color var(--tbp-moto-breve) var(--tbp-moto-curva), background-color var(--tbp-moto-breve) var(--tbp-moto-curva), opacity var(--tbp-moto-breve) var(--tbp-moto-curva);
}
html body.single-esperienze .intro > .galleria .esperienze-gallery-main .tbp-gallery-dots .tbp-dot,
html body.single-esperienze .tbp-lightbox-next,
html body.single-esperienze .tbp-lightbox-prev {
  transition: opacity var(--tbp-moto-breve) var(--tbp-moto-curva), background-color var(--tbp-moto-breve) var(--tbp-moto-curva), transform var(--tbp-moto-breve) var(--tbp-moto-curva);
}

/* Cambio tema: per un fotogramma niente transizioni. Prima 37-40 elementi
   sfumavano ognuno col suo tempo (140, 160, 200, 300, 400 ms) e l'intestazione
   arrivava per ultima: il tema «colava». Ora cambia tutto insieme.
   :not(#tbp-x) e :is(#tbp-x, *) pesano come due #id, per vincere anche le
   regole con !important; non scelgono nessun elemento in piu'. */
html.tbp-moto-tema:not(#tbp-x) :is(#tbp-x, *),
html.tbp-moto-tema:not(#tbp-x) :is(#tbp-x, *)::before,
html.tbp-moto-tema:not(#tbp-x) :is(#tbp-x, *)::after {
  transition: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html body .off-canvas .nav-anim > li,
  html body .mfp-wrap.off-canvas .mfp-content {
    transform: none !important;
    transition-delay: 0ms !important;
  }
}
