@charset "UTF-8";

/* ——— Variabili ——— */
:root{
  --a11y-z: 2147483646;     /* backToTop resta a +1 se serve */
  --a11y-gap: 16px;
  --a11y-radius: 14px;

  /* chiaro */
  --a11y-fg: #0f172a;
  --a11y-bg: #ffffff;
  --a11y-bd: #e5e7eb;

  /* scuro accessibile */
  --a11y-dark-bg: #0b0f13;
  --a11y-dark-fg: #e8edf5;
  --a11y-dark-muted: #cfd6e4;
  --a11y-dark-link: #ffffff;
  --a11y-dark-card: #121722;
  --a11y-dark-card-bd: #252a36;

  /* bottone */
  --a11y-fab-bg: #111827;
  --a11y-fab-fg: #ffffff;
  --a11y-fab-hover: #0b0f1a;
}

/* ——— Wrapper fisso a SINISTRA, sopra al footer ——— */
#a11y-widget.a11y{
  position: fixed;
  left: var(--a11y-gap) !important;
  right: auto !important;
  bottom: var(--a11y-gap) !important;
  z-index: var(--a11y-z);
  pointer-events: none; /* solo i figli prendono click */
}

/* Hit-area piena, bottone circolare */
.a11y__fab{
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 9999px;
  background: var(--a11y-fab-bg);
  color: var(--a11y-fab-fg);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 8px 18px rgba(0,0,0,.2);
  transition: background .15s ease, transform .08s ease;
  cursor: pointer;
  touch-action: manipulation;
  position: relative;
}
.a11y__fab:hover{ background: var(--a11y-fab-hover); }
.a11y__fab:active{ transform: translateY(1px); }
.a11y__fab:focus-visible{ outline: 3px solid #93c5fd; outline-offset: 2px; }
.a11y__fab-ico{ width: 26px; height: 26px; display:inline-block; }

/* area click extra */
.a11y__fab::after{
  content:""; position:absolute; inset:-6px; border-radius:9999px;
}

/* ——— Pannello ——— */
.a11y__panel{
  pointer-events: auto;
  position: fixed;
  left: calc(var(--a11y-gap));
  bottom: calc(var(--a11y-gap) + 3.5rem + 10px);
  width: min(92vw, 380px);
  max-height: min(82vh, 640px);
  overflow: auto;
  background: var(--a11y-bg);
  color: var(--a11y-fg);
  border: 1px solid var(--a11y-bd);
  border-radius: var(--a11y-radius);
  box-shadow: 0 16px 40px rgba(0,0,0,.18);
  z-index: var(--a11y-z);
}
.a11y__panel[hidden]{ display:none; }

.a11y__panel-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:.9rem 1rem .6rem; border-bottom:1px solid var(--a11y-bd);
}
.a11y__title{ font:700 1rem/1.2 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial, sans-serif; }
.a11y__close{
  display:inline-flex; align-items:center; justify-content:center;
  width:2rem; height:2rem; border-radius:.6rem;
  border:1px solid var(--a11y-bd);
  background:#fff; color:#111827; font-size:1.1rem; line-height:1;
}
.a11y__close:focus-visible{ outline:2px solid #93c5fd; outline-offset:2px; }

.a11y__controls{ padding:.8rem 1rem 1rem; }
.a11y__group{ margin:.6rem 0 1rem; border:0; }
.a11y__group > legend{ font-weight:600; margin-bottom:.4rem; }

.a11y__row{
  display:flex; align-items:center; gap:.5rem;
  border:1px solid var(--a11y-bd); border-radius:.8rem; padding:.35rem;
}
.a11y__btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:2.2rem; min-width:2.2rem; padding:0 .6rem;
  border:1px solid var(--a11y-bd); border-radius:.6rem; background:#fff; color:#0f172a;
}
.a11y__btn--ghost{ background:transparent; }
.a11y__value{ min-width:3ch; text-align:center; }

.a11y__toggle{
  display:flex; align-items:center; gap:.5rem;
  padding:.35rem; border-radius:.5rem;
}
.a11y__toggle input{ width:1rem; height:1rem; }

/* ——— DARK THEME ACCESSIBILE ——— */
html[data-a11y-theme="dark"] body{
  background: var(--a11y-dark-bg) !important;
  color: var(--a11y-dark-fg) !important;
}
html[data-a11y-theme="dark"] a:not(.btn):not([role="button"]){
  color: var(--a11y-dark-link) !important;
}
html[data-a11y-theme="dark"] .bg-white,
html[data-a11y-theme="dark"] .bg-neutral-50,
html[data-a11y-theme="dark"] .bg-neutral-100{
  background: var(--a11y-dark-card) !important;
  color: var(--a11y-dark-fg) !important;
  border-color: var(--a11y-dark-card-bd) !important;
}
html[data-a11y-theme="dark"] .card{
  background: var(--a11y-dark-card) !important;
  border-color: var(--a11y-dark-card-bd) !important;
  color: var(--a11y-dark-fg) !important;
}
html[data-a11y-theme="dark"] .card .card-content,
html[data-a11y-theme="dark"] .card p,
html[data-a11y-theme="dark"] .card li{
  color: var(--a11y-dark-muted) !important;
}
html[data-a11y-theme="dark"] .badge{
  background: #1b2130 !important; border-color: #2a3142 !important; color: var(--a11y-dark-fg) !important;
}
html[data-a11y-theme="dark"] .divider{ background:#1e2430 !important; }
html[data-a11y-theme="dark"] .btn-outline{
  border-color:#2a3142 !important; color:#e6edf5 !important; background:transparent !important;
}
html[data-a11y-theme="dark"] .btn-outline:hover{ background:#161b22 !important; }

/* sovrascrivi classi Tailwind di testo in dark */
html[data-a11y-theme="dark"] [class*="text-neutral-"],
html[data-a11y-theme="dark"] [class*="text-gray-"],
html[data-a11y-theme="dark"] [class*="text-slate-"] {
  color: var(--a11y-dark-fg) !important;
}
/* ——— HIGH CONTRAST ——— */
html[data-a11y-contrast="high"] a:not(.btn):not([role="button"]){
  color:#0033cc !important; text-decoration: underline !important;
}
html[data-a11y-contrast="high"] .btn,
html[data-a11y-contrast="high"] button{
  color:#000 !important; background:#fff !important; border:1px solid #000 !important;
}
html[data-a11y-contrast="high"][data-a11y-theme="dark"] .btn,
html[data-a11y-contrast="high"][data-a11y-theme="dark"] button{
  color:#fff !important; background:#000 !important; border:1px solid #fff !important;
}

/* ——— UNDERLINE / STOP MOTION / READABLE FONT ——— */
html[data-a11y-stop-motion="on"] *{
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}
html[data-a11y-readable-font="on"] *{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", Arial, sans-serif !important;
}

/* ——— CURSORE PIÙ GRANDE ——— */
html[data-a11y-cursor="big"] * {
  cursor: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAALklEQVRYhe3OsQEAMADEsP7/0yQhZyQAAo6xg0g8yZ0QAAAAAABgKQY8f8gAAAD4pQHf1r2vQwAAAABJRU5ErkJggg==") 2 2, auto !important; /* 32x32 dot nero */
}

/* Mobile: pannello a tutta larghezza con margine */
@media (max-width: 420px){
  .a11y__panel{ left: 10px; width: calc(100vw - 20px); }
}
/* Sottolinea link ovunque, compresi menu e footer */
html[data-a11y-underline="on"] a,
html[data-a11y-underline="on"] nav a,
html[data-a11y-underline="on"] .footer a {
  text-decoration: underline !important;
}