/* =============================================================================
   destination.css - страницата на дестинация (/pochivki-v-{slug}).
 
   Стилът е капсулиран под .dst. Всички правила са с ПОНЕ ДВА класа нарочно:
   лейаутът вкарва този файл през @yield('head'), тоест ПРЕДИ main.css, а
   main.css има правила от вида ".content-wrapper h1" (0,1,1). ".dst .dst-h1"
   е (0,2,0) и печели без !important.
   ========================================================================== */

.content-wrapper .dst
{
	--dst-ink: #2A2F38;
	--dst-ink-2: #4A5160;
	--dst-mute: #7A8290;
	--dst-line: #ECEEF2;
	--dst-line-2: #F0F2F5;
	--dst-fill: #F3F4F7;
	--dst-accent: #ff296c;
	--dst-accent-d: #e01f5c;
	--dst-dark: #232833;

	max-width: 1440px;
	margin: 0 auto;
	padding: 0 24px 180px; /* .footer е с margin-top:-140px - оставяме му въздух */
	text-align: left;      /* .content-wrapper центрира всичко */
	font-family: 'Manrope', 'Roboto', sans-serif;
	color: var(--dst-ink);
	box-sizing: border-box;
}

.content-wrapper .dst *,
.content-wrapper .dst *::before,
.content-wrapper .dst *::after { box-sizing: border-box; }

.content-wrapper .dst a { color: var(--dst-accent); text-decoration: none; }
.content-wrapper .dst a:hover { color: var(--dst-accent-d); }

/* --- Хедър на дестинацията ------------------------------------------------
   В макета е full-bleed. Тук стои в контейнера и е със заоблени ъгли:
   .content-wrapper е max-width:1440px с overflow:clip, така че истинско
   full-bleed би се отрязало. */
.content-wrapper .dst-hero
{
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	background: var(--dst-dark);
	margin-bottom: 28px;
}

.content-wrapper .dst-hero-media { position: absolute; inset: 0; }

.content-wrapper .dst-hero-img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.content-wrapper .dst-hero-veil
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(30,34,43,0.45) 0%, rgba(30,34,43,0.78) 100%);
	pointer-events: none;
}

