/*
 * ideaplgnnewst134 — Kategori sayfası 1400px + vitrin/detay görsel oranı eşitleme
 *
 * 1) Kategori (ve mağaza) arşivi içeriği en fazla 1400px olur (yalnızca >=1200px).
 *    Daha dar ekranlarda temanın kendi Bootstrap container'ı aynen çalışır.
 * 2) Ürün detay ana görseli baz alınır (4:3). Anasayfa / kategori / ilgili ürün
 *    vitrin kartlarındaki görsel de aynı orana (4:3) getirilir.
 * 3) Görseller çerçeveyi tam doldurur (cover): beyaz boşluk kalmaz, görsel
 *    ASLA gerilmez/bozulmaz (oran korunur). Kaynak görsel 4:3 ise hiç kırpılmaz.
 *
 * Tüm yeni class / değişken adları "ideaplgnnewst134" önekini taşır.
 */
:root{
  --ideaplgnnewst134_ratio: 4 / 3;
}

/* ---------- 1) Kategori sayfası: 1400px ---------- */
@media (min-width:1200px){
  body.ideaplgnnewst134_wide .ideaplgnnewst134_container{
    max-width:1400px;
    padding-left:24px;
    padding-right:24px;
  }
}

/* Geniş ekranda kart içeriği de kartla birlikte orantılı büyür (yalnız arşiv). */
@media (min-width:1400px){
  body.ideaplgnnewst134_wide .czgb-dp-card{ padding:14px; }
  body.ideaplgnnewst134_wide .czgb-dp-title{ font-size:17px; min-height:46px; }
  body.ideaplgnnewst134_wide .czgb-dp-cat,
  body.ideaplgnnewst134_wide .czgb-dp-sales,
  body.ideaplgnnewst134_wide .czgb-dp-rating-count{ font-size:14px; }
  body.ideaplgnnewst134_wide .czgb-dp-price-now{ font-size:18px; }
  body.ideaplgnnewst134_wide .czgb-dp-demo{ font-size:14px; padding:10px 20px; }
  body.ideaplgnnewst134_wide .czgb-dp-stars svg{ width:15px; height:15px; }
}

/* ---------- 2) Vitrin kartı görseli: ürün detayla aynı oran ---------- */
.czgb-dp-card .czgb-dp-media{
  aspect-ratio:var(--ideaplgnnewst134_ratio);
}
.czgb-dp-card .czgb-dp-media > a:not(.czgb-dp-wish){
  position:absolute; inset:0; display:block;
}
/* Favori (kalp) butonu: her zaman görselin SAĞ ÜSTÜNDE, görsel linkinin üstünde */
.czgb-dp-card .czgb-dp-media > a.czgb-dp-wish{
  position:absolute;
  top:10px; right:10px; left:auto; bottom:auto;
  width:32px; height:32px;
  z-index:5;
}
.czgb-dp-card .czgb-dp-media img{
  position:absolute; inset:0;
  width:100%; height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center;
  padding:0; margin:0;
  display:block;
}

/* ---------- 3) Ürün detay ana görseli: boşluksuz tam oturma ---------- */
.ideappdn_pg-main{
  aspect-ratio:var(--ideaplgnnewst134_ratio);
}
@media (min-width:721px) and (max-width:1040px){
  .ideappdn_pg-main{ aspect-ratio:var(--ideaplgnnewst134_ratio); }
}
.ideappdn_pg-main img.ideappdn_scene-img{
  object-fit:cover;
  object-position:center;
  padding:0;
}

