/* Глаз слева от "Вход" */
.nkmenu-right { display: flex; align-items: center; gap: 12px; position: relative; }
.a11y-btn{ background: transparent; border: 0; padding: 6px; cursor: pointer; display:flex; align-items:center; }
.a11y-btn svg{ width:22px; height:22px; fill:#fff; transition: opacity .2s; }
.a11y-btn:hover svg, .a11y-btn:focus-visible svg{ opacity:.8; }

/* Панель (без Bootstrap collapse) */
.a11y-link { display:inline-flex; align-items:center; padding:6px; }
.a11y-icon { display:block; width:22px; height:22px; }
.a11y-panel{
  display:block; position:absolute; right:0; top:100%;
  background:#fff; color:#222; border:1px solid #ddd; border-radius:10px;
  padding:12px; min-width:300px; z-index:1300; box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.a11y-panel[hidden]{ display:none !important; }
.a11y-panel label{ display:block; margin:10px 0 6px; font-weight:600; }
.a11y-panel .btn-group{ display:flex; flex-wrap:wrap; gap:6px; }
.a11y-panel button{
  border:1px solid #cfd6df; background:#f7f9fc; padding:6px 10px; border-radius:8px; cursor:pointer;
}
.a11y-panel button.active{ background:#17416f; color:#fff; border-color:#17416f; }
#a11y #btn-RESET{ width:100%; background:#eee; }

/* Маппинг классов доступности */
html.a11y-size-large  :where(body, p, li, a, span, small, label, dd, dt, th, td, blockquote, figcaption, h1, h2, h3, h4, h5, h6, input, button, select, textarea){ 
  font-size: 20px !important; 
  line-height: 1.9 !important;
}
html.a11y-size-medium :where(body, p, li, a, span, small, label, dd, dt, th, td, blockquote, figcaption, h1, h2, h3, h4, h5, h6, input, button, select, textarea){ 
  font-size: 18px !important; 
  line-height: 1.8 !important;
}
html.a11y-size-normal :where(body, p, li, a, span, small, label, dd, dt, th, td, blockquote, figcaption, h1, h2, h3, h4, h5, h6, input, button, select, textarea){ 
  font-size: 16px !important; 
  line-height: 1.7 !important;
}

/* Межбуквенный интервал */
html.a11y-spacing-wide  :where(body, p, li, a, span, label){ 
  letter-spacing: .05em !important; 
  word-spacing: .1em !important; 
}
html.a11y-spacing-normal :where(body, p, li, a, span, label){ 
  letter-spacing: normal !important; 
  word-spacing: normal !important; 
}

/* Семейство шрифтов (не трогаем иконки) */
html.a11y-family-serif  :where(body, p, li, a, span, label, h1, h2, h3, h4, h5, h6, input, button, select, textarea){ 
  font-family: Georgia, "Times New Roman", serif !important; 
}
html.a11y-family-normal :where(body, p, li, a, span, label, h1, h2, h3, h4, h5, h6, input, button, select, textarea){ 
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important; 
}

/* Контраст через переменные — убедись, что элементы наследуют color/background */
html.a11y-color-black { --a11y-text:#000; --a11y-bg:#fff; --a11y-link:#00f;  --a11y-focus:#ffab00; }
html.a11y-color-white { --a11y-text:#fff; --a11y-bg:#000; --a11y-link:rgb(255, 247, 0);  --a11y-focus:#ffab00; }
html.a11y-color-normal{ --a11y-text:initial; --a11y-bg:initial; --a11y-link:initial; --a11y-focus:#99c2ff; }

body{ color:var(--a11y-text, inherit) !important; background:var(--a11y-bg, inherit) !important; }
a{ color:var(--a11y-link, inherit) !important; text-underline-offset:.2em; }
:focus-visible{ outline:3px solid var(--a11y-focus, #99c2ff) !important; outline-offset:3px; }

/* Не увеличиваем пиктограммы/иконки */
:where(svg, .icon, .material-icons, i[class*="icon"]) { font-size: inherit !important; letter-spacing: normal !important; }

/* Верхняя навигация и дропдауны */
html.a11y-size-large  :where(.nkmenu-topbar, .nkmenu-mainbar, .nkmenu-right, .nkmenu-left, .nkmenu-dropdown-content a, .nkmenu-link, .nkmenu-dropbtn){ 
  font-size: 20px !important; 
}
html.a11y-size-medium :where(.nkmenu-topbar, .nkmenu-mainbar, .nkmenu-right, .nkmenu-left, .nkmenu-dropdown-content a, .nkmenu-link, .nkmenu-dropbtn){ 
  font-size: 18px !important; 
}

/* Закрытие панели по клику вне */
@media (max-width: 480px){
  .a11y-panel{ right:8px; left:8px; min-width:auto; }

    /* правая колонка на всю ширину и дети тоже */
  .nkmenu-topbar .nkmenu-right{
    width: 100%;
    align-items: stretch;      /* растянуть детей по ширине */
  }
  .nkmenu-topbar .nkmenu-right > *{
    width: auto;
    align-self: stretch;
    text-align: right;         /* обычные ссылки/кнопки вправо */
  }

  /* ссылка-иконка: из inline-flex → flex и прижать контент вправо */
  .nkmenu-topbar .a11y-link{
    display: flex;             /* переопределяем inline-flex */
    justify-content: flex-end; /* иконка у правого края */
    padding: 2px 0;            /* компактнее по вертикали */
  }

  /* сам <img> с иконкой — блочным, без лишних отступов */
  .nkmenu-topbar .a11y-link .a11y-icon{
    display: block;
    margin: 0;
  }

  /* дропдаун и «Регистрация» тоже занимают всю строку и выравниваются вправо */
  .nkmenu-topbar .nkmenu-right .nkmenu-dropdown,
  .nkmenu-topbar .nkmenu-right .nkmenu-link{
    width: 100%;
    text-align: right;
  }


}