/* ================= TALİP OTO B2B — tema ================= */
:root{
  --bg:#eef1f5; --card:#fff; --ink:#1e2836; --muted:#6b7686; --faint:#9aa4b2;
  --line:#e3e8ef; --line2:#eef1f5;
  /* ⭐ 25.07 (Sefa): kırmızı → KOYU BORDO. Tek yerden değişir; tüm buton/rozet/
     çerçeveler bu üç değişkeni kullanır. */
  --brand:#7a1220; --brand-dark:#5c0d18; --brand-soft:#fbeef0;
  --brand-cizgi:#c99aa1;                 /* odaklanınca kutu çerçevesi */
  --ink-band:#1c2532; --ink-band2:#141b26;
  --ok:#12a150; --ok-soft:#e7f7ee; --no:#e0344b; --no-soft:#fdecef;
  --warn:#c77700;
  --radius:14px; --radius-sm:10px;
  --shadow:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.08);
  --shadow-lg:0 10px 30px rgba(16,24,40,.14);
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:"Nunito Sans",-apple-system,"Segoe UI",Roboto,system-ui,Arial,sans-serif;
  background:var(--bg); color:var(--ink);
  font-size:14px; line-height:1.45; -webkit-tap-highlight-color:transparent;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none}
img{display:block}
.wrap{max-width:1340px; margin:0 auto; padding:0 16px}

