/* ── A11y trigger ─────────────────────────────────────────── */
.a11y-trigger {
    position: relative;
    flex: 0 0 auto;
    align-self: center;
    width: 38px;
    height: 38px;
    border: 0;
    background: transparent;
    color: rgba(255,255,255,.65);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 14px;
    transition: color .2s;
}
.a11y-trigger:hover { color: var(--y); }
.a11y-trigger:focus-visible { outline: 2px solid var(--y); outline-offset: 3px; }

.a11y-trigger__dot {
    display: none;
    position: absolute;
    top: 7px;
    right: 7px;
    width: 7px;
    height: 7px;
    background: var(--y);
    border-radius: 50%;
    border: 1.5px solid rgba(0,0,0,.92);
}
.a11y-trigger.has-active .a11y-trigger__dot { display: block; }

/* ── Panel ───────────────────────────────────────────────── */
.a11y-panel {
    position: fixed;
    top: calc(var(--hdr) + 12px);
    right: 24px;
    z-index: 9001;
    width: 280px;
    background: var(--wht);
    border: 1px solid var(--gm);
    border-radius: var(--rb);
    box-shadow: var(--sh);
    opacity: 0;
    transform: translateY(10px) scale(0.97);
    pointer-events: none;
    transition: opacity .2s var(--ease), transform .2s var(--ease);
    transform-origin: top right;
}
.a11y-panel.is-open {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}
.a11y-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 14px 11px;
    border-bottom: 1px solid var(--gm);
}
.a11y-panel__title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--gt);
}
.a11y-panel__close {
    width: 28px;
    height: 28px;
    border: none;
    background: none;
    cursor: pointer;
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: background .15s;
}
.a11y-panel__close:hover { background: var(--gl); }
.a11y-panel__close:focus-visible { outline: 2px solid var(--y); outline-offset: 2px; }

/* ── Options ─────────────────────────────────────────────── */
.a11y-panel__options {
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.a11y-option {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 10px;
    border: 1px solid transparent;
    background: none;
    cursor: pointer;
    text-align: left;
    border-radius: 6px;
    transition: background .15s, border-color .15s;
    color: var(--ink);
    font-family: 'DM Sans', sans-serif;
}
.a11y-option:hover { background: var(--gl); }
.a11y-option:focus-visible { outline: 2px solid var(--y); outline-offset: 2px; }
.a11y-option[aria-pressed="true"] {
    background: rgba(255,215,0,.1);
    border-color: rgba(255,215,0,.35);
}
.a11y-option__icon {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gl);
    color: var(--ink);
    border-radius: 6px;
    transition: background .2s, color .2s;
}
.a11y-option[aria-pressed="true"] .a11y-option__icon {
    background: var(--y);
    color: var(--blk);
}
.a11y-option__label {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
}

/* Toggle switch */
.a11y-option__toggle {
    width: 34px;
    height: 19px;
    background: var(--gm);
    flex-shrink: 0;
    position: relative;
    border-radius: 10px;
    border: 1px solid rgba(0,0,0,.12);
    box-sizing: border-box;
    transition: background .2s, border-color .2s;
}
.a11y-option__toggle::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 11px;
    height: 11px;
    background: #fff;
    border-radius: 50%;
    transition: transform .2s;
}
.a11y-option[aria-pressed="true"] .a11y-option__toggle {
    background: var(--yd);
    border-color: var(--yd);
}
.a11y-option[aria-pressed="true"] .a11y-option__toggle::after {
    transform: translateX(15px);
}

/* Reset */
.a11y-panel__reset {
    display: block;
    width: calc(100% - 16px);
    margin: 0 8px 8px;
    padding: 9px;
    border: 1px solid var(--gm);
    background: none;
    cursor: pointer;
    font-size: 13px;
    font-family: 'DM Sans', sans-serif;
    color: var(--gt);
    text-align: center;
    border-radius: 6px;
    transition: background .15s, color .15s;
}
.a11y-panel__reset:hover { background: var(--gl); color: var(--ink); }
.a11y-panel__reset:focus-visible { outline: 2px solid var(--y); outline-offset: 2px; }

@media (max-width: 768px) {
    .a11y-trigger { margin-left: 0; margin-right: 4px; }
}

@media (max-width: 480px) {
    .a11y-panel { right: 12px; width: calc(100vw - 24px); }
}

/* ═══════════════════════════════════════════════════════════
   A11Y MODES
   ═══════════════════════════════════════════════════════════ */

/* — Large text ——————————————————————————————————————————— */
html.a11y-large { font-size: 112%; }
html.a11y-large body { font-size: 1.04rem; }
html.a11y-large :where(p, li, label, input, textarea, select, button, td, th, figcaption) {
    font-size: max(1em, 1rem);
}
html.a11y-large :where(#hdr nav a, .mob-nav li a) {
    font-size: max(1em, 1rem) !important;
}
html:where(.a11y-large, .a11y-spacing, .a11y-contrast),
html:where(.a11y-large, .a11y-spacing, .a11y-contrast) body {
    max-width: 100%;
    overflow-x: clip;
}

