/* =========================================================
   Camper Listings — frontend styles
   ========================================================= */
:root {
	--cl-accent: #f35120;
	--cl-font: 'Manrope', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* Globalnie Manrope dla wszystkich kontenerów wtyczki */
.cl-archive,
.cl-archive *,
.cl-single,
.cl-single *,
.cl-submit,
.cl-submit *,
.cl-account,
.cl-account *,
.cl-auth,
.cl-auth *,
.cl-block,
.cl-block *,
.cl-card,
.cl-card *,
.cl-section,
.cl-section *,
.cl-filters,
.cl-filters *,
.cl-archive-page,
.cl-archive-page *,
.cl-info-strip,
.cl-info-strip *,
.cl-hero,
.cl-hero *,
.cl-mapcard,
.cl-mapcard *,
.cl-sticky-bar,
.cl-sticky-bar *,
.cl-toggle-view,
.cl-pagination,
.cl-pagination * {
	font-family: var(--cl-font);
}

.cl-archive,
.cl-single,
.cl-submit,
.cl-account,
.cl-auth {
	font-family: 'Manrope', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	color: #131313;
	max-width: 1200px;
	margin: 0 auto;
}

.cl-archive *,
.cl-single *,
.cl-submit *,
.cl-account *,
.cl-auth * { box-sizing: border-box; }

/* ===================== ARCHIVE / LISTA ===================== */
.cl-archive__header {
	display: flex; align-items: center; justify-content: space-between;
	margin: 0 4px 16px;
}
.cl-archive__title {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #131313;
	margin: 0;
}

.cl-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.cl-grid--featured { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 1024px) { .cl-grid, .cl-grid--featured { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .cl-grid, .cl-grid--featured { grid-template-columns: 1fr; } }

.cl-empty { padding: 40px; text-align: center; color: #64748b; }

/* ===================== KARTA ===================== */
.cl-card {
	display: flex; flex-direction: column;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: box-shadow .25s ease, border-color .25s ease;
}
.cl-card:hover { box-shadow: 0 18px 40px rgba(15, 23, 42, .1); border-color: #cbd5e1; }

.cl-card__media {
	position: relative;
	aspect-ratio: 16 / 10;
	background-color: #e2e8f0;
	background-size: cover;
	background-position: center;
}
.cl-card__badge {
	position: absolute; top: 12px; left: 12px;
	background: #fbbf24; color: #131313;
	font-size: 12px; font-weight: 700;
	padding: 5px 12px; border-radius: 8px;
}
.cl-card__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 10px; }
.cl-card__title { font-size: 18px; font-weight: 700; margin: 0; line-height: 1.3; }
.cl-card__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.cl-chip {
	display: inline-block;
	padding: 4px 10px;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 500;
	color: #475569;
	background: #fff;
}
.cl-chip--light { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.3); color: #fff; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.cl-card__location {
	display: flex; align-items: center; gap: 6px;
	font-size: 13px; color: #64748b;
}

/* ===================== SINGLE ===================== */
.cl-single { padding: 0; }
.cl-single__hero {
	position: relative;
	min-height: 380px;
	border-radius: 8px;
	overflow: hidden;
	background-color: #131313;
	background-size: cover;
	background-position: center;
	margin-bottom: 16px;
}
.cl-single__hero-overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.7) 100%);
	padding: 32px;
	display: flex; flex-direction: column; justify-content: flex-end; gap: 20px;
	color: #fff;
}
.cl-single__hero-badge {
	display: inline-flex; align-self: flex-start;
	background: #fbbf24;
	color: #131313;
	font-size: 13px; font-weight: 700;
	padding: 6px 14px; border-radius: 8px;
}
.cl-single__hero-title { font-size: clamp(24px, 4vw, 40px); font-weight: 800; margin: 0; line-height: 1.15; max-width: 720px; }
.cl-single__hero-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cl-single__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }

