/**
 * Общие стили контента страницы услуги:
 * — заголовки блоков (проблемы, показания, этапы);
 * — проблемы пациента, показания/противопоказания, этапы лечения;
 * — навигационное меню (десктоп и мобилка).
 */

/* =============================================================================
   Общий заголовок блока — по центру (все секции)
   ============================================================================= */
.legstom-section__title {
	text-align: center;
	margin: 0 0 32px !important;
	font-size: 32px;
	font-weight: 700;
}

@media (max-width: 768px) {
	.legstom-section__title {
		font-size: 24px;
	}
}

.hero-top-wrapper {
	min-height: 350px;
}

/* =============================================================================
   Проблемы пациента — [legstom_patient_problems]
   ============================================================================= */
.legstom-problems {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.legstom-problems__item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	background: #f5f5f5;
	border-radius: 50px;
	font-size: 16px;
	line-height: 1.3;
	color: #333;
}

.legstom-problems__item::before {
	content: "";
	flex-shrink: 0;
	width: 8px;
	height: 8px;
	background: #e53935;
	border-radius: 50%;
}

.single-content ul {
	padding-left: 0;
}

/* =============================================================================
   Показания и противопоказания — [legstom_indications]
   ============================================================================= */
.legstom-indic {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.legstom-indic__col {
	background: #f8f8f8;
	border-radius: 12px;
	padding: 28px 32px;
}

.legstom-indic__title {
	margin: 0 0 20px;
	font-size: 20px;
	font-weight: 700;
}

.legstom-indic__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.legstom-indic__item {
	display: flex;
	align-items: baseline;
	gap: 10px;
	font-size: 16px;
	line-height: 1.5;
}

.legstom-indic__item::before {
	content: "+";
	flex-shrink: 0;
	font-weight: 700;
	font-size: 16px;
	line-height: 1;
}

.legstom-indic__col--pros .legstom-indic__item::before {
	color: #2e7d32;
}

.legstom-indic__col--cons .legstom-indic__item::before {
	content: "\2013";
	color: #e53935;
}

@media (max-width: 768px) {
	.legstom-indic {
		grid-template-columns: 1fr;
	}
}

/* =============================================================================
   Этапы лечения — [legstom_treatment_stages]
   Макет: название (слева) | номер (по центру) | содержимое (справа)
   ============================================================================= */
.legstom-stages {
	display: flex;
	flex-direction: column;
}

.legstom-stages__item {
	display: grid;
	grid-template-columns: 1fr 40px 2fr;
	gap: 0 24px;
	position: relative;
}

.legstom-stages__item:not(.legstom-stages__item--last) {
	padding-bottom: 32px;
}

.legstom-stages__title {
	text-align: right;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
	padding-top: 6px;
}

.legstom-stages__number {
	display: flex;
	flex-direction: column;
	align-items: center;
	align-self: stretch;
	position: relative;
}

.legstom-stages__circle {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #e3f0fa;
	color: #1a73e8;
	font-weight: 700;
	font-size: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	position: relative;
	z-index: 1;
}

.legstom-stages__item:not(.legstom-stages__item--last) .legstom-stages__number::after {
	content: "";
	position: absolute;
	top: 36px;
	bottom: -32px;
	left: 50%;
	transform: translateX(-50%);
	width: 2px;
	background: #e3f0fa;
}

.legstom-stages__content {
	font-size: 18px;
	line-height: 1.6;
	padding-top: 6px;
}

.legstom-stages__content img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	margin: 12px 0;
}

.legstom-stages__video {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	margin: 12px 0;
	display: block;
}

.legstom-stages__content p:first-child { margin-top: 0; }
.legstom-stages__content p:last-child  { margin-bottom: 0; }

@media (max-width: 768px) {
	.legstom-stages__item {
		grid-template-columns: 32px 1fr;
		grid-template-rows: auto auto;
		gap: 0 16px;
	}

	.legstom-stages__item:not(.legstom-stages__item--last) {
		padding-bottom: 0;
	}

	/* Линию на мобилке ведём от всего этапа (item), а не от колонки с номером,
	   чтобы линия шла на всю высоту этапа, включая контент во второй строке */
	.legstom-stages__item:not(.legstom-stages__item--last) .legstom-stages__number::after {
		display: none;
	}

	.legstom-stages__item:not(.legstom-stages__item--last)::after {
		content: "";
		position: absolute;
		left: 15px;
		top: 32px;
		bottom: 0;
		width: 2px;
		background: #e3f0fa;
	}

	.legstom-stages__number {
		grid-column: 1;
		grid-row: 1;
	}

	.legstom-stages__circle {
		width: 32px;
		height: 32px;
		font-size: 14px;
	}

	.legstom-stages__title {
		grid-column: 2;
		grid-row: 1;
		text-align: left;
		font-size: 18px;
	}

	.legstom-stages__content {
		grid-column: 2;
		grid-row: 2;
		font-size: 16px;
		padding-top: 8px;
	}
}

