/* =========================================================================
ВайбКодер / Нейро Биржа — тёмная тема для UniSite CMS
-------------------------------------------------------------------------
КАК ПОДКЛЮЧИТЬ (логику движка НЕ трогает):
1. Скопируйте этот файл в:
resources/view/web/assets/css/vibe-theme.css
2. В config/assets.php в блоке 'web' → 'css' добавьте СТРОКУ
сразу ПОСЛЕ main.css:
'',
3. (для переключателя тем) скопируйте vibe-theme.js в assets/js/
и добавьте в блоке 'web' → 'js':
'',
Все правила действуют ТОЛЬКО когда на есть класс .vibe-dark
(его ставит/снимает vibe-theme.js). Без класса — ваш обычный светлый сайт.
========================================================================= */
/* Моношрифт вордмарка логотипа (подгружаются только глифы «нейробиржа») */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@700&text=%D0%9D%D0%B5%D0%B9%D1%80%D0%BE%D0%91%D0%B8%D1%80%D0%B6%D0%B0&display=swap');
:root{
--vc-bg: #0e1016; /* фон страницы */
--vc-surface: #161922; /* карточки, шапка, поля */
--vc-surface2: #1b1f2a; /* вложенные поверхности */
--vc-border: rgba(255,255,255,.09);
--vc-border-strong: rgba(255,255,255,.18);
--vc-text: #e7eaf0; /* основной текст */
--vc-text2: #c5cbd6; /* ссылки, вторичный текст */
--vc-muted: #97a0b0; /* приглушённый текст */
--vc-faint: #6b7484; /* самый тусклый текст */
--vc-accent: #8b7bf7; /* фирменный акцент */
--vc-accent-ink:#0e1016; /* текст на акценте */
--vc-green: #36b555; /* «Разместить» */
}
/* Анти-мерцание (FOUC): фон страницы задаётся по data-vibe на ЕЩЁ в
(boot-скрипт, см. config/assets.php) — до того, как тема применится к .
Убирает белую вспышку при переходах и кликах в тёмной теме. */
html[data-vibe="dark"], html[data-vibe="dark"] body{ background-color:#0e1016!important; }
html[data-vibe="light"], html[data-vibe="light"] body{ background-color:#f5f6fa!important; }
/* =========================================================================
ПРЕЛОАДЕР СТРАНИЦЫ — перекрывает перерисовку при переходах между страницами
-------------------------------------------------------------------------
На классическом серверном сайте каждый переход = полная перезагрузка: пока
грузятся стили, шрифты и разметка, страница «дёргается» (сдвиги контента,
подмена шрифта). Оверлей рисуется ПСЕВДОЭЛЕМЕНТАМИ на — он есть в DOM
раньше , поэтому появляется мгновенно, ещё до первой отрисовки, и
прячет всю перерисовку. Снимается классом .vibe-ready, который ставит инлайн
boot-скрипт из assets.php по готовности шрифтов / событию load, со страховкой
по таймауту — сайт никогда не «залипнет» под оверлеем, даже если JS отвалится.
Цвет подложки = фон темы, поэтому появление и уход оверлея бесшовны. */
html::before{
content:""; position:fixed; inset:0; z-index:2147483646;
background:#0e1016; opacity:1; transition:opacity .4s ease;
}
html::after{
content:""; position:fixed; top:50%; left:50%; margin:-23px 0 0 -23px;
width:46px; height:46px; border-radius:50%; z-index:2147483647;
border:3px solid rgba(255,255,255,.10); border-top-color:#8b7bf7;
animation:vibeSpin .7s linear infinite; opacity:1; transition:opacity .4s ease;
}
html[data-vibe="light"]::before{ background:#f5f6fa; }
html[data-vibe="light"]::after{ border-color:rgba(17,20,28,.12); border-top-color:#6d59d6; }
html.vibe-ready::before, html.vibe-ready::after{
opacity:0; visibility:hidden; pointer-events:none;
transition:opacity .4s ease, visibility 0s .4s;
}
@media (prefers-reduced-motion: reduce){
html::after{ animation:none; }
html::before, html::after{ transition:opacity .15s ease; }
}
/* ---------- База ---------- */
body.vibe-dark{ background-color:var(--vc-bg)!important; color:var(--vc-text); }
body.vibe-dark a{ color:var(--vc-text2); }
body.vibe-dark a:hover{ color:var(--vc-accent); }
body.vibe-dark hr{ background-color:var(--vc-border)!important; color:var(--vc-border)!important; }
body.vibe-dark label{ color:var(--vc-text2); }
body.vibe-dark *::-webkit-scrollbar{ background-color:var(--vc-surface); }
body.vibe-dark *::-webkit-scrollbar-thumb{ background:#3a4150; }
body.vibe-dark .bg-white{ background-color:var(--vc-surface)!important; color:var(--vc-text); }
body.vibe-dark .text-dark,
body.vibe-dark .text-black{ color:var(--vc-text)!important; }
/* ---------- Шапка: верхняя полоса ---------- */
body.vibe-dark .header-wow-top,
body.vibe-dark .header-wow-top-bg-color{ background-color:var(--vc-surface)!important; border-bottom:1px solid var(--vc-border); }
body.vibe-dark .header-wow-top-list-item{ color:var(--vc-text2)!important; }
body.vibe-dark .header-wow-top-list-item:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .header-wow-top-list-icon-item{ color:var(--vc-text2)!important; }
body.vibe-dark .header-wow-top-list-icon-item:hover{ color:var(--vc-accent)!important; }
/* ---------- Шапка: основная (sticky) ---------- */
body.vibe-dark .header-wow-sticky,
body.vibe-dark .header-wow-sticky-container{ background-color:var(--vc-bg)!important; }
body.vibe-dark .header-wow-sticky{ border-bottom:1px solid var(--vc-border); }
body.vibe-dark .header-button-menu-catalog{ color:var(--vc-text)!important; }
body.vibe-dark .header-button-menu-catalog-icon-1 i{ color:var(--vc-accent)!important; }
/* ---------- Логотип «Терминал» (инлайн, сам подстраивается под тему) ---------- */
.h-logo .vibe-logo,
.h-logo-mobile .vibe-logo{ display:inline-flex; align-items:center; gap:11px; text-decoration:none; }
.vibe-logo-mark{ display:block; height:38px; width:38px; flex:none; }
.vibe-logo--mini .vibe-logo-mark{ height:32px; width:32px; }
.vibe-logo-word{ font-family:'JetBrains Mono',ui-monospace,'SFMono-Regular',monospace; font-weight:700; font-size:22px; letter-spacing:-.01em; line-height:1; color:#151820; white-space:nowrap; }
.vibe-logo--mini .vibe-logo-word{ font-size:19px; }
.vibe-logo-word .vibe-logo-x{ font-style:normal; color:#6d59d6; }
body.vibe-dark .vibe-logo-word{ color:#f2f4f8; }
body.vibe-dark .vibe-logo-word .vibe-logo-x{ color:#8b7bf7; }
/* ---------- Живой поиск ---------- */
body.vibe-dark .live-search-form{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .live-search-form-input{ background:transparent!important; color:var(--vc-text)!important; }
body.vibe-dark .live-search-form-input,
body.vibe-dark .live-search-form-input:focus{ border-color:transparent!important; }
body.vibe-dark .live-search-form:focus-within{ border-color:color-mix(in srgb,var(--vc-accent) 55%,transparent)!important; }
body.vibe-dark .live-search-form-input::placeholder{ color:var(--vc-faint)!important; }
body.vibe-dark .live-search-form-icon{ background:transparent!important; color:var(--vc-faint)!important; }
body.vibe-dark .live-search-container-geo-name{ color:var(--vc-text2)!important; }
body.vibe-dark .live-search-results{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
/* ---------- Кнопки (цветовые схемы движка) ---------- */
body.vibe-dark .button-color-scheme1{ background-color:var(--vc-accent)!important; color:var(--vc-accent-ink)!important; }
body.vibe-dark .button-color-scheme1-light{ background-color:var(--vc-surface2)!important; color:var(--vc-text)!important; }
body.vibe-dark .button-color-scheme2{ background-color:var(--vc-surface2)!important; color:var(--vc-text)!important; }
body.vibe-dark .button-color-scheme3{ background-color:#e7eaf0!important; color:#0e1016!important; }
body.vibe-dark .button-color-scheme4{ background-color:transparent!important; color:var(--vc-text)!important; }
body.vibe-dark .button-color-scheme7{ background-color:var(--vc-accent)!important; color:#fff!important; }
/* scheme5 (зелёная «Разместить») и scheme6 (красная) оставляем как есть */
/* ---------- Поля форм ---------- */
body.vibe-dark .form-control{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text)!important; }
body.vibe-dark .form-control::placeholder{ color:var(--vc-faint)!important; }
body.vibe-dark .form-control:focus{ border-color:var(--vc-accent)!important; }
/* ---------- Заголовки блоков главной ---------- */
body.vibe-dark h1,
body.vibe-dark .bold-title-and-link span,
body.vibe-dark .title-h6,
body.vibe-dark .home-seo-text{ color:var(--vc-text)!important; }
/* ---------- Виджет категорий (карточки на главной) ---------- */
/* тянем карточки на всю ширину ряда (работает при любом числе категорий) */
body.vibe-dark .widget-categories-or-subcategories .row > [class*="col-"]{
flex:1 1 240px!important; max-width:none!important;
}
body.vibe-dark .widget-categories-or-subcategories a{
--cat:#8b7bf7; /* акцент карточки (переопределяется ниже) */
position:relative; overflow:hidden;
min-height:118px;
display:flex!important; flex-direction:column; justify-content:center;
padding:20px 22px!important;
border-radius:20px!important;
background:
linear-gradient(150deg, color-mix(in srgb, var(--cat) 12%, #171a24), #14161d)!important;
border:1px solid var(--vc-border)!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
/* верхняя акцентная линия-блик */
body.vibe-dark .widget-categories-or-subcategories a::before{
content:""; position:absolute; left:20px; right:20px; top:0; height:2px;
background:linear-gradient(90deg, var(--cat), transparent 70%);
opacity:.7; pointer-events:none;
}
/* круглый ореол под иконкой */
body.vibe-dark .widget-categories-or-subcategories a::after{
content:""; position:absolute; right:-24px; top:50%; transform:translateY(-50%);
width:150px; height:150px; border-radius:50%;
background:radial-gradient(circle, color-mix(in srgb, var(--cat) 34%, transparent), transparent 68%);
pointer-events:none;
}
/* название */
body.vibe-dark .widget-categories-or-subcategories a div{
position:relative; z-index:2;
color:var(--vc-text)!important;
font-size:17px; font-weight:700; line-height:1.25;
max-width:calc(100% - 92px);
overflow-wrap:normal; word-break:keep-all;
}
/* счётчик — пилюля в цвете категории */
body.vibe-dark .widget-categories-or-subcategories-counter{
display:inline-block; margin-top:8px;
padding:2px 10px; border-radius:100px;
font-size:12px!important; font-weight:700;
color:var(--cat)!important;
background:color-mix(in srgb, var(--cat) 16%, transparent);
border:1px solid color-mix(in srgb, var(--cat) 30%, transparent);
}
/* иконка категории — справа по центру */
body.vibe-dark .widget-categories-or-subcategories a img{
height:80px!important; right:16px!important; bottom:auto!important;
top:50%!important; transform:translateY(-50%);
filter:drop-shadow(0 10px 18px rgba(0,0,0,.5));
transition:transform .18s ease;
}
/* стрелка, появляется на ховере */
.widget-categories-or-subcategories a .vc-cat-arrow{ display:none; }
/* ховер: подъём + акцентная рамка + свечение */
body.vibe-dark .widget-categories-or-subcategories a:hover{
border-color:color-mix(in srgb, var(--cat) 65%, transparent)!important;
transform:translateY(-4px);
box-shadow:0 16px 34px -18px color-mix(in srgb, var(--cat) 80%, #000),
inset 0 1px 0 rgba(255,255,255,.06);
}
body.vibe-dark .widget-categories-or-subcategories a:hover img{ transform:translateY(-50%) scale(1.06); }
body.vibe-dark .widget-categories-or-subcategories a:hover div{ color:var(--vc-text)!important; }
/* акценты по позиции: 1-заказы, 2-программы, 3-услуги */
body.vibe-dark .widget-categories-or-subcategories .row > [class*="col-"]:nth-child(1) a{ --cat:#8b7bf7; }
body.vibe-dark .widget-categories-or-subcategories .row > [class*="col-"]:nth-child(2) a{ --cat:#62e29a; }
body.vibe-dark .widget-categories-or-subcategories .row > [class*="col-"]:nth-child(3) a{ --cat:#f4c26b; }
body.vibe-dark .widget-ads-categories-container a{
background-color:var(--vc-surface)!important;
border:1px solid var(--vc-border)!important; color:var(--vc-text)!important; border-radius:14px;
}
body.vibe-dark .widget-ads-categories-container a:hover{ border-color:var(--vc-accent)!important; }
/* ---------- Виджет категорий на ГЛАВНОЙ (.home-widget-categories-item) ---------- */
/* секция-контейнер → флекс на всю ширину (работает при любом числе категорий) */
body.vibe-dark .widget-categories-container{
display:flex!important; flex-wrap:wrap; gap:14px;
}
body.vibe-dark .home-widget-categories-item{
--cat:#8b7bf7;
flex:1 1 240px!important; min-width:0!important; max-width:none!important;
height:auto!important; min-height:116px;
margin:0!important;
display:flex!important; flex-direction:column; justify-content:center;
padding:20px 22px!important;
border-radius:20px!important;
background:linear-gradient(150deg, color-mix(in srgb, var(--cat) 12%, #171a24), #14161d)!important;
border:1px solid var(--vc-border)!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
overflow:hidden; position:relative;
transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
body.vibe-dark .home-widget-categories-item::before{
content:""; position:absolute; left:20px; right:20px; top:0; height:2px;
background:linear-gradient(90deg, var(--cat), transparent 70%); opacity:.7; pointer-events:none;
}
body.vibe-dark .home-widget-categories-item::after{
content:""; position:absolute; right:-24px; top:50%; transform:translateY(-50%);
width:150px; height:150px; border-radius:50%;
background:radial-gradient(circle, color-mix(in srgb, var(--cat) 34%, transparent), transparent 68%);
pointer-events:none;
}
body.vibe-dark .home-widget-categories-item div{
position:relative; z-index:2;
color:var(--vc-text)!important;
font-size:17px; font-weight:700; line-height:1.25;
max-width:calc(100% - 84px);
}
body.vibe-dark .home-widget-categories-item img{
height:76px!important; right:14px!important; bottom:auto!important;
top:50%!important; transform:translateY(-50%);
filter:drop-shadow(0 10px 18px rgba(0,0,0,.5));
transition:transform .18s ease;
}
/* ховер: гасим синий из main.css, даём подъём + акцент */
body.vibe-dark .home-widget-categories-item:hover{
background:linear-gradient(150deg, color-mix(in srgb, var(--cat) 20%, #191c27), #16181f)!important;
border-color:color-mix(in srgb, var(--cat) 65%, transparent)!important;
transform:translateY(-4px);
box-shadow:0 16px 34px -18px color-mix(in srgb, var(--cat) 80%, #000), inset 0 1px 0 rgba(255,255,255,.06);
}
body.vibe-dark .home-widget-categories-item:hover > div,
body.vibe-dark .home-widget-categories-item:hover div{ color:var(--vc-text)!important; }
body.vibe-dark .home-widget-categories-item:hover img{ transform:translateY(-50%) scale(1.06); }
/* акценты по позиции: 1-заказы(фиолет), 2-программы(зелёный), 3-услуги(золото) */
body.vibe-dark .widget-categories-container .home-widget-categories-item:nth-of-type(1){ --cat:#8b7bf7; }
body.vibe-dark .widget-categories-container .home-widget-categories-item:nth-of-type(2){ --cat:#62e29a; }
body.vibe-dark .widget-categories-container .home-widget-categories-item:nth-of-type(3){ --cat:#f4c26b; }
/* ---------- Карточка объявления ---------- */
body.vibe-dark .container-item-grid{
color:var(--vc-text)!important;
background-color:var(--vc-surface)!important;
border:1px solid var(--vc-border);
border-radius:16px;
padding:8px;
}
body.vibe-dark .container-item-grid:hover{ border-color:var(--vc-border-strong); }
body.vibe-dark .container-item-grid-highlight{ border-color:var(--vc-accent)!important; }
body.vibe-dark .container-item-images{ background-color:var(--vc-surface2)!important; border-radius:12px; overflow:hidden; }
body.vibe-dark .container-item-grid-content-title{ color:var(--vc-text)!important; }
body.vibe-dark .container-item-grid-content-title:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .container-item-grid-highlight .container-item-grid-content-title{ background-color:rgba(139,123,247,.16)!important; }
body.vibe-dark .container-item-grid-content-prices .card-item-price-now{ color:var(--vc-accent)!important; }
body.vibe-dark .container-item-grid-content-prices .card-item-price-measure-title{ color:var(--vc-muted)!important; }
body.vibe-dark .container-item-grid-content-additionally,
body.vibe-dark .container-item-grid-content-additionally span{ color:var(--vc-muted)!important; }
/* Рейтинг в карточке: ровный ряд, аккуратный бейдж-пилюля, читаемый счётчик отзывов */
.container-item-grid-content-rating{ display:flex!important; align-items:center; gap:8px; margin-top:8px; line-height:1.4; }
.container-item-grid-content-rating .color-rating-green span,
.container-item-grid-content-rating .color-rating-yellow span,
.container-item-grid-content-rating .color-rating-gray span{ display:inline-block!important; padding:2px 8px!important; border-radius:7px!important; font-weight:700; font-size:12px; }
body.vibe-dark .container-item-grid-content-rating .color-rating-green span{ background:rgba(98,226,154,.16)!important; color:#62e29a!important; }
body.vibe-dark .container-item-grid-content-rating .color-rating-yellow span{ background:rgba(247,153,0,.16)!important; color:#f0a23a!important; }
body.vibe-dark .container-item-grid-content-rating .text-muted{ color:var(--vc-muted)!important; font-size:13px; }
/* Выравнивание карточек в ряду: равная высота, заголовок резервирует 2 строки, блок локации/продавца прижат к низу */
.row > .col:has(> .container-item-grid){ display:flex; }
.container-item-grid{ width:100%; display:flex; flex-direction:column; }
.container-item-grid-content{ display:flex; flex-direction:column; flex:1 1 auto; }
.container-item-grid-content-title.trim-title{ line-height:1.35; min-height:2.7em; }
.container-item-grid-content-additionally{ margin-top:auto!important; }
/* ---------- Большое меню каталога ---------- */
body.vibe-dark .big-catalog-menu-container,
body.vibe-dark .big-catalog-menu-content,
body.vibe-dark .big-catalog-menu-mobile-content,
body.vibe-dark .header-menu-filters-mobile-content{
background-color:var(--vc-surface)!important;
border:1px solid var(--vc-border)!important;
color:var(--vc-text);
}
/* ---------- Мобильная шапка ---------- */
body.vibe-dark .header-wow-mobile .header-wow-top,
body.vibe-dark .header-wow-mobile .header-wow-sticky,
body.vibe-dark .header-wow-mobile .header-wow-sticky-container{ background-color:var(--vc-bg)!important; }
body.vibe-dark .header-flex-box-icon{ color:var(--vc-text)!important; }
/* ---------- Модалки ---------- */
body.vibe-dark .modal-content{ background-color:var(--vc-surface)!important; color:var(--vc-text); }
body.vibe-dark .modal-header,
body.vibe-dark .modal-footer{ border-color:var(--vc-border)!important; }
body.vibe-dark .modal-body{ color:var(--vc-text); }
/* ---------- Футер ---------- */
body.vibe-dark .footer-bg{ background-color:var(--vc-surface)!important; color:var(--vc-text); }
body.vibe-dark .footer-bg-box-link-inline{ background-color:var(--vc-surface2)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .footer-bg-box-link-inline-item{ color:var(--vc-text2)!important; }
body.vibe-dark .footer-bg-box-link-inline-item:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .footer-content-text,
body.vibe-dark .footer-content-text *{ color:var(--vc-muted)!important; }
body.vibe-dark .footer-content-link-inline a{ color:var(--vc-text2)!important; }
body.vibe-dark .footer-content-link-inline a:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .footer-social-links a{ color:var(--vc-text2)!important; }
body.vibe-dark .section-promo-download-app .title-h2,
body.vibe-dark .section-promo-download-app p{ color:var(--vc-text)!important; }
body.vibe-dark .footer-cookie-container{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
/* ---------- Статус-баннеры .card-status-info (success / error / moderation) ----------
В светлой теме — бледная заливка + тёмный текст. В тёмной без правки текст
наследует светлый цвет и пропадает на светлом фоне (например «Подключите
услуги…»). Красим фон в полупрозрачный тон, текст делаем светлым; кнопки
внутри сохраняют свою цветовую схему. */
body.vibe-dark .card-status-info{ color:var(--vc-text)!important; border:1px solid var(--vc-border); }
body.vibe-dark .card-status-info strong,
body.vibe-dark .card-status-info p,
body.vibe-dark .card-status-info span,
body.vibe-dark .card-status-info h1,
body.vibe-dark .card-status-info h2,
body.vibe-dark .card-status-info h3,
body.vibe-dark .card-status-info h4,
body.vibe-dark .card-status-info h5,
body.vibe-dark .card-status-info li{ color:var(--vc-text)!important; }
body.vibe-dark .card-status-info-bg-gray{ background-color:var(--vc-surface2)!important; }
body.vibe-dark .card-status-info-bg-success{ background-color:color-mix(in srgb,var(--vc-green) 16%,var(--vc-surface))!important; border-color:color-mix(in srgb,var(--vc-green) 34%,transparent)!important; }
body.vibe-dark .card-status-info-bg-moderation{ background-color:color-mix(in srgb,#f0be3c 16%,var(--vc-surface))!important; border-color:color-mix(in srgb,#f0be3c 34%,transparent)!important; }
body.vibe-dark .card-status-info-bg-error{ background-color:color-mix(in srgb,#ef4444 15%,var(--vc-surface))!important; border-color:color-mix(in srgb,#ef4444 32%,transparent)!important; }
/* ---------- Переключатель темы (кнопка в шапке) ---------- */
/* Сайт по умолчанию тёмный → показываем «солнце» СРАЗУ (иначе на сервере до
применения класса .vibe-* мелькает «луна»). Тему знает ,
выставленный boot-скриптом в ещё ДО первой отрисовки — поэтому
иконка корректна в любой теме без вспышки. */
.vibe-theme-toggle{ cursor:pointer; }
.vibe-theme-toggle .vibe-theme-toggle-light{ display:none; }
.vibe-theme-toggle .vibe-theme-toggle-dark{ display:inline; }
html[data-vibe="light"] .vibe-theme-toggle .vibe-theme-toggle-light,
body.vibe-light .vibe-theme-toggle .vibe-theme-toggle-light{ display:inline; }
html[data-vibe="light"] .vibe-theme-toggle .vibe-theme-toggle-dark,
body.vibe-light .vibe-theme-toggle .vibe-theme-toggle-dark{ display:none; }
/* иконка-тумблер в правой панели: аккуратная пилюля с акцентом */
body.vibe-dark .header-wow-top-list-icon-item.vibe-theme-toggle{ color:var(--vc-accent)!important; }
body.vibe-dark .header-wow-top-list-icon-item.vibe-theme-toggle:hover{ color:var(--vc-accent)!important; opacity:.8; }
/* ---------- Шапка: геометрия и ритм верха ---------- */
/* верхняя полоса — компактнее, иконки спокойнее и ровным рядом */
.header-wow-desktop .header-wow-top{ height:52px; }
.header-wow-desktop .header-wow-top-list-icon{ gap:20px; }
.header-wow-desktop .header-wow-top-list-icon-item{ margin-right:0!important; display:inline-flex; align-items:center; }
.header-wow-desktop .header-wow-top-list-icon-item i{ font-size:21px; }
/* основная полоса: логотип прижат влево, «Каталог» рядом, единый вертикальный ритм */
.header-wow-desktop .header-wow-sticky-container{ padding-top:15px; padding-bottom:15px; }
.header-wow-desktop .header-wow-sticky .row{ align-items:center; flex-wrap:nowrap; }
.header-wow-desktop .header-wow-sticky .col-2{ width:auto!important; flex:0 0 auto!important; max-width:none!important; padding-right:28px; }
.header-wow-desktop .header-wow-sticky .col-10{ width:auto!important; flex:1 1 auto!important; max-width:none!important; }
.header-wow-desktop .header-flex-box{ gap:14px; align-items:center; }
.header-wow-desktop .header-flex-box-2{ margin-left:0!important; }
.header-wow-desktop .header-flex-box-3{ margin-left:0!important; gap:10px; align-items:center; }
.header-wow-desktop .header-flex-box-3 .toolbar-link.mr10{ margin-right:0!important; }
/* единая высота управляющих элементов основной полосы */
.header-wow-desktop .header-button-menu-catalog{ height:48px; border-radius:14px; }
.header-wow-desktop .live-search-form-input{ height:48px; border-radius:14px; padding-right:132px; }
/* гео-переключатель внутри поиска — не наезжает на плейсхолдер */
.header-wow-desktop .live-search-container-geo{ top:6px; bottom:6px; right:6px; padding-left:14px; border-left:1px solid rgba(120,120,130,.28); }
.header-wow-desktop .header-wow-sticky-add,
.header-wow-desktop .header-wow-sticky-auth{ height:48px; display:inline-flex; align-items:center; border-radius:14px; }
/* аккуратный переход шапка → контент */
.container.mt15:has(.home-widget-sections){ margin-top:0!important; }
.home-widget-sections{ margin-top:26px!important; }
.home-widget-sections section:not(:last-child){ margin-bottom:34px; }
/* ---------- Кнопка «Каталог» (вариант C: иконка-плитка + стрелка) ---------- */
.header-wow-desktop .header-button-menu-catalog{ padding-left:6px; padding-right:14px; gap:9px; transition:transform .15s ease; }
.header-wow-desktop .header-button-menu-catalog-icon-1{
width:36px; height:36px; border-radius:10px;
background:rgba(14,16,22,.18);
display:inline-flex; align-items:center; justify-content:center; flex:none;
}
.header-wow-desktop .header-button-menu-catalog-icon-1 i{ color:var(--vc-accent-ink)!important; font-size:20px; }
.header-wow-desktop .header-button-menu-catalog-chev{ font-size:16px; opacity:.85; margin-left:2px; transition:transform .15s ease; }
.header-wow-desktop .header-button-menu-catalog:hover{ transform:translateY(-1px); }
.header-wow-desktop .header-button-menu-catalog:hover .header-button-menu-catalog-chev{ transform:translateY(1px); }
/* когда меню открыто — стрелка вверх */
.header-wow-desktop .header-button-menu-catalog.active .header-button-menu-catalog-chev{ transform:rotate(180deg); }
/* =========================================================================
СВЕТЛАЯ ТЕМА — тот же дизайн, светлая палитра (body.vibe-light)
========================================================================= */
body.vibe-light{
--vc-bg:#f5f6fa; --vc-surface:#ffffff; --vc-surface2:#eef0f6;
--vc-border:rgba(17,20,28,.10); --vc-border-strong:rgba(17,20,28,.20);
--vc-text:#161a22; --vc-text2:#3a4150; --vc-muted:#6b7280; --vc-faint:#9aa1ad;
--vc-accent:#6d59d6; --vc-accent-ink:#ffffff; --vc-green:#2fae6a;
background-color:var(--vc-bg); color:var(--vc-text);
}
body.vibe-light a{ color:var(--vc-text2); }
body.vibe-light a:hover{ color:var(--vc-accent); }
/* шапка */
body.vibe-light .header-wow{ background:var(--vc-surface); }
body.vibe-light .header-wow-top,
body.vibe-light .header-wow-top-bg-color{ background:var(--vc-surface)!important; border-bottom:1px solid var(--vc-border); }
body.vibe-light .header-wow-top-list-item,
body.vibe-light .header-wow-top-list-icon-item{ color:var(--vc-text2)!important; }
body.vibe-light .header-wow-top-list-item:hover,
body.vibe-light .header-wow-top-list-icon-item:hover{ color:var(--vc-accent)!important; }
body.vibe-light .header-wow-top-list-icon-item.vibe-theme-toggle{ color:var(--vc-accent)!important; }
body.vibe-light .header-wow-sticky,
body.vibe-light .header-wow-sticky-container{ background:var(--vc-surface)!important; }
body.vibe-light .header-wow-sticky{ border-bottom:1px solid var(--vc-border); }
/* кнопка «Каталог» (вариант C) — фиолетовая и в светлой */
body.vibe-light .header-button-menu-catalog.button-color-scheme1{ background:var(--vc-accent)!important; color:#fff!important; }
/* ---------- Кнопки (цветовые схемы движка) — светлая ---------- */
body.vibe-light .button-color-scheme1{ background-color:var(--vc-accent)!important; color:var(--vc-accent-ink)!important; }
body.vibe-light .button-color-scheme1-light{ background-color:var(--vc-surface2)!important; color:var(--vc-text)!important; }
body.vibe-light .button-color-scheme2{ background-color:var(--vc-surface)!important; color:var(--vc-text)!important; border:1px solid var(--vc-border-strong)!important; }
body.vibe-light .button-color-scheme2:hover{ border-color:var(--vc-accent)!important; color:var(--vc-accent)!important; }
body.vibe-light .button-color-scheme3{ background-color:var(--vc-surface2)!important; color:var(--vc-text)!important; border:1px solid var(--vc-border)!important; }
body.vibe-light .button-color-scheme3:hover{ background-color:#e6e9f2!important; }
body.vibe-light .button-color-scheme4{ background-color:transparent!important; color:var(--vc-text)!important; }
body.vibe-light .button-color-scheme7{ background-color:var(--vc-accent)!important; color:#fff!important; }
/* scheme5 (зелёная «Разместить») и scheme6 (красная) оставляем как есть */
/* поиск */
body.vibe-light .live-search-form{ background:var(--vc-surface2)!important; border:1px solid var(--vc-border)!important; }
body.vibe-light .live-search-form-input{ background:transparent!important; color:var(--vc-text)!important; }
body.vibe-light .live-search-form-input::placeholder{ color:var(--vc-faint)!important; }
body.vibe-light .live-search-form-icon{ color:var(--vc-faint)!important; }
body.vibe-light .live-search-container-geo-name{ color:var(--vc-text2)!important; }
body.vibe-light .live-search-results{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
/* заголовки блоков */
body.vibe-light h1,
body.vibe-light .bold-title-and-link span,
body.vibe-light .title-h6{ color:var(--vc-text)!important; }
/* карточки категорий (главная) */
body.vibe-light .widget-categories-container{ display:flex!important; flex-wrap:wrap; gap:14px; }
body.vibe-light .home-widget-categories-item{
--cat:#6d59d6;
flex:1 1 240px!important; min-width:0!important; max-width:none!important;
height:auto!important; min-height:116px; margin:0!important;
display:flex!important; flex-direction:column; justify-content:center;
padding:20px 22px!important; border-radius:20px!important;
background:linear-gradient(150deg, color-mix(in srgb, var(--cat) 8%, #fff), #fff)!important;
border:1px solid var(--vc-border)!important; box-shadow:0 1px 2px rgba(17,20,28,.05);
overflow:hidden; position:relative;
transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
body.vibe-light .home-widget-categories-item::before{
content:""; position:absolute; left:20px; right:20px; top:0; height:2px;
background:linear-gradient(90deg, var(--cat), transparent 70%); opacity:.85; pointer-events:none;
}
body.vibe-light .home-widget-categories-item::after{
content:""; position:absolute; right:-24px; top:50%; transform:translateY(-50%);
width:150px; height:150px; border-radius:50%;
background:radial-gradient(circle, color-mix(in srgb, var(--cat) 20%, transparent), transparent 68%); pointer-events:none;
}
body.vibe-light .home-widget-categories-item div{
position:relative; z-index:2; color:var(--vc-text)!important;
font-size:17px; font-weight:700; line-height:1.25; max-width:calc(100% - 84px);
}
body.vibe-light .home-widget-categories-item img{
height:76px!important; right:14px!important; bottom:auto!important; top:50%!important;
transform:translateY(-50%); filter:drop-shadow(0 8px 16px rgba(17,20,28,.18)); transition:transform .18s ease;
}
body.vibe-light .home-widget-categories-item:hover{
background:linear-gradient(150deg, color-mix(in srgb, var(--cat) 14%, #fff), #fff)!important;
border-color:color-mix(in srgb, var(--cat) 55%, transparent)!important; transform:translateY(-4px);
box-shadow:0 16px 30px -18px color-mix(in srgb, var(--cat) 70%, #8a8aa0);
}
body.vibe-light .home-widget-categories-item:hover img{ transform:translateY(-50%) scale(1.06); }
body.vibe-light .widget-categories-container .home-widget-categories-item:nth-of-type(1){ --cat:#6d59d6; }
body.vibe-light .widget-categories-container .home-widget-categories-item:nth-of-type(2){ --cat:#2fae6a; }
body.vibe-light .widget-categories-container .home-widget-categories-item:nth-of-type(3){ --cat:#d99a2b; }
/* карточки категорий (каталог) */
body.vibe-light .widget-categories-or-subcategories .row > [class*="col-"]{ flex:1 1 240px!important; max-width:none!important; }
body.vibe-light .widget-categories-or-subcategories a{
--cat:#6d59d6; position:relative; overflow:hidden; min-height:118px;
display:flex!important; flex-direction:column; justify-content:center;
padding:20px 22px!important; border-radius:20px!important;
background:linear-gradient(150deg, color-mix(in srgb, var(--cat) 8%, #fff), #fff)!important;
border:1px solid var(--vc-border)!important; box-shadow:0 1px 2px rgba(17,20,28,.05);
transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
body.vibe-light .widget-categories-or-subcategories a::before{
content:""; position:absolute; left:20px; right:20px; top:0; height:2px;
background:linear-gradient(90deg, var(--cat), transparent 70%); opacity:.85;
}
body.vibe-light .widget-categories-or-subcategories a::after{
content:""; position:absolute; right:-24px; top:50%; transform:translateY(-50%);
width:150px; height:150px; border-radius:50%;
background:radial-gradient(circle, color-mix(in srgb, var(--cat) 20%, transparent), transparent 68%);
}
body.vibe-light .widget-categories-or-subcategories a div{
position:relative; z-index:2; color:var(--vc-text)!important; font-size:17px; font-weight:700; line-height:1.25; max-width:calc(100% - 92px);
}
body.vibe-light .widget-categories-or-subcategories a img{
height:80px!important; right:16px!important; bottom:auto!important; top:50%!important;
transform:translateY(-50%); filter:drop-shadow(0 8px 16px rgba(17,20,28,.18)); transition:transform .18s ease;
}
body.vibe-light .widget-categories-or-subcategories-counter{
display:inline-block; margin-top:8px; padding:2px 10px; border-radius:100px; font-size:12px!important; font-weight:700;
color:var(--cat)!important; background:color-mix(in srgb, var(--cat) 14%, transparent); border:1px solid color-mix(in srgb, var(--cat) 28%, transparent);
}
body.vibe-light .widget-categories-or-subcategories a:hover{
border-color:color-mix(in srgb, var(--cat) 55%, transparent)!important; transform:translateY(-4px);
box-shadow:0 16px 30px -18px color-mix(in srgb, var(--cat) 70%, #8a8aa0);
}
body.vibe-light .widget-categories-or-subcategories a:hover img{ transform:translateY(-50%) scale(1.06); }
body.vibe-light .widget-categories-or-subcategories .row > [class*="col-"]:nth-child(1) a{ --cat:#6d59d6; }
body.vibe-light .widget-categories-or-subcategories .row > [class*="col-"]:nth-child(2) a{ --cat:#2fae6a; }
body.vibe-light .widget-categories-or-subcategories .row > [class*="col-"]:nth-child(3) a{ --cat:#d99a2b; }
/* карточки объявлений */
body.vibe-light .container-item-grid{ background:var(--vc-surface)!important; border:1px solid var(--vc-border); border-radius:16px; padding:8px; color:var(--vc-text)!important; }
body.vibe-light .container-item-grid:hover{ border-color:var(--vc-border-strong); }
body.vibe-light .container-item-grid-highlight{ border-color:var(--vc-accent)!important; }
body.vibe-light .container-item-images{ background:var(--vc-surface2)!important; border-radius:12px; overflow:hidden; }
body.vibe-light .container-item-grid-content-title{ color:var(--vc-text)!important; }
body.vibe-light .container-item-grid-content-title:hover{ color:var(--vc-accent)!important; }
body.vibe-light .container-item-grid-content-prices .card-item-price-now{ color:var(--vc-accent)!important; }
body.vibe-light .container-item-grid-content-additionally,
body.vibe-light .container-item-grid-content-additionally span{ color:var(--vc-muted)!important; }
body.vibe-light .container-item-grid-content-rating .color-rating-green span{ background:rgba(47,174,106,.12)!important; color:#1f8f52!important; }
body.vibe-light .container-item-grid-content-rating .color-rating-yellow span{ background:rgba(247,153,0,.14)!important; color:#b9740a!important; }
body.vibe-light .container-item-grid-content-rating .text-muted{ color:var(--vc-muted)!important; font-size:13px; }
/* меню каталога, модалки */
body.vibe-light .big-catalog-menu-container,
body.vibe-light .big-catalog-menu-content,
body.vibe-light .modal-content{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
/* футер */
body.vibe-light .footer-bg{ background:var(--vc-surface)!important; color:var(--vc-text); border-top:1px solid var(--vc-border); }
body.vibe-light .footer-bg-box-link-inline{ background:var(--vc-surface2)!important; border:1px solid var(--vc-border)!important; }
body.vibe-light .footer-bg-box-link-inline-item{ color:var(--vc-text2)!important; }
body.vibe-light .footer-bg-box-link-inline-item:hover{ color:var(--vc-accent)!important; }
body.vibe-light .footer-content-text,
body.vibe-light .footer-content-text *{ color:var(--vc-muted)!important; }
body.vibe-light .footer-content-link-inline a{ color:var(--vc-text2)!important; }
body.vibe-light .footer-content-link-inline a:hover{ color:var(--vc-accent)!important; }
/* =========================================================================
СТРАНИЦА ОБЪЯВЛЕНИЯ (ad-card.tpl) — обе темы через одни переменные --vc-*
(структура/цвет — общие; тени различаются по теме, вынесены отдельно)
========================================================================= */
/* хлебные крошки */
/* движок задаёт .breadcrumb{color:rgba(0,26,52,.6)} — из-за этого «голые» -пункты
(текущая страница без класса .active) тонут на тёмном фоне. Перекрываем цвет контейнера. */
body.vibe-dark .breadcrumb,
body.vibe-light .breadcrumb{ color:var(--vc-muted)!important; }
body.vibe-dark .breadcrumb a,
body.vibe-dark .breadcrumb a span,
body.vibe-light .breadcrumb a,
body.vibe-light .breadcrumb a span{ color:var(--vc-muted)!important; }
body.vibe-dark .breadcrumb a:hover,
body.vibe-dark .breadcrumb a:hover span,
body.vibe-light .breadcrumb a:hover,
body.vibe-light .breadcrumb a:hover span{ color:var(--vc-accent)!important; }
/* текущая страница — последний пункт либо .active — ярче остальных */
body.vibe-dark .breadcrumb-item.active,
body.vibe-dark .breadcrumb-item.active span,
body.vibe-dark .breadcrumb-item:last-child,
body.vibe-dark .breadcrumb-item:last-child span,
body.vibe-light .breadcrumb-item.active,
body.vibe-light .breadcrumb-item.active span,
body.vibe-light .breadcrumb-item:last-child,
body.vibe-light .breadcrumb-item:last-child span{ color:var(--vc-text2)!important; }
body.vibe-dark .breadcrumb-item+.breadcrumb-item::before,
body.vibe-light .breadcrumb-item+.breadcrumb-item::before{ color:var(--vc-faint)!important; }
/* заголовок + мета-строка */
body.vibe-dark .ad-card-info-line span,
body.vibe-light .ad-card-info-line span{ color:var(--vc-muted)!important; }
body.vibe-dark .ad-card-info-line i,
body.vibe-light .ad-card-info-line i{ color:var(--vc-faint)!important; }
/* меню действий (избранное / поделиться / …) */
body.vibe-dark .ad-card-menu-line-item,
body.vibe-light .ad-card-menu-line-item{
width:40px; height:40px; border-radius:12px;
background:var(--vc-surface2)!important; border:1px solid var(--vc-border);
color:var(--vc-text2)!important; margin-left:8px;
transition:color .15s ease,border-color .15s ease;
}
body.vibe-dark .ad-card-menu-line-item:not(:last-child),
body.vibe-light .ad-card-menu-line-item:not(:last-child){ margin-right:0; }
body.vibe-dark .ad-card-menu-line-item:hover,
body.vibe-light .ad-card-menu-line-item:hover{ color:var(--vc-accent)!important; border-color:color-mix(in srgb,var(--vc-accent) 45%,transparent); }
/* блок статистики владельца — компактные чипы «иконка + счётчик» */
body.vibe-dark .ad-card-info-stat,
body.vibe-light .ad-card-info-stat{ display:flex; flex-wrap:wrap; gap:10px; }
body.vibe-dark .ad-card-info-stat-item,
body.vibe-light .ad-card-info-stat-item{
display:inline-flex!important; align-items:center; gap:11px;
margin:0!important; padding:9px 16px 9px 9px!important; min-height:52px;
background:var(--vc-surface)!important; border:1px solid var(--vc-border); border-radius:14px; color:var(--vc-text)!important;
transition:border-color .15s ease;
}
body.vibe-dark .ad-card-info-stat-item:hover,
body.vibe-light .ad-card-info-stat-item:hover{ border-color:color-mix(in srgb,var(--vc-accent) 45%,transparent); }
body.vibe-dark .ad-card-info-stat-item i,
body.vibe-light .ad-card-info-stat-item i{
color:var(--vc-accent)!important; font-size:20px!important;
width:36px; height:36px; flex:none; border-radius:11px;
display:inline-flex; align-items:center; justify-content:center;
background:color-mix(in srgb,var(--vc-accent) 14%,transparent);
}
body.vibe-dark .ad-card-info-stat-item span,
body.vibe-light .ad-card-info-stat-item span{ display:inline-block!important; margin:0!important; font-size:18px!important; font-weight:700!important; line-height:1; color:var(--vc-text)!important; }
/* ---------- Галерея ---------- */
body.vibe-dark .ad-card-media-slider-item > div,
body.vibe-light .ad-card-media-slider-item > div{ background:var(--vc-surface2); border:1px solid var(--vc-border); }
body.vibe-dark .ad-card-media-slider-nav-left,
body.vibe-dark .ad-card-media-slider-nav-right,
body.vibe-light .ad-card-media-slider-nav-left,
body.vibe-light .ad-card-media-slider-nav-right{
background:var(--vc-surface)!important; border:1px solid var(--vc-border);
color:var(--vc-text)!important; width:40px; height:40px; border-radius:50%;
display:inline-flex; align-items:center; justify-content:center;
}
body.vibe-dark .ad-card-media-slider-miniatures .swiper-slide,
body.vibe-light .ad-card-media-slider-miniatures .swiper-slide{
border-radius:12px; overflow:hidden; border:1px solid var(--vc-border);
background:var(--vc-surface2); margin-right:10px; cursor:pointer; transition:border-color .15s ease;
}
body.vibe-dark .ad-card-media-slider-miniatures .swiper-slide.active,
body.vibe-light .ad-card-media-slider-miniatures .swiper-slide.active{ border:2px solid var(--vc-accent)!important; }
/* ---------- Траст-чипы (info-box) ---------- */
body.vibe-dark .ad-card-content-info-box-container,
body.vibe-light .ad-card-content-info-box-container{
display:flex!important; flex-wrap:wrap; gap:12px; overflow:visible!important;
}
body.vibe-dark .ad-card-content-info-box,
body.vibe-light .ad-card-content-info-box{
flex:1 1 220px; min-width:0!important; max-width:none!important; min-height:0!important;
margin:0!important; padding:16px 18px!important; border-radius:16px;
background:var(--vc-surface)!important; border:1px solid var(--vc-border);
}
body.vibe-dark .ad-card-content-info-box > i,
body.vibe-light .ad-card-content-info-box > i{
display:inline-flex; align-items:center; justify-content:center;
width:34px; height:34px; border-radius:10px; font-size:19px; margin-bottom:10px;
color:var(--vc-accent); background:color-mix(in srgb,var(--vc-accent) 14%,transparent);
}
body.vibe-dark .ad-card-content-info-box strong,
body.vibe-light .ad-card-content-info-box strong{ display:block; font-size:15px!important; font-weight:700; color:var(--vc-text); }
body.vibe-dark .ad-card-content-info-box p,
body.vibe-light .ad-card-content-info-box p{ font-size:13px; color:var(--vc-muted)!important; margin-top:4px!important; }
/* ---------- Секции контента ---------- */
body.vibe-dark .ad-card-subtitle,
body.vibe-light .ad-card-subtitle{ color:var(--vc-text)!important; font-size:20px!important; }
body.vibe-dark .ad-card-content-item p,
body.vibe-dark .ad-card-content-item div,
body.vibe-light .ad-card-content-item p,
body.vibe-light .ad-card-content-item div{ color:var(--vc-text2); }
/* характеристики — аккуратные строки-разделители */
body.vibe-dark .ad-card-list-properties,
body.vibe-light .ad-card-list-properties{ display:grid; gap:0; }
body.vibe-dark .ad-card-list-properties .list-properties-item,
body.vibe-light .ad-card-list-properties .list-properties-item{
display:flex; justify-content:space-between; gap:16px;
padding:11px 0; margin:0!important; border-bottom:1px dashed var(--vc-border);
font-weight:600; color:var(--vc-text)!important; text-align:right;
}
body.vibe-dark .ad-card-list-properties .list-properties-item:last-child,
body.vibe-light .ad-card-list-properties .list-properties-item:last-child{ border-bottom:0; }
body.vibe-dark .ad-card-list-properties .list-properties-item span,
body.vibe-light .ad-card-list-properties .list-properties-item span{
color:var(--vc-muted)!important; font-weight:500!important; margin:0!important; text-align:left; flex:0 0 auto;
}
/* ---------- Отзывы ---------- */
body.vibe-dark .ad-card-reviews-content,
body.vibe-light .ad-card-reviews-content{ margin-top:48px!important; padding-top:28px; border-top:1px solid var(--vc-border); }
body.vibe-dark .my-tabs-items-big .my-tabs-item,
body.vibe-light .my-tabs-items-big .my-tabs-item{ font-size:22px!important; color:var(--vc-text)!important; padding-bottom:10px; }
body.vibe-dark .my-tabs-items-big .my-tabs-item.active::after,
body.vibe-light .my-tabs-items-big .my-tabs-item.active::after{
content:""; position:absolute; left:0; right:0; bottom:0; height:3px; border-radius:3px; background:var(--vc-accent);
}
body.vibe-dark .my-tabs-items-big .my-tabs-item span,
body.vibe-light .my-tabs-items-big .my-tabs-item span{
position:static!important; margin-left:6px; padding:2px 9px; border-radius:100px; font-size:13px; font-weight:700;
color:var(--vc-accent)!important; background:color-mix(in srgb,var(--vc-accent) 15%,transparent);
}
body.vibe-dark .container-reviews-list-item,
body.vibe-light .container-reviews-list-item{
background:var(--vc-surface); border:1px solid var(--vc-border); border-radius:16px; padding:18px 20px; margin-bottom:14px!important;
}
body.vibe-dark .container-reviews-list-item-info-avatar,
body.vibe-light .container-reviews-list-item-info-avatar{ width:44px; height:44px; border-radius:50%; overflow:hidden; background:var(--vc-surface2); }
body.vibe-dark .container-reviews-list-item-info-name,
body.vibe-light .container-reviews-list-item-info-name{ color:var(--vc-text)!important; font-weight:700; }
body.vibe-dark .container-reviews-list-item-info-date,
body.vibe-light .container-reviews-list-item-info-date{ color:var(--vc-faint)!important; }
body.vibe-dark .container-reviews-list-item-text,
body.vibe-light .container-reviews-list-item-text{ color:var(--vc-text2)!important; margin-top:10px!important; }
body.vibe-dark .container-user-rating-stars span i,
body.vibe-light .container-user-rating-stars span i{ color:var(--vc-faint); }
body.vibe-dark .container-user-rating-stars span i.ti-star-filled,
body.vibe-light .container-user-rating-stars span i.ti-star-filled{ color:#f4c26b; }
body.vibe-dark .user-rating-stars-count-reviews,
body.vibe-light .user-rating-stars-count-reviews{ color:var(--vc-muted)!important; }
/* ---------- Buy-box (правый sticky-сайдбар) ---------- */
body.vibe-dark .ad-card-sidebar,
body.vibe-light .ad-card-sidebar{
position:sticky; top:20px;
background:var(--vc-surface)!important; border:1px solid var(--vc-border);
border-radius:20px!important; padding:22px!important;
}
body.vibe-dark .ad-card-sidebar{ box-shadow:0 20px 40px -28px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.04); }
body.vibe-light .ad-card-sidebar{ box-shadow:0 16px 34px -22px rgba(17,20,28,.28); }
body.vibe-dark .ad-card-sidebar > div:not(:first-child),
body.vibe-light .ad-card-sidebar > div:not(:first-child){ margin-top:14px; }
/* цены */
body.vibe-dark .ad-card-prices,
body.vibe-light .ad-card-prices{ display:flex; align-items:baseline; flex-wrap:wrap; gap:10px; }
body.vibe-dark .ad-card-prices .card-item-price-now,
body.vibe-light .ad-card-prices .card-item-price-now{ color:var(--vc-text)!important; font-size:30px!important; }
body.vibe-dark .ad-card-prices .card-item-price-old,
body.vibe-light .ad-card-prices .card-item-price-old{ color:var(--vc-faint)!important; text-decoration:line-through; font-weight:500; }
body.vibe-dark .ad-card-price-save,
body.vibe-light .ad-card-price-save{
font-size:13px; font-weight:800; padding:3px 9px; border-radius:100px;
color:var(--vc-green); background:color-mix(in srgb,var(--vc-green) 16%,transparent);
}
/* безопасная сделка */
body.vibe-dark .ad-card-buy-now,
body.vibe-light .ad-card-buy-now{ margin-top:16px!important; }
body.vibe-dark .ad-card-buy-now > span,
body.vibe-light .ad-card-buy-now > span{ background:var(--vc-surface2)!important; color:var(--vc-text2)!important; }
body.vibe-dark .ad-card-buy-now > span i,
body.vibe-light .ad-card-buy-now > span i{ color:var(--vc-green)!important; }
/* бейдж «Безопасная сделка» не должен исчезать при наведении (в движке display:none) */
body.vibe-dark .ad-card-buy-now:hover > span,
body.vibe-light .ad-card-buy-now:hover > span{ display:inline-flex!important; }
/* примечание про эскроу */
body.vibe-dark .ad-card-secure-note,
body.vibe-light .ad-card-secure-note{
display:flex; gap:8px; align-items:flex-start;
font-size:12.5px; line-height:1.45; color:var(--vc-muted)!important; margin:14px 0 0!important;
}
body.vibe-dark .ad-card-secure-note i,
body.vibe-light .ad-card-secure-note i{ color:var(--vc-green); margin-top:1px; }
/* карточка продавца */
body.vibe-dark .ad-card-user,
body.vibe-light .ad-card-user{ margin-top:16px!important; padding-top:16px; border-top:1px solid var(--vc-border); }
body.vibe-dark .ad-card-user-content a,
body.vibe-light .ad-card-user-content a{ color:var(--vc-text)!important; font-weight:700; }
body.vibe-dark .ad-card-user-content a:hover,
body.vibe-light .ad-card-user-content a:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .vibe-verified,
body.vibe-light .vibe-verified{ color:var(--vc-accent); font-size:15px; }
/* кнопки buy-box: единая высота/радиус */
body.vibe-dark .ad-card-sidebar .btn-custom,
body.vibe-dark .ad-card-buy-now .btn-custom,
body.vibe-light .ad-card-sidebar .btn-custom,
body.vibe-light .ad-card-buy-now .btn-custom{
height:48px; border-radius:14px; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:700;
}
/* =========================================================================
КАТАЛОГ (catalog.tpl) — сайдбар-фильтр, панель сортировки, пагинация
(структура общая для обеих тем через переменные --vc-*)
========================================================================= */
/* сайдбар с фильтрами — карточка */
body.vibe-dark .catalog-sidebar,
body.vibe-light .catalog-sidebar{
background:var(--vc-surface)!important; border:1px solid var(--vc-border);
border-radius:20px; padding:20px 20px 4px;
}
body.vibe-dark .params-form-item-label,
body.vibe-light .params-form-item-label{ color:var(--vc-text)!important; }
/* инпуты фильтров (цена, поиск внутри селекта) */
body.vibe-dark .params-form-item-price input[type=text],
body.vibe-light .params-form-item-price input[type=text],
body.vibe-dark .uni-select-content-input input,
body.vibe-light .uni-select-content-input input,
body.vibe-dark .uni-select-content-search input,
body.vibe-light .uni-select-content-search input{
background-color:var(--vc-surface2)!important; border:1px solid var(--vc-border)!important;
color:var(--vc-text)!important; border-radius:12px!important;
}
/* uni-select — кнопка-«имя» */
body.vibe-dark .uni-select-name,
body.vibe-light .uni-select-name{
background-color:var(--vc-surface2)!important; border:1px solid var(--vc-border);
color:var(--vc-text); border-radius:12px;
}
/* стрелка селекта (в движке — чёрный SVG; перекрашиваем под тему) */
body.vibe-dark .uni-select-name:after{ content:url("data:image/svg+xml,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.423 6.91a.833.833 0 0 0-1.179 0L10 12.156 4.756 6.91a.833.833 0 0 0-1.178 1.178l5.833 5.833a.833.833 0 0 0 1.179 0l5.833-5.833a.833.833 0 0 0 0-1.178Z' fill='%23c5cbd6'/%3E%3C/svg%3E"); }
body.vibe-light .uni-select-name:after{ content:url("data:image/svg+xml,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.423 6.91a.833.833 0 0 0-1.179 0L10 12.156 4.756 6.91a.833.833 0 0 0-1.178 1.178l5.833 5.833a.833.833 0 0 0 1.179 0l5.833-5.833a.833.833 0 0 0 0-1.178Z' fill='%233a4150'/%3E%3C/svg%3E"); }
/* uni-select — выпадающая панель */
body.vibe-dark .uni-select-content,
body.vibe-light .uni-select-content{
background-color:var(--vc-surface)!important; border:1px solid var(--vc-border); color:var(--vc-text);
}
body.vibe-dark .uni-select-content{ box-shadow:0 18px 40px -20px rgba(0,0,0,.65); }
body.vibe-light .uni-select-content{ box-shadow:0 16px 34px -22px rgba(17,20,28,.28); }
body.vibe-dark .uni-select-content-item:hover,
body.vibe-light .uni-select-content-item:hover{ background-color:var(--vc-surface2)!important; }
/* активный пункт: вместо эмодзи 🔴 — акцентная галочка */
body.vibe-dark .uni-select-content-item.uni-select-item-active,
body.vibe-light .uni-select-content-item.uni-select-item-active{ color:var(--vc-accent)!important; font-weight:600; }
body.vibe-dark .uni-select-content-item.uni-select-item-active:after,
body.vibe-light .uni-select-content-item.uni-select-item-active:after{
content:"\2713"!important; font-size:13px!important; color:var(--vc-accent)!important; top:8px!important;
}
/* липкая панель кнопок фильтра */
body.vibe-dark .params-buttons-sticky,
body.vibe-light .params-buttons-sticky{ background:var(--vc-surface)!important; border-top:1px solid var(--vc-border); margin-top:6px; }
/* панель управления: сохранить поиск / на карте */
body.vibe-dark .catalog-container-links-inline-item,
body.vibe-light .catalog-container-links-inline-item{
color:var(--vc-text2)!important; border-radius:10px; padding:6px 10px; cursor:pointer; transition:color .15s ease,background-color .15s ease;
}
body.vibe-dark .catalog-container-links-inline-item:hover,
body.vibe-light .catalog-container-links-inline-item:hover{ background-color:var(--vc-surface2)!important; color:var(--vc-accent)!important; }
/* «На карте» скрыта: гео заменено платформами, страница карты не имеет смысла (единственная в этом блоке — ссылка на карту) */
.catalog-container-links-inline a.catalog-container-links-inline-item{ display:none!important; }
/* переключатель вид «сетка/список» */
body.vibe-dark .catalog-container-options-view-item span,
body.vibe-light .catalog-container-options-view-item span{ color:var(--vc-muted)!important; cursor:pointer; transition:color .15s ease; }
body.vibe-dark .catalog-container-options-view-item span:hover,
body.vibe-light .catalog-container-options-view-item span:hover{ color:var(--vc-text)!important; }
body.vibe-dark .catalog-container-options-view-item span.active,
body.vibe-light .catalog-container-options-view-item span.active{ color:var(--vc-accent)!important; }
/* выпадающий список сортировки (uni-dropdown) */
body.vibe-dark .catalog-container-options-links-inline-sorting .uni-dropdown-name,
body.vibe-light .catalog-container-options-links-inline-sorting .uni-dropdown-name{ color:var(--vc-text2)!important; cursor:pointer; }
body.vibe-dark .catalog-container-options-links-inline-sorting .uni-dropdown-name:hover,
body.vibe-light .catalog-container-options-links-inline-sorting .uni-dropdown-name:hover{ color:var(--vc-accent)!important; }
/* кнопка «избранное» на карточке объявления */
body.vibe-dark .container-item-favorite,
body.vibe-light .container-item-favorite{ background-color:color-mix(in srgb,var(--vc-surface) 82%,transparent)!important; border:1px solid var(--vc-border); backdrop-filter:blur(4px); }
body.vibe-dark .container-item-favorite i,
body.vibe-light .container-item-favorite i{ color:var(--vc-text2)!important; }
/* блок продавца в карточке */
body.vibe-dark .box-user-face-card-content a,
body.vibe-light .box-user-face-card-content a{ color:var(--vc-text2)!important; }
body.vibe-dark .box-user-face-card-content a:hover,
body.vibe-light .box-user-face-card-content a:hover{ color:var(--vc-accent)!important; }
/* пагинация (bootstrap) */
body.vibe-dark .pagination .page-link,
body.vibe-light .pagination .page-link{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text2)!important; }
body.vibe-dark .pagination .page-link:hover,
body.vibe-light .pagination .page-link:hover{ color:var(--vc-accent)!important; border-color:color-mix(in srgb,var(--vc-accent) 45%,transparent)!important; }
body.vibe-dark .pagination .page-item.active .page-link,
body.vibe-light .pagination .page-item.active .page-link{ background:var(--vc-accent)!important; border-color:var(--vc-accent)!important; color:#fff!important; }
body.vibe-dark .pagination .page-item.disabled .page-link,
body.vibe-light .pagination .page-item.disabled .page-link{ color:var(--vc-faint)!important; }
/* «ничего не найдено» */
body.vibe-dark .catalog-not-found h4,
body.vibe-light .catalog-not-found h4{ color:var(--vc-text)!important; }
body.vibe-dark .catalog-not-found p,
body.vibe-light .catalog-not-found p{ color:var(--vc-muted)!important; }
/* ---------- Корзина / оформление заказа ---------- */
.cart-ad-card-item .col-md-2{ display:flex; align-items:flex-start; justify-content:flex-end; }
.order-buy-card-sidebar{ position:sticky; top:16px; }
/* dark */
body.vibe-dark .order-buy-card-sidebar{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; color:var(--vc-text); }
body.vibe-dark .order-buy-card-sidebar h3{ color:var(--vc-text)!important; }
body.vibe-dark .order-buy-card-sidebar-list-box-item1{ color:var(--vc-muted)!important; }
body.vibe-dark .order-buy-card-sidebar-list-box-item2{ color:var(--vc-text)!important; font-weight:700; }
body.vibe-dark .order-buy-card-sidebar-info{ color:var(--vc-muted)!important; }
body.vibe-dark .cart-ad-card-container{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; padding:18px 20px; }
body.vibe-dark .cart-ad-card-item-user a{ color:var(--vc-text)!important; font-weight:800; }
body.vibe-dark .cart-ad-card-item-user a:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .cart-ad-card-item-user-rating{ color:var(--vc-text2)!important; }
body.vibe-dark .cart-ad-card-container .cart-ad-card-item:not(:last-child){ border-bottom:1px solid var(--vc-border)!important; padding-bottom:15px; }
body.vibe-dark .cart-ad-card-item-image{ background-color:var(--vc-surface2)!important; border-radius:12px; overflow:hidden; }
body.vibe-dark .cart-ad-card-item-content-title a{ color:var(--vc-text)!important; }
body.vibe-dark .cart-ad-card-item-content-title a:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .cart-ad-card-item-content-prices{ color:var(--vc-accent)!important; font-weight:700; }
body.vibe-dark .cart-ad-card-item-delete{ color:var(--vc-muted)!important; }
body.vibe-dark .cart-ad-card-item-delete:hover{ color:#ff6b6b!important; }
body.vibe-dark .quantity_inner{ border-color:var(--vc-border)!important; }
body.vibe-dark .quantity_inner .quantity{ color:var(--vc-text)!important; }
body.vibe-dark .quantity_inner .bt_minus svg,
body.vibe-dark .quantity_inner .bt_plus svg{ stroke:var(--vc-accent)!important; }
body.vibe-dark .quantity_inner .bt_minus:hover svg,
body.vibe-dark .quantity_inner .bt_plus:hover svg{ stroke:var(--vc-text)!important; }
body.vibe-dark .form-check-label{ color:var(--vc-text)!important; }
body.vibe-dark .cart-form .form-check-input,
body.vibe-dark .cart-ad-card-item-checkbox .form-check-input{ background-color:var(--vc-surface2)!important; border-color:var(--vc-border)!important; }
body.vibe-dark .form-check-input:checked{ background-color:var(--vc-accent)!important; border-color:var(--vc-accent)!important; }
/* light */
body.vibe-light .order-buy-card-sidebar{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; color:var(--vc-text); }
body.vibe-light .order-buy-card-sidebar h3{ color:var(--vc-text)!important; }
body.vibe-light .order-buy-card-sidebar-list-box-item1{ color:var(--vc-muted)!important; }
body.vibe-light .order-buy-card-sidebar-list-box-item2{ color:var(--vc-text)!important; font-weight:700; }
body.vibe-light .order-buy-card-sidebar-info{ color:var(--vc-muted)!important; }
body.vibe-light .cart-ad-card-container{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; padding:18px 20px; }
body.vibe-light .cart-ad-card-item-user a{ color:var(--vc-text)!important; font-weight:800; }
body.vibe-light .cart-ad-card-item-user a:hover{ color:var(--vc-accent)!important; }
body.vibe-light .cart-ad-card-item-user-rating{ color:var(--vc-text2)!important; }
body.vibe-light .cart-ad-card-container .cart-ad-card-item:not(:last-child){ border-bottom:1px solid var(--vc-border)!important; padding-bottom:15px; }
body.vibe-light .cart-ad-card-item-image{ background:var(--vc-surface2)!important; border-radius:12px; overflow:hidden; }
body.vibe-light .cart-ad-card-item-content-title a{ color:var(--vc-text)!important; }
body.vibe-light .cart-ad-card-item-content-title a:hover{ color:var(--vc-accent)!important; }
body.vibe-light .cart-ad-card-item-content-prices{ color:var(--vc-accent)!important; font-weight:700; }
body.vibe-light .cart-ad-card-item-delete{ color:var(--vc-muted)!important; }
body.vibe-light .cart-ad-card-item-delete:hover{ color:#e5484d!important; }
body.vibe-light .quantity_inner{ border-color:var(--vc-border)!important; }
body.vibe-light .quantity_inner .bt_minus svg,
body.vibe-light .quantity_inner .bt_plus svg{ stroke:var(--vc-accent)!important; }
body.vibe-light .quantity_inner .bt_minus:hover svg,
body.vibe-light .quantity_inner .bt_plus:hover svg{ stroke:var(--vc-text)!important; }
body.vibe-light .form-check-input:checked{ background-color:var(--vc-accent)!important; border-color:var(--vc-accent)!important; }
/* ---------- Профиль / Мои объявления ---------- */
.profile-home-sections .row > [class*="col-"]:has(> .container-item-grid){ display:flex; }
.profile-user-sidebar{ position:sticky; top:16px; }
.profile-user-sidebar-avatar > div{ margin:0 auto; }
.sections-bg-blue{ border-radius:16px!important; }
body.vibe-dark .sections-bg-blue.profile-home-sections-info-item,
body.vibe-light .sections-bg-blue.profile-home-sections-info-item{ background:linear-gradient(135deg,#8b7bf7,#6d59d6)!important; color:#fff!important; border-color:transparent!important; }
body.vibe-dark .sections-bg-blue.profile-home-sections-info-item h5 strong,
body.vibe-light .sections-bg-blue.profile-home-sections-info-item h5 strong,
body.vibe-dark .sections-bg-blue.profile-home-sections-info-item div,
body.vibe-light .sections-bg-blue.profile-home-sections-info-item div{ color:#fff!important; }
/* dark */
body.vibe-dark .profile-user-sidebar{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; padding:22px 20px; }
body.vibe-dark .profile-user-sidebar-full-name{ color:var(--vc-text)!important; }
body.vibe-dark .profile-user-sidebar-menu a{ color:var(--vc-text2)!important; }
body.vibe-dark .profile-user-sidebar-menu a:hover,
body.vibe-dark .profile-user-sidebar-menu a.active{ color:var(--vc-accent)!important; }
body.vibe-dark .profile-user-sidebar-menu hr{ border-color:var(--vc-border)!important; opacity:1; }
body.vibe-dark .profile-home-sections h3 strong,
body.vibe-dark .profile-home-sections h3{ color:var(--vc-text)!important; }
body.vibe-dark .profile-home-sections-info-item{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; color:var(--vc-text); }
body.vibe-dark .profile-home-sections-info-item h5 strong{ color:var(--vc-text)!important; }
body.vibe-dark .profile-container-order-list{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; padding:16px; }
body.vibe-dark .profile-container-order-list-title{ color:var(--vc-text)!important; font-weight:700; }
body.vibe-dark .profile-container-order-list-title:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .profile-container-order-list small{ color:var(--vc-muted)!important; }
body.vibe-dark .profile-container-order-item-image{ background-color:var(--vc-surface2)!important; border-radius:10px; overflow:hidden; }
body.vibe-dark .status-label-color-success{ background-color:rgba(98,226,154,.16)!important; color:#62e29a!important; }
body.vibe-dark .status-label-color-warning{ background-color:rgba(247,153,0,.16)!important; color:#f0a23a!important; }
body.vibe-dark .status-label-color-danger{ background-color:rgba(255,107,107,.16)!important; color:#ff8080!important; }
body.vibe-dark .status-label-color-secondary{ background-color:var(--vc-surface2)!important; color:var(--vc-muted)!important; }
/* light */
body.vibe-light .profile-user-sidebar{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; padding:22px 20px; }
body.vibe-light .profile-user-sidebar-full-name{ color:var(--vc-text)!important; }
body.vibe-light .profile-user-sidebar-menu a{ color:var(--vc-text2)!important; }
body.vibe-light .profile-user-sidebar-menu a:hover,
body.vibe-light .profile-user-sidebar-menu a.active{ color:var(--vc-accent)!important; }
body.vibe-light .profile-user-sidebar-menu hr{ border-color:var(--vc-border)!important; opacity:1; }
body.vibe-light .profile-home-sections h3 strong,
body.vibe-light .profile-home-sections h3{ color:var(--vc-text)!important; }
body.vibe-light .profile-home-sections-info-item{ background:var(--vc-surface2)!important; border:1px solid var(--vc-border)!important; border-radius:16px; color:var(--vc-text); }
body.vibe-light .profile-home-sections-info-item h5 strong{ color:var(--vc-text)!important; }
body.vibe-light .profile-container-order-list{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; padding:16px; }
body.vibe-light .profile-container-order-list-title{ color:var(--vc-text)!important; font-weight:700; }
body.vibe-light .profile-container-order-list-title:hover{ color:var(--vc-accent)!important; }
body.vibe-light .profile-container-order-list small{ color:var(--vc-muted)!important; }
body.vibe-light .profile-container-order-item-image{ background:var(--vc-surface2)!important; border-radius:10px; overflow:hidden; }
body.vibe-light .status-label-color-success{ background:rgba(47,174,106,.14)!important; color:#1f8f52!important; }
body.vibe-light .status-label-color-warning{ background:rgba(247,153,0,.16)!important; color:#b9740a!important; }
body.vibe-light .status-label-color-danger{ background:rgba(229,72,77,.12)!important; color:#c0343a!important; }
body.vibe-light .status-label-color-secondary{ background:var(--vc-surface2)!important; color:var(--vc-muted)!important; }
/* ---------- Профиль: тарифы / рефералка / настройки / формы / свитчи ---------- */
.profile-settings-sections{ display:flex; gap:12px; flex-wrap:wrap; }
.profile-tariffs-list{ flex-wrap:wrap; gap:15px; }
/* поля ввода */
body.vibe-dark .form-control, body.vibe-dark .form-control-textarea{ background-color:var(--vc-surface2)!important; color:var(--vc-text)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .form-control::placeholder, body.vibe-dark .form-control-textarea::placeholder{ color:var(--vc-faint)!important; }
body.vibe-dark .form-control:focus, body.vibe-dark .form-control-textarea:focus{ border-color:color-mix(in srgb,var(--vc-accent) 55%,transparent)!important; }
body.vibe-light .form-control, body.vibe-light .form-control-textarea{ background:var(--vc-surface)!important; color:var(--vc-text)!important; border:1px solid var(--vc-border)!important; }
body.vibe-light .form-control:focus, body.vibe-light .form-control-textarea:focus{ border-color:color-mix(in srgb,var(--vc-accent) 55%,transparent)!important; }
/* свитчи → акцент */
body.vibe-dark .switch-toggle-slider{ background-color:var(--vc-surface2)!important; border:1px solid var(--vc-border)!important; }
body.vibe-light .switch-toggle-slider{ background-color:var(--vc-surface2)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .switch-input:checked ~ .switch-toggle-slider,
body.vibe-light .switch-input:checked ~ .switch-toggle-slider{ background:var(--vc-accent)!important; border-color:var(--vc-accent)!important; }
/* тарифы */
body.vibe-dark .profile-tariffs-list-item{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
body.vibe-dark .profile-tariffs-list-item.active{ background-color:var(--vc-surface)!important; border:2px solid var(--vc-accent)!important; }
body.vibe-dark .profile-tariffs-list-item-content h5{ color:var(--vc-text)!important; }
body.vibe-dark .profile-tariffs-list-item-prices span{ color:var(--vc-text)!important; }
body.vibe-dark .profile-tariffs-list-items span{ color:var(--vc-text2)!important; }
body.vibe-dark .profile-tariffs-list-item-text{ color:var(--vc-muted)!important; }
body.vibe-light .profile-tariffs-list-item{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
body.vibe-light .profile-tariffs-list-item.active{ background:var(--vc-surface)!important; border:2px solid var(--vc-accent)!important; }
.profile-tariffs-list-item-icon{ color:#62e29a!important; }
/* рефералка / кошелёк */
body.vibe-dark .profile-wallet-info-balance h3,
body.vibe-light .profile-wallet-info-balance h3{ color:var(--vc-accent)!important; }
body.vibe-dark .profile-wallet-info-balance p,
body.vibe-light .profile-wallet-info-balance p{ color:var(--vc-muted)!important; }
body.vibe-dark .profile-referral-container{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
body.vibe-dark .profile-referral-container h5{ color:var(--vc-text)!important; }
body.vibe-dark .profile-referral-container p{ color:var(--vc-muted)!important; }
body.vibe-light .profile-referral-container{ background:var(--vc-surface2)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
body.vibe-light .profile-referral-container p{ color:var(--vc-muted)!important; }
body.vibe-dark .profile-referral-container a,
body.vibe-light .profile-referral-container a{ color:var(--vc-accent)!important; word-break:break-all; }
body.vibe-dark .not-found-title-container p,
body.vibe-light .not-found-title-container p{ color:var(--vc-muted)!important; }
/* табы small/medium */
body.vibe-dark .my-tabs-items-small .my-tabs-item, body.vibe-dark .my-tabs-items-medium .my-tabs-item,
body.vibe-light .my-tabs-items-small .my-tabs-item, body.vibe-light .my-tabs-items-medium .my-tabs-item{ color:var(--vc-text2)!important; }
body.vibe-dark .my-tabs-items-small .my-tabs-item.active, body.vibe-dark .my-tabs-items-medium .my-tabs-item.active,
body.vibe-light .my-tabs-items-small .my-tabs-item.active, body.vibe-light .my-tabs-items-medium .my-tabs-item.active{ color:var(--vc-accent)!important; }
/* настройки */
body.vibe-dark .profile-settings-section{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
body.vibe-light .profile-settings-section{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text); }
body.vibe-dark .profile-settings-section h5 strong, body.vibe-light .profile-settings-section h5 strong{ color:var(--vc-text)!important; }
body.vibe-dark .profile-settings-section label, body.vibe-light .profile-settings-section label{ color:var(--vc-text)!important; }
body.vibe-dark .profile-settings-section small, body.vibe-light .profile-settings-section small{ color:var(--vc-muted)!important; }
body.vibe-dark .profile-settings-sections a{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text)!important; border-radius:14px; }
body.vibe-light .profile-settings-sections a{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text)!important; border-radius:14px; }
body.vibe-dark .profile-settings-sections a i, body.vibe-light .profile-settings-sections a i{ color:var(--vc-accent)!important; }
body.vibe-dark .profile-settings-sections a.active, body.vibe-dark .profile-settings-sections a:hover,
body.vibe-light .profile-settings-sections a.active, body.vibe-light .profile-settings-sections a:hover{ background:color-mix(in srgb,var(--vc-accent) 14%,transparent)!important; border-color:color-mix(in srgb,var(--vc-accent) 45%,transparent)!important; }
/* модалка: рамка + читаемый заголовок */
body.vibe-dark .modal-content{ border:1px solid var(--vc-border)!important; }
body.vibe-dark .modal-content h5, body.vibe-light .modal-content h5{ color:var(--vc-text)!important; }
/* ---------- Кнопка «Добавить счёт/карту» (оплата) ---------- */
body.vibe-dark .credit-card-add{ background:var(--vc-surface2)!important; border:1.5px dashed color-mix(in srgb,var(--vc-accent) 50%,transparent)!important; box-shadow:none!important; }
body.vibe-dark .credit-card-add div{ color:var(--vc-accent)!important; font-weight:600; }
body.vibe-dark .credit-card-add:hover{ border-color:var(--vc-accent)!important; background:color-mix(in srgb,var(--vc-accent) 12%,transparent)!important; }
body.vibe-dark .credit-card{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; box-shadow:none!important; color:var(--vc-text); }
body.vibe-light .credit-card-add{ background:var(--vc-surface)!important; border:1.5px dashed color-mix(in srgb,var(--vc-accent) 45%,transparent)!important; box-shadow:none!important; }
body.vibe-light .credit-card-add div{ color:var(--vc-accent)!important; font-weight:600; }
body.vibe-light .credit-card-add:hover{ border-color:var(--vc-accent)!important; background:color-mix(in srgb,var(--vc-accent) 8%,transparent)!important; }
body.vibe-light .credit-card{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; box-shadow:none!important; }
/* ---------- Иконка пустого состояния (вместо эмодзи) ---------- */
.not-found-title-container-image{ font-size:0!important; line-height:0!important; margin-bottom:14px; }
.not-found-title-container-image::before{ content:""; display:inline-block; width:60px; height:60px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b7bf7' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13h3l2 3h6l2-3h3'/%3E%3Cpath d='M5 13V6a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v7'/%3E%3Cpath d='M4 13v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-4'/%3E%3C/svg%3E") no-repeat center/contain; }
body.vibe-light .not-found-title-container-image::before{ background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236d59d6' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13h3l2 3h6l2-3h3'/%3E%3Cpath d='M5 13V6a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v7'/%3E%3Cpath d='M4 13v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-4'/%3E%3C/svg%3E") no-repeat center/contain; }
/* ---------- Чат / Диалоги ---------- */
.chat-shell{ display:flex; height:640px; border-radius:18px; overflow:hidden; }
.chat-shell .chat-dialogues-container{ width:340px; flex:0 0 340px; overflow:auto; padding:22px; }
.chat-shell .chat-dialogue-container{ flex:1 1 auto; min-width:0; padding:22px; }
.chat-dialogues-item{ border-radius:12px; padding:10px; margin-bottom:4px; }
.chat-dialogue-item-container{ display:flex; }
.item-message-from{ justify-content:flex-end; }
.item-message-whom{ justify-content:flex-start; }
.item-message-system{ justify-content:center; }
.chat-dialogue-item-message{ max-width:78%; }
.item-message-system .chat-dialogue-item-message{ max-width:100%; }
.chat-dialogue-item-date{ text-align:center; }
.chat-dialogue-footer-action-textarea{ min-height:46px; resize:none; border-radius:12px; padding:12px 14px; }
/* dark */
body.vibe-dark .chat-shell{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .chat-shell .chat-dialogues-container{ border-right:1px solid var(--vc-border); }
body.vibe-dark .chat-dialogues-container h3 strong{ color:var(--vc-text)!important; }
body.vibe-dark .chat-dialogues-item:hover{ background-color:var(--vc-surface2)!important; }
body.vibe-dark .chat-dialogues-item.active{ background-color:color-mix(in srgb,var(--vc-accent) 14%,transparent)!important; }
body.vibe-dark .chat-dialogues-item-content-user{ color:var(--vc-text)!important; }
body.vibe-dark .chat-dialogues-item-content-message{ color:var(--vc-muted)!important; }
body.vibe-dark .chat-dialogues-item-date{ color:var(--vc-faint)!important; }
body.vibe-dark .chat-dialogue-container-header{ border-bottom:1px solid var(--vc-border); }
body.vibe-dark .chat-dialogue-item-card-content-link-ad{ color:var(--vc-text)!important; }
body.vibe-dark .chat-dialogue-item-card-content-link-ad:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .chat-dialogue-item-card-content-link-user,
body.vibe-dark .chat-dialogue-item-card-content-link-user-name{ color:var(--vc-text2)!important; }
body.vibe-dark .chat-dialogue-item-card-content-status-online-label,
body.vibe-dark .chat-dialogue-item-card-content-status-online{ color:#62e29a!important; }
body.vibe-dark .chat-dialogue-item-card-image{ background:var(--vc-surface2); border-radius:10px; overflow:hidden; }
body.vibe-dark .item-message-whom .chat-dialogue-item-message-text{ background-color:var(--vc-surface2)!important; color:var(--vc-text)!important; }
body.vibe-dark .item-message-from .chat-dialogue-item-message-text{ background-color:color-mix(in srgb,var(--vc-accent) 24%,transparent)!important; color:var(--vc-text)!important; }
body.vibe-dark .item-message-system .chat-dialogue-item-message-text{ background-color:var(--vc-surface2)!important; color:var(--vc-muted)!important; }
body.vibe-dark .chat-dialogue-item-message-date{ color:var(--vc-faint)!important; }
body.vibe-dark .chat-dialogue-item-date{ color:var(--vc-muted)!important; }
body.vibe-dark .chat-dialogue-footer-action-textarea{ background-color:var(--vc-surface2)!important; color:var(--vc-text)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .chat-dialogue-footer-action-textarea::placeholder{ color:var(--vc-faint)!important; }
body.vibe-dark .chat-dialogue-footer-action-textarea:focus{ border-color:color-mix(in srgb,var(--vc-accent) 55%,transparent)!important; }
body.vibe-dark .chat-dialogue-footer-action-attach i,
body.vibe-dark .chat-dialogue-footer-action-send i{ color:var(--vc-accent)!important; }
/* light */
body.vibe-light .chat-shell{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; }
body.vibe-light .chat-shell .chat-dialogues-container{ border-right:1px solid var(--vc-border); }
body.vibe-light .chat-dialogues-container h3 strong{ color:var(--vc-text)!important; }
body.vibe-light .chat-dialogues-item:hover{ background-color:var(--vc-surface2)!important; }
body.vibe-light .chat-dialogues-item.active{ background-color:color-mix(in srgb,var(--vc-accent) 12%,transparent)!important; }
body.vibe-light .chat-dialogues-item-content-user{ color:var(--vc-text)!important; }
body.vibe-light .chat-dialogues-item-content-message{ color:var(--vc-muted)!important; }
body.vibe-light .chat-dialogues-item-date{ color:var(--vc-faint)!important; }
body.vibe-light .chat-dialogue-container-header{ border-bottom:1px solid var(--vc-border); }
body.vibe-light .chat-dialogue-item-card-content-link-ad{ color:var(--vc-text)!important; }
body.vibe-light .chat-dialogue-item-card-content-link-ad:hover{ color:var(--vc-accent)!important; }
body.vibe-light .chat-dialogue-item-card-content-link-user,
body.vibe-light .chat-dialogue-item-card-content-link-user-name{ color:var(--vc-text2)!important; }
body.vibe-light .chat-dialogue-item-card-content-status-online-label,
body.vibe-light .chat-dialogue-item-card-content-status-online{ color:#1f8f52!important; }
body.vibe-light .chat-dialogue-item-card-image{ background:var(--vc-surface2); border-radius:10px; overflow:hidden; }
body.vibe-light .item-message-whom .chat-dialogue-item-message-text{ background-color:var(--vc-surface2)!important; color:var(--vc-text)!important; }
body.vibe-light .item-message-from .chat-dialogue-item-message-text{ background-color:color-mix(in srgb,var(--vc-accent) 16%,transparent)!important; color:var(--vc-text)!important; }
body.vibe-light .item-message-system .chat-dialogue-item-message-text{ background-color:var(--vc-surface2)!important; color:var(--vc-muted)!important; }
body.vibe-light .chat-dialogue-item-message-date{ color:var(--vc-faint)!important; }
body.vibe-light .chat-dialogue-item-date{ color:var(--vc-muted)!important; }
body.vibe-light .chat-dialogue-footer-action-textarea{ background:var(--vc-surface)!important; color:var(--vc-text)!important; border:1px solid var(--vc-border)!important; }
body.vibe-light .chat-dialogue-footer-action-textarea:focus{ border-color:color-mix(in srgb,var(--vc-accent) 55%,transparent)!important; }
body.vibe-light .chat-dialogue-footer-action-attach i,
body.vibe-light .chat-dialogue-footer-action-send i{ color:var(--vc-accent)!important; }
/* ---------- Заказ / оплата ---------- */
.payment-status-container{ margin-top:60px!important; }
.order-card-section{ border-radius:16px; padding:22px; margin-bottom:16px!important; }
body.vibe-dark .payment-status-container h2, body.vibe-light .payment-status-container h2{ color:var(--vc-text)!important; }
body.vibe-dark .payment-status-container p, body.vibe-light .payment-status-container p{ color:var(--vc-muted)!important; }
body.vibe-dark .order-card-section{ background-color:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; }
body.vibe-light .order-card-section{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .order-card-section strong, body.vibe-light .order-card-section strong{ color:var(--vc-text)!important; }
body.vibe-dark .order-card-section label, body.vibe-light .order-card-section label{ color:var(--vc-text)!important; }
body.vibe-dark .order-card-section-user-avatar, body.vibe-dark .order-card-section-items-image,
body.vibe-light .order-card-section-user-avatar, body.vibe-light .order-card-section-items-image{ background:var(--vc-surface2)!important; border-radius:10px; overflow:hidden; }
body.vibe-dark .order-card-section-user-name, body.vibe-light .order-card-section-user-name{ color:var(--vc-text)!important; font-weight:600; }
body.vibe-dark .order-card-section-items-content a, body.vibe-light .order-card-section-items-content a{ color:var(--vc-text)!important; font-weight:600; }
body.vibe-dark .order-card-section-items-content a:hover, body.vibe-light .order-card-section-items-content a:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .order-card-section-items-content small, body.vibe-light .order-card-section-items-content small{ color:var(--vc-muted)!important; }
/* таймлайн истории сделки */
.timeline-action-item-point{ background-color:var(--vc-accent)!important; box-shadow:0 0 0 4px color-mix(in srgb,var(--vc-accent) 18%,transparent)!important; }
body.vibe-dark .timeline-action-item-header h6, body.vibe-light .timeline-action-item-header h6{ color:var(--vc-text)!important; margin-bottom:2px; }
body.vibe-dark .timeline-action-item-header small, body.vibe-dark .timeline-action-item-event .text-muted,
body.vibe-light .timeline-action-item-header small, body.vibe-light .timeline-action-item-event .text-muted{ color:var(--vc-muted)!important; }
body.vibe-dark .timeline-action-item-event p, body.vibe-light .timeline-action-item-event p{ color:var(--vc-text2)!important; }
/* выравнивание строк карточки заказа: метка по центру значения */
.order-card-section > .row{ align-items:center; }
/* читаемый bootstrap .text-muted в тёмной/светлой теме */
body.vibe-dark .text-muted, body.vibe-light .text-muted{ color:var(--vc-muted)!important; }
/* ---------- Создание объявления ---------- */
.ad-create-options-container-item-title{ font-size:24px!important; }
.ad-create-categories-container-items{ display:flex; flex-wrap:wrap; gap:8px; }
.ad-create-categories-container-items span{ cursor:pointer; }
body.vibe-dark .ad-create-categories-container-items span,
body.vibe-light .ad-create-categories-container-items span{ background-color:var(--vc-surface2)!important; color:var(--vc-text)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .ad-create-categories-container-items span:hover, body.vibe-dark .ad-create-categories-container-items span.active,
body.vibe-light .ad-create-categories-container-items span:hover, body.vibe-light .ad-create-categories-container-items span.active{ background-color:color-mix(in srgb,var(--vc-accent) 16%,transparent)!important; color:var(--vc-accent)!important; border-color:color-mix(in srgb,var(--vc-accent) 45%,transparent)!important; }
body.vibe-dark .unidropzone, body.vibe-light .unidropzone{ border:2px dashed var(--vc-border)!important; background:var(--vc-surface)!important; padding:26px!important; text-align:center; }
body.vibe-dark .unidropzone:hover, body.vibe-light .unidropzone:hover{ border-color:color-mix(in srgb,var(--vc-accent) 50%,transparent)!important; }
body.vibe-dark .unidropzone-change, body.vibe-light .unidropzone-change{ color:var(--vc-muted)!important; }
body.vibe-dark .ad-create-info-block-payment{ background:color-mix(in srgb,var(--vc-accent) 12%,transparent)!important; border:1px solid color-mix(in srgb,var(--vc-accent) 25%,transparent)!important; color:var(--vc-text); border-radius:16px; padding:22px; }
body.vibe-light .ad-create-info-block-payment{ background:color-mix(in srgb,var(--vc-accent) 8%,transparent)!important; border:1px solid color-mix(in srgb,var(--vc-accent) 20%,transparent)!important; color:var(--vc-text); border-radius:16px; padding:22px; }
body.vibe-dark .ad-create-info-block-payment h5, body.vibe-light .ad-create-info-block-payment h5{ color:var(--vc-text)!important; }
body.vibe-dark .ad-create-info-block-payment p, body.vibe-light .ad-create-info-block-payment p{ color:var(--vc-text2)!important; }
body.vibe-dark .ad-create-options-actions-swim, body.vibe-light .ad-create-options-actions-swim{ background:color-mix(in srgb,var(--vc-surface) 90%,transparent)!important; border-top:1px solid var(--vc-border); backdrop-filter:blur(8px); padding:14px 0; }
body.vibe-dark .switch-label, body.vibe-light .switch-label{ color:var(--vc-text)!important; margin-left:8px; }
body.vibe-dark .form-control-label, body.vibe-light .form-control-label{ color:var(--vc-text)!important; }
body.vibe-dark .ad-create-options-container-item > p, body.vibe-light .ad-create-options-container-item > p{ color:var(--vc-muted)!important; }
/* =========================================================================
ПОЛИРОВКА: витрины магазинов, выпадающие меню, датапикер
========================================================================= */
/* ---------- Витрины магазинов: карточка магазина ---------- */
.widget-shops-item-link{ text-decoration:none; display:block; height:100%; }
.row > [class*="col-"]:has(> .widget-shops-item-link){ display:flex; }
.widget-shops-item{ width:100%; height:100%; display:flex; flex-direction:column; border-radius:16px; padding:8px; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.widget-shops-item-image{ border-radius:12px; overflow:hidden; aspect-ratio:16/10; }
.widget-shops-item-image > div{ width:100%; height:100%; }
.widget-shops-item-content{ padding:12px 8px 6px; display:flex; flex-direction:column; flex:1 1 auto; }
.widget-shops-item-content-title.trim-title{ line-height:1.35; min-height:2.7em; }
.widget-shops-item-content-count{ display:block; margin-top:6px; }
body.vibe-dark .widget-shops-item, body.vibe-light .widget-shops-item{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text)!important; }
body.vibe-dark .widget-shops-item:hover, body.vibe-light .widget-shops-item:hover{ transform:translateY(-3px); border-color:color-mix(in srgb,var(--vc-accent) 55%,transparent)!important; box-shadow:0 14px 30px -20px color-mix(in srgb,var(--vc-accent) 80%,#000); }
body.vibe-dark .widget-shops-item-image, body.vibe-light .widget-shops-item-image{ background:var(--vc-surface2)!important; }
body.vibe-dark .widget-shops-item-content-title, body.vibe-light .widget-shops-item-content-title{ color:var(--vc-text)!important; font-weight:700; }
body.vibe-dark .widget-shops-item-link:hover .widget-shops-item-content-title, body.vibe-light .widget-shops-item-link:hover .widget-shops-item-content-title{ color:var(--vc-accent)!important; }
body.vibe-dark .widget-shops-item-content-count, body.vibe-light .widget-shops-item-content-count{ color:var(--vc-muted)!important; font-size:13px; }
/* ---------- Выпадающее меню (uni-dropdown) — общий блок ---------- */
body.vibe-dark .uni-dropdown-content, body.vibe-light .uni-dropdown-content{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:14px!important; box-shadow:0 18px 44px -22px rgba(0,0,0,.55)!important; padding:6px!important; }
body.vibe-dark .uni-dropdown-content a, body.vibe-dark .uni-dropdown-content-item,
body.vibe-light .uni-dropdown-content a, body.vibe-light .uni-dropdown-content-item{ color:var(--vc-text2)!important; border-radius:9px; padding:9px 12px!important; display:block; transition:background-color .15s ease,color .15s ease; }
body.vibe-dark .uni-dropdown-content a:hover, body.vibe-dark .uni-dropdown-content-item:hover,
body.vibe-light .uni-dropdown-content a:hover, body.vibe-light .uni-dropdown-content-item:hover{ background-color:var(--vc-surface2)!important; color:var(--vc-accent)!important; }
/* ---------- Витрина: баннеры-карусель ---------- */
.personal-shop-banners{ position:relative; }
.personal-shop-banners-item-slide{ border-radius:16px; overflow:hidden; }
.personal-shop-banners-item-slide img{ width:100%; display:block; }
body.vibe-dark .personal-shop-banners-prev, body.vibe-dark .personal-shop-banners-next,
body.vibe-light .personal-shop-banners-prev, body.vibe-light .personal-shop-banners-next{ background:color-mix(in srgb,var(--vc-surface) 82%,transparent)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text)!important; backdrop-filter:blur(4px); border-radius:50%; width:40px; height:40px; display:flex; align-items:center; justify-content:center; }
body.vibe-dark .personal-shop-banners-prev:hover, body.vibe-dark .personal-shop-banners-next:hover,
body.vibe-light .personal-shop-banners-prev:hover, body.vibe-light .personal-shop-banners-next:hover{ color:var(--vc-accent)!important; border-color:color-mix(in srgb,var(--vc-accent) 50%,transparent)!important; }
body.vibe-dark .personal-shop-banners-item-control, body.vibe-light .personal-shop-banners-item-control{ border:2px dashed var(--vc-border)!important; background:var(--vc-surface)!important; border-radius:16px; min-height:160px; display:flex; align-items:center; justify-content:center; }
body.vibe-dark .personal-shop-banners-item-control span, body.vibe-dark .personal-shop-banners-control-floating span,
body.vibe-light .personal-shop-banners-item-control span, body.vibe-light .personal-shop-banners-control-floating span{ background:color-mix(in srgb,var(--vc-surface) 85%,transparent)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text)!important; border-radius:9px; }
/* ---------- Витрина: поиск внутри магазина ---------- */
body.vibe-dark .live-shop-search-form, body.vibe-light .live-shop-search-form{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:12px; display:flex; align-items:center; overflow:hidden; }
body.vibe-dark .live-shop-search-form:focus-within, body.vibe-light .live-shop-search-form:focus-within{ border-color:color-mix(in srgb,var(--vc-accent) 55%,transparent)!important; }
body.vibe-dark .live-shop-search-form .live-search-form-input, body.vibe-light .live-shop-search-form .live-search-form-input{ background:transparent!important; color:var(--vc-text)!important; border:0!important; }
body.vibe-dark .live-shop-search-form .live-search-form-icon, body.vibe-light .live-shop-search-form .live-search-form-icon{ background:transparent!important; color:var(--vc-faint)!important; border:0!important; }
/* ---------- Заголовки-классы разделов ---------- */
body.vibe-dark .title-h3, body.vibe-light .title-h3,
body.vibe-dark .title-h5, body.vibe-light .title-h5{ color:var(--vc-text)!important; font-weight:700; }
/* ---------- Плавающее меню магазина (моб.) ---------- */
body.vibe-dark .shop-floating-menu, body.vibe-light .shop-floating-menu{ background:color-mix(in srgb,var(--vc-surface) 94%,transparent)!important; border-top:1px solid var(--vc-border)!important; backdrop-filter:blur(8px); padding:10px 14px; }
/* ---------- Вкладки-страницы магазина ---------- */
.personal-shop-pages{ display:flex; flex-wrap:wrap; gap:8px; }
/* =========================================================================
ДАТАПИКЕР (bootstrap-datepicker) — тёмная тема + лёгкая полировка светлой
========================================================================= */
body.vibe-dark .datepicker{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:14px!important; box-shadow:0 18px 44px -22px rgba(0,0,0,.6)!important; padding:10px!important; color:var(--vc-text)!important; }
body.vibe-dark .datepicker table{ color:var(--vc-text)!important; }
body.vibe-dark .datepicker table tr th,
body.vibe-dark .datepicker .datepicker-switch,
body.vibe-dark .datepicker .dow{ color:var(--vc-text2)!important; }
body.vibe-dark .datepicker table tr td.day{ color:var(--vc-text)!important; border-radius:8px; }
body.vibe-dark .datepicker table tr td.old,
body.vibe-dark .datepicker table tr td.new{ color:var(--vc-faint)!important; }
body.vibe-dark .datepicker table tr td.day:hover,
body.vibe-dark .datepicker .datepicker-switch:hover,
body.vibe-dark .datepicker .prev:hover,
body.vibe-dark .datepicker .next:hover,
body.vibe-dark .datepicker table tr td span:hover{ background:var(--vc-surface2)!important; color:var(--vc-accent)!important; }
body.vibe-dark .datepicker table tr td.today,
body.vibe-dark .datepicker table tr td.today:hover{ background:color-mix(in srgb,var(--vc-accent) 22%,transparent)!important; color:var(--vc-text)!important; }
body.vibe-dark .datepicker table tr td.active,
body.vibe-dark .datepicker table tr td.active:hover,
body.vibe-dark .datepicker table tr td.active.active{ background:var(--vc-accent)!important; color:var(--vc-accent-ink)!important; }
body.vibe-dark .datepicker table tr td.disabled,
body.vibe-dark .datepicker table tr td.disabled:hover{ color:var(--vc-faint)!important; background:transparent!important; }
body.vibe-dark .datepicker table tr td span{ color:var(--vc-text)!important; border-radius:8px; }
body.vibe-dark .datepicker .prev, body.vibe-dark .datepicker .next{ color:var(--vc-text2)!important; border-radius:8px; }
body.vibe-light .datepicker{ border:1px solid var(--vc-border)!important; border-radius:14px!important; box-shadow:0 18px 44px -26px rgba(17,20,28,.3)!important; padding:10px!important; }
body.vibe-light .datepicker table tr td.day{ border-radius:8px; }
body.vibe-light .datepicker table tr td.day:hover{ background:var(--vc-surface2)!important; color:var(--vc-accent)!important; }
body.vibe-light .datepicker table tr td.today,
body.vibe-light .datepicker table tr td.today:hover{ background:color-mix(in srgb,var(--vc-accent) 14%,transparent)!important; color:var(--vc-text)!important; }
body.vibe-light .datepicker table tr td.active,
body.vibe-light .datepicker table tr td.active:hover,
body.vibe-light .datepicker table tr td.active.active{ background:var(--vc-accent)!important; color:#fff!important; }
/* =========================================================================
ПОЛИРОВКА: блог, платные услуги, статус-лейблы
========================================================================= */
/* ---------- Статус-лейблы (активно / модерация / отклонено) ---------- */
.status-label{ font-weight:600!important; }
body.vibe-dark .status-label-color-success, body.vibe-light .status-label-color-success{ background-color:color-mix(in srgb,#36b555 20%,transparent)!important; color:#4cc46a!important; }
body.vibe-dark .status-label-color-warning, body.vibe-light .status-label-color-warning{ background-color:color-mix(in srgb,#f0a23a 22%,transparent)!important; color:#f0a23a!important; }
body.vibe-dark .status-label-color-danger, body.vibe-light .status-label-color-danger{ background-color:color-mix(in srgb,#e5484d 20%,transparent)!important; color:#f0676b!important; }
body.vibe-dark .status-label-color-secondary, body.vibe-light .status-label-color-secondary{ background-color:var(--vc-surface2)!important; color:var(--vc-muted)!important; }
body.vibe-light .status-label-color-success{ color:#1f8f52!important; }
body.vibe-light .status-label-color-warning{ color:#a96a12!important; }
body.vibe-light .status-label-color-danger{ color:#c8323a!important; }
/* ---------- Блог: список ---------- */
body.vibe-dark .blog-widget-categories-or-subcategories a, body.vibe-light .blog-widget-categories-or-subcategories a{ color:var(--vc-text2)!important; }
body.vibe-dark .blog-widget-categories-or-subcategories a.active, body.vibe-dark .blog-widget-categories-or-subcategories a:hover,
body.vibe-light .blog-widget-categories-or-subcategories a.active, body.vibe-light .blog-widget-categories-or-subcategories a:hover{ color:var(--vc-accent)!important; }
body.vibe-dark .blog-grid-item-image, body.vibe-light .blog-grid-item-image{ background:var(--vc-surface2)!important; }
body.vibe-dark .blog-grid-item-title, body.vibe-light .blog-grid-item-title{ color:var(--vc-text)!important; }
body.vibe-dark .blog-grid-item:hover .blog-grid-item-title, body.vibe-light .blog-grid-item:hover .blog-grid-item-title{ color:var(--vc-accent)!important; }
body.vibe-dark .blog-grid-item-date, body.vibe-light .blog-grid-item-date{ color:var(--vc-faint)!important; }
body.vibe-dark .blog-grid-item-category, body.vibe-light .blog-grid-item-category{ color:var(--vc-accent)!important; }
/* ---------- Блог: статья ---------- */
body.vibe-dark .blog-post-card-content, body.vibe-light .blog-post-card-content{ color:var(--vc-text)!important; font-size:18px; line-height:1.75; }
body.vibe-dark .blog-post-card-content .blog-content-text p, body.vibe-light .blog-post-card-content .blog-content-text p{ color:var(--vc-text)!important; margin:0; text-wrap:pretty; }
body.vibe-dark .blog-post-card-content h1, body.vibe-dark .blog-post-card-content h2, body.vibe-dark .blog-post-card-content h3, body.vibe-dark .blog-post-card-content h4, body.vibe-dark .blog-post-card-content strong,
body.vibe-light .blog-post-card-content h1, body.vibe-light .blog-post-card-content h2, body.vibe-light .blog-post-card-content h3, body.vibe-light .blog-post-card-content h4, body.vibe-light .blog-post-card-content strong{ color:var(--vc-text)!important; }
body.vibe-dark .blog-post-card-content a, body.vibe-light .blog-post-card-content a{ color:var(--vc-accent)!important; }
body.vibe-dark .blog-post-card-content img, body.vibe-light .blog-post-card-content img{ border-radius:14px; max-width:100%; }
body.vibe-dark .blog-post-card-content blockquote, body.vibe-light .blog-post-card-content blockquote{ border-left:3px solid var(--vc-accent); padding:6px 0 6px 18px; margin:18px 0; color:var(--vc-muted)!important; }
/* блок кода: моноширинный шрифт, панель, сохранённое форматирование (движок его не стилизует) */
body.vibe-dark .blog-content-code-text, body.vibe-light .blog-content-code-text{
display:block; white-space:pre-wrap; overflow-wrap:break-word; overflow-x:auto; -webkit-overflow-scrolling:touch;
font-family:ui-monospace,SFMono-Regular,"Cascadia Code","Segoe UI Mono",Menlo,Consolas,"Liberation Mono",monospace;
font-size:16px!important; line-height:1.65; color:var(--vc-text)!important;
background:var(--vc-surface2)!important; border:1px solid var(--vc-border);
border-radius:12px; padding:18px 20px; margin:0; tab-size:2;
}
/* разделитель между блоками статьи */
body.vibe-dark .blog-content-separator hr, body.vibe-light .blog-content-separator hr{ border:0!important; height:1px; background:var(--vc-border)!important; opacity:1; margin:0; }
body.vibe-dark .ad-card-info-line, body.vibe-dark .ad-card-info-line span,
body.vibe-light .ad-card-info-line, body.vibe-light .ad-card-info-line span{ color:var(--vc-muted)!important; }
/* ---------- Платные услуги продвижения ---------- */
body.vibe-dark .ad-card-item, body.vibe-light .ad-card-item{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; color:var(--vc-text)!important; border-radius:15px; }
body.vibe-dark .ad-card-item-image, body.vibe-light .ad-card-item-image{ background:var(--vc-surface2)!important; }
body.vibe-dark .ad-card-item-title, body.vibe-dark .ad-card-item-title a,
body.vibe-light .ad-card-item-title, body.vibe-light .ad-card-item-title a{ color:var(--vc-text)!important; }
body.vibe-dark .ad-paid-services-list-item, body.vibe-light .ad-paid-services-list-item{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .ad-paid-services-list-item:hover, body.vibe-light .ad-paid-services-list-item:hover{ background:var(--vc-surface2)!important; border-color:var(--vc-border-strong)!important; }
body.vibe-dark .ad-paid-services-list-item.active, body.vibe-light .ad-paid-services-list-item.active{ background:var(--vc-surface2)!important; border:2px solid var(--vc-accent)!important; }
body.vibe-dark .ad-paid-services-list-item-content h5, body.vibe-light .ad-paid-services-list-item-content h5{ color:var(--vc-text)!important; }
body.vibe-dark .ad-paid-services-list-item-price-now, body.vibe-light .ad-paid-services-list-item-price-now{ color:var(--vc-accent)!important; }
body.vibe-dark .ad-paid-services-list-item-price-old, body.vibe-light .ad-paid-services-list-item-price-old{ color:#e5686c!important; }
body.vibe-dark .ad-paid-services-ads-list, body.vibe-light .ad-paid-services-ads-list{ background:var(--vc-surface2)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .ad-paid-services-ads-item, body.vibe-light .ad-paid-services-ads-item{ color:var(--vc-text)!important; }
body.vibe-dark .ad-paid-services-ads-item:hover, body.vibe-dark .ad-paid-services-ads-item.active,
body.vibe-light .ad-paid-services-ads-item:hover, body.vibe-light .ad-paid-services-ads-item.active{ background:var(--vc-accent)!important; color:var(--vc-accent-ink)!important; }
body.vibe-dark .ad-paid-services-ads-item-image, body.vibe-light .ad-paid-services-ads-item-image{ background:var(--vc-surface)!important; }
body.vibe-dark .ad-paid-services-ads-container p, body.vibe-light .ad-paid-services-ads-container p{ color:var(--vc-text)!important; }
/* =========================================================================
ПОЛИРОВКА: сторис, верификация, статистика, карта
========================================================================= */
/* ---------- Сторис-полоса (главная/каталог) ---------- */
body.vibe-dark .widget-stories-item-circle, body.vibe-light .widget-stories-item-circle{ background:var(--vc-surface2)!important; }
body.vibe-dark .widget-stories-item-title, body.vibe-light .widget-stories-item-title{ color:var(--vc-text2)!important; }
body.vibe-dark .stories-border-add, body.vibe-light .stories-border-add{ background-color:var(--vc-surface2)!important; }
body.vibe-dark .stories-border-view, body.vibe-light .stories-border-view{ border-color:var(--vc-faint)!important; }
/* непросмотренные сторис — фирменный акцент вместо красного */
body.vibe-dark .stories-border-no-view, body.vibe-light .stories-border-no-view{ border-color:var(--vc-accent)!important; }
/* ---------- Заголовок-адаптив (профиль/статистика) + таблицы контента ---------- */
body.vibe-dark .title-h1-adaptive, body.vibe-dark .title-h1-adaptive strong,
body.vibe-light .title-h1-adaptive, body.vibe-light .title-h1-adaptive strong{ color:var(--vc-text)!important; }
body.vibe-dark .table table td, body.vibe-dark .table table th{ color:var(--vc-text2)!important; border-color:var(--vc-border)!important; }
/* ---------- Верификация профиля ---------- */
body.vibe-dark .profile-verification-container, body.vibe-light .profile-verification-container{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; border-radius:16px; padding:24px; }
body.vibe-dark .profile-verification-container h5, body.vibe-dark .profile-verification-container h5 strong,
body.vibe-light .profile-verification-container h5, body.vibe-light .profile-verification-container h5 strong{ color:var(--vc-text)!important; }
body.vibe-dark .profile-verification-container p, body.vibe-light .profile-verification-container p{ color:var(--vc-muted)!important; }
body.vibe-dark .profile-verification-contact-container, body.vibe-light .profile-verification-contact-container{ color:var(--vc-text2)!important; }
body.vibe-dark .profile-verification-contact-container .ti-check, body.vibe-light .profile-verification-contact-container .ti-check{ color:#4cc46a!important; }
body.vibe-dark .profile-verification-contact-container .ti-exclamation-circle, body.vibe-light .profile-verification-contact-container .ti-exclamation-circle{ color:#f0a23a!important; }
body.vibe-dark .profile-verification-doc-container, body.vibe-light .profile-verification-doc-container{ color:var(--vc-text2)!important; }
body.vibe-dark .profile-verification-doc-container strong, body.vibe-light .profile-verification-doc-container strong{ color:var(--vc-accent)!important; }
body.vibe-dark .profile-verification-info-container, body.vibe-dark .profile-verification-info-container li,
body.vibe-light .profile-verification-info-container, body.vibe-light .profile-verification-info-container li{ color:var(--vc-muted)!important; }
/* ---------- Карта (страница устарела, но открывается по URL) ---------- */
body.vibe-dark .search-map-sidebar, body.vibe-dark .search-map-sidebar-card, body.vibe-dark .search-map-sidebar-filters,
body.vibe-light .search-map-sidebar, body.vibe-light .search-map-sidebar-card, body.vibe-light .search-map-sidebar-filters{ background:var(--vc-surface)!important; border:1px solid var(--vc-border)!important; }
body.vibe-dark .search-map-container, body.vibe-light .search-map-container{ background:var(--vc-surface2)!important; }
body.vibe-dark .search-map-sidebar-control strong, body.vibe-light .search-map-sidebar-control strong{ color:var(--vc-text)!important; }
/* =========================================================================
ЗАГРУЗЧИК СПИСКА (каталог/магазины) вместо скелетонов
-------------------------------------------------------------------------
Движок рисует строку скелетонов при AJAX-загрузке списка, затем заменяет её
реальными карточками (catalog.js / shops.js: .html("") → append content).
Раньше мы прятали скелетоны целиком — но тогда контейнер схлопывался в 0,
а по приходе карточек резко «прыгал» вниз (дёрганье). Теперь: сами скелетоны
скрыты, но строка с ними держит высоту экрана и показывает аккуратный
спиннер. Как только движок подставляет реальные карточки, строка-скелетон
исчезает, а карточки плавно проявляются. Правок ядра нет — только CSS. */
.container-item-grid-skeleton,
.container-item-list-skeleton{ display:none!important; }
/* строка, пока в ней лежат скелетоны = состояние загрузки: держим высоту
и рисуем спиннер по центру. Селектор адресно ловит именно строку-скелетон
(col — прямой потомок .row, скелетон — прямой потомок col), поэтому не цепляет
родительские .row-обёртки страницы. */
.row:has(> [class*="col"] > .container-item-grid-skeleton),
.row:has(> [class*="col"] > .container-item-list-skeleton){
position:relative;
min-height:52vh;
}
.row:has(> [class*="col"] > .container-item-grid-skeleton)::after,
.row:has(> [class*="col"] > .container-item-list-skeleton)::after{
content:"";
position:absolute; left:50%; top:50%; margin:-23px 0 0 -23px;
width:46px; height:46px; border-radius:50%;
border:3px solid var(--vc-border);
border-top-color:var(--vc-accent);
animation:vibeSpin .7s linear infinite;
}
@keyframes vibeSpin{ to{ transform:rotate(360deg); } }
/* карточки, которые движок подставил вместо скелетонов, — плавно проявляем,
чтобы не было резкой подмены спиннера на готовый список */
@keyframes vibeItemsIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.container-load-items .container-item-grid,
.container-load-items .container-item-list,
.shops-container-items .container-item-grid{
animation:vibeItemsIn .45s ease both;
}
@media (prefers-reduced-motion: reduce){
.row:has(> [class*="col"] > .container-item-grid-skeleton)::after,
.row:has(> [class*="col"] > .container-item-list-skeleton)::after{ animation:none; }
.container-load-items .container-item-grid,
.container-load-items .container-item-list,
.shops-container-items .container-item-grid{ animation:none; }
}
/* ---------- Меню профиля в шапке (header-user-dropdown) ---------- */
body.vibe-dark .header-user-dropdown-menu-box,
body.vibe-light .header-user-dropdown-menu-box{
background-color:var(--vc-surface)!important;
border:1px solid var(--vc-border)!important;
border-radius:16px!important;
box-shadow:0 24px 60px -24px rgba(0,0,0,.6)!important;
padding:10px!important;
width:268px;
}
body.vibe-dark .header-user-dropdown-menu-box-link a,
body.vibe-light .header-user-dropdown-menu-box-link a{
color:var(--vc-text)!important;
display:flex; align-items:center; gap:8px;
padding:9px 10px!important; border-radius:10px;
font-weight:500;
transition:background-color .15s ease,color .15s ease;
}
body.vibe-dark .header-user-dropdown-menu-box-link a:hover,
body.vibe-light .header-user-dropdown-menu-box-link a:hover{
background-color:var(--vc-surface2)!important;
color:var(--vc-accent)!important;
}
body.vibe-dark .header-user-dropdown-menu-box-link a > i,
body.vibe-light .header-user-dropdown-menu-box-link a > i{ color:var(--vc-faint)!important; font-size:20px; margin-right:0!important; flex:none; }
body.vibe-dark .header-user-dropdown-menu-box-link a > svg,
body.vibe-light .header-user-dropdown-menu-box-link a > svg{ flex:none; }
body.vibe-dark .header-user-dropdown-menu-box-link a:hover > i,
body.vibe-light .header-user-dropdown-menu-box-link a:hover > i{ color:var(--vc-accent)!important; }
/* иконки-svg из меню движка */
body.vibe-dark .header-user-dropdown-menu-box-link a svg *[stroke]{ stroke:currentColor; }
body.vibe-dark .header-user-dropdown-menu-box-link a svg *[fill]:not([fill="none"]){ fill:currentColor; }
/* баланс кошелька */
body.vibe-dark .header-user-dropdown-menu-box-link a strong,
body.vibe-light .header-user-dropdown-menu-box-link a strong{ color:var(--vc-text)!important; margin-left:auto; font-weight:700; }
/* разделитель */
body.vibe-dark .header-user-dropdown-menu-box hr,
body.vibe-light .header-user-dropdown-menu-box hr{ border:0!important; border-top:1px solid var(--vc-border)!important; opacity:1!important; margin:8px 4px!important; }
/* строка рейтинга сверху */
body.vibe-dark .header-user-dropdown-menu-box .container-user-rating-stars span,
body.vibe-light .header-user-dropdown-menu-box .container-user-rating-stars span{ color:var(--vc-muted)!important; }
body.vibe-dark .header-user-dropdown-menu-box .container-user-rating-stars span i,
body.vibe-light .header-user-dropdown-menu-box .container-user-rating-stars span i{ color:var(--vc-border)!important; }
body.vibe-dark .header-user-dropdown-menu-box .container-user-rating-stars span i.ti-star-filled,
body.vibe-light .header-user-dropdown-menu-box .container-user-rating-stars span i.ti-star-filled{ color:#ffaf00!important; }
body.vibe-dark .header-user-dropdown-menu-box .menu-user-rating-stars,
body.vibe-light .header-user-dropdown-menu-box .menu-user-rating-stars{ padding:4px 10px 8px; }
/* вложенный подсписок «Бизнес-услуги» */
body.vibe-dark .header-user-dropdown-menu-box .dropdown-box-list-nested a,
body.vibe-light .header-user-dropdown-menu-box .dropdown-box-list-nested a{ color:var(--vc-text2)!important; padding-left:18px!important; }
body.vibe-dark .header-user-dropdown-menu-box .dropdown-box-list-nested a:hover,
body.vibe-light .header-user-dropdown-menu-box .dropdown-box-list-nested a:hover{ color:var(--vc-accent)!important; }