/* Версия для слабовидящих — clinica-repromed.ru */
.a11y-toggle {
  display: inline-block;
  margin-top: 12px;
  padding: 8px 14px;
  border: 2px solid #fff;
  background: transparent;
  color: #fff !important;
  font-size: 14px;
  line-height: 1.3;
  text-decoration: none !important;
  cursor: pointer;
  text-align: left;
  max-width: 100%;
}
.a11y-toggle .fa {
  margin-right: 6px;
  font-size: 1.15em;
  vertical-align: -1px;
}
.a11y-toggle:hover,
.a11y-toggle:focus {
  background: #fff;
  color: #0064a0 !important;
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* Панель управления */
#a11y-panel {
  display: none;
  position: sticky;
  top: 0;
  z-index: 100000;
  width: 100%;
  background: #1a1a1a;
  color: #fff;
  border-bottom: 3px solid #000;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,.35);
}
body.a11y-on #a11y-panel {
  display: block;
}
#a11y-panel .a11y-panel-inner {
  max-width: 1140px;
  margin: 0 auto;
  padding: 10px 15px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 20px;
}
#a11y-panel .a11y-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
#a11y-panel .a11y-label {
  margin-right: 4px;
  font-weight: bold;
  white-space: nowrap;
}
#a11y-panel button {
  font-family: inherit;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.2;
  padding: 6px 10px;
  border: 2px solid #fff;
  background: #333;
  color: #fff;
  cursor: pointer;
  min-width: 36px;
}
#a11y-panel button[aria-pressed="true"],
#a11y-panel button.is-active {
  background: #fff;
  color: #000;
}
#a11y-panel button:focus {
  outline: 3px solid #ff0;
  outline-offset: 2px;
}
#a11y-panel .a11y-swatch {
  width: 36px;
  height: 32px;
  padding: 0;
  vertical-align: middle;
}
#a11y-panel .a11y-swatch-bw { background: #fff !important; color: #000 !important; border-color: #000 !important; }
#a11y-panel .a11y-swatch-wb { background: #000 !important; color: #fff !important; }
#a11y-panel .a11y-swatch-bb { background: #9dd1ff !important; color: #063462 !important; border-color: #063462 !important; }
#a11y-panel .a11y-exit {
  margin-left: auto;
  background: #c00 !important;
  border-color: #fff !important;
  color: #fff !important;
}
@media (max-width: 767px) {
  #a11y-panel .a11y-exit { margin-left: 0; width: 100%; }
}

/* ===== Режим a11y: базовая типографика ===== */
body.a11y-on {
  letter-spacing: 0.02em !important;
  word-spacing: 0.05em !important;
  line-height: 1.55 !important;
}
body.a11y-on,
body.a11y-on * {
  font-family: Arial, Helvetica, sans-serif !important;
  box-shadow: none !important;
  text-shadow: none !important;
  animation: none !important;
  transition: none !important;
}
body.a11y-font-md { font-size: 18px !important; }
body.a11y-font-lg { font-size: 22px !important; }
body.a11y-font-xl { font-size: 26px !important; }

body.a11y-on h1, body.a11y-on .h1 { font-size: 1.9em !important; line-height: 1.3 !important; }
body.a11y-on h2, body.a11y-on .h2 { font-size: 1.55em !important; line-height: 1.3 !important; }
body.a11y-on h3, body.a11y-on .h3,
body.a11y-on h4, body.a11y-on .h4 { font-size: 1.3em !important; line-height: 1.35 !important; }
body.a11y-on p,
body.a11y-on li,
body.a11y-on td,
body.a11y-on th,
body.a11y-on label,
body.a11y-on span,
body.a11y-on a,
body.a11y-on button,
body.a11y-on input,
body.a11y-on select,
body.a11y-on textarea {
  font-size: 1em !important;
  line-height: 1.55 !important;
}
body.a11y-on a {
  text-decoration: underline !important;
}
body.a11y-on a:focus,
body.a11y-on button:focus,
body.a11y-on input:focus,
body.a11y-on select:focus,
body.a11y-on textarea:focus {
  outline: 3px solid #ff0 !important;
  outline-offset: 2px !important;
}

