/**
 * YABUKET — улучшения карточки товара (2026-06-22).
 * 3 правки одним файлом (подключается из component_epilog.php карточки, mobile + desktop):
 *  1) Скрытие блока плашек комплектации CLASSIC/GOLD/PLATINUM/PREMIUM (обратимо — удалить один селектор).
 *  2) Аккордеоны для detail-блоков (Состав/Описание/Оплата/Способы получения).
 *  3) Лента отзывов о салоне горизонтальным скроллом.
 * Кастомный JS навешивается из yb-card-enhance.js — ядро Aspro (bitrix/) не трогаем.
 */

/* ── 1. Скрытие плашек комплектации (вариант Б, обратимо) ───────────────────
   Чтобы ВЕРНУТЬ блок — удалить этот один блок правил. Базовая кнопка «Заказать»
   (.btn-actions__primary-button eq 0) НЕ трогается, остаётся видимой и рабочей. */
.product-size-items {
    display: none !important;
}

/* ── 2. Аккордеоны ──────────────────────────────────────────────────────────
   Навешиваются на существующие .detail-block через класс .yb-acc (ставит JS).
   Заголовок .switcher-title становится кликабельным, тело — сворачивается. */
/* группа аккордеонов — единый блок Состав/Описание/Доставка/Способы получения/Уход/Оплата.
   Вариант А (2026-06-22): родной стиль Aspro «плашка + плюс» (.product__accordion),
   продублирован здесь, чтобы работал и на mobile (где desktop custom.css не грузится). */
.yb-acc-group {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
}
/* заголовок-плашка (как button.product__accordion) */
.yb-acc-group > .detail-block {
    margin: 0 !important;
    padding: 0 !important;
}
.yb-acc-group > .detail-block > .switcher-title {
    cursor: pointer;
    position: relative;
    user-select: none;
    margin: 0 !important;
    padding: 18px;
    font-size: 16px;
    font-weight: 600;
    color: #444;
    background: #f6f5fb;
    border-radius: 8px;
    transition: background-color .3s ease;
}
.yb-acc-group > .detail-block + .detail-block { margin-top: 8px !important; }
.yb-acc-group > .detail-block > .switcher-title:hover,
.yb-acc.yb-acc--open > .switcher-title { background-color: #ecebf2; }
/* индикатор +/− (как .product__accordion::after) */
.yb-acc > .switcher-title::after {
    content: '\002B';               /* + */
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    font-weight: 400;
    color: #777;
    line-height: 1;
}
.yb-acc.yb-acc--open > .switcher-title::after { content: '\2212'; } /* − */
/* тело аккордеона */
.yb-acc > .yb-acc-body {
    overflow: hidden;
    transition: max-height .28s ease;
    padding: 0 18px;
}
.yb-acc.yb-acc--open > .yb-acc-body { padding-top: 14px; padding-bottom: 14px; }
.yb-acc:not(.yb-acc--open) > .yb-acc-body {
    max-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
/* видео внутри блока «Как мы доставляем» */
.yb-acc-group #yb-acc-delivery-video video { width: 100%; border-radius: 8px; display: block; }
.yb-acc-group #yb-acc-care p { margin: 0 0 10px; }

/* ── 3. Лента отзывов о салоне (горизонтальный скролл) ──────────────────────── */
.yb-reviews {
    margin: 24px 0 8px;
}
.yb-reviews__title {
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 14px;
    color: #2a2a2a;
}
.yb-reviews__track {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding: 2px 2px 12px;
    margin: 0 -2px;
    scrollbar-width: none;          /* Firefox */
}
.yb-reviews__track::-webkit-scrollbar { display: none; } /* WebKit */
.yb-review-card {
    flex: 0 0 80%;
    max-width: 300px;
    scroll-snap-align: start;
    box-sizing: border-box;
    background: #f6f5fb;
    border: 1px solid #ececf2;
    border-radius: 12px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.yb-review-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.yb-review-card__name { font-weight: 600; font-size: 14px; color: #2a2a2a; }
.yb-review-card__stars { color: #f5b301; font-size: 13px; letter-spacing: 1px; white-space: nowrap; }
.yb-review-card__text { font-size: 13px; line-height: 1.45; color: #555; }
.yb-review-card__meta { font-size: 11px; color: #9a96a8; margin-top: auto; }

/* десктоп — карточки уже */
@media (min-width: 768px) {
    .yb-review-card { flex-basis: 320px; }
    .yb-reviews__title { font-size: 24px; }
}

/* ── 4. Фикс «засветки» фото в галерее карточки (2026-06-22) ─────────────────
   Ядро Aspro Premier ставит mix-blend-mode: darken на фото галереи
   (.detail img, .detail-gallery-big__item img). Darken рассчитан на чисто-белый
   фон, но фон карточки YABUKET = #f8f8fc (не белый) → светлые тона фото выцветают
   (засвет), хотя в полноэкранном fancybox фото нормальное. Возвращаем normal.
   Белый край исключён: фото букетов репортажные, чисто-белого фона нет.
   Откат — удалить этот блок. */
.detail-gallery-big__item img,
.detail img {
    mix-blend-mode: normal !important;
}

/* ── 5. Кнопки заказа: показываем ровно ОДНУ рабочую (2026-06-23, чистый CSS) ──
   У товаров с комплектациями (Классик/Голден/Платинум/Премиум) шаблон карточки
   КЛОНИРУЕТ базовую кнопку «Заказать» 3 раза (по одному клону на Голден/Платинум/
   Премиум, с onclick=dob(N)). Клоны вставляются СОСЕДНИМИ узлами в тот же .line-block
   сразу ПОСЛЕ оригинальной базовой кнопки (Классик, eq 0 = базовая цена).

   Плашки комплектаций мы скрыли (правило 1) → выбрать Голден/Платинум/Премиум нельзя,
   рабочая всегда базовая (Классик). Значит видимой должна остаться РОВНО ОДНА —
   первая .btn-actions__primary-button в каждом блоке, а клоны (все последующие
   соседи) скрыты.

   Селектор `A ~ A` ловит любую .btn-actions__primary-button, у которой есть
   предшествующий sibling-брат той же кнопки (= клон), и прячет ИМЕННО клоны.
   ПЕРВУЮ кнопку в блоке (оригинал) правило не трогает — она всегда видима.

   Почему чистый CSS, без JS: правило применяется ещё на этапе парсинга стилей,
   ДО отработки любого JS → дубли не успевают мелькнуть (нет FOUC «4 кнопки в ряд»).
   Раньше дубли прятал JS (класс .yb-order-btn--hidden) уже ПОСЛЕ загрузки — отсюда
   моргание. Заодно правило scoped по .line-block, поэтому НЕ задевает кнопки
   «Заказать» соседних блоков (sticky-блок цены, карточки «Вы смотрели») — у них
   в своём .line-block ровно одна кнопка, sibling-комбинатор по ним не срабатывает.

   !important нужен, т.к. родной JS клонирования ставит клонам inline display:none,
   а размерный селектор (недостижимый) — display:block; CSS-правило перебивает оба
   и держит клоны скрытыми стабильно.
   Откат — удалить этот блок (и в JS уже нет ensureBaseOrderButton). */
.btn-actions__primary-button ~ .btn-actions__primary-button {
    display: none !important;
}