
.pc-s4.product-card-wrapper{
  --otc-card-w:330px;    --otc-img-w:446px;  --otc-img-h:446px;}.pc-s4.product-card-wrapper{width:330px;max-width:100%;}@media (min-width:1367px){
  .pc-s4.product-card-wrapper{
    --otc-card-w:330px;    --otc-card-h:510px;          }  .pc-s4.product-card-wrapper{width:330px;max-width:100%;}      }
@media (min-width:992px) and (max-width:1366px){
  .pc-s4.product-card-wrapper{
    --otc-card-w:403px;        --otc-img-w:403px;    --otc-img-h:403px;  }  .pc-s4.product-card-wrapper{width:403px;max-width:100%;}        .pc-s4 .product-card-rating__product-img{aspect-ratio:403 / 403;}
  }
@media (min-width:501px) and (max-width:991px){
  .pc-s4.product-card-wrapper{
    --otc-card-w:446px;        --otc-img-w:446px;    --otc-img-h:446px;  }  .pc-s4.product-card-wrapper{width:446px;max-width:100%;}        .pc-s4 .product-card-rating__product-img{aspect-ratio:446 / 446;}
  }
@media (max-width:500px){
  .pc-s4.product-card-wrapper{
    --otc-card-w:172px;    --otc-card-h:303px;    --otc-img-w:172px;    --otc-img-h:200px;  }  .pc-s4.product-card-wrapper{width:172px;max-width:100%;}        .pc-s4 .product-card-rating__product-img{aspect-ratio:172 / 200;}
  }
