:root {
	--a11y-font-scale: 1;
	--a11y-brand-primary: #46beeb;
}

/* Base font size in rem units across the site. */
html {
	font-size: calc(16px * var(--a11y-font-scale));
}

/* Text size (3 variants). */
html.a11y-text-normal,
body.a11y-text-normal {
	--a11y-font-scale: 1;
}
html.a11y-text-medium,
body.a11y-text-medium {
	--a11y-font-scale: 1.12;
	word-break: break-word;
}
html.a11y-text-large,
body.a11y-text-large {
	--a11y-font-scale: 1.26;
	word-break: break-word;
}

/* Color schemes via CSS variables (do not require rewriting existing CSS). */
html.a11y-theme-primary,
body.a11y-theme-primary {
	filter: none;
}
html.a11y-theme-white,
body.a11y-theme-white {
	/* Black & white mode: grayscale + stronger contrast. */
	filter: grayscale(1) contrast(1.2);
}
html.a11y-theme-black,
body.a11y-theme-black {
	--color-primary: #ffffff;
	--color-secondary: #ffffff;
	--color-text: #ffffff;
	--color-bg: #000000;
	--color-border: #ffffff;
	--color-card: #000000;
}

/* Normalize common "hardcoded white" blocks to theme variables. */
html.a11y-theme-black .site-nav,
html.a11y-theme-black .denstar-modal__content,
html.a11y-theme-black .site-footer,
html.a11y-theme-black .site-nav__submenu,
html.a11y-theme-black .promo-section,
html.a11y-theme-black .page-section,
html.a11y-theme-black .accordion__content,
html.a11y-theme-black .price-accordion__content,
html.a11y-theme-black .documents-file-card,
html.a11y-theme-black .documents-images-grid__item,
html.a11y-theme-black .about-clinic__container,
html.a11y-theme-black .contacts-section__info,
html.a11y-theme-black .employee-card,
html.a11y-theme-black .employee-card__body,
html.a11y-theme-black .employee-single__card,
html.a11y-theme-black .work-card,
html.a11y-theme-black .work-card__body,
html.a11y-theme-black .subservice-card,
html.a11y-theme-black .subservice-card__body,
body.a11y-theme-black .site-nav,
body.a11y-theme-black .denstar-modal__content,
body.a11y-theme-black .site-footer,
body.a11y-theme-black .site-nav__submenu,
body.a11y-theme-black .promo-section,
body.a11y-theme-black .page-section,
body.a11y-theme-black .accordion__content,
body.a11y-theme-black .price-accordion__content,
body.a11y-theme-black .documents-file-card,
body.a11y-theme-black .documents-images-grid__item,
body.a11y-theme-black .about-clinic__container,
body.a11y-theme-black .contacts-section__info,
body.a11y-theme-black .employee-card,
body.a11y-theme-black .employee-card__body,
body.a11y-theme-black .employee-single__card,
body.a11y-theme-black .work-card,
body.a11y-theme-black .work-card__body,
body.a11y-theme-black .subservice-card,
body.a11y-theme-black .subservice-card__body {
	background: var(--color-bg) !important;
	color: var(--color-text);
	border-color: var(--color-border) !important;
}

/* Nav should not paint a narrow dark panel in header. */
html.a11y-theme-black .site-nav.site-nav--open,
body.a11y-theme-black .site-nav.site-nav--open {
	background: var(--color-bg) !important;
	border-left: 1px solid var(--color-border) !important;
}

/* Inner header (non-home pages) should be black in black theme. */
html.a11y-theme-black .site-header--inner,
body.a11y-theme-black .site-header--inner {
	background: #000000 !important;
}

