/* ==================================================================
   STRUMENTI DI ACCESSIBILITÀ — Farmacia La Fenice
   Pulsante in basso a SINISTRA: a destra c'è il WhatsApp flottante.
   ================================================================== */

.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* --- Pulsante ---------------------------------------------------- */
.flf-acc-btn{
  position:fixed;left:24px;bottom:24px;z-index:95;
  width:60px;height:60px;border-radius:50%;border:3px solid #fff;
  background:linear-gradient(135deg,var(--verde-500),var(--verde-700));color:#fff;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:0 10px 26px rgba(179,74,23,.42),0 2px 6px rgba(35,26,28,.2);
  transition:transform .2s ease,box-shadow .2s ease}
.flf-acc-btn svg{width:32px;height:32px}
.flf-acc-btn:hover{transform:translateY(-2px) scale(1.04)}
.flf-acc-btn:focus-visible,.flf-acc-pannello button:focus-visible,.flf-acc-pannello a:focus-visible{
  outline:3px solid var(--oro-700);outline-offset:3px}

/* --- Pannello ---------------------------------------------------- */
.flf-acc-pannello{
  position:fixed;left:16px;bottom:96px;z-index:10001;
  width:min(420px,calc(100vw - 32px));max-height:calc(100vh - 120px);
  display:flex;flex-direction:column;overflow:hidden;
  background:#fff;border-radius:22px;
  box-shadow:0 30px 70px -20px rgba(35,26,28,.45),0 0 0 1px rgba(35,26,28,.08);
  font-family:'Hanken Grotesk',system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.35;letter-spacing:normal;text-align:left}
