.sets {
  --color1: #f60;
  --color2: #71be00;
}

.set .timer {
    font-size: 20px;
    background-color: #cc0000;
    padding: 10px 20px;
    border-radius: 5px;
    color: white;
    margin: 15px;
    display: none;
}

.sets h3 {
    text-align: center;
}

#prd-sets {
    background: transparent;
    display: none;
    margin: 10px auto;
    width: 100%;
    padding: 0 15px;
    text-align: center;
}

.sets .set-product {
    border: 1px solid #ddd;
}

.sets .set-product .caption {
    padding: 0 10px;
}
.sets .set-product .image {
    margin-top: 10px;
}
.sets .set-product .image img {
    max-height: 150px;
    width: auto;
}

.sets .set-product, .sets .set-total
{
    border-radius: 5px;
    background: white;
    flex: 1 1 0;
    height: 290px;
    max-width: 250px;
    position: relative;
    min-width: 150px;
    margin: 5px;
    vertical-align: middle;
   -webkit-box-shadow: 0px 0px 20px 3px rgba(191,191,191,0.5);
    -moz-box-shadow: 0px 0px 20px 3px rgba(191,191,191,0.5);
    box-shadow: 0px 0px 20px 3px rgba(191,191,191,0.5);
}
.sets .setv .set-product,
.sets .setv .set-total
{
    max-width: 100%;
    flex: 0 0 100%;
}
.sets .set-total {
    border: 2px solid var(--color1);
    padding: 65px 10px;
}

.sets .set-total .economy {
    font-size: 16px;
    color: white;
    border-radius: 5px;
    background: var(--color1);
    padding: 3px 7px;
    position: relative;
    top: -3px;
}

.sets .set-total .old_total
{
    text-decoration: line-through;
    color: #a3a3a3;
    font-size: 20px;
    font-weight: 700;
}

.sets .set-total .new_summ {
    color: var(--color1);
    font-weight: 700;
    font-size: 22px;
    margin-top: 15px;
    white-space: nowrap;
}

.sets .set-product .price-new
{
    font-weight: 700;
    font-size: 16px;
    color: red;
    white-space: nowrap;
}

.sets .set-product .price
{
    font-size: 15px;
}

.sets .set-product .price-old 
{
    text-decoration: line-through;
    color: #b3b3b3;
    font-size: 12px;
}

.sets .set .disc {
    position: absolute;
    left: 0;
    top: 0;
    padding: 4px 6px 4px 10px;
    background-color: var(--color1);
    border-radius: 5px 0 5px 0;
    color: white;
    z-index: 5;
}
.sets .set .quantity {
    position: absolute;
    right: 0;
    top: 0;
    padding: 4px 6px;
    background-color: var(--color2);
    border-radius: 0 5px 0 5px;
    color: white;
    z-index: 5;
}
.add-set-btn {
    background: var(--color1);
    border: none;
    margin: 15px auto 10px auto;
}
.img-resp
{
    max-width: 100%;
    margin: 0 auto;
    display: table;
    height: auto;
}
.sets .set_table {
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: wrap;
}
.sets .set-product h4 {
    font-size: 16px;
    line-height: 20px;
    height: 60px;
    overflow: hidden;
    margin: 10px 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

@media screen and (max-width: 767px) {
        .sets .set-product .image
    {
        width: 30%;
        float: left;
        margin-top: 30px;
    }
    .sets .set-product .caption
    {
        width: 70%;
        float: left;
        padding: 15px 50px 15px 0px;
    }

    .sets .set-total .economy {
        font-size: 14px;
    }

    .sets .set-total .new_summ {
        margin-top: 5px;
        
    }

    .sets .set-product h4 {
    }
    .sets .set-product, .sets .set-total {
        height: auto;
        min-width: 100%;
    }

    .sets .set-total {
        padding: 35px 10px;
    }
    .sets .set-product .image img {
        max-height: 70px;
        width: auto;
    }
    .sets .ao {
      
    }
    .sets .set-total .kjleft
    {
        text-align: right;

    }
    .sets .set-total .kjleft, .sets .set-total .kjright
    {
        width: 50%;
        float: left;
        padding: 0 10px;
    }
        .add-set-btn {
        margin: 0;
    }
}
.sets .set-total .old_total,
.sets .set-total .economy
{
    display: inline-block;
}
.kjincluded {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0!important;
    z-index: 9;
}
.sets .set-product .open-options {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    line-height: 30px;
    padding: 0!important;
}
.sets .ao
{
    padding: 0 10px;
}
.sets .ao span {
    background: #bbb;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    line-height: 30px;
    display: table;
    font-size: 25px;
    font-weight: 700;
    margin: 10px auto;
    color: white;
}
.mymargin {
    margin-top: 30px;
}
.hidden {
    display: none;
}
#prd-sets {
    box-shadow: none;
    border: none;
}
#prd-sets table td {
    vertical-align: middle;
}
#prd-sets .owl-wrapper-outer
{
    border: none;
    box-shadow: none;
}



