/*
====================================================================

Accessibility

Светлая черно-белая версия сайта.

====================================================================
*/


html.dd-accessibility-mode {
    --dd-background: #ffffff;
    --dd-text: #000000;
    --dd-text-light: #000000;
    --dd-text-muted: #000000;
    --dd-primary: #000000;
    --dd-primary-light: #ffffff;
    --dd-primary-grey: #000000;
    --dd-main: #000000;
    --dd-main-light: #ffffff;
    --dd-main-grey: #000000;
    --dd-accent: #000000;
    --dd-link: #000000;
    --dd-white: #ffffff;
    --dd-black: #000000;
    --dd-foreground: #ffffff;
    --dd-background-bright: #ffffff;

    color: #000000;
    background: #ffffff;
}

html.dd-accessibility-mode,
html.dd-accessibility-mode body {
    font-size: 20px;
    line-height: 1.6;
    font-weight: 500;
}

html.dd-accessibility-mode body,
html.dd-accessibility-mode #page,
html.dd-accessibility-mode #content,
html.dd-accessibility-mode main,
html.dd-accessibility-mode section,
html.dd-accessibility-mode article,
html.dd-accessibility-mode aside,
html.dd-accessibility-mode header,
html.dd-accessibility-mode footer,
html.dd-accessibility-mode nav,
html.dd-accessibility-mode div,
html.dd-accessibility-mode details,
html.dd-accessibility-mode summary {
    color: #000000 !important;
    background-color: #ffffff !important;
    border-color: #000000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html.dd-accessibility-mode a {
    color: #000000 !important;
    text-decoration: underline !important;
    text-decoration-thickness: .08em;
    text-underline-offset: .18em;
}

html.dd-accessibility-mode p,
html.dd-accessibility-mode li,
html.dd-accessibility-mode td,
html.dd-accessibility-mode th,
html.dd-accessibility-mode input,
html.dd-accessibility-mode textarea,
html.dd-accessibility-mode select,
html.dd-accessibility-mode button {
    font-size: 1rem;
    line-height: 1.6;
}

html.dd-accessibility-mode h1,
html.dd-accessibility-mode h2,
html.dd-accessibility-mode h3,
html.dd-accessibility-mode h4,
html.dd-accessibility-mode h5,
html.dd-accessibility-mode h6,
html.dd-accessibility-mode strong,
html.dd-accessibility-mode b {
    color: #000000 !important;
    font-weight: 700;
}

html.dd-accessibility-mode button,
html.dd-accessibility-mode input,
html.dd-accessibility-mode textarea,
html.dd-accessibility-mode select,
html.dd-accessibility-mode .button,
html.dd-accessibility-mode .btn,
html.dd-accessibility-mode .dd-front-cta-hero__button,
html.dd-accessibility-mode .dd-navbar__action,
html.dd-accessibility-mode .dd-navbar__search-submit,
html.dd-accessibility-mode .dd-services__more {
    color: #000000 !important;
    background-color: #ffffff !important;
    border: 2px solid #000000 !important;
    box-shadow: none !important;
}

html.dd-accessibility-mode button:hover,
html.dd-accessibility-mode button:focus-visible,
html.dd-accessibility-mode .button:hover,
html.dd-accessibility-mode .button:focus-visible,
html.dd-accessibility-mode .btn:hover,
html.dd-accessibility-mode .btn:focus-visible,
html.dd-accessibility-mode .dd-front-cta-hero__button:hover,
html.dd-accessibility-mode .dd-front-cta-hero__button:focus-visible,
html.dd-accessibility-mode .dd-navbar__action:hover,
html.dd-accessibility-mode .dd-navbar__action:focus-visible,
html.dd-accessibility-mode .dd-navbar__search-submit:hover,
html.dd-accessibility-mode .dd-navbar__search-submit:focus-visible,
html.dd-accessibility-mode .dd-services__more:hover,
html.dd-accessibility-mode .dd-services__more:focus-visible {
    color: #ffffff !important;
    background-color: #000000 !important;
    border-color: #000000 !important;
}

/*
 * Слоган CTA Hero в обычном режиме белый на бирюзовом фоне.
 * В чёрно-белом режиме фон секции становится белым, поэтому цвет
 * текста нужно задать явно, иначе слоган остаётся белым на белом.
 *
 * Вторая часть слогана в обычном режиме отличается цветом и лёгким
 * начертанием. Здесь цвет недоступен, а тонкий вес плохо читается,
 * поэтому отличие несёт только курсив.
 */
