/**
 * VendoRezerwacje — Style frontendu
 * Dopasowane do AQUA SUITE
 * Akcent: #ef9fb0 | Nagłówki: Playfair Display | Tekst: Montserrat
 */

/* ─── Tokeny ──────────────────────────────────────────────────────────────── */
:root {
	/* AQUA SUITE — paleta wg strony głównej (róż → koral, akcent złoto + turkus) */
	--vp-pink:         #ef9fb0;
	--vp-pink-hover:   #e98a9e;
	--vp-pink-light:   #fdf1f3;
	--vp-pink-border:  rgba(239,159,176,.24);
	--vp-pink-border2: rgba(239,159,176,.48);
	--vp-pink-shadow:  rgba(239,159,176,.20);
	--vp-coral:        #f4a081;
	--vp-coral-hover:  #ef8f6c;
	--vp-gold:         #e9c069;
	--vp-teal:         #56c6c1;
	--vp-teal-hover:   #41b4af;
	--vp-teal-light:   #ddf3f0;
	/* Gradienty marki */
	--vp-grad:         linear-gradient(95deg, #ef9fb0 0%, #f4a081 100%);
	--vp-grad-hover:   linear-gradient(95deg, #e98a9e 0%, #ef8f6c 100%);
	--vp-grad-border:  linear-gradient(92deg, #f0a0bd 0%, #ebc878 100%);
	--vp-text:         #1a1a1a;
	--vp-muted:        #7a7a7a;
	--vp-light:        #b0b0b0;
	--vp-success:      #16a34a;
	--vp-success-bg:   #dcfce7;
	--vp-danger:       #dc2626;
	--vp-white:        #ffffff;
	--vp-radius:       16px;
	--vp-radius-sm:    8px;
	--vp-pill:         50px;
	--vp-shadow:       0 8px 32px rgba(239,159,176,.20);
	--vp-shadow-sm:    0 4px 18px rgba(239,159,176,.16);
	--vp-font-h:       "Playfair Display", serif;
	--vp-font-b:       "Montserrat", sans-serif;
	--vp-font-num:     "Bodoni Moda SC", "Playfair Display", serif; /* cyfry */
	/* aliases dla backward compat */
	--vendo-pub-primary:       #ef9fb0;
	--vendo-pub-primary-hover: #e98a9e;
	--vendo-pub-primary-light: #fdf1f3;
	--vendo-pub-success:       #16a34a;
	--vendo-pub-danger:        #dc2626;
	--vendo-pub-text:          #1a1a1a;
	--vendo-pub-text-muted:    #7a7a7a;
	--vendo-pub-border:        rgba(239,159,176,.24);
	--vendo-pub-bg:            #fdf1f3;
	--vendo-pub-white:         #ffffff;
	--vendo-pub-radius:        16px;
	--vendo-pub-radius-sm:     8px;
	--vendo-pub-shadow:        0 4px 18px rgba(239,159,176,.16);
	--vendo-pub-shadow-md:     0 8px 32px rgba(239,159,176,.20);
}

/* ─── Kontener ────────────────────────────────────────────────────────────── */
.vendo-booking-widget {
	font-family: var(--vp-font-b);
	color: var(--vp-text);
	line-height: 1.6;
	box-sizing: border-box;
	max-width: 100%;
	-webkit-font-smoothing: antialiased;
}
.vendo-booking-widget *,
.vendo-booking-widget *::before,
.vendo-booking-widget *::after {
	box-sizing: inherit;
}

/* Reset inputów wewnątrz widżetu — nadpisuje WordPress, WooCommerce i Elementor */
.vendo-booking-widget input[type="number"],
.vendo-booking-widget input[type="text"] {
	-webkit-appearance: none !important;
	-moz-appearance: textfield !important;
	appearance: none !important;
	background-image: none !important;
	box-shadow: none !important;
	outline: none !important;
	margin: 0 !important;
}

/* ─── Pasek kroków ─────────────────────────────────────────────────────────── */
.vendo-steps {
	display: flex;
	gap: 0;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--vp-pink-border);
}
.vendo-step-item {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 10px 14px;
	font-size: 12px;
	font-family: var(--vp-font-b);
	font-weight: 500;
	letter-spacing: .5px;
	color: #d9a7ac;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	white-space: nowrap;
	cursor: default;
	transition: color .2s, border-color .2s;
}
.vendo-step-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	box-sizing: border-box;
	border: 1px solid var(--vp-pink-border2);
	border-radius: 50%;
	background: var(--vp-pink-light);
	color: var(--vp-pink-hover);
	font-size: 10px;
	font-weight: 700;
	font-family: var(--vp-font-b);
	line-height: 1;
	letter-spacing: 0;
	text-align: center;
	flex-shrink: 0;
	transition: background .2s, color .2s;
}
.vendo-step-item.is-active {
	color: var(--vp-pink-hover);
	font-weight: 700;
	border-bottom-color: var(--vp-pink-hover);
}
.vendo-step-item.is-active .vendo-step-num {
	background: var(--vp-pink-hover);
	border-color: var(--vp-pink-hover);
	color: #fff;
}
.vendo-step-item.is-done .vendo-step-num {
	background: var(--vp-pink);
	border-color: var(--vp-pink);
	color: #fff;
	font-size: 0;
}
/* znak „✓" na zaliczonych krokach usunięty — sam kolor kółka wystarczy */
.vendo-step-item.is-done .vendo-step-label {
	display: none;
}
.vendo-step-item.is-done {
	cursor: pointer;
}
.vendo-step-item.is-done:hover {
	color: var(--vp-pink);
}
.vendo-step-item.is-done:hover .vendo-step-num {
	background: var(--vp-pink-hover);
	border-color: var(--vp-pink-hover);
}
@media (max-width: 420px) {
	.vendo-step-label { display: none; }
	.vendo-step-item  { padding: 10px 8px; }
}

/* ─── Panel ────────────────────────────────────────────────────────────────── */
.vendo-panel {
	background: var(--vp-white);
	border: 0.5px solid var(--vp-pink);
	border-radius: var(--vp-radius);
	padding: 24px;
	box-shadow: var(--vp-shadow);
}
.vendo-panel__loading {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--vp-text);
	padding: 20px 0;
	justify-content: center;
	font-family: var(--vp-font-b);
	font-size: 13px;
}

/* ─── Tytuły kroków ────────────────────────────────────────────────────────── */
.vendo-step__title {
	font-family: var(--vp-font-b);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .3px;
	color: var(--vp-text);
	margin: 0 0 18px;
}

/* ─── Przycisk wstecz ─────────────────────────────────────────────────────── */
.vendo-back-btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	background: none;
	border: none;
	color: var(--vp-pink);
	font-size: 12px;
	font-family: var(--vp-font-b);
	font-weight: 500;
	letter-spacing: .5px;
	cursor: pointer;
	padding: 0 0 16px;
	text-decoration: none;
	transition: color .15s;
}
.vendo-back-btn:hover {
    color: var(--vp-pink-hover);
    text-decoration: underline;
    /* Nadpisuje kolor tła motywu który pojawia się na hover na <button> */
    background: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border-color: transparent !important;
}

/* ─── Krok 1: Warianty ─────────────────────────────────────────────────────── */
.vendo-variants-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 10px;
}
.vendo-variant-tile {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	background: var(--vp-white);
	border: 1px solid var(--vp-pink);
	border-radius: var(--vp-radius-sm);
	padding: 14px 16px;
	cursor: pointer;
	text-align: left;
	font-family: var(--vp-font-b);
	transition: border-color .15s, background .15s, box-shadow .15s;
}
.vendo-variant-tile:hover,
.vendo-variant-tile:focus {
	border-color: var(--vp-pink);
	background: var(--vp-pink-light);
	box-shadow: var(--vp-shadow-sm);
	outline: none;
}
.vendo-variant-tile--selected {
	border-color: var(--vp-pink) !important;
	background: var(--vp-pink-light) !important;
	box-shadow: var(--vp-shadow-sm) !important;
}
.vendo-variant-tile--selected .vendo-variant__name {
	color: var(--vp-pink);
}
.vendo-variant__name {
	font-weight: 600;
	font-size: 13px;
	color: var(--vp-text);
}
.vendo-variant__dur {
	font-size: 11px;
	color: var(--vp-text);
}
.vendo-variant__price {
	font-size: 14px;
	font-weight: 700;
	color: var(--vp-pink);
	font-family: var(--vp-font-b);
	margin-top: 4px;
}

/* ─── Min. wartość zamówienia (krok 1) ────────────────────────────────────── */
.vendo-min-order-notice {
	display: flex;
	align-items: center;
	gap: 8px;
	background: var(--vp-pink-light);
	border: 1px solid var(--vp-pink-border2);
	border-radius: var(--vp-radius-sm);
	padding: 10px 14px;
	font-size: 13px;
	color: var(--vp-muted);
	margin: 0 0 16px;
	line-height: 1.4;
}
.vendo-min-order-notice::before {
	content: "ℹ";
	flex-shrink: 0;
	font-size: 14px;
	color: var(--vp-pink-hover);
}
.vendo-min-order-notice strong {
	color: var(--vp-pink-hover);
	font-weight: 700;
}

