/* tap2sip.com · a11y-v1.css — il pannello «Accessibilità» e le preferenze di lettura.
   Le classi stanno su <html> e le mette a11y-v1.js prima che la pagina si disegni:
   t2s-a11y-t1/-t2 testo più grande, -c contrasto alto, -l link evidenziati,
   -s più spazio nel testo, -f carattere leggibile, -m animazioni ferme,
   -k selezione ben visibile. */

/* Testo più grande: ogni dimensione dei caratteri delle pagine è
   calc(N * var(--t2s-fs, 1)), lo controlla tests/check-site.mjs. La testata
   (global-nav-v37.css) resta com'è: il menu non deve uscire dalla riga. */
html.t2s-a11y-t1{--t2s-fs:1.15}
html.t2s-a11y-t2{--t2s-fs:1.3}

/* Link evidenziati */
html.t2s-a11y-l a{text-decoration-line:underline!important;text-decoration-thickness:max(1px,.08em)!important;text-underline-offset:.2em!important}
html.t2s-a11y-l a:hover,html.t2s-a11y-l a:focus-visible{text-decoration-thickness:max(2px,.14em)!important}

/* Più spazio nel testo: i valori del criterio WCAG 1.4.12 (testata e figure decorative restano come sono) */
html.t2s-a11y-s body :is(p,li,dd,dt,td,th,blockquote,figcaption,label,summary,small,a,span,strong,em,b,button,h1,h2,h3,h4,h5,h6):not([class*="fa-"]):not([aria-hidden="true"] *):not(#site-header *){line-height:1.5!important;letter-spacing:.12em!important;word-spacing:.16em!important}
html.t2s-a11y-s body p:not([aria-hidden="true"] *){margin-bottom:2em!important}

/* Carattere più leggibile: Atkinson Hyperlegible Next (Braille Institute, licenza OFL), servito dal sito */
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:normal;font-weight:400 700;font-display:swap;src:url("/assets/fonts/atk-next-latin-ext-v1.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:normal;font-weight:400 700;font-display:swap;src:url("/assets/fonts/atk-next-latin-v1.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
html.t2s-a11y-f body,html.t2s-a11y-f body :not(i):not(svg):not(svg *):not([class*="fa-"]):not([aria-hidden="true"] *){font-family:"Atkinson Hyperlegible Next",Verdana,Tahoma,sans-serif!important}

/* Animazioni ferme (di partenza con "riduci il movimento" del sistema) */
html.t2s-a11y-m,html.t2s-a11y-m *,html.t2s-a11y-m *::before,html.t2s-a11y-m *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.001ms!important;transition-delay:0s!important;scroll-behavior:auto!important}

/* Selezione ben visibile: doppio bordo, si vede sui fondi chiari e scuri */
html.t2s-a11y-k :focus{outline:3px solid #1d5fd1!important;outline-offset:2px!important;box-shadow:0 0 0 6px #fff!important}

/* Il bottone nella testata (accanto alla lingua) */
#site-header .t2s-a11y-btn{display:grid;place-items:center;flex:0 0 auto;width:46px;height:46px;margin:0;padding:0;border:1px solid #e2ddea;border-radius:13px;background:#fff;color:#383243;cursor:pointer}
#site-header .t2s-a11y-btn:hover{border-color:#b9b0c8;color:#16131f}
#site-header .t2s-a11y-btn:focus-visible{outline:3px solid #6847e8;outline-offset:2px}
#site-header .t2s-a11y-btn svg{width:24px;height:24px}
@media(max-width:980px){#site-header .t2s-a11y-btn{width:40px;height:40px}#site-header .t2s-a11y-btn svg{width:22px;height:22px}}

/* Il bottone nel piede: si legge come gli altri link della colonna */
.suite-footer .t2s-a11y-link{display:block;width:max-content;max-width:100%;margin:8px 0;padding:0;border:0;background:none;color:#aaa3b3;font:inherit;font-size:calc(13px*var(--t2s-fs,1));line-height:1.4;text-align:left;cursor:pointer;transition:color .15s ease}
.suite-footer .t2s-a11y-link:hover{color:#fff}
.suite-footer .t2s-a11y-link:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:4px}

/* Il pannello */
.t2s-a11y{width:min(440px,calc(100vw - 32px));max-width:none;max-height:min(88vh,760px);margin:auto;padding:0;border:0;border-radius:20px;background:#fff;color:#16131f;box-shadow:0 24px 70px rgba(22,19,31,.3);overflow:auto;overscroll-behavior:contain;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:calc(15px*var(--t2s-fs,1));line-height:1.5;text-align:left}
.t2s-a11y:not([open]){display:none}
.t2s-a11y[open].t2s-a11y--nodlg{position:fixed;inset:0;z-index:2147483000}
.t2s-a11y::backdrop{background:rgba(18,16,25,.5)}
.t2s-a11y *{box-sizing:border-box}
.t2s-a11y__box{margin:0;padding:18px 20px 16px}
.t2s-a11y__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 4px}
.t2s-a11y__head h2{margin:0;color:#16131f;font-family:inherit;font-size:calc(20px*var(--t2s-fs,1));font-weight:800;line-height:1.25;letter-spacing:0}
.t2s-a11y__x{display:grid;place-items:center;flex:0 0 auto;width:44px;height:44px;margin:0;padding:0;border:1px solid #847e91;border-radius:12px;background:#fff;color:#16131f;cursor:pointer}
.t2s-a11y__x svg{width:20px;height:20px}
.t2s-a11y__intro{margin:0 0 14px;color:#4a4655;font-size:calc(14px*var(--t2s-fs,1))}
.t2s-a11y fieldset{min-width:0;margin:0 0 14px;padding:0;border:0}
.t2s-a11y legend{margin:0 0 8px;padding:0;color:#16131f;font-size:calc(14px*var(--t2s-fs,1));font-weight:750}
.t2s-a11y__seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.t2s-a11y__chip{position:relative;display:block;margin:0;cursor:pointer}
.t2s-a11y__hide{position:absolute;width:1px;height:1px;margin:0;padding:0;border:0;opacity:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.t2s-a11y__chip span{display:flex;align-items:center;justify-content:center;min-height:44px;height:100%;padding:6px 8px;border:1px solid #847e91;border-radius:12px;background:#fff;color:#16131f;font-weight:650;text-align:center;line-height:1.2}
.t2s-a11y__chip input:checked+span{border:2px solid #4b2eb9;background:#efeafd;color:#2b1871}
.t2s-a11y__chip input:checked+span::before{content:"✓";margin-right:6px;font-weight:800}
.t2s-a11y__chip input:focus-visible+span{outline:3px solid #4b2eb9;outline-offset:2px}
.t2s-a11y__opts{display:grid;gap:6px;margin:0 0 14px;padding:0;list-style:none}
.t2s-a11y__opt{display:flex;align-items:center;gap:12px;min-height:56px;margin:0;padding:8px 10px;border:1px solid #e2ddea;border-radius:14px;cursor:pointer}
.t2s-a11y__opt:hover{border-color:#b9b0c8}
.t2s-a11y__sw{position:relative;flex:0 0 auto;width:44px;height:26px;border-radius:999px;background:#6f6980;transition:background .15s ease}
.t2s-a11y__sw::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .15s ease}
.t2s-a11y__opt input:checked+.t2s-a11y__sw{background:#4b2eb9}
.t2s-a11y__opt input:checked+.t2s-a11y__sw::after{transform:translateX(18px)}
.t2s-a11y__opt input:focus-visible+.t2s-a11y__sw{outline:3px solid #4b2eb9;outline-offset:3px}
.t2s-a11y__txt{display:block;min-width:0}
.t2s-a11y__txt b{display:block;color:#16131f;font-weight:700;line-height:1.3}
.t2s-a11y__txt small{display:block;margin-top:2px;color:#4a4655;font-size:calc(13px*var(--t2s-fs,1));line-height:1.35}
.t2s-a11y__foot{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;margin:0}
.t2s-a11y__foot button{min-height:44px;margin:0;padding:0 18px;border-radius:12px;font-family:inherit;font-size:calc(15px*var(--t2s-fs,1));font-weight:700;cursor:pointer}
.t2s-a11y__reset{border:1px solid #847e91;background:#fff;color:#16131f}
.t2s-a11y__done{border:1px solid #4b2eb9;background:#4b2eb9;color:#fff}
.t2s-a11y__x:focus-visible,.t2s-a11y__foot button:focus-visible,.t2s-a11y__note a:focus-visible{outline:3px solid #4b2eb9;outline-offset:2px}
.t2s-a11y__note{margin:14px 0 0;color:#4a4655;font-size:calc(13px*var(--t2s-fs,1))}
.t2s-a11y__note a{color:#3d2596;font-weight:650;text-decoration:underline;text-underline-offset:.2em}
@media(max-width:520px){
  .t2s-a11y{width:100%;max-height:92vh;margin:auto 0 0;border-radius:20px 20px 0 0}
  .t2s-a11y__box{padding:16px 16px calc(14px + env(safe-area-inset-bottom,0px))}
}
@media(forced-colors:active){
  .t2s-a11y__chip span,.t2s-a11y__opt,.t2s-a11y__sw{border:1px solid CanvasText}
  .t2s-a11y__opt input:checked+.t2s-a11y__sw{background:Highlight}
}
