/* Магазин / категория / търсене - един шаблон (predlozhenie/kategoriya.html 19-37; bmg.css 257-277, 563-567).
   page-head, трохите, чиповете и пагинацията са в base.css; картата и мрежата - в karta.css. */

/* ---------- мрежата на страницата (258) ---------- */
.bmgf-shop {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 32px;
	padding-block: 32px 72px;
	align-items: start;
}

/* ---------- филтрите (259-267) ---------- */
.bmgf-filtri {
	position: sticky;
	top: 150px;
	align-content: start;
}

/* по-високи от екрана минус 150px (main.js, Task 49) - не се залепят, последните филтри се стигат със скрол */
.bmgf-filtri[data-bmgf-tall] {
	position: static;
}

.bmgf-filtri__form {
	display: grid;
	gap: 22px;
	align-content: start;
}

.bmgf-fgroup {
	display: grid;
	gap: 10px;
	padding: 0 0 20px;
	margin: 0;
	border: 0;
	border-bottom: 1px solid var(--bmgf-line);
	min-width: 0;
}

/* Последната група без линия (kategoriya.html 30: style="border:0"). */
.bmgf-filtri__form > .bmgf-fgroup:last-of-type {
	border-bottom: 0;
}

/* legend стои извън grid-а на fieldset-а - отстоянието под него е margin, не gap */
.bmgf-fgroup legend,
.bmgf-fgroup h3 {
	padding: 0;
	margin: 0;
	font-family: var(--bmgf-f-body);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--bmgf-ink);
}

.bmgf-fgroup legend {
	margin-bottom: 10px;
}

.bmgf-fcheck {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14.5px;
	cursor: pointer;
}

.bmgf-fcheck input {
	width: 18px;
	height: 18px;
	margin: 0;
	flex: none;
	accent-color: var(--bmgf-navy);
}

.bmgf-fcheck span {
	margin-left: auto;
	color: var(--bmgf-muted);
	font-size: 13px;
}

.bmgf-range {
	display: grid;
	gap: 8px;
}

.bmgf-range input[type="range"] {
	width: 100%;
	margin: 0;
	accent-color: var(--bmgf-navy);
}

.bmgf-range__vals {
	display: flex;
	justify-content: space-between;
	font-size: 13.5px;
	font-weight: 700;
	color: var(--bmgf-navy);
}

.bmgf-filtri__form > .bmgf-link {
	justify-self: start;
}

/* ---------- лентата над мрежата (271-273) ---------- */
.bmgf-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 20px;
	font-size: 14.5px;
	color: var(--bmgf-muted);
}

.bmgf-toolbar .woocommerce-result-count,
.woocommerce .bmgf-toolbar .woocommerce-result-count {
	margin: 0;
	float: none;
}

.bmgf-toolbar .woocommerce-ordering,
.woocommerce .bmgf-toolbar .woocommerce-ordering {
	margin: 0 0 0 auto;
	float: none;
}

.bmgf-toolbar .woocommerce-ordering select {
	font: inherit;
	font-weight: 700;
	color: var(--bmgf-ink);
	border: 1.5px solid #CCD5E6;
	border-radius: var(--bmgf-r-pill);
	padding: 8px 14px;
	background-color: #fff;
}

.bmgf-mfilter {
	display: none;
}

.bmgf-toolbar .bmgf-mfilter .bmgf-ico {
	width: 18px;
	height: 18px;
}

/* ---------- „Покажи още" + страницирането (274-277; кръглите числа - base.css) ---------- */
.bmgf-more {
	display: grid;
	justify-items: center;
	gap: 10px;
	margin-top: 34px;
	color: var(--bmgf-muted);
	font-size: 14px;
}

.bmgf-more .woocommerce-pagination {
	margin: 0;
}

.bmgf-more__btn.is-loading {
	opacity: .6;
	pointer-events: none;
}

/* Празен резултат: съобщението на Woo + „Изчисти филтрите" (PLAN.md D.2 „Състояния"). */
.bmgf-shop__reset {
	margin-top: 14px;
}

/* ---------- снимката на категорията до заглавието (Task 59; както на сегашния сайт) ---------- */
.bmgf-page-head__row {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 24px;
	align-items: center;
}

.bmgf-page-head__img {
	width: 140px;
}

.bmgf-page-head__txt {
	display: grid;
	gap: 12px;
}

/* ======================== ТЕЛЕФОН (563-567) ======================== */
@media (max-width: 767px) {
	.bmgf-page-head__row {
		gap: 16px;
	}

	.bmgf-page-head__img {
		width: 72px;
	}

	.bmgf-shop {
		grid-template-columns: minmax(0, 1fr);
		padding-block: 16px 48px;
		gap: 0;
	}

	.bmgf-filtri {
		display: none;
	}

	.bmgf-filtri.bmgf-filtri--open {
		display: grid;
		position: static;
		background: var(--bmgf-mist);
		border-radius: 16px;
		padding: 16px;
		margin-bottom: 16px;
	}

	.bmgf-mfilter {
		display: inline-flex;
	}

	.bmgf-toolbar {
		font-size: 13px;
	}
}