/*
Theme Name: ListingHive Child — 99 by CleanWhale
Template: listinghive
Version: 1.4.0
Description: Фирменный стиль CleanWhale для доски объявлений «99». Синий #2457C6, жёлтый #FFC73B, futura-pt.
Author: CleanWhale
*/

:root {
  --cw-blue: #2457C6;
  --cw-blue-dark: #1C47A6;
  --cw-yellow: #FFC73B;
  --cw-green: #59B78B;
  --cw-dark: #242424;
  --cw-grey: rgba(0, 0, 0, .6);
  --cw-bg: #fafafa;
  --cw-border: rgba(0, 0, 0, .2);
  --cw-radius: .3vw;
}

/* ── Шрифт бренда ─────────────────────────────────────────── */
body, button, input, select, textarea, .button {
  font-family: 'futura-pt', sans-serif;
  color: #000;
}
h1, h2, h3, h4, h5, h6,
.header-logo__name,
.hp-listing__title, .hp-listing-category__name {
  font-family: 'futura-pt', sans-serif;
  font-weight: 600;
}

/* ── Хедер: синий, как на cleanwhale.se ───────────────────── */
.header-navbar {
  background: var(--cw-blue);
}
.header-navbar a,
.header-navbar .hp-link,
.header-navbar .menu-item > a,
.header-navbar .hp-menu__item,
.header-navbar .header-logo__name,
.header-navbar .header-navbar__burger a {
  color: #fff !important;
}
.header-navbar .menu-item > a:hover,
.header-navbar .hp-link:hover {
  color: var(--cw-yellow) !important;
}
.header-navbar .menu-item.current-menu-item > a {
  color: var(--cw-yellow) !important;
}

/* Исключение из правила выше. Шапка синяя и красит ВСЕ ссылки в белый через
   !important — но панель выпадающего меню белая, и на ней белый текст исчезает:
   «Kategorie» открывалась пустым белым прямоугольником, хотя все 6 категорий
   были на месте. Третий случай того же бага (до этого так же пропали поле ввода
   агента и карточка черновика). !important здесь обязателен — иначе правило
   шапки перебивает по важности, а не по специфичности. */
.header-navbar ul.sub-menu a,
.header-navbar ul.sub-menu .menu-item > a {
  color: #1a1a1a !important;
}
.header-navbar ul.sub-menu a:hover,
.header-navbar ul.sub-menu .menu-item > a:hover {
  color: var(--cw-blue) !important;
}

/* Тот же баг, четвёртый случай — и самый дорогой. Панель меню-бургера
   (.header-navbar__burger > ul) выпадает БЕЛОЙ, а правило шапки выше красит в
   белый в том числе её ссылки — там прямо назван селектор
   `.header-navbar .header-navbar__burger a`. Замер живой страницы на 375px:
   ul.menu background rgb(255,255,255), у всех пунктов color rgb(255,255,255) —
   контраст 1:1, меню открывалось пустым белым листом. Вместе с пунктами
   пропадала «Zaloguj się», а на мобильном это ЕДИНСТВЕННЫЙ вход в аккаунт
   (десктопный nav на узком экране display:none) — войти с телефона было
   физически некуда. Сам значок ☰ — прямой потомок .header-navbar__burger > a,
   не потомок ul, — остаётся белым: он лежит на синей полосе. */
.header-navbar .header-navbar__burger > ul a,
.header-navbar .header-navbar__burger > ul .menu-item > a {
  color: #1a1a1a !important;
}
.header-navbar .header-navbar__burger > ul a:hover,
.header-navbar .header-navbar__burger > ul .menu-item > a:hover,
.header-navbar .header-navbar__burger > ul .menu-item.current-menu-item > a {
  color: var(--cw-blue) !important;
}
/* Зона нажатия бургера. Замер живой страницы на 390: и обёртка, и ссылка внутри
   были 14×16 px — ровно глиф ☰, без единого пикселя паддинга. Реальными кликами
   проверено, что промах на 8px мимо иконки меню НЕ открывает; а внутри этого
   меню лежит единственный на мобилке вход в аккаунт «Zaloguj się», то есть
   224 px² активной зоны — это «логин не работает». Отрицательный margin гасит
   прирост бокса, чтобы сам значок остался ровно там же, где стоял: растёт
   только площадь попадания (44×44), не композиция шапки.

   ⚠️ МЕДИАЗАПРОС ОБЯЗАТЕЛЕН, и вот почему. Родительская тема прячет бургер на
   десктопе НЕ отдельным свойством, а тем же самым `display` на том же самом
   селекторе:
       .header-navbar__burger > a { display: none }                     (везде)
       @media (max-width: 74.99em) { .header-navbar__burger > a { display: flex } }
   Первая версия этого правила стояла без медиазапроса, поэтому `display:flex`
   перебивал `display:none` и на ≥1200px в шапке появлялся лишний бургер, а по
   клику он накрывал страницу белым полноэкранным мобильным меню — дублируя
   уже видимое горизонтальное. Границу берём ровно ту же, что у темы
   (74.99em = 1199.84px), чтобы зона нажатия появлялась и исчезала ВМЕСТЕ с
   самим значком, а не рядом с ним. */
@media only screen and (max-width: 74.99em) {
  .header-navbar .header-navbar__burger > a {
    display: flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    margin: -14px;
  }
}
/* Пункты открытого меню: 25px высоты при шаге строки 35px — тап по любому из
   них требует прицеливания, хотя меню занимает весь экран и свободного места
   по вертикали 600+px. Паддинг доводит хит-бокс до 43px, кегль и цвет прежние. */
.header-navbar .header-navbar__burger > ul a,
.header-navbar .header-navbar__burger > ul .menu-item > a {
  display: block;
  padding: 9px 0;
}
/* Крестик закрытия (ul::before) и шеврон «Kategorie» (li.parent::after) заданы
   родительской темой цветом rgba(7,36,86,.25) — на белой панели меню это
   1.6:1, то есть пользователь не видит ни того, что меню закрывается крестиком,
   ни того, что «Kategorie» раскрывается. .55 даёт ~3.4:1 (порог для элементов
   управления — 3:1). Геометрия и форма значков не тронуты. */
.header-navbar .header-navbar__burger > ul::before,
.header-navbar .header-navbar__burger > ul .menu-item.parent::after {
  color: rgba(7, 36, 86, .55) !important;
}
.header-logo img {
  max-height: 44px;
  width: auto;
}
/* Официальный wordmark CleanWhale + имя продукта. */
/* nowrap: при 320px «99 by CleanWhale» ломался на две строки и шапка вырастала
   с 64 до 95px, хотя однострочная ширина (199.6px) укладывалась в доступные
   218px до бургера — переносило по пробелам внутри флекса, а не от нехватки
   места. */
.header-logo .cw99-logo-svg { display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; white-space: nowrap; }
.header-logo .header-logo__name { white-space: nowrap; }
.header-logo .cw99-logo-svg img {
  display: block;
  height: 32px;
  width: auto;
}
.header-logo .cw99-logo-svg span { color: var(--cw-yellow); font-size: 1.2em; font-weight: 700; }

/* ── Кнопки ──────────────────────────────────────────────── */
.button--primary,
button[type=submit],
.hp-form button[type=submit] {
  background-color: var(--cw-blue) !important;
  border-color: var(--cw-blue) !important;
  color: #fff !important;
  border-radius: 6px;
  transition: background-color .3s;
}
.button--primary:hover,
button[type=submit]:hover,
.hp-form button[type=submit]:hover {
  background-color: var(--cw-blue-dark) !important;
  border-color: var(--cw-blue-dark) !important;
}
.button--secondary {
  border-color: var(--cw-green) !important;
  color: var(--cw-green) !important;
  border-radius: 6px;
}

/* ── Ссылки и акценты ────────────────────────────────────── */
a { color: var(--cw-blue); }
a:hover { color: var(--cw-blue-dark); }
.hp-listing__title a:hover { color: var(--cw-blue); }

.hp-listing--featured { border-color: var(--cw-yellow) !important; }
.hp-listing__attribute--price,
.hp-listing__attributes--primary .hp-listing__attribute {
  background: var(--cw-yellow);
  color: #000;
  border-radius: 4px;
  padding: 2px 8px;
  font-weight: 600;
  display: inline-block;
}

/* ── Цена: «6 000 zł – 9 000 zł za miesiąc brutto» одной лентой ──
 *
 * Цена перестала быть одним числом: у неё появились верхняя граница вилки
 * (нужна вакансиям) и единица (za miesiąc / za godzinę / do negocjacji).
 * HivePress рисует КАЖДЫЙ атрибут отдельным <div>, поэтому по умолчанию
 * получаются три жёлтые плашки подряд вместо одной цены.
 *
 * ПОЧЕМУ inline, А НЕ FLEX. Первая версия склеивала их флексом с нулевым
 * зазором — и на мобильном (проверено в браузере на 375px) ряд не влезал,
 * распадаясь на ТРИ жёлтых блока в три строки, каждый со своим огрызком
 * скругления. У инлайновых боксов фон и скругления работают как у одной
 * ленты текста: перенос строки просто продолжает подсветку, скругление
 * остаётся у начала первого фрагмента и у конца последнего
 * (box-decoration-break: slice — поведение по умолчанию, тут оно и нужно).
 *
 * Порядок в разметке задан menu_order атрибутов (цена 10/20/30 идёт раньше
 * типа 40 и города 50), см. board/wp/scripts/cw99-data-model.php.
 */
/* Селекторы с префиксом контейнера намеренно: правило выше
   («.hp-listing__attributes--primary .hp-listing__attribute») имеет
   специфичность 0-2-0 и голый «.hp-listing__attribute--price» его не
   перебивает — на живой карточке цена так и осталась тремя блоками. */
/* Тема (frontend.min.css) держит на карточке
   «.hp-listing--view-block .hp-listing__attributes--primary { display:flex }»
   со специфичностью 0-2-0. Флекс-контейнер БЛОКИФИЦИРУЕТ детей: заявленный
   display:inline у кусков цены превращался в block, лента распадалась на
   плашки, а по вычисленным стилям это выглядело как «правило не применилось».
   Отсюда префикс `.hp-listing--view-block` — перебиваем ровно то правило. */
.hp-listing__attributes--primary,
.hp-listing--view-block .hp-listing__attributes--primary { display: block; }
.hp-listing__attributes--primary .hp-listing__attribute--price,
.hp-listing__attributes--primary .hp-listing__attribute--price-max,
.hp-listing__attributes--primary .hp-listing__attribute--price-unit {
  display: inline;
  padding: 2px 0;
  line-height: 1.75;
}
.hp-listing__attributes--primary .hp-listing__attribute--price {
  border-radius: 4px 0 0 4px; padding-left: 8px;
}
.hp-listing__attributes--primary .hp-listing__attribute--price-max {
  border-radius: 0; padding-left: .3em;
}
.hp-listing__attributes--primary .hp-listing__attribute--price-unit {
  border-radius: 0 4px 4px 0;
  padding-right: 8px; padding-left: .35em;
  font-weight: 500;
  font-size: .88em;
  white-space: nowrap;
}

/* ── ГДЕ ЛЕНТЕ ЦЕНЫ МОЖНО ПЕРЕНОСИТЬСЯ, А ГДЕ НЕЛЬЗЯ ────────────────────────
 *
 * Правило общее для каталога и страницы объявления: точки переноса — свойство
 * содержимого, а не контекста, и разъезжаться им нельзя.
 *
 * Исходные данные (замер живой разметки, hp_display_format в
 * board/wp/scripts/cw99-data-model.php):
 *   --price      = «6 000 zł»       — ВСЕ пробелы неразрывные
 *   --price-max  = «– 9 000 zł» — тоже
 *   --price-unit = «za miesiąc brutto»         — обычные пробелы
 * Между <div>-ами в разметке нет НИ ОДНОГО пробельного символа, значит своих
 * точек переноса на стыках кусков не существует вовсе.
 *
 * Отсюда две ошибки, которые тут исправлены.
 *
 * 1. `white-space: nowrap` на всей ленте (правка 2026-08-06) убрал ПОСЛЕДНЮЮ
 *    точку переноса. Он ставился ради неразрывной вилки, но числа и так
 *    неразрывны из-за U+00A0, а единственная точка (пробел в ::before у
 *    единицы) оказалась внутри nowrap-элемента и была подавлена вместе со
 *    всем остальным. Итог: на 360 лента вылезала за карточку на 37px, на 320
 *    обрезалась по букве («za miesiąc b»). Правку сделали шире, чем нужно.
 * 2. Обратная крайность (лента без nowrap вообще) ломается на en-dash: по
 *    UAX#14 у U+2013 класс BA, и правило LB12a разрешает перенос между BA и
 *    следующим NBSP. Проверено в браузере: «–» оставался один в конце строки,
 *    а неразрывный пробел за ним вставал в начало следующей и читался как
 *    отступ. Поэтому nowrap нужен, но ТОЛЬКО на --price-max.
 *
 * Итог: неразрывны сами суммы, перенос разрешён МЕЖДУ кусками, и делает его
 * сгенерированный пробел у ПРЕДЫДУЩЕГО куска (у --price-max он объявлен с
 * white-space:normal, иначе унаследовал бы nowrap самого куска и был бы снова
 * подавлен). `:has()` — чтобы пробел не появлялся у последнего куска: там он
 * ушёл бы внутрь скруглённого хвоста ленты и раздвинул его на ~5px. */
.hp-listing__attributes--primary .hp-listing__attribute--price {
  white-space: normal;
}
/* ⚠️ ЗДЕСЬ СТОЯЛ `white-space: nowrap` — снят, и вместе с ним переехала точка
   переноса вилки. Разбор дефекта каталожной карточки: при nowrap на всей
   верхней границе («– 9 000 zł») перенос мог случиться только ПЕРЕД ней, и
   en-dash оказывался ПЕРВЫМ символом второй строки — «9 000 zł» с тире перед
   ним читается как отрицательное число (замер на 320: price 56→118.3 в первой
   строке, max 56→134 во второй, тире в позиции x=56).
   Убрать nowrap совсем тоже нельзя было: по UAX#14 у U+2013 класс BA, перенос
   разрешён ПОСЛЕ него, но следом в формате стоял неразрывный пробел — он
   вставал в начало второй строки видимым отступом.
   Теперь разделение задачи развели: НЕРАЗРЫВНОСТЬ «zł –» даёт NBSP в
   сгенерированном стыке (ниже), а ЕДИНСТВЕННУЮ точку переноса вилки — обычный
   пробел после тире в самом `hp_display_format` атрибута price_max
   (board/wp/scripts/cw99-data-model.php). Тире всегда остаётся в конце первой
   строки, как того требует типографика диапазона, а тире в разметке — то есть
   копирование и скринридер получают его вместе с текстом. */
.hp-listing__attributes--primary .hp-listing__attribute--price-max {
  white-space: normal;
}
/* Префикс `.hp-listing` и `display:inline` — не украшение селектора, а
   обязательное условие. Ниже, в блоке страницы объявления, стоит
   `.hp-listing--view-page .hp-listing__attributes--primary
    .hp-listing__attribute::after { display: none }` (0-3-0, и оно идёт позже по
   файлу) — оно гасило этот пробел целиком: на 1280 лента печаталась как
   «6 000 zł– 9 000 zł», без зазора у вилки. Корневой контейнер несёт класс
   `.hp-listing` и в каталоге, и на странице объявления, поэтому 0-4-0
   перебивает его на обеих поверхностях одинаково. */
.hp-listing .hp-listing__attributes--primary .hp-listing__attribute--price:has(+ .hp-listing__attribute--price-unit)::after,
.hp-listing .hp-listing__attributes--primary .hp-listing__attribute--price-max:has(+ .hp-listing__attribute--price-unit)::after {
  content: ' ';
  display: inline;
  white-space: normal;
}
/* Стык «сумма → верхняя граница вилки» — ЕДИНСТВЕННЫЙ, где пробел неразрывный.
   Тире принадлежит первой сумме: «6 000 zł –» обязано уехать на новую строку
   целиком, иначе тире открывает строку и читается минусом. Ширина NBSP равна
   ширине обычного пробела, поэтому однострочный вид ленты не меняется. */
.hp-listing .hp-listing__attributes--primary .hp-listing__attribute--price:has(+ .hp-listing__attribute--price-max)::after {
  content: '\00a0';
  display: inline;
}
/* Хвост ленты закруглён справа, что бы ни оказалось последним. */
.hp-listing__attributes--primary .hp-listing__attribute--price:last-child {
  border-radius: 4px; padding-right: 8px;
}
.hp-listing__attributes--primary .hp-listing__attribute--price-max:last-child {
  border-radius: 0 4px 4px 0; padding-right: 8px;
}
/* Единица без цены («do negocjacji» у объявления без суммы) — самостоятельная
   плашка, иначе слева торчит срезанный угол. */
.hp-listing__attributes--primary .hp-listing__attribute--price-unit:first-child {
  border-radius: 4px; padding-left: 8px;
}

/*
 * КАРТОЧКА В СПИСКЕ — отдельный случай. Там блок цены живёт в футере рядом с
 * кнопками действий и получает всего ~200px ширины, поэтому лента вакансии
 * («9 000 zł – 13 000 zł za miesiąc brutto») обязана переноситься. Склеивать
 * при переносе три ОТДЕЛЬНЫХ фона встык не выходит: между кусками остаётся
 * несколько белых пикселей на стыке строк (замерено getClientRects: 550→566).
 *
 * Поэтому на карточке жёлтой плашкой становится САМ КОНТЕЙНЕР, а куски цены —
 * обычный текст внутри него. Тогда стык физически невозможен, а перенос
 * выглядит как перенос текста в плашке, а не как рассыпавшаяся вёрстка.
 */