/* ---------- 4) Vitrin fiyat renkleri ---------- */
.czgb-dp-card .czgb-dp-price-now{ color:#7c6cff; }
.czgb-dp-card .czgb-dp-price-now.ideaplgnnewst134_sale{ color:#eb5154; }

/* ---------- 5) Ürün detay: görselin sağ üstünde favori ikonu ---------- */
.ideappdn_pg-main .ideaplgnnewst134_detail_wish{
  position:absolute;
  top:14px; right:14px; left:auto; bottom:auto;
  width:40px; height:40px;
  z-index:6;
  cursor:pointer;
}
.ideappdn_pg-main .ideaplgnnewst134_detail_wish svg{ width:19px; height:19px; }
@media (max-width:720px){
  .ideappdn_pg-main .ideaplgnnewst134_detail_wish{ top:10px; right:10px; width:36px; height:36px; }
}

/* ---------- 6) Sepet "Cart totals" kartı: üst renkli şerit ----------
 * ESKİ HATA: 4px'lik şeride 20px köşe yarıçapı verilmişti; şerit kartın
 * 1px kenarlığının İÇİNDE kaldığı ve yükseği yarıçaptan küçük olduğu için
 * köşelerde kartın kavisini takip etmeden "yassı" bir yay çiziyordu.
 * ÇÖZÜM: Şerit, kartın kendi kavisli şeklinin tamamını kaplayan bir
 * katman olur ve maske ile sadece ÜST 4px gösterilir; böylece köşelerde
 * kartın kenarını birebir izler (overflow:hidden gerekmez). */
.ideaplgn_sp .ideaplgn_sp-card::before{
  top:-1px; left:-1px; right:-1px; bottom:-1px;
  height:auto;
  border-radius:inherit;
  background:var(--ideaplgn_grad);
  -webkit-mask:linear-gradient(#000 0 0) top / 100% 5px no-repeat;
          mask:linear-gradient(#000 0 0) top / 100% 5px no-repeat;
  pointer-events:none;
}

/* ---------- 7) Ürün detay: fiyat / sepete ekle kutusunun üst şeridi ----------
 * Alttaki "100% Secure Payment" güven kutusundaki şeridin aynısı. */
.ideappdn_buybox{ position:relative; }
.ideappdn_buybox::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0; bottom:0;
  border-radius:inherit;
  background:var(--ideappdn-grad);
  opacity:.9;
  -webkit-mask:linear-gradient(#000 0 0) top / 100% 3px no-repeat;
          mask:linear-gradient(#000 0 0) top / 100% 3px no-repeat;
  pointer-events:none;
  z-index:1;
}

/* ---------- 8) Add to Cart butonları: bag ikonu + "Product in Your Cart" ---------- */
.ideaplgnnewst134_btn-inner{
  display:inline-flex; align-items:center; justify-content:center; gap:18px;
  max-width:100%;
}
/* ikon: bag ve check aynı hücrede üst üste */
.ideaplgnnewst134_ico{
  display:inline-grid; flex:none;
  width:24px; height:24px;
  margin:-4px 0;            /* ikon büyür ama butonun yüksekliğini değiştirmez */
}
.ideaplgnnewst134_ico > svg{
  grid-area:1 / 1;
  width:24px; height:24px;
  transition:transform .45s cubic-bezier(.34,1.56,.64,1), opacity .25s ease;
  transform-origin:50% 60%;
}
.ideaplgnnewst134_ico-check{ opacity:0; transform:scale(.3) rotate(-25deg); }
.ideaplgnnewst134_ico-check path{ stroke-dasharray:26; stroke-dashoffset:26; }

/* etiket: aynı anda yalnızca biri yer kaplar; ikon her zaman yazıya bitişik kalır */
.ideaplgnnewst134_lbl{ display:inline-block; text-align:center; overflow:hidden; white-space:nowrap; }
.ideaplgnnewst134_lbl-done{ display:none; }
@keyframes ideaplgnnewst134_in{
  from{ opacity:0; transform:translateY(60%); }
  to{ opacity:1; transform:translateY(0); }
}
.ideaplgnnewst134_lbl-default{ display:inline-block; }

/* hover: çanta hafifçe yukarı sallanır */
.ideappdn_add-to-cart-btn:hover .ideaplgnnewst134_ico-bag{
  animation:ideaplgnnewst134_wiggle .55s ease;
}
@keyframes ideaplgnnewst134_wiggle{
  0%{transform:translateY(0) rotate(0);}
  30%{transform:translateY(-3px) rotate(-10deg);}
  60%{transform:translateY(0) rotate(8deg);}
  100%{transform:translateY(0) rotate(0);}
}

/* AJAX sürerken: çanta zıplar */
.ideappdn_add-to-cart-btn.ideappdn_loading .ideaplgnnewst134_ico-bag{
  animation:ideaplgnnewst134_bounce .6s ease-in-out infinite;
}
@keyframes ideaplgnnewst134_bounce{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-4px);}
}

/* Sepete eklendi durumu */
.ideappdn_add-to-cart-btn.ideaplgnnewst134_is-added .ideaplgnnewst134_ico-bag{
  opacity:0; transform:scale(.3) translateY(6px); animation:none;
}
.ideappdn_add-to-cart-btn.ideaplgnnewst134_is-added .ideaplgnnewst134_ico-check{
  opacity:1; transform:scale(1) rotate(0);
}
.ideappdn_add-to-cart-btn.ideaplgnnewst134_is-added .ideaplgnnewst134_ico-check path{
  animation:ideaplgnnewst134_draw .5s .12s ease forwards;
}
@keyframes ideaplgnnewst134_draw{ to{ stroke-dashoffset:0; } }
.ideappdn_add-to-cart-btn.ideaplgnnewst134_is-added .ideaplgnnewst134_lbl-default{ display:none; }
.ideappdn_add-to-cart-btn.ideaplgnnewst134_is-added .ideaplgnnewst134_lbl-done{
  display:inline-block;
  animation:ideaplgnnewst134_in .4s cubic-bezier(.22,1,.36,1);
}
.ideappdn_add-to-cart-btn.ideaplgnnewst134_is-added{
  animation:ideaplgnnewst134_pop .5s cubic-bezier(.34,1.56,.64,1);
}
@keyframes ideaplgnnewst134_pop{
  0%{transform:scale(1);} 40%{transform:scale(1.04);} 100%{transform:scale(1);}
}

/* Dar alanlarda (sabit alt bar) metin taşmasın */
@media (max-width:560px){
  .ideaplgnnewst134_btn-inner{ gap:12px; }
  .ideaplgnnewst134_ico, .ideaplgnnewst134_ico > svg{ width:21px; height:21px; }
}

@media (prefers-reduced-motion:reduce){
  .ideaplgnnewst134_ico > svg,
  .ideappdn_add-to-cart-btn.ideaplgnnewst134_is-added .ideaplgnnewst134_lbl-done{ animation:none; }
  .ideappdn_add-to-cart-btn:hover .ideaplgnnewst134_ico-bag,
  .ideappdn_add-to-cart-btn.ideappdn_loading .ideaplgnnewst134_ico-bag,
  .ideappdn_add-to-cart-btn.ideaplgnnewst134_is-added{ animation:none; }
  .ideappdn_add-to-cart-btn.ideaplgnnewst134_is-added .ideaplgnnewst134_ico-check path{ animation:none; stroke-dashoffset:0; }
}

/* ---------- 9) Lightbox: sürükle/kaydır + thumb şeridi ---------- */
#ideappdn_lbImageWrap{
  touch-action:pan-y;              /* yatay hareketi JS alır, dikey kaydırma bozulmaz */
  cursor:grab;
  user-select:none; -webkit-user-select:none;
  will-change:transform;
}
#ideappdn_lbImageWrap:active{ cursor:grabbing; }
#ideappdn_lbImageWrap img{ -webkit-user-drag:none; user-select:none; -webkit-user-select:none; }

.ideaplgnnewst134_in-next{ animation:ideaplgnnewst134_inNext .35s cubic-bezier(.22,1,.36,1); }
.ideaplgnnewst134_in-prev{ animation:ideaplgnnewst134_inPrev .35s cubic-bezier(.22,1,.36,1); }
@keyframes ideaplgnnewst134_inNext{ from{ opacity:0; transform:translateX(60px); } to{ opacity:1; transform:translateX(0); } }
@keyframes ideaplgnnewst134_inPrev{ from{ opacity:0; transform:translateX(-60px); } to{ opacity:1; transform:translateX(0); } }

.ideappdn_lb-thumbs{
  cursor:grab;
  touch-action:pan-x;
  scrollbar-width:none;
  -ms-overflow-style:none;
  user-select:none; -webkit-user-select:none;
}
.ideappdn_lb-thumbs::-webkit-scrollbar{ display:none; width:0; height:0; }
.ideappdn_lb-thumbs .ideappdn_lb-thumb img{ -webkit-user-drag:none; }
.ideappdn_lb-thumbs.ideaplgnnewst134_grabbing{ cursor:grabbing; scroll-snap-type:none; }

@media (prefers-reduced-motion:reduce){
  .ideaplgnnewst134_in-next, .ideaplgnnewst134_in-prev{ animation:none; }
}