.cl-btn {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 12px 22px;
	border-radius: 999px;
	font-size: 14px; font-weight: 600;
	background: #fff; color: #131313;
	border: 0; cursor: pointer;
	text-decoration: none;
	transition: background .2s ease, transform .15s ease;
}
.cl-btn:hover { background: #f1f5f9; }
.cl-btn--primary { background: var(--cl-accent); color: #fff; }
.cl-btn--primary:hover { background: #B82B00; }
.cl-btn--ghost { background: transparent; border: 1px solid #e2e8f0; }
.cl-btn--ghost:hover { background: #f8fafc; }
.cl-btn--danger { color: #dc2626; }
.cl-btn--danger:hover { background: #fee2e2; }
.cl-btn--sm { padding: 8px 14px; font-size: 13px; }
.cl-btn--block { width: 100%; justify-content: center; }

.cl-single__gallery {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 8px;
	margin-bottom: 24px;
}
@media (max-width: 720px) { .cl-single__gallery { grid-template-columns: repeat(3, 1fr); } }
.cl-single__gallery-item {
	position: relative;
	aspect-ratio: 1;
	border-radius: 8px;
	background-size: cover; background-position: center;
	background-color: #e2e8f0;
}
.cl-single__gallery-overlay {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	background: rgba(15,23,42,.55);
	color: #fff; font-size: 24px; font-weight: 700;
	border-radius: 8px;
}

.cl-single__info {
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
	padding: 24px;
	background: #fff;
	border-radius: 8px;
	margin-bottom: 24px;
}
@media (max-width: 720px) { .cl-single__info { grid-template-columns: repeat(2, 1fr); } }
.cl-info-block { display: flex; flex-direction: column; gap: 4px; }
.cl-info-block__icon { color: var(--cl-accent); margin-bottom: 4px; }
.cl-info-block__label { font-size: 13px; font-weight: 700; color: #131313; }
.cl-info-block__value { font-size: 14px; color: #475569; line-height: 1.5; }

.cl-single__section { background: #fff; border-radius: 8px; padding: 24px; margin-bottom: 16px; }
.cl-single__h2 { font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin: 0 0 16px; }
.cl-single__about { font-size: 15px; line-height: 1.7; color: #334155; }

.cl-offer-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
@media (max-width: 720px) { .cl-offer-grid { grid-template-columns: repeat(2, 1fr); } }
.cl-offer-pill {
	display: flex; align-items: center; gap: 10px;
	padding: 14px 16px;
	background: #f8fafc;
	border-radius: 8px;
	font-size: 14px; font-weight: 600;
	color: #131313;
}
.cl-offer-pill__dot {
	width: 8px; height: 8px; border-radius: 50%;
	background: var(--cl-accent);
}

/* ===================== FORMULARZE ===================== */
.cl-submit__title,
.cl-account__title { font-size: 24px; font-weight: 800; margin: 0 0 20px; }

.cl-form__section {
	background: #fff;
	border-radius: 8px;
	padding: 24px;
	margin-bottom: 16px;
	border: 1px solid #e2e8f0;
}
.cl-form__section h3 { font-size: 16px; font-weight: 700; margin: 0 0 16px; }
.cl-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 600px) { .cl-form__grid { grid-template-columns: 1fr; } }

.cl-field { display: block; margin-bottom: 14px; }
.cl-field > span {
	display: block;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 6px;
	color: #334155;
}
.cl-field input[type=text],
.cl-field input[type=tel],
.cl-field input[type=email],
.cl-field input[type=url],
.cl-field input[type=password],
.cl-field textarea {
	width: 100%;
	padding: 12px 14px;
	font-family: inherit;
	font-size: 14px;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	background: #fff;
	color: #131313;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.cl-field input:focus,
.cl-field textarea:focus {
	outline: none;
	border-color: var(--cl-accent);
	box-shadow: 0 0 0 3px rgba(243, 81, 32, .12);
}
.cl-field--full { grid-column: 1 / -1; }
.cl-field__hint { font-size: 13px; color: #64748b; margin: 0 0 12px; }

.cl-chip-select { display: flex; flex-wrap: wrap; gap: 8px; }
.cl-chip-option {
	display: inline-flex; align-items: center;
	padding: 8px 14px;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-size: 13px; font-weight: 500;
	cursor: pointer; user-select: none;
	transition: all .2s ease;
	background: #fff;
}
.cl-chip-option input { display: none; }
.cl-chip-option:hover { border-color: #cbd5e1; }
.cl-chip-option.is-active {
	background: #1e3a5f;
	color: #fff;
	border-color: #1e3a5f;
}

/* Uploader */
#cl-uploader { display: flex; flex-direction: column; gap: 12px; }
.cl-uploader__list { display: flex; flex-wrap: wrap; gap: 10px; }
.cl-uploader__item {
	position: relative;
	width: 110px; height: 110px;
	border-radius: 8px;
	overflow: hidden;
	background: #f1f5f9;
}
.cl-uploader__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cl-uploader__remove {
	position: absolute; top: 4px; right: 4px;
	width: 24px; height: 24px;
	border-radius: 50%;
	border: 0;
	background: rgba(15,23,42,.85); color: #fff;
	font-size: 16px; line-height: 1; cursor: pointer;
}
.cl-uploader__btn {
	display: inline-flex; align-items: center; gap: 8px;
	align-self: flex-start;
	padding: 10px 16px;
	border: 1px dashed #cbd5e1;
	border-radius: 8px;
	font-size: 14px; font-weight: 600;
	color: #475569; cursor: pointer;
	transition: border-color .2s ease, color .2s ease;
}
.cl-uploader__btn:hover { border-color: var(--cl-accent); color: var(--cl-accent); }

.cl-form__actions { display: flex; gap: 12px; margin-top: 20px; }
.cl-form__feedback { margin-top: 14px; font-size: 14px; }
.cl-form__feedback.is-error { color: #dc2626; }
.cl-form__feedback.is-success { color: #059669; }

/* ===================== PANEL KLIENTA ===================== */
.cl-account__head {
	display: flex; justify-content: space-between; align-items: center;
	gap: 20px; flex-wrap: wrap;
	margin-bottom: 24px;
}
.cl-account__hello { color: #64748b; margin: 4px 0 0; }
.cl-account__head-actions { display: flex; gap: 10px; }

.cl-account__empty {
	text-align: center;
	padding: 60px 20px;
	background: #fff;
	border-radius: 8px;
	color: #64748b;
}
.cl-account__empty svg { color: #cbd5e1; margin-bottom: 16px; }
.cl-account__empty h3 { color: #131313; margin: 0 0 8px; }
.cl-account__empty p { margin: 0 0 20px; }

.cl-account__list { display: flex; flex-direction: column; gap: 12px; }
.cl-account__item {
	display: flex; gap: 20px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	overflow: hidden;
}
.cl-account__item-media {
	flex: 0 0 160px;
	background-color: #e2e8f0;
	background-size: cover; background-position: center;
}
.cl-account__item-body { flex: 1; padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.cl-account__item-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cl-account__item-head h3 { font-size: 17px; font-weight: 700; margin: 0; }
.cl-account__item-meta { font-size: 13px; color: #64748b; margin: 0; }
.cl-account__item-actions { display: flex; gap: 8px; margin-top: auto; flex-wrap: wrap; }
@media (max-width: 600px) {
	.cl-account__item { flex-direction: column; }
	.cl-account__item-media { flex: 0 0 160px; height: 160px; }
}

.cl-status {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 11px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .04em;
}
.cl-status--green  { background: #dcfce7; color: #166534; }
.cl-status--yellow { background: #fef3c7; color: #92400e; }
.cl-status--gray   { background: #f1f5f9; color: #475569; }
.cl-status--gold   { background: #fef3c7; color: #131313; }

/* ===================== AUTH ===================== */
.cl-auth {
	max-width: 440px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 32px;
	margin: 40px auto;
}
.cl-auth__tabs { display: flex; gap: 8px; margin-bottom: 24px; border-bottom: 1px solid #e2e8f0; }
.cl-auth__tab {
	flex: 1;
	background: none; border: 0;
	padding: 12px 0;
	font-family: inherit;
	font-size: 14px; font-weight: 600;
	color: #94a3b8;
	cursor: pointer;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	transition: all .2s ease;
}
.cl-auth__tab.is-active { color: var(--cl-accent); border-bottom-color: var(--cl-accent); }
.cl-auth__form { display: none; }
.cl-auth__form.is-active { display: block; }
.cl-auth__form h2 { font-size: 22px; font-weight: 800; margin: 0 0 20px; }
.cl-auth__lost,
.cl-auth__tos { text-align: center; font-size: 13px; color: #64748b; margin-top: 14px; }
.cl-auth__tos a { color: #f35120; text-decoration: underline; font-weight: 600; }
.cl-auth__tos a:hover { color: #B82B00; }
.cl-auth__lost a { color: var(--cl-accent); text-decoration: none; }

.cl-error { padding: 16px; background: #fee2e2; color: #991b1b; border-radius: 8px; }

/* =========================================================
   v1.1 — Gwiazdki, mapa, opinie
   ========================================================= */

/* Gwiazdki */
.cl-stars { display: inline-flex; gap: 1px; font-size: 14px; line-height: 1; }
.cl-star { color: #cbd5e1; }
.cl-star.is-on { color: #fbbf24; }

/* Karta — ocena */
.cl-card__rating {
	display: flex; align-items: center; gap: 8px;
	font-size: 13px; color: #475569;
}
.cl-card__rating-text strong { color: #131313; font-weight: 700; margin-right: 2px; }

/* Mapa */
.cl-map { display: flex; flex-direction: column; gap: 10px; }
.cl-map__iframe { width: 100%; min-height: 320px; }
.cl-map__placeholder {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
	min-height: 220px;
	background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
	border-radius: 8px;
	color: #64748b;
	text-align: center;
	padding: 24px;
}
.cl-map__placeholder p { margin: 0; font-weight: 600; color: #131313; }
.cl-map__footer {
	display: flex; justify-content: space-between; align-items: center;
	gap: 12px; flex-wrap: wrap;
	font-size: 14px; color: #475569;
}

/* Opinie */
.cl-reviews__head {
	display: flex; justify-content: space-between; align-items: center;
	gap: 20px; flex-wrap: wrap;
	margin-bottom: 20px;
}
.cl-reviews__avg {
	display: flex; align-items: center; gap: 8px;
	font-size: 14px;
}
.cl-reviews__avg strong { font-size: 22px; font-weight: 800; color: #131313; }
.cl-reviews__count { color: #64748b; }
.cl-reviews__empty {
	padding: 30px;
	text-align: center;
	color: #64748b;
	background: #f8fafc;
	border-radius: 8px;
	margin: 0 0 20px;
}

.cl-reviews__list { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }
.cl-review {
	padding: 18px 20px;
	background: #f8fafc;
	border-radius: 8px;
	border: 1px solid #f1f5f9;
}
.cl-review__head {
	display: flex; justify-content: space-between; align-items: flex-start;
	gap: 12px; flex-wrap: wrap;
	margin-bottom: 10px;
}
.cl-review__author { display: flex; align-items: center; gap: 10px; }
.cl-review__avatar {
	width: 40px; height: 40px;
	border-radius: 50%;
	background: #64748b;
	color: #fff;
	display: flex; align-items: center; justify-content: center;
	font-weight: 700;
	font-size: 16px;
}
.cl-review__name { font-weight: 700; color: #131313; font-size: 14px; }
.cl-review__date { font-size: 12px; color: #94a3b8; }
.cl-review__content {
	font-size: 14px; line-height: 1.6;
	color: #334155;
}
.cl-review__content p { margin: 0 0 6px; }
.cl-review__content p:last-child { margin-bottom: 0; }

/* Formularz opinii */
.cl-review-form {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 24px;
}
.cl-review-form h3 { margin: 0 0 16px; font-size: 16px; font-weight: 700; }
.cl-rating-input {
	display: inline-flex; gap: 4px;
	margin-bottom: 16px;
}
.cl-rating-input__star {
	background: none; border: 0;
	font-size: 32px; line-height: 1;
	cursor: pointer;
	color: #cbd5e1;
	padding: 0 4px;
	transition: color .15s ease, transform .15s ease;
}
.cl-rating-input__star.is-on { color: #fbbf24; }
.cl-rating-input__star:hover { transform: scale(1.1); }


/* =========================================================
   v1.2 — Listings block (camper_featured / camper_grid)
   ========================================================= */
.cl-block {
	width: 100%;
	max-width: 100%;
	font-family: 'Manrope', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.cl-block * { box-sizing: border-box; }

.cl-block__head {
	display: flex; justify-content: space-between; align-items: baseline;
	gap: 20px; margin-bottom: 16px;
}
.cl-block__title {
	font-size: 14px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase;
	color: #131313; margin: 0;
}
.cl-block__all {
	font-size: 14px; font-weight: 600;
	color: #475569; text-decoration: none;
}
.cl-block__all:hover { color: #131313; }

/* ===== DESKTOP: GRID ===== */
.cl-block__inner {
	display: grid; gap: 20px;
}
.cl-block--cols-1 .cl-block__inner { grid-template-columns: 1fr; }
.cl-block--cols-2 .cl-block__inner { grid-template-columns: repeat(2, 1fr); }
.cl-block--cols-3 .cl-block__inner { grid-template-columns: repeat(3, 1fr); }
.cl-block--cols-4 .cl-block__inner { grid-template-columns: repeat(4, 1fr); }
.cl-block--cols-5 .cl-block__inner { grid-template-columns: repeat(5, 1fr); }
.cl-block--cols-6 .cl-block__inner { grid-template-columns: repeat(6, 1fr); }

/* Tablet: zmniejszamy o 1-2 kolumny */
@media (max-width: 1100px) {
	.cl-block--cols-5 .cl-block__inner,
	.cl-block--cols-6 .cl-block__inner { grid-template-columns: repeat(3, 1fr); }
	.cl-block--cols-4 .cl-block__inner { grid-template-columns: repeat(3, 1fr); }
	.cl-block--cols-3 .cl-block__inner { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 800px) {
	.cl-block--cols-3 .cl-block__inner,
	.cl-block--cols-4 .cl-block__inner,
	.cl-block--cols-5 .cl-block__inner,
	.cl-block--cols-6 .cl-block__inner { grid-template-columns: repeat(2, 1fr); }
}

/* Mobile: grid 1 kolumna (tryb grid) */
.cl-block--mobile-grid .cl-block__slide { width: 100%; }
@media (max-width: 560px) {
	.cl-block--mobile-grid .cl-block__inner { grid-template-columns: 1fr; }
}

/* ===== MOBILE: KARUZELA (swap) ===== */
/* Wrapper inner--swap: na desktop grid, na mobile karuzela */
.cl-block__inner--swap { display: grid; gap: 20px; }
.cl-block__inner--swap .cl-block__track { display: contents; }
.cl-block__inner--swap.cl-block--cols-1 .cl-block__track,
.cl-block--cols-1 .cl-block__inner--swap .cl-block__track { display: contents; }

/* Replikujemy kolumny — dlatego targetujemy .cl-block__inner--swap z .cl-block--cols-X */
.cl-block--cols-1 .cl-block__inner--swap { grid-template-columns: 1fr; }
.cl-block--cols-2 .cl-block__inner--swap { grid-template-columns: repeat(2, 1fr); }
.cl-block--cols-3 .cl-block__inner--swap { grid-template-columns: repeat(3, 1fr); }
.cl-block--cols-4 .cl-block__inner--swap { grid-template-columns: repeat(4, 1fr); }
.cl-block--cols-5 .cl-block__inner--swap { grid-template-columns: repeat(5, 1fr); }
.cl-block--cols-6 .cl-block__inner--swap { grid-template-columns: repeat(6, 1fr); }

.cl-block__dots { display: none; }

/* Przełącznik: na mobile zmieniamy grid -> flex carousel */
@media (max-width: 560px) {
	.cl-block--mobile-carousel .cl-block__inner--swap {
		display: block;
		position: relative;
	}
	.cl-block--mobile-carousel .cl-block__inner--swap .cl-block__track {
		display: flex;
		gap: 20px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		padding: 4px 4px 12px;
		margin: 0 -4px;
		scrollbar-width: none;
	}
	.cl-block--mobile-carousel .cl-block__inner--swap .cl-block__track::-webkit-scrollbar { display: none; }
	.cl-block--mobile-carousel .cl-block__slide {
		flex: 0 0 85%;
		scroll-snap-align: center;
		scroll-snap-stop: always;
	}
	.cl-block--mobile-carousel .cl-block__dots {
		display: flex;
		justify-content: center;
		gap: 6px;
		margin-top: 8px;
	}
	.cl-dot {
		width: 6px; height: 6px;
		border-radius: 999px;
		background: rgba(15,23,42,.2);
		border: 0;
		padding: 0;
		cursor: pointer;
		transition: width .25s ease, background .25s ease;
	}
	.cl-dot.is-active {
		width: 20px;
		background: var(--cl-accent, #f35120);
	}
}


/* =========================================================
   v1.3 — Warianty kart: LARGE i COMPACT
   ========================================================= */

/* ===== LARGE — wyróżnione ===== */
.cl-card--large {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: box-shadow .25s ease, border-color .25s ease, transform .25s ease;
}
.cl-card--large:hover {
	box-shadow: 0 20px 44px rgba(15, 23, 42, .12);
	border-color: #cbd5e1;
	transform: translateY(-2px);
}
.cl-card--large .cl-card__media {
	aspect-ratio: 16 / 10;
	background-color: #e2e8f0;
	background-size: cover;
	background-position: center;
	position: relative;
}
.cl-card--large .cl-card__badge {
	position: absolute;
	top: 12px; left: 12px;
	background: #fbbf24;
	color: #131313;
	font-size: 12px;
	font-weight: 700;
	padding: 5px 12px;
	border-radius: 8px;
}
.cl-card--large .cl-card__rating-pill {
	position: absolute;
	bottom: 12px; right: 12px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 6px 11px;
	background: rgba(15, 23, 42, .82);
	color: #fff;
	border-radius: 999px;
	font-size: 13px;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
.cl-card--large .cl-card__rating-pill strong { font-weight: 700; }
.cl-card--large .cl-card__rating-pill .cl-card__rating-count { opacity: .7; font-size: 12px; }

.cl-card--large .cl-card__body {
	padding: 18px 20px 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.cl-card--large .cl-card__title {
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0;
	color: #131313;
}
.cl-card--large .cl-card__excerpt {
	font-size: 14px;
	line-height: 1.5;
	color: #64748b;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.cl-card--large .cl-card__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.cl-card--large .cl-card__location {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: #64748b;
	margin-top: 4px;
}

/* ===== COMPACT — zwykłe ===== */
.cl-card--compact {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: box-shadow .2s ease, border-color .2s ease;
}
.cl-card--compact:hover {
	box-shadow: 0 12px 24px rgba(15, 23, 42, .08);
	border-color: #cbd5e1;
}
.cl-card--compact .cl-card__media {
	aspect-ratio: 4 / 3;
	background-color: #e2e8f0;
	background-size: cover;
	background-position: center;
	position: relative;
}
.cl-card--compact .cl-card__badge--sm {
	position: absolute;
	top: 8px; left: 8px;
	background: #fbbf24;
	color: #131313;
	font-size: 10px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 8px;
	letter-spacing: .02em;
}
.cl-card--compact .cl-card__body {
	padding: 12px 14px 14px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.cl-card--compact .cl-card__title {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	margin: 0;
	color: #131313;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.cl-card--compact .cl-card__rating {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: #64748b;
}
.cl-card--compact .cl-card__rating strong { color: #131313; font-weight: 700; }
.cl-card--compact .cl-card__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}
.cl-card--compact .cl-chip {
	font-size: 11px;
	padding: 2px 7px;
	border-radius: 8px;
}
.cl-card--compact .cl-card__location {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: #94a3b8;
	margin-top: 2px;
}

/* =========================================================
   v1.3 — Mobile breakpoint do 720px (zgodnie z ustaleniami)
   ========================================================= */
@media (max-width: 720px) {
	.cl-block--mobile-grid .cl-block__inner,
	.cl-block--mobile-grid .cl-block__inner--swap {
		grid-template-columns: 1fr !important;
	}
	.cl-block--mobile-carousel .cl-block__inner--swap {
		display: block !important;
		position: relative;
	}
	.cl-block--mobile-carousel .cl-block__inner--swap .cl-block__track {
		display: flex !important;
		gap: 20px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		padding: 4px 4px 12px;
		margin: 0 -4px;
		scrollbar-width: none;
	}
	.cl-block--mobile-carousel .cl-block__inner--swap .cl-block__track::-webkit-scrollbar { display: none; }
	.cl-block--mobile-carousel .cl-block__slide {
		flex: 0 0 85%;
		scroll-snap-align: center;
		scroll-snap-stop: always;
	}
	/* Compact w karuzeli — węższe slajdy */
	.cl-block--mobile-carousel.cl-block--variant-compact .cl-block__slide {
		flex: 0 0 60%;
	}
	.cl-block--mobile-carousel .cl-block__dots {
		display: flex !important;
		justify-content: center;
		gap: 6px;
		margin-top: 8px;
	}
}


/* =========================================================
   v1.4 — Chipy z ikonkami "Co oferujemy"
   ========================================================= */
.cl-chip--icon {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 500;
	color: #334155;
	background: #fff;
	line-height: 1;
	transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.cl-chip--icon .cl-chip__icon {
	width: 16px;
	height: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--cl-accent, #f35120);
	flex-shrink: 0;
}
.cl-chip--icon .cl-chip__icon svg {
	width: 100%;
	height: 100%;
	display: block;
}
.cl-chip--icon .cl-chip__label { line-height: 1; }

.cl-card:hover .cl-chip--icon {
	border-color: #cbd5e1;
}

/* Kompaktowy chip */
.cl-chip--icon.cl-chip--sm {
	padding: 4px 9px;
	font-size: 11px;
	gap: 4px;
	border-radius: 8px;
}
.cl-chip--icon.cl-chip--sm .cl-chip__icon {
	width: 13px;
	height: 13px;
}

/* Ikona adresu — szara (spójność z tekstem adresu) */
.cl-card__location svg {
	color: #64748b;
	flex-shrink: 0;
}

/* Większy odstęp pod tytułem w karcie large – pasuje do screena */
.cl-card--large .cl-card__body {
	gap: 20px;
	padding: 18px 22px 22px;
}
.cl-card--large .cl-card__title {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -.01em;
	margin: 0;
	line-height: 1.3;
}
.cl-card--large .cl-card__chips {
	gap: 8px;
}


/* =========================================================
   v1.5 — Konfigurowalne kolumny na tablet / mobile
   ========================================================= */

/* TABLET (≤1100px) — nadpisuje domyślny auto-fallback */
@media (max-width: 1100px) {
	.cl-block--tablet-1 .cl-block__inner,
	.cl-block--tablet-1 .cl-block__inner--swap { grid-template-columns: 1fr !important; }
	.cl-block--tablet-2 .cl-block__inner,
	.cl-block--tablet-2 .cl-block__inner--swap { grid-template-columns: repeat(2, 1fr) !important; }
	.cl-block--tablet-3 .cl-block__inner,
	.cl-block--tablet-3 .cl-block__inner--swap { grid-template-columns: repeat(3, 1fr) !important; }
	.cl-block--tablet-4 .cl-block__inner,
	.cl-block--tablet-4 .cl-block__inner--swap { grid-template-columns: repeat(4, 1fr) !important; }
}

/* MOBILE (≤720px) — tryb grid z wymuszoną liczbą kolumn */
@media (max-width: 720px) {
	.cl-block--mobile-grid.cl-block--mcols-1 .cl-block__inner,
	.cl-block--mobile-grid.cl-block--mcols-1 .cl-block__inner--swap {
		grid-template-columns: 1fr !important;
	}
	.cl-block--mobile-grid.cl-block--mcols-2 .cl-block__inner,
	.cl-block--mobile-grid.cl-block--mcols-2 .cl-block__inner--swap {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 10px;
	}
	.cl-block--mobile-grid.cl-block--mcols-3 .cl-block__inner,
	.cl-block--mobile-grid.cl-block--mcols-3 .cl-block__inner--swap {
		grid-template-columns: repeat(3, 1fr) !important;
		gap: 8px;
	}

	/* =====================================================
	   v1.6 — Wygląd kart na mobile (grid)
	   ===================================================== */

	/* === KARTA LARGE (wyróżnione) na mobile === */
	/* Mniejszy tytuł, opis ukryty, max 4 chipy */
	.cl-block--mobile-grid .cl-card--large .cl-card__title {
		font-size: 15px;
		line-height: 1.3;
	}
	.cl-block--mobile-grid .cl-card--large .cl-card__body {
		padding: 12px 14px 14px;
		gap: 8px;
	}
	.cl-block--mobile-grid .cl-card--large .cl-card__excerpt {
		display: none;
	}
	/* Pokaż maksymalnie 4 chipy "co oferujemy" */
	.cl-block--mobile-grid .cl-card--large .cl-card__chips .cl-chip:nth-child(n+5),
	.cl-block--mobile-grid .cl-card--large .cl-card__chips .cl-chip--icon:nth-child(n+5) {
		display: none;
	}

	/* Karta LARGE w gridzie 2 kolumny — jeszcze trochę bardziej kompaktowa */
	.cl-block--mobile-grid.cl-block--mcols-2 .cl-card--large .cl-card__title {
		font-size: 14px;
	}
	.cl-block--mobile-grid.cl-block--mcols-2 .cl-card--large .cl-card__body {
		padding: 10px 12px 12px;
		gap: 6px;
	}
	/* Przy 2 kolumnach pokaż max 3 chipy (żeby się zmieściły) */
	.cl-block--mobile-grid.cl-block--mcols-2 .cl-card--large .cl-card__chips .cl-chip:nth-child(n+4),
	.cl-block--mobile-grid.cl-block--mcols-2 .cl-card--large .cl-card__chips .cl-chip--icon:nth-child(n+4) {
		display: none;
	}

	/* === KARTA COMPACT (zwykłe oferty) na mobile === */
	/* Pełna nazwa, mniejszy font, chipy widoczne */
	.cl-block--mobile-grid .cl-card--compact .cl-card__title {
		font-size: 13px;
		line-height: 1.3;
		-webkit-line-clamp: unset; /* pełna nazwa, bez przycinania */
		display: block;
		overflow: visible;
	}
	.cl-block--mobile-grid .cl-card--compact .cl-card__body {
		padding: 10px 12px 12px;
		gap: 6px;
	}
	/* Chipy widoczne nawet przy mcols-3 (poprzednio ukrywaliśmy) */
	.cl-block--mobile-grid .cl-card--compact .cl-card__chips {
		display: flex;
		flex-wrap: wrap;
		gap: 4px;
	}
	.cl-block--mobile-grid .cl-card--compact .cl-chip,
	.cl-block--mobile-grid .cl-card--compact .cl-chip--icon {
		font-size: 10px;
		padding: 3px 7px;
		border-radius: 8px;
		gap: 3px;
	}
	.cl-block--mobile-grid .cl-card--compact .cl-chip--icon .cl-chip__icon {
		width: 11px;
		height: 11px;
	}

	/* Lokalizacja w compact mobile — pokazujemy, mała czcionka */
	.cl-block--mobile-grid .cl-card--compact .cl-card__location {
		font-size: 11px;
		gap: 3px;
		display: flex;
	}

	/* W gridzie 3 kolumny compact — pokaż max 2 chipy (i tak są małe) */
	.cl-block--mobile-grid.cl-block--mcols-3 .cl-card--compact .cl-card__chips .cl-chip:nth-child(n+3),
	.cl-block--mobile-grid.cl-block--mcols-3 .cl-card--compact .cl-card__chips .cl-chip--icon:nth-child(n+3) {
		display: none;
	}
	/* Przy 3 kolumnach jeszcze mniejszy tytuł */
	.cl-block--mobile-grid.cl-block--mcols-3 .cl-card--compact .cl-card__title {
		font-size: 12px;
	}
	.cl-block--mobile-grid.cl-block--mcols-3 .cl-card--compact .cl-card__body {
		padding: 8px 10px 10px;
		gap: 5px;
	}
}

/* =========================================================
   v1.6.1 — Adres na mobile mniejszy
   ========================================================= */
@media (max-width: 720px) {
	.cl-block .cl-card__location {
		font-size: 11px;
		gap: 4px;
		line-height: 1.3;
	}
	.cl-block .cl-card__location svg {
		width: 11px !important;
		height: 11px !important;
		flex-shrink: 0;
	}
	/* Long adres elegancko obcinamy w jednej linii */
	.cl-block .cl-card__location span {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		min-width: 0;
	}
}

/* =========================================================
   v1.6.2 — Adres na mobile jeszcze mniejszy (override hard)
   ========================================================= */
@media (max-width: 720px) {
	.cl-block .cl-card .cl-card__location {
		font-size: 12px !important;
		gap: 4px !important;
		line-height: 1.2 !important;
		color: #94a3b8;
	}
	.cl-block .cl-card .cl-card__location svg {
		width: 12px !important;
		height: 12px !important;
		flex-shrink: 0;
		stroke-width: 2 !important;
	}
	.cl-block .cl-card .cl-card__location span {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		min-width: 0;
	}
}

/* =========================================================
   v1.7.1 — Stała wysokość kart w rzędzie
   ========================================================= */

/* Kontener gridu zawsze rozciąga karty na pełną wysokość rzędu */
.cl-block__inner,
.cl-block__inner--swap {
	align-items: stretch;
}

/* Slajdy/komórki muszą być flexem, żeby karta rosła do pełnej wysokości */
.cl-block__slide {
	display: flex;
}

/* === Karta LARGE === */
.cl-card--large {
	display: flex !important;
	flex-direction: column;
	width: 100%;
	height: 100%;
}
.cl-card--large .cl-card__media {
	flex-shrink: 0;
}
.cl-card--large .cl-card__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}
/* Tytuł zawsze rezerwuje miejsce na 2 linie */
.cl-card--large .cl-card__title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;   /* 2 linie × line-height 1.3 */
}
/* Chipy rosną — wypychają lokalizację na sam dół */
.cl-card--large .cl-card__chips {
	flex: 1 1 auto;
	align-content: flex-start;
}
/* Lokalizacja zawsze na dole karty */
.cl-card--large .cl-card__location {
	margin-top: auto;
	padding-top: 8px;
}

/* === Karta COMPACT === */
.cl-card--compact {
	display: flex !important;
	flex-direction: column;
	width: 100%;
	height: 100%;
}
.cl-card--compact .cl-card__media {
	flex-shrink: 0;
}
.cl-card--compact .cl-card__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}
.cl-card--compact .cl-card__title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
}
.cl-card--compact .cl-card__chips {
	flex: 1 1 auto;
	align-content: flex-start;
}
.cl-card--compact .cl-card__location {
	margin-top: auto;
	padding-top: 6px;
}


/* =========================================================
   v1.8 — Archiwum, paginacja, panel filtrów
   ========================================================= */

/* Pasek nad listą */
.cl-archive__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 18px;
}
.cl-archive__count {
	font-size: 14px;
	color: #475569;
}
.cl-archive__count strong { color: #131313; }

.cl-archive__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.cl-active-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 10px;
	background: #f1f5f9;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	color: #131313;
	text-decoration: none;
	transition: background .2s ease;
}
.cl-active-chip:hover { background: #e2e8f0; }
.cl-active-chip span { color: #64748b; font-size: 14px; }
.cl-active-chip--clear { color: #dc2626; background: transparent; padding-left: 6px; }
.cl-active-chip--clear:hover { background: #fee2e2; }

/* Paginacja */
.cl-pagination {
	display: flex;
	justify-content: center;
	gap: 6px;
	margin-top: 28px;
}
.cl-pagination .cl-page {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 10px;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	background: #fff;
	color: #131313;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: all .2s ease;
}
.cl-pagination .cl-page:hover {
	background: #f35120;
	color: #fff;
	border-color: #f35120;
}
.cl-pagination .cl-page.current {
	background: var(--cl-accent, #f35120);
	color: #fff;
	border-color: var(--cl-accent, #f35120);
}
.cl-pagination .cl-page.current:hover {
	background: #B82B00;
	border-color: #B82B00;
}
.cl-pagination .cl-page.dots {
	border: 0;
	background: transparent;
	cursor: default;
}

/* Brak wyników */
.cl-archive__empty {
	text-align: center;
	padding: 60px 20px;
	background: #fff;
	border-radius: 8px;
	color: #64748b;
}
.cl-archive__empty svg { color: #cbd5e1; margin-bottom: 16px; }
.cl-archive__empty p { margin: 0 0 18px; font-size: 15px; }

/* =========================================================
   Panel filtrów [camper_filters]
   ========================================================= */
.cl-filters {
	font-family: 'Manrope', system-ui, -apple-system, sans-serif;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 24px;
	max-width: 320px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.cl-filters * { box-sizing: border-box; }

.cl-filters__title {
	font-size: 18px;
	font-weight: 800;
	margin: 0;
	color: #131313;
}

.cl-filters__group {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.cl-filters__label {
	font-size: 14px;
	font-weight: 700;
	color: #131313;
	margin-bottom: 2px;
}

/* Select */
.cl-select {
	position: relative;
}
.cl-select select {
	width: 100%;
	appearance: none;
	-webkit-appearance: none;
	padding: 13px 38px 13px 16px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	color: #131313;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
}
.cl-select::after {
	content: "";
	position: absolute;
	right: 16px;
	top: 50%;
	width: 8px;
	height: 8px;
	border-right: 2px solid #131313;
	border-bottom: 2px solid #131313;
	transform: translateY(-70%) rotate(45deg);
	pointer-events: none;
}

/* Checkboxy */
.cl-check {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 6px 0;
	cursor: pointer;
	font-size: 14px;
	color: #131313;
}
.cl-check input[type=checkbox] {
	appearance: none;
	-webkit-appearance: none;
	width: 20px;
	height: 20px;
	border: 1.5px solid #cbd5e1;
	border-radius: 8px;
	cursor: pointer;
	position: relative;
	flex-shrink: 0;
	background: #fff;
	transition: all .15s ease;
}
.cl-check input[type=checkbox]:checked {
	background: #131313;
	border-color: #131313;
}
.cl-check input[type=checkbox]:checked::after {
	content: "";
	position: absolute;
	left: 5px;
	top: 1px;
	width: 6px;
	height: 11px;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(45deg);
}
.cl-check--nested { padding-left: 18px; }

/* Wyszukiwarka miasta */
.cl-filters__search {
	position: relative;
}
.cl-filters__search svg {
	position: absolute;
	left: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: #94a3b8;
	pointer-events: none;
}
.cl-filters__search input {
	width: 100%;
	padding: 13px 14px 13px 42px;
	font-family: inherit;
	font-size: 14px;
	color: #131313;
	border: 0;
	border-radius: 8px;
	background: #f1f5f9;
}
.cl-filters__search input::placeholder { color: #94a3b8; }

/* Submit */
.cl-filters__submit {
	width: 100%;
	padding: 16px 20px;
	background: #f35120;       /* pomarańczowy akcent */
	color: #fff;
	border: 0;
	border-radius: 8px;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background .2s ease;
}
.cl-filters__submit:hover { background: #B82B00; }

.cl-filters__reset {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 12px 24px;
	background: #f35120;
	border: 2px solid #f35120;
	border-radius: 10px;
	color: #fff !important;
	font-size: 15px;
	line-height: 1;
	font-weight: 700;
	text-align: center;
	text-decoration: none !important;
	cursor: pointer;
	font-family: var(--cl-font);
	transition: all .3s;
	box-sizing: border-box;
	margin-top: 8px;
}
.cl-filters__reset:hover {
	background: #B82B00;
	border-color: #B82B00;
	color: #fff !important;
}

/* Mobile — panel filtrów może być pełnej szerokości */
@media (max-width: 720px) {
	.cl-filters {
		max-width: 100%;
		padding: 18px;
	}
}

/* v1.9 — Checkbox "Tylko wyróżnione" w filtrach */
.cl-check--highlight {
	padding: 10px 14px;
	background: #fef3c7;
	border-radius: 8px;
	font-weight: 600;
	color: #131313;
}
.cl-check--highlight:hover { background: #fde68a; }
.cl-check--highlight input[type=checkbox]:checked {
	background: #fbbf24;
	border-color: #fbbf24;
}

/* =========================================================
   v1.10 — Badge "Rodzaj" w prawym górnym rogu karty
   ========================================================= */

/* Bazowy styl badge'a rodzaju */
.cl-card__segment {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	color: #fff;
	background: #64748b; /* fallback */
	box-shadow: 0 2px 6px rgba(15, 23, 42, .15);
	white-space: nowrap;
	letter-spacing: .01em;
}
.cl-card__segment--sm {
	top: 8px;
	right: 8px;
	padding: 3px 8px;
	font-size: 10px;
	border-radius: 8px;
}

/* Kolory per rodzaj — usunięte. Wszystkie badge teraz białe z szarą ramką. */

/* =========================================================
   v1.10.2 — CTA "Sprawdź ofertę" w karcie
   ========================================================= */
.cl-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	align-self: flex-start;
	margin-top: auto;
	padding: 10px 18px;
	background: #1e3a5f;
	color: #fff !important;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	transition: background .2s ease, transform .15s ease;
}
.cl-card__cta svg { flex-shrink: 0; }

.cl-card:hover .cl-card__cta {
	background: #0f2742;
	transform: translateX(2px);
}

/* Compact CTA */
.cl-card__cta--sm {
	padding: 8px 14px;
	font-size: 12px;
	gap: 4px;
}

/* Trzymamy CTA pod lokalizacją — flexbox już to robi przez margin-top:auto */
.cl-card--large .cl-card__body,
.cl-card--compact .cl-card__body {
	gap: 10px;
}
.cl-card--large .cl-card__location,
.cl-card--compact .cl-card__location {
	margin-top: auto;
	padding-top: 8px;
}
.cl-card--large .cl-card__cta,
.cl-card--compact .cl-card__cta {
	margin-top: 4px;   /* niewielki odstęp pod adresem */
}

/* v1.13.1 — Ikonki przy checkboxach w panelu filtrów */
.cl-check--with-icon {
	gap: 8px;
}
.cl-check__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	color: #64748b;
	flex-shrink: 0;
	transition: color .15s ease;
}
.cl-check:hover .cl-check__icon,
.cl-check input:checked ~ .cl-check__icon { color: #1e3a5f; }
.cl-check__icon svg {
	width: 100%;
	height: 100%;
}
.cl-check--nested.cl-check--with-icon {
	padding-left: 18px;
}

/* =========================================================
   v1.14 — Mapa Google z markerami
   ========================================================= */
.cl-toggle-view {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	background: #fff;
	color: #131313;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all .2s ease;
}
.cl-toggle-view:hover {
	background: #475569;
	color: #fff;
	border-color: #475569;
}
.cl-toggle-view svg { flex-shrink: 0; }

.cl-map-container {
	display: none;
	margin-top: 18px;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid #e2e8f0;
	height: 80vh;
	min-height: 600px;
	max-height: 900px;
}
.cl-map-container.is-visible {
	display: block;
}
.cl-map {
	width: 100%;
	height: 100%;
	min-height: 0;
	max-height: none;
	background: #f1f5f9;
}
@media (max-width: 720px) {
	.cl-map-container {
		height: calc(100vh - 160px);
		min-height: 500px;
	}
}
.cl-map__empty {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	color: #64748b;
	font-family: inherit;
	font-size: 14px;
}

/* Booking-style info-window */
.cl-mapcard {
	width: 260px;
	font-family: 'Manrope', system-ui, sans-serif;
}
.cl-mapcard * { box-sizing: border-box; }
.cl-mapcard__img {
	width: 100%;
	height: 140px;
	background: #e2e8f0 center / cover;
	border-radius: 8px 8px 0 0;
}
.cl-mapcard__body {
	padding: 12px 4px 4px;
}
.cl-mapcard__top {
	display: flex;
	gap: 6px;
	margin-bottom: 6px;
	flex-wrap: wrap;
}
.cl-mapcard__segment {
	display: inline-block;
	padding: 3px 8px;
	background: #475569;
	color: #fff;
	border-radius: 8px;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
}
.cl-mapcard__segment--sprzedaz   { background: #2563eb; }
.cl-mapcard__segment--wynajem    { background: #16a34a; }
.cl-mapcard__segment--serwis     { background: #ea580c; }
.cl-mapcard__segment--kemping    { background: #0891b2; }
.cl-mapcard__segment--producent  { background: #7c3aed; }
.cl-mapcard__segment--sklep      { background: #db2777; }
.cl-mapcard__badge {
	display: inline-block;
	padding: 3px 8px;
	background: #fbbf24;
	color: #131313;
	border-radius: 8px;
	font-size: 10px;
	font-weight: 700;
}
.cl-mapcard__title {
	margin: 0 0 6px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: #131313;
}
.cl-mapcard__loc {
	font-size: 12px;
	color: #64748b;
	margin-bottom: 10px;
}
.cl-mapcard__cta {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 8px 14px;
	background: #1e3a5f;
	color: #fff !important;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
}
.cl-mapcard__cta:hover { background: #0f2742; }

@media (max-width: 720px) {
	.cl-mapcard { width: 220px; }
	.cl-mapcard__img { height: 110px; }
}

/* =========================================================
   v1.15 — Pojedyncze ogłoszenie — modularne sekcje
   ========================================================= */
.cl-single--full,
.cl-single--full * { box-sizing: border-box; }

.cl-single--full {
	max-width: 1100px;
	margin: 0 auto;
	font-family: 'Manrope', system-ui, -apple-system, sans-serif;
	color: #131313;
}
.cl-section {
	margin-top: 24px;
	background: #fff;
	border-radius: 8px;
	padding: 0;
	border: 1px solid #e2e8f0;
}
/* Sekcje z treścią — wewnętrzny padding, oprócz galerii i hero */
.cl-about-section,
.cl-offer-section,
.cl-map-section,
.cl-reviews-section {
	padding: 24px;
}
.cl-section__title {
	font-size: 18px;
	font-weight: 800;
	margin: 0 0 18px;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: #131313;
}

/* =========================================================
   HERO
   ========================================================= */
.cl-hero {
	position: relative;
	min-height: 460px;
	height: 100%;
	background-color: #1e293b;
	background-size: cover;
	background-position: center;
	border-radius: 8px;
	overflow: hidden;
}
.cl-hero__overlay {
	position: absolute; inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 20px 28px;
	background: linear-gradient(180deg, rgba(0,0,0,.0) 0%, rgba(0,0,0,.0) 40%, rgba(0,0,0,.75) 100%);
}
.cl-hero__top {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 20px;
}
.cl-hero__badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	background: #fbbf24;
	color: #131313;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 700;
}
.cl-hero__count {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	background: rgba(0, 0, 0, .55);
	color: #fff;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 600;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
.cl-hero__body { color: #fff; }
.cl-hero__title {
	font-size: clamp(22px, 3.5vw, 34px);
	font-weight: 800;
	line-height: 1.15;
	margin: 0 0 14px;
	letter-spacing: -.01em;
	max-width: 70%;
}
.cl-hero__chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 16px;
}
.cl-hero-chip {
	padding: 5px 14px;
	background: rgba(255, 255, 255, .15);
	color: #fff;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 600;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border: 1px solid rgba(255, 255, 255, .25);
}
.cl-hero__actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}
.cl-hero__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 22px;
	background: rgba(255, 255, 255, .95);
	color: #131313 !important;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none !important;
	transition: background .2s ease, color .2s ease;
	flex: 1 1 auto;
	justify-content: center;
}
.cl-hero__btn:hover,
.cl-hero__btn:focus,
.cl-hero__btn:active {
	background: #f35120;
	color: #fff !important;
	text-decoration: none !important;
}
.cl-hero__btn:hover svg,
.cl-hero__btn:focus svg { color: #fff; }
.cl-hero__btn svg { color: #1e3a5f; flex-shrink: 0; transition: color .2s ease; }

/* =========================================================
   GALERIA — układ 2+3 (jak na blogu) / siatka dla <5 zdjęć
   ========================================================= */
.cl-gallery-section {
	padding: 0;
	overflow: hidden;
}

/* Układ split: lewa kolumna 2 duże, prawa 3 mniejsze */
.cl-gallery--split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	min-height: 460px;
}
.cl-gallery__col {
	display: grid;
	gap: 8px;
}
.cl-gallery__col--left  { grid-template-rows: 1fr 1fr; }
.cl-gallery__col--right { grid-template-rows: 1fr 1fr 1fr; }

.cl-gallery__tile {
	display: block;
	border-radius: 8px;
	background-color: #e2e8f0;
	background-size: cover;
	background-position: center;
	cursor: zoom-in;
	position: relative;
	transition: transform .3s ease, filter .3s ease;
	min-height: 0;
}
.cl-gallery__tile:hover {
	transform: scale(1.01);
	filter: brightness(1.05);
}
.cl-gallery__tile--more::after {
	content: "";
	position: absolute; inset: 0;
	background: rgba(15, 23, 42, .65);
	border-radius: 8px;
}
.cl-gallery__more {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 22px;
	font-weight: 700;
	z-index: 1;
	gap: 4px;
}
.cl-gallery__hidden { display: none !important; }

/* Siatka prosta — gdy <5 zdjęć */
.cl-gallery--grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 8px;
}
.cl-gallery--grid .cl-gallery__tile {
	aspect-ratio: 4 / 3;
}

/* =========================================================
   INFO STRIP — 4 kafelki
   ========================================================= */
.cl-info-strip {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	background: #fff;
	border-radius: 8px;
	padding: 24px;
	margin-top: 24px;
	border: 1px solid #e2e8f0;
}
.cl-info-strip__item {
	padding: 0 20px;
	border-right: 1px solid #f1f5f9;
}
.cl-info-strip__item:last-child { border-right: 0; }
.cl-info-strip__item:first-child { padding-left: 0; }
.cl-info-strip__icon {
	color: #1e3a5f;
	margin-bottom: 6px;
}
.cl-info-strip__label {
	font-size: 14px;
	font-weight: 700;
	color: #131313;
	margin-bottom: 4px;
}
.cl-info-strip__value {
	font-size: 14px;
	color: #131313;
	margin-bottom: 8px;
	line-height: 1.5;
}
.cl-info-strip__value div { display: block; }
.cl-info-strip__link {
	display: inline-block;
	font-size: 13px;
	color: #1e3a5f;
	font-weight: 600;
	text-decoration: none;
}
.cl-info-strip__link:hover { color: #0f2742; text-decoration: underline; }

/* =========================================================
   O NAS
   ========================================================= */
.cl-about__text {
	font-size: 15px;
	line-height: 1.7;
	color: #131313;
}
.cl-about__toggle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 14px;
	padding: 0;
	background: transparent;
	color: #1e3a5f;
	border: 0;
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}
.cl-about__toggle:hover { color: #0f2742; }
.cl-about__toggle.is-expanded svg { transform: rotate(180deg); }
.cl-about__toggle svg { transition: transform .2s ease; }

/* =========================================================
   CO OFERUJEMY — siatka kafli, jednolita szarość
   ========================================================= */
.cl-offer-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
}
.cl-offer-tile {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #131313;
	min-height: 64px;
	transition: all .15s ease;
}
.cl-offer-tile:hover {
	background: #f1f5f9;
	border-color: #cbd5e1;
}
.cl-offer-tile__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	color: #64748b;
	flex-shrink: 0;
}
.cl-offer-tile__icon svg { width: 100%; height: 100%; }

/* (pastelowe tła per typ usunięte — wszędzie szarość jednolita) */

/* =========================================================
   MAPA
   ========================================================= */
.cl-map-card {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	background: #f8fafc;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid #e2e8f0;
}
.cl-map-card__img {
	display: block;
	aspect-ratio: 16 / 10;
	background: #e2e8f0 center / cover;
	min-height: 200px;
}
.cl-map-card__img--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #94a3b8;
}
.cl-map-card__body {
	padding: 28px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 20px;
}
.cl-map-card__address {
	font-size: 16px;
	font-weight: 600;
	color: #131313;
	line-height: 1.5;
}
.cl-map-card__open {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 18px;
	background: #fff;
	color: #131313 !important;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	align-self: flex-start;
	transition: all .2s ease;
}
.cl-map-card__open:hover { border-color: #1e3a5f; color: #1e3a5f !important; }

/* =========================================================
   OPINIE
   ========================================================= */
.cl-reviews-summary {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-bottom: 18px;
	padding-bottom: 18px;
	border-bottom: 1px solid #f1f5f9;
}
.cl-reviews-summary__score {
	font-size: 38px;
	font-weight: 800;
	color: #131313;
	line-height: 1;
}
.cl-reviews-summary__stars {
	display: flex;
	gap: 2px;
	font-size: 20px;
}
.cl-reviews-summary__count {
	color: #64748b;
	font-size: 13px;
}
.cl-star { color: #cbd5e1; }
.cl-star.is-on { color: #fbbf24; }

.cl-reviews-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
.cl-review {
	background: #f8fafc;
	border-radius: 8px;
	padding: 16px;
}
.cl-review__head {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
}
.cl-review__avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #64748b;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 14px;
	flex-shrink: 0;
}
.cl-review__name {
	font-size: 14px;
	font-weight: 700;
	color: #131313;
}
.cl-review__date {
	font-size: 12px;
	color: #64748b;
}
.cl-review__stars {
	display: flex;
	gap: 1px;
	margin-bottom: 8px;
	font-size: 14px;
}
.cl-review__text {
	font-size: 13px;
	line-height: 1.5;
	color: #475569;
}
.cl-review__text p { margin: 0; }
.cl-reviews-empty {
	color: #64748b;
	text-align: center;
	padding: 30px 20px;
}

/* =========================================================
   STICKY BAR (mobile)
   ========================================================= */
.cl-sticky-bar {
	display: none;
	position: fixed;
	bottom: 0; left: 0; right: 0;
	z-index: 999;
	background: #fff;
	padding: 10px 14px;
	gap: 8px;
	border-top: 1px solid #e2e8f0;
	box-shadow: 0 -4px 20px rgba(15, 23, 42, .08);
}
.cl-sticky-bar__btn {
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 12px 14px;
	background: #fff;
	color: #131313 !important;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
}
.cl-sticky-bar__btn--primary {
	background: #1e3a5f;
	color: #fff !important;
	border-color: #1e3a5f;
}
.cl-sticky-bar__btn--primary svg { color: #fff; }

/* =========================================================
   Mobile
   ========================================================= */
@media (max-width: 900px) {
	.cl-info-strip {
		grid-template-columns: 1fr 1fr;
		gap: 20px;
		padding: 18px;
	}
	.cl-info-strip__item {
		padding: 0;
		border: 0;
	}
	.cl-offer-grid {
		grid-template-columns: 1fr 1fr;
	}
	.cl-reviews-grid {
		grid-template-columns: 1fr;
	}
	.cl-map-card {
		grid-template-columns: 1fr;
	}
	.cl-hero__title {
		max-width: 100%;
	}
	.cl-hero {
		min-height: 320px;
	}
	.cl-sticky-bar { display: flex; }
	.cl-single--full { padding-bottom: 90px; }   /* miejsce na sticky bar */
}

@media (max-width: 600px) {
	.cl-section { padding: 18px; }
	/* Galeria na mobile: split zmienia się w siatkę 2 kolumny, pokazujemy 4 zdjęcia */
	.cl-gallery--split {
		grid-template-columns: 1fr 1fr;
		min-height: 0;
		gap: 6px;
	}
	.cl-gallery__col--left,
	.cl-gallery__col--right {
		grid-template-rows: auto;
	}
	.cl-gallery__col--left .cl-gallery__tile,
	.cl-gallery__col--right .cl-gallery__tile {
		aspect-ratio: 4 / 3;
	}
	/* Pokazujemy: 2 lewe + 2 pierwsze z prawej (3-cie z licznikiem) */
	.cl-gallery__col--right .cl-gallery__tile:nth-child(n+3):not(.cl-gallery__tile--more) {
		display: none;
	}
	.cl-gallery__more { font-size: 18px; }
	.cl-offer-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
	.cl-offer-tile { padding: 10px 12px; font-size: 12px; min-height: 56px; }
}

/* =========================================================
   Lightbox fallback (gdy camper-blog-grid niezainstalowany)
   ========================================================= */
.cl-lb {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .92);
	z-index: 99999;
	display: none;
	align-items: center;
	justify-content: center;
}
.cl-lb.is-open { display: flex; }
.cl-lb__img {
	max-width: 92vw;
	max-height: 85vh;
	border-radius: 8px;
	border: 2px solid #fff;
	background: #fff;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
	box-sizing: border-box;
}
.cl-lb__close,
.cl-lb__prev,
.cl-lb__next {
	position: absolute;
	background: rgba(255, 255, 255, .15);
	color: #fff;
	border: 0;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	cursor: pointer;
	font-size: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.cl-lb__close { top: 20px; right: 20px; }
.cl-lb__prev  { left: 20px;  top: 50%; transform: translateY(-50%); }
.cl-lb__next  { right: 20px; top: 50%; transform: translateY(-50%); }
.cl-lb__counter {
	position: absolute;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	background: rgba(255, 255, 255, .15);
	padding: 6px 14px;
	border-radius: 999px;
}

/* =========================================================
   v1.16 — KARUZELA [camper_carousel]
   ========================================================= */
.cl-carousel {
	position: relative;
	margin: 24px 0;
	font-family: var(--cl-font);
}

.cl-carousel__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 18px;
	flex-wrap: wrap;
}
.cl-carousel__title {
	font-size: 22px;
	font-weight: 800;
	color: #131313;
	margin: 0;
	letter-spacing: -.01em;
}
.cl-carousel__nav {
	display: flex;
	gap: 8px;
	align-items: center;
}
.cl-carousel__all {
	margin-right: 8px;
	color: #1e3a5f;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
}
.cl-carousel__all:hover { color: #0f2742; }

.cl-carousel__btn {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #fff;
	color: #131313;
	border: 1px solid #e2e8f0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all .15s ease;
	box-shadow: 0 2px 8px rgba(15, 23, 42, .06);
}
.cl-carousel__btn svg {
	width: 24px;
	height: 24px;
}
.cl-carousel__btn:hover:not(:disabled) {
	background: #1e3a5f;
	color: #fff;
	border-color: #1e3a5f;
	box-shadow: 0 4px 14px rgba(30, 58, 95, .25);
}
.cl-carousel__btn:disabled {
	opacity: .4;
	cursor: not-allowed;
}

.cl-carousel__viewport {
	overflow: hidden;
	margin: 0 -10px;
	padding: 0 10px;
	/* żeby cienie/transformy kart nie były ucinane od góry */
	padding-top: 4px;
	padding-bottom: 4px;
}
.cl-carousel__track {
	display: flex;
	gap: 20px;
	transition: transform .4s cubic-bezier(.22, .61, .36, 1);
	will-change: transform;
}

/* Slide — szerokość liczona z var */
.cl-carousel__slide {
	flex: 0 0 calc((100% - (var(--cl-cols-gap, 16px) * (var(--cl-cols, 4) - 1))) / var(--cl-cols, 4));
	min-width: 0;
}
.cl-carousel__slide > .cl-card {
	width: 100%;
}

/* Dots */
.cl-carousel__dots {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 18px;
}
.cl-carousel__dots:empty { display: none; }
.cl-carousel__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #cbd5e1;
	border: 0;
	cursor: pointer;
	transition: width .25s ease, background .25s ease;
	padding: 0;
}
.cl-carousel__dot.is-active {
	width: 24px;
	background: #f35120;
	border-radius: 4px;
}

/* Desktop — 4 karty widoczne, strzałki obok */
@media (min-width: 901px) {
	.cl-carousel { --cl-cols: 4; --cl-cols-gap: 16px; }
	.cl-carousel[data-columns="2"] { --cl-cols: 2; }
	.cl-carousel[data-columns="3"] { --cl-cols: 3; }
	.cl-carousel[data-columns="5"] { --cl-cols: 5; }
}

/* Tablet — 3 karty */
@media (max-width: 900px) and (min-width: 601px) {
	.cl-carousel { --cl-cols: 2.5; --cl-cols-gap: 14px; }
	.cl-carousel__track { gap: 20px; }
}

/* Mobile — 1.2 karty (peek następnej) */
@media (max-width: 600px) {
	.cl-carousel { --cl-cols: 1.2; --cl-cols-gap: 12px; }
	.cl-carousel__track { gap: 12px; }
	.cl-carousel__title { font-size: 18px; }
	.cl-carousel__btn { width: 48px; height: 48px; }
	.cl-carousel__btn svg { width: 20px; height: 20px; }
	.cl-carousel__viewport {
		margin: 0 -16px;
		padding: 4px 16px;
	}
	/* Schowaj strzałki na mobile — sterowanie przez swipe */
	.cl-carousel__btn { display: none; }
	/* Pokaż kropki tylko na mobile */
}

/* Wymuś żeby karta zachowywała się jak w siatce (gdy szablon ma .cl-card) */
.cl-carousel__slide .cl-card {
	display: flex;
	flex-direction: column;
	height: 100%;
}

/* =========================================================
   v1.17 — [camper_listing_segments] / [camper_listing_services]
   ========================================================= */
.cl-cats {
	max-width: 1200px;
	margin: 0 auto;
	font-family: var(--cl-font);
}

/* --- TILES --- */
.cl-cats--tiles .cl-cats__grid {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(3, 1fr);
}
.cl-cats--cols-1 .cl-cats__grid { grid-template-columns: 1fr; }
.cl-cats--cols-2 .cl-cats__grid { grid-template-columns: repeat(2, 1fr); }
.cl-cats--cols-3 .cl-cats__grid { grid-template-columns: repeat(3, 1fr); }
.cl-cats--cols-4 .cl-cats__grid { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 900px) {
	.cl-cats--cols-3 .cl-cats__grid,
	.cl-cats--cols-4 .cl-cats__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.cl-cats--tiles .cl-cats__grid { grid-template-columns: 1fr; }
}

.cl-cat-tile {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: all .2s ease;
}
.cl-cat-tile:hover {
	border-color: #cbd5e1;
	box-shadow: 0 6px 20px rgba(15, 23, 42, .08);
	transform: translateY(-2px);
}
.cl-cat-tile__img {
	aspect-ratio: 16 / 9;
	background: #f1f5f9 center / cover;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #cbd5e1;
}
.cl-cat-tile__body {
	padding: 16px 18px;
}
.cl-cat-tile__name {
	font-size: 16px;
	font-weight: 700;
	color: #131313;
	margin: 0 0 4px;
	letter-spacing: -.01em;
}
.cl-cat-tile__count {
	font-size: 13px;
	color: #64748b;
	font-weight: 500;
}

/* --- PILLS --- */
.cl-cats--pills .cl-cats__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.cl-cat-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 999px;
	text-decoration: none;
	color: #131313;
	font-size: 14px;
	font-weight: 600;
	transition: all .15s ease;
}
.cl-cat-pill:hover {
	background: #1e3a5f;
	color: #fff;
	border-color: #1e3a5f;
}
.cl-cat-pill__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 7px;
	background: #f1f5f9;
	color: #64748b;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	transition: all .15s ease;
}
.cl-cat-pill:hover .cl-cat-pill__count {
	background: rgba(255, 255, 255, .25);
	color: #fff;
}

/* Pills — kolorowe dla rodzajów (pasują do badge'y w kartach) */
.cl-cats--segments .cl-cat-pill--sprzedaz   { background: #2563eb; color: #fff; border-color: #2563eb; }
.cl-cats--segments .cl-cat-pill--wynajem    { background: #16a34a; color: #fff; border-color: #16a34a; }
.cl-cats--segments .cl-cat-pill--serwis     { background: #ea580c; color: #fff; border-color: #ea580c; }
.cl-cats--segments .cl-cat-pill--kemping    { background: #0891b2; color: #fff; border-color: #0891b2; }
.cl-cats--segments .cl-cat-pill--producent  { background: #7c3aed; color: #fff; border-color: #7c3aed; }
.cl-cats--segments .cl-cat-pill--sklep      { background: #db2777; color: #fff; border-color: #db2777; }
.cl-cats--segments .cl-cat-pill--inne       { background: #475569; color: #fff; border-color: #475569; }
.cl-cats--segments .cl-cat-pill:hover { opacity: .9; }
.cl-cats--segments .cl-cat-pill__count {
	background: rgba(255, 255, 255, .25);
	color: #fff;
}

/* --- LIST --- */
.cl-cats--list .cl-cats__list {
	list-style: none;
	padding: 0;
	margin: 0;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	overflow: hidden;
}
.cl-cats--list li {
	border-bottom: 1px solid #f1f5f9;
}
.cl-cats--list li:last-child { border-bottom: 0; }

.cl-cat-list-item {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 14px 18px;
	text-decoration: none;
	color: #131313;
	transition: all .15s ease;
}
.cl-cat-list-item:hover {
	background: #f8fafc;
}
.cl-cat-list-item:hover .cl-cat-list-item__arrow {
	transform: translateX(3px);
	color: #f35120;
}
.cl-cat-list-item__icon {
	color: #1e3a5f;
	flex-shrink: 0;
}
.cl-cat-list-item__name {
	font-size: 15px;
	font-weight: 600;
	flex: 1;
}
.cl-cat-list-item__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	height: 24px;
	padding: 0 8px;
	background: #f1f5f9;
	color: #64748b;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
}
.cl-cat-list-item__arrow {
	color: #cbd5e1;
	transition: transform .2s ease, color .2s ease;
}

/* --- WIDGET (sidebar) --- */
.cl-cats--widget {
	max-width: 100%;
}
.cl-cats--widget .cl-cats__list {
	background: transparent;
	border: 0;
	border-radius: 0;
	list-style: none;
	padding: 0;
	margin: 0;
}
.cl-cats--widget .cl-cats__list li {
	border-bottom: 1px solid #e2e8f0;
}
.cl-cats--widget .cl-cats__list li:first-child {
	border-top: 1px solid #e2e8f0;
}
.cl-cats--widget .cl-cat-list-item {
	padding: 10px 4px;
	font-size: 14px;
	gap: 8px;
}
.cl-cats--widget .cl-cat-list-item:hover {
	background: transparent;
}
.cl-cats--widget .cl-cat-list-item:hover .cl-cat-list-item__name {
	color: #f35120;
}
.cl-cats--widget .cl-cat-list-item__name {
	font-size: 14px;
	font-weight: 500;
	color: #131313;
	transition: color .15s ease;
}
.cl-cats--widget .cl-cat-list-item__count {
	background: transparent;
	color: #94a3b8;
	min-width: 0;
	padding: 0;
	font-weight: 500;
	font-size: 13px;
}
.cl-cats--widget .cl-cat-list-item__count::before { content: "("; }
.cl-cats--widget .cl-cat-list-item__count::after  { content: ")"; }
.cl-cats--widget .cl-cat-list-item__arrow {
	width: 14px;
	height: 14px;
}

/* =========================================================
   v1.18 — Taby segmentów + przycisk "Dodaj ogłoszenie"
   ========================================================= */

/* Wrap zewnętrzny */
.cl-tabs-wrap {
	margin: 0 0 24px;
	font-family: var(--cl-font);
}

/* --- Taby --- */
.cl-tabs {
	position: relative;
	max-width: 100%;
}
@media (min-width: 721px) {
	.cl-tabs {
		display: flex;
		align-items: center;
		gap: 8px;
	}
	.cl-tabs__scroll {
		flex: 1;
		min-width: 0;
		display: flex;
	}
	.cl-tabs__viewport {
		flex: 1;
		min-width: 0;          /* żeby flex shrink działał */
	}
	.cl-tabs__arrow {
		position: static;
		transform: none;
		flex-shrink: 0;
	}
	.cl-tabs--with-add .cl-add-btn--in-tabs {
		flex-shrink: 0;
		margin-left: 4px;
	}
}

.cl-tabs__viewport {
	overflow-x: auto;
	overflow-y: visible;
	scrollbar-width: none;        /* Firefox */
	-ms-overflow-style: none;     /* IE */
	padding: 4px 0;
	scroll-behavior: smooth;
}
.cl-tabs__viewport::-webkit-scrollbar { display: none; }

.cl-tabs__track {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: nowrap;
	width: max-content;       /* dopasuj do zawartości */
	min-width: 100%;
}

.cl-tab {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	color: #131313;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
	transition: all .15s ease;
	flex-shrink: 0;
}
.cl-tab:hover {
	border-color: #94a3b8;
}
.cl-tab.is-active {
	background: #1e3a5f;
	color: #fff;
	border-color: #1e3a5f;
}
.cl-tab__icon {
	display: inline-flex;
	align-items: center;
	color: currentColor;
}
.cl-tab__icon svg {
	width: 18px;
	height: 18px;
}

/* Loading state gridu podczas AJAX */
.cl-grid-target.is-loading,
[data-grid-args].is-loading {
	position: relative;
	min-height: 200px;
	transition: opacity .2s ease;
}
.cl-grid-target.is-loading > *,
[data-grid-args].is-loading > * {
	opacity: .35;
	pointer-events: none;
}
.cl-grid-target.is-loading::after,
[data-grid-args].is-loading::after {
	content: "";
	position: absolute;
	top: 40px; left: 50%;
	transform: translateX(-50%);
	width: 36px; height: 36px;
	border: 3px solid #e2e8f0;
	border-top-color: #f35120;
	border-radius: 50%;
	animation: cl-spin 0.8s linear infinite;
	z-index: 10;
}
@keyframes cl-spin {
	to { transform: translateX(-50%) rotate(360deg); }
}

/* --- Przycisk "Dodaj bezpłatne ogłoszenie" wewnątrz tracku --- */
.cl-add-btn--in-tabs {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 6px 18px 6px 6px;
	background: transparent;
	border-radius: 999px;
	color: #131313 !important;
	font-family: var(--cl-font);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none !important;
	transition: background .2s ease;
	cursor: pointer;
	flex-shrink: 0;
	margin-left: auto;       /* przyklej do prawej na desktopie */
	white-space: nowrap;
}
.cl-add-btn--in-tabs:hover {
	background: #fff5f0;
}
.cl-add-btn--in-tabs .cl-add-btn__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: #f35120;
	color: #fff;
	border-radius: 50%;
	flex-shrink: 0;
	transition: background .2s ease, transform .2s ease;
}
.cl-add-btn--in-tabs:hover .cl-add-btn__icon {
	background: #B82B00;
	transform: rotate(90deg);
}
.cl-add-btn--in-tabs .cl-add-btn__icon svg {
	width: 22px;
	height: 22px;
}

/* Standalone wariant (jeśli ktoś użyje [camper_add_listing_button] osobno) */
.cl-add-btn:not(.cl-add-btn--in-tabs) {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 8px 18px 8px 8px;
	background: transparent;
	border-radius: 999px;
	color: #131313 !important;
	font-family: var(--cl-font);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none !important;
	transition: background .2s ease;
	cursor: pointer;
}
.cl-add-btn:not(.cl-add-btn--in-tabs):hover { background: #fff5f0; }
.cl-add-btn:not(.cl-add-btn--in-tabs) .cl-add-btn__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: #f35120;
	color: #fff;
	border-radius: 50%;
	flex-shrink: 0;
	transition: background .2s ease, transform .2s ease;
}
.cl-add-btn:not(.cl-add-btn--in-tabs):hover .cl-add-btn__icon {
	background: #B82B00;
	transform: rotate(90deg);
}
.cl-add-btn:not(.cl-add-btn--in-tabs) .cl-add-btn__icon svg {
	width: 22px;
	height: 22px;
}

/* Mobile */
@media (max-width: 720px) {
	/* Wszystko płynie poziomo, swipe — wszystko już ustawione, tylko mniejszy gap */
	.cl-tabs__track {
		gap: 8px;
	}
	.cl-tab {
		padding: 9px 14px;
		font-size: 13px;
	}
	.cl-add-btn--in-tabs {
		margin-left: 8px;
	}
	/* Schowaj tekst przycisku na mobile — zostaje tylko ikona */
	.cl-add-btn--in-tabs .cl-add-btn__text {
		display: none;
	}
	.cl-add-btn--in-tabs {
		padding: 0;
	}
}

/* =========================================================
   v1.19 — Submit form + Account panel — przebudowa
   ========================================================= */

/* ============ SUBMIT FORM ============ */
.cl-submit {
	max-width: 860px;
	margin: 0 auto;
	font-family: var(--cl-font);
	color: #131313;
}
.cl-submit__header {
	margin-bottom: 32px;
}
.cl-submit__title {
	font-size: 32px;
	font-weight: 800;
	letter-spacing: -.02em;
	color: #131313;
	margin: 0 0 8px;
}
.cl-submit__subtitle {
	font-size: 15px;
	color: #64748b;
	margin: 0;
}

.cl-form__section {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 28px;
	margin-bottom: 20px;
}

.cl-form__section-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -.01em;
	color: #131313;
	margin: 0 0 20px;
	padding-bottom: 14px;
	border-bottom: 1px solid #f1f5f9;
}
.cl-form__section-title svg {
	color: #1e3a5f;
	flex-shrink: 0;
}

.cl-form__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}
@media (max-width: 720px) {
	.cl-form__grid { grid-template-columns: 1fr; }
}

.cl-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.cl-field--full,
.cl-field.cl-field--full {
	grid-column: 1 / -1;
}

.cl-field > span,
.cl-field__label {
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	display: flex;
	align-items: center;
	gap: 6px;
}

.cl-field__hint {
	font-size: 12px;
	font-weight: 500;
	color: #94a3b8;
	font-style: normal;
}
.cl-field__hint--block {
	display: block;
	margin: -6px 0 14px;
}

.cl-required {
	color: #f35120;
	font-style: normal;
	font-weight: 700;
}

.cl-field input[type="text"],
.cl-field input[type="email"],
.cl-field input[type="tel"],
.cl-field input[type="url"],
.cl-field input[type="number"],
.cl-field input[type="password"],
.cl-field textarea,
.cl-field select,
.cl-form input[type="text"],
.cl-form input[type="email"],
.cl-form input[type="tel"],
.cl-form input[type="url"],
.cl-form input[type="number"],
.cl-form input[type="password"],
.cl-form textarea,
.cl-form select {
	width: 100%;
	padding: 11px 14px;
	background: #fff;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	font-family: var(--cl-font);
	font-size: 14px;
	color: #131313;
	transition: border-color .15s ease, box-shadow .15s ease;
	box-sizing: border-box;
}
.cl-field input:hover,
.cl-field textarea:hover,
.cl-field select:hover {
	border-color: #94a3b8;
}
.cl-field input:focus,
.cl-field textarea:focus,
.cl-field select:focus {
	outline: none;
	border-color: #1e3a5f;
	box-shadow: 0 0 0 3px rgba(30, 58, 95, .12);
}
.cl-field input::placeholder,
.cl-field textarea::placeholder {
	color: #cbd5e1;
}
.cl-field textarea {
	resize: vertical;
	min-height: 90px;
	font-family: inherit;
}

/* Custom select arrow */
.cl-field select,
.cl-form select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	padding-right: 38px;
	cursor: pointer;
}

/* Region toggle (pretty radio replacing select) */
.cl-region-toggle {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
.cl-region-option {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 18px;
	background: #fff;
	border: 1.5px solid #e2e8f0;
	border-radius: 8px;
	cursor: pointer;
	transition: all .15s ease;
}
.cl-region-option:hover {
	border-color: #94a3b8;
	background: #f8fafc;
}
.cl-region-option.is-active {
	border-color: #1e3a5f;
	background: #f0f5fa;
}
.cl-region-option input[type="radio"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.cl-region-option__flag {
	font-size: 24px;
	line-height: 1;
}
.cl-region-option__label {
	font-size: 14px;
	font-weight: 600;
	color: #131313;
}
.cl-region-option.is-active .cl-region-option__label {
	color: #1e3a5f;
}

/* Uploader */
#cl-uploader {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.cl-uploader__list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.cl-uploader__item {
	position: relative;
	width: 100px;
	height: 100px;
	border-radius: 8px;
	overflow: hidden;
	background: #f1f5f9;
}
.cl-uploader__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.cl-uploader__remove {
	position: absolute;
	top: 4px;
	right: 4px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: rgba(0, 0, 0, .65);
	color: #fff;
	border: 0;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	font-weight: 700;
}
.cl-uploader__remove:hover {
	background: #f35120;
}

.cl-uploader__btn {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	width: 100px;
	height: 100px;
	background: #f8fafc;
	border: 2px dashed #cbd5e1;
	border-radius: 8px;
	color: #64748b;
	cursor: pointer;
	font-size: 12px;
	font-weight: 600;
	transition: all .15s ease;
	text-align: center;
}
.cl-uploader__btn:hover {
	background: #f0f5fa;
	border-color: #1e3a5f;
	color: #1e3a5f;
}
.cl-uploader__btn svg {
	flex-shrink: 0;
}
.cl-uploader__btn small {
	font-size: 10px;
	color: #94a3b8;
	font-weight: 500;
}

/* Form actions */
.cl-form__actions {
	display: flex;
	gap: 12px;
	margin-top: 24px;
	flex-wrap: wrap;
}

/* Buttons — ujednolicenie z border-radius 8px */
.cl-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 11px 22px;
	border-radius: 8px;
	border: 0;
	font-family: var(--cl-font);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: all .15s ease;
	white-space: nowrap;
}
.cl-btn--primary {
	background: #f35120;
	color: #fff;
}
.cl-btn--primary:hover {
	background: #B82B00;
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(243, 81, 32, .25);
}
.cl-btn--ghost {
	background: #fff;
	color: #131313;
	border: 1px solid #cbd5e1;
}
.cl-btn--ghost:hover {
	background: #f8fafc;
	border-color: #94a3b8;
	color: #131313;
}
.cl-btn--danger:hover {
	background: #fee2e2;
	border-color: #fca5a5;
	color: #b91c1c;
}
.cl-btn--sm {
	padding: 7px 12px;
	font-size: 13px;
}

.cl-form__feedback {
	margin-top: 16px;
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 14px;
	display: none;
}
.cl-form__feedback.is-success {
	display: block;
	background: #ecfdf5;
	color: #047857;
	border: 1px solid #a7f3d0;
}
.cl-form__feedback.is-error {
	display: block;
	background: #fef2f2;
	color: #b91c1c;
	border: 1px solid #fecaca;
}

/* ============ ACCOUNT PANEL ============ */
.cl-account {
	max-width: 1200px;
	margin: 0 auto;
	font-family: var(--cl-font);
	color: #131313;
}

.cl-account__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	margin-bottom: 32px;
	flex-wrap: wrap;
}
.cl-account__user {
	display: flex;
	align-items: center;
	gap: 16px;
}
.cl-account__avatar {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #1e3a5f;
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	font-weight: 700;
	flex-shrink: 0;
}
.cl-account__title {
	font-size: 24px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0 0 2px;
	color: #131313;
}
.cl-account__subtitle {
	font-size: 14px;
	color: #64748b;
	margin: 0;
}
.cl-account__header-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

/* Layout 2-kolumnowy */
.cl-account__layout {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: 28px;
	align-items: start;
}
@media (max-width: 900px) {
	.cl-account__layout {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}

/* Sidebar nav */
.cl-account__nav {
	display: flex;
	flex-direction: column;
	gap: 4px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 10px;
	position: sticky;
	top: 20px;
}
@media (max-width: 900px) {
	.cl-account__nav {
		position: static;
		flex-direction: row;
		padding: 6px;
		/* CF-29: zakładki panelu przewijalne w poziomie zamiast ucinać się na mobile */
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
	}
	.cl-account__nav-item { flex: 0 0 auto; white-space: nowrap; }
}

.cl-account__nav-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 14px;
	border-radius: 8px;
	color: #131313;
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
	transition: all .15s ease;
}
.cl-account__nav-item:hover {
	background: #f8fafc;
	color: #131313;
}
.cl-account__nav-item.is-active {
	background: #f0f5fa;
	color: #1e3a5f;
}
.cl-account__nav-item svg {
	color: #64748b;
	flex-shrink: 0;
}
.cl-account__nav-item.is-active svg {
	color: #1e3a5f;
}
.cl-account__nav-item span:first-of-type {
	flex: 1;
}
.cl-account__nav-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 7px;
	background: #f1f5f9;
	color: #64748b;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
}
.cl-account__nav-item.is-active .cl-account__nav-count {
	background: #1e3a5f;
	color: #fff;
}
@media (max-width: 900px) {
	.cl-account__nav-item {
		flex: 1;
		justify-content: center;
	}
	.cl-account__nav-item span:first-of-type {
		flex: initial;
	}
}

/* Content panel */
.cl-account__content {
	min-width: 0; /* żeby grid nie wybuchał */
}

.cl-account__panel {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 28px;
}
.cl-panel__head {
	margin-bottom: 24px;
	padding-bottom: 20px;
	border-bottom: 1px solid #f1f5f9;
}
.cl-panel__head h2 {
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -.01em;
	margin: 0 0 4px;
	color: #131313;
}
.cl-panel__head p {
	font-size: 14px;
	color: #64748b;
	margin: 0;
}

/* W panelu sekcje są bez ramki/cienia (są w panelu) */
.cl-account__panel .cl-form__section {
	background: transparent;
	border: 0;
	padding: 0 0 24px;
	margin-bottom: 24px;
	border-bottom: 1px solid #f1f5f9;
	border-radius: 0;
}
.cl-account__panel .cl-form__section:last-of-type {
	border-bottom: 0;
	margin-bottom: 16px;
	padding-bottom: 0;
}

/* Empty state */
.cl-account__empty {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 60px 30px;
	text-align: center;
}
.cl-account__empty svg {
	color: #cbd5e1;
	margin-bottom: 16px;
}
.cl-account__empty h3 {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 8px;
	color: #131313;
}
.cl-account__empty p {
	font-size: 14px;
	color: #64748b;
	margin: 0 0 20px;
}

/* Listings cards */
.cl-account__listings {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}
@media (max-width: 720px) {
	.cl-account__listings { grid-template-columns: 1fr; }
}

.cl-listing-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	overflow: hidden;
	transition: all .2s ease;
}
.cl-listing-card:hover {
	border-color: #cbd5e1;
	box-shadow: 0 4px 16px rgba(15, 23, 42, .06);
}
.cl-listing-card__media {
	aspect-ratio: 16 / 9;
	background: #f1f5f9 center / cover;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #cbd5e1;
	position: relative;
}
.cl-listing-card__featured {
	position: absolute;
	top: 10px;
	left: 10px;
	padding: 5px 10px;
	background: #fbbf24;
	color: #131313;
	font-size: 11px;
	font-weight: 700;
	border-radius: 8px;
	text-transform: uppercase;
	letter-spacing: .03em;
}
.cl-listing-card__body {
	padding: 16px 18px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}
.cl-listing-card__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 10px;
}
.cl-listing-card__head h3 {
	font-size: 15px;
	font-weight: 700;
	margin: 0;
	color: #131313;
	letter-spacing: -.01em;
	line-height: 1.3;
	flex: 1;
}
.cl-listing-card__meta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: #64748b;
	margin: 0;
}
.cl-listing-card__meta svg {
	color: #94a3b8;
	flex-shrink: 0;
}
.cl-listing-card__actions {
	display: flex;
	gap: 6px;
	margin-top: auto;
	padding-top: 8px;
	flex-wrap: wrap;
}

/* CF-37: na telefonie karty wizytówek w panelu jako kompaktowa lista (miniatura z lewej, treść z prawej) — wygodniej przy wielu wizytówkach. */
@media (max-width: 560px) {
	.cl-listing-card { flex-direction: row; align-items: stretch; }
	.cl-listing-card__media { aspect-ratio: 1 / 1; width: 92px; flex: 0 0 92px; }
	.cl-listing-card__featured { top: 6px; left: 6px; padding: 3px 6px; font-size: 9px; }
	.cl-listing-card__body { padding: 11px 13px; }
	.cl-listing-card__head h3 { font-size: 14px; }
	.cl-listing-card__actions { padding-top: 6px; }
}

/* Status badges */
.cl-status {
	display: inline-flex;
	align-items: center;
	padding: 3px 9px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .03em;
	flex-shrink: 0;
}
.cl-status--green  { background: #ecfdf5; color: #047857; }
.cl-status--yellow { background: #fffbeb; color: #b45309; }
.cl-status--gray   { background: #f1f5f9; color: #64748b; }
.cl-status--gold   { background: #fbbf24; color: #131313; }

/* =========================================================
   v1.20 — Usługi pogrupowane per rodzaj
   ========================================================= */
.cl-services-groups {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.cl-services-group {
	display: none;
	padding: 16px 18px;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
}
.cl-services-group.is-visible {
	display: block;
	animation: cl-fadein .25s ease-out;
}
@keyframes cl-fadein {
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 1; transform: translateY(0); }
}

.cl-services-group__title {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 700;
	color: #131313;
	margin: 0 0 12px;
	letter-spacing: -.01em;
}
.cl-services-group__dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #475569;
	flex-shrink: 0;
}
.cl-services-group__dot--sprzedaz  { background: #2563eb; }
.cl-services-group__dot--wynajem   { background: #16a34a; }
.cl-services-group__dot--serwis    { background: #ea580c; }
.cl-services-group__dot--kemping   { background: #0891b2; }
.cl-services-group__dot--producent { background: #7c3aed; }
.cl-services-group__dot--sklep     { background: #db2777; }
.cl-services-group__dot--inne      { background: #475569; }

/* Karta single — sekcja "Co oferujemy" z grupami */
.cl-single-offer-groups {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.cl-single-offer-group__title {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 700;
	color: #131313;
	margin: 0 0 12px;
	letter-spacing: -.01em;
}
.cl-single-offer-group__title .cl-services-group__dot {
	width: 10px;
	height: 10px;
}
.cl-single-offer-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.cl-single-offer-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 500;
	color: #131313;
}
.cl-single-offer-chip svg {
	color: #16a34a;
	flex-shrink: 0;
}

/* =========================================================
   v1.21 — Badge segmentu między tytułem a chipami
   ========================================================= */
.cl-card__segment-row {
	margin: 4px 0 6px;
}
.cl-card__segment-inline {
	display: inline-flex;
	align-items: center;
	padding: 4px 11px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: #131313;
	border-radius: 8px;
	background: #fff;
	border: 1px solid #e2e8f0;
}
/* (kolory per slug usunięte — wszystkie jednakowe) */

/* =========================================================
   v1.21 — Mobile: ukryj taby segmentów (przycisk dodawania też)
   ========================================================= */
@media (max-width: 720px) {
	.cl-tabs-wrap {
		display: none !important;
	}
}

/* =========================================================
   v1.21 — Hero: stacked badges (Wyróżniona + Rodzaj)
   ========================================================= */
.cl-hero__badges {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
}
.cl-hero__segment {
	display: inline-flex;
	align-items: center;
	padding: 6px 14px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: #131313;
	border-radius: 8px;
	background: #fff;
	border: 1px solid #e2e8f0;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
}
/* (kolory per slug usunięte — wszystkie jednakowe) */

/* =========================================================
   v1.21 — User menu (Zaloguj / Moje konto z dropdownem)
   ========================================================= */
.cl-user-menu {
	position: relative;
	display: inline-flex;
	align-items: center;
	font-family: var(--cl-font);
	color: #131313;
}

/* Wariant gość (login link) */
.cl-user-menu--guest {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px 8px 8px;
	background: transparent;
	border-radius: 999px;
	color: #131313 !important;
	text-decoration: none !important;
	font-weight: 600;
	font-size: 14px;
	transition: background .15s ease;
}
.cl-user-menu--guest:hover {
	background: #f8fafc;
}
.cl-user-menu--guest .cl-user-menu__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	background: #1e3a5f;
	color: #fff;
	border-radius: 50%;
	flex-shrink: 0;
}

/* Wariant zalogowany */
.cl-user-menu--logged {
	display: inline-block;
}
.cl-user-menu__trigger {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 14px 6px 6px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 999px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	color: #131313;
	cursor: pointer;
	transition: all .15s ease;
}
.cl-user-menu__trigger:hover {
	border-color: #94a3b8;
	background: #f8fafc;
}
.cl-user-menu__avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: #1e3a5f;
	color: #fff;
	border-radius: 50%;
	font-weight: 700;
	font-size: 14px;
	flex-shrink: 0;
}
.cl-user-menu__avatar--lg {
	width: 44px;
	height: 44px;
	font-size: 18px;
}
.cl-user-menu__caret {
	color: #94a3b8;
	transition: transform .2s ease;
}
.cl-user-menu--logged.is-open .cl-user-menu__caret {
	transform: rotate(180deg);
}

/* Dropdown */
.cl-user-menu__dropdown {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	min-width: 260px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	box-shadow: 0 12px 40px rgba(15, 23, 42, .12);
	padding: 6px;
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: all .2s ease;
}
.cl-user-menu--logged.is-open .cl-user-menu__dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.cl-user-menu__user-info {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border-bottom: 1px solid #f1f5f9;
	margin-bottom: 6px;
}
.cl-user-menu__name {
	font-weight: 700;
	font-size: 14px;
	color: #131313;
	letter-spacing: -.01em;
}
.cl-user-menu__email {
	font-size: 12px;
	color: #64748b;
	margin-top: 2px;
}

.cl-user-menu__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 14px;
	border-radius: 6px;
	color: #131313 !important;
	text-decoration: none !important;
	font-size: 14px;
	font-weight: 500;
	transition: background .15s ease;
}
.cl-user-menu__item:hover {
	background: #f8fafc;
}
.cl-user-menu__item svg {
	color: #64748b;
	flex-shrink: 0;
}
.cl-user-menu__item--danger {
	color: #b91c1c !important;
	margin-top: 4px;
	border-top: 1px solid #f1f5f9;
	border-radius: 0 0 6px 6px;
	padding-top: 12px;
}
.cl-user-menu__item--danger:hover {
	background: #fef2f2;
}
.cl-user-menu__item--danger svg {
	color: #b91c1c;
}

/* Mobile: bez tekstu, tylko ikona */
@media (max-width: 600px) {
	.cl-user-menu--guest .cl-user-menu__label,
	.cl-user-menu__trigger .cl-user-menu__label {
		display: none;
	}
	.cl-user-menu--guest { padding: 4px; }
	.cl-user-menu__trigger { padding: 4px; }
	.cl-user-menu__dropdown {
		right: 0;
		min-width: 240px;
	}
}

/* =========================================================
   v1.22 — Filters: mobile bottom sheet + AJAX
   ========================================================= */
.cl-filters-wrap {
	position: relative;
	font-family: var(--cl-font);
}

/* Mobile button — UKRYTY domyślnie (pokazujemy tylko na mobile) */
.cl-filters__mobile-btn {
	display: none;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 12px 18px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-family: var(--cl-font);
	font-size: 14px;
	font-weight: 700;
	color: #131313;
	cursor: pointer;
	transition: all .15s ease;
}
.cl-filters__mobile-btn:hover {
	border-color: #94a3b8;
}
.cl-filters__mobile-btn svg {
	color: #1e3a5f;
	flex-shrink: 0;
}
.cl-filters__mobile-btn > span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 1;
	justify-content: center;
}
.cl-filters__mobile-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 7px;
	background: #f35120;
	color: #fff;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
}

/* Backdrop */
.cl-filters__backdrop {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(15, 23, 42, .55);
	z-index: 9998;
	opacity: 0;
	transition: opacity .25s ease;
}
.cl-filters__backdrop.is-open {
	display: block;
}
.cl-filters__backdrop.is-visible {
	opacity: 1;
}

/* Sheet header — UKRYTY na desktop */
.cl-filters__sheet-head {
	display: none;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	border-bottom: 1px solid #f1f5f9;
	background: #fff;
	position: sticky;
	top: 0;
	z-index: 1;
}
.cl-filters__sheet-title {
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -.01em;
	margin: 0;
	color: #131313;
}
.cl-filters__sheet-close {
	width: 36px;
	height: 36px;
	border: 0;
	background: #f1f5f9;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: #131313;
	padding: 0;
}
.cl-filters__sheet-close:hover {
	background: #e2e8f0;
}

/* AJAX loading state — gridu */
[data-cl-archive].is-loading,
[data-grid-args].is-loading {
	position: relative;
	min-height: 200px;
}
[data-cl-archive].is-loading > *:not(.cl-archive-loading),
[data-grid-args].is-loading > *:not(.cl-archive-loading) {
	opacity: .35;
	pointer-events: none;
	transition: opacity .15s ease;
}
[data-cl-archive].is-loading::after,
[data-grid-args].is-loading::after {
	content: "";
	position: absolute;
	top: 60px; left: 50%;
	transform: translateX(-50%);
	width: 40px; height: 40px;
	border: 3px solid #e2e8f0;
	border-top-color: #f35120;
	border-radius: 50%;
	animation: cl-spin 0.8s linear infinite;
	z-index: 10;
}

/* MOBILE: aktywuje sheet */
@media (max-width: 900px) {
	.cl-filters__mobile-btn {
		display: inline-flex;
	}
	.cl-filters__sheet-head {
		display: flex;
	}

	.cl-filters__sheet {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		max-height: 90vh;
		background: #fff;
		border-radius: 16px 16px 0 0;
		z-index: 9999;
		box-shadow: 0 -10px 40px rgba(15, 23, 42, .18);
		transform: translateY(100%);
		transition: transform .3s cubic-bezier(.22, .61, .36, 1);
		display: flex;
		flex-direction: column;
		overflow: hidden;
	}
	.cl-filters__sheet.is-open {
		transform: translateY(0);
	}

	.cl-filters__sheet .cl-filters {
		overflow-y: auto;
		overflow-x: hidden;
		flex: 1;
		padding: 20px;
		padding-bottom: 100px;            /* miejsce na sticky submit */
		-webkit-overflow-scrolling: touch;
	}

	/* Sticky footer z przyciskiem */
	.cl-filters__submit {
		position: sticky;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 16px -20px -20px !important;
		padding: 14px 20px !important;
		border-radius: 0 !important;
		box-shadow: 0 -4px 12px rgba(15, 23, 42, .06);
		z-index: 2;
	}

	/* Backdrop blokuje scroll body */
	body.cl-filters-open {
		overflow: hidden;
	}
}

/* Desktop: ukryj backdrop i header (są mobile-only) */
@media (min-width: 901px) {
	.cl-filters__backdrop,
	.cl-filters__sheet-head {
		display: none !important;
	}
}

/* =========================================================
   v1.23 — Powiadomienia + Panel admina
   ========================================================= */

/* ============ DZWONECZEK ============ */
.cl-notif-bell {
	position: relative;
	display: inline-block;
}
.cl-notif-bell__btn {
	width: 40px;
	height: 40px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 50%;
	cursor: pointer;
	color: #131313;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	position: relative;
	transition: all .15s ease;
}
.cl-notif-bell__btn:hover {
	border-color: #94a3b8;
	background: #f8fafc;
}
.cl-notif-bell__count {
	position: absolute;
	top: -4px;
	right: -4px;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	background: #f35120;
	color: #fff;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 2px solid #fff;
}

.cl-notif-bell__dropdown {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	min-width: 360px;
	max-width: 400px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	box-shadow: 0 12px 40px rgba(15, 23, 42, .15);
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: all .2s ease;
	max-height: 480px;
	display: flex;
	flex-direction: column;
}
.cl-notif-bell.is-open .cl-notif-bell__dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.cl-notif-bell__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 16px;
	border-bottom: 1px solid #f1f5f9;
}
.cl-notif-bell__head h4 {
	margin: 0;
	font-size: 14px;
	font-weight: 700;
	color: #131313;
}
.cl-notif-bell__mark-read {
	background: transparent;
	border: 0;
	color: #1e3a5f;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	padding: 4px 8px;
	border-radius: 4px;
}
.cl-notif-bell__mark-read:hover {
	background: #f0f5fa;
}

.cl-notif-bell__list {
	overflow-y: auto;
	flex: 1;
	max-height: 400px;
}
.cl-notif-bell__empty {
	padding: 30px 16px;
	text-align: center;
	color: #94a3b8;
	font-size: 13px;
}

.cl-notif-item {
	display: flex;
	gap: 12px;
	padding: 12px 16px;
	border-bottom: 1px solid #f1f5f9;
	position: relative;
	align-items: center;
}
.cl-notif-item:last-child { border-bottom: 0; }
/* Klikalne powiadomienia */
.cl-notif-item--clickable {
	text-decoration: none;
	color: inherit;
	cursor: pointer;
	transition: background .12s ease;
}
.cl-notif-item--clickable:hover {
	background: #eef4fb;
}
.cl-notif-item--clickable:hover .cl-notif-item__arrow {
	transform: translateX(3px);
	color: #f35120;
}
.cl-notif-item__arrow {
	margin-left: auto;
	flex-shrink: 0;
	color: #94a3b8;
	display: inline-flex;
	transition: transform .15s ease, color .15s ease;
}
.cl-notif-item.is-unread {
	background: #f0f5fa;
}
.cl-notif-item.is-unread::before {
	content: "";
	position: absolute;
	left: 6px;
	top: 18px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #f35120;
}
.cl-notif-item__icon {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #f1f5f9;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 700;
}
.cl-notif-item--approved .cl-notif-item__icon { background: #ecfdf5; color: #047857; }
.cl-notif-item--rejected .cl-notif-item__icon { background: #fef2f2; color: #b91c1c; }
.cl-notif-item--pending  .cl-notif-item__icon { background: #fffbeb; color: #b45309; }
.cl-notif-item--needs_changes .cl-notif-item__icon { background: #fffbeb; color: #b45309; }

.cl-notif-item__body {
	flex: 1;
	min-width: 0;
}
.cl-notif-item__title {
	font-size: 13px;
	font-weight: 600;
	color: #131313;
	line-height: 1.4;
}
.cl-notif-item__msg {
	font-size: 12px;
	color: #64748b;
	margin-top: 2px;
	line-height: 1.5;
}
.cl-notif-item__date {
	font-size: 11px;
	color: #94a3b8;
	margin-top: 4px;
}

@media (max-width: 600px) {
	.cl-notif-bell__dropdown {
		position: fixed;
		top: auto;
		bottom: 0;
		left: 0;
		right: 0;
		min-width: 0;
		max-width: none;
		border-radius: 16px 16px 0 0;
		max-height: 70vh;
	}
}

/* ============ MODAL ============ */
.cl-modal {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.cl-modal.is-open {
	display: flex;
}
.cl-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(15, 23, 42, .6);
	cursor: pointer;
}
.cl-modal__box {
	position: relative;
	width: 100%;
	max-width: 500px;
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 20px 60px rgba(15, 23, 42, .2);
	display: flex;
	flex-direction: column;
	max-height: 90vh;
}
.cl-modal__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 18px 22px;
	border-bottom: 1px solid #f1f5f9;
}
.cl-modal__head h3 {
	margin: 0;
	font-size: 17px;
	font-weight: 700;
	color: #131313;
}
.cl-modal__close {
	width: 32px;
	height: 32px;
	border: 0;
	background: #f1f5f9;
	border-radius: 50%;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	color: #131313;
}
.cl-modal__close:hover { background: #e2e8f0; }
.cl-modal__body {
	padding: 20px 22px;
	overflow-y: auto;
	flex: 1;
}
.cl-modal__body p {
	font-size: 14px;
	color: #475569;
	margin: 0 0 14px;
}
.cl-modal__body textarea {
	width: 100%;
	padding: 11px 14px;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	font-family: var(--cl-font);
	font-size: 14px;
	resize: vertical;
}
.cl-modal__foot {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	padding: 14px 22px;
	border-top: 1px solid #f1f5f9;
}

/* ============ ADMIN PANEL ============ */
.cl-account__nav-count--alert {
	background: #f35120;
	color: #fff;
}
.cl-account__nav-item.is-active .cl-account__nav-count--alert {
	background: #fff;
	color: #f35120;
}

.cl-listing-card__author {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: #64748b;
	margin: 0;
}
.cl-listing-card__author svg { color: #94a3b8; flex-shrink: 0; }

.cl-listing-card__note {
	margin-top: 8px;
	padding: 10px 12px;
	background: #fffbeb;
	border: 1px solid #fde68a;
	border-radius: 6px;
	font-size: 13px;
	color: #92400e;
	line-height: 1.5;
}
.cl-listing-card__note strong {
	display: block;
	margin-bottom: 2px;
	color: #78350f;
}

/* ============ BUTTONY SUCCESS ============ */
.cl-btn--success {
	background: #16a34a;
	color: #fff;
}
.cl-btn--success:hover {
	background: #15803d;
	color: #fff;
}

/* =========================================================
   v1.24 — Zarządzanie klientami (admin)
   ========================================================= */

/* Lista klientów (tabela) */
.cl-clients-table-wrap {
	overflow-x: auto;
	margin: -8px;
	padding: 8px;
}
.cl-clients-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}
.cl-clients-table thead th {
	text-align: left;
	padding: 12px 14px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: #64748b;
	border-bottom: 1px solid #e2e8f0;
	background: #f8fafc;
}
.cl-clients-table tbody td {
	padding: 14px;
	border-bottom: 1px solid #f1f5f9;
	vertical-align: middle;
}
.cl-clients-table tbody tr {
	transition: background .15s ease;
}
.cl-clients-table tbody tr:hover {
	background: #f8fafc;
}
.cl-clients-table tbody tr:last-child td {
	border-bottom: 0;
}
.cl-clients-table tbody tr.is-blocked {
	opacity: .65;
}
.cl-clients-table__num {
	text-align: center;
	width: 100px;
}

.cl-client-cell {
	display: flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
	color: inherit;
}
.cl-client-cell:hover {
	color: inherit;
}
.cl-client-cell__avatar {
	width: 36px;
	height: 36px;
	background: #1e3a5f;
	color: #fff;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 14px;
	flex-shrink: 0;
}
.cl-client-cell__info {
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.cl-client-cell__name {
	font-weight: 700;
	color: #131313;
	line-height: 1.3;
}
.cl-client-cell__email {
	font-size: 12px;
	color: #64748b;
	margin-top: 2px;
}
.cl-client-cell__company {
	font-weight: 500;
	color: #131313;
}
.cl-client-cell__empty {
	color: #cbd5e1;
}
.cl-client-cell__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	height: 28px;
	padding: 0 10px;
	background: #f1f5f9;
	color: #131313;
	border-radius: 999px;
	font-weight: 700;
	font-size: 13px;
}
.cl-client-cell__date {
	font-size: 13px;
	color: #64748b;
}

.cl-status--red { background: #fef2f2; color: #b91c1c; }

@media (max-width: 720px) {
	.cl-clients-table thead { display: none; }
	.cl-clients-table tbody td { display: block; padding: 8px 14px; border: 0; }
	.cl-clients-table tbody tr {
		display: block;
		padding: 12px 0;
		border-bottom: 1px solid #f1f5f9;
	}
	.cl-clients-table tbody td:first-child { padding-top: 14px; }
	.cl-clients-table tbody td:last-child { padding-bottom: 14px; }
	.cl-clients-table__num { text-align: left; width: auto; }
}

/* Panel head ze strzałką wstecz */
.cl-panel__head--with-back {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.cl-back-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: #64748b;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	align-self: flex-start;
	transition: color .15s ease;
}
.cl-back-link:hover {
	color: #f35120;
}
.cl-panel__title-row {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 16px;
	flex-wrap: wrap;
}
.cl-panel__title-row h2 {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}
.cl-panel__title-actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.cl-empty-inline {
	padding: 20px;
	text-align: center;
	color: #94a3b8;
	font-size: 14px;
}

.cl-account__empty--inline {
	border: 1px dashed #e2e8f0;
	border-radius: 8px;
	padding: 40px 20px;
	background: #f8fafc;
}

/* =========================================================
   v1.25 — [camper_listing_chips] — chip-y usług ogłoszenia
   ========================================================= */
.cl-listing-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	font-family: var(--cl-font);
}
.cl-listing-chips--cols-1,
.cl-listing-chips--cols-2,
.cl-listing-chips--cols-3,
.cl-listing-chips--cols-4,
.cl-listing-chips--cols-5,
.cl-listing-chips--cols-6 {
	display: grid;
	gap: 8px;
}
.cl-listing-chips--cols-1 { grid-template-columns: 1fr; }
.cl-listing-chips--cols-2 { grid-template-columns: repeat(2, 1fr); }
.cl-listing-chips--cols-3 { grid-template-columns: repeat(3, 1fr); }
.cl-listing-chips--cols-4 { grid-template-columns: repeat(4, 1fr); }
.cl-listing-chips--cols-5 { grid-template-columns: repeat(5, 1fr); }
.cl-listing-chips--cols-6 { grid-template-columns: repeat(6, 1fr); }
@media (max-width: 720px) {
	.cl-listing-chips--cols-3,
	.cl-listing-chips--cols-4,
	.cl-listing-chips--cols-5,
	.cl-listing-chips--cols-6 {
		grid-template-columns: repeat(2, 1fr);
	}
}

.cl-listing-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 8px 14px;
	background: #1e3a5f;
	border: 1px solid #1e3a5f;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #fff;
	white-space: nowrap;
}
.cl-listing-chip svg {
	color: #fff;
	flex-shrink: 0;
	opacity: .85;
}

/* Wariant colored — chip-y zabarwione kolorem rodzaju (lekki tint) */
.cl-listing-chips.is-colored .cl-listing-chip--sprzedaz  { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
.cl-listing-chips.is-colored .cl-listing-chip--wynajem   { background: #f0fdf4; border-color: #bbf7d0; color: #166534; }
.cl-listing-chips.is-colored .cl-listing-chip--serwis    { background: #fff7ed; border-color: #fed7aa; color: #9a3412; }
.cl-listing-chips.is-colored .cl-listing-chip--kemping   { background: #ecfeff; border-color: #a5f3fc; color: #155e75; }
.cl-listing-chips.is-colored .cl-listing-chip--producent { background: #faf5ff; border-color: #d8b4fe; color: #6b21a8; }
.cl-listing-chips.is-colored .cl-listing-chip--sklep     { background: #fdf2f8; border-color: #fbcfe8; color: #9d174d; }
.cl-listing-chips.is-colored .cl-listing-chip--inne      { background: #f8fafc; border-color: #cbd5e1; color: #334155; }

/* =========================================================
   v1.26 — Hero rozbity + nowe shortcody
   ========================================================= */

/* Hero — czyste zdjęcie */
.cl-hero--clean {
	position: relative;
	width: 100%;
	min-height: 380px;
	height: 50vh;
	max-height: 600px;
	background-size: cover;
	background-position: center;
	background-color: #1e3a5f;
	border-radius: 12px;
	overflow: hidden;
}
.cl-hero--clean .cl-hero__count {
	position: absolute;
	top: 16px;
	right: 16px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: rgba(15, 23, 42, .75);
	color: #fff;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	backdrop-filter: blur(4px);
}

/* Tytuł */
.cl-listing-title {
	font-family: var(--cl-font);
	font-size: 32px;
	font-weight: 800;
	color: #131313;
	margin: 0 0 8px;
	letter-spacing: -.02em;
	line-height: 1.15;
}
@media (max-width: 600px) {
	.cl-listing-title { font-size: 24px; }
}

/* Badges (Wyróżniona + Rodzaj) */
.cl-listing-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	margin: 12px 0;
}
.cl-listing-badges__featured {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	background: #fbbf24;
	color: #131313;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	box-shadow: 0 2px 6px rgba(251, 191, 36, .3);
}
.cl-listing-badges__segment {
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #fff;
	border: 1px solid #e2e8f0;
	color: #131313;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
}

/* Akcje (buttons) */
.cl-listing-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin: 12px 0;
	font-family: var(--cl-font);
}
.cl-listing-actions--column {
	flex-direction: column;
}
.cl-listing-actions--column .cl-listing-actions__btn {
	width: 100%;
	justify-content: center;
}
.cl-listing-actions__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 15px;
	background: #fff;
	border: 2px solid #1e3a5f;
	border-radius: 10px;
	color: #1e3a5f !important;
	font-size: 15px;
	line-height: 1;
	font-weight: 700;
	text-align: center;
	text-decoration: none !important;
	transition: all .3s;
	box-sizing: border-box;
	flex: 1 1 0;
	min-width: 0;
}
.cl-listing-actions__btn svg {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
}
.cl-listing-actions__btn:hover,
.cl-listing-actions__btn--primary:hover {
	background: #f35120;
	border-color: #f35120;
	color: #fff !important;
}
.cl-listing-actions__btn--primary {
	background: #fff;
	border-color: #1e3a5f;
	color: #1e3a5f !important;
	box-shadow: none;
}

@media (max-width: 600px) {
	.cl-listing-actions {
		flex-direction: column;
	}
	.cl-listing-actions__btn {
		width: 100%;
		justify-content: center;
	}
}

/* =========================================================
   v1.27 — Badge "Wyróżniona" — tylko gwiazdka (kółko)
   ========================================================= */
.cl-card__badge--star,
.cl-card .cl-card__badge--star,
.cl-card--large .cl-card__badge--star,
.cl-card--compact .cl-card__badge--star,
.cl-listing-badges__featured,
.cl-listing-card__featured,
.cl-single__hero-badge {
	width: 36px !important;
	height: 36px !important;
	min-width: 36px !important;
	padding: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 50% !important;
	font-size: 16px !important;
	line-height: 1 !important;
	background: #fbbf24 !important;
	color: #131313 !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .2) !important;
	font-weight: 700 !important;
	gap: 0 !important;
}
.cl-card__badge--sm.cl-card__badge--star,
.cl-card--compact .cl-card__badge--sm.cl-card__badge--star {
	width: 30px !important;
	height: 30px !important;
	min-width: 30px !important;
	font-size: 14px !important;
}

/* =========================================================
   v1.28 — Desktop carousel + strzałki + większe karty
   ========================================================= */

/* Mobile hidden dla mobile="hidden" */
@media (max-width: 720px) {
	.cl-block--mobile-hidden {
		display: none !important;
	}
}

/* Desktop carousel */
@media (min-width: 721px) {
	.cl-block--desktop-carousel .cl-block__inner--swap {
		position: relative;
		overflow: hidden;
	}
	.cl-block--desktop-carousel .cl-block__track {
		display: flex;
		gap: 20px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		scrollbar-width: none;
		padding: 4px;
		cursor: grab;
		user-select: none;
	}
	.cl-block--desktop-carousel .cl-block__track::-webkit-scrollbar {
		display: none;
	}
	.cl-block--desktop-carousel .cl-block__track.is-dragging {
		cursor: grabbing;
		scroll-behavior: auto;
	}
	.cl-block--desktop-carousel .cl-block__slide {
		flex: 0 0 auto;
		scroll-snap-align: start;
	}

	/* Szerokość slidów: kolumny */
	.cl-block--desktop-carousel.cl-block--cols-5 .cl-block__slide { width: calc((100% - 80px) / 5); }
	.cl-block--desktop-carousel.cl-block--cols-4 .cl-block__slide { width: calc((100% - 60px) / 4); }
	.cl-block--desktop-carousel.cl-block--cols-3 .cl-block__slide { width: calc((100% - 40px) / 3); }
	.cl-block--desktop-carousel.cl-block--cols-2 .cl-block__slide { width: calc((100% - 20px) / 2); }

	/* Wyższe karty na desktop carousel */
	.cl-block--desktop-carousel .cl-card--compact .cl-card__media {
		aspect-ratio: 4 / 3.2;
	}
}

/* Strzałki — desktop tylko */
.cl-block__arrow {
	display: none;
}
@media (min-width: 721px) {
	.cl-block--desktop-carousel .cl-block__arrow {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		width: 44px;
		height: 44px;
		background: #fff;
		border: 1px solid #e2e8f0;
		border-radius: 50%;
		cursor: pointer;
		color: #131313;
		z-index: 5;
		box-shadow: 0 6px 20px rgba(15, 23, 42, .12);
		transition: all .15s ease;
	}
	.cl-block--desktop-carousel .cl-block__arrow:hover {
		background: #1e3a5f;
		color: #fff;
		border-color: #1e3a5f;
	}
	.cl-block--desktop-carousel .cl-block__arrow--prev { left: -22px; }
	.cl-block--desktop-carousel .cl-block__arrow--next { right: -22px; }
	.cl-block--desktop-carousel .cl-block__arrow:disabled {
		opacity: 0;
		pointer-events: none;
	}
}

/* =========================================================
   v1.29 — Karta: badge "+N" gdy więcej rodzajów niż 3
   ========================================================= */
.cl-card__segment-more {
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	font-size: 11px;
	font-weight: 700;
	color: #64748b;
	border-radius: 8px;
	background: #f1f5f9;
	border: 1px solid #e2e8f0;
	cursor: help;
}

/* =========================================================
   v1.30 — Tabs: strzałki nawigacyjne + drag (desktop)
   ========================================================= */
.cl-tabs__arrow {
	display: none;
	z-index: 5;
	width: 38px;
	height: 38px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 50%;
	cursor: pointer;
	color: #131313;
	align-items: center;
	justify-content: center;
	padding: 0;
	box-shadow: 0 4px 14px rgba(15, 23, 42, .12);
	transition: all .15s ease;
}
.cl-tabs__arrow:hover {
	background: #1e3a5f;
	border-color: #1e3a5f;
	color: #fff;
}
.cl-tabs__arrow:disabled {
	opacity: .35;
	cursor: not-allowed;
}

@media (min-width: 721px) {
	.cl-tabs {
		padding: 0 8px;        /* miejsce na strzałki przy krawędziach */
	}
	.cl-tabs__arrow {
		display: inline-flex;
	}
	.cl-tabs__viewport {
		cursor: grab;
		user-select: none;
	}
	.cl-tabs__viewport.is-dragging {
		cursor: grabbing;
		scroll-behavior: auto;
	}
}

/* Fade-gradients po bokach viewport (TYLKO nad badge'ami z usługami) */
@media (min-width: 721px) {
	.cl-tabs__scroll {
		position: relative;
		flex: 1;
		min-width: 0;
		display: flex;
	}
	.cl-tabs__scroll::before,
	.cl-tabs__scroll::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		width: 50px;
		pointer-events: none;
		z-index: 2;             /* nad badge'ami (1), pod strzałkami (5) */
		opacity: 0;
		transition: opacity .2s ease;
	}
	.cl-tabs__scroll::before {
		left: 0;
		background: linear-gradient(to right, #f2f4f7 0%, rgba(242, 244, 247, 0) 100%);
	}
	.cl-tabs__scroll::after {
		right: 0;
		background: linear-gradient(to left, #f2f4f7 0%, rgba(242, 244, 247, 0) 100%);
	}
	.cl-tabs.has-scroll-left  .cl-tabs__scroll::before { opacity: 1; }
	.cl-tabs.has-scroll-right .cl-tabs__scroll::after  { opacity: 1; }
}

/* =========================================================
   v1.31 — Karty: mobile=2 badge + "+N", desktop=3 + "+N"
   ========================================================= */
/* Desktop: pokaż 3-ci badge i desktop "+N", ukryj mobile "+N" */
.cl-card__segment-inline--desktop-only { display: inline-flex; }
.cl-card__segment-more--desktop { display: inline-flex; }
.cl-card__segment-more--mobile  { display: none; }

/* Mobile (≤720px): ukryj 3-ci badge i desktop "+N", pokaż mobile "+N" */
@media (max-width: 720px) {
	.cl-card__segment-inline--desktop-only { display: none !important; }
	.cl-card__segment-more--desktop        { display: none !important; }
	.cl-card__segment-more--mobile         { display: inline-flex !important; }
}

/* =========================================================
   v1.35 — Cover image (FB-style) + submit form uploader
   ========================================================= */

/* Frontend cover shortcode */
.cl-cover {
	width: 100%;
	height: var(--cl-cover-h, 320px);
	background-size: cover;
	background-position: center;
	background-color: #1e3a5f;
	border-radius: 12px;
	overflow: hidden;
}
@media (max-width: 720px) {
	.cl-cover {
		height: var(--cl-cover-h-mobile, 180px);
		border-radius: 8px;
	}
}

/* Cover uploader w submit form */
.cl-cover-uploader {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.cl-cover-uploader__preview {
	position: relative;
	width: 100%;
	min-height: 140px;
	background: #f8fafc;
	border: 2px dashed #cbd5e1;
	border-radius: 8px;
	overflow: hidden;
}
.cl-cover-uploader__preview img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	min-height: 140px;
	max-height: 280px;
}
.cl-cover-uploader__remove {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 32px;
	height: 32px;
	border: 0;
	background: rgba(15, 23, 42, .85);
	color: #fff;
	border-radius: 50%;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.cl-cover-uploader__remove:hover {
	background: #b91c1c;
}
.cl-cover-uploader__btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 20px;
	background: #f8fafc;
	border: 2px dashed #cbd5e1;
	border-radius: 8px;
	cursor: pointer;
	transition: all .15s ease;
	font-family: var(--cl-font);
	text-align: center;
}
.cl-cover-uploader__btn:hover {
	border-color: #1e3a5f;
	background: #fff;
}
.cl-cover-uploader__btn svg {
	color: #1e3a5f;
}
.cl-cover-uploader__btn span {
	font-size: 14px;
	font-weight: 600;
	color: #131313;
}
.cl-cover-uploader__btn small {
	font-size: 12px;
	color: #64748b;
}

/* =========================================================
   v1.37 — Galeria karuzela 16:9 ze strzałkami
   ========================================================= */
.cl-gcarousel {
	position: relative;
	width: 100%;
}

.cl-gcarousel__track {
	display: flex;
	gap: 12px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	cursor: grab;
	user-select: none;
	padding: 0;
}
.cl-gcarousel__track::-webkit-scrollbar { display: none; }
.cl-gcarousel__track.is-dragging {
	cursor: grabbing;
	scroll-behavior: auto;
}

.cl-gcarousel__slide {
	flex: 0 0 auto;
	width: calc((100% - 12px * (var(--cl-gcv, 5) - 1)) / var(--cl-gcv, 5));
	aspect-ratio: 16 / 9;          /* proporcja 16:9 */
	background-size: cover;
	background-position: center;
	background-color: #e2e8f0;
	border-radius: 10px;
	scroll-snap-align: start;
	cursor: zoom-in;
	display: block;
	border: 2px solid transparent;
	box-sizing: border-box;
	transition: border-color .15s ease, transform .2s ease;
}
.cl-gcarousel__slide:hover {
	border-color: #f35120;
	transform: translateY(-2px);
}

/* Tablet */
@media (max-width: 1024px) {
	.cl-gcarousel__slide {
		width: calc((100% - 12px * (var(--cl-gcv-tablet, 3) - 1)) / var(--cl-gcv-tablet, 3));
	}
}

/* Mobile — 1 całe zdjęcie 16:9 */
@media (max-width: 720px) {
	.cl-gcarousel__slide {
		width: 100%;
	}
}

/* Strzałki */
.cl-gcarousel__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 50%;
	cursor: pointer;
	color: #131313;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	z-index: 5;
	box-shadow: 0 6px 20px rgba(15, 23, 42, .15);
	transition: all .15s ease;
}
.cl-gcarousel__arrow:hover {
	background: #1e3a5f;
	border-color: #1e3a5f;
	color: #fff;
}
.cl-gcarousel__arrow:disabled {
	opacity: .35;
	cursor: not-allowed;
}
.cl-gcarousel__arrow--prev { left: 4px; }
.cl-gcarousel__arrow--next { right: 4px; }

@media (max-width: 720px) {
	.cl-gcarousel__arrow--prev { left: 4px; }
	.cl-gcarousel__arrow--next { right: 4px; }
}

/* =========================================================
   v1.39 — Mapa pełna szerokość + info-card overlay
   ========================================================= */
.cl-mapbanner {
	position: relative;
	width: 100%;
	height: var(--cl-mapbanner-h, 300px);
	border-radius: 12px;
	overflow: hidden;
	background: #f8fafc;
	display: block;
}

.cl-mapbanner__img {
	display: block;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-color: #e2e8f0;
}
.cl-mapbanner__img--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #94a3b8;
}

.cl-mapbanner__info {
	position: absolute;
	right: 20px;
	bottom: 20px;
	max-width: calc(100% - 40px);
	background: #fff;
	padding: 16px 20px;
	border-radius: 10px;
	box-shadow: 0 8px 24px rgba(15, 23, 42, .18);
	font-family: var(--cl-font);
	display: flex;
	flex-direction: column;
	gap: 4px;
	z-index: 2;
}
.cl-mapbanner__address {
	font-size: 14px;
	font-weight: 600;
	color: #131313;
	line-height: 1.4;
}
.cl-mapbanner__city {
	font-size: 13px;
	color: #64748b;
	margin-bottom: 8px;
}
.cl-mapbanner__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 6px;
	padding: 8px 14px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	color: #131313 !important;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none !important;
	transition: all .15s ease;
	align-self: flex-start;
}
.cl-mapbanner__btn:hover {
	border-color: #1e3a5f;
	background: #f8fafc;
	color: #1e3a5f !important;
}

/* Mobile */
@media (max-width: 600px) {
	.cl-mapbanner {
		height: var(--cl-mapbanner-h, 220px);
		border-radius: 8px;
	}
	.cl-mapbanner__info {
		right: 12px;
		bottom: 12px;
		left: 12px;
		max-width: none;
		padding: 12px 14px;
	}
	.cl-mapbanner__address { font-size: 13px; }
	.cl-mapbanner__city    { font-size: 12px; }
	.cl-mapbanner__btn     { font-size: 12px; padding: 7px 12px; }
}

/* =========================================================
   v1.40 — Interaktywna mapa Google JS
   ========================================================= */
.cl-mapbanner__map {
	width: 100%;
	height: 100%;
	background: #e2e8f0;
}
.cl-mapbanner__map img {
	max-width: none !important;  /* Google Maps internal images */
}

/* Override default Google InfoWindow style */
.cl-mapbanner .gm-style .gm-style-iw {
	font-family: 'Manrope', system-ui, sans-serif !important;
	padding: 4px !important;
}

/* =========================================================
   v1.44 — Aktywne chipy w sidebarze filtrów
   ========================================================= */
.cl-filters__active {
	margin-bottom: 14px;
}
.cl-filters__active:empty {
	display: none;
}
.cl-filters__active .cl-active-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	padding: 12px;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
}
.cl-filters__active .cl-active-chip {
	font-size: 12px;
	cursor: pointer;
}

/* =========================================================
   v1.45 — Sparkle (4-pointed star) zamiast ★
   ========================================================= */
.cl-sparkle {
	width: 60%;
	height: 60%;
	display: block;
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .15));
}

/* W kółku featured badge — sparkle wycentrowany */
.cl-card__badge--star,
.cl-listing-badges__featured,
.cl-listing-card__featured,
.cl-single__hero-badge {
	overflow: hidden;
}
.cl-card__badge--star .cl-sparkle,
.cl-listing-badges__featured .cl-sparkle,
.cl-listing-card__featured .cl-sparkle,
.cl-single__hero-badge .cl-sparkle {
	width: 20px;
	height: 20px;
}
.cl-card__badge--sm.cl-card__badge--star .cl-sparkle {
	width: 17px;
	height: 17px;
}

/* W chipach aktywnych filtrów */
.cl-active-chip .cl-sparkle {
	width: 13px;
	height: 13px;
	display: inline-block;
	vertical-align: -2px;
	color: #f59e0b;
	margin-right: 2px;
}

/* Sparkle w label filtra (Tylko wyróżnione) */
.cl-filters .cl-check span .cl-sparkle {
	width: 16px;
	height: 16px;
	display: inline-block;
	vertical-align: -3px;
	color: #f59e0b;
	margin-right: 2px;
}

/* =========================================================
   v1.46 — Filtry usług: collapse jeśli > 15
   ========================================================= */
.cl-filters__group--services .cl-check--hidden {
	display: none;
}
.cl-filters__group--services.is-expanded .cl-check--hidden {
	display: flex;
}
.cl-filters__expand {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 8px;
	padding: 8px 12px;
	background: transparent;
	border: 1px dashed #cbd5e1;
	border-radius: 8px;
	color: #1e3a5f;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	font-family: var(--cl-font);
	transition: all .15s ease;
}
.cl-filters__expand:hover {
	background: #f8fafc;
	border-color: #1e3a5f;
}
.cl-filters__expand svg {
	transition: transform .2s ease;
}
.cl-filters__group--services.is-expanded .cl-filters__expand svg {
	transform: rotate(180deg);
}
.cl-filters__expand-less { display: none; }
.cl-filters__group--services.is-expanded .cl-filters__expand-more { display: none; }
.cl-filters__group--services.is-expanded .cl-filters__expand-less { display: inline; }

/* =========================================================
   v1.48 — Filtry usług ukrywane na bazie wybranych segmentów
   ========================================================= */
.cl-check--hidden-by-segment {
	display: none !important;
}
.cl-filters__services-empty {
	padding: 12px;
	color: #94a3b8;
	font-size: 13px;
	font-style: italic;
	text-align: center;
}

/* v1.51 — Ukryj pusty container ikony (gdy term nie ma uploadowanej ikonki) */
.cl-check__icon:empty,
.cl-offer__icon:empty,
.cl-offer-tile__icon:empty,
.cl-services-grouped__icon:empty,
.cl-services-group__icon:empty,
.cl-single-offer-chip__icon:empty {
	display: none;
}

/* =========================================================
   v1.52 — [camper_taxonomy_description]
   ========================================================= */
.cl-tax-description {
	font-family: 'Manrope', system-ui, -apple-system, sans-serif;
	margin: 24px 0;
	padding: 24px 28px;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	color: #131313;
}
.cl-tax-description__title {
	font-size: 22px;
	font-weight: 800;
	color: #131313;
	margin: 0 0 12px;
	letter-spacing: -.01em;
}
.cl-tax-description__body {
	font-size: 15px;
	line-height: 1.6;
	color: #475569;
}
.cl-tax-description__body p {
	margin: 0 0 12px;
}
.cl-tax-description__body p:last-child {
	margin-bottom: 0;
}
.cl-tax-description__body a {
	color: #f35120;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.cl-tax-description__body a:hover {
	color: #B82B00;
}
.cl-tax-description__body ul,
.cl-tax-description__body ol {
	margin: 0 0 12px;
	padding-left: 20px;
}

@media (max-width: 600px) {
	.cl-tax-description {
		padding: 18px 20px;
		margin: 16px 0;
	}
	.cl-tax-description__title {
		font-size: 18px;
	}
	.cl-tax-description__body {
		font-size: 14px;
	}
}

/* v1.53 — Select w filtrach (kraj) */
.cl-filters__select,
.cl-field__select {
	width: 100%;
	padding: 10px 32px 10px 12px;
	font-family: var(--cl-font);
	font-size: 14px;
	color: #131313;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23131313' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 14px;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.cl-filters__select:focus,
.cl-field__select:focus {
	outline: none;
	border-color: #1e3a5f;
	box-shadow: 0 0 0 3px rgba(30, 58, 95, .12);
}

/* v1.54 — Flagi krajów (SVG z CDN, działa wszędzie) */
.cl-flag {
	display: inline-block;
	vertical-align: -2px;
	border-radius: 2px;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, .08);
}
.cl-flag--sm { width: 16px; height: 12px; }
.cl-flag--md { width: 20px; height: 15px; }
.cl-flag--lg { width: 24px; height: 18px; }
.cl-flag--globe { box-shadow: none; font-size: 14px; line-height: 1; }

/* Karta */
.cl-card__location .cl-flag { margin-left: 4px; }

/* Info-strip — większa */
.cl-info-strip .cl-flag {
	width: 22px;
	height: 16px;
	margin-left: 4px;
	vertical-align: -3px;
}

/* Mapbanner */
.cl-mapbanner__city .cl-flag {
	margin-left: 4px;
}

/* Active chip */
.cl-active-chip .cl-flag {
	margin-right: 2px;
}

/* =========================================================
   v1.55 — Custom country picker (searchable + flagi)
   ========================================================= */
.cl-country-picker {
	position: relative;
	font-family: var(--cl-font);
}

.cl-country-picker__trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	width: 100%;
	padding: 10px 12px;
	font-size: 14px;
	color: #131313;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	cursor: pointer;
	transition: border-color .15s ease, box-shadow .15s ease;
	font-family: inherit;
	text-align: left;
}
.cl-country-picker__trigger:hover {
	border-color: #cbd5e1;
}
.cl-country-picker[data-cl-open="1"] .cl-country-picker__trigger {
	border-color: #1e3a5f;
	box-shadow: 0 0 0 3px rgba(30, 58, 95, .12);
}
.cl-country-picker__trigger svg:last-child {
	flex-shrink: 0;
	transition: transform .2s ease;
	color: #64748b;
}
.cl-country-picker[data-cl-open="1"] .cl-country-picker__trigger svg:last-child {
	transform: rotate(180deg);
}

.cl-country-picker__current {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	overflow: hidden;
	min-width: 0;
}
.cl-country-picker__current > span:not(.cl-country-picker__placeholder) {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.cl-country-picker__placeholder {
	color: #94a3b8;
}

.cl-country-picker__dropdown {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	right: 0;
	max-height: 320px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	box-shadow: 0 10px 30px rgba(15, 23, 42, .12);
	z-index: 1000;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}
.cl-country-picker__dropdown[hidden] { display: none; }

.cl-country-picker__search {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	border-bottom: 1px solid #e2e8f0;
	background: #f8fafc;
}
.cl-country-picker__search svg {
	color: #64748b;
	flex-shrink: 0;
}
.cl-country-picker__search input {
	flex: 1;
	border: 0;
	background: transparent;
	font-size: 13px;
	color: #131313;
	outline: none;
	font-family: inherit;
	padding: 4px 0;
}
.cl-country-picker__search input::placeholder {
	color: #94a3b8;
}

.cl-country-picker__list {
	list-style: none;
	margin: 0;
	padding: 4px;
	overflow-y: auto;
	flex: 1;
}
.cl-country-picker__option {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	font-size: 14px;
	color: #131313;
	cursor: pointer;
	border-radius: 6px;
	transition: background-color .12s ease;
}
.cl-country-picker__option:hover,
.cl-country-picker__option.is-highlighted {
	background: #f1f5f9;
}
.cl-country-picker__option.is-selected {
	background: #fef2ed;
	color: #f35120;
	font-weight: 600;
}
.cl-country-picker__option[hidden] { display: none; }

.cl-country-picker__empty {
	padding: 14px;
	text-align: center;
	color: #94a3b8;
	font-size: 13px;
	font-style: italic;
}

/* v1.56 — Phone input z prefiksem */
.cl-phone-input {
	display: flex;
	gap: 0;
	align-items: stretch;
	width: 100%;
}
.cl-country-picker--phone {
	flex-shrink: 0;
	width: 130px;
}
.cl-country-picker--phone .cl-country-picker__trigger {
	border-radius: 8px 0 0 8px;
	border-right: 0;
	min-height: 100%;
}
.cl-country-picker--phone .cl-country-picker__dropdown {
	min-width: 260px;
	left: 0;
	right: auto;
}
.cl-country-picker__prefix {
	color: #94a3b8;
	font-size: 12px;
	margin-left: 4px;
}
.cl-country-picker--phone .cl-country-picker__current span:not(.cl-country-picker__placeholder) {
	font-weight: 600;
}

.cl-phone-input__number {
	flex: 1;
	min-width: 0;
	padding: 10px 12px;
	font-size: 14px;
	color: #131313;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 0 8px 8px 0;
	font-family: var(--cl-font);
	outline: none;
	transition: border-color .15s ease, box-shadow .15s ease;
	box-sizing: border-box;
}
.cl-phone-input__number:focus {
	border-color: #1e3a5f;
	box-shadow: 0 0 0 3px rgba(30, 58, 95, .12);
	position: relative;
	z-index: 1;
}

/* Picker open — granica spójna */
.cl-country-picker--phone[data-cl-open="1"] + .cl-phone-input__number {
	border-left-color: #e2e8f0;
}

/* v1.57 — Ukryj pusty container ikony w tabs (gdy term nie ma uploadowanej) */
.cl-tab__icon:empty { display: none; }

/* v1.58 — Klikalne usługi w pojedynczej wizytówce */
.cl-offer-tile,
.cl-listing-chip,
.cl-single-offer-chip {
	text-decoration: none !important;
	cursor: pointer;
	transition: all .15s ease;
}
.cl-offer-tile:hover {
	border-color: #f35120 !important;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(243, 81, 32, .15);
}
.cl-listing-chip:hover,
.cl-single-offer-chip:hover {
	background: #f35120 !important;
	color: #fff !important;
	border-color: #f35120 !important;
}
.cl-single-offer-group__link {
	text-decoration: none !important;
	color: inherit;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	transition: color .15s ease;
}
.cl-single-offer-group__link:hover {
	color: #f35120;
}

/* v1.60 — Captcha antyspam w rejestracji */
.cl-captcha__row {
	display: flex;
	align-items: center;
	gap: 10px;
}
.cl-captcha__question {
	font-size: 18px;
	font-weight: 700;
	color: #131313;
	background: #f1f5f9;
	padding: 10px 16px;
	border-radius: 8px;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
	letter-spacing: .02em;
}
.cl-captcha__input {
	width: 80px !important;
	text-align: center;
	font-size: 16px;
	font-weight: 600;
}
.cl-captcha__refresh {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	color: #64748b;
	cursor: pointer;
	transition: all .15s ease;
}
.cl-captcha__refresh:hover {
	background: #1e3a5f;
	border-color: #1e3a5f;
	color: #fff;
}

/* v1.61 — Notice (aktywacja konta) */
.cl-notice {
	padding: 14px 18px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 600;
	margin: 0 0 20px;
	font-family: var(--cl-font);
}
.cl-notice--success {
	background: #ecfdf5;
	color: #047857;
	border: 1px solid #a7f3d0;
}
.cl-notice--error {
	background: #fef2f2;
	color: #b91c1c;
	border: 1px solid #fecaca;
}

/* v1.63 — Panel moderatora: lista kompaktowa + wyszukiwarka */
.cl-mod-search {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	padding: 10px 14px;
	margin: 0 0 16px;
	color: #64748b;
}
.cl-mod-search:focus-within {
	border-color: #1e3a5f;
}
.cl-mod-search__input {
	flex: 1;
	border: 0 !important;
	outline: 0;
	background: transparent;
	font-size: 14px;
	color: #131313;
	padding: 0 !important;
}
.cl-mod-search__count {
	font-size: 12px;
	color: #94a3b8;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

/* Lista kompaktowa */
.cl-account__listings--compact {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.cl-account__listings--compact .cl-listing-card--compact {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 14px;
	padding: 10px 12px;
	min-height: 0;
}
.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__media {
	width: 96px;
	height: 72px;
	min-width: 96px;
	border-radius: 8px;
	flex-shrink: 0;
	position: relative;
}
/* Gwiazdka wyróżnione w liście kompaktowej — mała, w rogu, nie zasłania */
.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__featured {
	position: absolute !important;
	top: 4px !important;
	left: 4px !important;
	width: 22px !important;
	height: 22px !important;
	min-width: 22px !important;
	font-size: 11px !important;
}
.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__body {
	flex: 1;
	min-width: 0;
	padding: 0;
}
.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__head {
	margin: 0 0 2px;
}
.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__head h3 {
	font-size: 14px;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}
.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__author,
.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__meta {
	font-size: 12px;
	margin: 1px 0;
}
.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__actions {
	flex-shrink: 0;
	margin: 0;
	gap: 6px;
}
.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__note {
	width: 100%;
	margin-top: 6px;
}

/* Podświetlenie wizytówki z powiadomienia */
.cl-listing-card--highlight {
	animation: cl-hl-pulse 2s ease;
	border-color: #f35120 !important;
	box-shadow: 0 0 0 3px rgba(243, 81, 32, .2);
}
@keyframes cl-hl-pulse {
	0%   { box-shadow: 0 0 0 0 rgba(243, 81, 32, .5); }
	100% { box-shadow: 0 0 0 3px rgba(243, 81, 32, .2); }
}

/* Modal target (nazwa usuwanej wizytówki) */
.cl-modal__target {
	font-weight: 700;
	color: #131313;
	background: #f8fafc;
	padding: 10px 14px;
	border-radius: 8px;
	margin: 8px 0 0;
}

/* Mobile — lista kompaktowa zawija akcje pod spód */
@media (max-width: 600px) {
	.cl-account__listings--compact .cl-listing-card--compact {
		flex-wrap: wrap;
	}
	.cl-account__listings--compact .cl-listing-card--compact .cl-listing-card__actions {
		width: 100%;
		flex-wrap: wrap;
	}
}

/* v1.64 — Gwiazdka wyróżnione na mobile -20% */
@media (max-width: 720px) {
	.cl-card__badge--star,
	.cl-card .cl-card__badge--star,
	.cl-card--large .cl-card__badge--star,
	.cl-card--compact .cl-card__badge--star,
	.cl-listing-card__featured {
		width: 29px !important;
		height: 29px !important;
		min-width: 29px !important;
		font-size: 13px !important;
	}
	.cl-card__badge--sm.cl-card__badge--star,
	.cl-card--compact .cl-card__badge--sm.cl-card__badge--star {
		width: 24px !important;
		height: 24px !important;
		min-width: 24px !important;
		font-size: 11px !important;
	}
}

/* v1.65 — Pole wyróżniona w edycji (admin) */
.cl-field--toggle {
	display: flex !important;
	flex-direction: row !important;
	align-items: center;
	gap: 12px;
	background: #fffbeb;
	border: 1px solid #fde68a;
	border-radius: 10px;
	padding: 14px 16px;
	cursor: pointer;
}
.cl-field--toggle input[type="checkbox"] {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	accent-color: #f35120;
	cursor: pointer;
}
.cl-toggle-label {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.cl-toggle-label strong {
	font-size: 14px;
	color: #131313;
}
.cl-toggle-label small {
	font-size: 12px;
	color: #92704a;
}

/* v1.66 — Przycisk powrotu w edycji wizytówki */
.cl-submit__back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 600;
	color: #1e3a5f;
	text-decoration: none;
	padding: 10px 16px;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	background: #fff;
	margin: 0 0 20px;
	transition: all .15s ease;
}
.cl-submit__back:hover {
	background: #1e3a5f;
	border-color: #1e3a5f;
	color: #fff;
}

/* CF-18: awatar (główne zdjęcie) + zmiana kolejności w galerii wizytówki */
.cl-uploader__item.is-avatar { outline: 2px solid var(--cl-accent, #f35120); outline-offset: -2px; }
.cl-uploader__avatar-badge {
	display: none; position: absolute; top: 4px; left: 4px; z-index: 2;
	background: var(--cl-accent, #f35120); color: #fff;
	font-size: 9px; font-weight: 800; letter-spacing: .04em; padding: 2px 6px; border-radius: 5px;
}
.cl-uploader__item.is-avatar .cl-uploader__avatar-badge { display: block; }
.cl-uploader__ctrl {
	position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
	display: flex; justify-content: space-between; opacity: 0; transition: opacity .15s;
}
.cl-uploader__item:hover .cl-uploader__ctrl { opacity: 1; }
.cl-uploader__move {
	background: rgba(0,0,0,.6); color: #fff; border: 0; cursor: pointer;
	width: 26px; height: 26px; font-size: 12px; line-height: 1;
	display: flex; align-items: center; justify-content: center;
}
.cl-uploader__move:hover { background: rgba(0,0,0,.85); }
@media (max-width: 560px) { .cl-uploader__ctrl { opacity: 1; } }