/* Футер карточки — флекс-строка «цена + кнопки». Вилка вакансии в неё не
   влезает: на мобильном плашке доставалось 159px и она вырастала в 101px
   высотой (четыре строки). Разрешаем футеру переносить — цена уходит на
   свою строку целиком и укладывается в одну-две. */
/* Перенос ВСЕГО футера убран: у объявлений с вилкой зарплаты жёлтая плашка
   («6 000 zł – 9 000 zł za miesiąc brutto», 257px при доступных 225px)
   выталкивала кнопки на отдельную строку к левому краю — футер вырастал с 69
   до 115px и ряд карточек рассыпался. Теперь переносится текст ВНУТРИ плашки
   (у неё уже max-width:100%), а кнопки остаются справа на той же строке. */
.hp-listing--view-block .hp-listing__footer { flex-wrap: nowrap; row-gap: 10px; }
/* ⚠️ ИСКЛЮЧЕНИЕ: 768–1023px. Ровно на 768px тема переключает каталог на ДВЕ
   колонки и одновременно ставит сбоку фильтр — карточка сжимается с 703 до
   213px, и плашке цены в футере остаётся 53px (замер на живой странице; при
   767px было 543px). В 35px внутреннего поля не помещается даже «6 000 zł –»:
   лента ломалась посреди числа и печаталась столбиком «6 00 / 0 zł / – / 9 00 /
   0 zł / za / miesią / c / brutto» — на всех карточках, а не только у вилок.
   В этой полосе разрешаем футеру перенос: плашка, которой не хватает места
   рядом с кнопками, забирает строку целиком (кнопки уходят на свою строку и
   остаются справа — margin-left:auto ниже), а короткие цены («650 zł») по
   прежнему стоят рядом с кнопками, потому что перенос решается по их
   собственной ширине. Полоса закрыта сверху на 1023.98px: с 1024px плашке
   достаётся 139px и более, лента укладывается в две-три строки внутри
   подложки — там раскладку менять не за что. */
@media (min-width: 768px) and (max-width: 1023.98px) {
  .hp-listing--view-block .hp-listing__footer { flex-wrap: wrap; }
}
.hp-listing--view-block .hp-listing__attributes--primary { flex: 1 1 auto; min-width: 0; }
/* margin-left:auto — чтобы кнопки стояли справа и когда плашки цены нет вовсе
   (объявления «Oddam za darmo…»): контейнер цены в этом случае скрыт правилом
   :empty ниже, и space-between прижимал единственного оставшегося ребёнка
   влево — на фоне соседних карточек футер выглядел сломанным. */
.hp-listing--view-block .hp-listing__actions--primary { flex: 0 0 auto; margin-left: auto; }
/* У объявления без цены (а такое на доске есть — ID 30) контейнер приходит
   ПУСТЫМ, и раз плашка теперь на нём, получался жёлтый огрызок 18×6 px.
   Пустой блок не рисуем. */
.hp-listing--view-block .hp-listing__attributes--primary:empty { display: none; }
.hp-listing--view-block .hp-listing__attributes--primary {
  display: inline-block;
  max-width: 100%;
  background: var(--cw-yellow); color: #000;
  border-radius: 4px; padding: 3px 9px;
  font-weight: 600; line-height: 1.4;
}
.hp-listing--view-block .hp-listing__attributes--primary .hp-listing__attribute,
.hp-listing--view-block .hp-listing__attributes--primary .hp-listing__attribute--price,
.hp-listing--view-block .hp-listing__attributes--primary .hp-listing__attribute--price-max,
.hp-listing--view-block .hp-listing__attributes--primary .hp-listing__attribute--price-unit {
  display: inline;
  background: none; border-radius: 0; padding: 0;
  /* margin: 0 обязателен. У темы на .hp-listing__attribute висит внешний
     отступ, а поля инлайновых боксов НЕ входят в getClientRects — из-за этого
     между кусками цены оставалось ровно 16px пустоты, которую по замерам
     невозможно было объяснить паддингами. */
  margin: 0;
  color: inherit; font-weight: inherit;
}
/*
 * Отбивка между кусками — ПРОБЕЛОМ, а не паддингом: в разметке между <div>-ами
 * нет ни одного пробельного символа, значит при паддингах браузеру негде
 * перенести строку и лента просто вылезала за пределы плашки (замерено:
 * содержимое 282px в контейнере 265px).
 *
 * Пробел теперь один на обе поверхности — ::after у ПРЕДЫДУЩЕГО куска, общий
 * блок «где ленте цены можно переноситься» выше. Здешняя пара ::before ушла:
 * тот, что стоял у --price-unit, попадал внутрь nowrap самой единицы и точкой
 * переноса не был — «za miesiąc brutto» не могло уйти на свою строку, и на
 * узкой карточке лента ползла за плашку.
 */
/* Внешние поля темы (16px справа у каждого атрибута) внутри плашки не нужны —
   они не входят в getClientRects и дают «необъяснимую» дыру между кусками.
   Специфичность 0-4-0: правило темы использует :not(:last-child). */
.hp-listing--view-block .hp-listing__attributes--primary .hp-listing__attribute:not(:last-child) {
  margin-right: 0;
}
.hp-listing--view-block .hp-listing__attributes--primary .hp-listing__attribute--price-unit {
  font-size: .84em; font-weight: 500;
  /* ⚠️ nowrap здесь СНЯТ (он остался только на странице объявления, где ленте
     всегда хватает ширины сайдбара). На карточке каталога плашке цены достаётся
     остаток строки футера после кнопок, и на 768px это всего 53px: «za miesiąc
     brutto» (91px) печаталось ЗА пределами жёлтой подложки, по белому фону
     карточки — замер spill 46.8px у вакансии и 27.7px у велосипеда. Перенос
     единицы внутри плашки в такой ситуации — меньшее зло, чем текст, вылезший
     из плашки; на всех остальных проверенных ширинах (320/360/390/1024/1150/
     1280/1440) единица и так помещается в строку, и правило ничего не меняет.
     Довод «„za miesiąc / brutto“ читается как обрывок» относился к прежней
     сборке из трёх отдельных плашек; в цельной ленте это обычный перенос. */
  white-space: normal;
}

/* ── Hero: плоский фирменный синий, без тёмного фото-оверлея ─ */
.header-hero { background-color: var(--cw-blue) !important; background-image: none !important; }
.header-hero--cover::after {
  background-color: transparent;
}
.header-hero--large { padding: 3rem 0 3.5rem; }
.header-hero h1 { font-size: 2.5em; margin: 0 0 10px; }
.header-hero h1, .header-hero h2, .header-hero p {
  color: #fff;
  text-shadow: 0 1px 8px rgba(20, 45, 100, .3);
}
.header-hero p { font-size: 1.1em; opacity: .92; }
.header-hero .wp-block-columns { gap: 36px; align-items: center; }

/* Hero: упрощённый поиск — только строка + кнопка (остальные фильтры на странице объявлений) */
.header-hero .hp-form--listing-search .hp-form__field:has(select),
.header-hero .hp-form--listing-search .hp-form__field:has(input[type=number]) { display: none; }
.header-hero .hp-form--listing-search {
  box-shadow: 0 0 2vw rgba(0, 0, 0, .12);
  border-radius: 10px;
  overflow: hidden;
}

/* ── Карточки категорий: яркие, без серого затемнения ────── */
.hp-listing-category--view-block .hp-listing-category__image a::after,
.hp-listing-category--submit-block .hp-listing-category__image a::after {
  background-image: none;
}

/* Категории с инлайн-SVG тайлом */
/* Страховка: категория без своей SVG падала в заглушку hivetheme — картинку
   400x533. При height:auto она рендерилась в полтора раза выше соседних
   тайлов 600x400 и разваливала сетку (так вылезла Motoryzacja). Заглушку
   прячем, тайлу задаём те же пропорции и фирменный фон: категория без иконки
   теперь выглядит просто скромно, а не ломает страницу. */
.hp-listing-category__image:not(.cw99-cat--tile):not(.cw99-cat--icon) a {
  display: block; aspect-ratio: 3 / 2; border-radius: 3px; overflow: hidden;
  background: var(--cw-blue);
}
.hp-listing-category__image:not(.cw99-cat--tile):not(.cw99-cat--icon) img { display: none; }

.cw99-cat--tile a { display: block; line-height: 0; }
.cw99-cat-tile { display: block; }
.cw99-cat-tile svg {
  display: block; width: 100%; height: auto;
  transition: transform .35s ease;
}
.hp-listing-category:hover .cw99-cat-tile svg { transform: scale(1.03); }

/* Категории с FA-иконкой вместо картинки */
.cw99-cat--icon a {
  display: flex; align-items: center; justify-content: center;
  aspect-ratio: 16 / 10;
  background: var(--cw-blue);
}
.cw99-cat-badge {
  width: 104px; height: 104px; border-radius: 50%;
  background: rgba(255,255,255,.12);
  box-shadow: none;
  display: flex; align-items: center; justify-content: center;
  transition: background .3s, transform .3s;
}
.cw99-cat-badge i { font-size: 44px; color: #fff; }
.hp-listing-category:hover .cw99-cat-badge {
  background: rgba(255,255,255,.22);
  transform: scale(1.06);
}
.hp-listing-category__item-count {
  background: rgba(255,255,255,.16);
  color: #fff;
  border-radius: 999px;
  padding: 3px 11px;
  font-size: .78em;
}

/* ── Хедер: скрыть дублирующую кнопку темы (есть жёлтая CTA в меню) ── */
.header-navbar__actions { display: none !important; }

/* ── Объявление: вторичные действия в сайдбаре — аккуратные строки ── */
.hp-page__sidebar .hp-listing__actions {
  display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
}
.hp-page__sidebar .hp-listing__actions .hp-listing__action {
  display: inline-flex; align-items: center; gap: 8px;
  white-space: nowrap; color: var(--cw-grey); text-decoration: none;
  position: static; width: auto; height: auto;
}
.hp-page__sidebar .hp-listing__actions .hp-listing__action:hover { color: var(--cw-blue); }
.hp-page__sidebar .hp-listing__actions button.hp-listing__action,
.hp-page__sidebar .hp-listing__actions .button { align-self: stretch; }

/* ── Хедер: «Подать объявление» — жёлтая CTA-кнопка ──────── */
.header-navbar__menu .menu-item > a[href*='submit-listing'] {
  background: var(--cw-yellow);
  color: #132a52 !important;
  border-radius: 999px;
  padding: 9px 18px;
  font-weight: 600;
}
.header-navbar__menu .menu-item > a[href*='submit-listing']:hover {
  background: #ffd35e;
  color: #000 !important;
}

/* ── Типографика секций ──────────────────────────────────── */
.site-content h2 { font-size: 1.7em; margin-bottom: 22px; }
.header-hero h1 { font-weight: 700; }
.hp-listing-category, .hp-listing, .hp-vendor {
  background: #fafafa;
  border-radius: var(--cw-radius);
  overflow: hidden;
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  transition: box-shadow .3s, transform .3s;
}
/* :not(.hp-listing--view-page) — не косметика.
   Подъём карточки задуман для ПЛИТОК каталога, но селектор `.hp-listing`
   совпадает и с корневым контейнером страницы объявления. Любой transform
   делает элемент containing block для position:fixed, а сайдбар там липкий
   (theia-sticky-sidebar, position:fixed): при наведении мыши куда угодно на
   карточку весь сайдбар телепортировался на +54px вправо и −472px вверх и
   обрезался контейнером (замерено: rect x 851→905, y 32→−440, right 1264 при
   границе контента 1226). На полностраничном контейнере подъёма всё равно не
   видно — он только ломал. */
.hp-listing-category:hover,
.hp-listing:not(.hp-listing--view-page):hover {
  box-shadow: 0 0 1.5vw rgba(0, 0, 0, .12);
  transform: translateY(-2px);
}
.hp-listing-category__name { font-size: 1.15em; }

/* ── Формы ───────────────────────────────────────────────── */
input[type=text], input[type=email], input[type=number], input[type=password],
input[type=search], select, textarea {
  border-radius: 6px;
  border-color: var(--cw-border);
}
input:focus, select:focus, textarea:focus {
  border-color: var(--cw-blue) !important;
  outline: none;
}

/* ── Футер ───────────────────────────────────────────────── */
.footer-navbar, .site-footer {
  background: var(--cw-dark);
  color: #cfcfcf;
}
/* Белый с альфой вместо #cfcfcf (2026-09-03): серых в каноне нет. */
.footer-navbar a, .site-footer a { color: rgba(255, 255, 255, .72) !important; }
.footer-navbar a:hover, .site-footer a:hover { color: var(--cw-yellow) !important; }

.cw99-footer {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 36px;
  padding: 38px 0 28px;
  border-bottom: 1px solid rgba(255,255,255,.09);
}
.cw99-footer__logo {
  display: flex; align-items: center; gap: 10px;
  font-family: 'futura-pt', sans-serif; line-height: 1;
}
.cw99-footer__mark img { display: block; width: 128px; height: auto; }
.cw99-footer__by { font-size: .95em; color: var(--cw-yellow); font-weight: 500; }
/* Приглушённый текст футера — БЕЛЫЙ с прозрачностью, а не серые #9a9a9a/#bdbdbd/
   #a3a3a3 (2026-09-03, свип цветов доски: серых цветов в каноне нет, на тёмной
   поверхности приглушение — альфа белого). rgba(255,255,255,.72) на #242424 —
   8.6:1, .62 — 6.6:1. Файл общий с SE-доской: там те же цвета, те же цели —
   правка одинаково канонична для обеих досок. */
.cw99-footer__brand p { color: rgba(255, 255, 255, .62); margin: 10px 0 0; line-height: 1.55; font-size: .95em; }
/* 700, не 600: в ките futura-pt веса 600 нет, браузер рисовал faux-bold. */
.cw99-footer__title { color: #fff; font-weight: 700; margin-bottom: 4px; }
/* Ссылки колонок — цель нажатия ≥44px паддингом, не кеглем: строка 23px +
   2×11px; нижний отступ ушёл в паддинг. */
.cw99-footer__col a {
  display: flex; align-items: center; min-height: 44px;
  padding: 10px 0; margin-bottom: 0;
  color: rgba(255, 255, 255, .72) !important;
  text-decoration: none; font-size: .95em;
}
.cw99-footer__col a:hover { color: var(--cw-yellow) !important; }
/* Ещё два случая нечитаемого текста, найденные замером контраста на странице
   объявления (не глазами — глазами их и не видно, в этом и беда):
   1) HivePress красит ТЕКУЩИЙ пункт бокового меню в свой янтарный #ffc107,
      а меню стоит на белом: «Szczegóły» выходил 1.56:1 — то есть единственный
      указатель «вы здесь» был практически невидим;
   2) дата публикации печатается rgba(15,23,39,.45) — 2.92:1.
   Первое лечим брендовым синим (6.2:1), второе — плотностью до 4.6:1. */
.hp-menu__item--current > a,
.hp-menu__item--current > a span {
  color: var(--cw-blue) !important;
  font-weight: 700;
}
.hp-listing__date,
.hp-listing__created-date {
  color: rgba(0, 0, 0, .62) !important; /* чёрный с альфой: серо-синих rgba(15,23,39) в каноне нет (2026-09-03) */
}

/* Видимый фокус в хроме темы. Шапка синяя, подвал #242424 — жёлтый читается на
   обоих (4.1:1 и 8.6:1). Без этого правила навигация с клавиатуры по шапке
   и юридическим ссылкам подвала шла вслепую. */
.header-navbar a:focus-visible,
.header-navbar button:focus-visible,
.cw99-footer a:focus-visible,
.footer-navbar a:focus-visible {
  outline: 3px solid var(--cw-yellow);
  outline-offset: 2px;
}

.footer-navbar { padding: 16px 0; }
.footer-navbar__copyright { color: rgba(255, 255, 255, .62); font-size: .9em; }
.cw99-footer__legal {
  padding: 4px 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0 14px;
  font-size: .82em; border-top: 1px solid rgba(255,255,255,.09); margin-top: 6px;
}
/* Было #a3a3a3 (6.0:1) — теперь белый с альфой .72 (8.6:1): серых цветов нет.
   Ссылки регламента/политики и кнопка «Ustawienia cookies» (mu-plugin
   cw99-consent.php) — цель нажатия ≥44px паддингом при прежнем кегле 13px. */
.cw99-footer__legal a,
.cw99-footer__legal .cw99-footer__cookies {
  display: inline-flex; align-items: center; min-height: 44px; padding: 12px 0;
  color: rgba(255, 255, 255, .72) !important;
}
.cw99-footer__legal a:hover,
.cw99-footer__legal .cw99-footer__cookies:hover { color: var(--cw-yellow) !important; }
.cw99-footer__legal-sep { color: rgba(255, 255, 255, .3); }
@media (max-width: 760px) {
  .cw99-footer { grid-template-columns: 1fr 1fr; gap: 26px; }
}

/* ══════════════════════════════════════════════════════════
   Чат-агент «99» — виджет [cw99_agent] (.cw99-agent-box)
   ══════════════════════════════════════════════════════════ */
.cw99-agent { max-width: 900px; margin: 0 auto; padding: 24px 16px 48px; }
.cw99-agent .agent-head { text-align: center; margin-bottom: 18px; }
.cw99-agent .agent-head h1 { font-size: 1.9em; margin: 0 0 6px; }
.cw99-agent .agent-head p { color: var(--cw-grey); margin: 0; }

/* Виджет живёт и на белой странице /agent/, и внутри синего .header-hero на
   главной, где у текста ambient-цвет БЕЛЫЙ. Всё, что внутри виджета не задало
   color явно, наследовало этот белый и пропадало на своём же светлом фоне:
   так уже терялся ввод (белым по белому) и карточка черновика (белым по
   кремовому #fff8e6) — а карточка черновика это главный экран продукта.
   Поэтому цвет фиксируем на самой оболочке: наследование обрывается здесь,
   и ни один дочерний элемент больше не зависит от того, куда его вставили. */
.cw99-agent-box .agent-shell {
  background: #fafafa; border-radius: var(--cw-radius);
  box-shadow: 0 0 2vw rgba(0, 0, 0, .12);
  display: flex; flex-direction: column;
  height: 64vh; min-height: 420px;
  text-align: left; overflow: hidden;
  color: #1a1a1a;
}
/* Было 440px: карточка черновика съедала весь бокс, и от переписки оставалась
   узкая полоска — владелец увидел это как «микрострока». Даём агенту нормальную
   высоту, он на главной — основной элемент, а не виджет-довесок. */
.cw99-compact .agent-shell { height: 560px; min-height: 0; }

/* Брендовый заголовок виджета — без него бокс читался как голая форма, а
   не как продуктовая поверхность агента (фидбек владельца). */
.cw99-agent-box .agent-topbar {
  display: flex; align-items: center; gap: 10px; flex: 0 0 auto;
  padding: 12px 16px;
  background: var(--cw-blue);
  color: #fff;
}
/* Обязательное уведомление, что собеседник — ИИ (AI Act art. 50): должно быть
   видно ДО первого сообщения, поэтому это постоянная полоса, а не реплика в
   чате, которая уезжает вверх при прокрутке. То же самое обещает опубликованная
   политика приватности — без этой полосы текст политики был бы неправдой. */
.cw99-agent-box .agent-ai-notice {
  flex: 0 0 auto; padding: 5px 16px; font-size: .72em; line-height: 1.3;
  color: #5a6377; background: #f4f6fb; border-bottom: 1px solid var(--cw-border);
}
.cw99-agent-box .agent-topbar__mark { width: 104px; height: 26px; flex: 0 0 104px; display: block; }
.cw99-agent-box .agent-topbar__mark img { width: 100%; height: 100%; object-fit: contain; object-position: left center; display: block; }
.cw99-agent-box .agent-topbar__name { font-weight: 700; font-size: 1.02em; }
.cw99-agent-box .agent-topbar__status {
  margin-left: auto; display: flex; align-items: center; gap: 6px;
  font-size: .8em; opacity: .85;
}
.cw99-agent-box .agent-topbar__status .dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--cw-blue);
  box-shadow: none; flex: 0 0 7px;
}

