/* ==========================================================================
   Carenzzo — Brand skin для White Label виджета бронирования localrent
   Подключается ВЕЗДЕ, где выводится шорткод [carenzzo_localrent]
   (single CPT `location` + стайл-гайд) — регистрация в functions.php,
   enqueue из колбэка шорткода + head-enqueue на страницах с виджетом.

   Виджет рендерится ОТКРЫТЫМ DOM (без iframe / shadow). Его корень —
   <div id="carenzzo" class="carenzzo">. ВАЖНО: виджет компилирует СВОЙ CSS
   тоже под #carenzzo (из data-id="carenzzo") и грузит его рантаймом ПОЗЖЕ нас,
   а его правила имеют вид `#carenzzo .x[data-v-xxxx]` — специфичность (1,3,0).
   Поэтому одиночный `#carenzzo .x` (1,2,0) проигрывает. Чтобы стабильно
   перебивать их (и не зависеть от меняющегося хэша data-v), используем
   ДВОЙНОЙ id-якорь `#carenzzo#carenzzo` — 2 id перекрывают их 1 id по
   первому разряду специфичности. Это чище и предсказуемее, чем !important.

   ВСЕ значения — из токенов theme.json. Никакого хардкода палитры по месту:
   --wp--preset--color--*  --wp--custom--shadow|duration|ease|radius--*
   ========================================================================== */

/* --- Бренд-алиасы на токены + переменные движка Swiper (на корне виджета) --- */
#carenzzo {
	--brand:        var(--wp--preset--color--primary);        /* #0E7A66 teal */
	--brand-strong: var(--wp--preset--color--primary-strong); /* #0B5F50 hover/link */
	--brand-soft:   var(--wp--preset--color--primary-soft);   /* #E7F4F0 tint */
	--brand-on:     var(--wp--preset--color--on-primary);     /* #FFFFFF */
	--brand-accent: var(--wp--preset--color--accent-strong);  /* #92600A honey (счётчики/выгоды) */
	--brand-ring:   var(--wp--custom--shadow--ring);          /* 0 0 0 3px rgba(14,122,102,.35) */
	--brand-bd:     var(--wp--preset--color--border-strong);  /* #C5D2CE */
	--brand-dur:    var(--wp--custom--duration--fast);        /* 150ms */
	--brand-ease:   var(--wp--custom--ease--out);             /* cubic-bezier(.22,1,.36,1) */

	/* Swiper (галерея авто / пагинация фильтров) красится через свои переменные */
	--swiper-theme-color: var(--brand);
	--swiper-pagination-color: var(--brand);
	--swiper-pagination-bullet-inactive-color: var(--brand-bd);
}

/* ==========================================================================
   ШИРИНА: растягиваем внутренний контейнер виджета на всю ширину секции-обёртки
   .mrcwhitelabel у localrent имеет собственный max-width:1110px и прижат влево
   → выдача (строка поиска, чипы, грид авто) не дотягивалась до правого края
   колонки. Снимаем ограничение через двойной id-якорь (без !important), чтобы
   виджет занимал всю ширину .sg-container и совпадал по краям с остальными
   секциями. Сетки/строка поиска внутри виджета — отзывчивые, тянутся сами.
   ========================================================================== */
#carenzzo#carenzzo .mrcwhitelabel {
	max-width: none;
	margin-inline: 0;
}

/* --- Типографика: корпоративный Inter вместо IBM Plex Sans -----------------
   Виджет задаёт IBM Plex per-element ([data-v]-правила), поэтому `inherit`
   не достаёт наш шрифт. Форсим body-шрифт на корне и всех потомках: проверено —
   в виджете ровно два семейства (IBM Plex и наш Inter), иконочного шрифта нет
   (иконки — inline-SVG), поэтому глобальная замена безопасна. */
#carenzzo#carenzzo,
#carenzzo#carenzzo * {
	font-family: var(--wp--preset--font-family--body);
}

/* ==========================================================================
   КНОПКИ / CTA  (.button.appearance-default — generic CTA; кнопка «View»
   в карточке авто = .vehicle-card-footer__view; «Load more» = .search__button-more)
   ========================================================================== */