.pc-s4.product-card-wrapper{background:#FFFFFF;}.pc-s4.product-card-wrapper{border-radius:10px;}.pc-s4 .product-card-rating__product-img{border-radius:var(--otc-card-radius,10px) !important;overflow:hidden;}.pc-s4 .product-card-rating__descr{padding:0px;}.pc-s4 .product-card-rating__descr{gap:10px;display:flex;flex-direction:column;}.pc-s4.product-card-wrapper{gap:10px;display:flex;flex-direction:column;}.pc-s4 .product-card-rating__title{color:#252525;}.pc-s4 .product-card-rating__title{font-size:14px;}.pc-s4 .price-new{color:#222222;}.pc-s4 .price-new.price-new--actual-special{color:#577B28 !important;}.pc-s4 .price-new{font-size:20px;}.pc-s4 .price-old{color:#7D7D7D;}.pc-s4 .price-old{font-size:14px;}.pc-s4 .product-card-rating__sku{color:#717171;}.pc-s4 .product-card-rating__stock{color:#0FA379;}.pc-s4 .product-card-rating__stock,.pc-s4 .product-card-rating__restock{font-size:12px;}.pc-s4 .product-card-rating__restock{color:#961885;}.pc-s4 .product-card-rating__freeship{color:#0FA379;}.pc-s4 .product-card-rating__review-count,.pc-s4 .product-card-rating__review-icon{color:#999999;}.pc-s4 .product-card-rating__btns .btn{background:#332723;}.pc-s4 .product-card-rating__btns .btn{color:#FFFFFF;}.pc-s4 .product-card-rating__btns .btn:hover{background:#4A3A33;}.pc-s4 .product-card-rating__btns .btn{border-radius:8px;}.pc-s4 .product-card-rating__product-img img{border-radius:inherit;}
.pc-s4 .product-card-rating__product-img{aspect-ratio:446 / 446;}
.pc-s4 .product-card-rating__product-img{background:#FFFFFF;--otc-card-img-bg:#FFFFFF;}.pc-s4 .product-card-rating__icons-btns .stats-btn{display:none!important;}.pc-s4 .product-card-rating__icons-btns{
top:8px;right:12px;left:auto;bottom:auto;
}
.pc-s4 .product-card-rating__icons-btns .icon-btn,
.pc-s4 .product-card-rating__icons-btns button{width:30px;height:30px;}
.pc-s4 .product-card-rating__icons-btns .icon-btn svg{width:30px;height:30px;}
.pc-s4 .product-card-rating__icons-btns .icon-btn,
.pc-s4 .product-card-rating__icons-btns button{border:1px solid #DDDDDD;}
.pc-s4 .product-card-rating__icons-btns .icon-btn,
.pc-s4 .product-card-rating__icons-btns button{box-shadow:0 2px 6px rgba(0,0,0,.08);}
.pc-s4 .product-card-rating__icons-btns .icon-btn,
.pc-s4 .product-card-rating__icons-btns button{background:#FFFFFF;}.pc-s4 .product-card-rating__icons-btns .icon-btn:hover,
.pc-s4 .product-card-rating__icons-btns .like-btn.active-like,
.pc-s4 .product-card-rating__icons-btns .stats-btn.active-like{color:#EC2424!important;}
.pc-s4 .product-card-rating__icons-btns .icon-btn:hover,
.pc-s4 .product-card-rating__icons-btns .like-btn.active-like,
.pc-s4 .product-card-rating__icons-btns .stats-btn.active-like{background:#FFFFFF!important;}
.pc-s4 .product-card-rating__sku{display:none!important;}.pc-s4 .product-card-rating__footer{display:none!important;}.pc-s4 .pc-price-btn-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:0;}
.pc-s4 .pc-price-btn-row .product-card-rating__price{flex:1 1 auto;min-width:0;}
.pc-s4 .pc-price-btn-row .product-card-rating__footer{flex:0 0 auto;width:auto;margin:0;padding:0;}
.pc-s4 .pc-price-btn-row .product-card-rating__btns{width:auto;}
.pc-s4 .pc-price-btn-row .product-card-rating__btns .btn{width:auto!important;height:48px!important;padding:0 16px!important;display:flex!important;align-items:center;justify-content:center;}
@media (max-width:500px){.pc-s4 .pc-price-btn-row .product-card-rating__btns .btn{height:32px!important;padding:0 12px!important;}}
.pc-s4 .product-card-rating__btns .btn .otc-cart-icon-img{filter:brightness(0) invert(1);}
.pc-s4.pc-oos--gray .product-card-rating__btns,
.pc-s4.pc-oos--gray-text .product-card-rating__btns{
  --otc-cart-btn-bg:#B9B9B9;
  --otc-cart-btn-hover-bg:#B9B9B9;
  --otc-cart-btn-text:#FFFFFF;
}
.pc-s4.pc-oos--gray .product-card-rating__btns .btn.btn-custom,
.pc-s4.pc-oos--gray-text .product-card-rating__btns .btn.btn-custom,
.pc-s4.pc-oos--gray .product-card-rating__btns .btn,
.pc-s4.pc-oos--gray-text .product-card-rating__btns .btn{
  background:#B9B9B9!important;background-color:#B9B9B9!important;
  color:#FFFFFF!important;
  pointer-events:none;cursor:default;
}
.pc-s4.pc-oos--gray .product-card-rating__btns .btn .otc-cart-icon-img,
.pc-s4.pc-oos--gray-text .product-card-rating__btns .btn .otc-cart-icon-img{filter:grayscale(1) brightness(4);}
/* Доп. hover ефект — «Слабка тінь на зображенні»: рівномірна м'яка тінь по периметру,
   1:1 як в Etsy (.v2-listing-card__img:hover → box-shadow:0 0 8px #0003,
   transition box-shadow .2s ease-in-out). #0003 = rgba(0,0,0,.2).
   Тінь на КОНТЕЙНЕРІ .product-card-rating__product-img (не на <img>).
   ВАЖЛИВО: щоб тінь було ВИДНО, її НЕ мають обрізати батьківські контейнери картки.
   `.product-card-rating` має ГЛОБАЛЬНИЙ overflow:hidden (cards.css) + `__image-area`
   теж буває overflow:hidden — вони кліпали 8px-тінь (не було видно на головній/в попапі
   кошика). Тому scoped-розкліпуємо ЦІ два контейнери саме для карток з shadow-ефектом
   (скоуп `.{_pcScope}` + гейт `_ot_hover_extra=='shadow'` → безпечно, лише shadow-картки).
   Сама картинка лишає власний overflow:hidden (скруглення/зум) → нічого не тече. */
.pc-s4 .product-card-rating,
.pc-s4 .product-card-rating__image-area{overflow:visible !important;}
.pc-s4 .product-card-rating__product-img{transition:box-shadow .2s ease-in-out;}
.pc-s4.product-card-wrapper:hover .product-card-rating__product-img{box-shadow:0 0 8px rgba(0,0,0,.2);}
/* Out-of-stock visual effect (admin "Картка товара → Дизайн та стилі → Ефект Stock status").
   .pc-oos          = base marker (out of stock)
   .pc-oos--gray    = image grayscale only
   .pc-oos--gray-text = image grayscale + text/price dimmed to gray */
.pc-s4.pc-oos--gray .product-card-rating__product-img img,
.pc-s4.pc-oos--gray-text .product-card-rating__product-img img,
.pc-s4.pc-oos--gray .product-card-rating .pc-gallery__img,
.pc-s4.pc-oos--gray-text .product-card-rating .pc-gallery__img{
  filter:grayscale(100%);
  -webkit-filter:grayscale(100%);
}
.pc-s4.pc-oos--gray-text .product-card-rating__name,
.pc-s4.pc-oos--gray-text .product-card-rating__price,
.pc-s4.pc-oos--gray-text .product-card-rating__price .price-new,
.pc-s4.pc-oos--gray-text .product-card-rating__price .price-old,
.pc-s4.pc-oos--gray-text .product-card-rating__sku,
.pc-s4.pc-oos--gray-text .product-card-rating__rating-value,
.pc-s4.pc-oos--gray-text .product-card-rating__review-count,
.pc-s4.pc-oos--gray-text .product-card-rating__stars{
  color:#9a9a9a !important;
}
.pc-s4.pc-oos--gray-text .product-card-rating__stars i,
.pc-s4.pc-oos--gray-text .product-card-rating__star{
  color:#c4c4c4 !important;
}


  #otb-swiper-19{
    max-width:320px;    margin-left:auto;margin-right:auto;
  }
  /* 1:1 с admin Live Preview: канвас редактора (.otb-canvas) имеет border 3px
     (box-sizing:border-box → внутренняя ширина = canvas−6), и все %-позиции/ширины
     элементов считаются от ЭТОЙ внутренней ширины. На фронте .otb-slide был без
     бордера (%-база = полная ширина) → элементы пропорционально «съезжали» (тем
     заметнее, чем шире плашка / длиннее текст, напр. UK-заголовок). Даём слайду
     тот же прозрачный 3px-инсет — %-база становится идентичной редактору.
     Фон тянется под бордер (background-clip:border-box), рамки не видно. */
  #otb-swiper-19 .otb-slide{border:3px solid transparent;box-sizing:border-box;}
    @media (min-width:577px) and (max-width:991px){
    #otb-swiper-19{ max-width:320px; }
  }
  @media (max-width:576px){
    #otb-swiper-19{ max-width:172px; }
  }
                

      #otb-swiper-19{box-shadow:0 0 0 1px #DDDDDD;}
      .featured-plus__banner:has(#otb-swiper-19),
      .fplus-banner-mobcell:has(#otb-swiper-19){box-shadow:0 0 0 1px #DDDDDD;}
    

      #otb-swiper-19{border-radius:8px;overflow:hidden;}
    