html.dd-accessibility-mode .dd-front-cta-hero__title {
    color: #000000 !important;
}

/*
 * Курсивное выделение в обычном режиме отличается цветом и лёгким
 * начертанием. Здесь цвет недоступен, а тонкий вес плохо читается,
 * поэтому отличие несёт только курсив.
 */
html.dd-accessibility-mode em {
    color: #000000 !important;
    font-style: italic;
    font-weight: 500;
}

html.dd-accessibility-mode .dd-cta-slide__media {
    background: #ffffff !important;
}

/*
 * Активный слайд НЕ выделяется рамкой: чёрная замена красной рамки
 * читалась как траурная. Активность видна по масштабу карточки.
 */
html.dd-accessibility-mode .dd-front-cta-hero .dd-slider__item.is-active .dd-cta-slide__media,
html.dd-accessibility-mode .dd-cta-slide.is-active .dd-cta-slide__media {
    background: #ffffff !important;
}

html.dd-accessibility-mode img,
html.dd-accessibility-mode picture,
html.dd-accessibility-mode video,
html.dd-accessibility-mode canvas,
html.dd-accessibility-mode svg {
    filter: grayscale(1) contrast(1.25) !important;
}

html.dd-accessibility-mode * {
    animation: none !important;
    transition: none !important;
}

html.dd-accessibility-mode .dd-navbar__action--accessibility[aria-pressed="true"] {
    color: #000000 !important;
    background-color: #ffffff !important;
    border: 2px solid #000000 !important;
}

html.dd-accessibility-mode .dd-navbar__action--accessibility[aria-pressed="true"] .dd-icon {
    color: #000000 !important;
}

html.dd-accessibility-mode .dd-navbar__action--accessibility[aria-pressed="true"]:hover,
html.dd-accessibility-mode .dd-navbar__action--accessibility[aria-pressed="true"]:focus-visible {
    color: #ffffff !important;
    background-color: #000000 !important;
    border-color: #000000 !important;
}

html.dd-accessibility-mode .dd-navbar__action--accessibility[aria-pressed="true"]:hover .dd-icon,
html.dd-accessibility-mode .dd-navbar__action--accessibility[aria-pressed="true"]:focus-visible .dd-icon {
    color: #ffffff !important;
}

html.dd-accessibility-mode .dd-navbar__menu-list a:hover,
html.dd-accessibility-mode .dd-navbar__menu-list a:focus-visible,
html.dd-accessibility-mode .dd-navbar__mobile-menu-list a:hover,
html.dd-accessibility-mode .dd-navbar__mobile-menu-list a:focus-visible {
    color: #ffffff !important;
    background-color: #000000 !important;
}

html.dd-accessibility-mode .dd-separator::after {
    background-color: #ffffff !important;
}

html.dd-accessibility-mode .site-footer,
html.dd-accessibility-mode .site-footer div,
html.dd-accessibility-mode .dd-section--footer,
html.dd-accessibility-mode .dd-section--footer div,
html.dd-accessibility-mode .dd-footer,
html.dd-accessibility-mode .dd-footer div,
html.dd-accessibility-mode .dd-bottom-bar,
html.dd-accessibility-mode .dd-bottom-bar div {
    color: #ffffff !important;
    background-color: #000000 !important;
    border-color: #ffffff !important;
}

html.dd-accessibility-mode .dd-section--footer,
html.dd-accessibility-mode .dd-section--footer .dd-separator {
    --dd-section-bg: #000000;
}

html.dd-accessibility-mode .dd-section--footer .dd-separator::after {
    background-color: #000000 !important;
}

html.dd-accessibility-mode .site-footer a,
html.dd-accessibility-mode .site-footer p,
html.dd-accessibility-mode .site-footer li,
html.dd-accessibility-mode .site-footer h1,
html.dd-accessibility-mode .site-footer h2,
html.dd-accessibility-mode .site-footer h3,
html.dd-accessibility-mode .site-footer h4,
html.dd-accessibility-mode .site-footer h5,
html.dd-accessibility-mode .site-footer h6,
html.dd-accessibility-mode .site-footer strong,
html.dd-accessibility-mode .site-footer b {
    color: #ffffff !important;
}


/*
 * Косые срезы между секциями: в контрастном режиме фоны секций
 * принудительно перекрашены, клинья теряют смысл и оставляют
 * артефактные треугольники - убираем срезы целиком.
 */
html.dd-accessibility-mode .dd-cut {
    display: none !important;
}