#carenzzo#carenzzo .button.appearance-default {
	background-color: var(--brand);
	color: var(--brand-on);
	transition:
		background-color var(--brand-dur) var(--brand-ease),
		box-shadow var(--brand-dur) var(--brand-ease);
}
#carenzzo#carenzzo .button.appearance-default:hover,
#carenzzo#carenzzo .button.appearance-default:focus-visible {
	background-color: var(--brand-strong);
	color: var(--brand-on);
}
#carenzzo#carenzzo .button.appearance-default:active {
	background-color: var(--brand-strong);
}
/* Кнопка карточки авто — явный дубль-якорь на случай иной композиции классов */
#carenzzo#carenzzo .vehicle-card-footer__view {
	background-color: var(--brand);
	color: var(--brand-on);
}
#carenzzo#carenzzo .vehicle-card-footer__view:hover {
	background-color: var(--brand-strong);
}

/* ==========================================================================
   СТРОКА ПОИСКА: отключаем прилипание (по решению — липнет только хедер сайта)
   localrent задаёт .search-cigarette.search__settings { position:sticky;
   top:-160px; z-index:99 } — из-за чего строка поиска липла под хедером.
   Переводим её в обычный поток (position:static): прокручивается вместе с
   контентом, не липнет, не конфликтует с липким хедером сайта. Перебиваем
   двойным id-якорем (2 id > 1 id виджета), без !important. Раскладку/функции
   виджета (фильтры, выдача, брендинг) это не трогает — только прилипание.
   ========================================================================== */
#carenzzo#carenzzo .search-cigarette.search__settings {
	position: static;
	top: auto;
}

/* ==========================================================================
   КОМПАКТНАЯ СТРОКА ПОИСКА — крупная брендовая поверхность
   .search-cigarette__wrap: дефолтный фон виджета зелёный → teal
   ========================================================================== */
#carenzzo#carenzzo .search-cigarette__wrap {
	background-color: var(--brand);
}
/* Поля внутри строки поиска (город / даты) — доступный фокус на тёмном фоне */
#carenzzo#carenzzo .search-cigarette__wrap :focus-visible {
	outline: 2px solid var(--brand-on);
	outline-offset: 2px;
	border-radius: var(--wp--custom--radius--sm);
}

/* ==========================================================================
   ПОЛЯ ПОИСКА: фокус/активные акценты триггеров дат/города/выпадашек
   ========================================================================== */
#carenzzo#carenzzo .dropdown__trigger:focus-within,
#carenzzo#carenzzo .search-calendar__trigger:focus-within,
#carenzzo#carenzzo .search-place-time__trigger:focus-within,
#carenzzo#carenzzo .city-picker__wrap:focus-within,
#carenzzo#carenzzo .date-range:focus-within {
	color: var(--brand-strong);
}
/* Иконки-стрелки триггеров в наведённом состоянии */
#carenzzo#carenzzo .dropdown:hover .trigger__icon-down,
#carenzzo#carenzzo .search-calendar__trigger:hover .search-calendar__icon-down,
#carenzzo#carenzzo .city-picker:hover .city-picker__arrow-down {
	color: var(--brand);
}

/* ==========================================================================
   ЕДИНЫЙ РАДИУС ПОПАПОВ виджета (injected) — токен radius--lg (16px)
   --------------------------------------------------------------------------
   Поповеры строки поиска (Pick-up / Drop-off / Specify location / Rental
   dates) рендерятся в общий контейнер .dropdown__content (родной радиус 4px).
   Приводим его к системному радиусу попапов lg (16px) — как у наших меню
   (переключатель языка, мега-дропдаун хедера, cookie) и панели фильтров.
   overflow:hidden обрезает внутренний «лист» (шапка/тело/липкий футер) по
   скруглению, иначе их прямые углы выступали бы за рамку. Геометрию/скролл/
   позиционирование (родительский .dropdown__menu) это не меняет — только
   радиус контейнера. Перебиваем двойным id-якорем, без !important.
   Сортировка (Price: Low to High) — нативный <select> (label > select),
   её список рисует ОС: радиусом не управляется, вне нашего контроля.
   ========================================================================== */
#carenzzo#carenzzo .dropdown__content {
	border-radius: var(--wp--custom--radius--lg);
	overflow: hidden;
}

/* ==========================================================================
   ЧИПЫ «ПОПУЛЯРНЫХ ФИЛЬТРОВ» (.filter-card) — активное/hover в палитре
   ========================================================================== */
