/* FLY LIFE panel — tek stil dosyasi.
Mobil once: dar ekranda tablolar KARTA doner, genisde tablo kalir. */
:root{
--yesil:#0C6E5E; --yesil-koyu:#095548; --yesil-ac:#e6f2ef;
--zemin:#f4f6f7; --kart:#fff; --kenar:#e3e6e8;
--metin:#1c2024; --soluk:#697077; --kirmizi:#b00020; --sari:#96690a;
--golge:0 1px 2px rgba(16,24,40,.06), 0 1px 3px rgba(16,24,40,.1);
--golge-buyuk:0 12px 32px rgba(16,24,40,.18);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
/* [hidden] KURALI EN USTTE VE !important OLMALI.
Tarayicinin varsayilan [hidden]{display:none} kurali, yazdigimiz herhangi bir
`display` bildirimine yeniliyor. Giris ekranina display:flex verdigimiz icin
`hidden` ise yaramiyordu: giris yaptiktan sonra giris karti ekranda kaliyor,
panel altina ekleniyor ve kullanicinin asagi kaydirmasi gerekiyordu. */
[hidden]{display:none !important}
body{font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
background:var(--zemin);color:var(--metin);-webkit-text-size-adjust:100%}
/* ---------------------------------------------------------- temel ogeler */
button{font:inherit;border:1px solid var(--kenar);background:#fff;border-radius:8px;
padding:8px 14px;cursor:pointer;color:var(--metin);transition:.12s}
button:hover:not(:disabled){background:#f0f2f4;border-color:#cdd3d7}
button:disabled{opacity:.5;cursor:not-allowed}
button.ana{background:var(--yesil);color:#fff;border-color:var(--yesil);font-weight:600}
button.ana:hover:not(:disabled){background:var(--yesil-koyu)}
button.kucuk{padding:4px 9px;font-size:12.5px}
/* Baglantiyi buton gibi gosterir. Gercek kullaniliyor ki orta tikla yeni
sekmede acilsin ve adres kopyalanabilsin. */
a.dugme{display:inline-block;border:1px solid var(--kenar);background:#fff;
border-radius:8px;padding:4px 9px;font-size:12.5px;color:var(--metin);
text-decoration:none;white-space:nowrap}
a.dugme:hover{background:#f0f2f4;border-color:#cdd3d7}
button.tehlike{color:var(--kirmizi);border-color:#f0d0d5}
input,select,textarea{font:inherit;padding:9px 11px;border:1px solid var(--kenar);
border-radius:8px;background:#fff;width:100%;color:var(--metin)}
/* Onay kutusu ve radyo METIN ALANI DEGIL: genel input kuralindaki width:100%
ve padding onlari deforme edip etiketi alt satira atiyordu. */
input[type=checkbox],input[type=radio]{width:auto;padding:0;margin:0;
accent-color:var(--yesil);vertical-align:middle}
input:focus,select:focus,textarea:focus{outline:2px solid var(--yesil-ac);
border-color:var(--yesil)}
label.alan{display:block;font-size:12px;color:var(--soluk);margin-bottom:4px}
a{color:var(--yesil)}
/* ---------------------------------------------------------- yerlesim */
header{background:var(--yesil);color:#fff;padding:11px 18px;display:flex;
align-items:center;gap:12px;position:sticky;top:0;z-index:30}
header h1{font-size:16px;margin:0;font-weight:700;letter-spacing:.2px}
header .bosluk{flex:1}
header button{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.25)}
header button:hover{background:rgba(255,255,255,.22)}
nav.sekmeler{background:#fff;border-bottom:1px solid var(--kenar);display:flex;
gap:2px;padding:0 12px;overflow-x:auto;position:sticky;top:49px;z-index:29}
nav.sekmeler button{border:0;background:0;border-radius:0;padding:12px 14px;
color:var(--soluk);font-weight:600;white-space:nowrap;
border-bottom:2.5px solid transparent}
nav.sekmeler button:hover{background:#f7f9f9}
nav.sekmeler button.etkin{color:var(--yesil);border-bottom-color:var(--yesil)}
nav.sekmeler .sayi{display:inline-block;min-width:19px;padding:0 5px;margin-left:5px;
background:var(--kirmizi);color:#fff;border-radius:10px;font-size:11px;
line-height:19px;text-align:center}
nav.sekmeler .sayi.sakin{background:#d6dbde;color:#4b5257}
main{padding:16px;max-width:1500px;margin:0 auto}
.gorunum{display:none}
.gorunum.etkin{display:block}
.kart{background:var(--kart);border:1px solid var(--kenar);border-radius:12px;
box-shadow:var(--golge)}
.kart.ic{padding:18px}
.baslik-satiri{display:flex;align-items:baseline;gap:10px;margin-bottom:4px}
.baslik-satiri h2{font-size:16px;margin:0;color:var(--yesil)}
.aciklama{color:var(--soluk);font-size:13px;margin:0 0 16px}
.arac{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.rozet{display:inline-block;padding:3px 10px;border-radius:20px;font-size:12px;
background:#eef1f3;color:var(--soluk);white-space:nowrap}
.rozet.iyi{background:var(--yesil-ac);color:var(--yesil)}
.rozet.uyari{background:#fdf3d8;color:var(--sari)}
/* ---------------------------------------------------------- tablo */
.tablo-sar{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse}
th{background:#f7f9f9;color:var(--soluk);text-align:left;padding:10px 12px;
font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;
white-space:nowrap;border-bottom:1px solid var(--kenar);position:sticky;top:0}
td{padding:10px 12px;border-top:1px solid #eef1f2;vertical-align:middle}
tbody tr:hover{background:#fafbfb}
tbody tr.tiklanir{cursor:pointer}
.kod{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:600;
white-space:nowrap}
.sag{text-align:right}
.kirp{max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kucukresim{width:38px;height:38px;border-radius:7px;object-fit:cover;
border:1px solid var(--kenar);background:#f2f4f5;display:block}
.kucukresim.bos{display:flex;align-items:center;justify-content:center;
color:#c3c9cd;font-size:15px}
/* pazaryeri kutucuklari */
.p{display:inline-flex;align-items:center;justify-content:center;width:24px;
height:24px;border-radius:6px;font-size:11px;font-weight:700;margin-right:3px}
.p.satista{background:#d6f0e4;color:#0a6b4d}
.p.onayda{background:#fdf0cf;color:var(--sari)}
.p.kapali{background:#e9edef;color:#6b7280}
.p.reddedildi{background:#fbdde2;color:var(--kirmizi)}
.p.yok{background:transparent;color:#c9ced3;border:1px dashed #d9dee1}
.bos{padding:44px 20px;text-align:center;color:var(--soluk)}
.mesaj{font-size:13px;min-height:19px;margin-top:10px}
.mesaj.hata{color:var(--kirmizi)}
.mesaj.iyi{color:var(--yesil)}
/* ---------------------------------------------------------- pencere */
.perde{position:fixed;inset:0;background:rgba(16,24,40,.45);z-index:60;
display:flex;align-items:center;justify-content:center;padding:16px}
.pencere{background:#fff;border-radius:14px;box-shadow:var(--golge-buyuk);
width:min(760px,100%);max-height:88vh;display:flex;flex-direction:column}
.pencere header{background:#fff;color:var(--metin);border-bottom:1px solid var(--kenar);
border-radius:14px 14px 0 0;position:static}
.pencere header h3{margin:0;font-size:15px;flex:1}
.pencere .govde{padding:18px;overflow:auto}
.pencere .alt{padding:14px 18px;border-top:1px solid var(--kenar);display:flex;
gap:9px;justify-content:flex-end}
.kapat{background:0;border:0;font-size:22px;line-height:1;color:var(--soluk);
cursor:pointer;padding:0 4px}
/* ---------------------------------------------------------- gorsel */
.gorsel-izgara{display:flex;gap:9px;flex-wrap:wrap}
.gorsel-kutu{position:relative;width:84px}
.gorsel-kutu img{width:84px;height:84px;object-fit:cover;border-radius:8px;
border:1px solid var(--kenar)}
.gorsel-kutu .ana{position:absolute;top:3px;left:3px;background:var(--yesil);
color:#fff;font-size:10px;padding:1px 6px;border-radius:10px;font-weight:700}
.gorsel-kutu .sil{position:absolute;top:-7px;right:-7px;width:22px;height:22px;
border-radius:50%;padding:0;line-height:1;font-size:13px}
.birak{border:2px dashed var(--kenar);border-radius:10px;padding:22px;
text-align:center;color:var(--soluk);cursor:pointer;background:#fbfcfc}
.birak.uzerinde{border-color:var(--yesil);background:var(--yesil-ac)}
/* ---------------------------------------------------------- giris
Panelin geri kalani beyaz zemin uzerinde calisiyor; giris ekrani tek basina
duran bir sayfa oldugu icin marka rengi burada zemin olarak kullaniliyor.
Renkler ayni degiskenlerden geliyor - ikinci bir palet yok. */
.giris-sar{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;
align-items:center;justify-content:center;gap:18px;padding:24px;
background:
radial-gradient(1100px 520px at 50% -12%, #14806c 0%, transparent 60%),
linear-gradient(168deg, var(--yesil) 0%, var(--yesil-koyu) 55%, #064036 100%)}
.giris-kart{width:min(392px,100%);padding:34px 30px 26px;background:var(--kart);
border-radius:18px;box-shadow:0 24px 60px rgba(3,32,26,.34),
0 2px 6px rgba(3,32,26,.18);text-align:left}
/* marka isareti: logo dosyasi yok, monogram yeterli */
.giris-mark{width:52px;height:52px;border-radius:15px;display:flex;
align-items:center;justify-content:center;margin:0 0 16px;
background:linear-gradient(150deg,var(--yesil) 0%,#128a74 100%);
color:#fff;font-weight:800;font-size:19px;letter-spacing:.5px;
box-shadow:0 6px 14px rgba(12,110,94,.32)}
.giris-kart h2{margin:0 0 3px;color:var(--metin);font-size:23px;letter-spacing:.2px}
.giris-alt{color:var(--soluk);font-size:13px;margin:0 0 24px}
.giris-kart label.alan{margin-top:15px;font-weight:600}
.giris-kart input{padding:11px 12px}
.giris-kart input::placeholder{color:#b3bcc2}
/* parola goster/gizle - yanlis parola yazip tekrar denemeyi azaltir */
.parola-sar{position:relative}
.parola-sar input{padding-right:74px}
.parola-gz{position:absolute;right:5px;top:50%;transform:translateY(-50%);
border:0;background:0;color:var(--soluk);font-size:12.5px;font-weight:600;
padding:6px 9px;border-radius:6px}
.parola-gz:hover{background:var(--yesil-ac);color:var(--yesil)}
.giris-hata{margin-top:14px;padding:9px 12px;border-radius:9px;font-size:13px;
color:var(--kirmizi);background:#fdecef;border:1px solid #f6d2d9}
.giris-btn{width:100%;margin-top:20px;padding:12px;font-size:14.5px;
border-radius:10px}
.giris-btn:disabled{opacity:.75}
/* hangi pazaryerlerini yonettigimizi hatirlatan ince serit */
.giris-pazaryerleri{display:flex;align-items:center;justify-content:center;
flex-wrap:wrap;gap:8px;margin-top:22px;padding-top:16px;
border-top:1px solid var(--kenar);color:#93a0a6;font-size:11.5px}
.giris-pazaryerleri i{width:3px;height:3px;border-radius:50%;background:#c9d2d6}
.giris-dip{color:rgba(255,255,255,.62);font-size:12px;margin:0;text-align:center}
/* ---------------------------------------------------------- mobil */
@media (max-width:760px){
main{padding:12px}
header{padding:10px 14px}
header h1{font-size:15px}
.kart.ic{padding:14px}
/* Baslik satiri sarmiyordu: Rapor sekmesinde baslik + 2 tarih secici +
2 dugme 605 px tutuyor ve 375 px ekranda sayfayi yatay kaydiriyordu.
Tek yatay kaymasi olan ekran buydu (dokuz sekme olculdu). */
.baslik-satiri{flex-wrap:wrap;align-items:center;row-gap:8px}
/* SEKMELER: 13 sekme telefonda 1325 px'lik yatay serit oluyordu — hangi
sekmelerin var oldugu gorunmuyor, korlemesine kaydirmak gerekiyordu.
Telefonda sarmalanip rozet seklinde diziliyor, hepsi tek bakista goze
giriyor. Yapiskanlik KALDIRILDI: sarmalanmis hali 4 satir tutuyor,
yapiskan kalsa ekranin besde birini yerdi. */
nav.sekmeler{position:static;flex-wrap:wrap;gap:5px;padding:9px 12px;
overflow:visible}
nav.sekmeler button{border:1px solid var(--kenar);border-radius:9px;
background:#fff;padding:8px 11px;font-size:12.5px;color:var(--metin)}
nav.sekmeler button.etkin{background:var(--yesil-ac);color:var(--yesil);
border-color:var(--yesil)}
/* Kart kipinde satir tam genislige yayiliyor; basligi 190 px'te kirpmak
yerine alta sarmasi daha okunur. */
.kirp{max-width:none;white-space:normal;overflow:visible}
table.duyarli td.kirp{display:flex}
/* Pencere alt dugmeleri: uc dugme 375 px'e sigmiyordu, tasiyordu. */
.pencere .alt{flex-wrap:wrap}
.pencere .alt button{flex:1 1 auto}
/* Tablolar karta doner: her hucre "etiket: deger" satiri olur */
table.duyarli thead{display:none}
table.duyarli tbody tr{display:block;border-top:1px solid var(--kenar);
padding:10px 12px}
table.duyarli tbody tr:first-child{border-top:0}
table.duyarli td{display:flex;justify-content:space-between;gap:12px;
border:0;padding:3px 0;text-align:left}
table.duyarli td::before{content:attr(data-etiket);color:var(--soluk);
font-size:12px;font-weight:600;flex-shrink:0}
table.duyarli td.sag{text-align:right}
table.duyarli td:empty{display:none}
/* Hucre kart kipinde flex; ikincil satir (.kirp2) degerin YANINA degil
ALTINA gelmeli — "CM-469 Tv Urunleri > ..." urun adinin sagina yapisiyordu. */
table.duyarli td{flex-wrap:wrap}
table.duyarli td>.kirp2{flex:1 0 100%;text-align:right}
}
/* --------------------------------------------------------- ikili secim */
.secim{display:inline-flex;border:1px solid var(--kenar);border-radius:8px;
overflow:hidden;background:#fff}
.secim button{border:0;border-radius:0;padding:7px 14px;font-weight:700;
color:var(--soluk);min-width:44px}
.secim button+button{border-left:1px solid var(--kenar)}
.secim button.etkin{background:var(--yesil);color:#fff}
.secim button.etkin:hover{background:var(--yesil-koyu)}
/* --------------------------------------------------------- pazaryeri secici
Onay kutusu yerine dokunmasi kolay "etiket" dugmeleri. Mobilde parmakla
hedeflemesi kolay, secili olan bir bakista belli. */
.pz-secici{display:flex;gap:8px;flex-wrap:wrap}
.pz{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;
border:1.5px solid var(--kenar);border-radius:999px;background:#fff;
cursor:pointer;font-size:13.5px;font-weight:600;color:var(--soluk);
transition:.12s;user-select:none}
.pz:hover{border-color:#c3cace;background:#fafbfb}
.pz .im{width:16px;height:16px;border:1.5px solid #c9d0d4;border-radius:5px;
display:inline-flex;align-items:center;justify-content:center;
font-size:11px;color:transparent;flex-shrink:0}
.pz.secili{border-color:var(--yesil);background:var(--yesil-ac);color:var(--yesil)}
.pz.secili .im{background:var(--yesil);border-color:var(--yesil);color:#fff}
.pz.kisitli{opacity:.75}
.pz.kisitli::after{content:'kısıtlı';font-size:10.5px;font-weight:700;
background:#fdf3d8;color:var(--sari);padding:1px 6px;border-radius:8px}
.pz-not{font-size:11.5px;color:var(--soluk);margin-top:8px;line-height:1.5}
/* --------------------------------------------------------- gorsel siralama */
.gorsel-kutu{cursor:grab;touch-action:none}
.gorsel-kutu:active{cursor:grabbing}
.gorsel-kutu.tasiniyor{opacity:.35}
.gorsel-kutu.hedef{outline:2.5px dashed var(--yesil);outline-offset:3px}
.gorsel-kutu .sira{position:absolute;bottom:3px;left:3px;background:rgba(0,0,0,.6);
color:#fff;font-size:10px;padding:0 5px;border-radius:8px;font-weight:700}
.gorsel-kutu .tut{position:absolute;bottom:3px;right:3px;color:#fff;
background:rgba(0,0,0,.45);border-radius:6px;font-size:11px;padding:0 4px;
letter-spacing:-1px}
/* Dokunmatik cihazda surukleme zor olabilir; oklar yalnizca orada gorunur. */
.gorsel-kutu .oklar{display:none;gap:3px;margin-top:4px}
@media (pointer:coarse){
.gorsel-kutu .oklar{display:flex}
.gorsel-kutu .tut{display:none}
/* iOS, yazi boyutu 16 px'in ALTINDA olan bir alana odaklaninca sayfayi
kendiliginden yakinlastiriyor ve geri cikmiyor. Govde yazisi 14 px
oldugu icin panelde HER alana dokunusta bu oluyordu. */
input,select,textarea{font-size:16px}
/* Dokunma hedefi: .kucuk dugmeler 26 px yuksekligindeydi, parmakla
isabet ettirmek zordu. */
button.kucuk,a.dugme{padding:8px 12px;font-size:13px}
table.duyarli td button{min-height:36px}
}
.gorsel-kutu .oklar button{flex:1;padding:2px;font-size:12px;line-height:1.2}
/* --------------------------------------------------------- siralama */
th[data-sirala]{cursor:pointer;user-select:none;position:relative;
padding-right:20px}
th[data-sirala]:hover{background:#eef2f2;color:var(--metin)}
th[data-sirala]::after{content:'⇅';position:absolute;right:7px;opacity:.32;
font-size:11px}
th[data-sirala].artan::after{content:'▲';opacity:1;color:var(--yesil)}
th[data-sirala].azalan::after{content:'▼';opacity:1;color:var(--yesil)}
/* Depo stogu: bittiyse kirmizi, azaldiysa sari */
.depo-az{color:var(--sari);font-weight:700}
.depo-bitti{color:var(--kirmizi);font-weight:700}
/* --------------------------------------------------------- siparis asama sekmeleri */
.akis{display:flex;gap:0;border-bottom:2px solid var(--kenar);margin-bottom:14px;
overflow-x:auto}
.akis button{border:0;background:0;border-radius:0;padding:11px 18px;
font-weight:600;color:var(--soluk);white-space:nowrap;
border-bottom:3px solid transparent;margin-bottom:-2px;
display:flex;align-items:center;gap:8px}
.akis button:hover{background:#f7f9f9;color:var(--metin)}
.akis button.etkin{color:var(--yesil);border-bottom-color:var(--yesil)}
.akis .sayi-b{display:inline-block;min-width:22px;padding:1px 7px;
background:#eceff1;color:var(--soluk);border-radius:11px;font-size:12px;
font-weight:800}
.akis button.etkin .sayi-b{background:var(--yesil);color:#fff}
/* --------------------------------------------------------- yerinde duzenleme */
td.duzenlenir{cursor:text;position:relative}
td.duzenlenir:hover{background:#eef6f4;outline:1px dashed var(--yesil)}
td.duzenlenir input{width:80px;padding:3px 6px;font-weight:700;text-align:right}
/* Termin = kargoya verme son tarihi. Renk YALNIZCA gonderilmemis
siparislerde (yeni/isleme) veriliyor - bkz. panel.js/terminHucresi. */
.termin{font-size:12.5px;line-height:1.35}
.termin b{display:block;font-weight:600}
.termin span{color:var(--soluk);font-size:11.5px}
.termin.yakin b{color:var(--sari)}
.termin.acil b{color:var(--kirmizi)}
.termin.gecti b{color:#fff;background:var(--kirmizi);display:inline-block;
padding:2px 8px;border-radius:20px}
.sayfa-alt{display:flex;align-items:center;justify-content:space-between;
gap:12px;padding:12px 4px;flex-wrap:wrap;color:var(--soluk);
font-size:13px;border-top:1px solid var(--kenar)}
/* ------------------------------------------------------------- rapor */
.rk-satir{display:grid;gap:12px;margin-bottom:16px;
grid-template-columns:repeat(auto-fit,minmax(178px,1fr))}
.rk{background:var(--kart);border:1px solid var(--kenar);border-radius:12px;
padding:14px 16px;box-shadow:var(--golge);display:flex;
flex-direction:column;gap:3px}
.rk-b{font-size:12.5px;color:var(--soluk);font-weight:600;letter-spacing:.2px}
.rk-d{font-size:21px;line-height:1.2;font-variant-numeric:tabular-nums}
.rk-a{font-size:12px;color:var(--soluk)}
.rk.iyi{border-left:3px solid var(--yesil)}
.rk.iyi .rk-d{color:var(--yesil)}
.rk.kotu{border-left:3px solid var(--kirmizi)}
.rk.kotu .rk-d{color:var(--kirmizi)}
.rk.uyari{border-left:3px solid var(--sari)}
.rapor-ikili{display:grid;gap:16px;margin-bottom:16px;
grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}
#g-rapor .kart{margin-bottom:16px}
#g-rapor h3{margin:0 0 12px;font-size:15px}
#g-rapor .aciklama{margin-top:10px}
td.eksi{color:var(--kirmizi)}
td.soluk{color:var(--soluk)}
tr.toplam td{border-top:2px solid var(--kenar);padding-top:10px}
table.dar td{padding:7px 8px}
.kirp2{display:block;font-size:12px;color:var(--soluk)}
.uyari-serit{background:#fdf3d8;color:var(--sari);border-radius:8px;
padding:10px 13px;font-size:13px;line-height:1.5}
/* Gunluk ciro cubugu - harici grafik kutuphanesi yok, duz CSS. */
.cubuklar{display:flex;align-items:flex-end;gap:3px;height:150px;
overflow-x:auto;padding-top:6px}
.cubuklar .cb{flex:1 0 14px;display:flex;flex-direction:column;
align-items:center;height:100%;justify-content:flex-end;gap:4px}
.cubuklar .cb i{display:block;width:100%;background:var(--yesil);
border-radius:3px 3px 0 0;min-height:2px;opacity:.85}
.cubuklar .cb:hover i{opacity:1}
.cubuklar .cb span{font-size:10px;color:var(--soluk)}
/* Kaydedilmis ama pazaryerine gonderilmemis fiyat uyarisi. */
button.gonderilmedi{display:block;margin:3px 0 0 auto;padding:2px 8px;
font-size:11px;background:#fdf3d8;color:var(--sari);
border:1px solid #f0e0b8;border-radius:20px;font-weight:600;
white-space:nowrap}
button.gonderilmedi:hover:not(:disabled){background:var(--sari);color:#fff;
border-color:var(--sari)}
/* Gonderilmemis degisiklik dugmesi - sekme degil, uyari. Sekmelerden
ayrisması icin sari zemin. */
button.gonderilmedi-sekme, button.gonderilmemis-sekme{
margin-left:auto;background:#fdf3d8;color:var(--sari);
border:1px solid #f0e0b8;border-radius:20px;padding:5px 12px;
font-size:13px;font-weight:600;align-self:center}
button.gonderilmemis-sekme:hover{background:var(--sari);color:#fff}
button.gonderilmemis-sekme .sayi{background:var(--sari);color:#fff}
button.gonderilmemis-sekme:hover .sayi{background:#fff;color:var(--sari)}
tr.engelli{opacity:.55}
/* Kategori arama — tam agacta (~3.860 kategori) arama sart, acilir liste
kullanilamaz olurdu. */
.kat-secili{display:flex;align-items:center;justify-content:space-between;
gap:12px;padding:10px 13px;background:var(--yesil-ac);
border:1px solid #bfded6;border-radius:9px;margin-bottom:8px}
.kat-yol{font-size:12px;color:var(--soluk);margin-top:2px}
.kat-sonuc{max-height:260px;overflow-y:auto;margin-top:6px}
.kat-sonuc:empty{display:none}
.kat-sonuc button{display:block;width:100%;text-align:left;padding:9px 12px;
border:1px solid var(--kenar);border-radius:8px;margin-bottom:5px;
background:var(--kart);line-height:1.35}
.kat-sonuc button:hover{border-color:var(--yesil);background:var(--yesil-ac)}
.kat-sonuc .yol{font-size:12px;color:var(--soluk);display:block;margin-top:2px}
.kat-sonuc .etiketler{font-size:11px;margin-top:4px}
/* Uzun islerde canli ilerleme. Kuyruk gonderimi dakikalar suruyor ve
panel bu sure boyunca sessizdi. */
.ilerleme{margin-top:14px;padding:13px 15px;background:var(--yesil-ac);
border:1px solid #bfded6;border-radius:10px}
.ilerleme-ust{display:flex;justify-content:space-between;align-items:baseline;
gap:12px;font-size:13px;margin-bottom:8px}
.ilerleme-ust span:first-child{font-weight:600;color:var(--yesil)}
.ilerleme-sure{color:var(--soluk);font-size:12px;
font-variant-numeric:tabular-nums}
.ilerleme .cubuk{height:8px;background:#cfe5df;border-radius:20px;
overflow:hidden}
.ilerleme .cubuk i{display:block;height:100%;width:0;border-radius:20px;
background:var(--yesil);transition:width .4s ease}
/* Adim sayisi bilinmiyorken (batch bekleniyor) kayan serit: donuk bir cubuk
"takildi" izlenimi veriyordu. */
.ilerleme .cubuk i.belirsiz{width:35%;animation:kay 1.5s ease-in-out infinite}
@keyframes kay{0%{margin-left:-35%}100%{margin-left:100%}}
.ilerleme.bitti{background:var(--yesil-ac)}
.ilerleme.hata{background:#fdecef;border-color:#f0d0d5}
.ilerleme.hata .ilerleme-ust span:first-child{color:var(--kirmizi)}
.ilerleme.hata .cubuk i{background:var(--kirmizi)}
/* Kuyrukta kalma sebebi — "gonderdigim urun neden hala burada" sorusunun
cevabi satirin icinde dursun. */
.kuyruk-sebep{font-size:11.5px;color:var(--kirmizi);margin-top:5px;
line-height:1.4;max-width:340px}
/* Kategori satirinda urun dokumu ve Trendyol tam yolu. */
.kat-urunler td{background:#fafbfb;padding:10px 14px}
.kat-urun-kutu{display:grid;gap:5px;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.kat-urun{display:flex;gap:9px;align-items:baseline;font-size:12.5px;
padding:4px 8px;background:var(--kart);border:1px solid var(--kenar);
border-radius:7px}
.kat-urun span:nth-child(2){flex:1;color:var(--metin);overflow:hidden;
text-overflow:ellipsis;white-space:nowrap}
.kat-urun b{white-space:nowrap;color:var(--soluk);font-weight:600}
/* Urun bazli kategori hucresi. */
.kat-h{display:flex;flex-direction:column;gap:4px;align-items:flex-start;
font-size:12.5px}
.kat-h > span:first-child{color:var(--yesil);line-height:1.3}
/* Rapor donem hizli secim. */
.hizli-gun{display:inline-flex;gap:5px}
/* UST DUZEY MARKA AYRIMI. Iki marka ayni magazalarda satiliyor; bu secici
pazaryeri degil KONTROL ayrimi - hangi markanin isine bakiyorum. */
.marka-secici{display:flex;gap:5px;margin-left:14px}
.marka-secici button{background:rgba(255,255,255,.14);color:#fff;
border:1px solid rgba(255,255,255,.22);border-radius:20px;
padding:4px 12px;font-size:13px;font-weight:600}
.marka-secici button:hover{background:rgba(255,255,255,.24)}
.marka-secici button.etkin{background:#fff;color:var(--yesil);
border-color:#fff}
.marka-secici .sayi-b{background:rgba(0,0,0,.14);border-radius:10px;
padding:0 6px;font-size:11px;margin-left:3px}
.marka-secici button.etkin .sayi-b{background:var(--yesil-ac)}
/* PAZARYERI BAZINDA FIYAT gorunumu. Sutunlar HTML'de hep duruyor, gorunurluk
uzerindeki sinifla degisiyor - satirlar yeniden cizilmeden acilip
kapanabilsin (500 urunde yeniden cizim gozle gorulur takiliyor). */
table.pz-fiyat .pz-fiyat-kapali{display:none}
table:not(.pz-fiyat) .pz-fiyat-acik{display:none}
/* Hucre ici fiyat girisi. Salt okunur gorunum ile duzenlenebilir alan ayni
genislikte kalmali, yoksa yazarken tablo titriyor. */
.pz-fiyat-hucre{position:relative}
.pz-fiyat-hucre input{width:88px;text-align:right;padding:3px 6px;
font-size:12.5px;border:1px solid transparent;background:transparent;
border-radius:6px;font-family:inherit;color:inherit}
.pz-fiyat-hucre input:hover:not(:disabled){border-color:var(--kenar);
background:#fff}
.pz-fiyat-hucre input:focus{border-color:var(--yesil);background:#fff;
outline:none;box-shadow:0 0 0 2px var(--yesil-ac)}
.pz-fiyat-hucre input:disabled{color:var(--soluk);cursor:not-allowed}
.pz-fiyat-hucre input.degisti{border-color:var(--sari);background:#fdf3d8;
font-weight:600}
.pz-fiyat-hucre input.gonderiliyor{border-color:var(--yesil);
background:var(--yesil-ac)}
/* O pazaryerinde HIC kaydi olmayan urunun hucresi: kapali degil, DAVETKAR.
Fiyat yazmak "oraya da gonder" demek - "+ ekle" yer tutucusu bunu soyluyor. */
.pz-fiyat-hucre input.yok{color:var(--soluk);border-style:dashed;
border-color:var(--kenar)}
.pz-fiyat-hucre input.yok::placeholder{color:var(--yesil);opacity:.75;
font-weight:600}
.pz-fiyat-hucre input.yok:hover{border-style:solid;border-color:var(--yesil);
background:#fff}
/* VARYANT SATIRLARI. Her satir bir varyant: deger + (istege bagli) fiyat +
uretilecek kod onizlemesi + silme. */
.varyant-satir{display:grid;
grid-template-columns:1fr 150px minmax(96px,auto) 32px;
gap:8px;align-items:center;margin-bottom:6px}
.varyant-satir input{margin:0}
.varyant-satir .v-kod{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
font-size:11.5px;text-align:right;white-space:nowrap}
.varyant-satir .v-sil{padding:4px 8px;line-height:1}
@media (max-width:640px){
.varyant-satir{grid-template-columns:1fr 1fr;grid-auto-rows:auto}
.varyant-satir .v-kod{text-align:left}
}