html.a11y-theme-black .site-header--inner .site-header__contacts a,
html.a11y-theme-black .site-header--inner .site-nav a,
html.a11y-theme-black .site-header--inner .site-header__logo,
html.a11y-theme-black .site-header--inner .site-header__logo-text,
body.a11y-theme-black .site-header--inner .site-header__contacts a,
body.a11y-theme-black .site-header--inner .site-nav a,
body.a11y-theme-black .site-header--inner .site-header__logo,
body.a11y-theme-black .site-header--inner .site-header__logo-text {
	color: #ffffff !important;
}

/* In mobile/open nav state, force light text over backdrop. */
html.a11y-theme-black .site-nav.site-nav--open a,
html.a11y-theme-black .site-nav.site-nav--open .site-nav__submenu a,
html.a11y-theme-black .site-header--home .site-nav__submenu a,
html.a11y-theme-black .site-nav__bottom p,
body.a11y-theme-black .site-nav.site-nav--open a,
body.a11y-theme-black .site-nav.site-nav--open .site-nav__submenu a,
body.a11y-theme-black .site-header--home .site-nav__submenu a,
body.a11y-theme-black .site-nav__bottom p {
	color: #ffffff !important;
}

html.a11y-theme-black .site-nav__submenu a:hover,
html.a11y-theme-black .site-nav__submenu a:focus-visible,
body.a11y-theme-black .site-nav__submenu a:hover,
body.a11y-theme-black .site-nav__submenu a:focus-visible {
	background: #ffffff !important;
	color: #000000 !important;
}

/* Keep home header image visible unless user explicitly disables images. */
html.a11y-images-off .site-header,
body.a11y-images-off .site-header {
	background: var(--color-bg) !important;
}

html.a11y-theme-black a,
body.a11y-theme-black a {
	color: inherit;
}

html.a11y-theme-black .home-services-list__item,
body.a11y-theme-black .home-services-list__item {
	background: #ffffff;
	color: #000000;
	border: 1px solid #ffffff;
}

html.a11y-theme-black .home-services-list__item:hover,
body.a11y-theme-black .home-services-list__item:hover {
	background: #111111;
	color: #ffffff;
	border-color: #ffffff;
}

html.a11y-theme-black .home-services-list__item .home-services-list__icon img,
body.a11y-theme-black .home-services-list__item .home-services-list__icon img {
	filter: grayscale(1) contrast(1.25) brightness(0.2);
}

/* Keep logo mark readable on dark header backgrounds. */
html.a11y-theme-black .site-header__logo-mark,
body.a11y-theme-black .site-header__logo-mark {
	filter: grayscale(1) brightness(1.35) contrast(1.2);
}

/* Accordion headers use --color-primary background in black theme (white). */
html.a11y-theme-black .accordion__trigger,
html.a11y-theme-black .price-accordion__trigger,
html.a11y-theme-black .documents-accordion__trigger,
body.a11y-theme-black .accordion__trigger,
body.a11y-theme-black .price-accordion__trigger,
body.a11y-theme-black .documents-accordion__trigger {
	color: #000000;
}

html.a11y-theme-black .director-card__position,
html.a11y-theme-black .contacts-section__item span,
body.a11y-theme-black .director-card__position,
body.a11y-theme-black .contacts-section__item span {
	color: #cfcfcf;
}

