/* ============================================================
 * CRC — Filtru categorii pe nivele + grilă produse (AJAX)
 * Design aliniat cu mega-menu (teal + Montserrat/Work Sans).
 * ========================================================== */

.crc-fc {
	--fc-teal-100: #c5ebec;
	--fc-teal-400: #2bb6b9;
	--fc-teal-500: #12abb0;
	--fc-teal-700: #0d8b8f;
	--fc-teal-800: #097376;
	--fc-grad:     linear-gradient(180deg, #12abb0 0%, #097376 100%);
	--fc-ink:      #0e0e10;
	--fc-fg-2:     #4a4a4f;
	--fc-fg-3:     #8b8b90;
	--fc-line:     #e6e6ea;
	--fc-surface:  #f5f5f7;
	--fc-white:    #ffffff;
	--fc-font-display: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
	--fc-font-ui: "Work Sans", "Montserrat", system-ui, sans-serif;
	--fc-cols: 4;

	font-family: var(--fc-font-ui);
	color: var(--fc-ink);
	max-width: 100%;
}

/* ---------- Bara de filtrare ---------- */
.crc-fc-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 20px;
}
.crc-fc-bar {
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex: 1 1 auto;
	min-width: 0;
}

.crc-fc-level {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}
.crc-fc-level.is-hidden { display: none; }

.crc-fc-pill {
	appearance: none;
	border: 0;
	background: transparent;
	font-family: inherit;
	cursor: pointer;
	color: var(--fc-ink);
	transition: background .15s ease, color .15s ease, box-shadow .15s ease, border-color .15s ease;
	line-height: 1.2;
	white-space: nowrap;
}
.crc-fc-pill:focus-visible {
	outline: 2px solid var(--fc-teal-500);
	outline-offset: 2px;
}

/* Nivel 0 — pastile mari cu iconiță, gri deschis; active = teal plin */
.crc-fc-level--0 { gap: 12px; }
.crc-fc-level--0 .crc-fc-pill {
	display: inline-flex;
	align-items: center;
	gap: 11px;
	font-family: var(--fc-font-display);
	font-weight: 600;
	font-size: 16px;
	padding: 14px 28px;
	border-radius: 999px;
	border: 0;
	background: var(--fc-surface);
	color: var(--fc-ink);
}
.crc-fc-level--0 .crc-fc-pill:hover {
	background: #ececef;
	color: var(--fc-teal-800);
}
.crc-fc-level--0 .crc-fc-pill[aria-selected="true"] {
	background: var(--fc-teal-500);
	color: var(--fc-white);
	box-shadow: 0 8px 20px -10px rgba(9,115,118,.55);
}

/* Iconița din pastila L0 (imagine ACF sau SVG line-art din setul mega-menu) */
.crc-fc-pill__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	flex: 0 0 auto;
}
.crc-fc-pill__icon:empty { display: none; }
.crc-fc-pill__icon svg {
	width: 100%;
	height: 100%;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.crc-fc-pill__icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* Nivel 1 — tab-uri text mari, active = teal */
.crc-fc-level--1 {
	gap: 8px 30px;
	padding: 2px 4px;
}
.crc-fc-level--1 .crc-fc-pill {
	font-family: var(--fc-font-display);
	font-weight: 600;
	font-size: 17px;
	padding: 6px 2px;
	color: var(--fc-ink);
	border-radius: 0;
}
.crc-fc-level--1 .crc-fc-pill:hover { color: var(--fc-teal-800); }
.crc-fc-level--1 .crc-fc-pill[aria-selected="true"] {
	color: var(--fc-teal-500);
	font-weight: 700;
}

/* Nivel 2+ — text mare pe fundal gri (container rotunjit) */
.crc-fc-level--2,
.crc-fc-level--3,
.crc-fc-level--4,
.crc-fc-level--5 {
	background: var(--fc-surface);
	border-radius: 18px;
	padding: 14px 24px;
	gap: 10px 34px;
}
.crc-fc-level--2 .crc-fc-pill,
.crc-fc-level--3 .crc-fc-pill,
.crc-fc-level--4 .crc-fc-pill,
.crc-fc-level--5 .crc-fc-pill {
	font-family: var(--fc-font-display);
	font-size: 16px;
	font-weight: 600;
	padding: 4px 2px;
	color: var(--fc-ink);
}
.crc-fc-level--2 .crc-fc-pill:hover,
.crc-fc-level--3 .crc-fc-pill:hover,
.crc-fc-level--4 .crc-fc-pill:hover,
.crc-fc-level--5 .crc-fc-pill:hover { color: var(--fc-teal-800); }
.crc-fc-level--2 .crc-fc-pill[aria-selected="true"],
.crc-fc-level--3 .crc-fc-pill[aria-selected="true"],
.crc-fc-level--4 .crc-fc-pill[aria-selected="true"],
.crc-fc-level--5 .crc-fc-pill[aria-selected="true"] {
	color: var(--fc-teal-500);
	font-weight: 700;
}

/* ---------- Buton „Toate produsele" (sus-dreapta) ---------- */
.crc-fc-reset {
	flex: 0 0 auto;
	align-self: flex-start;
	appearance: none;
	white-space: nowrap;
	font-family: var(--fc-font-display);
	font-weight: 600;
	font-size: 14px;
	color: var(--fc-teal-800);
	background: var(--fc-surface);
	border: 1.5px solid var(--fc-line);
	border-radius: 999px;
	padding: 12px 22px;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.crc-fc-reset:hover {
	background: var(--fc-teal-500);
	color: var(--fc-white);
	border-color: transparent;
}
.crc-fc-reset[hidden] { display: none; }

/* ---------- Loop-ul Breakdance în timpul filtrării ---------- */
.crc-fc-loop-loading {
	opacity: .4;
	pointer-events: none;
	transition: opacity .18s ease;
}
.crc-fc-empty {
	text-align: center;
	color: var(--fc-fg-3);
	padding: 48px 0;
	font-size: 16px;
	font-family: var(--fc-font-ui);
}

/* ---------- Responsive (bara) ---------- */
@media (max-width: 782px) {
	.crc-fc-head { flex-direction: column; align-items: stretch; }
	.crc-fc-reset { align-self: flex-start; order: -1; }
	.crc-fc-level { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
	.crc-fc-level::-webkit-scrollbar { display: none; }
	.crc-fc-level--2, .crc-fc-level--3, .crc-fc-level--4, .crc-fc-level--5 { flex-wrap: nowrap; }
}
@media (max-width: 480px) {
	.crc-fc-level--0 .crc-fc-pill { font-size: 14px; padding: 9px 16px; }
}