/* Accessibility widget + user-toggled accessibility states.
   Loaded on every page (React app + static home.html). RTL, navy/gold theme. */

/* ---- floating toggle button ---- */
#a11y-btn{position:fixed;bottom:24px;left:24px;z-index:2147483000;width:52px;height:52px;border-radius:50%;
  background:#C5A55A;color:#0a1628;border:none;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.35);
  display:flex;align-items:center;justify-content:center;transition:transform .2s ease}
#a11y-btn:hover{transform:scale(1.08)}
#a11y-btn:focus-visible{outline:3px solid #fff;outline-offset:2px}
#a11y-btn svg{width:30px;height:30px}
@media(max-width:760px){#a11y-btn{bottom:84px;left:16px;width:46px;height:46px}#a11y-btn svg{width:26px;height:26px}}

/* ---- panel ---- */
#a11y-panel{position:fixed;bottom:88px;left:24px;z-index:2147483000;width:300px;max-width:calc(100vw - 32px);
  max-height:80vh;overflow:auto;background:#0f1d33;color:#f5f1e8;border:1px solid rgba(197,165,90,.4);
  border-radius:16px;padding:16px;box-shadow:0 12px 40px rgba(0,0,0,.5);direction:rtl;
  font-family:Heebo,system-ui,sans-serif;display:none}
#a11y-panel[data-open="true"]{display:block}
#a11y-panel h2{font-size:17px;font-weight:700;margin:0 0 4px;color:#C5A55A}
#a11y-panel p.sub{font-size:12px;color:#9aa3b0;margin:0 0 12px}
#a11y-panel .a11y-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#a11y-panel button.opt{background:rgba(255,255,255,.04);border:1px solid rgba(197,165,90,.25);color:#f5f1e8;
  border-radius:10px;padding:10px 8px;font-size:13px;font-weight:500;cursor:pointer;display:flex;flex-direction:column;
  align-items:center;gap:6px;font-family:inherit;transition:border-color .2s}
#a11y-panel button.opt:hover{border-color:#C5A55A}
#a11y-panel button.opt[aria-pressed="true"]{background:#C5A55A;color:#0a1628;border-color:#C5A55A}
#a11y-panel button.opt svg{width:22px;height:22px}
#a11y-panel .a11y-fontrow{display:flex;align-items:center;gap:8px;margin:10px 0}
#a11y-panel .a11y-fontrow span{flex:1;font-size:13px}
#a11y-panel .a11y-fontrow button{width:38px;height:38px;border-radius:10px;border:1px solid rgba(197,165,90,.3);
  background:rgba(255,255,255,.04);color:#f5f1e8;font-size:18px;font-weight:700;cursor:pointer}
#a11y-panel .a11y-foot{margin-top:12px;display:flex;justify-content:space-between;align-items:center;gap:8px}
#a11y-panel .a11y-reset{flex:1;background:transparent;border:1px solid rgba(255,255,255,.25);color:#cfd3da;
  border-radius:10px;padding:9px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
#a11y-panel .a11y-statement{font-size:12px;color:#C5A55A;text-decoration:underline;white-space:nowrap}
#a11y-panel .a11y-close{position:absolute;top:10px;left:12px;background:none;border:none;color:#9aa3b0;font-size:22px;
  line-height:1;cursor:pointer}

/* ---- applied accessibility states (on <html>) ---- */
html.a11y-underline a{text-decoration:underline !important}
html.a11y-readable *{font-family:Arial,"Segoe UI",sans-serif !important;letter-spacing:.02em !important}
html.a11y-grayscale{filter:grayscale(100%)}
html.a11y-invert{filter:invert(100%) hue-rotate(180deg)}
html.a11y-invert img,html.a11y-invert video,html.a11y-invert .leaflet-tile{filter:invert(100%) hue-rotate(180deg)}
html.a11y-contrast,html.a11y-contrast body{background:#000 !important;color:#fff !important}
html.a11y-contrast a{color:#ff0 !important}
html.a11y-contrast button,html.a11y-contrast input,html.a11y-contrast textarea,html.a11y-contrast select{background:#000 !important;color:#fff !important;border-color:#fff !important}
html.a11y-stopmotion *,html.a11y-stopmotion *::before,html.a11y-stopmotion *::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
html.a11y-bigcursor,html.a11y-bigcursor *{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' stroke='%23fff' stroke-width='1' d='M4 2l16 8-7 2 4 8-3 1-4-8-6 4z'/%3E%3C/svg%3E") 4 4,auto !important}
html.a11y-highlight a:focus,html.a11y-highlight button:focus,html.a11y-highlight input:focus,html.a11y-highlight select:focus,html.a11y-highlight textarea:focus{outline:3px solid #C5A55A !important;outline-offset:2px !important}

/* keyboard-focus visibility everywhere (baseline a11y improvement) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #C5A55A;outline-offset:2px}

/* screen-reader-only utility + skip link */
.a11y-sr{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#a11y-skip{position:fixed;top:-60px;right:16px;z-index:2147483001;background:#C5A55A;color:#0a1628;padding:10px 18px;
  border-radius:0 0 10px 10px;font-family:Heebo,system-ui,sans-serif;font-weight:700;text-decoration:none;transition:top .2s}
#a11y-skip:focus{top:0}
