/* =============================================
   Стили для версии для слабовидящих
   ============================================= */

/* Панель управления доступностью */
.vision-panel {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 99999;
  background: #e0e0e0;
  border-bottom: 1px solid #999;
  padding: 8px 0;
  font-family: Arial, sans-serif;
}
.vision-panel-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 15px;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 15px;
}
.vision-control {
  display: flex;
  align-items: center;
  gap: 6px;
}
.vision-label {
  font-size: 13px;
  color: #333;
  white-space: nowrap;
}
.vision-buttons {
  display: flex;
  gap: 0;
}
.vision-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 4px 8px;
  border: 1px solid #333;
  background: #fff;
  color: #333;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  transition: all 0.15s;
  margin-left: -1px;
}
.vision-btn:first-child {
  margin-left: 0;
}
.vision-btn:hover {
  background: #f0f0f0;
}
.vision-btn.active {
  background: #333;
  color: #fff;
}

/* Кнопки размера шрифта */
.font-size-btn {
  background: transparent !important;
  border: 2px solid transparent !important;
  color: #333 !important;
  min-width: 36px;
  height: 36px;
}
.font-size-btn[data-size="small"] {
  font-size: 14px;
  font-weight: normal;
}
.font-size-btn[data-size="medium"] {
  font-size: 20px;
  font-weight: bold;
}
.font-size-btn[data-size="large"] {
  font-size: 26px;
  font-weight: bold;
}
.font-size-btn.active {
  background: #fff !important;
  border: 2px solid #333 !important;
}
.font-size-btn:hover:not(.active) {
  background: rgba(255, 255, 255, 0.5) !important;
}

/* Кнопки цветовых схем */
.color-btn {
  min-width: 36px;
  height: 36px;
  font-size: 18px;
  font-weight: bold;
  border: 2px solid transparent !important;
}
.color-btn[data-color="white"] {
  background: #fff !important;
  color: #000 !important;
}
.color-btn[data-color="black"] {
  background: #000 !important;
  color: #fff !important;
}
.color-btn[data-color="blue"] {
  background: #9dd1ff !important;
  color: #063462 !important;
}
.color-btn.active {
  border: 2px solid #333 !important;
}

/* Кнопка со значком */
.vision-btn-icon {
  padding: 4px 8px;
  gap: 4px;
}
.vision-btn-icon svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

/* Кнопка обычной версии */
.vision-btn-normal {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border: none;
  white-space: nowrap;
  background: transparent;
}
.vision-btn-normal:hover {
  background: rgba(255, 255, 255, 0.5);
}
.vision-btn-normal svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.vision-btn-normal span {
  text-align: left;
  font-size: 11px;
  line-height: 1.2;
  font-weight: normal;
}

/* Режим включён - показываем панель */
body.vision-mode .vision-panel {
  display: block !important;
}

/* Скрытие основного хедера в режиме для слабовидящих */
body.vision-mode header {
  display: none !important;
}

/* Смещение контента при включённой панели (только панель доступности) */
body.vision-mode .bg-header,
body.vision-mode .offset-header {
  margin-top: 0 !important;
}

/* Контент для слабовидящих - отступ под панель */
body.vision-mode .not_ie {
  padding-top: 60px !important;
}

/* Базовые стили для режима */
body.vision-mode {
  font-family: Arial, sans-serif !important;
}
body.vision-mode * {
  font-family: Arial, sans-serif !important;
}
body.vision-mode a {
  text-decoration: underline !important;
}

/* Стили для input и textarea в режиме для слабовидящих */
body.vision-mode input[type="text"],
body.vision-mode input[type="email"],
body.vision-mode input[type="tel"],
body.vision-mode input[type="password"],
body.vision-mode textarea {
  border: 2px solid currentColor !important;
  padding: 8px 12px !important;
}

/* Скрытие bg-header (слайдера) в режиме для слабовидящих */
body.vision-mode .bg-header {
  display: none !important;
}

/* Упрощённый футер в режиме для слабовидящих - только логотип и копирайт */
body.vision-mode footer .m2,
body.vision-mode footer .m3,
body.vision-mode footer .m4,
body.vision-mode footer .maked,
body.vision-mode footer .vision-link {
  display: none !important;
}
body.vision-mode footer .m1 {
  text-align: center;
  width: 100%;
  max-width: 100%;
  flex: 0 0 100%;
}
body.vision-mode footer .m1 img {
  max-width: 200px;
}

/* Показ шапки для слабовидящих на всех страницах */
body.vision-mode .vision-header-block {
  display: block !important;
}

