/* azatech – BELGE ve SİSTEM EKRANLARI stilleri (satış onay formu belgesi, belge metinleri, sözleşme hesapları)
 * Yeni dosya: yalnız .bf-* (basılan belge), .bm-* (belge metinleri) ve .sh-* (sözleşme hesapları) sınıfları. kutu.css bileşenlerini (.kutu, .kutu-bas, .btn-satir) kullanır, değiştirmez.
 * Belge bölümü kâğıt gibi sabit renklidir (beyaz zemin, lacivert vurgu); ekranda (.bm-, .sh-) tema değişkenleri kullanılır. */

/* =========================================================================
   1) SATIŞ ONAY FORMU — A4 yatay (1122 x 794 px), tek sayfa (imzalar altta)
   ========================================================================= */
.pg.bf { width: 1122px; height: 794px; box-sizing: border-box; padding: 20px 34px 16px; display: flex; flex-direction: column; gap: 9px;
  font-family: "Segoe UI", Calibri, Carlito, Arial, sans-serif; color: #1c2230; background: #fff; }
.pg.bf * { box-sizing: border-box; }
.bf-h { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 18px; padding-bottom: 10px; border-bottom: 2px solid var(--navy, #1b2559); flex: none; }
.bf-h img { height: 46px; display: block; }
.bf-ttl span { display: block; font-size: 10.5px; letter-spacing: .16em; color: #6b7280; font-weight: 600; text-transform: uppercase; }
.bf-ttl h1, .bf-ttl .bf-baslik { font-weight: 700; margin: 2px 0 0; font-size: 22px; letter-spacing: .08em; color: var(--navy, #1b2559); line-height: 1.15; }
.bf-meta { margin: 0; display: grid; grid-template-columns: repeat(4, auto); gap: 0 18px; font-size: 10.5px; }
.bf-meta > div { display: block; }
.bf-meta dt { color: #6b7280; margin: 0 0 1px; }
.bf-meta dd { margin: 0; font-weight: 650; color: #1c2230; white-space: nowrap; }
.bf-durum { font-size: 11px; font-weight: 650; padding: 4px 11px; border-radius: 999px; background: #eef0f6; color: #3b4258; white-space: nowrap; }
.bf-durum.d-onaylandi { background: #e3f4ea; color: #12703d; }
.bf-durum.d-bekliyor { background: #fdf1d8; color: #8a5a00; }
.bf-durum.d-reddedildi, .bf-durum.d-iptal { background: #fbe4e1; color: #a3281c; }

/* özet şeridi: dört büyük rakam */
.bf-ozet { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; flex: none; }
.bf-o { border: 1px solid #e3e6ee; border-radius: 10px; padding: 9px 13px 10px; background: #fff; min-width: 0; }
.bf-o small { display: block; font-size: 10.5px; font-weight: 600; color: #6b7280; line-height: 1.3; min-height: 27px; }
.bf-o b { display: block; font-size: 21px; font-weight: 700; color: var(--navy, #1b2559); line-height: 1.2; margin-top: 1px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.bf-o b.bos { color: #9aa1b2; }
.bf-o span { display: block; font-size: 10.5px; color: #6b7280; margin-top: 1px; }

/* kartlar */
.bf-kart { border: 1px solid #e3e6ee; border-radius: 10px; padding: 9px 13px 10px; background: #fff; min-width: 0; }
.bf-kart > h3 { margin: 0 0 7px; font-size: 10.5px; letter-spacing: .09em; text-transform: uppercase; color: var(--navy, #1b2559); font-weight: 700; }
.bf-uc { display: grid; grid-template-columns: 1.15fr .9fr 1.25fr; gap: 10px; flex: none; }
.bf-uc .bf-kart { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; align-content: start; }
.bf-uc .bf-kart > h3 { grid-column: 1 / -1; margin-bottom: 1px; }
.bf-a { min-width: 0; }
.bf-a.bf-uzun { grid-column: 1 / -1; }
.bf-a span { display: block; font-size: 10px; color: #6b7280; line-height: 1.25; }
.bf-a span small { display: block; font-size: 9.5px; color: #8a91a3; }
.bf-a b { display: block; font-size: 12.5px; font-weight: 650; color: #1c2230; line-height: 1.25; overflow-wrap: anywhere; }
.bf-a.k b { color: #a3281c; }
.bf-a.g b { color: #12703d; }
.bf-a.bf-uzun b { font-size: 13px; }

/* fiyat tabloları */
.bf-tablo { padding: 8px 0 0; overflow: hidden; flex: none; }
.bf-tablo > h3 { padding: 0 13px; margin-bottom: 5px; }
.bf-t { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 11px; }
.bf-t th, .bf-t td { padding: 4px 6px; text-align: right; border-top: 1px solid #edeff5; font-variant-numeric: tabular-nums; }
.bf-t thead th { background: #f4f5f9; color: #4b5266; font-weight: 600; font-size: 9.5px; line-height: 1.2; vertical-align: bottom; border-top: 0; padding: 5px 6px; }
.bf-t thead th small { display: block; font-weight: 400; color: #8a91a3; }
.bf-t th:first-child, .bf-t td:first-child { text-align: left; width: 15%; padding-left: 13px; }
.bf-t tbody th { font-weight: 650; font-size: 10.5px; color: #3b4258; background: #fff; }
.bf-t tbody th .so { color: #8a91a3; font-weight: 500; }
.bf-t tbody td { color: #2b3243; }
.bf-t tr.on th, .bf-t tr.on td { background: #eef1fb; color: var(--navy, #1b2559); font-weight: 700; }
.bf-tablo.b1 > h3::before, .bf-tablo.b2 > h3::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 7px; background: var(--navy, #1b2559); }
.bf-tablo.b2 > h3::before { background: #9aa6d6; }

/* 2. sayfa: notlar, imzalar */
.bf-s2 { gap: 11px; }
.bf-not p { margin: 0; font-size: 12px; line-height: 1.5; color: #2b3243; min-height: 34px; overflow-wrap: anywhere; }
.bf-not p i { color: #9aa1b2; }
.bf-grup { break-inside: avoid; page-break-inside: avoid; flex: none; }
.bf-p.bf-not, p.bf-not { margin: 0; font-size: 10.5px; line-height: 1.35; color: #2b3243; flex: none; overflow-wrap: anywhere; max-height: 28px; overflow: hidden; }
.bf-alt { margin: auto 0 0; font-size: 10.5px; color: #6b7280; flex: none; }

/* ekranda (ölçekli önizleme): kaydırma yok, sayfalar arası boşluk */
.sfstage .vsc { margin-top: 14px; }

/* yazdırma: renkleri koru; imza blokları bölünmesin */
@media print {
  .bl-imza { break-inside: avoid; }
  .pg.bf, .pg.bf * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* =========================================================================
   2) SİSTEM > BELGE METİNLERİ (.bm-*): sol grup listesi, sağda metin kutuları, altta yapışkan kaydet çubuğu
   ========================================================================= */
.bm-duzen { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: var(--b-4, 16px); align-items: start; }
.bm-liste { padding: 8px; display: flex; flex-direction: column; gap: 2px; position: sticky; top: 8px; }
.bm-g { all: unset; box-sizing: border-box; cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: 0 6px; align-items: center; padding: 9px 10px; border-radius: var(--r-md, 8px); font-size: 13px; font-weight: 600; color: var(--ink); }
.bm-g small { grid-column: 1; font-weight: 400; color: var(--mut); font-size: 11.5px; }
.bm-g .bm-r { grid-row: 1 / span 2; grid-column: 2; }
.bm-g:hover { background: color-mix(in srgb, var(--navy) 6%, transparent); }
.bm-g.on { background: color-mix(in srgb, var(--navy) 10%, transparent); color: var(--navy); }
.bm-g:focus-visible { outline: 2px solid var(--navy); outline-offset: 1px; }
.bm-sag { display: flex; flex-direction: column; gap: var(--b-3, 12px); min-width: 0; }
.bm-sag .kutu + .kutu { margin-top: 0; }
.bm-metin textarea { display: block; width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-md, 8px); font: inherit; line-height: 1.5; resize: vertical; background: var(--panel); color: var(--ink); }
.bm-metin textarea:focus { outline: 2px solid color-mix(in srgb, var(--navy) 40%, transparent); border-color: var(--navy); }
.bm-r { font-style: normal; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; background: color-mix(in srgb, var(--mut) 12%, transparent); color: var(--mut); white-space: nowrap; }
.bm-r.oz { background: color-mix(in srgb, var(--navy) 12%, transparent); color: var(--navy); }
.bm-r.kr { background: #fdf1d8; color: #8a5a00; }
.bm-anahtar { font-size: 11.5px; color: var(--mut); background: color-mix(in srgb, var(--mut) 10%, transparent); padding: 2px 7px; border-radius: 6px; }
.bm-rozet { display: inline-block; font-size: 11px; font-weight: 700; font-family: ui-monospace, monospace; padding: 1px 7px; border-radius: 6px; background: #fdf1d8; color: #8a5a00; border: 1px solid #f0d9a4; }
.bm-deg { margin: 0 0 8px; font-size: 12.5px; color: var(--mut); }
.bm-onizle { margin: 10px 0 8px; padding: 10px 12px; border-radius: var(--r-md, 8px); background: color-mix(in srgb, var(--mut) 7%, transparent); }
.bm-onizle small { display: block; font-size: 11px; font-weight: 600; color: var(--mut); margin-bottom: 2px; }
.bm-onizle p { margin: 0; font-size: 13px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.bm-bar { position: sticky; bottom: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: var(--b-3, 12px); padding: 10px 16px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-lg, 12px); box-shadow: var(--g-2, 0 4px 14px rgba(0,0,0,.1)); font-size: 13px; color: var(--mut); }
.bm-bar.acik { border-color: var(--navy); color: var(--ink); }
@media (max-width: 800px) { .bm-duzen { grid-template-columns: 1fr; } .bm-liste { position: static; flex-direction: row; overflow-x: auto; } .bm-g { flex: none; min-width: 170px; } }

/* =========================================================================
   3) SÖZLEŞME HESAP BİLGİLERİ (.sh-*): para birimine göre kartlar
   ========================================================================= */
.sh-form-kok { display: flex; flex-direction: column; gap: var(--b-3, 12px); }
.sh-form-kok .kutu + .kutu { margin-top: 0; }
.sh-baslik { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sh-baslik h3 { margin: 0; }
.sz-baslik { display: flex; align-items: center; gap: 10px; min-width: 0; }   /* eski sohbet .sh-baslik (alt çizgi + dolgu) ile çakışmasın diye ayrı ad */
.sz-baslik h3 { margin: 0; border: 0; padding: 0; }
.sh-para { display: inline-grid; place-items: center; min-width: 46px; height: 28px; padding: 0 9px; border-radius: 8px; font-size: 13px; font-weight: 800; letter-spacing: .04em; color: #fff; background: var(--navy); }
.sh-para.p-USD { background: #1a7f4b; } .sh-para.p-EUR { background: #2b5bd7; } .sh-para.p-AZN { background: #b5551c; }
.sh-d { font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; white-space: nowrap; background: color-mix(in srgb, var(--mut) 12%, transparent); color: var(--mut); }
.sh-d.iyi { background: #e3f4ea; color: #12703d; } .sh-d.gizli { background: #fdf1d8; color: #8a5a00; } .sh-d.ana { background: color-mix(in srgb, var(--navy) 12%, transparent); color: var(--navy); }
.sh-ozet { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px 20px; }
.sh-s { min-width: 0; }
.sh-s dt { font-size: 11.5px; font-weight: 600; color: var(--mut); margin-bottom: 2px; }
.sh-s dd { margin: 0; font-size: 14px; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.sh-s dd.bos { font-weight: 400; font-style: italic; color: var(--mut); }
.sh-s code { font-size: 13.5px; letter-spacing: .03em; }
.sh-kopya { margin-left: 8px; font-size: 12px; }
.sh-form { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.sh-form .chk { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-weight: 600; }
.sh-alt { justify-content: flex-end; }
.sh-baslik h3, .bm-metin .kutu-bas h3 { border: 0; padding: 0; }

/* ======== Sade kurumsal tasarım: satış onay formu, vade maliyeti, müşteri ödeme planı (3 sayfa, ortak dil) ========
   Yalnız panelin ana rengi (--navy) ve nötr griler; vurgu = ana rengin açık tonu. Yazılar okunur boyutta (en az 11 px). */
.pg.bf, .pg.vm, .pg.op { --k: var(--navy, #1b2559); --k-acik: #eef0f8; --k-orta: #dfe3f1;   /* düz renk: PDF üretimi (html2canvas) color-mix()/color() desteklemez */ --cizgi: #dfe3ec; --yazi: #1c2230; --sol: #5b6475;
  position: relative; font-family: "Segoe UI", Calibri, Carlito, Arial, sans-serif; color: var(--yazi); background: #fff; overflow: hidden; }
.pg.bf::before, .pg.vm::before, .pg.op::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: var(--k); }
.pg.bf { padding: 24px 34px 16px; gap: 11px; }
.pg.vm { padding: 26px 34px 16px; gap: 10px; }
.pg.op { padding: 40px 50px 34px; gap: 14px; }

.pg.bf .bf-h, .pg.vm .vm-h, .pg.op .op-h { border: 0; border-bottom: 1px solid var(--cizgi); padding-bottom: 11px; }
.pg.bf .bf-ttl span { color: var(--sol); font-size: 11px; font-weight: 600; letter-spacing: .14em; }
.pg.bf .bf-baslik, .pg.vm .vm-tt h1, .pg.op .op-h h1 { color: var(--k); font-weight: 700; letter-spacing: .04em; font-size: 23px; margin: 2px 0 0; }
.pg.vm .vm-tt span, .pg.op .op-h span { color: var(--sol); font-size: 12px; }
.pg.bf .bf-meta dt, .pg.vm .vm-id dt { color: var(--sol); font-size: 11px; text-transform: none; letter-spacing: 0; font-weight: 500; }
.pg.bf .bf-meta dd, .pg.vm .vm-id dd { color: var(--yazi); font-weight: 650; font-size: 12px; }
.pg.bf .bf-durum { background: var(--k-acik); color: var(--k); font-weight: 650; }
.pg.bf .bf-durum.d-onaylandi { background: #e3f4ea; color: #12703d; }
.pg.bf .bf-durum.d-bekliyor { background: #fdf1d8; color: #8a5a00; }
.pg.bf .bf-durum.d-reddedildi, .pg.bf .bf-durum.d-iptal { background: #fbe4e1; color: #a3281c; }

/* sayfa 1 */
.pg.bf .bf-ozet { gap: 10px; }
.pg.bf .bf-o { border: 1px solid var(--cizgi); border-radius: 8px; padding: 10px 14px 11px; background: #fff; }
.pg.bf .bf-o small { color: var(--sol); font-weight: 600; font-size: 11px; min-height: 0; margin-bottom: 3px; }
.pg.bf .bf-o b { font-size: 24px; color: var(--k); margin-top: 1px; }
.pg.bf .bf-o span { color: var(--sol); font-size: 11px; margin-top: 2px; }
.pg.bf .bf-kart { border: 1px solid var(--cizgi); border-radius: 8px; padding: 11px 15px 12px; }
.pg.bf .bf-kart > h3 { color: var(--k); font-size: 11px; font-weight: 700; letter-spacing: .1em; margin-bottom: 6px; }
.pg.bf .bf-uc { gap: 10px; }
.pg.bf .bf-uc .bf-kart { gap: 8px 16px; }
.pg.bf .bf-a span { color: var(--sol); font-size: 11px; font-weight: 500; }
.pg.bf .bf-a span small { font-size: 11px; color: var(--sol); }
.pg.bf .bf-a b { color: var(--yazi); font-size: 13.5px; font-weight: 650; }
.pg.bf .bf-a.k b, .pg.bf .bf-a.g b { color: var(--k); }
.pg.bf .bf-a.bf-uzun b { font-size: 14.5px; }
.pg.bf .bf-tablo { padding: 11px 0 0; }
.pg.bf .bf-tablo > h3 { padding: 0 15px; margin-bottom: 7px; }
.pg.bf .bf-t { font-size: 12px; }
.pg.bf .bf-t thead th { background: var(--k-acik); color: var(--k); font-size: 11px; font-weight: 650; text-transform: none; letter-spacing: 0; padding: 7px 8px; border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); }
.pg.bf .bf-t thead th small { color: var(--sol); font-size: 11px; }
.pg.bf .bf-t th, .pg.bf .bf-t td { padding: 8px; border-top: 1px solid #eceff5; }
.pg.bf .bf-t tr.on th, .pg.bf .bf-t tr.on td { background: var(--k-acik); color: var(--k); font-weight: 700; }
.pg.bf .bf-t tbody th .so { color: var(--sol); }
.pg.bf .bf-not { color: var(--sol); font-size: 11.5px; }
.pg.bf .bf-alt { margin: 0; color: var(--sol); font-size: 11px; }

/* sayfa 2: vade maliyeti */
.pg.vm .vm-body { gap: 16px; grid-template-columns: 300px minmax(0, 1fr); overflow: hidden; }
.pg.vm .vm-side { gap: 9px; }
.pg.vm .vm-card, .pg.vm .vm-card.tz { background: #fff; border: 1px solid var(--cizgi); border-radius: 8px; padding: 8px 13px 6px; }
.pg.vm .vm-card h3 { color: var(--k); font-size: 11px; font-weight: 700; letter-spacing: .1em; margin-bottom: 4px; }
.pg.vm .vm-card > div { border-bottom: 1px solid #eceff5; padding: 3px 0; font-size: 11.5px; line-height: 1.25; }
.pg.vm .vm-card > div span { color: var(--sol); }
.pg.vm .vm-card > div b { color: var(--yazi); font-weight: 650; }
.pg.vm .vm-card > div b small { color: var(--sol); font-size: 11px; }
.pg.vm .vm-card .tot b { color: var(--k); font-size: 12.5px; }
.pg.vm .vm-tables { gap: 12px; }
.pg.vm .vm-t { border: 1px solid var(--cizgi); border-radius: 8px; border-collapse: separate; border-spacing: 0; overflow: hidden; font-size: 11px; }
.pg.vm .vm-t th { background: var(--k-acik); color: var(--k); font-size: 11px; font-weight: 650; text-transform: none; letter-spacing: 0; padding: 6px 8px; border-bottom: 1px solid var(--cizgi); text-align: start; line-height: 1.2; }
.pg.vm .vm-t th.r, .pg.vm .vm-t td.r { text-align: right; }
.pg.vm .vm-t td { padding: 3px 8px; border-bottom: 1px solid #eceff5; background: #fff; color: var(--yazi); line-height: 1.2; }
.pg.vm .vm-t tbody tr:nth-child(even) td { background: #fafbfd; }
.pg.vm .vm-t tr.pes td { background: var(--k-acik) !important; color: var(--k); font-weight: 700; }
.pg.vm .vm-t tr.bal td { background: var(--k-orta) !important; font-weight: 650; }
.pg.vm .vm-t tfoot td { background: var(--k-acik); border-top: 1.5px solid var(--k); border-bottom: 0; color: var(--k); font-weight: 700; padding: 6px 8px; }

/* sayfa 3: müşteri ödeme planı */
.pg.op .op-h img { height: 50px; }
.pg.op .op-info { gap: 10px; }
.pg.op .op-info > div { background: #fff; border: 1px solid var(--cizgi); border-radius: 8px; padding: 9px 14px; }
.pg.op .op-info span { color: var(--sol); font-weight: 600; font-size: 11px; letter-spacing: .04em; text-transform: none; }
.pg.op .op-info b { color: var(--k); font-size: 15px; margin-top: 3px; }
.pg.op .op-info small { color: var(--sol); font-size: 11px; }
.pg.op .op-n { color: var(--sol); font-size: 11.5px; }
.pg.vm .vm-tables { min-width: 0; }
.pg.vm .vm-tables .vm-t { flex: 1 1 0; min-width: 0; }
.pg.vm .vm-tables .vm-t:not(:only-child) th, .pg.vm .vm-tables .vm-t:not(:only-child) td { padding-left: 4px; padding-right: 4px; }
/* 36+ ay: iki tablo yan yana sığsın diye (ara ödeme yoksa) "Toplam ödeme" sütunu (taksitle aynı) gizlenir */
.pg.vm .vm-tables .vm-t:not(:only-child):not(.kisa):not(:has(th:nth-child(6))) :is(th, td):nth-child(4) { display: none; }
.pg.vm .vm-tables .vm-t:not(:only-child) th, .pg.vm .vm-tables .vm-t:not(:only-child) td { padding-left: 3px; padding-right: 3px; }

/* ORTAK İMZA BLOĞU (.bl-imza): üç belge sayfasında aynı görünüm; sayfanın altına yaslı, küçük ve standart boyut */
.bl-imza { margin-top: auto; flex: none; display: grid; grid-template-columns: repeat(var(--bl-n, 2), minmax(0, 1fr)); gap: 22px; border-top: 1px solid var(--cizgi, #dfe3ec); padding-top: 8px; break-inside: avoid; page-break-inside: avoid; }
.bl-k { min-width: 0; }
.bl-k h4 { margin: 0 0 4px; min-height: 14px; font-size: 11px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--sol, #5b6475); line-height: 1.25; }
.bl-il { position: relative; min-height: 34px; margin-bottom: 16px;   /* iki satıra sarılan uzun ad üstteki başlığa binmez: alan sabit, ad alta yaslı */
  border-bottom: 1px solid #5b6475; display: flex; align-items: flex-end; }
.bl-il.bl-im { min-height: 24px; height: 24px; margin-bottom: 10px; }
.bl-il span { display: block; width: 100%; padding-bottom: 2px; font-size: 12px; font-weight: 650; line-height: 1.2; color: var(--yazi, #1c2230); overflow-wrap: anywhere; }
.bl-il span.bos { color: #8a91a3; font-weight: 500; font-style: italic; }
.bl-il i { position: absolute; left: 0; top: calc(100% + 2px); font-size: 11px; font-style: normal; color: var(--sol, #5b6475); }

/* vade maliyeti: "Vade karşılığı iskonto" kutusu, iki satır (etiket üstte, büyük % altta, açıklama en altta), koyu zemin üstüne beyaz yazı */
.pg.vm .vm-card > .vm-key { margin-top: 6px; background: var(--k); border-radius: 8px; padding: 10px 13px; display: flex !important; flex-direction: column; align-items: flex-start; gap: 3px; border: 0; }
.pg.vm .vm-card > .vm-key span { color: #fff !important; font-size: 12px; font-weight: 600; line-height: 1.25; white-space: normal; }
.pg.vm .vm-card > .vm-key b { color: #fff !important; font-size: 26px; font-weight: 700; line-height: 1.1; text-align: left; }
.pg.vm .vm-card > .vm-key small { color: #fff; font-size: 11px; line-height: 1.3; opacity: .9; white-space: normal; }

/* müşteri ödeme planı: tek sayfa, satırlar iki tablo yan yana */
.pg.op { padding: 36px 44px 30px; gap: 12px; }
.pg.op .op-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.pg.op .op-t { width: 100%; table-layout: fixed; border: 1px solid var(--cizgi); border-radius: 8px; border-collapse: separate; border-spacing: 0; overflow: hidden; font-size: 11.5px; font-variant-numeric: tabular-nums; }
.pg.op .op-t th { background: var(--k-acik); color: var(--k); font-size: 11px; font-weight: 650; padding: 6px 5px; border-bottom: 1px solid var(--cizgi); text-align: start; line-height: 1.2; white-space: nowrap; }
.pg.op .op-t th.r, .pg.op .op-t td.r { text-align: right; }
.pg.op .op-t td { padding: 3px 5px; border-bottom: 1px solid #eceff5; color: var(--yazi); line-height: 1.25; white-space: nowrap; overflow: hidden; }
.pg.op .op-t th:nth-child(1), .pg.op .op-t td:nth-child(1) { width: 21%; }
.pg.op .op-t th:nth-child(2), .pg.op .op-t td:nth-child(2) { width: 22%; }
.pg.op .op-t tr.pes td { background: var(--k-acik); color: var(--k); font-weight: 700; }
.pg.op .op-t tr.bal td { background: var(--k-orta); font-weight: 650; }
.pg.op .op-top { display: flex; justify-content: space-between; align-items: center; background: var(--k-acik); border-top: 1.5px solid var(--k); border-radius: 6px; padding: 8px 12px; color: var(--k); font-size: 14px; font-weight: 700; }


/* komisyon: ayrı pay alanları gizliyken görünmesin */
.kom-ayri[hidden] { display: none; }
#fKomAc { margin: 4px 0 6px; font-size: 12px; }

/* Taslak (pazarlık) çıktıları: her sayfaya çapraz, açık gri damga; yalnız .taslak sınıfı olan sayfalarda */
.pg.taslak { position: relative; overflow: hidden; }
.pg.taslak::after { content: 'TASLAK · BAĞLAYICI DEĞİLDİR'; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-28deg);
  white-space: nowrap; font: 800 64px/1 "Segoe UI", Calibri, Arial, sans-serif; letter-spacing: .06em; color: rgba(120, 128, 145, .2);
  pointer-events: none; z-index: 50; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pg.op.taslak::after { font-size: 46px; }
.sf-taslak { margin: 4px 0 12px; display: flex; flex-direction: column; gap: 8px; }
.sf-taslak .ghost { width: 100%; height: auto; min-height: 40px; padding: 9px 12px; line-height: 1.3; }
.sf-taslak .fine { margin: 0; line-height: 1.45; }