/* ═══════════════════════════════════════════════════════════════════
   UX REFRESH KATMANI v2 — "Premium SaaS" (2026-06)
   Sadece görsel. Hiçbir class/ID/JS değişmedi; bu blok mevcut
   kuralların ÜZERİNE yazar. Silinirse eski görünüme dönülür.
   ═══════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

/* ── 0. Tema tabanı: derinleştirilmiş koyu palet + tasarım token'ları ── */
:root{
  color-scheme:dark;
  --bg:#171310;--card:#211D19;--surf:#2A2521;--surf2:#3A332D;--cb:#37302A;
  --rl:16px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.30),0 1px 8px rgba(0,0,0,.14);
  --shadow-md:0 8px 26px rgba(0,0,0,.34);
  --hl:inset 0 1px 0 rgba(255,255,255,.045);
  --ring:0 0 0 3px rgba(133,183,235,.22);
  --ring-err:0 0 0 3px rgba(240,149,149,.20);
}
:root[data-tema="acik"]{
  color-scheme:light;
  --shadow-sm:0 1px 2px rgba(30,26,23,.05),0 2px 10px rgba(30,26,23,.05);
  --shadow-md:0 10px 30px rgba(30,26,23,.11);
  --hl:inset 0 1px 0 rgba(255,255,255,.85);
  --ring:0 0 0 3px rgba(44,82,130,.16);
  --ring-err:0 0 0 3px rgba(160,68,42,.16);
}

/* ── 1. Tipografi: Inter + tabular sayılar + ortam ışımalı zemin ── */
body,button,input,select,textarea{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;}
body{
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;letter-spacing:-.006em;
  background:
    radial-gradient(1100px 540px at 88% -8%, rgba(55,138,221,.10), transparent 62%),
    radial-gradient(900px 520px at -12% 28%, rgba(201,169,110,.06), transparent 60%),
    var(--bg);
  background-attachment:fixed;
}
:root[data-tema="acik"] body{
  background:
    radial-gradient(1100px 540px at 88% -8%, rgba(59,111,160,.09), transparent 62%),
    radial-gradient(900px 520px at -12% 28%, rgba(138,96,32,.06), transparent 60%),
    var(--bg);
  background-attachment:fixed;
}
/* Işık süzmesi: giriş ekranındaki gibi üstten süzülen yumuşak ışık.
   pointer-events:none → tıklamaları asla engellemez. */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;
  background:
    radial-gradient(820px 460px at 50% -12%, rgba(133,183,235,.085), transparent 62%),
    radial-gradient(620px 420px at 94% 112%, rgba(201,169,110,.05), transparent 60%);}
:root[data-tema="acik"] body::before{
  background:
    radial-gradient(820px 460px at 50% -12%, rgba(44,82,130,.06), transparent 62%),
    radial-gradient(620px 420px at 94% 112%, rgba(138,96,32,.04), transparent 60%);}
