/* =============================================================================
   Pomelo — Co najdete v menu CZ (karuzela) — prefiks pmnu- (jak w wersji PL;
   wtyczki PL i CZ nie występują na tej samej stronie). Fork 1:1 wersji PL.
   Figma PROMOCJE CZ: desktop 4337-4961, mobile 4360-4558.
   ============================================================================= */

.pmnu {
	--pmnu-ink-900: var(--pom-neutral-900, #1f1f1f);
	--pmnu-ink-800: var(--pom-neutral-800, #333333);
	--pmnu-ink-700: var(--pom-neutral-700, #595959);
	--pmnu-olive:   var(--pom-primary-600, #b3b33f);
	--pmnu-badge-bg:   #bfe8ff;
	--pmnu-badge-text: #1f5d8a;
	--pmnu-img-bg:  #f7f6f5;
	--pmnu-card-w:  256px;   /* szerokość projektowa (Figma) — realna wynika z --pmnu-visible */
	--pmnu-visible: 4;       /* liczba kart w kontenerze na desktop */
	--pmnu-gap:     18px;

	display: block;
	background: #fff;
	padding: 60px 0;
	font-family: 'Montserrat', sans-serif;
}

/* --- Nagłówek + intro -------------------------------------------------------- */
.pmnu__heading {
	margin: 0 auto;
	max-width: 1368px;
	padding: 0 16px;
	font-family: 'Rubik', sans-serif;
	font-weight: 700;
	font-size: 40px;
	line-height: 1.2;
	text-transform: uppercase;
	text-align: center;
	color: var(--pmnu-ink-900);
}
.pmnu__intro {
	margin: 24px auto 0;
	max-width: 1090px;
	padding: 0 16px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 20px;
	line-height: 1.5;
	text-align: center;
	color: var(--pmnu-ink-800);
}

/* --- Karuzela ----------------------------------------------------------------- */
.pmnu__viewport {
	max-width: calc(4 * var(--pmnu-card-w) + 3 * var(--pmnu-gap)); /* 1078px — 4 karty jak w Figmie */
	margin: 40px auto 0;
}
.pmnu__track {
	display: flex;
	gap: var(--pmnu-gap);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	/* miejsce na cień kart (3px 3px 4px), żeby nie ucinało go overflow */
	padding: 4px 4px 8px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}
.pmnu__track::-webkit-scrollbar { display: none; }

/* --- Karta dania --------------------------------------------------------------- */
/* Jak we wtyczce menu PL (.cmpl-dish): szerokość = dokładnie tyle, by w kontenerze
   zmieściło się --pmnu-visible kart bez ucinania — pasek jest wyśrodkowany,
   nic nie wystaje poza krawędź. Przy pełnych 1078px karta wychodzi 256px (Figma). */
.pmnu-card {
	flex: 0 0 calc((100% - (var(--pmnu-visible, 4) - 1) * var(--pmnu-gap)) / var(--pmnu-visible, 4));
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
}

/* Wiersze oceny i plakietki mają stałą wysokość także gdy puste —
   ramki kart w rzędzie zawsze zaczynają się na tej samej wysokości. */
.pmnu-card__rating {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	height: 14px;
}
.pmnu-stars { display: block; width: 71.88px; height: 11px; }
.pmnu-card__rating-num {
	font-family: 'Instrument Sans', 'Montserrat', sans-serif;
	font-size: 14px;
	line-height: 1;
	color: var(--pmnu-ink-700);
	white-space: nowrap;
}
.pmnu-card__badges {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 23px;
}
.pmnu-card__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 4px 10px;
	border-radius: 20px;
	background: var(--pmnu-badge-bg);
	font-family: 'Rubik', sans-serif;
	font-weight: 400;
	font-size: 12px;
	line-height: 1.2;
	color: var(--pmnu-badge-text);
	white-space: nowrap;
}

/* Ramka karty */
.pmnu-card__box {
	width: calc(100% - 4px); /* 252px przy karcie 256px (Figma) — skaluje się z kartą */
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 11px;
	padding-bottom: 21px;
	background: #fff;
	border: 1.8px solid var(--pmnu-olive);
	border-radius: 25px;
	overflow: hidden;
}
/* Zdjęcie 1:1 jak we wtyczce menu PL (.cmpl-dish__top/__img): stały obszar,
   posiłek w całości (contain), wyśrodkowany — nigdy nie kadrowany. */
.pmnu-card__media {
	width: 100%;
	height: 200px;
	padding: 18px 12px 8px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
}
/* Mocna reguła + !important, by pobić ewentualne img{height:auto/max-*} motywu. */
.pmnu .pmnu-card .pmnu-card__img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 174px !important;
	object-fit: contain !important;
	object-position: center;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
.pmnu-card__label {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 79px; /* 90.59 z Figmy minus gap 11 */
	padding: 0 11px;
	width: 100%;
}
.pmnu-card__name {
	margin: 0;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.4;
	text-align: center;
	color: var(--pmnu-ink-800);
}

/* --- Strzałki ------------------------------------------------------------------ */
.pmnu__navs {
	display: flex;
	justify-content: center;
	gap: 24px;
	margin-top: 24px;
}
/* !important na tle/kolorze — motyw pomelo dorzuca czerwone tło na hover buttonów */
.pmnu__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 12px;
	background: #fff !important;
	color: var(--pmnu-ink-700) !important;
	box-shadow: none;
	cursor: pointer;
	transition: transform .15s ease;
}
.pmnu__nav:hover,
.pmnu__nav:focus { background: #fff !important; color: var(--pmnu-ink-700) !important; }
.pmnu__nav:hover { transform: scale(1.08); }
.pmnu__nav[disabled] { opacity: .35; cursor: default; }
.pmnu__nav[disabled]:hover { transform: none; }
.pmnu-chevron { display: block; }
.pmnu__nav-flip { display: flex; transform: rotate(180deg); }

/* --- Responsywność --------------------------------------------------------------- */
@media (max-width: 1024px) {
	.pmnu { --pmnu-visible: 3; }
}

/* Mobile (breakpoint Elementora 767px): 1 karta + podgląd następnej, jak w menu PL */
@media (max-width: 767px) {
	.pmnu { padding: 40px 0; }
	.pmnu__heading { font-size: 28px; }
	.pmnu__intro { margin-top: 16px; }
	.pmnu__viewport { margin-top: 32px; }
	.pmnu__track {
		padding-left: 16px;
		padding-right: 16px;
		scroll-padding-left: 16px;
	}
	.pmnu-card { flex: 0 0 min(80vw, 320px); }   /* ignoruje --pmnu-visible na mobile */
}