#prd-sets .swiper-viewport
{
    box-shadow: none;
}

.series-options-modal .price
{
    font-size: 18px;
    line-height: 38px;
    float: left;
    margin: 0;
    font-weight: 500;
}
.series-options-modal .price-old
{
    text-decoration: line-through;
    color: #ff5f9e;
    font-size: 15px;
    font-weight: 300;
}

.series-options-modal .price-new
{
    margin-left: 10px;
    font-size: 19px;
    color: #444;
    white-space: nowrap;
    font-weight: 700;
}
.series-options-modal .discounts, 
.series-options-modal input[name="quantity"]
{
    display: none!important;
}
.series-options-modal input[name="quantity"]
{
    width:70px;
    margin-left: 10px;
    display: inline-block;
}
.series-options-modal .apply-options
{
    float: right;
    font-size: 15px;
}
.series-options-modal .bs5-close
{
    display: none;
}
.setv .set-product, .setv .set-total
{
    height: auto;
}

/* ===== PATCH: стили поверх твоего оригинального CSS ===== */

/* 1) Карточка контейнера (мягкие углы, легкая тень) */
.swiper-slide.set.seth{
  background:#fff;
  border-radius:20px;
  box-shadow:0 6px 20px rgba(0,0,0,.06);
  padding:20px;
  border:none;
}
.seth > h3{
  margin:0 0 16px;
  font-size:24px;
  line-height:1.2;
  font-weight:700;
  text-align:center;
}

/* 2) Макет списка: делаем колоночный стек вместо “плиток” */
.sets .set_table{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:14px;
  justify-content:flex-start;
}