input[type=number],.mval,.oinp,.osab,.kur-inp,.gks,.gkm,.pm-cnt,
.atbl td:last-child,.eoinp{font-variant-numeric:tabular-nums;}
::selection{background:var(--blue-m);color:#fff;}
input::placeholder{color:var(--t3);opacity:1;}

/* ── 2. Kartlar: yumuşak derinlik + üst ışık çizgisi (premium his) ── */
.card,.lcard,.gk{box-shadow:var(--shadow-sm),var(--hl);}
.gk{transition:transform .15s ease,box-shadow .2s,border-color .2s,background-color .2s;}
.gk:hover{box-shadow:var(--shadow-md),var(--hl);transform:translateY(-1px);}
.combo-panel{box-shadow:0 14px 52px rgba(0,0,0,.42);border:1px solid var(--cb);}
.ctitle{letter-spacing:.12em;color:var(--blue);}
#left-col h2,.ghdr h2{color:var(--blue)!important;}
.slbl{color:var(--t2);}
.gbos{padding:36px 28px;line-height:1.7;}

/* ── 3. Marka & üst bar: gradyan başlık, hap biçimli arama girişi, blur ── */
.hdr-brand h1{background:linear-gradient(100deg,var(--t1) 35%,var(--blue));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  font-size:18px!important;letter-spacing:-.02em;}
.hdr-sub{display:none!important;}
@media(max-width:480px){.hdr-brand h1{font-size:16px!important;}}
.kumas-isim-inp{border-radius:999px;padding-left:14px;}
@supports (backdrop-filter:blur(8px)){
  .app-header,.kumas-isim-bar,.tab-header{
    background:color-mix(in srgb,var(--card) 86%,transparent);
    backdrop-filter:saturate(1.4) blur(12px);
    -webkit-backdrop-filter:saturate(1.4) blur(12px);}
}
.sekme.aktif{font-weight:600;background:linear-gradient(180deg,transparent 40%,rgba(55,138,221,.10));}
.sekme{border-radius:9px 9px 0 0;}
.sekme-ekle-btn{transition:transform .15s ease,color .15s;}
.sekme-ekle-btn:hover{transform:scale(1.2);}

/* ── 4. İplik mod sekmeleri: segmented control görünümü ── */
.mtabs{padding:3px;gap:3px;background:var(--surf);border-radius:11px;}
.mtabs .mtab{border-right:none;border-radius:8px;background:transparent;}
.mtabs .mtab:hover{background:var(--surf2);}
.mtabs .mtab.on{background:var(--card);color:var(--blue);box-shadow:var(--shadow-sm);}

/* ── 5. Birincil butonlar: gradyan + ışıma, hover'da yükselme ── */
.kbtn,.pbtn,.combo-ekle-btn,.pp-ok{
  background:linear-gradient(180deg,#4795E4,#2F7CC9);border-color:transparent;color:#fff;
  box-shadow:0 2px 10px rgba(55,138,221,.28),inset 0 1px 0 rgba(255,255,255,.18);}
.kbtn:hover,.pbtn:hover,.combo-ekle-btn:hover{
  background:linear-gradient(180deg,#54A0EC,#3787D6);
  box-shadow:0 5px 18px rgba(55,138,221,.38),inset 0 1px 0 rgba(255,255,255,.18);
  transform:translateY(-1px);}
button{touch-action:manipulation;}
button:disabled{opacity:.5;cursor:not-allowed;}
.kbtn,.pbtn,.combo-ekle-btn,.mbtn,.pill,.ppill,.kar-pill,.mtab,
.kur-auto-btn,.addbtn,.pdf-btn,.save-desk-btn,.clbtn,.ebtn,.combo-btn,.pp-ok{
  transition:background-color .15s,border-color .15s,color .1s,
             transform .1s ease,box-shadow .18s!important;}
.kbtn:active,.pbtn:active,.mbtn:active,.pill:active,.kar-pill:active,
.combo-ekle-btn:active,.combo-btn:active,.addbtn:active,.pdf-btn:active,
.save-desk-btn:active,.kur-auto-btn:active{transform:scale(.97);}
.addbtn:hover{border-color:var(--blue-m);color:var(--blue);}
.tlink:hover{color:var(--blue);}

/* ── 6. Hap/pill'ler: seçili durumda mavi ışıma ── */
.pill,.ppill{box-shadow:var(--hl);}
.pill.on,.ppill.on,.combo-btn.on{box-shadow:inset 0 0 0 1px var(--blue-m),0 2px 10px rgba(55,138,221,.16);}
.kar-pill.on{box-shadow:inset 0 0 0 1px var(--blue-m),0 2px 10px rgba(55,138,221,.16);}

/* ── 7. Metrik kartları: renk şeritli hiyerarşi, satış fiyatı sahnede ── */
.met{position:relative;overflow:hidden;border:1px solid transparent;border-radius:12px;}
.mval{font-size:18px;font-weight:700;letter-spacing:-.015em;}
.met.vurg .mval{font-size:22px;}
.met.mal::after,.met.vurg::after{content:"";position:absolute;top:0;left:0;width:100%;height:2px;}
.met.mal::after{background:linear-gradient(90deg,var(--green),transparent 75%);}
.met.vurg::after{background:linear-gradient(90deg,var(--blue),transparent 75%);}
.met.vurg{box-shadow:inset 0 0 0 1px rgba(133,183,235,.14),var(--shadow-sm);
  background:linear-gradient(180deg,color-mix(in srgb,var(--blue-bg) 90%,#fff 10%),var(--blue-bg));}

/* ── 8. Hesap tablosu: nihai satış satırı vurgulu ── */
.atbl tr:hover td{background:color-mix(in srgb,var(--surf) 55%,transparent);}
.atbl tr.sat td{background:linear-gradient(90deg,rgba(55,138,221,.10),transparent 65%);border-top-color:var(--blue-m);}
.atbl tr.sat td:first-child{border-radius:8px 0 0 8px;}
.atbl tr.sat td:last-child{border-radius:0 8px 8px 0;}
.gks{font-size:19px;letter-spacing:-.02em;}

/* ── 9. Formül kutusu: teknik "blueprint" görünümü ── */
.fbox{background:transparent;border:1px dashed var(--cb);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px;}

/* ── 10. Odak halkaları + hatalı giriş ipucu ── */
.pg input[type=number]:focus,.kur-inp:focus,.mform input:focus,
.lform input:focus,.lform select:focus,.pp-inp:focus,.iswrap select:focus,
.combo-field input:focus,.combo-field select:focus,
.combo-fiyat-row input:focus,.kumas-isim-inp:focus{
  border-color:var(--blue-m);box-shadow:var(--ring);}
.owrap:focus-within,.eowrap:focus-within{box-shadow:var(--ring);}
button:focus-visible{outline:2px solid var(--blue-m);outline-offset:2px;}
input:out-of-range,input:user-invalid{
  border-color:var(--red)!important;box-shadow:var(--ring-err)!important;color:var(--red);}

/* ── 11. Listeler: aktif öğe çizgisi, tutamak hover'da belirir ── */
.litem{position:relative;}
.litem.on{box-shadow:inset 2px 0 0 var(--blue-m);}
.litem:hover .drag-handle{opacity:1;}

/* ── 12. Combo panel: sheet animasyonu + blur'lu fon ── */
.combo-overlay{background:rgba(10,8,7,.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
@keyframes ux-fade{from{opacity:0;}to{opacity:1;}}
@keyframes ux-sheet{from{opacity:0;transform:translateY(26px) scale(.985);}to{opacity:1;transform:none;}}
.combo-overlay.open{animation:ux-fade .18s ease;}
.combo-overlay.open .combo-panel{animation:ux-sheet .3s cubic-bezier(.18,.9,.28,1);}

/* ── 13. Giriş & profil ekranı: ilk izlenim ── */
#parola-overlay,#profil-overlay{
  background:
    radial-gradient(820px 480px at 50% -10%,rgba(55,138,221,.16),transparent 60%),
    radial-gradient(620px 420px at 92% 112%,rgba(201,169,110,.09),transparent 60%),
    #14110F!important;}
#parola-overlay>div,#profil-overlay>div{
  border-radius:22px!important;background:#201C18!important;border:1px solid #3A332C!important;
  box-shadow:0 24px 90px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.05);}
#parola-inp,#gizli-inp{border-radius:12px!important;}
#parola-btn{background:linear-gradient(180deg,#8FBDEE,#5E9FDF)!important;
  border-radius:12px!important;box-shadow:0 8px 26px rgba(55,138,221,.32);}

/* ── 14. Mobil: yüzen dock navigasyon + güvenli alan ── */
@media(max-width:768px){
  .mnav{left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));
    border-radius:20px;border:1px solid var(--cb);overflow:hidden;
    box-shadow:0 10px 34px rgba(0,0,0,.35);
    background:color-mix(in srgb,var(--card) 90%,transparent);
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);}
  .container{padding:12px 12px 100px;}
  .main-grid{gap:12px;}
}
.nb{position:relative;}
.nb.on::after{content:"";position:absolute;top:0;left:28%;right:28%;height:2.5px;
  border-radius:0 0 3px 3px;background:var(--blue);}
@media(max-width:480px){
  .kumas-isim-inp{min-width:76px!important;}
}
/* iOS'ta input'a dokununca otomatik zoom olmasın (16px eşiği) */
@media(pointer:coarse) and (max-width:768px){
  .pg input[type=number],.kumas-isim-inp,.combo-field input,.combo-fiyat-row input,
  .mform input,.lform input,.lform select,.iswrap select,.kur-inp,.man-inp{font-size:16px!important;}
}

/* ── 15. Kaydırma çubukları + hareket azaltma ── */
*{scrollbar-width:thin;scrollbar-color:var(--cb) transparent;}
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-thumb{background:var(--cb);border-radius:8px;border:2px solid var(--bg);}
::-webkit-scrollbar-track{background:transparent;}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;}
}