.flf-acc-pannello[hidden]{display:none}
.flf-acc-testa{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:18px 18px 16px 22px;background:linear-gradient(135deg,var(--verde-700),var(--verde-900));color:#fff}
.flf-acc-testa h2{font-family:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;font-size:1.25rem;line-height:1.2;margin:0;color:#fff}
.flf-acc-testa p{margin:2px 0 0;font-size:.9rem;opacity:.85;color:#fff}
.flf-acc-chiudi{flex:none;width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;
  background:#fff;color:var(--verde-700);display:flex;align-items:center;justify-content:center}
.flf-acc-corpo{overflow-y:auto;padding:16px;overscroll-behavior:contain}
.flf-acc-griglia{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.flf-acc-tile{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  min-height:104px;padding:14px 10px;border-radius:16px;
  background:#F7F2EF;border:2px solid transparent;color:#2B2324;
  font:inherit;font-weight:600;font-size:.95rem;text-align:center;cursor:pointer;
  transition:background .15s ease,border-color .15s ease}
button.flf-acc-tile:hover{background:var(--menta)}
.flf-acc-tile svg{width:28px;height:28px;color:var(--verde-700)}
.flf-acc-tile[aria-pressed="true"]{background:var(--menta);border-color:var(--verde-700);color:var(--verde-900)}
.flf-acc-passo{cursor:default}
.flf-acc-passo-comandi{display:flex;align-items:center;gap:10px}
.flf-acc-passo-comandi button{width:34px;height:34px;border-radius:50%;border:0;cursor:pointer;
  background:#2B2324;color:#fff;display:flex;align-items:center;justify-content:center}
.flf-acc-passo-comandi button svg{width:18px;height:18px;color:#fff}
.flf-acc-passo-comandi output{min-width:48px;text-align:center;font-weight:800}
.flf-acc-reset{display:block;width:100%;margin-top:14px;padding:13px;border-radius:14px;cursor:pointer;
  border:2px solid var(--verde-700);background:#fff;color:var(--verde-700);font:inherit;font-weight:700}
.flf-acc-reset:hover{background:var(--menta)}
.flf-acc-nota{margin:12px 2px 2px;font-size:.88rem;color:#5C5C5C}
.flf-acc-nota a{color:var(--verde-700);font-weight:700}

@media (max-width:600px){
  .flf-acc-btn{left:16px;bottom:16px;width:54px;height:54px}
  .flf-acc-btn svg{width:28px;height:28px}
  .flf-acc-pannello{left:8px;right:8px;width:auto;bottom:82px;max-height:calc(100vh - 100px)}
  .flf-acc-tile{min-height:92px;font-size:.9rem}
}

/* ==================================================================
   EFFETTI SULLA PAGINA (classi su <html>, impostate dallo script)
   Il pannello stesso resta sempre uguale, per non perdersi.
   ================================================================== */

/* Dimensione del testo: il tema lavora in rem, basta la radice */
html.acc-font{font-size:calc(100% * var(--acc-font,1))}

/* Interlinea e spaziatura */
html.acc-lh body *:not(.flf-acc-pannello):not(.flf-acc-pannello *){line-height:var(--acc-lh)!important}
html.acc-ls body *:not(.flf-acc-pannello):not(.flf-acc-pannello *){letter-spacing:var(--acc-ls)!important;word-spacing:calc(var(--acc-ls) * 2)!important}

/* Carattere leggibile */
html.acc-leggibile body *:not(.flf-acc-pannello *):not(svg):not(svg *){
  font-family:Verdana,Tahoma,'Segoe UI',Arial,sans-serif!important}

/* Allineamento */
html.acc-allinea-left body :is(p,li,h1,h2,h3,h4,h5,h6,dd,dt,blockquote,figcaption,span,a,label):not(.flf-acc-pannello *){text-align:left!important}
html.acc-allinea-center body :is(p,li,h1,h2,h3,h4,h5,h6,dd,dt,blockquote,figcaption,span,a,label):not(.flf-acc-pannello *){text-align:center!important}
html.acc-allinea-right body :is(p,li,h1,h2,h3,h4,h5,h6,dd,dt,blockquote,figcaption,span,a,label):not(.flf-acc-pannello *){text-align:right!important}

/* Alto contrasto: testo nero su bianco, collegamenti blu sottolineati */
html.acc-contrasto body,
html.acc-contrasto body *:not(.flf-acc-pannello):not(.flf-acc-pannello *):not(.flf-acc-btn):not(.flf-acc-btn *):not(.flf-acc-maschera *){
  background-color:#fff!important;background-image:none!important;color:#000!important;
  border-color:#000!important;text-shadow:none!important;box-shadow:none!important}
html.acc-contrasto body a:not(.flf-acc-pannello a),
html.acc-contrasto body a:not(.flf-acc-pannello a) *{color:#0000CC!important;text-decoration:underline!important}
html.acc-contrasto body :is(.btn,button,input,select,textarea):not(.flf-acc-pannello *):not(.flf-acc-btn){border:2px solid #000!important}
html.acc-contrasto body img,html.acc-contrasto body picture{filter:none}

/* Nascondi immagini (resta il testo alternativo per i lettori di schermo) */
html.acc-noimg body :is(img,picture,video,iframe,figure img):not(.flf-acc-pannello *):not(.custom-logo){visibility:hidden!important}
html.acc-noimg body *:not(.flf-acc-pannello *){background-image:none!important}

/* Evidenzia collegamenti */
html.acc-link body a:not(.flf-acc-pannello a){
  text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:3px!important;
  outline:2px dashed var(--verde-700)!important;outline-offset:2px!important;background-color:#FFF4C2!important;color:#5A2000!important}

/* Evidenzia titoli */
html.acc-titoli body :is(h1,h2,h3,h4,h5,h6):not(.flf-acc-pannello *){
  outline:3px solid var(--oro-700)!important;outline-offset:4px!important;background-color:#F3EEF6!important;color:#2B1C33!important}

/* Ferma animazioni (anche per chi soffre il movimento) */
html.acc-noanim *,html.acc-noanim *::before,html.acc-noanim *::after{
  animation-duration:.001ms!important;animation-iteration-count:1!important;
  transition-duration:.001ms!important;scroll-behavior:auto!important}
html.acc-noanim .reveal{opacity:1!important;transform:none!important}

/* Maschera di lettura: due fasce scure, la riga sotto il puntatore resta libera */
.flf-acc-maschera{position:fixed;inset:0;z-index:9998;pointer-events:none}
.flf-acc-maschera[hidden]{display:none}
.flf-acc-maschera i{position:absolute;left:0;right:0;background:rgba(20,14,16,.62)}
.flf-acc-maschera i:first-child{top:0;height:var(--acc-m-top,40vh)}
.flf-acc-maschera i:last-child{bottom:0;top:var(--acc-m-bot,60vh)}

/* Lente: riquadro che ingrandisce il testo sotto il puntatore */
.flf-acc-lente{position:fixed;z-index:10002;pointer-events:none;max-width:min(520px,calc(100vw - 24px));
  padding:14px 18px;border-radius:14px;background:#2B2324;color:#fff;
  font:600 1.6rem/1.35 Verdana,Tahoma,Arial,sans-serif;letter-spacing:.01em;
  box-shadow:0 18px 40px -12px rgba(0,0,0,.5)}
.flf-acc-lente[hidden]{display:none}

@media print{.flf-acc-btn,.flf-acc-pannello,.flf-acc-maschera,.flf-acc-lente{display:none!important}}