/*
 * Кнопка «наверх» (плагин Smooth Back To Top): в контрастном режиме
 * её тиловый круг становился белым без обводки - белое на белом,
 * видно только на чёрном подвале. Белый круг с чёрной обводкой и
 * чёрной стрелкой виден на любом фоне.
 */
html.dd-accessibility-mode .smooth-back-to-top-button {
    color: #000000 !important;
    background: #ffffff !important;
    border: 2px solid #000000 !important;
    box-shadow: none !important;
}

html.dd-accessibility-mode .smooth-back-to-top-button svg * {
    stroke: #000000 !important;
}

/* Сама стрелка - глиф иконочного шрифта в ::after, у плагина белый. */
html.dd-accessibility-mode .smooth-back-to-top-button::after {
    color: #000000 !important;
}

html.dd-accessibility-mode .smooth-back-to-top-button svg [fill]:not([fill="none"]) {
    fill: #000000 !important;
}


/*
 * Карточки врачей и документов: в контрастном режиме тёмный градиент
 * поверх фото превращался в грязно-серый, зона имени получала белую
 * плашку-обрубок от общего правила для div, а список оставался белым
 * на сером. Схема: белая карточка с чёрной рамкой, фото сверху,
 * подпись - сплошной белый низ с чёрным текстом и чёрной линией.
 */
html.dd-accessibility-mode .dd-doctors__card,
html.dd-accessibility-mode .dd-documents__card {
    background-image: none !important;
    background-color: #ffffff !important;
    border: 2px solid #000000 !important;
    box-shadow: none !important;
}

html.dd-accessibility-mode .dd-doctors__meta,
html.dd-accessibility-mode .dd-documents__meta {
    background: #ffffff !important;
    border-top: 2px solid #000000 !important;
}

html.dd-accessibility-mode .dd-doctors__name,
html.dd-accessibility-mode .dd-doctors__roles,
html.dd-accessibility-mode .dd-doctors__roles li,
html.dd-accessibility-mode .dd-documents__caption,
html.dd-accessibility-mode .dd-documents__desc {
    color: #000000 !important;
}

html.dd-accessibility-mode .dd-doctors__divider,
html.dd-accessibility-mode .dd-documents__divider {
    border-top-color: #000000 !important;
}

/*
 * Стрелки каруселей врачей/документов: на узких экранах белые
 * кнопки-боксы ложились ровно на текст подписи - поднимаем в зону
 * фото.
 */
html.dd-accessibility-mode .dd-doctors .dd-slider__arrow,
html.dd-accessibility-mode .dd-documents .dd-slider__arrow {
    top: 32%;
}



/*
 * Карточки виджетов отзывов: на белом фоне секции без рамки они
 * сливались в одно поле - в контрастном режиме даём чёрную границу.
 */
html.dd-accessibility-mode .dd-reviews__card {
    border: 2px solid #000000 !important;
    box-shadow: none !important;
}


/*
 * Выравнивание линии в карточках врачей: контрастный режим задаёт
 * li line-height 1.6 (вместо 1.4 в обычном), и резерв «под три
 * пункта» из doctors.css становится меньше реальных трёх строк -
 * карточка с двумя пунктами оказывается короче соседей, граница и
 * линия уезжают. Резерв пересчитан под межстрочку 1.6.
 */
html.dd-accessibility-mode .dd-doctors__roles {
    min-height: calc(3 * 1.6em + 12px) !important;
}


/*
 * Блок подписи ниже: большой верхний паддинг меты (48px) был нужен
 * под растворение градиента - на сплошной белой подложке он только
 * съедает фото. Ужимаем отступы, верхняя граница опускается, фото
 * открывается. Все зоны фиксированные - выравнивание линий между
 * карточками сохраняется.
 */
html.dd-accessibility-mode .dd-doctors__meta,
html.dd-accessibility-mode .dd-documents__meta {
    padding: 14px 20px 16px !important;
}

html.dd-accessibility-mode .dd-doctors__divider,
html.dd-accessibility-mode .dd-documents__divider {
    margin: 8px 0 !important;
}


/*
 * Cookie-баннер: в обычном режиме у него собственная тёмная палитра
 * (#1a1a2e/#4a6cf7), намеренно не завязанная на токены темы - чтобы
 * баннер был заметен поверх любой секции. В контрастном режиме своя
 * палитра неуместна, схема та же, что у остальных компонентов:
 * белый фон, чёрный текст и границы, кнопки - чёрные с белым текстом.
 */
html.dd-accessibility-mode #ck-banner,
html.dd-accessibility-mode #ck-settings {
    background: #ffffff !important;
    color: #000000 !important;
    border: 2px solid #000000 !important;
    box-shadow: none !important;
}

