/* N-Muhasebe · N-Panel tasarım dili */
:root{
  --zemin:#262D36; --ust:#2F3742; --yan:#141A22; --kart:#343C47; --girdi:#2A313B;
  --cizgi:rgba(255,255,255,.08); --cizgi2:rgba(255,255,255,.06);
  --yazi:#E8ECF1; --ikincil:#AEB8C3; --soluk:#9AA5B1; --en-soluk:#6B7682;
  --turuncu:#F2A541; --yesil:#5BE08A; --kirmizi:#FF8F7A; --mavi:#7D96FF; --pembe:#E070B8;
  --r:16px;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--zemin);color:var(--yazi);font-family:'Montserrat',system-ui,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}
a{color:var(--turuncu)}a:hover{color:#FFC27A}
h1,h2,h3{margin:0}
.num,.r{font-variant-numeric:tabular-nums}
.r{text-align:right}
.ic{width:20px;height:20px;flex:none}
.gizli{position:absolute;left:-9999px}

/* ---------- Düzen ---------- */
.duzen{display:flex;min-height:100vh}
.yan{flex:0 0 264px;background:var(--yan);display:flex;flex-direction:column;border-right:1px solid rgba(255,255,255,.05);position:sticky;top:0;height:100vh;overflow-y:auto}
.logo{height:88px;display:flex;align-items:center;gap:14px;padding:0 24px;border-bottom:1px solid var(--cizgi2);text-decoration:none;color:#fff}
.logo img{width:40px;height:40px;object-fit:contain}
.logo span{display:flex;flex-direction:column;gap:2px}
.logo strong{font-size:19px;font-weight:600}
.logo small{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--turuncu)}
.menu{flex:1;display:flex;flex-direction:column;gap:2px;padding:18px 14px}
.menu-grup{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--en-soluk);padding:16px 14px 8px}
.menu-oge{display:flex;align-items:center;gap:14px;padding:11px 14px;border-radius:10px;color:var(--ikincil);text-decoration:none;font-weight:500}
.menu-oge span:first-of-type{flex:1}
.menu-oge:hover{background:rgba(255,255,255,.04);color:#fff}
.menu-oge.aktif{background:rgba(242,165,65,.10);color:#fff;box-shadow:inset 2px 0 0 var(--turuncu)}
.menu-oge.aktif .ic{color:var(--turuncu)}
.menu-oge.cikis{margin:0 14px 22px}
.sayac{font-size:11px;font-weight:700;color:var(--yan);background:var(--turuncu);border-radius:10px;padding:2px 8px}
.ana{flex:1;min-width:0;display:flex;flex-direction:column}
.ust{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:18px 36px;background:var(--ust);border-bottom:1px solid var(--cizgi2)}
.bosluk{flex:1}
.firma-sec{display:flex;gap:4px;padding:4px;border-radius:12px;background:#232A33;border:1px solid var(--cizgi2);overflow-x:auto;max-width:100%;margin:0}
.firma-sec button{height:36px;padding:0 16px;border:0;border-radius:8px;background:transparent;color:var(--ikincil);font:500 13px inherit;font-family:inherit;white-space:nowrap;cursor:pointer}
.firma-sec button.secili{background:var(--turuncu);color:var(--yan);font-weight:600}
.ust-ara{display:flex;align-items:center;gap:10px;height:44px;width:260px;padding:0 14px;border-radius:10px;background:#3A4350;color:var(--soluk);margin:0}
.ust-ara input{flex:1;min-width:0;border:0;background:transparent;color:#fff;font:inherit;outline:none}
.kullanici{display:flex;align-items:center;gap:12px}
.avatar{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--yazi);display:flex;align-items:center;justify-content:center;font-weight:600}
.kullanici-ad{display:flex;flex-direction:column;line-height:1.25;font-size:15px;font-weight:500}
.kullanici-ad small{font-size:12px;font-style:italic;color:var(--ikincil);font-weight:400}
.icerik{flex:1;padding:28px 36px 56px;display:flex;flex-direction:column;gap:22px}
.alt-menu{display:none}

/* ---------- Başlık ---------- */
.baslik{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px}
.ust-yazi{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--turuncu)}
.baslik h1{margin-top:6px;font-size:30px;font-weight:300;letter-spacing:-.01em}
.baslik h1 strong{font-weight:600}
.dugmeler{display:flex;flex-wrap:wrap;gap:10px;align-items:center}

/* ---------- Kart ---------- */
.kart{background:var(--kart);border:1px solid var(--cizgi2);border-radius:var(--r);overflow:hidden;min-width:0}
.kart-bas{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:18px 24px;border-bottom:1px solid var(--cizgi)}
.kart-bas h2{font-size:18px;font-weight:600}
.kart-ic{padding:20px 24px}
.satirlar{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start}
.satirlar > *{flex:1 1 360px}
.genis{flex:2 1 560px !important}
.izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}

.ozet-kart .kart-bas{justify-content:flex-start;gap:16px}
.ikon-halka{width:56px;height:56px;border-radius:50%;background:#2A313B;display:flex;align-items:center;justify-content:center;color:var(--turuncu);flex:none}
.ikon-halka .ic{width:28px;height:28px}
.ikon-halka.kucuk{width:40px;height:40px;font-size:12px;font-weight:600}
.ikon-halka.orta{width:64px;height:64px;font-size:20px;font-weight:600}
.ozet-kart h2{font-size:19px}
.ozet-kart .alt{font-size:12px;color:var(--soluk)}
.ln{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.ln span:first-child{color:#C3CBD4}
.ln.toplam{border-bottom:0;padding-top:10px;color:var(--yesil);font-weight:600}
.ln.toplam .num{font-size:17px}
.not{font-size:12px;color:var(--turuncu);margin-top:8px}

/* ---------- Grafik ---------- */
.grafik{display:flex;align-items:flex-end;justify-content:center;gap:30px;height:240px;padding:24px 24px 0}
.grafik .cubuk{width:64px;border-radius:8px;border:2px solid;box-sizing:border-box;min-height:4px}
.grafik-etiket{display:flex;justify-content:center;gap:30px;padding:12px 24px 22px}
.grafik-etiket div{width:64px;display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;font-size:13px;font-weight:500}
.grafik-etiket small{font-size:11px;color:var(--yesil);font-weight:400}
.aylik{overflow-x:auto}
.aylik-ic{min-width:560px;padding:24px 24px 18px}
.aylik-cubuklar{display:flex;align-items:flex-end;justify-content:space-between;gap:6px;height:220px;border-bottom:1px solid rgba(255,255,255,.1)}
.aylik-cubuklar > div{flex:1;display:flex;align-items:flex-end;justify-content:center;gap:4px;height:100%}
.aylik-cubuklar i{display:block;width:14px;border-radius:5px 5px 2px 2px;border:1.5px solid;min-height:2px}
.aylik-ay{display:flex;justify-content:space-between;gap:6px;padding-top:10px}
.aylik-ay span{flex:1;text-align:center;font-size:11px;color:var(--soluk)}
.lejant{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:#C3CBD4}
.lejant i{width:12px;height:12px;border-radius:3px;border:1.5px solid}
.c-satis{border-color:var(--mavi) !important;background:rgba(125,150,255,.35)}
.c-alis{border-color:var(--pembe) !important;background:rgba(224,112,184,.35)}

/* ---------- Liste ---------- */
.liste-oge{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:14px 20px;border-bottom:1px solid var(--cizgi2);text-decoration:none;color:var(--yazi)}
.liste-oge:hover{background:rgba(255,255,255,.03);color:var(--yazi)}
.liste-oge.secili{background:rgba(242,165,65,.08);box-shadow:inset 3px 0 0 var(--turuncu)}
.liste-oge .govde{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:3px}
.liste-oge .govde strong{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.liste-oge .govde small{font-size:12px;color:var(--soluk)}
.liste-oge .sag{display:flex;flex-direction:column;align-items:flex-end;gap:6px;font-weight:600}
.bos{padding:40px 24px;text-align:center;color:var(--soluk)}

table.tablo{border-collapse:collapse;width:100%}
.tablo th{font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--soluk);text-align:left;padding:10px;border-bottom:1px solid var(--cizgi);white-space:nowrap}
.tablo td{padding:12px 10px;border-bottom:1px solid var(--cizgi2);white-space:nowrap;vertical-align:middle}
.tablo th.r,.tablo td.r{text-align:right}
.tablo tr.tikla{cursor:pointer}
.tablo tr.tikla:hover td{background:rgba(255,255,255,.03)}
.tablo tfoot td{font-weight:600;border-bottom:0}
.tablo td.sar{white-space:normal}
.kaydir{overflow-x:auto}
.soluk{color:var(--soluk)}
.kucuk{font-size:12px}
.pozitif{color:var(--yesil)}
.negatif{color:var(--kirmizi)}

.rozet{display:inline-block;font-size:11px;font-weight:600;padding:3px 10px;border-radius:12px;white-space:nowrap}
.rozet-gri{background:rgba(255,255,255,.07);color:#C3CBD4}
.rozet-yesil{background:rgba(41,196,106,.15);color:var(--yesil)}
.rozet-kirmizi{background:rgba(255,143,122,.15);color:var(--kirmizi)}
.rozet-turuncu{background:rgba(242,165,65,.16);color:var(--turuncu)}
.rozet-mavi{background:rgba(125,150,255,.16);color:#A9B9FF}
.rozet-pembe{background:rgba(224,112,184,.18);color:#F0A6D5}
.kaynak{display:inline-block;padding:2px 7px;border-radius:6px;font-size:10px;font-weight:700}
.kaynak-QR{background:rgba(41,196,106,.16);color:var(--yesil)}
.kaynak-YZ{background:rgba(125,150,255,.18);color:#A9B9FF}
.kaynak-\!{background:rgba(242,165,65,.18);color:var(--turuncu)}

.sekmeler{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--cizgi)}
.sekmeler a{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 16px;color:var(--soluk);text-decoration:none}
.sekmeler a.aktif{color:#fff;font-weight:600;box-shadow:inset 0 -2px 0 var(--turuncu)}
.sekmeler a span{opacity:.7}
.filtre{display:flex;flex-wrap:wrap;gap:6px}
.filtre a{height:32px;display:inline-flex;align-items:center;padding:0 14px;border-radius:16px;border:1px solid rgba(255,255,255,.14);color:var(--ikincil);text-decoration:none;font-size:12px}
.filtre a.aktif{border-color:var(--turuncu);background:var(--turuncu);color:var(--yan);font-weight:600}

/* ---------- Form ---------- */
form{margin:0}
.alan{display:flex;flex-direction:column;gap:6px;min-width:0}
.alan label,.etiket{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--soluk);font-weight:500}
.girdi,.alan input,.alan select,.alan textarea{width:100%;height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.10);background:var(--girdi);color:var(--yazi);padding:0 12px;font:inherit}
.alan textarea{height:auto;min-height:90px;padding:10px 12px;resize:vertical}
.girdi:focus,.alan input:focus,.alan select:focus,.alan textarea:focus{outline:none;border-color:var(--turuncu);box-shadow:0 0 0 3px rgba(242,165,65,.15)}
.girdi.kontrol,.alan input.kontrol{border-color:var(--turuncu);box-shadow:0 0 0 3px rgba(242,165,65,.15)}
.alan .ipucu{font-size:11px;color:var(--turuncu)}
.form-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
.genis2{grid-column:span 2}
.onay-kutu{display:flex;align-items:center;gap:10px;min-height:44px;font-size:14px;color:var(--yazi)}
.onay-kutu input{width:20px;height:20px;accent-color:var(--turuncu)}
.alan label.onay-kutu,.uyari .onay-kutu{justify-content:flex-start;font-size:14px;color:inherit}
.kaynak-OCR{background:rgba(242,165,65,.18);color:var(--turuncu)}

.btn,.btn2,.btn3{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border-radius:10px;font:600 14px inherit;font-family:inherit;cursor:pointer;white-space:nowrap;text-decoration:none}
.btn{border:0;background:var(--turuncu);color:var(--yan)}
.btn:hover{background:#F6B562;color:var(--yan)}
.btn2{border:1px solid rgba(255,255,255,.18);background:transparent;color:var(--yazi);font-weight:500}
.btn2:hover{border-color:rgba(255,255,255,.35);color:#fff}
.btn3{border:1px solid rgba(255,143,122,.5);background:transparent;color:var(--kirmizi);font-weight:500}
.btn-kucuk{height:36px;padding:0 14px;font-size:13px}
.btn-link{border:0;background:none;color:var(--ikincil);font:inherit;cursor:pointer;min-height:44px;padding:0}
button:disabled{opacity:.5;cursor:not-allowed}

/* Fatura kalem tablosu */
.kalemler td{padding:6px 4px}
.kalemler input,.kalemler select{width:100%;height:38px;border-radius:8px;border:1px solid rgba(255,255,255,.08);background:var(--girdi);color:var(--yazi);padding:0 8px;font:inherit}
.kalemler input.r{text-align:right}
.kalemler .sil{width:36px;height:36px;border:0;background:none;color:var(--soluk);font-size:20px;cursor:pointer}
.toplamlar{display:flex;flex-direction:column;gap:8px;min-width:280px}
.toplamlar div{display:flex;justify-content:space-between;gap:20px;color:var(--ikincil)}
.toplamlar .buyuk{padding-top:10px;border-top:1px solid var(--cizgi);color:var(--yesil);font-weight:600}
.toplamlar .buyuk .num{font-size:22px}

/* Belge yükleme */
.birak{min-height:340px;border:2px dashed rgba(242,165,65,.45);border-radius:16px;background:rgba(242,165,65,.04);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:32px;text-align:center;transition:background .15s}
.birak.uzerinde{background:rgba(242,165,65,.12)}
.birak h2{font-size:22px;font-weight:600}
.birak p{margin:0;max-width:460px;line-height:1.6;color:var(--ikincil)}
.onizleme{background:#2A313B;padding:20px;display:flex;justify-content:center}
.onizleme img{max-width:100%;max-height:640px;border-radius:4px;box-shadow:0 18px 40px rgba(0,0,0,.45)}
.onizleme iframe{width:100%;height:640px;border:0;border-radius:4px;background:#fff}
.durum-satir{display:flex;align-items:center;gap:12px;font-size:13px}
.nokta{flex:none;width:10px;height:10px;border-radius:50%}
.adim{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.adim li{display:flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 6px;border-radius:18px;font-size:13px;color:var(--en-soluk)}
.adim li b{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;background:var(--kart);color:var(--soluk)}
.adim li.simdi{background:rgba(242,165,65,.14);color:#fff;font-weight:600}
.adim li.simdi b{background:var(--turuncu);color:var(--yan)}
.adim li.bitti{color:var(--yesil)}
.adim li.bitti b{background:rgba(41,196,106,.18);color:var(--yesil)}
.yukleniyor{display:none;align-items:center;gap:12px;color:var(--turuncu)}
.yukleniyor.acik{display:flex}
.donen{width:20px;height:20px;border-radius:50%;border:2px solid rgba(242,165,65,.3);border-top-color:var(--turuncu);animation:don 1s linear infinite}
@keyframes don{to{transform:rotate(360deg)}}

/* Uyarılar */
.uyari{padding:14px 18px;border-radius:12px;font-size:14px;line-height:1.5}
.uyari-ok{background:rgba(41,196,106,.10);border:1px solid rgba(41,196,106,.3);color:#B5F2CB}
.uyari-hata{background:rgba(255,143,122,.10);border:1px solid rgba(255,143,122,.35);color:#FFC2B6}
.uyari-bilgi{background:rgba(242,165,65,.08);border:1px solid rgba(242,165,65,.3);color:#FFD9A8}
.uyari ul{margin:6px 0 0;padding-left:18px}

.serit{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));border-top:1px solid var(--cizgi)}
.serit div{padding:16px 24px;border-right:1px solid var(--cizgi2);display:flex;flex-direction:column;gap:4px}
.serit span{font-size:12px;color:var(--soluk)}
.serit strong{font-size:17px;font-weight:600}

dialog{background:var(--kart);color:var(--yazi);border:1px solid var(--cizgi);border-radius:16px;padding:0;width:min(440px,92vw)}
dialog::backdrop{background:rgba(0,0,0,.55)}
dialog .kart-ic{display:flex;flex-direction:column;gap:14px}

/* ---------- Giriş ---------- */
.giris{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.giris .kart{width:min(420px,100%)}
.giris .logo{border:0;height:auto;padding:0 0 8px}

/* ---------- Telefon ---------- */
@media (max-width: 820px){
  .yan{display:none}
  .ust{padding:12px 14px;gap:10px}
  .ust-ara,.kullanici-ad{display:none}
  .icerik{padding:16px 14px 104px;gap:16px}
  .baslik h1{font-size:24px}
  .kart-bas,.kart-ic{padding:16px}
  .genis2{grid-column:auto}
  .alt-menu{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;background:var(--yan);border-top:1px solid var(--cizgi);padding:6px 4px calc(10px + env(safe-area-inset-bottom));z-index:10}
  .alt-menu a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:48px;color:var(--ikincil);text-decoration:none;font-size:11px}
  .alt-menu a.aktif{color:var(--turuncu);font-weight:600}
  .alt-menu a.arti span{width:48px;height:48px;margin-top:-20px;border-radius:50%;background:var(--turuncu);color:var(--yan);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,.4)}
  .grafik{gap:16px}
  .grafik-etiket{gap:16px}
}

@media print{
  .yan,.ust,.alt-menu,.dugmeler,.yazdirma{display:none !important}
  body,html{background:#fff;color:#000}
  .kart{background:#fff;border:1px solid #ccc;color:#000}
  .icerik{padding:0}
}