/* Стили шапки для слабовидящих */
.vision-header-block h1 {
  font-size: 2.5em;
  font-weight: bold;
  margin-bottom: 10px;
}
.vision-header-block h1 a {
  text-decoration: none !important;
}
.vision-header-block h2 {
  font-size: 1.5em;
  margin: 15px 0;
}
.vision-header-block hr {
  margin: 15px 0;
  border: none;
  border-top: 1px solid currentColor;
}

/* Показ специального блока для слабовидящих (главная) */
body.vision-mode .vision-main-content {
  display: block !important;
}

/* Размеры шрифта */
body.vision-mode.font-small {
  font-size: 100% !important;
}
body.vision-mode.font-medium {
  font-size: 120% !important;
}
body.vision-mode.font-large {
  font-size: 150% !important;
}

/* Цветовая схема - белая (чёрный на белом) */
body.vision-mode.color-white,
body.vision-mode.color-white * {
  background-color: #fff !important;
  color: #000 !important;
}
body.vision-mode.color-white a {
  color: #000 !important;
}
body.vision-mode.color-white .vision-panel,
body.vision-mode.color-white .vision-settings-panel {
  background: #e0e0e0 !important;
  border-color: #999 !important;
}
body.vision-mode.color-white .vision-panel *,
body.vision-mode.color-white .vision-settings-panel * {
  background-color: transparent !important;
  color: #333 !important;
}
body.vision-mode.color-white .vision-btn {
  background: transparent !important;
  color: #333 !important;
  border-color: transparent !important;
}
body.vision-mode.color-white .font-size-btn.active,
body.vision-mode.color-white .vision-setting-row .vision-btn.active {
  background: #fff !important;
  border-color: #333 !important;
}
body.vision-mode.color-white .color-btn.active {
  border-color: #333 !important;
}

/* Цветовая схема - чёрная (белый/жёлтый на чёрном) */
body.vision-mode.color-black,
body.vision-mode.color-black * {
  background-color: #000 !important;
  color: #fff !important;
}
body.vision-mode.color-black a {
  color: #ff0 !important;
}
body.vision-mode.color-black .vision-panel,
body.vision-mode.color-black .vision-settings-panel {
  background: #e0e0e0 !important;
  border-color: #999 !important;
}
body.vision-mode.color-black .vision-panel *,
body.vision-mode.color-black .vision-settings-panel * {
  background-color: transparent !important;
  color: #333 !important;
}
body.vision-mode.color-black .vision-btn {
  background: transparent !important;
  color: #333 !important;
  border-color: transparent !important;
}
body.vision-mode.color-black .font-size-btn.active,
body.vision-mode.color-black .vision-setting-row .vision-btn.active {
  background: #fff !important;
  border-color: #333 !important;
}
body.vision-mode.color-black .color-btn.active {
  border-color: #333 !important;
}
body.vision-mode.color-black .vision-btn-normal {
  background: transparent !important;
  border: none !important;
}

/* Цветовая схема - синяя (тёмно-синий на голубом) */
body.vision-mode.color-blue,
body.vision-mode.color-blue * {
  background-color: #9dd1ff !important;
  color: #063462 !important;
}
body.vision-mode.color-blue a {
  color: #00008b !important;
}
body.vision-mode.color-blue .vision-panel,
body.vision-mode.color-blue .vision-settings-panel {
  background: #e0e0e0 !important;
  border-color: #999 !important;
}
body.vision-mode.color-blue .vision-panel *,
body.vision-mode.color-blue .vision-settings-panel * {
  background-color: transparent !important;
  color: #333 !important;
}
body.vision-mode.color-blue .vision-btn {
  background: transparent !important;
  color: #333 !important;
  border-color: transparent !important;
}
body.vision-mode.color-blue .font-size-btn.active,
body.vision-mode.color-blue .vision-setting-row .vision-btn.active {
  background: #fff !important;
  border-color: #333 !important;
}
body.vision-mode.color-blue .color-btn.active {
  border-color: #333 !important;
}
body.vision-mode.color-blue .vision-btn-normal {
  background: transparent !important;
  border: none !important;
}

body.vision-mode .images-btn.active {
  border-color: #333 !important;
}

/* Скрытие изображений */
body.vision-mode.images-off img:not(.vision-keep) {
  opacity: 0 !important;
  visibility: hidden !important;
}

/* Адаптивность панели */
@media (max-width: 992px) {
  .vision-panel-inner {
    gap: 10px;
  }
  .vision-label {
    font-size: 11px;
  }
  .vision-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}