/* ═══ v2.1 — SAĞ KOLON LİSTELERİ & GEÇMİŞ KARTLARI ═══ */

/* ── 16. Masaüstünde sağ kolon yapışkan: kaydırırken listeler görünür kalır ── */
@media(min-width:769px){
  .right-col{position:sticky;top:100px;max-height:calc(100vh - 116px);
    overflow-y:auto;overscroll-behavior:contain;padding-right:2px;
    scrollbar-width:thin;}
}

/* ── 17. Liste öğeleri: hover'da hafif içeri kayma, net seçim durumu ── */
.litem{transition:background .12s,padding-left .12s ease;}
.litem:hover{padding-left:17px;}
.litem.on{background:linear-gradient(90deg,var(--blue-bg),color-mix(in srgb,var(--blue-bg) 35%,transparent));
  box-shadow:inset 2.5px 0 0 var(--blue-m);}
.litem.on .lname{font-weight:600;}
.lname{transition:color .12s;}
.ldel{opacity:.55;transition:opacity .12s,background-color .12s,color .12s;}
.litem:hover .ldel{opacity:1;}
.lhdr{border-bottom-width:1px;}
.lhdr span{letter-spacing:.1em;}
.ebtn{border-radius:7px;font-weight:600;letter-spacing:.02em;}
.ebtn:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm);}
.ebtn{transition:background-color .15s,border-color .15s,color .1s,transform .1s ease,box-shadow .15s!important;}