/* Галочка чекбокса — inline-SVG <rect fill="#3AA37E"> → перекраска через fill */
#carenzzo#carenzzo .filter-card__checkbox rect {
	fill: var(--brand);
}
/* Hover чипа: подсветка лейбла */
#carenzzo#carenzzo .filter-card:hover .filter-card__label {
	color: var(--brand-strong);
}
/* Активный (выбранный) чип: tint-фон + лейбл в бренд */
#carenzzo#carenzzo .filter-card:has(input:checked) {
	background-color: var(--brand-soft);
	border-radius: var(--wp--custom--radius--sm);
}
#carenzzo#carenzzo .filter-card:has(input:checked) .filter-card__label {
	color: var(--brand-strong);
}
/* Счётчик у фильтра — медовый акцент (выгода/число) */
#carenzzo#carenzzo .filter-card__count {
	color: var(--brand-accent);
}

/* ==========================================================================
   ССЫЛКИ / ПУНКТИРНЫЕ ИНТЕРАКТИВНЫЕ АКЦЕНТЫ
   ========================================================================== */
#carenzzo#carenzzo .link-dashed-M {
	color: var(--brand-strong);
	border-bottom-color: currentColor;
	transition: color var(--brand-dur) var(--brand-ease);
}
#carenzzo#carenzzo .link-dashed-M:hover {
	color: var(--brand);
}

/* ==========================================================================
   КАЛЕНДАРЬ / ВЫБРАННЫЙ ДИАПАЗОН ДАТ (попап рендерится по требованию)
   Защитная перекраска брендового зелёного у выбранных дней localrent.
   ========================================================================== */
#carenzzo#carenzzo .search-calendar [class*="selected"],
#carenzzo#carenzzo .search-calendar [class*="--start"],
#carenzzo#carenzzo .search-calendar [class*="--end"],
#carenzzo#carenzzo .date-range [class*="selected"] {
	background-color: var(--brand);
	color: var(--brand-on);
}
#carenzzo#carenzzo .search-calendar [class*="range"]:not([class*="--start"]):not([class*="--end"]) {
	background-color: var(--brand-soft);
}

/* ==========================================================================
   FOCUS-RING: единый брендовый видимый фокус (a11y, WCAG 2.1)
   ========================================================================== */
#carenzzo#carenzzo .button:focus-visible,
#carenzzo#carenzzo .compare-btn:focus-visible,
#carenzzo#carenzzo .favorite-btn:focus-visible,
#carenzzo#carenzzo .filter-card input:focus-visible,
#carenzzo#carenzzo .dropdown__trigger:focus-visible,
#carenzzo#carenzzo .search-calendar__trigger:focus-visible,
#carenzzo#carenzzo .search-place-time__trigger:focus-visible,
#carenzzo#carenzzo .sort-select:focus-visible,
#carenzzo#carenzzo a:focus-visible {
	outline: 2px solid var(--brand);
	outline-offset: 2px;
	box-shadow: var(--brand-ring);
}
/* Чекбокс фильтра без своего ring — подчёркиваем парный лейбл */
#carenzzo#carenzzo .filter-card input:focus-visible + .filter-card__label {
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* ==========================================================================
   ПРОМО-БЕЙДЖИ КАРТОЧЕК АВТО (featuring-cool-cars) — из фиолетового/циана в бренд
   localrent красит .featuring-cool-cars__low-deposit фиолетовым (#A259FF), а
   .featuring-cool-cars__no-credit-card — циановым (#03A9F4). Это выбивается из
   teal-скина. Переводим в бренд-палитру: «Low deposit» → teal (primary),
   «No credit card» → honey (accent). Текст — on-primary (#fff) для контраста.
   Двойной id-якорь (2 id > 1 id виджета), без !important, только токены.
   ========================================================================== */
#carenzzo#carenzzo .featuring-cool-cars__low-deposit {
	background-color: var(--brand);
	color: var(--brand-on);
}
#carenzzo#carenzzo .featuring-cool-cars__no-credit-card {
	background-color: var(--brand-accent);
	color: var(--brand-on);
}

/* --- Доступность движения -------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	#carenzzo#carenzzo .button.appearance-default,
	#carenzzo#carenzzo .vehicle-card-footer__view,
	#carenzzo#carenzzo .link-dashed-M {
		transition-duration: 0.001ms;
	}
}