/* ═══════════════════════════════════════════════════════════════════════════
   Меню доступности (תפריט נגישות) — a11y.js, выбор до отрисовки — a11y-boot.js.
   Тот же файл лежит в admin-app — держать одинаковыми.

   Закон (Израиль): сайт обязан соответствовать ת"י 5568 (2023) = WCAG 2.0 AA. Меню —
   дополнение, а не замена: сам сайт обязан быть доступным и без него (так прямо пишет
   Комиссия по равноправию людей с инвалидностью). Поэтому здесь только
   настройки вида, а доступность самих экранов — в style.css / app.js.

   Иконки приложения — инлайновые SVG, шрифтовых лигатур нет, так что шрифт и
   межбуквенный интервал можно менять у всего подряд.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Размер: приложение нарисовано в пикселях (15px, 44px…), rem тут не поможет —
   масштабируем весь интерфейс CSS-свойством zoom: это настоящий масштаб раскладки
   (текст перестраивается, ничего не растягивается картинкой). Щипок пальцами тоже
   снова работает — его запреты сняты (index.html, style.css). */
html[data-a11y-text="1"] body{ zoom:1.15; }
html[data-a11y-text="2"] body{ zoom:1.3; }
html[data-a11y-text="3"] body{ zoom:1.5; }

/* ── Интервалы текста — значения WCAG 1.4.12 */
html[data-a11y-spacing] body *{
  line-height:1.5 !important;
  letter-spacing:0.12em !important;
  word-spacing:0.16em !important;
}
html[data-a11y-spacing] body p + p{ margin-top:1em; }

/* ── Читаемый шрифт: Atkinson Hyperlegible Next (латиница и цифры — Институт Брайля,
   для слабовидящих) + Noto Sans Hebrew (иврит) и Noto Sans (кириллица). Все три —
   SIL Open Font License 1.1, коммерческое использование разрешено. Файлы шрифтов
   браузер качает только когда пункт включён (a11y.js добавляет ссылку на Google Fonts). */
html[data-a11y-font]{
  --a11y-font:"Atkinson Hyperlegible Next", "Noto Sans Hebrew", "Noto Sans", Arial, sans-serif;
  --font-ui:var(--a11y-font);
  --font-num:var(--a11y-font);
}
html[data-a11y-font] body :not(svg, svg *){ font-family:var(--a11y-font) !important; }

/* ── Высокий контраст: второстепенный текст — как основной, рамки — видимые */
html[data-a11y-contrast="high"]{
  --ink-soft:var(--ink);
  --disabled-ink:var(--ink);
  --border:color-mix(in srgb, var(--ink) 75%, transparent);
  --gold-ink:var(--ink);
}
html[data-a11y-contrast="high"] body *{ text-shadow:none !important; }
html[data-a11y-contrast="high"] ::placeholder{ color:var(--ink) !important; opacity:0.85 !important; }

/* ── Оттенки серого — на корне документа: по спецификации filter на корне не ломает
   position:fixed у потомков */
html[data-a11y-contrast="mono"]{ filter:grayscale(1); }

/* ── Выделить ссылки и кнопки */
html[data-a11y-links] a, html[data-a11y-links] [role="link"], html[data-a11y-links] .link-btn{
  text-decoration-line:underline !important;
  text-decoration-thickness:2px !important;
  text-underline-offset:3px !important;
  outline:2px solid currentColor; outline-offset:2px;
}
html[data-a11y-links] button:not(:disabled):not(.link-btn), html[data-a11y-links] [role="button"]{
  outline:2px dashed currentColor; outline-offset:2px;
}

/* ── Остановить анимацию: всё встаёт в конечный кадр сразу (не animation:none —
   так события animationend всё равно приходят и ничего не остаётся невидимым) */
html[data-a11y-motion]{ scroll-behavior:auto !important; }
html[data-a11y-motion] *, html[data-a11y-motion] *::before, html[data-a11y-motion] *::after{
  animation-duration:0.01ms !important;
  animation-delay:0s !important;
  animation-iteration-count:1 !important;
  transition-duration:0.01ms !important;
  transition-delay:0s !important;
  scroll-behavior:auto !important;
}
html[data-a11y-motion]::view-transition-group(*),
html[data-a11y-motion]::view-transition-old(*),
html[data-a11y-motion]::view-transition-new(*){ animation:none !important; }