/* ---------- header ---------- */
.hdr{position:sticky; top:0; z-index:30}
.topband{background:linear-gradient(180deg,var(--ink-band),var(--ink-band2)); color:#cfd6e0; font-size:14.5px}
.topband .wrap{display:flex; align-items:center; justify-content:space-between; gap:12px; height:52px}
.bal-lbl{color:#8b96a5; margin-right:7px; font-size:13.5px}
/* Üst bant başlığı — tek parça, tek font (Sefa 22.07) */
.ustyazi{color:#dbe2ea; font-weight:700; font-size:14.5px; letter-spacing:.2px; white-space:nowrap}
.bal{font-weight:800; font-size:18px}
.bal.neg{color:#ff8b96} .bal.pos{color:#68e0a0}
.cust{display:flex; align-items:center; gap:10px; min-width:0; text-align:right}
.cust b{color:#eef2f7; font-weight:700; font-size:15px}
.cust span{color:#97a2b1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:52vw}
.cust .av{width:32px;height:32px;border-radius:50%;background:#3340524d;display:flex;align-items:center;justify-content:center;color:#aeb8c6;flex:0 0 auto}
.cust .av svg{width:18px;height:18px}

.mainband{background:var(--card); border-bottom:1px solid var(--line)}
.mainband .wrap{display:flex; align-items:center; gap:16px; height:66px}
.brandlogo{font-weight:900; font-size:25px; letter-spacing:-.5px; flex:0 0 auto; display:flex; align-items:center}
.brandlogo .r{color:var(--brand)} .brandlogo .k{color:var(--ink)}
.brandlogo img{height:46px; width:auto}
.searchbar{flex:1; display:flex; max-width:640px; height:46px}
.searchbar input{
  flex:1; min-width:0; border:2px solid var(--line); border-right:0;
  border-radius:12px 0 0 12px; padding:0 18px; font-size:15px; outline:none; color:var(--ink);
  transition:border-color .15s;
}
.searchbar input:focus{border-color:var(--brand-cizgi)}
.searchbar button{
  border:0; background:var(--brand); color:#fff; font-weight:600; font-size:15px;
  padding:0 26px; border-radius:0 12px 12px 0; cursor:pointer; transition:background .15s;
}
.searchbar button:hover{background:var(--brand-dark)}
.nav{display:flex; align-items:center; gap:22px; flex:0 0 auto; margin-left:auto}
.nav a{display:flex; flex-direction:column; align-items:center; gap:2px; color:var(--muted); position:relative; transition:color .15s}
.nav a:hover{color:var(--brand)}
.nav svg{width:23px;height:23px}
.nav .lbl{font-size:10.5px; font-weight:500}
.badge-count{position:absolute; top:-5px; right:2px; background:var(--brand); color:#fff; font-size:10px; font-weight:700; min-width:16px; height:16px; border-radius:9px; display:flex; align-items:center; justify-content:center; padding:0 3px}

main{padding:22px 0 60px}

/* ---------- arama düzeni ---------- */
.layout{display:flex; gap:20px; align-items:flex-start}
.sidebar{width:210px; flex:0 0 auto}
.results{flex:1; min-width:0}
.result-head{display:flex; align-items:baseline; gap:8px; margin-bottom:14px; color:var(--muted)}
.result-head b{color:var(--ink); font-size:16px}
.section-title{font-size:12px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:var(--faint); margin:22px 0 10px}
.section-title:first-child{margin-top:0}

/* filtre paneli */
.panel{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow)}
.filter{position:sticky; top:120px; padding:16px}
.filter h4{margin:0 0 10px; font-size:12px; letter-spacing:.5px; text-transform:uppercase; color:var(--faint)}
.filter .list{max-height:56vh; overflow:auto; display:flex; flex-direction:column; gap:2px}
.filter label{display:flex; align-items:center; gap:9px; padding:5px 6px; border-radius:8px; cursor:pointer; font-size:13.5px; color:var(--ink)}
.filter label:hover{background:var(--line2)}
.filter input[type=checkbox]{accent-color:var(--brand); width:15px; height:15px}
.filter .clear{margin-top:10px; background:none; border:0; color:var(--faint); font-size:12.5px; cursor:pointer; padding:0}
.filter .clear:hover{color:var(--brand)}

/* ---------- ürün kartı ---------- */
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); margin-bottom:14px; overflow:hidden; transition:box-shadow .18s,transform .18s}
.card:hover{box-shadow:var(--shadow-lg)}
.card.alt{border-left:3px solid var(--brand)}
.card-top{display:flex; align-items:flex-start; gap:14px; padding:15px 16px}
.thumb-btn{
  width:60px;height:60px;border:1px solid var(--line);border-radius:12px;background:var(--line2);
  display:flex;align-items:center;justify-content:center;color:var(--faint);cursor:pointer;flex:0 0 auto;
  transition:border-color .15s,color .15s,background .15s; position:relative;
}
.thumb-btn:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
.thumb-btn svg{width:26px;height:26px}
.thumb-btn .cam{position:absolute;right:-4px;bottom:-4px;width:20px;height:20px;background:var(--brand);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.thumb-btn .cam svg{width:12px;height:12px}
.head-main{min-width:0;flex:1}
.brand-row{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.brand-name{font-weight:800; font-size:15px; letter-spacing:.3px; color:var(--ink)}
.brand-name.big{font-size:17px}
.logo-chip{display:inline-flex;align-items:center;height:26px;padding:2px 8px;background:#fff;border:1px solid var(--line);border-radius:7px}
.logo-chip img{height:18px;max-width:70px;object-fit:contain}
.logo-chip.big{height:30px} .logo-chip.big img{height:22px}
.prodcode{font-weight:800; font-size:16px; color:#0f1722}
.prodname{color:var(--muted); font-size:13.5px; margin-top:3px}

/* teklif satırı */
.offers{border-top:1px solid var(--line); }
.offer{display:flex; align-items:center; gap:14px; padding:11px 16px; font-size:14px; border-top:1px solid var(--line2)}
.offer:first-child{border-top:0}
.offer.out{background:#fcfcfd}
.depot{font-weight:600; color:var(--ink); min-width:150px; display:flex; align-items:center; gap:8px}
.depot .pin{color:var(--faint)}
.stock{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; padding:3px 9px; border-radius:20px}
.stock.yes{background:var(--ok-soft); color:var(--ok)}
.stock.no{background:var(--no-soft); color:var(--no)}
.stock .ic{width:15px;height:15px;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#fff;font-size:10px;font-weight:900}
.stock.yes .ic{background:var(--ok)} .stock.no .ic{background:var(--no)}
.minp{font-size:12px; color:var(--warn); background:#fff7ea; border:1px solid #ffe6bd; padding:2px 7px; border-radius:6px}
.price{margin-left:auto; text-align:right; font-weight:800; font-size:16px; color:#0f1722; white-space:nowrap}
.price .kamp{display:inline-block; margin-left:6px; font-size:10px; font-weight:700; color:var(--warn); background:#fff7ea; padding:1px 5px; border-radius:5px; vertical-align:middle}
.add{border:0; background:var(--brand); color:#fff; font-weight:600; font-size:13px; padding:8px 14px; border-radius:10px; cursor:pointer; white-space:nowrap; transition:background .15s; display:inline-flex; align-items:center; gap:5px}
.add:hover{background:var(--brand-dark)}
.add svg{width:15px;height:15px}
.noadd{font-size:12.5px; color:var(--faint)}

/* boş/uyarı durumları */
.empty{text-align:center; color:var(--faint); padding:80px 0}
.empty .ico{font-size:46px; margin-bottom:10px}

/* ---------- ana sayfa slogan şeridi (başlığın hemen altı) ---------- */
.sloganband{background:linear-gradient(90deg,var(--brand),#a3182b); color:#fff}
.sloganband .wrap{display:flex; align-items:center; justify-content:center; gap:10px;
  min-height:46px; padding-top:8px; padding-bottom:8px; text-align:center}
.sloganband .sl{font-weight:800; font-size:15.5px; letter-spacing:.2px}
.sloganband .sl .ince{font-weight:600; opacity:.92}
.sloganband svg{width:19px; height:19px; flex:0 0 auto; opacity:.95}

/* ---------- alt bilgi (footer) ---------- */
.sfooter{background:var(--ink-band); color:#aab4c2; margin-top:54px; font-size:13.5px}
.sfooter .fust{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:34px; padding:34px 0 28px}
.sfooter h5{color:#fff; font-size:12px; font-weight:800; letter-spacing:.8px; text-transform:uppercase;
  margin:0 0 12px; opacity:.75}
.sfooter img.flogo{height:52px; width:auto; margin-bottom:12px}
.sfooter .funvan{color:#e6ebf2; font-weight:700; font-size:14px}
.sfooter .fslogan{margin-top:6px; line-height:1.5; max-width:330px}
.sfooter a{color:#aab4c2}
.sfooter a:hover{color:#fff}
.sfooter .fsatir{display:flex; align-items:flex-start; gap:9px; margin-bottom:10px; line-height:1.45}
.sfooter .fsatir svg{width:16px; height:16px; flex:0 0 auto; margin-top:2px; color:#7f8b9b}
.sfooter .fsosyal{display:inline-flex; align-items:center; gap:9px; padding:8px 13px; border-radius:10px;
  background:#ffffff14; border:1px solid #ffffff1f; color:#e6ebf2; font-weight:700}
.sfooter .fsosyal:hover{background:#ffffff26; color:#fff}
.sfooter .fsosyal svg{width:18px; height:18px}
.sfooter .fsosyal img{width:22px; height:22px; border-radius:6px}
.sfooter .fkartlar{display:flex; flex-wrap:wrap; gap:9px; margin-top:14px}
.sfooter .fkart{background:#fff; border-radius:8px; padding:0 11px; height:36px; display:flex;
  align-items:center; justify-content:center; box-shadow:0 1px 2px rgba(0,0,0,.25)}
.sfooter .fkart svg{height:20px; width:auto; display:block}
.sfooter .fkart img{height:20px; width:auto; display:block}
.sfooter .falt{border-top:1px solid #ffffff17; padding:14px 0 18px; display:flex; flex-wrap:wrap;
  align-items:center; justify-content:space-between; gap:8px; font-size:12.5px; color:#7f8b9b}
/* ⭐ 29.07 sözleşme/bilgilendirme linkleri (sanal POS + mevzuat şartı) */
.sfooter .fsozlesme{border-top:1px solid #ffffff17; padding:13px 0 0; display:flex; flex-wrap:wrap;
  gap:7px 16px; font-size:12.5px}
.sfooter .fsozlesme a{color:#a8b3c1}
.sfooter .fsozlesme a:hover{color:#fff; text-decoration:underline}

/* ana sayfa büyük ortalı arama (boş durum) */
.hero{max-width:760px; margin:0 auto; padding:90px 16px 60px; text-align:center}
.hero .ico{font-size:56px; margin-bottom:22px}
.hero h2{font-size:24px; font-weight:800; color:var(--ink); margin:0 0 26px; letter-spacing:-.3px}
.hero-search{display:flex; height:60px; box-shadow:var(--shadow-lg); border-radius:16px}
.hero-search input{
  flex:1; min-width:0; border:2px solid var(--line); border-right:0; border-radius:16px 0 0 16px;
  padding:0 22px; font-size:18px; outline:none; color:var(--ink);
}
.hero-search input:focus{border-color:var(--brand-cizgi)}
.hero-search button{border:0; background:var(--brand); color:#fff; font-weight:700; font-size:18px; padding:0 34px; border-radius:0 16px 16px 0; cursor:pointer}
.hero-search button:hover{background:var(--brand-dark)}
.hero-hint{color:var(--faint); font-size:14px; margin-top:16px}
.alertbox{background:var(--no-soft); color:var(--no); border-radius:var(--radius-sm); padding:12px 16px; font-size:14px}

/* ---------- ürün tablosu (referans görselin düzeni, çerçeveli kartlar) ---------- */
.tscroll{overflow-x:auto; padding-bottom:2px}
.ptable{width:100%; border-collapse:collapse; table-layout:fixed; font-size:14px; min-width:860px}
.ptable col.c-info{width:214px} .ptable col.c-depo{width:150px}
.ptable col.c-teslim{width:106px} .ptable col.c-min{width:78px}
.ptable col.c-avail{width:118px} .ptable col.c-price{width:128px}
.ptable col.c-act{width:120px}

/* başlık şeridi */
.thead-card{background:#fafbfc; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); overflow:hidden; margin-bottom:12px}
.thead-card th{text-align:left; font-weight:600; color:var(--muted); font-size:13px; padding:13px 14px; white-space:nowrap}
.thead-card th.mid{text-align:center} .thead-card th.right{text-align:right}
.section-title{font-size:13px; font-weight:800; color:var(--ink); margin:16px 0 10px; letter-spacing:.2px}

/* her ürün = ayrı çerçeve */
.pcard{background:var(--card); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); overflow:hidden; margin-bottom:12px; transition:box-shadow .16s}
.pcard:hover{box-shadow:var(--shadow-lg)}
.pcard.alt{border-left:3px solid var(--brand)}
.pcard td{border-top:1px solid var(--line); vertical-align:middle}
.pcard tr:first-child td{border-top:0}

/* sol ürün bilgi hücresi */
.pinfo{vertical-align:top !important; padding:16px; border-right:1px solid var(--line); background:#fff}
.pinfo .logo-top{margin-bottom:11px; min-height:36px; display:flex; align-items:center}
.pinfo .logo-top img{height:36px; max-width:150px; object-fit:contain}
.pinfo .logo-top .noimg{display:inline-block; font-weight:800; color:var(--faint); font-size:13px; letter-spacing:.5px}
.pinfo .pcode{font-size:16px; color:#0f1722; line-height:1.3; overflow-wrap:anywhere}
.pinfo .pcode b{font-weight:800; color:var(--ink)}
.pinfo .pdesc{color:var(--muted); font-size:12.5px; margin-top:6px; line-height:1.4; overflow-wrap:anywhere}
.pinfo .picons{display:flex; gap:8px; margin-top:11px}
.pinfo .cbtn{width:32px;height:32px;border-radius:50%;border:0;background:var(--ink-band);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s}
.pinfo .cbtn:hover{background:var(--brand)}
.pinfo .cbtn svg{width:16px;height:16px}

/* depo satır hücreleri */
.pcard td.c-depo{font-weight:700; color:var(--ink); padding:12px 14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
/* tedarikçinin kodu satırda AYNEN (Sefa 24.07) */
.pcard td.c-depo .tkod{display:block; margin-top:2px; font-size:11.5px; font-weight:600; color:var(--muted); letter-spacing:.2px}
.pcard td.c-teslim{text-align:center; font-weight:700; color:var(--ink)}
.pcard td.c-min{text-align:center; color:var(--muted); white-space:nowrap; font-size:13px}
.pcard td.c-avail{text-align:center}
.pcard td.c-price{text-align:right; font-weight:800; font-size:19px; color:#0f1722; white-space:nowrap; padding-right:10px}
.pcard td.c-price .kamp{display:block; margin-top:3px; font-size:9.5px; font-weight:700; color:var(--warn)}
/* ⭐ 25.07 Dükkan stoğu — toptancı eşleşmesi yok, fiyat yerine rozet */
.pcard td.c-price .fsor{display:inline-block; font-size:12.5px; font-weight:800; color:#9a3412; background:#fff1e6; border:1px solid #fdba74; padding:3px 9px; border-radius:7px}
/* ⭐ 06.08 (Sefa) Volkswagen: stok bilgisi olmayan satır — ✓/✗ yerine yazı.
   ⚠️ Hücre 118px; "Stok sorunuz" iki satıra inmesin diye punto küçük. */
.pcard td.c-avail .ssor{display:inline-block; font-size:11px; font-weight:800; line-height:1.15; color:#075985; background:#e0f2fe; border:1px solid #7dd3fc; padding:3px 6px; border-radius:7px; white-space:nowrap}
.pcard td.c-puan{text-align:center; color:var(--faint)}
.pcard td.c-act{padding:8px 12px 8px 4px; text-align:right}
.chk,.crx{display:inline-flex;width:32px;height:32px;border-radius:50%;color:#fff;align-items:center;justify-content:center}
.chk svg,.crx svg{width:18px;height:18px;display:block}
.chk{background:linear-gradient(145deg,#18c964,#0a9e4a);box-shadow:0 2px 5px rgba(10,158,74,.35),inset 0 1px 0 rgba(255,255,255,.35)}
.crx{background:linear-gradient(145deg,#ff4d5f,#e01a33);box-shadow:0 2px 5px rgba(224,26,51,.35),inset 0 1px 0 rgba(255,255,255,.3)}
.addbtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--brand);color:#fff;font-weight:600;font-size:12.5px;cursor:pointer;font-family:inherit;padding:8px 12px;border-radius:9px;white-space:nowrap;transition:background .15s}
.addbtn:hover{background:var(--brand-dark)}
.addbtn svg{width:15px;height:15px}
.noadd{color:var(--faint)}

/* ---------- görsel modalı ---------- */
.modal-bg{position:fixed; inset:0; background:rgba(15,20,28,.62); display:none; align-items:center; justify-content:center; z-index:60; padding:20px; backdrop-filter:blur(2px)}
.modal-bg.on{display:flex}
.modal{background:#fff; border-radius:16px; max-width:460px; width:100%; overflow:hidden; box-shadow:var(--shadow-lg)}
.modal .mh{display:flex; align-items:center; justify-content:space-between; padding:13px 16px; border-bottom:1px solid var(--line)}
.modal .mh b{font-size:14px}
.modal .mh button{border:0;background:none;font-size:22px;line-height:1;color:var(--faint);cursor:pointer}
.modal .mb{padding:22px; display:flex; align-items:center; justify-content:center; min-height:220px}
.modal .mb img{max-width:100%; max-height:340px; object-fit:contain}
.modal .noimg{color:var(--faint); text-align:center}
.modal .noimg .ico{font-size:40px; margin-bottom:8px}
/* --- internetten görsel arama (fotoğrafı olmayan ürün) --- */
.modal .mb{flex-direction:column; gap:12px}
.netara{color:var(--muted); text-align:center; font-size:14px}
.netara .alt{color:var(--faint); font-size:12.5px; margin-top:4px}
.netara .spin{display:inline-block; width:26px; height:26px; margin-bottom:10px;
  border:3px solid var(--line); border-top-color:var(--brand); border-radius:50%;
  animation:netdon .8s linear infinite}
@keyframes netdon{to{transform:rotate(360deg)}}
.netnot{background:#fffaf0; border:1px solid #f4e3c3; color:var(--warn);
  border-radius:10px; padding:9px 12px; font-size:12.5px; line-height:1.45; text-align:center}

/* ---------- OEM listesi (resim ikonunun yanindaki OEM dugmesi) ---------- */
/* Gorsel kipinde .mb ortalanmis flex; liste kipinde blok + kaydirilabilir. */
.modal-bg.oemmod .modal{max-width:560px}
.modal-bg.oemmod .mb{display:block; padding:12px 16px 16px; min-height:0;
  max-height:66vh; overflow:auto}
.oem-bilgi{color:var(--faint); font-size:12px; margin-bottom:8px}
.oem-ara{width:100%; padding:8px 10px; margin-bottom:10px; font-size:13px;
  border:1px solid var(--line); border-radius:8px; outline:none}
.oem-ara:focus{border-color:var(--brand)}
.oemt{width:100%; border-collapse:collapse; font-size:13px}
.oemt td{padding:5px 6px; border-bottom:1px solid var(--line)}
.oemt tr:last-child td{border-bottom:0}
.oem-no{font-weight:700; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.3px; white-space:nowrap}
.oem-arac{color:var(--faint); font-size:11px; text-align:right;
  text-transform:uppercase; letter-spacing:.4px}

/* ---------- genel tablo/sayfa ---------- */
.page-title{font-size:20px; font-weight:800; margin:0 0 16px; letter-spacing:-.2px}
.list-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden}
.row{display:flex; align-items:center; gap:14px; padding:13px 16px; border-top:1px solid var(--line2); font-size:14px}
.row:first-child{border-top:0}
.grow{flex:1; min-width:0}
.trunc{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.qty{color:var(--muted); font-size:12.5px}
.iconbtn{border:0;background:none;color:var(--faint);font-size:20px;cursor:pointer;padding:2px 6px;border-radius:8px}
.iconbtn:hover{color:var(--no);background:var(--no-soft)}
.summary{display:flex; align-items:center; justify-content:space-between; margin-top:18px}
.summary .big{font-size:22px; font-weight:800}
.btn-primary{display:block; width:100%; text-align:center; border:0; background:var(--brand); color:#fff; font-weight:600; font-size:15px; padding:14px; border-radius:12px; cursor:pointer; margin-top:16px; transition:background .15s}
.btn-primary:hover{background:var(--brand-dark)}
.hint{font-size:12px; color:var(--faint); text-align:center; margin-top:8px}
.pill{font-size:11.5px; padding:3px 10px; border-radius:20px; font-weight:600; background:#fff4e0; color:var(--warn)}

/* liste-kart içi tablo başlık hizası (th varsayılan ortalıyı ez) + satır çizgileri */
.list-card .ptable thead th{text-align:left; font-weight:600; color:var(--muted); font-size:13px; white-space:nowrap; padding:12px 14px; background:#fafbfc; border-bottom:1px solid var(--line)}
.ptable .mid{text-align:center}
.ptable .right{text-align:right}
.list-card .ptable tbody tr td{border-top:1px solid var(--line)}
.list-card .ptable tbody tr:first-child td{border-top:0}

/* sepet — adet düzenleyici */
.qedit{display:inline-flex; align-items:center; gap:0; border:1px solid var(--line); border-radius:9px; overflow:hidden}
.qbtn{border:0; background:var(--line2); color:var(--ink); width:30px; height:32px; font-size:17px; font-weight:700; cursor:pointer; line-height:1}
.qbtn:hover:not(:disabled){background:var(--line)}
.qbtn:disabled{color:var(--faint); cursor:default}
.qinput{border:0; border-left:1px solid var(--line); border-right:1px solid var(--line); width:44px; height:32px; text-align:center; font-size:14px; font-weight:700; font-family:inherit; outline:none; -moz-appearance:textfield}
.qinput::-webkit-outer-spin-button,.qinput::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
/* minimum sipariş adedi notu (yalnız kısıtlı üründe çıkar) */
.minnot{margin-top:4px; font-size:11.5px; color:var(--muted); white-space:nowrap}
/* vitrinde minimum adedi 1'den büyük olan ürünün "Min" hücresi vurgulanır */
.ptable td.c-min .mind{display:inline-block; background:#fff4e5; color:#9a5b00;
  border:1px solid #f0c98a; border-radius:6px; padding:1px 6px; font-weight:700}

/* sepet — büyük toplam kutusu */
.total-box{display:flex; align-items:center; gap:20px; margin-top:18px; background:#fff;
  border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow-lg); padding:20px 24px; flex-wrap:wrap}
.total-box .tinfo{display:flex; flex-direction:column}
.total-box .tlabel{font-size:14px; color:var(--muted); font-weight:600}
.total-box .tsub{font-size:12px; color:var(--faint)}
.total-box .tamount{font-size:34px; font-weight:800; color:#0f1722; letter-spacing:-.5px; margin-left:auto}
@media(max-width:560px){ .total-box .tamount{margin-left:0; width:100%} .total-box{gap:12px} }

/* login */
.login-wrap{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;
  background:radial-gradient(1200px 500px at 50% -10%, #f3dde1 0%, var(--bg) 55%)}
.login-card{background:#fff; border-radius:20px; box-shadow:var(--shadow-lg); padding:30px 28px; width:100%; max-width:370px}
.login-card .top{text-align:center; margin-bottom:22px}
.login-card .top .lg{font-weight:900; font-size:27px; letter-spacing:-.5px}
.login-card .top .sub{color:var(--faint); font-size:12.5px; margin-top:4px}
.fld{margin-bottom:14px}
.fld label{display:block; font-size:12px; color:var(--muted); margin-bottom:5px; font-weight:500}
.fld input{width:100%; border:1.5px solid var(--line); border-radius:11px; padding:11px 13px; font-size:15px; outline:none; transition:border-color .15s}
.fld input:focus{border-color:var(--brand-cizgi)}
.err{background:var(--no-soft); color:var(--no); border-radius:10px; padding:9px 12px; font-size:13px; margin-bottom:14px}
.demo{font-size:11.5px; color:var(--faint); text-align:center; margin-top:14px}

/* admin */
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.box{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px}
.box h3{margin:0 0 6px; font-size:14px}
.box p.sub{margin:0 0 14px; font-size:12.5px; color:var(--muted)}
.inline-form{display:flex; align-items:center; gap:8px; font-size:14px; margin-bottom:8px}
.inline-form input[type=number]{width:64px; border:1px solid var(--line); border-radius:8px; padding:6px; text-align:center}
.btn-sm{border:0; background:var(--ink-band); color:#fff; font-size:12.5px; padding:7px 12px; border-radius:9px; cursor:pointer}
.btn-ghost{border:0; background:var(--line2); color:var(--ink); font-size:12.5px; padding:7px 10px; border-radius:8px; cursor:pointer}
.btn-ghost:hover{background:var(--line)}
table.tbl{width:100%; border-collapse:collapse; font-size:13.5px}
table.tbl th{text-align:left; color:var(--faint); font-size:11.5px; text-transform:uppercase; padding:6px 8px; border-bottom:1px solid var(--line)}
table.tbl td{padding:9px 8px; border-bottom:1px solid var(--line2)}

/* mobil-özel öğeler masaüstünde gizli */
.only-mobil{display:none !important}

/* arama kutusu — tek dokunuşla temizleme (✕) */
.qwrap{flex:1; min-width:0; display:flex; position:relative}
.qwrap input{flex:1; min-width:0}
.searchbar .qwrap input{padding-right:38px}
.hero-search .qwrap input{padding-right:46px}
/* ⭐ 26.07 (Sefa): çarpı düzgün YUVARLAK rozet — gri zemin, ortalanmış ince ×,
   üzerine gelince markaya döner. Dokunma hedefi 30px, kutudan taşmaz.
   ⛔ Seçici .qwrap ile GÜÇLÜ tutuldu: `.hero-search button` / `.searchbar button`
   genel kuralları (bordo blok, 0 16 16 0 köşe) çarpıyı ezmesin. */
.qwrap .qsil{position:absolute; right:8px; top:50%; transform:translateY(-50%); display:none;
  align-items:center; justify-content:center; width:30px; height:30px; padding:0 0 2px;
  border:0; background:var(--line2); color:var(--muted); font-size:19px; font-weight:600;
  line-height:1; cursor:pointer; border-radius:50%; font-family:inherit;
  transition:background .15s,color .15s,transform .15s}
.qwrap .qsil.on{display:flex}
.qwrap .qsil:hover{color:#fff; background:var(--brand); transform:translateY(-50%) scale(1.06)}
.qwrap .qsil:active{transform:translateY(-50%) scale(.94)}

/* ================================================================
   TELEFON DÜZENİ (≤820px)
   - üst: logo + arama tek satır, alt: sabit sekme çubuğu
   - tüm tablolar KART'a döner (yatay kaydırma YOK)
   ================================================================ */
@media(max-width:820px){
  body{font-size:15px}
  .wrap{padding:0 12px}

  /* ---- üst bant ---- */
  .topband .wrap{height:44px}
  .topleft{display:none}
  .cust{margin-left:auto; max-width:100%}
  .kbtn b{font-size:14px; max-width:62vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block}
  .cust .av{width:29px;height:29px}
  .kmenu{min-width:min(310px,90vw); top:38px}
  .kmenu a{padding:14px}

  /* ---- ana bant: logo + arama tek satırda ---- */
  .mainband .wrap{height:auto; padding:9px 12px; gap:10px; flex-wrap:nowrap}
  .brandlogo{font-size:20px}
  .brandlogo img{height:34px}

  /* ---- slogan + alt bilgi (telefon) ---- */
  .sloganband .wrap{min-height:0; padding:9px 12px}
  .sloganband .sl{font-size:13.5px}
  .sloganband svg{display:none}
  .sfooter{margin-top:30px; padding-bottom:74px}    /* alt sabit menü çubuğunun altında kalmasın */
  .sfooter .fust{grid-template-columns:1fr; gap:26px; padding:26px 0 20px}
  .sfooter img.flogo{height:44px}
  .sfooter .falt{justify-content:flex-start}
  .searchbar{flex:1; min-width:0; max-width:none; height:44px}
  .searchbar input{font-size:16px; padding:0 13px; border-radius:11px 0 0 11px}   /* 16px = iOS yakınlaştırmaz */
  .searchbar button{padding:0 17px; font-size:15px; border-radius:0 11px 11px 0}

  /* ---- alt sabit sekme çubuğu (parmak menzili) ---- */
  .nav{position:fixed; left:0; right:0; bottom:0; z-index:55; height:60px; margin:0; gap:0;
    background:#fff; border-top:1px solid var(--line); box-shadow:0 -2px 14px rgba(16,24,40,.09);
    justify-content:space-around; padding-bottom:env(safe-area-inset-bottom,0)}
  .nav a{flex:1 1 0; gap:3px; justify-content:center; padding:9px 2px; min-height:56px}
  .nav a:active{background:var(--line2)}
  .nav svg{width:22px;height:22px}
  .nav .lbl{display:block; font-size:10.5px; font-weight:600; white-space:nowrap}
  .badge-count{top:2px; right:26%}
  .only-mobil{display:flex !important}
  main{padding:14px 0 10px}     /* alt boşluk artık footer'da (.sfooter padding-bottom) */

  /* ---- arama sonuç düzeni: filtre üstte yatay şerit ---- */
  .layout{flex-direction:column; gap:12px}
  .sidebar{display:block; width:100%}
  .filter{position:static; padding:11px 12px}
  .filter h4{margin:0 0 8px}
  .filter .list{flex-direction:row; flex-wrap:nowrap; overflow-x:auto; max-height:none; gap:8px;
    padding-bottom:3px; -webkit-overflow-scrolling:touch}
  .filter label{flex:0 0 auto; border:1px solid var(--line); border-radius:20px; padding:10px 14px;
    white-space:nowrap; font-size:13.5px}
  .filter .clear{margin-top:9px}
  .result-head{margin-bottom:10px}
  .section-title{margin:14px 0 8px}
  .thead-card{display:none}

  /* ---- ürün kartları: tablo → blok ---- */
  .tscroll{overflow:visible}
  .ptable{min-width:0 !important; table-layout:auto}
  .ptable colgroup, .ptable col{display:none}
  .pcard table, .pcard tbody, .pcard tr, .pcard td{display:block; width:auto}
  .pcard tr{display:grid; grid-template-columns:1fr auto; align-items:center; gap:3px 12px;
    padding:12px 14px; border-top:1px solid var(--line);
    grid-template-areas:"info info" "depo avail" "teslim min" "price act"}
  .pcard tr:first-child{border-top:0}
  .pcard td{border-top:0 !important; padding:0 !important; white-space:normal}
  .pcard td.pinfo{grid-area:info; border-right:0; border-bottom:1px solid var(--line2);
    padding:0 0 10px !important; margin-bottom:8px}
  .pcard .pinfo .logo-top{min-height:0; margin-bottom:8px}
  .pcard .pinfo .logo-top img{height:28px; max-width:120px}
  .pcard .pinfo .pcode{font-size:15px}
  .pcard .pinfo .picons{margin-top:9px}
  .pcard td.c-depo{grid-area:depo; font-size:15px; overflow:visible; text-overflow:clip}
  .pcard td.c-avail{grid-area:avail; text-align:right}
  .pcard td.c-teslim{grid-area:teslim; text-align:left; font-size:13px; color:var(--muted); font-weight:600}
  .pcard td.c-teslim::before{content:"Teslim: "; color:var(--faint); font-weight:600}
  .pcard td.c-min{grid-area:min; text-align:right; font-size:12.5px}
  .pcard td.c-min::before{content:"Min: "; color:var(--faint)}
  .pcard td.c-price{grid-area:price; text-align:left; font-size:19px; padding-top:8px !important}
  .pcard td.c-price .kamp{display:inline-block; margin:0 0 0 7px; font-size:10px}
  .pcard td.c-act{grid-area:act; text-align:right; padding-top:8px !important}
  .pcard td.c-act form{display:block}
  .pcard .addbtn{padding:11px 17px; font-size:14px; border-radius:11px}

  /* ---- sepet / sipariş kalemleri: tablo → kart ---- */
  .mobil-kart thead{display:none}
  .mobil-kart, .mobil-kart tbody, .mobil-kart tr, .mobil-kart td{display:block; width:auto}
  .mobil-kart tr{display:grid; grid-template-columns:1fr auto; align-items:center; gap:6px 12px;
    padding:13px 14px; border-top:1px solid var(--line);
    grid-template-areas:"urun sil" "sevk teslim" "birim adet" "tutar tutar"}
  .mobil-kart tr:first-child{border-top:0}
  .mobil-kart td{border-top:0 !important; padding:0 !important; text-align:left !important}
  .mobil-kart td.c-urun{grid-area:urun}
  .mobil-kart td.c-sil{grid-area:sil; text-align:right !important}
  .mobil-kart td.c-sevk{grid-area:sevk; font-size:13.5px; color:var(--muted)}
  .mobil-kart td.c-teslim{grid-area:teslim; text-align:right !important; font-size:13px}
  .mobil-kart td.c-teslim::before{content:"Teslim: "; color:var(--faint); font-weight:600}
  .mobil-kart td.c-birim{grid-area:birim; font-size:13px; color:var(--muted)}
  .mobil-kart td.c-birim::before{content:"Birim: "; color:var(--faint)}
  .mobil-kart td.c-adet{grid-area:adet; text-align:right !important}
  .mobil-kart td.c-adet .qty-txt::before{content:"Adet: "; color:var(--faint); font-weight:400}
  .mobil-kart td.c-tutar{grid-area:tutar; text-align:right !important; font-size:18px; font-weight:800;
    border-top:1px solid var(--line2) !important; padding-top:8px !important; margin-top:2px}
  .mobil-kart td.c-tutar::before{content:"Tutar"; float:left; font-size:13px; font-weight:600; color:var(--muted); padding-top:4px}
  .qinput{font-size:16px; width:48px; height:38px}
  .qbtn{width:38px; height:38px; font-size:19px}
  .iconbtn{font-size:26px; padding:2px 10px; line-height:1.2}
  .btn-ghost, .btn-sm{padding:10px 15px; font-size:13.5px; border-radius:10px}

  /* ---- sipariş başlığı / toplam ---- */
  .row{flex-wrap:wrap; gap:8px 12px; padding:12px 14px}
  .row .grow{flex:1 1 100%}          /* başlık kendi satırında, rozet/tutar altta */
  .row form{margin-left:auto !important}
  .page-title{font-size:18px; margin-bottom:12px}
  .total-box{padding:16px; gap:10px; position:sticky; bottom:70px}
  .total-box .tamount{font-size:28px; width:100%; margin-left:0; text-align:right}
  .total-box form{width:100%}
  .total-box .btn-primary{width:100% !important; padding:15px !important}
  .empty{padding:50px 0}
  .hero{padding:40px 12px 30px}
  .hero .ico{font-size:44px; margin-bottom:14px}
  .hero h2{font-size:20px; margin-bottom:18px}
  .hero-search{height:52px}
  .hero-search input{font-size:16px; padding:0 15px; border-radius:14px 0 0 14px}
  .hero-search button{font-size:16px; padding:0 20px; border-radius:0 14px 14px 0}
  .grid2{grid-template-columns:1fr}
  .depot{min-width:120px}
  .price{font-size:15px}
}

/* çok dar telefonlar */
@media(max-width:380px){
  .brandlogo{font-size:18px}
  .searchbar button{padding:0 13px; font-size:14px}
  .nav .lbl{font-size:9.5px}
}

/* ======================= EŞLEYEREK ARAMA (Sefa 24.07) ======================= */
/* Arama kutusunun yanındaki ikincil buton (beyaz zemin, kırmızı çerçeve) */
.searchbar .btn-esle{
  background:#fff; color:var(--brand); border:2px solid var(--line); border-left:0;
  border-radius:0 12px 12px 0; font-weight:700; white-space:nowrap;
}
.searchbar .btn-esle:hover{background:var(--brand-soft); border-color:var(--brand-cizgi)}
.searchbar button:not(.btn-esle):not(.qsil){border-radius:0}
.hero-search .btn-esle{
  border:0; background:#fff; color:var(--brand); font-weight:700; font-size:16px;
  padding:0 22px; border-radius:0 16px 16px 0; cursor:pointer;
  border-left:1px solid var(--line); white-space:nowrap;
}
.hero-search .btn-esle:hover{background:var(--brand-soft)}
.hero-search button:not(.btn-esle):not(.qsil){border-radius:0}

/* 1. aşama: seçim listesi */
.esle-hint{color:var(--muted); font-weight:400; font-size:13px; margin-left:10px}
.eslist{display:flex; flex-direction:column; gap:7px; margin-bottom:18px}
.esrow{
  display:flex; align-items:center; gap:14px; background:#fff;
  border:1px solid var(--line); border-radius:10px; padding:12px 16px;
  text-decoration:none; color:var(--ink); transition:border-color .12s, background .12s;
}
.esrow:hover{border-color:var(--brand); background:var(--brand-soft)}
.esmarka{font-weight:800; min-width:110px}
.eskod{font-weight:700; color:var(--brand); white-space:nowrap}
.estip{background:#eef2ff; color:#3b4a8f; border-radius:999px; padding:2px 10px;
  font-size:11.5px; font-weight:600; white-space:nowrap}
.esad{color:var(--muted); font-size:13px; flex:1; min-width:0}
/* ⭐ 27.07 (Sefa) "TÜM MARKALAR" satırı — marka seçmeden OEM/kod ile hepsi.
   Listenin en üstünde, marka satırlarından ayrışsın diye marka renginde. */
.esoem{border-color:var(--brand); background:var(--brand-soft)}
.esoem:hover{background:#fff}
.esoem .esmarka{color:var(--brand)}
.esoem .estip{background:var(--brand); color:#fff}
/* ⛔ 31.07 (Sefa): ARANAN NUMARA satırı — EN ÜSTTE, bordo çerçeveli (tam
   eşleşmede "TÜM MARKALAR" satırının durduğu yer), ama TIKLANMAZ: link değil,
   fare üstüne gelince hiçbir şey değişmez. Rozeti kırmızı ("birebir yok"). */
.esrow.esyok{cursor:default}
.esrow.esyok:hover{border-color:var(--brand); background:var(--brand-soft)}
.esrow.esyok .estip{background:#fee2e2; color:#991b1b}
.esle-don{display:inline-block; margin-left:12px; color:var(--brand);
  font-weight:600; font-size:13px; text-decoration:none}
.esle-don:hover{text-decoration:underline}

@media(max-width:820px){
  .esrow{flex-wrap:wrap; gap:6px 12px; padding:11px 13px}
  .esmarka{min-width:0}
  .esad{flex-basis:100%}
  .hero-search .btn-esle{font-size:14px; padding:0 12px; border-radius:0 14px 14px 0}
  .searchbar .btn-esle{padding:0 10px; font-size:13px}
  .esle-don{display:block; margin:6px 0 0}
}


/* ================= 25.07 (Sefa): ÜST BANT — KUR + CARİ BAKİYE ================= */
.kurband{display:flex; align-items:center; gap:12px; flex:0 0 auto; white-space:nowrap;
  background:#ffffff12; border:1px solid #ffffff1c; border-radius:10px; padding:5px 11px}
.kurband.bayat{opacity:.5}                    /* günlerdir tazelenememiş kur */
.kurband .kur{display:inline-flex; align-items:baseline; gap:5px}
.kurband .kur i{font-style:normal; color:#8b96a5; font-weight:800; font-size:13px}
.kurband .kur b{color:#eef2f7; font-weight:800; font-size:14.5px; letter-spacing:.2px}
.kurband .kurkaynak{font-size:11px; color:#7f8b9b; letter-spacing:.3px}

.balbox{display:inline-flex; align-items:center; white-space:nowrap; padding:5px 12px;
  border-radius:10px; background:#ffffff12; border:1px solid #ffffff1c; transition:background .15s}
.balbox:hover{background:#ffffff24}

/* Normal arama kapalıyken tek kalan "Ara" butonu birincil görünür (bordo dolgu) */
.searchbar .btn-esle.tek{background:var(--brand); color:#fff; border:0; font-weight:600;
  font-size:15px; padding:0 26px; border-radius:0 12px 12px 0}
.searchbar .btn-esle.tek:hover{background:var(--brand-dark)}
.hero-search .btn-esle.tek{background:var(--brand); color:#fff; border-left:0; font-weight:700;
  font-size:18px; padding:0 34px; border-radius:0 16px 16px 0}
.hero-search .btn-esle.tek:hover{background:var(--brand-dark)}

/* "Sadece stokta olanlar" tiki (sonuç başlığının yanında) */
.stoktik{display:inline-flex; align-items:center; gap:8px; cursor:pointer; user-select:none;
  margin-left:auto; font-size:13.5px; color:var(--ink); background:#fff; border:1px solid var(--line);
  border-radius:20px; padding:6px 13px; box-shadow:var(--shadow); white-space:nowrap}
.stoktik:hover{border-color:var(--brand-cizgi)}
.stoktik input{accent-color:var(--brand); width:16px; height:16px; margin:0}
.stoktik .gizli{color:var(--faint); font-size:12px}

@media(max-width:820px){
  .kurband{gap:9px; padding:3px 8px; border-radius:9px}
  .kurband .kur b{font-size:13.5px}
  .kurband .kurkaynak{display:none}
  .balbox{padding:3px 9px}
  .balbox .bal{font-size:15.5px}
  .result-head{flex-wrap:wrap}
  .stoktik{margin-left:0; width:100%; justify-content:center; padding:10px 13px; font-size:14px}
}
@media(max-width:560px){
  .kurband .kur i{font-size:12px}
  .balbox .bal-lbl{display:none}
  /* Telefonda kur + bakiye üst banda sığsın: uzun cari unvanı menüde zaten var,
     bantta yalnız avatar kalır (yoksa unvan bandı taşırıyordu — ölçüldü). */
  .kbtn b{display:none}
}
@media(max-width:820px) and (min-width:561px){
  .kbtn b{max-width:26vw}
}

/* ================= İHRACAT MODU (Sefa 26.07) =================
   Yurt dışı müşteride depo ve teslim süresi kolonları HİÇ YOK (kaç depodan
   mal topladığımız belli olmasın) ve her üründe tek satır kalır.
   Şablon: vitrin.html `{% if not ihracat %}` + .pcard.ihr sınıfı. */
.pcard.ihr td.pinfo{border-right:1px solid var(--line2)}
@media(max-width:820px){
  /* Mobil kartta boşta kalan "depo"/"teslim" satırları kaldırılır. */
  .pcard.ihr tr{grid-template-areas:"info info" "avail min" "price act"}
}
@media(max-width:820px){
  /* Sepet / Siparişlerim kartı — "sevk"/"teslim" satırı olmadan. */
  .mobil-kart.ihr tr{grid-template-areas:"urun sil" "birim adet" "tutar tutar"}
}

/* Sepete ekleme reddi gibi tek satırlık uyarı şeridi (Sefa 29.07) */
.uyari-serit{max-width:1180px; margin:14px auto 0; padding:11px 16px; border-radius:11px;
  background:#fff7e6; color:#8a5a00; border:1px solid #f5d998; font-size:13.5px; font-weight:700}

/* ⭐ 30.07 Sepette sözleşme onayı (mevzuat + banka üye işyeri denetimi şartı) */
.total-box .onayform{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-left:auto}
.sozonay{display:flex; align-items:flex-start; gap:9px; max-width:420px; font-size:12.5px;
  line-height:1.5; color:var(--muted); cursor:pointer}
.sozonay input{width:17px; height:17px; margin-top:1px; flex:0 0 auto; accent-color:var(--brand); cursor:pointer}
.sozonay a{color:var(--brand); text-decoration:underline; font-weight:700}
@media(max-width:820px){
  .total-box .onayform{margin-left:0; width:100%; flex-direction:column; align-items:stretch}
  .sozonay{max-width:none}
  .total-box .onayform .btn-primary{width:100%}
}