/* Переключатель светлая / тёмная тема (body.theme-light / body.theme-dark) */
.theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	border: none;
	border-radius: 50%;
	background: transparent;
	color: inherit;
	cursor: pointer;
	pointer-events: auto;
	position: relative;
	z-index: 30;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.theme-toggle:focus-visible {
	outline: 2px solid var(--theme-base-color, #2fc6b4);
	outline-offset: 2px;
}

.theme-toggle__svg {
	display: block;
	flex-shrink: 0;
}

.theme-toggle__svg--sun {
	display: none;
}

.theme-toggle.theme-toggle--dark .theme-toggle__svg--moon {
	display: none;
}

.theme-toggle.theme-toggle--dark .theme-toggle__svg--sun {
	display: block;
}

/* Разметка Битрикс UI: button.theme-toggle.dark + .theme-icon */
button.theme-toggle .theme-icon {
	opacity: 0.45;
	transition: opacity 0.2s ease;
}

button.theme-toggle .theme-icon.is-active {
	opacity: 1;
}

body.theme-dark {
	background-color: #0b0d10 !important;
	color-scheme: dark;
}

body.theme-light {
	color-scheme: light;
}

/* Принудительно тянем фон на внутренний блок .body (шаблон Aspro), иначе визуально «ничего не меняется» */
html[data-lx-theme="dark"] #main .body.relative,
html[data-lx-theme="dark"] #main .main.banner-auto {
	background-color: #0b0d10 !important;
}

html[data-lx-theme="light"] #main .body.relative,
html[data-lx-theme="light"] #main .main.banner-auto {
	background-color: #f0f3f5 !important;
}

html[data-lx-theme="light"] #main .main.banner-auto {
	background: none !important;
}