/* ── 18. İplik satırları & elastan: kart içinde kart hissi ── */
.isat{border-radius:12px;box-shadow:var(--hl);}
/* Tek iplik modunda %100 kutusu satır boyu uzamasın, select ile hizalansın */
.isat.tek{align-items:start;}
.isat.tek .osab{display:flex;align-items:center;justify-content:center;min-height:33px;padding-top:0;padding-bottom:0;}
.erow{border-radius:12px;box-shadow:var(--hl);}
.osab{box-shadow:inset 0 0 0 1px rgba(133,183,235,.18);}
.iswrap select{cursor:pointer;}
.iswrap select:hover{border-color:color-mix(in srgb,var(--cb) 40%,var(--blue-m) 60%);}

/* ── 19. Geçmiş kartları: fiyat gradyan metin, etiketler chip görünümü ── */
.gks{background:linear-gradient(100deg,var(--blue),var(--blue-m));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.gkt{border:1px solid var(--cb);background:var(--surf);border-radius:999px;padding:2px 9px;}
.gkzd{box-shadow:0 0 6px 1px rgba(55,138,221,.45);}
.gk-guncel{border-top-style:solid;border-top-color:color-mix(in srgb,var(--cb) 55%,transparent);}
.boya-toplam{border:1px solid color-mix(in srgb,var(--green) 35%,transparent);}
.gksil{opacity:.55;transition:opacity .12s,background-color .12s,color .12s;}
.gk:hover .gksil{opacity:1;}

/* ── 20. Form panelleri: içe gömük yüzey, net ayrışma ── */
.lform,.mform,.pp-form{background:color-mix(in srgb,var(--bg) 45%,var(--card));
  box-shadow:inset 0 1px 4px rgba(0,0,0,.12);}
:root[data-tema="acik"] .lform,:root[data-tema="acik"] .mform,
:root[data-tema="acik"] .pp-form{box-shadow:inset 0 1px 4px rgba(30,26,23,.05);}

/* ═══ v2.2 — SEKME ÇUBUĞU: kompakt hap sekmeler + boşluk düzeltmesi ═══ */
/* Başlık sabit 48px; sekme çubuğu tam altına kilitlenir → arada sızıntı olmaz */
.app-header{height:48px;padding:0 14px!important;}
.tab-header{top:48px;padding:0 10px;gap:4px;box-shadow:0 4px 14px rgba(0,0,0,.10);}
.sekme{margin:6px 0;padding:4px 6px 4px 12px;border-radius:999px;border-bottom:none;
  font-size:12px;gap:5px;}
.sekme:hover{background:var(--surf);color:var(--t1);}
.sekme.aktif{background:var(--blue-bg);color:var(--blue);font-weight:600;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--blue-m) 50%,transparent);}
.sekme .sekme-kapat{width:15px;height:15px;}
.sekme-ekle-btn{padding:4px 10px;font-size:16px;align-self:center;border-radius:999px;}
.sekme-ekle-btn:hover{background:var(--surf);transform:none;}

/* ═══ v2.3 — FİRE BÖLÜMLERİ: daraltma + yuvarlak % rozetleri ═══ */

