/* datatechshop — urun satirlarina imlec efekti (2026-08-25)
 *
 * Kullanici istegi: liste/fiyat gorunumunde ve aramada, imlec modelin
 * ustune gelince hafif animasyon + hafif koyuluk + cok hafif lavanta.
 *
 * Bu dosya magaza paketinin ICINDE DEGIL: nginx sayfaya <link> ile
 * enjekte ediyor (bkz /etc/nginx/sites-available/datatechshop).
 * Sebep: .next icine yeni dosya koymak `docker restart` gerektiriyor,
 * restart alinamazsa magaza beyaz ekrana dusuyor.
 *
 * Sinif adlari derlemede hash'lendigi icin [class*="..."] ile secilir;
 * paket yeniden derlense de tutar.
 *   Index_productContainer__  -> liste/fiyat gorunumu satiri (+ sepet satiri)
 *   ProductList_productMain__ -> kart (grid) gorunumu
 *   SearchResult_resultItem__ -> ust aramadaki sonuc satiri
 *
 * ⚠️ Arama satirinda !important SART: yayindaki pakette o satir
 * style={{backgroundColor:"#ffffff", boxShadow:...}} ile INLINE
 * boyaniyor, inline stil :hover kuralini ezer.
 */

@media (hover: hover) {
  [class*="Index_productList__"] [class*="Index_productContainer__"],
  [class*="ProductList_productMain__"],
  [class*="SearchResult_resultItem__"] {
    border-radius: 8px;
    transition: background-color .25s ease-in-out,
                box-shadow .25s ease-in-out,
                transform .25s ease-in-out;
  }

  /* Liste / fiyat gorunumu satiri + kart gorunumu */
  [class*="Index_productList__"] [class*="Index_productContainer__"]:hover,
  [class*="ProductList_productMain__"]:hover {
    background-color: #f6f4fd;                        /* cok hafif lavanta */
    box-shadow: 0 6px 16px rgba(93, 62, 188, .10);    /* hafif koyuluk */
    transform: translateY(-1px);
  }

  /* Arama sonucu satiri */
  [class*="SearchResult_resultItem__"]:hover {
    background-color: #f6f4fd !important;
    box-shadow: 0 6px 16px rgba(93, 62, 188, .10) !important;
    transform: translateY(-1px);
  }
}

/* Hareketi azalt tercihi acikken sadece renk degisir */
@media (prefers-reduced-motion: reduce) {
  [class*="Index_productList__"] [class*="Index_productContainer__"],
  [class*="ProductList_productMain__"],
  [class*="SearchResult_resultItem__"] {
    transition: none;
    transform: none;
  }
}

/* ══════════════════════════════════════════════════════════════════
   KATEGORI PANELI — kart izgarasi gorunumu (2026-08-27)
   Kullanici Apex'teki sol panelin gorunumunu istedi ("bu kisim gibi olucak").
   Paket YAMALANMADI: ayni DOM, sadece stil. Geri almak = bu blogu silmek.
   Secicilerde hash YOK ([class*="..."]) — paket yeniden derlense de tutar.
   ══════════════════════════════════════════════════════════════════ */

/* Ust seviye kategoriler: alt alta liste yerine 2 sutunlu kart izgarasi */
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"] > [class*="Categories_collapse__"] {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"] > [class*="Categories_collapse__"] > [class*="Categories_panel__"] {
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  background: #fff !important;
  overflow: hidden !important;
  min-width: 0 !important;
  align-self: start !important;
}

/* Acik kategori: sadece cerceve vurgusu.
   (Eskiden tam satiri kapliyordu; alt seriler sol panelden kaldirilinca
   kaplayacak icerik kalmadi — kullanici 2026-08-27: "alta gerek kalmadi".) */
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"] > [class*="Categories_collapse__"] > [class*="Categories_panel__"]:has(> [class*="Categories_panelBody__"]) {
  border-color: #0071C5 !important;
}

[class*="Categories_wrapper__"] [class*="Categories_panelHeader__"] {
  padding: 9px 10px !important;
  gap: 8px !important;
  border-radius: 9px !important;
  align-items: center !important;
}

[class*="Categories_wrapper__"] [class*="Categories_name__"] {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  color: #1f2937 !important;
}

[class*="Categories_wrapper__"] [class*="Categories_imageWrapper__"] { flex: 0 0 auto !important; margin: 0 !important; }
[class*="Categories_wrapper__"] [class*="Categories_image__"] {
  width: 20px !important; height: 20px !important; object-fit: contain !important;
}

/* Alt seriler: dikey liste degil, saran cipler */
[class*="Categories_wrapper__"] [class*="Categories_panelBody__"] {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 2px 10px 10px !important;
}

[class*="Categories_wrapper__"] [class*="Categories_panelBody__"] > [class*="Categories_panel__"] {
  border: 1px solid #e5e7eb !important;
  border-radius: 999px !important;
  background: #fff !important;
  width: auto !important;
  margin: 0 !important;
  overflow: visible !important;
}

[class*="Categories_wrapper__"] [class*="Categories_panelBody__"] [class*="Categories_subLink__"] {
  padding: 5px 11px !important;
  width: auto !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

[class*="Categories_wrapper__"] [class*="Categories_panelBody__"] [class*="Categories_name__"] {
  font-size: 12px !important;
  font-weight: 500 !important;
}

[class*="Categories_wrapper__"] [class*="Categories_panelBody__"] [class*="Categories_subArrow__"] { display: none !important; }

/* Secili seri: dolu cip */
[class*="Categories_wrapper__"] [class*="Categories_panelBody__"] > [class*="Categories_panel__"][class*="Categories_active__"] {
  background: #0071C5 !important;
  border-color: #0071C5 !important;
}
[class*="Categories_wrapper__"] [class*="Categories_panelBody__"] > [class*="Categories_panel__"][class*="Categories_active__"] [class*="Categories_name__"] {
  color: #fff !important;
  font-weight: 700 !important;
}

/* Bolum basliklari: kucuk, gri, harf arali (KATEGORILER / STOK DURUMU / TIP) */
[class*="Categories_wrapper__"] [class*="Categories_category__"] [class*="Categories_title__"] {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #9ca3af !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  margin-top: 14px !important;
}

/* ── Kart ici duzeni: logo | ad | ok (2026-08-27 duzeltme turu) ── */
[class*="Categories_wrapper__"] [class*="Categories_link__"]{ width:100% !important; min-width:0 !important; }
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"] > [class*="Categories_collapse__"] > [class*="Categories_panel__"] [class*="Categories_panelHeader__"]{
  display:flex !important; align-items:center !important; justify-content:flex-start !important;
  min-height:46px !important; box-sizing:border-box !important; width:100% !important; min-width:0 !important;
}
[class*="Categories_wrapper__"] [class*="Categories_imageWrapper__"]{
  width:26px !important; height:26px !important; flex:0 0 26px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}
[class*="Categories_wrapper__"] [class*="Categories_text__"]{ flex:1 1 auto !important; min-width:0 !important; }
/* uzun kategori adi kartı tasirmaz */
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"] > [class*="Categories_collapse__"] > [class*="Categories_panel__"] [class*="Categories_name__"]{
  overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; display:block !important;
}
/* ok: sabit boyut, saga yasli, asla kesilmez */
[class*="Categories_wrapper__"] [class*="Categories_arrow__"]{
  flex:0 0 16px !important; margin-left:auto !important; width:16px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}
[class*="Categories_wrapper__"] [class*="Categories_arrow__"] svg{ width:13px !important; height:13px !important; }

/* Renkler: lavanta yerine Apex'in turuncu tonu */
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"] > [class*="Categories_collapse__"] > [class*="Categories_panel__"] [class*="Categories_panelHeader__"]:hover{
  background:#fff8ec !important;
}
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"] > [class*="Categories_collapse__"] > [class*="Categories_panel__"][class*="Categories_active__"] [class*="Categories_panelHeader__"]{
  background:#fff8ec !important;
}
/* alt seri cipleri kart kurallarindan etkilenmesin */
[class*="Categories_wrapper__"] [class*="Categories_panelBody__"] [class*="Categories_subLink__"]{
  min-height:0 !important; display:flex !important; align-items:center !important;
}
[class*="Categories_wrapper__"] [class*="Categories_panelBody__"] [class*="Categories_name__"]{
  white-space:nowrap !important; overflow:visible !important;
}