html.a11y-theme-black .denstar-modal__overlay,
body.a11y-theme-black .denstar-modal__overlay {
	background: rgba(255, 255, 255, 0.2);
}
/* Captcha colors in accessibility themes. */
html.a11y-theme-white .denstar-captcha,
body.a11y-theme-white .denstar-captcha {
	background: #ffffff;
	border-color: #111111;
}
html.a11y-theme-white .denstar-captcha__box,
body.a11y-theme-white .denstar-captcha__box {
	background: #ffffff;
	border-color: #111111;
}
html.a11y-theme-white .denstar-captcha__text,
body.a11y-theme-white .denstar-captcha__text {
	color: #111111;
}
html.a11y-theme-white .denstar-captcha__icon,
body.a11y-theme-white .denstar-captcha__icon {
	--denstar-captcha-icon-color: #111111;
}
html.a11y-theme-white .denstar-captcha:hover .denstar-captcha__box,
body.a11y-theme-white .denstar-captcha:hover .denstar-captcha__box,
html.a11y-theme-white .denstar-captcha__input:checked + .denstar-captcha__box,
body.a11y-theme-white .denstar-captcha__input:checked + .denstar-captcha__box {
	background: #111111;
	border-color: #111111;
}
html.a11y-theme-black .denstar-captcha,
body.a11y-theme-black .denstar-captcha {
	background: #000000;
	border-color: #ffffff;
}
html.a11y-theme-black .denstar-captcha__box,
body.a11y-theme-black .denstar-captcha__box {
	background: #000000;
	border-color: #ffffff;
}
html.a11y-theme-black .denstar-captcha__text,
body.a11y-theme-black .denstar-captcha__text {
	color: #ffffff;
}
html.a11y-theme-black .denstar-captcha__icon,
body.a11y-theme-black .denstar-captcha__icon {
	--denstar-captcha-icon-color: #ffffff;
}
html.a11y-theme-black .denstar-captcha:hover .denstar-captcha__box,
body.a11y-theme-black .denstar-captcha:hover .denstar-captcha__box,
html.a11y-theme-black .denstar-captcha__input:checked + .denstar-captcha__box,
body.a11y-theme-black .denstar-captcha__input:checked + .denstar-captcha__box {
	background: #ffffff;
	border-color: #ffffff;
}
html.a11y-theme-black .denstar-captcha__input:checked + .denstar-captcha__box::after,
body.a11y-theme-black .denstar-captcha__input:checked + .denstar-captcha__box::after {
	border-color: #000000;
}

/* Make header background image black&white in black theme. */
html.a11y-theme-black .site-header--home,
body.a11y-theme-black .site-header--home {
	filter: grayscale(1) contrast(1.15);
}

/* Keep controls readable in high-contrast black theme. */
html.a11y-theme-black .btn--primary,
body.a11y-theme-black .btn--primary {
	color: #000000;
	border-color: #ffffff;
}

/* Ensure visual-toggle icon stays visible (not white on white). */
html.a11y-theme-black .btn-visual-toggle,
body.a11y-theme-black .btn-visual-toggle {
	background: #ffffff !important;
	color: #000000 !important;
	border: 1px solid #ffffff;
}

html.a11y-theme-black .denstar-modal__close,
html.a11y-theme-black .site-nav__close,
body.a11y-theme-black .denstar-modal__close,
body.a11y-theme-black .site-nav__close {
	color: #ffffff;
}

html.a11y-theme-black input,
html.a11y-theme-black textarea,
body.a11y-theme-black input,
body.a11y-theme-black textarea {
	background: #111111 !important;
	color: #ffffff !important;
	border: 1px solid #ffffff;
}

html.a11y-theme-white input,
html.a11y-theme-white textarea,
body.a11y-theme-white input,
body.a11y-theme-white textarea {
	/* background: #111111 !important;
	color: #ffffff !important; */
	border: 1px solid #111111;
}

/* Clearer focus in accessibility mode. */
html.accessibility-mode :focus-visible,
body.accessibility-mode :focus-visible {
	outline: 3px solid currentColor;
	outline-offset: 2px;
}

/* Images off: keep layout, make images visually neutral. */
html.a11y-theme-black img,
html.a11y-theme-black svg,
html.a11y-theme-black video,
html.a11y-theme-black iframe,
html.a11y-theme-black .promotion-card,
html.a11y-theme-black .promotion-card__image,
html.a11y-theme-black .home-slider__slide,
body.a11y-theme-black img,
body.a11y-theme-black svg,
body.a11y-theme-black video,
body.a11y-theme-black iframe,
body.a11y-theme-black .promotion-card,
body.a11y-theme-black .promotion-card__image,
body.a11y-theme-black .home-slider__slide {
	filter: grayscale(1);
}