/* ── Крупный курсор */
html[data-a11y-cursor], html[data-a11y-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 3 L6 40 L15.5 31 L22 45 L28.5 42 L22 28.5 L35 28.5 Z' fill='%23000' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 3, auto !important;
}
html[data-a11y-cursor] :is(a, button, [role="button"], label, select, summary),
html[data-a11y-cursor] :is(a, button, [role="button"], label, select, summary) *{
  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 3 L6 40 L15.5 31 L22 45 L28.5 42 L22 28.5 L35 28.5 Z' fill='%234E2A63' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 3, pointer !important;
}
html[data-a11y-cursor] :is(input:not([type="checkbox"], [type="radio"]), textarea){ cursor:text !important; }

/* ── Заметный фокус клавиатуры: тёмное кольцо в светлом ореоле — видно на любом фоне */
html[data-a11y-focus] :focus-visible{
  outline:3px solid #1E1729 !important;
  outline-offset:2px !important;
  box-shadow:0 0 0 6px #FFFFFF, 0 0 0 8px #1E1729 !important;
}

/* ── Отметить заголовки */
html[data-a11y-headings] :is(h1, h2, h3, h4, h5, h6){ outline:2px dashed currentColor; outline-offset:4px; }

/* ═══ Кнопка меню и само окно ══════════════════════════════════════════════ */