/* =============================================================================
   Навигация на странице услуги
   Десктоп: .nav-single-service — отступы между пунктами.
   Мобилка: .nav-single-service-mobile — nowrap + горизонтальный скролл.
   ============================================================================= */
.nav-single-service .menu {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	list-style: none;
}

.nav-single-service .menu li a {
	text-decoration: none;
	border-bottom: 1px dashed currentColor;
	padding: 0;
	transition: color 0.2s, border-color 0.2s;
}

.nav-single-service .menu li a:hover {
	border-bottom-color: #04bf68;
}

.nav-single-service .kb-navigation {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
}

.nav-single-service .kb-navigation .kb-nav-link-content {
	text-decoration: none;
	border-bottom: 1px dashed currentColor;
	padding: 0;
	transition: color 0.2s, border-color 0.2s;
}

.nav-single-service .kb-navigation .kb-nav-link-content:hover {
	border-bottom-color: #04bf68;
}

.nav-single-service-mobile {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.nav-single-service-mobile::-webkit-scrollbar {
	display: none;
}

.nav-single-service-mobile .menu {
	display: flex;
	flex-wrap: nowrap;
	gap: 24px;
	list-style: none;
	margin: 0;
	padding: 0;
	white-space: nowrap;
}

.nav-single-service-mobile .menu li a {
	text-decoration: none;
	border-bottom: 1px dashed currentColor;
	padding: 0;
	transition: color 0.2s, border-color 0.2s;
}

.nav-single-service-mobile .menu li a:hover {
	border-bottom-color: #04bf68;
}

.nav-single-service-mobile .kb-navigation {
	display: flex;
	flex-wrap: nowrap;
	gap: 24px;
	white-space: nowrap;
}

.nav-single-service-mobile .kb-navigation .wp-block-kadence-navigation-link {
	flex-shrink: 0;
}

.nav-single-service-mobile .kb-navigation .kb-nav-link-content {
	text-decoration: none;
	border-bottom: 1px dashed currentColor;
	padding: 0;
	transition: color 0.2s, border-color 0.2s;
}

.nav-single-service-mobile .kb-navigation .kb-nav-link-content:hover {
	border-bottom-color: #04bf68;
}

/* =============================================================================
   Сайдбар на сингл-странице услуги и странице акций: виджет навигации (#secondary .widget_nav_menu)
   Текст синий, при наведении и активный пункт — зелёный. На мобилке сайдбар скрыт.
   ============================================================================= */
#secondary .widget_nav_menu .menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

#secondary .widget_nav_menu .menu li {
	margin: 0 0 12px;
}

#secondary .widget_nav_menu .menu li:last-child {
	margin-bottom: 0;
}

/* Убираем нулевые отступы у пунктов меню */
#secondary .widget_nav_menu .menu li a,
#secondary .widget_nav_menu .menu li .drawer-nav-drop-wrap > a {
	padding-top: 6px;
	padding-bottom: 6px;
}

/* Toggle child menu — без отступов и левой границы */
#secondary .widget_nav_menu .menu .drawer-sub-toggle,
#secondary .widget_nav_menu .menu button.drawer {
	padding: 0;
	border-left: 0;
}

#secondary .widget_nav_menu .menu a {
	color: #1a7cfa;
	text-decoration: none;
	transition: color 0.2s;
}

#secondary .widget_nav_menu .menu a:hover {
	color: #04bf68;
}

/* Подсвечиваем только открытую страницу (текущий пункт), не предков */
#secondary .widget_nav_menu .menu li.current-menu-item > a,
#secondary .widget_nav_menu .menu li.current-menu-item > .drawer-nav-drop-wrap > a {
	color: #04bf68;
}

/* Подменю: те же цвета, без пунктира */
#secondary .widget_nav_menu .menu .sub-menu {
	list-style: none;
	margin: 4px 0 0 12px;
	padding: 0;
}

#secondary .widget_nav_menu .menu .sub-menu li {
	margin: 0 0 8px;
}

#secondary .widget_nav_menu .menu .sub-menu a {
	color: #1a7cfa;
	text-decoration: none;
}

#secondary .widget_nav_menu .menu .sub-menu a:hover,
#secondary .widget_nav_menu .menu .sub-menu li.current-menu-item > a {
	color: #04bf68;
}

/* Контейнер с сайдбаром: сетка и отступ между колонками */
.has-sidebar .content-container {
	gap: 30px;
	grid-template-columns: 10fr 2fr;
}

/* Скрываем весь сайдбар на сингле услуги: от 1024px и меньше, а также от 768px и ниже */
@media (max-width: 1024px) {
	#secondary,
	#secondary.primary-sidebar,
	#secondary aside.primary-sidebar.widget-area,
	#secondary .primary-sidebar.widget-area {
		display: none !important;
	}
}
