/* CD Accessibilità 1.0 — the button, the panel and the generic rules of every choice.
   Colours from the theme through custom properties (defaults in brackets): --cd-a11y-scuro (#1c1a17), --cd-a11y-chiaro (#f7f4ee),
   --cd-a11y-accento (#6e2e2a), --cd-a11y-raggio (16px), --cd-a11y-basso (12px: lift the button above a fixed bar of the theme).
   What depends on the design (text size, contrast, simplified page, reading mode) the theme can style itself: it declares
   add_theme_support('cd-a11y-<name>') and <html> gets data-cd-a11y-tema="<names>"; the generic rules below step aside. */

@font-face { font-family: "Atkinson Hyperlegible"; font-weight: 400; font-style: normal; font-display: swap; src: url(fonts/AtkinsonHyperlegible-Regular.woff2) format("woff2"); }
@font-face { font-family: "Atkinson Hyperlegible"; font-weight: 700; font-style: normal; font-display: swap; src: url(fonts/AtkinsonHyperlegible-Bold.woff2) format("woff2"); }

/* ── the button ─────────────────────────────────────────────────────────── */

.cd-a11y { font-size: 1rem; line-height: 1.35; }
.cd-a11y__apri {
  position: fixed; z-index: 900; left: 12px; bottom: var(--cd-a11y-basso, 12px);
  display: grid; place-items: center; width: 48px; height: 48px; padding: 0; margin: 0;
  border: 2px solid var(--cd-a11y-chiaro, #f7f4ee); border-radius: 50%;
  background: var(--cd-a11y-scuro, #1c1a17); color: var(--cd-a11y-chiaro, #f7f4ee);
  box-shadow: 0 4px 16px rgba(0, 0, 0, .22); cursor: pointer;
}
.cd-a11y__apri:hover { background: var(--cd-a11y-accento, #6e2e2a); }
.cd-a11y :focus-visible { outline: 3px solid var(--cd-a11y-accento, #6e2e2a); outline-offset: 2px; }
.cd-a11y__apri:focus-visible { outline-offset: 3px; }

/* ── the panel: a modal dialog; on the phone the whole screen from the top, on the computer a side panel on the left ── */

.cd-a11y__finestra {
  box-sizing: border-box; position: fixed; inset: 0 auto 0 0; width: min(400px, 100vw); max-width: 100vw;
  height: 100dvh; max-height: 100dvh; margin: 0; padding: 0; border: 0; border-radius: 0 var(--cd-a11y-raggio, 16px) var(--cd-a11y-raggio, 16px) 0;
  overflow-y: auto; overscroll-behavior: contain;
  background: var(--cd-a11y-chiaro, #f7f4ee); color: var(--cd-a11y-scuro, #1c1a17);
  font: inherit; font-size: 1rem; line-height: 1.4; box-shadow: 0 0 40px rgba(0, 0, 0, .25);
}
.cd-a11y__finestra::backdrop { background: rgba(0, 0, 0, .45); }
.cd-a11y__finestra *, .cd-a11y__finestra *::before, .cd-a11y__finestra *::after { box-sizing: border-box; }
@media (max-width: 640px) {
  .cd-a11y__finestra { width: 100vw; border-radius: 0; }
}
@media (prefers-reduced-motion: no-preference) {
  html:not(.cd-a11y-fermo) .cd-a11y__finestra[open] { animation: cd-a11y-entra .2s ease-out; }
}
@keyframes cd-a11y-entra { from { transform: translateX(-24px); opacity: 0; } to { transform: none; opacity: 1; } }

.cd-a11y__testa {
  position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 12px 12px 20px; background: var(--cd-a11y-chiaro, #f7f4ee); border-bottom: 1px solid rgba(0, 0, 0, .12);
}
.cd-a11y__titolo { margin: 0; font: inherit; font-size: 1.25rem; font-weight: 700; color: inherit; letter-spacing: 0; }
.cd-a11y__chiudi {
  flex: none; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; margin: 0;
  border: 0; border-radius: 50%; background: transparent; color: inherit; cursor: pointer;
}
.cd-a11y__chiudi:hover { background: rgba(0, 0, 0, .08); }
.cd-a11y__corpo { display: grid; gap: 16px; padding: 16px 20px 28px; }
.cd-a11y__intro { margin: 0; font-size: .95rem; }

.cd-a11y__gruppo { margin: 0; padding: 0; border: 0; min-width: 0; }
.cd-a11y__gruppo legend { padding: 0; margin: 0 0 8px; font-weight: 700; }
.cd-a11y__segmenti { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--cd-a11y-scuro, #1c1a17); border-radius: 12px; overflow: hidden; }
.cd-a11y__segmenti label { position: relative; display: block; }
.cd-a11y__segmenti label + label { border-left: 1px solid var(--cd-a11y-scuro, #1c1a17); }
.cd-a11y__segmenti input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.cd-a11y__segmenti span { display: grid; place-items: center; min-height: 44px; padding: 6px 4px; text-align: center; font-size: .95rem; background: #fff; }
.cd-a11y__segmenti input:checked + span { background: var(--cd-a11y-scuro, #1c1a17); color: var(--cd-a11y-chiaro, #f7f4ee); font-weight: 700; }
.cd-a11y__segmenti input:hover + span { background: var(--cd-a11y-accento, #6e2e2a); color: #fff; }
.cd-a11y__segmenti input:focus-visible + span { outline: 3px solid var(--cd-a11y-accento, #6e2e2a); outline-offset: -3px; }

.cd-a11y__elenco { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.cd-a11y__elenco li { margin: 0; padding: 0; }
.cd-a11y__scelta {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 48px; margin: 0;
  padding: 10px 12px 10px 14px; border: 1px solid rgba(0, 0, 0, .22); border-radius: 12px;
  background: #fff; color: var(--cd-a11y-scuro, #1c1a17); font: inherit; text-align: left; cursor: pointer;
}
.cd-a11y__scelta:hover { background: var(--cd-a11y-scuro, #1c1a17); color: var(--cd-a11y-chiaro, #f7f4ee); border-color: var(--cd-a11y-scuro, #1c1a17); }
.cd-a11y__nome { display: grid; gap: 2px; }
.cd-a11y__nome small { font-size: .85rem; opacity: .85; }
.cd-a11y__interruttore {
  flex: none; position: relative; width: 44px; height: 26px; border-radius: 999px;
  background: #c9c6bf; border: 1px solid rgba(0, 0, 0, .25);
}
.cd-a11y__interruttore::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}
.cd-a11y__scelta[aria-checked="true"] .cd-a11y__interruttore { background: var(--cd-a11y-accento, #6e2e2a); border-color: var(--cd-a11y-accento, #6e2e2a); }
.cd-a11y__scelta[aria-checked="true"] .cd-a11y__interruttore::after { left: 20px; }
.cd-a11y__scelta:hover .cd-a11y__interruttore { border-color: var(--cd-a11y-chiaro, #f7f4ee); }

.cd-a11y__azzera {
  min-height: 48px; margin: 0; padding: 0 16px; border: 1px solid var(--cd-a11y-scuro, #1c1a17); border-radius: 999px;
  background: transparent; color: var(--cd-a11y-scuro, #1c1a17); font: inherit; font-weight: 700; cursor: pointer;
}
.cd-a11y__azzera:hover { background: var(--cd-a11y-scuro, #1c1a17); color: var(--cd-a11y-chiaro, #f7f4ee); }
.cd-a11y__dichiarazione { margin: 0; text-align: center; font-size: .95rem; }
.cd-a11y__dichiarazione a { color: inherit; text-decoration: underline; text-underline-offset: .2em; }

/* ── the statement page (templates/dichiarazione.php): one reading column, as the policies of our themes ── */
.cd-a11y-dichiarazione { max-width: 46rem; margin-inline: auto; }
.cd-a11y-dichiarazione h2[id="english"] { margin-top: 3rem; }

/* ── the choices, generic rules for any theme ──────────────────────────── */

/* Text size: a theme with cd-a11y-testo grows its own type scale; for the others the page is scaled, layout included. */
html.cd-a11y-testo-grande:not([data-cd-a11y-tema~="testo"]) body > :not(.cd-a11y):not(.cd-cookie):not(.cd-a11y-barra) { zoom: 1.15; }
html.cd-a11y-testo-molto:not([data-cd-a11y-tema~="testo"]) body > :not(.cd-a11y):not(.cd-cookie):not(.cd-a11y-barra) { zoom: 1.3; }

/* Highly legible font: Atkinson Hyperlegible (Braille Institute, SIL OFL 1.1), served by the plugin. */
html.cd-a11y-font body, html.cd-a11y-font body :not(svg, svg *) { font-family: "Atkinson Hyperlegible", system-ui, sans-serif !important; }

/* Wider text spacing (values of the booking app, WCAG 1.4.12 for words and paragraphs). */
html.cd-a11y-spazi body :not(.cd-a11y, .cd-a11y *) { line-height: 1.85 !important; letter-spacing: .02em !important; word-spacing: .16em !important; }
html.cd-a11y-spazi body p:not(.cd-a11y *) { margin-bottom: 2em !important; }

html.cd-a11y-link a:not(.cd-a11y *) { text-decoration-line: underline !important; text-decoration-thickness: 1px; text-underline-offset: .2em; }

html.cd-a11y-fermo *, html.cd-a11y-fermo *::before, html.cd-a11y-fermo *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}

html.cd-a11y-cursore, html.cd-a11y-cursore * {
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24'><path d='M4 2l14 8-6 2 4 8-3 1-4-8-4 4z' fill='black' stroke='white' stroke-width='1.2'/></svg>") 4 4, auto !important;
}
html.cd-a11y-cursore :is(a, button, label, summary, select, [role="button"], [role="switch"], input[type="checkbox"], input[type="radio"]) {
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24'><path d='M9 11V4.5a1.5 1.5 0 0 1 3 0V10l5.2.9c1.1.2 1.8 1.2 1.6 2.3L18 19a2 2 0 0 1-2 1.7h-4.7a2 2 0 0 1-1.6-.8L5.4 14.3a1.4 1.4 0 0 1 2.1-1.8z' fill='black' stroke='white' stroke-width='1.2'/></svg>") 12 3, pointer !important;
}

/* Simplified page: what the theme marks as decoration goes away, shadows and effects stop; the theme does the layout
   (one column, plain backgrounds, no sticky bars) when it declares cd-a11y-semplice. */
html.cd-a11y-semplice :is(.cd-a11y-decorativo, [data-cd-a11y-decorativo]) { display: none !important; }
html.cd-a11y-semplice body :not(.cd-a11y, .cd-a11y *) { box-shadow: none !important; text-shadow: none !important; animation: none !important; transition: none !important; }

/* Reading mode: only the main text (the element with data-cd-lettura, or <main>), in one column. accessibilita.js marks the
   text (.cd-lettura-radice) and the elements around it (.cd-lettura-via), then sets cd-a11y-lettura-pronta. */
html.cd-a11y-lettura-pronta body :not(.cd-lettura-via, .cd-lettura-radice, .cd-lettura-radice *, .cd-a11y, .cd-a11y *, .cd-a11y-barra, .cd-a11y-barra *, .cd-cookie, .cd-cookie *, script, style, link) { display: none !important; }
html.cd-a11y-lettura-pronta body { background: #fff !important; }
html.cd-a11y-lettura-pronta .cd-lettura-via {
  display: block !important; position: static !important; width: auto !important; max-width: none !important; min-height: 0 !important;
  margin: 0 !important; padding: 0 !important; background: none !important; box-shadow: none !important; border: 0 !important; transform: none !important;
}
html.cd-a11y-lettura-pronta .cd-lettura-radice {
  display: block !important; position: static !important; box-sizing: border-box; width: auto !important; max-width: 68ch !important;
  margin: 0 auto !important; padding: 32px 20px 96px !important; background: #fff !important; color: #1a1a1a !important;
  font-size: 1.125rem; line-height: 1.7; text-align: left;
}
html.cd-a11y-lettura-pronta .cd-lettura-radice :is(div, section, article, header, footer, figure, main, aside, picture) {
  display: block !important; position: static !important; width: auto !important; max-width: none !important; min-height: 0 !important; height: auto !important;
  margin-inline: 0 !important; padding: 0 !important; background: none !important; box-shadow: none !important; border: 0 !important;
  columns: auto !important; transform: none !important; opacity: 1 !important; clip-path: none !important;
}
/* :is() with ids that never exist lifts the specificity above a page's own #id rules with !important (YOOtheme-style CSS) */
html.cd-a11y-lettura-pronta .cd-lettura-radice :is(*, #cd-a11y-x#cd-a11y-x#cd-a11y-x) { color: inherit !important; background-color: transparent !important; text-align: left !important; }
html.cd-a11y-lettura-pronta .cd-lettura-radice :is(nav, form, button, input, select, textarea, iframe, video, audio, canvas, svg, [role="button"], .cd-a11y-decorativo, [data-cd-a11y-decorativo], [data-cd-lettura-salta], img[alt=""]) { display: none !important; }
html.cd-a11y-lettura-pronta .cd-lettura-radice img { display: block; max-width: 100% !important; height: auto !important; margin: 24px 0 !important; border-radius: 0 !important; }
html.cd-a11y-lettura-pronta .cd-lettura-radice :is(h1, h2, h3, h4) { margin: 1.6em 0 .5em !important; line-height: 1.25 !important; }
html.cd-a11y-lettura-pronta .cd-lettura-radice :is(a, #cd-a11y-x#cd-a11y-x#cd-a11y-x#cd-a11y-x) { color: #0b4f9e !important; text-decoration: underline !important; }

.cd-a11y-barra {
  position: sticky; top: 0; z-index: 899; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 12px 8px 20px; background: var(--cd-a11y-scuro, #1c1a17); color: var(--cd-a11y-chiaro, #f7f4ee); font-size: 1rem; font-weight: 700;
}
.cd-a11y-barra button {
  min-height: 44px; padding: 0 20px; border: 2px solid var(--cd-a11y-chiaro, #f7f4ee); border-radius: 999px;
  background: var(--cd-a11y-chiaro, #f7f4ee); color: var(--cd-a11y-scuro, #1c1a17); font: inherit; font-weight: 700; cursor: pointer;
}
.cd-a11y-barra button:hover { background: transparent; color: var(--cd-a11y-chiaro, #f7f4ee); }
.cd-a11y-barra button:focus-visible { outline: 3px solid var(--cd-a11y-chiaro, #f7f4ee); outline-offset: 2px; }