/* ─── Krok 2: Kalendarz ───────────────────────────────────────────────────── */
.vendo-calendar { user-select: none; }
.vendo-cal-nav-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
}
.vendo-cal-title {
	font-family: var(--vp-font-h);
	font-weight: 500;
	font-size: 15px;
	color: var(--vp-text);
}
/* Rok w tytule kalendarza — cyfry z Bodoni Moda SC */
.vendo-cal-year {
	font-family: var(--vp-font-num);
	font-weight: 600;
}
.icon-btn {
	appearance: none !important;
	-webkit-appearance: none !important;
	background: #ffffff !important;
	border: 1.5px solid #ef9fb0 !important;
	width: 38px !important;
	height: 38px !important;
	border-radius: 50% !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	cursor: pointer;
	flex-shrink: 0;
	padding: 0 !important;
	margin: 0;
	outline: none !important;
	box-shadow: none !important;
	-webkit-tap-highlight-color: transparent;
	transition: background 0.2s ease;
	line-height: 1;
}
.icon-btn:hover:not(:disabled)  { background: #fef2f0 !important; }
.icon-btn:active:not(:disabled) { background: #ef9fb0 !important; box-shadow: none !important; }
.icon-btn:active svg polyline   { stroke: #ffffff !important; }
.icon-btn:focus,
.icon-btn:focus-visible {
	outline: none !important;
	box-shadow: none !important;
	background: #ffffff !important;
	border-color: #ef9fb0 !important;
}
.icon-btn:disabled { opacity: 0.25; cursor: not-allowed; }

.vendo-cal-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 2px;
}
.vendo-cal-head {
	text-align: center;
	font-size: 10px;
	font-weight: 600;
	font-family: var(--vp-font-b);
	color: #555;
	padding: 4px 0;
	text-transform: uppercase;
	letter-spacing: .5px;
}
.vendo-cal-day {
	text-align: center;
	padding: 7px 2px;
	border-radius: 6px;
	font-size: 13px;
	font-family: var(--vp-font-b);
	cursor: default;
	transition: background .15s, color .15s;
}
.vendo-cal-day--empty { pointer-events: none; }
.vendo-cal-day--past,
.vendo-cal-day--disabled { color: #ddd; cursor: not-allowed; }
.vendo-cal-day--available {
	color: var(--vp-text);
	font-weight: 600;
	cursor: pointer;
	background: var(--vp-pink-light);
}
.vendo-cal-day--available:hover,
.vendo-cal-day--available:focus {
	background: var(--vp-pink);
	color: #fff;
	outline: none;
}
.vendo-cal-day--selected {
	background: var(--vp-pink) !important;
	color: #fff !important;
}
.vendo-cal-loading,
.vendo-cal-empty {
	text-align: center;
	color: var(--vp-text);
	font-size: 13px;
	font-family: var(--vp-font-b);
	margin-top: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}
.vendo-selected-date {
	font-size: 12px;
	font-family: var(--vp-font-b);
	color: var(--vp-text);
	margin: 0 0 14px;
}

/* ─── Krok 3: Sloty ─────────────────────────────────────────────────────────── */
.vendo-slots-grid { display: flex; flex-wrap: wrap; gap: 8px; }
.vendo-slot-tile {
	background: var(--vp-white);
	border: 1.5px solid var(--vp-pink-border);
	border-radius: var(--vp-pill);
	padding: 8px 18px;
	font-size: 13px;
	font-weight: 600;
	font-family: var(--vp-font-b);
	cursor: pointer;
	color: var(--vp-text);
	transition: border-color .15s, background .15s, color .15s;
	white-space: nowrap;
}
.vendo-slot-tile:hover,
.vendo-slot-tile:focus {
	border-color: var(--vp-pink);
	background: var(--vp-pink-light);
	color: var(--vp-pink);
	outline: none;
}
.vendo-slot-tile--selected,
.vendo-slot-tile.vendo-slot--selected {
	border-color: var(--vp-pink);
	background: var(--vp-pink);
	color: #fff;
}
.vendo-slot-tile--selected:hover,
.vendo-slot-tile.vendo-slot--selected:hover {
	background: var(--vp-pink-hover);
	border-color: var(--vp-pink-hover);
}
.vendo-slots-loading,
.vendo-no-slots {
	color: var(--vp-text);
	font-size: 13px;
	font-family: var(--vp-font-b);
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 0;
}
.vendo-btn-next,
.vendo-btn-confirm-slots {
	display: block;
	width: 100%;
	margin-top: 16px;
	padding: 13px 28px;
	background: var(--vp-pink);
	color: #fff;
	border: none;
	border-radius: var(--vp-pill);
	font-size: 11px;
	font-weight: 500;
	font-family: var(--vp-font-b);
	letter-spacing: 2.5px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .1s ease-out, box-shadow .1s ease-out, transform .1s ease-out;
	box-shadow: 0 4px 18px var(--vp-pink-shadow);
}
.vendo-btn-confirm-slots:hover {
	background: var(--vp-pink-hover);
	box-shadow: 0 6px 26px rgba(239,159,176,.35);
}
.vendo-btn-confirm-slots:active { transform: scale(.96); }

/* ─── Krok 4/5: Podsumowanie ───────────────────────────────────────────────── */
.vendo-summary-box {
	background: var(--vp-white);
	border: 0.5px solid var(--vp-pink-border2);
	border-radius: var(--vp-radius-sm);
	padding: 16px 20px;
	margin-bottom: 20px;
}
.vendo-summary-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 7px 0;
	border-bottom: 1px solid var(--vp-pink-border);
	gap: 12px;
	font-size: 13px;
	font-family: var(--vp-font-b);
}
.vendo-summary-row:last-child { border-bottom: none; }
.vendo-summary-label { color: var(--vp-text); flex-shrink: 0; }
.vendo-summary-value { text-align: right; font-weight: 400; color: var(--vp-text); font-family: var(--vp-font-b); }
.vendo-summary-row strong { font-weight: 700; } /* "Kwota płatna teraz" / "na miejscu" — pogrubione (label + cena) */

.vendo-cart-error {
	color: var(--vp-danger);
	font-size: 12px;
	font-family: var(--vp-font-b);
	margin: 0 0 12px;
	padding: 8px 14px;
	background: #fef2f2;
	border: 1px solid #fecaca;
	border-radius: var(--vp-radius-sm);
}
.vendo-vat-note {
	font-size: 11px;
	font-family: var(--vp-font-b);
	color: var(--vp-text);
	text-align: right;
	margin: 6px 0 14px;
	letter-spacing: .2px;
}

/* ─── Przycisk "Dodaj do koszyka" ──────────────────────────────────────────── */
.vendo-btn-add-to-cart {
	display: block;
	width: 100%;
	padding: 14px 42px;
	background: var(--vp-pink);
	color: #fff;
	border: none;
	border-radius: var(--vp-pill);
	font-size: 11px;
	font-weight: 500;
	font-family: var(--vp-font-b);
	letter-spacing: 2.5px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .1s ease-out, box-shadow .1s ease-out, transform .1s ease-out;
	box-shadow: 0 4px 18px var(--vp-pink-shadow);
	text-align: center;
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
}
.vendo-btn-add-to-cart:hover:not(:disabled) {
	background: var(--vp-pink-hover);
	box-shadow: 0 6px 26px rgba(239,159,176,.35);
}
.vendo-btn-add-to-cart:active:not(:disabled) { transform: scale(.96); }
.vendo-btn-add-to-cart:disabled { opacity: .65; cursor: wait; }

/* ─── Sukces ────────────────────────────────────────────────────────────────── */
.vendo-added-to-cart { text-align: center; padding: 16px 0; }
.vendo-success-icon {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--vp-pink-light);
	color: var(--vp-pink-hover);
	font-size: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 14px;
}
.vendo-success-msg {
	font-family: var(--vp-font-h);
	font-size: 18px;
	font-weight: 500;
	color: var(--vp-pink-hover);
	margin: 0;
}

/* ─── Spinner ───────────────────────────────────────────────────────────────── */
.vendo-spinner {
	display: inline-block;
	width: 16px;
	height: 16px;
	border: 2px solid rgba(239,159,176,.3);
	border-top-color: var(--vp-pink);
	border-radius: 50%;
	animation: vendo-spin .7s linear infinite;
}
@keyframes vendo-spin { to { transform: rotate(360deg); } }

/* ─── Kalkulator metrażowy ──────────────────────────────────────────────────── */
.vendo-step-sqm { display: flex; flex-direction: column; gap: 14px; }
.vendo-sqm-areas { display: flex; flex-direction: column; gap: 10px; }
.vendo-sqm-area__label {
	font-size: 12px;
	font-family: var(--vp-font-b);
	font-weight: 600;
	color: var(--vp-text);
	margin-bottom: 4px;
	letter-spacing: .3px;
}
.vendo-sqm-area__inputs {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	flex-wrap: wrap;
}
/* Etykieta „Długość (m)" nie może rozpychać wiersza w pionie — separatory
   centrujemy względem samego pola, nie względem pola razem z etykietą. */
.vendo-sqm-field { align-self: flex-start; }
/* Label pod fieldem: column-reverse odwraca kolejność DOM → input na górze, label na dole */
.vendo-sqm-field { display: flex; flex-direction: column-reverse; gap: 0; }
.vendo-sqm-field label {
	font-size: 11px;
	font-family: var(--vp-font-b);
	color: var(--vp-text);
	letter-spacing: .3px;
	margin-top: 5px;
	text-align: center;
}
.vendo-booking-widget { --aq-input-h: 44px; }
.vendo-booking-widget input.vendo-sqm-length,
.vendo-booking-widget input.vendo-sqm-width,
.vendo-booking-widget input.vendo-extra-dim {
	height: var(--aq-input-h) !important;
	box-sizing: border-box !important;
}
.vendo-booking-widget input.vendo-sqm-length,
.vendo-booking-widget input.vendo-sqm-width {
	width: 100px !important;
	padding: 10px 12px !important;
	border: 1.5px solid var(--vp-pink-border) !important;
	border-radius: var(--vp-radius-sm) !important;
	font-size: 15px !important;
	font-family: var(--vp-font-b) !important;
	font-weight: 600 !important;
	color: var(--vp-text) !important;
	background: var(--vp-white) !important;
	box-shadow: none !important;
	outline: none !important;
	transition: border-color .15s, box-shadow .15s !important;
	-moz-appearance: textfield !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	line-height: 1.4 !important;
	min-height: unset !important;
	height: auto !important;
}
.vendo-booking-widget input.vendo-sqm-length:focus,
.vendo-booking-widget input.vendo-sqm-width:focus {
	border-color: var(--vp-pink) !important;
	box-shadow: 0 0 0 3px rgba(239,159,176,.15) !important;
	outline: none !important;
}
.vendo-booking-widget input.vendo-sqm-length::-webkit-outer-spin-button,
.vendo-booking-widget input.vendo-sqm-length::-webkit-inner-spin-button,
.vendo-booking-widget input.vendo-sqm-width::-webkit-outer-spin-button,
.vendo-booking-widget input.vendo-sqm-width::-webkit-inner-spin-button {
	-webkit-appearance: none !important;
	margin: 0 !important;
}
.vendo-sqm-multiply,
.vendo-sqm-equals,
.vendo-sqm-result {
	/* Wysokość równa polu input + wyśrodkowanie w pionie = znaki „×" i „="
	   oraz wynik lądują dokładnie na osi pola, niezależnie od etykiety
	   renderowanej pod spodem (pole ma flex-direction: column-reverse). */
	display: inline-flex;
	align-items: center;
	min-height: var(--aq-input-h, 44px);
	margin-top: 0;
}
.vendo-sqm-multiply,
.vendo-sqm-equals { font-size: 16px; color: var(--vp-light); }
.vendo-sqm-result {
	font-size: 14px;
	font-weight: 700;
	color: var(--vp-pink);
	font-family: var(--vp-font-b);
	min-width: 60px;
	gap: 4px;
}
.vendo-sqm-remove {
	background: none;
	border: none;
	color: var(--vp-light);
	cursor: pointer;
	padding: 4px;
	align-self: flex-end;
	margin-bottom: 6px;
	transition: color .15s;
	line-height: 1;
}
.vendo-sqm-remove:hover { color: var(--vp-danger); }
.vendo-sqm-add-area {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: none;
	border: 1.5px solid var(--vp-pink-border);
	border-radius: var(--vp-pill);
	padding: 7px 16px;
	font-size: 12px;
	font-family: var(--vp-font-b);
	font-weight: 500;
	color: var(--vp-pink);
	cursor: pointer;
	letter-spacing: .5px;
	transition: border-color .15s, background .15s;
}
.vendo-sqm-add-area:hover { border-color: var(--vp-pink); background: var(--vp-pink-light); }
.vendo-sqm-summary {
	display: none;
	flex-direction: column;
	gap: 4px;
	padding: 12px 16px;
	background: var(--vp-pink-light);
	border: 0.5px solid var(--vp-pink-border2);
	border-radius: var(--vp-radius-sm);
}
.vendo-sqm-summary.is-visible { display: flex; }
.vendo-sqm-summary__row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 13px;
	font-family: var(--vp-font-b);
}
.vendo-sqm-summary__row span { color: var(--vp-text); }
.vendo-sqm-summary__row strong { color: var(--vp-text); font-weight: 700; font-family: var(--vp-font-b); }