/* ── URUN LISTESI UST SERIDI (dts-ust-serit.js ile eklenir) ────── */
.dts-ust-serit{ font-family:Arial,Helvetica,sans-serif; padding:2px 0 12px; }
.dts-serit-ust{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:9px; }
.dts-serit-ad{ font-weight:700; font-size:17px; color:#1f2937; }
.dts-serit-adet{ color:#6b7280; font-size:13px; }
.dts-cipler{ display:flex; flex-wrap:wrap; gap:7px; }
.dts-cip{
  display:inline-flex; align-items:center; padding:6px 13px;
  border:1px solid #e5e7eb; border-radius:999px; background:#fff;
  color:#374151; font-size:12.5px; font-weight:500; text-decoration:none;
  cursor:pointer; transition:background-color .15s, border-color .15s;
}
.dts-cip:hover{ background:#f9fafb; border-color:#d1d5db; }
.dts-cip.aktif{ background:#0071C5; border-color:#0071C5; color:#fff; font-weight:700; }
@media (max-width:768px){
  .dts-serit-ad{ font-size:15px; }
  .dts-cipler{ flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; -webkit-overflow-scrolling:touch; }
  .dts-cip{ flex:0 0 auto; }
}


/* ── Sol paneldeki alt seri cipleri KALDIRILDI (2026-08-27) ──────
   Ayni cipler artik urun listesinin ustundeki seritte (dts-ust-serit.js).
   Iki yerde birden durmalari gereksizdi — kullanici: "alta gerek kalmadi".
   Acilir ok da gizlendi: acacagi icerik kalmadigi icin bos bir dugme
   gibi duruyordu. Kart artik dogrudan o kategoriye goturuyor. */
[class*="Categories_wrapper__"] [class*="Categories_panelBody__"]{ display:none !important; }
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"] > [class*="Categories_collapse__"] > [class*="Categories_panel__"] [class*="Categories_arrow__"]{
  display:none !important;
}

/* ── "Tum Urunler" karti (dts-ust-serit.js ekler) ──────────────── */
.dts-tum-urunler{
  grid-column:1 / -1 !important;
  display:flex; align-items:center; gap:9px;
  padding:11px 12px; margin-bottom:2px;
  border:1px solid #e5e7eb; border-radius:10px; background:#fff;
  text-decoration:none; color:#1f2937; font-family:Arial,Helvetica,sans-serif;
  font-size:13px; font-weight:700; transition:background-color .15s, border-color .15s;
}
.dts-tum-urunler:hover{ background:#fff8ec; border-color:#0071C5; }
.dts-tum-urunler.aktif{ background:#fff8ec; border-color:#0071C5; }
.dts-tu-ikon{ display:flex; align-items:center; justify-content:center; width:26px; height:26px; flex:0 0 26px;
  border-radius:7px; background:#fff3d6; }
.dts-tu-ikon svg{ fill:#0071C5; }
.dts-tu-ad{ flex:1 1 auto; min-width:0; }
.dts-tu-adet{ color:#9ca3af; font-size:12px; font-weight:600; }

/* Tum Urunler gorunumunde serit urun listesinin ICINE giriyor; o kutu
   flex-column + align-items:center oldugu icin serit ortalanip daralıyordu.
   Tam genislik + sola yaslama: */
[class*="Index_productList__"] > .dts-ust-serit{
  align-self:stretch; width:100%; box-sizing:border-box;
  padding-left:14px; padding-right:14px; padding-top:12px;
}

/* ═══════════════════════════════════════════════════════════════════════
   APPLE TASARIM KATMANI  (2026-08-28)

   Kullanici: *"logoyu degistirme, siteyi logoya uyarli yapacagiz"* +
   *"apple seyi gibi olsun"*.

   ⚠️ ILKE: Apple arayuzu RENKLI DEGIL NOTRDUR. Renk yalnizca dokunulacak
   yerde durur (sepete ekle, secili cip, birincil dugme). Ilk denemede
   sitenin yesili maviyle degistirilmisti — kullanici *"bu seferde cok mavi
   olmus"* dedi, hakliydi. Zemin/kart/metin notr; mavi sadece eylemde.

   Palet logodan: #0071C5 (nokta formunun ana mavisi), notr griler Apple
   olceginden (#1D1D1F / #6E6E73 / #F5F5F7 / rgba(0,0,0,.09)).
   Durum renkleri Apple sistem tonlari — marka rengiyle karistirilmaz.

   Geri almak: bu blogu sil + `systemctl reload nginx` gerekmez (dosya
   dogrudan servis ediliyor). Oncesi: uzerine-gelme-apple-oncesi.css
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  /* ── PALET (2026-08-28) — hepsi logodan turetildi ──────────────────
     Kullanici: "adam akilli bir renkler eklemek lazim". Tek bir mavi
     her yuzeye yayilinca ekran monoton ve "cok mavi" oluyordu; ton
     ayrimi yapildi:
       DERIN  #12307E  ust bar, agir yuzeyler   (logonun laciverti)
       MARKA  #0071C5  eylem, secili durum      (logonun ana mavisi)
       ACIK   #2BB3EE  ikon zemini, ince vurgu  (logonun acik ucu)
       SICAK  #C77700  "yeni/dikkat" — SEYREK kullanilir, maviyi kirar
     Notrler Apple olceginden; durum renkleri markadan AYRI tutulur. */
  --primary-color:#0071C5 !important;
  --derin:#12307E; --derin-koyu:#0D2360;
  --mavi:#0071C5; --mavi-koyu:#005B9E; --mavi-yumusak:#EBF3FA;
  --acik:#2BB3EE; --acik-yumusak:#E7F5FD;
  --sicak:#C77700; --sicak-yumusak:#FDF3E3;
  --metin:#1D1D1F; --metin2:#6E6E73; --metin3:#86868B;
  --zemin:#F5F5F7; --yuzey:#FFFFFF; --cizgi:rgba(0,0,0,.09);
  --iyi:#248A3D; --kotu:#D70015; --bekle:#B25000;
  --r2:12px; --r3:18px; --hap:980px;
  --g1:0 1px 2px rgba(16,24,40,.04);
  --g2:0 4px 14px -4px rgba(16,24,40,.10), 0 2px 4px -2px rgba(16,24,40,.04);
  --yay:cubic-bezier(.22,1,.36,1);
}

body,button,input,select,textarea{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif !important;
  -webkit-font-smoothing:antialiased;
}
body{ background:var(--zemin) !important; color:var(--metin) !important; }

/* ── Ust bar: markanin mavisi (kullanici 28.08: "usteki seridi de mavi yap")
   Buzlu cam beyaz serit denendi, kullanici marka barini tercih etti.
   Icerik beyaz; alt cizgi biraz koyu maviyle derinlik verir. ── */
[class*="Navbar_nav"]{
  background:var(--mavi) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
  border-bottom:1px solid rgba(0,0,0,.10) !important;
  box-shadow:none !important;
}
/* ⚠️ Beyaz metin SADECE barin kendi ogelerinde. Eskiden `Navbar_nav *`
   yaziliyordu; navbar'dan ACILAN her katmani (profil menusu, dil ve para
   birimi pencereleri, bildirim paneli) da beyaza boyayip yazilari
   gorunmez kiliyordu. Kok ogeye renk verilir, acilir katmanlar asagida
   ACIKCA koyuya cevrilir. */
[class*="Navbar_navLeft"], [class*="Navbar_navLeft"] *,
[class*="Navbar_navMain"] > *, [class*="Navbar_navRight"] > *,
[class*="Navbar_notificationItem"], [class*="Navbar_profile"],
[class*="Navbar_profileSpan"], [class*="Navbar_profileDiv"],
[class*="Navbar_profileDropdownIcon"], [class*="Navbar_thirdItem"]{
  color:#fff !important;
}
[class*="Navbar_navLeft"] svg, [class*="Navbar_navLeft"] svg path,
[class*="Navbar_notificationItem"] svg, [class*="Navbar_notificationItem"] svg path,
[class*="Navbar_profile"] svg, [class*="Navbar_profile"] svg path,
[class*="Navbar_profileDropdownIcon"] svg, [class*="Navbar_profileDropdownIcon"] svg path{
  fill:#fff !important; color:#fff !important;
}
[class*="Navbar_thirdItem"]{ background:transparent !important; }

/* Fiyat listesi dugmesi: mavi barda beyaz hap, yazisi marka mavisi */
#dts-fiyat-listesi-dugmesi{
  background:#fff !important; border-radius:var(--hap) !important;
  border:0 !important; box-shadow:0 1px 3px rgba(0,0,0,.16) !important;
}
#dts-fiyat-listesi-dugmesi, #dts-fiyat-listesi-dugmesi *{ color:var(--mavi) !important; }
#dts-fiyat-listesi-dugmesi svg, #dts-fiyat-listesi-dugmesi svg path{ fill:var(--mavi) !important; }

/* ── Baslik seridi ── */
[class*="Header_"]{ background:var(--yuzey) !important; }
[class*="Header_search"], [class*="Header_search"] input{
  border-radius:var(--hap) !important; border-color:var(--cizgi) !important; background:var(--zemin) !important;
}

/* ── Urun satiri: kart ── */
[class*="Index_productList__"] [class*="Index_productContainer__"]{
  background:var(--yuzey) !important; border:1px solid var(--cizgi) !important;
  border-radius:var(--r2) !important; box-shadow:var(--g1) !important;
  transition:box-shadow .3s var(--yay), transform .3s var(--yay) !important;
}
@media (hover:hover){
  [class*="Index_productList__"] [class*="Index_productContainer__"]:hover{ box-shadow:var(--g2) !important; transform:translateY(-1px) !important; }
}
/* ⚠️ Urun adi/resmi de <button> — onu boyama, yoksa satirin yarisi mavi olur */
[class*="Index_productList__"] [class*="Index_productContainer__"] button[class*="Index_productButton__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] button[class*="Index_productButton__"]:hover{
  background:transparent !important; background-color:transparent !important;
  border-radius:0 !important; box-shadow:none !important; text-align:left !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] button[class*="Index_productButton__"] *{ color:var(--metin) !important; }
/* Tek renkli eylem: sepete ekle */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]{
  background:var(--mavi) !important; border:0 !important; border-radius:var(--hap) !important;
  font-weight:500 !important; transition:background-color .2s var(--yay), transform .1s ease !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]:hover{ background:var(--mavi-koyu) !important; }
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"] *{ color:#fff !important; }
button:active{ transform:scale(.98); }

/* ── Sepet ve gecmis siparisler: renkli cerceve degil sac teli kart ── */
[class*="Basket_body"], [class*="PastOrders_container"], [class*="PastOrders_wrapper"]{
  background:var(--yuzey) !important; border:1px solid var(--cizgi) !important;
  border-radius:var(--r3) !important; box-shadow:var(--g1) !important;
}
[class*="Basket_basketInfo"]{ color:var(--metin) !important; font-weight:600 !important; }
[class*="Basket_addedProduct"]{ color:var(--metin2) !important; }
[class*="Basket_"] button, [class*="PastOrders_all"]{ border-radius:var(--hap) !important; font-weight:500 !important; }
[class*="PastOrders_all"]{ background:var(--mavi) !important; color:#fff !important; }
/* (celisen eski dugme kurallari kaldirildi — tek notr kural dosya sonunda) */
[class*="PastOrders_"] [style*="background"]{ background:var(--zemin) !important; color:var(--metin) !important; }

/* ── Sol panel: notr; renk yalniz secilide ── */
[class*="Categories_wrapper__"] [class*="Categories_title__"]{ color:var(--metin3) !important; }
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"] > [class*="Categories_collapse__"] > [class*="Categories_panel__"]{
  background:var(--yuzey) !important; border:1px solid var(--cizgi) !important;
}
/* stok/tip satirlarindaki sert renk bloklari kalksin */
[class*="Categories_wrapper__"] [class*="Categories_cardWrapper__"] div[style*="background"]{
  background:var(--yuzey) !important; color:var(--metin) !important;
  border:1px solid var(--cizgi) !important; border-radius:10px !important; font-weight:400 !important;
}
[class*="Categories_wrapper__"] [class*="Categories_cardWrapper__"] div[style*="background"]:hover{
  background:var(--zemin) !important;
}

/* ── Ust serit ── */
.dts-cip{ border-radius:var(--hap) !important; border-color:var(--cizgi) !important; }
.dts-serit-ad{ color:var(--metin) !important; letter-spacing:-.015em !important; }
.dts-tum-urunler{ border-radius:var(--r2) !important; }

/* ── Durum noktalari: Apple sistem tonlari (marka rengiyle karismaz) ── */
span[style*="rgb(0, 128, 0)"], div[style*="rgb(0, 128, 0)"]{ background:var(--iyi) !important; }
span[style*="rgb(255, 0, 0)"], div[style*="rgb(255, 0, 0)"]{ background:var(--kotu) !important; }
span[style*="rgb(255, 187, 0)"], div[style*="rgb(255, 187, 0)"]{ background:var(--bekle) !important; }

@media (prefers-reduced-motion: reduce){
  [class*="Index_productList__"] [class*="Index_productContainer__"]{ transition:none !important; }
  [class*="Index_productList__"] [class*="Index_productContainer__"]:hover{ transform:none !important; }
}

/* ── Sol panel bolum basligi (betigin ekledigi "MARKA") ── */
.dts-bolum-basligi{
  grid-column:1 / -1;
  font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--metin3); margin:14px 0 2px; font-family:inherit;
}

/* ── Stok / Tip / Marka bloklari: dikey liste degil saran cipler (apex duzeni)
   ⚠️ Kategori bloguna DOKUNMA — onun cardWrapper'i icinde collapse var. ── */
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"]:not(:has(> [class*="Categories_collapse__"])){
  display:flex !important; flex-wrap:wrap !important; gap:7px !important;
  max-height:none !important; overflow:visible !important;
}
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"]:not(:has(> [class*="Categories_collapse__"])) > *{
  width:auto !important; flex:0 0 auto !important; margin:0 !important;
  border-radius:var(--hap) !important; padding:6px 13px 6px 10px !important;
  border:1px solid var(--cizgi) !important; background:var(--yuzey) !important;
  font-size:12.5px !important; line-height:1.3 !important;
  transition:background-color .18s var(--yay), border-color .18s var(--yay) !important;
}
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"]:not(:has(> [class*="Categories_collapse__"])) > *:hover{
  background:var(--zemin) !important;
}
/* secili cip */
[class*="Categories_wrapper__"]:nth-child(1) > [class*="Categories_cardWrapper__"]:not(:has(> [class*="Categories_collapse__"])) > *:has(input:checked){
  background:var(--mavi-yumusak) !important; border-color:var(--mavi) !important;
}
[class*="Categories_wrapper__"] [class*="Categories_cardWrapper__"] input[type="checkbox"]{
  width:13px !important; height:13px !important; accent-color:var(--mavi) !important; margin-right:2px !important;
}

/* ── Sepete ekle dugmesi: olculu, tasmayan, dokunulabilir ── */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  min-height:34px !important; padding:0 18px !important; width:auto !important; min-width:132px !important;
  font-size:13.5px !important; line-height:1 !important; white-space:nowrap !important;
  letter-spacing:-.01em !important; box-shadow:none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   URUN SATIRI DUZENI  (2026-08-28, taslak onaylandi)
   Taslak: https://claude.ai/code/artifact/774b3eb0-7d25-4b53-824a-e03028991cf7

   Satir dort blok: gorsel · ad+kod · fiyat · stok+dugme.
   Fiyat SABIT sutunda ve saga hizali — degisken sutunda her satirda baska
   yere kayiyor, 268 urunluk listede goz hizayi kaybediyordu.
   ═══════════════════════════════════════════════════════════════════════ */
[class*="Index_productList__"] [class*="Index_productContainer__"]{ align-items:center !important; padding:12px !important; gap:12px !important; }
[class*="Index_productInfo__"]{ width:100% !important; }
[class*="Index_productButton__"]{
  display:grid !important; grid-template-columns:52px 1fr !important; gap:12px !important;
  align-items:center !important; width:100% !important; padding:0 !important;
}
[class*="Index_productFigure__"]{
  width:52px !important; height:52px !important; margin:0 !important; flex:0 0 52px !important;
  border:1px solid var(--cizgi) !important; border-radius:8px !important; background:var(--zemin) !important;
  display:grid !important; place-items:center !important; overflow:hidden !important;
}
[class*="Index_productFigure__"] [class*="ProductList_image__"]{
  width:36px !important; height:36px !important; object-fit:contain !important;
  opacity:1 !important; filter:saturate(1.35) contrast(1.08) !important;
}
/* ad+kod solda, fiyat SABIT sutunda saga hizali */
[class*="Index_infoMain__"]{
  display:grid !important; grid-template-columns:minmax(0,1fr) 96px !important;
  grid-template-areas:"ad fiyat" "kod fiyat" !important;
  align-items:center !important; column-gap:14px !important; row-gap:2px !important; min-width:0 !important;
}
[class*="Index_infoMain__"] > [class*="Index_infoPrice__"]{
  grid-area:fiyat !important; align-self:center !important; margin:0 !important; text-align:right !important;
  font-size:16px !important; font-weight:600 !important; letter-spacing:-.02em !important;
  color:var(--metin) !important; font-variant-numeric:tabular-nums !important; white-space:nowrap !important;
}
[class*="Index_infoMain__"] > [class*="Index_name__"]:nth-of-type(1){
  grid-area:ad !important; font-size:13.5px !important; font-weight:500 !important;
  color:var(--metin) !important; line-height:1.35 !important; text-align:left !important;
}
[class*="Index_infoMain__"] > [class*="Index_name__"]:nth-of-type(2){
  grid-area:kod !important; font-size:11.5px !important; font-weight:400 !important;
  color:var(--metin3) !important; font-variant-numeric:tabular-nums !important; text-align:left !important;
}
[class*="Index_counterMain__"]{ font-size:12.5px !important; color:var(--metin2) !important; }
[class*="Index_addMain__"]{ display:flex !important; justify-content:flex-end !important; }

/* ⚠️ Sol paneldeki cip cocuklari `display:block` — flex ogesi olsalar da
   satiri kapliyorlar. inline-flex olmadan "cip" gorunumu olusmuyor. */
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"]:not(:has(> [class*="Categories_collapse__"])) > *{
  display:inline-flex !important; align-items:center !important; gap:7px !important;
  width:auto !important; max-width:none !important;
}
[class*="Categories_wrapper__"] > [class*="Categories_cardWrapper__"]:not(:has(> [class*="Categories_collapse__"])) > * label{
  display:inline !important; margin:0 !important; cursor:pointer !important; white-space:nowrap !important;
}

/* ⚠️ Fiyat sutunu SABIT olsa da hizalanmiyordu: satirin sol blogu
   (productContainer > div > a) icerik genisligindeydi, her urun adinda
   baska genislik veriyordu. Blok esnetilince fiyat sutunu hizaya oturur. */
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:first-child{
  flex:1 1 auto !important; min-width:0 !important; width:auto !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:first-child > a{
  display:block !important; width:100% !important; text-decoration:none !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child{ flex:0 0 auto !important; }

/* Cipler: :not(:has()) zinciri tutmadi — dogrudan inline stilli cocuklari hedefle */
[class*="Categories_cardWrapper__"] > div[style*="background"]{
  display:inline-flex !important; align-items:center !important; gap:7px !important;
  width:auto !important; max-width:none !important; padding:6px 13px 6px 10px !important;
}
[class*="Categories_cardWrapper__"] > div[style*="background"] label{
  display:inline !important; margin:0 !important; white-space:nowrap !important; cursor:pointer !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   ADET SAYACI  (2026-08-28 ACIL DUZELTME)

   ⚠️ Urun sepete eklenince "Add to basket" yerine sayac cikiyor:
        [−]  [adet]  [+]
   ve oradaki "+" dugmesi de `Index_addButton__` sinifini tasiyor.
   Sepete ekle dugmesine verilen `min-width:132px` bu yuzden "+"a da
   uygulaniyor, sayac kutusunu tasirip adet alanini eziyordu.
   Cozum: sayac icindeki dugmeler KARE (32x32), min-width sifirlanir.
   Ayirt etme olcutu: sayac kabinda `Index_deleteMain__` de bulunur.
   ═══════════════════════════════════════════════════════════════════════ */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"],
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteButton__"]{
  min-width:32px !important; width:32px !important; height:32px !important;
  min-height:32px !important; padding:0 !important; flex:0 0 32px !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  font-size:16px !important; line-height:1 !important; border-radius:50% !important;
}
/* − dugmesi ikincil: notr zemin, marka rengi degil */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteButton__"]{
  background:var(--zemin) !important; color:var(--metin) !important;
  border:1px solid var(--cizgi) !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteButton__"]:hover{
  background:var(--yuzey) !important; border-color:var(--metin3) !important;
}
[class*="Index_deleteMain__"], [class*="Index_counterMain__"].dts-sayac [class*="Index_addMain__"]{
  width:32px !important; height:32px !important; flex:0 0 32px !important;
  display:grid !important; place-items:center !important; justify-content:center !important;
}
/* adet kutusu: ortali, okunur, tabular */
[class*="Index_counterMain__"] input{
  width:auto !important; min-width:44px !important; max-width:64px !important; height:32px !important;
  flex:0 1 auto !important;
  text-align:center !important; font-size:13.5px !important; font-weight:600 !important;
  font-variant-numeric:tabular-nums !important; color:var(--metin) !important;
  border:1px solid var(--cizgi) !important; border-radius:8px !important;
  background:var(--yuzey) !important; font-family:inherit !important; padding:0 4px !important;
}
[class*="Index_counterMain__"] input:focus-visible{ outline:2px solid var(--mavi) !important; outline-offset:1px !important; }
/* sayac satiri: ogeler arasi nefes */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac{
  display:flex !important; align-items:center !important; gap:8px !important; justify-content:flex-end !important;
}

/* ⚠️ Sayacta "−" gorunmuyordu: adet kutusu `width:100%` ile butun alani
   kaplayip eksi dugmesini disari itiyordu. Kutu daraltildi, eksi dugmesi
   de belirgin cerceveli hale getirildi. */
[class*="Index_counterMain__"] [class*="Index_deleteMain__"]{ flex:0 0 32px !important; order:-1 !important; }
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteButton__"]{
  background:var(--yuzey) !important; border:1px solid var(--metin3) !important; color:var(--metin) !important;
  font-weight:600 !important; opacity:1 !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteButton__"] svg,
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteButton__"] svg path{
  fill:var(--metin) !important; stroke:var(--metin) !important;
}

