/* ==========================================================================
   Партнёры «как приложение» (29.09.2026) — pages/partners.blade.php.
   Корень — .partners-page; окно фильтров .popup-partners-filters лежит
   вне корня — через body:has(.partners-page).
   Телефон (≤768) — partners_screen.dart приложения: шапка page-mhead
   «Наши партнеры» (гостю вместо названия — белая пилюля «Стать
   партнером»), светлый лист, поиск-пилюля + кнопка гео-фильтра 42×42,
   секции 18/600 со счётчиком, строки магазинов без карточек (аватар 48),
   окно фильтров — лист снизу (light, r32), списки — белые карточки.
   ПК (≥769) — прежняя раскладка в новом стиле: панель поиска, категории
   белыми карточками r24, магазины плашками light r16, окно по центру r28.
   Разметка и скрипты прежние: поиск (#pn-search-input, data-search,
   .is-hidden / .is-empty, #pn-empty-search), select.js, подгрузка городов
   по региону. Подключён ПОСЛЕ встроенного <style> страницы.
   ========================================================================== */

/* --------------------------------------------------------------------------
   ОБЩЕЕ (все ширины)
   -------------------------------------------------------------------------- */
.partners-page {
	--page-gutter: 15px; /* боковой отступ .container — для page-mhead */
}

/* состояния клиентского поиска (JS страницы) — всегда сильнее оформления */
.partners-page .pn-card.is-hidden,
.partners-page .pn-cat.is-empty {
	display: none;
}

.partners-page .pn-search input {
	border: 1px solid transparent;
	background: var(--white);
	color: var(--black);
}

.partners-page .pn-search input::placeholder {
	color: rgb(22 14 24 / 50%); /* black 50 % — подсказка поиска приложения */
}

/* кнопка гео-фильтра: иконка фильтров violet, выбран фильтр — точка
   brandPurple 10 в углу (partners_screen.dart, _searchRow) */
.partners-page .pn-fbtn {
	position: relative;
}

.partners-page .pn-fbtn svg {
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	color: var(--accent);
}

.partners-page .pn-fbtn.has-value::after {
	content: "";
	position: absolute;
	top: -2px;
	right: -2px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--brand-purple);
}

/* аватар магазина — круг (ClipOval), инициалы на градиенте — прежние */
.partners-page .pn-logo {
	border-radius: 50%;
	font-weight: 700;
	letter-spacing: 0;
}

.partners-page .pn-name {
	font-weight: 600;
	color: var(--black);
}

.partners-page .pn-city {
	font-weight: 500;
	color: rgb(22 14 24 / 40%); /* black 40 % */
}

.partners-page .pn-arrow {
	color: rgb(22 14 24 / 30%); /* black 30 % */
}

.partners-page .pn-cat-count {
	flex-shrink: 0;
	padding: 2px 6px;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 700;
	line-height: 16px;
	color: var(--brand-purple);
}

/* --------------------------------------------------------------------------
   ОКНО ФИЛЬТРОВ (все ширины): фон light, заголовок слева, крестик белый
   квадрат r14, поля белые 46 r16, списки белые карточки r16 с тенью,
   «Применить» violet 48 r16 14/700, «Сбросить» 14/600 brandPurple
   -------------------------------------------------------------------------- */
body:has(.partners-page) .popup-partners-filters .popup-body {
	background: var(--light);
}

body:has(.partners-page) .popup-partners-filters .popup-body-header {
	display: flex;
	align-items: center;
	gap: 12px;
}

body:has(.partners-page) .popup-partners-filters .popup-title {
	flex: 1 1 auto;
	min-width: 0;
	text-align: left;
	font-size: 20px;
	font-weight: 600;
	line-height: 24px;
	color: var(--black);
}

body:has(.partners-page) .popup-partners-filters .popup-close {
	position: static;
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 14px;
	background: var(--white);
	color: rgb(22 14 24 / 30%); /* ≈ крестик sheet_close.svg приложения */
}

body:has(.partners-page) .popup-partners-filters .popup-close svg {
	width: 16px;
	height: 16px;
}