/* Схемы цвета */
body.a11y-bw,
body.a11y-bw #wrapper,
body.a11y-bw .container,
body.a11y-bw #content,
body.a11y-bw #header,
body.a11y-bw #footer,
body.a11y-bw .vopros,
body.a11y-bw .navbar,
body.a11y-bw .modal,
body.a11y-bw .modal-content,
body.a11y-bw .slick-slide,
body.a11y-bw section,
body.a11y-bw article,
body.a11y-bw aside,
body.a11y-bw main,
body.a11y-bw .row > [class*="col-"] {
  background: #fff !important;
  background-image: none !important;
  color: #000 !important;
  border-color: #000 !important;
}
body.a11y-bw *:not(img):not(svg):not(video):not(iframe):not(canvas) {
  background-color: transparent !important;
  background-image: none !important;
  color: #000 !important;
  border-color: #000 !important;
}
body.a11y-bw a { color: #0000ee !important; }
body.a11y-bw a:visited { color: #551a8b !important; }
body.a11y-bw #a11y-panel,
body.a11y-bw #a11y-panel * {
  background-color: #1a1a1a !important;
  color: #fff !important;
  border-color: #fff !important;
}
body.a11y-bw #a11y-panel button[aria-pressed="true"],
body.a11y-bw #a11y-panel button.is-active {
  background: #fff !important;
  color: #000 !important;
}
body.a11y-bw #a11y-panel .a11y-exit {
  background: #c00 !important;
  color: #fff !important;
}

body.a11y-wb,
body.a11y-wb #wrapper,
body.a11y-wb .container,
body.a11y-wb #content,
body.a11y-wb #header,
body.a11y-wb #footer,
body.a11y-wb .vopros,
body.a11y-wb .navbar,
body.a11y-wb .modal,
body.a11y-wb .modal-content,
body.a11y-wb section,
body.a11y-wb article,
body.a11y-wb aside,
body.a11y-wb main,
body.a11y-wb .row > [class*="col-"] {
  background: #000 !important;
  background-image: none !important;
  color: #fff !important;
  border-color: #fff !important;
}
body.a11y-wb *:not(img):not(svg):not(video):not(iframe):not(canvas) {
  background-color: transparent !important;
  background-image: none !important;
  color: #fff !important;
  border-color: #fff !important;
}
body.a11y-wb a { color: #ffff00 !important; }
body.a11y-wb a:visited { color: #ffcc66 !important; }
body.a11y-wb #a11y-panel,
body.a11y-wb #a11y-panel * {
  background-color: #1a1a1a !important;
  color: #fff !important;
  border-color: #fff !important;
}
body.a11y-wb #a11y-panel button[aria-pressed="true"],
body.a11y-wb #a11y-panel button.is-active {
  background: #fff !important;
  color: #000 !important;
}
body.a11y-wb #a11y-panel .a11y-exit {
  background: #c00 !important;
  color: #fff !important;
}

body.a11y-bb,
body.a11y-bb #wrapper,
body.a11y-bb .container,
body.a11y-bb #content,
body.a11y-bb #header,
body.a11y-bb #footer,
body.a11y-bb .vopros,
body.a11y-bb .navbar,
body.a11y-bb .modal,
body.a11y-bb .modal-content,
body.a11y-bb section,
body.a11y-bb article,
body.a11y-bb aside,
body.a11y-bb main,
body.a11y-bb .row > [class*="col-"] {
  background: #9dd1ff !important;
  background-image: none !important;
  color: #063462 !important;
  border-color: #063462 !important;
}
body.a11y-bb *:not(img):not(svg):not(video):not(iframe):not(canvas) {
  background-color: transparent !important;
  background-image: none !important;
  color: #063462 !important;
  border-color: #063462 !important;
}
body.a11y-bb a { color: #0000aa !important; }
body.a11y-bb a:visited { color: #4b0082 !important; }
body.a11y-bb #a11y-panel,
body.a11y-bb #a11y-panel * {
  background-color: #1a1a1a !important;
  color: #fff !important;
  border-color: #fff !important;
}
body.a11y-bb #a11y-panel button[aria-pressed="true"],
body.a11y-bb #a11y-panel button.is-active {
  background: #fff !important;
  color: #000 !important;
}
body.a11y-bb #a11y-panel .a11y-exit {
  background: #c00 !important;
  color: #fff !important;
}

/* Кнопки/формы читаемые */
body.a11y-on .btns,
body.a11y-on .btn,
body.a11y-on button,
body.a11y-on input[type="submit"],
body.a11y-on input[type="button"],
body.a11y-on .appointment-btn,
body.a11y-on .online-btn,
body.a11y-on .feedback-btn,
body.a11y-on .zapis {
  border-width: 2px !important;
  border-style: solid !important;
  font-weight: bold !important;
}

