/* ============================================================
   Bishofit Sticker Skin — «шкіра» для стікерів модуля АВ.

   МЕХАНІКУ НЕ ЧІПАЄМО. Модуль ab__stickers і всі модулі, що на
   нього зав'язані, працюють як працювали: цей файл лише
   перемальовує те, що АВ виводить у каталозі та картці товару.

   Розмітка АВ (знята з живого dev-сайту):
     .ab-stickers-container.ab-stickers-container__TL
       .ab-sticker-full_size
         .ab-sticker.rectangular.T-sticker  [style="background-color:…"]
           .ab-sticker__name

   Ключ до дизайну — поле «CSS-клас» у налаштуваннях кожного
   стікера АВ (воно вже використовується: bsh-sale-badge).
   Дописуєте стікеру клас із набору нижче — він отримує свій
   градієнт та іконку. Стікер БЕЗ класу теж стає акуратною
   пігулкою: колір лишається той, що заданий в адмінці АВ.

   Всі стікери — З ЗАЛИВКОЮ (без контурних), білий текст, іконка.

   Набір класів:
     bsh-sale  (або bsh-sale-badge)  — знижка, червоний, більший
     bsh-promo  — акція, помаранчевий, блискавка
     bsh-new    — новинка, синій, зірочка
     bsh-hit    — хіт продажів, бурштиновий, зірка
     bsh-choice — вибір покупців, фіолетовий, серце
     bsh-eco    — натуральний, зелений, листок
     bsh-last   — закінчується, графіт, пісочний годинник
     bsh-gift   — подарунок, рожевий, бант
     bsh-volume — вигідний об'єм, бірюзовий, крапля
     bsh-ua     — зроблено в Україні, синій (прапор — емодзі в назві)
   ============================================================ */

/* ---------- Контейнер: колонка з відступами, максимум 2 ---------- */

.ab-stickers-container {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 8px;
}

/* Праві контейнери (TR/BR) — вирівнювання до правого краю */
.ab-stickers-container__TR,
.ab-stickers-container__BR {
    align-items: flex-end;
}

/* Більше двох стікерів на картці не буває: третій і далі ховаються.
   Порядок задається пріоритетом у самому АВ — його й лишаємо. */
.ab-stickers-container .ab-sticker-full_size:nth-child(n+3) {
    display: none;
}

.ab-sticker-full_size {
    width: auto !important;
    line-height: 0;
}

/* ---------- Базова пігулка (будь-який стікер) ---------- */

.ab-sticker {
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    width: auto !important;
    height: auto !important;
    padding: 6px 12px !important;
    border-radius: 999px !important;
    box-shadow: 0 3px 10px rgba(34, 48, 27, .18);
    line-height: 1 !important;
    /* колір з адмінки АВ (inline background-color) лишається
       фолбеком; класи нижче кладуть згори свій градієнт */
}

.ab-sticker .ab-sticker__name,
.ab-sticker.T-sticker .ab-sticker__name {
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: .2px;
    line-height: 1 !important;
    padding: 0 !important;
    text-transform: none;
    white-space: nowrap;
}

/* Іконка. Сам елемент отримує ::before з білим SVG (data-URI) —
   жодних запитів на сервер і жодних шрифтів з іконками. */
