/* ══════════════════════════════════════════
   ACCESSIBILITY WIDGET  (replaces TabNav)
   Markup is built by /js/a11y.js — AR: bottom-left, EN: bottom-right
   (opposite the countdown button)
══════════════════════════════════════════ */
.a11y-btn {
  position: fixed; bottom: 28px; z-index: 9999;
  width: 58px; height: 58px; border-radius: 50%; border: 0; cursor: pointer;
  background: #00919E; color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 20px rgba(0,60,70,.35), 0 0 0 4px rgba(0,145,158,.18);
  transition: transform .15s, background .2s, opacity .2s;
}
.a11y-btn:hover { background: #007a86; transform: scale(1.06); }
.a11y-btn:focus-visible { outline: 3px solid #FFD966; outline-offset: 3px; }
.a11y-btn svg { width: 30px; height: 30px; }
.a11y-rtl.a11y-btn, .a11y-rtl.a11y-panel { left: 28px; }
.a11y-ltr.a11y-btn, .a11y-ltr.a11y-panel { right: 28px; }

.a11y-panel {
  position: fixed; bottom: 100px; z-index: 10000;
  width: 300px; max-width: calc(100vw - 32px); max-height: calc(100vh - 130px); overflow-y: auto;
  background: #fff; color: #1a2e2e; border-radius: 18px;
  box-shadow: 0 18px 50px rgba(0,0,0,.25); border: 1px solid rgba(0,145,158,.15);
  font-family: 'Cairo', sans-serif; font-size: 15px; line-height: 1.5;
  padding: 16px 18px 14px;
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity .2s, transform .2s, visibility .2s;
}
.a11y-panel.open { opacity: 1; visibility: visible; transform: translateY(0); }
.a11y-panel * { box-sizing: border-box; font-family: inherit; letter-spacing: normal !important; }

.a11y-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.a11y-head h2 { font-size: 17px; font-weight: 800; color: #1a2e2e; margin: 0; line-height: 1.4; }
.a11y-x {
  width: 32px; height: 32px; border: 0; border-radius: 8px; background: transparent; cursor: pointer;
  color: #555; font-size: 22px; line-height: 1; display: flex; align-items: center; justify-content: center;
}
.a11y-x:hover { background: #f0f4f4; color: #000; }

.a11y-row {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 11px 0; border-top: 1px solid #edf1f1;
}
.a11y-row:first-of-type { border-top: 0; }
.a11y-label { font-size: 15px; font-weight: 600; color: #1a2e2e; }

/* Text size buttons */
.a11y-fs { display: flex; gap: 6px; }
.a11y-fs button {
  min-width: 40px; height: 36px; padding: 0 8px; border-radius: 9px; cursor: pointer;
  border: 1px solid #d5dede; background: #fff; color: #1a2e2e; font-weight: 800; font-size: 15px;
  transition: background .15s, border-color .15s;
}
.a11y-fs button:hover { border-color: #00919E; }
.a11y-fs button[aria-pressed="true"] { background: rgba(0,145,158,.12); border-color: #00919E; color: #007a86; }

/* Switches */
.a11y-sw {
  position: relative; width: 50px; height: 28px; flex-shrink: 0; cursor: pointer;
  border: 0; border-radius: 50px; background: #cfd8d8; transition: background .2s; padding: 0;
}
.a11y-sw::after {
  content: ''; position: absolute; top: 3px; width: 22px; height: 22px; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform .2s;
  left: 3px;
}
.a11y-sw[aria-checked="true"] { background: #00919E; }
.a11y-sw[aria-checked="true"]::after { transform: translateX(22px); }
.a11y-panel[dir="rtl"] .a11y-sw::after { left: auto; right: 3px; }
.a11y-panel[dir="rtl"] .a11y-sw[aria-checked="true"]::after { transform: translateX(-22px); }
.a11y-sw:focus-visible, .a11y-fs button:focus-visible, .a11y-reset:focus-visible, .a11y-x:focus-visible {
  outline: 3px solid #FFD966; outline-offset: 2px;
}

.a11y-reset {
  width: 100%; margin-top: 10px; height: 44px; border-radius: 12px; cursor: pointer;
  border: 1px solid #d5dede; background: #fff; color: #1a2e2e; font-size: 15px; font-weight: 800;
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.a11y-reset:hover { border-color: #00919E; color: #007a86; }

/* Hide floating buttons while the mobile menu is open */
html.a11y-menu-open .a11y-btn, html.a11y-menu-open .a11y-panel,
html.a11y-menu-open .cw-trigger, html.a11y-menu-open .cw-panel { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }

@media (max-width: 600px) {
  .a11y-btn { width: 52px; height: 52px; bottom: 20px; }
  .a11y-btn svg { width: 27px; height: 27px; }
  .a11y-rtl.a11y-btn, .a11y-rtl.a11y-panel { left: 16px; }
  .a11y-ltr.a11y-btn, .a11y-ltr.a11y-panel { right: 16px; }
  .a11y-panel { bottom: 84px; }
}

/* ══════════ THE FEATURES ══════════ */

/* High contrast */
html.a11y-contrast { filter: contrast(1.35) saturate(1.15); }

/* Highlight links */
html.a11y-links a:not(.a11y-ui) {
  text-decoration: underline !important; text-underline-offset: 3px;
  outline: 2px dashed #FFD966 !important; outline-offset: 2px;
}

/* Line spacing (no letter-spacing — keeps Arabic intact) */
html.a11y-spacing :is(p, li, dd, td, label, .faq-a, .hero-desc, .org-desc, .ctl-title, .ctl-desc, .pg-title, .pg-note, .track-lead) {
  line-height: 2 !important;
}

/* Stop animations */
html.a11y-still *, html.a11y-still *::before, html.a11y-still *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}
html.a11y-still .reveal { opacity: 1 !important; transform: none !important; }

/* Big cursor */
html.a11y-cursor, html.a11y-cursor * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='48' viewBox='0 0 44 48'%3E%3Cpath d='M4 3v36l10-10 7 16 7-3-7-15h14z' fill='%23000' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 4 3, auto !important;
}
html.a11y-cursor :is(a, button, [role="switch"], label, select, summary),
html.a11y-cursor :is(a, button, [role="switch"], label, select, summary) * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='48' viewBox='0 0 44 48'%3E%3Cpath d='M4 3v36l10-10 7 16 7-3-7-15h14z' fill='%2300919E' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 4 3, pointer !important;
}