/* ── Tryb łączony: wszystkie typy naraz ─────────────────────────────── */
.vendo-sqm-block { margin: 0; padding: 0; }
.vendo-sqm-block + .vendo-sqm-block {
	margin: 0;
	padding-top: 15px;
	border-top: 0.5px solid var(--vp-pink-border);
}
.vendo-sqm-block__head {
	display: flex;
	align-items: center;
	gap: 9px;
	flex-wrap: wrap;
}
.vendo-sqm-block__name {
	font-family: var(--vp-font-b);
	font-weight: 700;
	font-size: 15px;
	color: var(--vp-text);
}
.vendo-sqm-optional-badge {
	font-family: var(--vp-font-b);
	font-size: 11px;
	letter-spacing: .03em;
	color: var(--vp-muted);
	background: var(--vp-pink-light);
	border: 0.5px solid var(--vp-pink-border);
	border-radius: var(--vp-radius-sm);
	padding: 3px 9px;
}
.vendo-sqm-note {
	margin: 4px 0 0;
	font-family: var(--vp-font-b);
	font-size: 13px;
	line-height: 1.55;
	color: var(--vp-muted);
	white-space: pre-line;
}
.vendo-sqm-block .vendo-sqm-area__inputs { margin-top: 12px; }
.vendo-sqm-rate { color: var(--vp-muted); font-size: 12px; font-family: var(--vp-font-b); }
.vendo-step-sqm--combined .vendo-sqm-summary { margin-top: 16px; }

.vendo-sqm-next {
	align-self: flex-end;
	padding: 13px 28px;
	background: var(--vp-pink);
	color: #fff;
	border: none;
	border-radius: var(--vp-pill);
	font-size: 11px;
	font-weight: 500;
	font-family: var(--vp-font-b);
	letter-spacing: 2.5px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .1s ease-out, transform .1s ease-out;
	box-shadow: 0 4px 18px var(--vp-pink-shadow);
}
.vendo-sqm-next:disabled { opacity: .4; cursor: not-allowed; box-shadow: none; }
.vendo-sqm-next:not(:disabled):hover { background: var(--vp-pink-hover); }
.vendo-sqm-next:not(:disabled):active { transform: scale(.96); }
/* ─── Wybór typu metrażu (sub-step przed polami wymiarów) ─────────────────── */
.vendo-sqm-type-cards {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.vendo-sqm-type-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	padding: 14px 18px;
	background: var(--vp-white);
	border: 1px solid var(--vp-pink);
	border-radius: var(--vp-radius-sm);
	cursor: pointer;
	text-align: left;
	transition: border-color .15s, box-shadow .15s, background .15s;
}
.vendo-sqm-type-card:hover {
	border-color: var(--vp-pink);
	box-shadow: 0 2px 12px rgba(239,159,176,.18);
	background: var(--vp-pink-light);
}
.vendo-sqm-type-card:focus,
.vendo-sqm-type-card:active {
	outline: none !important;
	background: var(--vp-pink-light) !important;
	border-color: var(--vp-pink) !important;
	box-shadow: none !important;
}
.vendo-sqm-type-card__name {
	font-family: var(--vp-font-b);
	font-size: 14px;
	font-weight: 600;
	color: var(--vp-text);
}
.vendo-sqm-type-card__price {
	font-family: var(--vp-font-b);
	font-size: 13px;
	font-weight: 700;
	color: var(--vp-pink);
	white-space: nowrap;
}

.vendo-sqm-type-section { margin-bottom: 14px; }
.vendo-sqm-type-title {
	font-family: var(--vp-font-h);
	font-size: 14px;
	font-weight: 500;
	color: var(--vp-pink);
	margin-bottom: 8px;
	padding-bottom: 4px;
	border-bottom: 0.5px solid var(--vp-pink-border);
}
@media (max-width: 480px) {
	.vendo-sqm-area__inputs { flex-direction: column; align-items: flex-start; }
	.vendo-sqm-multiply, .vendo-sqm-equals { display: none; }
}