/* — High contrast ———————————————————————————————————————— */
html.a11y-contrast {
    --gm: #000000;
    --gt: #333333;
    --ink: #000000;
    color-scheme: light;
}
html.a11y-contrast body {
    background: #ffffff !important;
    color: #000000 !important;
}
html.a11y-contrast * {
    text-shadow: none !important;
    box-shadow: none !important;
}

/* Header & nav */
html.a11y-contrast :where(#hdr, #mob) {
    background: #000000 !important;
    border-bottom-color: #ffffff !important;
}
html.a11y-contrast :where(#hdr nav a, .mob-nav li a) {
    color: rgba(255,255,255,.8) !important;
}
html.a11y-contrast :where(#hdr nav a:hover, #hdr nav a.act, .mob-nav li a:hover) {
    color: #ffd700 !important;
    text-decoration: underline;
}
html.a11y-contrast :where(#ham span) { background: #ffffff !important; }

/* Verifica forms */
html.a11y-contrast :where(.hdr-verifica, .mob-verifica-form) {
    border-color: rgba(255,255,255,.5) !important;
}
html.a11y-contrast :where(.hdr-verifica-inp, .mob-verifica-inp) {
    background: #000000 !important;
    color: #ffffff !important;
}
html.a11y-contrast :where(.hdr-verifica-btn, .mob-verifica-btn) {
    background: #ffd700 !important;
    color: #000000 !important;
}

/* Footer */
html.a11y-contrast #footer {
    background: #000000 !important;
    border-top-color: rgba(255,255,255,.25) !important;
}
html.a11y-contrast :where(#footer, #footer a, .ft-col a, .ft-brand p, .ft-bottom p) {
    color: rgba(255,255,255,.85) !important;
}
html.a11y-contrast :where(.ft-col a:hover, #footer a:hover) {
    color: #ffd700 !important;
    text-decoration: underline;
}

/* Buttons */
html.a11y-contrast :where(.bp) {
    background: #000000 !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    box-shadow: none !important;
}
html.a11y-contrast :where(.bs) {
    background: #ffffff !important;
    color: #000000 !important;
    border: 2px solid #000000 !important;
}
html.a11y-contrast :where(.btnc) {
    background: #000000 !important;
    color: #ffffff !important;
}