/* 3) Товар: превью слева, контент справа (grid) */
.sets .set-product{
  display:grid;
  grid-template-columns:64px 1fr;
  align-items:center;
  gap:12px;
  height:auto;
  max-width:100%;
  min-width:100%;
  margin:0;
  border:1px solid #eee;
  border-radius:12px;
  box-shadow:none;
  position:relative;
}
.sets .set-product .image{
  width:64px;height:64px;
  margin:0;
  border-radius:12px;
  overflow:hidden;
  background:#f6f6f6;
  display:flex;align-items:center;justify-content:center;
}
.sets .set-product .image img{
  max-width:100%;max-height:100%;width:auto;height:auto;display:block;
}
.sets .set-product .caption{
  padding:0 6px 0 0;
  display:flex;flex-direction:column;gap:6px;
}
.sets .set-product h4{
  font-size:18px;line-height:1.25;height:auto;margin:0;
  -webkit-line-clamp: 2; /* компактнее названия */
}
.sets .set-product .price{
  font-size:15px;margin:0;display:flex;gap:6px;align-items:flex-end;
}
.sets .set-product .price-old{ font-size:16px;color:#9aa3af; }
.sets .set-product .price-new,
.sets .set-product .price-actual{
  font-weight:800;font-size:20px;color:#111; /* без красного */
}

/* Бейдж скидки на товаре */
.sets .set .disc{
  left:8px;top:8px;border-radius:12px;padding:4px 8px;
}

/* 4) Плюс/равно — без серых кружков */
.sets .ao{ padding:0; }
.sets .ao span{
  background:none;border-radius:0;width:auto;height:auto;line-height:1;
  display:inline-block;margin:0 auto;font-size:32px;font-weight:800;color:#111;
}
.sets .ao.plus span{ color:#ef3b3b; }

/* 5) Итоги (правый блок): без рамки, аккуратная типографика */
.sets .set-total{
  border:none;
  height:auto;
  max-width:100%;
  min-width:100%;
  padding:0;
  box-shadow:none;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.sets .set-total .kjleft{
  display:flex;flex-direction:column;gap:4px;
  text-align:left;float:none;width:auto;padding:0;
}
.sets .set-total .old_total{
  color:#9aa3af;font-size:20px;font-weight:700;text-decoration:line-through;
}
.sets .set-total .new_summ{
  color:#111;font-weight:900;font-size:32px;margin-top:0;white-space:nowrap;
}
/* из .economy делаем красный чип */
.sets .set-total .economy{
  background:var(--color1);color:#fff;border-radius:22px;
  padding:6px 12px;font-weight:700;font-size:16px;top:0;
}

/* правая колонка с кнопкой */
.sets .set-total .kjright{ float:none;width:220px;max-width:40%;padding:0; }

/* 6) Кнопка – зелёная “пилл” на всю ширину */
.sets .set-total .add-set-btn{
  width:100%;
  border:0;border-radius:36px;
  font-size:20px;font-weight:800;padding:16px 18px;
  background:var(--color2); /* #71be00 */
  color:#fff;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* 7) Мобильная подстройка */
@media (max-width: 767px){
  .sets .set-product{ grid-template-columns:56px 1fr; }
  .sets .set-product .image{ width:56px;height:56px; }
  .sets .set-total{ flex-direction:row; }
  .sets .set-total .kjright{ max-width:50%; width:50%; }
  .sets .set-total .new_summ{ font-size:28px; }
  .sets .set-total .economy{ font-size:14px; padding:5px 10px; }
  .seth > h3{ font-size:22px; }
}

/* 8) Десктоп — чуть крупнее превью */
@media (min-width: 992px){
  .sets .set-product{ grid-template-columns:80px 1fr; }
  .sets .set-product .image{ width:80px;height:80px; }
  .sets .set-total .new_summ{ font-size:36px; }
}

/* 9) Служебное: прячем “обязательный” чекбокс, не лезем в JS */
.kjincluded.hidden{ display:none !important; }

/* === PATCH под макет «Разом дешевше» === */

/* 1) Рядок товара: аккуратный блок с тенюшкой */
.sets .set-product{
  display:grid;
  grid-template-columns:80px 1fr;
  gap:16px;
  align-items:center;
  background:#fff;
  border:0;
  border-radius:16px;
  box-shadow:0 4px 16px rgba(0,0,0,.06);
  padding:12px 16px;
  height:auto; max-width:100%; min-width:100%; margin:0;
}
.sets .set-product .image{ width:80px;height:80px;margin:0;border-radius:12px;overflow:hidden;background:#f6f6f6;display:flex;align-items:center;justify-content:center; }
.sets .set-product .image img{ max-width:100%;max-height:100%;width:auto;height:auto;display:block; }

.sets .set-product .caption{ padding:0; display:flex; flex-direction:column; gap:6px; }
.sets .set-product h4{ margin:0; height:auto; font-size:18px; line-height:1.25; -webkit-line-clamp:2; }
.sets .set-product h4 a{ color:#111 !important; text-decoration:none; }

/* цена у товара: старая серая, новая чёрная и крупнее */
.sets .set-product .price{ margin:0; display:flex; gap:8px; align-items:flex-end; }
.sets .set-product .price-old{ color:#9aa3af; font-size:16px; text-decoration:line-through; }
.sets .set-product .price-new,
.sets .set-product .price-actual{ color:#111; font-size:22px; font-weight:800; }

/* бейдж скидки на товаре — небольшой чип */
.sets .set .disc{ left:12px; top:12px; padding:4px 10px; border-radius:12px; }

/* 2) Плюс / равно — как в макете */
.sets .ao{ padding:0; }
.sets .ao span{ background:none; width:auto; height:auto; line-height:1; margin:10px auto; font-size:32px; font-weight:800; color:#111; }
.sets .ao.plus span{ color:#e84e89; } /* розово-красный как в рефе */

/* 3) Итоги: без рамки, правильные размеры и выравнивание */
.sets .set-total{
  border:0; box-shadow:none; background:transparent;
  height:auto; max-width:100%; min-width:100%;
  padding:0; display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.sets .set-total .kjleft{
  display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; text-align:left;
  float:none; width:auto; padding:0;
}
/* переупорядочиваем без правки HTML */
.sets .set-total .old_total{ order:1; color:#9aa3af; font-size:20px; font-weight:700; text-decoration:line-through; }
.sets .set-total .new_summ{ order:2; color:#111; font-size:36px; font-weight:900; margin:0; white-space:nowrap; }
.sets .set-total .economy{
  order:3;
  background:#e84e89; color:#fff;
  border-radius:22px; padding:6px 12px; font-weight:700; font-size:16px; top:0;
}

/* правая колонка с кнопкой */
.sets .set-total .kjright{ float:none; width:260px; max-width:40%; padding:0; }

/* 4) Кнопка — большая зелёная пилюля */
.sets .set-total .add-set-btn{
  width:100%;
  border:0; border-radius:36px;
  font-size:20px; font-weight:800; padding:16px 18px;
  background:#71be00; color:#fff;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* 5) Мобайл-твики */
@media (max-width: 767px){
  .sets .set-product{ grid-template-columns:64px 1fr; gap:12px; }
  .sets .set-product .image{ width:64px; height:64px; }
  .sets .set-total{ gap:12px; }
  .sets .set-total .new_summ{ font-size:32px; }
  .sets .set-total .kjright{ max-width:50%; width:50%; }
}
/* 1. Старая цена над новой */
.sets .set-product .price {
  flex-direction: column;
  align-items: flex-start;
}
.sets .set-product .price-old {
  font-size: 16px;
  color: #9aa3af;
  text-decoration: line-through;
}
.sets .set-product .price-new,
.sets .set-product .price-actual {
  font-size: 22px;
  font-weight: 800;
  color: #111;
}

/* 2. Стикер на товаре розовый */
.sets .set .disc {
  background-color: #e84e89 !important; /* розовый */
  color: #fff;
}

/* 3. Кнопка внизу */
.sets .set-total {
  flex-direction: column;
  align-items: stretch;
}
.sets .set-total .kjright {
  margin-top: auto; /* опустить кнопку вниз */
}
.sets .set-total .add-set-btn {
  width: 100%;
  border-radius: 36px;
  font-size: 20px;
  font-weight: 800;
  padding: 16px 18px;
  background: #71be00;
  color: #fff;
}
/* 1. Выравнивание заголовка и текста влево */
.seth > h3 {
  text-align: left !important;
}
.sets .set-product .caption,
.sets .set-total .kjleft {
  text-align: left !important;
}

/* 2. Кнопка уже и шире */
.sets .set-total .add-set-btn {
  max-width: 100%;
  width: 100%;
  height: auto;
  padding: 12px 20px; /* ниже по высоте */
  font-size: 18px;
  font-weight: 800;
  border-radius: 30px;
  background: #71be00;
  color: #fff;
}
/* Кнопка как в референсе: широкая "пилюля" по всей ширине блока */
.sets .set-total{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:16px;
}

.sets .set-total .kjright{
  width:100% !important;      /* не ограничиваем колонкой */
  max-width:none !important;
  margin-top:0;                /* кнопка сразу под ценами */
}

.sets .set-total .add-set-btn{
  display:block;
  width:100%;
  max-width:100%;
  padding:16px 28px;           /* умеренная высота, длиннее по ширине */
  border-radius:9999px;        /* полноценная "пилюля" */
  font-size:20px;
  font-weight:800;
  line-height:1.2;
  text-align:center;
  white-space:normal;          /* не обрезаем текст троеточием */
  overflow:visible;
  background:#71be00;          /* твой зелёный */
  color:#fff;
  box-shadow:0 6px 16px rgba(113,190,0,.28);
}

/* на очень узких экранах чуть компактнее по высоте */
@media (max-width: 360px){
  .sets .set-total .add-set-btn{ padding:14px 22px; font-size:18px; }
}

/* если тема где-то жёстко задаёт ширину/скругление — добьём точечно */
.sets .set-total .add-set-btn.btn.btn-primary{
  border-radius:9999px !important;
  width:100% !important;
}
/* Старая цена как в референсе */
/*.sets .set-product .price-old {
  color: #b3b3b3 !important;  
  font-weight: 400 !important; 
} */
.sets .set-total .old_total {
  color: #b3b3b3 !important;
  font-weight: 400 !important;
}
/* Старая цена розовая как в макете */
.sets .set-product .price-old {
  color: #e84e89 !important;   /* розовый */
  font-weight: 500 !important; /* чуть толще, чем обычный */
}
.sets .set-total .old_total {
  color: #e84e89 !important;
  font-weight: 500 !important;
}

/* Ярче зачеркнутая цена в товаре */
.sets .set-product .price-old {
  color: #ff5f9e !important;   /* чуть более насыщенный розовый */
  font-weight: 500 !important;
}

/* 1) Ярче зачеркнутую цену в карточке товара */
.sets .set-product .price-old{
  color:#ff3e8a !important;            /* ярче розовый */
  font-weight:600 !important;
  text-decoration-line:line-through;
  text-decoration-thickness: 2px;      /* толще линия (если поддерживается) */
  text-decoration-color:#ff3e8a;       /* цвет линии = розовый */
  opacity:1 !important;                /* на всякий случай, вдруг тема бледнит */
}

/* 2) Карточки больше + больше отступ между фото и текстом */
.sets .set-product{
  grid-template-columns:96px 1fr !important;  /* было 80/64 → стало 96 */
  gap:20px !important;                         /* больше зазор */
  padding:16px 20px !important;                /* сама карточка крупнее */
  border-radius:18px !important;
  box-shadow:0 6px 18px rgba(0,0,0,.07) !important;
}
.sets .set-product .image{
  width:96px !important;
  height:96px !important;
  border-radius:14px !important;
}

/* мобильная коррекция, чтобы не пережать */
@media (max-width: 390px){
  .sets .set-product{
    grid-template-columns:88px 1fr !important;
    gap:16px !important;
    padding:14px 16px !important;
  }
  .sets .set-product .image{ width:88px !important; height:88px !important; }
}

/* 3) Кнопка — чуть меньше (ниже по высоте/шрифту) */
.sets .set-total .add-set-btn{
  padding:12px 22px !important;   /* было 16–28 → стало компактнее */
  font-size:18px !important;
  border-radius:9999px !important; /* оставить “пилюлю” */
  box-shadow:0 5px 14px rgba(113,190,0,.24) !important;
}

/* === Desktop fix: горизонтальный ряд и адекватные ширины === */
@media (min-width: 992px) {
  /* ряд: в линию, можно переносить, выравнивание слева */
  .sets .set_table{
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    gap: 24px;
    flex-wrap: wrap; /* разрешаем перенос, чтобы ничего не "пропадало" */
  }

  /* СБРОСИМ жёсткий min-width из мобильной/общей части */
  .sets .set-product,
  .sets .set-total{
    min-width: auto !important;
  }

  /* товар: гибкая ширина в пределах, чтобы помещались два товара + итоги */
  .sets .set-product{
    flex: 1 1 480px;       /* базово ~480px, можно сжимать/расти */
    max-width: 560px;      /* верхняя граница, чтобы не расползалось */
    width: auto !important;/* перекрываем width:520px, если он был */
  }

  /* разделители "+", "=" — компактные, не тянут строку */
  .sets .ao{
    flex: 0 0 auto;
    display:flex;align-items:center;justify-content:center;
    margin: 0;
  }
  .sets .ao span{ margin:0 2px; font-size:36px; }

  /* итоги справа: тоже гибко, но чуть уже */
  .sets .set-total{
    flex: 0 1 360px;       /* базово ~360px, может сжаться немного */
    align-items: flex-start;
    gap: 16px;
    width: auto !important;
  }
  .sets .set-total .kjright{
    width: 100%;
    max-width: none;
  }
  .sets .set-total .add-set-btn{ width:100%; }
}
/* === Desktop: товары горизонтально, итог справа === */
@media (min-width: 1200px) {
  /* вместо flex используем grid, чтобы гарантированно держать всё в один ряд */
  .sets .set_table{
    display: grid !important;
    grid-template-columns: minmax(420px, 520px) 32px minmax(420px, 520px) 32px minmax(320px, 380px);
    align-items: center;
    justify-content: center;
    gap: 24px;
    flex-wrap: nowrap;        /* на случай, если где-то остался flex */
  }

  /* карточки не тянут ширину и не “ломают” сетку */
  .sets .set-product{
    width: auto !important;
    max-width: none !important;
  }

  /* плюс/равно — компактные разделители по центру своей колонки */
  .sets .ao{
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
  }
  .sets .ao span{
    margin: 0;
    font-size: 36px;
    background: none;
    width: auto; height: auto; line-height: 1; border-radius: 0;
  }

  /* блок итогов справа, кнопка на всю его ширину */
  .sets .set-total{
    width: auto !important;
    max-width: none !important;
    align-items: flex-start;      /* цены слева */
    gap: 16px;
  }
  .sets .set-total .kjright{
    width: 100% !important;
    max-width: none !important;
  }
  .sets .set-total .add-set-btn{
    width: 100% !important;
  }
}

/* === Mobile: центрируем + и = между/под карточками === */
@media (max-width: 992px){
  /* сам контейнер знаков — на всю ширину, по центру */
  .sets .ao{
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:100%;
    padding:0;
    margin:12px 0;          /* расстояние от карточек */
  }

  /* сам символ — без кружков, крупный */
  .sets .ao span{
    background:none !important;
    border-radius:0 !important;
    width:auto; height:auto; line-height:1;
    margin:0;
    font-size:34px;         /* можно 32–36 */
    font-weight:800;
    color:#111;             /* по умолчанию для '=' */
  }

  /* + делаем розовым, как в макете */
  .sets .ao.plus span{
    color:#e84e89 !important;
  }

  /* чуть больше отступа под знаком '=' перед суммой */
  .sets .ao:not(.plus){     /* это блок с '=' */
    margin:16px 0 10px;
  }
}



/* === FIX: заміна кольорів на AC8FF0 + 6BAA04 === */

/* бейдж на товарі */
.sets .set .disc{
  background-color:#AC8FF0 !important;
  color:#fff !important;
}

/* знак плюс */
.sets .ao.plus span{
  color:#AC8FF0 !important;
}

/* зачеркнута ціна */
.sets .set-product .price-old,
.sets .set-total .old_total{
  color:#AC8FF0 !important;
  text-decoration-color:#AC8FF0 !important;
}

/* чіп економії */
.sets .set-total .economy{
  background-color:#AC8FF0 !important;
  color:#fff !important;
}

/* кнопка */
.sets .set-total .add-set-btn{
  background:#6BAA04 !important;
  box-shadow:0 5px 14px rgba(107,170,4,.28) !important;
  color:#fff !important;
}
.sets .set-total .add-set-btn:hover{
  background:#609903 !important;
}

/* === FIX: убрать ненужный grayscale в блоке наборов === */
/* У некоторых тем фильтр вешается на .out-stock. В наборах отключаем. */
.sets .set-product .image img,
.sets .set-product img {
  -webkit-filter: none !important;
  filter: none !important;
  opacity: 1 !important;
}


/* === FIX: сделать новую цену в карточке цветной (зелёной) === */
.sets .set-product .price-new,
.sets .set-product .price-actual {
  color: #6BAA04 !important;   /* зелёный из новой палитры */
  font-weight: 800;
}

/* (Напоминание: старая цена/чип скидки/плюс уже фиолетовые #AC8FF0) */

/* === 1200–1499px: безопасная раскладка, ничего не вылезает === */
@media (min-width:1200px) and (max-width:1499.98px){
  .sets .set_table{
    display:flex !important;
    flex-wrap:wrap;              /* разрешаем перенос */
    align-items:stretch;
    justify-content:flex-start;
    gap:24px;
    max-width:100%;
    box-sizing:border-box;
  }

  /* два товара в строку, по половине ширины с учётом промежутка */
  .sets .set-product{
    flex:0 1 calc((100% - 24px)/2);
    min-width:320px;             /* можно меньше, если надо */
    max-width:100%;
    width:100% !important;
  }

  /* разделители компактны и не растягивают строку */
  .sets .ao{
    flex:0 0 32px;
    display:flex; align-items:center; justify-content:center;
    padding:0; margin:0;
  }
  .sets .ao span{ font-size:32px; }

  /* блок итога — новой строкой справа на всю доступную ширину */
  .sets .set-total{
    flex:1 1 100%;
    display:flex; align-items:flex-start; gap:16px;
    justify-content:flex-end;    /* прижать к правому краю */
    width:100% !important; max-width:100% !important; min-width:0 !important;
  }
  .sets .set-total .kjright{ width:360px; max-width:100%; }
}

/* --- DESKTOP SAFE LAYOUT (перестраивается, ничего не вылазит) --- */
@media (min-width: 992px) and (max-width: 1499.98px){
  .sets .set_table{
    display:flex !important;
    flex-wrap:wrap;                 /* можно переносить строки */
    justify-content:flex-start;
    align-items:stretch;
    gap:16px;                       /* поменьше зазор */
    max-width:100%;
    box-sizing:border-box;
  }

  /* товары “ужимаются”, если колонка узкая */
  .sets .set-product{
    flex:1 1 420px;                 /* было 480px */
    min-width:340px;                /* можно 320, если надо ещё компактнее */
    max-width:100%;
    width:100% !important;
  }

  /* разделители компактные, не растягивают строку */
  .sets .ao{
    flex:0 0 24px;                  /* было 32px */
    display:flex; align-items:center; justify-content:center;
    margin:0; padding:0;
  }
  .sets .ao span{ font-size:30px; } /* чуть меньше значок */

  /* итог переносится на новую строку и ужимается */
  .sets .set-total{
    flex:1 1 320px;                 /* было 360px фиксом */
    min-width:300px;
    max-width:100% !important;
    width:100% !important;
    justify-content:flex-end;       /* цены+кнопка вправо */
  }
  .sets .set-total .kjright{
    width:360px;                    /* кнопка разумной ширины */
    max-width:100%;
  }
  .sets .set-total .add-set-btn{
    width:100% !important;
    max-width:100% !important;
  }
}

/* На очень широких экранах можно снова собрать в одну линию — без переполнений */
@media (min-width: 1500px){
  .sets .set_table{
    display:grid !important;
    grid-template-columns:minmax(0,520px) 24px minmax(0,520px) 24px minmax(320px,380px);
    gap:20px;
    align-items:center;
    justify-content:center;
    max-width:100%;
  }
  .sets .set-product,
  .sets .set-total{ min-width:0 !important; max-width:100% !important; width:100% !important; }
}

/* Страховка от горизонтального скролла/обрезания */
.seth{ overflow:hidden; }
.sets{ overflow-x:hidden; }

/* === 992–1199px: карточки вертикально, знаки по центру === */
@media (min-width: 992px) and (max-width: 1199.98px){
  /* стекуем весь блок набора */
  .sets .set_table{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:16px !important;
  }

  /* карточки и итог — на всю ширину контейнера */
  .sets .set-product,
  .sets .set-total{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  /* плюс/равно — отдельной строкой по центру */
  .sets .ao{
    display:flex !important;
    width:100% !important;
    justify-content:center !important;
    align-items:center !important;
    margin:12px 0 !important;
    padding:0 !important;
    flex:0 0 auto !important;
  }
  .sets .ao span{ font-size:34px !important; line-height:1 !important; }
  
  /* цены слева, кнопка на всю ширину итога */
  .sets .set-total{ align-items:flex-start !important; }
  .sets .set-total .kjright{ width:100% !important; max-width:none !important; }
}


/* ===== Mobile polish: ширше картки + компактніші заголовки ===== */

/* телефони до 480px */
@media (max-width: 480px){
  /* менші бокові поля всього блоку */
  .swiper-slide.set.seth{
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  #prd-sets{
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  /* картка товара – ширше (менше внутрішніх відступів), компактніша сітка */
  .sets .set-product{
    padding: 12px 14px !important;
    grid-template-columns: 72px 1fr !important;
    gap: 12px !important;
  }
  .sets .set-product .image{
    width: 72px !important;
    height: 72px !important;
  }

  /* назва: трішки менший шрифт + 2 рядки */
  .sets .set-product h4{
    font-size: 16px !important;
    line-height: 1.25 !important;
    -webkit-line-clamp: 2 !important;
    height: auto !important;
  }

  /* ціни — на півкроку компактніше */
  .sets .set-product .price-old{ font-size: 14px !important; }
  .sets .set-product .price-new,
  .sets .set-product .price-actual{ font-size: 20px !important; }

  /* знаки + і = трохи ближче */
  .sets .ao{ margin: 8px 0 !important; }
  .sets .ao span{ font-size: 30px !important; }

  /* блок підсумку – не громіздкий */
  .sets .set-total .new_summ{ font-size: 26px !important; }
  .sets .set-total .economy{ font-size: 13px !important; padding: 4px 10px !important; }
  .sets .set-total .add-set-btn{ padding: 14px 18px !important; font-size: 18px !important; }
}

/* телефони 481–767px (трохи просторіше, але все ще мобілка) */
@media (min-width: 481px) and (max-width: 767.98px){
  .swiper-slide.set.seth{ padding-left: 14px !important; padding-right: 14px !important; }
  .sets .set-product{
    padding: 14px 16px !important;
    grid-template-columns: 80px 1fr !important;
    gap: 14px !important;
  }
  .sets .set-product .image{ width: 80px !important; height: 80px !important; }
  .sets .set-product h4{ font-size: 17px !important; -webkit-line-clamp: 2 !important; }
  .sets .set-product .price-new,
  .sets .set-product .price-actual{ font-size: 21px !important; }
}


/* mobile tighten */
@media (max-width: 767px){

  /* уменьшить горизонтальные поля контейнера блока */
  .swiper-slide.set.seth{
    padding-left:10px !important;
    padding-right:10px !important;
  }

  /* карточка чуть шире — уменьшаем внутренние паддинги */
  .sets .set-product{
    padding:12px 14px !important;
  }

  /* название товара меньше чтобы помещалось в 2 строки */
  .sets .set-product h4{
    font-size:16px !important;
    line-height:1.2 !important;
    -webkit-line-clamp: 2 !important;
    height:auto !important;
  }

  /* price чуть меньше тоже */
  .sets .set-product .price-new,
  .sets .set-product .price-actual{
    font-size:20px !important;
  }
}

/* === Mobile: шире карточки + заголовок ровно в 2 строки === */
@media (max-width: 767px){

  /* сужаем внутренние отступы всего блока наборов */
  #prd-sets{ padding-left:8px !important; padding-right:8px !important; }



  /* карточка — компактные паддинги, никаких внешних отступов */
  .sets .set-product{
    margin:0 !important;
   
    width:100% !important;            /* на всю доступную ширину контейнера */
    max-width:none !important;
  }

  /* картинка поменьше → больше места под текст */
  .sets .set-product .image{
    width:68px !important; height:68px !important;
  }

  /* заголовок: 2 строки, без жёсткой высоты */
  .sets .set-product h4{
    font-size:15px !important;
    line-height:1.25 !important;
    height:auto !important;
    display:-webkit-box !important;
    -webkit-line-clamp:2 !important;   /* ровно две строки */
    -webkit-box-orient:vertical !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    margin:0 !important;
  }

  /* чуть меньше разрыв между картинкой и текстом */
  .sets .set-product{ gap:12px !important; }
}

/* Растягиваем блок наборов на ту же ширину, что и контент */
#prd-sets{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* У обёртки слайда тоже без внутренних отступов */
.swiper-slide.set.seth{
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Таблицу/список не центрируем, а тянем на всю ширину */
.sets .set_table{
  justify-content: stretch !important;
  align-items: stretch !important;
  width: 100% !important;
  padding: 0 !important;
}

/* Карточки без внешних полей по бокам — ширина 100% */
.sets .set-product,
.sets .set-total{
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: none !important;
}

/* Мобилка: чтобы точно совпало с шириной контента */
@media (max-width: 767px){
  #prd-sets{ padding:0 !important; }
  .swiper-slide.set.seth{ padding:0 !important; }
}

/* 1) Не обрезаем содержимое карточки-обёртки */
.swiper-slide.set.seth{
  overflow: visible !important;
}

/* 2) Даём заголовку безопасный внутренний отступ */
.seth > h3{
  padding-left: 12px !important;
  padding-right: 12px !important;
}

/* убрать тень под кнопкой "Купити комплект" */
.sets .set-total .add-set-btn,
.sets .set-total .add-set-btn:hover,
.sets .set-total .add-set-btn:focus,
.sets .set-total .add-set-btn:active {
  box-shadow: none !important;
  filter: none !important;
}

/* если тема рисует свечение через псевдо-элементы */
.sets .set-total .add-set-btn::before,
.sets .set-total .add-set-btn::after {
  content: none !important;
}

/* больше отступ после блока "Разом дешевше" */
#prd-sets{
  margin-bottom: 32px !important;
}
@media (max-width: 767px){
  #prd-sets{ margin-bottom: 32px !important; }
}