html.dd-accessibility-mode #ck-banner p,
html.dd-accessibility-mode .ck-label,
html.dd-accessibility-mode .ck-label span,
html.dd-accessibility-mode #ck-settings h3 {
    color: #000000 !important;
}

html.dd-accessibility-mode .ck-banner__link {
    color: #000000 !important;
    text-decoration: underline !important;
}

html.dd-accessibility-mode .ck-row {
    border-bottom-color: #000000 !important;
}

html.dd-accessibility-mode .ck-slider {
    background: #ffffff !important;
    border: 2px solid #000000 !important;
}

html.dd-accessibility-mode .ck-slider::before {
    background: #000000 !important;
}

html.dd-accessibility-mode .ck-toggle input:checked + .ck-slider {
    background: #ffffff !important;
    border-color: #000000 !important;
}

html.dd-accessibility-mode .ck-btn {
    background: #000000 !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
}

html.dd-accessibility-mode .ck-btn:hover,
html.dd-accessibility-mode .ck-btn:focus-visible {
    background: #ffffff !important;
    color: #000000 !important;
}

/*
 * Таблицы контента (страницы услуг): зебра из палитры в контрастном
 * режиме превращалась в чёрный фон при тёмном тексте - нечитаемо.
 * Все строки белые, текст чёрный, сетка чёрными линиями.
 */
html.dd-accessibility-mode .wp-block-table tr,
html.dd-accessibility-mode .wp-block-table th,
html.dd-accessibility-mode .wp-block-table td {
    color: #000000 !important;
    background: #ffffff !important;
    border: 1px solid #000000 !important;
}

html.dd-accessibility-mode .wp-block-table thead th,
html.dd-accessibility-mode .wp-block-table tr:first-child th,
html.dd-accessibility-mode .wp-block-table tr:first-child td {
    font-weight: 700;
}


/*
 * Соцыконки подвала: в контрасте бренд-цвета (оранжевый ОК, синий VK)
 * на чёрном не читаются - белые плашки с чёрными знаками.
 */
html.dd-accessibility-mode .dd-footer__badge {
    background: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
}

html.dd-accessibility-mode .dd-footer__badge svg,
html.dd-accessibility-mode .dd-footer__badge svg * {
    fill: #000000 !important;
    color: #000000 !important;
}

/* Иконка ОК - фоновая картинка в span: обесцвечиваем, не убирая. */
html.dd-accessibility-mode .dd-footer__badge--ok span {
    filter: grayscale(1) contrast(1.6) !important;
}

html.dd-accessibility-mode .dd-footer__badge img {
    filter: grayscale(1) contrast(2) !important;
}


/* ================================================================
   Правки аудита контрастного режима 24.07
   ================================================================ */

/* 1. Герой врача: полоса принудительно белая - роли и линия были
   белым-по-белому. */
html.dd-accessibility-mode .dd-doctor__roles,
html.dd-accessibility-mode .dd-doctor__role {
    color: #000000 !important;
}

html.dd-accessibility-mode .dd-doctor__divider {
    border-color: #000000 !important;
}

/* 2. Фото-карточки прайса: background-image не ловится общим
   grayscale для img - обесцвечиваем сам элемент. */
html.dd-accessibility-mode .dd-page-prices__nav-card {
    filter: grayscale(1) !important;
    border-color: #000000 !important;
}

/* 3. Префикс крошек был невидим (span вне цветовых правил). */
html.dd-accessibility-mode .dd-breadcrumbs,
html.dd-accessibility-mode .dd-breadcrumbs__label {
    color: #000000 !important;
}

/* 4. Карточки услуг: тиловая рамка почти невидима на белом. */
html.dd-accessibility-mode .dd-services__card {
    border-color: #000000 !important;
}

/* 5. Кнопка ПроДокторов: фирменный синий фон - на белую схему. */
html.dd-accessibility-mode .dd-reviews .pd_rate_new {
    color: #000000 !important;
    background: #ffffff !important;
    border: 2px solid #000000 !important;
}

/* 7. Тумблеры куки: включено = залитый чёрный трек с белой ручкой,
   выключено - полый белый с чёрной ручкой. Состояние читается
   заливкой, а не только позицией. */
html.dd-accessibility-mode .ck-toggle input:checked + .ck-slider {
    background: #000000 !important;
}

html.dd-accessibility-mode .ck-toggle input:checked + .ck-slider:before {
    background: #ffffff !important;
}