body.a11y-bw .btns,
body.a11y-bw .btn,
body.a11y-bw button:not(#a11y-panel button),
body.a11y-bw input[type="submit"],
body.a11y-bw input[type="button"],
body.a11y-bw .appointment-btn,
body.a11y-bw .online-btn,
body.a11y-bw .feedback-btn,
body.a11y-bw .zapis,
body.a11y-bw .a11y-toggle {
  background: #fff !important;
  color: #000 !important;
  border-color: #000 !important;
}
body.a11y-wb .btns,
body.a11y-wb .btn,
body.a11y-wb button:not(#a11y-panel button),
body.a11y-wb input[type="submit"],
body.a11y-wb input[type="button"],
body.a11y-wb .appointment-btn,
body.a11y-wb .online-btn,
body.a11y-wb .feedback-btn,
body.a11y-wb .zapis,
body.a11y-wb .a11y-toggle {
  background: #000 !important;
  color: #fff !important;
  border-color: #fff !important;
}
body.a11y-bb .btns,
body.a11y-bb .btn,
body.a11y-bb button:not(#a11y-panel button),
body.a11y-bb input[type="submit"],
body.a11y-bb input[type="button"],
body.a11y-bb .appointment-btn,
body.a11y-bb .online-btn,
body.a11y-bb .feedback-btn,
body.a11y-bb .zapis,
body.a11y-bb .a11y-toggle {
  background: #9dd1ff !important;
  color: #063462 !important;
  border-color: #063462 !important;
}

/* Скрыть изображения */
body.a11y-noimg img,
body.a11y-noimg picture,
body.a11y-noimg video,
body.a11y-noimg svg:not(.a11y-keep),
body.a11y-noimg iframe,
body.a11y-noimg .slick-slide,
body.a11y-noimg [style*="background-image"] {
  visibility: hidden !important;
}
body.a11y-noimg img[alt]:not([alt=""]) {
  visibility: visible !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
}
body.a11y-noimg img[alt]:not([alt=""])::after {
  content: attr(alt);
}
/* Проще: заменить картинки на alt-текст через обёртку JS; CSS fallback — скрыть */
body.a11y-noimg img {
  display: none !important;
}
body.a11y-noimg .a11y-img-alt {
  display: inline-block !important;
  border: 1px dashed currentColor;
  padding: 4px 8px;
  margin: 4px 0;
  font-size: 0.95em;
}

/* Убрать декоративные фоны слайдеров */
body.a11y-on .slick-list,
body.a11y-on .slick-track {
  background: transparent !important;
}

/* ===== Шапка: кнопки «Заказать звонок» / «Онлайн-запись» ===== */
body.a11y-on .normal_height {
  height: auto !important;
  min-height: 44px !important;
}

body.a11y-on #toppanel .centerhead.phone,
body.a11y-on #toppanel .feedback-buttons {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

body.a11y-on #toppanel .centerhead.phone .hphone {
  margin: 0 0 4px 0 !important;
  width: 100% !important;
}

body.a11y-on #toppanel .right-side-button,
body.a11y-on #toppanel .appointment-btn,
body.a11y-on #toppanel .online-btn,
body.a11y-on .feedback-buttons .right-side-button,
body.a11y-on .feedback-buttons .appointment-btn,
body.a11y-on .feedback-buttons .online-btn {
  display: block !important;
  width: 100% !important;
  max-width: 300px !important;
  height: auto !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 10px 14px !important;
  padding-left: 14px !important;
  background-image: none !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: normal !important;
  line-height: 1.35 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

body.a11y-on #toppanel .appointment-btn,
body.a11y-on #toppanel .online-btn,
body.a11y-on .feedback-buttons .appointment-btn,
body.a11y-on .feedback-buttons .online-btn {
  text-decoration: none !important;
}

body.a11y-bw #toppanel .appointment-btn,
body.a11y-bw #toppanel .online-btn,
body.a11y-bw .feedback-buttons .appointment-btn,
body.a11y-bw .feedback-buttons .online-btn {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #000 !important;
}

body.a11y-wb #toppanel .appointment-btn,
body.a11y-wb #toppanel .online-btn,
body.a11y-wb .feedback-buttons .appointment-btn,
body.a11y-wb .feedback-buttons .online-btn {
  background: #000 !important;
  color: #fff !important;
  border: 2px solid #fff !important;
}

body.a11y-bb #toppanel .appointment-btn,
body.a11y-bb #toppanel .online-btn,
body.a11y-bb .feedback-buttons .appointment-btn,
body.a11y-bb .feedback-buttons .online-btn {
  background: #9dd1ff !important;
  color: #063462 !important;
  border: 2px solid #063462 !important;
}

@media (max-width: 767px) {
  body.a11y-on #toppanel .right-side-button,
  body.a11y-on #toppanel .appointment-btn,
  body.a11y-on #toppanel .online-btn,
  body.a11y-on .feedback-buttons .right-side-button,
  body.a11y-on .feedback-buttons .appointment-btn,
  body.a11y-on .feedback-buttons .online-btn {
    max-width: 100% !important;
  }
}