@media (max-width: 768px) {
  .vision-panel {
    padding: 6px 0;
  }
  .vision-panel-inner {
    gap: 6px 12px;
  }
  .vision-control {
    gap: 4px;
  }
  .vision-label {
    display: none;
  }
  body.vision-mode .not_ie {
    padding-top: 55px;
  }
}
@media (max-width: 480px) {
  .vision-btn-normal span {
    display: none;
  }
  body.vision-mode .not_ie {
    padding-top: 50px;
  }
}

/* =============================================
   Контент для версии для слабовидящих
   ============================================= */

/* Основной блок контента для слабовидящих */
.vision-main-content {
  padding: 20px 0;
}
.vision-main-content h1 {
  font-size: 2.5em;
  font-weight: bold;
  margin-bottom: 10px;
}
.vision-main-content h2 {
  font-size: 1.5em;
  margin: 20px 0;
}
.vision-main-content h3 {
  font-size: 1.3em;
  margin: 15px 0;
}
.vision-main-content h4 {
  font-size: 1.1em;
  margin: 10px 0;
}
.vision-main-content p {
  margin-bottom: 10px;
  line-height: 1.6;
}
.vision-main-content hr {
  margin: 20px 0;
  border: none;
  border-top: 1px solid #ccc;
}

/* Аудио блок */
.vision-audio-block {
  padding: 15px;
  border: 1px solid #ccc;
  display: inline-block;
}

/* Табы */
body.vision-mode .vision-tabs {
  margin: 20px 0;
  border: none !important;
  padding: 0;
}

/* Bootstrap табы в режиме слабовидящих */
body.vision-mode .vision-main-content .nav-tabs {
  border: 2px solid #000 !important;
  padding: 10px;
  margin-bottom: 15px;
  display: inline-flex;
  gap: 10px;
  flex-wrap: wrap;
  width: 100%;
}
body.vision-mode .vision-main-content .nav-tabs .nav-item {
  margin-bottom: 0;
}
body.vision-mode .vision-main-content .nav-tabs .nav-link {
  border: none !important;
  border-radius: 0 !important;
  padding: 10px 20px !important;
  margin-right: 0;
  background: #fff !important;
  color: #000 !important;
  font-weight: bold;
  text-decoration: underline !important;
  cursor: pointer;
}
body.vision-mode .vision-main-content .nav-tabs .nav-link:hover {
  background: #eee !important;
}
body.vision-mode .vision-main-content .nav-tabs .nav-link.active {
  background: #000 !important;
  color: #fff !important;
  text-decoration: none !important;
}
/* Цветовые схемы для табов */
body.vision-mode.color-white .vision-main-content .nav-tabs {
  border-color: #000 !important;
}
body.vision-mode.color-white .vision-main-content .nav-tabs .nav-link {
  background: #fff !important;
  color: #000 !important;
}
body.vision-mode.color-white .vision-main-content .nav-tabs .nav-link.active {
  background: #000 !important;
  color: #fff !important;
}

body.vision-mode.color-black .vision-main-content .nav-tabs {
  border-color: #fff !important;
}
body.vision-mode.color-black .vision-main-content .nav-tabs .nav-link {
  background: #000 !important;
  color: #fff !important;
  text-decoration: underline !important;
}
body.vision-mode.color-black .vision-main-content .nav-tabs .nav-link:hover {
  background: #333 !important;
}
body.vision-mode.color-black .vision-main-content .nav-tabs .nav-link.active {
  background: #fff !important;
  color: #000 !important;
  text-decoration: none !important;
}

body.vision-mode.color-blue .vision-main-content .nav-tabs {
  border-color: #063462 !important;
}
body.vision-mode.color-blue .vision-main-content .nav-tabs .nav-link {
  background: #9dd1ff !important;
  color: #063462 !important;
  text-decoration: underline !important;
}
body.vision-mode.color-blue .vision-main-content .nav-tabs .nav-link:hover {
  background: #7ec0f5 !important;
}
body.vision-mode.color-blue .vision-main-content .nav-tabs .nav-link.active {
  background: #063462 !important;
  color: #9dd1ff !important;
  text-decoration: none !important;
}

