/* DRMS — el yazımı stil. Node/Tailwind derlemesi gerekmez. */
:root{
  --bg:#f7f7f5; --surface:#fff; --surface-2:#f2f2ef; --elev:#fff;
  --ink:#16150f; --ink-2:#45443c; --muted:#7c7a6e; --line:#e3e2dc;
  --accent:#b4522a; --ok:#3f7d4e; --warn:#a8761b; --crit:#b0392c;
  --f-sans:"Figtree",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --f-disp:var(--f-sans); --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --r:14px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 var(--f-sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
.app{display:grid;grid-template-columns:246px 1fr;min-height:100vh}
.side{background:var(--surface);border-right:1px solid var(--line);padding:18px 14px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh;overflow:auto}
.brand{display:flex;gap:10px;align-items:center;padding:6px 8px 18px}
.brand b{font-family:var(--f-disp);font-size:17px;letter-spacing:-.02em}
.brand span{display:block;font-size:11.5px;color:var(--muted)}
.logo{width:30px;height:30px;border-radius:9px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
/* Kenar cubugu logosu. SVG fill="currentColor" tasiyor: rengi metinden
   aliyor, tema degisirse kendiliginden uyuyor. */
.brand-logo{width:104px;height:auto;display:block;color:var(--ink)}
.navg{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:14px 8px 5px}
.nav{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:9px;text-decoration:none;color:var(--ink-2);font-size:14px}
.nav:hover{background:var(--surface-2)}
.nav.on{background:var(--surface-2);color:var(--ink);font-weight:600}
.nav .n{margin-left:auto;font-size:11.5px;color:var(--muted);font-family:var(--f-mono)}
.main{padding:26px 30px 60px;max-width:1400px}
.top{display:flex;align-items:flex-start;gap:16px;margin-bottom:22px;flex-wrap:wrap}
h1{font-family:var(--f-disp);font-size:27px;letter-spacing:-.02em;margin:0 0 3px}
h2{font-size:19px;margin:0 0 10px;letter-spacing:-.01em}
h3{font-size:15px;margin:0}
.sub{color:var(--muted);font-size:13.5px;margin:0}
.sp{flex:1}
.btn{display:inline-flex;align-items:center;gap:7px;background:var(--ink);color:#fff;border:0;border-radius:999px;padding:9px 17px;font:inherit;font-size:14px;font-weight:500;cursor:pointer;text-decoration:none}
.btn:hover{opacity:.9}
.btn.g{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.g:hover{background:var(--surface-2)}
.btn.sm{padding:5px 12px;font-size:13px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);margin-bottom:18px;overflow:hidden}
.card-h{display:flex;align-items:center;gap:12px;padding:15px 18px;border-bottom:1px solid var(--line)}
.card-b{padding:18px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:18px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;
  display:block;text-decoration:none;color:inherit;transition:border-color .12s,box-shadow .12s}
a.stat:hover{border-color:var(--muted);box-shadow:0 2px 8px rgba(0,0,0,.05)}
.stat .l{font-size:12px;color:var(--muted);text-transform:none}
.stat .n{font-family:var(--f-disp);font-size:31px;font-weight:600;letter-spacing:-.02em;margin:4px 0 2px}
.stat .d{font-size:12.5px;color:var(--muted)}
.two{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr);gap:18px;align-items:start}
@media(max-width:1100px){.app{grid-template-columns:1fr}.side{position:static;height:auto}.two{grid-template-columns:1fr}}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-weight:500;font-size:12px;color:var(--muted);padding:10px 18px;border-bottom:1px solid var(--line)}
td{padding:11px 18px;border-bottom:1px solid var(--line);vertical-align:top}
tr:last-child td{border-bottom:0}
tr.row:hover{background:var(--surface-2);cursor:pointer}
.mono{font-family:var(--f-mono);font-size:13px}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:3px 9px;border-radius:999px;background:var(--surface-2);color:var(--ink-2);white-space:nowrap}
.chip .d{width:6px;height:6px;border-radius:50%;background:currentColor}
.chip.ok{background:#eaf3ec;color:var(--ok)} .chip.warn{background:#faf1e0;color:var(--warn)}
.chip.crit{background:#f8ebe9;color:var(--crit)} .chip.info{background:#f0eeff;color:#5b52b8}
label{display:block;font-size:12.5px;color:var(--muted);margin-bottom:5px}
input,select,textarea{width:100%;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);font:inherit;font-size:14px;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--ink);outline-offset:-1px}
textarea{min-height:74px;resize:vertical}
/* Onay ve seçim kutuları yukarıdaki metin alanı biçimini ALMAZ.
   width:100% + çerçeve + iç boşluk bir onay kutusunu bozar; esnek
   kutu içinde ezilir, metnin yanında yamuk durur. 18px dokunmatik
   için de gerçek bir hedef büyüklüğü — parmakla 13px kutuya
   isabet ettirmek tezgâhta her gün yaşanan bir sürtünmedir. */
input[type=checkbox],input[type=radio]{
  width:18px;height:18px;min-width:18px;flex:0 0 auto;
  padding:0;border:0;border-radius:0;accent-color:var(--accent);cursor:pointer}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
.grid .w{grid-column:1/-1}
@media(max-width:700px){.grid{grid-template-columns:1fr}}
.checks{display:flex;flex-wrap:wrap;gap:9px 16px}
.checks label{display:inline-flex;align-items:center;gap:7px;color:var(--ink-2);font-size:13.5px;margin:0;cursor:pointer}
.hint{font-size:12px;color:var(--muted);margin-top:5px}
.note{background:var(--surface-2);border-radius:10px;padding:12px 14px;font-size:13.5px;color:var(--ink-2);line-height:1.55}
.note.warn{background:#faf1e0;color:#7a5510}
.note.crit{background:#f8ebe9;color:#8d2b20}
.flash{padding:12px 16px;border-radius:10px;margin-bottom:16px;font-size:14px}
.flash.ok{background:#eaf3ec;color:var(--ok)} .flash.err{background:#f8ebe9;color:var(--crit)}
.sep{height:1px;background:var(--line);margin:14px 0}
.steps{display:flex;gap:0;overflow-x:auto;padding-bottom:2px}
.step{flex:1;min-width:118px;padding:12px 12px 0;border-top:2px solid var(--line)}
.step.done{border-color:var(--ok)} .step.now{border-color:var(--accent)}
.step b{display:block;font-size:13.5px;font-weight:500}
.step.now b{font-weight:700}
.step span{font-size:11.5px;color:var(--muted)}
.feed{display:flex;flex-direction:column}
.fi{display:grid;grid-template-columns:66px 1fr;gap:12px;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px}
.fi:first-child{border-top:0}
.fi time{color:var(--muted);font-size:12px;font-family:var(--f-mono)}
.tabs{display:inline-flex;gap:2px;background:var(--surface-2);border-radius:999px;padding:3px}
.tabs a{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:999px;font-size:13.5px;text-decoration:none;color:var(--ink-2)}
.tabs .sy{font-size:11.5px;font-family:var(--f-mono);color:var(--muted);background:var(--surface);
  border-radius:999px;padding:1px 6px;line-height:1.5}
.tabs a.on .sy{background:var(--surface-2);color:var(--ink-2)}
.tabs a.on{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.pill{font-family:var(--f-mono);font-size:12.5px;background:var(--surface-2);padding:2px 8px;border-radius:6px}
/* --- basılı belge --- */
.sheet{background:#fff;color:#111;max-width:820px;margin:0 auto 24px;padding:38px 42px;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.06),0 18px 40px -30px rgba(0,0,0,.4)}
.sheet .lh{display:flex;justify-content:space-between;gap:20px;border-bottom:1.5px solid #111;padding-bottom:14px;margin-bottom:18px}
.sheet .sec{border-bottom:1px solid #e6e6e6;padding-bottom:14px;margin-bottom:14px}
.sheet .lbl{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:#666;margin-bottom:8px}
.sheet table.dt td{padding:6px 0;border-bottom:1px dotted #ddd;font-size:13px}
.sheet table.dt td:first-child{color:#666;width:38%}
.sheet .sig{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:22px}
.sheet .sig u{display:block;border-bottom:1px solid #111;height:34px;text-decoration:none;margin-top:6px}
.sheet .box{border:1.5px solid #111;border-radius:9px;padding:12px 14px;display:flex;gap:16px;align-items:center;margin-top:12px;font-size:12.5px}
.sheet .box u{flex:none;width:110px;border-bottom:1px solid #111;height:28px;text-decoration:none;text-align:center;font-size:10px;color:#888;display:flex;align-items:flex-end;justify-content:center}
@media print{
  @page{size:A4 portrait;margin:15mm}
  body{background:#fff}
  .side,.top,.noprint{display:none!important}
  .main{padding:0;max-width:none}
  .sheet{box-shadow:none;border-radius:0;padding:0;max-width:none;margin:0}
}

/* Sayfalama — Laravel'in Tailwind şablonu yerine */
.sayfalama{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:18px 0 4px;font-size:13px}
.sayfalama .sf{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;
  padding:0 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface);
  color:var(--ink);text-decoration:none;line-height:1}
.sayfalama a.sf:hover{border-color:var(--muted);background:var(--surface-2)}
.sayfalama .sf.secili{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:600}
.sayfalama .sf.pasif{color:var(--muted);background:var(--surface-2);opacity:.6}
.sayfalama .sf.bosluk{border:0;background:none;min-width:16px;padding:0;color:var(--muted)}
.sayfalama .sf-bilgi{margin-left:auto;color:var(--muted);font-size:12px}

/* Top kimde — listede en hızlı okunan işaret */
.taraf{display:inline-block;font-size:11.5px;font-weight:600;padding:2px 8px;border-radius:999px;letter-spacing:.01em}
.taraf.biz{background:#fdeee6;color:var(--accent)}
.taraf.musteri{background:var(--surface-2);color:var(--ink-2)}
.taraf.tedarik{background:#f3efe2;color:var(--warn)}
.rozet{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;
  background:var(--surface-2);color:var(--ink-2);font-size:11px;font-weight:600;letter-spacing:.02em}

/* Kabul ekranı — firma/ad ile müşteri bulma sonuçları */
.bulListe{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.bulSatir{display:grid;grid-template-columns:1fr auto;gap:2px 12px;width:100%;text-align:left;
  background:var(--surface-2);border:1px solid transparent;border-radius:10px;padding:9px 12px;
  font:inherit;font-size:13.5px;color:var(--ink);cursor:pointer}
.bulSatir:hover{border-color:var(--muted);background:var(--surface)}
.bulSatir .bs-ad{font-weight:600}
.bulSatir .bs-ad small{display:block;font-weight:400;color:var(--muted);font-size:12px}
.bulSatir .bs-tel{font-size:13px;color:var(--ink-2)}
.bulSatir .bs-not{grid-column:1/-1;color:var(--muted);font-size:11.5px}

/* Vaka yazışması */
.konusma{display:flex;flex-direction:column;gap:9px;max-height:340px;overflow-y:auto}
.balon{border-radius:12px;padding:9px 12px;font-size:13.5px;line-height:1.55;max-width:92%}
.balon .ust{font-size:11px;color:var(--muted);margin-bottom:3px}
.balon.gelen{background:var(--surface-2);align-self:flex-start;border-bottom-left-radius:4px}
.balon.giden{background:#fdeee6;align-self:flex-end;border-bottom-right-radius:4px}
.dosya-listesi{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;
  padding:10px 12px;margin:8px 0 4px;max-height:260px;overflow:auto;font-family:var(--f-mono);
  font-size:12px;line-height:1.6;white-space:pre;color:var(--ink-2)}
.nokta{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:6px;vertical-align:middle}

/* Hizmet koşulları — teklifin 2. sayfası */
.sayfa-kir{height:24px}
@media print{ .sayfa-kir{break-before:page;page-break-before:always;height:0} }
.kosullar .giris{font-size:12px;color:#444;line-height:1.6;margin:0 0 16px;padding-bottom:14px;border-bottom:1px solid #e6e6e6}
.kosullar .mad{margin-bottom:15px;break-inside:avoid}
.kosullar h4{font-family:var(--f-disp);font-size:12.5px;margin:0 0 7px;letter-spacing:.01em}
.kosullar ol{margin:0;padding-left:20px}
.kosullar li{font-size:11.5px;line-height:1.62;color:#222;margin-bottom:5px}
.kosullar p{font-size:11.5px;line-height:1.62;color:#333;margin:6px 0 0}
.kosullar .vurgu{background:#fbfbf9;border-left:2px solid #c9a227;padding:11px 13px;border-radius:0 8px 8px 0}
.kosullar .vurgu h4{margin-top:0}
.kosullar table.dt td{font-size:11.5px;line-height:1.55}
.kosullar .onay{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:20px;padding-top:16px;border-top:1px solid #e6e6e6}
.kosullar .onay u{display:block;border-bottom:1px solid #111;height:32px;text-decoration:none;margin-top:8px}
.kosullar .onay span{font-size:10px;color:#888}
.kosullar .dip{font-size:10.5px;color:#777;margin-top:10px}

/* Teklif eki — bilgilendirme sayfası */
.bilgi .ikili{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.bilgi .blok{margin-bottom:16px;break-inside:avoid}
.bilgi h4{font-family:var(--f-disp);font-size:13px;margin:0 0 6px;letter-spacing:.01em}
.bilgi p{font-size:12px;line-height:1.68;color:#333;margin:0}
.bilgi ul.uc{margin:9px 0 0;padding-left:18px}
.bilgi ul.uc li{font-size:12px;line-height:1.62;color:#333;margin-bottom:4px}
.bilgi .dipnot{margin-top:18px;padding-top:12px;border-top:1px solid #e6e6e6;font-size:10.5px;color:#777;line-height:1.55}

/* Kabul etiketleri — disk ve kutu */
.etiket-alan{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start}
.etiket{background:#fff;color:#000;border:1px dashed #bbb;border-radius:4px;padding:3mm 4mm;
  font-family:var(--f-sans);box-sizing:border-box}
.etiket .ust{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.etiket .no{font-weight:700;letter-spacing:.01em}
.etiket .bar svg{display:block;max-width:100%}
.etiket .alt{font-size:8px;letter-spacing:.06em;color:#333;text-align:center;margin-top:1px}

.etiket.disk{width:50mm;height:30mm;display:flex;align-items:center;gap:1.6mm;
  padding:2mm 1.8mm;overflow:hidden}
/* Sol sütun yazı, sağ sütun karekod. Karekod sabit genişlikte:
   esneyip küçülürse modüller bulanıklaşır ve okuma tutmaz. */
.etiket.disk .bilgi{flex:1;min-width:0;display:flex;flex-direction:column;gap:1mm}
.etiket.disk .kare{flex:none;width:17mm;height:17mm;line-height:0}
.etiket.disk .kare svg{width:100%;height:100%;display:block}
.etiket.disk .firma{font-size:8px;letter-spacing:.12em;color:#444;line-height:1}
.etiket.disk .no{font-size:14px;font-weight:700;letter-spacing:0;line-height:1.05;white-space:nowrap}
.etiket.disk .ad{font-size:10.5px;font-weight:600;color:#000;line-height:1.2;
  max-height:2.6em;overflow:hidden}
.etiket.disk .tar{font-size:10px;color:#333;line-height:1}
/* Kutu etiketi disk etiketiyle ayni dili konusur: TEKNIKNOKTA, numara,
   musteri, tarih. Cizgisel barkod kalkti, karekod geldi. Tablo flex ile
   kalan yuksekligi doldurur; altta olu alan kalmaz. */
.etiket.kutu{width:100mm;height:70mm;display:flex;flex-direction:column;
  padding:4mm 4.5mm;overflow:hidden}
.etiket.kutu .ust{display:flex;justify-content:space-between;align-items:flex-start;gap:4mm}
.etiket.kutu .bilgi{flex:1;min-width:0;display:flex;flex-direction:column;gap:1.2mm}
.etiket.kutu .firma{font-size:9px;letter-spacing:.14em;color:#444;line-height:1;margin:0}
.etiket.kutu .no{font-size:23px;font-weight:700;letter-spacing:0;line-height:1.05}
.etiket.kutu .eski{font-size:9px;color:#666;line-height:1}
.etiket.kutu .ad{font-size:13px;font-weight:600;color:#000;line-height:1.2;
  max-height:2.5em;overflow:hidden}
.etiket.kutu .tar{font-size:11px;color:#333;line-height:1}
/* Sag sutun: karekod ve altinda raf konumu. Raf, kutu yanlis yere
   konduğunda NEREYE ait olduğunu söyleyen tek satır; bir metreden
   okunabilmesi gerekiyor, o yüzden numaradan sonraki en büyük punto. */
.etiket.kutu .sag{flex:none;display:flex;flex-direction:column;align-items:center;gap:1.4mm}
.etiket.kutu .kare{flex:none;width:25mm;height:25mm;line-height:0}
.etiket.kutu .raf{border:1.6px solid #000;border-radius:3px;padding:0.6mm 2mm;
  text-align:center;min-width:25mm;line-height:1.1}
.etiket.kutu .raf b{display:block;font-size:6.5px;letter-spacing:.14em;color:#444;font-weight:400}
.etiket.kutu .raf span{display:block;font-size:14px;font-weight:700;letter-spacing:.02em}
.etiket.kutu .kare svg{width:100%;height:100%;display:block}
.etiket.kutu .isaretler{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-start;margin-top:0.6mm}
.etiket.kutu .isaret{border:1.3px solid #000;border-radius:3px;padding:1px 6px;font-size:9.5px;font-weight:700;letter-spacing:.06em}
.etiket.kutu .isaret.acil{background:#000;color:#fff}
.etiket.kutu table.kt{width:100%;border-collapse:collapse;margin-top:2.5mm;flex:1;height:100%}
.etiket.kutu table.kt td{font-size:11.5px;padding:2px 0;border-bottom:1px dotted #bbb;
  vertical-align:middle;line-height:1.3}
.etiket.kutu table.kt td:first-child{color:#666;width:22mm}
.etiket.kutu table.kt td.bos{border-bottom:1.4px solid #000}

/* Etiket yazdirma: sayfa boyu etiketin boyu. Dosyadaki diger @page
   kurallari tek sayfa tanimina birikiyor ve sonuncusu kazaniyordu;
   etiket de A4 basiliyordu, yazici onu 50x30'a sigdirmak icin
   kuculturdu. Adlandirilmis sayfa bunu kesiyor. */
@page etiket-disk{size:50mm 30mm;margin:0}
@page etiket-kutu{size:100mm 70mm;margin:0}

@media print{
  .app{display:block}
  .main{padding:0!important;max-width:none!important}
  .etiket-alan{display:block}
  .etiket{border:0;break-inside:avoid}
  .etiket-alan.disk{page:etiket-disk}
  .etiket-alan.kutu{page:etiket-kutu}
  .etiket + .etiket{break-before:page;page-break-before:always}
}


/* ------------------------------------------------------------------
   Tablet ve telefon
   Panel masaüstü için tasarlandı; laboratuvarda tablet, sahada telefon
   kullanılıyor. Amaç küçültmek değil, DÜZENİ DEĞİŞTİRMEK:
   kenar menü yatay şeride, geniş tablolar kartlara dönüşür.
   ------------------------------------------------------------------ */

/* Dokunma hedefleri — parmakla kullanılacak her şey en az 40px */
@media (pointer:coarse){
  .btn{padding:11px 18px}
  .btn.sm{padding:9px 14px;font-size:13.5px}
  .nav{padding:11px 12px}
  input,select,textarea{padding:11px 12px;font-size:16px}  /* 16px: iOS yakınlaştırmasın */
  .tabs a{padding:9px 15px}
  .row{cursor:default}
}

@media (max-width:900px){
  .main{padding:18px 16px 48px}
  h1{font-size:23px}

  /* Kenar menü üstte yatay şerit; içerik yukarı çıksın */
  .side{position:sticky;top:0;z-index:20;flex-direction:row;flex-wrap:wrap;align-items:center;
    gap:6px;padding:10px 14px;border-right:0;border-bottom:1px solid var(--line)}
  .side .brand{padding:0 8px 0 0}
  .side .brand b span{display:none}
  .side .brand-logo{width:76px}
  .side .navg{display:none}          /* grup başlıkları şeritte yer kaplar */
  .side .sep,.side .sp{display:none}
  .nav{padding:7px 11px;font-size:13.5px;white-space:nowrap}
  .side form{margin-left:auto}

  .stats{grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px}
  .stat{padding:13px 14px}
  .stat .n{font-size:25px}
  .card-b{padding:14px}
  .card-h{padding:13px 14px}
}

/* Telefon: geniş tablolar satır satır karta dönüşür.
   data-bx özniteliği olan hücreler başlığını yanında taşır. */
@media (max-width:640px){
  .main{padding:14px 12px 44px}
  .top{gap:10px}
  .tabs{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}

  .card table thead{display:none}
  .card table,.card table tbody,.card table tr,.card table td{display:block;width:100%}
  .card table tr{border-bottom:1px solid var(--line);padding:11px 14px}
  .card table tr:last-child{border-bottom:0}
  .card table td{border:0;padding:2px 0}
  .card table td:first-child{font-weight:600}
  .card table td[data-bx]::before{content:attr(data-bx) " · ";color:var(--muted);font-size:12px;font-weight:400}

  .sayfalama .sf-bilgi{width:100%;margin:6px 0 0;text-align:center}
  .konusma{max-height:none}
  .balon{max-width:100%}
  .two{gap:14px}
}

/* Portal telefonda tek sütun ve rahat okunur kalsın */
@media (max-width:640px){
  .dosya-listesi{max-height:200px;font-size:11.5px}
  .steps .step{min-width:118px}
}

/* Yazdırmada bunların hiçbiri geçerli değil */
@media print{
  .side{display:none!important}
  .card table thead{display:table-header-group}
  .card table,.card table tbody,.card table tr,.card table td{display:revert}
}

/* Parola alanı — göster/gizle */
.parola-kutu{position:relative;display:block}
.parola-kutu input{padding-right:72px}
.parola-kutu button{position:absolute;right:5px;top:50%;transform:translateY(-50%);
  background:transparent;border:0;color:var(--muted);font:inherit;font-size:12.5px;
  padding:6px 9px;border-radius:8px;cursor:pointer}
.parola-kutu button:hover{background:var(--surface-2);color:var(--ink)}

/* ------------------------------------------------------------------
   Basılı belge düzeni — tek sayfa, standart (09.09.2026).
   Punto düşürülmez: kazanç yerleşimden gelir. Gövde iki sütuna akar,
   kenar boşlukları daraltılır, dikey boşluklar toplanır. İmzalanacak
   bir belgede okunabilirlik pazarlık konusu değildir.
   ------------------------------------------------------------------ */
.sheet.tek{padding:30px 34px;max-width:900px}

/* Gövde iki sütun; başlık ve imza bloğu tam genişlikte kalır. */
.sheet.tek{column-count:2;column-gap:26px;column-fill:balance}
.sheet.tek > .lh,
.sheet.tek > .sec.son{column-span:all}
.sheet.tek > .sec{break-inside:avoid;padding-bottom:10px;margin-bottom:10px}

/* Dar sütunda etiket payı küçülür, değer nefes alır. */
.sheet.tek table.dt td{padding:4px 0;line-height:1.45}
.sheet.tek table.dt td:first-child{width:33%;padding-right:10px}

.sheet.tek .lbl{margin-bottom:5px}
.sheet.tek .box{margin-top:9px}
.sheet .kosul-ozet{font-size:11.5px;color:#333;line-height:1.7}

/* Kabul formu TEK SAYFA olmak zorunda: ikinci sayfa bilgilendirme eki,
   üçüncü sayfa diye bir şey yok. Müşteriye iki nüsha veriliyor, her
   fazladan yaprak iki kat kâğıt ve imzalanacak bir sayfa daha demek.
   Ekranda ferah dursun, kâğıtta sıkışsın. */
@media print{
  .sheet.tek > .sec{padding-bottom:7px;margin-bottom:7px}
  .sheet.tek table.dt td{padding:2.5px 0;line-height:1.35;font-size:12px}
  .sheet.tek .lh{padding-bottom:10px;margin-bottom:12px}
  .sheet.tek .lbl{margin-bottom:4px}
  .sheet.tek .kosul-ozet{font-size:10px;line-height:1.45}
  .sheet.tek .box{margin-top:7px;padding:8px 11px;font-size:11.5px}
  .sheet.tek .box u{height:22px}
  .sheet.tek .sig{margin-top:12px;gap:24px}
  .sheet.tek .sig u{height:26px;margin-top:4px}

  /* Hizmet koşulları 10 kısa madde: tek sütunda yarım sayfa yer kaplıyor,
     iki sütunda yarısı. Metin kısalmıyor, sadece yatay yerleşiyor. */
  .sheet.tek .kosul-ozet{column-count:2;column-gap:22px}
}
.sheet.tek .sig{margin-top:14px}
.sheet.tek .kosul-kaynak{font-size:10px;color:#555;margin-top:7px;line-height:1.45}

@media print{
  /* Kenar boşluğu 15mm → 10mm: A4'te satır başına ~%6 daha fazla yer. */
  @page{size:A4 portrait;margin:10mm}
  .sheet.tek{padding:0;max-width:none;column-gap:22px}
  .sheet.tek > .sec{break-inside:avoid}

  /* SON BÖLÜM BUNUN DIŞINDA. Hizmet koşulları + imza tek parça
     sayılınca, sayfada kalan boşluğa sığmadığı anda BÜTÜNÜYLE
     ikinci sayfaya atlıyordu — kâğıdın alt yarısı boş, imza tek
     başına bir yaprakta. Metin aksın, bölünmemesi gereken tek şey
     imza satırlarının kendisi. */
  .sheet.tek > .sec.son{break-inside:auto}
  .sheet.tek .sig{break-inside:avoid}
  .sheet.tek .box{break-inside:avoid}
}

/* Ayarlar ekranı */
.ayar-not{font-size:12.5px;color:var(--muted);line-height:1.6;margin:0 0 14px}
label .birim{font-weight:400;color:var(--muted);font-size:11.5px;margin-left:5px}
table.bant{width:100%;border-collapse:collapse}
table.bant th{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);
  text-align:left;padding:0 10px 8px 0;font-weight:500}
table.bant td{padding:7px 10px 7px 0;border-bottom:1px solid var(--line);vertical-align:top;font-size:13.5px}
table.bant tr:last-child td{border-bottom:0}
table.bant td:first-child{width:62px}
table.bant td input{width:96px;padding:7px 10px;font-size:13.5px}
table.bant .kapsam{color:var(--muted);font-size:11.5px;line-height:1.5;margin-top:2px;max-width:420px}
@media (max-width:760px){
  table.bant td .kapsam{display:none}
  table.bant td input{width:74px}
}

/* ------------------------------------------------------------------
   Raporlar.
   Tek renk kullanılır: çubuk büyüklük anlatır, renk kimlik anlatmaz.
   Büyüklüğü renkle de kodlamak bilgi eklemez, yalnız gürültü ekler —
   ve renk körü bir okuyucuda tabloyu okunmaz hâle getirir. Sayı her
   zaman çubuğun yanında yazılıdır; çubuk gitse de rapor okunur.
   ------------------------------------------------------------------ */
.rp-satir{display:grid;grid-template-columns:112px 1fr 74px auto;gap:12px;align-items:center;
  padding:6px 0;font-size:13.5px}
.rp-l{color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-bar{height:9px;background:var(--surface-2);border-radius:999px;overflow:hidden;min-width:40px}
.rp-bar i{display:block;height:100%;background:var(--accent);border-radius:999px;min-width:2px}
.rp-n{font-family:var(--f-mono);font-size:13px;text-align:right;white-space:nowrap}
.rp-d{color:var(--muted);font-size:11.5px;margin-left:6px;font-family:var(--f-sans)}
.rp-sag{text-align:right}

.rp-baslik{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
  margin:0 0 8px;font-weight:500}
.rp-buyuk{font-family:var(--f-disp);font-size:26px;font-weight:600;letter-spacing:-.02em;line-height:1.15}
.rp-buyuk small{font-size:13px;font-weight:500;color:var(--muted);letter-spacing:0}

.rp-ikili{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.rp-ucu{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}

.rp-kucuk{display:flex;justify-content:space-between;gap:12px;align-items:baseline;
  padding:5px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.rp-kucuk:last-child{border-bottom:0}
.rp-kucuk span{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-kucuk b{font-family:var(--f-mono);font-size:13px;font-weight:600}

/* Kart gövdesindeki tablo, sayfa tablosunun kenar boşluklarını almasın. */
table.rp-tablo td,table.rp-tablo th{padding:7px 0;font-size:13.5px}
table.rp-tablo th{padding-bottom:8px}
table.rp-tablo td.rp-sag,table.rp-tablo th.rp-sag{text-align:right}

@media(max-width:760px){
  .rp-satir{grid-template-columns:1fr 64px;gap:8px}
  .rp-satir .rp-bar{grid-column:1/-1;order:3}
  .rp-satir .rp-sag{grid-column:1/-1;order:4;text-align:left}
  .rp-ikili,.rp-ucu{grid-template-columns:1fr}
}

/* ------------------------------------------------------------------
   Belge içi bağlantılar.
   Teklif çoğu zaman PDF olarak gidiyor; adresi düz metin bırakmak
   "bağlayıcıdır" deyip ulaşılmaz kılmak olurdu. Altı çizili ve mavi:
   kâğıtta da ekranda da bağlantı gibi okunur, gri baskıda kaybolmaz.
   ------------------------------------------------------------------ */
.baglanti{color:#1a4f8a;text-decoration:underline;text-underline-offset:2px}
@media print{ .baglanti{color:#1a4f8a} }

/* ------------------------------------------------------------------
   Vaka tarih şeridi.
   Aşama şeridinin hemen altında: "neredeyiz"in yanına "ne zamandan
   beri". Yalnız gerçekleşmiş tarihler basılır — boş satır göstermek,
   olmayan bilgiyi varmış gibi göstermektir.
   ------------------------------------------------------------------ */
.tarihler{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));
  gap:14px 18px;margin-top:16px;padding-top:15px;border-top:1px solid var(--line)}
.tarihler .t-l{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);
  margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tarihler .t-v{font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap}
.tarihler .t-v .t-s{font-weight:400;color:var(--ink-2)}
.tarihler .t-a{font-size:11.5px;color:var(--muted);margin-top:1px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tarihler .t-a.gec{color:var(--crit);font-weight:600}
@media(max-width:560px){
  .tarihler{grid-template-columns:1fr 1fr;gap:12px 14px}
}

/* ------------------------------------------------------------------
   Teklif bandı göstergesi.
   Teknisyen seviyeyi seçince yalnız alt sınırı görüyor, aradaki
   aralığın etken kutularıyla belirlendiğini anlamıyordu. Çubuk
   "neredeyim" sorusunu tek bakışta cevaplar; sayı da yanında yazar,
   çubuk gitse de bilgi kaybolmaz.
   ------------------------------------------------------------------ */
.bant{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:13px;
  border-top:1px solid var(--line)}
.bant-uc{font-family:var(--f-mono);font-size:12px;color:var(--muted);white-space:nowrap}
.bant-yol{position:relative;flex:1;height:6px;background:var(--surface-2);border-radius:999px}
.bant-yol i{position:absolute;top:50%;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;
  border-radius:50%;background:var(--accent);border:2px solid var(--surface);
  box-shadow:0 0 0 1px var(--accent)}
.bant-not{font-size:12px;color:var(--muted);line-height:1.55;margin-top:7px}
.bant-sabit{font-size:12px;color:var(--muted);margin-top:14px;padding-top:13px;
  border-top:1px solid var(--line)}

/* ==================================================================
   ETKİLEŞİM KATMANI  (15.09.2026)
   Renk, yazı tipi, yarıçap değişmedi — bunlar yeni bileşen, yeni tema
   değil. Hepsi drms.js ile çalışır; JavaScript kapalıysa formlar
   sayfanın içinde durduğu yerde çalışmaya devam eder.
   ================================================================== */

/* ---- Toast -------------------------------------------------------
   Flash mesajı sayfanın tepesindeydi; uzun ekranın dibinde işlem
   yapınca görünmüyordu. Toast sağ altta, içeriğin üstünde durur.
   Hata kendiliğinden kapanmaz. */
.tost-alan{position:fixed;right:18px;bottom:18px;z-index:120;display:flex;flex-direction:column;
  gap:9px;align-items:flex-end;max-width:min(400px,calc(100vw - 36px));pointer-events:none}
.tost{pointer-events:auto;display:flex;align-items:flex-start;gap:10px;background:var(--surface);
  border:1px solid var(--line);border-left:3px solid var(--ink-2);border-radius:11px;
  padding:11px 12px 11px 14px;font-size:13.5px;line-height:1.5;color:var(--ink);
  box-shadow:0 4px 14px -6px rgba(0,0,0,.28),0 1px 2px rgba(0,0,0,.05);
  opacity:0;transform:translateY(8px);transition:opacity .18s ease,transform .18s ease}
.tost.geldi{opacity:1;transform:none}
.tost.gidiyor{opacity:0;transform:translateY(6px)}
.tost.ok{border-left-color:var(--ok)}
.tost.err{border-left-color:var(--crit)}
.tost.warn{border-left-color:var(--warn)}
.tost-g{flex:1;min-width:0;overflow-wrap:anywhere}
.tost-k{flex:none;background:transparent;border:0;color:var(--muted);font:inherit;font-size:16px;
  line-height:1;padding:2px 4px;margin:-2px -2px 0 0;border-radius:6px;cursor:pointer}
.tost-k:hover{background:var(--surface-2);color:var(--ink)}
@media (max-width:640px){
  .tost-alan{left:12px;right:12px;bottom:12px;max-width:none;align-items:stretch}
}

/* ---- Modal -------------------------------------------------------
   <dialog> odak tuzağını ve Esc'i kendisi yapıyor; buradaki iş
   yalnız görünüm. Kart diliyle aynı: başlık şeridi, gövde, alt şerit. */
dialog.mdl{border:0;padding:0;background:var(--surface);color:var(--ink);border-radius:var(--r);
  width:min(560px,calc(100vw - 32px));max-height:min(86vh,860px);
  box-shadow:0 24px 60px -24px rgba(0,0,0,.45),0 2px 6px rgba(0,0,0,.06);
  font:15px/1.55 var(--f-sans);overflow:hidden}
dialog.mdl.mdl-dar{width:min(420px,calc(100vw - 32px))}
dialog.mdl.mdl-genis{width:min(760px,calc(100vw - 32px))}
dialog.mdl::backdrop{background:rgba(22,21,15,.34);backdrop-filter:blur(1.5px)}
dialog.mdl[open]{display:flex;flex-direction:column;animation:mdl-gel .14s ease}
@keyframes mdl-gel{from{opacity:0;transform:translateY(6px) scale(.99)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  dialog.mdl[open]{animation:none}
  .tost{transition:none}
}
.mdl-h{display:flex;align-items:flex-start;gap:12px;padding:15px 18px;border-bottom:1px solid var(--line);flex:none}
.mdl-h h3{font-size:16px;letter-spacing:-.01em}
.mdl-h .mdl-alt{font-size:12.5px;color:var(--muted);margin-top:2px}
.mdl-kapa{flex:none;background:transparent;border:0;color:var(--muted);font:inherit;font-size:19px;
  line-height:1;padding:3px 7px;margin:-3px -5px 0 auto;border-radius:8px;cursor:pointer}
.mdl-kapa:hover{background:var(--surface-2);color:var(--ink)}
.mdl-b{padding:18px;overflow:auto;flex:1}
.mdl-b > :first-child{margin-top:0}
.mdl-f{display:flex;align-items:center;gap:9px;justify-content:flex-end;flex-wrap:wrap;
  padding:13px 18px;border-top:1px solid var(--line);background:var(--surface-2);flex:none}
.mdl-f .sol{margin-right:auto;font-size:12.5px;color:var(--muted)}
@media (max-width:640px){
  dialog.mdl{width:calc(100vw - 20px);max-height:88vh}
  .mdl-f .btn{flex:1;justify-content:center}
  .mdl-f .sol{width:100%;margin:0 0 4px}
}

/* Gönderim sürerken düğme kilitlenir — çift POST'u ekranda da göster. */
button.bekliyor{opacity:.55;cursor:progress}

/* ---- Komut paleti ------------------------------------------------
   Ctrl+K. Laboratuvarda en sık yapılan iş elindeki cihazın kaydını
   bulmak; üç tık ve bir sayfa yüklemesi yerine tek kutu. */
dialog.kpal{border:0;padding:0;background:var(--surface);border-radius:var(--r);
  width:min(620px,calc(100vw - 28px));max-height:min(70vh,560px);
  margin-top:11vh;font:15px/1.55 var(--f-sans);color:var(--ink);overflow:hidden;
  box-shadow:0 28px 70px -26px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.06)}
dialog.kpal::backdrop{background:rgba(22,21,15,.34);backdrop-filter:blur(1.5px)}
dialog.kpal[open]{display:flex;flex-direction:column}
.kpal-ust{padding:6px;border-bottom:1px solid var(--line);flex:none}
.kpal-giris{border:0;padding:11px 12px;font-size:15.5px;background:transparent}
.kpal-giris:focus{outline:0}
.kpal-sonuc{overflow:auto;flex:1;padding:6px}
.kpal-grup{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
  padding:9px 10px 5px}
.kpal-s{display:flex;align-items:baseline;gap:10px;padding:8px 10px;border-radius:9px;cursor:pointer}
.kpal-s.secili{background:var(--surface-2)}
.kpal-no{flex:none;font-weight:600;color:var(--ink)}
.kpal-ad{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.kpal-yan{flex:none;font-size:12px;color:var(--muted);max-width:42%;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.kpal-bos{padding:16px 10px;color:var(--muted);font-size:13.5px}
.kpal-alt{display:flex;gap:16px;padding:9px 14px;border-top:1px solid var(--line);
  background:var(--surface-2);font-size:11.5px;color:var(--muted);flex:none}
@media (max-width:640px){
  dialog.kpal{margin-top:6vh;width:calc(100vw - 20px)}
  .kpal-alt{display:none}
  .kpal-yan{display:none}
}

/* ---- Klavye rozeti ---------------------------------------------- */
.kbd{display:inline-block;min-width:18px;padding:1px 5px;border:1px solid var(--line);
  border-bottom-width:2px;border-radius:5px;background:var(--surface);
  font-family:var(--f-mono);font-size:11px;line-height:1.5;color:var(--ink-2);text-align:center}

/* Kısayol yardımı — ? tuşu */
.ks-liste{display:grid;grid-template-columns:auto 1fr;gap:9px 14px;align-items:baseline;font-size:13.5px}
.ks-liste dt{text-align:right;white-space:nowrap}
.ks-liste dd{margin:0;color:var(--ink-2)}
.ks-grup{grid-column:1/-1;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);margin-top:8px}
.ks-grup:first-child{margin-top:0}

/* ---- Sıralanabilir sütun başlığı ---------------------------------
   Sıralama sunucuda yapılır. İstemcide sıralamak yalnız o sayfadaki
   30 kaydı sıralar; "en eski vaka" sorusunun cevabı 7. sayfadaysa
   yanlış cevap verirdi. */
th.sir{padding:0}
th.sir > a{display:flex;align-items:center;gap:5px;padding:10px 18px;text-decoration:none;
  color:var(--muted);white-space:nowrap}
th.sir > a:hover{color:var(--ink);background:var(--surface-2)}
th.sir .ok{font-size:9px;line-height:1;opacity:0;transition:opacity .1s}
th.sir > a:hover .ok{opacity:.45}
th.sir.acik > a{color:var(--ink);font-weight:600}
th.sir.acik .ok{opacity:1}

/* ---- Filtre şeridi ----------------------------------------------- */
.filtre{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.filtre label{margin-bottom:4px}
.filtre .alan{display:flex;flex-direction:column}
.filtre input[type=date]{width:auto;min-width:142px;padding:7px 10px;font-size:13.5px}
.hiz{display:inline-flex;gap:2px;background:var(--surface-2);border-radius:999px;padding:3px;flex-wrap:wrap}
.hiz a{padding:5px 11px;border-radius:999px;font-size:12.5px;text-decoration:none;color:var(--ink-2)}
.hiz a:hover{color:var(--ink)}
.hiz a.on{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.06)}
/* Çipin içindeki kaldırma haçı */
.chip a.at{text-decoration:none;color:var(--muted);font-size:13px;line-height:1;margin-left:1px}
.chip a.at:hover{color:var(--crit)}
@media (max-width:640px){
  .filtre{gap:8px}
  .filtre .alan{flex:1;min-width:140px}
  .filtre input[type=date]{width:100%;min-width:0}
}

/* Yazdırmada etkileşim katmanının hiçbiri kâğıda gitmez. */
@media print{
  .tost-alan,dialog.mdl,dialog.kpal,.filtre,.kbd{display:none!important}
  th.sir > a{padding:10px 0;color:var(--muted)}
  th.sir .ok{display:none}
}

/* Kart altı işlem şeridi — durumu değiştiren düğmeler, durumun yazdığı yerde. */
.islem-serit{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:12px 18px;border-top:1px solid var(--line);background:var(--surface-2)}
.islem-serit .sol{margin-right:auto;font-size:13px;color:var(--muted)}
.islem-serit .sol b{color:var(--ink);font-weight:600}
@media (max-width:640px){
  .islem-serit{padding:11px 14px}
  .islem-serit .sol{width:100%;margin:0 0 4px}
  .islem-serit .btn{flex:1;justify-content:center}
}

/* Merdiven şeridi — teslim alınmayan cihaz programının sabit adımları.
   .step yeşil/turuncu "tamamlandı/şimdi" anlamı taşır; burada anlam
   farklı: adım ilerledikçe iş ağırlaşır. İki ayrı sınıf, iki ayrı anlam. */
.step.uyari{border-color:var(--warn)}
.step.kritik{border-color:var(--crit)}
.step span{display:block}

/* ------------------------------------------------------------------
   Taşan tablo (15.09.2026)
   .card'ın overflow:hidden'ı sığmayan tabloyu KIRPIYORDU: son sütun
   ekranın dışında kalıyor ve bunu söyleyen hiçbir işaret olmuyordu —
   "Sıradaki adım" ve "Hatırlat" böyle kayboldu. Kaydırma çubuğu en
   azından "devamı var" der. Çözüm dar ekran çözümü değil, kırpmanın
   sessizliğine karşı.
   ------------------------------------------------------------------ */
.card:has(> table){overflow-x:auto;overflow-y:hidden}
.card-b:has(> table){overflow-x:auto}

/* Izgara hücresi, içindekinin en dar hâli kadar genişleyebiliyordu
   (grid item'ın varsayılan min-width:auto'su); sütunu taşırıp sayfayı
   yatay kaydırıyordu. Artık taşan şey kendi kutusunda kayar. */
.main{min-width:0}

@media print{
  /* Kâğıtta kaydırma diye bir şey yok — kırpma da olmasın. */
  .card:has(> table),.card-b:has(> table){overflow:visible}
}

/* Sekme çubuğu çok öğeliyken sarsın (ayarlar: yedi sekme). */
.tabs.genis{display:flex;flex-wrap:wrap}
/* Gizlenen panel her durumda gizli kalsın — .card gibi sınıflar ezmesin. */
[hidden]{display:none!important}


/* KABUL FORMU - TEK SAYFA. Asil cozum blade tarafinda (Takip bolumu
   Aksesuar'in onune alindi, sutunlar 192/184 mm'de dengeleniyor);
   buradaki sikistirma onun ustune 10 mm daha kazandiriyor.
   Olcum: toplam 263 mm, A4'un yazilabilir yuksekligi 277 mm. */
@media print{
  .sheet.tek .lh{padding-bottom:8px;margin-bottom:10px}
  .sheet.tek > .sec{padding-bottom:5px;margin-bottom:5px}
  .sheet.tek table.dt td{padding:2px 0}
  .sheet.tek .box{margin-top:6px;padding:8px 11px;line-height:1.4}
  .sheet.tek .kosul-ozet{line-height:1.4}
  .sheet.tek .sig{margin-top:10px}
  .sheet.tek .sig u{height:23px}
  .sheet.tek [style*="line-height:1.75"]{line-height:1.6!important}
}


/* ------------------------------------------------------------------
   LABORATUVAR İŞ EMRİ (A5)

   Adlandirilmis sayfa: dosyadaki @page kurallari tek tanima birikiyor
   ve sonuncusu kazaniyor. Etiketlerde yasanan sorunun aynisi — is emri
   de A4 basilip A5'e kuculuyordu.

   Ekranda A5 GENISLIGINDE gosteriliyor (148mm): yazdirmadan once
   tasan bir satir varsa ekranda da tasar. Onizlemenin gercekten
   onizleme olmasi, basilan kagitla ayni genislikte olmasina bagli. */
@page belge-a5{size:A5 portrait;margin:9mm}

.sheet.a5{page:belge-a5;width:130mm;max-width:130mm;padding:0;
  font-size:10px;line-height:1.35;color:#111;background:#fff;
  margin:0 auto 24px;padding:9mm;border-radius:6px}

.sheet.a5 .ie-ust{display:flex;justify-content:space-between;align-items:flex-start;
  gap:8px;border-bottom:1.5px solid #111;padding-bottom:6px}
.sheet.a5 .ie-no{font-size:19px;font-weight:700;letter-spacing:-.01em;line-height:1.05}
.sheet.a5 .ie-kimlik{font-size:11px;font-weight:600;margin-top:3px}
.sheet.a5 .ie-ufak{font-size:9px;color:#555;margin-top:2px;line-height:1.4}
.sheet.a5 .ie-kare{flex:none;width:19mm;height:19mm;line-height:0}
.sheet.a5 .ie-kare svg{width:100%;height:100%}

.sheet.a5 .ie-bayrak{margin-top:6px}

/* Panelin .mono kurali 13px sabit; A5'te satir icinde devlesiyor ve
   "4 TB" ile telefon numarasi kendi satirindan tasiyordu. Burada
   tek-aralikli yazi tipi KORUNUR (seri no ve numara okunurlugu icin),
   punto satirdan devralinir. Numaranin kendisi ayrica buyuk. */
.sheet.a5 .mono{font-size:inherit;letter-spacing:0}
.sheet.a5 .ie-no.mono{font-size:19px}

.sheet.a5 .ie-blok{margin-top:5px;padding-top:4px;border-top:1px solid #e2e2dc}
.sheet.a5 .ie-blok:first-of-type{border-top:0}
.sheet.a5 .ie-baslik{font-size:8.5px;letter-spacing:.09em;text-transform:uppercase;
  color:#666;font-weight:700;margin-bottom:3px}
.sheet.a5 .ie-metin{font-size:10.5px;line-height:1.45}

.sheet.a5 table.ie-dt{width:100%;border-collapse:collapse}
.sheet.a5 table.ie-dt td{padding:1.5px 0;font-size:10px;vertical-align:top}
.sheet.a5 table.ie-dt td:nth-child(odd){color:#666;width:20%;padding-right:6px}

/* Oncelikli veri: kagitta gozle bulunan tek kutu. Teknisyen once
   buraya bakiyor, sonuc tartismasi da bu cumle uzerinden yuruyor. */
.sheet.a5 .ie-vurgu{border:1.2px solid #111;border-radius:5px;padding:5px 7px;margin-top:7px}
.sheet.a5 .ie-vurgu .ie-baslik{margin-bottom:2px}

/* Ariza tipi kutucuklari: on teshis panele girilmemisse tezgahta
   isaretlenir. Yazmak yerine isaretlemek, aceleyi atlamaya degil
   kaydetmeye cevirir. */
.sheet.a5 .ie-kutucuk{display:flex;flex-wrap:wrap;gap:2px 9px;font-size:9px;margin:3px 0 2px}
.sheet.a5 .ie-kutucuk span{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.sheet.a5 .ie-kare-kutu{width:8px;height:8px;border:1px solid #666;border-radius:2px;display:inline-block}

.sheet.a5 .ie-dip{margin-top:6px;padding-top:4px;border-top:1px solid #e2e2dc;
  font-size:8px;color:#777;line-height:1.4}

@media print{
  .sheet.a5{width:auto;max-width:none;padding:0;margin:0;border-radius:0;box-shadow:none}
  .sheet.a5 .ie-blok{break-inside:avoid}
}


/* ------------------------------------------------------------------
   KARGO ETIKETI — musteri yazdirir, keser, kutuya yapistirir.

   A4'e basiliyor: musterinin evinde A6 etiket kagidi yok. Etiket ust
   yariya, paketleme uyarilari alta; arada kesik cizgisi. Ekranda da
   ayni yerlesim gorunuyor ki basmadan once ne cikacagi belli olsun. */
@page belge-a4-etiket{size:A4 portrait;margin:14mm}

.kargo-sayfa{page:belge-a4-etiket;max-width:620px;margin:0 auto 28px}

.kargo-etiket{border:2px solid #111;border-radius:6px;padding:16px 18px;background:#fff;color:#111}
.kargo-etiket .ke-ust{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.kargo-etiket .ke-lbl{font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:#666;margin-bottom:3px}
.kargo-etiket .ke-alici{font-size:17px;font-weight:700;line-height:1.25;max-width:30ch}
.kargo-etiket .ke-kare{flex:none;width:24mm;height:24mm;line-height:0}
.kargo-etiket .ke-kare svg{width:100%;height:100%;display:block}
.kargo-etiket .ke-adres{margin-top:9px;font-size:15px;line-height:1.5}

/* Numara etiketin en buyuk ogesi: kabul masasinda okunan sey bu. */
.kargo-etiket .ke-no{margin-top:13px;padding:9px 12px;border:1.6px solid #111;border-radius:5px}
.kargo-etiket .ke-no-metin{font-size:27px;font-weight:700;letter-spacing:.02em;line-height:1.05}

.kargo-etiket .ke-gonderen{margin-top:12px;padding-top:10px;border-top:1px dashed #bbb;font-size:13.5px;line-height:1.5}
.kargo-etiket .ke-not{margin-top:9px;font-size:12px;color:#555}

.kargo-kesik{position:relative;text-align:center;margin:18px 0;border-top:1.5px dashed #999}
.kargo-kesik span{position:relative;top:-9px;background:var(--yuzey,#fff);padding:0 10px;
  font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#999}

.kargo-bilgi h2{font-size:15px;margin:0 0 9px}
.kargo-bilgi ul{margin:0;padding-left:19px;line-height:1.7;font-size:13.5px}
.kargo-bilgi li{margin-bottom:4px}
.kargo-dip{margin:12px 0 0;font-size:13px;line-height:1.6;color:#444}

@media print{
  .kargo-sayfa{max-width:none;margin:0}
  .kargo-etiket{break-inside:avoid}
  .kargo-kesik span{background:#fff}
}


/* Sevk irsaliyesi — taraf kutulari ve kalem tablosu. */
.sheet.tek table.dt.irs-taraf td{border-bottom:0;padding:0;font-size:12px;line-height:1.55}
.sheet.tek .irs-rol{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:#666;margin-bottom:4px}
.sheet.tek table.dt.irs-kalem th{font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  color:#666;text-align:left;font-weight:600;padding:0 0 4px;border-bottom:1px solid #ccc}
.sheet.tek table.dt.irs-kalem td{font-size:12px}
.sheet.tek table.dt.irs-kalem td:first-child{width:auto;color:#111}
.sheet.tek table.dt.irs-kalem .sag{text-align:right;white-space:nowrap}
.sheet.tek .irs-not{margin-top:10px;padding:9px 12px;border:1px solid #111;border-radius:5px;
  font-size:11.5px;line-height:1.55}


/* ------------------------------------------------------------------
   PORTAL — musteri tarafi okunabilirligi.

   Etiketler panelde 12.5px ve --muted (#7c7a6e). Arka planla kontrasti
   4.0:1 cikiyor; kucuk metin icin esik 4.5:1. Panelde bu sorun degil:
   ekip ekrani taniyor ve alan adlarini ezbere biliyor. Portalde ise
   etiket okunmuyorsa alan da doldurulmuyor.

   Punto ve renk birlikte artiyor. Yalniz punto buyutmek soluklugu,
   yalniz renk koyultmak kucuklugu birakirdi. */
body.portal label{font-size:13.5px;font-weight:600;color:var(--ink-2);margin-bottom:6px}
body.portal label .birim{font-weight:400;color:#5f5d52;font-size:12px}

/* Ipucu satirlari da koyuldu: aciklama okunmuyorsa yok sayilir. */
body.portal .hint{color:#5f5d52;font-size:12.5px;line-height:1.55}
body.portal .sub{color:#5f5d52}


/* Alanlarin kendisi de bir tik buyuk: telefonda 16px altindaki girdi
   iOS'ta sayfayi otomatik yakinlastiriyor ve yerlesim kayiyor. */
body.portal input,
body.portal select,
body.portal textarea{font-size:16px}

body.portal .checks label{font-size:14px;color:var(--ink-2)}