/* Images-off mode stays strongest and overrides theme grayscale. */
html.a11y-images-off img,
html.a11y-images-off video,
html.a11y-images-off iframe,
body.a11y-images-off img,
body.a11y-images-off video,
body.a11y-images-off iframe {
	filter: grayscale(1) contrast(0) brightness(1.25);
}

/* Disable only image-like backgrounds, keep regular color styling intact. */
html.a11y-images-off .site-header--home,
html.a11y-images-off .services-card__top,
html.a11y-images-off .home-slider__slide,
html.a11y-images-off .promotion-card,
html.a11y-images-off .promotion-card__image,
html.a11y-images-off .work-compare__before,
html.a11y-images-off .work-compare__after,
body.a11y-images-off .site-header--home,
body.a11y-images-off .services-card__top,
body.a11y-images-off .home-slider__slide,
body.a11y-images-off .promotion-card,
body.a11y-images-off .promotion-card__image,
body.a11y-images-off .work-compare__before,
body.a11y-images-off .work-compare__after {
	background-image: none !important;
}

/* Panel UI inside modal. */
.sp-panel h2 {
	margin: 0 0 16px;
}

.sp-panel h3 {
	margin: 18px 0 10px;
	font-size: 1.125rem;
}

.sp-panel__buttons {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.sp-panel__buttons button,
.sp-panel__controls button {
	background: transparent;
	border: 2px solid currentColor;
	color: inherit;
	border-radius: 10px;
	padding: 10px 14px;
	min-width: 56px;
	font-weight: 700;
}

.sp-panel__buttons button.is-active,
.sp-panel__controls button.is-active {
	background: var(--color-text);
	border-color: var(--color-text);
	color: var(--color-bg);
}

.sp-panel__buttons button[data-sp-text="normal"] {
	font-size: 1.125rem;
}

.sp-panel__buttons button[data-sp-text="medium"] {
	font-size: 1.375rem;
}

.sp-panel__buttons button[data-sp-text="large"] {
	font-size: 1.625rem;
}

.sp-panel__buttons button[data-sp-theme] {
	width: 44px;
	min-width: 44px;
	height: 44px;
	padding: 0;
	border-radius: 999px;
	border-width: 2px;
}

.sp-panel__buttons button[data-sp-theme="primary"] {
	background: var(--a11y-brand-primary);
	border-color: var(--a11y-brand-primary);
}

.sp-panel__buttons button[data-sp-theme="white"] {
	background: #ffffff;
	border-color: #111111;
}

.sp-panel__buttons button[data-sp-theme="black"] {
	background: #000000;
	border-color: #ffffff;
}

.sp-panel__buttons button[data-sp-theme].is-active {
	box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.25);
}

.a11y-theme-black .sp-panel__buttons button[data-sp-theme].is-active {
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35);
}

.sp-panel__controls {
	display: grid;
	gap: 10px;
	margin-top: 18px;
}

/* Черная тема - ховер для кнопок слайдера */
html.a11y-theme-black .home-slider__prev:hover,
html.a11y-theme-black .home-slider__next:hover,
body.a11y-theme-black .home-slider__prev:hover,
body.a11y-theme-black .home-slider__next:hover {
	background: #000000 !important;
	color: #ffffff !important;
	border-color: #ffffff !important;
}

/* Также добавим для фокуса (доступность) */
html.a11y-theme-black .home-slider__prev:focus-visible,
html.a11y-theme-black .home-slider__next:focus-visible,
body.a11y-theme-black .home-slider__prev:focus-visible,
body.a11y-theme-black .home-slider__next:focus-visible {
	background: #000000 !important;
	color: #ffffff !important;
	border-color: #ffffff !important;
	outline: 2px solid #ffffff;
	outline-offset: 2px;
}

@media (min-width: 640px) {
	.sp-panel__controls {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