.ab-sticker::before {
    content: none;
    flex: 0 0 12px;
    width: 12px;
    height: 12px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

/* ---------- Знижка: більша, без іконки, рівна ---------- */

.ab-sticker.bsh-sale,
.ab-sticker.bsh-sale-badge {
    background-image: linear-gradient(135deg, #F0433F, #C21F3A);
    padding: 8px 13px !important;
    border-radius: 12px !important;
    /* Нахилу немає свідомо: власник попросив рівний стікер.
       transform тут не додавати. */
}

.ab-sticker.bsh-sale .ab-sticker__name,
.ab-sticker.bsh-sale-badge .ab-sticker__name {
    font-size: 15px !important;
    font-weight: 900 !important;
}

/* ---------- Акція ---------- */

.ab-sticker.bsh-promo { background-image: linear-gradient(135deg, #FF8A2A, #F06A13); }
.ab-sticker.bsh-promo::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linejoin='round'%3E%3Cpath d='M13 2 4 14h6l-1 8 9-12h-6z'/%3E%3C/svg%3E");
}

/* ---------- Новинка ---------- */

.ab-sticker.bsh-new { background-image: linear-gradient(135deg, #3A96F5, #1668C4); }
/* Чотирипроменева іскра, намальована на весь габарит рамки —
   щоб візуально була такого ж розміру, як зірка «Хіта». */
.ab-sticker.bsh-new::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M12 2l2.6 7.4L22 12l-7.4 2.6L12 22l-2.6-7.4L2 12l7.4-2.6z'/%3E%3C/svg%3E");
}

/* ---------- Хіт продажів ---------- */

.ab-sticker.bsh-hit { background-image: linear-gradient(135deg, #FFB020, #E08900); }
.ab-sticker.bsh-hit::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='m12 2 2.9 6.26 6.6.6-5 4.44 1.5 6.5L12 16.6 6 19.8l1.5-6.5-5-4.44 6.6-.6z'/%3E%3C/svg%3E");
}

/* ---------- Вибір покупців ---------- */

.ab-sticker.bsh-choice { background-image: linear-gradient(135deg, #9A5BE0, #6E2FBF); }
.ab-sticker.bsh-choice::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M12 21s-7.5-4.7-9.5-9A5.5 5.5 0 0 1 12 6.6 5.5 5.5 0 0 1 21.5 12c-2 4.3-9.5 9-9.5 9z'/%3E%3C/svg%3E");
}

/* ---------- Натуральний ---------- */

.ab-sticker.bsh-eco { background-image: linear-gradient(135deg, #8FBF3A, #5E8A10); }
.ab-sticker.bsh-eco::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M5 21c0-9 5-14 14-16-1 9-5 14-13 14M5 21c3-5 7-8 11-9'/%3E%3C/svg%3E");
}

/* ---------- Закінчується ---------- */

.ab-sticker.bsh-last { background-image: linear-gradient(135deg, #4A5244, #23301E); }
.ab-sticker.bsh-last::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 2h12M6 22h12M8 2c0 6 8 6 8 12s-8 6-8 8M16 2c0 6-8 6-8 12s8 6 8 8'/%3E%3C/svg%3E");
}

/* ---------- Подарунок ---------- */

.ab-sticker.bsh-gift { background-image: linear-gradient(135deg, #F857A6, #C2185B); }
.ab-sticker.bsh-gift::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2'%3E%3Crect x='3' y='8' width='18' height='4'/%3E%3Cpath d='M5 12v9h14v-9M12 8v13M12 8c-4 0-5-6-1.5-6C13 2 12 8 12 8zm0 0c4 0 5-6 1.5-6C11 2 12 8 12 8z'/%3E%3C/svg%3E");
}

/* ---------- Вигідний об'єм ---------- */

.ab-sticker.bsh-volume { background-image: linear-gradient(135deg, #17B8A6, #00786E); }
.ab-sticker.bsh-volume::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2'%3E%3Cpath d='M12 2s6 7 6 12a6 6 0 0 1-12 0c0-5 6-12 6-12z'/%3E%3C/svg%3E");
}

/* ---------- Зроблено в Україні ----------
   Прапор ставиться емодзі 🇺🇦 прямо в назві стікера в адмінці АВ,
   тому окремої іконки не малюємо. */

.ab-sticker.bsh-ua { background-image: linear-gradient(135deg, #2F6FD8, #1D4FA8); }

/* ---------- Телефон ---------- */

@media (max-width: 767px) {
    .ab-stickers-container { gap: 3px; padding: 6px; }

    .ab-sticker { padding: 5px 9px !important; }

    .ab-sticker .ab-sticker__name { font-size: 10.5px !important; }

    .ab-sticker.bsh-sale .ab-sticker__name,
    .ab-sticker.bsh-sale-badge .ab-sticker__name { font-size: 13px !important; }

    .ab-sticker::before { flex-basis: 10px; width: 10px; height: 10px; }
}