body.vision-mode.color-beige .vision-main-content .nav-tabs {
  border-color: #5c4033 !important;
}
body.vision-mode.color-beige .vision-main-content .nav-tabs .nav-link {
  background: #f5f5dc !important;
  color: #5c4033 !important;
  text-decoration: underline !important;
}
body.vision-mode.color-beige .vision-main-content .nav-tabs .nav-link:hover {
  background: #e5e5cc !important;
}
body.vision-mode.color-beige .vision-main-content .nav-tabs .nav-link.active {
  background: #5c4033 !important;
  color: #f5f5dc !important;
  text-decoration: none !important;
}

body.vision-mode.color-green .vision-main-content .nav-tabs {
  border-color: #a6d608 !important;
}
body.vision-mode.color-green .vision-main-content .nav-tabs .nav-link {
  background: #3d2b1f !important;
  color: #a6d608 !important;
  text-decoration: underline !important;
}
body.vision-mode.color-green .vision-main-content .nav-tabs .nav-link:hover {
  background: #4d3b2f !important;
}
body.vision-mode.color-green .vision-main-content .nav-tabs .nav-link.active {
  background: #a6d608 !important;
  color: #3d2b1f !important;
  text-decoration: none !important;
}

body.vision-mode .vision-main-content .tab-content {
  border: none !important;
  padding: 0;
  background: inherit !important;
}

.vision-tab-buttons {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.vision-tab-btn {
  padding: 10px 20px;
  font-size: 14px;
  cursor: pointer;
  border: 2px solid #333;
  background: #fff;
  color: #333;
}
.vision-tab-btn.active {
  background: #333;
  color: #fff;
}
.vision-tab-content {
  padding: 15px 0;
}

/* Кнопки навигации для слабовидящих */
.vision-nav-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px !important;
  font-size: 14px;
  border: 2px solid #333 !important;
  background: #fff !important;
  color: #333 !important;
  text-decoration: none !important;
  min-height: 44px;
}
.vision-nav-btn:hover {
  background: #333 !important;
  color: #fff !important;
}

/* Цветовые схемы для навигации */
body.vision-mode.color-black .vision-nav-btn {
  border-color: #fff !important;
  background: #000 !important;
  color: #fff !important;
}
body.vision-mode.color-black .vision-nav-btn:hover {
  background: #ff0 !important;
  color: #000 !important;
}
body.vision-mode.color-blue .vision-nav-btn {
  border-color: #063462 !important;
  background: #9dd1ff !important;
  color: #063462 !important;
}
body.vision-mode.color-blue .vision-nav-btn:hover {
  background: #063462 !important;
  color: #9dd1ff !important;
}
body.vision-mode.color-beige .vision-nav-btn {
  border-color: #5c4033 !important;
  background: #f5f5dc !important;
  color: #5c4033 !important;
}
body.vision-mode.color-beige .vision-nav-btn:hover {
  background: #5c4033 !important;
  color: #f5f5dc !important;
}
body.vision-mode.color-green .vision-nav-btn {
  border-color: #a6d608 !important;
  background: #3d2b1f !important;
  color: #a6d608 !important;
}
body.vision-mode.color-green .vision-nav-btn:hover {
  background: #a6d608 !important;
  color: #3d2b1f !important;
}

/* Акции для слабовидящих */
.vision-sale-item {
  border-radius: 0;
}
.vision-sale-item h4 a {
  font-weight: bold;
}

/* Применение цветовых схем к блоку для слабовидящих */
body.vision-mode.color-black .vision-tab-btn {
  border-color: #fff !important;
}
body.vision-mode.color-black .vision-tab-btn.active {
  background: #ff0 !important;
  color: #000 !important;
}
body.vision-mode.color-blue .vision-tab-btn {
  border-color: #063462 !important;
}
body.vision-mode.color-blue .vision-tab-btn.active {
  background: #063462 !important;
  color: #9dd1ff !important;
}
body.vision-mode.color-beige .vision-tab-btn {
  border-color: #5c4033 !important;
}
body.vision-mode.color-beige .vision-tab-btn.active {
  background: #5c4033 !important;
  color: #f5f5dc !important;
}
body.vision-mode.color-green .vision-tab-btn {
  border-color: #a6d608 !important;
}
body.vision-mode.color-green .vision-tab-btn.active {
  background: #a6d608 !important;
  color: #3d2b1f !important;
}

/* =============================================
   Раскрывающаяся панель расширенных настроек
   ============================================= */