body:has(.partners-page) .popup-partners-filters .popup-close:hover {
	transform: none;
	color: var(--black);
}

body:has(.partners-page) .partners-filter {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

body:has(.partners-page) .partners-field label {
	display: block;
	margin-bottom: 8px;
	font-size: 12px;
	font-weight: 500;
	line-height: 1;
	color: var(--label-gray);
}

/* строка выбора: белая 46, r16, отступ 14, текст 14 black / подсказка 40 % */
body:has(.partners-page) .partners-field .select-input {
	height: 46px;
	margin: 0; /* .popup .input-class даёт снизу 15 — зазоры задаёт форма */
	padding: 0 40px 0 14px;
	border: 1px solid transparent;
	border-radius: 16px;
	background: var(--white);
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	color: var(--black);
}

body:has(.partners-page) .partners-field .select-input::placeholder {
	color: rgb(22 14 24 / 40%); /* black 40 % */
}

body:has(.partners-page) .partners-field .select-input:focus {
	border-color: var(--brand-purple);
}

/* стрелка — keyboard_arrow_down 20, black 40 % */
body:has(.partners-page) .partners-field .select::before {
	right: 14px;
	width: 20px;
	height: 20px;
	background: rgb(22 14 24 / 40%); /* black 40 % */
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 20px 20px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 20px 20px no-repeat;
}

/* город недоступен, пока нет региона (класс .disabled ставит скрипт) */
body:has(.partners-page) .partners-field .disabled {
	opacity: 0.4;
}

/* выпадающий список — белая карточка r16 с тенью */
body:has(.partners-page) .partners-field .select-popup {
	top: calc(100% + 6px);
	padding: 6px 0;
	border: 0;
	border-radius: 16px;
	box-shadow: 0 8px 24px rgb(22 14 24 / 12%); /* black 12 % */
}

body:has(.partners-page) .partners-field .select-button {
	padding: 10px 44px 10px 16px;
	font-size: 14px;
	line-height: 20px;
}

body:has(.partners-page) .partners-field .select-button:hover,
body:has(.partners-page) .partners-field .select-button.selected {
	background: var(--light);
}

body:has(.partners-page) .partners-field .select-button.selected {
	font-weight: 600;
}

/* галочка выбранного — check_rounded brandPurple (как листы приложения) */
body:has(.partners-page) .partners-field .select-button.selected::after {
	right: 16px;
	width: 18px;
	height: 18px;
	background: var(--brand-purple);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='m4 9 3.5 3.5L14 6' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='m4 9 3.5 3.5L14 6' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
}

body:has(.partners-page) .partners-field .no-results {
	font-size: 14px;
}

body:has(.partners-page) .popup-partners-filters .filters-control {
	position: static;
	margin: 0;
	padding: 6px 0 0; /* + gap 14 формы = 20 до кнопки, как в приложении */
	background: transparent;
}

body:has(.partners-page) .popup-partners-filters .apply-filters-button {
	width: 100%;
	height: 48px;
	padding: 0 12px;
	border-radius: 16px;
	background: var(--accent);
	font-size: 14px;
	font-weight: 700;
	line-height: 16px;
}

body:has(.partners-page) .popup-partners-filters .apply-filters-button:hover {
	background: var(--accent-alternate);
}

body:has(.partners-page) .popup-partners-filters .reset-filters-button {
	justify-content: center;
	margin-top: 12px;
	font-size: 14px;
	font-weight: 600;
	line-height: 16px;
	color: var(--brand-purple);
}

body:has(.partners-page) .popup-partners-filters .reset-filters-button:hover {
	color: var(--accent);
}

/* ==========================================================================
   ПК (≥769) — прежняя раскладка, новый стиль
   ========================================================================== */
@media (min-width: 769px) {
	body:has(.partners-page) {
		background: var(--light);
	}

	.partners-page {
		padding: 24px 0 60px;
	}

	.partners-page h1.title {
		margin: 0;
		text-align: left;
		font-size: 34px;
		font-weight: 700;
		line-height: 1.15;
		letter-spacing: -0.4px;
		color: var(--black);
	}

	/* --- панель: поиск, «Регион и город», «Стать партнёром» --- */
	.partners-page .pn-head {
		gap: 10px;
		margin: 20px 0 24px;
	}

	.partners-page .pn-search input {
		height: 48px;
		padding: 0 16px 0 46px;
		border-radius: 16px;
		font-size: 15px;
	}

	.partners-page .pn-search input:focus {
		border-color: var(--brand-purple);
		box-shadow: none;
	}

	.partners-page .pn-search > svg {
		left: 16px;
		width: 18px;
		height: 18px;
		color: var(--label-gray);
	}

	.partners-page .pn-fbtn {
		gap: 8px;
		height: 48px;
		padding: 0 18px;
		border: 0;
		border-radius: 16px;
		background: var(--white);
		font-size: 15px;
		font-weight: 500;
		color: var(--black);
	}

	.partners-page .pn-fbtn:hover,
	.partners-page .pn-fbtn.has-value {
		border-color: transparent;
		background: var(--white);
		color: var(--accent);
	}

	.partners-page .pn-become {
		height: 48px;
		padding: 0 22px;
		border-radius: 16px;
		background: var(--accent);
		font-size: 15px;
		font-weight: 700;
		color: var(--white);
	}

	.partners-page .pn-become:hover {
		filter: none;
		background: var(--accent-alternate);
		color: var(--white);
	}

	/* --- категория — белая карточка r24 --- */
	.partners-page .pn-cat {
		margin-bottom: 20px;
		padding: 24px;
		border-radius: 24px;
		background: var(--white);
	}

	.partners-page .pn-cat-head {
		align-items: center;
		gap: 10px;
		margin: 0 0 16px;
		padding: 0;
	}

	.partners-page .pn-cat-head h2 {
		font-size: 22px;
		font-weight: 700;
		line-height: 1.2;
		letter-spacing: -0.3px;
		color: var(--black);
	}

	.partners-page .pn-cat-count {
		background: var(--light);
	}

	/* --- магазин — плашка light r16 в «змейке» колонок --- */
	.partners-page .pn-grid {
		column-gap: 10px;
	}

	.partners-page .pn-card {
		gap: 12px;
		min-height: 64px;
		margin-bottom: 10px;
		padding: 10px 14px 10px 10px;
		border: 0;
		border-radius: 16px;
		background: var(--light);
	}

	.partners-page .pn-card:hover {
		background: var(--card-lilac);
		transform: none;
	}

	.partners-page .pn-logo {
		width: 44px;
		height: 44px;
		font-size: 14px;
	}

	.partners-page .pn-name {
		font-size: 14px;
		line-height: 18px;
	}

	.partners-page .pn-city {
		margin-top: 2px;
		font-size: 12px;
		line-height: 16px;
	}

	.partners-page .pn-arrow {
		width: 18px;
		height: 18px;
	}

	.partners-page .pn-card:hover .pn-arrow {
		color: var(--accent);
	}

	/* --- пусто — белая карточка --- */
	.partners-page .pn-empty {
		padding: 60px 20px;
		border: 0;
		border-radius: 24px;
		background: var(--white);
	}

	.partners-page .pn-empty h3 {
		font-size: 20px;
		font-weight: 600;
		color: var(--black);
	}

	.partners-page .pn-empty p {
		font-size: 15px;
		color: var(--gray);
	}

	.partners-page .pn-empty a {
		align-items: center;
		height: 48px;
		padding: 0 24px;
		border-radius: 16px;
		background: var(--accent);
		font-size: 14px;
		font-weight: 700;
		color: var(--white);
	}

	.partners-page .pn-empty a:hover {
		background: var(--accent-alternate);
		color: var(--white);
	}

	/* --- окно фильтров — по центру, r28 --- */
	body:has(.partners-page) .popup-partners-filters .popup-body {
		max-width: 480px;
		padding: 24px;
		border-radius: 28px;
	}

	body:has(.partners-page) .popup-partners-filters .popup-body-header {
		margin-bottom: 20px;
	}
}

/* ==========================================================================
   ТЕЛЕФОН (≤768) — partners_screen.dart приложения
   ========================================================================== */
@media (max-width: 768px) {
	/* светлый лист (и под нижним меню — у body там отступ) */
	body:has(.partners-page),
	main.content:has(.partners-page) {
		background: var(--light);
	}

	/* main.css даёт 15 сверху — шапка page-mhead должна стоять вплотную */
	.partners-page {
		padding-top: 0;
	}

	/* название — в фиолетовой шапке */
	.partners-page h1.title {
		display: none;
	}

	/* лист: список с отступом 24 сверху; поля по 20 задают сами строки
	   (строка магазина — на всю ширину листа, как в приложении) */
	.partners-page .page-msheet {
		padding: 24px 0 24px;
	}

	/* --- строка поиска: пилюля 42 + кнопка фильтра 42×42 --- */
	.partners-page .pn-head {
		flex-wrap: nowrap;
		gap: 8px;
		margin: 0 20px 10px;
	}

	.partners-page .pn-search {
		min-width: 0;
	}

	.partners-page .pn-search input {
		height: 42px;
		padding: 0 14px 0 40px; /* 14 + иконка 18 + 8 */
		border: 0;
		border-radius: 666px;
		font-size: 14px;
		line-height: 16px;
	}

	.partners-page .pn-search input:focus {
		box-shadow: none;
	}

	.partners-page .pn-search > svg {
		left: 14px;
		width: 18px;
		height: 18px;
		color: var(--black);
	}

	.partners-page .pn-fbtn {
		flex: 0 0 42px;
		justify-content: center;
		width: 42px;
		height: 42px;
		padding: 0;
		border: 0;
		border-radius: 14px;
		background: var(--white);
	}

	.partners-page .pn-fbtn:hover,
	.partners-page .pn-fbtn.has-value {
		background: var(--white);
	}

	.partners-page .pn-fbtn__text {
		display: none;
	}

	/* гостю «Стать партнером» — в шапке ВМЕСТО названия (titleWidget
	   GradientPageShell): белая пилюля 16×10, 13/700 violet. Ставим от
	   листа (.page-msheet — position: relative, redesign.css):
	   верх ряда шапки 12 + (40 − 36) / 2 = 14, лист начинается на
	   12 + 40 + 38 − 24 = 66 → −52; слева 20 + «назад» 40 + 11 = 71. */
	.partners-page .pn-become {
		position: absolute;
		top: -52px;
		left: 71px;
		max-width: calc(100% - 91px);
		height: 36px;
		padding: 0 16px;
		border-radius: 999px;
		background: var(--white);
		font-size: 13px;
		font-weight: 700;
		line-height: 16px;
		white-space: nowrap;
		color: var(--accent);
	}

	.partners-page .pn-become:hover {
		filter: none;
		color: var(--accent);
	}

	.partners-page:has(.pn-become) .page-mhead__title {
		display: none;
	}

	/* --- секция: название 18/600 + счётчик белым бейджем --- */
	.partners-page .pn-cat {
		margin: 0;
	}

	.partners-page .pn-cat-head {
		align-items: center;
		gap: 8px;
		margin: 0;
		padding: 14px 20px 4px;
	}

	.partners-page .pn-cat-head h2 {
		min-width: 0;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		font-size: 18px;
		font-weight: 600;
		line-height: 20px;
		letter-spacing: 0;
		color: var(--black);
	}

	.partners-page .pn-cat-count {
		background: var(--white);
	}

	/* --- магазины одной колонкой, строка без карточки: 20×10 --- */
	.partners-page .pn-grid {
		columns: auto;
	}

	.partners-page .pn-card {
		gap: 10px;
		min-height: 0;
		margin: 0;
		padding: 10px 20px;
		border: 0;
		border-radius: 0;
		background: transparent;
	}

	.partners-page .pn-card:hover {
		background: transparent;
		transform: none;
	}

	.partners-page .pn-logo {
		width: 48px;
		height: 48px;
		font-size: 15px;
	}

	.partners-page .pn-name {
		font-size: 14px;
		line-height: 16px;
	}

	.partners-page .pn-city {
		margin-top: 4px;
		font-size: 11px;
		line-height: 16px;
	}

	/* chevron_right 22; до него 8 (у ряда gap 10) */
	.partners-page .pn-arrow {
		width: 22px;
		height: 22px;
		margin-left: -2px;
	}

	.partners-page .pn-card:hover .pn-arrow {
		color: rgb(22 14 24 / 30%); /* black 30 % */
		transform: none;
	}

	/* --- пусто: «Ничего не найдено» 16/500 black 40 %, сверху 60 --- */
	.partners-page .pn-empty {
		padding: 60px 20px 0;
		border: 0;
		border-radius: 0;
		background: none;
	}

	.partners-page .pn-empty h3 {
		margin: 0;
		font-size: 16px;
		font-weight: 500;
		line-height: 1.4;
		color: rgb(22 14 24 / 40%); /* black 40 % */
	}

	.partners-page .pn-empty p {
		display: none;
	}

	/* сброс (фильтров / поиска) — тихой ссылкой, как «Сбросить» листа */
	.partners-page .pn-empty a {
		margin-top: 12px;
		padding: 0;
		border-radius: 0;
		background: none;
		font-size: 14px;
		font-weight: 600;
		line-height: 16px;
		color: var(--brand-purple);
	}

	/* --- окно фильтров — лист снизу light r32 (гео-шит приложения) --- */
	body:has(.partners-page) .popup-partners-filters {
		align-items: end;
		padding: 0;
		overflow: hidden;
	}

	body:has(.partners-page) .popup-partners-filters .popup-body {
		display: flex;
		flex-direction: column;
		max-width: 100%;
		max-height: calc(100vh - 50px);
		max-height: calc(100dvh - 50px);
		padding: 0;
		border-radius: 32px 32px 0 0;
		transform-origin: center bottom;
		transform: translateY(101%);
	}

	body:has(.partners-page) .popup-partners-filters.active .popup-body {
		transform: translateY(0);
	}

	/* заголовок 20/600 на 20 от верха листа (крестик 36 — ряд 14…50) */
	body:has(.partners-page) .popup-partners-filters .popup-body-header {
		flex-shrink: 0;
		margin: 0;
		padding: 14px 14px 0 20px;
	}

	/* 16 под заголовком; overflow видимый — списки открываются вверх
	   поверх затемнения (снизу их закрыла бы клавиатура телефона) */
	body:has(.partners-page) .popup-partners-filters .popup-body-content {
		flex: 0 1 auto;
		min-height: 0;
		height: auto;
		max-height: none;
		overflow: visible;
		padding: 10px 20px 0;
	}

	/* строки без подписей, зазор 10 (как в приложении) */
	body:has(.partners-page) .partners-filter {
		gap: 10px;
	}

	body:has(.partners-page) .partners-field label {
		display: none;
	}

	body:has(.partners-page) .partners-field .select-popup {
		top: auto;
		bottom: calc(100% + 6px);
		max-height: min(280px, 45vh);
		transform-origin: center bottom;
	}

	body:has(.partners-page) .popup-partners-filters .filters-control {
		padding: 10px 0 max(20px, env(safe-area-inset-bottom));
	}
}

/* низкий экран (телефон боком): лист прокручивается, списки — вниз */
@media (max-width: 768px) and (max-height: 520px) {
	body:has(.partners-page) .popup-partners-filters .popup-body-content {
		overflow-y: auto;
	}

	body:has(.partners-page) .partners-field .select-popup {
		top: calc(100% + 6px);
		bottom: auto;
		transform-origin: center top;
	}
}

/* Телефон: заголовок категории остаётся до конца своего списка партнёров. */
@media (max-width: 768px) {
	.partners-page .pn-cat-head {
		position: sticky;
		top: env(safe-area-inset-top, 0px);
		z-index: 5;
		background: var(--light);
	}
}