.content-wrapper .dst-hero-inner
{
	position: relative;
	padding: 56px 40px 48px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

/* Трохите идват от partials.breadcrumbs (заедно с BreadcrumbList schema) и
   се пребоядисват тук, защото фонът е тъмен. */
.content-wrapper .dst-hero .breadcrumbs { margin: 0; }

.content-wrapper .dst-hero .breadcrumbs ol
{
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
}

.content-wrapper .dst-hero .breadcrumbs li
{
	color: rgba(255,255,255,0.7);
	display: flex;
	gap: 8px;
	align-items: center;
}

.content-wrapper .dst-hero .breadcrumbs li + li::before
{
	content: '›';
	color: rgba(255,255,255,0.5);
}

.content-wrapper .dst-hero .breadcrumbs a { color: rgba(255,255,255,0.7); }
.content-wrapper .dst-hero .breadcrumbs a:hover { color: #fff; }
.content-wrapper .dst-hero .breadcrumbs li[aria-current] { color: #fff; font-weight: 600; }

.content-wrapper .dst-h1
{
	margin: 0;
	color: #fff;
	font-size: 36px;
	font-weight: 800;
	letter-spacing: -0.5px;
	line-height: 1.2;
	text-align: left;
	text-transform: none; /* main.css вдига h1 в главни букви */
}

.content-wrapper .dst-lede
{
	margin: 0;
	color: rgba(255,255,255,0.85);
	font-size: 15.5px;
	max-width: 640px;
	line-height: 1.55;
}

.content-wrapper .dst-stats
{
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 6px;
}

.content-wrapper .dst-stat
{
	background: rgba(255,255,255,0.14);
	border: 1px solid rgba(255,255,255,0.25);
	border-radius: 12px;
	padding: 10px 18px;
	display: flex;
	flex-direction: column;
}

.content-wrapper .dst-stat-k
{
	font-size: 11.5px;
	color: rgba(255,255,255,0.7);
	font-weight: 600;
}

.content-wrapper .dst-stat-v { font-size: 18px; font-weight: 800; color: #fff; }
.content-wrapper .dst-stat-v.is-accent { color: #FF5C93; }

/* --- Лента с филтри -------------------------------------------------------- */
.content-wrapper .dst-filters
{
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 26px;
}

.content-wrapper .dst-filters-label
{
	font-size: 13px;
	font-weight: 700;
	color: var(--dst-mute);
}

.content-wrapper .dst a.dst-pill,
.content-wrapper .dst-pill
{
	font-size: 13px;
	font-weight: 700;
	border-radius: 999px;
	padding: 7px 16px;
	display: inline-block;
	background: #fff;
	color: var(--dst-ink-2);
	border: 1px solid var(--dst-line);
}

.content-wrapper .dst a.dst-pill.is-on,
.content-wrapper .dst-pill.is-on
{
	background: var(--dst-accent);
	color: #fff;
	border-color: var(--dst-accent);
}

.content-wrapper .dst a.dst-pill:hover
{
	border-color: var(--dst-accent);
	color: var(--dst-accent);
}

.content-wrapper .dst a.dst-pill.is-on:hover
{
	background: var(--dst-accent-d);
	border-color: var(--dst-accent-d);
	color: #fff;
}

/* Броячът в етикета - колко обекта остават при този филтър. */
.content-wrapper .dst-pill-n { opacity: 0.6; font-weight: 700; }
.content-wrapper .dst-pill.is-on .dst-pill-n { opacity: 0.75; }

.content-wrapper .dst-spacer { flex: 1; }

.content-wrapper .dst-sort
{
	border: 1px solid var(--dst-line);
	border-radius: 999px;
	padding: 8px 14px;
	font-size: 13px;
	font-weight: 700;
	font-family: inherit;
	color: var(--dst-ink-2);
	background: #fff;
	cursor: pointer;
}

/* --- Решетката ------------------------------------------------------------- */
.content-wrapper .dst-grid
{
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	gap: 28px;
	align-items: start;
}

.content-wrapper .dst-col
{
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

.content-wrapper .dst-aside
{
	position: sticky;
	top: 24px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* --- Карта на обект -------------------------------------------------------- */
.content-wrapper .dst-card
{
	background: #fff;
	border: 1px solid var(--dst-line);
	border-radius: 16px;
	overflow: hidden;
	display: flex;
}

.content-wrapper .dst-card-media
{
	position: relative;
	width: 240px;
	flex-shrink: 0;
	background: #E9EBEF;
}

.content-wrapper .dst-card-img
{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.content-wrapper .dst-card-body
{
	padding: 18px 22px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
	min-width: 0;
}

.content-wrapper .dst-card-head
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.content-wrapper .dst a.dst-card-name
{
	font-size: 16.5px;
	font-weight: 800;
	color: var(--dst-ink);
	line-height: 1.3;
}

.content-wrapper .dst a.dst-card-name:hover { color: var(--dst-accent); }

.content-wrapper .dst-card-area
{
	font-size: 12.5px;
	color: var(--dst-mute);
	font-weight: 600;
}

.content-wrapper .dst-card-offer
{
	margin: 0;
	font-size: 13.5px;
	color: var(--dst-ink-2);
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.content-wrapper .dst-tags { display: flex; flex-wrap: wrap; gap: 6px; }

.content-wrapper .dst-tag
{
	font-size: 11.5px;
	font-weight: 600;
	color: var(--dst-ink-2);
	background: var(--dst-fill);
	border-radius: 999px;
	padding: 4px 10px;
}

.content-wrapper .dst-card-foot
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-top: 8px;
}

.content-wrapper .dst-price { display: flex; align-items: baseline; gap: 7px; }

.content-wrapper .dst-price-v
{
	font-size: 22px;
	font-weight: 800;
	color: var(--dst-accent);
}

.content-wrapper .dst-price-v sup { font-size: 0.55em; top: -0.55em; }
.content-wrapper .dst-price-n { font-size: 12.5px; color: var(--dst-mute); }

.content-wrapper .dst a.dst-cta
{
	background: var(--dst-accent);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	border-radius: 999px;
	padding: 8px 18px;
	flex-shrink: 0;
	white-space: nowrap;
}

.content-wrapper .dst a.dst-cta:hover { background: var(--dst-accent-d); color: #fff; }

.content-wrapper .dst-empty,
.content-wrapper .dst-note
{
	background: #fff;
	border: 1px solid var(--dst-line);
	border-radius: 16px;
	padding: 16px 22px;
	margin: 0;
	font-size: 13.5px;
	color: var(--dst-mute);
	text-align: center;
}

/* --- Карти в страничната колона -------------------------------------------- */
.content-wrapper .dst-box
{
	background: #fff;
	border: 1px solid var(--dst-line);
	border-radius: 16px;
	padding: 22px 24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.content-wrapper .dst-box.is-flush { padding: 0; overflow: hidden; gap: 0; }

.content-wrapper .dst-box-t
{
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.08em;
	color: var(--dst-mute);
	text-transform: uppercase;
	text-align: left;
	margin: 0;
}

.content-wrapper .dst-box-p
{
	margin: 0;
	font-size: 13.5px;
	color: var(--dst-ink-2);
	line-height: 1.5;
}

.content-wrapper .dst-map { width: 100%; height: 240px; border: none; display: block; }

.content-wrapper .dst-map-foot
{
	padding: 14px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
	font-weight: 700;
	color: var(--dst-ink-2);
}

/* --- Кога да отидеш --------------------------------------------------------- */
.content-wrapper .dst-clim
{
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 5px;
}

.content-wrapper .dst-clim-cell
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 8px 2px;
	border-radius: 8px;
	background: #F6F7F9;
}

.content-wrapper .dst-clim-cell.is-warm { background: #FDF3F7; }
.content-wrapper .dst-clim-cell.is-hot { background: #FDEAF1; }

.content-wrapper .dst-clim-m { font-size: 10.5px; font-weight: 700; color: var(--dst-mute); }
.content-wrapper .dst-clim-t { font-size: 12.5px; font-weight: 800; color: var(--dst-ink); }
.content-wrapper .dst-clim-cell.is-hot .dst-clim-t { color: var(--dst-accent); }

.content-wrapper .dst-fine { margin: 0; font-size: 12.5px; color: var(--dst-mute); line-height: 1.5; }

/* --- Абонамент -------------------------------------------------------------- */
.content-wrapper .dst-sub
{
	display: flex;
	background: var(--dst-fill);
	border-radius: 999px;
	padding: 4px;
}

.content-wrapper .dst-sub-input
{
	flex: 1;
	min-width: 0;
	border: none;
	outline: none;
	background: transparent;
	padding: 8px 14px;
	font-size: 13.5px;
	font-family: inherit;
	color: var(--dst-ink);
}

.content-wrapper .dst-sub-btn
{
	background: var(--dst-dark);
	color: #fff;
	border: none;
	border-radius: 999px;
	padding: 8px 18px;
	font-size: 13px;
	font-weight: 700;
	font-family: inherit;
	cursor: pointer;
}

.content-wrapper .dst-sub-btn:hover { background: var(--dst-accent); }

/* --- Наблизо ---------------------------------------------------------------- */
.content-wrapper .dst-near { display: flex; flex-direction: column; }

.content-wrapper .dst a.dst-near-a
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 9px 0;
	border-bottom: 1px solid var(--dst-line-2);
	font-size: 13.5px;
	font-weight: 700;
	color: var(--dst-ink);
}

.content-wrapper .dst a.dst-near-a:last-child { border-bottom: none; }
.content-wrapper .dst a.dst-near-a:hover { color: var(--dst-accent); }

.content-wrapper .dst-near-meta
{
	font-size: 12px;
	color: var(--dst-mute);
	font-weight: 600;
	flex-shrink: 0;
}

/* --- Активни оферти в дестинацията ------------------------------------------ */
.content-wrapper .dst-offers
{
	background: #fff;
	border: 1px solid var(--dst-line);
	border-radius: 16px;
	padding: 22px 24px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.content-wrapper .dst-offer-row
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 9px 0;
	border-bottom: 1px solid var(--dst-line-2);
	font-size: 13.5px;
}

.content-wrapper .dst-offer-row:last-child { border-bottom: none; }

.content-wrapper .dst a.dst-offer-a { font-weight: 700; color: var(--dst-ink); min-width: 0; }
.content-wrapper .dst a.dst-offer-a:hover { color: var(--dst-accent); }

.content-wrapper .dst-offer-p
{
	font-size: 15px;
	font-weight: 800;
	color: var(--dst-accent);
	flex-shrink: 0;
}

/* --- Текст за дестинацията и Booking ---------------------------------------- */
.content-wrapper .dst-prose
{
	background: #fff;
	border: 1px solid var(--dst-line);
	border-radius: 16px;
	padding: 24px 26px;
	font-size: 14.5px;
	line-height: 1.65;
	color: var(--dst-ink-2);
	text-align: left;
}

.content-wrapper .dst-prose h2,
.content-wrapper .dst-prose h3
{
	font-size: 17px;
	font-weight: 800;
	color: var(--dst-ink);
	margin: 0 0 10px;
	text-align: left;
	text-transform: none;
}

.content-wrapper .dst-prose p { margin: 0 0 12px; }
.content-wrapper .dst-prose p:last-child { margin-bottom: 0; }

.content-wrapper .dst a.dst-booking
{
	display: inline-flex;
	align-self: flex-start;
	background: #fff;
	border: 1px solid var(--dst-line);
	color: var(--dst-ink-2);
	font-size: 14px;
	font-weight: 700;
	border-radius: 999px;
	padding: 11px 24px;
}

.content-wrapper .dst a.dst-booking:hover { border-color: var(--dst-accent); color: var(--dst-accent); }

/* --- Адаптив ---------------------------------------------------------------- */
@media (max-width: 1080px)
{
	.content-wrapper .dst-grid { grid-template-columns: minmax(0, 1fr); }
	.content-wrapper .dst-aside { position: static; }
}

@media (max-width: 720px)
{
	.content-wrapper .dst { padding: 0 14px 180px; }
	.content-wrapper .dst-hero-inner { padding: 32px 22px 28px; }
	.content-wrapper .dst-h1 { font-size: 26px; }
	.content-wrapper .dst-lede { font-size: 14.5px; }
	.content-wrapper .dst-card { flex-direction: column; }

	.content-wrapper .dst-card-media
	{
		width: 100%;
		height: 180px;
	}

	.content-wrapper .dst-card-foot { flex-direction: column; align-items: stretch; gap: 10px; }
	.content-wrapper .dst a.dst-cta { text-align: center; }
}

/* Обект без снимка - спокойно поле с вида на обекта, вместо разпънато лого. */
.content-wrapper .dst-card-ph
{
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 12px;
	text-align: center;
	background: linear-gradient(160deg, #EEF0F4 0%, #E4E7EC 100%);
	color: #9AA1AC;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.02em;
}

/* --- Вписване в лейаута -----------------------------------------------------
   .mainmenu-wrapper носи декоративен зимен фон (winter-min.jpg, 410px) - той
   е за началната страница и зад хедъра на морски курорт се вижда планина под
   сняг. Този файл се зарежда само на страницата на дестинация, затова фонът
   тук се маха, а височината се смъква до 300px: .content-wrapper е издърпан
   с top:-170px, тоест хедърът застава на 25px под менюто, както в макета.
   Селекторът започва с body, защото файлът влиза ПРЕДИ main.css. */
body .mainmenu-wrapper
{
	background: #F6F7F9;
	height: 300px;
}

/* --- Оценка от Booking ------------------------------------------------------
   Зелената значка от макета. Показва се само когато places.booking_rating е
   попълнена - празна значка е по-лошо от липсваща. */
.content-wrapper .dst-card-top
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
}

.content-wrapper .dst-rating
{
	flex-shrink: 0;
	background: #1FA05C;
	color: #fff;
	font-size: 12.5px;
	font-weight: 800;
	border-radius: 999px;
	padding: 4px 10px;
	line-height: 1.35;
	white-space: nowrap;
}

/* --- Страници ---------------------------------------------------------------
   Разметката идва от resources/views/vendor/pagination/default.blade.php и
   се стилизира от .pagination в main.css. Тук само се сверява с палитрата на
   дестинацията. */
.content-wrapper .dst-pager
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding-top: 8px;
}

.content-wrapper .dst-pager-sum
{
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	color: var(--dst-mute);
}

.content-wrapper .dst-pager .pagination-wrap { margin: 8px 0 0; }

.content-wrapper .dst-pager .pagination > li > a,
.content-wrapper .dst-pager .pagination > li > span
{
	font-family: inherit;
	border-radius: 999px;
	border-color: var(--dst-line);
	color: var(--dst-ink-2);
	font-size: 14px;
}

.content-wrapper .dst-pager .pagination > li > a:hover
{
	border-color: var(--dst-accent);
	color: var(--dst-accent);
	background: #FDF3F7;
}

.content-wrapper .dst-pager .pagination > li.active > span,
.content-wrapper .dst-pager .pagination > li.active > a
{
	background: var(--dst-accent);
	border-color: var(--dst-accent);
	color: #fff;
}