/* Панель расширенных настроек */
.vision-settings-panel {
  background: #e0e0e0;
  border-top: 1px solid #999;
  padding: 15px 0;
}
.vision-settings-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 15px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.vision-setting-row {
  display: flex;
  align-items: center;
  gap: 15px;
  flex-wrap: wrap;
}
.vision-setting-label {
  font-size: 13px;
  color: #333;
  min-width: 180px;
}
.vision-setting-row .vision-buttons {
  display: flex;
  gap: 0;
  flex-wrap: wrap;
}
.vision-setting-row .vision-btn {
  min-width: auto;
  padding: 6px 16px;
  font-size: 13px;
  font-weight: normal;
  border: 2px solid transparent;
  background: transparent;
}
.vision-setting-row .vision-btn.active {
  border: 2px solid #333;
  background: #fff;
}

/* Кнопки цветовых схем в расширенной панели */
.vision-color-schemes {
  margin-top: 5px;
}
.vision-color-schemes .vision-buttons {
  gap: 10px;
  flex-wrap: wrap;
}
.color-scheme-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 100px;
  min-height: 50px;
  padding: 8px 12px !important;
  line-height: 1.2;
  text-align: center;
}
.color-scheme-btn span {
  display: block;
  font-size: 12px;
}

/* Стили для кнопок цветовых схем */
body #vision-panel .color-scheme-btn[data-scheme="white"] {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #000 !important;
}
body #vision-panel .color-scheme-btn[data-scheme="white"] span {
  color: #000 !important;
}
body #vision-panel .color-scheme-btn[data-scheme="black"] {
  background: #000 !important;
  color: #fff !important;
  border: 2px solid #fff !important;
}
body #vision-panel .color-scheme-btn[data-scheme="black"] span {
  color: #fff !important;
}
body #vision-panel .color-scheme-btn[data-scheme="blue"] {
  background: #9dd1ff !important;
  color: #063462 !important;
  border: 2px solid #063462 !important;
}
body #vision-panel .color-scheme-btn[data-scheme="blue"] span {
  color: #063462 !important;
}
body #vision-panel .color-scheme-btn[data-scheme="beige"] {
  background: #f5f5dc !important;
  color: #5c4033 !important;
  border: 2px solid #5c4033 !important;
}
body #vision-panel .color-scheme-btn[data-scheme="beige"] span {
  color: #5c4033 !important;
}
body #vision-panel .color-scheme-btn[data-scheme="green"] {
  background: #3d2b1f !important;
  color: #a6d608 !important;
  border: 2px solid #a6d608 !important;
}
body #vision-panel .color-scheme-btn[data-scheme="green"] span {
  color: #a6d608 !important;
}

/* Активное состояние кнопок схем */
.color-scheme-btn.active {
  outline: 3px solid #333;
  outline-offset: 2px;
}

/* Цветовая схема - бежевая (коричневый на бежевом) */
body.vision-mode.color-beige,
body.vision-mode.color-beige * {
  background-color: #f5f5dc !important;
  color: #5c4033 !important;
}
body.vision-mode.color-beige a {
  color: #8b4513 !important;
}
body.vision-mode.color-beige .vision-panel,
body.vision-mode.color-beige .vision-settings-panel {
  background: #e0e0e0 !important;
  border-color: #999 !important;
}
body.vision-mode.color-beige .vision-panel *,
body.vision-mode.color-beige .vision-settings-panel * {
  background-color: transparent !important;
  color: #333 !important;
}
body.vision-mode.color-beige .vision-btn {
  background: transparent !important;
  color: #333 !important;
  border-color: transparent !important;
}
body.vision-mode.color-beige .font-size-btn.active,
body.vision-mode.color-beige .vision-setting-row .vision-btn.active {
  background: #fff !important;
  border-color: #333 !important;
}
body.vision-mode.color-beige .color-btn.active {
  border-color: #333 !important;
}
body.vision-mode.color-beige .vision-btn-normal {
  background: transparent !important;
  border: none !important;
}

/* Цветовая схема - зелёная (зелёный на тёмно-коричневом) */
body.vision-mode.color-green,
body.vision-mode.color-green * {
  background-color: #3d2b1f !important;
  color: #a6d608 !important;
}
body.vision-mode.color-green a {
  color: #7fff00 !important;
}
body.vision-mode.color-green .vision-panel,
body.vision-mode.color-green .vision-settings-panel {
  background: #e0e0e0 !important;
  border-color: #999 !important;
}
body.vision-mode.color-green .vision-panel *,
body.vision-mode.color-green .vision-settings-panel * {
  background-color: transparent !important;
  color: #333 !important;
}
body.vision-mode.color-green .vision-btn {
  background: transparent !important;
  color: #333 !important;
  border-color: transparent !important;
}
body.vision-mode.color-green .font-size-btn.active,
body.vision-mode.color-green .vision-setting-row .vision-btn.active {
  background: #fff !important;
  border-color: #333 !important;
}
body.vision-mode.color-green .color-btn.active {
  border-color: #333 !important;
}
body.vision-mode.color-green .vision-btn-normal {
  background: transparent !important;
  border: none !important;
}

