/**
 * Витрина магазина: состояния, которых нет в вёрстке (style.css не правится — только дополнения).
 *  - пагинация: стрелка «назад» .pagination__prev — по аналогии с .pagination__next;
 *  - карточка: «Нет в наличии» вместо цены и неактивная «В корзину» для недоступного сочетания параметров;
 *    список селекта поверх строки «В корзину»;
 *  - «Показать еще» на время загрузки;
 *  - пустой список (.catalog__empty) — белая плашка как у .filter; на пустом поиске — с полем поиска;
 *  - тулбар без кнопки «Фильтр» (.toolbar--no-filter);
 *  - товарный слайдер: стрелки, когда листать нечего, и слайд без transition (Swiper мерил зазор дважды);
 *  - «Преимущества» (макет benefits) перед белой секцией — серый зазор, светлые плитки не сливаются с белым фоном.
 */

/* Плитка подкатегории без фото: светлая заглушка WooCommerce приглушена до тёмного фона плитки —
   иначе белое название на ней не читается. */
.subcat-card__picture .woocommerce-placeholder {
	opacity: 0.12;
}

/* Пагинация: «назад» — та же стрелка, развёрнутая влево. */
.pagination__prev {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.6rem;
	height: 2.6rem;
	transition: 0.3s ease 0s;
}

.pagination__prev svg {
	width: 1.2rem;
	height: 1.2rem;
	scale: -1 1;
}

.pagination__prev:hover {
	color: var(--green);
}

/* Карточка: выбранного сочетания нет — подпись вместо цены. */
.product-item__price.is-unavailable {
	font-size: 1.6rem;
	font-weight: 500;
	opacity: 0.7;
}

.product-item__button:disabled {
	background-color: var(--gray-form);
	cursor: not-allowed;
}

/* Карточка: открытый список селекта (размер, мощность) — поверх строки «В корзину» (у неё z-index 30 в style.css,
   у списка 5) и карточек ниже: длинный список размеров модели уходит за низ карточки. */
.product-item__select .select-options {
	z-index: 31;
}

/* Цена WooCommerce (wc_price): разделитель тысяч — обычный пробел, сумма не разрывается между разрядами. */
.product-item__price .woocommerce-Price-amount {
	white-space: nowrap;
}

/* «Показать еще»: идёт загрузка следующей страницы. */
.show-more.is-loading {
	opacity: 0.6;
	cursor: progress;
	pointer-events: none;
}

/* Нет товаров. */
.catalog__empty {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2.4rem;
	padding: 4rem;
	background-color: var(--white);
}

.catalog__empty-text {
	font-size: 1.8rem;
	line-height: 1.4;
}

.catalog__empty-button {
	min-width: 26.4rem;
	padding: 1rem 2.4rem;
}

/* Пустой поиск: поле поиска по товарам (блок .search, как в шапке, но крупнее — как на странице поиска по сайту)
   и ссылка «Каталог светильников» (как в пустом избранном). */
.catalog__empty-search {
	width: 100%;
	max-width: 55.2rem;
}

.catalog__empty-search .search {
	max-width: none;
	height: 5rem;
}

.catalog__empty-search .search__input {
	font-size: 1.6rem;
}

.catalog__empty-link {
	gap: 2.4rem;
	min-height: 4.4rem;
	padding: 0.6rem 1.6rem 0.6rem 2.2rem;
}

/* Тулбар без «Фильтр» (блока .filter нет — фильтровать нечего): сортировка и виды остаются над товарами. */
.toolbar--no-filter .toolbar__controls {
	grid-column: 2;
}

/* Без фильтра карточка менеджера — первая в сайдбаре: верх вровень с колонкой товаров (отступ у неё — от фильтра). */
.catalog__aside > .manager:first-child {
	margin-top: 0;
}

/* Товарный слайдер: все карточки помещаются — Swiper ставит стрелкам swiper-button-lock (листать нечего).
   Правило swiper-bundle `.swiper-button-lock { display: none }` перебито .slider-arrow из style.css (он подключён
   позже), поэтому прячем сами. visibility, а не display: место стрелок остаётся и шапка секции не прыгает
   после запуска Swiper (на ≤1024 стрелки выше заголовка). При одной карточке стрелок в разметке нет совсем. */
.products-slider__nav .slider-arrow.swiper-button-lock {
	visibility: hidden;
}

/* Слайд товарного слайдера: у .product-item в style.css transition на все свойства, и отступ margin-right, который
   Swiper ставит слайду, тоже анимируется. При пересчёте (resize/update) Swiper сбрасывает отступ и сразу меряет
   слайд — получает ещё не сброшенный отступ и считает зазор дважды: в конце лента уезжает за последнюю карточку
   на N × зазор (пустое место справа), а ровно помещающиеся карточки не блокируются — стрелки видны и дёргают ленту.
   Своих переходов у самой карточки нет (анимируются её дети), поэтому у слайда переход просто снят. */
.products-slider__slide.product-item {
	transition: none;
}

/* «Преимущества» (.benefits, макет benefits), за которыми в конструкторе поставили белую секцию (.opt.bg-white,
   .mistakes и т. п.). Общее правило вёрстки section:not(.bg-white) + .bg-white подтягивает белый фон вплотную к низу
   плиток, и светлые плитки без границы переходили в белую секцию. Как у вёрстки после .interior (.interior + .bg-white):
   белый фон начинается ниже, на --section-margin серого, отступ до содержимого белой секции тот же (2 × --section-margin).
   В вёрстке за .benefits белой секции нет нигде; на товаре без «… в интерьере» то же делает smd-product.css. */
.main > .benefits + .bg-white {
	margin-top: 0;
	padding-top: var(--section-margin);
}

@media (max-width: 768px) {
	.catalog__empty {
		padding: 3rem 2rem;
	}

	.catalog__empty-text {
		font-size: 1.6rem;
	}

	.toolbar--no-filter .toolbar__controls {
		grid-column: 1 / -1;
	}
}

@media (max-width: 480px) {
	.catalog__empty-button {
		width: 100%;
		min-width: 0;
	}
}