/* Accessibility - VanService / Global Service S.r.l. */

@font-face {
    font-family: 'OpenDyslexic';
    src: url('/fonts/OpenDyslexic-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.skip-to-content {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%) translateY(-100%);
    background: #09409a;
    color: #ffffff;
    padding: 0.875rem 2rem;
    border-radius: 0 0 12px 12px;
    z-index: 99999;
    font-weight: 700;
    font-size: 1rem;
    text-decoration: none;
    transition: transform 0.2s ease;
    white-space: nowrap;
}
.skip-to-content:focus { transform: translateX(-50%) translateY(0); outline: 3px solid #fff; outline-offset: 2px; }

*:focus-visible { outline: 3px solid #09409a; outline-offset: 2px; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

#a11y-toggle { position: fixed; bottom: 84px; right: 20px; z-index: 9990; width: 52px; height: 52px; border-radius: 50%; background: #09409a; color: #fff; border: 3px solid transparent; cursor: pointer; box-shadow: 0 4px 16px rgba(9,64,154,0.35); display: flex; align-items: center; justify-content: center; transition: background 0.2s, transform 0.2s; padding: 0; }
#a11y-toggle:hover { background: #062d6d; transform: scale(1.08); }
#a11y-toggle:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.a11y-badge { position: absolute; top: -4px; right: -4px; background: #c53030; color: #fff; font-size: 11px; font-weight: 700; width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; pointer-events: none; }
#a11y-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 9991; opacity: 0; pointer-events: none; transition: opacity 0.25s; }
#a11y-overlay.open { opacity: 1; pointer-events: auto; }
#a11y-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(380px,100vw); background: #fff; z-index: 9992; display: flex; flex-direction: column; box-shadow: -4px 0 32px rgba(0,0,0,0.18); transform: translateX(100%); transition: transform 0.3s cubic-bezier(0.4,0,0.2,1); overflow-y: auto; }
#a11y-panel.open { transform: translateX(0); }
.a11y-panel-header { display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 1.5rem; border-bottom: 1px solid #e5e5e5; background: #f8f8f8; position: sticky; top: 0; z-index: 1; }
.a11y-panel-header h2 { font-size: 1.1rem; font-weight: 800; color: #09409a; margin: 0; display: flex; align-items: center; }
#a11y-close { background: none; border: none; cursor: pointer; color: #333; padding: 6px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
#a11y-close:hover { background: #e5e5e5; }
#a11y-close:focus-visible { outline: 3px solid #09409a; outline-offset: 2px; }
.a11y-panel-body { padding: 1.25rem 1.5rem; display: flex; flex-direction: column; gap: 1.25rem; flex: 1; }
.a11y-section-title { font-size: 0.7rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.1em; color: #888; margin-bottom: 0.5rem; }
.a11y-font-group { display: grid; grid-template-columns: repeat(4,1fr); gap: 0.5rem; }
.a11y-font-group [role="radio"] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.25rem; padding: 0.5rem 0.25rem; border: 2px solid #e5e5e5; border-radius: 10px; cursor: pointer; background: #fff; font-family: inherit; font-size: 0.75rem; color: #333; text-align: center; transition: border-color 0.15s; }
.a11y-font-group [role="radio"]:hover { border-color: #09409a; }
.a11y-font-group [role="radio"][aria-checked="true"] { border-color: #09409a; background: rgba(9,64,154,0.1); color: #09409a; font-weight: 700; }
.a11y-font-group [role="radio"]:focus-visible { outline: 3px solid #09409a; outline-offset: 2px; }
.a11y-font-sample { font-weight: 700; line-height: 1; }
.a11y-controls { display: flex; flex-direction: column; gap: 0.5rem; }
.a11y-ctrl { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 1rem; border: 2px solid #e5e5e5; border-radius: 12px; cursor: pointer; background: #fff; font-family: inherit; font-size: 0.875rem; color: #333; text-align: left; width: 100%; gap: 0.75rem; transition: border-color 0.15s; }
.a11y-ctrl:hover { border-color: #09409a; }
.a11y-ctrl[aria-pressed="true"] { border-color: #09409a; background: rgba(9,64,154,0.08); color: #09409a; font-weight: 700; }
.a11y-ctrl:focus-visible { outline: 3px solid #09409a; outline-offset: 2px; }
.a11y-ctrl-label { display: flex; align-items: center; gap: 0.5rem; pointer-events: none; }
.a11y-switch { flex-shrink: 0; width: 40px; height: 22px; background: #d1d1d1; border-radius: 11px; position: relative; transition: background 0.2s; pointer-events: none; }
.a11y-ctrl[aria-pressed="true"] .a11y-switch { background: #09409a; }
.a11y-switch::after { content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; background: #fff; border-radius: 50%; transition: transform 0.2s; }
.a11y-ctrl[aria-pressed="true"] .a11y-switch::after { transform: translateX(18px); }
#a11y-reset { margin: 0 1.5rem 1.5rem; padding: 0.75rem; background: none; border: 2px solid #e5e5e5; border-radius: 12px; cursor: pointer; font-family: inherit; font-size: 0.875rem; color: #555; display: flex; align-items: center; justify-content: center; gap: 0.5rem; transition: border-color 0.15s; width: calc(100% - 3rem); }
#a11y-reset:hover { border-color: #c53030; color: #c53030; }
#a11y-reset:focus-visible { outline: 3px solid #09409a; outline-offset: 2px; }

html.a11y-font-1 { font-size: 112.5%; }
html.a11y-font-2 { font-size: 125%; }
html.a11y-font-3 { font-size: 137.5%; }
html.a11y-high-contrast body { background: #fff !important; color: #000 !important; }
html.a11y-high-contrast a { color: #00008B !important; text-decoration: underline !important; }
html.a11y-dyslexia-font, html.a11y-dyslexia-font * { font-family: 'OpenDyslexic', serif !important; }
html.a11y-link-highlight a { text-decoration: underline !important; outline: 2px solid #FFD700; outline-offset: 1px; }
html.a11y-stop-animations *, html.a11y-stop-animations *::before, html.a11y-stop-animations *::after { animation-duration: 0ms !important; animation-iteration-count: 1 !important; transition-duration: 0ms !important; scroll-behavior: auto !important; }
html.a11y-bigger-cursor, html.a11y-bigger-cursor * { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M6 4 L6 38 L14 30 L20 44 L26 41 L20 27 L30 27 Z' fill='white' stroke='black' stroke-width='2'/%3E%3C/svg%3E") 6 4, auto !important; }
html.a11y-text-spacing * { letter-spacing: 0.12em !important; word-spacing: 0.16em !important; line-height: 2 !important; }
html.a11y-grayscale { filter: grayscale(100%); }