/* Product cards */
html.a11y-contrast :where(.pc) {
    background: #ffffff !important;
    border-color: #000000 !important;
}
html.a11y-contrast :where(.pi) { background: #f0f0f0 !important; }
html.a11y-contrast :where(.pname) { color: #000000 !important; }
html.a11y-contrast :where(.pspec, .ppr small) { color: #444444 !important; }
html.a11y-contrast :where(.ba) {
    background: #ffd700 !important;
    color: #000000 !important;
}
html.a11y-contrast :where(.ba--out) {
    background: #e0e0e0 !important;
    color: #333333 !important;
}
html.a11y-contrast :where(.pgrade) {
    background: #e8f5e9 !important;
    color: #1b5e20 !important;
    border: 1px solid #1b5e20 !important;
}

/* Catalog filters */
html.a11y-contrast :where(.cat-tab) {
    background: #ffffff !important;
    border-color: #000000 !important;
    color: #000000 !important;
}
html.a11y-contrast :where(.cat-tab.active) {
    background: #000000 !important;
    color: #ffffff !important;
}
html.a11y-contrast :where(.fck) {
    background: #ffffff !important;
    border-color: #000000 !important;
    color: #000000 !important;
}
html.a11y-contrast :where(.fck.on) {
    background: #000000 !important;
    color: #ffffff !important;
}
html.a11y-contrast :where(.filt) {
    background: #ffffff !important;
    border-color: #000000 !important;
}
html.a11y-contrast :where(.fck-check input) {
    accent-color: #000000;
}

/* Hero */
html.a11y-contrast :where(#hero) { background: #ffffff !important; }
html.a11y-contrast :where(.pxbg, .pxorbs) { display: none !important; }
html.a11y-contrast :where(.hero-showcase) {
    border-color: #000000 !important;
    background: #ffffff !important;
}
html.a11y-contrast :where(.hs-hero-text) { border-color: #000000 !important; }
html.a11y-contrast :where(.hs-hero-text h1) { color: #000000 !important; }
html.a11y-contrast :where(.hs-hero-text h1 em) { color: #b8960a !important; }
html.a11y-contrast :where(.hs-hero-text p) { color: #333333 !important; }
html.a11y-contrast :where(.hs-tabs) {
    background: #f0f0f0 !important;
    border-top-color: #000000 !important;
}
html.a11y-contrast :where(.hs-tab) { color: #444444 !important; }
html.a11y-contrast :where(.hs-tab.active) { color: #b8960a !important; }
html.a11y-contrast :where(.hs-svc-card) {
    background: #f8f8f8 !important;
    border-color: #000000 !important;
}
html.a11y-contrast :where(.hbadge) {
    background: rgba(255,215,0,.15) !important;
    border-color: #b8960a !important;
    color: #b8960a !important;
}

/* Yellow marquee */
html.a11y-contrast :where(.mqstrip) { background: #000000 !important; }
html.a11y-contrast :where(.mqitem) { color: #ffffff !important; }

/* Yellow counter section */
html.a11y-contrast :where(.ctr-sec) { background: #000000 !important; }
html.a11y-contrast :where(.ctr-sec .cn) { color: #ffd700 !important; }
html.a11y-contrast :where(.ctr-sec .cl) { color: rgba(255,255,255,.7) !important; }

/* Dark eco/service sections */
html.a11y-contrast :where(.ecosec, .svc-sec) { background: #000000 !important; }
html.a11y-contrast :where(.ecosec *, .svc-sec *) { color: #ffffff !important; }
html.a11y-contrast :where(.ecn) { color: #ffd700 !important; }
html.a11y-contrast :where(.sc2) {
    background: #111111 !important;
    border-color: rgba(255,255,255,.4) !important;
}

/* Why cards */
html.a11y-contrast :where(.wcard) {
    background: #ffffff !important;
    border: 1px solid #000000 !important;
}
html.a11y-contrast :where(.wcard h3, .wcard p) { color: #000000 !important; }
html.a11y-contrast :where(.wicon) {
    background: #000000 !important;
    color: #ffffff !important;
}

/* Single product */
html.a11y-contrast :where(.prod-img-wrap, .prod-img-placeholder) {
    background: #f0f0f0 !important;
    border-color: #000000 !important;
}
html.a11y-contrast :where(.prod-grade-badge) {
    background: #e8f5e9 !important;
    color: #1b5e20 !important;
    border: 1px solid #1b5e20 !important;
}
html.a11y-contrast :where(.prod-specs-table, .spec-row) {
    border-color: #000000 !important;
}
html.a11y-contrast :where(.spec-row:nth-child(even)) { background: #f5f5f5 !important; }
html.a11y-contrast :where(.spec-row dt) { color: #333333 !important; }
html.a11y-contrast :where(.prod-warranty-box) {
    background: rgba(255,215,0,.08) !important;
    border-color: #b8960a !important;
}
html.a11y-contrast :where(.prod-eco-box) {
    background: rgba(46,125,50,.06) !important;
    border-color: #2e7d32 !important;
}

/* Store search */
html.a11y-contrast :where(.store-search input) {
    background: #ffffff !important;
    border-color: #000000 !important;
    color: #000000 !important;
}

/* a11y panel itself */
html.a11y-contrast :where(.a11y-panel) {
    background: #ffffff !important;
    border-color: #000000 !important;
    color: #000000 !important;
}
html.a11y-contrast :where(.a11y-option[aria-pressed="true"] .a11y-option__icon) {
    background: #000000 !important;
    color: #ffffff !important;
}
html.a11y-contrast :where(.a11y-option[aria-pressed="true"] .a11y-option__toggle) {
    background: #000000 !important;
    border-color: #000000 !important;
}

/* SVG strokes inherit currentColor */
html.a11y-contrast :where(svg path, svg circle, svg rect, svg line, svg polyline, svg polygon) {
    stroke: currentColor;
}

/* Images */
html.a11y-contrast :where(img, video) {
    filter: contrast(1.1) saturate(0.85);
}

/* Focus outlines */
html.a11y-contrast :focus-visible {
    outline: 3px solid #000000 !important;
    outline-offset: 3px !important;
}
html.a11y-contrast :where(#hdr, #footer, #mob) :focus-visible {
    outline-color: #ffffff !important;
}

/* — Reduce motion ———————————————————————————————————————— */
html.a11y-no-motion *,
html.a11y-no-motion *::before,
html.a11y-no-motion *::after {
    animation: none !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition: none !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
}
/* Reveal elements must be visible if motion is off */
html.a11y-no-motion :where(.rv) {
    opacity: 1 !important;
    transform: none !important;
}

/* — Increased spacing (WCAG 1.4.12) ————————————————————— */
html.a11y-spacing :where(p, li, label, span, td, th, a, button, input, textarea, select, figcaption, h1, h2, h3, h4, h5, h6) {
    line-height: 1.9 !important;
    letter-spacing: 0.05em !important;
    word-spacing: 0.16em !important;
}
html.a11y-spacing :where(.bp, .bs, .hdr-verifica-btn, .mob-verifica-btn) {
    white-space: normal;
    min-height: 44px;
    height: auto !important;
}
