/* Липите — подобрения 14.10.2026 (Страйв 4БГ). Зарежда се след основния CSS.
   Вид по системата на сайта (resource/public/style): жълто #fcb93f, синьо #0a52a1, тъмносиньо #022e5e,
   етикети #999, линии #dbdbdb; заглавия Neumann, текст Blogger Sans; бутони — жълти полета (като
   „Подземен гараж“) и линкове .cta-all (главни букви, жълта черта отдолу); без заоблени ъгли.
   1) поправки за телефон и достъпност  2) лента на телефон  3) „Свободни апартаменти“ (.lpa)
   4) план на апартамента  5) първи слайд */

/* ── 1. Телефон и достъпност ─────────────────────────────── */
@media (max-width: 1023px) {
	/* редът с иконки на „Апартаменти“ (начало) не се пренасяше → страницата ставаше 20 px по-широка */
	.apartments-home .l-wrap > .text { width: 100%; min-width: 0; }
	.apartments-home .text .list { flex-wrap: wrap; row-gap: 12px; }
	.location-home .wave { overflow: hidden; }
	.location-home .wave img, .cta-links .building img { max-width: 100%; }
	/* предпазител: без хоризонтално превъртане (clip не чупи position: sticky) */
	html, body { overflow-x: clip; }
}
/* зони за докосване ≥ 24 px */
.slick-dots li button { min-width: 24px; min-height: 24px; }
.l-footer .links li a { display: inline-block; padding: 4px 0; min-height: 24px; }

/* общи елементи в стила на сайта */
.lpa-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.lpa-box { display: inline-block; background-color: #fcb93f; color: #222; font-weight: bold; font-size: 20px; line-height: 1.2;
	padding: 18px 30px 14px; text-align: center; transition: background-color .2s, color .2s; }