/* Parametreler'deki fire bölümleri tek satıra küçülebilir */
.fire-slbl{display:flex;align-items:center;}
.fire-daralt-btn{margin-left:auto;background:none;border:1px solid var(--cb);
  border-radius:999px;color:var(--t3);font-size:10px;padding:2px 9px;cursor:pointer;
  display:flex;align-items:center;gap:3px;letter-spacing:0;text-transform:none;
  font-weight:500;white-space:nowrap;flex-shrink:0;}
.fire-daralt-btn:hover{color:var(--t1);background:var(--surf);border-color:var(--blue-m);}
.slbl.daralt+.pw{display:none;}
.slbl.daralt+.pw+.tlink{display:none;}
.slbl.daralt+.pw+.tlink+.mform{display:none!important;}
.slbl.daralt{margin-bottom:0;}

/* Seçilen malzemeler: fire pilleri → sade % chip'leri (kâr pilleriyle aynı boyut) */
#fason-kart .fire-mini .pill{border-radius:8px!important;padding:5px 10px!important;
  justify-content:center;gap:0!important;min-width:38px;line-height:1.25;
  font-size:12px!important;font-weight:500;background:var(--surf);}
#fason-kart .fire-mini .pill>span:first-child{display:none;}     /* açıklama gizli */
#fason-kart .fire-mini .pill .pd{display:none;}                  /* silme ana karttan */
#fason-kart .fire-mini .pill>span:nth-child(2){opacity:1!important;
  font-size:12px!important;margin:0!important;}
#fason-kart .fire-mini .pill.on>span:nth-child(2){font-weight:700;}
#fason-kart .fire-mini .pill.on{background:var(--blue-bg);font-weight:700;
  box-shadow:inset 0 0 0 1px var(--blue-m);}

/* ═══ v2.4 — EMOJİ → ÇİZGİ İKON ═══ */
.ux-ico{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;flex-shrink:0;}
.ux-ico svg{width:100%;height:100%;display:block;}

/* ═══ v2.5 — LİSTE BAŞLIKLARI: sade & modern ═══ */

/* Başlık: renkli dolgu yerine nötr zemin + renk kimliği başlıkta kalır */
.lhdr{background:var(--surf)!important;padding:8px 12px;}
.lhdr>span:first-child::before{content:'';display:inline-block;width:6px;height:6px;
  border-radius:2px;background:currentColor;margin-right:7px;vertical-align:1px;}
.lhdr .ebtn{border-color:var(--cb)!important;color:var(--t2)!important;background:transparent;}
.lhdr .ebtn:hover{color:var(--t1)!important;border-color:var(--blue-m)!important;}

/* Mod satırı: ince tek satır, "Mod:" etiketi gizli */
.lcard>div:has(>button[onclick^="pvListeModSec"]){padding:5px 10px!important;gap:4px!important;}
.lcard>div:has(>button[onclick^="pvListeModSec"])>span{display:none;}
button[onclick^="pvListeModSec"]{font-size:0!important;padding:3px 8px!important;line-height:1.3!important;flex-shrink:0;}
button[onclick^="pvListeModSec"]::before{font-size:10px;font-weight:600;letter-spacing:.02em;}
button[onclick^="pvListeModSec"][onclick*="'pesin'"]::before{content:'Peşin';}
button[onclick^="pvListeModSec"][onclick*="'vadeli'"]::before{content:'Vadeli';}
button[onclick^="pvListeModSec"][onclick*="'manuel'"]::before{content:'Manuel';}

/* Açıklama metinleri kaldırıldı (mod satırından hemen sonraki bilgi satırı) */
.lcard>div:has(>button[onclick^="pvListeModSec"])+div:not(.satici-blok):not([class]){display:none;}

/* ═══ v2.6 — LIQUID GLASS KATMANI ═══ */
:root{
  --glass-bg:rgba(44,40,37,.55);
  --glass-grad:linear-gradient(135deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,.02) 45%,rgba(255,255,255,.07) 100%);
  --glass-bdr:rgba(255,255,255,.14);
  --glass-hi:rgba(255,255,255,.20);
}
:root[data-tema="acik"]{
  --glass-bg:rgba(250,247,243,.60);
  --glass-grad:linear-gradient(135deg,rgba(255,255,255,.70) 0%,rgba(255,255,255,.28) 45%,rgba(255,255,255,.55) 100%);
  --glass-bdr:rgba(255,255,255,.80);
  --glass-hi:rgba(255,255,255,.95);
}