/* min-height:0 — не косметика, а единственное, что делает ленту чата
   прокручиваемой. У flex-элемента min-height по умолчанию auto: лента росла
   вместе с перепиской, overflow-y:auto никогда не срабатывал (clientHeight
   == scrollHeight), и всё, что стоит ПОД ней — поле ввода, кнопка отправки,
   карточка черновика с кнопкой «Opublikuj» — выдавливалось за пределы
   .agent-shell{overflow:hidden} и исчезало навсегда: прокруткой не достать,
   потому что высота оболочки фиксирована. То есть после первого же ответа
   агента писать ему было нечем. Замерено на живой главной: 991px содержимого
   в 474px строки, отрезано 427px. */
.cw99-agent-box .agent-chat { flex: 1; min-height: 0; overflow-y: auto; padding: 16px; }

.cw99-agent-box .agent-msg { display: flex; gap: 8px; margin-bottom: 12px; align-items: flex-end; }
.cw99-agent-box .agent-msg.user { flex-direction: row-reverse; }
.cw99-agent-box .agent-ava {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--cw-blue); flex: 0 0 34px; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.cw99-agent-box .agent-ava img { width: 26px; height: 26px; object-fit: contain; border-radius: 6px; }
.cw99-agent-box .agent-ava svg { width: 20px; height: 20px; display: block; }
.cw99-agent-box .agent-bubble {
  max-width: 80%; border-radius: 14px; padding: 9px 13px;
  background: #f5f6fa; color: #000; white-space: pre-wrap;
  line-height: 1.4; font-size: .98em;
  /* Длинное слово без пробелов (ссылка, артикул, слипшийся набор) не имеет
     точки переноса: текст выезжал ЗА пузырь и печатался белым по #fafafa
     оболочки — то есть исчезал, — а лента получала горизонтальную прокрутку
     (замерено: clientWidth 330 при scrollWidth 916). У .agent-draft эта же
     страховка стоит с прошлого раза, у пузыря её забыли.
     white-space:pre-wrap остаётся: он нужен для переносов строк от модели и
     переносу длинных слов не мешает. */
  overflow-wrap: anywhere;
}
.cw99-agent-box .agent-msg.user .agent-bubble { background: var(--cw-blue); color: #fff; }

/* row-gap 12px вместо 7px — не косметика, а условие расширенной зоны нажатия
   ниже: при 7px соседние ряды чипов перекрывались бы невидимыми зонами на 5px
   и тап в этой полосе уходил бы не в тот чип. */
.cw99-agent-box .agent-chips { display: flex; flex-wrap: wrap; gap: 12px 7px; margin: 2px 0 12px 42px; }
.cw99-agent-box .agent-chip {
  position: relative;
  border: 2px solid var(--cw-blue); color: var(--cw-blue);
  background: #fff; border-radius: 999px; padding: 6px 13px;
  cursor: pointer; font-size: .92em; transition: all .2s; font-family: inherit;
}
/* Стартовые чипы — это главный способ начать разговор, и их высота 32px при
   норме 44. Растим ТОЛЬКО по вертикали: ширина у чипов и так 100+px, а
   расширение вбок при column-gap 7px склеило бы соседние зоны. Псевдоэлемент,
   а не padding: видимый размер и раскладка остаются прежними.
   −8px, а не −6: отступы абсолютного бокса считаются от ПАДДИНГ-бокса, а у
   чипа рамка 2px с каждой стороны, то есть внутри 32px видимой высоты для
   отсчёта доступно только 28. Замер на живой странице: при −6px зона выходила
   42px и тап в 5px под чипом уже не попадал. */
.cw99-agent-box .agent-chip::before {
  content: '';
  position: absolute;
  inset: -8px 0;
}
.cw99-agent-box .agent-chip:hover { background: var(--cw-blue); color: #fff; }

/* minmax(0,1fr) — иначе грид-трек считается по max-content и раздувается под
   самую длинную карточку: на 1280 карточка выходила за контейнер на 77px, на
   390 — на 116px, ссылка «Otwórz» уезжала под .agent-shell{overflow:hidden} и
   не была видна НИ НА ОДНОЙ карточке, а лента получала до 191px горизонтальной
   прокрутки. Данные реальные: /wp-json/board/v1/search?q=praca отдаёт цены
   вида «6 000 – 9 000 zł za miesiąc brutto». */
.cw99-agent-box .agent-cards { margin: 2px 0 12px 42px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.cw99-agent-box .agent-card {
  border-radius: var(--cw-radius); padding: 10px 12px;
  background: #fff;
  display: flex; justify-content: space-between; gap: 10px; align-items: center;
  /* Плашка цены целиком не влезает рядом с заголовком на узкой панели —
     пусть переносится на вторую строку, а не выдавливает соседей наружу. */
  flex-wrap: wrap;
}
/* min-width:0 — у flex-элемента он по умолчанию auto (= min-content), поэтому
   колонка заголовка не сжималась, а распирала карточку: «Programista PHP do
   rozbudowy serwisów firmowych» печатался по одному слову в строку при ширине
   колонки 87px. */
.cw99-agent-box .agent-card > div:first-child { min-width: 0; flex: 1 1 auto; }
.cw99-agent-box .agent-card .nm { font-weight: 600; }
.cw99-agent-box .agent-card .meta { color: var(--cw-grey); font-size: .88em; margin-top: 2px; }
.cw99-agent-box .agent-card .price {
  background: var(--cw-yellow); border-radius: 6px; padding: 3px 9px;
  font-weight: 700; white-space: nowrap;
}
.cw99-agent-box .agent-card a.open {
  color: var(--cw-blue); font-weight: 600; white-space: nowrap; text-decoration: none;
  /* Когда карточке не хватает ширины и она переносится (flex-wrap выше),
     «Otwórz» уезжает на свою строку — auto-отступ оставляет её справа, где
     она и стоит на однострочных карточках, а не прилипает к левому краю. */
  margin-left: auto;
  position: relative;
}
/* Зона нажатия «Otwórz» — 44px по высоте. Замер до правки: 52.4×24, при том что
   это ЕДИНСТВЕННЫЙ путь из ответа агента в объявление и самый мелкий
   интерактивный элемент панели. Способ тот же, что уже применён к круглым
   кнопкам панели и к сердечку карточки: невидимый псевдоэлемент. Ни padding,
   ни минусовой margin — именно этот приём однажды уронил бургер на десктопе
   (он перебил `display:none` темы). Высота задана от середины строки, а не
   отступами, чтобы не зависеть от кегля: при любом размере текста зона ровно 44.
   По горизонтали добор не нужен — 52.4px уже больше нормы. */
.cw99-agent-box .agent-card a.open::before {
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  height: 44px;
  transform: translateY(-50%);
}

.cw99-agent-box .agent-draft {
  margin: 2px 0 12px 42px;
  background: #ffea84; border-radius: var(--cw-radius); padding: 12px 14px; font-size: .95em;
}
/* Было: метка inline-block шириной 100px, значение текло следом обычным
   инлайном. Короткие значения выстраивались в колонку, а длинное «Opis»
   переносилось ПОД метку, к левому краю — колонка ломалась, строки выглядели
   съехавшими. Настоящая сетка держит два столбца: метка по содержимому,
   значение переносится внутри своей колонки. minmax(0,1fr) не даёт длинному
   слову или ссылке распереть карточку. */
/* margin-left/right: 0 — защита от коллизии имён классов. Строки черновика
   рисуются с общим классом «row», а родительская тема тянет flexboxgrid, где
   `.row { margin-right:-1rem; margin-left:-1rem }`: строки вылезали на 2px
   ЛЕВЕЕ внешнего края жёлтой карточки и на 16px левее собственных кнопок
   «Opublikuj/Popraw». display:grid перебивает флексовый display, а
   горизонтальные margin — нет, их надо гасить явно. */
.cw99-agent-box .agent-draft .row {
  display: grid;
  grid-template-columns: minmax(96px, max-content) minmax(0, 1fr);
  gap: 2px 12px; margin: 0 0 6px; align-items: baseline;
}
.cw99-agent-box .agent-draft .row b { display: block; }
.cw99-agent-box .agent-draft { overflow-wrap: anywhere; }
/* Строка сетки считала ширину от border-box карточки и вылезала ровно на её
   горизонтальные отступы — карточка получала лишний горизонтальный скролл. */
.cw99-agent-box .agent-draft,
.cw99-agent-box .agent-draft .row { box-sizing: border-box; max-width: 100%; }
.cw99-agent-box .agent-draft .actions { margin-top: 9px; display: flex; gap: 8px; }
.cw99-agent-box .agent-draft button {
  border: 0; border-radius: 8px; padding: 8px 15px; cursor: pointer;
  font-weight: 600; font-family: inherit;
  position: relative;
}
/* «Opublikuj» и «Popraw» — 36.5px в высоту при норме 44. Это последний шаг
   публикации объявления через агента, промах здесь стоит дороже всего.
   Добор тем же псевдоэлементом, видимый размер кнопок не меняется. Зоны
   соседних кнопок не смыкаются: по горизонтали они не растут, а между
   кнопками 8px зазора. */
.cw99-agent-box .agent-draft button::before {
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  height: 44px;
  transform: translateY(-50%);
}
.cw99-agent-box .agent-draft button.pub { background: var(--cw-blue); color: #fff; }
.cw99-agent-box .agent-draft button.pub:hover { background: var(--cw-blue-dark); }
.cw99-agent-box .agent-draft button.edit { background: #fff; border: 2px solid var(--cw-grey); }

.cw99-agent-box .agent-copybox {
  margin: 2px 0 12px 42px;
  border-radius: var(--cw-radius); padding: 11px 13px; background: #fff; font-size: .95em;
}
.cw99-agent-box .agent-copybox pre {
  white-space: pre-wrap; font-family: inherit; margin: 0 0 8px; line-height: 1.4;
}
.cw99-agent-box .agent-copybox button {
  border: 2px solid var(--cw-blue); color: var(--cw-blue); background: #fff;
  border-radius: 999px; padding: 5px 13px; cursor: pointer; font-family: inherit;
}
.cw99-agent-box .agent-copybox button:hover { background: var(--cw-blue); color: #fff; }

.cw99-agent-box .agent-typing { display: inline-flex; gap: 4px; padding: 11px 13px; }
.cw99-agent-box .agent-typing i {
  width: 8px; height: 8px; border-radius: 50%; background: #b9c0d4;
  animation: cw99tp 1s infinite;
}
.cw99-agent-box .agent-typing i:nth-child(2) { animation-delay: .15s; }
.cw99-agent-box .agent-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes cw99tp { 0%,100% { opacity: .3; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-3px); } }

.cw99-agent-box .agent-inputbar {
  display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--cw-border);
}
.cw99-agent-box .agent-inputbar input[type=text] {
  flex: 1; border: 2px solid var(--cw-border); border-radius: 999px;
  padding: 9px 15px; font-size: .98em; min-width: 0;
  /* Widget sits inside .header-hero on the homepage AND relies on the
     parent theme's `input,select,textarea{color:inherit}` reset — without
     an explicit color here, typed text silently inherits whatever ambient
     text color is in scope (white on the hero, or a browser's auto-dark-mode
     form-control color elsewhere) and becomes invisible against this input's
     own white background. Pin both explicitly, and opt this control out of
     browser auto-dark-mode form styling entirely. */
  color: #1a1a1a; background: #fff; color-scheme: light;
}
.cw99-agent-box .agent-inputbar input[type=text]:focus { border-color: var(--cw-blue); }
.cw99-agent-box .agent-btn {
  position: relative;
  width: 42px; height: 42px; border-radius: 50%; border: 0; cursor: pointer;
  font-size: 1.05em; display: flex; align-items: center; justify-content: center;
  flex: 0 0 42px;
}
/* 42×42 — на 2px меньше нормы 44×44. Добираем невидимым слоем: кнопок в строке
   три, зазор между ними 8px, расширение по 1px с каждой стороны зоны не
   склеивает. Размер кружков не трогаем — это дизайн. */
.cw99-agent-box .agent-btn::before {
  content: '';
  position: absolute;
  inset: -1px;
}
.cw99-agent-box .agent-photobtn { background: #eef2fc; }
.cw99-agent-box .agent-photobtn:hover { background: #dfe7fa; }
.cw99-agent-box .agent-micbtn { background: #eef2fc; color: var(--cw-blue-dark); }
.cw99-agent-box .agent-micbtn:hover { background: #dfe7fa; }
.cw99-agent-box .agent-micbtn.recording {
  background: #e0453c; color: #fff;
  animation: cw99mic 1.1s infinite;
}
@keyframes cw99mic {
  0%, 100% { opacity: 1; }
  50% { opacity: .55; }
}
.cw99-agent-box .agent-sendbtn { background: var(--cw-blue); color: #fff; }
.cw99-agent-box .agent-sendbtn:hover { background: var(--cw-blue-dark); }

@media (max-width: 760px) {
  .header-hero h1 { font-size: 1.8em; }
  .cw99-agent .agent-shell { height: 70vh; }
  .cw99-compact .agent-shell { height: 500px; }   /* на телефоне карточка черновика зажата так же, как была на десктопе */
  .cw99-agent-box .agent-draft .row { grid-template-columns: 1fr; gap: 0; }
  .cw99-agent-box .agent-chips, .cw99-agent-box .agent-cards,
  .cw99-agent-box .agent-draft, .cw99-agent-box .agent-copybox { margin-left: 0; }
  .cw99-agent-box .agent-bubble { max-width: 88%; }
}


/* ═══════════ СТРАНИЦЫ: catalog (дизайн-аудит 2026-07-12) ═══════════ */
/* ══════════════════════════════════════════════════════════
   КАТАЛОГ И ПОИСК — /listing/, категории, пустая выдача
   (топбар, фильтры, карточки, бейджи, featured, пагинация)
   ══════════════════════════════════════════════════════════ */

/* ── Топбар выдачи: счётчик + сортировка ─────────────────── */
.hp-page__topbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 22px;
}
.hp-result-count {
  color: var(--cw-grey); font-size: .82em;
}
/* Селект сортировки резал собственное значение: «Cena / od (zł) ↑» при
   clientWidth 128 и scrollWidth 136 обрывался на «CENA / OD (Z…», то есть
   стрелка ↑/↓ — единственное, чем «по возрастанию» отличается от «по
   убыванию», — не была видна ни на 1280, ни на 390. Топбар уже flex-wrap,
   поэтому авто-ширина ничего не разъезжает. */
.hp-page__topbar .hp-form--listing-sort .select2-container {
  width: auto !important;
  max-width: 100%;
}
.hp-page__topbar .hp-form--listing-sort .select2-selection__rendered {
  text-overflow: clip;
}

/* ── Поисковая строка над выдачей ────────────────────────── */
.hp-page__header .hp-form--listing-search {
  background: #fff; border-radius: var(--cw-radius); overflow: hidden;
  box-shadow: 0 0 1.5vw rgba(0, 0, 0, .08);
}

/* ── Сайдбар: фильтры карточкой ──────────────────────────── */
.site-sidebar .hp-form--listing-filter {
  background: #fafafa; border-radius: var(--cw-radius); padding: 22px 20px 20px;
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
}
.site-sidebar .hp-form--listing-filter .hp-form__field { margin-bottom: 18px; }
/* чекнутые радио/чекбоксы фильтра — синие, не зелёные */
.hp-form--listing-filter .hp-field input[type=radio]:checked + span::before,
.hp-form--listing-filter .hp-field input[type=checkbox]:checked + span::before {
  border-color: var(--cw-blue) !important;
}
.hp-form--listing-filter .hp-field input[type=radio]:checked + span::after,
.hp-form--listing-filter .hp-field input[type=checkbox]:checked + span::before {
  background-color: var(--cw-blue) !important;
}
/* дефолтные WP-виджеты (Archives/Categories) — спрятать; удалить в админке */
.site-sidebar .widget_block { display: none; }

/* ── Карточка объявления ─────────────────────────────────── */
.hp-listing--view-block {
  position: relative; display: flex; flex-direction: column;
  background: #fafafa;
}
/* Колонка грида (.hp-grid__item) растягивается по высоте ряда, а сама карточка
   нет — под низкой карточкой оставалась пустая дыра 60–83px с видимой границей
   и тенью, потому что у карточки border + background + box-shadow. Футер уже
   имеет margin-top:auto, поэтому цена и кнопки сами прижмутся к низу: ни
   размеры, ни цвета, ни композиция не меняются, ряд просто выравнивается. */
.hp-listings .hp-grid__item > .hp-listing--view-block { height: 100%; }
.hp-listing--view-block .hp-listing__image { background: #EEF2FC; }
.hp-listing--view-block .hp-listing__image img {
  display: block; width: 100%; height: auto;
  aspect-ratio: 4 / 3; object-fit: cover;
}
.hp-listing--view-block .hp-listing__content { padding: 16px 18px 0; }
.hp-listing--view-block .hp-listing__footer {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 14px 18px 16px; margin-top: auto;
  border-top: 1px solid #F1F2F6;
}

/* категория на карточке — тихий uppercase-линк */
.hp-listing--view-block .hp-listing__categories a {
  display: inline-block; padding: 0; background: transparent !important;
  font-size: .75em; font-weight: 600;
  color: var(--cw-blue); text-decoration: none;
}
.hp-listing--view-block .hp-listing__categories a:hover { color: var(--cw-blue-dark); }

.hp-listing--view-block .hp-listing__title { font-size: 1.1em; line-height: 1.35; margin: 6px 0 4px; }
.hp-listing--view-block .hp-listing__title a { color: #1c1c1c; }
.hp-listing--view-block .hp-listing__created-date { color: var(--cw-grey); font-size: .82em; }

/* ── Пилюли атрибутов: тип сделки + район ────────────────── */
.hp-listing--view-block .hp-listing__attributes--secondary { margin-top: 10px; }
.hp-listing--view-block .hp-listing__attributes--secondary .hp-row {
  display: flex; flex-wrap: wrap; gap: 6px; margin: 0;
}
.hp-listing--view-block .hp-listing__attributes--secondary .hp-row > [class*='hp-col'] {
  flex: 0 0 auto; width: auto; max-width: none; padding: 0;
}
.hp-listing__attribute--type,
.hp-listing__attribute--district {
  display: inline-block; border-radius: 999px;
  padding: 3px 12px 4px; font-size: .82em; font-weight: 500; line-height: 1.4;
}
/*
 * Пилюлями оформлены ВСЕ вторичные атрибуты, а не только тип и район.
 * С появлением атрибутов по категориям (Pełny etat, Umowa o pracę, 145 000 km)
 * они выпадали в карточку голым чёрным текстом без фона — рядом с оформленными
 * пилюлями это читалось как сломанная вёрстка. Правило общее, чтобы следующий
 * добавленный атрибут выглядел правильно сам, без правки CSS.
 */
.hp-listing__attributes--secondary .hp-listing__attribute {
  display: inline-block; border-radius: 999px;
  padding: 3px 12px 4px; font-size: .82em; font-weight: 500; line-height: 1.4;
  background: #F5F6FA; color: #5c5c5c;
}
/* «Предлагаю» — заполненная голубая */
.hp-listing__attribute--type { background: #EEF2FC; color: var(--cw-blue-dark); }
.hp-listing__attributes--secondary .hp-listing__attribute--type { background: #EEF2FC; color: var(--cw-blue-dark); }
.hp-listing__attributes--secondary .hp-listing__attribute--district { background: #F5F6FA; color: #707070; }
/* «Ищу» — контурная (класс cw99-type--seek вешает JS/PHP, см. extra) */
.cw99-type--seek .hp-listing__attribute--type,
.hp-listing__attribute--type.cw99-type--seek {
  background: #fff; color: var(--cw-blue);
  outline: 2px solid rgba(36, 87, 198, .5);
}
.hp-listing__attribute--district { background: #F5F6FA; color: #707070; }

/* ── Действия на карточке (ответить / избранное) ─────────── */
.hp-listing__actions--primary { display: flex; gap: 8px; }
.hp-listing__actions--primary .hp-listing__action {
  width: 36px; height: 36px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: #EEF2FC; color: var(--cw-blue);
  transition: background .2s, color .2s;
}
.hp-listing__actions--primary .hp-listing__action:hover { background: var(--cw-blue); color: #fff; }
.hp-listing__actions--primary .hp-listing__action i { font-size: .95em; }
/* Зона нажатия круглых кнопок карточки. Видимый кружок 36×36 при норме 44×44 —
   увеличивать сам кружок нельзя, это дизайн. Расширяем НЕВИДИМЫМ слоем:
   псевдоэлемент не участвует в раскладке вообще, поэтому ни размер кнопки, ни
   ширина футера карточки не меняются (в отличие от приёма «padding + минусовой
   margin», которым в прошлый заход уронили бургер на десктоп).
   inset:-4px даёт ровно 44×44, а зазор между кнопками 8px = 4+4 — соседние
   зоны смыкаются встык и не накладываются, промахнуться в чужую нельзя.
   Селектор с --view-block: на СТРАНИЦЕ объявления в этом же контейнере лежит
   большая кнопка «Odpowiedz na ogłoszenie» 319×50, ей расширение не нужно. */
.hp-listing--view-block .hp-listing__actions--primary .hp-listing__action {
  position: relative;
}
.hp-listing--view-block .hp-listing__actions--primary .hp-listing__action::before {
  content: '';
  position: absolute;
  inset: -4px;
}

/* ── Выделенные (featured) ─────────────────────────────── */
.hp-listing--view-block.hp-listing--featured {
  border-color: var(--cw-yellow) !important;
  background: #fafafa;
  box-shadow: 0 0 1.3vw rgba(0, 0, 0, .08);
}
.hp-listing--view-block.hp-listing--featured:hover {
  box-shadow: 0 0 1.8vw rgba(0, 0, 0, .12);
}
.hp-listing--view-block.hp-listing--featured .hp-listing__footer {
  border-top-color: rgba(255, 199, 59, .35);
}
.hp-listing--view-block .hp-listing__featured-badge {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  width: auto; height: auto; transform: none;
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--cw-yellow) !important; color: #132a52;
  border-radius: 999px; padding: 5px 13px;
  font-size: .78em; font-weight: 600;
  box-shadow: 0 0 .7vw rgba(0, 0, 0, .12);
}
.hp-listing--view-block .hp-listing__featured-badge i { font-size: .9em; color: #132a52; }
.hp-listing--view-block .hp-listing__featured-badge::after { content: 'Выделено'; }

/* ── Пагинация: круглые пилюли ───────────────────────────── */
.hp-pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin-top: 30px; }
.hp-pagination .page-numbers {
  min-width: 38px; height: 38px; padding: 0 13px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px; background: #fff; color: var(--cw-blue);
  font-weight: 600; text-decoration: none;
  outline: 1px solid var(--cw-border);
  transition: outline-color .2s;
}
.hp-pagination a.page-numbers:hover { box-shadow: none; outline-color: var(--cw-blue); }
.hp-pagination .page-numbers.current { background: var(--cw-blue); color: #fff; box-shadow: none; }

/* ── Hero страницы категории ─────────────────────────────── */
/* секция имеет класс .hp-listing-category — гасим карточные стили (hover-лифт) */
.header-hero.hp-listing-category { border-radius: 0; box-shadow: none; overflow: visible; }
.header-hero.hp-listing-category:hover { transform: none; box-shadow: none; }
.header-hero.hp-listing-category--view-page .hp-listing-category__name {
  font-size: 2.4em; font-weight: 700; margin: 10px 0 0;
}
.header-hero.hp-listing-category--view-page .hp-listing-category__count {
  display: inline-block; background: rgba(255, 255, 255, .16); color: #fff;
  border-radius: 999px; padding: 4px 14px;
  font-size: .82em;
}
/* фирменный вуаль поверх тайла-обложки — белый H1 читаем на любом hp_image */
.header-hero.hp-listing-category--view-page.header-hero--cover::after {
  background: rgba(36, 87, 198, .72);
}

/* ── Пустая выдача ───────────────────────────────────────── */
.hp-no-results {
  text-align: center; padding: 52px 24px 56px; margin: 6px 0 20px;
  background: #fafafa; border-radius: var(--cw-radius);
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
}
.hp-no-results::before {
  content: ''; display: block; width: 128px; height: 128px; margin: 0 auto 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 128'%3E%3Ccircle cx='64' cy='64' r='60' fill='%23EEF2FC'/%3E%3Ccircle cx='56' cy='56' r='25' fill='%23fff' stroke='%232457C6' stroke-width='6'/%3E%3Cline x1='75' y1='75' x2='96' y2='96' stroke='%232457C6' stroke-width='9' stroke-linecap='round'/%3E%3Cpath d='M56 44l3.6 7.6 8.4 1-6.2 5.7 1.7 8.3-7.5-4.4-7.5 4.4 1.7-8.3-6.2-5.7 8.4-1z' fill='%23FFC73B'/%3E%3C/svg%3E") center / contain no-repeat;
}
.hp-no-results h2 { font-size: 1.5em; margin: 0 0 8px; }
.hp-no-results p { color: var(--cw-grey); max-width: 460px; margin: 0 auto; line-height: 1.55; }

/* CTA-блок пустой выдачи (разметка — PHP-оверрайд no-results, см. extra) */
.cw99-empty__actions {
  margin-top: 24px; display: flex; flex-direction: column;
  align-items: center; gap: 14px;
}
.cw99-empty__cta {
  display: inline-block; background: var(--cw-yellow); color: #132a52 !important;
  font-weight: 600; border-radius: 999px; padding: 12px 26px;
  text-decoration: none; transition: background .2s;
}
.cw99-empty__cta:hover { background: #FFD35E; color: #000 !important; }
.cw99-empty__chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.cw99-empty__chip {
  border: 2px solid var(--cw-blue); color: var(--cw-blue) !important;
  background: #fff; border-radius: 999px; padding: 6px 14px;
  font-size: .92em; text-decoration: none; transition: all .2s;
}
.cw99-empty__chip:hover { background: var(--cw-blue); color: #fff !important; }

/* ── Карточки без фото: бренд-плейсхолдер (CSS-интерим) ──── */
.hp-listing__image img[src*='/placeholders/'] { opacity: 0; }
.hp-listing__image:has(img[src*='/placeholders/']) {
  background: var(--cw-blue);
  position: relative;
}
.hp-listing__image:has(img[src*='/placeholders/'])::before {
  content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cg transform='rotate(-10 48 48)'%3E%3Crect x='16' y='27' width='64' height='42' rx='11' fill='rgba(255,255,255,.13)' stroke='%23fff' stroke-width='4'/%3E%3Ccircle cx='29' cy='40' r='5' fill='%23FFC73B'/%3E%3Ctext x='54' y='56' font-family='futura-pt,Futura,sans-serif' font-size='22' font-weight='700' fill='%23fff' text-anchor='middle'%3E99%3C/text%3E%3C/g%3E%3C/svg%3E") center / 84px auto no-repeat;
}

/* ── Мобилка ─────────────────────────────────────────────── */
@media (max-width: 760px) {
  .hp-page__topbar { margin-bottom: 16px; }
  .site-sidebar .hp-form--listing-filter { padding: 18px 16px 16px; }
  .header-hero.hp-listing-category--view-page .hp-listing-category__name { font-size: 1.7em; }
  .hp-no-results { padding: 38px 18px 42px; }
  .hp-no-results::before { width: 104px; height: 104px; }
  .hp-listing--view-block .hp-listing__featured-badge { top: 8px; left: 8px; font-size: .72em; padding: 4px 10px; }
  .hp-listing--view-block .hp-listing__content { padding: 14px 14px 0; }
  .hp-listing--view-block .hp-listing__footer { padding: 12px 14px 14px; }
}

/* ═══════════ СТРАНИЦЫ: single (дизайн-аудит 2026-07-12) ═══════════ */
/* ══════════════════════════════════════════════════════════
   Страница объявления + профиль продавца
   (.hp-listing--view-page / .hp-vendor--*) — «99 by CleanWhale»
   ══════════════════════════════════════════════════════════ */

/* — Шапка объявления: категория-чип, заголовок, дата — */
.hp-listing--view-page .hp-listing__categories { margin-bottom: 12px; }
.hp-listing--view-page .hp-listing__categories a {
  display: inline-block;
  background: #eef2fc; color: var(--cw-blue) !important;
  border-radius: 999px; padding: 5px 14px;
  font-size: .8em; font-weight: 600;
  text-decoration: none;
  transition: background .2s, color .2s;
}
.hp-listing--view-page .hp-listing__categories a:hover {
  background: var(--cw-blue) !important; color: #fff !important;
}
.hp-listing--view-page h1.hp-listing__title {
  font-size: 2.1em; font-weight: 700;
  line-height: 1.15; margin: 2px 0 10px;
}
.hp-listing--view-page .hp-listing__details--primary {
  color: var(--cw-grey); font-size: .92em;
}

/* Featured на своей странице — деликатная жёлтая метка у заголовка
   (класс .hp-listing--featured на обёртке добавляет functions.php) */
.hp-listing--view-page.hp-listing--featured h1.hp-listing__title::after {
  content: 'Выделено';
  display: inline-block; vertical-align: middle;
  background: var(--cw-yellow); color: #132a52;
  border-radius: 999px; padding: 4px 12px;
  margin-left: 12px;
  font-size: .38em; font-weight: 600;
  font-family: 'futura-pt', sans-serif;
  white-space: nowrap;
}
.hp-listing--view-page.hp-listing--featured { border: 0 !important; }

/* — Топбар: таб «Детали» + «В избранное» пилюлей — */
.hp-listing--view-page .hp-page__topbar--separate { align-items: center; }
.hp-listing--view-page .hp-listing__actions--secondary .hp-listing__action--favorite {
  display: inline-flex; align-items: center; gap: 7px;
  border: 2px solid var(--cw-border); border-radius: 999px;
  padding: 6px 15px; text-decoration: none;
  color: #444; font-size: .93em;
  transition: border-color .2s, color .2s;
}
.hp-listing--view-page .hp-listing__actions--secondary .hp-listing__action--favorite:hover {
  border-color: #e4410d; color: #e4410d;
}
.hp-listing--view-page .hp-listing__actions--secondary .hp-listing__action--favorite i { font-size: .95em; }

/* — Галерея (когда есть фото) — */
.hp-listing--view-page .hp-listing__images {
  border-radius: 12px; overflow: hidden;
  margin: 4px 0 20px;
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  line-height: 0;
}
.hp-listing--view-page .hp-listing__images img { width: 100%; display: block; }

/* Фото-плейсхолдер (PHP выводит .cw99-noimg, если фото нет) */
.cw99-noimg {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 10px;
  aspect-ratio: 16 / 7;
  margin: 4px 0 20px;
  border-radius: 12px;
  background: var(--cw-blue);
  color: #fff;
}
.cw99-noimg i { font-size: 46px; opacity: .55; }
.cw99-noimg span { opacity: .85; font-size: .95em; }

/* — Описание — */
.hp-listing--view-page .hp-listing__description {
  font-size: 1.05em; line-height: 1.65; margin-top: 6px;
}
.hp-listing--view-page .hp-listing__description::before {
  content: 'Описание';
  display: block;
  font-family: 'futura-pt', sans-serif;
  font-weight: 600; font-size: 1.15em;
  color: var(--cw-dark);
  margin-bottom: 8px;
}

/* — Таблица атрибутов (secondary, зебра) — */
.hp-listing--view-page .hp-listing__attributes--secondary {
  margin: 24px 0 0;
  border-radius: var(--cw-radius);
  overflow: hidden;
}
.hp-listing--view-page .hp-listing__attributes--secondary .hp-listing__attribute {
  display: flex; justify-content: space-between; gap: 16px;
  padding: 11px 16px; font-size: .97em;
  background: none; border: 0; border-radius: 0;
}
.hp-listing--view-page .hp-listing__attributes--secondary .hp-listing__attribute:nth-child(odd) {
  background: #fafafa;
}

/* — Сайдбар: отступы блоков — */
.hp-page__sidebar .hp-widget,
.hp-page__sidebar .cw99-safety,
.hp-page__sidebar .cw99-ask-agent { margin-bottom: 16px; }

/* — Сайдбар: карточка цены — */
.hp-listing--view-page .hp-listing__attributes--primary.widget {
  background: #fafafa; border-radius: var(--cw-radius);
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  padding: 18px 20px;
  /*
   * Раньше здесь был flex. Цена перестала быть одним элементом (от / до /
   * единица), и любой flex-раскладке приходится решать, что делать, когда
   * лента не влезает в ширину сайдбара. На 375px она разъезжалась на три
   * отдельных жёлтых блока — проверено в браузере. Блочный контейнер с
   * инлайновой лентой цены переносит её как обычный текст: подсветка
   * продолжается на следующей строке, скругления остаются по краям ленты.
   */
  display: block;
  text-align: center;
}
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute {
  border: 0; margin: 0;
}
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute::after { display: none; }
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--price,
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--price-max,
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--price-unit {
  display: inline;
  background: var(--cw-yellow); color: #000;
  border-radius: 0; padding: 8px 0;
  font-family: 'futura-pt', sans-serif;
  font-size: 1.25em; font-weight: 700; line-height: 2.3;
}
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--price {
  border-radius: 8px 0 0 8px; padding-left: 14px;
}
/* Отступы между кусками ленты — паддингами, а не пробелами в display_format:
   HivePress обрезает пробелы по краям шаблона, и «9 000 zł– 13 000 zł»
   слипалось в одно слово (видно на скриншоте до правки). */
/* ⚠️ ЗДЕСЬ СТОЯЛ `white-space: nowrap` НА --price И НА --price-max — снят.
   Он ставился ради неразрывной вилки, но вилка неразрывна и без него (все
   пробелы в display_format — U+00A0), а вместе с ней он убил ЕДИНСТВЕННУЮ
   точку переноса всей ленты: сгенерированный пробел перед единицей лежал
   внутри nowrap-элемента и подавлялся. На 360 лента уходила за карточку на
   37px, на 320 обрезалась посреди слова. Правило переносов теперь общее для
   каталога и страницы — см. блок «где ленте цены можно переноситься» выше;
   там же остался nowrap на --price-max (перенос после en-dash по UAX#14).
   Здесь — только геометрия.
   padding-left у --price-max снят: зазор даёт сгенерированный пробел, а два
   зазора подряд раздвигали вилку на лишние ~5px. */
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--price-max {
  padding-left: 0;
}
/* Зазор перед единицей = сгенерированный пробел (у предыдущего куска) + .2em.
   Пробел нужен ещё и потому, что в разметке между <div>-ами нет ни одного
   пробельного символа: копирование страницы и скринридер давали
   «39 900 złdo negocjacji». */
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--price-unit {
  border-radius: 0 8px 8px 0; padding-right: 14px; padding-left: .2em;
  /* Шрифт единицы меньше, а у инлайновых боксов высота фона считается от
     размера шрифта — без добавочного вертикального паддинга у ленты
     получалась ступенька на стыке. Замерено на живой странице: цена 41px,
     единица 38px при паддинге 13px, то есть компенсация недобирала 3px и
     ступенька в 1.5px сверху/снизу оставалась. Компенсация асимметричная:
     после 14.5px верх сошёлся ровно (153.8 = 153.8), а низ остался коротким
     на 1.5px — его и добираем снизу. Замерено на живой странице и на 1280,
     и на 390 (там разрыв тот же 1.5px). */
  padding-top: 14.5px; padding-bottom: 9.5px;
  font-size: .82em; font-weight: 600;
  /* Единицу переносим целиком: «za miesiąc / brutto» в две строки читалось
     как обрывок, а не как подпись к цене. */
  white-space: nowrap;
}
/* Отдельным правилом и с ЗАВЫШЕННОЙ специфичностью (0-4-0), потому что
   родительская тема держит
   `.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute:<псевдокласс>`
   с `padding-bottom:.5rem`. Её 0-4-0 перебивает наши 0-3-0 — и нижняя половина
   компенсации молча не применялась: в правиле выше стояло 16px, а по
   getComputedStyle приходило 8px, из-за чего ступенька на нижней кромке ленты
   оставалась даже после правки. Рабочее значение — 9.5px: 8px базовых плюс
   те самые 1.5px недобора (замерено на 1280 и на 390, разрыв одинаковый). Верхняя половина работала, потому что
   padding-top тем правилом не задан. Корневой контейнер страницы объявления
   несёт и класс `.hp-listing`, отсюда двойной класс в селекторе. */
.hp-listing--view-page.hp-listing .hp-listing__attributes--primary .hp-listing__attribute--price-unit {
  padding-bottom: 9.5px;
}
/* Хвост ленты закруглён справа у ПОСЛЕДНЕГО КУСКА ЦЕНЫ, а не у последнего
   элемента всего блока атрибутов. :last-child здесь врал: после цены в
   разметке идут пилюли типа и города (menu_order 40 и 50), поэтому у 7 из 19
   объявлений с ценой жёлтая подложка обрывалась прямым углом ровно на «zł» —
   цена выглядела обрезанной. */
.hp-listing--view-page .hp-listing__attributes--primary
  .hp-listing__attribute--price:not(:has(+ .hp-listing__attribute--price-max)):not(:has(+ .hp-listing__attribute--price-unit)) {
  border-radius: 8px; padding-right: 14px;
}
.hp-listing--view-page .hp-listing__attributes--primary
  .hp-listing__attribute--price-max:not(:has(+ .hp-listing__attribute--price-unit)) {
  border-radius: 0 8px 8px 0; padding-right: 14px;
}
/* ── ЛЕНТА ЦЕНЫ НА СТРАНИЦЕ ОБЪЯВЛЕНИЯ: СКРУГЛЕНИЕ ПРИНАДЛЕЖИТ ЛЕНТЕ ────────
 *
 * ⚠️ Два прошлых захода чинили здесь параметры, а неверна была КОНСТРУКЦИЯ.
 * Лента собиралась из трёх СОСЕДНИХ плашек, у каждой скруглены только внешние
 * углы, а стык между ними прямой. Целостной такая сборка остаётся ровно пока
 * стоит в одну строку: перенос в любом месте разрывает стык и обнажает прямые
 * углы посреди ленты — на 1024 замерено «6 000 zł – 9 000 zł» отдельной плашкой
 * (скруглена слева, обрублена справа) и «za miesiąc brutto» второй плашкой
 * (обрублена слева, скруглена справа). Поэтому «разрешить перенос» и «сохранить
 * вид ленты» были взаимоисключающими, и заходы просто перекидывали аварию с
 * одной ширины на другую: nowrap на всю ленту вылезал за карточку на 360 и
 * обрезался на 320, а возврат точки переноса рассыпал плашки.
 *
 * Теперь жёлтый фон и скругление держит ОДИН бокс — обёртка .cw99-price-ribbon
 * вокруг price/price_max/price_unit (шаблон
 * listinghive-child-pl/hivepress/listing/view/page/listing-attributes-primary.php).
 * Куски внутри становятся обычным текстом, стыков между фонами больше не
 * существует физически, и перенос выглядит как перенос текста внутри плашки.
 * Это ровно тот механизм, который уже год работает на карточке каталога
 * (.hp-listing--view-block ниже), — там плашкой стал сам контейнер, потому что
 * кроме цены в нём ничего нет; на странице объявления в контейнере ещё пилюли
 * типа/города и счётчик просмотров, поэтому обёртка отдельная.
 *
 * Геометрия подобрана так, чтобы ОДНОСТРОЧНЫЙ вид не изменился ни на пиксель
 * (замер до правки на 1280: лента 881.7–1179.6, высота 41px, поля 14px по краям,
 * цена 20px/700, единица 13.12px/600): padding 8px 14px + line-height 1.25 при
 * 1.25em дают те же 41px.
 *
 * Правила ниже применяются ТОЛЬКО при наличии обёртки, поэтому шведская доска,
 * где шаблона нет, продолжает рисоваться прежними правилами по кускам. */
.hp-listing--view-page .hp-listing__attributes--primary .cw99-price-ribbon {
  display: inline-block;
  max-width: 100%;
  border-radius: 8px;
  background: var(--cw-yellow);
  padding: 8px 14px;
  color: #000;
  font-family: 'futura-pt', sans-serif;
  font-size: 1.25em;
  font-weight: 700;
  line-height: 1.25;
}
/* Специфичность 0-5-0 намеренно. Ниже и выше по файлу лежат правила кусков с
   0-3-0 и 0-4-0 (последнее — компенсация паддинга единицы, заведённая как раз
   потому, что тема держит 0-4-0), и при равной специфичности выигрывал бы тот,
   кто стоит позже. Это уже ловили: правило стояло в файле, а getComputedStyle
   возвращал чужое значение. */
.hp-listing--view-page.hp-listing .hp-listing__attributes--primary .cw99-price-ribbon .hp-listing__attribute {
  display: inline;
  border: 0;
  border-radius: 0;
  background: none;
  padding: 0;
  margin: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}
/* Единица — та же доля от цены, что и раньше: 13.12px при цене 20px. Записана
   долей ленты (.656em), а не .82em контейнера, потому что теперь кегль
   наследуется от ленты. padding-left в em считается от СОБСТВЕННОГО кегля
   элемента, то есть .2em здесь — это прежние 2.624px. */
.hp-listing--view-page.hp-listing .hp-listing__attributes--primary .cw99-price-ribbon .hp-listing__attribute--price-unit {
  padding-left: .2em;
  font-size: .656em;
  font-weight: 600;
  /* Единицу переносим целиком: «za miesiąc / brutto» читалось как обрывок. */
  white-space: nowrap;
}

/* Пилюли типа и города идут в разметке ПОСЛЕ цены (menu_order 40 и 50),
   поэтому отбиваются сверху, а не сбоку. */
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--type,
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--district {
  background: #eef2fc; color: var(--cw-blue);
  border-radius: 999px; padding: 5px 13px; margin: 14px 3px 0;
  font-size: .88em; font-weight: 600;
  display: inline-flex; align-items: center;
}
.hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--district::before {
  content: '\f3c5';
  font-family: 'Font Awesome 5 Free'; font-weight: 900;
  font-size: .88em; margin-right: 6px;
}

/* — Сайдбар: карточка действий — */
.hp-listing--view-page .hp-listing__actions--primary.widget {
  background: #fafafa; border-radius: var(--cw-radius);
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  padding: 18px 20px; text-align: center;
}
.hp-listing--view-page .hp-listing__action--message.button {
  display: block; width: 100%;
  border-radius: 8px; padding: 13px 18px;
  font-weight: 600; font-size: 1em;
  margin-bottom: 4px;
  /* position:relative обязателен. Родительская тема держит на .button::before
     слой подсветки при наведении (position:absolute; inset:0; background
     rgba(255,255,255,.1)), а у кнопки был position:static — inset:0 разрешался
     от ближайшего позиционированного предка, то есть от ВСЕЙ карточки
     объявления: замер при наведении дал ::before 1163×1181px при кнопке
     319×50px, и наведение на кнопку заливало белым на 10% фото и весь текст
     объявления. */
  position: relative;
}
/* ИКОНКИ КОНВЕРТА НА КНОПКЕ НЕТ — и это осознанно.
   Она была прописана на ::before и не рисовалась НИКОГДА: этот псевдоэлемент
   занят родительской темой под слой подсветки, наш `content` там до вывода не
   доезжал (замер: computed content = ""), зато inset:0 от нестатичного предка
   растягивал подсветку на всю карточку. Перенос на ::after проблему не решил
   (content там тоже приходит пустым), поэтому дохлого правила здесь не
   держим. Нужна иконка — ставить инлайн-SVG в шаблон кнопки, как везде
   в этой теме, а не глифом Font Awesome через псевдоэлемент. */
.hp-listing--view-page .hp-listing__actions--primary .hp-link {
  color: var(--cw-grey); font-size: .93em;
  transition: color .2s;
}
.hp-listing--view-page .hp-listing__actions--primary .hp-link:hover { color: var(--cw-blue); }
.hp-listing--view-page .hp-listing__actions--primary .hp-listing__action--report:hover { color: #e4410d; }

/* — Плашка безопасности (PHP выводит .cw99-safety в сайдбар) — */
.cw99-safety {
  display: flex; gap: 11px; align-items: flex-start;
  background: #ffea84;
  border-radius: var(--cw-radius); padding: 14px 16px;
  font-size: .92em; line-height: 1.5; color: #4a3b12;
}
.cw99-safety i { color: #c79015; font-size: 1.25em; margin-top: 2px; }
.cw99-safety b { display: block; color: #242424; margin-bottom: 2px; }

/* — CTA агента (PHP выводит .cw99-ask-agent в сайдбар) — */
.cw99-ask-agent {
  display: block; text-align: center;
  background: #eef2fc; color: var(--cw-blue) !important;
  border-radius: 12px; padding: 13px 16px;
  font-weight: 600; text-decoration: none;
  transition: background .2s;
}
.cw99-ask-agent:hover { background: #dfe7fa; color: var(--cw-blue-dark) !important; }
.cw99-ask-agent::before {
  content: '\f086';
  font-family: 'Font Awesome 5 Free'; font-weight: 900;
  margin-right: 9px;
}

/* — Похожие объявления (PHP выводит .cw99-related под описанием) — */
.cw99-related { margin-top: 36px; }
.cw99-related > h2 { font-size: 1.35em; margin-bottom: 14px; }

/* — Карточка продавца в сайдбаре (.hp-vendor--view-block) — */
.hp-page__sidebar .hp-vendor--view-block {
  background: #fafafa; border-radius: var(--cw-radius);
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  padding: 18px 20px;
  overflow: visible;
}
.hp-page__sidebar .hp-vendor--view-block:hover { transform: none; }
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__image img {
  width: 56px; height: 56px; border-radius: 50%;
  background: #eef2fc; object-fit: cover;
}
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__name {
  font-size: 1.08em; font-weight: 600; margin: 8px 0 2px;
}
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__name a { color: var(--cw-dark); text-decoration: none; }
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__name a:hover { color: var(--cw-blue); }
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__registered-date,
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__details {
  color: var(--cw-grey); font-size: .88em;
}

/* Компоновка карточки: родительская тема даёт header padding 48px сверху и
   content padding 48px снизу (рассчитано на широкий блок каталога). В узком
   сайдбаре это давало 96px пустоты и три разные левые границы у header (32px),
   footer (24px) и самой карточки (20px) — визуально «съехавший» блок. */
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__header {
  padding: 6px 0 0; margin-bottom: 12px;
}
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__image {
  width: auto; margin: 0; text-align: center;
}
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__image > a {
  display: inline-block; line-height: 0;
}
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__content { padding: 0; }
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__footer {
  padding: 14px 0 0; margin-top: 16px; justify-content: center;
}
/* Иконка «написать» стояла в подвале карточки одна, без подписи, серым 25%.
   Подпись берём из атрибута title — он уже переведён HivePress, дублировать
   строку в CSS не нужно. */
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__action--message {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--cw-blue); font-size: .95em; font-weight: 500; text-decoration: none;
}
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__action--message::after {
  content: attr(title);
}
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__action--message i { color: inherit; }
.hp-page__sidebar .hp-vendor--view-block .hp-vendor__action--message:hover { color: var(--cw-blue-dark); }

/* Аватар без фото — инициалы в фирменном круге вместо серой заглушки плагина
   (шаблон hivepress/vendor/view/block/vendor-image.php). */
.hp-vendor__image .cw99-avatar-ini {
  display: inline-flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--cw-blue); color: #fff;
  font-family: 'futura-pt', 'Futura', sans-serif;
  font-weight: 700; font-size: 22px; line-height: 1;
  text-decoration: none;
}
.hp-vendor--view-page .hp-vendor__image .cw99-avatar-ini {
  width: 96px; height: 96px; font-size: 36px; margin-bottom: 12px;
}

/* — Рейтинг-звёзды (hivepress-reviews) — жёлтые — */
.hp-listing__rating i, .hp-vendor__rating i, .hp-review__rating i,
.hp-rating__stars--front i, .hp-rating__stars--front { color: var(--cw-yellow); }
.hp-rating__stars--back, .hp-rating__stars--back i { color: #e5e5e5; }

/* — Профиль продавца (.hp-vendor--view-page) — */
.hp-vendor--view-page {
  background: #fafafa; border-radius: var(--cw-radius);
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  padding: 26px 24px; text-align: center;
}
.hp-vendor--view-page .hp-vendor__image img {
  width: 96px; height: 96px; border-radius: 50%;
  background: #eef2fc; object-fit: cover; margin: 0 auto 12px;
}
.hp-vendor--view-page .hp-vendor__name {
  font-size: 1.35em; font-weight: 700; margin-bottom: 2px;
}
.hp-vendor--view-page .hp-vendor__details--primary,
.hp-vendor--view-page .hp-vendor__registered-date {
  color: var(--cw-grey); font-size: .92em;
}
.hp-vendor--view-page .hp-vendor__description {
  margin-top: 14px; text-align: left; line-height: 1.6;
  border-top: 1px solid var(--cw-border); padding-top: 14px;
}

/* — Отзывы — */
.hp-review, .hp-comment--review {
  background: #fafafa;
  border-radius: var(--cw-radius); padding: 16px 18px; margin-bottom: 14px;
}
.hp-review__author, .hp-review .comment__author { font-weight: 600; }
.hp-review__created-date, .hp-review__date { color: var(--cw-grey); font-size: .88em; }
.hp-review__image img { border-radius: 50%; }
.hp-review__text { margin-top: 8px; line-height: 1.55; }

/* — Мобилка — */
@media (max-width: 760px) {
  .hp-listing--view-page h1.hp-listing__title { font-size: 1.5em; }
  .hp-listing--view-page.hp-listing--featured h1.hp-listing__title::after {
    display: inline-block; margin-left: 8px; font-size: .5em;
  }
  .hp-listing--view-page .hp-page__topbar--separate { flex-wrap: wrap; gap: 8px; }
  /* Топбар «Szczegóły / Dodaj do ulubionych» переносится, и обе его части
     несут одну и ту же нижнюю линейку — получались ДВЕ горизонтальные линии
     на расстоянии 79px с одинокой пилюлей в пустой полосе между ними.
     Линейку оставляем одну — ту, что у самого топбара. */
  .hp-listing--view-page .hp-page__topbar--separate .hp-menu--tabbed { border-bottom: 0; }
  .hp-listing--view-page .hp-page__sidebar { margin-top: 6px; }
  /* Единица цены НЕ приравнивается к кеглю цены. Когда приравнивали, ломались
     сразу две вещи: (1) компенсирующий вертикальный паддинг был рассчитан под
     .82em и давал ступеньку 5px на стыке жёлтой ленты, (2) «do negocjacji»
     печаталось тем же кеглем, что «39 900 zł», и иерархия «цена крупно /
     единица мелко», которая есть на 1280, на телефоне пропадала. */
  .hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--price,
  .hp-listing--view-page .hp-listing__attributes--primary .hp-listing__attribute--price-max {
    font-size: 1.2em;
  }
  .cw99-noimg { aspect-ratio: 16 / 10; }
  .cw99-noimg i { font-size: 36px; }
  .hp-vendor--view-page { padding: 20px 16px; }
}

/* ═══════════ СТРАНИЦЫ: submit-auth (дизайн-аудит 2026-07-12) ═══════════ */
/* ══════════════════════════════════════════════════════════
   Подача объявления + авторизация — модалки, submit-флоу,
   прогресс шагов, статусы модерации, onboarding-чипсы
   ══════════════════════════════════════════════════════════ */

/* — Модалки Вход / Регистрация / Сброс пароля (.hp-modal, fancybox) — */
.hp-modal {
  border-radius: var(--cw-radius);
  padding: 34px 34px 26px;
  max-width: 420px;
  width: 100%;
  box-shadow: 0 0 3vw rgba(0, 0, 0, .2);
}
.hp-modal__title {
  text-align: center;
  font-size: 1.45em;
  font-weight: 700;
  margin: 0 0 4px;
}
.hp-modal__title::after {
  content: "";
  display: block;
  width: 34px; height: 4px;
  border-radius: 999px;
  background: var(--cw-yellow);
  margin: 10px auto 2px;
}
.hp-modal .hp-form__description {
  text-align: center;
  color: var(--cw-grey);
  line-height: 1.5;
  margin: 10px 0 4px;
}
.hp-modal .fancybox-close-small { top: 10px; right: 10px; color: #9aa1ad; }
.hp-modal .fancybox-close-small:hover { color: var(--cw-dark); }

/* Лейблы: не капс, тёмные; «(опционально)» — тихим серым */
.hp-modal .hp-form__label,
.hp-form--listing-submit .hp-form__label,
.hp-form--listing-update .hp-form__label,
.hp-form--user-login .hp-form__label,
.hp-form--user-register .hp-form__label,
.hp-form--user-password-request .hp-form__label {
  font-size: .95em;
  font-weight: 600;
  color: #37393f;
  margin-bottom: 7px;
}
.hp-modal .hp-form__label small,
.hp-form--listing-submit .hp-form__label small,
.hp-form--user-register .hp-form__label small {
  color: var(--cw-grey);
  font-weight: 400;
}

/* Поля модалок и auth-форм */
.hp-modal .hp-form__field { margin-bottom: 16px; }
.hp-modal input[type=text],
.hp-modal input[type=email],
.hp-modal input[type=password],
.hp-form--user-login input[type=text],
.hp-form--user-login input[type=password],
.hp-form--user-register input[type=text],
.hp-form--user-register input[type=email],
.hp-form--user-register input[type=password],
.hp-form--user-password-request input[type=text] {
  width: 100%;
  height: 48px;
  padding: 10px 14px;
  border: 2px solid var(--cw-border);
  border-radius: 8px;
  font-size: 1em;
  transition: border-color .2s, box-shadow .2s;
}
.hp-modal input:focus,
.hp-form--user-login input:focus,
.hp-form--user-register input:focus,
.hp-form--user-password-request input:focus {
  border-color: var(--cw-blue) !important;
  box-shadow: none;
  outline: 3px solid rgba(36, 87, 198, .18);
}
.hp-modal .hp-form__field--password { position: relative; }
.hp-modal .hp-field__icon {
  position: absolute;
  right: 14px;
  bottom: 13px;
  color: var(--cw-grey);
}
.hp-modal .hp-field__icon:hover { color: var(--cw-blue); }

/* Кнопка авторизации: синяя, полная ширина, без градиента */
.hp-modal button[type=submit],
.hp-form--user-login button[type=submit],
.hp-form--user-register button[type=submit],
.hp-form--user-password-request button[type=submit] {
  width: 100%;
  min-height: 48px;
  border-radius: 8px;
  border: 0 !important;
  background: var(--cw-blue) !important;
  background-image: none !important;
  color: #fff !important;
  font-weight: 600;
  font-size: 1.02em;
  margin-top: 6px;
  box-shadow: 0 0 1.2vw rgba(0, 0, 0, .12);
}
.hp-modal button[type=submit]:hover,
.hp-form--user-login button[type=submit]:hover,
.hp-form--user-register button[type=submit]:hover {
  background: var(--cw-blue-dark) !important;
}

/* Перекрёстные ссылки под кнопкой */
.hp-modal .hp-form__actions,
.hp-form--user-login .hp-form__actions,
.hp-form--user-register .hp-form__actions {
  margin-top: 16px;
  text-align: center;
  color: var(--cw-grey);
  font-size: .95em;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.hp-modal .hp-form__action a,
.hp-form--user-login .hp-form__action a,
.hp-form--user-register .hp-form__action a {
  color: var(--cw-blue);
  font-weight: 600;
}
.hp-modal .hp-form__action a:hover { color: var(--cw-blue-dark); }

/* Auth-формы полностраничного fallback — та же карточка */
.site-content .hp-form--user-login,
.site-content .hp-form--user-register,
.site-content .hp-form--user-password-request {
  max-width: 420px;
  margin: 24px auto;
  background: #fafafa;
  border-radius: var(--cw-radius);
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  padding: 34px;
}

/* Сообщения форм: ошибки — заметная, но спокойная плашка */
.hp-form__messages:not(:empty) { margin-bottom: 14px; }
.hp-form__messages > * {
  background: #FDEDE7;
  color: #B23409;
  border: 1px solid rgba(228, 65, 13, .25);
  border-radius: 8px;
  padding: 10px 14px;
  font-size: .95em;
  line-height: 1.45;
}
.hp-form input:user-invalid,
.hp-form textarea:user-invalid {
  border-color: #E4410D !important;
}

/* — Прогресс шагов подачи (markup через PHP, см. extra) — */
.cw99-steps {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  list-style: none;
  margin: 4px 0 30px;
  padding: 0;
  font-size: .93em;
  counter-reset: cwstep;
}
.cw99-steps li {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--cw-grey);
  counter-increment: cwstep;
}
.cw99-steps li::before {
  content: counter(cwstep);
  width: 27px; height: 27px;
  border-radius: 50%;
  background: #EEF2FC;
  color: var(--cw-blue);
  font-weight: 700;
  font-size: .9em;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 27px;
}
.cw99-steps li:not(:last-child)::after {
  content: "";
  width: 38px; height: 2px;
  border-radius: 1px;
  background: var(--cw-border);
}
.cw99-steps li.is-active { color: var(--cw-dark); font-weight: 600; }
.cw99-steps li.is-active::before { background: var(--cw-blue); color: #fff; }
.cw99-steps li.is-done { color: var(--cw-blue); }
.cw99-steps li.is-done::before {
  content: "\2713";
  background: var(--cw-blue);
  color: #fff;
}

/* — Шаг «категория»: жёлтое кольцо продолжает путь CTA — */
.hp-listing-category--submit-block { cursor: pointer; }
.hp-listing-category--submit-block:hover {
  box-shadow: 0 0 1.5vw rgba(0, 0, 0, .14);
  outline: 3px solid var(--cw-yellow);
}

/* — Шаг «детали»: форма-карточка — */
.hp-form--listing-submit,
.hp-form--listing-update {
  background: #fafafa;
  border-radius: var(--cw-radius);
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  padding: 34px 36px 30px;
  max-width: 760px;
  margin: 0 auto;
}
.hp-form--listing-submit .hp-form__field,
.hp-form--listing-update .hp-form__field { margin-bottom: 22px; }

.hp-form--listing-submit input[type=text],
.hp-form--listing-submit input[type=email],
.hp-form--listing-submit input[type=number],
.hp-form--listing-submit input[type=url],
.hp-form--listing-submit select,
.hp-form--listing-update input[type=text],
.hp-form--listing-update input[type=number],
.hp-form--listing-update select {
  height: 48px;
  border: 2px solid var(--cw-border);
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 1em;
  width: 100%;
}
.hp-form--listing-submit textarea,
.hp-form--listing-update textarea {
  min-height: 150px;
  border: 2px solid var(--cw-border);
  border-radius: 8px;
  padding: 12px 14px;
}
.hp-form--listing-submit input:focus,
.hp-form--listing-submit select:focus,
.hp-form--listing-submit textarea:focus,
.hp-form--listing-update input:focus,
.hp-form--listing-update textarea:focus {
  border-color: var(--cw-blue) !important;
  box-shadow: none;
  outline: 3px solid rgba(36, 87, 198, .18);
}

/* Нативные селекты: свой шеврон вместо системного */
.hp-form--listing-submit select,
.hp-form--listing-update select {
  -webkit-appearance: none;
  appearance: none;
  background: #fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238E8E8E' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center;
  padding-right: 40px;
}
/* select2 (категория) — под общий стиль полей */
.hp-form--listing-submit .select2-selection--single {
  height: 48px;
  border: 2px solid var(--cw-border);
  border-radius: 8px;
}
.hp-form--listing-submit .select2-selection__rendered { line-height: 44px; padding-left: 14px; }
.hp-form--listing-submit .select2-selection__arrow { height: 44px; }

/* Фото: дропзона вместо голой кнопки.
   ВНИМАНИЕ: селектор .hp-field__button ЗДЕСЬ БЫЛ ОШИБКОЙ и снят.
   В живом HivePress 1.7 .hp-field__button — это НЕ дропзона, а два круглых
   значка поверх миниатюры уже загруженного файла: «Pobierz»
   (.hp-field__button--download) и «Usuń» (.hp-field__button--delete),
   которым база задаёт position:absolute; width/height 2rem; border-radius:50%.
   Дропзонные декларации position не перебивали, зато перебивали размер и
   display: значки превращались в два абсолютно спозиционированных блока
   100% × 112px с пунктирной рамкой и глифом камеры и ложились поверх превью
   и кнопки выбора (замер /account/settings/: два блока 119×112 при превью
   87×87). Плюс display:flex снимал базовое display:none с «Pobierz».
   Настоящая дропзона в текущей разметке — кнопка .hp-field--button, она
   стилизована со СВОЕЙ областью в skin.css (страница подачи объявления);
   вид превью на странице аккаунта — там же, секция D10. */
.hp-field--attachment-upload label.button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  min-height: 112px;
  border: 2px dashed #BFCFF0;
  border-radius: 12px;
  background: #F7F9FE !important;
  background-image: none !important;
  color: var(--cw-blue) !important;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s, border-color .2s;
  text-align: center;
}
.hp-field--attachment-upload label.button::before {
  content: "\f030";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 1.5em;
}
.hp-field--attachment-upload label.button:hover {
  background: #EEF2FC !important;
  border-color: var(--cw-blue);
}
.hp-field--attachment-upload .hp-row { margin-bottom: 12px; }
.hp-field--attachment-upload img { border-radius: 10px; }

/* Финальная CTA: жёлтая пилюля — зеркало кнопки хедера */
.hp-form--listing-submit button[type=submit],
.hp-form--listing-update button[type=submit] {
  background: var(--cw-yellow) !important;
  border-color: var(--cw-yellow) !important;
  background-image: none !important;
  color: #132a52 !important;
  border-radius: 999px;
  padding: 14px 36px;
  font-weight: 700;
  font-size: 1.05em;
  box-shadow: 0 0 1.2vw rgba(0, 0, 0, .12);
}
.hp-form--listing-submit button[type=submit]:hover,
.hp-form--listing-update button[type=submit]:hover {
  background: #FFD35E !important;
  border-color: #FFD35E !important;
  color: #000 !important;
}

/* — Шаг «готово» (.cw99-submit-done, markup через PHP) — */
.cw99-submit-done {
  max-width: 560px;
  margin: 30px auto;
  background: #fafafa;
  border-radius: var(--cw-radius);
  box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  padding: 44px 36px 38px;
  text-align: center;
}
.cw99-submit-done__icon {
  width: 72px; height: 72px;
  border-radius: 50%;
  background: var(--cw-yellow);
  color: #000;
  font-size: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
}
.cw99-submit-done h2 { margin: 0 0 8px; }
.cw99-submit-done p { color: var(--cw-grey); line-height: 1.55; margin: 0 0 6px; }
.cw99-submit-done__hint {
  background: #FFF8E6;
  border-radius: var(--cw-radius);
  padding: 12px 16px;
  margin: 18px 0 4px;
  color: #6b5200;
  font-size: .95em;
  line-height: 1.5;
}
.cw99-submit-done__actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 22px;
}

/* — Статусы модерации в аккаунте — */
.hp-listing__status {
  border-radius: 999px;
  padding: 3px 12px;
  font-size: .78em;
  font-weight: 600;
}
.hp-listing__status--pending { background: #FFF3D6; color: #8a6200; }
.hp-listing__status--draft { background: #f0f0f0; color: #666; }

/* — Onboarding: чипсы «что вы хотите?» (markup через PHP) — */
.cw99-onboard { text-align: center; padding: 10px 4px 4px; }
.cw99-onboard h3 { margin: 0 0 4px; }
.cw99-onboard p { color: var(--cw-grey); margin: 0; }
.cw99-onboard__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-top: 16px;
}
.cw99-onboard__chip {
  display: inline-block;
  border: 2px solid var(--cw-blue);
  color: var(--cw-blue);
  background: #fff;
  border-radius: 999px;
  padding: 9px 18px;
  font-weight: 600;
  font-size: .95em;
  cursor: pointer;
  text-decoration: none;
  transition: all .2s;
  font-family: inherit;
}
.cw99-onboard__chip:hover { background: var(--cw-blue); color: #fff; }
.cw99-onboard__chip--sell {
  border-color: var(--cw-yellow);
  background: var(--cw-yellow);
  color: #132a52;
}
.cw99-onboard__chip--sell:hover { background: #FFD35E; border-color: #FFD35E; color: #000; }

/* — Мобилка — */
@media (max-width: 760px) {
  .hp-modal { padding: 26px 20px 22px; max-width: none; border-radius: 14px; }
  .hp-form--listing-submit,
  .hp-form--listing-update { padding: 22px 16px 18px; border-radius: 12px; }
  .hp-form--listing-submit button[type=submit],
  .hp-form--listing-update button[type=submit] {
    width: 100%;
    position: sticky;
    bottom: 10px;
    z-index: 5;
  }
  .cw99-steps { gap: 6px; font-size: .85em; }
  .cw99-steps li:not(:last-child)::after { width: 18px; }
  .cw99-steps li .cw99-steps__label { display: none; }
  .cw99-steps li.is-active .cw99-steps__label { display: inline; }
  .cw99-submit-done { padding: 30px 20px 26px; }
  .cw99-submit-done__actions .button { width: 100%; }
}


/* ═══════════ СТРАНИЦЫ: account (дизайн-аудит 2026-07-12) ═══════════ */
/* ══════════════════════════════════════════════════════════
   КАБИНЕТ «99» — меню кабинета, мои объявления, диалоги,
   тред сообщений, избранное, пустые состояния, бейдж в хедере
   (страницы /account/*: .hp-page__sidebar + .hp-page__content)
   ══════════════════════════════════════════════════════════ */

/* ── Заголовок страницы кабинета ── */
.hp-page__content .hp-page__title { font-size: 1.7em; margin-bottom: 24px; }

/* ── Сайдбар: меню кабинета ── */
.hp-page__sidebar .hp-menu--user-account { background: #fafafa; border-radius: var(--cw-radius); padding: 10px; box-shadow: 0 0 .9vw rgba(0, 0, 0, .06); }
.hp-page__sidebar .hp-menu--user-account ul { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; list-style: none; }
.hp-page__sidebar .hp-menu--user-account li { margin: 0; padding: 0; }
.hp-page__sidebar .hp-menu--user-account li::before { display: none !important; } /* чеврон темы — долой */
.hp-page__sidebar .hp-menu--user-account .hp-menu__item > a {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 12px; border-radius: 9px;
  color: #333 !important; font-weight: 500; text-decoration: none;
  transition: background .2s, color .2s;
}
/* иконки пунктов (FA5 solid уже загружен темой) */
.hp-page__sidebar .hp-menu--user-account .hp-menu__item > a::before {
  content: '\f013';
  font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size: 14px;
  width: 34px; height: 34px; border-radius: 50%; flex: 0 0 34px;
  background: #EEF2FC; color: var(--cw-blue);
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .2s, color .2s;
}
.hp-page__sidebar .hp-menu__item--listings-edit > a::before { content: '\f03a'; }      /* список */
.hp-page__sidebar .hp-menu__item--listings-favorite > a::before { content: '\f004'; }  /* сердце */
.hp-page__sidebar .hp-menu__item--messages-thread > a::before { content: '\f0e0'; }    /* конверт */
.hp-page__sidebar .hp-menu__item--user-edit-settings > a::before { content: '\f013'; } /* шестерёнка */
.hp-page__sidebar .hp-menu__item--user-logout > a::before { content: '\f2f5'; background: #F5F5F5; color: var(--cw-grey); }

.hp-page__sidebar .hp-menu--user-account .hp-menu__item > a:hover { background: #F5F6FA; color: var(--cw-blue) !important; }
.hp-page__sidebar .hp-menu--user-account .hp-menu__item--current > a {
  background: var(--cw-blue); color: #fff !important; font-weight: 600;
}
.hp-page__sidebar .hp-menu--user-account .hp-menu__item--current > a::before { background: rgba(255,255,255,.16); color: #fff; }
/* «Выйти» — отделён и приглушён */
.hp-page__sidebar .hp-menu__item--user-logout { border-top: 1px solid var(--cw-border); margin-top: 6px !important; padding-top: 6px !important; }
.hp-page__sidebar .hp-menu__item--user-logout > a { color: var(--cw-grey) !important; }

/* счётчик непрочитанных: HivePress сам выводит <small>N</small> в пункте меню */
.hp-menu--user-account .hp-menu__item a small {
  margin-left: auto; background: var(--cw-yellow); color: #132A52;
  border-radius: 999px; padding: 2px 8px; min-width: 22px; text-align: center;
  font-size: .74em; font-weight: 700; line-height: 1.5;
}

/* ── Хедер: бейдж новых сообщений на иконке юзера (span вставляет PHP) ── */
.header-navbar .hp-menu__item--user-account { position: relative; }
.header-navbar .cw99-nav-badge {
  position: absolute; top: -7px; left: 10px;
  min-width: 18px; height: 18px; padding: 0 5px;
  background: var(--cw-yellow); color: #132A52;
  border-radius: 999px; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center;
  outline: 2px solid var(--cw-blue);
  pointer-events: none;
}

/* ── Статусы объявлений: пилюли вместо цветных рамок ── */
.hp-page__content .hp-status span {
  border: 0 !important; border-radius: 999px; padding: 5px 12px;
  font-size: .8em; font-weight: 600; line-height: 1.2;
}
.hp-page__content .hp-status--publish span { background: #fafafa; color: #000 !important; } /* Опубликовано */
.hp-page__content .hp-status--pending span { background: rgba(255,199,59,.22); color: #8A6400 !important; } /* На модерации */
.hp-page__content .hp-status--draft span   { background: #EFEFEF; color: var(--cw-grey) !important; }       /* Скрыто */

/* ── Таблицы кабинета (мои объявления, диалоги) → карточки-строки ── */
.hp-page__content .hp-table { width: 100%; border: 0; border-collapse: separate; border-spacing: 0 10px; }
.hp-page__content .hp-table tr {
  background: #fafafa; box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
  transition: box-shadow .3s, transform .3s;
}
.hp-page__content .hp-table tr:hover { box-shadow: 0 0 1.5vw rgba(0, 0, 0, .12); transform: translateY(-1px); }
.hp-page__content .hp-table td { border: 0; padding: 16px 14px; vertical-align: middle; background: transparent; }
.hp-page__content .hp-table td:first-child { border-radius: 10px 0 0 10px; padding-left: 18px; }
.hp-page__content .hp-table td:last-child { border-radius: 0 10px 10px 0; padding-right: 18px; }

/* ── Мои объявления ── */
.hp-listing--edit-block .hp-listing__title { width: 100%; }
.hp-listing--edit-block .hp-listing__title a { font-weight: 600; color: #242424; }
.hp-listing--edit-block .hp-listing__title a:hover { color: var(--cw-blue); }
.hp-listing--edit-block .hp-listing__title .hp-icon { color: var(--cw-grey); }
.hp-listing--edit-block .hp-listing__categories,
.hp-listing--edit-block .hp-listing__date { color: var(--cw-grey); font-size: .9em; white-space: nowrap; }
.hp-listing--edit-block .hp-listing__status { white-space: nowrap; }
.hp-listing--edit-block .hp-listing__actions--primary { white-space: nowrap; text-align: right; }
.hp-listing--edit-block .hp-listing__action {
  width: 36px; height: 36px; border-radius: 50%; background: #F5F6FA;
  display: inline-flex; align-items: center; justify-content: center;
  color: #666; margin-left: 6px; transition: background .2s, color .2s;
}
.hp-listing--edit-block .hp-listing__action:hover { background: #EEF2FC; color: var(--cw-blue); }
.hp-listing--edit-block .hp-listing__action i { margin: 0; }
/* «скрыть» (ядро: listing_hide_toggle) и «выделить» (PHP) */
.hp-listing--edit-block .hp-listing__action--hide:hover { color: var(--cw-grey); }
.hp-listing--edit-block .hp-listing__action--feature { background: rgba(255,199,59,.18); color: #8A6400; }
.hp-listing--edit-block .hp-listing__action--feature:hover { background: var(--cw-yellow); color: #132A52; }
/* счётчик просмотров (PHP выводит span.cw99-views: <i class="fas fa-eye"></i> N) */
.hp-listing--edit-block .cw99-views {
  display: inline-flex; align-items: center; gap: 5px;
  color: var(--cw-grey); font-size: .85em; margin-left: 10px; white-space: nowrap; font-weight: 400;
}

/* ── Диалоги (/account/messages/) ── */
.hp-messages.hp-table .hp-message__sender { width: 40%; }
.hp-messages.hp-table .hp-message__sender a { display: flex; align-items: center; font-weight: 600; color: #242424; }
.hp-messages.hp-table .hp-message__sender .hp-icon {
  width: 44px; height: 44px; border-radius: 50%; flex: 0 0 44px;
  background: #EEF2FC; color: var(--cw-blue); font-size: 16px;
  display: inline-flex; align-items: center; justify-content: center;
  margin-right: 12px; position: relative;
}
/* непрочитанный диалог = закрытый конверт (fa-envelope): синяя точка + жирная строка */
.hp-messages.hp-table .hp-message__sender .fa-envelope::after {
  content: ''; position: absolute; top: 1px; right: 1px;
  width: 11px; height: 11px; border-radius: 50%;
  background: var(--cw-blue); outline: 2px solid #fff;
}
.hp-messages.hp-table tr:has(.fa-envelope) { box-shadow: 0 0 1vw rgba(0, 0, 0, .12); }
.hp-messages.hp-table tr:has(.fa-envelope) .hp-message__sender a { color: #132A52; font-weight: 700; }
.hp-messages.hp-table .hp-message__listing { color: var(--cw-grey); font-size: .9em; }
.hp-messages.hp-table .hp-message__listing a { color: var(--cw-grey); }
.hp-messages.hp-table .hp-message__listing a:hover { color: var(--cw-blue); }
.hp-messages.hp-table .hp-message__date { color: var(--cw-grey); font-size: .88em; text-align: right; white-space: nowrap; }

/* ── Тред (/account/messages/<user_id>/): пузыри чата ── */
.hp-page__content .hp-messages.hp-grid { display: flex; flex-direction: column; gap: 12px; margin: 0 0 18px; }
.hp-page__content .hp-messages.hp-grid .hp-grid__item { width: auto; max-width: 100%; margin: 0; padding: 0; display: flex; }
.hp-message--view-block {
  max-width: 78%; background: #F5F6FA; color: #000;
  border-radius: 16px 16px 16px 4px; padding: 12px 16px;
}
.hp-message--view-block .hp-message__header { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; margin-bottom: 4px; }
.hp-message--view-block .hp-message__details { display: flex; gap: 10px; align-items: baseline; }
.hp-message--view-block .hp-message__sender { font-weight: 600; color: #132A52; font-size: .88em; }
.hp-message--view-block .hp-message__sender a { color: inherit; }
.hp-message--view-block .hp-message__date { color: var(--cw-grey); font-size: .8em; }
.hp-message--view-block .hp-message__listing {
  font-size: .8em; color: var(--cw-grey); background: #fff;
  border-radius: 999px; padding: 3px 10px; text-decoration: none;
}
.hp-message--view-block .hp-message__listing:hover { color: var(--cw-blue); }
.hp-message--view-block .hp-message__text { line-height: 1.45; }
.hp-message--view-block .hp-message__text p { margin: 0; }
.hp-message--view-block .hp-message__attachment { font-size: .88em; color: var(--cw-blue); margin-top: 6px; }
/* свои сообщения: маркер .hp-message__sender--own из оверрайда шаблона (или JS-класс .hp-message--own) */
.hp-messages.hp-grid .hp-grid__item:has(.hp-message__sender--own),
.hp-messages.hp-grid .hp-grid__item:has(.hp-message--own) { justify-content: flex-end; }
.hp-message--view-block:has(.hp-message__sender--own),
.hp-message--view-block.hp-message--own {
  background: var(--cw-blue); color: #fff; border-radius: 16px 16px 4px 16px;
}
.hp-message--view-block:has(.hp-message__sender--own) .hp-message__sender,
.hp-message--view-block.hp-message--own .hp-message__sender { color: #fff; }
.hp-message--view-block:has(.hp-message__sender--own) .hp-message__date,
.hp-message--view-block.hp-message--own .hp-message__date { color: rgba(255,255,255,.72); }
.hp-message--view-block:has(.hp-message__sender--own) .hp-message__listing,
.hp-message--view-block.hp-message--own .hp-message__listing { background: rgba(255,255,255,.16); color: #fff; }
.hp-message--view-block:has(.hp-message__sender--own) .hp-message__attachment,
.hp-message--view-block.hp-message--own .hp-message__attachment { color: #fff; }

/* поле ввода-пилюля + кнопка в одну строку */
.hp-form--message-send { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 10px; padding-top: 14px; border-top: 1px solid var(--cw-border); }
.hp-form--message-send .hp-form__messages { flex-basis: 100%; margin: 0 !important; }
.hp-form--message-send .hp-form__fields { flex: 1; min-width: 0; margin: 0 !important; }
.hp-form--message-send .hp-form__field { margin: 0 0 8px !important; }
.hp-form--message-send .hp-form__field:last-child { margin-bottom: 0 !important; }
.hp-form--message-send textarea.hp-field--textarea {
  min-height: 50px; height: 50px; max-height: 140px;
  border: 2px solid var(--cw-border); border-radius: 25px;
  padding: 12px 20px; resize: none; line-height: 1.35;
}
.hp-form--message-send textarea.hp-field--textarea:focus { border-color: var(--cw-blue) !important; }
.hp-form--message-send .hp-form__footer { margin: 0 !important; }
.hp-form--message-send button[type=submit] { border-radius: 999px !important; padding: 13px 26px; white-space: nowrap; }

/* ── Пустые состояния (разметку выводит PHP, см. extra) ── */
.cw99-empty {
  text-align: center; padding: 54px 24px;
  background: #fafafa; border-radius: var(--cw-radius); box-shadow: 0 0 .9vw rgba(0, 0, 0, .06);
}
.cw99-empty__icon {
  width: 92px; height: 92px; border-radius: 50%; margin: 0 auto 20px;
  background: #EEF2FC; color: var(--cw-blue); font-size: 36px;
  display: flex; align-items: center; justify-content: center;
}
.cw99-empty h3 { margin: 0 0 8px; font-size: 1.25em; }
.cw99-empty p { color: var(--cw-grey); margin: 0 auto 22px; max-width: 420px; }
.cw99-empty__cta {
  display: inline-block; background: var(--cw-yellow); color: #132A52 !important;
  border-radius: 999px; padding: 12px 26px; font-weight: 600; text-decoration: none;
  transition: background .2s;
}
.cw99-empty__cta:hover { background: #FFD35E; color: #000 !important; }

/* ── Избранное: сетка как в каталоге ── */
.hp-page__content .hp-listings.hp-grid .hp-grid__item { margin-bottom: 24px; }
.hp-page__content .hp-listing--view-block .hp-listing__action--favorite { color: #E4410D; }

/* ── Настройки: не растягивать форму на всю колонку ── */
.hp-page__content .hp-form--user-update { max-width: 620px; }

/* ── Мобилка ── */
@media (max-width: 760px) {
  /* меню кабинета — горизонтальная лента чипов */
  .hp-page__sidebar .hp-menu--user-account { padding: 8px; }
  .hp-page__sidebar .hp-menu--user-account ul {
    flex-direction: row; overflow-x: auto; gap: 6px;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .hp-page__sidebar .hp-menu--user-account ul::-webkit-scrollbar { display: none; }
  .hp-page__sidebar .hp-menu--user-account .hp-menu__item { flex: 0 0 auto; }
  .hp-page__sidebar .hp-menu--user-account .hp-menu__item > a { padding: 8px 14px; border-radius: 999px; background: #F5F6FA; }
  .hp-page__sidebar .hp-menu--user-account .hp-menu__item > a::before { display: none; }
  .hp-page__sidebar .hp-menu--user-account .hp-menu__item--current > a { background: var(--cw-blue); }
  .hp-page__sidebar .hp-menu__item--user-logout { border-top: 0; margin-top: 0 !important; padding-top: 0 !important; }

  /* таблицы-карточки: стекуем ячейки */
  .hp-page__content .hp-table,
  .hp-page__content .hp-table tbody { display: block; }
  .hp-page__content .hp-table tr {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px;
    border-radius: 12px; padding: 14px; margin-bottom: 10px;
  }
  .hp-page__content .hp-table td { display: block; padding: 0 !important; border-radius: 0 !important; }
  .hp-listing--edit-block .hp-listing__title { flex: 1 1 100%; margin-bottom: 2px; }
  .hp-listing--edit-block .hp-listing__actions--primary { margin-left: auto; }
  .hp-messages.hp-table .hp-message__sender { width: 100%; }
  .hp-messages.hp-table .hp-message__date { margin-left: auto; }

  /* тред: пузыри шире, отступ меню */
  .hp-message--view-block { max-width: 90%; }
}

/* ── Счётчик просмотров объявления ───────────────────────── */
.cw99-views {
  margin-top: 10px; color: var(--cw-grey); font-size: .88em;
  display: flex; align-items: center; gap: 6px;
}

/* ── Продвижение объявления (кабинет автора) ─────────────── */
.cw99-promote {
  margin-top: 14px; padding: 14px 16px; border-radius: var(--cw-radius);
  background: #fafafa;
}
.cw99-promote__title { font-weight: 600; margin-bottom: 10px; font-size: .95em; }
.cw99-promote__active {
  display: inline-block; margin-bottom: 10px; padding: 4px 10px;
  background: var(--cw-yellow); border-radius: 999px; font-weight: 600; font-size: .85em;
}
.cw99-promote__btn {
  display: block; width: 100%; margin-bottom: 8px; padding: 10px 14px;
  border: 2px solid var(--cw-blue); border-radius: 8px; background: #fff;
  color: var(--cw-blue); font-weight: 600; font-family: inherit; cursor: pointer;
  text-align: left; transition: background .2s, color .2s;
}
.cw99-promote__btn:hover { background: var(--cw-blue); color: #fff; }
.cw99-promote__soon { color: var(--cw-grey); font-size: .82em; margin-top: 4px; }

/* ── Согласие с правилами на форме подачи ────────────────── */
.cw99-consent {
  display: flex; align-items: flex-start; gap: 8px;
  margin: 4px 0 14px; font-size: .9em; color: #444; cursor: pointer; line-height: 1.4;
}
.cw99-consent input { margin-top: 3px; flex: 0 0 auto; }
.cw99-consent a { color: var(--cw-blue); }
.cw99-consent--error {
  color: var(--cw-error, #E4410D); outline: 1px solid #E4410D;
  border-radius: 6px; padding: 6px 8px; margin-left: -8px;
}

/* ══════════════════════════════════════════════════════════
   Читаемость описания объявления
   ══════════════════════════════════════════════════════════ */
/* Замеры на живой странице: font-size 16.8px при line-height 31.5px — это
   1.88, для основного текста слишком разреженно; цвет rgba(15,23,39,.65),
   то есть текст полупрозрачный серый на белом; ширина строки не ограничена
   вообще. Втроём это и давало «плохо читаемо»: глаз теряет строку на
   обратном ходе, а низкий контраст добивает. Приводим к нормальным для
   длинного текста величинам. */
.hp-listing--view-page .hp-listing__description,
.hp-listing--view-page .hp-listing__description p {
  color: #000; /* основной текст — чёрный, без альфы (свип цветов 2026-09-03) */
  line-height: 1.62;
}
.hp-listing--view-page .hp-listing__description {
  max-width: 68ch;          /* 65-75 символов — оптимум для чтения */
  font-size: 1rem;
}
.hp-listing--view-page .hp-listing__description p { margin: 0 0 14px; }
.hp-listing--view-page .hp-listing__description strong,
.hp-listing--view-page .hp-listing__description b { color: #000; }

/* ══════════════════════════════════════════════════════════
   Польская локаль: строки, зашитые в псевдоэлементы
   ══════════════════════════════════════════════════════════ */
/* style.css общий для шведской доски (cleanwhale.se/99, русскоязычная) и
   польской (99.cleanwhale.pl). Три подписи заданы через content: русским
   текстом и на польской доске выводились кириллицей — «Описание» над
   описанием объявления видно на каждой карточке. Правим по html[lang],
   не трогая шведскую версию. */
html[lang|="pl"] .hp-listing--view-page .hp-listing__description::before {
  content: 'Opis';
}
html[lang|="pl"] .hp-listing--view-block .hp-listing__featured-badge::after {
  content: 'Wyróżnione';
}
html[lang|="pl"] .hp-listing--view-page.hp-listing--featured h1.hp-listing__title::after {
  content: 'Wyróżnione';
}

/* ── Brand breakpoints: only the four ranges used by cleanwhale.se ── */
@media (min-width: 761px) and (max-width: 1025px) {
  :root { --cw-radius: .5vw; }
}

@media (min-width: 1026px) and (max-width: 1440px) {
  :root { --cw-radius: .3vw; }
}

@media (max-width: 760px) {
  :root { --cw-radius: 1vw; }
  .header-logo .cw99-logo-svg img { height: 6vw; }
}

@media (max-width: 760px) and (min-aspect-ratio: 7/10) {
  .header-hero--large { padding-top: 2rem; }
}

/* ══════════════════════════════════════════════════════════
   Product home — dynamic HivePress data + working Agent 99
   ══════════════════════════════════════════════════════════ */
.cw99-product-home { overflow: hidden; background: #fff; }
.cw99-product-home > .container,
.cw99-product-hero > .container {
  width: 90vw;
  max-width: none;
}

.cw99-product-hero {
  position: relative;
  overflow: hidden;
  background: var(--cw-blue);
  color: #fff;
  padding: 3.6vw 0 2vw;
}
.cw99-product-hero::before {
  content: "";
  position: absolute;
  top: -10vw;
  right: -3vw;
  width: 62vw;
  height: 52vw;
  background: url("https://cleanwhale.se/assets/frontend/images/icons/main-bg.svg") center / contain no-repeat;
  opacity: .14;
  pointer-events: none;
}
.cw99-product-hero::after {
  content: "99";
  position: absolute;
  right: -1.5vw;
  top: 2vw;
  color: rgba(255,255,255,.05);
  font-family: "futura-pt", sans-serif;
  font-size: 24vw;
  font-weight: 900;
  line-height: 1;
  pointer-events: none;
}
.cw99-product-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: 4vw;
  align-items: center;
}
.cw99-product-location {
  display: inline-flex;
  align-items: center;
  gap: .65vw;
  padding: .55vw 1vw;
  background: rgba(255,255,255,.1);
  border-radius: 10vw;
  font-weight: 500;
  font-size: 1vw;
}
.cw99-product-location i { color: var(--cw-yellow); }
.cw99-product-hero__copy h1 {
  display: flex;
  flex-direction: column;
  margin: 1.5vw 0 1.2vw;
  color: #fff;
  font-size: clamp(44px, 4.2vw, 76px);
  font-weight: 700;
  line-height: .98;
}
.cw99-product-hero__copy h1 strong { color: var(--cw-yellow); font-weight: 700; }
.cw99-product-hero__copy > p {
  width: 38vw;
  margin: 0 0 1.5vw;
  color: #fff;
  opacity: .82;
  font-size: 1.15vw;
  line-height: 1.55;
}
.cw99-product-search {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .8vw;
  width: 39vw;
  padding: .45vw .45vw .45vw 1.1vw;
  background: #fff;
  border-radius: 10vw;
  box-shadow: 0 0 2vw rgba(0,0,0,.14);
}
.cw99-product-search i { color: var(--cw-blue); }
.cw99-product-search input {
  min-width: 0;
  padding: .75vw 0;
  border: 0;
  background: transparent;
  color: #000;
  font: inherit;
}
.cw99-product-search input:focus { outline: 0; }
.cw99-product-search button {
  padding: .8vw 1.35vw;
  border: 0 !important;
  border-radius: 10vw;
  background: var(--cw-yellow) !important;
  color: #000 !important;
  font-weight: 700;
}
.cw99-product-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .7vw;
  margin: 1.1vw 0 1.4vw;
}
.cw99-product-actions a {
  display: inline-flex;
  align-items: center;
  gap: .55vw;
  padding: .65vw .9vw;
  border-radius: 10vw;
  background: rgba(255,255,255,.1);
  color: #fff;
  font-size: .9vw;
  font-weight: 600;
  text-decoration: none;
}
.cw99-product-actions a:hover { background: #fff; color: var(--cw-blue); }
.cw99-product-actions i { color: var(--cw-yellow); }

.cw99-product-mini-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7vw;
  width: 42vw;
}
.cw99-product-mini-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-width: 0;
  border-radius: var(--cw-radius);
  background: #fff;
  color: #000;
  box-shadow: 0 0 1vw rgba(0,0,0,.1);
  text-decoration: none;
}
.cw99-product-mini-card img,
.cw99-product-mini-card__fallback {
  display: flex;
  width: 100%;
  height: 5.5vw;
  align-items: center;
  justify-content: center;
  object-fit: cover;
  background: #fafafa;
  color: var(--cw-blue);
}
.cw99-product-mini-card > span:last-child {
  overflow: hidden;
  padding: .55vw .65vw;
  font-size: .78vw;
  font-weight: 600;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cw99-product-totals {
  display: flex;
  gap: 2vw;
  margin-top: 1.3vw;
}
.cw99-product-totals span { display: flex; align-items: baseline; gap: .45vw; color: rgba(255,255,255,.72); }
.cw99-product-totals b {
  color: #fff;
  font-family: "futura-pt", sans-serif;
  font-size: 1.45vw;
  font-weight: 900;
}

.cw99-product-agent {
  position: relative;
  color: #000;
  background: #fff;
  border-radius: var(--cw-radius);
  box-shadow: 0 0 3vw rgba(0,0,0,.18);
  padding: 1.2vw;
  transform: rotate(.6deg);
}
.cw99-product-agent .cw99-agent-box .agent-shell {
  height: 31vw;
  min-height: 390px;
  border-radius: var(--cw-radius);
  box-shadow: none;
  background: #fafafa;
}
.cw99-product-agent .cw99-agent-box .agent-topbar { border-radius: var(--cw-radius) var(--cw-radius) 0 0; }
.cw99-product-agent .cw99-agent-box .agent-chat { background: #fafafa; }
.cw99-product-agent .cw99-agent-box .agent-inputbar { background: #fff; }

.cw99-product-trust {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 2.2vw;
  padding: 1.1vw 1.5vw;
  border-radius: var(--cw-radius);
  background: #fff;
  color: #000;
  box-shadow: 0 0 1.5vw rgba(0,0,0,.12);
}
.cw99-product-trust span { display: flex; align-items: center; justify-content: center; gap: .7vw; font-weight: 600; }
.cw99-product-trust span + span { box-shadow: -.04vw 0 0 rgba(0,0,0,.12); }
.cw99-product-trust i { color: var(--cw-blue); font-size: 1.3vw; }

.cw99-product-body {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(260px, .75fr);
  gap: 3vw;
  padding-top: 4vw;
  padding-bottom: 3vw;
}
.cw99-product-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2vw;
  margin-bottom: 1.2vw;
}
.cw99-product-section-head--listings { margin-top: 3vw; }
.cw99-product-section-head h2 { margin: 0; font-size: 2vw; }
.cw99-product-section-head a { font-weight: 600; text-decoration: none; }
.cw99-product-categories {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1vw;
}
.cw99-product-categories a {
  display: grid;
  grid-template-columns: 4vw minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 1vw;
  align-items: center;
  min-height: 8vw;
  padding: 1.2vw;
  border-radius: var(--cw-radius);
  background: var(--cw-blue);
  color: #fff;
  box-shadow: 0 0 1vw rgba(0,0,0,.08);
  text-decoration: none;
}
.cw99-product-categories a:hover { background: var(--cw-blue-dark); transform: translateY(-.12vw); }
.cw99-product-categories i {
  grid-row: 1 / 3;
  display: inline-flex;
  width: 4vw;
  height: 4vw;
  align-items: center;
  justify-content: center;
  border-radius: var(--cw-radius);
  background: #fff;
  color: var(--cw-blue);
  font-size: 1.8vw;
}
.cw99-product-categories strong { align-self: end; font-size: 1.05vw; }
.cw99-product-categories span { align-self: start; color: #fff; opacity: .7; font-size: .78vw; }

.cw99-product-listings {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1vw;
}
.cw99-product-listing {
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--cw-radius);
  background: #fafafa;
  color: #000;
  box-shadow: 0 0 1vw rgba(0,0,0,.07);
  text-decoration: none;
}
.cw99-product-listing__image {
  display: flex;
  height: 10vw;
  align-items: center;
  justify-content: center;
  background: #eef2fc;
  color: var(--cw-blue);
  font-size: 2vw;
}
.cw99-product-listing__image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cw99-product-listing__body { display: flex; flex-direction: column; gap: .6vw; padding: .9vw; }
.cw99-product-listing__body strong { overflow: hidden; font-size: .95vw; line-height: 1.3; }
.cw99-product-listing__body b { color: var(--cw-blue); font-size: 1vw; }
.cw99-product-empty {
  grid-column: 1 / -1;
  padding: 3vw;
  border-radius: var(--cw-radius);
  background: #fafafa;
  text-align: center;
}
.cw99-product-empty a { display: inline-flex; padding: .8vw 1.2vw; border-radius: 10vw; background: var(--cw-yellow); color: #000; font-weight: 700; }

.cw99-product-side { display: flex; flex-direction: column; gap: 1.4vw; }
.cw99-product-why,
.cw99-product-add {
  padding: 1.6vw;
  border-radius: var(--cw-radius);
  background: #fafafa;
  box-shadow: 0 0 1vw rgba(0,0,0,.06);
}
.cw99-product-why h2,
.cw99-product-add h2 { margin: 0 0 1.2vw; font-size: 1.35vw; }
.cw99-product-why > div {
  display: grid;
  grid-template-columns: 2vw minmax(0, 1fr);
  gap: .8vw;
  margin-bottom: 1.15vw;
}
.cw99-product-why i { color: var(--cw-blue); }
.cw99-product-why p { margin: 0; color: #000; opacity: .7; font-size: .85vw; line-height: 1.4; }
.cw99-product-why strong { display: block; margin-bottom: .2vw; color: #000; opacity: 1; }
.cw99-product-why > a { font-weight: 700; text-decoration: none; }
.cw99-product-add { position: relative; overflow: hidden; background: #ffea84; }
.cw99-product-add > i { position: absolute; right: 1.3vw; top: 1.1vw; color: var(--cw-blue); font-size: 3vw; transform: rotate(-12deg); }
.cw99-product-add a { display: inline-flex; padding: .8vw 1.2vw; border-radius: 10vw; background: var(--cw-blue); color: #fff; font-weight: 700; text-decoration: none; }

.cw99-product-newsletter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2vw;
  margin-bottom: 4vw;
  padding: 1.3vw 1.6vw;
  border-radius: var(--cw-radius);
  background: #eef2fc;
}
.cw99-product-newsletter > div { display: flex; align-items: center; gap: 1vw; }
.cw99-product-newsletter > div > i { color: var(--cw-blue); font-size: 2vw; }
.cw99-product-newsletter p { margin: 0; color: #000; opacity: .7; }
.cw99-product-newsletter p strong { display: block; color: #000; opacity: 1; }
.cw99-product-newsletter form {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: .6vw;
  width: 35vw;
}
.cw99-product-newsletter input {
  min-width: 0;
  padding: .8vw 1vw;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 10vw;
  background: #fff;
}
.cw99-product-newsletter button {
  padding: .8vw 1.2vw;
  border: 0 !important;
  border-radius: 10vw;
  background: var(--cw-blue) !important;
  color: #fff !important;
}
.cw99-product-newsletter__consent {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: .55vw;
  font-size: .72vw;
}
.cw99-product-newsletter__consent input { width: auto; margin: 0; }
.cw99-product-newsletter__consent a { color: #000; opacity: .65; }
.cw99-product-newsletter__sent { color: var(--cw-blue) !important; font-weight: 700; opacity: 1 !important; }

@media (min-width: 761px) and (max-width: 1025px) {
  .cw99-product-hero__grid { grid-template-columns: .85fr 1.15fr; gap: 3vw; }
  .cw99-product-hero__copy h1 { font-size: 5.2vw; }
  .cw99-product-hero__copy > p { width: 40vw; font-size: 1.5vw; }
  .cw99-product-search { width: 41vw; }
  .cw99-product-agent .cw99-agent-box .agent-shell { height: 45vw; min-height: 0; }
  .cw99-product-mini-list { width: 42vw; }
  .cw99-product-categories { grid-template-columns: repeat(2, 1fr); }
  .cw99-product-listings { grid-template-columns: repeat(3, 1fr); }
  .cw99-product-why p, .cw99-product-actions a { font-size: 1.25vw; }
}

@media (max-width: 760px) {
  .cw99-product-home > .container,
  .cw99-product-hero > .container { width: 90vw; }
  .cw99-product-hero { padding: 9vw 0 6vw; }
  .cw99-product-hero__grid { grid-template-columns: 1fr; gap: 8vw; }
  .cw99-product-location { gap: 2vw; padding: 2vw 4vw; font-size: 3.5vw; }
  .cw99-product-hero__copy h1 { margin: 5vw 0 4vw; font-size: 12vw; }
  .cw99-product-hero__copy > p { width: 90vw; margin-bottom: 5vw; font-size: 4.2vw; }
  .cw99-product-search {
    width: 90vw;
    gap: 2vw;
    padding: 1.5vw 1.5vw 1.5vw 4vw;
  }
  .cw99-product-search input { padding: 3vw 0; font-size: 4vw; }
  .cw99-product-search button { padding: 3vw 4vw; }
  .cw99-product-actions { gap: 2vw; margin: 3vw 0 5vw; }
  .cw99-product-actions a { gap: 2vw; padding: 2.5vw 3.2vw; font-size: 3.4vw; }
  .cw99-product-mini-list { grid-template-columns: repeat(2, 1fr); gap: 2vw; width: 90vw; }
  .cw99-product-mini-card img, .cw99-product-mini-card__fallback { height: 28vw; }
  .cw99-product-mini-card > span:last-child { padding: 2.5vw; font-size: 3.4vw; }
  .cw99-product-totals { gap: 8vw; margin-top: 5vw; }
  .cw99-product-totals b { font-size: 5vw; }
  .cw99-product-agent { padding: 3vw; transform: none; }
  .cw99-product-agent .cw99-agent-box .agent-shell { height: 136vw; min-height: 500px; }
  .cw99-product-trust { grid-template-columns: 1fr; gap: 3vw; margin-top: 6vw; padding: 4vw; }
  .cw99-product-trust span { justify-content: flex-start; gap: 3vw; }
  .cw99-product-trust span + span { box-shadow: none; }
  .cw99-product-trust i { width: 7vw; font-size: 5vw; text-align: center; }
  .cw99-product-body { grid-template-columns: 1fr; gap: 8vw; padding-top: 10vw; }
  .cw99-product-section-head { margin-bottom: 4vw; }
  .cw99-product-section-head--listings { margin-top: 10vw; }
  .cw99-product-section-head h2 { font-size: 7vw; }
  .cw99-product-categories { grid-template-columns: repeat(2, 1fr); gap: 3vw; }
  .cw99-product-categories a {
    grid-template-columns: 12vw minmax(0, 1fr);
    column-gap: 3vw;
    min-height: 25vw;
    padding: 4vw;
  }
  .cw99-product-categories i { width: 12vw; height: 12vw; font-size: 6vw; }
  .cw99-product-categories strong { font-size: 3.8vw; }
  .cw99-product-categories span { font-size: 3vw; }
  .cw99-product-listings { grid-template-columns: repeat(2, 1fr); gap: 3vw; }
  .cw99-product-listing__image { height: 31vw; font-size: 7vw; }
  .cw99-product-listing__body { gap: 2vw; padding: 3vw; }
  .cw99-product-listing__body strong, .cw99-product-listing__body b { font-size: 3.5vw; }
  .cw99-product-why, .cw99-product-add { padding: 5vw; }
  .cw99-product-why h2, .cw99-product-add h2 { margin-bottom: 4vw; font-size: 6vw; }
  .cw99-product-why > div { grid-template-columns: 8vw 1fr; gap: 2vw; margin-bottom: 4vw; }
  .cw99-product-why p { font-size: 3.6vw; }
  .cw99-product-add > i { right: 4vw; top: 4vw; font-size: 10vw; }
  .cw99-product-add a { padding: 3vw 5vw; }
  .cw99-product-newsletter { align-items: flex-start; flex-direction: column; gap: 4vw; margin-bottom: 10vw; padding: 5vw; }
  .cw99-product-newsletter > div { gap: 4vw; }
  .cw99-product-newsletter > div > i { font-size: 8vw; }
  .cw99-product-newsletter form { grid-template-columns: 1fr; gap: 2vw; width: 80vw; }
  .cw99-product-newsletter input, .cw99-product-newsletter button { width: 100%; padding: 3vw 4vw; }
  .cw99-product-newsletter__consent { gap: 2vw; font-size: 3.2vw; }
  .cw99-product-newsletter__consent input { width: auto; padding: 0; }
}

@media (max-width: 760px) and (min-aspect-ratio: 7/10) {
  .cw99-product-agent .cw99-agent-box .agent-shell { height: 112vw; }
}