/* Enjoy Events website v16: the accessibility menu (fix 164, 07-11-2026), the button in the footer's Legal column.
   The choices live on <html>: data-a11y="links heads still gray contrast invert cursor-light|cursor-dark", style.zoom,
   style.filter and --a11y-zoom, written by a11y.js and, before the first paint, by layouts/front/partials/_a11y-boot.
   Filters and zoom sit on the ROOT element on purpose: the root is the one element whose filter does not break
   position: fixed. Colours come from site.css tokens, so the dialog follows the light / dark theme. */

/* ---- effects ---- */
html[data-a11y~="links"] a { text-decoration: underline !important; text-underline-offset: .18em; text-decoration-thickness: 1.5px; }
html[data-a11y~="heads"] :is(h1, h2, h3, h4, h5, h6):not(.a11y-card *) { outline: 2px solid var(--accent, #ff5ea3); outline-offset: 5px; border-radius: 3px; }
html[data-a11y~="still"] *, html[data-a11y~="still"] *::before, html[data-a11y~="still"] *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
html[data-a11y~="invert"] :is(img, video, picture, canvas, iframe) { filter: invert(1) hue-rotate(180deg); }
html[data-a11y~="cursor-light"], html[data-a11y~="cursor-light"] * { cursor: url("data:image/svg+xml;utf8,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2744%27 height=%2752%27 viewBox=%270 0 44 52%27%3E%3Cpath d=%27M6 4 L6 40 L15.5 31.5 L22 46 L29 43 L22.5 28.5 L35 28.5 Z%27 fill=%27%23ffffff%27 stroke=%27%23000000%27 stroke-width=%273%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E") 6 4, auto !important; }
html[data-a11y~="cursor-dark"], html[data-a11y~="cursor-dark"] * { cursor: url("data:image/svg+xml;utf8,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2744%27 height=%2752%27 viewBox=%270 0 44 52%27%3E%3Cpath d=%27M6 4 L6 40 L15.5 31.5 L22 46 L29 43 L22.5 28.5 L35 28.5 Z%27 fill=%27%23000000%27 stroke=%27%23ffffff%27 stroke-width=%273%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E") 6 4, auto !important; }

/* ---- the footer button (an item of the Legal list) ---- */
.a11y-btn { display: inline-flex; align-items: center; gap: 7px; margin-top: 4px; padding: 6px 13px 6px 9px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--text) 28%, transparent); background: transparent; color: inherit; font: inherit; font-size: 14px; font-weight: 600; line-height: 1.2; cursor: pointer; white-space: nowrap; transition: border-color .15s, color .15s, background .15s; }
.a11y-btn:hover { color: var(--accent, #ff5ea3); border-color: var(--accent, #ff5ea3); background: color-mix(in srgb, var(--accent, #ff5ea3) 10%, transparent); }
.a11y-btn:focus-visible { outline: 2px solid var(--accent, #ff5ea3); outline-offset: 2px; }
.a11y-btn svg { width: 17px; height: 17px; flex: none; }

/* ---- the dialog ---- */
.a11y-back { position: fixed; inset: 0; z-index: 2147483100; /* above the cookie bar (99998) and the chat bubble (2147483001): a modal covers both */ display: grid; place-items: center; padding: 16px; background: rgba(4, 5, 12, .66); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); color: var(--text); font-family: "Inter", system-ui, sans-serif; font-size: 16px; line-height: 1.45; }
.a11y-card { position: relative; width: min(600px, 100%); max-height: calc(100svh / var(--a11y-zoom, 1) - 32px); overflow: auto; overscroll-behavior: contain; border-radius: 22px; background: color-mix(in srgb, var(--night) 94%, var(--text) 6%); border: 1px solid color-mix(in srgb, var(--text) 14%, transparent); box-shadow: 0 24px 100px rgba(0, 0, 0, .55); padding: 26px 26px 22px; }
.a11y-card:focus { outline: none; }
.a11y-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 6px; }
.a11y-head h2 { margin: 0; font-size: 26px; font-weight: 800; line-height: 1.05; }
.a11y-head p { margin: 6px 0 0; color: color-mix(in srgb, var(--text) 70%, transparent); font-size: 14px; line-height: 1.5; }
.a11y-x { flex: none; width: 38px; height: 38px; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--text) 20%, transparent); background: color-mix(in srgb, var(--text) 6%, transparent); color: var(--text); cursor: pointer; display: grid; place-items: center; }
.a11y-x svg { width: 16px; height: 16px; }
.a11y-x:hover { border-color: var(--accent, #ff5ea3); }
.a11y-sec { margin-top: 18px; }
.a11y-sec > .k { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: color-mix(in srgb, var(--text) 55%, transparent); margin-bottom: 8px; }
.a11y-box { border: 1px solid color-mix(in srgb, var(--text) 12%, transparent); border-radius: 16px; background: color-mix(in srgb, var(--text) 3%, transparent); overflow: hidden; }
.a11y-row { display: flex; align-items: center; gap: 14px; padding: 13px 16px; border-top: 1px solid color-mix(in srgb, var(--text) 9%, transparent); }
.a11y-row:first-child { border-top: 0; }
.a11y-row .ic { flex: none; width: 34px; height: 34px; border-radius: 10px; background: color-mix(in srgb, var(--text) 7%, transparent); color: var(--accent, #ff5ea3); display: grid; place-items: center; }
.a11y-row .ic svg { width: 18px; height: 18px; }
.a11y-card .t { flex: 1; min-width: 0; }
.a11y-card .t b { display: block; font-size: 15px; font-weight: 700; line-height: 1.25; color: var(--text); }
.a11y-card .t small { display: block; margin-top: 2px; font-size: 12.5px; color: color-mix(in srgb, var(--text) 65%, transparent); line-height: 1.4; }
.a11y-key { flex: none; font: 600 11px/1 ui-monospace, SFMono-Regular, Menlo, monospace; color: color-mix(in srgb, var(--text) 55%, transparent); border: 1px solid color-mix(in srgb, var(--text) 14%, transparent); border-radius: 6px; padding: 5px 7px; white-space: nowrap; }
.a11y-sw { flex: none; width: 46px; height: 27px; border-radius: 999px; border: 0; padding: 0; cursor: pointer; background: color-mix(in srgb, var(--text) 18%, transparent); position: relative; transition: background .18s; }
.a11y-sw::after { content: ""; position: absolute; top: 3px; left: 3px; width: 21px; height: 21px; border-radius: 50%; background: var(--text); transition: transform .18s, background .18s; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
.a11y-sw[aria-checked="true"] { background: var(--accent, #ff5ea3); }
.a11y-sw[aria-checked="true"]::after { transform: translateX(19px); background: #070811; }
.a11y-sw:focus-visible, .a11y-step:focus-visible, .a11y-seg button:focus-visible, .a11y-x:focus-visible, .a11y-reset:focus-visible { outline: 2px solid var(--accent, #ff5ea3); outline-offset: 2px; }
.a11y-zoom { padding: 14px 16px 16px; }
.a11y-zoom .top { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.a11y-zoom .val { font-weight: 800; font-size: 17px; min-width: 56px; text-align: center; font-variant-numeric: tabular-nums; }
.a11y-steps { display: flex; align-items: center; gap: 6px; }
.a11y-step { width: 36px; height: 36px; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--text) 22%, transparent); background: color-mix(in srgb, var(--text) 6%, transparent); color: var(--text); font-size: 20px; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.a11y-step:hover { border-color: var(--accent, #ff5ea3); }
.a11y-step:disabled { opacity: .35; cursor: default; }
.a11y-range { width: 100%; margin: 14px 0 0; accent-color: var(--accent, #ff5ea3); height: 28px; cursor: pointer; }
.a11y-seg { display: flex; gap: 6px; padding: 12px 16px; flex-wrap: wrap; }
.a11y-seg button { flex: 1; min-width: 92px; white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 12px; border-radius: 10px; border: 1px solid color-mix(in srgb, var(--text) 18%, transparent); background: color-mix(in srgb, var(--text) 4%, transparent); color: var(--text); font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.a11y-seg button[aria-pressed="true"] { background: var(--accent, #ff5ea3); color: #070811; border-color: var(--accent, #ff5ea3); }
.a11y-seg svg { width: 20px; height: 20px; overflow: visible; }
.a11y-foot { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-top: 20px; padding-top: 16px; border-top: 1px solid color-mix(in srgb, var(--text) 10%, transparent); }
.a11y-reset { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--text) 25%, transparent); background: transparent; color: var(--text); font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.a11y-reset:hover:not(:disabled) { border-color: var(--accent, #ff5ea3); }
.a11y-reset:disabled { opacity: .45; cursor: default; }
.a11y-reset svg { width: 15px; height: 15px; }
.a11y-foot small { color: color-mix(in srgb, var(--text) 65%, transparent); font-size: 12px; line-height: 1.5; }
@media (max-width: 640px) {
  .a11y-back { place-items: end center; padding: 0; }
  .a11y-card { width: 100%; max-height: calc(100svh / var(--a11y-zoom, 1) - 24px); border-radius: 22px 22px 0 0; padding: 22px 18px calc(18px + env(safe-area-inset-bottom)); }
  .a11y-head h2 { font-size: 23px; }
  .a11y-key { display: none; }
  .a11y-seg { gap: 5px; padding: 12px 12px; }
  .a11y-seg button { font-size: 12.5px; padding: 10px 6px; min-width: 0; gap: 6px; }
  .a11y-foot { flex-direction: column; align-items: stretch; }
  .a11y-reset { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { .a11y-sw, .a11y-sw::after, .a11y-btn { transition: none; } }