/* app/css/90-overrides.css — estratto da app.css (2026-07, split senza build). */
/* ========== A11Y · prefers-reduced-motion guard (S5 M5) ==========
   Pattern WAI-ARIA / Web Almanac 2023. Uso 0.01ms invece di 0ms per
   permettere ai callback transitionend/animationend di firare comunque.
   Copre: animazioni infinite (pulse, pulseGrow, geo-spin), animazioni
   one-shot (slideUp modal), transition su toggle/toast/channel-option,
   scroll smooth. C11: copre anche le nuove transition 80-120ms sui tap
   state :active (btn, card, menu-row, balance-strip, bottom-nav, lab-switch). */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Nudge passkey in home: invita ad attivare la biometria a chi rientra senza averla */
.passkey-nudge { display: flex; align-items: flex-start; gap: 12px; margin: 12px 16px 0; padding: 14px; background: var(--surface); border: 1px solid var(--brand); border-radius: 14px; box-shadow: var(--shadow-card); }
.passkey-nudge-ico { color: var(--brand); flex-shrink: 0; margin-top: 2px; }
.passkey-nudge-body { flex: 1; min-width: 0; }
.passkey-nudge-ttl { font-weight: 700; font-size: 15px; color: var(--ink); }
.passkey-nudge-sub { font-size: 13px; color: var(--ink-2); line-height: 1.35; margin-top: 2px; }
.passkey-nudge-status { font-size: 12px; margin-top: 6px; }
.passkey-nudge-cta { flex-shrink: 0; align-self: center; background: var(--brand); color: #fff; border: none; border-radius: 10px; padding: 8px 14px; font-weight: 700; font-size: 14px; cursor: pointer; }
.passkey-nudge-cta:disabled { opacity: 0.6; }
.passkey-nudge-close { flex-shrink: 0; background: none; border: none; color: var(--ink-3); cursor: pointer; padding: 2px; line-height: 0; }

/* ========== Feedback interattivo · tap + hover (2026-06-11) ==========
   Gli unici controlli "vivi" al tatto erano i 4 con transform scale
   (icon-btn, back-btn, contact-strip, lab-actions): il solo cambio di
   background --bg su bianco e' impercettibile sotto il dito. Qui si
   estende il pattern scale a tutti gli interattivi e si aggiunge lo
   strato :hover per desktop (assente: 1 regola hover in tutto il file
   contro le 103 della dashboard). Token only, niente colori hardcoded. */

/* Tap (touch + click): scale leggero sulle righe/card, piu' marcato sui
   bottoni pieni e sulla bottom nav. Si SOMMA ai background :active gia'
   definiti sopra (proprieta' diverse, nessun override). */
.menu-row:active, .lab-row:active, .lab-list-row:active, .notif-item-row:active,
.purse-card:active, .receipt-row:active, .voucher-card:active, .passkey-card:active,
.cm-card:active, .balance-strip:active, .satispay-cta:active, .load-more-btn:active,
.amount-tile:active, .radio-tile:active, .lab-switch-row:active, .lab-availability:active,
.availability-pill:active, .locate-btn:active,
.ct-act-btn:active, .recharge-method:active { transform: scale(0.985); }

.btn-primary:active, .btn-confirm:active, .btn-danger:active, .btn-cancel:active,
.btn-ghost:active, .btn-secondary:active, .form-screen .submit-btn:active,
.td-reply-form .submit-btn:active, .psc-btn:active,
.btn-pay-satispay:active, .ct-recharge:active { transform: scale(0.97); }

.bottom-nav a:active, .bottom-nav button:active { transform: scale(0.9); border-radius: 14px; }

/* Hover solo su dispositivi con puntatore vero: su touch lo stato hover
   "appiccicoso" post-tap e' un difetto, non un feedback. */
@media (hover: hover) and (pointer: fine) {
  .menu-row:hover, .lab-row:hover, .lab-list-row:hover, .notif-item-row:hover,
  .purse-card:hover, .receipt-row:hover, .voucher-card:hover, .passkey-card:hover,
  .cm-card:hover, .balance-strip:hover, .satispay-cta:hover, .load-more-btn:hover,
  .lab-switch:hover, .lab-list-row:hover, .btn-ghost:hover,
  .btn-secondary:hover, .ct-act-btn:hover, .recharge-method:hover { background: var(--bg); }

  /* .with-actions: l'hover di sfondo NON copre tutta la card — solo la riga "Cambia"
   * (le azioni Chiama/WhatsApp hanno il loro hover sul cerchietto). */
  .lab-switch.with-actions:hover { background: var(--surface); }
  .lab-switch.with-actions .lab-switch-row:hover { background: var(--bg); }

  .amount-tile:hover:not(.selected), .radio-tile:hover:not(.selected) { border-color: var(--ink-3); }

  .btn-primary:hover, .btn-confirm:hover, .form-screen .submit-btn:hover,
  .td-reply-form .submit-btn:hover, .psc-btn:hover,
  .balance-strip .b-cta:hover, .icon-btn--brand:hover, .ct-recharge:hover { background: var(--brand-hover); }

  .btn-danger:hover, .btn-cancel:hover, .btn-pay-satispay:hover { filter: brightness(0.92); }

  .app-header .icon-btn:hover, .sub-header .back-btn:hover, .sheet-close:hover { background: var(--line); }

  .bottom-nav a:hover, .bottom-nav button:hover { background: var(--bg); border-radius: 14px; }

  .contact-strip a:hover, .lab-actions a:hover, .lost-actions a:hover,
  .lab-actions--cards a:hover, .notif-item-link:hover, .mov-help-link:hover,
  .distance-pill:hover { opacity: 0.75; }

  .availability-pill:hover, .lab-availability:hover { background: #DCFCE7; }
  .locate-btn:hover { background: #FBE4EA; }
}

/* htmx indicator — includeIndicatorStyles:false nel meta htmx-config: lo
   <style> che htmx inietterebbe non ha nonce e la CSP lo bloccherebbe al
   flip in enforcing. Regole identiche al default htmx. */
.htmx-indicator{opacity:0}
.htmx-request .htmx-indicator{opacity:1; transition: opacity 200ms ease-in;}
.htmx-request.htmx-indicator{opacity:1; transition: opacity 200ms ease-in;}

/* ── Pagina errore 404 (templates/404.html, standalone) ──────────────────
   Condivisa tra tutti gli host: brand neutro, solo token, nessun JS.
   .error-cta adatta .btn-primary all'uso come <a> (block + no underline). */
.error-page { display: flex; min-height: 100vh; min-height: 100dvh; align-items: center; justify-content: center; background: var(--bg); padding: 24px; }
.error-card { background: var(--surface); border-radius: 16px; box-shadow: var(--shadow-card); padding: 40px 28px; max-width: 420px; width: 100%; text-align: center; }
.error-code { font-size: 56px; font-weight: 800; color: var(--brand); letter-spacing: 2px; line-height: 1; }
.error-card h1 { font-size: 20px; font-weight: 800; color: var(--ink); margin-top: 10px; }
.error-text { font-size: 15px; color: var(--ink-2); margin-top: 10px; line-height: 1.5; }
.error-cta { display: block; text-align: center; text-decoration: none; }

/* Banner riarmo notifiche push: barra in cima, mostrata da push.js quando
   l'intent server è attivo ma il permesso/subscription manca (tipico dopo la
   reinstallazione della PWA su iOS). Nascosto di default via attributo hidden. */
.push-rearm { display: flex; align-items: center; gap: 10px; padding: calc(10px + env(safe-area-inset-top)) 16px 10px; background: var(--brand-soft); border-bottom: 1px solid #F3D6DC; color: var(--brand); font-size: 13px; font-weight: 700; }
.push-rearm[hidden] { display: none; }
.push-rearm__ico { color: var(--brand); flex-shrink: 0; }
.push-rearm__txt { flex: 1; }
.push-rearm__cta { padding: 7px 14px; background: var(--brand); color: #fff; border: 0; border-radius: 999px; font-size: 13px; font-weight: 800; font-family: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; flex-shrink: 0; }
.push-rearm__cta:active { background: var(--brand-hover); }
.push-rearm__cta:disabled { opacity: 0.6; }
.push-rearm__close { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; background: transparent; border: 0; color: var(--brand); cursor: pointer; flex-shrink: 0; -webkit-tap-highlight-color: transparent; }