/* Интервал между буквами (letter-spacing) */
body.vision-mode.spacing-normal {
  letter-spacing: normal !important;
}
body.vision-mode.spacing-normal * {
  letter-spacing: normal !important;
}
body.vision-mode.spacing-medium {
  letter-spacing: 0.1em !important;
}
body.vision-mode.spacing-medium * {
  letter-spacing: 0.1em !important;
}
body.vision-mode.spacing-large {
  letter-spacing: 0.2em !important;
}
body.vision-mode.spacing-large * {
  letter-spacing: 0.2em !important;
}

/* Интервал между строками (line-height) */
body.vision-mode.lineheight-normal {
  line-height: 1.5 !important;
}
body.vision-mode.lineheight-normal * {
  line-height: 1.5 !important;
}
body.vision-mode.lineheight-medium {
  line-height: 1.8 !important;
}
body.vision-mode.lineheight-medium * {
  line-height: 1.8 !important;
}
body.vision-mode.lineheight-large {
  line-height: 2.2 !important;
}
body.vision-mode.lineheight-large * {
  line-height: 2.2 !important;
}

/* Настройка высоты панели для компенсации сдвига контента */
body.vision-mode.vision-settings-open header {
  top: 160px !important;
}
body.vision-mode.vision-settings-open .bg-header,
body.vision-mode.vision-settings-open .offset-header {
  margin-top: 160px !important;
}

/* Адаптивность расширенной панели */
@media (max-width: 992px) {
  .vision-setting-label {
    min-width: 150px;
    font-size: 12px;
  }
  .vision-setting-row .vision-btn {
    padding: 5px 12px;
    font-size: 12px;
  }
  .color-scheme-btn {
    min-width: 85px;
    min-height: 45px;
  }
  .color-scheme-btn span {
    font-size: 11px;
  }
}

@media (max-width: 768px) {
  .vision-settings-inner {
    gap: 10px;
  }
  .vision-setting-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .vision-setting-label {
    min-width: auto;
  }
  .color-scheme-btn {
    min-width: 75px;
    min-height: 40px;
    padding: 6px 8px !important;
  }
  .color-scheme-btn span {
    font-size: 10px;
  }
  body.vision-mode.vision-settings-open .not_ie {
    padding-top: 200px;
  }
}

@media (max-width: 480px) {
  .vision-color-schemes .vision-buttons {
    gap: 5px;
  }
  .color-scheme-btn {
    min-width: 60px;
    min-height: 35px;
    padding: 4px 6px !important;
  }
  .color-scheme-btn span {
    font-size: 9px;
  }
  body.vision-mode.vision-settings-open .not_ie {
    padding-top: 160px;
  }
}

/* =============================================
   Сохранение цветов для кнопок выбора цветовой схемы
   при любом активном режиме
   ============================================= */

/* Кнопки color-btn всегда сохраняют свои цвета */
body.vision-mode .color-btn[data-color="white"] {
  background: #fff !important;
  color: #000 !important;
}
body.vision-mode .color-btn[data-color="black"] {
  background: #000 !important;
  color: #fff !important;
}
body.vision-mode .color-btn[data-color="blue"] {
  background: #9dd1ff !important;
  color: #063462 !important;
}
body.vision-mode .color-btn.active {
  border-color: #333 !important;
}

/* Кнопки color-scheme-btn всегда сохраняют свои цвета и бордеры */
body.vision-mode .color-scheme-btn[data-scheme="white"] {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #000 !important;
}
body.vision-mode .color-scheme-btn[data-scheme="black"] {
  background: #000 !important;
  color: #fff !important;
  border: 2px solid #fff !important;
}
body.vision-mode .color-scheme-btn[data-scheme="blue"] {
  background: #9dd1ff !important;
  color: #063462 !important;
  border: 2px solid #063462 !important;
}
body.vision-mode .color-scheme-btn[data-scheme="beige"] {
  background: #f5f5dc !important;
  color: #5c4033 !important;
  border: 2px solid #5c4033 !important;
}
body.vision-mode .color-scheme-btn[data-scheme="green"] {
  background: #3d2b1f !important;
  color: #a6d608 !important;
  border: 2px solid #a6d608 !important;
}