/* ⚠️ "Add to basket" kapsayicidan tasiyordu: `Index_addMain__` 32px yuksekti,
   dugme 34px. Kenarda kapsayicinin beyaz seridi gorunuyordu.
   Sayac HALINDE DEGILKEN kapsayici olcusunu dugmeye birakir. */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle [class*="Index_addMain__"]{
  width:auto !important; height:auto !important; min-height:0 !important;
  background:transparent !important; border:0 !important; padding:0 !important;
  display:flex !important; align-items:center !important; justify-content:flex-end !important;
  flex:0 0 auto !important; overflow:visible !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle{
  background:transparent !important; border:0 !important; overflow:visible !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle [class*="Index_addButton__"]{
  margin:0 !important; flex:0 0 auto !important;
}

/* ⚠️ `min-height` yetmedi — dugme icerigine gore 64px'e sisiyordu.
   Sayac DISINDAKI "sepete ekle" dugmesi sabit 34px. */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle [class*="Index_addButton__"]{
  height:34px !important; min-height:34px !important; max-height:34px !important;
  padding:0 18px !important; line-height:1 !important;
}

/* ⚠️ Sayacta "−" kirpiliyordu: kap 175px sabit genislikte ve saga yasliydi,
   soldaki dugme disari tasip kesiliyordu. Kap icerige gore genisler,
   tasma gorunur, ogeler alt satira DUSMEZ. */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac{
  width:auto !important; min-width:0 !important; max-width:none !important;
  overflow:visible !important; flex-wrap:nowrap !important; padding:0 !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child,
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child > div{
  overflow:visible !important;
}
[class*="Index_counterMain__"] [class*="Index_deleteMain__"]{
  overflow:visible !important; min-width:32px !important;
}

/* ⚠️ PROFIL MENUSU BEYAZ METIN — ust bar `*{color:#fff}` kurali, barin
   ICINDE acilan menuyu de yakaliyordu; beyaz zeminde yazilar okunmuyordu.
   Menu kabi `Navbar_unOrderedLists__` (position:absolute). */
[class*="Navbar_nav"] [class*="Navbar_unOrderedLists__"]{
  background:var(--yuzey) !important;
  border:1px solid var(--cizgi) !important;
  border-radius:var(--r3) !important;
  box-shadow:0 12px 32px -8px rgba(16,24,40,.22), 0 2px 6px -2px rgba(16,24,40,.08) !important;
  padding:6px !important; overflow:hidden !important;
}
[class*="Navbar_nav"] [class*="Navbar_unOrderedLists__"] *{ color:var(--metin) !important; }
[class*="Navbar_nav"] [class*="Navbar_unOrderedLists__"] svg,
[class*="Navbar_nav"] [class*="Navbar_unOrderedLists__"] svg path{
  fill:var(--metin) !important; color:var(--metin) !important;
}
/* bolum basligi (SETTINGS vb.) ve ikincil satirlar soluk */
[class*="Navbar_unOrderedLists__"] [class*="Navbar_accountContainer__"] > span,
[class*="Navbar_unOrderedLists__"] small{ color:var(--metin3) !important; }
/* menu satirlari: dokunulabilir yuzey */
[class*="Navbar_unOrderedLists__"] [class*="Navbar_accountLink__"],
[class*="Navbar_unOrderedLists__"] [class*="Navbar_accountList__"]{
  border-radius:10px !important; transition:background-color .16s var(--yay) !important;
}
[class*="Navbar_unOrderedLists__"] [class*="Navbar_accountLink__"]:hover,
[class*="Navbar_unOrderedLists__"] [class*="Navbar_accountList__"]:hover{
  background:var(--zemin) !important;
}

/* ⚠️ MODAL METINLERI KAYBOLDU — dil/para birimi pencereleri Navbar
   bileseninden aciliyor, yani DOM'da `Navbar_nav` ICINDE. Ust bara verilen
   `*{color:#fff}` kurali beyaz zeminli modalin yazilarini da beyaz yapip
   dil adlarini gorunmez kildi (kullanici 28.08 bildirdi).
   Butun modallarda metin koyu; dugme icleri haric (onlar beyaz kalir). */
[class*="LanguageModal_"], [class*="CurrencyModal_"], [class*="Modal_"],
[class*="modalContainer"], [class*="modalMain"]{ color:var(--metin) !important; }
[class*="LanguageModal_"] *:not(button):not(button *),
[class*="CurrencyModal_"] *:not(button):not(button *),
[class*="Modal_"] *:not(button):not(button *),
[class*="modalContainer"] *:not(button):not(button *),
[class*="modalMain"] *:not(button):not(button *){ color:var(--metin) !important; }
/* modal kabi: Apple yuzeyi */
[class*="modalMain"], [class*="LanguageModal_modalMain"]{
  background:var(--yuzey) !important; border-radius:var(--r3) !important;
  box-shadow:0 24px 48px -12px rgba(16,24,40,.28), 0 0 0 1px var(--cizgi) !important;
}
/* secili dil satiri belirgin olsun */
[class*="LanguageModal_"] [class*="checked"]{ background:var(--mavi) !important; border-color:var(--mavi) !important; }

/* Navbar'dan acilan TUM katmanlar: beyaz yuzey + koyu metin (dugmeler haric) */
[class*="Navbar_unOrderedLists__"],
[class*="NotificationBell_"], [class*="Notification_"],
[class*="LanguageModal_"], [class*="CurrencyModal_"]{
  color:var(--metin) !important;
}
[class*="Navbar_unOrderedLists__"] *:not(button):not(button *),
[class*="NotificationBell_"] *:not(button):not(button *),
[class*="Notification_"] *:not(button):not(button *){
  color:var(--metin) !important;
}
[class*="NotificationBell_"] svg:not(button svg), [class*="Notification_"] svg:not(button svg){
  fill:var(--metin) !important;
}
/* bildirim paneli kabi */
[class*="NotificationBell_"] [class*="dropdown"], [class*="NotificationBell_"] [class*="panel"],
[class*="Notification_"] [class*="dropdown"]{
  background:var(--yuzey) !important; border:1px solid var(--cizgi) !important;
  border-radius:var(--r3) !important;
  box-shadow:0 12px 32px -8px rgba(16,24,40,.22) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   YER TUTUCU LOGO KIRPILMASI  (2026-08-28)

   Resmi olmayan urunlerde yer tutucu olarak YATAY logo (681x366) kullaniliyor;
   kart gorunumunde ve urun detayinda kare/dar alana sikisinca kenarlarindan
   kesiliyordu — kullanici: *"bazi urunlerde logo cikmiyor"*, *"hepsi SM-A305
   gibi gorunsun"*. `object-fit: contain` ile logo alana TAM sigar, kirpilmaz.

   ⚠️ Kalici cozum kare bir logo surumu uretmek — bkz [[datatechshop-logo-analizi]].
   Bu kural yalnizca kirpilmayi onler.
   ═══════════════════════════════════════════════════════════════════════ */
[class*="ProductList_image__"], [class*="ProductDetails_image__"],
[class*="Index_productFigure__"] img, [class*="ProductDetails_"] img{
  object-fit:contain !important; max-width:100% !important; max-height:100% !important;
}
/* urun detayinda gorsel 0x0 kaliyordu — alan verilir */
[class*="ProductDetails_image__"]{
  width:auto !important; max-width:88% !important;
  height:auto !important; max-height:88% !important;
  object-fit:contain !important; display:block !important;
  margin:0 auto !important; padding:0 !important;
}
/* gorselin kabi: bosluk burada verilir, gorselin kendisinde degil */
[class*="ProductDetails_imageMain__"], [class*="ProductDetails_imageWrapper__"],
[class*="ProductDetails_image__"]{ box-sizing:border-box !important; }

/* ── Suzgec kutusu (seridin saginda) ── */
.dts-serit-sag{ margin-left:14px; display:flex; align-items:center; gap:8px; }
.dts-suzgec-sar{ display:inline-flex; align-items:center; gap:8px; cursor:pointer; }
.dts-suzgec-et{ font-size:12.5px; color:var(--metin2); white-space:nowrap; }
.dts-suzgec{
  font-family:inherit; font-size:13px; color:var(--metin);
  background:var(--yuzey); border:1px solid var(--cizgi); border-radius:10px;
  padding:7px 30px 7px 12px; cursor:pointer; min-width:170px;
  -webkit-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236E6E73' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 11px center;
  transition:border-color .18s var(--yay), background-color .18s var(--yay);
}
.dts-suzgec:hover{ border-color:var(--metin3); }
.dts-suzgec:focus-visible{ outline:2px solid var(--mavi); outline-offset:1px; border-color:var(--mavi); }
.dts-suzgec optgroup{ font-weight:600; color:var(--metin3); }
.dts-suzgec option{ color:var(--metin); font-weight:400; }
@media (max-width:760px){
  .dts-serit-sag{ margin-left:0; width:100%; }
  .dts-suzgec{ flex:1; min-width:0; }
}

/* ═══════════════════════════════════════════════════════════════════════
   MAVIYI KIS  (2026-08-28, kullanici: "cok mavi olmus ya")

   Liste ekraninda her satirda DOLU mavi bir dugme vardi; 10 satirda ekran
   maviye boguluyordu. Apple'da liste icindeki tekrar eden eylem IKINCILDIR:
   notr zemin + marka rengiyle YAZI. Dolu mavi yalnizca sayfada TEK olan
   birincil eylemde kalir (sepetteki "Siparis Yukle" gibi).
   ═══════════════════════════════════════════════════════════════════════ */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]{
  background:var(--zemin) !important;
  color:var(--mavi) !important;
  border:1px solid var(--cizgi) !important;
  font-weight:500 !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"] *{ color:var(--mavi) !important; }
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]:hover{
  background:var(--mavi-yumusak) !important; border-color:var(--mavi) !important;
}
/* sayactaki + de ayni sakinlikte (satirda tekrar eden ogeler) */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]{
  background:var(--mavi-yumusak) !important; color:var(--mavi) !important;
  border:1px solid var(--cizgi) !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]:hover{
  background:var(--mavi) !important; color:#fff !important; border-color:var(--mavi) !important;
}
/* gecmis siparis tutarlari: mavi rozet yerine sakin */
[class*="PastOrders_"] [style*="background"]{ color:var(--metin) !important; }

/* ── Ton ayrimi: ust bar DERIN, eylemler MARKA mavisi ──────────────
   Ayni mavinin hem zeminde hem dugmede olmasi "cok mavi" hissini
   yaratiyordu. Ust bar laciverte inince eylemler one cikiyor. */
[class*="Navbar_nav"]{ background:var(--derin) !important; }
#dts-fiyat-listesi-dugmesi{ background:#fff !important; }
#dts-fiyat-listesi-dugmesi, #dts-fiyat-listesi-dugmesi *{ color:var(--derin) !important; }
#dts-fiyat-listesi-dugmesi svg, #dts-fiyat-listesi-dugmesi svg path{ fill:var(--derin) !important; }

/* "Tum Urunler" ikonu: acik mavi zemin — marka mavisiyle ayni degil */
.dts-tu-ikon{ background:var(--acik-yumusak) !important; }
.dts-tu-ikon svg{ fill:var(--mavi) !important; }

/* Yoldaki stok rozeti sicak tonda — mavi denizinde tek sicak nokta */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"] span[style*="rgb(255, 187, 0)"]{
  background:#f69523 !important;
}

/* ── Maviyi bir tık daha kis (2026-08-28) ─────────────────────────────
   Ust bar daha derin bir laciverte iner: zemin agirlasir, uzerindeki
   marka mavisi eylemler daha net ayrisir. Ayrica ekranda ISLEVI OLMAYAN
   mavi lekeler notre cekilir — mavi yalnizca TIKLANACAK yerde kalsin. */
:root{ --derin:#0E2560; --derin-koyu:#091A48; }
[class*="Navbar_nav"]{ background:var(--derin) !important; }

/* para birimi dugmesi: cerceve mavi degil notr, yazi koyu */
[class*="Header_headerBasketMain__"], [class*="Header_headerBasketContainer__"]{
  border-color:var(--cizgi) !important; background:var(--yuzey) !important;
}
[class*="Header_headerBasketMain__"] span, [class*="Header_headerBasketContainer__"] span{
  color:var(--metin) !important; font-weight:600 !important;
}

/* gecmis siparis tutarlari: mavi rozet degil sakin zemin */
[class*="PastOrders_"] [style*="background"]{
  background:var(--zemin) !important; color:var(--metin) !important;
  border-radius:8px !important; font-variant-numeric:tabular-nums !important;
}
/* "Tumunu goster": ikincil — sayfadaki tek birincil eylem sepette kalir */
[class*="PastOrders_all"]{
  background:var(--zemin) !important; color:var(--mavi) !important;
  border:1px solid var(--cizgi) !important;
}
[class*="PastOrders_all"]:hover{ background:var(--mavi-yumusak) !important; border-color:var(--mavi) !important; }

/* sepet ikincil dugmesi zaten notr; birincil ("Siparis Yukle") dolu mavi KALIR */

/* ⚠️ Lacivert MOR gorunuyordu (kullanici 28.08). Sebebi kirmizi bileseni:
   #0E2560 -> R14 G37 B96, yesil bileseni dusuk oldugu icin goz onu mora
   yakin okuyor. Cozum: logonun KENDI mavisinin koyu tonu — ayni ton
   ailesi, yesil bileseni yuksek, temiz denizci mavisi. */
:root{ --derin:#00558F; --derin-koyu:#004270; }
[class*="Navbar_nav"]{ background:var(--derin) !important; }
#dts-fiyat-listesi-dugmesi, #dts-fiyat-listesi-dugmesi *{ color:var(--derin) !important; }
#dts-fiyat-listesi-dugmesi svg, #dts-fiyat-listesi-dugmesi svg path{ fill:var(--derin) !important; }

/* Yer tutucu logo cok kucuk kaliyordu (kullanici: "logolari az buyut").
   Kutu 52->60, logo 34->48, solukluk azaltildi. */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_productFigure__"]{
  width:60px !important; height:60px !important; flex:0 0 60px !important;
}
[class*="Index_productButton__"]{ grid-template-columns:60px 1fr !important; }
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_productFigure__"] img{
  width:56px !important; height:auto !important; max-height:56px !important;
  opacity:1 !important; filter:saturate(1.35) contrast(1.08) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   SICAK EYLEM RENGI  (2026-08-28)

   Kullanici: *"apex gibi siteye girince biraz canli olmasi gerekiyor,
   cok mavi, icime daraliyor"*. Dogru teshis: ekranda TEK renk ailesi
   vardi (lacivert bar + mavi cip + mavi yazili dugme) — ayni tonun
   perdeleri, kontrast yok, steril duruyordu.

   Apex'te canliligi veren sey mavi degil, mavinin KARSISINDAKI turuncu.
   Bar mavi kalir, TIKLANACAK yer sicak renge doner. Fiyat notr, stok
   renkleri kendi anlaminda, sol panel sakin — yani "her yer renkli" degil,
   yalnizca eylem ayrisir.

   Ton secimi: #D97706. Apex'in #f69523'u daha parlak ama uzerindeki beyaz
   yazi 3.2:1 kontrast veriyor (WCAG alti). #D97706 ile beyaz 4.5:1 —
   hem canli hem okunur.
   ═══════════════════════════════════════════════════════════════════════ */
:root{ --eylem:#D97706; --eylem-koyu:#B45309; --eylem-yumusak:#FEF3E2; }

/* satirdaki sepete ekle: dolu sicak */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]{
  background:var(--eylem) !important;
  color:#fff !important;
  border:1px solid var(--eylem) !important;
  font-weight:600 !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"] *{ color:#fff !important; }
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]:hover{
  background:var(--eylem-koyu) !important; border-color:var(--eylem-koyu) !important;
}
/* sayactaki + ayni ailede, ama daha sakin */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]{
  background:var(--eylem-yumusak) !important; color:var(--eylem-koyu) !important;
  border:1px solid var(--eylem) !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]:hover{
  background:var(--eylem) !important; color:#fff !important;
}
/* sepetteki birincil eylem de ayni dilde */
/* (celisen eski dugme kurallari kaldirildi — tek notr kural dosya sonunda) */
/* "Sepete git" seridi */
[class*="Basket_goBasket"], [class*="Basket_goToBasket"]{
  background:var(--eylem) !important; color:#fff !important;
}
[class*="Basket_goBasket"] *, [class*="Basket_goToBasket"] *{ color:#fff !important; }

/* ── Satirlar TEK SATIR (2026-08-28, kullanici: "yazilar tek satir olsun,
   alta gitmesin"). Uzun urun adi ucta uc noktayla kesilir; stok metni
   ("113 pcs Incoming in 2-3 Days") hic bolunmez. ── */
[class*="Index_infoMain__"] > [class*="Index_name__"]:nth-of-type(1){
  white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important;
  display:block !important; min-width:0 !important;
}
[class*="Index_infoMain__"] > [class*="Index_name__"]:nth-of-type(2){
  white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important;
  display:block !important; min-width:0 !important;
}
/* stok metni: bolunmesin, sutun icerige gore genislesin */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"]{
  white-space:nowrap !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"] p,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"] span,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"] div{
  white-space:nowrap !important;
}
/* stok blogu sabit 175px'e sikismasin */
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child{ min-width:0 !important; }
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child > [class*="Index_counterMain__"]:first-child{
  width:auto !important; min-width:0 !important;
}

