/* Herbawell — strona /ulubione/.
 * Siatka kart dziedziczy z .hw-listing__grid (listing.css) — tu tylko chrome strony
 * (okruszki, nagłówek, stan pusty). Mobile 2 kolumny = jak listing (już w listing.css).
 */

.hw-favs {
	max-width: 1440px;
	margin: 0 auto;
	padding: 40px 40px 96px;
}

.hw-favs__crumbs {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	color: var(--hw-text-soft);
	margin-bottom: 26px;
}
.hw-favs__crumbs a { color: var(--hw-text-soft); text-decoration: none; }
.hw-favs__crumbs a:hover { color: var(--hw-green); }
.hw-favs__crumb-sep { color: rgba(16, 38, 28, .32); }
.hw-favs__crumb-current { color: var(--hw-green); }

.hw-favs__head {
	max-width: 620px;
	margin-bottom: 34px;
}
.hw-favs__title {
	margin: 0 0 12px;
	font-family: 'Jost', system-ui, sans-serif;
	font-weight: 500;
	font-size: 42px;
	line-height: 1.08;
	color: var(--hw-green);
}
.hw-favs__lead {
	margin: 0;
	font-size: 16px;
	line-height: 1.7;
	color: var(--hw-text-soft);
}

/* Grid — dziedziczy z .hw-listing__grid; tu tylko usunięcie ewentualnego wewnętrznego paddingu. */
.hw-favs__grid.hw-listing__grid {
	padding: 0;
	border: 0;
}

/* Stan pusty (i błąd) — jedna kolumna wyśrodkowana. */
/* 🔑 [hidden] MUSI bić display:flex (gotcha projektu: klasa z display nadpisuje atrybut hidden —
   stan pusty renderował się OBOK kart). */
.hw-favs__empty[hidden],
.hw-favs__error[hidden] { display: none; }
.hw-favs__empty,
.hw-favs__error {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 14px;
	padding: 72px 24px;
	border: 1px solid rgba(16, 38, 28, .12);
}
.hw-favs__empty-icon { color: var(--hw-brass); }
.hw-favs__empty-title {
	font-family: 'Jost', system-ui, sans-serif;
	font-weight: 500;
	font-size: 24px;
	color: var(--hw-green);
}
.hw-favs__empty-text {
	margin: 0;
	max-width: 420px;
	font-size: 15px;
	line-height: 1.7;
	color: var(--hw-text-soft);
}
.hw-favs__empty-cta { margin-top: 8px; }

/* „Dodaj wszystko do koszyka" — pod siatką, wyrównane do prawej na desktopie. */
.hw-favs__actions[hidden] { display: none; }
.hw-favs__actions {
	display: flex;
	justify-content: flex-end;
	margin-top: 32px;
}
.hw-favs__addall:disabled { opacity: .6; cursor: default; }

@media (max-width: 860px) {
	.hw-favs { padding: 26px 20px 72px; }
	.hw-favs__title { font-size: 32px; }
	.hw-favs__empty,
	.hw-favs__error { padding: 56px 20px; }
	/* Przycisk na pełną szerokość na mobile. */
	.hw-favs__actions { margin-top: 24px; }
	.hw-favs__addall { width: 100%; }
}