/* ─── Extras (opcje dodatkowe) ──────────────────────────────────────────────── */
.vendo-step-extras { display: flex; flex-direction: column; gap: 14px; }
.vendo-extras-list { display: flex; flex-direction: column; gap: 8px; }
.vendo-extra-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 16px;
	border: 1px solid var(--vp-pink);
	border-radius: var(--vp-radius-sm);
	background: var(--vp-white);
	transition: border-color .15s;
}
.vendo-extra-item:hover { border-color: var(--vp-pink-border2); }
.vendo-extra-info { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.vendo-extra-name  { font-size: 13px; font-weight: 600; color: var(--vp-text); font-family: var(--vp-font-b); }
.vendo-extra-price { font-size: 12px; color: var(--vp-pink); font-weight: 600; font-family: var(--vp-font-b); }
.vendo-extra-dur   { font-size: 11px; color: var(--vp-text); font-family: var(--vp-font-b); }
/* stepper */
.vendo-extra-qty {
	display: flex;
	align-items: center;
	border: 1.5px solid var(--vp-pink-border);
	border-radius: var(--vp-pill);
	overflow: hidden;
	background: var(--vp-white);
}
.vendo-extra-qty-btn {
	background: none; border: none; outline: none; box-shadow: none;
	width: 30px; height: 30px;
	font-size: 16px; font-weight: 700;
	color: var(--vp-pink); cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	padding: 0; flex-shrink: 0;
	transition: background .15s;
}
.vendo-extra-qty-btn:hover:not(:disabled) {
    background: var(--vp-pink-light) !important;
    color: var(--vp-pink) !important;  /* motyw nie może zmienić koloru na biały */
}
.vendo-extra-qty-btn:disabled { color: #ddd; cursor: not-allowed; }
/* Hover na disabled: znak + lub − pozostaje różowy (nie dziedziczy białego z motywu) */
.vendo-extra-qty-btn:disabled:hover,
.vendo-booking-widget .vendo-extra-qty-btn:disabled:hover {
    color: var(--vp-pink) !important;
    background: transparent !important;
    box-shadow: none !important;
}
/* :focus / :active — motyw nie może zostawić swojego koloru po kliknięciu */
.vendo-extra-qty-btn:focus,
.vendo-extra-qty-btn:focus-visible,
.vendo-extra-qty-btn:active,
.vendo-booking-widget .vendo-extra-qty-btn:focus,
.vendo-booking-widget .vendo-extra-qty-btn:focus-visible,
.vendo-booking-widget .vendo-extra-qty-btn:active {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--vp-pink) !important;
    outline: none !important;
    box-shadow: none !important;
    border-color: transparent !important;
}
.vendo-extra-qty-val {
	min-width: 28px; text-align: center;
	font-size: 13px; font-weight: 700;
	font-family: var(--vp-font-b); color: var(--vp-text);
}
/* checkbox */
.vendo-extra-checkbox-lbl { cursor: pointer; display: flex; align-items: center; }
.vendo-extra-check { position: absolute; opacity: 0; width: 0; height: 0; }
.vendo-extra-check-box {
	width: 22px; height: 22px;
	border: 1.5px solid var(--vp-pink-border2);
	border-radius: 6px;
	background: var(--vp-white);
	display: flex; align-items: center; justify-content: center;
	transition: background .15s, border-color .15s;
}
.vendo-extra-check:checked + .vendo-extra-check-box {
	background: var(--vp-pink); border-color: var(--vp-pink);
}
.vendo-extra-check:checked + .vendo-extra-check-box::after {
	content: '';
	display: block;
	width: 5px; height: 10px;
	border: 2px solid #fff;
	border-top: none; border-left: none;
	transform: rotate(45deg) translate(-1px,-1px);
}
/* mb input */
.vendo-extra-mb-wrap { display: flex; align-items: center; gap: 6px; }
.vendo-booking-widget input.vendo-extra-mb-input {
	width: 80px !important;
	padding: 8px 10px !important;
	border: 1.5px solid var(--vp-pink-border) !important;
	border-radius: var(--vp-radius-sm) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	font-family: var(--vp-font-b) !important;
	text-align: center !important;
	color: var(--vp-text) !important;
	background: var(--vp-white) !important;
	box-shadow: none !important;
	outline: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	-moz-appearance: textfield !important;
	height: auto !important;
	min-height: unset !important;
	line-height: 1.4 !important;
}
.vendo-booking-widget input.vendo-extra-mb-input:focus {
	border-color: var(--vp-pink) !important;
	box-shadow: 0 0 0 3px rgba(239,159,176,.15) !important;
	outline: none !important;
}
.vendo-booking-widget input.vendo-extra-mb-input::-webkit-outer-spin-button,
.vendo-booking-widget input.vendo-extra-mb-input::-webkit-inner-spin-button {
	-webkit-appearance: none !important;
	margin: 0 !important;
}
.vendo-extra-mb-unit { font-size: 11px; color: var(--vp-text); font-family: var(--vp-font-b); font-weight: 600; }
/* suma extras */
.vendo-extras-summary {
	display: flex; justify-content: space-between; align-items: center;
	padding: 10px 16px;
	background: var(--vp-pink-light);
	border-radius: var(--vp-radius-sm);
	font-size: 13px; font-family: var(--vp-font-b); font-weight: 600;
	color: var(--vp-text);
}
.vendo-extras-summary strong { color: var(--vp-pink); font-size: 14px; font-family: var(--vp-font-num); }
/* extras next button */
.vendo-btn-primary.vendo-extras-next {
	display: block; width: 100%;
	padding: 13px 28px;
	background: var(--vp-pink); color: #fff;
	border: none; border-radius: var(--vp-pill);
	font-size: 11px; font-weight: 500;
	font-family: var(--vp-font-b); letter-spacing: 2.5px;
	text-transform: uppercase; cursor: pointer;
	transition: background .1s ease-out, transform .1s ease-out;
	box-shadow: 0 4px 18px var(--vp-pink-shadow);
	-webkit-font-smoothing: antialiased;
}
.vendo-btn-primary.vendo-extras-next:hover { background: var(--vp-pink-hover); }
.vendo-btn-primary.vendo-extras-next:active { transform: scale(.96); }

/* ─── Już w koszyku (blokada ponownego dodania) ─────────────────────────── */
.vendo-already-added {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 24px;
	background: var(--vp-pink-light);
	color: var(--vp-pink-hover);
	border-radius: var(--vp-pill);
	font-family: var(--vp-font-b);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: center;
}
.vendo-already-added__icon {
	font-size: 15px;
	font-weight: 700;
}

/* ─── Pasek min. wartości zamówienia ────────────────────────────────────────── */
.vendo-min-order-bar {
	margin: 14px 0 0;
	padding: 0;
	background: none;
	border: none;
	font-size: 12px;
	color: var(--vp-text);
	font-family: var(--vp-font-b);
	text-align: center;
	line-height: 1.5;
}
.vendo-min-order-bar strong {
	color: var(--vp-pink-hover);
	font-weight: 600;
}

/* ─── Misc ──────────────────────────────────────────────────────────────────── */
.vendo-noscript {
	color: var(--vp-text);
	font-size: 13px;
	font-family: var(--vp-font-b);
	padding: 8px 0;
}
.vendo-empty-state {
	text-align: center;
	padding: 20px;
	color: var(--vp-text);
	font-size: 13px;
	font-family: var(--vp-font-b);
}

/* ─── Bąbelkowe przyciski widgetu — kompatybilność z [pc_button] ────────────── */

/* Filtr goo w kontekście widżetu (poza .pc-wrap shortcode'u) */
.vendo-booking-widget .pc-effect-container {
	-webkit-filter: url("#pc-goo");
	filter: url("#pc-goo");
}

/* Wycisz domyślne box-shadow na przyciskach — tło wizualne pochodzi z pc-effect-btn */
.vendo-btn-add-to-cart.pc-btn-bubble,
.vendo-btn-confirm-slots.pc-btn-bubble,
.vendo-extras-next.pc-btn-bubble,
.vendo-sqm-next.pc-btn-bubble {
	box-shadow: none !important;
	transform: none !important;
}

/* Wyłącz hover background/shadow/transform — bubble przejmuje efekt interakcji */
.vendo-btn-add-to-cart.pc-btn-bubble:hover:not(:disabled),
.vendo-btn-confirm-slots.pc-btn-bubble:hover,
.vendo-btn-primary.vendo-extras-next.pc-btn-bubble:hover,
.vendo-sqm-next.pc-btn-bubble:not(:disabled):hover {
	background: none !important;
	box-shadow: none !important;
	transform: none !important;
}

/* Wyłącz scale na :active */
.vendo-btn-add-to-cart.pc-btn-bubble:active:not(:disabled),
.vendo-btn-confirm-slots.pc-btn-bubble:active,
.vendo-sqm-next.pc-btn-bubble:not(:disabled):active {
	transform: none !important;
}

/* Stan disabled — obsługiwany przez MutationObserver w JS (opacity/cursor na kontenerze) */
.vendo-sqm-next.pc-btn-bubble:disabled {
	opacity: 1 !important; /* opacity idzie na kontener, nie przycisk */
	cursor: inherit !important;
}

/* ─── Utwardzenie przed motywem (przenośność stylów) ───────────────────────── */
/* Niektóre motywy (gradientowe logo/przyciski) ustawiają na elementach
   -webkit-text-fill-color: transparent (+ background-clip: text). Ta własność ma
   pierwszeństwo przed `color`, więc "przecieka" na przyciski widżetu (np. sloty)
   i ukrywa tekst, mimo że `color` jest poprawny. Wymuszamy, by wypełnienie tekstu
   zawsze szło za kolorem elementu — neutralizuje to motyw bez zmiany barw widżetu. */
.vendo-booking-widget,
.vendo-booking-widget * {
	-webkit-text-fill-color: currentColor !important;
}
/* Dodatkowe wzmocnienie koloru tam, gdzie motyw mógłby forsować transparent. */
.vendo-booking-widget .vendo-slot-tile { color: var(--vp-text) !important; }
.vendo-booking-widget .vendo-slot-tile:hover,
.vendo-booking-widget .vendo-slot-tile:focus { color: var(--vp-pink) !important; }
.vendo-booking-widget .vendo-slot-tile--selected,
.vendo-booking-widget .vendo-slot-tile.vendo-slot--selected { color: #fff !important; }
.vendo-booking-widget .vendo-btn-add-to-cart { color: #fff !important; }
/* Przyciski powrotu — kolor akcentu + dosunięcie do lewej (motyw dokładał padding/margines do <button>). */
.vendo-booking-widget .vendo-back-btn {
	color: var(--vp-pink) !important;
	display: inline-flex !important;
	align-self: flex-start !important;
	float: none !important;
	margin: 0 0 0 0 !important;
	padding: 0 0 16px 0 !important;
	text-align: left !important;
}
.vendo-booking-widget .vendo-back-btn:hover { color: var(--vp-pink-hover) !important; }
/* Sloty godzin — motyw zawyża padding/wysokość; wymuszamy kompaktowy rozmiar. */
.vendo-booking-widget .vendo-slot-tile {
	padding: 9px 16px !important;
	min-height: 0 !important;
	height: auto !important;
	line-height: 1.35 !important;
	font-size: 13px !important;
}

/* ════════════════════════════════════════════════════════════════════════════
   AQUA SUITE — MOTYW WIDŻETU REZERWACJI (paleta strony głównej)
   ────────────────────────────────────────────────────────────────────────────
   Zasada kolorystyczna, wprost ze strony głównej:
     • BŁĘKIT / TURKUS  = tło, ramki, stany dostępne, elementy nośne
     • RÓŻ / KORAL      = wyłącznie akcenty: CTA, aktywny krok, cena
   Wcześniej róż był kolorem bazowym całej strony produktowej — stąd wrażenie
   „za dużo czerwieni". Tu odwracamy proporcje, zachowując tę samą markę.

   Drugi cel: układ ma zmieścić się na jednym ekranie, bez scrollowania.
   Wszystkie odstępy sterowane są zmiennymi --v2-*, więc zagęszczenie
   sprowadza się do zmiany kilku liczb w jednym miejscu.
   ════════════════════════════════════════════════════════════════════════════ */

.vendo-booking-widget {
	/* ── Błękity (baza) ── */
	--aq-sky:        #E8F7FA;   /* najjaśniejsze tło sekcji  */
	--aq-sky-2:      #D3EFF5;   /* tło gradientów            */
	--aq-turq:       #7BF6EE;   /* akcent turkusowy          */
	--aq-turq-soft:  rgba(123,246,238,.26);
	--aq-turq-line:  rgba(86,198,193,.55);
	--aq-turq-ink:   #17817A;   /* czytelny tekst na turkusie */
	--aq-teal:       #56C6C1;

	/* ── Róż / koral (akcenty) ── */
	--aq-pink:       #EF8BAD;
	--aq-pink-deep:  #D9648F;
	--aq-coral:      #F4AF92;
	--aq-gold:       #E9C069;

	/* ── Neutralne ── */
	--aq-ink:        #22303A;
	--aq-muted:      #6E8189;
	--aq-line:       #DCEAEE;

	/* ── Gradienty ── */
	--aq-grad-cta:   linear-gradient(92deg, #EF8BAD 0%, #F4AF92 100%);
	--aq-grad-head:  linear-gradient(112deg, #9FE4EE 0%, #C7F1F0 55%, #E4F6F3 100%);
	--aq-grad-sky:   linear-gradient(180deg, #EDF9FB 0%, #FFFFFF 62%);

	/* ── Metryka (jedno miejsce na zagęszczenie układu) ── */
	--aq-radius:     16px;
	--aq-radius-sm:  11px;
	--aq-gap:        18px;
	--aq-pad:        16px;
	--aq-shadow:     0 8px 24px rgba(58,150,164,.13);
	--aq-shadow-sm:  0 3px 12px rgba(58,150,164,.10);
}

/* ── Przyciski akcji: jedyne miejsce z pełnym różem marki ────────────────── */
.vendo-booking-widget .pc-effect-container { display: none !important; }

.vendo-booking-widget .vendo-btn-add-to-cart,
.vendo-booking-widget .vendo-btn-next,
.vendo-booking-widget .vendo-btn-confirm-slots,
.vendo-booking-widget .vendo-sqm-next,
.vendo-booking-widget .vendo-extras-next,
.vendo-booking-widget .vendo-locations-next,
.vendo-booking-widget .vendo-btn-primary,
.vendo-booking-widget .vendo-btn--primary {
	background: var(--aq-grad-cta) !important;
	box-shadow: none !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 50px !important;
	font-weight: 700;
	letter-spacing: .4px;
	padding: 12px 22px !important;
	font-size: 13px !important;
	cursor: pointer;
	transition: filter .18s, transform .12s;
}
.vendo-booking-widget .vendo-btn-add-to-cart:hover:not(:disabled),
.vendo-booking-widget .vendo-btn-next:hover,
.vendo-booking-widget .vendo-btn-confirm-slots:hover,
.vendo-booking-widget .vendo-sqm-next:not(:disabled):hover,
.vendo-booking-widget .vendo-extras-next:hover,
.vendo-booking-widget .vendo-locations-next:not(:disabled):hover,
.vendo-booking-widget .vendo-btn-primary:hover:not(:disabled),
.vendo-booking-widget .vendo-btn--primary:hover:not(:disabled) {
	background: var(--aq-grad-cta) !important;
	filter: brightness(1.04);
	transform: translateY(-1px);
}
.vendo-booking-widget .vendo-btn-primary:disabled,
.vendo-booking-widget .vendo-sqm-next:disabled,
.vendo-booking-widget .vendo-locations-next:disabled { opacity: .45; cursor: not-allowed; }

/* ── Panel środkowy: ramka turkusowa zamiast różowo-złotej ───────────────── */
.vendo-booking-widget .vendo-panel,
.vendo-panel {
	border: 1px solid transparent !important;
	background:
		linear-gradient(#ffffff, #ffffff) padding-box,
		linear-gradient(120deg, #9FE4EE 0%, #C9EFEE 45%, #F3C9D9 100%) border-box !important;
	padding: var(--aq-pad) !important;
	box-shadow: var(--aq-shadow) !important;
}

/* ── Inputy: obramowanie turkusowe, fokus turkusowy ──────────────────────── */
.vendo-booking-widget input,
.vendo-booking-widget select,
.vendo-booking-widget textarea {
	border: 1.5px solid var(--aq-turq-line) !important;
	border-radius: 10px !important;
	color: var(--aq-ink);
}
.vendo-booking-widget input:focus,
.vendo-booking-widget select:focus,
.vendo-booking-widget textarea:focus {
	border-color: var(--aq-teal) !important;
	box-shadow: 0 0 0 3px rgba(86,198,193,.20) !important;
}

/* Wynik metrażu — turkusowy, bez ramki */
.vendo-sqm-result,
.vendo-sqm-result .vendo-sqm-sqm,
.vendo-sqm-result .vendo-sqm-rate,
.vendo-sqm-result .vendo-extra-dim-out {
	color: #F4AF92 !important;
	border: none !important;
	font-weight: 700;
}

/* Podsumowanie metrażu (ukrywane przy aktywnym proxy) */
.vendo-sqm-summary {
	background: var(--aq-turq-soft) !important;
	border-color: var(--aq-turq-line) !important;
}

/* Przycisk „Wstecz" — róż jako akcent, nie jako tło */
.vendo-back-btn,
.vendo-booking-widget .vendo-back-btn       { color: var(--aq-pink-deep) !important; padding-bottom: 10px !important; }
.vendo-back-btn:hover,
.vendo-booking-widget .vendo-back-btn:hover { color: var(--aq-pink) !important; }

/* Strzałki kalendarza */
.icon-btn {
	border-color: var(--aq-turq-line) !important;
	background: #ffffff !important;
}
.icon-btn:hover:not(:disabled),
.icon-btn:active:not(:disabled),
.icon-btn:focus,
.icon-btn:focus-visible {
	background: var(--aq-sky) !important;
	border-color: var(--aq-teal) !important;
}
.icon-btn svg polyline        { stroke: var(--aq-teal) !important; }
.icon-btn:active svg polyline { stroke: var(--aq-teal) !important; }

/* Dni dostępne — turkus (jak na stronie głównej) */
.vendo-cal-day--available {
	background: var(--aq-turq) !important;
	color: #10514D !important;
	font-weight: 600;
}
.vendo-cal-day--available:hover,
.vendo-cal-day--available:focus { background: #5FE9E0 !important; color: #0E3F3C !important; }

/* Dzień wybrany — róż jako jedyne „zaznaczenie" */
.vendo-booking-widget .vendo-cal-day--selected {
	background: var(--aq-grad-cta) !important;
	color: #fff !important;
	border-color: transparent !important;
}

/* Kafelki godzin — turkus; wybrany na różowo */
.vendo-slot-tile,
.vendo-booking-widget .vendo-slot-tile {
	border-color: var(--aq-turq-line) !important;
	color: var(--aq-turq-ink) !important;
	background: #fff !important;
}
.vendo-slot-tile:hover,
.vendo-slot-tile:focus,
.vendo-booking-widget .vendo-slot-tile:hover,
.vendo-booking-widget .vendo-slot-tile:focus {
	border-color: var(--aq-teal) !important;
	background: var(--aq-sky) !important;
}
.vendo-booking-widget .vendo-slot-tile--selected,
.vendo-booking-widget .vendo-slot-tile.vendo-slot--selected {
	background: var(--aq-grad-cta) !important;
	border-color: transparent !important;
	color: #fff !important;
}

/* Kwota brakująca do minimum — koral (ostrzeżenie, nie stan neutralny) */
.vendo-booking-widget .vendo-min-order-bar strong,
.vendo-min-order-bar strong { color: #F4AF92 !important; }


/* ════════════════════════════════════════════════════════════════════════════
   UKŁAD 3-KOLUMNOWY
   Lewa: karta kroków + „Dlaczego my". Środek: hero + panel + notka.
   Prawa: podsumowanie + kontakt.
   ════════════════════════════════════════════════════════════════════════════ */

.vendo-layout-v2 {
	color: var(--aq-ink);
	/* Bez własnego tła — widżet siada na tle sekcji ustawionym w Elementorze. */
	background: transparent;
	padding: 0;
}

.vendo-layout-v2 .vendo-layout {
	display: grid;
	grid-template-columns: minmax(200px, .88fr) minmax(0, 2.3fr) minmax(260px, 1.05fr);
	grid-template-areas: "left center right";
	gap: var(--aq-gap);
	/* stretch zamiast start: kolumny mają wspólną wysokość, dzięki czemu
	   ostatnia karta w każdej z nich kończy się na tej samej linii. */
	align-items: stretch;
}
.vendo-layout-v2 .vendo-col { display: flex; flex-direction: column; }
/* Ostatnie karty rozciągają się do dna kolumny. Notka „Nie wiesz jakie
   wymiary podać?" wyrównuje się w ten sposób do „Dlaczego my" i karty
   kontaktowej, zamiast urywać się wyżej. */
.vendo-layout-v2 .vendo-whyus-panel,
.vendo-layout-v2 .vendo-contact-card,
.vendo-layout-v2 .vendo-sqm-hint-slot { flex: 1 1 auto; }
.vendo-layout-v2 .vendo-sqm-hint { height: 100%; box-sizing: border-box; }
.vendo-layout-v2 .vendo-contact-card { justify-content: center; }
.vendo-layout-v2 .vendo-col--left   { grid-area: left; }
.vendo-layout-v2 .vendo-col--center { grid-area: center; min-width: 0; }
.vendo-layout-v2 .vendo-col--right  { grid-area: right; position: sticky; top: 14px; }

/* ── LEWA: karta kroków (bliźniacza do panelu podsumowania) ──────────────── */
.vendo-layout-v2 .vendo-steps-panel {
	background: #fff;
	border-radius: var(--aq-radius);
	box-shadow: var(--aq-shadow);
	overflow: hidden;
	margin-bottom: 14px;
}
/* Wysokość nagłówka wzorowana na panelu podsumowania — obie karty muszą
   startować równo, bo stoją obok siebie na tej samej linii. */
.vendo-layout-v2 .vendo-steps-panel__head,
.vendo-layout-v2 .vendo-summary-panel__head {
	min-height: 60px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 12px 16px;
	text-align: center;
}
.vendo-layout-v2 .vendo-steps-panel__head { background: var(--aq-grad-head); }
.vendo-layout-v2 .vendo-steps-panel__logo img { max-width: 34px; height: auto; display: block; }
.vendo-layout-v2 .vendo-steps-panel__title {
	font-family: "Playfair Display", serif;
	font-weight: 600;
	font-size: 14px;
	letter-spacing: .6px;
	line-height: 1.2;
	color: #143C42;
}

.vendo-layout-v2 .vendo-steps--side {
	display: flex;
	flex-direction: column;
	gap: 2px;
	border: none;
	margin: 0;
	padding: 8px;
}
.vendo-layout-v2 .vendo-steps--side .vendo-step-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	border-radius: 11px;
	border: none;
	margin: 0;
	background: transparent;
	white-space: normal;
	cursor: default;
	transition: background .18s, box-shadow .18s;
}
.vendo-layout-v2 .vendo-steps--side .vendo-step-item.is-done { cursor: pointer; }
.vendo-layout-v2 .vendo-steps--side .vendo-step-item.is-done:hover { background: var(--aq-sky); }

.vendo-layout-v2 .vendo-steps--side .vendo-step-num {
	width: 26px; height: 26px; font-size: 12px; flex-shrink: 0;
	background: var(--aq-turq-soft);
	border: 1px solid var(--aq-turq-line);
	color: var(--aq-turq-ink);
	font-size: 0; /* nadpisywane niżej — patrz reguła z liczbą */
}
/* Numer jest widoczny zawsze (także na krokach zaliczonych) — klient
   powinien widzieć „3 z 6", a nie serię identycznych kropek. */
.vendo-layout-v2 .vendo-steps--side .vendo-step-num { font-size: 12px; }

.vendo-layout-v2 .vendo-steps--side .vendo-step-label {
	color: var(--aq-ink);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .3px;
	font-size: 10.5px;
	line-height: 1.25;
	display: flex;
	flex-direction: column;
	gap: 1px;
}
.vendo-layout-v2 .vendo-steps--side .vendo-step-item.is-done .vendo-step-label { display: flex; }
.vendo-layout-v2 .vendo-step-opt {
	font-style: normal;
	font-weight: 600;
	font-size: 9px;
	letter-spacing: .2px;
	text-transform: none;
	color: var(--aq-muted);
}

/* Krok zaliczony — pełne turkusowe kółko */
.vendo-layout-v2 .vendo-steps--side .vendo-step-item.is-done .vendo-step-num {
	background: var(--aq-turq);
	border-color: var(--aq-turq);
	color: #10514D;
}
/* Krok aktywny — jedyna różowa pigułka w kolumnie */
.vendo-layout-v2 .vendo-steps--side .vendo-step-item.is-active {
	background: var(--aq-grad-cta);
	box-shadow: var(--aq-shadow-sm);
}
.vendo-layout-v2 .vendo-steps--side .vendo-step-item.is-active .vendo-step-num {
	background: rgba(255,255,255,.30);
	border-color: transparent;
	color: #fff;
}
.vendo-layout-v2 .vendo-steps--side .vendo-step-item.is-active .vendo-step-label,
.vendo-layout-v2 .vendo-steps--side .vendo-step-item.is-active .vendo-step-opt { color: #fff; }

/* ── LEWA: „Dlaczego my" jako osobna karta ───────────────────────────────── */
.vendo-layout-v2 .vendo-whyus-panel {
	background: #fff;
	border-radius: var(--aq-radius);
	box-shadow: var(--aq-shadow-sm);
	overflow: hidden;
}
.vendo-layout-v2 .vendo-whyus-panel__head {
	background: var(--aq-sky);
	padding: 9px 16px;
	border-bottom: 1px solid var(--aq-line);
	text-align: center;
}
.vendo-layout-v2 .vendo-side-heading {
	font-family: var(--vp-font-b);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1.1px;
	color: var(--aq-turq-ink);
	margin: 0;
	text-transform: uppercase;
}
.vendo-layout-v2 .vendo-whyus__list {
	list-style: none;
	margin: 0;
	padding: 12px 14px;
	display: flex;
	flex-direction: column;
	gap: 11px;
}
.vendo-layout-v2 .vendo-whyus__item { display: flex; align-items: center; gap: 10px; }
.vendo-layout-v2 .vendo-whyus__txt  { display: flex; flex-direction: column; line-height: 1.25; }
.vendo-layout-v2 .vendo-whyus__txt strong { font-size: 12px; color: var(--aq-ink); font-weight: 700; }
.vendo-layout-v2 .vendo-whyus__txt span   { font-size: 11px; color: var(--aq-muted); }

/* ── ŚRODEK: hero w jednej linii, mniejsza ikona ─────────────────────────── */
.vendo-layout-v2 .vendo-hero {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 12px;
}
.vendo-layout-v2 .vendo-hero__img img { width: 52px; height: auto; display: block; }
.vendo-layout-v2 .vendo-hero__title {
	font-family: var(--vp-font-h);
	font-weight: 600;
	text-transform: uppercase;
	font-size: clamp(16px, 1.6vw, 23px);
	line-height: 1.2;
	color: var(--aq-ink);
	margin: 0;
}
/* Na szerokich ekranach nagłówek nie łamie się — jest jedną linią.
   Poniżej 1200 px pozwalamy na zawijanie, żeby nie uciekał poza kolumnę. */
@media (min-width: 1200px) {
	.vendo-layout-v2 .vendo-hero__title { white-space: nowrap; }
}
.vendo-layout-v2 .vendo-hero__em {
	background: var(--aq-grad-cta);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: var(--aq-pink);
}

/* Tytuł kroku ukryty (kontekst daje karta kroków), ale lead widoczny */
.vendo-layout-v2 .vendo-step__title { display: none; }
.vendo-layout-v2 .vendo-step__lead {
	margin: 0 0 12px;
	font-size: 12px;
	color: var(--aq-muted);
	line-height: 1.4;
}

/* ── ŚRODEK: notka pod panelem (poza .vendo-panel) ───────────────────────── */
.vendo-layout-v2 .vendo-sqm-hint-slot:empty { display: none; }
.vendo-layout-v2 .vendo-sqm-hint {
	display: flex;
	align-items: center;
	gap: 11px;
	background: var(--aq-sky);
	border: 1px solid var(--aq-line);
	border-radius: var(--aq-radius-sm);
	padding: 11px 14px;
	margin-top: 12px;
}
.vendo-layout-v2 .vendo-sqm-hint__icon {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 34px; height: 34px; border-radius: 50%; background: #fff; overflow: hidden;
}
.vendo-layout-v2 .vendo-sqm-hint__icon img { width: 60%; height: 60%; object-fit: contain; display: block; }
.vendo-layout-v2 .vendo-sqm-hint__txt { display: flex; flex-direction: column; line-height: 1.3; }
.vendo-layout-v2 .vendo-sqm-hint__txt strong { font-size: 12.5px; color: var(--aq-ink); }
.vendo-layout-v2 .vendo-sqm-hint__txt span   { font-size: 11.5px; color: var(--aq-muted); }

/* ── PRAWA: panel podsumowania ───────────────────────────────────────────── */
.vendo-layout-v2 .vendo-summary-panel {
	background: #fff;
	border-radius: var(--aq-radius);
	box-shadow: var(--aq-shadow);
	overflow: hidden;
	margin-bottom: 14px;
}
.vendo-layout-v2 .vendo-summary-panel__head {
	background: var(--aq-grad-head);
	color: #143C42;
}
.vendo-layout-v2 .vendo-summary-panel__title {
	font-family: var(--vp-font-b);
	font-weight: 700;
	letter-spacing: 1px;
	font-size: 14px;
	line-height: 1.2;
}
.vendo-layout-v2 .vendo-summary-panel__body { padding: 4px 16px; }
.vendo-layout-v2 .vendo-sum-row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 0;
	border-bottom: 1px solid var(--aq-line);
}
.vendo-layout-v2 .vendo-sum-row:last-child { border-bottom: none; }
.vendo-layout-v2 .vendo-sum-row[hidden]    { display: none; }
.vendo-layout-v2 .vendo-sum-row__label { font-size: 12px; color: var(--aq-muted); font-weight: 500; }
.vendo-layout-v2 .vendo-sum-row__value {
	margin-left: auto;
	font-size: 15px;
	font-weight: 700;
	color: var(--aq-ink);
	font-family: var(--vp-font-b);
}
/* Dojazd „GRATIS" — ten sam róż co na stronie głównej */
.vendo-layout-v2 .vendo-sum-row--travel .vendo-sum-row__value { color: var(--aq-pink-deep); }

/* CTA „Dalej" w prawym panelu */
.vendo-layout-v2 .vendo-cta-next {
	display: none;
	width: calc(100% - 32px);
	margin: 12px 16px 16px;
	border: none;
	cursor: pointer;
	color: #fff;
	font-family: var(--vp-font-b);
	font-weight: 700;
	letter-spacing: .5px;
	font-size: 13px;
	padding: 13px 16px;
	border-radius: 50px;
	background: var(--aq-grad-cta);
	box-shadow: 0 6px 18px rgba(239,139,173,.30);
	transition: transform .12s, box-shadow .2s, opacity .2s;
}
.vendo-layout-v2.vendo-has-proxy .vendo-cta-next { display: block; }
.vendo-layout-v2 .vendo-cta-next:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(239,139,173,.38); }
.vendo-layout-v2 .vendo-cta-next:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
.vendo-layout-v2 .vendo-cta-next__label::after { content: " →"; }

/* ── PRAWA: karta kontaktowa (dawniej odznaki zaufania) ──────────────────── */
.vendo-layout-v2 .vendo-contact-card {
	background: #fff;
	border-radius: var(--aq-radius);
	box-shadow: var(--aq-shadow-sm);
	padding: 16px 14px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
}
.vendo-layout-v2 .vendo-contact-card .vendo-badge { margin-bottom: 2px; }
.vendo-layout-v2 .vendo-contact-card__title { font-size: 14px; font-weight: 700; color: var(--aq-ink); }
.vendo-layout-v2 .vendo-contact-card__text  { font-size: 12px; color: var(--aq-muted); line-height: 1.35; }
.vendo-layout-v2 .vendo-contact-card__btn {
	margin-top: 9px;
	display: inline-block;
	text-decoration: none;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .5px;
	color: #fff;
	padding: 10px 22px;
	border-radius: 50px;
	border: none;
	background: var(--aq-grad-cta);
	transition: filter .18s, transform .12s;
}
.vendo-layout-v2 .vendo-contact-card__btn::before { content: "\260E\FE0E"; margin-right: 7px; }
.vendo-layout-v2 .vendo-contact-card__btn:hover { filter: brightness(1.05); transform: translateY(-1px); color: #fff; }
.vendo-layout-v2 .vendo-contact-card__phone {
	margin-top: 7px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .3px;
	color: var(--aq-turq-ink);
}

/* ── Wspólne: okrągłe badge z ikoną ──────────────────────────────────────── */
.vendo-layout-v2 .vendo-badge {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 36px; height: 36px; border-radius: 50%; background: var(--aq-sky); overflow: hidden;
}
.vendo-layout-v2 .vendo-badge img { width: 56%; height: 56%; object-fit: contain; display: block; }
.vendo-layout-v2 .vendo-badge--sm    { width: 32px; height: 32px; }
.vendo-layout-v2 .vendo-badge--md    { width: 38px; height: 38px; }
.vendo-layout-v2 .vendo-badge--round { width: 44px; height: 44px; }
.vendo-layout-v2 .vendo-badge--ghost { width: 34px; height: 34px; background: rgba(255,255,255,.45); }
.vendo-layout-v2 .vendo-summary-panel__head .vendo-badge--ghost img { filter: none; }

/* ── Typy metrażu: ikona w kółku ─────────────────────────────────────────── */
.vendo-layout-v2 .vendo-sqm-block__icon,
.vendo-layout-v2 .vendo-sqm-type-card__icon {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 38px; height: 38px; border-radius: 50%; background: var(--aq-sky); overflow: hidden;
}
.vendo-layout-v2 .vendo-sqm-block__icon img,
.vendo-layout-v2 .vendo-sqm-type-card__icon img { width: 58%; height: 58%; object-fit: contain; display: block; }


/* ════════════════════════════════════════════════════════════════════════════
   KROK „DODATKI" — ilość albo wymiary
   ════════════════════════════════════════════════════════════════════════════ */

.vendo-layout-v2 .vendo-extras-list { display: flex; flex-direction: column; gap: 8px; }

.vendo-layout-v2 .vendo-extra-item {
	display: block;
	background: #fff;
	border: 1.5px solid var(--aq-line);
	border-radius: var(--aq-radius-sm);
	padding: 11px 13px;
	transition: border-color .18s, background .18s;
}
.vendo-layout-v2 .vendo-extra-item.is-selected {
	border-color: var(--aq-teal);
	background: var(--aq-sky);
}
.vendo-layout-v2 .vendo-extra-head { display: flex; align-items: center; gap: 10px; }
.vendo-layout-v2 .vendo-extra-icon {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 34px; height: 34px; border-radius: 50%; background: var(--aq-turq-soft); overflow: hidden;
}
.vendo-layout-v2 .vendo-extra-icon img { width: 58%; height: 58%; object-fit: contain; display: block; }
.vendo-layout-v2 .vendo-extra-info { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.vendo-layout-v2 .vendo-extra-name  { font-size: 13px; font-weight: 700; color: var(--aq-ink); }
.vendo-layout-v2 .vendo-extra-price { font-size: 12px; color: #F4AF92; font-weight: 600; }
.vendo-layout-v2 .vendo-extra-desc  { font-size: 11px; color: var(--aq-muted); line-height: 1.35; }

/* Pola wymiarów dodatku — ten sam wzorzec co w kalkulatorze metrażu */
.vendo-layout-v2 .vendo-extra-dims {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	flex-wrap: wrap;
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px dashed var(--aq-line);
}
.vendo-layout-v2 .vendo-extra-dims .vendo-sqm-field { max-width: 120px; }
.vendo-layout-v2 .vendo-extra-dims input { width: 100%; }

/* Stepper +/− */
.vendo-layout-v2 .vendo-extra-qty { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.vendo-layout-v2 .vendo-extra-qty-btn {
	width: 28px; height: 28px; border-radius: 50%;
	border: 1.5px solid var(--aq-turq-line) !important;
	background: #fff !important;
	color: var(--aq-turq-ink) !important;
	font-size: 15px; line-height: 1; cursor: pointer;
	display: inline-flex; align-items: center; justify-content: center;
}
.vendo-layout-v2 .vendo-extra-qty-btn:hover:not(:disabled) { background: var(--aq-sky) !important; border-color: var(--aq-teal) !important; }
.vendo-layout-v2 .vendo-extra-qty-btn:disabled { opacity: .4; cursor: not-allowed; }
.vendo-layout-v2 .vendo-extra-qty-val { min-width: 22px; text-align: center; font-weight: 700; font-size: 13px; }
.vendo-layout-v2 .vendo-extra-mb-unit { font-size: 11px; color: var(--aq-muted); }

/* Checkbox */
.vendo-layout-v2 .vendo-extra-checkbox-lbl { position: relative; display: inline-flex; flex-shrink: 0; cursor: pointer; }
.vendo-layout-v2 .vendo-extra-check { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.vendo-layout-v2 .vendo-extra-check-box {
	width: 24px; height: 24px; border-radius: 8px;
	border: 1.5px solid var(--aq-turq-line); background: #fff;
	display: inline-flex; align-items: center; justify-content: center;
	transition: background .18s, border-color .18s;
}
.vendo-layout-v2 .vendo-extra-check:checked + .vendo-extra-check-box {
	background: var(--aq-grad-cta);
	border-color: transparent;
}
.vendo-layout-v2 .vendo-extra-check:checked + .vendo-extra-check-box::after {
	content: "✓"; color: #fff; font-size: 13px; line-height: 1;
}

.vendo-layout-v2 .vendo-extras-summary {
	display: flex; align-items: center; justify-content: space-between;
	background: var(--aq-turq-soft);
	border-radius: var(--aq-radius-sm);
	padding: 9px 13px;
	margin-top: 10px;
	font-size: 12.5px;
}
.vendo-layout-v2 .vendo-extras-summary strong { color: var(--aq-ink); font-size: 14px; }


/* ── Dodatki: rozwijane grupy i sekcje ───────────────────────────────────── */

.vendo-layout-v2 .vendo-extra-group {
	border: 1.5px solid var(--aq-line);
	border-radius: var(--aq-radius-sm);
	background: #fff;
	overflow: hidden;
	transition: border-color .18s;
}
.vendo-layout-v2 .vendo-extra-group.has-selection { border-color: var(--aq-teal); }

.vendo-layout-v2 .vendo-extra-group__head {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 11px 13px !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	cursor: pointer;
	text-align: left;
	font-family: var(--vp-font-b);
}
.vendo-layout-v2 .vendo-extra-group.has-selection .vendo-extra-group__head { background: var(--aq-sky) !important; }
.vendo-layout-v2 .vendo-extra-group__head:hover { background: var(--aq-sky) !important; }
.vendo-layout-v2 .vendo-extra-group__name {
	font-size: 13px; font-weight: 700; color: var(--aq-ink); flex: 1; min-width: 0;
}
.vendo-layout-v2 .vendo-extra-group__sum {
	font-size: 13px; font-weight: 700; color: #F4AF92; flex-shrink: 0;
}
/* Szewron obracany o 90° po rozwinięciu — bez ikon z zewnątrz. */
.vendo-layout-v2 .vendo-extra-group__chevron {
	width: 9px; height: 9px; flex-shrink: 0; margin-left: 2px;
	border-right: 2px solid var(--aq-teal);
	border-bottom: 2px solid var(--aq-teal);
	transform: rotate(45deg);
	transition: transform .2s;
}
.vendo-layout-v2 .vendo-extra-group.is-open .vendo-extra-group__chevron { transform: rotate(-135deg); }

/* Zwinięta grupa nie zajmuje miejsca — o to chodzi w całym podziale. */
.vendo-layout-v2 .vendo-extra-group__body { display: none; padding: 0 13px 12px; }
.vendo-layout-v2 .vendo-extra-group.is-open .vendo-extra-group__body { display: block; }

/* Wewnątrz grupy karty pozycji nie potrzebują już własnej ramki. */
.vendo-layout-v2 .vendo-extra-group .vendo-extra-item {
	border: none;
	background: transparent;
	padding: 8px 0 0;
}
.vendo-layout-v2 .vendo-extra-group .vendo-extra-item.is-selected { background: transparent; }
.vendo-layout-v2 .vendo-extra-group .vendo-extra-item + .vendo-extra-item {
	border-top: 1px dashed var(--aq-line);
	margin-top: 8px;
}

/* Sekcje obok siebie — dwie dają układ 50/50. */
.vendo-layout-v2 .vendo-extra-sectors {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 12px;
}
.vendo-layout-v2 .vendo-extra-sector {
	background: var(--aq-sky);
	border-radius: 10px;
	padding: 10px 12px 12px;
}
.vendo-layout-v2 .vendo-extra-sector__title {
	margin: 0;
	font-family: var(--vp-font-b);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .8px;
	text-transform: uppercase;
	color: var(--aq-turq-ink);
}
.vendo-layout-v2 .vendo-extra-sector .vendo-extra-item { padding-top: 6px; }
.vendo-layout-v2 .vendo-extra-sector .vendo-extra-name { font-size: 12px; }
/* W wąskiej kolumnie pola wymiarów muszą się zmieścić — zwężamy je. */
.vendo-layout-v2 .vendo-extra-sector .vendo-sqm-field { max-width: 88px; }
.vendo-layout-v2 .vendo-extra-sector .vendo-sqm-result { min-width: 0; font-size: 13px; }

/* ════════════════════════════════════════════════════════════════════════════
   KROK „MIEJSCE" — kafelki w stylu sekcji „Obszar działań" ze strony głównej
   ════════════════════════════════════════════════════════════════════════════ */

.vendo-layout-v2 .vendo-loc-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
	gap: 9px;
}
.vendo-layout-v2 .vendo-loc-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	padding: 12px 8px 11px;
	background: #fff !important;
	border: 1.5px solid var(--aq-turq-line);
	border-radius: 13px;
	box-shadow: var(--aq-shadow-sm);
	cursor: pointer;
	text-align: center;
	transition: transform .14s, box-shadow .18s, border-color .18s;
}
/* Naprzemienne obramowania — dokładnie jak kafelki na stronie głównej */
.vendo-layout-v2 .vendo-loc-card--alt { border-color: rgba(239,139,173,.55); }
.vendo-layout-v2 .vendo-loc-card:hover { transform: translateY(-2px); box-shadow: var(--aq-shadow); }
.vendo-layout-v2 .vendo-loc-card.is-selected {
	border-color: var(--aq-teal);
	background: var(--aq-sky) !important;
	box-shadow: 0 0 0 3px rgba(86,198,193,.20);
}
.vendo-layout-v2 .vendo-loc-card__name {
	font-family: var(--vp-font-h);
	font-weight: 600;
	font-size: 13.5px;
	line-height: 1.2;
	color: var(--aq-ink);
}
/* Cienka linia z kropką pośrodku */
.vendo-layout-v2 .vendo-loc-card__rule {
	display: flex; align-items: center; justify-content: center; gap: 5px;
	width: 72%; height: 6px;
}
.vendo-layout-v2 .vendo-loc-card__rule::before,
.vendo-layout-v2 .vendo-loc-card__rule::after {
	content: ""; flex: 1; height: 1px; background: var(--aq-ink); opacity: .55;
}
.vendo-layout-v2 .vendo-loc-card__rule i {
	width: 5px; height: 5px; border-radius: 50%; background: var(--aq-turq); flex-shrink: 0;
}
.vendo-layout-v2 .vendo-loc-card--alt .vendo-loc-card__rule i { background: var(--aq-pink); }
.vendo-layout-v2 .vendo-loc-card__label { font-size: 10.5px; color: var(--aq-muted); }
.vendo-layout-v2 .vendo-loc-card__price {
	font-family: var(--vp-font-h);
	font-size: 17px;
	font-weight: 600;
	color: var(--aq-turq-ink);
	line-height: 1;
}
.vendo-layout-v2 .vendo-loc-card--alt .vendo-loc-card__price { color: var(--aq-pink-deep); }
.vendo-layout-v2 .vendo-loc-card__price.is-free { color: var(--aq-pink-deep); letter-spacing: .5px; }
.vendo-layout-v2 .vendo-loc-card--alt .vendo-loc-card__price.is-free { color: var(--aq-turq-ink); }

.vendo-layout-v2 .vendo-locations-next { margin-top: 14px; width: 100%; }

/* Podsumowanie: dopisek przy miejscu (np. „(GRATIS)") */
.vendo-layout-v2 .vendo-summary-sub { color: var(--aq-muted); font-weight: 500; font-size: 11.5px; }


/* ════════════════════════════════════════════════════════════════════════════
   ZAGĘSZCZENIE — treść ma zmieścić się na jednym ekranie
   ════════════════════════════════════════════════════════════════════════════ */

.vendo-layout-v2 .vendo-panel { min-height: 296px; }

/* Kalendarz */
.vendo-layout-v2 .vendo-cal-day  { min-height: 30px; font-size: 12px; }
.vendo-layout-v2 .vendo-cal-head { font-size: 10px; }
.vendo-layout-v2 .vendo-cal-nav-row { margin-bottom: 8px; }

/* Godziny — więcej kafelków w rzędzie, niższe */
.vendo-layout-v2 .vendo-slots-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
	gap: 7px;
}
.vendo-layout-v2 .vendo-slot-tile { padding: 8px 6px !important; font-size: 12px !important; }
.vendo-layout-v2 .vendo-selected-date { font-size: 12px; margin: 0 0 10px; }

/* Kalkulator metrażu — bloki typów bez własnych odstępów; jedyny odstęp
   daje padding-top na sąsiadującym bloku (reguła .vendo-sqm-block + …). */
.vendo-layout-v2 .vendo-sqm-block { margin: 0; padding: 0; }
.vendo-layout-v2 .vendo-sqm-block + .vendo-sqm-block { margin: 0; padding-top: 15px; }
.vendo-layout-v2 .vendo-sqm-note  { font-size: 11px; margin: 4px 0 8px; }
.vendo-layout-v2 .vendo-sqm-field label { font-size: 10.5px; }
.vendo-layout-v2 { --aq-input-h: 39px; }
.vendo-layout-v2 .vendo-sqm-field input,
.vendo-layout-v2 input.vendo-extra-dim { padding: 8px 10px !important; font-size: 13px !important; }

/* Podsumowanie zamówienia */
.vendo-layout-v2 .vendo-summary-row { padding: 7px 0; font-size: 12.5px; }
.vendo-layout-v2 .vendo-vat-note    { font-size: 11px; margin: 8px 0; }


/* ════════════════════════════════════════════════════════════════════════════
   RESPONSYWNOŚĆ
   ════════════════════════════════════════════════════════════════════════════ */

/* Stan proxy — chowamy wewnętrzne przyciski „Dalej" dopiero po podpięciu JS */
.vendo-layout-v2.vendo-has-proxy .vendo-panel .vendo-sqm-next,
.vendo-layout-v2.vendo-has-proxy .vendo-panel .vendo-extras-next,
.vendo-layout-v2.vendo-has-proxy .vendo-panel .vendo-btn-next,
.vendo-layout-v2.vendo-has-proxy .vendo-panel .vendo-btn-confirm-slots,
.vendo-layout-v2.vendo-has-proxy .vendo-panel .vendo-locations-next,
.vendo-layout-v2.vendo-has-proxy .vendo-panel .vendo-btn-add-to-cart { display: none !important; }
.vendo-layout-v2.vendo-has-proxy .vendo-panel .vendo-sqm-summary { display: none !important; }

@media (max-width: 1100px) {
	.vendo-layout-v2 .vendo-layout {
		grid-template-columns: 1fr;
		grid-template-areas: "left" "center" "right";
		gap: 14px;
	}
	.vendo-layout-v2 .vendo-col--right { position: static; }
	/* Na wąskim ekranie kroki układają się poziomo — pasek zamiast listy. */
	.vendo-layout-v2 .vendo-steps--side {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 4px;
	}
	.vendo-layout-v2 .vendo-whyus-panel { display: none; }
}

@media (max-width: 560px) {
	.vendo-layout-v2 { padding: 10px; }
	.vendo-layout-v2 .vendo-hero { flex-direction: row; align-items: center; }
	.vendo-layout-v2 .vendo-hero__img img { width: 40px; }
	.vendo-layout-v2 .vendo-loc-grid { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); }
	.vendo-layout-v2 .vendo-steps--side .vendo-step-label { font-size: 9.5px; }
}