/* ── Profil menusundeki avatar gorseli kaldirildi (2026-08-28, kullanici:
   "su resim olayini kaldir, resim olmicak"). Menudeki ilk blok buyuk bir
   avatar + ad gosteriyordu; gorsel cikti, ad satiri kaldi. ── */
[class*="Navbar_unOrderedLists__"] [class*="Navbar_accountIcons__"],
[class*="Navbar_unOrderedLists__"] [class*="Navbar_accountContainer__"] img,
[class*="Navbar_unOrderedLists__"] [class*="Navbar_accountContainer__"] > svg,
[class*="Navbar_unOrderedLists__"] > *:first-child img{
  display:none !important;
}
[class*="Navbar_unOrderedLists__"] [class*="Navbar_accountContainer__"]{
  padding:10px 12px !important; gap:0 !important;
}

/* ⚠️ Sayactaki "+" GORUNMUYORDU: satirdaki sepete-ekle dugmesine verilen
   `* { color:#fff }` kurali sayactaki "+"i de beyaz yapiyor, o da acik
   krem zemin (#FEF3E2) uzerinde kayboluyordu. Sayac icin daha spesifik
   secici ile koyu turuncuya cevrilir; SVG ise fill/stroke da ayarlanir. */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"] *{
  color:var(--eylem-koyu) !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"] svg,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"] svg path{
  fill:var(--eylem-koyu) !important; stroke:var(--eylem-koyu) !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]{
  font-size:18px !important; font-weight:600 !important;
}
/* uzerine gelince dolu turuncu + beyaz "+" */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]:hover,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]:hover *{
  color:#fff !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]:hover svg,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]:hover svg path{
  fill:#fff !important; stroke:#fff !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   SEPETTE YOLDAKI MAL — SARI VURGU  (2026-08-28)

   Apex kurali (utils/productHelper -> sadeceYoldaMi):
     stockCount <= 0  VE  stockCountIki > 0   →  satir #fef1c8 zemin alir.
   Yani "hazir stogu yok, sadece yoldaki maldan geliyor" demek.

   Burada urun verisine erisemedigimiz icin ayni sey DOM'dan okunuyor:
   satirda YOLDAKI noktasi (inline rgb(255,187,0)) var ama HAZIR noktasi
   (rgb(0,128,0)) yoksa → sadece yoldaki mal. Dil bagimsizdir; metne degil
   noktanin rengine bakar.
   ═══════════════════════════════════════════════════════════════════════ */
[class*="Basket_"] *:has(> [style*="255, 187, 0"]):not(:has([style*="0, 128, 0"])),
[class*="Basket_"] [class*="product"]:has([style*="255, 187, 0"]):not(:has([style*="0, 128, 0"])),
[class*="basket"] [class*="Product"]:has([style*="255, 187, 0"]):not(:has([style*="0, 128, 0"])){
  background:#FEF1C8 !important;
  border-radius:10px !important;
}

/* ── Sepet sayfasi: kalan yesil izleri ve dugme tutarsizligi ──────────
   Kullanici: "Upload Order" hala yesil cerceveliydi, dugmeler uc ayri
   bicimdeydi (mavi cerceve / yesil cerceve / gri). Hepsi ayni dile alinir:
   birincil eylem SICAK dolu, digerleri notr. */
[class*="Basket"] button, [class*="basket"] button{
  border-radius:var(--hap) !important; font-weight:500 !important;
  transition:background-color .2s var(--yay) !important;
}
[class*="Basket"] button[style*="99, 186, 39"], [class*="Basket"] button[style*="63ba27"],
[class*="Basket"] [style*="border-color: rgb(99, 186, 39)"]{
  background:var(--zemin) !important; color:var(--metin) !important;
  border:1px solid var(--cizgi) !important;
}
/* "Save Order" / "Siparisi Kaydet" — sayfanin birincil eylemi */
[class*="Basket_saveOrder"], [class*="Basket_saveButton"], [class*="saveOrder"]{
  background:var(--eylem) !important; color:#fff !important; border:0 !important;
  border-radius:var(--hap) !important; font-weight:600 !important;
}
[class*="Basket_saveOrder"] *, [class*="saveOrder"] *{ color:#fff !important; }
/* ozet kartlari: sac teli, notr */
[class*="Basket_summary"] > *, [class*="Basket_total"] > *{
  border-color:var(--cizgi) !important; border-radius:10px !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   ADET SAYACI — TEK HAP  (2026-08-28)

   Kullanici apex'teki sayaci gosterdi: eksi · adet · arti · cop TEK bir
   kutuda, bitisik, ince ayraclarla; ayri ayri yuvarlak dugmeler degil.
   Onceki halde ucu de ayri daireydi ve "biraz kotu" duruyordu.
   ═══════════════════════════════════════════════════════════════════════ */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac{
  background:#F7F5FA !important;
  border:1px solid var(--cizgi) !important;
  border-radius:10px !important;
  padding:0 !important; gap:0 !important; overflow:hidden !important;
  height:34px !important; align-items:stretch !important;
}
/* ic ogeler: kare bolumler, yuvarlaklik yok, ayrac cizgisiyle bolunur */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteButton__"]{
  background:transparent !important; border:0 !important; border-radius:0 !important;
  width:34px !important; min-width:34px !important; height:100% !important;
  min-height:0 !important; max-height:none !important; flex:0 0 34px !important;
  color:var(--eylem) !important; font-size:17px !important; font-weight:600 !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"] *,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteButton__"] *{
  color:var(--eylem) !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac svg,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac svg path{
  fill:var(--eylem) !important; stroke:var(--eylem) !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addButton__"]:hover,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteButton__"]:hover{
  background:rgba(217,119,6,.10) !important;
}
/* kaplar da hapin parcasi olsun */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_deleteMain__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac [class*="Index_addMain__"]{
  width:34px !important; height:100% !important; flex:0 0 34px !important;
  display:grid !important; place-items:stretch !important; background:transparent !important;
}
/* adet kutusu: cerceve yok, hapin ortasinda */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac input{
  border:0 !important; border-radius:0 !important; background:transparent !important;
  height:100% !important; width:46px !important; min-width:46px !important; max-width:46px !important;
  text-align:center !important; font-size:13.5px !important; font-weight:600 !important;
  color:var(--metin) !important; padding:0 !important;
}
/* cop kutusu ince ayracla ayrilir */
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child > [class*="Index_counterMain__"]:last-child{
  border-left:1px solid var(--cizgi) !important;
}

/* ⚠️ Stok metni KESILIYORDU ("47 pcs Incoming in 2-3 D..."). Tek satira
   zorlanmis metin, dar sutunda tasip kirpiliyordu. Sag blok icerigi kadar
   yer alir ve en az 205px genisler; sol blok (ad) esner, uzun ad zaten
   uc noktayla kesiliyor. */
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child{
  flex:0 0 auto !important; min-width:240px !important;
  display:flex !important; flex-direction:column !important;
  align-items:flex-end !important; gap:6px !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child > [class*="Index_counterMain__"]:first-child{
  width:auto !important; max-width:none !important; text-align:right !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:first-child{ min-width:0 !important; flex:1 1 auto !important; }
/* ad sutunu daralabilsin ki stok metni tam sigsin */
[class*="Index_infoMain__"]{ grid-template-columns:minmax(0,1fr) 92px !important; }

/* stok metni biraz kucuk: uzun ifade ("1 pcs Incoming in 2-3 Days") sigsin */
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child > [class*="Index_counterMain__"]:first-child{
  font-size:12px !important; line-height:1.45 !important;
}

/* ── "Sepete ekle" dugmesi: apex olcusu (2026-08-28, kullanici gorseli) ──
   Daha parlak turuncu, tam yuvarlak hap, daha dolgun govde.
   ⚠️ Ton: apex'in #f69523'u beyaz yaziyla 3.2:1 kontrast veriyor (WCAG
   normal metin siniri 4.5). Burada var(--eylem) + 14px/700 beyaz yazi
   kullaniliyor: kalin ve buyuk metin icin esik 3:1 — sinirin ustunde
   kaliyor, gorsel olarak da apex'e yakin. */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]{
  background:var(--eylem) !important; border-color:var(--eylem) !important;
  height:38px !important; min-height:38px !important; max-height:38px !important;
  min-width:142px !important; padding:0 22px !important;
  font-size:14px !important; font-weight:700 !important;
  border-radius:999px !important; letter-spacing:-.01em !important;
  box-shadow:0 1px 2px rgba(0,0,0,.08) !important;
}
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]:hover{
  background:var(--eylem-koyu) !important; border-color:var(--eylem-koyu) !important;
}
/* sepetteki birincil dugmeler de ayni tonda */
[class*="Basket_saveOrder"], [class*="saveOrder"]{
  background:var(--eylem) !important; border-color:var(--eylem) !important;
}

/* Urun detayindaki "Sepete ekle" de listedekiyle ayni dilde olsun */
[class*="ProductDetails_addCart__"], [class*="ProductDetails_addToCart__"] > button{
  background:var(--eylem) !important; color:#fff !important; border:0 !important;
  border-radius:999px !important; height:38px !important; min-width:150px !important;
  padding:0 22px !important; font-size:14px !important; font-weight:700 !important;
}
[class*="ProductDetails_addCart__"] *{ color:#fff !important; }
/* detaydaki "Stock level" basligi notr olsun, mavi bagirmasin */
[class*="ProductDetails_"] [class*="stockLevel"], [class*="ProductDetails_"] [class*="StockLevel"]{
  color:var(--metin) !important;
}

/* Urun detayinda dugmenin KAPSAYICISI mavi cerceveliydi; dugme turuncu
   olunca etrafinda mavi bir hat kaliyordu. */
[class*="ProductDetails_addToCart__"]{
  border:0 !important; background:transparent !important; padding:0 !important;
  width:auto !important; display:inline-flex !important;
}
[class*="ProductDetails_addToCart__"] > [class*="addCart"]{
  background:var(--eylem) !important; color:#fff !important; border:0 !important;
  border-radius:999px !important; height:38px !important; min-width:150px !important;
  padding:0 22px !important; font-size:14px !important; font-weight:700 !important;
}
[class*="ProductDetails_addToCart__"] > [class*="addCart"] *{ color:#fff !important; }
/* gorsel kutusu: logo dikeyde ortalansin, bos alan azalsin */
[class*="ProductDetails_"] [class*="imageMain"], [class*="ProductDetails_"] [class*="ImageMain"]{
  display:grid !important; place-items:center !important; min-height:260px !important;
}

/* ── Footer'daki politika baglantilari gizlendi (2026-08-28) ──────────
   Kullanici: *"bu kisimlari siteden kaldir, bir yere kaldir kalsin,
   suanlik burda bunlara gerek yok"* — Cookie Settings · Privacy Policy ·
   Data Sub-Processors · Legal Notice · Terms & Conditions.

   SILINMEDI, yalnizca gizlendi: bu blogu kaldirmak baglantilari geri
   getirir. Sayfalarin kendisi ve modallari yerinde duruyor.

   ⚠️ AB'den musteri varsa cerez/gizlilik baglantisi yasal gerekliliktir;
   karar kullanicinin, not olarak birakiliyor. */
/* (Footer_listItemDiv yanlis hedefti — dogru sinif asagida) */

/* ── "Sepete git" seridi (2026-08-28, kullanici: "burasida renklendirilmesi
   gerekiyor"). Apex'teki gibi iki bolum: sol tarafta eylem (mavi), sagda
   tutar (beyaz). Mavi burada bilincli — apex'te de gezinme mavi, eylem
   turuncu; ikisi ayri anlam tasiyor. */
[class*="Basket_goToCartMain__"]{
  background:var(--mavi) !important; border:0 !important;
  border-radius:12px !important; overflow:hidden !important;
  box-shadow:var(--g2) !important;
}
[class*="Basket_gotToCart__"]{
  color:#fff !important; font-weight:700 !important; font-size:14px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}
[class*="Basket_gotToCart__"] *{ color:#fff !important; }
[class*="Basket_totalPrice__"]{
  background:#fff !important; color:var(--metin) !important;
  font-weight:700 !important; font-size:15px !important;
  font-variant-numeric:tabular-nums !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}
[class*="Basket_totalPrice__"] *{ color:var(--metin) !important; }

/* Sayacin gri zemini kaldirildi (kullanici: "arka planini kaldir, gereksiz").
   Yalniz ince cerceve kalir; icerik beyaz zeminde durur. */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac{
  background:transparent !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac input{
  background:transparent !important;
}

/* ⚠️ `Index_counterMain__` IC ICE gecmis (dis kap + sayac hapi + cop kabi).
   Zemini yalniz en icteki hapta kaldirmak yetmedi, DIS kapta duruyordu. */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_addMain__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_deleteMain__"]{
  background:transparent !important; background-color:transparent !important;
  box-shadow:none !important;
}
/* cerceve yalniz sayac hapinda kalir */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac{
  border:1px solid var(--cizgi) !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-ekle{
  border:0 !important;
}

/* ⚠️ CIFT CERCEVE: `counterMain` uc kat ic ice (dis kap → sayac+cop kabi →
   sayac hapi). Ikisi birden cerceveliydi, hapin arkasinda ikinci bir kutu
   goruluyordu. Kural: ICINDE baska counterMain barindiran kap CERCEVESIZ;
   cerceve yalniz en icteki hapta ve cop kutusunda kalir. */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"]:has([class*="Index_counterMain__"]){
  border:0 !important; padding:0 !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child > [class*="Index_counterMain__"]:last-child{
  border-left:1px solid var(--cizgi) !important;
}

/* Urun listesi ile sepet paneli birbirine yapisikti (kullanici: "sunlari
   biraz ayir") — satirlardaki sayac/dugme sepetin cercevesine deger gibi
   duruyordu. Sutunlar arasina nefes konur. */
[class*="Index_contents__"]{ gap:22px !important; }
[class*="Index_productList__"]{ padding-right:6px !important; }
[class*="Basket_wrapper__"]{ margin-left:8px !important; }
[class*="Index_productList__"] [class*="Index_productContainer__"]{ margin-right:2px !important; }

/* ── Genis ekranda bos kalan yer kullanilir (2026-08-28, kullanici:
   "sag taraf bos, basketi oraya alabilirsin").
   Olcum: 1920px ekranda icerik 1400px ve ortalanmis — iki yanda 260'ar px
   bos. Kap 1720px'e kadar genisler; urun listesi ve sepet paneli otomatik
   buyur. Kucuk ekranlarda max-width devrede oldugu icin degisiklik yok. */
/* (kap genisletme denemesi geri alindi — liste daraliyordu) */

/* ⚠️ Kap genisletilince urun listesi DARALDI (778px → 560px): esnek olmayan
   sutunlar (kategori paneli + sepet) yeri kapip listeyi sikistirdi, satir
   icerigi alt alta dustu. Sutun paylari acikca tanimlanir: yanlar sabit,
   liste kalan alani alir. */
/* liste kalan alani alsin; yan sutunlar site olcusunde kalir */
[class*="Index_productList__"]{ flex:1 1 auto !important; min-width:0 !important; }

/* ── Sepet paneli: adet kutulari ve cerceve (2026-08-28) ──────────────
   Sepetteki adet kutulari mavi dolgulaydi (`Basket_productPieceMain__`),
   urun listesindeki sayacla ayni dilde degildi. Notr kutu + koyu rakam;
   arti/eksi listedekiyle ayni sicak renkte. */
[class*="Basket_productPieceMain__"]{
  background:transparent !important; color:var(--metin) !important;
  border:1px solid var(--cizgi) !important; border-radius:8px !important;
  font-weight:600 !important; font-variant-numeric:tabular-nums !important;
  min-width:34px !important;
}
[class*="Basket_productPieceMain__"] *{ color:var(--metin) !important; }
[class*="Basket_wrapper__"] button[class*="add"], [class*="Basket_wrapper__"] button[class*="Add"],
[class*="Basket_wrapper__"] button[class*="delete"], [class*="Basket_wrapper__"] button[class*="Delete"],
[class*="Basket_wrapper__"] [class*="plus"], [class*="Basket_wrapper__"] [class*="minus"]{
  color:var(--eylem) !important; background:transparent !important; border:0 !important;
}
[class*="Basket_wrapper__"] button[class*="add"] svg, [class*="Basket_wrapper__"] button[class*="delete"] svg,
[class*="Basket_wrapper__"] button[class*="add"] svg path, [class*="Basket_wrapper__"] button[class*="delete"] svg path{
  fill:var(--eylem) !important; stroke:var(--eylem) !important;
}
/* sepet kutusunun sari/turuncu cercevesi notr sac teline iner */
[class*="Basket_wrapper__"], [class*="Basket_body__"], [class*="Basket_basketMain__"]{
  border-color:var(--cizgi) !important;
}
[class*="Basket_wrapper__"] [style*="border"]{ border-color:var(--cizgi) !important; }

/* Hapin ARKASINDA ikinci bir kutu goruluyordu: ic ogelerin (deleteMain /
   addMain / input kabi) kendi cerceveleri hapin cercevesiyle ust uste
   biniyordu. Hap disinda hicbir ic oge cerceve/golge tasimaz. */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac *{
  border:0 !important; box-shadow:none !important; outline:0 !important;
  background-image:none !important;
}
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-sayac{
  border:1px solid var(--cizgi) !important; box-shadow:none !important;
}
/* cop kutusu kabi da tek cerceve */
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child > [class*="Index_counterMain__"]:last-child *{
  border:0 !important; box-shadow:none !important;
}

/* Ayni sorun "Sepete ekle" halinde de vardi: dugmenin arkasindaki kaplar
   (counterMain / addMain) beyaz zemin + cerceve tasiyip hapin solunda
   ikinci bir kutu gibi goruluyordu. Sayac YOKKEN de tum kaplar seffaf. */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-ekle,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-ekle [class*="Index_addMain__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_counterMain__"].dts-ekle > div{
  background:transparent !important; background-color:transparent !important;
  border:0 !important; box-shadow:none !important; padding:0 !important;
}
/* dugmenin kendi golgesi de kalksin — kenarda hat gibi duruyordu */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]{
  box-shadow:none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   SEPET SAYFASI  (/basket)  — 2026-08-28

   Bu sayfa tasarim turunun disinda kalmisti: "Upload Order" hala ESKI
   MARKA YESILI cerceveliydi (#63BA27), uc dosya dugmesi uc ayri renkte
   (mavi / yesil / gri), "Save Order" mavi doluydu.

   Duzen: dosya dugmeleri notr ve ayni; sayfanin TEK birincil eylemi
   "Save Order" sicak renkte.
   ⚠️ Bu dugmelerin `class` niteligi YOK — `button:not([class])` ile
   hedefleniyorlar, o yuzden kapsayici sinirlamasi sart.
   ═══════════════════════════════════════════════════════════════════════ */
[class*="Index_contents__"] button:not([class]),
[class*="Index_basketNoteMain__"] button:not([class]),
[class*="Index_main__"].dts-sepet button:not([class]){
  background:var(--yuzey) !important;
  border:1px solid var(--cizgi) !important;
  color:var(--metin) !important;
  border-radius:10px !important;
  font-weight:500 !important;
  transition:background-color .18s var(--yay), border-color .18s var(--yay) !important;
}
[class*="Index_contents__"] button:not([class]) *{ color:var(--metin) !important; }
[class*="Index_contents__"] button:not([class]) svg,
[class*="Index_contents__"] button:not([class]) svg path{ fill:var(--metin2) !important; }
[class*="Index_contents__"] button:not([class]):hover{
  background:var(--zemin) !important; border-color:var(--metin3) !important;
}

/* Sayfanin birincil eylemi */
[class*="Index_basketButtonMain__"]{
  background:var(--eylem) !important; border:1px solid var(--eylem) !important;
  border-radius:var(--hap) !important;
}
[class*="Index_basketButtonMain__"] *{ color:#fff !important; font-weight:700 !important; }
[class*="Index_basketButtonMain__"]:hover{ background:var(--eylem-koyu) !important; border-color:var(--eylem-koyu) !important; }

/* Ozet kartlari ve adres: sac teli, notr */
[class*="Index_basketAmountMain__"], [class*="Index_addressMain__"], [class*="Index_addressCard__"]{
  border:1px solid var(--cizgi) !important; border-radius:10px !important;
  background:var(--yuzey) !important; box-shadow:var(--g1) !important;
}
/* Siparis notu alani */
[class*="Index_basketNote"] textarea, [class*="Index_contents__"] textarea{
  border:1px solid var(--cizgi) !important; border-radius:10px !important;
  font-family:inherit !important; font-size:13.5px !important; color:var(--metin) !important;
  background:var(--yuzey) !important; padding:10px 12px !important;
}
[class*="Index_basketNote"] textarea:focus-visible, [class*="Index_contents__"] textarea:focus-visible{
  outline:2px solid var(--mavi) !important; outline-offset:1px !important; border-color:var(--mavi) !important;
}
/* "Sepeti bosalt": yikici eylem, kirmizi metin */
[class*="Index_clearBasket__"]{
  color:var(--kotu) !important; border:0 !important; background:transparent !important;
  font-weight:500 !important;
}
[class*="Index_clearBasketContainer__"]{ border:0 !important; }

/* ═══════════════════════════════════════════════════════════════════════
   SEPET SAYFASINDA SAYACA DOKUNMA  (2026-08-28)

   ⚠️ Sepet sayfasindaki satir yapisi LISTEDEKINDEN FARKLI:
   `deleteMain` orada "eksi" degil COP KUTUSU, ayri bir "eksi" yok.
   Liste icin yazilan sayac kurallari (34px kare, `* { border:0 }`,
   `overflow:hidden`) buraya uygulaninca "+" ikonu kayboldu ve adet
   kutusu bos gorundu — musteri adet degistiremiyordu.

   Cozum: sepet sayfasinda (`Index_basketMain__`) sayac ogeleri sitenin
   kendi stiline birakilir. Liste sayfasi etkilenmez.
   ═══════════════════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════════════════════════════
   SEPET SAYFASI SAYACI — listedekiyle ayni hap  (2026-08-28)

   Olculdu: yapi listeyle AYNI —
     counterMain(dis) › counterMain(hap: eksi · adet · arti) › counterMain(cop)
   Ilk denemede bu dogrulanmadan liste kurallari uygulanmis ve sayac
   kaybolmustu; simdi olcume dayali ve `Index_basketMain__` on ekiyle.
   ═══════════════════════════════════════════════════════════════════════ */
/* hap: eksi · adet · arti tek kutuda */
[class*="Index_main__"].dts-sepet [class*="Index_counterMain__"]:has([class*="Index_addMain__"]){
  border:1px solid var(--cizgi) !important; border-radius:10px !important;
  height:34px !important; padding:0 !important; gap:0 !important;
  overflow:hidden !important; background:transparent !important;
  display:flex !important; align-items:stretch !important;
}
/* dis kap ve cop kabi: cercevesiz */
[class*="Index_main__"].dts-sepet [class*="Index_counterMain__"]:has([class*="Index_counterMain__"]){
  border:0 !important; background:transparent !important; gap:8px !important;
}
/* cop kutusu ayri, ince cerceveli */
[class*="Index_main__"].dts-sepet [class*="Index_counterMain__"]:not(:has([class*="Index_addMain__"])):not(:has([class*="Index_counterMain__"])){
  border:1px solid var(--cizgi) !important; border-radius:10px !important;
  height:34px !important; width:34px !important; overflow:hidden !important;
}
/* dugme kaplari */
[class*="Index_main__"].dts-sepet [class*="Index_deleteMain__"],
[class*="Index_main__"].dts-sepet [class*="Index_addMain__"]{
  width:32px !important; height:100% !important; flex:0 0 32px !important;
  display:grid !important; place-items:stretch !important;
  background:transparent !important; border:0 !important;
}
/* dugmeler: kare bolum, sicak isaret */
[class*="Index_main__"].dts-sepet [class*="Index_addButton__"],
[class*="Index_main__"].dts-sepet [class*="Index_deleteButton__"]{
  width:100% !important; height:100% !important; min-width:0 !important; max-width:none !important;
  padding:0 !important; border:0 !important; border-radius:0 !important;
  background:transparent !important; color:var(--eylem) !important;
  font-size:16px !important; font-weight:600 !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  opacity:1 !important; visibility:visible !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_addButton__"] *,
[class*="Index_main__"].dts-sepet [class*="Index_deleteButton__"] *{ color:var(--eylem) !important; }
[class*="Index_main__"].dts-sepet [class*="Index_addButton__"] svg,
[class*="Index_main__"].dts-sepet [class*="Index_deleteButton__"] svg,
[class*="Index_main__"].dts-sepet [class*="Index_addButton__"] svg path,
[class*="Index_main__"].dts-sepet [class*="Index_deleteButton__"] svg path{
  fill:var(--eylem) !important; stroke:var(--eylem) !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_addButton__"]:hover,
[class*="Index_main__"].dts-sepet [class*="Index_deleteButton__"]:hover{
  background:rgba(217,119,6,.10) !important;
}
/* adet kutusu: cercevesiz, ortali */
[class*="Index_main__"].dts-sepet [class*="Index_counterMain__"] input{
  width:44px !important; min-width:44px !important; max-width:44px !important;
  height:100% !important; border:0 !important; border-radius:0 !important;
  background:transparent !important; text-align:center !important;
  font-size:13.5px !important; font-weight:600 !important; color:var(--metin) !important;
  padding:0 !important; opacity:1 !important; visibility:visible !important;
}

/* ── Footer politika baglantilari (2026-08-28) ────────────────────────
   Dogru kap: `Footer_bottomRow__` (icinde Cookie Settings · Privacy Policy ·
   Data Sub-Processors · Legal Notice · Terms & Conditions).
   SILINMEDI, gizlendi — bu satiri kaldirmak baglantilari geri getirir.
   ⚠️ AB musterisi varsa cerez/gizlilik baglantisi yasal gerekliliktir. */
[class*="Footer_bottomRow__"]{ display:none !important; }

/* ── Sepet sayfasindaki dosya dugmeleri (2026-08-28) ──────────────────
   "Upload Order" hala ESKI MARKA YESILI cerceveliydi, "Download Order"
   mavi, "Example Order File" gri — uc ayri dil. Ucu de notr ve ayni.
   ⚠️ Bu dugmelerin `class` niteligi YOK; kapsayicisi `Index_infoMain__`. */
[class*="Index_infoMain__"] button:not([class]){
  background:var(--yuzey) !important;
  border:1px solid var(--cizgi) !important;
  color:var(--metin) !important;
  border-radius:10px !important;
  font-weight:500 !important;
  transition:background-color .18s var(--yay), border-color .18s var(--yay) !important;
}
[class*="Index_infoMain__"] button:not([class]) *{ color:var(--metin) !important; }
[class*="Index_infoMain__"] button:not([class]) svg,
[class*="Index_infoMain__"] button:not([class]) svg path{ fill:var(--metin2) !important; }
[class*="Index_infoMain__"] button:not([class]):hover{
  background:var(--zemin) !important; border-color:var(--metin3) !important;
}

/* ── Sepet sag sutunu: dogru sira (2026-08-28) ────────────────────────
   Kullanici: *"save order butonu en alta gelmesi gerekiyor"* ve
   *"[siparis notu] adresin ustune gelmesi gerekiyor"*.
   Istenen sira:  dosya dugmeleri → siparis notu → adres → ozet → KAYDET
   Kap `Index_infoMain__` grid'di; tek kolona alinip `order` ile siralandi. */
/* ⚠️ `Index_infoMain__` HEM sag sutunda HEM urun satirinda kullaniliyor.
   Genel yazilinca sepet satirlarinin duzeni de bozuldu (fiyat uste, ad alta).
   Sag sutun, icinde OZET kartini barindirmasindan taninir. */
[class*="Index_infoMain__"].dts-sepet-sag{
  display:flex !important; flex-direction:column !important;
  gap:14px !important; align-items:stretch !important;
}
/* siparis notu tam genislik, dugmelerin altinda */
[class*="Index_infoMain__"].dts-sepet-sag > textarea,
[class*="Index_infoMain__"].dts-sepet-sag > [class*="Note"],
[class*="Index_infoMain__"].dts-sepet-sag > [class*="note"],
[class*="Index_infoMain__"].dts-sepet-sag > div:has(> textarea){
  width:100% !important; max-width:none !important;
  height:64px !important; min-height:64px !important; max-height:64px !important;
  order:2 !important; resize:vertical !important;
}
/* adres ve ozet sirayla */
[class*="Index_infoMain__"].dts-sepet-sag > [class*="address"],
[class*="Index_infoMain__"].dts-sepet-sag > [class*="Address"],
[class*="Index_infoMain__"].dts-sepet-sag > div:has([class*="Address"]){ order:3 !important; }
[class*="Index_infoMain__"] > [class*="Index_basketAmountMain__"],
[class*="Index_infoMain__"] > div:has(> [class*="Index_basketAmountMain__"]){ order:4 !important; width:100% !important; }
/* kaydet en altta, tam genislikte */
[class*="Index_basketButtonMain__"]{
  order:99 !important; width:100% !important; max-width:none !important;
  margin:4px 0 0 !important; min-height:46px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}

/* ── Sepet satiri: apex duzeni (2026-08-28, kullanici gorseli) ────────
   [gorsel]  FIYAT (sicak)
             Urun adi (kalin)
             Kod (gri)
             Stock: ● durum            [− 1 +]  [cop]
   Hepsi SOLA yasli; fiyat adin ustunde ve sicak renkte (apex'te de oyle). */
[class*="Index_main__"].dts-sepet [class*="Index_productContainer__"]{
  align-items:center !important; gap:14px !important; padding:14px !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_productButton__"]{
  display:grid !important; grid-template-columns:64px 1fr !important;
  gap:14px !important; align-items:center !important; text-align:left !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_productFigure__"]{
  width:64px !important; height:64px !important; flex:0 0 64px !important;
  border:1px solid var(--cizgi) !important; border-radius:10px !important;
  background:var(--zemin) !important; display:grid !important; place-items:center !important;
  margin:0 !important; overflow:hidden !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_productFigure__"] img{
  width:52px !important; height:auto !important; max-height:52px !important;
  object-fit:contain !important;
  opacity:1 !important; filter:saturate(1.35) contrast(1.08) !important;
}
/* bilgi blogu: fiyat · ad · kod alt alta, sola yasli */
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"]:not(.dts-sepet-sag){
  display:flex !important; flex-direction:column !important;
  align-items:flex-start !important; text-align:left !important; gap:3px !important;
  grid-template-columns:none !important; grid-template-areas:none !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_infoPrice__"]{
  order:1 !important; color:var(--eylem) !important; font-size:16px !important;
  font-weight:700 !important; text-align:left !important; margin:0 !important;
  font-variant-numeric:tabular-nums !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"] > [class*="Index_name__"]:nth-of-type(1){
  order:2 !important; font-size:13.5px !important; font-weight:600 !important;
  color:var(--metin) !important; text-align:left !important; white-space:normal !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"] > [class*="Index_name__"]:nth-of-type(2){
  order:3 !important; font-size:11.5px !important; font-weight:400 !important;
  color:var(--metin3) !important; text-align:left !important;
}

/* ⚠️ Siralama yarim kalmisti: `order` verilmeyen ogeler varsayilan 0 alir ve
   BASA gecer — kod ile stok satiri fiyatin ustune ciktiydi. Dordune de
   acik sira verilir: fiyat › ad › kod › stok. */
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"] > [class*="Index_infoPrice__"]{ order:1 !important; }
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"] > [class*="Index_name__"]{ order:2 !important; }
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"] > [class*="Index_infos__"]{ order:3 !important; }
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"] > div:not([class]){ order:4 !important; }

/* fiyat: sicak renk, sola yasli (mavi kalmisti) */
[class*="Index_main__"].dts-sepet [class*="Index_productContainer__"] [class*="Index_infoPrice__"],
[class*="Index_main__"].dts-sepet [class*="Index_productContainer__"] [class*="Index_infoPrice__"] *{
  color:var(--eylem) !important; font-size:16px !important; font-weight:700 !important;
  text-align:left !important; width:auto !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"] > *{ text-align:left !important; width:auto !important; }
[class*="Index_main__"].dts-sepet [class*="Index_infos__"]{ font-size:11.5px !important; color:var(--metin3) !important; }

/* Siparis notu apex olcusunde (kullanici: "cok buyuk bizimki") */
[class*="Index_infoMain__"].dts-sepet-sag textarea{
  height:64px !important; min-height:64px !important; padding:9px 11px !important;
  font-size:13px !important; line-height:1.4 !important;
}

/* ⚠️ `height:64px` verilmesine ragmen alan 84px cikiyordu: textarea
   `content-box` oldugu icin padding (18px) ve cerceve (2px) ustune
   ekleniyor. `border-box` ile verilen olcu TOPLAM yukseklik olur. */
[class*="Index_infoMain__"].dts-sepet-sag textarea{
  box-sizing:border-box !important; height:66px !important;
  min-height:66px !important; max-height:66px !important;
}

/* Sepet satirinda fiyat, urun adiyla ayni hizaya cekilir (icten dolgu/
   ortalama yuzunden birkac piksel sagda duruyordu). */
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"] > [class*="Index_infoPrice__"]{
  align-self:flex-start !important; justify-self:start !important;
  margin:0 !important; padding:0 !important; text-align:left !important;
  display:block !important; width:auto !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_infoMain__"] > [class*="Index_infoPrice__"] *{
  text-align:left !important; margin:0 !important; padding:0 !important;
  justify-content:flex-start !important;
}

/* ⚠️ Sepette hap CERCEVESI KESIK gorunuyordu: dis kap 34px yuksekti ama
   icindeki sayac/cop kutulari 36px — `overflow:hidden` fazlaligi kesiyor,
   cerceve tam cizilmiyordu. Dis kap serbest birakilir. */
[class*="Index_main__"].dts-sepet [class*="Index_counterMain__"]:has([class*="Index_counterMain__"]){
  height:auto !important; overflow:visible !important; align-items:center !important;
}
[class*="Index_main__"].dts-sepet [class*="Index_counterMain__"]:has([class*="Index_addMain__"]),
[class*="Index_main__"].dts-sepet [class*="Index_counterMain__"]:not(:has([class*="Index_addMain__"])):not(:has([class*="Index_counterMain__"])){
  height:36px !important; overflow:hidden !important;
}

/* ⚠️ Urun listesinde STOK SATIRI da `counterMain` — sayac kurallarindan
   cerceve aliyordu, metnin etrafinda gereksiz bir kutu cikiyordu. */
[class*="Index_productList__"] [class*="Index_productContainer__"] > div:last-child > [class*="Index_counterMain__"]:first-child{
  border:0 !important; background:transparent !important; overflow:visible !important;
  height:auto !important; padding:0 !important;
}

/* "Sepete ekle" biraz daraltildi (kullanici: "cok genis") */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"]{
  min-width:118px !important; padding:0 16px !important; font-size:13px !important;
}

/* ═══ UST SEPET PANELI (2026-08-28) ═══════════════════════════════════
   Kullanici: "bu kismi az renklendir cok sade".
   Panel bembeyazdi: fiyat, sayac ve "Go to Basket" hepsi renksiz cikiyordu.
   Kural ayni kaliyor — YUZEY notr, renk yalnizca RAKAMA ve EYLEME girer.
   Ayrica paket genisligi `40vh` idi: panel, pencerenin YUKSEKLIGIYLE
   daralip genisliyordu. Sabit genislige cekildi.                        */

/* kap: sabit genislik + belirgin golge + ustte ince marka seridi */
[class*="Header_headerBasketModal__"]{
  width:380px !important;
  max-width:calc(100vw - 32px) !important;
  box-shadow:0 12px 32px -8px rgba(16,24,40,.18), 0 4px 10px -4px rgba(16,24,40,.08) !important;
  border-radius:14px !important;
  overflow:hidden !important;
  animation:dtsSepetAc .22s var(--yay) both;
}
@keyframes dtsSepetAc{ from{opacity:0; transform:translateY(-6px)} to{opacity:1; transform:none} }

[class*="Header_headerBasketArticle__"]{
  border-radius:14px !important;
  border:1px solid var(--cizgi) !important;
  overflow:hidden !important;
}
/* ust serit: logonun iki mavisi — panele kimlik verir, yer kaplamaz */
[class*="Header_headerBasketArticle__"]::before{
  content:""; display:block; height:3px; flex:0 0 3px;
  background:linear-gradient(90deg,var(--derin),var(--mavi) 55%,var(--acik));
}

/* liste: ayiricilar incelir, satir uzerine gelince zemin */
[class*="Header_headerBasketListProduct__"]{
  border-top:0 !important;
  border-bottom:1px solid var(--cizgi) !important;
}
[class*="Header_headerBasketListProduct__"] [class*="Header_productMain__"]{
  padding:12px 14px !important;
  align-items:center !important;
  transition:background .15s var(--yay);
}
[class*="Header_headerBasketListProduct__"] [class*="Header_productMain__"]:hover{
  background:var(--zemin) !important;
}
[class*="Header_headerBasketListProduct__"] [class*="Header_productMain__"]:not(:last-child){
  border-bottom:1px solid var(--cizgi) !important;
}
[class*="Header_productName__"]{
  color:var(--metin) !important; font-weight:600 !important;
  font-size:13px !important; line-height:17px !important;
}
/* fiyat: panelde renk alan iki yerden biri */
[class*="Header_productPrice__"]{
  color:var(--mavi) !important; font-size:14px !important;
  font-variant-numeric:tabular-nums !important;
}

/* sayac: hap, notr yuzey; isaretler mavi, adet yumusak mavi zeminde */
[class*="Header_headerBasketModal__"] [class*="Header_counterMain__"]{
  border:1px solid var(--cizgi) !important;
  border-radius:var(--hap) !important;
  box-shadow:var(--g1) !important;
  background:var(--yuzey) !important;
  height:34px !important;
}
[class*="Header_headerBasketModal__"] [class*="Header_deleteMain__"],
[class*="Header_headerBasketModal__"] [class*="Header_addMain__"]{
  width:34px !important; height:34px !important;
  background:transparent !important; color:var(--mavi) !important;
}
[class*="Header_headerBasketModal__"] [class*="Header_deleteMain__"]:hover,
[class*="Header_headerBasketModal__"] [class*="Header_addMain__"]:hover{
  background:var(--mavi-yumusak) !important;
}
[class*="Header_headerBasketModal__"] [class*="Header_productPieceMain__"]{
  background:var(--mavi-yumusak) !important; color:var(--mavi) !important;
  width:38px !important; height:34px !important;
  font-weight:600 !important; font-variant-numeric:tabular-nums !important;
}

/* birincil eylem: dolu mavi + tutar yumusak mavi kutuda */
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketRedirect__"]{
  margin:14px !important;
  border:0 !important;
  border-radius:12px !important;
  background:var(--mavi) !important;
  box-shadow:0 2px 8px -2px rgba(0,113,197,.45) !important;
  transition:transform .15s var(--yay), box-shadow .15s var(--yay);
}
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketRedirect__"]:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 16px -4px rgba(0,113,197,.5) !important;
}
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketRedirectButton__"]{
  /* 343. satirdaki genis kural butonu da beyaza boyuyor; seffaf birakip
     kabin mavisini gostermek gerekiyor. */
  background:transparent !important;
  width:52% !important; padding:13px 14px !important;
  font-size:14px !important; color:#fff !important;
  white-space:nowrap !important;
}
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketTotalAmount__"]{
  width:48% !important;
  background:var(--mavi-yumusak) !important;
  color:var(--mavi) !important;
  font-weight:700 !important;
  font-variant-numeric:tabular-nums !important;
  margin:3px 3px 3px 0 !important;
  border-radius:9px !important;
}

/* ═══ UC RENK SISTEMI (2026-08-28, kullanici karari) ═══════════════════
   Kullanici: "teal yapalim" + "arada turuncuda kullan 3 renk olur".
   Her rengin TEK bir isi var; ayni isi iki renk yapmaz:

     MAVI    kimlik ve bilgi  — ust bar, fiyat, baglanti, secili filtre
     TEAL    birincil eylem   — sepete ekle, sepete git, siparisi kaydet
     TURUNCU durum ve uyari   — "yolda / 2-3 gun", yoldaki mal satiri

   Onceden turuncu HEM eylem HEM fiyat HEM sayac idi; sepet sayfasi bu
   yuzden tek renge boguluyordu. Teal, mavinin komsusu oldugu icin stok
   yesiliyle karisma riski var — yesil ayrica saf yesile cekildi.
   ═══════════════════════════════════════════════════════════════════ */
:root{
  --eylem:#0C8574; --eylem-koyu:#0A6E60; --eylem-yumusak:#E6F4F1;
  --vurgu:#D97706; --vurgu-yumusak:#FEF3E2;
  --iyi:#2F7D32;                 /* teal'den 45 derece uzak saf yesil */
}

/* ── fiyat: eylem rengi DEGIL, bilgi rengi ───────────────────────────
   Sepette turuncu, listede koyuydu. Ikisi de maviye cekildi. */
[class*="Index_main__"].dts-sepet [class*="Index_infoPrice__"],
[class*="Index_main__"].dts-sepet [class*="Index_productContainer__"] [class*="Index_infoPrice__"],
[class*="Index_main__"].dts-sepet [class*="Index_productContainer__"] [class*="Index_infoPrice__"] *,
[class*="Index_productList__"] [class*="Index_infoPrice__"],
[class*="Index_productList__"] [class*="Index_infoPrice__"] *{
  color:var(--mavi) !important;
}

/* ── silme: eylem degil, geri alinamaz islem — notr dursun, dokununca uyarsin */
[class*="removeProduct__"] svg, [class*="removeProduct__"] svg path,
[class*="removeIcon__"] svg, [class*="removeIcon__"] svg path{
  fill:var(--metin3) !important; stroke:var(--metin3) !important;
  transition:fill .15s var(--yay);
}
[class*="deleteButton__"]:hover [class*="removeProduct__"] svg,
[class*="deleteButton__"]:hover [class*="removeProduct__"] svg path{
  fill:var(--kotu) !important; stroke:var(--kotu) !important;
}

/* ── ust sepet paneli: birincil eylem artik teal (mavi degil) ─────── */
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketRedirect__"]{
  background:var(--eylem) !important;
  box-shadow:0 2px 8px -2px rgba(12,133,116,.45) !important;
}
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketRedirect__"]:hover{
  box-shadow:0 6px 16px -4px rgba(12,133,116,.5) !important;
}
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketTotalAmount__"]{
  background:var(--eylem-yumusak) !important; color:var(--eylem-koyu) !important;
}
/* panel ustundeki serit de ayni dile gelsin */
[class*="Header_headerBasketArticle__"]::before{
  background:linear-gradient(90deg,var(--derin),var(--mavi) 45%,var(--eylem)) !important;
}
/* fiyat panelde de bilgi rengi */
[class*="Header_productPrice__"]{ color:var(--mavi) !important; }
[class*="Header_headerBasketModal__"] [class*="Header_productPieceMain__"]{
  background:var(--eylem-yumusak) !important; color:var(--eylem-koyu) !important;
}
[class*="Header_headerBasketModal__"] [class*="Header_deleteMain__"],
[class*="Header_headerBasketModal__"] [class*="Header_addMain__"]{ color:var(--eylem) !important; }
[class*="Header_headerBasketModal__"] [class*="Header_deleteMain__"]:hover,
[class*="Header_headerBasketModal__"] [class*="Header_addMain__"]:hover{
  background:var(--eylem-yumusak) !important;
}

/* ── durum renkleri: turuncunun kaldigi yer ─────────────────────────
   "yolda / 2-3 gun" ve o satirin sari zemini turuncu ailesinde kalir;
   artik eylem rengiyle karismaz cunku eylem teal. */
[class*="Index_stock"] [class*="incoming" i], [class*="Index_stock"] [class*="Incoming"]{
  color:var(--vurgu) !important;
}

/* cop kutusu: yukaridaki notr kurali, sepet sayfasinin daha ozgul
   `:has(...) [class*="Index_deleteButton__"] svg` kurali tarafindan
   eziliyordu. Ayni ozgullukte yazip sona aliyoruz — silme eylem degil,
   dokunulunca uyaran notr bir islem. */
/* (cop kutusu kurali yukaridaki ikon-tabanli bloga tasindi) */

/* "Go to Basket": sayfanin birincil eylemi — mavi degil teal.
   (Mavi artik yalnizca kimlik ve bilgi tasiyor.) */
[class*="Basket_goToCartMain__"], [class*="Basket_gotToCart__"]{
  background:var(--eylem) !important; border-color:var(--eylem) !important;
}
[class*="Basket_gotToCart__"]:hover, [class*="Basket_goToCartMain__"]:hover [class*="Basket_gotToCart__"]{
  background:var(--eylem-koyu) !important; border-color:var(--eylem-koyu) !important;
}
[class*="Basket_goToCartMain__"] [class*="Basket_gotToCart__"] *{ color:#fff !important; }

/* ── TURUNCUNUN YERI: siparis dosyasi islemleri ──────────────────────
   Sepet kutusunda uc class'siz dugme var: 1 Download, 2 Upload,
   3 Example. Bunlar sepete ekleme/gitme ile ayni is DEGIL — dosya
   isleri. Teal'den ayirip turuncuya aliyoruz; Upload notr kaliyor
   (ucunden yalnizca ikisi disari veri veriyor).

   ⚠️ Ton: onceki #F08A1D beyaz yaziyla 2.5:1 veriyordu — WCAG'in cok
   altinda. #C2620A ayni canlilikta ama 4.2:1.                        */
:root{ --vurgu:#C2620A; --vurgu-koyu:#9A4E08; --vurgu-yumusak:#FDF1E3; }

[class*="Basket_"] button:not([class]){
  background:var(--zemin) !important; border:1px solid var(--cizgi) !important;
  color:var(--metin) !important;
}
[class*="Basket_"] button:not([class]) *{ color:var(--metin) !important; }
[class*="Basket_"] button:not([class]):hover{ background:#ECECEC !important; border-color:#D5D5D5 !important; }
/* ortadaki Upload: ikincil, notr */


/* Ayni uc dugme sepet SAYFASINDA da var (orada notr kaliyordu).
   Ayni is ayni renk: Download/Example turuncu, Upload notr. */





/* ── Urun detayi sayaci ──────────────────────────────────────────────
   ⚠️ Yukaridaki genis kural `[class*="ProductDetails_"] [class*="addButton"]`
   yalnizca "Sepete ekle"yi degil, sayacin "+" dugmesini de yakaliyordu:
   artik 150px genisliginde dolu bir teal blok oluyor, adet kutusu da mavi
   doluyor ve sayi kayboluyordu. Sayaci listedeki/panel'deki dille
   birlestiriyoruz — hap cerceve, notr yuzey, adet yumusak teal. */
[class*="ProductDetails_addButtonMain__"]{
  display:inline-flex !important; align-items:center !important;
  width:auto !important; min-width:0 !important; height:36px !important;
  background:var(--yuzey) !important; border:1px solid var(--cizgi) !important;
  border-radius:var(--hap) !important; overflow:hidden !important;
  box-shadow:var(--g1) !important; padding:0 !important;
}
[class*="ProductDetails_addButtonMain__"] button,
[class*="ProductDetails_addButtonMain__"] [class*="ProductDetails_addButton__"],
[class*="ProductDetails_addButtonMain__"] [class*="ProductDetails_deleteButton__"]{
  background:transparent !important; color:var(--eylem) !important;
  width:36px !important; min-width:36px !important; max-width:36px !important;
  height:36px !important; padding:0 !important;
  border:0 !important; border-radius:0 !important;
  font-size:17px !important; font-weight:600 !important;
}
[class*="ProductDetails_addButtonMain__"] button:hover{ background:var(--eylem-yumusak) !important; }
[class*="ProductDetails_addButtonMain__"] svg, [class*="ProductDetails_addButtonMain__"] svg path{
  fill:var(--eylem) !important; stroke:var(--eylem) !important;
}
[class*="ProductDetails_productCount__"]{
  background:var(--eylem-yumusak) !important; color:var(--eylem-koyu) !important;
  width:46px !important; min-width:46px !important; height:36px !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  border:0 !important; border-radius:0 !important;
  font-weight:600 !important; font-variant-numeric:tabular-nums !important;
}
[class*="ProductDetails_productCount__"] *,
[class*="ProductDetails_productCount__"] input{
  background:transparent !important; color:var(--eylem-koyu) !important;
  border:0 !important; text-align:center !important; width:100% !important;
  font-weight:600 !important;
}
/* "Stock level" basligi bilgi degil etiket — notr */
[class*="ProductDetails_"] [class*="stockLevel" i]{ color:var(--metin2) !important; font-weight:600 !important; }

/* ── SAYAC: "−" ile "+" AYNI RENK (kullanici gorseli 28.08) ──────────
   ⚠️ `Index_deleteMain__` / `deleteButton__` HEM eksi HEM cop kutusu
   icin kullaniliyor — ayrim ICTEKI IKONDA:
       deleteProduct__ = "−" (azalt)      → eylem rengi, "+" ile ayni
       removeProduct__ = cop kutusu       → notr, hover'da kirmizi
   Onceki "silme notr olsun" kurali ikisini birden yakalayip eksiyi de
   griye cevirmisti; sayacin iki ucu farkli renk goruniyordu.
   `:has()` KULLANILMADI — bu dosyada :has yuku zaten agir.          */
[class*="deleteProduct__"] svg, [class*="deleteProduct__"] svg path,
[class*="addProduct__"] svg, [class*="addProduct__"] svg path,
[class*="deleteIcon__"] svg, [class*="deleteIcon__"] svg path{
  fill:var(--eylem) !important; stroke:var(--eylem) !important;
}

/* ── PASIF DUGME: dolu renk + beyaz yazi = okunmuyordu ───────────────
   Sepet bosken "Download Order" disabled oluyor; opacity .6 ile soluk
   turuncu uzerine beyaz yazi kaliyordu. Pasif dugme renkli olmamali. */
button:disabled, button[disabled]{
  background:var(--zemin) !important; border:1px solid var(--cizgi) !important;
  color:var(--metin3) !important; opacity:1 !important;
  box-shadow:none !important; cursor:not-allowed !important;
}
button:disabled *, button[disabled] *{ color:var(--metin3) !important; }
button:disabled svg path, button[disabled] svg path{ fill:var(--metin3) !important; }
/* dugme yazilari secilmesin — metin secimi dolu zeminde beyaz blok gibi duruyordu */
button{ -webkit-user-select:none !important; user-select:none !important; }

/* ═══ FILTRE CIPLERI — YALNIZ CHECKBOX'LI UC GRUP (2026-08-28) ════════
   Kullanici: "şu yerlerin yerine onları ekleyecektin, bu kadar, üst kısma
   dokunma". Ilk denemede secici tum `Categories_cardWrapper`lari
   yakalamisti; "All Products" karti ve marka kartlari da bozuldu.
   Simdi YALNIZCA 2=Stok, 3=Tip, 4=Marka gruplari hedefleniyor —
   1. gruba (Categories / All Products) hic dokunulmuyor.

   ⚠️ Cipler dagilmisti: kap `space-between` davraniyordu, cocuklar iki uca
   yapisiyordu. `justify-content:flex-start` sart.
   ⚠️ Checkbox gizlenmiyor, `appearance:none` ile NOKTANIN KENDISI oluyor —
   secili durum `:checked` ile calisiyor, `:has()` gerekmiyor.        */
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"],
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"],
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"]{
  flex-direction:row !important; flex-wrap:wrap !important;
  justify-content:flex-start !important; align-items:center !important;
  gap:8px !important; width:100% !important;
}
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] > div,
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"] > div,
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] > div{
  width:auto !important; min-width:0 !important; max-width:none !important;
  flex:0 0 auto !important;
  display:inline-flex !important; align-items:center !important; gap:7px !important;
  height:32px !important; padding:0 12px !important; margin:0 !important;
  background:var(--zemin) !important;
  border:1px solid transparent !important; border-radius:9px !important;
  cursor:pointer !important;
  transition:background .15s var(--yay), border-color .15s var(--yay);
}
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] > div:hover,
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"] > div:hover,
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] > div:hover{
  background:#ECECEF !important; border-color:var(--cizgi) !important;
}
/* checkbox → renkli nokta */
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] input[type="checkbox"],
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"] input[type="checkbox"],
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] input[type="checkbox"]{
  -webkit-appearance:none !important; appearance:none !important;
  width:7px !important; height:7px !important;
  min-width:7px !important; max-width:7px !important; flex:0 0 7px !important;
  border-radius:50% !important; border:0 !important; margin:0 !important; padding:0 !important;
  background:var(--metin3) !important; box-shadow:none !important; cursor:pointer !important;
  transition:box-shadow .15s var(--yay);
}
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] input[type="checkbox"]:checked,
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"] input[type="checkbox"]:checked,
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] input[type="checkbox"]:checked{
  box-shadow:0 0 0 2px rgba(0,0,0,.10) !important;
}
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] label,
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"] label,
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] label{
  font-size:13px !important; font-weight:500 !important; color:var(--metin) !important;
  white-space:nowrap !important; margin:0 !important; cursor:pointer !important;
}
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] input:checked + label,
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"] input:checked + label,
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] input:checked + label{
  font-weight:600 !important;
}
/* nokta renkleri — SIRAYA gore (site 9 dilli, metne gore olmaz) */
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] > div:nth-child(1) input{ background:var(--iyi) !important; }
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] > div:nth-child(2) input{ background:var(--kotu) !important; }
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] > div:nth-child(3) input{ background:var(--vurgu) !important; }
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"] > div:nth-child(1) input{ background:var(--mavi) !important; }
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"] > div:nth-child(2) input{ background:var(--metin3) !important; }
[class*="Categories_wrapper"]:nth-child(3) > [class*="cardWrapper"] > div:nth-child(3) input{ background:var(--acik) !important; }
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] > div:nth-child(1) input{ background:var(--derin) !important; }
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] > div:nth-child(2) input{ background:var(--vurgu) !important; }