/* Modal kutuları — buzlu cam panel */
.lqg-modal{
  background-image:var(--glass-grad)!important;
  background-color:var(--glass-bg)!important;
  -webkit-backdrop-filter:blur(28px) saturate(1.7);
  backdrop-filter:blur(28px) saturate(1.7);
  border:1px solid var(--glass-bdr)!important;
  border-radius:22px!important;
  box-shadow:0 24px 70px rgba(0,0,0,.45),
    inset 0 1px 0 var(--glass-hi),
    inset 0 -1px 0 rgba(255,255,255,.05)!important;
  overflow:hidden;
}
/* Modal içi opak yüzeyler camda yarı saydam görünsün */
.lqg-modal [style*="background:var(--surf)"]{background:rgba(255,255,255,.05)!important;}
:root[data-tema="acik"] .lqg-modal [style*="background:var(--surf)"]{background:rgba(255,255,255,.40)!important;}

/* Liste ekleme satır formu */
.lqg-form{display:flex;gap:8px;align-items:center;padding:10px 12px;
  background-image:var(--glass-grad);background-color:rgba(255,255,255,.03);
  -webkit-backdrop-filter:blur(14px) saturate(1.5);backdrop-filter:blur(14px) saturate(1.5);
  border-top:1px solid var(--glass-bdr);box-shadow:inset 0 1px 0 var(--glass-hi);}
.lqg-inp{flex:1;min-width:0;background:rgba(0,0,0,.22);border:1px solid var(--glass-bdr);
  border-radius:999px;padding:8px 14px;color:var(--t1);font-size:13px;outline:none;box-sizing:border-box;}
.lqg-inp::placeholder{color:var(--t3);}
.lqg-inp:focus{border-color:var(--blue-m);box-shadow:0 0 0 3px rgba(55,138,221,.18);}
:root[data-tema="acik"] .lqg-inp{background:rgba(255,255,255,.60);}
.lqg-btn{flex-shrink:0;padding:8px 16px;border-radius:999px;font-size:12px;font-weight:700;cursor:pointer;
  color:var(--green);border:1px solid color-mix(in srgb,var(--green) 55%,transparent);
  background-image:linear-gradient(160deg,color-mix(in srgb,var(--green) 32%,transparent),color-mix(in srgb,var(--green) 12%,transparent));
  background-color:transparent;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 2px 8px rgba(0,0,0,.22);line-height:1.3;}
.lqg-btn:hover{filter:brightness(1.12);}
.lqg-x{flex-shrink:0;width:31px;height:31px;display:flex;align-items:center;justify-content:center;
  border-radius:50%;border:1px solid var(--glass-bdr);
  background-image:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.02));background-color:transparent;
  color:var(--t2);font-size:13px;cursor:pointer;line-height:1;padding:0;
  box-shadow:inset 0 1px 0 var(--glass-hi),0 1px 4px rgba(0,0,0,.18);}
.lqg-x:hover{color:var(--t1);border-color:var(--blue-m);}

/* ── Grup başlıkları ─────────────────────────────────────────── */
.grup-hdr{
  background-image:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.015) 55%,rgba(255,255,255,.05))!important;
  background-color:rgba(255,255,255,.025)!important;
  -webkit-backdrop-filter:blur(10px) saturate(1.4);backdrop-filter:blur(10px) saturate(1.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09);
  gap:4px!important;
  padding:9px 10px 9px 12px!important;}
.grup-hdr:hover{background-color:rgba(255,255,255,.055)!important;}
:root[data-tema="acik"] .grup-hdr{
  background-image:linear-gradient(160deg,rgba(255,255,255,.85),rgba(255,255,255,.30) 55%,rgba(255,255,255,.60))!important;
  background-color:rgba(255,255,255,.35)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95);}
:root[data-tema="acik"] .grup-hdr:hover{background-color:rgba(255,255,255,.52)!important;}

.grup-hdr .gh-title{
  font-size:12.5px!important;font-weight:700!important;letter-spacing:.01em;
  cursor:pointer!important;text-shadow:0 1px 2px rgba(0,0,0,.25);}
:root[data-tema="acik"] .grup-hdr .gh-title{text-shadow:none;}

/* drag handle gizle — alan tasarrufu */
.grup-hdr .satici-drag-handle{font-size:10px;opacity:.35;padding:0 2px;}

/* ── Cam çip butonlar (grup içi) ─────────────────────────────── */
/* Temel chip: +Fiyat */
.lqg-chip{
  flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  height:26px;padding:0 9px;border-radius:999px;
  font-size:10.5px;font-weight:600;cursor:pointer;color:var(--t2);line-height:1;
  border:1px solid var(--glass-bdr);
  background-image:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.03));
  background-color:transparent;
  box-shadow:inset 0 1px 0 var(--glass-hi),0 1px 3px rgba(0,0,0,.18);
  white-space:nowrap;}
