main.appointment { gap: 0; }

.appointment__cart-title-wrapper {
	display: flex;
	gap: 30px;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 40px;
}
.appointment__cart-slider { overflow: visible !important; }
.appointment .appointment__cart-slider img {
	width: 100%;
	height: 265px;
	object-fit: cover;
	border-radius: 20px;
}

.appointment__cart-item {
	padding: 15px;
	background-color: var(--white-color);
	border-radius: 20px;
}

.appointment__cart-thumb { margin-bottom: 20px; }
.appointment__cart-meta { display: none; }

.appointment__steps .container { padding-bottom: 140px; }

.appointment__step {
	max-width: 1090px;
	height: auto;
	background-color: var(--white-color);
	border-radius: 30px;
	padding: 30px;
	margin: 0 auto;
	position: relative;
}

.appointment__step .text.title {
	font-weight: 500;
	font-size: 42px;
	text-align: center;
	margin-bottom: 20px;
}

/* ---------------- Calendar header ---------------- */

.appointment__calendar-header {
	display: flex;
	gap: 15px;
	align-items: center;
	justify-content: center;
	margin-bottom: 40px;
}

.appointment__calendar-header button {
	border: 0;
	background-color: transparent;
	width: 11px;          /* ✅ было widows */
	height: 19px;
	padding: 0;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.appointment__month-nav svg path { fill: var(--black-color); }
.appointment__month-nav:hover svg path { fill: var(--accent-color); }

.appointment__month-nav--prev svg { transform: rotate(90deg); }
.appointment__month-nav--next svg { transform: rotate(-90deg); }

/* ---------------- Days / Times layout ---------------- */

/* ✅ Дни: фикс-плитки как на скрине (без растягивания колонок) */
.appointment__calendar-days {
	display: grid; gap: 20px;
	justify-content: center;
	grid-template-columns: repeat(auto-fit, minmax(70px, 70px));
}

/* ✅ Время: “по контенту”, не растягивается на весь контейнер */
.appointment__times {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(auto-fit, minmax(95px, max-content));
	justify-content: center;
}

/* ---------------- Day buttons ---------------- */

.appointment__calendar-days button {
	width: 70px;
	height: 70px;
	border: 0;
	border-radius: 10px;
	font-weight: 500;
	font-size: 36px;
	background-color: var(--white-color);
	box-shadow: 0 5px 13.8px #F5E3F0;
	cursor: pointer;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;

	transition: background-color 0.2s ease, color 0.2s ease;
	will-change: background-color, color;
}

.appointment__calendar-days button:hover {
	background-color: var(--black-color);
	color: var(--white-color);
}

/* ---------------- Time buttons ---------------- */

.appointment__times button {
	color: var(--accent-color);
	border: 0;
	font-weight: 500;
	font-size: 32px;
	background-color: transparent;
	cursor: pointer;
	padding: 0;
	line-height: 1.2;
}

.appointment__times button:hover { color: var(--black-color); }

.appointment__calendar-days button:disabled,
.appointment__times button:disabled {
	pointer-events: none;
}

.appointment__times button:disabled { color: var(--chat-bot-bg-color); }
.appointment__calendar-days button:disabled { filter: brightness(0.9); }
/* ---------------- Form inside appointment ---------------- */

.appointment .form__container { padding: 0 !important; }

.appointment .form__content {
	min-height: unset;
	padding: 0;
	background-image: unset;
}

.appointment .form__content * { color: var(--black-color); }
.appointment .form__heading .title { display: none; }
.appointment .form__wpforms-button { color: var(--white-color); }

.appointment .form__wpforms-input {
	box-shadow: 0 5px 13.8px #F5E3F0;
}

.appointment input.form__wpforms-input:not(:placeholder-shown) { color: var(--black-color); }

.appointment .form__wpforms-name::placeholder,
.appointment .form__wpforms-phone::placeholder { color: var(--black-color); }


/* ------------------------------------------------------------
   Appointment – responsive
------------------------------------------------------------ */

/* <= 1100px */
@media (max-width: 1100px) {
	.appointment__cart-title-wrapper {
		gap: 18px;
		margin-bottom: 30px;
	}

	.appointment .appointment__cart-slider img {
		height: 240px;
		border-radius: 18px;
	}

	.appointment__cart-item {
		padding: 14px;
		border-radius: 18px;
	}

	.appointment__steps .container { padding-bottom: 110px; }

	.appointment__step {
		max-width: 940px;
		padding: 26px;
		border-radius: 28px;
	}

	.appointment__step .text.title {
		font-size: 38px;
		margin-bottom: 18px;
	}

	.appointment__calendar-header { margin-bottom: 30px; }

	.appointment__calendar-days,
	.appointment__times { gap: 16px; }

	.appointment__calendar-days {
		grid-template-columns: repeat(auto-fit, minmax(62px, 62px));
	}

	.appointment__times {
		grid-template-columns: repeat(auto-fit, minmax(88px, max-content));
	}

	.appointment__calendar-days button {
		width: 62px;
		height: 62px;
		font-size: 32px;
	}

	.appointment__times button { font-size: 28px; }
}

/* <= 900px */
@media (max-width: 900px) {
	.appointment .appointment__cart-slider img {
		height: 220px;
		border-radius: 16px;
	}

	.appointment__cart-item {
		padding: 12px;
		border-radius: 16px;
	}

	.appointment__steps .container { padding-bottom: 90px; }

	.appointment__step {
		max-width: 820px;
/* 		height: 390px; */
		padding: 22px;
		border-radius: 26px;
	}

/* 	.appointment__step:not(:first-child) { margin-top: -390px; } */

	.appointment__step .text.title {
		font-size: 34px;
		margin-bottom: 16px;
	}

	.appointment__calendar-header { margin-bottom: 26px; }

	.appointment__calendar-days,
	.appointment__times { gap: 14px; }

	.appointment__calendar-days {
		grid-template-columns: repeat(auto-fit, minmax(56px, 56px));
	}

	.appointment__times {
		grid-template-columns: repeat(auto-fit, minmax(82px, max-content));
	}

	.appointment__calendar-days button {
		width: 56px;
		height: 56px;
		font-size: 28px;
		border-radius: 10px;
	}

	.appointment__times button { font-size: 26px; }
}

/* <= 768px (планшет/мобилка: убираем "нахлёст" шагов) */
@media (max-width: 768px) {
	.appointment__cart-title-wrapper {
		flex-wrap: wrap;
		gap: 12px;
		margin-bottom: 22px;
	}

	.appointment .appointment__cart-slider img {
		height: 205px;
		border-radius: 16px;
	}

	.appointment__steps .container { padding-bottom: 70px; }

	.appointment__step {
		max-width: 100%;
/* 		min-height: 360px; */
		padding: 20px;
		border-radius: 24px;
	}

	.appointment__step:not(:first-child) { margin-top: 24px; }

	.appointment__step .text.title {
		font-size: 28px;
		margin-bottom: 14px;
	}

	.appointment__calendar-header {
		gap: 12px;
		margin-bottom: 20px;
	}

	.appointment__calendar-days,
	.appointment__times { gap: 12px; }

	.appointment__calendar-days {
		grid-template-columns: repeat(auto-fit, minmax(50px, 50px));
	}

	.appointment__times {
		grid-template-columns: repeat(auto-fit, minmax(74px, max-content));
	}

	.appointment__calendar-days button {
		width: 50px;
		height: 50px;
		font-size: 24px;
	}

	.appointment__times button { font-size: 22px; }
	
	.form__content { grid-template-columns: 1fr; }
	.form__heading { margin-bottom: 20px; }
	.form__description { padding-right: 0; }
	
	.has-form-complite { grid-template-columns: 1fr; }
	.has-form-complite .form__description { margin-bottom: 40px; }
}

/* <= 560px */
@media (max-width: 560px) {
	.appointment .appointment__cart-slider img {
		height: 190px;
		height: 120px;
		border-radius: 14px;
	}

	.appointment__cart-item {
		padding: 10px;
		border-radius: 14px;
	}

	.appointment__steps .container { padding-bottom: 60px; }

	.appointment__step {
/* 		min-height: 330px; */
		padding: 16px;
		border-radius: 22px;
	}

	.appointment__step .text.title {
		font-size: 24px;
		margin-bottom: 12px;
	}

	.appointment__calendar-days {
		grid-template-columns: repeat(auto-fit, minmax(46px, 46px));
	}

	.appointment__times {
		grid-template-columns: repeat(auto-fit, minmax(70px, max-content));
	}

	.appointment__calendar-days button {
		width: 46px;
		height: 46px;
		font-size: 22px;
	}

	.appointment__times button { font-size: 20px; }
}

/* <= 420px */
@media (max-width: 420px) {
/* 	.appointment .appointment__cart-slider img { height: 175px; } */

	.appointment__step {
/* 		min-height: 300px; */
		padding: 14px;
	}

	.appointment__calendar-days,
	.appointment__times { gap: 10px; }

	.appointment__calendar-days {
		grid-template-columns: repeat(auto-fit, minmax(42px, 42px));
	}

	.appointment__times {
		grid-template-columns: repeat(auto-fit, minmax(66px, max-content));
	}

	.appointment__calendar-days button {
		width: 42px;
		height: 42px;
		font-size: 20px;
		border-radius: 10px;
	}

	.appointment__times button { font-size: 18px; }
	
	.has-form-complite .luna__button > p,
	.has-form-complite .svg-wrapper { display: none; }
}



body > a[data-url="https://w1948584.yclients.com"],
body .yButton,
.yButton .yButtonBackground,
.yButton .yButtonWave,
.yButton .yButtonIcon { display: none !important; }

body .yButton .yButtonText,
body .yButton.button {
	--fz: 18px;
    --_fz: calc(var(--fz) * 1.5);
	position: relative !important;
	z-index: unset !important;
	top: 0 !important; right: 0 !important;
	left: 0 !important; bottom: 0 !important;
	width: max-content !important;
    border-radius: var(--_fz) !important;
}
body .yButton.button {
	--fz: 18px;
    --_fz: calc(var(--fz) * 1.5);
	padding-block: var(--fz) !important;
    padding-inline: var(--_fz) !important;
	height: 60px !important;
}
body .yButton .yButtonText {
	font-weight: 600 !important;
    font-family: "Manrope", sans-serif !important;
    font-size: clamp(16px, calc(15.30px + 0.19vw), 18px) !important;
	height: max-content !important;
}
body .yButton.button:hover .yButtonText { color: var(--accent-color) !important;}


/* .yWidgetIFrame .app-header-panel { background-color: var(--accent-color) !important; } */