/* ═══ APEX PALETINE GECIS (2026-08-28, kullanici karari) ══════════════
   Kullanici: "apexin renklerine geçiş yapacağız, apex gibi olacak, tüm
   renkleri ona göre ayarla". Palet apex'in CANLI paketinden cikarildi
   (31.97.77.102, emrahdev-market-web-shopapex, .next/static/css) —
   tahmin degil, kullanim sikligina gore olculdu:

     #f69523  turuncu   → apex'in eylem rengi (12 kez)
     #243244  lacivert  → koyu yuzey / ust bar (10)
     #2194cf  mavi      → bilgi, baglanti (7)
     #28a745  yesil     → stok var (7)
     #dc3545  kirmizi   → stok yok (4)
     #ffd300  sari      → yoldaki mal vurgusu (3)
     #191919 / #697488 / #a2a2a2   metin kademeleri
     #f5f5f5 / #e4e7ec             zemin ve saç teli

   Teal kaldirildi — apex paletinde yok. Renk ROLLERI korunuyor:
     turuncu = birincil eylem · lacivert = ikincil eylem ve ust bar
     mavi = fiyat/bilgi · yesil-kirmizi-sari = durum

   ⚠️ KONTRAST: #f69523 uzerine beyaz yazi 2.5:1 — WCAG'in altinda.
   Apex boyle kullaniyor ve kullanici "aynisi olsun" dedi; karar kayda
   gecti. Dolu turuncu dugmelerde yazi 700 agirlikta tutuluyor ki
   okunurluk mumkun oldugunca korunsun.                                */