.lqg-chip:hover{color:var(--t1);border-color:var(--blue-m);}
/* İkon butonlar (👤, ✏️): kare değil, yuvarlak eşit boyut */
.lqg-chip.ikon{width:26px;height:26px;padding:0;font-size:12px;}
:root[data-tema="acik"] .lqg-chip{box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 3px rgba(0,0,0,.08);}

/* ═══ v2.7 — İPLİK YÖNETİMİ: tek bakışta fiyat, tek tıkla düzenleme ═══ */
.litem.yarn-manage-row{
  display:grid;grid-template-columns:14px minmax(0,1fr) auto 28px;align-items:center;
  gap:9px;padding:10px 11px 10px 9px!important;min-height:58px;cursor:pointer;
  background:var(--card);border-bottom:1px solid color-mix(in srgb,var(--cb) 78%,transparent);
}
.litem.yarn-manage-row:hover{background:color-mix(in srgb,var(--surf) 76%,var(--card));}
.litem.yarn-manage-row:focus-visible{outline:2px solid var(--blue-m);outline-offset:-2px;}
.yarn-manage-row .drag-handle{margin:0!important;opacity:.14;font-size:10px;transition:opacity .15s;}
.yarn-manage-row:hover .drag-handle{opacity:.55;}
.yarn-row-copy{min-width:0;overflow:hidden;}
.yarn-row-name{font-size:12.5px;font-weight:700;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;}
.yarn-row-price{display:flex;align-items:baseline;gap:6px;margin-top:5px;min-width:0;white-space:nowrap;overflow:hidden;}
.yarn-row-mode{font-size:9px;font-weight:750;text-transform:uppercase;letter-spacing:.045em;color:var(--t3);}
.yarn-row-value{font-size:12px;font-weight:750;color:var(--blue);font-variant-numeric:tabular-nums;}
.yarn-row-tl{font-size:10.5px;color:var(--t2);font-variant-numeric:tabular-nums;}
.yarn-row-status{font-size:9px;font-weight:750;color:var(--blue);background:var(--blue-bg);border:1px solid color-mix(in srgb,var(--blue-m) 52%,transparent);border-radius:999px;padding:3px 6px;white-space:nowrap;}
.yarn-row-arrow{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:0;border-radius:8px;background:transparent;color:var(--t3);font-size:19px;}
.yarn-row-edit{padding:0;cursor:pointer;}
.yarn-row-edit svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.yarn-row-edit:hover,.yarn-row-edit:focus-visible{background:var(--blue-bg)!important;color:var(--blue)!important;outline:1px solid var(--blue-m);}
.yarn-row-status{grid-column:3;}.yarn-row-arrow{grid-column:4;}
.yarn-manage-row:hover .yarn-row-arrow{background:var(--surf);color:var(--t1);}