.lpa-box:hover, .lpa-box.is-current { background-color: #0a52a1; color: #fcb93f; }

/* ── 2. Лента с действия на телефон (жълта като горната лента; основното — синьо/жълто като избран етаж) ── */
.lpa-mbar { display: none; }
@media (max-width: 767px) {
	.lpa-mbar {
		display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990;
		background-color: #fcb93f; box-shadow: 0 -2px 10px rgba(0, 0, 0, .15);
		padding-bottom: env(safe-area-inset-bottom);
	}
	.lpa-mbar a {
		flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
		min-height: 56px; font-weight: bold; font-size: 14px; line-height: 1.1; color: #222; text-transform: uppercase;
		border-left: 1px solid rgba(0, 0, 0, .1);
	}
	.lpa-mbar a:first-child { border-left: 0; }
	.lpa-mbar a i { font-size: 18px; }
	.lpa-mbar a.lpa-mbar--main { background-color: #0a52a1; color: #fcb93f; }
	body { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
}

/* ── 3. Свободни апартаменти ────────────────────────────── */
.lpa { padding: 40px 0 60px; }
.lpa .title .leaf-img { display: inline-block; width: 40px; margin: 0 0 0 -12px; vertical-align: bottom; }
.lpa-lead { font-size: 19px; line-height: 1.4; max-width: 760px; margin: -20px 0 24px; }
.lpa-tabs { display: flex; flex-wrap: wrap; margin: 0 0 16px; }
.lpa-tabs .lpa-box { border-left: 1px solid rgba(0, 0, 0, .1); }
.lpa-tabs .lpa-box:first-child { border-left: 0; }
.lpa-alt { margin: 0 0 30px; }

.lpa-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 20px 50px;
	border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; padding: 24px 0; margin: 0 0 10px; }
.lpa-f { border: 0; margin: 0; padding: 0; min-width: 0; }
.lpa-f legend { font-size: 15px; font-weight: bold; padding: 0 0 12px; }
.lpa-chips { display: flex; flex-wrap: wrap; }
.lpa-chip { position: relative; cursor: pointer; margin-right: 6px; }
.lpa-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.lpa-chip span { display: block; min-width: 42px; height: 42px; line-height: 42px; padding: 0 10px; text-align: center;
	font-size: 20px; color: #222; border: 1px solid rgba(0, 0, 0, .2); transition: border-color .2s, background-color .2s; }
.lpa-chip:hover span { border-color: rgba(0, 0, 0, .5); }
.lpa-chip input:checked + span { background-color: #fcb93f; border-color: transparent; }
.lpa-chip input:focus-visible + span { outline: 2px solid #0a52a1; outline-offset: 2px; }
.lpa-filter select, .lpa-range input {
	height: 42px; border: 0; border-bottom: 1px solid rgba(0, 0, 0, .3); border-radius: 0; background: transparent;
	font: inherit; font-size: 19px; color: #222; padding: 0 4px; }
.lpa-range { display: flex; align-items: center; gap: 8px; }
.lpa-range input { width: 90px; }
.lpa-f--end { margin-left: auto; display: flex; align-items: center; gap: 20px; }
.lpa-count { margin: 0; font-size: 17px; color: #999; }
.lpa-count strong { color: #222; font-size: 25px; font-weight: bold; }
.lpa-reset { background: none; border: 0; border-bottom: 1px solid #fcb93f; padding: 0; cursor: pointer;
	font: inherit; font-size: 17px; text-transform: uppercase; color: #222; }

.lpa-table { width: 100%; border-collapse: collapse; font-size: 17px; }
.lpa-table th, .lpa-table td { padding: 15px 20px 15px 0; text-align: left; border-bottom: 1px solid #dbdbdb; vertical-align: middle; }
.lpa-table thead th { font-size: 15px; font-weight: normal; color: #999; text-transform: uppercase; white-space: nowrap; }
.lpa-table thead button { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-transform: inherit; cursor: pointer; }
.lpa-table thead button::after { content: ' \2195'; color: #ccc; }
.lpa-table thead button[aria-sort="ascending"]::after { content: ' \2191'; color: #fcb93f; }
.lpa-table thead button[aria-sort="descending"]::after { content: ' \2193'; color: #fcb93f; }
.lpa-table tbody th a { font-family: 'Neumann', serif; font-weight: normal; font-size: 28px; color: #222; }
.lpa-table tbody th a:hover { color: #0a52a1; }
.lpa-table tbody td { color: #222; }
.lpa-table tr[hidden] { display: none !important; }
.lpa-go { text-align: right; white-space: nowrap; }
.lpa-note { font-size: 15px; color: #999; margin: 12px 0 0; }
.lpa-empty { margin: 24px 0; font-size: 19px; }
.lpa-cta { margin-top: 50px; padding: 30px 0 0; border-top: 1px solid #dbdbdb; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 40px; }
.lpa-cta p { margin: 0; flex: 1 1 320px; font-size: 19px; line-height: 1.4; }
.lpa-cta-btns { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 30px; }

@media (max-width: 767px) {
	.lpa-lead { font-size: 17px; margin-top: -10px; }
	.lpa-box { font-size: 17px; padding: 15px 20px 12px; }
	.lpa-filter { gap: 16px 24px; padding: 18px 0; }
	.lpa-f:first-child { flex-basis: 100%; }
	.lpa-range input { width: 70px; }
	.lpa-f--end { margin-left: 0; width: 100%; justify-content: space-between; }
	/* таблицата става карти */
	.lpa-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
	.lpa-table, .lpa-table tbody, .lpa-table tr { display: block; }
	.lpa-table tr { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 20px; border-bottom: 1px solid #dbdbdb; padding: 18px 0; }
	.lpa-table th, .lpa-table td { display: block; border: 0; padding: 0; }
	.lpa-table tbody th { grid-column: 1 / -1; }
	.lpa-table td[data-l]::before { content: attr(data-l); display: block; font-size: 13px; color: #999; text-transform: uppercase; padding-bottom: 2px; }
	.lpa-table .lpa-opt { display: none; }
	.lpa-go { grid-column: 1 / -1; text-align: left; }
}

/* бутон към списъка на страницата на фазата — като „Подземен гараж“ */
.lpa-stagebar { display: flex; justify-content: center; padding: 30px 20px 0; }

/* ── 4. План на апартамента ─────────────────────────────── */
.lpa-plan-btns { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 30px; margin: 15px 0 0; position: relative; z-index: 2; }
/* нулиране: стиловете на сайта за плана (.ap-plan a) и за бутоните във формите не бива да се прилагат */
.lpa-plan-btns .cta-all { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
	font-family: 'Blogger Sans', Helvetica, sans-serif; font-size: 17px; line-height: 1.3; text-transform: uppercase; color: #222;
	border-bottom: 1px solid #fcb93f; padding-bottom: 2px; }
.lpa-plan-btns .cta-all:hover { color: #0a52a1; }
.lpa-plan-btns .cta-all:focus-visible { outline: 2px solid #0a52a1; outline-offset: 2px; }

/* ── 5. Първият слайд: основен бутон — жълто поле; втори — линк като на сайта ── */
.h-hero .lpa-hero a { display: inline-block; margin: 14px 30px 0 0; }
.h-hero .lpa-hero a:not(.lpa-hero-2) { background-color: #fcb93f; color: #222; font-weight: bold; text-transform: uppercase;
	padding: 16px 26px 13px; border: 0; transition: background-color .2s, color .2s; }
.h-hero .lpa-hero a:not(.lpa-hero-2):hover { background-color: #0a52a1; color: #fcb93f; }
.h-hero .lpa-hero a.lpa-hero-2 { color: #fff; text-transform: uppercase; border-bottom: 1px solid #fcb93f; padding: 0 0 2px; }
.h-hero .lpa-hero p { max-width: 560px; }
/* тъмен преход отляво под текста на първия слайд — за четимост */
.h-hero .slide:has(.lpa-hero)::before {
	opacity: 1; background: linear-gradient(90deg, rgba(2, 46, 94, .78) 0%, rgba(2, 46, 94, .45) 42%, rgba(2, 46, 94, 0) 70%);
}
@media (max-width: 767px) {
	.h-hero .slide:has(.lpa-hero)::before { background: linear-gradient(0deg, rgba(2, 46, 94, .85) 0%, rgba(2, 46, 94, .35) 55%, rgba(2, 46, 94, 0) 80%); }
	.h-hero .lpa-hero a { margin-right: 20px; }
}

/* ── 6. Формата на HubSpot на „Контакти“ — в стила на сайта (14.10.2026): по-голямо разстояние между полетата и съгласията ── */
.contact-form .hs-form { max-width: 640px; margin: 0 auto; padding: 0 20px; font-family: 'Blogger Sans', Helvetica, sans-serif; }
.contact-form .hs-form .hs-form-field { margin: 0 0 18px; }
.contact-form .hs-form .hs-form-field > label { display: block; font-size: 15px; font-weight: bold; margin: 0 0 6px; color: #222; }
.contact-form .hs-form .hs-form-required { color: #fcb93f; margin-left: 2px; }
.contact-form .hs-form .hs-input:not([type=checkbox]) { width: 100% !important; box-sizing: border-box; height: 44px; border: 0; border-bottom: 1px solid rgba(0, 0, 0, .3);
	border-radius: 0; background: transparent; font: inherit; font-size: 18px; padding: 0 4px; color: #222; }
.contact-form .hs-form textarea.hs-input { height: 96px !important; padding-top: 8px; resize: vertical; }
.contact-form .hs-form .hs-input:not([type=checkbox]):focus { outline: none; border-bottom: 2px solid #fcb93f; }
.contact-form .hs-form .inputs-list { list-style: none; margin: 0; padding: 0; }
.contact-form .hs-form .hs-fieldtype-booleancheckbox { margin: 0 0 14px; }
.contact-form .hs-form .hs-form-booleancheckbox-display { display: flex; align-items: flex-start; gap: 12px; font-size: 16px; line-height: 1.4; cursor: pointer; }
.contact-form .hs-form .hs-form-booleancheckbox-display input { flex: 0 0 22px; width: 22px; height: 22px; margin: 0; accent-color: #fcb93f; }
.contact-form .hs-form .hs-error-msgs { list-style: none; margin: 6px 0 0; padding: 0; color: #d0021b; font-size: 14px; }
.contact-form .hs-form .hs_submit { margin-top: 26px; text-align: center; }
.contact-form .hs-form .hs-button { background: #fcb93f; color: #222; border: 0; border-radius: 0; font: inherit; font-weight: bold; font-size: 18px; text-transform: uppercase;
	padding: 16px 40px 13px; cursor: pointer; transition: background-color .2s, color .2s; }
.contact-form .hs-form .hs-button:hover { background: #0a52a1; color: #fcb93f; }
@media (max-width: 767px) { .contact-form .hs-form .hs-button { width: 100%; } }

/* ── 7. Дизайн-проверка 14.10.2026 ── */
/* съгласия във формите на апартамента („Получете цена“, „Запишете се за оглед“): по-голямо квадратче и разстояние */
label.check { display: block !important; position: relative; padding-left: 32px !important; line-height: 1.4; margin: 0 0 12px; cursor: pointer; }
label.check input[type=checkbox] { position: absolute; left: 0; top: 1px; width: 20px; height: 20px; margin: 0; accent-color: #fcb93f; }
/* таблици в текстовете на CMS (напр. Политика за бисквитките) — на телефон се плъзгат настрани, не се режат */
@media (max-width: 767px) {
	.l-editor table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; font-size: 14px; }
	.l-editor table th, .l-editor table td { min-width: 110px; vertical-align: top; }
	/* годините в „Новини“ — пренасят се, вместо да излизат извън екрана */
	.news-years { display: flex; flex-wrap: wrap; gap: 6px 16px; padding-left: 20px !important; padding-right: 20px; }
	/* слайдерът „Ход на строителството“ с много месеци — без редица точки (не се събира) */
	.construction-slider .slick-dots:has(li:nth-child(9)) { display: none; }  /* над 8 точки не се събират — слайдерът се плъзга */
}