:root{
  --eylem:#f69523;  --eylem-koyu:#DE7F0C;  --eylem-yumusak:#FEF1E0;
  --vurgu:#243244;  --vurgu-koyu:#18222F;  --vurgu-yumusak:#EAECF0;
  --derin:#243244;  --derin-koyu:#18222F;
  --mavi:#2194cf;   --mavi-koyu:#1A78A8;   --mavi-yumusak:#E8F4FB;
  --acik:#5BB8E5;
  --metin:#191919;  --metin2:#697488;      --metin3:#A2A2A2;
  --zemin:#F5F5F5;  --yuzey:#FFFFFF;       --cizgi:#E4E7EC;
  --iyi:#28a745;    --kotu:#dc3545;        --bekle:#B25000;
  --primary-color:#2194cf !important;
}
/* ust bar apex'in laciverti */
[class*="Navbar_nav"]{ background:var(--derin) !important; }

/* dolu turuncu dugmelerde yazi kalin — dusuk kontrasti dengeler */
[class*="Index_productList__"] [class*="Index_counterMain__"].dts-ekle button[class*="Index_addButton__"],
[class*="Basket_saveOrder"], [class*="saveOrder"],
[class*="Basket_goToCartMain__"], [class*="Basket_gotToCart__"]{
  font-weight:700 !important;
}