/* «Перейти к содержимому» — первая остановка Tab, видна только в фокусе */
.a11y-skip{
  position:fixed; top:10px; inset-inline-start:10px; z-index:2147483000;
  transform:translateY(-200%);
  padding:10px 18px; border-radius:999px;
  background:#1E1729; color:#FFFFFF; font:600 14px/1.2 var(--font-ui, sans-serif);
  text-decoration:none;
}
.a11y-skip:focus, .a11y-skip:focus-visible{ transform:none; outline:3px solid #C9A566; outline-offset:2px; }

/* Кнопка: небольшой язычок у ЛЕВОГО края, на середине высоты — в стороне от шапки,
   нижних кнопок и жестов. Выше страницы, ниже любых окон (<dialog> — в top layer). */
.a11y-trigger{
  position:fixed; left:0; top:50%; transform:translateY(-50%); z-index:2147482000;
  width:36px; height:48px; padding:0; border:0; border-radius:0 14px 14px 0;
  display:flex; align-items:center; justify-content:center;
  background:#4E2A63; color:#FFFFFF; cursor:pointer;
  box-shadow:0 2px 10px rgba(41,33,66,0.28);
  -webkit-tap-highlight-color:transparent;
}
.a11y-trigger svg{ width:26px; height:26px; }
.a11y-trigger[data-on]{ box-shadow:inset 0 0 0 2px #C9A566, 0 2px 10px rgba(41,33,66,0.28); }
.a11y-trigger:focus-visible{ outline:3px solid #C9A566; outline-offset:2px; }
@media print{ .a11y-trigger, .a11y-skip{ display:none; } }
/* Увеличение касается страницы, а не самой кнопки: иначе она уезжает за край */
/* (и не самого окна меню — оно уже по размеру экрана) */
html[data-a11y-text] :is(.a11y-trigger, .a11y-dialog){ zoom:calc(1 / 1.15); }
html[data-a11y-text="2"] :is(.a11y-trigger, .a11y-dialog){ zoom:calc(1 / 1.3); }
html[data-a11y-text="3"] :is(.a11y-trigger, .a11y-dialog){ zoom:calc(1 / 1.5); }

.a11y-dialog{
  width:min(560px, calc(100vw - 24px)); max-height:min(88vh, 760px);
  padding:0; border:0; border-radius:24px;
  background:var(--surface, #FFFFFF); color:var(--ink, #1E1729);
  box-shadow:0 20px 60px rgba(41,33,66,0.35);
  font-family:var(--font-ui, sans-serif);
}
.a11y-dialog::backdrop{ background:rgba(30,23,41,0.45); }
.a11y-dialog[dir="rtl"]{ direction:rtl; }
.a11y-inner{ display:flex; flex-direction:column; max-height:inherit; }
.a11y-head{ display:flex; align-items:center; gap:8px; padding:18px 20px 8px; }
.a11y-head h2{ flex:1; margin:0; font-size:21px; font-weight:600; }
.a11y-x{
  width:44px; height:44px; border:0; border-radius:50%; background:transparent; color:inherit;
  display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:26px; line-height:1;
}
.a11y-x:hover{ background:var(--bg-2, #EEF2F8); }
.a11y-body{ overflow:auto; padding:4px 20px 12px; display:flex; flex-direction:column; gap:18px; }
.a11y-body h3{ margin:0 0 8px; font-size:15px; font-weight:600; }
.a11y-size{ display:flex; align-items:center; gap:12px; padding:6px; border-radius:16px; background:var(--bg-2, #EEF2F8); }
.a11y-size output{ flex:1; text-align:center; font-size:20px; font-weight:600; font-variant-numeric:tabular-nums; }
.a11y-round{
  width:48px; height:48px; border-radius:50%; border:2px solid var(--border, #E6E4EF);
  background:var(--surface, #FFFFFF); color:var(--ink, #1E1729);
  font:600 16px/1 var(--font-ui, sans-serif); cursor:pointer;
}
.a11y-round.is-plus{ background:#4E2A63; border-color:#4E2A63; color:#FFFFFF; }
.a11y-round:disabled{ opacity:0.38; cursor:not-allowed; }
.a11y-grid{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; }
@media (min-width:520px){ .a11y-grid.is-3{ grid-template-columns:repeat(3, minmax(0, 1fr)); } }
.a11y-tile{
  min-height:64px; padding:8px; border-radius:16px;
  border:2px solid var(--border, #E6E4EF); background:var(--surface, #FFFFFF); color:var(--ink, #1E1729);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  font:500 14px/1.25 var(--font-ui, sans-serif); text-align:center; cursor:pointer;
}
.a11y-tile svg{ width:22px; height:22px; }
.a11y-tile[aria-pressed="true"], .a11y-tile[aria-checked="true"]{
  border-color:#4E2A63; background:var(--gold-soft, #F5E8D0); color:#1E1729;
}
.a11y-tile:focus-visible, .a11y-round:focus-visible, .a11y-x:focus-visible, .a11y-foot button:focus-visible, .a11y-statement-link:focus-visible{
  outline:3px solid #4E2A63; outline-offset:2px;
}
.a11y-more{ border-top:1px solid var(--border, #E6E4EF); padding-top:12px; display:flex; flex-direction:column; gap:4px; }
.a11y-statement-link{
  align-self:flex-start; min-height:44px; padding:0 4px; border:0; background:none; color:#4E2A63;
  font:600 15px/1.2 var(--font-ui, sans-serif); text-decoration:underline; text-underline-offset:4px; cursor:pointer;
}
.a11y-note{ margin:0; font-size:13px; line-height:1.45; color:var(--ink-soft, #6E6579); }
.a11y-foot{ display:flex; justify-content:flex-end; gap:8px; padding:12px 20px 18px; }
.a11y-foot button{
  min-height:44px; padding:0 20px; border-radius:999px; font:600 15px/1 var(--font-ui, sans-serif); cursor:pointer;
}
.a11y-reset{ border:0; background:transparent; color:#4E2A63; }
.a11y-reset:disabled{ opacity:0.38; cursor:not-allowed; }
.a11y-done{ border:0; background:#4E2A63; color:#FFFFFF; }

@media (prefers-color-scheme: dark){
  .a11y-tile[aria-pressed="true"], .a11y-tile[aria-checked="true"]{ background:#C9A566; border-color:#C9A566; color:#1E1729; }
  .a11y-statement-link, .a11y-reset{ color:#D9C2EA; }
  .a11y-round.is-plus, .a11y-done{ background:#D9C2EA; border-color:#D9C2EA; color:#1E1729; }
}