/* Секция «Additional Boxes Available This Week» (блок diegenusspartner/week-boxes).
   Дизайн: Figma 2351:3173. Заголовок 48/700 с зелёной второй строкой, подводка 18/500,
   пилюля недели 24 с обводкой, ряд карточек `.gp-pcard` витрины, одна кнопка. Ширины в px. */

.gp-weekbox {
	padding: var(--wp--preset--spacing--r-64) 0;
	background: var(--wp--preset--color--surface);
}
.gp-weekbox__inner {
	/* Ряд карточек по макету 1312 (три по 427 + зазоры 16): контейнер темы давал
	   1344 минус gutter, и карточки выходили уже. Gutter входит дважды. */
	max-width: calc(1312px + 2 * var(--wp--custom--layout--gutter));
	margin: 0 auto;
	padding: 0 var(--wp--custom--layout--gutter);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--wp--preset--spacing--r-32);
	text-align: center;
}

.gp-weekbox__head {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--r-16);
	width: 100%;
}
.gp-weekbox__title {
	margin: 0;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--r-48);
	font-weight: 700;
	line-height: 1.1;
	color: var(--wp--preset--color--contrast);
	/* В макете заголовок стоит в две строки и ломается ровно перед акцентным
	   словом: ширина текстового блока 681 из 1314. Без ограничения он выстроился
	   бы в одну строку на 1248 и разошёлся бы с макетом. */
	/* Перенос задаёт `<br>` в разметке (как в макете), поэтому ширину не режем:
	   при max-width 681 первая строка ломалась ещё раз и получалось три строки. */
	max-width: 100%;
	align-self: center;
	text-wrap: normal;
}
.gp-weekbox__accent { color: var(--wp--preset--color--primary); }

.gp-weekbox__subtitle {
	margin: 0 auto;
	max-width: 831px;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--r-18);
	font-weight: 500;
	line-height: 1.5;
	color: var(--wp--preset--color--muted);
}

/* — Пилюля календарной недели — */
.gp-weekbox__week {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: var(--wp--preset--spacing--r-16) var(--wp--preset--spacing--r-24);
	/* Макет 2358:4514: рамка leaf #b5d77c и мягкая тень 0 8 14.55 (4 %). */
	border: 1px solid var(--wp--preset--color--leaf);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--base);
	box-shadow: 0 8px 15px rgba(24, 64, 0, 0.04);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--r-24);
	line-height: 1.1;
}
.gp-weekbox__week-label {
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}
.gp-weekbox__week-value {
	font-weight: 700;
	color: var(--wp--preset--color--primary);
	white-space: nowrap; /* «38 (2026)» не рвётся на две строки (320) */
}

/* — Ряд карточек (карточка `.gp-pcard` общая с витриной) — */
.gp-weekbox__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--wp--preset--spacing--r-16);
	width: 100%;
	text-align: left;
}

/* Подпись под ценой «pro Kiste / pro Lieferung» — макет 12/500, muted.
   В витрине её нет: там карточка выводит одну только цену. */
.gp-weekbox .gp-pcard__pricebox {
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.gp-weekbox .gp-pcard__price-note {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--r-12);
	font-weight: 500;
	line-height: 1.5;
	color: var(--wp--preset--color--muted);
	white-space: nowrap;
}

/* Отступы карточки по кадру 2351:3264: название → описание 16, до пилюли веса 32 (от названия
   или от описания), от веса до цены 32. Зазоры колонки витрины — 8 внутри текста и 24 до
   цены; добираем полями у описания и у веса, чтобы 32 до веса было и без описания (QA 992). */
.gp-weekbox .gp-pcard__body {
	gap: var(--wp--preset--spacing--r-32);
}
.gp-weekbox .gp-pcard__desc {
	margin-top: var(--wp--preset--spacing--r-8);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--r-20);
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: 0.01em;
	color: var(--wp--preset--color--muted);
}

/* Бейдж веса: в макете это пилюля на светло-зелёной плашке, а не голый текст.
   Правим только в этой секции — витрину и её макет не трогаем. */
.gp-weekbox .gp-pcard__weight {
	align-self: flex-start;
	margin-top: var(--wp--preset--spacing--r-24);
	padding: 5px var(--wp--preset--spacing--r-12);
	border-radius: var(--wp--custom--radius--pill);
	background: color-mix(in srgb, var(--wp--preset--color--primary) 8%, transparent); /* макет: rgba(49,129,0,.08) */
	font-size: var(--wp--preset--font-size--r-20);
	font-weight: 600;
	color: var(--wp--preset--color--muted);
}

/* Иконка мешочка в макете 32×32, в витрине — 24. */
.gp-weekbox .gp-pcard__add::before {
	width: 32px;
	height: 32px;
}

/* — Одна кнопка под секцией «Alle Produkte» (решение 14.09; в макете 242×56) — */
.gp-weekbox__actions {
	display: flex;
	justify-content: center;
	gap: var(--wp--preset--spacing--r-16);
	margin-top: var(--wp--preset--spacing--r-48);
	padding: 0 var(--wp--custom--layout--gutter);
	flex-wrap: wrap;
}
.gp-weekbox__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 242px;
	min-height: 56px;
	padding: var(--wp--preset--spacing--r-16) var(--wp--preset--spacing--r-24);
	border-radius: var(--wp--custom--radius--pill);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--r-14);
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease;
	border: 1px solid var(--wp--preset--color--primary);
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}
.gp-weekbox__btn:hover { background: var(--wp--preset--color--contrast); border-color: var(--wp--preset--color--contrast); }

/* — Планшет и телефон: макетов нет, верстаем сами — */
@media (max-width: 1024px) {
	.gp-weekbox { padding: var(--wp--preset--spacing--r-48) 0; }
	.gp-weekbox__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	.gp-weekbox__title { font-size: var(--wp--preset--font-size--r-32); }
	.gp-weekbox__subtitle { font-size: var(--wp--preset--font-size--r-16); }
	/* В шкале интервалов нет r-20 — с ним ломается вся сокращённая запись padding
	   и пилюля схлопывается в полоску. Только существующие ступени. */
	.gp-weekbox__week {
		font-size: var(--wp--preset--font-size--r-20);
		padding: var(--wp--preset--spacing--r-12) var(--wp--preset--spacing--r-16);
	}
	.gp-weekbox__grid { grid-template-columns: minmax(0, 1fr); }
	.gp-weekbox__actions { flex-direction: column; align-items: stretch; }
	.gp-weekbox__btn { min-width: 0; }
}
/* Уже 390 пилюля «Kalenderwoche: 38 (2026)» в 20 шире окна 320 — кегль 16. */
@media (max-width: 389.98px) {
	.gp-weekbox__week { font-size: var(--wp--preset--font-size--r-16); }
}