/* yoldaki mal satiri: apex'in sarisi */
[class*="Index_productList__"] [class*="Index_productContainer__"][style*="background"],
[class*="Index_main__"].dts-sepet [class*="Index_productContainer__"][style*="background"]{
  background:#FFF8DC !important;
}

/* Filtre noktalari: `--vurgu` apex gecisinde turuncudan laciverte dondu;
   "yolda" ve Xiaomi noktalari da onunla birlikte griye kaymisti.
   Ikisi de anlamca TURUNCU: biri "yolda" durumu, digeri Xiaomi'nin
   marka rengi. */
[class*="Categories_wrapper"]:nth-child(2) > [class*="cardWrapper"] > div:nth-child(3) input{ background:#f69523 !important; }
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] > div:nth-child(2) input{ background:#f69523 !important; }

/* Ust bar: apex'te LACIVERT DEGIL, parlak mavi (kullanici ekran goruntusu).
   Palet olcumunde #243244 en cok gecen koyu tondu ama o, barin degil ic
   yuzeylerin rengiymis. Bar apex'in mavisi: #2194cf. */
:root{ --derin:#2194cf; --derin-koyu:#1A78A8; }
[class*="Navbar_nav"]{ background:#2194cf !important; }
#dts-fiyat-listesi-dugmesi, #dts-fiyat-listesi-dugmesi *{ color:#1A78A8 !important; }
#dts-fiyat-listesi-dugmesi svg, #dts-fiyat-listesi-dugmesi svg path{ fill:#1A78A8 !important; }
/* marka noktasi (Samsung) bar rengiyle ayni aileden kalsin */
[class*="Categories_wrapper"]:nth-child(4) > [class*="cardWrapper"] > div:nth-child(1) input{ background:#2194cf !important; }

/* Sepet SAYFASINDAKI dosya dugmeleri de notr — ayni is, ayni gorunum. */
[class*="Index_main__"].dts-sepet button:not([class]){
  background:var(--zemin) !important; border:1px solid var(--cizgi) !important;
  color:var(--metin) !important;
}
[class*="Index_main__"].dts-sepet button:not([class]) *{ color:var(--metin) !important; }
[class*="Index_main__"].dts-sepet button:not([class]) svg path{ fill:var(--metin2) !important; }
[class*="Index_main__"].dts-sepet button:not([class]):hover{
  background:#ECECEC !important; border-color:#D5D5D5 !important;
}

/* ── "Yolda" noktasi: koyu kahve duruyordu, apex'in turuncusuna acildi */
:root{ --bekle:#f69523; }

/* ── Marka kartlarina urun tipi: "Samsung LCD" / "Xiaomi LCD" ───────── */
/* ("LCD" eki CSS ::after ile metnin uzerine biniyordu — betige tasindi) */

/* ── Ust sepet paneli, BOS hali ──────────────────────────────────────
   Panelde eski yesil (#63BA27) ve koyu gri dolu dugmeler kalmisti;
   apex paletinde o yesil yok. Ikisi de notr: panelde tek dolu dugme
   "Sepete git" olmali.                                                */
[class*="Header_headerBasketModal__"] button,
[class*="Header_headerBasketArticle__"] button:not([class*="RedirectButton"]){
  background:var(--zemin) !important; border:1px solid var(--cizgi) !important;
  color:var(--metin) !important; border-radius:9px !important;
  font-weight:600 !important; box-shadow:none !important;
}
[class*="Header_headerBasketModal__"] button *,
[class*="Header_headerBasketArticle__"] button:not([class*="RedirectButton"]) *{
  color:var(--metin) !important;
}
[class*="Header_headerBasketModal__"] button svg path{ fill:var(--metin2) !important; }
[class*="Header_headerBasketModal__"] button:hover{
  background:#ECECEC !important; border-color:#D5D5D5 !important;
}
/* "Sepete git" panelin TEK dolu dugmesi — turuncu kalir */
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketRedirect__"]{
  background:var(--eylem) !important;
  box-shadow:0 2px 8px -2px rgba(246,149,35,.45) !important;
}
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketRedirectButton__"]{
  background:transparent !important; color:#fff !important; font-weight:700 !important;
}
[class*="Header_headerBasketArticle__"] [class*="Header_headerBasketTotalAmount__"]{
  background:var(--eylem-yumusak) !important; color:#8A4F06 !important;
}
[class*="Header_headerBasketArticle__"]::before{
  background:linear-gradient(90deg,var(--derin),var(--mavi) 45%,var(--eylem)) !important;
}

/* ── FIYAT RENGI: apex mavisi (kullanici gorseli) ────────────────────
   Fiyat metni `span[class*="Index_price__"]` icinde; onceki kural dis
   kabi (`Index_infoPrice__`) hedefledigi icin ic span kendi koyu
   rengini koruyordu. Ikisi birden baglaniyor.                        */
[class*="Index_price__"],
[class*="Index_infoPrice__"] [class*="Index_price__"],
[class*="Index_productList__"] [class*="Index_infoPrice__"],
[class*="Index_productList__"] [class*="Index_infoPrice__"] *,
[class*="Index_main__"].dts-sepet [class*="Index_infoPrice__"],
[class*="Index_main__"].dts-sepet [class*="Index_infoPrice__"] *,
[class*="ProductDetails_"] [class*="price" i]{
  color:var(--mavi) !important;
  font-weight:700 !important;
  font-variant-numeric:tabular-nums !important;
}

/* Sepet kutusundaki dosya dugmeleri: TEK kural, siraya bagli degil.
   (nth-of-type sepet bosken kayiyor ve yanlis dugmeyi boyuyordu.) */
[class*="Basket_"] button:not([class]),
[class*="Basket_"] button:not([class]) *{
  background:var(--zemin) !important; border:1px solid var(--cizgi) !important;
  color:var(--metin) !important; font-weight:600 !important;
}
[class*="Basket_"] button:not([class]) *{ background:transparent !important; border:0 !important; }
[class*="Basket_"] button:not([class]) svg path{ fill:var(--metin2) !important; }
[class*="Basket_"] button:not([class]):hover{ background:#ECECEC !important; border-color:#D5D5D5 !important; }

/* Marka karti: "Samsung LCD" tek satirda sigsin (metin binisiyordu) */
[class*="Categories_panelHeaderWrapper"]{
  white-space:nowrap !important; gap:8px !important;
  font-size:13px !important; overflow:visible !important;
}
[class*="Categories_panel__"]{ min-width:0 !important; }

/* ── LOGO: canli surum ───────────────────────────────────────────────
   Paketin `public/data.png` dosyasi soluk (gri #606060 yazi + acik mavi
   noktalar) ve urun gorseli yerine 36px'te kullanilinca iyice siliniyor.
   Dosya DEGISTIRILMEDI; doygunlugu artirilmis bir kopya nginx'ten
   servis ediliyor ve `content:url()` ile yalniz burada kullaniliyor.
   Liste satirlarinda yazisiz KURE surumu — o boyutta yazi zaten okunmaz. */
[class*="Index_productList__"] [class*="Index_productFigure__"] img,
[class*="Index_main__"].dts-sepet [class*="Index_productFigure__"] img{
  content:url('/dts-data-canli.png') !important;
  opacity:1 !important; filter:none !important;
  object-fit:contain !important;
}
/* detay sayfasi ve yukleme ekrani: tam logo, canli surum */
[class*="ProductDetails_"] [class*="imageMain" i] img{
  content:url('/dts-data-canli.png') !important;
  opacity:1 !important; filter:none !important;
}

/* Stok noktalari inline `background-color` ile ciziliyor; ezmek icin
   style'a gore hedefleniyor. Yesil de apex tonuna cekildi (#008000 donuk). */
[class*="Index_productList__"] span[style*="border-radius: 50%"][style*="green"],
[class*="Index_main__"].dts-sepet span[style*="border-radius: 50%"][style*="green"]{
  background:#28a745 !important;
}
[class*="Index_productList__"] span[style*="border-radius: 50%"][style*="rgb(255, 187, 0)"],
[class*="Index_main__"].dts-sepet span[style*="border-radius: 50%"][style*="rgb(255, 187, 0)"]{
  background:#f69523 !important;
}
/* yazili logo listede okunabilsin diye gorsel kutusu bir tik genis */
[class*="Index_productList__"] [class*="Index_productFigure__"] img{
  width:52px !important; height:auto !important; max-height:40px !important;
}

/* ── Sepet ikonu ve kalan eski yesil ────────────────────────────────
   Ust bardaki sepet SVG'sinin govdesi hala sitenin ESKI yesili
   (#63BA27) ile ciziliyordu — apex paletinde o yesil yok. Gecmis
   siparis satirlarindaki sepet ikonlari da ayni. Turuncuya cevriliyor;
   ikondaki sari detay (#FFD300) apex paletinde zaten var, kaliyor. */
svg path[fill="#63BA27"], svg path[fill="#63ba27"],
svg path[fill="rgb(99, 186, 39)"]{ fill:#f69523 !important; }
[class*="Header_headerBasketFigure__"] svg path:first-child,
[class*="PastOrders_"] svg path:first-child{ fill:#f69523 !important; }

/* Fiyat mavisi: onceki uzun zincirli kural (`…productList… productContainer…
   infoPrice`) daha ozgul oldugu icin koyu rengi kazaniyordu. Ayni
   uzunlukta yazilip sona alindi. */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_infoPrice__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_infoPrice__"] *,
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_price__"],
[class*="Index_main__"].dts-sepet [class*="Index_productContainer__"] [class*="Index_price__"]{
  color:var(--mavi) !important; font-weight:700 !important;
}

/* ── Marka karti: "Samsung LCD" tasiyordu ────────────────────────────
   Kart genisligi sabit; ek metin sigmayinca kenara dayaniyor.
   Yazi bir tik kucultulup ic bosluk kisaltiliyor.                    */
[class*="Categories_panelHeaderWrapper"]{
  font-size:12px !important; letter-spacing:-.01em !important;
  white-space:nowrap !important; overflow:visible !important;
}
[class*="Categories_panel__"] > *{ padding-left:8px !important; padding-right:8px !important; }
[class*="Categories_panel__"] img{ max-width:26px !important; }

/* ── Fiyat mavisi: en uzun zincirle yaziliyor ────────────────────────
   Onceki denemeler ayni ozgullukte kalip eski koyu kurali gecemedi.
   Fiyat metni `Index_price__` span'inde; tam yol veriliyor.          */
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_infoMain__"] [class*="Index_infoPrice__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_infoMain__"] [class*="Index_infoPrice__"] [class*="Index_price__"],
[class*="Index_productList__"] [class*="Index_productContainer__"] [class*="Index_infoMain__"] [class*="Index_infoPrice__"] *{
  color:var(--mavi) !important; font-weight:700 !important;
}