/* İplik fiyat düzenleyicisi — seçim önce, yalnız ilgili alanlar görünür */
.simple-price-editor{display:flex;flex-direction:column;gap:13px;}
.simple-field{display:flex;flex-direction:column;gap:6px;}
.simple-field-label{font-size:9.5px;font-weight:750;letter-spacing:.055em;text-transform:uppercase;color:var(--t3);}
.simple-name-input{height:42px!important;padding:9px 12px!important;font-size:14px!important;font-weight:650!important;border-radius:10px!important;}
.price-mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;border:1px solid var(--cb);border-radius:10px;background:var(--card);}
.price-mode-btn{height:34px;border:0;border-radius:7px;background:transparent;color:var(--t3);font-size:11px;font-weight:750;cursor:pointer;}
.price-mode-btn.on{background:var(--surf2);color:var(--t1);box-shadow:0 1px 3px rgba(0,0,0,.16);}
.price-pane{display:flex;flex-direction:column;border:1px solid var(--cb);border-radius:12px;background:color-mix(in srgb,var(--card) 82%,transparent);overflow:hidden;}
.price-pane[hidden]{display:none!important;}
.simple-price-row{padding:11px 12px;border-top:1px solid var(--cb);}
.simple-price-row:first-child{border-top:0;}
.simple-price-row-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px;}
.simple-price-row-head strong{font-size:11px;color:var(--t1);font-weight:750;}
.simple-price-date{font-size:9px;color:var(--t3);font-variant-numeric:tabular-nums;}
.simple-price-control{display:grid;grid-template-columns:minmax(0,1fr) 82px;gap:7px;}
.simple-price-control input,.simple-price-control select{height:39px!important;padding:8px 10px!important;border-radius:9px!important;font-size:13px!important;}
.simple-price-control input{font-weight:750;font-variant-numeric:tabular-nums;}
.simple-fav-btn{width:100%;padding:7px;border:0;background:transparent;color:var(--t3);font-size:10.5px;font-weight:650;cursor:pointer;}
.simple-fav-btn:hover{color:var(--gold);}
.simple-modal-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:2px;}
.simple-save-btn{height:42px;border:0;border-radius:10px;background:var(--green);color:#102107;font-size:13px;font-weight:800;cursor:pointer;}
.simple-delete-btn{height:42px;padding:0 13px;border:1px solid color-mix(in srgb,var(--red) 45%,transparent);border-radius:10px;background:transparent;color:var(--red);font-size:11px;font-weight:700;cursor:pointer;}
.simple-delete-btn:hover{background:var(--red-bg);}
.simple-repeat-btn{height:42px;padding:0 13px;border:1px solid var(--cb);border-radius:10px;background:transparent;color:var(--t2);font-size:11px;font-weight:700;cursor:pointer;}
.simple-repeat-btn:hover{border-color:var(--blue-m);color:var(--blue);background:var(--blue-bg);}

/* Mobil: biraz daha sıkı */
@media(max-width:480px){
  .grup-hdr{gap:3px!important;padding:8px 8px 8px 10px!important;}
  .lqg-chip{height:24px;padding:0 7px;font-size:10px;}
  .lqg-chip.ikon{width:24px;height:24px;font-size:11px;}
  .litem.yarn-manage-row{grid-template-columns:8px minmax(0,1fr) auto 25px;gap:7px;padding:9px 8px 9px 7px!important;min-height:55px;}
  .yarn-row-price{gap:5px;}.yarn-row-name{font-size:12px}.yarn-row-tl{font-size:10px}
  .yarn-row-arrow{width:25px;height:27px;}
}

/* ── Liste kartı başlıkları (İPLİK LİSTESİ vb.) ─────────────── */
.lhdr{
  background-image:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.02) 55%,rgba(255,255,255,.07))!important;
  background-color:rgba(255,255,255,.03)!important;
  -webkit-backdrop-filter:blur(12px) saturate(1.5);backdrop-filter:blur(12px) saturate(1.5);
  border-bottom:1px solid var(--glass-bdr)!important;
  box-shadow:inset 0 1px 0 var(--glass-hi),0 2px 10px rgba(0,0,0,.18);
  padding:9px 12px!important;gap:6px;}
.lhdr>span:first-child{
  font-size:11px!important;font-weight:800!important;letter-spacing:.12em!important;
  text-shadow:0 0 14px color-mix(in srgb,currentColor 55%,transparent);}
.lhdr>span:first-child::before{
  width:7px!important;height:7px!important;border-radius:50%!important;
  box-shadow:0 0 8px currentColor,0 0 2px currentColor;}
:root[data-tema="acik"] .lhdr{
  background-image:linear-gradient(160deg,rgba(255,255,255,.85),rgba(255,255,255,.35) 55%,rgba(255,255,255,.60))!important;
  background-color:rgba(255,255,255,.35)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 2px 8px rgba(0,0,0,.06);}
:root[data-tema="acik"] .lhdr>span:first-child{text-shadow:none;}
:root[data-tema="acik"] .lhdr>span:first-child::before{box-shadow:0 0 5px color-mix(in srgb,currentColor 60%,transparent);}

/* +Favori / +Liste butonları — lhdr içinde */
.lhdr .ebtn{
  border-radius:999px!important;height:24px;padding:0 10px!important;
  font-size:10.5px!important;
  border:1px solid var(--glass-bdr)!important;
  background-image:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.03))!important;
  background-color:transparent!important;
  box-shadow:inset 0 1px 0 var(--glass-hi),0 1px 3px rgba(0,0,0,.15);}
.lhdr .ebtn:hover{border-color:var(--blue-m)!important;color:var(--t1)!important;}
@media(max-width:480px){
  .lhdr{padding:8px 10px!important;}
  .lhdr .ebtn{height:22px;padding:0 8px!important;font-size:10px!important;}
}