/* ==========================================================================
   Pervis — yönetim paneli stilleri
   ========================================================================== */

@font-face {
  font-family: 'Inter';
  src: url('fonts/inter-latin-wght-normal.woff2') format('woff2');
  font-weight: 100 900; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC, U+2122;
}
@font-face {
  font-family: 'Inter';
  src: url('fonts/inter-latin-ext-wght-normal.woff2') format('woff2');
  font-weight: 100 900; font-display: swap;
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB;
}

/* İKİNCİ YAZI TİPİ — ziyaretçi tarafıyla aynı: Source Serif 4.
   Panelde ÇOK DAR kullanılıyor, bilerek: yalnızca ekran başlığı ve
   büyük sayılar. Çalışılan bir arayüzde serif metin okumayı yavaşlatır;
   ama ekranın adı ve rakamı serif olunca panel siteyle aynı yerden
   geliyormuş gibi duruyor — tablo, etiket, düğme Inter kalıyor.
   Dosyalar kendi sunucumuzda; hiçbir dış adrese bağlanılmıyor. */
@font-face {
  font-family: 'Source Serif 4';
  src: url('fonts/source-serif-4-latin-wght-normal.woff2') format('woff2');
  font-weight: 100 900; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC, U+2122;
}
@font-face {
  font-family: 'Source Serif 4';
  src: url('fonts/source-serif-4-latin-ext-wght-normal.woff2') format('woff2');
  font-weight: 100 900; font-display: swap;
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB;
}

:root {
  /* VURGU — eylem. PAKET 605'te YEŞİLDEN MAVİYE döndü ve sebebi
     kullanıcının verdiği tasarım örneği: birincil düğme orada mavi.
     Renk GÖRSELDEN PİKSEL SAYILARAK ölçüldü (#005BFD · düğme dolgusunda
     124 piksel baskın), kontrastı da ölçüldü ve ESKİDEN DAHA İYİ:
     beyaz yazı taşıyan zemin olarak 5.36:1 (eski yeşil 4.69:1).
     brand-600 (üzerine gelince) 7.50:1 · brand-50 zemininde brand
     yazısı 4.85:1 (eski ailede 4.25:1 idi, yani o da iyileşti).
     brand-100 ÜRÜNDE HİÇ ZEMİN DEĞİL, yalnız kenar (ölçüldü) —
     kontrast eşiği onun için sorulmuyor.
     brand-300'ün üründe SIFIR kullanımı var (ölçüldü); değeri yalnız
     skala bütünlüğü için ailesiyle birlikte taşındı. */
  --brand:#005BFD; --brand-600:#0048CC; --brand-300:#7FA9FE;
  --brand-50:#EDF4FE; --brand-100:#D6E4FE;
  /* Mavi — icerik, baslik ve bilgi alanlari.
     ÜRÜN BU AYRIMI BİLEREK YAPMIŞ: yeşil EYLEM, mavi İÇERİK. Düğmeler
     605'te maviye döndüğü için bağlantı mavisi KOYULAŞTIRILDI (7.79:1,
     eskiden 5.40:1) — yoksa düğme ile bağlantı aynı aileden olur ve
     ayrım kaybolurdu. mavi-50 ve mavi-100 görselin bilgi kutusu
     ailesine çekildi; ikisi aynı kuralda yan yana geçiyor
     (.ia-kart--vurgu · .tpl-preview) ve biri soğuk öteki ılık kalsaydı
     kenar yüzeye uymazdı. mavi-950/800/600/300 DEĞİŞMEDİ: koyu yan
     panelin zemini ve başlık renkleri, onlar Faz D'nin konusu. */
  --mavi-950:#0b2239; --mavi-800:#123a5e; --mavi-600:#14456f;
  --mavi:#14558A; --mavi-300:#7fc0ea; --mavi-50:#EBF3FE; --mavi-100:#D3E3FC;
  /* Notr — hafif mavi kirikli gri skala
     ink-400 ve ink-500 KOYULASTIRILDI. Eskiden ink-400 (#8a97a6) beyaz
     uzerinde 2.98:1 idi; .hint yazilari ve BUTUN tablo basliklari bu
     rengi kullaniyordu. Kucuk punto + acik gri, ekranin en cok bakilan
     yerlerini (tablo basliklari) okunmaz yapiyordu. Olculdu, duzeltildi:
     yeni degerler beyazda 5.30 / 6.24, satir uzerine gelince (ink-50)
     5.01 / 5.90. Skalanin sirasi korundu.

     PAKET 605 — TON 211 DERECEDEN 231 DERECEYE DONDU, PARLAKLIK DEGIL.
     Kullanicinin verdigi tasarim ornegindeki griler 231 derece tonunda
     (mavi-gri) ve urunun bugunku skalasi 211 derecede. AMA GORSELIN
     GRILERINI OLDUGU GIBI ALMAK BU YORUMUN ANLATTIGI KUSURU GERI
     GETIRIYORDU: gorselin tablo basligi grisi (#868AA1) beyaz uzerinde
     3.41:1, yani yukarida reddedilen #8a97a6'nin (2.98) hemen yaninda;
     hucre grisi (#696E86) 5.03 / 4.76 ve ikisi de yukarida yazili
     tabanin (5.30 / 5.01) ALTINDA.
         BIR TASARIM ORNEGININ RENGINI ALMAK, O RENGIN OKUNDUGUNU
         OLCMEK DEGILDIR.
     O yuzden gorselden TON ve DOYGUNLUK alindi (231 derece, %20-22),
     parlaklik ise YUKARIDAKI TABANDAN asagi inmeyecek sekilde
     secildi. Olculen yeni degerler: ink-400 beyaz 5.33 / ink-50 5.03 /
     ink-100 4.66 · ink-500 beyaz 6.29 / ink-50 5.93 / ink-100 5.49 —
     ucu de tabanin ustunde. Skalanin oteki adimlari PARLAKLIGI
     DEGISMEDEN donduruldu (fark her adimda 0.004'ten kucuk), yani
     onlarin hicbir ciftinde kontrast degismiyor.
     374 hucrelik yazi x yuzey matrisi olculdu (yazi ve yuzey listesi
     URUNUN kendi dosyalarindan cikarildi, elle yazilmadi): 4.50'nin
     ustundeyken altina inen TEK bir cift yok. */
  --ink-950:#121527; --ink-900:#1A1E32; --ink-800:#2C3049; --ink-700:#424762;
  --ink-600:#555A75; --ink-500:#5B5F75; --ink-400:#656A82; --ink-300:#AFB3C8;
  --ink-200:#E0E3EF; --ink-100:#EEEFF8; --ink-50:#F7F8FD;
  /* Cizgi, kose ve golge — cizgiler de 231 dereceye donduruldu, yoksa
     ilik bir cizgi sogumus bir yuzeyin kenarinda duruyordu. */
  --cizgi:#E7E9F3; --cizgi-koyu:#D8DAEA;
  --golge-sm: 0 1px 2px rgba(11,34,57,.06);
  --golge:    0 2px 8px rgba(11,34,57,.07);
  --golge-lg: 0 16px 40px rgba(11,34,57,.10);
  /* ── --err KOYULAŞTIRILDI (631) ──────────────────────────────────────
     Eskiden #c62828 ve o değer bu dosyanın KENDİ tabanının (yazi >= 5.01)
     ALTINDA kalıyordu. Ölçüldü (kaskad gözetilerek: admin.css → panel.css
     → ekranın kendi style bloğu, yani KAZANAN kural):

       .flash--err / .notice--err / .alert.err  #fdeaea  4.85 → 5.57
       .pill--kotu                              #fdecec  4.92 → 5.65
       .mini.danger:hover                       #fdecea  4.92 → 5.64
       .rozet--kotu / .tl-sla--kotu / .mn-p1    #ffe2e0  4.61 → 5.29
       .yz-guven--dusuk (panel/talep.php)       #ffe2e0  4.61 → 5.29

     DOKUZ çiftin DOKUZU da tabanın altındaydı, dokuzu da üstüne çıktı.
     Ara bir adım (#bf2222) ölçüldü ve YETMİYOR: #ffe2e0 üstünde 4.96
     kalıyor, yani dokuz çiftin yalnız dördünü kaldırıyor.
     BOZULAN YOK — üç yönün üçü de ölçüldü: --err ZEMİN olduğu üç yerde
     yazı beyaz (--ters-ink) ve kontrast 5.62 → 6.45 ARTIYOR; kenar
     rolündeki sekiz kullanımın görünürlüğü artıyor; zemini mirasla gelen
     587 öğenin HİÇBİRİ koyu bir yazı kabının içinde değil (markup DOM
     olarak tarandı), yani onların zemini de açık.
     Gözle görülür fark OKLab ΔE 3.36 — uyarı kutusu için "görünür" diye
     ölçülen 4.61'in altında.
     NOT: #fdeaea · #fdecea · #ffe2e0 HAM RENK, tokene bağlı DEĞİL; o üç
     zemini tokene çekmek AYRI bir iş (Faz B) ve kullanıcı kararı. */
  --ok:#23744C; --err:#b81f1f;

  /* ── DURUM YÜZEYLERİ ────────────────────────────────────────────────
     Bu satırlar sonradan eklendi ve sebebi bir kusur: yeni ekranlar
     (poliçe yenileme, hasar dosyası, otomatik hatırlatma) uyarı ve hata
     kutularını her seferinde elle boyadı — #fff8e8, #fffaf3, #fdecec,
     #fff2d6 … Aynı işi yapan beş ayrı sarı çıktı.

     Yüzey renkleri artık burada. "Uyarı sarısını biraz koyulaştır"
     dendiğinde tek satır değişiyor, otuz ekran birden düzeliyor. */
  --font-metin:  'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-baslik: 'Source Serif 4', Georgia, 'Times New Roman', 'Noto Serif', serif;

  /* PAKET 605: sari ve yesil yuzeyler gorselden alindi, YAZI RENKLERI
     ise o yuzeylerde OLCULEREK koyulastirildi. Gorselin sarisi
     (#FEF2CE) bugunku uyari yazisiyla 4.40:1 veriyordu — ESIGIN ALTI.
     Yazi #875A00 yapildi: yeni sari uzerinde 5.38, beyazda 6.01
     (eskiden 4.64 / 4.91), yani iki yonde de iyilesti.
     ok ayni sekilde: #23744C yeni yesil yuzeyde 5.06, beyazda 5.72
     (eskiden 4.78 / 5.27). err ailesi DEGISMEDI. */
  --uyari:#875A00;
  --uyari-50:#FEF2CE; --uyari-200:#f0dfae;
  --err-50:#fdecec;   --err-200:#f3c9c9;
  --ok-50:#DDF8E2;    --ok-200:#BFE9C8;

  /* Kart içi ikincil yüzey: kutu içinde kutu (önizleme, geçmiş listesi).
     yuzey-2 ink-50'nin AYNISI olmak zorunda — ikisi aynı satır
     yüzeyini anlatıyor ve ayrışırsa ekranda iki ayrı "çok açık gri"
     çıkar. Bir iddia bunu ölçüyor. */
  --yuzey:#fff; --yuzey-2:#F7F8FD;
  /* SAYFA ZEMİNİ — PAKET 645. Bugün `--yuzey-2` ile AYNI DEĞERDE ve
     ayrı bir token olmasının tek sebebi DARK MOD: karanlık ekranda
     sayfa zemini kartlardan KOYU olmak zorunda ve `body` ile kart aynı
     tokende olduğu sürece ikisi AYRI AYRI ayarlanamıyor.
         İKİ KATMAN BUGÜN AYNI RENKTE OLABİLİR; AMA AYNI TOKENDE
         OLURLARSA YARIN AYRILAMAZLAR.
     NİYE DOĞRUDAN `--yuzey-2` KULLANILMIYOR: paket 642 yirmi bir ham
     rengi ONA bağladı (kart içi küçük yüzeyler · rozet zeminleri).
     O tokeni dark modda değiştirmek o yirmi bir yeri de değiştirir;
     sayfa zemini ise AYRI bir karar.
         BİR TOKENİ İKİ AYRI KARARIN TAŞIYICISI YAPMAK, İKİSİNİ BİR
         DAHA AYIRAMAMAKTIR. */
  --zemin:#F7F8FD;

  /* ── RENKLİ/KOYU ZEMİNİN ÜSTÜNDEKİ YAZI            (paket 613 · faz B)
     ──────────────────────────────────────────────────────────────────
     `--yuzey` İLE AYNI DEĞERİ TAŞIYOR VE AYRI BİR TOKEN OLMASI BİR
     ÖLÇÜM SONUCU: iki stil dosyasında `#fff` 104 bildirimde geçiyor ve
     ÜÇ AYRI ROL taşıyor (özellik adına göre sayıldı) —
     ZEMİN 72 · YAZI 32 · (kenar 2 tanesi düzen dosyalarında).
     Hepsini `--yuzey`e bağlamak dark modda RENKLİ BİR DÜĞMENİN
     ÜSTÜNDEKİ BEYAZ YAZIYI da çevirirdi, yani okunmaz yapardı: yüzey
     karanlıkta koyulaşmak ZORUNDA, markanın üstündeki yazı beyaz
     KALMAK zorunda.
         BİR RENGİ TOKENA ÇEVİRMEK, HANGİ TOKENA ÇEVRİLECEĞİNİ ÖLÇMEK
         DEMEKTİR — AYNI `#ffffff` BİR YERDE YÜZEY, BAŞKA BİR YERDE
         YAZI.
     BUGÜN HİÇBİR ŞEY DEĞİŞMİYOR (ikisi de #fff) ve bu ölçülüyor:
     198 ekranda `getComputedStyle` ÖNCE/SONRA birebir aynı. */
  --ters-ink:#fff;

  /* ── ARALIK ÖLÇEĞİ ──────────────────────────────────────────────────
     Boşluklar da elle yazılıyordu: 6px, 8px, 10px, 12px, 14px, 16px,
     18px, 20px … Ekrandan ekrana ritim tutmuyordu. Yeni yazılan her
     şey bu ölçekten seçiyor. */
  --ara-1:4px; --ara-2:8px; --ara-3:12px; --ara-4:16px;
  --ara-5:24px; --ara-6:32px;

  /* Menü ikonlarının tek kurumsal rengi. Koyu yan panelde markanın
     kendisinin okunurluğu düşük kaldığı için açık tonu kullanılıyor;
     ikisi de aynı marka ailesinden. Tek yerden değiştirilebilsin diye
     değişken — 38 ikonu tek tek boyamak yerine burası yeter.
     PAKET 605: marka maviye döndüğü için bu da mavinin açık tonuna
     döndü. Koyu yan panel zemininde (mavi-950) ÖLÇÜLDÜ: 6.92:1. */
  /* ------------------------------------------------ MENU TOKENLARI (606)
     Sol menu KOYU LACIVERTTEN ACIK ZEMINE dondu. Eskiden menunun butun
     renkleri lacivert uzerine SAYDAM BEYAZ yazilmisti: 67 bildirim, 25
     ayri saydamlik degeri. Beyaz bir zeminde saydam beyaz GORUNMEZ, o
     yuzden her biri rolune gore bir tokena baglandi — tokeni cevirmek
     menuyu bir yerden cevirmek demek.
     --mavi-950'ye DOKUNULMADI: o token uste 27 yerde kullaniliyor ve
     cogu menu DEGIL (olculdu).
     Kontrastlar beyaz zeminde olculdu ve hepsi bu dosyanin kendi
     tabaninin (yazi >= 5.01) ustunde:
       menu yazisi      #2C3049  12.91   ikon           #424762  9.09
       ikincil yazi     #5B5F75   6.29   bolum basligi  #656A82  5.33
       secili yazi      #0048CC   6.78 (hap #EDF4FE uzerinde)
     Secili yazida --brand (#005BFD) KULLANILMADI: hap uzerinde 4.85
     cikiyor, yani tabanin ALTINDA. Referans gorsel o maviyi kullaniyor;
     bir tasarim orneginin rengini almak, o rengin okundugunu olcmek
     degildir. Ayni ton, bir adim koyu. */
  --menu-zemin:      var(--yuzey);
  --menu-cizgi:      var(--cizgi);
  --menu-cizgi-2:    var(--ink-200);
  --menu-yazi:       var(--ink-800);
  --menu-yazi-guclu: var(--ink-900);
  --menu-yazi-2:     var(--ink-500);
  --menu-yazi-3:     var(--ink-400);
  --menu-yuzey:      var(--ink-50);
  --menu-yuzey-2:    var(--ink-100);
  --menu-aktif:      var(--brand-50);
  --menu-aktif-yazi: var(--brand-600);
  --menu-ikon:       var(--ink-700);

  /* GÖVDENİN YAN BOŞLUĞU TEK YERDE.                        (PAKET 608)

     Sayfa başlığı bandı artık üst çubukta değil gövdenin üstünde ve
     SOL KENARI içerikle hizalı olmak zorunda. Boşluğu iki yere elle
     yazsaydım, biri bir gün değişince band içerikten kayardı — ve o
     kayma tam olarak paket 540'ta ödediğim kusurun kendisi.

     Referans 24 px veriyor; BU PAKET DEĞERE DOKUNMUYOR (36 kalıyor).
     Gövde boşluğu, kart ve tablo diliyle birlikte (faz D3) 198 ekran
     gerçek tarayıcıda önce/sonra taranarak değişecek:
         ÖLÇMEDİĞİM EKRANLARIN GENİŞLİKLERİNİ KAYDIRMAM. (540) */
  --govde-yan: 24px;

  /* KART KOSESI — PAKET 612 · D3
   * Referansta olculen aralik 8-10 px (1 px acik kenarda alt-piksel
   * belirsiz, cember uydurma hatasi 1.0-1.3), bizimki 14 px. 10
   * secildi: olculen araligin ust ucu, yani 14ten en kucuk adim.
   *
   * NIYE TOKEN: ayni 14 px ON KURALDA yaziliydi (admin 3 · panel 7).
   * Yalniz .paneli degistirmek, otekileri 14te birakip IKI DOGRU
   * uretirdi — bir ekranin karti 10, otekinin 14 olurdu. */
  --kose: 10px;
}

* { box-sizing: border-box; }
/* ── SAYFA ZEMİNİNİN KENDİ TOKENİ ──────────────── PAKET 645 ─────────
   EKRANDA HİÇBİR ŞEY DEĞİŞMİYOR: zemin `#F7F8FD` idi, `#F7F8FD` kalıyor.
   Değişen tek şey, o rengin artık `--yuzey-2` yerine KENDİ tokeninden
   (`--zemin`) gelmesi.

   ── BU SATIRIN GEÇMİŞİ YAZILI, ÇÜNKÜ İKİ KEZ KARAR DEĞİŞTİ ──────────
   · PAKET 612 (03–04.10): kullanıcı sayfa zemini için açıkça "Beyaz
     olsun (referans gibi)" dedi. 612 onu uyguladı VE BEDELİNİ ÖLÇTÜ:
     sayfa beyaz olunca kartı zeminden ayıran tek şey 1 px kenar kalıyor,
     kontrast 1.21 (referansın kendi kenarı 1.09, yani bizimki daha
     koyu). Ölçülmüş bir takastı, kusur değildi.
   · PAKET 640 (06.10): o hâli "ölçülen kusur" diye sundum. ÖLÇÜM
     DOĞRUYDU (1440 px'te `rgb(255,255,255)` 5.639.720 px², yani görünen
     zeminin %97'si tek renkti) AMA TEŞHİS YANLIŞTI — gördüğüm şey bir
     kusur değil, kullanıcının SEÇTİĞİ hâldi.
         BİR DAVRANIŞIN SEBEBİ ÜRÜNÜN KENDİ KAYDINDA YAZILIYSA, ONU
         KUSUR SANMADAN ÖNCE O KAYDI OKUMAK ZORUNDAYIM.
   · 06.10 AKŞAMI: 640 kurulduktan sonra kullanıcı zemini EKRANDA gördü
     ve "gri kalsın" dedi. Yani bugünkü gri, 640'ın teşhisi değil
     KULLANICININ İKİNCİ KARARI — ve karar ekranda görülerek verildi.
         BİR KARARI DEĞİŞTİREN ŞEY BENİM GEREKÇEM DEĞİL, KULLANICININ
         O HÂLİ GÖRMESİ OLDU.

   ── BU PAKET NİYE GEREKİYOR ──────────────────────────────────────────
   DARK MOD. Karanlık ekran yalnızca tokenları çeviriyor. Zemin
   `--yuzey-2`den beslendiği sürece, o tokeni çevirmek paket 642'nin ona
   bağladığı YİRMİ BİR yeri (kart içi küçük yüzeyler · rozet zeminleri)
   de çeviriyor. Zemine kendi tokenini vermek o iki kararı ayırıyor.
       BİR ÖN KOŞULU SAĞLAMAK, GÖRÜNÜMÜ DEĞİŞTİRMEYİ GEREKTİRMİYOR
       OLABİLİR — ÖNCE GEREKTİRİP GEREKTİRMEDİĞİNİ SOR.

   198 EKRAN GERÇEK TARAYICIDA ÖNCE/SONRA TARANDI (594 istek ·
   1440/1024/390 px): gövde zemini `rgb(247,248,253)` → `rgb(247,248,253)`
   · HTTP kodu değişen YOK · yatay kayması değişen YOK · yeni konsol
   hatası YOK · menüyü ezen ekran YOK · başlık bandı kayan ekran YOK.
       ÖLÇMEDİĞİM EKRANLARIN GENİŞLİKLERİNİ KAYDIRMAM. (540)

   ZEMİNİ BEYAZA DÖNDÜRMEK İSTENİRSE: yukarıdaki `--zemin` tokeninin
   DEĞERİNİ beyaz yapmak yeterli; başka hiçbir satır değişmiyor. 612'nin
   ölçtüğü bedel yukarıda yazılı.
       YORUM KALIBI ANLATIR, TEKRARLAMAZ — bu cümle bir zamanlar
       bildirimin TAM METNİNİ tekrarlıyordu ve o yüzden dosyada iki kez
       geçiyordu; mutasyon turu "uygulanamadı" dedi, çünkü mutasyonun
       çapası artık TEK değildi. (636)
   ──────────────────────────────────────────────────────────────────── */
body {
  margin: 0; background: var(--zemin); color: var(--ink-900);
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  font-size: 14px; line-height: 1.55; -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
h1,h2,h3 { margin: 0; letter-spacing: -.01em; }
p { margin: 0; }

/* Rakamlar hizalansın: tabloda alt alta gelen 1.284 ile 973 farklı
   genişlikte rakam kullanınca sütun titriyordu. */
table td, table th, .stat-card-value, .kd-sayi, .kredi-bakiye,
.uye-sayi, .rol-sayi, time { font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------------ DÜZEN */

/* `100vh` MOBİL TARAYICIDA ADRES ÇUBUĞUNU SAYMIYOR: belge görünür
   alandan uzun oluyor ve içerik sığsa bile HER SAYFA bir miktar
   kayıyor. Ürün o tuzağı bir satır aşağıda, `.side`ta ZATEN biliyor ve
   `100vh; 100dvh` çiftiyle kapatıyor (gerekçe orada yazılı) — bu satır
   o çiftin dışında kalmıştı.
       ÜRÜNÜN İKİ YARISI AYNI TUZAĞI AYNI BİÇİMDE KAPATMAK ZORUNDA. (547)
   Sıra şart: `dvh` tanımayan tarayıcı bir üstteki satırı kullanıyor.
   DÜRÜSTÇE: farkın EKRANDAKİ etkisi bu kapta ÖLÇÜLEMİYOR — başsız
   tarayıcıda adres çubuğu yok, yani `100vh` ile `100dvh` aynı sayıyı
   veriyor (ölçüldü: 390 pikselde ikisi de 844). Ölçülen şey kaynak
   ANLAŞMASI ve değişikliğin bu kapta HİÇBİR ŞEYİ KAYDIRMADIĞI. */
.shell { display: flex; min-height: 100vh; align-items: flex-start; }
.shell { min-height: 100dvh; }

/*
 * Sol menü ekranda sabit durur; sayfa aşağı kaydıkça menü kaymaz.
 *
 * position:sticky çalışması için iki şey gerekir: öğe kapsayıcısından
 * KISA olmalı (align-self:flex-start yoksa flex onu boyuna geriyor) ve
 * yüksekliği ekranla sınırlı olmalı. 100dvh mobil tarayıcılarda adres
 * çubuğu açılıp kapandığında da doğru ölçüyü verir; desteklemeyen
 * tarayıcı bir üstteki 100vh satırını kullanır.
 */
.side {
  width: 230px; flex-shrink: 0; background: var(--menu-zemin);
  color: var(--menu-yazi); border-right: 1px solid var(--menu-cizgi);
  display: flex; flex-direction: column;
  position: sticky; top: 0; align-self: flex-start;
  height: 100vh;
  height: 100dvh;
}
.side-logo {
  display: block; padding: 22px 24px 18px; flex-shrink: 0;
  border-radius: 12px; margin: 4px 8px 0;
  transition: background .15s ease, opacity .15s ease;
}
.side-logo img { height: 30px; width: auto; display: block; }
.side-logo:hover { background: var(--menu-yuzey-2); }
.side-logo:active { opacity: .7; }
.side-logo:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/*
 * Menü listesi kalan alanı doldurur; ekran alçaldığında (dizüstü, yatay
 * telefon) logo ve alt bilgi yerinde kalsın diye yalnızca bu bölüm kayar.
 */
.side-nav {
  display: flex; flex-direction: column; gap: 3px; padding: 0 12px;
  flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: thin; scrollbar-color: var(--menu-cizgi-2) transparent;
}
.side-nav::-webkit-scrollbar { width: 6px; }
.side-nav::-webkit-scrollbar-track { background: transparent; }
.side-nav::-webkit-scrollbar-thumb { background: var(--menu-cizgi-2); border-radius: 999px; }
.side-nav:hover::-webkit-scrollbar-thumb { background: var(--ink-300); }
/*
 * SATIR YUKSEKLIGI DEGISMEDI VE SEBEBI OLCULDU (paket 606).
 * Referans ekranlarinda hap 48 piksel yuksek ve satir ortalari 60
 * piksel araliktaydi (piksel sayilarak olculdu). O olcuyu ALMADIM:
 * referansta YEDI menu maddesi var, bizim panelde GORUNUR 72 baglanti
 * (yonetimde 49) ve menu bugun 775 piksel; 992 piksellik bir ekrana
 * TAM sigiyor. Satiri 48'e cikarmak menuyu her ekranda kaydirirdi ve
 * paket 410 tam o kusuru odemisti: "menu 22 satira cikti ve 1920x1080'de
 * son madde ekran disinda kaldi".
 *     BIR TASARIM ORNEGININ OLCUSUNU ALMAK, O OLCUNUN BIZIM MENUMUZE
 *     SIGDIGINI OLCMEK DEGILDIR. · BIR DUZELTME, DAHA ONCE ODENMIS BIR
 *     KUSURU GERI GETIRMEMELI. (585)
 * Satirin buyumesi menunun KISALMASINI gerektiriyor ve o bir ICERIK
 * karari — CSS karari degil.
 */
.side-nav a {
  display: flex; align-items: center; gap: 12px; padding: 10px 14px;
  /* Eskiden lacivert uzerinde saydam beyazdi (.68 -> 7.2:1). Acik
     zeminde #2C3049 beyazda 12.91:1. Olculdu. */
  border-radius: 9px; color: var(--menu-yazi); font-size: .9rem;
}
.side-nav a:hover { background: var(--menu-yuzey-2); color: var(--menu-yazi-guclu); }
/* Secili satir ARTIK DOLU MAVI DEGIL: acik mavi hap + mavi yazi.
   #0048CC, #EDF4FE uzerinde 6.78:1 (olculdu). */
.side-nav a.is-active { background: var(--menu-aktif); color: var(--menu-aktif-yazi); font-weight: 600; }
.side-nav .ikon { flex: none; color: var(--menu-ikon); }
/* Ikon yalnizca secili satirda maviye donuyor; baska her yerde
   #424762 (beyazda 9.09:1). */
.side-nav a.is-active .ikon { color: var(--menu-aktif-yazi); }

/* ------------------------------------------------- MENÜ BÖLÜMLERİ
   Tıklanmayan, açılmayan bir etiket. Menü uzun ve uzun kalıyor — her
   ürün kendi satırında duruyor, hiçbiri bir başlığın arkasına
   saklanmıyor. Bölüm başlıkları yalnızca gözün nerede olduğunu
   bilmesini sağlıyor: tıklama sayısı artmıyor, hiçbir madde
   gizlenmiyor.

   pointer-events:none — üstüne gelince imleç değişmesin. Tıklanabilir
   görünen ama tıklanmayan bir şey, kullanıcıya bir kez yalan söyler. */
.nav-bolum {
  pointer-events: none; user-select: none;
  /* flex:none ŞART. .side-nav dikey bir flex kutusu ve kayabiliyor;
     kaydığı anda flex öğeleri esneyip kısalıyor. Dar menüdeki ayraç
     "height:1px" yazdığı hâlde ekranda 0px çiziliyordu — kural vardı,
     çizgi yoktu. Ölçmeden görülmeyecek türden. */
  flex: none;
  margin: 15px 0 2px; padding: 0 14px;
  font-size: .68rem; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase;
  /* Acik zeminde #656A82 = 5.33:1: baslik oldugu belli ama maddelerin
     onune gecmiyor. Olculdu. */
  color: var(--menu-yazi-3);
}
/* İlk bölüm başlığının üstünde fazladan boşluk gerekmiyor. */
.nav-bolum:first-child { margin-top: 4px; }

/* DAR MENÜDE YAZI YOK, ÇİZGİ VAR. Kırk piksellik sütuna "PAZARLAMA VE
   OTOMASYON" sığmıyor; kırpsaydım "PAZARLA…" yazardı ve yarım kelime,
   hiç kelime olmamasından kötüdür. Bölümün bittiğini çizgi söylüyor. */
.menu-dar .nav-bolum {
  margin: 10px 14px 8px; padding: 0;
  height: 1px; overflow: hidden;
  /* .16 ekranda görünmüyordu — boşluk vardı, çizgi yoktu. .28 dar
     sütunda seçilebiliyor ve ikonların önüne geçmiyor. */
  background: var(--menu-cizgi-2);
}
.menu-dar .nav-bolum .nav-tam { display: none; }

/* ------------------------------------------------- MENÜ GRUPLARI */
/* Gruplar <details> ile açılıyor: JavaScript olmadan çalışıyor ve
   sunucuda "bu grup açık" demek tek bir open özniteliği. */
.nav-grup { border-radius: 9px; }
.nav-grup > summary {
  display: flex; align-items: center; gap: 12px; padding: 10px 14px;
  /* .6 lacivert uzerinde 3.14:1 idi — menu ve kapali grup adlari
     ("Site Yonetimi") okunmuyordu. Acik zeminde #2C3049 = 12.91:1. */
  border-radius: 9px; color: var(--menu-yazi); font-size: .9rem;
  cursor: pointer; list-style: none; user-select: none;
}
.nav-grup > summary::-webkit-details-marker { display: none; }
.nav-grup > summary:hover { background: var(--menu-yuzey-2); color: var(--menu-yazi-guclu); }
.nav-grup[open] > summary { color: var(--menu-yazi-guclu); font-weight: 600; }
.nav-grup-ad { flex: 1 1 auto; min-width: 0; }

/* Ok işareti: kapalıyken sağa, açıkken aşağı bakar. */
.nav-ok { flex: none; width: 8px; height: 8px; margin-left: 4px;
  border-right: 1.75px solid currentColor; border-bottom: 1.75px solid currentColor;
  transform: rotate(-45deg); opacity: .5; transition: transform .15s ease; }
.nav-grup[open] > summary .nav-ok { transform: rotate(45deg); }

/* Grup içindeki maddeler bir tık içeride dursun ki hangi başlığa
   ait oldukları bakışta anlaşılsın. */
.nav-grup > a { margin-left: 14px; padding-left: 12px; font-size: .875rem;
  border-left: 1px solid var(--menu-cizgi-2); border-radius: 0 9px 9px 0; }
.nav-grup > a:first-of-type { margin-top: 2px; }
.nav-grup > a:last-of-type { margin-bottom: 6px; }
.nav-grup > summary .badge { margin-left: 0; }
/* "Site Yonetimi" baglantisi. .35 => 3.14:1; menude en az bakilan ama
   en yetkili yere giden bag oldugu icin gorunmesi gerekiyor. .55 => 5.7:1. */
.side-nav .muted { color: var(--menu-yazi-3); margin-top: 8px; }
.side-nav .badge {
  margin-left: auto; background: var(--brand); color: var(--ters-ink);
  border-radius: 999px; padding: 1px 8px; font-size: .72rem; font-weight: 700;
}
/* Hap artik acik; rozet kendi kurumsal rengini aliyor (beyaz yazi
   #005BFD uzerinde 5.36:1). Siyah saydamlik acik hapta griye
   donuyor ve rozet rozet gibi gorunmuyordu. */
.side-nav a.is-active .badge { background: var(--brand); }
.side-foot {
  padding: 14px 12px 16px; margin-top: 6px;
  border-top: 1px solid var(--menu-cizgi);
  flex-shrink: 0; position: relative;
}
/* Menü kayıyorsa alttaki satırın kesildiği belli olsun diye yumuşak geçiş.
   Menü kaymıyorsa aynı renk üzerine bindiği için görünmez. */
.side-foot::before {
  content: ''; position: absolute; left: 0; right: 0; bottom: 100%; height: 20px;
  background: linear-gradient(to top, var(--menu-zemin), rgba(255,255,255,0));
  pointer-events: none;
}

/* ---- giriş yapan kişi ---- */
.side-kisi {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 10px;
  background: var(--menu-yuzey);
}
.side-kisi-harf {
  flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--brand); color: var(--ters-ink);
  font-size: .78rem; font-weight: 700; letter-spacing: .02em;
}
.side-kisi-bilgi { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.side-kisi-bilgi strong {
  font-size: .85rem; font-weight: 600; color: var(--menu-yazi);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* .45 saydamlik lacivert uzerinde 4.07:1 veriyordu — 11 punto icin yetersiz.
   .62'de 6.87:1. Rol etiketi ("MASTER") yanlis hesapta islem yapmamak icin
   okunmasi gereken bir yazi; soluk gecmesi dogru degil. */
.side-kisi-rol {
  font-size: .68rem; color: var(--menu-yazi-2);
  text-transform: uppercase; letter-spacing: .07em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ---- arayüz dili (yalnızca müşteri panelinde) ----
   Kenar çubuğunun dibinde, işlem satırının hemen üstünde. Menünün
   ortasına konsaydı belediye personeli yanlışlıkla basıp ekranı
   İngilizce bırakabilirdi; buradan bir kaza sonucu geçilmiyor.
   Renkler .side-kisi-islem ile aynı ölçülmüş değerlerden. */
.side-dil { display: flex; gap: 6px; margin-top: 10px; }
.side-dil a, .side-dil span {
  flex: 1 1 0; min-width: 0;
  display: flex; align-items: center; justify-content: center;
  padding: 6px 4px; border-radius: 8px;
  font-size: .72rem; font-weight: 600; letter-spacing: .06em;
  text-decoration: none; white-space: nowrap;
}
.side-dil a { background: var(--menu-yuzey); color: var(--menu-yazi-2); }
.side-dil a:hover { background: var(--menu-yuzey-2); color: var(--menu-yazi-guclu); }
.side-dil .side-dil-etkin { background: var(--menu-aktif); color: var(--menu-aktif-yazi); }

/* ---- güvenlik / çıkış ---- */
.side-kisi-islem { display: flex; gap: 6px; margin-top: 8px; }
.side-kisi-islem a {
  flex: 1 1 0; min-width: 0;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px 6px; border-radius: 9px;
  background: var(--menu-yuzey);
  /* Acik zeminde #5B5F75 = 6.29:1 (cip zemininde 5.93). Olculdu. */
  color: var(--menu-yazi-2);
  font-size: .78rem; font-weight: 500; text-decoration: none;
  white-space: nowrap;
}
.side-kisi-islem a:hover { background: var(--menu-yuzey-2); color: var(--menu-yazi-guclu); }
/* OPACITY KALDIRILDI. rgba(255,255,255,.6) rengin üstüne .75 opacity
   binince etkin saydamlık .45'e düşüyordu → 4,07:1. "Güvenlik" ve
   "Çıkış" bağlantıları müşteri panelinin her ekranında duruyor.
   İki kat saydamlık üst üste binmesi gözle fark edilmiyor; ancak
   ölçünce çıkıyor. */
.side-kisi-islem a span { font-size: .8rem; }

/* ---- üstteki hesap kutusu (yalnızca müşteri panelinde) ---- */
.side-hesap {
  display: flex; align-items: center; gap: 10px;
  margin: 12px 12px 14px; padding: 10px 12px;
  border-radius: 12px;
  background: var(--menu-yuzey);
  border: 1px solid var(--menu-cizgi);
  flex-shrink: 0;
}
.side-hesap-harf {
  flex: 0 0 auto; width: 34px; height: 34px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: var(--brand-100); color: var(--menu-aktif-yazi);
  font-size: .78rem; font-weight: 700;
}
.side-hesap-bilgi { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
/* .4 => 3.68:1; 10 puntoluk aralikli buyuk harf icin cok soluk.
   .62'de 6.93:1. */
.side-hesap-bilgi small {
  font-size: .62rem; text-transform: uppercase; letter-spacing: .13em;
  color: var(--menu-yazi-2);
}
.side-hesap-bilgi strong {
  font-size: .88rem; font-weight: 600; color: var(--menu-yazi);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.main { flex: 1; min-width: 0; }

/* ══════════════════════════════════════════════════════════════════════
   ÜST ÇUBUK İNCELDİ, SAYFA BAŞLIĞI GÖVDEYE İNDİ          (PAKET 608 · D2)
   ══════════════════════════════════════════════════════════════════════

   ÖLÇÜLDÜ (referans görseller · piksel sayılarak · ölçek 1): üst çubuk
   72 px (alt 1 px çizgi dâhil) ve SAYFA BAŞLIĞI ÜST ÇUBUĞUN İÇİNDE
   DEĞİL — gövdenin üstünde, içerikle aynı sol kenarda, SANS ve ≈32 px.
   Bizdeki hâl gerçek tarayıcıda ölçüldü: çubuk 109 px, başlık çubuğun
   içinde, 25,92 px ve SERİF.

   ÜST ÇUBUKTA YALNIZ GLOBAL ÇUBUK ÖĞELERİ KALIYOR (hat değiştir ·
   bildirim zili); ekranın kendi eylem düğmeleri başlık bandına geçti.
   Bandın ortasında duran bir düğme, başlıkla birlikte okunuyor.

   min-height KULLANILDI, height DEĞİL: dar ekranda öğeler alt alta
   düştüğünde kutu BÜYÜMEK zorunda. Sabit bir yükseklik, telefonda zili
   çubuğun dışında bırakırdı. box-sizing: border-box global olduğu için
   72 px alt çizgiyi de kapsıyor (ölçüldü). */
.topbar {
  background: var(--yuzey); border-bottom: 1px solid var(--cizgi);
  padding: 12px var(--govde-yan); min-height: 72px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; flex-wrap: wrap;
}
/* Sohbet ekranının başlığı ÜST ÇUBUKTA KALIYOR ve bu ölçülmüş bir karar:
   `.sayfa-sohbet .topbar` YAPIŞKAN (position:sticky), kendi zemini ve
   kendi `--ust-h` ölçümü var; kişinin adını oradan çıkarmak o ekranın
   bütün yapışkan geometrisini yeniden ölçmek demekti. */
.topbar h1 { font-family: var(--font-baslik); font-size: 1.62rem; font-weight: 600; letter-spacing: -.008em; }
.topbar p { color: var(--ink-500); font-size: .88rem; margin-top: 2px; }
.topbar-actions { display: flex; gap: 12px; flex-wrap: wrap; }
/* Başlık gövdeye indiği için çubuğun TEK çocuğu kalabiliyor; o hâlde
   `justify-content: space-between` onu SOLA yapıştırıyor. Çubuk öğeleri
   referansta da sağda duruyor. */
.topbar > .topbar-actions:only-child { margin-left: auto; }

/* SAYFA BAŞLIĞI BANDI — gövdenin KARDEŞİ, içine değil.

   Niye kardeş: `panel_topbar()` çağıran 119, `admin_topbar()` çağıran
   59 ekran var ve 178'i de kendi `<div class="body">`ini AÇIYOR. Bandı
   gövdenin içine koymak 178 ekranı düzenlemek demekti.
       ÖLÇMEDİĞİM EKRANLARIN GENİŞLİKLERİNİ KAYDIRMAM. (540)

   Yan boşluk `--govde-yan` ile gövdeyle AYNI tokenden okunuyor, yani
   bandın sol kenarı ilk kartın sol kenarıyla ayrışamaz. */
.sayfa-bas {
  padding: 24px var(--govde-yan) 0;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; flex-wrap: wrap;
}
.sayfa-bas h1 {
  font-size: 2rem; font-weight: 600; letter-spacing: -.022em;
  color: var(--ink-900); line-height: 1.2;
}
.sayfa-bas p { color: var(--ink-500); font-size: .9rem; margin-top: 4px; }
/* BAŞLIK BLOĞU KÜÇÜLEBİLİR OLMAK ZORUNDA            (paket 609)
   Paket 608 bu sarmalayıcıyı yazdı ama kuralını YAZMADI (tarama
   `_tarama-cizilmeyen-sinif.php` yakaladı: iki düzende de tanımsız).
   Bugün zararsız — 198 ekran 390 pikselde taranmıştı ve yatay kayma
   sıfırdı. Ama esnek bir çocuğun `min-width` değeri VARSAYILAN `auto`:
   uzun ve bölünemeyen bir başlık sözcüğü bloğu ekrandan geniş yapar ve
   SAYFANIN kendisi yana kayar. Paket 385 tam bu kusuru `.tk-yan`'da,
   paket 540 `.as-ekle`'de ödedi.
       ÖLÇÜLMEMİŞ BİR SARMALAYICI, BİR GÜN EKRANI KAYDIRIR — VE O GÜN
       SEBEBİ GÖRÜNMEZ OLUR. */
.sayfa-bas-bas { min-width: 0; }
.sayfa-bas-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
/* ── GENEL DENETİM GRUBU ─────────────────────────── PAKET 644 ────────
   Hat değiştirici ve bildirim zili artık başlık bandında; eskiden
   üstlerinde 72 piksellik AYRI BİR ŞERİT vardı ve o şeritte başka
   hiçbir şey yoktu (ölçüldü: gerçek Chromium · 1440 px · 103 panel
   ekranının 103'ünde şerit ve band BİRLİKTE çiziliyordu).

       BİR EKRANIN BOŞ BANDI, BİLGİ TAŞIMAYAN AMA YER TUTAN BİR ÖĞEDİR.

   AYRAÇ BİLEREK: bu iki düğme GENEL (hangi hat · yeni bildirim),
   yanındakiler ise BU SAYFANIN işi. Aynı şeride koyup ayırmamak,
   kullanıcıya her seferinde hangisinin ne yaptığını yeniden okutmak
   olurdu. Ayraç `--cizgi` tokeninden — ikinci bir gri yazmıyorum.
   Telefonda (band zaten `flex-wrap`) ayraç gizleniyor: alt alta düşen
   iki grubun arasında DİKEY bir çizgi anlamsız olur. */
.sayfa-bas-genel {
  display: flex; gap: 8px; align-items: center;
  padding-right: 12px; border-right: 1px solid var(--cizgi);
}
@media (max-width: 700px) {
  .sayfa-bas-genel { padding-right: 0; border-right: 0; }
}
/* Band varken gövdenin üst boşluğu bandın alt boşluğu oluyor: ikisi
   birden dursa başlıkla ilk kart arasında 52 px kalırdı (referansta 31). */
.sayfa-bas + .body { padding-top: 18px; }

.body { padding: 28px var(--govde-yan) 60px; }

/* --------------------------------------------------------------- ÖĞELER */

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 11px 22px; border: 0; border-radius: 9px; cursor: pointer;
  font: inherit; font-size: .88rem; font-weight: 600;
  background: var(--brand); color: var(--ters-ink); transition: background-color .15s;
  white-space: nowrap;
}
.btn:hover { background: var(--brand-600); }

/* ── KAPALI DÜĞME ────────────────────────────────────────────────────
   Bu kural aylardır YOKTU. `disabled` yazılmış her düğme — otuz kadar
   ekranda — açık düğmeyle bire bir aynı görünüyordu: aynı yeşil, aynı
   imleç, üstüne gelince aynı koyulaşma. Yani ekran "bu düğmeye
   basabilirsin" diyor, tarayıcı tıklamayı yutuyordu.

   Bileşenler kılavuzu, ilk açıldığı gün bunu gösterdi: "Ana eylem" ile
   "Kapalı" kartları yan yana konunca ikisinin de aynı olduğu görüldü.

   Üç ayrı işaret veriyoruz, çünkü tek başına renk yetmez: renk körü
   biri için doygunluk, imleç herkes için, saydamlık ise küçük
   ekranda. */
.btn:disabled, .btn[disabled], .btn.is-kapali {
  background: var(--ink-200); color: var(--ink-500);
  cursor: not-allowed; box-shadow: none;
}
.btn:disabled:hover, .btn[disabled]:hover, .btn.is-kapali:hover {
  background: var(--ink-200);
}
.btn-ghost { background: var(--yuzey); color: var(--ink-700); border: 1px solid var(--cizgi-koyu); }
.btn-ghost:hover { background: var(--ink-50); }
.btn-ghost:disabled, .btn-ghost[disabled], .btn-ghost.is-kapali {
  /* ink-300 denendi ve BIRAKILDI: #f6f9fc zemininde 1.97:1 çıkıyordu,
     yani kapalı düğmenin yazısı okunmuyordu. ink-400 ile 5.01:1 —
     açık hâlin 9.07:1'inden belirgin şekilde soluk ama okunur. */
  background: var(--ink-50); color: var(--ink-400); border-color: var(--cizgi);
}
.btn-ghost:disabled:hover, .btn-ghost[disabled]:hover, .btn-ghost.is-kapali:hover {
  background: var(--ink-50);
}
/* WhatsApp yeşili — Meta ile konuşan işlemler için */
.btn-wa { background: #25D366; color: var(--ters-ink); }
.btn-wa:hover { background: #1DA851; }
.btn-wa svg { flex: 0 0 auto; }
.btn-sm { padding: 8px 16px; font-size: .82rem; }
.btn-block { width: 100%; }
.btn input[type=file] { display: none; }

.input {
  width: 100%; padding: 10px 14px; font: inherit; font-size: .88rem;
  border: 1px solid var(--cizgi-koyu); border-radius: 9px; background: var(--yuzey);
  color: var(--ink-900); outline: none; transition: border-color .15s, box-shadow .15s;
}
.input:focus { border-color: var(--mavi); box-shadow: 0 0 0 3px var(--mavi-50); }
.input.is-locked, .input[readonly] { background: var(--ink-50); color: var(--ink-400); }
.input-sm { padding: 7px 10px; font-size: .8rem; }
textarea.input { resize: vertical; }
select.input { appearance: auto; }

.field { margin-bottom: 16px; }
.field > label, .f-label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: 6px; color: var(--ink-700); }
.hint { font-size: .78rem; color: var(--ink-400); font-weight: 400; margin-top: 5px; }
.muted { color: var(--ink-500); font-size: .85rem; }

.check { display: flex; align-items: center; gap: 10px; cursor: pointer; margin-top: 12px; font-size: .88rem; }
.check input { width: 16px; height: 16px; accent-color: var(--brand); }


/* ══════════════════════════════════════════════════════════════════════
   EKRANDA YAZILMIŞ AMA ÇİZİLMEYEN SINIFLAR            (paket 609)
   ══════════════════════════════════════════════════════════════════════
   Ekranlar kart, kutu ve tablo için ürünün sözcüğünü kullanmak YERİNE
   ikinci bir sözcük yazmış: `card` · `notice` · `alert` · `tablo` ·
   `tbl` · `stat-ad` · `stat-sayi`. Hiçbiri bu dosyada ya da öteki
   stil dosyasında tanımlı DEĞİL (ölçüldü: gerçek Chromium'da
   `class="card"` bir kutuya zemin, kenar, köşe, gölge ve iç boşluk
   VERMİYOR — dört değer de sıfır). Yani yazan kişi kart yazdı, ekranda
   çıplak bir div duruyor.

   NİYE SINIFI EKRANDA DÜZELTMEDİM: 55 öğe, 19 ekran. Paket 540'ta TEK
   bir kural 246 tablonun sütununu kaydırdı ve bunu ancak 193 ekranı
   gerçek tarayıcıda önce/sonra ölçünce gördüm; 19 ekranı 55 yerde
   düzenlemek 55 çapa riski demekti. Kural TEK YERDE: adlar ürünün kendi
   kuralına EKLENİYOR, kuralın kopyası YAZILMIYOR — bir gün `.panel`'in
   köşesi değişirse `.card` de onunla değişiyor, ayrışamazlar.
   Bu, dosyanın kendi kalıbı: `.uyari-kutu, .hata-kutu, .iyi-kutu` ve
   `.stat-card, .kd-kart` da aynı şekilde tek kuralı paylaşıyor.

   SİLEMEDİĞİN ÇOĞALTMAYI, ANLAŞTIKLARINI ÖLÇEREK TUTABİLİRSİN. (521)
   ══════════════════════════════════════════════════════════════════════ */
.panel, .card { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--kose); margin-bottom: 20px;
         overflow: hidden; box-shadow: var(--golge-sm); }
.panel.pad, .panel .pad, .card.pad, .card .pad { padding: 22px; }
.panel-head, .card-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 16px 22px; border-bottom: 1px solid var(--cizgi);
}
/* `card-body` kartın iç boşluğunu istiyor — ürünün o işi yapan sınıfı
   `.pad` ve kuralı yukarıda. (panel/video-kampanya.php) */
.card-body { padding: 22px; }
.panel-head h2, .panel-title { font-size: .95rem; font-weight: 700; }
.panel-title { padding: 16px 22px; border-bottom: 1px solid var(--cizgi); }
.panel h3 { font-size: .85rem; font-weight: 700; margin-bottom: 14px; }
/* :not(.btn) SART. Bu kural (0,1,1) .btn'i (0,1,0) yeniyordu; baslik
   satirina konan her dugme yesil zemin uzerinde MAVI yazi aliyordu —
   1.15:1, yani okunmaz. Sablon Kategorileri ekranindaki sektor
   sekmelerinde olcerek bulundu. */
.panel-head a:not(.btn) { font-size: .82rem; color: var(--mavi); }
.panel-head a:not(.btn):hover { text-decoration: underline; }

.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; align-items: start; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 720px) { .two-col, .grid-2 { grid-template-columns: 1fr; } }

/* ── DURUM KUTULARI ──────────────────────────────────────────────────
   Yönetim ekranlarında ortak bir uyarı kutusu YOKTU. Her ekran kendi
   kutusunu yazmış: .dosya-uyari, .fy-uyari, .kalite-serit, elle
   yazılmış border-left'ler… Aynı işi yapan beş ayrı sarı.

   Panel tarafında bu iş .hs-uyari ile yapılıyordu ama o sınıf yalnızca
   panel.css'te; yönetim ekranında kullanılsa hiçbir stil almadan düz
   yazı olarak çizilirdi. (Yeni yedek ekranını yazarken tam olarak bunu
   yapmıştım; kural yokluğu böyle yayılıyor.)

   Üçü de renkle birlikte ANLAM taşıyor ve yalnızca renge dayanmıyor:
   içindeki <strong> ne olduğunu yazıyor. */
.uyari-kutu, .hata-kutu, .iyi-kutu {
  border-radius: 10px; padding: var(--ara-3) var(--ara-4);
  font-size: .86rem; line-height: 1.55; margin: var(--ara-3) 0;
}
.uyari-kutu { background: var(--uyari-50); border: 1px solid var(--uyari-200); color: var(--ink-800); }
.uyari-kutu strong { color: var(--uyari); }
.hata-kutu  { background: var(--err-50);   border: 1px solid var(--err-200);   color: var(--ink-800); }
.hata-kutu strong  { color: var(--err); }
.iyi-kutu   { background: var(--ok-50);    border: 1px solid var(--ok-200);    color: var(--ink-800); }
.iyi-kutu strong   { color: var(--ok); }

/* Bir satırın altındaki kısa sebep yazısı (hata metni, açıklama). */
.sebep { font-size: .78rem; color: var(--ink-500); margin-top: 4px; line-height: 1.45; }

.flash, .notice, .alert { padding: 12px 16px; border-radius: 9px; font-size: .88rem; margin-bottom: 18px; }
.flash--ok,  .notice--ok,  .alert.ok  { background: #e8f6ee; color: var(--ok); }
.flash--err, .notice--err, .alert.err { background: var(--err-50); color: var(--err); }
.flash--uyari, .notice--warn { background: #fff6e6; color: var(--uyari); }
.flash a, .notice a, .alert a { color: inherit; font-weight: 600; }

/* Kredi / sözleşme kutusu — gönderim öncesi maliyet özeti */
.kredi-kutu {
  background: var(--yuzey-2); border: 1px solid var(--ink-200); border-radius: 12px;
  padding: 14px 16px; margin: 18px 0; font-size: .9rem;
}
.kredi-kutu--uyari { background: #fff6e6; border-color: #f2ddc0; }
.kredi-satir { display: flex; justify-content: space-between; gap: 14px; padding: 4px 0; }
.kredi-satir + .kredi-satir { border-top: 1px solid rgba(0,0,0,.05); }
.kredi-satir span { color: var(--ink-500); }
.kredi-uyari { margin: 10px 0 0; color: var(--uyari); font-weight: 600; }
.kredi-bakiye { font-family: var(--font-baslik); font-size: 1.72rem; font-weight: 600; margin: 2px 0 0; }
.alt-baslik { font-size: .9rem; font-weight: 700; margin: 26px 0 12px; color: var(--ink-900); }
.tablo-kaydir { overflow-x: auto; border: 1px solid var(--cizgi); border-radius: 10px; }

.empty-box {
  background: var(--yuzey); border: 2px dashed var(--cizgi-koyu); border-radius: var(--kose);
  padding: 70px 20px; text-align: center; color: var(--ink-400);
}

.pill { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: .72rem; font-weight: 600;
        background: var(--ink-100); color: var(--ink-500); }
.pill--ok { background: var(--ok-50); color: var(--ok); }
.pill--brand { background: var(--mavi-100); color: var(--mavi-600); margin-left: 8px; }
.pill--uyari { background: var(--err-50); color: #b02a2a; margin-left: 6px; }

/* ── ANLAMLI ROZET RENKLERİ ──────────────────────────────────────────
   Yukarıdaki üç sınıf renge göre adlandırılmış: --ok, --brand, --uyari.
   Bir ekran "hata"yı boyamak istediğinde hangisini seçeceğine kendi
   karar veriyordu ve iki ekran birden pill--brand'i (mavi) seçmişti.
   Yani HATA, bilgi rengiyle çizilmişti.

   Aşağıdakiler renge göre değil ANLAMA göre adlandırıldı. Hangi rengin
   geleceğine ekran değil bu dosya karar veriyor. Eşleştirme tek yerde:
   inc/durum-rozet.php.

   Eskiler kaldırılmadı: otuz ekranda kullanılıyorlar ve hepsini bu
   pakette çevirmek gereğinden fazla yer değiştirmek olurdu.

   Kenar boşluğu YOK — eskilerdeki margin-left bir renk sınıfının
   taşımaması gereken bir şeydi; boşluğu satırın kendisi versin. */
.pill--iyi    { background: var(--ok-50);    color: var(--ok); }
.pill--yanip  { animation: pill-yanip 1.1s ease-in-out infinite; font-weight: 700; outline: 2px solid var(--ok); }
@keyframes pill-yanip { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .pill--yanip { animation: none; } }
#uy-pencere { border: 2px solid var(--brand); border-radius: 12px; padding: 22px 26px; max-width: 520px; width: calc(100% - 32px); background: var(--yuzey); color: var(--ink-600); }
#uy-pencere::backdrop { background: rgba(28,28,28,.55); }
#uy-pencere h2 { margin: 0 0 12px; }
#uy-pencere .uy-satir { margin: 0 0 10px; }
#uy-pencere .uy-olumlu b { color: var(--ok); }
#uy-pencere #uy-tamam { margin-top: 8px; width: 100%; }
.pill--kotu   { background: var(--err-50);   color: var(--err); }
.pill--dikkat { background: var(--uyari-50); color: var(--uyari); }
.pill--bekle  { background: var(--ink-100);  color: var(--ink-600); }

.dot { width: 8px; height: 8px; border-radius: 999px; background: var(--brand); display: inline-block; }

.mini {
  background: transparent; border: 0; cursor: pointer; font: inherit; font-size: .8rem;
  color: var(--ink-500); padding: 5px 9px; border-radius: 6px;
}
.mini:hover { background: var(--ink-100); color: var(--ink-900); }
.mini.danger:hover { background: var(--err-50); color: var(--err); }
.inline { display: inline; }
/* .inline button metin görünümlüdür; gerçek düğme koyulacaksa bu sınıf kullanılır */
.form-inline { display: inline; }
.inline button { background: 0; border: 0; cursor: pointer; font: inherit; font-size: .8rem; color: var(--ink-500); padding: 0; }
.inline button:hover { color: var(--ink-900); text-decoration: underline; }
.inline button.danger:hover { color: var(--err); }

/* ------------------------------------------------------------ GENEL BAKIŞ */

/*
 * Sayı kutuları — Kayıt Defteri'ndeki kartla aynı dil:
 * solda renkli şerit, üstte büyük sayı, altında açıklama.
 * .kd-kart ile ortak tanımlı; ikisi birbirinden ayrılmasın.
 */
/*
 * SAYI KUTULARI — SABİT DÖRT SÜTUN DEĞİL, SIĞDIĞI KADAR    (paket 427)
 *
 * ÖLÇÜLEN KUSUR: ızgara sabit 4 sütundu. Beş kutulu bir bölüm (poliçe
 * özeti) ikinci satıra taşıyor, tek kalan kutu sayfa boyunca uzayıp
 * "kocaman bir düğme" gibi duruyordu. Altı kutuda aynı şey iki kez.
 *
 * auto-fit + minmax: sütun sayısına KİMSE karar vermiyor, sayfa
 * genişliği veriyor. Beş kutu geniş ekranda tek satıra sığıyor, dar
 * ekranda kendiliğinden ikiye düşüyor ve her kutu AYNI genişlikte
 * kalıyor (1fr). Ekran başına ayrı bir sınıf yazmak gerekmiyor —
 * .stat-cards--5 gibi eklerin hepsi bu yüzden gereksizleşti.
 *
 * Kutular da küçüldü: 1.62rem sayı ve 16/18 boşluk, dört kutuda bile
 * panonun yarısını yiyordu. Sayı hâlâ ekranın en büyük yazısı ama
 * başlık boyutuyla yarışmıyor.
 */
.stat-cards {
  display: grid;
  /* TABAN 104 PİKSEL — ÖLÇÜLEREK SEÇİLDİ.
     1366 piksellik bir dizüstünde panelin içerik sütunu ~700 piksel.
     Altı kutulu grup (poliçe özeti) 158 tabanla ikinci satıra taşıyordu,
     118 tabanla hâlâ taşıyordu; 104 ile tek satıra sığıyor ve kutular
     1fr sayesinde yine ~110 piksele YAYILIYOR. Taban "en fazla bu kadar
     sıkışır" sınırı, kutunun boyu değil. */
  grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
  gap: 8px; margin-bottom: 16px;
}

.stat-card, .kd-kart {
  background: var(--yuzey); border: 1px solid var(--cizgi); border-left-width: 4px;
  border-left-color: var(--mavi); border-radius: 10px; padding: 11px 13px;
  display: flex; flex-direction: column; gap: 1px;
  min-width: 0;                     /* uzun sayı kutuyu şişirmesin */
  transition: box-shadow .15s, border-color .15s;
}
a.stat-card { color: inherit; text-decoration: none; }
a.stat-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,.07); border-left-color: var(--brand); }

/* Sayı, kaynak koddaki sırası ne olursa olsun en üstte durur. */
.stat-card-value, .kd-sayi, .stat-sayi {
  order: -1; font-family: var(--font-baslik);
  font-size: 1.24rem; font-weight: 600; line-height: 1.2;
  color: var(--mavi-950); margin: 0;
  /* Sayılar sütun sütun hizalanıyor: orantılı rakam genişliği olmadan
     "11" ile "78" farklı yer tutuyor ve kutular kıpırdıyor. */
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.stat-card-label, .kd-etiket, .stat-ad {
  font-size: .76rem; line-height: 1.35; color: var(--ink-600); margin: 0;
}
.stat-card-label + .stat-card-label { color: var(--ink-400); font-size: .76rem; }

/* ══════════════════════════════════════════════════════════════════════
   KAPALI KART — GİTTİĞİ EKRAN O ROLE AÇIK DEĞİL          (paket 585)
   ══════════════════════════════════════════════════════════════════════
   KURAL ORTAK STİL DOSYASINDA VE SEBEBİ ÖLÇÜLDÜ: kapalı kart İKİ
   ekranda çiziliyor (Genel Bakış ve Bugün) çünkü ikisi de
   `go_kartlar_html()` basıyor. Kardeş hâlleri (--uyari · --hata · --ok)
   de bu dosyada duruyor, yani yeni hâl için ikinci bir yer açmak onu
   kardeşlerinden ayırmak olurdu. Tek bir ekranın kusuru olsaydı kural
   O EKRANIN kendi stil bloğuna yazılırdı (paket 567'nin kuralı).

   SAYI SOLGUNLAŞMIYOR: kapalı olan TIKLAMA, veri değil. Sayıyı da
   soluklaştırsaydım okunması gereken bir bilgiyi okunmaz yapardım. */
.stat-card--kapali {
  border-left-color: #c7ced6;
  background: var(--yuzey-2);
  cursor: default;
}
.stat-card-not {
  font-size: .72rem; line-height: 1.3; color: var(--ink-400);
  margin: 2px 0 0;
}

/* PASİF BAĞLANTI/DÜĞME — `panel_bag_ya_pasif()`'in çizdiği `<span>`.
   `pointer-events:none` YAZILMIYOR VE SEBEBİ VAR: fareyle üstüne
   gelen kişi `title` cümlesini okuyamazdı, yani niye tıklanamadığını
   söyleyen tek yer kapanırdı. `cursor:not-allowed` durumu zaten
   söylüyor. */
.is-pasif {
  opacity: .55;
  cursor: not-allowed;
  text-decoration: none;
  box-shadow: none;
}

/* Vurgu renkleri — dikkat çekmesi gereken kutular için */
.stat-card--uyari, .kd-kart--uyari { border-left-color: #e0a13a; }
.stat-card--hata,  .kd-kart--hata  { border-left-color: var(--err); }
.stat-card--ok,    .kd-kart--ok    { border-left-color: var(--brand); }

/* ══════════════════════════════════════════════════════════════════════
   KPI ŞERİDİ — DÖRT AYRI KART DEĞİL, TEK KART            (paket 620)
   ══════════════════════════════════════════════════════════════════════

   Referans tasarımı piksel sayılarak ölçüldü (1586×992): dört sayı TEK
   kartın içinde, aralarında 1 piksellik ayraç, etiket ÜSTTE, sayı
   ALTTA, sayı büyük ve MAVİ. Bizde dört ayrı kart, her birinin kendi
   kenarı/köşesi ve 4 piksellik sol şeridi vardı.

   KURAL `.stat-cards` İÇİNE KAPSANDI VE SEBEBİ ÖLÇÜLDÜ: `.stat-card`
   üç ayrı sarmalayıcıyla daha kullanılıyor — `.stat-satir`
   (panel/giderler.php) · `.stat-row` (admin/meta-maliyet.php) ·
   `.kd-ozet` + `.kd-kart` (admin/kayit-defteri.php). Kenarı ve zeminini
   KOŞULSUZ kaldırsam o yedi kutu çıplak metne dönerdi.
       BİR KURALI SARMALAYICIYA TAŞIMAK, SARMALAYICISI OLMAYAN
       KULLANIMI ÇIPLAK BIRAKIR. (609)

   AYRAÇ `gap` DEĞİL, HÜCRENİN GÖLGESİ — VE SEBEBİ SARMA. Izgara
   `auto-fit` (paket 427) ve sarıyor: beş kutu dar ekranda ikiye
   düşüyor. `gap` + sarmalayıcı zemini numarası, sarma hâlinde SON
   SATIRIN boş gözlerini ayraç rengiyle boyardı. Her hücre SOL ve ÜST
   gölgesini kendisi çiziyor; satırın ilk hücresinin sol gölgesi
   x=-1'de, ilk satırın üst gölgesi y=-1'de kalıyor ve
   `overflow:hidden` onları kırpıyor. Kaç sütun olursa olsun doğru.

   DURUM RENGİ ŞERİTTEN SAYIYA TAŞINDI VE BİLGİ KAYBOLMUYOR: üç yüz kırk
   yedi KPI kartının KIRK İKİSİ bir durum sınıfı alıyor ve o kırk ikinin
   KIRK İKİSİ de durumu sözcükle yazıyor (hepsi tarandı, elle seçilmiş
   liste değil) — "Onay bekliyor" · "Süresi geçmiş" · "Çözüldü" ·
   "Açık — kimse üzerine almadı" … `--kapali`
   kartı ayrıca `title` ve `aria-disabled` taşıyor. 4 piksellik şerit
   bir bilgi kanalı değil, sözcüğün üstüne konmuş bir vurguydu; 32
   piksellik bir sayı onu DAHA görünür yapıyor.
       BİR RENGİ TAŞIMADAN ÖNCE, TAŞIDIĞI BİLGİNİN BAŞKA BİR YERDE
       YAZILI OLDUĞUNU ÖLÇMEK ZORUNDAYIM.
   "ok" ARTIK YEŞİL: eski şeritte `--ok` = `var(--brand)`, yani
   varsayılanla aynı maviydi ve sayı rengine taşınınca ayrışmazdı.
   Beş rengin beşi de beyazda ve hover zemininde bu dosyanın kendi
   5.01 tabanının üstünde (brand 5.36 · ok 5.72 · uyari 6.01 ·
   err 5.62 · ink-400 5.33).

   KAPALI KARTIN SAYISI SOLGUNLAŞMIYOR — PAKET 585'İN ÖLÇÜLMÜŞ KARARI:
   "kapalı olan TIKLAMA, veri değil". Durumu zemin ve `--kapali` notu
   söylüyor.
       BİR YORUMUN ÖLÇÜLMÜŞ KARARINI, GÖRÜNÜM UĞRUNA BOZMAM.

   ETİKET ÜSTE `order` İLE ALINDI VE SEBEBİ ÖLÇÜLDÜ: 89 sarmalayıcıda
   kartlar İKİ AYRI kaynak sırasıyla yazılmış (292 etiket-önce · 38
   sayı-önce; 17 kart ikisinden yalnız birini taşıyor). `order` kaynak
   sırasını tamamen eziyor, yani tek kural ikisini de aynı sıraya
   getiriyor. Alt not etiketi `label ~ label`
   ile sayının ALTINDA kalıyor; bitişik olmayan hâl de (etiket, sayı,
   etiket) aynı seçiciyle yakalanıyor.
   ══════════════════════════════════════════════════════════════════════ */
.stat-cards {
  background: var(--yuzey);
  border: 1px solid var(--cizgi);
  border-radius: var(--kose);
  overflow: hidden;
  gap: 0;
}
.stat-cards > .stat-card {
  border: 0; border-radius: 0; background: transparent;
  padding: 13px 16px;
  box-shadow: -1px 0 0 var(--cizgi), 0 -1px 0 var(--cizgi);
}
.stat-cards > a.stat-card:hover {
  background: var(--ink-50);
  box-shadow: -1px 0 0 var(--cizgi), 0 -1px 0 var(--cizgi);
}
.stat-cards > .stat-card--kapali { background: var(--ink-50); }
.stat-cards > .stat-card .stat-card-value {
  order: 1; font-size: 2rem; color: var(--brand); margin-top: 1px;
}
.stat-cards > .stat-card .stat-card-label ~ .stat-card-label { order: 2; }
.stat-cards > .stat-card--uyari .stat-card-value { color: var(--uyari); }
.stat-cards > .stat-card--hata  .stat-card-value { color: var(--err); }
.stat-cards > .stat-card--ok    .stat-card-value { color: var(--ok); }

/* ═══ PAKET 712 — REFERANS TASARIM · 1. PARÇA ═══════════════════════════
   (a) Özet şeridindeki sayılar düz ve kalın: referansta sayılar serif
       değil. Yalnız şeridin içindeki sayı; başlıklar yerinde.
   (b) ALTI ÇİZGİLİ SEKME ŞERİDİ: referansta görünüm sekmeleri kutu
       değil, altı çizili yazı. Bileşen ortak (.sekme-cizgi); ilk
       kullanan Teklif Listesi. Sağdaki eylemler .sekme-sag içinde ve
       düğme olarak kalıyor. */
.stat-cards > .stat-card .stat-card-value { font-family: inherit; font-weight: 700; letter-spacing: -.01em; }
.sekme-cizgi {
  display: flex; gap: 2px; flex-wrap: wrap; align-items: center;
  border-bottom: 1px solid var(--cizgi); padding: 0 14px;
}
.sekme-cizgi > a.btn.sekme {
  border: 0; border-radius: 0; background: transparent; box-shadow: none;
  padding: 15px 12px 13px; margin-bottom: -1px;
  color: var(--ink-600); font-weight: 500;
  border-bottom: 2px solid transparent;
}
.sekme-cizgi > a.btn.sekme:hover { color: var(--ink-900); background: transparent; }
.sekme-cizgi > a.btn.sekme.is-active {
  color: var(--brand); font-weight: 600; border-bottom-color: var(--brand);
}
.sekme-cizgi > .sekme-sag {
  margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding: 8px 0;
}
/* ═══ PAKET 713 — REFERANS TASARIM · 2. PARÇA ═══════════════════════════
   (a) SEKME + SÜZGEÇ TEK KART: referansta sekmelerin hemen altında
       arama satırı aynı kartın içinde duruyor. İki kutu sınıfla
       birleşiyor (.sekme-ust üstte, .sekme-alt altta); kardeş seçicisi
       yok, aradaki boşluğu sınıfın kendisi sıfırlıyor.
   (b) Kart dışında tek başına duran şerit (.sekme-cizgi--yalin).
   (c) Kaydırılabilir tablolarda rozet ikiye bölünmüyor. */
.panel.sekme-ust {
  margin-bottom: 0; box-shadow: none;
  border-bottom-left-radius: 0; border-bottom-right-radius: 0;
}
.panel.sekme-alt {
  border-top: 0; border-top-left-radius: 0; border-top-right-radius: 0;
}
.panel.sekme-alt > .filtre-satir,
.panel.sekme-alt > form.filtre-satir {
  border: 0; border-radius: 0; padding: 0; margin-bottom: 0; box-shadow: none; background: transparent;
}
.sekme-cizgi--yalin { padding: 0; margin-bottom: 14px; }
.sekme-cizgi .sekme-sag > .hint { margin: 0; }
.tablo-kaydir .table td .pill { white-space: nowrap; }
/* ═══ PAKET 714 — REFERANS TASARIM · 3. PARÇA: ÜST ÇUBUKTA ARAMA ═══════ */
.ust-ara {
  display: inline-flex; align-items: center; gap: 8px;
  height: 38px; padding: 0 12px; min-width: 0; width: 320px; max-width: 100%;
  background: var(--yuzey); border: 1px solid var(--cizgi-koyu); border-radius: var(--kose);
  color: var(--ink-400);
}
.ust-ara:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-50); }
.ust-ara > input {
  flex: 1; min-width: 0; border: 0; outline: 0; background: transparent;
  font: inherit; font-size: .88rem; color: var(--ink-900);
}
.ust-ara > input::placeholder { color: var(--ink-400); }
@media (max-width: 900px) { .ust-ara { width: 100%; order: 9; } }
/* ═══ PAKET 715 — REFERANS TASARIM · 4. PARÇA: MÜŞTERİ KARTI ═══════════
   Solda kimlik sütunu, sağda özet şeridi + bölümler. Izgara sarmalayıcı
   tek; kimlik kutusu ilk sütunu boydan boya tutuyor, geri kalan her şey
   ikinci sütuna diziliyor. Satır aralığı 0: kutuların kendi alt boşluğu
   var, ızgara ikincisini eklemesin. */
.mk-duzen {
  display: grid; grid-template-columns: 320px minmax(0, 1fr);
  column-gap: 14px; row-gap: 0; align-items: start;
}
.mk-duzen > * { grid-column: 2; min-width: 0; }
.mk-duzen > .mk-kimlik { grid-column: 1; grid-row: 1 / span 40; }
.mk-kimlik .mk-ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.mk-avatar {
  width: 84px; height: 84px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--brand-50); color: var(--brand); font-size: 1.7rem; font-weight: 700;
}
.mk-kimlik .m360-kunye { display: block; }
.mk-kimlik .m360-kunye > div {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  padding: 11px 0; border-bottom: 1px solid var(--cizgi);
}
.mk-kimlik .m360-kunye > div > .k { margin: 0; flex: 0 0 auto; }
.mk-kimlik .m360-kunye > div > .v { text-align: right; }
.mk-kimlik .btn { width: 100%; justify-content: center; }
.mk-duzen > .stat-cards > .stat-card .stat-card-value { font-size: 1.5rem; white-space: nowrap; overflow-wrap: normal; }
.mk-duzen .table td .m360-rozet, .mk-duzen .table td .mono, .mk-duzen .table td.mono { white-space: nowrap; }
.mk-duzen > .panel { overflow-x: auto; }
.mk-sekme { scroll-margin-top: 12px; }
.mk-duzen > .panel { scroll-margin-top: 12px; }
@media (max-width: 1100px) {
  .mk-duzen { grid-template-columns: minmax(0, 1fr); }
  .mk-duzen > *, .mk-duzen > .mk-kimlik { grid-column: 1; grid-row: auto; }
}
/* ═══ PAKET 716 — REFERANS TASARIM · 5. PARÇA: PERSONEL YÖNETİMİ ═══════ */
.pg-eylem { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin-bottom: 14px; }
.pg-eylem > .btn { justify-content: center; padding-top: 14px; padding-bottom: 14px; }
.pg-ikili { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; margin-bottom: 14px; align-items: start; }
.pg-satir { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--cizgi); }
.pg-satir-yazi { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.bs-ust { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.bs-ust .f-label { margin: 0; }
.bs-ust .input { width: auto; min-width: 150px; }
.bs-ust .bs-ekle { margin-left: auto; }
.bs-ozet > .stat-card { position: relative; padding-left: 78px; min-height: 84px; text-decoration: none; color: inherit; }
.bs-ozet .stat-card-value { font-family: inherit; font-weight: 700; font-size: 1.5rem; color: var(--ink-900); white-space: nowrap; }
.bs-ikon { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: var(--brand-50); color: var(--brand); }
.bs-duzen { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 14px; align-items: start; margin-bottom: 14px; }
.bs-duzen > .panel { padding: 4px 18px 18px; margin: 0; min-width: 0; }
.bs-duzen .panel-title, .bs-alt .panel-title { padding: 14px 0 10px; margin: 0; border: 0; }
.bs-suz { display: grid; grid-template-columns: minmax(0, 1fr) 170px 130px auto; gap: 8px; margin-bottom: 12px; }
.bs-tablo td { vertical-align: middle; }
.bs-hucre { display: flex; align-items: center; gap: 12px; }
.bs-tablo tr.is-secili > td { background: var(--brand-50); }
.bs-tablo tr.is-secili .bs-av { background: var(--yuzey); }
.bs-av { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--brand-50); color: var(--brand); font-weight: 700; font-size: .85rem; }
.bs-av--buyuk { width: 58px; height: 58px; font-size: 1.1rem; }
.bs-ad { display: flex; flex-direction: column; min-width: 0; }
.bs-ad small, .bs-kim small { color: var(--ink-600); }
.bs-sayfa { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.bs-sayfa .hint { margin: 0; }
.bs-sayfa-no { display: inline-flex; gap: 6px; }
.bs-detay-ust { display: flex; align-items: center; justify-content: space-between; }
.bs-detay-ust .panel-title { margin: 0; }
.bs-kim { display: flex; align-items: center; gap: 14px; margin: 16px 0; }
.bs-kim > div { display: flex; flex-direction: column; min-width: 0; }
.bs-kim-ad { font-size: 1.15rem; }
.bs-kunye { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 0 14px; padding-bottom: 14px; border-bottom: 1px solid var(--cizgi); }
.bs-kunye dt, .bs-para dt { color: var(--ink-600); }
.bs-kunye dd, .bs-para dd { margin: 2px 0 0; }
.bs-para { margin: 0 0 14px; }
.bs-para > div { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; }
.bs-para dd { font-weight: 700; white-space: nowrap; }
.bs-odenecek { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2px 10px; padding: 14px 16px; border-radius: var(--kose); background: var(--brand-50); margin-bottom: 14px; }
.bs-odenecek > span { grid-column: 1 / -1; font-weight: 600; }
.bs-odenecek > strong { font-size: 1.5rem; color: var(--brand); white-space: nowrap; }
.bs-odenecek > small { color: var(--ink-600); }
.bs-detay .btn { width: 100%; justify-content: center; margin-bottom: 8px; }
.bs-detay-dugme { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.bs-alt { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: 14px; align-items: start; margin-bottom: 14px; }
.bs-alt > .panel { padding: 4px 18px 18px; margin: 0; }
.bs-satir { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border: 1px solid var(--cizgi); border-radius: var(--kose); margin-top: 8px; text-decoration: none; color: inherit; }
.bs-satir:hover { background: var(--yuzey-2); }
.bs-satir > span:not(.bs-sayi) { flex: 1; min-width: 0; }
.bs-satir > b { color: var(--brand); font-weight: 600; white-space: nowrap; }
.bs-sayi { flex: 0 0 auto; min-width: 30px; height: 30px; padding: 0 8px; border-radius: 15px; display: inline-flex; align-items: center; justify-content: center; background: var(--uyari-50); color: var(--uyari); font-weight: 700; }
@media (max-width: 1100px) {
  .bs-duzen, .bs-alt { grid-template-columns: minmax(0, 1fr); }
  .bs-suz { grid-template-columns: 1fr 1fr; }
}
.cs-gorunum { margin-bottom: 14px; }
.cs-oneri-ad { display: flex; flex-direction: column; gap: 2px; margin: 0 0 10px; }
.cs-oneri-ad > span { color: var(--ink-600); }
.cs-oneri-ad > strong { font-size: 1.1rem; }
.cs-neden { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-radius: var(--kose); background: var(--brand-50); margin-bottom: 8px; }
.cs-neden > b { color: var(--brand); }
.cs-takip-form .field { margin-bottom: 10px; }
.cs-huni { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 6px 0 14px; }
.cs-huni > div { display: flex; flex-direction: column; align-items: center; }
.cs-huni > div > strong { font-size: 1.3rem; }
.cs-huni > div > span, .cs-huni > i { color: var(--ink-600); font-style: normal; }
.cs-cubuk { height: 8px; border-radius: 4px; background: var(--ink-100); overflow: hidden; }
.cs-cubuk > span { display: block; height: 100%; background: var(--brand); }
.cs-ayrinti > summary { cursor: pointer; }
.bo-suz { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: flex-end; margin: 0 0 14px; }
.bo-suz label { display: flex; flex-direction: column; gap: 4px; font-size: .85rem; color: var(--ink-600); }
.bo-suz select.input { min-width: 190px; }
.bo-suz .bo-indir { margin-left: auto; }
.bo-ozet { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.stat-cards.bo-ozet > .stat-card .stat-card-value { font-size: 1.3rem; }
.bs-satir.bo-gorev-satir > span.pill { flex: 0 0 auto; }
.bo-son-satir { display: grid; grid-template-columns: 64px minmax(0, 1fr) 170px; gap: 12px; padding: 10px 0; border-top: 1px solid var(--cizgi); }
.bo-son-bas { border-top: 0; color: var(--ink-600); font-weight: 600; font-size: .85rem; }
.bo-hepsi, .bo-git { color: var(--brand); text-decoration: none; }
.bo-fark--art { color: var(--ok); }
.bo-fark--az { color: var(--err); }
.bo-bekleyen .stat-card-value { color: var(--uyari); }
.bo-serit { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 12px 18px; border-radius: var(--kose); background: var(--brand-50); margin-bottom: 14px; }
.bo-serit > strong { color: var(--brand); }
.bo-serit > span { color: var(--ink-600); }
.bo-uclu { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; align-items: start; margin-bottom: 14px; }
.bo-ikili { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 480px); gap: 14px; align-items: start; margin-bottom: 18px; }
.bo-uclu > .panel, .bo-ikili > .panel { padding: 4px 18px 18px; margin: 0; min-width: 0; }
.bo-uclu .panel-title, .bo-ikili .panel-title { padding: 14px 0 10px; margin: 0; border: 0; display: flex; align-items: center; gap: 8px; }
.bo-hepsi { margin-left: auto; font-size: .85rem; font-weight: 600; }
.bo-gorev-satir > span:first-child { flex: 1; min-width: 0; }
.bo-gorev-satir small { color: var(--ink-600); }
.bo-ilerleme { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.bo-ilerleme > .cs-cubuk { flex: 1; }
.bo-dl { margin: 0; }
.bo-dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 11px 0; border-top: 1px solid var(--cizgi); }
.bo-dl > div:first-child { border-top: 0; }
.bo-dl dt small { display: block; color: var(--ink-600); }
.bo-dl dd { margin: 0; font-weight: 700; white-space: nowrap; }
.bo-fark-satir dd { color: var(--brand); font-size: 1.2rem; }
.bo-git { display: block; text-align: right; margin-top: 12px; font-weight: 600; }
.bo-vade { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: var(--kose); background: var(--uyari-50); color: inherit; text-decoration: none; margin-top: 8px; }
.bo-vade--hata { background: var(--err-50); }
.bo-vade--bilgi { background: var(--brand-50); }
.bo-hizli-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bo-hizli-izgara > .btn { justify-content: center; padding-top: 16px; padding-bottom: 16px; }
@media (max-width: 1100px) { .bo-ikili { grid-template-columns: minmax(0, 1fr); } }
.pg-avatar {
  flex: 0 0 auto; width: 40px; height: 40px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--brand-50); color: var(--brand); font-weight: 700; font-size: .86rem;
}

.list { list-style: none; margin: 0; padding: 0; }
.list > li { border-bottom: 1px solid var(--ink-100); }
.list > li:last-child { border-bottom: 0; }
.list-empty { padding: 32px; text-align: center; color: var(--ink-400); font-size: .88rem; }
.list-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 22px; }
.list-row:hover { background: var(--ink-50); }
.list-msg { padding: 12px 22px; }
.list-msg-head { display: flex; align-items: center; gap: 8px; font-size: .88rem; }
.list-msg-date { margin-left: auto; font-size: .75rem; color: var(--ink-400); }
.list-msg-text { font-size: .84rem; color: var(--ink-500); margin-top: 3px;
                 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* --------------------------------------------------------------- TABLOLAR */

.table, .tablo, .tbl { width: 100%; border-collapse: collapse; }

/* ── TABLOLAR HER GENİŞLİKTE KAYAR, EZİLMEZ ─────────────────────────────
   319'da bu kuralı yalnızca 700 pikselin ALTINA yazmıştım ve paketin
   notunda "plaka artık hiç sarmıyor" dedim. Yanlış: telefonda sarmıyor,
   MASAÜSTÜNDE sarıyordu. 1440 piksellik ekranda ölçtüm — plaka
   "10 BY / 766" diye ikiye, araç "OPEL / NEW / ASTRA" diye üçe
   bölünüyordu, satır 92 piksele çıkıyordu.

   Kuralı sarmalayıcıya değil TABLONUN KENDİSİNE veriyorum: 89 ekranın
   43'ünde kaydırma sarmalayıcısı yok ve o tablolarda sarmama kuralı tek
   başına sütunu ekranın dışına iterdi — .panel taşanı gizlediği için
   sütun ERİŞİLEMEZ olurdu. Böylece bugün var olan ve yarın eklenecek
   her tablo aynı davranıyor, sarmalayıcıyı unutmak mümkün değil.
   Sarmalayıcısı olanlarda tablo normal tablo kalıyor; iki kat kaydırma
   kutusu oluşmuyor. */
.body table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.body table > thead, .body table > tbody { display: table; width: 100%; }
.tablo-kaydir > table { display: table; }

/* ══════════════════════════════════════════════════════════════════
   BAŞLIK İLE GÖVDENİN HİZASI — ÖLÇÜLMÜŞ BİR KUSUR DÜZELTMESİ.
   ══════════════════════════════════════════════════════════════════
   Üstteki satır sarmalayıcılı tabloyu display:table'a geri
   döndürüyor ama thead/tbody'yi DÖNDÜRMÜYORDU. İkisi ayrı birer
   "tablo" kutusu olarak kalıyor ve her biri sütun genişliğini kendi
   içeriğinden hesaplıyor — başlık gövdeyle hizalanmıyor.

   Poliçeler ekranında en belirgin: orada bir hücrede min-width:230px
   var ve o genişliği yalnızca tbody biliyor.

   .tablo-kaydir kullanan otuzdan fazla ekran birden hizalanıyor.
   Ortak .table sınıfına DOKUNULMUYOR — sarmalayıcısız tablolar
   üstteki davranışa muhtaç. */
.tablo-kaydir > table > thead { display: table-header-group; }
.tablo-kaydir > table > tbody { display: table-row-group; }

/* ══════════════════════════════════════════════════════════════════
   SARMALAYICISIZ TABLONUN BAŞLIĞI DA GÖVDEYLE HİZALANIYOR  (540)
   ══════════════════════════════════════════════════════════════════
   Üstteki düzeltme YALNIZCA .tablo-kaydir kullanan tablolara
   yazılmıştı ve notu "sarmalayıcısız tablolar üstteki davranışa
   muhtaç" diyordu. Ölçüldü: 319 tablonun 73'ünde sarmalayıcı YOK,
   61'i başlıklı ve onların başlığı gövdeyle hizalanmıyordu.
   Gerçek tarayıcıda (1440 px, fikstürlü) ölçülen sapma:
       panel/raporlar.php         140 px
       panel/kampanyalar.php      146 px
       admin/sunucu.php           163 px
       admin/motor-hazirlik.php   234 px
   Kullanıcı bunu "burası kayık duruyor" diye bildirdi: ŞABLON
   başlığının altında HİÇBİR ŞEY, OKUNAN başlığının altında
   GÖNDERİLEN sayısı yazıyordu.

   SEBEP: `display:block` olan bir tablonun thead/tbody'sine
   `display:table` verilince İKİ AYRI tablo kutusu oluşuyor ve her
   biri sütun genişliğini KENDİ içeriğinden hesaplıyor. Varsayılan
   satır-grubu değerlerine dönünce tarayıcı İKİSİNİ TEK bir anonim
   tablo kutusunda topluyor — hiza yapısal olarak garanti.

   `thead + tbody` KARDEŞ SEÇİCİSİ BİLEREK: başlığı olmayan 12
   tablonun hiza sorunu YOK ve onların tbody'sine dokunmak sütun
   genişliklerini kaydırırdı (ölçüldü: 361,446,291 → 966,80,52).
   `:has()` KULLANILMADI — desteklenmediği bir tarayıcıda kuralın
   tamamı düşer ve kusur sessizce geri gelirdi.

   :not(.tablo-kaydir) DE BİLEREK: kuralı 246 sarmalayıcılı tabloya
   da yazsaydım onların sütun genişlikleri değişiyordu (ölçüldü:
   190,133,186,147,140,158,144 → 136,110,153,121,115,130,332).
   ÖLÇMEDİĞİM EKRANLARIN SAYILARINI/GENİŞLİKLERİNİ KAYDIRMAM.

   İLK HÜCREYE width:100% — anonim tablo kutusu içeriğe göre
   büzülüyor ve panelin tamamını doldurmuyordu (ölçüldü: 1098 → 905),
   yani satır çizgileri panelin ortasında kesiliyordu. Genişliği geri
   veren tek yol ona erişen bir hücre; ilk sütun (ad/açıklama)
   boşluğun doğru yeri. Kaydırma ve geniş tablonun sütun genişlikleri
   DEĞİŞMİYOR (ölçüldü: 520 px kaydırma, sütunlar birebir aynı).

   TABLOYU GERÇEK TABLO YAPMAK (display:table) sütunları daha da
   doğru veriyordu AMA ÖLÇÜLDÜ: geniş tablo kaydırmasını KAYBEDİYOR
   (520 → 0) ve panel onu 519 piksel KIRPIYOR, yani son sütunlar
   erişilemez oluyor. `overflow` bir tablo kutusunda çalışmıyor —
   o yüzden anonim tablo yolu tutuldu. */
.body :not(.tablo-kaydir) > table > thead { display: table-header-group; }
.body :not(.tablo-kaydir) > table > thead + tbody { display: table-row-group; }
.body :not(.tablo-kaydir) > table > thead > tr > th:first-child,
.body :not(.tablo-kaydir) > table > thead + tbody > tr > td:first-child { width: 100%; }

/* İLK SÜTUNU DAR KALMASI GEREKEN TABLO: boşluk İKİNCİ sütuna.
   Ölçüldü (61 sarmalayıcısız + başlıklı tablo tarandı): yalnızca İKİ
   tablonun ilk sütunu dar kalmak zorunda — `admin/motor-hazirlik.php`
   ("#" · th width:36px) ve `admin/sunucu.php` (onay kutusu ·
   th width:34px). Üstteki kural o sütunu 80 pikselden 752 piksele
   çıkarıyordu. Satır içi `style="width:36px"` bir stil dosyasını
   YENEMEZ, o yüzden ayıklama ekranda SINIFLA yapılıyor; tabloyu
   sarmalayıcıya almak ikinci bir değişiklik daha getirirdi (o iki
   tablo bugün panelin tamamını dolduruyor, sarmalayıcı onları
   içeriğe büzerdi). */
.body :not(.tablo-kaydir) > table.hiza-ikinci > thead > tr > th:first-child,
.body :not(.tablo-kaydir) > table.hiza-ikinci > thead + tbody > tr > td:first-child { width: auto; }
.body :not(.tablo-kaydir) > table.hiza-ikinci > thead > tr > th:nth-child(2),
.body :not(.tablo-kaydir) > table.hiza-ikinci > thead + tbody > tr > td:nth-child(2) { width: 100%; }

/* Plaka, numara, tutar gibi KISA ve bölünmemesi gereken değerler
   sarmıyor. Kural <strong> ve başlıklarla sınırlı: bu ekranlarda
   bölünmemesi gereken değerler kalın yazılıyor, serbest metin düz.
   Bütün hücrelere nowrap verseydim otomasyon açıklamaları tek satıra
   dizilir, tablo iki bin piksele çıkardı. */
.body table th,
.body table td > strong,
.body table td > a > strong { white-space: nowrap; }

.table th, .tablo th, .tbl th {
  text-align: left; font-size: .8125rem; text-transform: none; letter-spacing: normal;
  color: var(--ink-400); padding: 11px 22px; border-bottom: 1px solid var(--ink-200); font-weight: 600;
}
.table td, .tablo td, .tbl td { padding: 14px 22px; border-bottom: 1px solid var(--ink-100); vertical-align: middle; }
.table tr:last-child td, .tablo tr:last-child td, .tbl tr:last-child td { border-bottom: 0; }
.table tr:hover td, .tablo tr:hover td, .tbl tr:hover td { background: var(--ink-50); }
.table .right, .table th.right,
.tablo .right, .tablo th.right,
.tbl .right, .tbl th.right { text-align: right; }
.table-title { font-weight: 600; }
.table-title:hover { color: var(--brand-600); }
.table-empty { text-align: center; color: var(--ink-400); padding: 60px 20px !important; }
.mono { font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: .8rem; color: var(--ink-500); }
.row-actions { display: flex; justify-content: flex-end; align-items: center; gap: 14px; font-size: .8rem; }
.row-actions > a { color: var(--ink-500); }
.row-actions > a:hover { color: var(--ink-900); }
.row-actions .link-brand { color: var(--brand-600); }
.row-actions .link-brand:hover { text-decoration: underline; }

/* ---------------------------------------------------------------- MODALLAR */

.modal { border: 0; border-radius: 16px; padding: 0; max-width: 92vw; box-shadow: 0 24px 60px rgba(0,0,0,.28); }
.modal::backdrop { background: rgba(28,28,28,.55); }
.modal-card { padding: 28px; width: 440px; max-width: 100%; }
.modal-card--wide { width: 640px; }
.modal-card h2 { font-size: 1.1rem; font-weight: 700; }
.modal-sub { color: var(--ink-500); font-size: .86rem; margin: 4px 0 22px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.slug-input { display: flex; align-items: center; border: 1px solid var(--ink-200); border-radius: 9px; padding-left: 12px; }
.slug-input:focus-within { border-color: var(--brand); }
.slug-input span { color: var(--ink-400); font-size: .88rem; }
.slug-input .input { border: 0; padding-left: 4px; }
.slug-input .input:focus { border: 0; }

.block-picker-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; max-height: 55vh; overflow-y: auto; }
.block-pick {
  display: flex; gap: 12px; align-items: flex-start; text-align: left;
  background: var(--yuzey); border: 1px solid var(--ink-200); border-radius: 12px;
  padding: 14px; cursor: pointer; font: inherit;
}
.block-pick:hover { border-color: var(--mavi-300); background: var(--mavi-50); }
.block-pick-icon {
  width: 34px; height: 34px; flex-shrink: 0; border-radius: 9px; background: var(--ink-100);
  display: flex; align-items: center; justify-content: center; color: var(--ink-600);
}
.block-pick strong { display: block; font-size: .88rem; }
.block-pick small { display: block; color: var(--ink-500); font-size: .78rem; }

/* ------------------------------------------------------------ BLOK EDİTÖR */

.editor-bar {
  position: sticky; top: 0; z-index: 30; background: var(--yuzey); border-bottom: 1px solid var(--ink-200);
  display: flex; align-items: center; gap: 16px; padding: 14px 36px; flex-wrap: wrap;
}
.editor-bar .back { color: var(--ink-400); font-size: .85rem; }
.editor-bar .back:hover { color: var(--ink-900); }
.title-input {
  flex: 1; min-width: 200px; font: inherit; font-size: 1.2rem; font-weight: 700; letter-spacing: -.02em;
  border: 1px solid transparent; border-radius: 9px; padding: 6px 10px; outline: none; background: transparent;
}
.title-input:hover { border-color: var(--ink-200); }
.title-input:focus { border-color: var(--brand); }
.editor-bar-actions { display: flex; gap: 10px; }

.editor-grid { display: grid; grid-template-columns: 1fr 310px; gap: 26px; align-items: start; }
.editor-side { position: sticky; top: 90px; }

.blocks-empty {
  border: 2px dashed var(--ink-200); border-radius: 13px; padding: 60px 20px;
  text-align: center; color: var(--ink-400); background: var(--yuzey);
}
.blocks-empty .btn { margin-top: 16px; }

.blk { background: var(--yuzey); border: 1px solid var(--ink-200); border-radius: 13px; margin-bottom: 12px; overflow: hidden; }
.blk-head { display: flex; align-items: center; gap: 12px; padding: 12px 18px; }
.blk-icon {
  width: 32px; height: 32px; flex-shrink: 0; border-radius: 9px; background: var(--ink-100);
  display: flex; align-items: center; justify-content: center; color: var(--ink-500); font-size: .9rem;
}
.blk-title { flex: 1; min-width: 0; text-align: left; background: 0; border: 0; cursor: pointer; font: inherit; padding: 0; }
.blk-title strong { display: block; font-size: .88rem; }
.blk-title small { display: block; font-size: .78rem; color: var(--ink-400);
                   overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.blk-actions { display: flex; gap: 2px; flex-shrink: 0; }
.blk-body { border-top: 1px solid var(--ink-100); background: var(--yuzey-2); padding: 20px 18px; }

.add-block {
  width: 100%; margin-top: 14px; padding: 16px; cursor: pointer; font: inherit; font-weight: 600;
  border: 2px dashed var(--ink-200); border-radius: 13px; background: transparent; color: var(--ink-500);
}
.add-block:hover { border-color: var(--brand); color: var(--brand); }

/* tekrarlayıcı (repeater) */
.rep-list { display: grid; gap: 12px; }
.rep-item { border: 1px solid var(--ink-200); border-radius: 10px; background: var(--yuzey); padding: 14px; }
.rep-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.rep-num { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-400); }
.rep-actions { display: flex; gap: 2px; }
.rep-body { display: grid; gap: 12px; }
.rep-body .field { margin-bottom: 0; }
.rep-add {
  width: 100%; margin-top: 12px; padding: 10px; cursor: pointer; font: inherit; font-weight: 600; font-size: .85rem;
  border: 2px dashed var(--ink-200); border-radius: 9px; background: transparent; color: var(--ink-500);
}
.rep-add:hover { border-color: var(--brand); color: var(--brand); }

/* görsel alanı */
.img-empty {
  width: 100%; height: 92px; cursor: pointer; font: inherit; font-size: .85rem; color: var(--ink-400);
  border: 2px dashed var(--ink-200); border-radius: 10px; background: transparent;
}
.img-empty:hover { border-color: var(--brand); color: var(--brand); }
.img-picked { display: flex; gap: 12px; align-items: flex-start; }
.img-picked img { width: 128px; height: 92px; object-fit: cover; border-radius: 9px; border: 1px solid var(--ink-200); }
.img-picked-actions { display: flex; flex-direction: column; gap: 4px; }
.img-setting { display: flex; gap: 14px; align-items: center; }
.img-setting img { max-height: 52px; width: auto; background: var(--ink-100); border-radius: 6px; padding: 6px 10px; }
.img-setting-actions { display: flex; gap: 6px; }

/* zengin metin */
.rt { border: 1px solid var(--ink-200); border-radius: 10px; overflow: hidden; background: var(--yuzey); }
.rt:focus-within { border-color: var(--brand); }
.rt-bar { display: flex; flex-wrap: wrap; gap: 3px; padding: 6px 8px; background: var(--ink-50); border-bottom: 1px solid var(--ink-200); }
.rt-btn { background: 0; border: 0; cursor: pointer; font: inherit; font-size: .78rem; font-weight: 600;
          color: var(--ink-600); padding: 5px 9px; border-radius: 6px; }
.rt-btn:hover { background: var(--ink-200); }
.rt-area { min-height: 150px; padding: 12px 16px; outline: none; font-size: .9rem; line-height: 1.7; }
.rt-area h2 { font-size: 1.25rem; margin: 14px 0 6px; }
.rt-area h3 { font-size: 1.05rem; margin: 12px 0 5px; }
.rt-area p { margin: 8px 0; }
.rt-area ul, .rt-area ol { margin: 8px 0; padding-left: 22px; }
.rt-area blockquote { border-left: 3px solid var(--brand); margin: 10px 0; padding-left: 14px; color: var(--ink-600); }

/* ----------------------------------------------------------------- MEDYA */

.media-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.media-manager { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; }
.media-tile { background: var(--yuzey); border: 1px solid var(--ink-200); border-radius: 12px; overflow: hidden; }
.media-tile > img { width: 100%; aspect-ratio: 4/3; object-fit: cover; background: var(--ink-50); }
.media-tile-body { padding: 12px 14px; display: grid; gap: 9px; }
.media-tile-name { font-size: .78rem; color: var(--ink-500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-tile-actions { display: flex; align-items: center; justify-content: space-between; }
.media-alt-form { margin: 0; }

.media-modal { position: fixed; inset: 0; z-index: 100; background: rgba(28,28,28,.6);
               display: flex; align-items: center; justify-content: center; padding: 24px; }
.media-card { background: var(--yuzey); border-radius: 16px; width: 900px; max-width: 100%; max-height: 84vh;
              display: flex; flex-direction: column; overflow: hidden; }
.media-head { display: flex; align-items: center; justify-content: space-between;
              padding: 16px 22px; border-bottom: 1px solid var(--ink-200); }
.media-head h2 { font-size: .98rem; font-weight: 700; }
.media-head-actions { display: flex; align-items: center; gap: 12px; }
.media-close { background: 0; border: 0; font-size: 1.3rem; color: var(--ink-400); cursor: pointer; }
.media-grid { flex: 1; overflow-y: auto; padding: 20px 22px;
              display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 14px; }
.media-item { background: var(--yuzey); border: 1px solid var(--ink-200); border-radius: 10px;
              overflow: hidden; cursor: pointer; padding: 0; font: inherit; text-align: left; }
.media-item:hover { border-color: var(--brand); }
.media-item img { width: 100%; aspect-ratio: 4/3; object-fit: cover; background: var(--ink-50); }
.media-item span { display: block; padding: 7px 10px; font-size: .74rem; color: var(--ink-500);
                   overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-empty { grid-column: 1/-1; text-align: center; color: var(--ink-400); padding: 40px 0; font-size: .88rem; }

/* ------------------------------------------------------------------ MENÜ */

.menu-rows { display: grid; gap: 12px; }
.menu-row { border: 1px solid var(--ink-200); border-radius: 10px; background: var(--yuzey-2); padding: 14px; }
.menu-row-top { display: flex; gap: 6px; align-items: center; margin-bottom: 10px; }
.menu-row-top .input { font-weight: 500; }
.menu-row-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.menu-add { margin-top: 12px; }

/* -------------------------------------------------------------- MESAJLAR */

.msg-list { display: grid; gap: 12px; }
.msg { margin-bottom: 0; }
.msg.is-read { opacity: .68; }
.msg-head { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.msg-name { display: flex; align-items: center; gap: 8px; font-size: .95rem; }
.msg-contact { display: flex; gap: 16px; font-size: .84rem; color: var(--ink-500); margin-top: 4px; flex-wrap: wrap; }
.msg-contact a:hover { color: var(--brand-600); }
.msg-actions { display: flex; align-items: center; gap: 14px; font-size: .78rem; color: var(--ink-400); }
.msg-body { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--ink-100);
            font-size: .89rem; line-height: 1.7; color: var(--ink-700); }
.msg-meta { margin-top: 10px; font-size: .74rem; color: var(--ink-400); }

/* ---------------------------------------------------------------- AYARLAR */

.settings-grid { display: grid; grid-template-columns: 1fr 320px; gap: 26px; align-items: start; }
.settings-grid aside { position: sticky; top: 20px; }
.sys-info p { display: flex; justify-content: space-between; gap: 12px; font-size: .84rem;
              padding: 6px 0; border-bottom: 1px solid var(--ink-100); }
.sys-info p:last-child { border-bottom: 0; }
.sys-info span { color: var(--ink-500); }
.sys-warn { display: block !important; background: #fff6e6; color: var(--uyari);
            padding: 10px 12px; border-radius: 8px; margin-top: 10px; line-height: 1.5; }

/* ------------------------------------------------------------------ GİRİŞ */

.login-body { background: var(--mavi-950); display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 20px; }
/* `100dvh` çifti: giriş ekranı telefonda da açılıyor ve adres çubuğu
   sayılmayan bir `100vh` orada da gereksiz bir kaydırma üretiyor. */
.login-body { min-height: 100dvh; }
.login-box { width: 380px; max-width: 100%; }
.login-brand { text-align: center; margin-bottom: 28px; }
.login-brand img { height: 38px; width: auto; margin: 0 auto; }
.login-brand p { color: rgba(255,255,255,.5); font-size: .87rem; margin-top: 18px; }
.login-card { background: var(--yuzey); border-radius: 16px; padding: 28px; box-shadow: 0 24px 60px rgba(0,0,0,.4); }
.login-card .btn { margin-top: 6px; }

/* ------------------------------------------------------------- DUYARLILIK */

/* ──────────────────────────────────────────────────────────────────────
   TELEFONDA YÖNETİM EKRANI YATAY TAŞMASIN

   Ölçüldü (390×844): admin/index.php gövdesi 640px, admin/sunucu.php 684px
   genişliğinde çiziliyordu — sırasıyla +250px ve +294px yatay kaydırma.

   İLK TEŞHİS YANLIŞTI VE ÖLÇÜM DÜZELTTİ. "Sağdaki <aside> 666px sabit"
   sanıyorduk; aside'a width:100% verince HİÇBİR ŞEY DEĞİŞMEDİ. Ölçünce
   görüldü: ızgara tek sütuna düştüğünde o TEK SÜTUN 666px oluyor, çünkü
   sütunun asgari boyu içindeki en geniş öğenin min-content boyu ve bunu
   yalnızca aside değil SOL SÜTUN da (geniş tablolar) belirliyordu.
   Yalnızca aside'ı düzeltmek, ölçmeden bırakılsaydı "yaptım ama olmadı"
   olurdu.

   min-width:0 ızgara hücresinin küçülmesine izin veriyor; overflow-x:auto
   geniş tabloyu sayfanın değil KENDİ kutusunun içinde kaydırıyor —
   .tablo-kaydir ile aynı davranış. Genel sınıflara dokunulmadı: kural
   .settings-grid'in çocuklarıyla sınırlı. */
@media (max-width: 900px) {
  .settings-grid > * { min-width: 0; overflow-x: auto; }
  /* Şeritteki teknik ayrıntı katlaması — kapalıyken satır kaplamıyor. */
  .serit-ayrinti { width: 100%; font-size: .8rem; opacity: .85; }
}

/* Katlama masaüstünde de aynı biçimde dursun. */
.serit-ayrinti summary { cursor: pointer; font-weight: 600; }
.serit-ayrinti .mono { display: block; margin-top: 4px; word-break: break-word; }

@media (max-width: 1100px) {
  .editor-grid, .settings-grid { grid-template-columns: 1fr; }
  .editor-side, .settings-grid aside { position: static; }
  .stat-cards { grid-template-columns: repeat(auto-fit, minmax(116px, 1fr)); }
}
@media (max-width: 860px) {
  .shell { flex-direction: column; align-items: stretch; }
  /* Dar ekranda menü sayfanın üstüne geçer; sabitleme burada kalkar.
     DİKEY KALIYOR: menü artık açılır gruplardan (<details>) oluşuyor,
     yatay kaydırılan bir şeritte grubun alt bağlantıları summary'nin
     ALTINA açılır ve şerit dağılır. Gruplar kapalı durduğu için dikey
     liste zaten kısa. */
  .side { width: 100%; position: static; height: auto; }
  .side-nav { flex-direction: column; overflow-x: hidden; overflow-y: auto;
              max-height: 60vh; padding-bottom: 12px; min-height: 0; }
  .side-nav > a, .nav-grup > summary { white-space: nowrap; }
  /* Dar ekranda kişi kutusu ve işlemler yan yana — dikey yığılma yer yiyor */
  .side-foot {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    padding: 12px 18px 14px; margin-top: 0;
  }
  .side-foot::before { display: none; }
  .side-kisi { flex: 1 1 180px; }
  .side-kisi-islem { margin-top: 0; flex: 0 0 auto; }
  .side-kisi-islem a { flex: 0 0 auto; padding: 8px 12px; }

  .side-logo { margin: 0; padding: 16px 18px 12px; }
  .side-hesap { margin: 0 18px 12px; }
  .two-col, .grid-2, .menu-row-grid { grid-template-columns: 1fr; }
  /* `.sayfa-bas` DA BU LİSTEDE OLMAK ZORUNDA (paket 608): band gövdenin
     yan boşluğuyla hizalı olmalı ve dar ekranda gövde 18 px'e iniyor.
     Listeye koymasaydım telefonda başlık içerikten 18 px kayardı. */
  .topbar, .body, .sayfa-bas, .editor-bar { padding-left: 18px; padding-right: 18px; }
  .hide-sm { display: none; }
  .table td, .table th { padding-left: 14px; padding-right: 14px; }
  .row-actions { gap: 10px; flex-wrap: wrap; }
  .block-picker-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .stat-cards { grid-template-columns: repeat(auto-fit, minmax(108px, 1fr)); }
}

/* ------------------------------------------------------------- ROL ÖZETİ */

.rol-ozet { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 22px; }
.rol-kart { background: var(--yuzey); border: 1px solid var(--cizgi);
  border-left: 4px solid var(--mavi-100); border-radius: 12px;
  padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; }
.rol-ad { font-size: .84rem; font-weight: 600; color: var(--ink-700); }
.rol-sayi { font-size: 1.3rem; font-weight: 700; }

.yetki-tablo { font-size: .84rem; }
.yetki-tablo th { padding: 10px 12px; }
.yetki-tablo td { padding: 9px 12px; }
.yetki-tablo th:not(:first-child), .yetki-tablo td:not(:first-child) { text-align: center; width: 90px; }
.yetki-tablo .evet { color: #0a7c46; font-weight: 700; }
/* ink-300 beyazda 2.08:1 — "yetki yok" isareti gorunmuyordu.
   ink-400 (5.30:1) yeterince soluk ama okunur. */
.yetki-tablo .hayir { color: var(--ink-400); }

@media (max-width: 1100px) { .rol-ozet { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .rol-ozet { grid-template-columns: repeat(2, 1fr); }
  .yetki-tablo { font-size: .76rem; } .yetki-tablo th:not(:first-child), .yetki-tablo td:not(:first-child) { width: 52px; } }
.ok-yesil { color: #0a7c46; }
.ok-kirmizi { color: var(--err); }


/* Sunucu bakım ekranı */
.log-kutu{background:#1e1e22;color:#d6d6dc;border-radius:10px;padding:14px 16px;
  font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  white-space:pre-wrap;word-break:break-all;overflow:auto;max-height:260px;margin:8px 0}
.log-kutu--uzun{max-height:460px}

/* Müşteri sayfası — numara tablosu dar panele sığsın */
.num-kimlik { line-height: 1.5; }
.num-kimlik > div + div { margin-top: 6px; }
.num-kimlik code { display: block; background: var(--ink-50); padding: 2px 6px; border-radius: 5px;
                   font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
                   font-size: .74rem; letter-spacing: -.2px; white-space: nowrap; }
.num-etiket { display: block; color: var(--ink-400); font-size: .68rem;
              text-transform: uppercase; letter-spacing: .04em; }
.row-actions { display: flex; gap: 10px; align-items: center; justify-content: flex-end; }
/* dar panelde iki düğme yan yana sığmıyor — alt alta koy */
.num-tablo { table-layout: fixed; width: 100%; }
.num-tablo td, .num-tablo th { overflow-wrap: anywhere; padding-left: 8px; padding-right: 8px; }
.num-tablo col.c-hat { width: 34%; }
.num-tablo col.c-kimlik { width: 46%; }
.num-tablo col.c-islem { width: 20%; }
.num-tablo .row-actions { flex-direction: column; align-items: flex-end; gap: 2px; }
/* modal hücre içinde açılıyor — hizalamayı hücreden devralmasın */
.modal, .modal-card { text-align: left; }
.modal-card .modal-actions { flex-wrap: wrap; }
.num-tablo .row-actions .mini,
.num-tablo .row-actions .inline button { white-space: nowrap; }

/* Kampanya — alıcı kaynağı seçimi */
.secim { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.secim-kart { display: flex; gap: 10px; align-items: flex-start; cursor: pointer;
              border: 1px solid var(--ink-200); border-radius: 10px; padding: 12px 14px; background: var(--yuzey); }
.secim-kart:hover { border-color: var(--brand); }
.secim-kart input { margin-top: 3px; accent-color: var(--brand); }
.secim-kart strong { display: block; font-size: .88rem; }
.secim-kart em { display: block; font-style: normal; font-size: .78rem; color: var(--ink-400); margin-top: 2px; }
.secim-kart:has(input:checked) { border-color: var(--brand); background: var(--brand-50); }
@media (max-width: 700px) { .secim { grid-template-columns: 1fr; } }

/* Sohbet sekmeleri
   ------------------------------------------------------------------------
   ŞERİT HER GENİŞLİKTE KENDİ İÇİNDE KAYIYOR (paket 627).

   Kaydırma paket 598'de yazıldı ama `@media (max-width: 700px)` bloğunun
   İÇİNDEYDİ. Taşma viewport'un değil İÇERİK SÜTUNUNUN genişliğinden
   doğuyor: altı sekme 881 piksele uzuyor ve sütun ondan dar kaldığı her
   yerde SAYFAYI genişletiyor. Gerçek Chromium'da ölçüldü (sohbetler
   ekranı): 710 pikselden 1149 piksele kadar sayfa yana kayıyor, en
   büyüğü 710'da 189 piksel. 700'ün altında eski kural kapatıyor,
   1150'den sonra şerit zaten sığıyor — yani kusur tam ARADA duruyor ve
   iki genişlikte (1440 · 390) ölçen taramaların hiçbiri onu göremedi.

       BİR KUSURU BİR GENİŞLİKTE KAPATMAK, ÖTEKİ GENİŞLİKLERDE
       KAPATMAK DEĞİLDİR.
       BİR KURAL, SORUNUN DOĞDUĞU ÖLÇÜYE BAĞLANMAK ZORUNDA — VIEWPORT
       GENİŞLİĞİNE DEĞİL, İÇERİK SÜTUNUNUN GENİŞLİĞİNE.

   1150 ve üstünde hiçbir şey değişmiyor: içerik sığdığında `auto` bir
   kaydırma çubuğu çizmiyor ve bu ölçüldü — 1440'ta şeridin genişliği,
   yüksekliği ve sekmelerin yeri BİREBİR aynı. */
.sekmeler { display: flex; gap: 4px; border-bottom: 1px solid var(--ink-200); margin-bottom: 14px;
            flex-wrap: nowrap; overflow-x: auto;
            -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.sekmeler::-webkit-scrollbar { display: none; }
.sekme { padding: 10px 18px; font-size: .88rem; font-weight: 600; color: var(--ink-500);
         border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap;
         flex: 0 0 auto; }
.sekme:hover { color: var(--ink-900); }
/* --brand ZEMİN rengi (üstüne beyaz yazı 4,7:1). Yazı rengi olarak
   kullanılınca sınırda kalıyor; --brand-600 aynı ailede ve 6,6:1. */
.sekme.is-on { color: var(--brand-600); border-bottom-color: var(--brand); }
/* OPACITY KALDIRILDI. Yazıyı saydamlaştırmak kontrastı düşürüyor ve
   bunu ölçmek zor: sayaç "(0)" pratikte 3:1'e iniyordu. Vurguyu
   kalınlık farkı zaten veriyor. */
.sekme em { font-style: normal; font-weight: 500; }

/* Sohbetteki sistem notu (üstlenme kaydı) */
.sistem-not { text-align: center; margin: 16px 0; }
.sistem-not span { display: inline-block; background: rgba(255,255,255,.85); color: var(--ink-500);
                   border-radius: 999px; padding: 5px 15px; font-size: .74rem;
                   box-shadow: 0 1px 3px rgba(0,0,0,.07); }

/* Sohbeti üstlenme çubuğu */
/* ÜÇ DURUM ÜÇ RENK. Serbest sohbet artık düz beyaz değil: "üstlenilmemiş"
   bir durum ve ekranda öyle görünmesi gerekiyor. Renk tek başına da
   bırakılmıyor — her durumun kendi cümlesi zaten yazıyor. */
.ustlen-cubuk { display:flex; align-items:center; gap:13px;
                background:linear-gradient(180deg,var(--mavi-50) 0%,var(--yuzey) 100%);
                border:1px solid var(--mavi-100); border-radius:13px;
                padding:11px 14px; margin-bottom:12px; font-size:.85rem; flex-wrap:wrap;
                box-shadow:0 1px 3px rgba(11,34,57,.05); }
.ustlen-rozet { flex-shrink:0; width:34px; height:34px; border-radius:999px;
                display:flex; align-items:center; justify-content:center;
                background:var(--ink-100); color:var(--ink-600); font-size:.9rem; font-weight:700; }
.ustlen-metin { display:flex; flex-direction:column; line-height:1.35; min-width:0; }
.ustlen-metin strong { font-size:.87rem; color:var(--ink-900); }
.ustlen-metin em { font-style:normal; font-size:.78rem; color:var(--ink-500); }
.ustlen-cubuk .form-inline { margin-left:auto; }
.ustlen-cubuk.is-benim   { background:linear-gradient(180deg,#eef9f2 0%,var(--yuzey) 100%); border-color:#c6e5d4; }
.ustlen-cubuk.is-benim   .ustlen-rozet { background:#d8f0e2; color:#0a7c46; }
.ustlen-cubuk.is-baskasi { background:linear-gradient(180deg,#fff6ee 0%,var(--yuzey) 100%); border-color:#ffdcc6; }
.ustlen-cubuk.is-baskasi .ustlen-rozet { background:#ffe6d1; color:#95531b; }

/* ══════════════════════════════════════════════════════════════════════
   TELEFONDA ÜSTLENME ÇUBUĞU 125 PİKSEL TUTUYORDU (paket 623)

   GERÇEK CHROMIUM'DA, 390 PİKSELDE ÖLÇÜLEN: rozet 34 · metin 36 · iki
   düğme 44 — ikinci satıra katlanıyor ve çubuk 125 piksel oluyordu.
   Masaüstünde aynı çubuk 62 piksel, yani fark KATLANMADAN geliyor.

   Sohbet ekranında o 125 piksel doğrudan MESAJLARIN yerinden çıkıyordu
   (ölçüldü: mesajlara kalan şerit 76 piksel · görünümün %9'u).

   BİLGİ KAYBI YOK: dairenin içindeki baş harf, hemen yanındaki cümlenin
   söylediği şeyi ikinci kez söylüyor. Düğmeler ve iki satırlık metin
   olduğu gibi duruyor.
       BİR SÜSÜ KALDIRMAK, BİLGİYİ KALDIRMAK DEĞİLDİR — AMA HANGİSİNİN
       SÜS OLDUĞU, EKRANIN KENDİ CÜMLESİNE BAKILARAK SÖYLENİR.
   ══════════════════════════════════════════════════════════════════════ */
@media (max-width: 720px) {
  /* ESKİ DEĞERLER ÖLÇÜLDÜ, VARSAYILMADI (admin.css:1438): aralık 13 ·
     iç boşluk 11/14 · alt pay 12 piksel. */
  .ustlen-cubuk { gap: 9px; padding: 8px 11px; margin-bottom: 9px; }
  .ustlen-rozet { display: none; }

  /* KATLANMANIN SEBEBİNİ İKİ KEZ YANLIŞ SÖYLEDİM; ÜÇÜNCÜDE ÖLÇTÜM.

     1) "Sebebi `.ustlen-cubuk .form-inline { margin-left:auto }`" dedim.
        Doğru ama YARIM: saran bir esnek kutuda `margin-left:auto` o öğeye
        satırdaki bütün boş alanı veriyor ve ardındaki kardeşi alt satıra
        atıyor. Payı kaldırdım — çubuk YİNE 115 piksel kaldı.
     2) Payı METNE taşıdım (`margin-right:auto`). Hesaplanmış değer
        okundu: metnin sağ payı 102 piksel, çubuk YİNE 115.
            BİR OTOMATİK PAYI BAŞKA BİR ÖĞEYE TAŞIMAK, O PAYI KALDIRMAK
            DEĞİLDİR.
     3) "340 piksel, kutu 354 — yani SIĞIYOR" dedim ve BU DA YANLIŞTI:
        354 DIŞ genişlik, iç boşluk 2×11 → kutuya kalan 332. Yani satır
        8 PİKSEL SIĞMIYOR ve katlanma otomatik paydan değil GENİŞLİKTEN
        geliyor.
            BİR SATIRIN SIĞIP SIĞMADIĞINI DIŞ GENİŞLİKLE ÖLÇMEK, İÇ
            BOŞLUĞU SAYMAMAKTIR.

     DENEDİĞİM ÇÖZÜM GERİ TEPTİ VE ÖLÇÜM YAKALADI — ÜRÜNE KONMADI.
     `flex-wrap: nowrap` + düğmeler daralmasın (`flex-shrink: 0`) yazdım;
     ÖLÇÜLEN HÂL: sohbet BAŞKASININ üzerindeyken (uzun ad · master
     rolünde "Zorla Bırak" + "Devral" + "Engelle" = 279 piksel düğme)
     metne kalan yer 24 PİKSEL ve çubuk **787 PİKSEL** oldu — yani
     düzeltmeden önceki en kötü hâlden YEDİ KAT kötü.
         BİR DÜZELTMENİN EN KÖTÜ HÂLİNİ ÖLÇMEDEN, O DÜZELTMENİN
         GÜVENLİ OLDUĞUNU SÖYLEMEM.
     `min-width` ile tabanlamak da çözüm değil (ayrıca ölçüldü): taban
     koyulduğunda aynı hâl 86 piksel YATAY TAŞMA üretiyor, yani bu
     paketin kapattığı kusurun ta kendisi geri geliyor.
         BİR YEDEK YOL, KAPATTIĞI KUSURDAN BÜYÜK BİR KUSUR AÇMAMALI.
         (553)
     Katlama ÜRÜNÜN KENDİ DAVRANIŞINDA kalıyor; dar ekranda kazanç
     yalnız iç boşluk, aralık ve rozetten geliyor (125 → 115 piksel). */
  .ustlen-cubuk .form-inline { margin-left: 0; }

  /* ── ÖLÇÜLÜP ÜRÜNE KONMAYAN KALEM VE SEBEBİ ─────────────────────────
     `.ustlen-cubuk .btn { padding: 7px }` yazdım ve HESAPLANMIŞ DEĞER
     ÖLÇÜLDÜ: düğme 44 pikselde kaldı, çünkü `.shell button` kuralı dar
     ekranda `min-height: 44px` taşıyor — dokunma hedefi olarak BİLEREK
     konmuş bir taban (o kuralın kendi yorumu "65 ekrana birden
     uygulanıyor" diyor).
         BİR DOKUNMA HEDEFİ TABANIYLA DOLGU AZALTARAK YARIŞILMAZ — VE
         ETKİSİZ OLDUĞUNU ÖLÇTÜĞÜM BİR SATIRI ÜRÜNDE BIRAKMAM. (546)
     ─────────────────────────────────────────────────────────────── */
}

/* Ayar ekranlarındaki küçük kod/klasör kutusu */
.kod-kutu { background: var(--ink-50); border: 1px solid var(--ink-200); border-radius: 8px;
            padding: 10px 12px; font-family: ui-monospace, monospace; font-size: .76rem;
            color: var(--ink-700); margin: 0 0 10px; line-height: 1.7;
            white-space: pre-wrap; word-break: break-word; }

/* ==========================================================================
   İKİ ADIMLI DOĞRULAMA
   ========================================================================== */

/* --- giriş sırasındaki kod ekranı --- */
.ia-baslik   { font-size: .98rem; font-weight: 700; color: var(--ink-900); margin: 0 0 6px; text-align: center; }
.ia-alt      { text-align: center; margin: 0 0 18px; }
.ia-orta     { text-align: center; margin-top: 14px; }
.ia-kod      { text-align: center; letter-spacing: .32em; font-size: 1.35rem; font-weight: 700;
               font-family: ui-monospace, SFMono-Regular, Menlo, monospace; padding: 14px 12px; }
.ia-kod::placeholder { letter-spacing: .32em; font-weight: 400; color: var(--ink-300); }
.ia-hatirla  { display: flex; align-items: center; gap: 9px; font-size: .84rem;
               color: var(--ink-600); margin: 0 0 16px; cursor: pointer; }
.ia-hatirla input { width: 16px; height: 16px; accent-color: var(--brand); }
.btn-link    { background: none; border: 0; padding: 0; color: var(--mavi); cursor: pointer;
               font: inherit; text-decoration: underline; }
.btn-link[disabled] { color: var(--ink-400); cursor: default; text-decoration: none; }
/* Yıkıcı bağlantı MAVİ DURMAMALI: "aç" ile "sil" aynı renkteyse, göz
   ikisini aynı türden iş sanır ve yanlış olana basar. */
.btn-link.danger { color: var(--err); }
/* Tahsilat hücresi: iki seçim ve bir düğme, satırı şişirmeden. */
.tahsilat-form { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.tahsilat-form .input-sm { padding: 4px 6px; font-size: .8rem; max-width: 130px; }
.btn-ghost.danger { color: var(--err); border-color: var(--err-200); }
.btn-ghost.danger:hover { background: var(--err-50); }

/* --- Güvenlik ekranı --- */
.ia-icerik   { max-width: 780px; }
.ia-kart     { padding: 20px 22px; margin-bottom: 16px; }
.ia-kart h3  { margin: 0 0 8px; font-size: 1rem; }
.ia-kart--vurgu { border: 1px solid var(--mavi-100); background: var(--mavi-50); }

.ia-durum    { font-weight: 700; margin: 0 0 4px; }
.ia-durum--acik   { color: var(--ok, #1e7a4b); }
.ia-durum--kapali { color: #b02a2a; }

.ia-secim    { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.ia-secenek  { display: block; width: 100%; text-align: left; background: var(--yuzey); cursor: pointer;
               border: 1px solid var(--cizgi-koyu); border-radius: 12px; padding: 16px 18px;
               transition: border-color .15s, box-shadow .15s; font: inherit; }
.ia-secenek:hover:not([disabled]) { border-color: var(--mavi-300); box-shadow: var(--golge); }
.ia-secenek[disabled] { opacity: .55; cursor: not-allowed; }
.ia-secenek-ico { display: block; font-size: 1.5rem; margin-bottom: 8px; }
.ia-secenek strong { display: block; margin-bottom: 5px; color: var(--ink-900); }
.ia-secenek span:not(.ia-secenek-ico):not(.ia-secenek-eylem) {
               display: block; font-size: .82rem; color: var(--ink-600); line-height: 1.6; }
.ia-secenek-eylem { display: block; margin-top: 10px; font-size: .82rem; font-weight: 600; color: var(--mavi); }

.ia-kur      { display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: start; margin-top: 14px; }
@media (max-width: 640px) { .ia-kur { grid-template-columns: 1fr; } }
.ia-qr       { background: var(--yuzey); border: 1px solid var(--ink-200); border-radius: 10px; padding: 8px; line-height: 0; }
.ia-qr svg   { display: block; width: 190px; height: 190px; }
.ia-secret   { font-family: ui-monospace, monospace; font-size: .95rem; font-weight: 700;
               letter-spacing: .06em; background: var(--ink-50); border: 1px solid var(--ink-200);
               border-radius: 8px; padding: 10px 12px; margin: 6px 0 16px; word-break: break-all; }

.ia-form label { display: block; font-size: .82rem; font-weight: 600; color: var(--ink-700); margin-bottom: 6px; }
.ia-form .input { margin-bottom: 12px; max-width: 300px; }

.ia-kurtarma { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px;
               margin: 14px 0; }
.ia-kurtarma span { font-family: ui-monospace, monospace; font-size: .92rem; font-weight: 700;
               background: var(--yuzey); border: 1px dashed var(--ink-300); border-radius: 8px;
               padding: 9px 10px; text-align: center; letter-spacing: .04em; }

.ia-cihaz    { list-style: none; margin: 0 0 14px; padding: 0; }
.ia-cihaz li { border-top: 1px solid var(--ink-100); padding: 10px 0; font-size: .84rem; }
.ia-cihaz li:first-child { border-top: 0; }
.ia-cihaz li span { display: block; word-break: break-word; }

/* Sunucu ekranı — hazır komut kutuları */
.komut-blok { border: 1px solid var(--ink-100); border-radius: 10px; margin-bottom: 14px; overflow: hidden; }
.komut-ust { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px;
             padding: 12px 14px; background: var(--ink-50); }
.komut-ust strong { font-size: .88rem; }
.komut-blok .log-kutu { margin: 0; border: 0; border-top: 1px solid var(--ink-100); border-radius: 0; }
.js-kopyala { white-space: nowrap; flex-shrink: 0; }

/* ==========================================================================
   YÖNETİM GENEL BAKIŞ
   ========================================================================== */

/* Üyelik şeridi */
.uye-serit { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
             gap: 14px; margin: 0 0 26px; }
.uye-kutu { display: flex; flex-direction: column; gap: 2px; background: var(--yuzey);
            border: 1px solid var(--cizgi); border-left: 5px solid var(--mavi);
            border-radius: 12px; padding: 16px 18px; text-decoration: none;
            transition: box-shadow .15s, border-color .15s; }
a.uye-kutu:hover { box-shadow: 0 6px 18px rgba(0,0,0,.07); border-left-color: var(--brand); }
.uye-kutu--uyari { border-left-color: #e0a13a; }
.uye-sayi { font-family: var(--font-baslik); font-size: 1.6rem; font-weight: 600; color: var(--mavi-950); line-height: 1.2; }
.uye-etiket { font-size: .82rem; color: var(--ink-600); }

/* Sıralama numarası */
.sira-no { display: inline-flex; align-items: center; justify-content: center;
           width: 20px; height: 20px; border-radius: 6px; background: var(--ink-50);
           color: var(--ink-500); font-size: .7rem; font-weight: 700; margin-right: 8px; }

/* Son üyelik satırı */
.uye-satir span:first-child { display: flex; flex-direction: column; gap: 2px; }
.uye-satir .muted { font-size: .76rem; }
.uye-rozet { flex-shrink: 0; }

/* 14 günlük mini grafik */
.mini-grafik { display: flex; align-items: flex-end; gap: 6px; height: 130px; }
.mg-sutun { flex: 1; display: flex; flex-direction: column; align-items: center;
            justify-content: flex-end; height: 100%; gap: 6px; cursor: default; }
.mg-cubuk { display: block; width: 100%; max-width: 30px; border-radius: 5px 5px 0 0;
            background: linear-gradient(180deg, var(--mavi-300), var(--mavi)); transition: opacity .15s; }
.mg-sutun:hover .mg-cubuk { opacity: .75; }
.mg-gun { font-size: .68rem; color: var(--ink-400); }
/* .stat-cards--5 ARTIK BİR ŞEY YAPMIYOR — VE KALDIRILMADI.
   auto-fit ızgarası sütun sayısını sayfadan alıyor; beş kutuya özel bir
   sınıf tanımlamak o kararı geri elle vermek olurdu. Sınıf, ekranlardaki
   kullanımları kırılmasın diye duruyor ama sabit sütun DAYATMIYOR. */
.stat-cards--5 { grid-template-columns: repeat(auto-fit, minmax(104px, 1fr)); }

/* ============================================================ DOSYA YÖNETİCİSİ */

.dosya-ust { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.dosya-iz { font-size: .95rem; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.dosya-iz a { color: var(--mavi); }
.dosya-iz a:hover { text-decoration: underline; }
.dosya-ayrac { color: var(--ink-400); }
.dosya-ozet { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: .82rem; }

.dosya-uyari {
  background: var(--yuzey-2); border: 1px solid var(--ink-200); border-radius: 12px;
  padding: 14px 18px; margin-bottom: 22px; font-size: .88rem; color: var(--ink-700);
}
.dosya-uyari code { background: var(--yuzey); }

.dosya-tablo td { vertical-align: middle; }
.dosya-ad { display: inline-flex; align-items: center; gap: 9px; font-weight: 600; }
.dosya-simge { font-size: 1.05rem; line-height: 1; }
.dosya-ust-link { color: var(--ink-500); font-size: .88rem; }
.dosya-ust-link:hover { color: var(--ink-900); }
.dosya-kilit { cursor: default; }

@media (max-width: 700px) {
  .dosya-ozet { align-items: flex-start; }
}

/* ============================================================= VİDEO DOSYALARI */

.video-secim-arac { display: flex; gap: 6px; flex-wrap: wrap; }
.video-tablo td { vertical-align: middle; }
.video-tablo .video-kutu { width: 17px; height: 17px; accent-color: var(--brand); cursor: pointer; }
.video-kilitli { background: var(--ink-50); }
.video-kilitli td { color: var(--ink-500); }

.video-alt {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; margin-top: 16px; flex-wrap: wrap;
}
.video-alt button[disabled] { opacity: .45; cursor: default; }
.video-alt button[disabled]:hover { background: var(--brand); }

/* ==========================================================================
   SİSTEM SAĞLIĞI
   ========================================================================== */

/* Giriş ekranı — tek büyük düğme, ne yapacağını anlatan kısa metin */
.saglik-giris { text-align: center; padding: 54px 32px; }
.saglik-ikon { font-size: 2.6rem; line-height: 1; margin-bottom: 14px; }
.saglik-giris h2 { font-size: 1.3rem; margin-bottom: 10px; }
.saglik-giris .muted { max-width: 560px; margin: 0 auto 26px; line-height: 1.7; }
.saglik-form { display: inline-flex; flex-direction: column; align-items: center; gap: 18px; }
.saglik-form .check { margin: 0; text-align: left; max-width: 460px; align-items: flex-start; }
.saglik-form .check input { margin-top: 3px; }
.saglik-form .hint { display: block; }
.btn-lg { padding: 14px 32px; font-size: 1rem; }

/* Özet şeridi — genel duruma göre renklenir */
.saglik-ozet {
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  flex-wrap: wrap; border: 1px solid var(--cizgi); border-left-width: 5px;
  border-radius: var(--kose); background: var(--yuzey); padding: 20px 24px; margin-bottom: 20px;
  box-shadow: var(--golge-sm);
}
.saglik-ozet-ic { display: flex; align-items: center; gap: 16px; }
.saglik-ozet h2 { font-size: 1.15rem; margin: 0 0 2px; }
.saglik-ozet p { font-size: .9rem; color: var(--ink-600); }
.saglik-ozet--iyi   { border-left-color: var(--brand); }
.saglik-ozet--uyari { border-left-color: #e0a13a; }
.saglik-ozet--hata  { border-left-color: var(--err); }
.saglik-rozet {
  width: 44px; height: 44px; flex-shrink: 0; border-radius: 999px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem; font-weight: 700; color: var(--ters-ink);
}
.saglik-ozet--iyi   .saglik-rozet { background: var(--brand); }
.saglik-ozet--uyari .saglik-rozet { background: #e0a13a; }
.saglik-ozet--hata  .saglik-rozet { background: var(--err); }

/* Öncelik listesi — hata ve uyarılar en üstte toplanır */
.saglik-oncelik { display: grid; gap: 10px; }
.saglik-sat {
  display: flex; align-items: flex-start; gap: 13px;
  border: 1px solid var(--cizgi); border-radius: 12px; padding: 14px 16px;
}
.saglik-sat--hata  { background: var(--err-50); border-color: var(--err-200); }
.saglik-sat--uyari { background: #fff6e6; border-color: #f2ddc0; }
.saglik-sat .btn { flex-shrink: 0; margin-left: auto; }
.saglik-govde { min-width: 0; }
.saglik-govde strong { display: block; font-size: .93rem; }
.saglik-govde p { font-size: .86rem; color: var(--ink-700); margin-top: 4px; line-height: 1.6; }
.saglik-grup { font-size: .74rem; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-500); }
.saglik-coz { color: var(--ink-600) !important; }

/* Satır başındaki durum imi */
.saglik-im {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; flex-shrink: 0; border-radius: 999px;
  font-size: .78rem; font-weight: 700; color: var(--ters-ink); background: var(--ink-400);
}
.saglik-sat--hata  .saglik-im,
.saglik-r--hata  .saglik-im { background: var(--err); }
.saglik-sat--uyari .saglik-im,
.saglik-r--uyari .saglik-im { background: #e0a13a; }
.saglik-r--iyi   .saglik-im { background: var(--brand); }
.saglik-r--bilgi .saglik-im { background: var(--mavi-300); color: var(--mavi-950); }

/* Grup tabloları */
.saglik-tablo td { padding: 12px 14px; vertical-align: top; font-size: .87rem; }
.saglik-tablo .saglik-durum { width: 34px; padding-left: 18px; }
.saglik-tablo .saglik-ad { font-weight: 600; white-space: nowrap; }
.saglik-tablo .saglik-deger { color: var(--ink-600); white-space: nowrap; }
.saglik-tablo p { line-height: 1.6; }
.saglik-tablo .saglik-coz { margin-top: 3px; }
.saglik-r--iyi .saglik-ad, .saglik-r--bilgi .saglik-ad { font-weight: 500; }

/* Kopyalanabilir düz metin rapor */
.saglik-metin summary { cursor: pointer; font-weight: 600; font-size: .9rem; }
.saglik-metin textarea {
  width: 100%; margin-top: 14px; padding: 14px; font-family: ui-monospace, monospace;
  font-size: .78rem; line-height: 1.55; border: 1px solid var(--cizgi-koyu);
  border-radius: 10px; background: var(--ink-50); color: var(--ink-800); resize: vertical;
}

@media (max-width: 820px) {
  .saglik-tablo .saglik-ad, .saglik-tablo .saglik-deger { white-space: normal; }
}

/* Ortak kaynak havuzu — satır içi "müşteriye ata" formu */
.havuz-ata { display: flex; gap: 6px; align-items: center; }
.havuz-ata .input { min-width: 170px; }

/* Meta ayar kılavuzu — kopyalanabilir adresler */
.meta-alt { font-size: .82rem; font-weight: 700; color: var(--ink-700);
            margin: 16px 0 6px; }
.meta-alt:first-child { margin-top: 0; }
.meta-liste { margin: 0; padding-left: 18px; font-size: .85rem; line-height: 1.8; color: var(--ink-700); }
.meta-liste code { font-size: .9em; }
.kod-kutu {
  background: var(--ink-50); border: 1px solid var(--cizgi); border-radius: 8px;
  padding: 10px 12px; margin: 0; font-family: ui-monospace, monospace;
  font-size: .78rem; line-height: 1.7; color: var(--ink-800);
  white-space: pre-wrap; word-break: break-all; user-select: all;
}

/* ==========================================================================
   KAYIT DEFTERİ
   ========================================================================== */

.kd-ozet { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 22px; }
@media (max-width: 900px) { .kd-ozet { grid-template-columns: 1fr; } }

/* .kd-kart / .kd-sayi / .kd-etiket yukarıda .stat-card ile birlikte tanımlı */

.kd-suzgec .grid-3 {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 0;
}
@media (max-width: 900px) { .kd-suzgec .grid-3 { grid-template-columns: 1fr; } }
.kd-suzgec .form-inline { margin-top: 10px; gap: 10px; }

.kd-tablo th { white-space: nowrap; }
.kd-tablo td { vertical-align: top; font-size: .86rem; }
.kd-tarih  { white-space: nowrap; }
.kd-nereden a { font-family: ui-monospace, monospace; font-size: .8rem; }
.kd-detay  { color: var(--ink-700); max-width: 380px; word-break: break-word; }

/* olay türü noktası */
.kd-nokta {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  margin-right: 7px; vertical-align: middle; background: var(--mavi);
}
.kd-nokta--oturum  { background: var(--mavi); }
.kd-nokta--riskli  { background: #e0a13a; }
.kd-nokta--yonetim { background: var(--brand); }

.kd-r--hata { background: #fdf4f4; }
.kd-r--hata .kd-nokta { background: var(--err); }
.kd-r--riskli td:first-child { box-shadow: inset 3px 0 0 #e0a13a; }

.kd-sayfa { display: flex; align-items: center; gap: 14px; }

/* ------------------------------------------------- hat kalitesi uyarı şeridi */

.kalite-serit {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: var(--err-50); border-bottom: 1px solid #f3c2c2; color: #8c2018;
  padding: 12px 26px; font-size: .88rem;
}
.kalite-serit strong { color: #b3261e; }
.kalite-zaman { color: #a4635e; font-size: .8rem; }
.kalite-serit a { margin-left: auto; color: #b3261e; font-weight: 600; }

/* Alt bölüm ikonları (Güvenlik / Çıkış / mesaj sesi) de aynı renkte */
.side-kisi-islem .ikon, .ses-anahtar .ikon { color: var(--menu-ikon); flex: none; }
.side-kisi-islem a { display: inline-flex; align-items: center; gap: 6px; }

/* Müşteri ödediğini bildirdi işareti (paket 104) */
.odeme-bildirildi { color: var(--brand); font-weight: 600; font-size: .72rem;
  margin-top: 2px; font-family: system-ui, sans-serif; }

/* Sessiz rozet — "Geçmiş Sohbetler" satırındaki eski okunmamış sayısı.
   Sohbetler'in yeşil rozetiyle aynı ağırlıkta olmamalı: bu bir uyarı
   değil, "burada da bir şey kalmış" bilgisi. */
.badge-sessiz {
  background: rgba(255,255,255,.12); color: #cbd6e2;
  border-radius: 999px; padding: 0 7px; font-size: .68rem;
  font-weight: 700; font-style: normal; margin-left: auto;
}

/* ------------------------------------------------- EKRAN KULLANIMI */

/* Hiç açılmayanlar etiket bulutu olarak duruyor: bunlar bir sıralama
   değil, bir liste. Tablo yapsak "en az açılan" gibi anlamsız bir
   sıra ima ederdi — hepsinin sayısı sıfır. */
.kullanim-etiketler { display: flex; flex-wrap: wrap; gap: 8px; }
.kullanim-etiket {
  background: var(--ink-100); color: var(--ink-700); border: 1px solid var(--ink-200);
  border-radius: 8px; padding: 5px 10px; font-size: .82rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Çubuk ve sayı yan yana: sayı tek başına ölçek vermiyor, çubuk tek
   başına değer vermiyor. */
.kullanim-cubuk {
  display: inline-block; width: calc(100% - 70px); height: 8px; vertical-align: middle;
  background: var(--ink-100); border-radius: 999px; overflow: hidden; margin-right: 10px;
}
.kullanim-cubuk span { display: block; height: 100%; background: var(--mavi); border-radius: 999px; }
.kullanim-sayi { font-variant-numeric: tabular-nums; font-weight: 600; font-size: .86rem; }

/* --------------------------------------------------------- SÜZGEÇ SATIRI

   Bu kurallar panelde vardı, yönetimde yoktu. admin/kullanicilar.php ve
   admin/karne.php süzgeç satırlarını zaten bu sınıflarla yazıyordu ama
   admin.css'te karşılıkları olmadığı için etiketler alt alta düşüp
   açılır kutular sayfa genişliğine yayılıyordu. Tanımlar buraya alındı;
   iki ekran da kendiliğinden düzeliyor. */

.filters {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 12px;
  padding: 14px 16px; margin-bottom: 20px; box-shadow: var(--golge-sm);
}
.filters .input { width: auto; min-width: 200px; flex: 0 1 auto; }
.filters select.input { flex: 0 0 auto; min-width: 180px; }
.filter-lab {
  display: flex; align-items: center; gap: 8px;
  font-size: .84rem; font-weight: 600; color: var(--ink-600);
}
.filter-lab .input { min-width: 150px; flex: 0 0 auto; }
.filters .quick, .quick {
  margin-left: auto; font-size: .82rem; color: var(--ink-500);
}

/* karne.php'nin kullandığı ad — aynı düzen */
.filtre-satir {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 12px;
  padding: 14px 16px; margin-bottom: 20px; box-shadow: var(--golge-sm);
}
.filtre-satir .input { width: auto; min-width: 180px; }

/* --------------------------------------------------------- TANITIM VİDEOSU */

/*
 * KURULUM KOMUTU TABLOYU GERMESİN
 *
 * .tn-komut'ta overflow-x zaten vardı ama işe yaramıyordu: kutu bir
 * tablo hücresinin içinde ve tablo kendiliğinden içeriğe göre
 * genişliyor. Kaydırma için önce KESİN bir genişlik gerekiyor;
 * hücrede olmayan da o. Sonuç: ffmpeg gibi bir ön koşul eksik olunca
 * uzun kurulum komutu tabloyu, tablo da paneli dışarı taşıyordu.
 *
 * Otomatik yerleşimde bir hücreye max-width:100% demek işe yaramaz —
 * yüzde, kendisi içeriğe göre büyüyen hücreye göre hesaplanıyor.
 * width:100% + table-layout:fixed sütun genişliklerini içerikten
 * KOPARIYOR; komut da kendi kutusunda kayıyor.
 *
 * Yalnızca bu tabloya: .table geneline dokunmak yönetimdeki onlarca
 * tablonun sütun genişliğini değiştirirdi.
 */
.tn-onkosul { width: 100%; table-layout: fixed; }
.tn-onkosul td { overflow-wrap: anywhere; }

.tn-komut {
  margin-top: 8px; background: var(--ink-950); border-radius: 8px;
  padding: 10px 12px; overflow-x: auto;
  max-width: 100%;
}
.tn-komut code {
  color: #cfe9dc; background: none; padding: 0;
  font-size: .78rem; white-space: nowrap;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.tn-senaryo { border: 1px solid var(--cizgi); border-radius: 12px;
              padding: 14px 16px; margin-bottom: 14px; }
.tn-senaryo:last-child { margin-bottom: 0; }
.tn-senaryo-ust { display: flex; align-items: baseline; justify-content: space-between;
                  gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.tn-sahneler { margin: 0 0 4px; padding-left: 20px; }
.tn-sahneler li { margin: 5px 0; font-size: .85rem; color: var(--ink-600); line-height: 1.55; }
.tn-sahneler code { font-size: .76rem; }
.rozet { display: inline-block; padding: 2px 9px; border-radius: 999px;
         font-size: .74rem; font-weight: 700; }
.rozet--iyi { background: var(--brand-50); color: var(--brand-600); }
/* Hatlar ekranındaki durum rozetleri. Renk tanımı yokken "bağlı" ile
   "kayıtlı — devralınmamış" birebir aynı görünüyordu; ayırt edilemeyen
   bir uyarı, uyarı değildir. */
.rozet--ok    { background: var(--brand-50); color: var(--brand-600); }
.rozet--uyari { background: #fdf6e6; color: #8a6a1f; }
.rozet--yok   { background: var(--ink-100); color: var(--ink-600); }
.rozet--kotu  { background: var(--err-50); color: #b02a2a; }

/* ==========================================================================
   NUMARA SEÇİMİ VE KATLANABİLİR MENÜ  (güncelleme 181)
   ========================================================================== */

/* ------------------------------------------------- Numara kutusu (menü üstü) */

/* .45 lacivert uzerinde 4.02:1 veriyordu — musteri panelinin HER
   ekraninda gorunen hesap adi satiri bu. Master hesapla bakildiginda
   bu satir cikmadigi icin onceki taramalarda hic olculmemisti.
   .62'de 6.93:1. */
.side-hesap-alt {
  font-size: .72rem; color: var(--menu-yazi-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.side-hesap--tik { text-decoration: none; cursor: pointer; }
.side-hesap--tik:hover { background: var(--menu-yuzey-2);
                         border-color: var(--menu-cizgi-2); }
.side-hesap--tik:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.side-hesap-ok {
  flex: 0 0 auto; width: 7px; height: 7px; margin-left: auto; margin-right: 3px;
  border-right: 2px solid var(--menu-yazi-3);
  border-bottom: 2px solid var(--menu-yazi-3);
  transform: rotate(-45deg);
}

/* ══════════════════════════════════════════════ MESAİ ANAHTARI

   Menünün içinde, hesap kutusunun hemen altında. Günde birkaç kez
   basılacak bir düğme, ulaşmak için sayfa değiştirmeyi gerektiriyorsa
   basılmaz.

   ÜÇ DÜĞME, AÇILIR KUTU DEĞİL: açılır kutu iki tık ister (aç, seç) ve
   o an hangi durumda olunduğunu göstermez. Burada basılı olan bir
   bakışta belli.

   BASILI DÜĞME BEYAZ ZEMİN + KOYU YAZI: koyu menüde en yüksek karşıtlık
   bu ve "seçili" olduğu RENKTEN değil ZEMİNİN TERS DÖNMESİNDEN
   anlaşılıyor — renk körlüğünde de okunur kalıyor. */
.side-mesai { margin: -4px 12px 14px; }
.side-mesai-ust {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: 0 2px 6px;
  font-size: .68rem; text-transform: uppercase; letter-spacing: .07em;
  color: var(--menu-yazi-3);
}
.side-mesai-ust em {
  font-style: normal; letter-spacing: 0; text-transform: none;
  font-size: .72rem; color: var(--menu-yazi); font-variant-numeric: tabular-nums;
}
.side-mesai-dugmeler {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px;
  padding: 3px; border-radius: 10px;
  background: var(--menu-yuzey);
  border: 1px solid var(--menu-cizgi);
}
.side-mesai-d {
  appearance: none; border: 0; cursor: pointer;
  padding: 7px 4px; border-radius: 7px;
  background: transparent; color: var(--menu-yazi-2);
  font: inherit; font-size: .7rem; font-weight: 600; line-height: 1.15;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: background .12s ease, color .12s ease;
}
.side-mesai-d:hover { background: var(--menu-yuzey-2); color: var(--menu-yazi-guclu); }
/* Secili dugme eskiden BEYAZA donuyordu; acik zeminde beyaz beyazda
   kayboluyor. Kurumsal maviye dondu (beyaz yazi 5.36:1). */
.side-mesai-d.is-on { background: var(--brand); color: var(--ters-ink); }
.side-mesai-d:focus-visible { outline: 2px solid var(--brand); outline-offset: 1px; }

/* Menü daraltılınca üç düğme yan yana sığmıyor: alt alta geçiyorlar.
   Gizlemedim — gizlenmiş bir düğme, olmayan bir düğmedir. */
.menu-dar .side-mesai { margin: 0 8px 12px; }
.menu-dar .side-mesai-ust { display: none; }
.menu-dar .side-mesai-dugmeler { grid-template-columns: 1fr; }
.menu-dar .side-mesai-d { font-size: .62rem; padding: 6px 2px; }

/* Üst çubuktaki numara düğmesi */
.hat-degistir { display: inline-flex; align-items: center; gap: 8px; }
.hat-degistir svg { flex: 0 0 auto; }
.hat-degistir-not {
  font-size: .68rem; text-transform: uppercase; letter-spacing: .07em;
  color: var(--ink-400, #8a97a6);
}

/* --------------------------------------------------------- Katlama düğmesi */

.side-tepe { display: flex; align-items: center; gap: 6px; }
.side-tepe .side-logo { flex: 1 1 auto; }

.side-katla {
  flex: 0 0 auto; width: 30px; height: 30px; margin: 4px 12px 0 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px; cursor: pointer;
  background: transparent; border: 1px solid var(--menu-cizgi-2);
  border-radius: 9px;
}
.side-katla:hover { background: var(--menu-yuzey-2); }
.side-katla:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.side-katla span { display: block; width: 13px; height: 2px; border-radius: 2px;
                   background: var(--menu-ikon); }

/* ------------------------------------------------------------- DAR MENÜ

   250 px → 84 px. İkonun ALTINDA ne olduğu yazıyor.

   ŞERİT NİYE 84 PİKSEL, 66 DEĞİL

   66 pikselde "Otomasyon" sığmıyordu; sığdırmaya çalışmak AiSensy'deki
   sonuca götürüyor — orada etiketler ortadan kesilmiş ("ds Manager",
   "ntegrations", "ll Projects"). Yarım kelime hiç kelime olmamasından
   kötü. 18 piksel daha vererek kelimeler tam görünüyor.

   Sığmayan uzun adların dar menüde kullanılacak kısa bir karşılığı var
   (_layout.php içinde 'kisa'): "Ses Kopyalama ve Video" → "Ses ve Video".
   Kesilmiş değil, kısaltılmış — ikisi aynı şey değil.
   ------------------------------------------------------------------------ */

.nav-kisa { display: none; }

.menu-dar .side { width: 84px; }

.menu-dar .side-logo { padding: 18px 0 14px; margin: 4px 6px 0; }
.menu-dar .side-logo img { height: 22px; margin: 0 auto; }
.menu-dar .side-tepe { flex-direction: column; gap: 2px; }
.menu-dar .side-katla { margin: 0 0 8px; }
.menu-dar .side-katla span:last-child { display: none; }

.menu-dar .side-hesap { margin: 8px 8px 12px; padding: 8px; justify-content: center; }
.menu-dar .side-hesap-bilgi,
.menu-dar .side-hesap-ok { display: none; }

.menu-dar .side-nav { padding-left: 5px; padding-right: 5px; }

/* Satır artık dikey: ikon üstte, yazı altta. */
.menu-dar .side-nav a,
.menu-dar .side-nav summary,
.menu-dar .side-kisi-islem a,
.menu-dar .ses-anahtar {
  flex-direction: column; justify-content: center; align-items: center;
  gap: 5px; padding: 9px 2px; text-align: center; position: relative;
}
.menu-dar .side-nav > a,
.menu-dar .side-nav > details { margin-bottom: 2px; }

/* Uzun adı gizle, kısa adı göster. font-size:0 KULLANMIYORUZ:
   o yöntem alt satırdaki kısa adı da yok ederdi. */
.menu-dar .nav-tam,
.menu-dar .nav-grup-ad,
.menu-dar .ses-yazi,
.menu-dar .side-nav .nav-ok { display: none; }

/* RENK BURADA AYRICA VERİLİYOR.
   "Site Yönetimi" satırı .muted sınıfında; o renk lacivert zeminde
   etiketi okunmaz hâle getiriyordu. Etiket DOM'da vardı ama görünmüyordu
   — AiSensy'de eleştirdiğim kesik etiketin renkle yapılmış hâli.
   Kontrast artık ölçülüyor (bkz. sınama), göz kararı bırakılmadı. */
.menu-dar .side-nav a .nav-kisa,
.menu-dar .side-kisi-islem a .nav-kisa,
.menu-dar .ses-anahtar .nav-kisa { color: var(--menu-yazi-2); }
.menu-dar .side-nav a.is-active .nav-kisa,
.menu-dar .side-nav a:hover .nav-kisa { color: var(--menu-yazi-guclu); }

.menu-dar .nav-kisa {
  display: block; max-width: 100%;
  font-size: .625rem; line-height: 1.25; letter-spacing: .01em;
  /* İki satıra kadar sarılıyor; üçüncü satır olursa şerit yüksekliği
     dağılır ve menü ekrana sığmaz. */
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; overflow-wrap: anywhere;
}

/* Rozet ikonun sağ üst köşesine: yazının yanında yer yok. */
.menu-dar .side-nav .sohbet-rozet,
.menu-dar .side-nav .badge {
  position: absolute; top: 5px; right: 12px;
  min-width: 15px; height: 15px; padding: 0 3px;
  font-size: .58rem; line-height: 15px;
}

.menu-dar .side-foot { padding-left: 5px; padding-right: 5px; }
.menu-dar .side-kisi-bilgi { display: none; }
.menu-dar .side-kisi { justify-content: center; padding: 8px; }
.menu-dar .side-kisi-islem { flex-direction: column; gap: 4px; }

/* Dar menüde grup kutuları açılmasın: açılan kutu 84 pikselin içine
   sığmıyor ve satırlar üst üste biniyor. Betik katlarken hepsini
   kapatıyor; bu kural elle açılmaya karşı ikinci koruma. */
.menu-dar .side-nav .nav-grup > *:not(summary) { display: none; }

/* Dar menü yalnızca geniş ekranlarda anlamlı: telefonda menü zaten
   sayfanın üstüne geçiyor ve tam genişlikte duruyor. */
@media (max-width: 900px) {
  .menu-dar .side { width: 100%; }
  .menu-dar .side-nav a,
  .menu-dar .side-nav summary,
  .menu-dar .side-kisi-islem a,
  .menu-dar .ses-anahtar { flex-direction: row; justify-content: flex-start;
                           text-align: left; padding: 11px 14px; }
  .menu-dar .nav-kisa { display: none; }
  .menu-dar .nav-tam { display: inline; }
  .menu-dar .side-hesap-bilgi,
  .menu-dar .nav-grup-ad,
  .menu-dar .side-kisi-bilgi,
  .menu-dar .ses-yazi { display: flex; }
  .menu-dar .side-nav .nav-ok { display: block; }
  .menu-dar .side-nav .nav-grup[open] > *:not(summary) { display: block; }
  .menu-dar .side-nav .sohbet-rozet,
  .menu-dar .side-nav .badge { position: static; }
  .side-katla { display: none; }
}

/* ------------------------------------------- ORTAK PARÇALAR (paket 199)

   Bu iki sınıf panelde zaten KULLANILIYORDU ama admin.css'te tanımlı
   değildi:

   .mn-uyari  — yalnızca assets/panel.css'te vardı (müşteri paneli).
                admin/tanitim.php onu kullanıyor; yönetim paneli o dosyayı
                yüklemediği için uyarı kutusu düz yazı olarak çıkıyordu.
   .fy-blok   — yalnızca admin/form.php içindeki <style> bloğunda vardı,
                yani o tek ekranın dışında hiçbir yerde çalışmıyordu.

   Değerler kaynaklarıyla birebir aynı; form.php'nin kendi bloğu bu
   dosyadan sonra geldiği için o ekranda görünen hiçbir şey değişmiyor.
   Değişen tek ekran admin/tanitim.php: uyarı artık kutu içinde. */

.mn-uyari {
  background: #fdf8ec; border: 1px solid #e8d5a8; color: #7a5d15;
  border-radius: 10px; padding: 12px 14px; margin: 4px 0 16px;
  font-size: .88rem; line-height: 1.55;
}
.fy-blok { display: block; font-size: .82rem; font-weight: 600; margin: 0 0 12px; }
.fy-blok .input { margin-top: 5px; font-weight: 400; }
.fy-kod { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .84rem; }

/* ==========================================================================
   TEKLİF BELGESİ (.tk-*)
   --------------------------------------------------------------------------
   admin/teklif-yazdir.php burada biçimleniyor. O sayfada panel çerçevesi
   (sol menü, üst şerit) yok; belge tek başına duruyor. Bu yüzden .tk-sayfa
   gövdeye veriliyor ve sayfa zeminini kendisi kuruyor.

   Başlıklar serif: belge kâğıda gidiyor ve belediyeye sunuluyor. Panelde
   Inter kullanılıyor ama teklif bir arayüz değil, okunan bir metin —
   serif başlık gövde metninden net ayrılıyor. Georgia her yerde kurulu,
   ek font dosyası indirilmiyor (yazdırmada bu önemli).

   NOT: @media print bu bloğun EN SONUNDA. Medya sorgusu özgüllük
   eklemez; önce yazılırsa altındaki temel kurallar onu ezer. Daha önce
   bir kez bu yüzden yazdırma düzeni hiç uygulanmamıştı.
   ========================================================================== */

.tk-sayfa {
  background: var(--ink-100);
  color: var(--ink-900);
  padding: 0 0 60px;
}

/* Araç şeridi — yalnızca ekranda. Yapışkan: belge uzun, düğme hep elde. */
.tk-arac {
  position: sticky; top: 0; z-index: 5;
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 22px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--cizgi);
}
.tk-ipucu { color: var(--ink-500); font-size: .82rem; }

/* Belge — ekranda kâğıt görünümü, yazdırmada sayfanın kendisi. */
.tk-belge {
  max-width: 820px; margin: 26px auto; padding: 54px 62px 46px;
  background: var(--yuzey); border: 1px solid var(--cizgi);
  box-shadow: var(--golge-lg);
}
.tk-belge h1, .tk-belge h2, .tk-belge h3, .tk-belge h4 {
  font-family: Georgia, 'Times New Roman', 'Nimbus Roman', serif;
  color: var(--mavi-950); text-wrap: balance; letter-spacing: -.005em;
}
.tk-belge p { margin: 0 0 12px; max-width: 68ch; }
.tk-belge p:last-child { margin-bottom: 0; }

/* ------------------------------------------------------------------ KAPAK */

.tk-kapak { padding-bottom: 30px; border-bottom: 3px solid var(--mavi-950); }
.tk-etiket {
  font-size: .7rem; font-weight: 600; letter-spacing: .14em;
  text-transform: uppercase; color: var(--brand-600); margin-bottom: 16px;
}
.tk-kapak h1 {
  font-size: 2.35rem; line-height: 1.14; font-weight: 700; margin-bottom: 16px;
}
.tk-alt { font-size: 1.06rem; line-height: 1.62; color: var(--ink-700); }

/* Künye — ad/etiket çiftleri. b üstte, etiket altta küçük ve gri. */
.tk-kunye {
  display: flex; flex-wrap: wrap; gap: 10px 34px; margin-top: 26px;
}
/* div = etiket (küçük, gri), içindeki b = değer (büyük, koyu). */
.tk-kunye > div {
  min-width: 120px;
  font-size: .72rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--ink-400);
}
.tk-kunye b {
  display: block; font-size: .98rem; color: var(--mavi-950); line-height: 1.35;
  letter-spacing: 0; text-transform: none;
  font-variant-numeric: tabular-nums;
}
/* E-posta adresi telefondan uzun; künyeyi taşıtmasın diye bir tık küçük. */
.tk-kunye b.tk-kucuk { font-size: .84rem; }

/* ------------------------------------------------------------------ BÖLÜM */

.tk-bolum { margin-top: 42px; }
.tk-bolum > h2 {
  font-size: 1.55rem; font-weight: 700; margin-bottom: 14px;
  padding-bottom: 8px; border-bottom: 1px solid var(--cizgi-koyu);
}
.tk-bolum > h3 { font-size: 1.12rem; font-weight: 700; margin: 30px 0 10px; }
.tk-giris { font-size: 1rem; color: var(--ink-700); line-height: 1.68; }

/* Karşılaştırma — iki sütun. Solda bugünkü durum, sağda Pervis. */
.tk-iki {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 20px;
}
.tk-karsi {
  padding: 18px 20px; border: 1px solid var(--cizgi);
  border-top: 3px solid var(--ink-300); background: var(--ink-50);
}
.tk-karsi--iyi { border-top-color: var(--brand); background: var(--brand-50); }
.tk-karsi h4 { font-size: 1rem; font-weight: 700; margin-bottom: 10px; }
.tk-karsi ul { margin: 0; padding-left: 18px; }
.tk-karsi li { margin-bottom: 7px; line-height: 1.55; color: var(--ink-700); }
.tk-karsi li:last-child { margin-bottom: 0; }

/* Özellik satırı — numaralı. Numara sırayı değil, sayımı gösteriyor;
   liste bir süreç değil, bu yüzden ok/çizgi yok. */
.tk-ozellik {
  display: flex; gap: 16px; padding: 14px 0;
  border-bottom: 1px solid var(--cizgi);
}
.tk-ozellik:last-child { border-bottom: 0; }
.tk-no {
  flex: 0 0 auto; width: 30px;
  font-size: .82rem; font-weight: 700; color: var(--brand-600);
  font-variant-numeric: tabular-nums; padding-top: 2px;
}
.tk-ozellik b { display: block; font-size: 1rem; color: var(--mavi-950); margin-bottom: 3px; }
.tk-ozellik p { color: var(--ink-700); margin: 0; }

/* Referans kartları */
.tk-ref {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 18px;
}
.tk-ref > div {
  padding: 12px 14px; background: var(--mavi-50);
  border-left: 3px solid var(--mavi);
}
.tk-ref b {
  display: block; font-size: .95rem; color: var(--mavi-950); line-height: 1.3;
}
.tk-ref span { font-size: .78rem; color: var(--ink-500); }

/* Vurgu kutusu — ölçülmüş sonuçlar ve serbest not */
.tk-kutu {
  margin-top: 20px; padding: 18px 22px;
  background: var(--brand-50); border-left: 4px solid var(--brand);
}
.tk-kutu h4 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
.tk-kutu p { color: var(--ink-800); margin: 0; }

/* ----------------------------------------------------------------- TABLO */

.tk-tablo {
  width: 100%; border-collapse: collapse; margin-top: 18px; font-size: .92rem;
}
.tk-tablo th, .tk-tablo td {
  padding: 10px 12px; border-bottom: 1px solid var(--cizgi); vertical-align: top;
}
.tk-tablo thead th {
  text-align: left; font-size: .72rem; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink-500); font-weight: 600;
  border-bottom: 2px solid var(--cizgi-koyu);
}
.tk-tablo tbody th { text-align: left; font-weight: 600; color: var(--mavi-950); }
.tk-tablo .sag { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* Öne çıkan satır: SMS'in karşılığı olan bilgilendirme kalemi. Teklifin
   en çok konuşulan rakamı bu, gözden kaçmasın. */
.tk-tablo tbody tr.one { background: var(--brand-50); }
.tk-tablo tbody tr.toplam td {
  border-top: 2px solid var(--mavi-950); border-bottom: 0;
  font-weight: 700; color: var(--mavi-950); font-size: 1rem;
}
.tk-not { margin-top: 10px; font-size: .84rem; color: var(--ink-500); line-height: 1.6; }

/* Kurulum adımları */
.tk-adim { margin: 18px 0 0; padding: 0; list-style: none; counter-reset: tkadim; }
.tk-adim li {
  position: relative; padding: 0 0 16px 42px; counter-increment: tkadim;
  border-left: 1px solid var(--cizgi); margin-left: 13px;
}
.tk-adim li:last-child { border-left-color: transparent; padding-bottom: 0; }
/* Adımların altındaki not, listenin son maddesi gibi görünüyordu:
   aynı sol girintide ve hemen bitişikti. Ayrıldı. */
.tk-adim + .tk-not { margin-top: 18px; }
.tk-adim li::before {
  content: counter(tkadim);
  position: absolute; left: -14px; top: 0;
  width: 27px; height: 27px; border-radius: 50%;
  background: var(--mavi-950); color: var(--ters-ink);
  font-size: .78rem; font-weight: 700; line-height: 27px; text-align: center;
}
.tk-adim b { display: block; font-size: 1rem; color: var(--mavi-950); margin-bottom: 3px; }
.tk-adim p { color: var(--ink-700); margin: 0; }

/* Kapanış */
.tk-kapanis {
  padding: 26px 28px; background: var(--mavi-950); color: var(--ters-ink);
}
.tk-kapanis h3 { color: var(--ters-ink); font-size: 1.3rem; margin-bottom: 10px; }
.tk-kapanis p { color: #cfe0ee; }
.tk-kapanis .tk-kunye b { color: var(--ters-ink); }
.tk-kapanis .tk-kunye > div { color: #8fb4d2; }

/* Dip not */
.tk-dip {
  margin-top: 40px; padding-top: 16px; border-top: 1px solid var(--cizgi);
  font-size: .76rem; color: var(--ink-400); line-height: 1.6;
}
.tk-dip p { max-width: none; margin-bottom: 6px; }

/* Dar ekran — teklif ekranda da açılabiliyor. */
@media (max-width: 760px) {
  .tk-belge { margin: 0; padding: 30px 20px; border-left: 0; border-right: 0; box-shadow: none; }
  .tk-kapak h1 { font-size: 1.8rem; }
  .tk-iki, .tk-ref { grid-template-columns: 1fr; }
  .tk-tablo { font-size: .86rem; }
  .tk-tablo th, .tk-tablo td { padding: 8px 7px; }
}

/* ---------------------------------------------------------------- YAZDIR */
/* Bu blok dosyanın sonunda kalmalı — yukarıdaki gerekçeye bakın. */
@media print {
  @page { size: A4; margin: 16mm 14mm; }

  .tk-sayfa { background: var(--yuzey); padding: 0; }
  .tk-arac { display: none; }
  .tk-belge {
    max-width: none; margin: 0; padding: 0;
    border: 0; box-shadow: none;
  }

  /* Zeminleri tarayıcı varsayılan olarak basmıyor; teklifte renkli
     kutular anlam taşıyor (yeşil = Pervis tarafı, koyu = kapanış). */
  .tk-karsi, .tk-karsi--iyi, .tk-kutu, .tk-ref > div,
  .tk-kapanis, .tk-tablo tbody tr.one {
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }

  /* Bölüm ortasından sayfa kırılmasın; ama HER bölüme zorla sayfa
     başlatmak da yapılmıyor — denendi, yarısı boş 23 sayfa çıktı. */
  .tk-bolum, .tk-karsi, .tk-kutu, .tk-kapanis,
  .tk-ozellik, .tk-adim li, .tk-ref > div { break-inside: avoid; }
  .tk-bolum > h2, .tk-bolum > h3 { break-after: avoid; }
  .tk-tablo thead { display: table-header-group; }
  .tk-tablo tr { break-inside: avoid; }

  .tk-kapak { break-after: avoid; }
  .tk-dip { break-before: avoid; }

  a { color: inherit; text-decoration: none; }
}

/* ═══════════════════════════════ TELEFONDA MENÜ — YÖNETİM (paket 243)

   ÖLÇTÜM: 390×844'lük bir telefonda yönetim paneli açıldığında içerik
   Genel Bakış'ta 573., Sistem Sağlığı'nda 692. pikselde başlıyordu —
   ekranın tamamı menü, içerik bir sonraki ekranda. Yönetici her sayfa
   açılışında önce kendi menüsünü geçmek için kaydırıyordu.

   Aynı sorunu müşteri panelinde 240'ta düzeltmiştik; düzen oradan
   taşındı ki iki panel zamanla birbirinden ayrışmasın.

   Masaüstünde hiçbir şey değişmiyor: aşağıdaki kuralların tamamı
   900 pikselin altında geçerli. */


/* ═══════════════ MENÜ GÖVDESİ — MASAÜSTÜNDE KAYDIRMAYI GERİ GETİRİYOR

   BU BENİM AÇTIĞIM BİR KUSURDU. Telefondaki hamburger menü için menüyü
   .side-govde diye bir kutuya sardım (240 ve 243). O kutu, kenar çubuğunun
   dikey flex zincirinde bir HALKA ve varsayılan ayarlarıyla içeriği kadar
   uzuyor — yani 100dvh'lik çubuğu taşırıyor.

   Sonuç: .side-nav'ın overflow-y:auto kuralı hiç devreye girmiyordu,
   çünkü kendisine sınırlı bir yükseklik gelmiyordu. ÖLÇTÜM: 1400×900'de
   menünün son maddesinin alt kenarı 1000. pikselde — ekranın dışında ve
   kaydırmanın hiçbir yolu yok. Kullanıcının "hiç kaymıyor" dediği şey bu.

   Zinciri tamamlıyoruz: gövde de küçülebilen bir flex halkası olsun.
   min-height:0 şart — flex çocuklarının varsayılan min-height:auto değeri
   küçülmeyi engelliyor ve overflow hiç çalışmıyor. */
.side-govde {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

.side-mobil { display: none; }

@media (max-width: 900px) {
  /* Menü yanda değil üstte: yan yana iki sütun 390 pikselde zaten yan
     yana durmuyordu. */
  .shell { display: block; }

  .side {
    width: 100%;
    height: auto;
    position: sticky;
    top: 0;
    z-index: 40;
  }

  /* Üst şerit: logo + menü düğmesi. Tek satır. */
  .side-tepe { padding: 4px 8px; }
  .side-logo { padding: 12px 14px; margin: 0; }
  .side-logo img { height: 24px; }

  .side-mobil {
    display: flex; flex-direction: column; justify-content: center; gap: 4px;
    width: 44px; height: 44px; flex: 0 0 auto;
    margin-right: 6px;
    background: transparent; border: 0; border-radius: 10px;
    cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  .side-mobil:hover  { background: var(--menu-yuzey-2); }
  .side-mobil:active { background: var(--menu-cizgi-2); }
  .side-mobil:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
  .side-mobil-cizgi {
    display: block; height: 2px; width: 20px; margin: 0 auto;
    background: var(--menu-ikon); border-radius: 2px;
    transition: transform .18s ease, opacity .18s ease;
  }

  /* Açıkken çarpıya dönüşüyor: düğmenin bir de kapatma düğmesi olduğu
     ancak böyle anlaşılıyor. */
  .menu-acik .side-mobil-cizgi:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .menu-acik .side-mobil-cizgi:nth-child(2) { opacity: 0; }
  .menu-acik .side-mobil-cizgi:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

  /* Katlanan bölüm: menü ve alt bilgi. */
  .side-govde { display: none; }

  /* ═══ MENÜ AÇILDIĞINDA EKRANA GELİYOR — PAKET 625
     ═══════════════════════════════════════════════════════════════════
     ÖLÇÜLEN KUSUR (390×844 · gerçek Chromium): kullanıcı sayfayı 600
     piksel kaydırıp menü düğmesine bastığında menü EKRANIN TAMAMEN
     DIŞINDA doğuyordu — menünün üst kenarı −2320, ilk bağlantı −2144 ve
     BASTIĞI DÜĞME −2370 pikselde. Yani düğmeye basıyor, hiçbir şey
     görmüyor; üstelik sayfa 600'den 2376'ya SIÇRIYOR, çünkü 1776
     piksellik menü içeriğin ÜSTÜNE akışa giriyordu.
         BİR MENÜ, BASILAN DÜĞMENİN YANINDA AÇILMAK ZORUNDA.

     İKİ ESKİ ÇARE DE ÖLÇÜLMÜŞTÜ VE İKİSİNİN DE BEDELİ YAZILIYDI:
       · menüyü akışa almak (bu kusuru doğuran karar) — sebebi, ekrandan
         uzun bir listeyi SABİT bir kutuya koymanın kaydırmayı
         imkânsızlaştırmasıydı;
       · menüye İÇ KAYDIRMA vermek — sebebi, sayfa kaydırmasıyla yarışan
         ikinci bir kaydırma alanının parmağı şaşırtmasıydı
         (ÖLÇÜLDÜ: menü içeriği 1776 px, kutu 787 px).
         O SAYIYI BİR KEZ YANLIŞ YAZDIM ("menü 2250 px") ve düzeltmesi
         bir ölçümle geldi: telefonda menü AKORDEON — panel/_layout.php
         bir grup açılınca ötekileri kapatıyor, yani "bütün gruplar
         açık" hâli TELEFONDA HİÇ DOĞMUYOR; on dört grubu açmaya
         çalışan bir ölçümü ürün geri alıyor (14 → 1).
             BİR FİKSTÜR, ÜRÜNÜN KENDİ KURALINA AYKIRI BİR HÂL
             KURUYORSA ÜRÜN ONU GERİ ALIR — VE O FİKSTÜRLE ÖLÇÜLEN ŞEY
             "EN KÖTÜ HÂL" DEĞİLDİR.
     ÜÇÜNCÜ TASARIM İKİSİNİN BEDELİNİ DE ÖDEMİYOR: menü artık GÖRÜNÜME
     sabitlenen bir ÖRTÜ (`position: fixed`). Sayfa BÜYÜMÜYOR, yani
     sıçrama yok ve kaydırma konumu korunuyor; örtü görünümün tamamını
     kapladığı için arkadaki sayfayla YARIŞAN bir kaydırma da yok —
     `overscroll-behavior: contain` örtü bitince kaydırmanın sayfaya
     zincirlenmesini kesiyor.
     Örtü şeridin ALTINDAN başlıyor (`--mobil-ust` şeridin ÖLÇÜLEN
     yüksekliği · panel/_layout.php) ve şerit yapışkan kalıyor, yani
     KAPATMA DÜĞMESİ her zaman ekranda. */
  .menu-acik .side-govde {
    display: flex; flex-direction: column;
    position: fixed;
    left: 0; right: 0;
    top: var(--mobil-ust, 56px);
    bottom: 0;
    background: var(--menu-zemin);
    border-top: 1px solid var(--menu-cizgi);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 10px;
    /* AÇILIŞ GEÇİŞLE DEĞİL ANİMASYONLA: `display: none → flex` bir
       geçişle (transition) canlandırılamıyor, o yüzden menü PAT diye
       geliyordu. Örtü yeni çizildiği için animasyon kendiliğinden
       koşuyor ve `@starting-style` gibi yeni bir özelliğe ihtiyaç yok.
       180 ms, hamburger çizgilerinin kendi süresiyle AYNI (yukarıda
       `transition: transform .18s`), yani iki hareket birlikte bitiyor. */
    animation: menu-ac .18s ease-out;
  }
  @keyframes menu-ac {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: none; }
  }

  /* Şerit YAPIŞKAN KALIYOR (eskiden `position: static` oluyordu).
     Örtü `.side`'ın akışından çıktığı için şerit 56 pikselde kalıyor ve
     "ekrandan uzun listeyi sabit kutuya koymak" hâli hiç doğmuyor. */

  /* Açıkken menü listesi kendi içinde kaymıyor: KAYAN ŞEY ÖRTÜ.
     İki ayrı kaydırma alanı iç içe girince telefonda hiçbiri düzgün
     çalışmıyor. */
  .menu-acik .side-nav { overflow: visible; max-height: none; flex: 0 0 auto; }

  /* Dokunma hedefleri: 44 pikselin altındaki satırlara telefonda
     isabet ettirmek zor. */
  .side-nav a, .side-nav summary { min-height: 44px; }
}

@media (max-width: 900px) and (prefers-reduced-motion: reduce) {
  .side-mobil-cizgi { transition: none; }
  /* Hareketi azalt diyen kullanıcıda menü ANINDA geliyor: animasyonun
     kendisi bir bilgi taşımıyor, yalnız açılışı yumuşatıyor. */
  .menu-acik .side-govde { animation: none; }
}

/* GÜNCELLEME ÇIKTISI — ÜÇ DURUM, ÜÇ RENK.
   "Çalışmadı" ile "çalıştığını doğrulayamadım" aynı şey değil; ikisini
   aynı kırmızıyla göstermek, bilmediğimiz bir şeyi biliyormuş gibi
   söylemek olur. Doğrulanamayan sarı: bakılması gerekiyor, ama ortada
   bir hata olduğu iddiası yok. */
.guncelleme-cikti         { border-left: 3px solid var(--cizgi); }
.guncelleme-cikti.tamam   { border-left-color: var(--ok); }
.guncelleme-cikti.dikkat  { border-left-color: var(--uyari); }
.guncelleme-cikti.hata    { border-left-color: var(--err); }

/* Radyo/onay kutusu satırı — seçeneğin gerekçesi metnin altında.
   Seçeneği tek kelimeyle sunmak, kullanıcıyı tahmin etmeye zorlar. */
.secim-satir {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 10px; border: 1px solid var(--cizgi); border-radius: 10px;
  margin-bottom: 8px; cursor: pointer;
}
.secim-satir:hover { background: var(--ink-50); }
.secim-satir input { margin-top: 3px; }
.secim-satir > span { display: block; }
.secim-satir .sebep { display: block; margin-top: 2px; }

/* ==========================================================================
   TELEFON DÜZENİ — PAKET 319
   ==========================================================================

   ÖLÇTÜĞÜM ÜÇ SORUN, ÜÇ KURAL. Hepsi yalnızca dar ekranda çalışıyor;
   masaüstünde tek piksel değişmiyor.

   Ölçüm (iPhone 12, 390 piksel):
     · Sistem Durumu'nda 1.672 piksel açıklama metni vardı — iki tam
       telefon ekranı. İlk veriye 668 pikselde ulaşılıyordu.
     · Teklif listesinde ilk teklife 799 pikselde ulaşılıyordu.
     · Kalite şeridi her ekranda üç satır kaplıyordu.
   ========================================================================== */

@media (max-width: 700px) {

  /* ---- 1 · TABLOLAR EZİLMİYOR, KAYIYOR ----------------------------------
     Beş sütunlu bir tablo 390 piksele sıkışınca kelimeler dört satıra
     bölünüyor ve sütunlar hizasını kaybediyor: tablo görünüyor ama
     okunmuyor. Ezilmek yerine KAYSIN.

     Otuz ekranda tablolar sarmalayıcısız duruyor; hepsini tek tek
     sarmalamak yerine kuralı tabloların kendisine veriyorum. Böylece
     bugün var olan ve yarın eklenecek her tablo aynı davranıyor —
     sarmalayıcıyı unutmak mümkün olmuyor. */
  .body table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  /* İç tablo en az bu genişlikte kalıyor; altına düşen ekranda parmakla
     kaydırılıyor. min-width vermeseydim "display:block" tabloyu yine
     ekrana sığdırır ve ezilme devam ederdi. */
  /* 620 PİKSEL, 520 DEĞİL. 520'de sütunlar sığıyor ama hücrelerin İÇİ
     sarıyordu: plaka "10 / BY / 766" diye üç satıra bölünüyordu. Bir
     plakanın üç satıra bölünmesi, tabloyu okunur saymanın sınırı. */
  .body table > thead,
  .body table > tbody { display: table; width: 100%; min-width: 620px; }
  /* Zaten sarmalayıcısı olan tablolar iki kat kaydırma kutusu olmasın:
     dış kutu zaten kaydırıyor, tablo normal tablo olarak kalıyor.

     min-width TABLONUN KENDİSİNE yazılıyor, thead/tbody'ye değil. Önce
     thead/tbody'ye yazmıştım ve hiçbir etkisi olmadı: normal bir tabloda
     yerleşimi <table> yönetiyor, min-width'i iç gruplara vermek sessizce
     yok sayılıyor. Ekranda plaka hâlâ "10 / BY / 766" diye üç satıra
     bölünüyordu — kural vardı, etkisi yoktu. */
  .tablo-kaydir > table { display: table; min-width: 620px; }
  /* Dar ekranda da başlık gövdeyle hizalı kalsın — gerekçe yukarıda,
     masaüstü kuralının yanında yazılı. min-width tablonun kendisinde
     kaldığı için buradaki geri döndürme onu bozmuyor. */
  .tablo-kaydir > table > thead { display: table-header-group; }
  .tablo-kaydir > table > tbody { display: table-row-group; }

  .table th, .table td { padding: 11px 14px; }

  /* PLAKA, NUMARA VE TARİH SARMASIN.
     Tablo zaten yana kayıyor; dar sütuna sıkışan bir plaka "10 / BY /
     766" diye üç satıra bölünüyordu. Bir plakanın üç satıra bölünmesi,
     tabloyu okunur saymanın sınırı.

     Kural <strong> ve başlıklarla sınırlı: bu ekranlarda kısa ve
     bölünmemesi gereken değerler (plaka, numara, tutar) kalın yazılıyor,
     serbest metin ise düz. Bütün hücrelere nowrap verseydim otomasyon
     açıklamaları tek satıra dizilir ve tablo iki bin piksele çıkardı. */
  .body table th,
  .body table td > strong,
  .body table td > a > strong { white-space: nowrap; }

  /* ---- 2 · UZUN AÇIKLAMA METNİ KATLANIYOR ------------------------------
     Açıklamalar masaüstünde bir kez okunup geçilen faydalı metinler;
     telefonda her açılışta kullanıcıyla işi arasına giren bir duvar.
     Silmiyorum — katlıyorum. İlk iki satır görünüyor, dokununca
     tamamı açılıyor.

     Katlama işini _layout.php'deki küçük bir betik yapıyor. Betik
     çalışmazsa metin bugünkü gibi tam görünüyor: bozulma yönü güvenli. */
  .body details.hint-kat > summary { cursor: pointer; list-style: none; }
  .body details.hint-kat > summary::-webkit-details-marker { display: none; }
  /* KIRPILAN KISIM: yalnızca metin. Etiket dışarıda kaldığı için
     kırpmadan etkilenmiyor ve her zaman görünüyor. */
  .body .hint-kirp {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .body details.hint-kat[open] .hint-kirp { -webkit-line-clamp: unset; }
  .body .hint-ac {
    display: inline-block; margin-top: 4px;
    color: var(--brand-600); font-weight: 600; font-size: .86rem;
  }
  .body details.hint-kat[open] .hint-ac { display: none; }

  /* ---- 3 · KALİTE ŞERİDİ: TELEFONDA GEREKÇE KALIR, BAŞLIK KISALIR -----
     ESKİDEN AÇIKLAMA GİZLENİYORDU ve geriye GEREKÇESİZ BİR ALARM
     kalıyordu: "itibar puanınız düştü" — niye düştüğü, ne olacağı ve ne
     yapılacağı telefonda hiç yazmıyordu. Sebebini söylemeyen bir alarm,
     alarm değil korku üretir; kullanıcı da onu okumayı bırakır.
     Yer kazancı artık BAŞLIKTAN geliyor (iki satırla sınırlı) ve şerit
     alt alta diziliyor. Açıklama duruyor. */
  .hk-serit { gap: 6px; flex-direction: column; align-items: flex-start; }
  .hk-serit-ana { display:-webkit-box; -webkit-box-orient:vertical;
                  -webkit-line-clamp:2; overflow:hidden; }
  .hk-serit-bag { margin-left: 0; }
}

/* Şablonlar ekranındaki hazır metin kartları (paket 319). */
.ps-kart { border: 1px solid var(--ink-200); border-radius: 10px; padding: 14px; margin-bottom: 12px; }
.ps-kart textarea[readonly] { background: var(--ink-50); cursor: text; }

/* @@TELEFON-BLOK-BASI@@ — buradan aşağısı YALNIZCA dar ekran kuralları.

   Aşağıdaki tek satırlık kural bir İŞARET; hiçbir elemanı
   biçimlendirmiyor (o kimlikte bir eleman yok). Silmeyin:
   test/mobil-masaustu.mjs sayfayı açtıktan sonra bu işareti stil
   sayfasında buluyor ve ondan SONRAKİ bütün kuralları CSSOM'dan
   siliyor — yani masaüstünü "telefon kuralları hiç yokmuş gibi" aynı
   sayfada, aynı veriyle bir kez daha ölçüyor.

   NİYE BÖYLE: önce dosyayı metin olarak kesip <style> ile takmayı
   denedim ve sınama 66 ekranın 66'sında kırmızı yandı. Sebep CSS
   değildi: <style> içindeki `url('fonts/…')` adresleri belgeye göre
   çözülüyor, /panel/ altında yazı tipleri bulunamıyor ve bütün sayfa
   yedek yazı tipiyle çiziliyordu. Kuralı silmek, dosyayı taşımaktan
   güvenli. */
#telefon-blok-basi { --telefon-blok: 1; }

/* ==========================================================================
   TELEFONDA KULLANILABİLİRLİK — ÖLÇÜLMÜŞ SEBEPLER
   ==========================================================================

   ÖNCE ÖLÇTÜM, SONRA YAZDIM. Ölçüm dosyası: test/mobil-olcum.mjs
   (390×844, panel/*.php'den üretilen 66 ekran). Masaüstünün
   bozulmadığını ayrı bir dosya sınıyor: test/mobil-masaustu.mjs
   (1440×1100, 66 ekranın anahtar elemanlarının konum/boyutu).

   ÖLÇÜM — DÜZELTMEDEN ÖNCE
     · yatay taşan ekran ............ 2   (sohbetler +180px, raporlar +36px)
     · 44px altı dokunma hedefi ..... 825
     · 14px altı gövde yazısı ....... 598

   EN ÇOK TEKRAR EDEN SEBEPLER — ve her birinin tek kuralla çözümü:

     1. FORM ALANI VE DÜĞME KISA (yaklaşık 400 hedef)
        .input 41–44px, .btn 36–38px, tablo içi bağlantı 16–21px çiziliyordu.
        Parmak fare değil: 44 pikselin altındaki hedefe telefonda
        nişan alınamıyor. Kural elemanların KENDİSİNE veriliyor,
        ekranlara tek tek değil.

     2. KÜÇÜK YARDIM METNİ (598 yazı)
        .hint 12.5px, .muted 13.6px, .sebep 12.5px, .mono 12.8px.
        Masaüstünde bir kez okunup geçilen yazı, telefonda kolda
        tutulan ekranda okunmuyor. Telefonda taban 14.4 piksele
        çıkıyor — metin SİLİNMİYOR, büyüyor.

     3. SIKIŞMAYAN YATAY ŞERİTLER (2 ekranın taşmasının tamamı)
        Sohbet sekmeleri (.sekmeler) sarmıyor ve kaymıyordu: dokuz
        sekme 552 piksele uzayıp SAYFAYI genişletiyordu. Rapor
        süzgecindeki tarih alanı (.filter-lab .input) 320 piksellik
        kendi doğal genişliğiyle flex:0 0 auto duruyor, küçülmüyordu.
        İkisi de artık kendi içinde kayıyor ya da alt alta iniyor.

   HİÇBİR ŞEY GİZLENMEDİ: display:none ile saklanan sütun/alan yok.
   Bütün çözümler sarmalayıcı, akış ve boyut çözümleri.

   KURALLAR SADECE DAR EKRANDA: 1440'ta tek piksel değişmiyor.
   ========================================================================== */

/* ---- KAYAN KUTUNUN KENARINDA GÖLGE ---------------------------------------
   Gizli bir kaydırma, olmayan bir kaydırmadır. Tablolar 319'dan beri
   yana kayıyor ama kaydığını gösteren HİÇBİR işaret yoktu: ekranın
   sağında sütun kaldığını bilmenin yolu, tesadüfen parmağı sürüklemek.

   Gölge JS'siz ve kendi kendini gizliyor: soldaki gölge yalnızca sola
   kaydırılacak içerik varken, sağdaki yalnızca sağa kaydırılacak
   içerik varken görünüyor. Numara background-attachment'ta —
   maskeleyen iki degrade kutuyla birlikte (local) kayıyor, gölge
   veren iki degrade kutuya sabit (scroll) duruyor; kutu sona
   geldiğinde maske gölgenin üstüne geliyor ve gölge kayboluyor.

   900 PİKSELİN ALTINDA. Masaüstünde tabloların görünümünü
   değiştirmemek için bilerek dar ekrana kapatıldı. */
@media (max-width: 900px) {
  .tablo-kaydir,
  .body table {
    background-image:
      linear-gradient(to right, var(--kaydir-zemin, var(--yuzey)) 30%, rgba(255,255,255,0)),
      linear-gradient(to left,  var(--kaydir-zemin, var(--yuzey)) 30%, rgba(255,255,255,0)),
      radial-gradient(farthest-side at 0    50%, rgba(11,34,57,.20), rgba(11,34,57,0)),
      radial-gradient(farthest-side at 100% 50%, rgba(11,34,57,.20), rgba(11,34,57,0));
    background-position: 0 0, 100% 0, 0 0, 100% 0;
    background-repeat: no-repeat;
    background-size: 34px 100%, 34px 100%, 15px 100%, 15px 100%;
    background-attachment: local, local, scroll, scroll;
  }
}

/* SEKME ŞERİDİNİN GÖLGESİ ARTIK HER GENİŞLİKTE (paket 627).
   Şerit 710–1149 bandında da kayıyor (yukarıda ölçüldü) ve gölge
   900'ün altında kalsaydı o bantta kullanıcı sağda sekme kaldığını
   ancak tesadüfen parmağını sürükleyerek öğrenirdi.
       GİZLİ BİR KAYDIRMA, OLMAYAN BİR KAYDIRMADIR. (ürünün kendi
       cümlesi · 319)
   TABLOLARA DOKUNULMADI: onların gölgesi masaüstünde görünümü
   değiştirmemek için BİLEREK 900'ün altında ve o karar bu paketin
   konusu değil. Bu yüzden şeridin tarifi İKİNCİ KEZ yazılmadı —
   seçici yukarıdaki bloktan ÇIKARILIP burada kendi kuralına taşındı.
       AYNI TARİFİ İKİ YERE YAZMAK, İKİ AYRI DOĞRU ÜRETMEKTİR. (547)
   VE KURAL KENDİ KENDİNİ GİZLİYOR: maskeler kutuyla (local), gölgeler
   kutuya sabit (scroll) duruyor; içerik sığdığında maske gölgenin
   üstüne geliyor ve gölge kayboluyor — 1440'ta ölçüldü. */
.body .sekmeler {
  /* Sekme şeridi sayfa zemininin üstünde duruyor; maskenin rengi
     kutunun zeminiyle aynı olmazsa gölge hiç sönmez. */
  --kaydir-zemin: var(--ink-50);
  background-image:
    linear-gradient(to right, var(--kaydir-zemin, var(--yuzey)) 30%, rgba(255,255,255,0)),
    linear-gradient(to left,  var(--kaydir-zemin, var(--yuzey)) 30%, rgba(255,255,255,0)),
    radial-gradient(farthest-side at 0    50%, rgba(11,34,57,.20), rgba(11,34,57,0)),
    radial-gradient(farthest-side at 100% 50%, rgba(11,34,57,.20), rgba(11,34,57,0));
  background-position: 0 0, 100% 0, 0 0, 100% 0;
  background-repeat: no-repeat;
  background-size: 34px 100%, 34px 100%, 15px 100%, 15px 100%;
  background-attachment: local, local, scroll, scroll;
}

@media (max-width: 700px) {

  /* ---- 1 · DOKUNMA HEDEFİ EN AZ 44 PİKSEL -------------------------------
     Tek yerde tanımlı, 65 ekrana birden uygulanıyor. Düğme, alan,
     açılır kutu ve özet satırı kendiliğinden dikeyde ortalıyor;
     bağlantılar satır içi çizildiği için yükseklik alabilmeleri
     adına kutuya çevriliyor. */
  .shell button,
  .shell select,
  .shell textarea,
  .shell input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]),
  .shell summary,
  .shell label.check,
  .shell .check {
    min-height: 44px;
  }
  /* İkon düğmeleri dar kalmasın — yazılı düğme zaten daha geniş. */
  .shell button { min-width: 44px; }

  /* Kutu gibi çizilen bağlantılar. Liste ölçümden çıktı: hangi sınıf
     kaç kez 44'ün altında çizildiyse o sınıf burada. */
  .shell a.btn,
  .shell .mini,
  .shell .sekme,
  .shell .hk-serit-bag,
  .shell .gun-dugme,
  .shell .gun-rozet,
  .shell .yen-sekme-ad,
  .shell .quick a,
  .shell .posta-yan-alt a,
  .shell .row-actions a,
  .shell .cs-sekme a,
  .shell p.hint > a,
  .shell .sebep > a,
  .shell th a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* TABLO İÇİ BAĞLANTI — 16 pikselden 44'e.
     :has() ŞART. Önce hepsine inline-flex verdim ve iki satırlık
     hücreler tek satıra ezildi: bağlantının içindeki <div class=hint>
     blok çocuk, flex kutusunda kalın adın YANINA diziliyordu. İçinde
     blok çocuk taşıyan bağlantı inline-block kalıyor — yükseklik yine
     uygulanıyor, çocuklar yine alt alta.

     min-width DE ŞART: teklif listesinde "aç" ve "—" bağlantıları
     yüksekliği aldıktan sonra bile 14–16 piksel GENİŞ kalıyordu; 44
     piksel yüksek ama 14 piksel geniş bir hedef, dokunulabilir bir
     hedef değil. */
  .shell td a:not(:has(div, p, ul, ol, table, br)) {
    min-height: 44px; min-width: 44px;
    display: inline-flex; align-items: center; justify-content: flex-start;
  }
  .shell td a:has(div, p, ul, ol, table, br) {
    min-height: 44px; display: inline-block;
  }

  /* Kendi başına duran bağlantılar: panel başlığındaki "tümü", boş
     liste kutusundaki çağrı, süzgeç bağlantıları. Bunlar cümlenin
     içinde değil, tek başına duran birer hedef. */
  .shell .panel-head > a,
  .shell .empty-box a,
  .shell .list-empty a,
  .shell .filtre-linkler a,
  .shell .destek-sat a,
  .shell .composer-tabs a,
  .shell .posta-yan a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* CÜMLENİN İÇİNDEKİ BAĞLANTI — yerleşimi bozmadan büyüyen hedef.
     Bunları kutuya çevirmek metni parçalıyordu: "… ayarlardan
     [açabilirsiniz] …" cümlesindeki bağlantı kendi satırına düşüyor,
     cümle üçe bölünüyordu. Satır içi DİKEY DOLGU satır kutusunun
     yüksekliğini değiştirmez — yani sayfa aynı yerde durur — ama
     tıklama/dokunma dikdörtgeni dolguyu kapsar. Yerleşim sabit,
     hedef 44 piksel. */
  .shell .body p > a,
  .shell .body li > a,
  .shell .body dd > a,
  .shell .body .hint-kirp a,
  /* Uyarı/bilgi kutularının cümlesi de aynı: metnin sonundaki
     bağlantı ("Zeyil ekranı") kutunun düzenini bozmadan büyüsün. */
  .shell .body .uyari-kutu > a,
  .shell .body .hata-kutu > a,
  .shell .body .iyi-kutu > a,
  .shell .body .yt-uyari > a {
    /* 14 piksel, 12 değil: ÖLÇTÜM. 12 ile hedef 41 pikselde kalıyordu
       — satırın kendi metin yüksekliği 17 piksel. Yuvarlak bir sayı
       yerine ölçülen sayı. */
    padding-block: 14px;
  }

  /* Satırdaki iki işlem düğmesi arasında parmak payı olsun: 44'lük iki
     hedef 4 piksel arayla dururken yanlış olana basılıyor. */
  .shell .row-actions { gap: 12px; }

  /* ---- 2 · GÖVDE YAZISI 14 PİKSELİN ALTINA DÜŞMÜYOR --------------------
     .hint / .muted / .sebep / .mono ve gövdedeki p, li, dd, td.
     Rozet (.pill), etiket (th) ve sayı kartının başlığı dışarıda:
     onlar okunacak metin değil, işaret.

     Büyüyen yazı tabloyu genişletiyor — tablo zaten kayıyor, sorun
     değil. Küçük yazıyı kırpmak yerine tabloyu kaydırmak, bilgiyi
     yerinde bırakan çözüm.

     ÖZGÜLLÜK VE !important — NİYE GEREKTİ.
     İlk yazışta kural `.body .hint` idi ve ekranların yarısında hiçbir
     şey olmadı. İki sebebi var: admin.css panel.css'ten ÖNCE
     yükleniyor, eşit özgüllükte SONRAKİ kazanıyor; üstelik yedi ekran
     yazı boyunu doğrudan elemanın üstüne yazmış
     (style="font-size:.72rem" — sablonlar, hasar, özel günler).
     Onun için seçici `.shell .body …` ile bir basamak yukarı çekildi
     ve satır içi yazıya karşı !important kullanıldı. !important
     yalnızca YAZI BOYUNDA ve yalnızca dar ekranda: renk, kalınlık ve
     yerleşim kimsenin elinden alınmıyor. */
  .shell .body .hint,
  .shell .body .muted,
  .shell .body .sebep,
  .shell .body .mono,
  .shell .body p,
  .shell .body li,
  .shell .body dd,
  .shell .body td,
  .shell .body .stat-card-label,
  .shell .body .kd-etiket {
    font-size: .9rem !important;
  }
  /* Uzun adres, e-posta ve kimlik numarası kutudan taşmasın. */
  .body code, .body .mono, .body pre { overflow-wrap: anywhere; }
  .body { overflow-wrap: break-word; }

  /* ---- 3 · YATAY ŞERİTLER SAYFAYI GENİŞLETMİYOR ------------------------
     SEKME ŞERİDİ: dokuz sekme 552 piksele uzuyor ve SAYFAYI 570'e
     çıkarıyordu — sohbetler ekranındaki 180 piksellik taşmanın
     tamamı buydu. Sekmeyi silmek ya da gizlemek bilgi kaybı olurdu;
     şerit artık kendi içinde kayıyor. Kaydığı yukarıdaki gölgeden
     görünüyor.

     KURAL BU BLOKTAN ÇIKARILDI (paket 627): aynısı `.sekmeler`in
     TEMEL kuralında ve artık HER GENİŞLİKTE koşuyor. Burada bırakmak
     aynı şeyi iki yerde tutmak olurdu ve biri bir gün ayrışırdı.
         AYNI KURALI İKİ YERDE TUTMAK, İKİ AYRI DOĞRU ÜRETMEKTİR. (547)
     Sebebi ölçüldü: taşma viewport'un değil İÇERİK SÜTUNUNUN
     genişliğinden doğuyor ve 710–1149 bandında bu blok hiç koşmuyordu. */

  /* SÜZGEÇ SATIRI: tarih alanının kendi doğal genişliği telefonda 320
     piksel ve flex:0 0 auto onu küçültmüyordu; etiketiyle birlikte
     426 pikselde bitiyordu. Alanlar artık satırın tamamını alıp alt
     alta iniyor — hiçbir süzgeç kaybolmuyor. */
  .body .filters,
  .body .filtre-satir { align-items: stretch; }
  .body .filters .filter-lab,
  .body .filtre-satir label { flex: 1 1 100%; flex-wrap: wrap; }
  .body .filters .input,
  .body .filters select.input,
  .body .filter-lab .input,
  .body .filtre-satir .input {
    flex: 1 1 auto; width: 100%; min-width: 0;
  }
  .body .filters .quick,
  .body .quick { margin-left: 0; }
}

/* ══════════════════════════════════════════════════════════════════════
   UZUN AÇIKLAMALAR — İKİ SATIR + "Devamı"                  (paket 427)
   ──────────────────────────────────────────────────────────────────────
   Sınıf JS tarafından ekleniyor (assets/kisa-metin.js); gerekçesi o
   dosyanın başında. JS çalışmazsa bu kuralların hiçbiri uygulanmıyor
   ve metin bugünkü hâliyle görünüyor — yani kırpma, okunamayan bir
   paragraf bırakma riski taşımıyor.
   ══════════════════════════════════════════════════════════════════════ */
.kisa-metin {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* Form altı ipuçları TEK SATIR: gerekçesi kisa-metin.js içinde ölçümle
   yazılı — geniş ekranda iki satır katlaması hiçbir şeyi kısaltmıyordu. */
.kisa-metin--tek { -webkit-line-clamp: 1; }
.kisa-metin--tek.is-acik { -webkit-line-clamp: unset; }
.kisa-metin.is-acik {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
}
.kisa-metin-ac {
  /* Düğme kendi satırında ama SIKI: katlamanın kazandırdığı yerin bir
     kısmını düğmenin boşluğu geri alıyordu (ölçüldü: ekran görüntüsü). */
  display: inline-block; margin: 0 0 3px;
  background: none; border: 0; padding: 0;
  font: inherit; font-size: .72rem; line-height: 1.25;
  color: var(--brand, #1f6feb); cursor: pointer; text-decoration: underline;
  text-underline-offset: 2px;
}
.kisa-metin-ac:hover { text-decoration-thickness: 2px; }
.kisa-metin-ac:focus-visible { outline: 2px solid var(--brand, #1f6feb); outline-offset: 2px; }

/* ══════════════════════════════════════════════════════════════════════
   PAKET 656 · 659 — UZUN AÇIKLAMALAR BİLGİ KUTUSUNDA
   ──────────────────────────────────────────────────────────────────────
   İSTEK KULLANICIDAN GELDİ: "Düz zeminde yazı, belirli karakterden sonra
   devamı diyor. Onlar çok kötü duruyor. Uyarı yazılarını bir kutucuğa
   sarı bir transparan zemin ile daha şık ve kullanışlı yap."

   659: SARI ZEMİN KALKTI. Kullanıcının cümlesi: "sarı uyarı şeritleri çok
   kötü oldu. onları bir an önce daha modern bir hâlde yapalım." Kutu
   artık ürünün KENDİ mavi paletinden (açık zemin · ince çizgi · bilgi
   işareti); ham renk yok, hepsi palet adı.

   NE DEĞİŞTİ: `assets/kisa-metin.js`'in kısalttığı uzun açıklama artık
   bir KUTUNUN içinde; "Devamı" düğmesi de AYNI kutuda,
   sağ altta. Kısa ipuçlarına DOKUNULMADI — kutu yalnız zaten
   kısaltılan uzun metinlerde çiziliyor.

   NE DEĞİŞMEDİ: hangi metnin kısaltılacağı (eşikler · seçiciler) ve
   kaç satır görüneceği. JS çalışmazsa metin eskisi gibi düz ve TAM
   görünür.
   ══════════════════════════════════════════════════════════════════════ */
.kisa-kutu {
  box-sizing: border-box; position: relative;
  margin: 6px 0 8px; padding: 10px 14px 8px 42px;
  background: var(--mavi-50);
  border: 1px solid var(--mavi-100);
  border-radius: 12px;
}
/* BİLGİ İŞARETİ — kutunun ne olduğunu renk değil işaret söylüyor. */
.kisa-kutu::before {
  content: 'i'; position: absolute; left: 13px; top: 11px;
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--mavi); color: var(--yuzey);
  font: 700 12px/18px Georgia, 'Times New Roman', serif; text-align: center;
}
/* METNİN KENDİ DIŞ BOŞLUĞU KUTUNUN İÇİNDE SIFIR: boşluğu artık kutu
   veriyor; kalsaydı metin kutunun içinde kayık dururdu. */
.kisa-kutu > .kisa-metin { margin: 0 !important; color: var(--ink-700); }
.kisa-kutu > .kisa-metin-ac {
  display: block; margin: 4px 0 0 auto; padding: 1px 0;
  font-weight: 600; text-decoration: none; color: var(--mavi);
}
.kisa-kutu > .kisa-metin-ac:hover { text-decoration: underline; }
.kisa-kutu > .kisa-metin-ac::after { content: ' ▾'; }
.kisa-kutu > .kisa-metin-ac[aria-expanded="true"]::after { content: ' ▴'; }
/* TELEFON: orada katlamayı `details.hint-kat` yapıyor (panel düzeni). */
.body details.hint-kat {
  box-sizing: border-box;
  background: var(--mavi-50);
  border: 1px solid var(--mavi-100);
  border-radius: 12px;
  padding: 10px 14px;
  color: var(--ink-700);
}

/* PAKET 642 — 21 ham renk palete çekildi
   Bu dosyada 10 eşleme uygulandı. Ayrıntı ve gerekçe: guncelle-325.php başlığı.
   Hiçbir renk GÖRÜNÜR ölçüde değişmedi (ΔE ≤ 1.70, OKLab);
   değişen şey, o renklerin artık paletten geliyor olması — yani
   dark mod geldiğinde onlar da değişebilecek. */

/* ═══ PAKET 751 — REFERANS KABUK: lacivert menü · turuncu eylem · üst çubuk ═══ */
:root {
  --brand:#C74316; --brand-600:#A83610; --brand-300:#F5A27E;
  --brand-50:#FFF1E9; --brand-100:#FFE1D0;
  --marka-vurgu:#FF642D;
  --zemin:#F5F7FB; --cizgi:#E3E8F0; --kose:12px;
  --ink-900:#17233B; --ink-500:#5E6B80;
  --menu-zemin:#0B1730; --menu-cizgi:#1B2947; --menu-cizgi-2:#26365A;
  --menu-yazi:#DCE3EF; --menu-yazi-guclu:#FFFFFF; --menu-yazi-2:#B9C3D4; --menu-yazi-3:#93A0B8;
  --menu-yuzey:#13213F; --menu-yuzey-2:#1A2A4D;
  --menu-aktif:#1E2C4C; --menu-aktif-yazi:#FFFFFF; --menu-ikon:#C9D2E2;
}
.side { width: 232px; border-right: 0; }
.side-nav a.is-active { box-shadow: inset 3px 0 0 var(--marka-vurgu); }
.side-nav a.is-active .ikon { color: var(--marka-vurgu); }
.side-nav a.is-active .badge, .side-nav .badge { background: var(--marka-vurgu); color: #fff; }
.side-logo:hover { background: transparent; opacity: .85; }
.nav-bolum { margin-top: 18px; }

.ust-cubuk {
  position: sticky; top: 0; z-index: 30;
  min-height: 64px; padding: 10px var(--govde-yan);
  background: var(--yuzey); border-bottom: 1px solid var(--cizgi);
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.ust-yol { display: flex; align-items: center; gap: 10px; min-width: 0; font-size: .875rem; color: var(--ink-500); }
.ust-yol a:hover { color: var(--ink-900); }
.ust-yol strong { color: var(--ink-900); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ust-cubuk-sag { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-left: auto; }
.ust-cubuk-sag .ust-ara { min-width: min(380px, 60vw); background: var(--zemin); }
.sayfa-bas h1 { font-size: 1.72rem; font-weight: 700; }
@media (max-width: 767px) {
  .ust-cubuk { position: static; min-height: 0; }
  .ust-cubuk-sag { width: 100%; }
  .ust-cubuk-sag .ust-ara { flex: 1 1 auto; min-width: 0; }
}
.stat-card-value, .stat-cards .stat-card-value, .bo-fark-satir dd { color: var(--ink-900); }
.side-hesap-harf { background: var(--marka-vurgu); color: #fff; }

/* ═══ PAKET 752 — REFERANS ORTAK BİLEŞENLER: düğme · rozet · tablo · giriş · özet kartı · kart başlığı ═══ */
:root {
  --ok:#147D55; --ok-50:#E3F5EC; --ok-200:#BFE6D3;
  --uyari:#956000; --uyari-50:#FFF4D6;
  --err:#B42318; --err-50:#FDECEA;
  --mavi:#245ECC; --mavi-50:#EAF1FD; --mavi-100:#D5E3FB; --mavi-600:#1D4FB0;
  --odak:#245ECC;
}
/* Düğme: 8 px köşe, en az 40 px yükseklik. */
.btn { border-radius: 8px; min-height: 40px; padding: 9px 18px; }
.btn-sm { min-height: 34px; padding: 6px 14px; }
.btn-ghost { border-color: var(--cizgi); color: var(--ink-900); }
.btn-ghost:hover { background: var(--zemin); }
.btn:focus-visible, .input:focus-visible, a:focus-visible { outline: 2px solid var(--odak); outline-offset: 2px; }
/* Giriş alanı. */
.input { border-radius: 8px; min-height: 40px; border-color: var(--cizgi); }
.input-sm { min-height: 34px; }
.input:focus { border-color: var(--odak); box-shadow: 0 0 0 3px var(--mavi-50); }
/* Durum rozeti: köşeli hap, her durum kendi anlam renginde. */
.pill { border-radius: 6px; padding: 3px 10px; font-size: .75rem; line-height: 1.5; }
.pill--brand { background: var(--mavi-50); color: var(--mavi-600); }
.pill--uyari { background: var(--err-50); color: var(--err); }
/* Kart ve kart başlığı. */
.panel, .card { border-radius: 12px; box-shadow: 0 1px 2px rgba(11,23,48,.04); }
.panel-head h2, .panel-title { font-size: 1.06rem; font-weight: 600; color: var(--ink-900); }
.panel-head a:not(.btn) { color: var(--mavi); font-weight: 500; }
.bo-hepsi, .bo-git { color: var(--mavi); }
/* Tablo: açık gri başlık satırı, 52–56 px satır. */
.table th, .tablo th, .tbl th {
  background: var(--zemin); color: var(--ink-500);
  font-size: .8rem; font-weight: 600; letter-spacing: 0; text-transform: none;
  border-bottom: 1px solid var(--cizgi);
}
.table td, .tablo td, .tbl td { border-bottom-color: var(--cizgi); font-size: .875rem; }
.table tr:hover td, .tablo tr:hover td, .tbl tr:hover td { background: #FAFBFD; }
.tablo-kaydir { border-radius: 12px; }
/* Özet kartları: bitişik şerit yerine ayrı kartlar. */
.stat-cards { background: transparent; border: 0; border-radius: 0; overflow: visible; gap: 16px; }
.stat-cards > .stat-card {
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 12px;
  padding: 18px 20px; box-shadow: 0 1px 2px rgba(11,23,48,.04);
}
.stat-cards > a.stat-card:hover { background: var(--yuzey); border-color: var(--cizgi-koyu); box-shadow: 0 4px 14px rgba(11,23,48,.07); }
.stat-cards > .stat-card .stat-card-value { font-size: 1.7rem; }
/* Sekme çizgisi: sayı çipleri. */
.sekme-cizgi > a.btn.sekme { min-height: 0; }
.sekme-cizgi > a.btn.sekme.is-active { color: var(--brand); box-shadow: none; }
.flash, .notice, .alert { border-radius: 8px; }
.stat-cards > .stat-card .stat-card-value { color: var(--ink-900); }
.stat-cards > .stat-card--uyari .stat-card-value { color: var(--uyari); }
.stat-cards > .stat-card--hata  .stat-card-value { color: var(--err); }
.stat-cards > .stat-card--ok    .stat-card-value { color: var(--ok); }

/* ═══ PAKET 753 — HIZLI KAYIT PENCERESİ (gider · tahsilat) ═══ */
.hk-pencere .modal-card { width: 560px; padding: 24px; }
.hk-pencere h2 { font-size: 1.15rem; font-weight: 700; margin-bottom: 16px; color: var(--ink-900); }
.hk-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.hk-izgara .field, .hk-kisi { min-width: 0; margin-bottom: 14px; }
.hk-form .input { width: 100%; }
.hk-kisi { position: relative; }
.hk-sonuc { position: absolute; left: 0; right: 0; top: 100%; z-index: 5; margin-top: 4px; background: var(--yuzey);
  border: 1px solid var(--cizgi); border-radius: 8px; box-shadow: 0 10px 28px rgba(11,23,48,.14); max-height: 240px; overflow-y: auto; }
.hk-sonuc-satir { display: block; width: 100%; text-align: left; padding: 10px 12px; border: 0; background: transparent;
  font: inherit; font-size: .9rem; color: var(--ink-900); cursor: pointer; min-height: 44px; }
.hk-sonuc-satir:hover, .hk-sonuc-satir:focus-visible { background: var(--zemin); }
.hk-sonuc-yok { padding: 10px 12px; color: var(--ink-500); font-size: .88rem; }
.hk-secili { margin-top: 8px; padding: 8px 12px; border-radius: 8px; background: var(--ok-50); color: var(--ok); font-weight: 600; font-size: .9rem; }
.hk-uyari { margin-bottom: 12px; padding: 8px 12px; border-radius: 8px; background: var(--err-50); color: var(--err); font-size: .88rem; }
.hk-alt { display: flex; gap: 10px; align-items: center; justify-content: flex-end; margin-top: 6px; }
.hk-tam { margin-right: auto; color: var(--mavi); font-size: .86rem; }
@media (max-width: 560px) { .hk-izgara { grid-template-columns: 1fr; } .hk-pencere .modal-card { padding: 18px; } }

/* ═══ PAKET 754 — hızlı pencere: tam satır alan · bilgi notu ═══ */
.hk-tam-satir { grid-column: 1 / -1; }
.hk-bilgi { margin: 0 0 12px; padding: 8px 12px; border-radius: 8px; background: var(--mavi-50); color: var(--mavi-600); font-size: .86rem; }

/* ═══ PAKET 755 — yeni teklif penceresi ═══ */
.yt-pencere .modal-card { width: 720px; }
.yt-bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.yt-bas h2 { margin: 0; }
.yt-sekme { margin: 10px 0 16px; }
.yt-govde { max-height: min(62vh, 620px); overflow-y: auto; padding: 2px; }
.yt-govde form { margin-bottom: 8px; }
.yt-govde .input { width: 100%; }
.yt-yapistir { margin-top: 12px; margin-bottom: 0; }
@media (max-width: 640px) { .yt-govde .grid-2 { grid-template-columns: 1fr; } }
.yt-govde .tk-zorunlu { color: var(--err); font-weight: 700; }
.yt-govde .tk-zorunlu-not { color: var(--err); }

/* ═══ PAKET 756 — BUGÜNÜN ÖZETİ referans düzeni ═══ */
.bo-tarih { color: var(--ink-500); font-size: .9rem; }
.bo-ana { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px; margin-bottom: 16px; align-items: start; }
.bo-ana > .panel { margin-bottom: 0; min-width: 0; }
.bo-ana > .panel:only-child { grid-column: 1 / -1; }
.bo-bos { padding: 18px 22px; color: var(--ink-500); font-size: .9rem; }
.bo-cip { display: flex; gap: 8px; flex-wrap: wrap; padding: 14px 22px 6px; }
.bo-cip-d { border: 1px solid var(--cizgi); background: var(--yuzey); color: var(--ink-700); border-radius: 8px; padding: 6px 12px;
  font: inherit; font-size: .84rem; font-weight: 500; cursor: pointer; min-height: 34px; }
.bo-cip-d.is-active { background: var(--brand); border-color: var(--brand); color: #fff; }
.bo-onc-satir, .bo-gelen-satir { display: flex; align-items: center; gap: 14px; padding: 13px 22px; border-top: 1px solid var(--cizgi); color: inherit; min-height: 56px; }
.bo-cip + .bo-onc-satir { border-top: 0; }
.bo-onc-satir:hover, .bo-gelen-satir:hover { background: #FAFBFD; }
.bo-onc-satir[hidden] { display: none; }
.bo-onc-ikon { flex: none; width: 36px; height: 36px; border-radius: 8px; display: flex; align-items: center; justify-content: center; background: var(--mavi-50); color: var(--mavi); }
.bo-onc-ikon--yenileme { background: var(--ok-50); color: var(--ok); }
.bo-onc-ikon--tahsilat { background: var(--brand-50); color: var(--brand); }
.bo-onc-ikon--gorev { background: var(--uyari-50); color: var(--uyari); }
.bo-onc-yazi, .bo-gelen-yazi { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bo-onc-yazi strong, .bo-gelen-yazi strong { font-size: .92rem; font-weight: 600; color: var(--ink-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bo-onc-yazi small, .bo-gelen-yazi small { font-size: .82rem; color: var(--ink-500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bo-onc-ok { color: var(--ink-400); font-size: 1.2rem; }
.bo-avatar { flex: none; width: 38px; height: 38px; border-radius: 999px; background: var(--ink-100); color: var(--ink-700); font-weight: 700; font-size: .8rem;
  display: flex; align-items: center; justify-content: center; }
.bo-gelen-sag { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; font-size: .78rem; color: var(--ink-500); }
.bo-rozet { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--marka-vurgu, var(--brand)); color: #fff; font-size: .72rem;
  display: inline-flex; align-items: center; justify-content: center; }
.bo-yen-tablo { border: 0; border-radius: 0; }
.bo-ekip-satir { display: flex; align-items: center; gap: 12px; padding: 11px 22px; border-top: 1px solid var(--cizgi); font-size: .9rem; }
.bo-ekip-satir strong { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.bo-ekip-is { color: var(--ink-500); font-size: .84rem; white-space: nowrap; }
.bo-dogum { display: flex; align-items: center; gap: 16px; padding: 16px 22px; margin-bottom: 16px; border-radius: 12px; background: var(--brand-50);
  border: 1px solid var(--brand-100); color: var(--ink-900); }
.bo-dogum > span:nth-child(2) { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.bo-dogum small { color: var(--ink-500); font-size: .86rem; }
.bo-dogum em { font-style: normal; font-weight: 600; color: var(--brand); white-space: nowrap; }
.bo-dogum-ikon { flex: none; width: 44px; height: 44px; border-radius: 999px; background: var(--yuzey); color: var(--brand); display: flex; align-items: center; justify-content: center; }
.panel.bo-gorev { display: none; }
@media (max-width: 1023px) { .bo-ana { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .bo-ekip-is { display: none; } .bo-dogum { flex-wrap: wrap; } .bo-onc-satir, .bo-gelen-satir, .bo-ekip-satir { padding-left: 16px; padding-right: 16px; } }
/* 752'nin kart iç boşluğu simgeli kartlarda simgeyi yazının üstüne bindiriyordu (ekran görüntüsü yakaladı). */
.stat-cards.bs-ozet > .stat-card { padding-left: 78px; }

/* ═══ PAKET 757 — MESAJLAR referans görünümü · başlıklarda tek yazı ailesi ═══ */
:root { --font-baslik: var(--font-metin); }
.topbar h1 { font-size: 1.3rem; font-weight: 700; letter-spacing: -.01em; }
/* Giden balon: açık yeşil (referans); gelen beyaz kalır. */
.thread-akis .bubble-row.is-out .bubble, .thread-akis .bubble-row.is-out .bubble::after { background: #DCF7E3; }
/* Yazma kutusu sekmeleri: kutu sekme yerine alt çizgili sekme. */
.composer .composer-tabs { gap: 4px; border-bottom: 1px solid var(--cizgi); margin-bottom: 0; }
.composer .ctab { background: transparent; border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: var(--ink-500); margin-bottom: -1px; }
.composer .ctab:hover:not([disabled]):not(.is-on) { background: transparent; color: var(--ink-900); }
.composer .ctab.is-on { background: transparent; color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }
.composer .ctab.is-on::before { display: none; }
.composer .cpane { border-color: var(--cizgi); border-top: 0; border-radius: 0 0 12px 12px; }
.composer .sm-emoji-ac { background: var(--yuzey); border: 1px solid var(--cizgi); color: inherit; min-height: 36px; padding: 4px 10px; }
.composer .sm-emoji-ac:hover { background: var(--zemin); }
/* "Görüşmeyi Tamamla": dolu turuncu yerine yeşil tonlu — ana eylem "Gönder". */
.sm-kutu .btn.sm-tamam.btn-primary, .btn.sm-tamam.btn-primary { background: var(--ok-50); color: var(--ok); border: 1px solid var(--ok-200); }
.btn.sm-tamam.btn-primary:hover { background: var(--ok-200); }
.composer .cpane textarea[name="body"] { min-height: 72px; height: 72px; }

/* ═══ PAKET 758 — TEKLİFLER sağ detay paneli ═══ */
tr[data-tkl-id] { cursor: pointer; }
.table tr[data-tkl-id].is-secili td { background: var(--brand-50); }
.table tr[data-tkl-id].is-secili td:first-child { box-shadow: inset 3px 0 0 var(--marka-vurgu, var(--brand)); }
.tkl-cekmece { position: fixed; top: 64px; right: 0; bottom: 0; width: 420px; max-width: 100vw; z-index: 40; background: var(--yuzey);
  border-left: 1px solid var(--cizgi); box-shadow: -12px 0 32px rgba(11,23,48,.10); overflow-y: auto; padding: 22px; }
.tkl-cekmece[hidden] { display: none; }
.tkl-cekmece-kapat { position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; border-radius: 8px; border: 1px solid var(--cizgi);
  background: var(--yuzey); font-size: 1.2rem; line-height: 1; cursor: pointer; color: var(--ink-700); }
.tkl-cekmece-kapat:hover { background: var(--zemin); }
.tkc-bas { display: flex; align-items: flex-start; gap: 12px; padding-right: 44px; }
.tkc-bas > div { flex: 1 1 auto; min-width: 0; }
.tkc-bas h2 { font-size: 1.35rem; font-weight: 700; color: var(--ink-900); }
.tkc-bas p { margin-top: 2px; font-weight: 600; overflow-wrap: anywhere; }
.tkc-not { margin: 6px 0 16px; font-size: .84rem; color: var(--ink-500); }
.tkc-kutu { border: 1px solid var(--cizgi); border-radius: 12px; padding: 16px; margin-bottom: 14px; }
.tkc-kutu h3 { font-size: .95rem; font-weight: 600; margin-bottom: 12px; }
.tkc-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 14px; }
.tkc-alan { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tkc-alan span { font-size: .78rem; color: var(--ink-500); }
.tkc-alan strong { font-size: .92rem; font-weight: 600; overflow-wrap: anywhere; }
.tkc-fiyat { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--cizgi); font-size: .9rem; }
.tkc-fiyat:first-of-type { border-top: 0; padding-top: 0; }
.tkc-fiyat > span:first-child { flex: 1 1 auto; min-width: 0; }
.tkc-fiyat strong { font-variant-numeric: tabular-nums; }
.tkc-bos { color: var(--ink-500); font-size: .88rem; }
.tkc-eylem { display: flex; flex-direction: column; gap: 10px; }
.tkc-eylem .btn { width: 100%; }
@media (min-width: 1500px) { body.tkl-cekmece-acik .shell > :not(.side) { margin-right: 420px; } }
@media (max-width: 767px) { .tkl-cekmece { top: 0; width: 100vw; } }

/* ═══ PAKET 759 — KİŞİYE ÖZEL VİDEO adım şeridi ═══ */
.vs-serit { list-style: none; display: flex; gap: 0; margin: 0 0 18px; padding: 0; max-width: 860px; counter-reset: none; }
.vs-adim { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 6px 12px 6px 0; color: var(--ink-500); font-size: .88rem; font-weight: 500; position: relative; }
.vs-adim[role="button"] { cursor: pointer; }
.vs-adim::after { content: ''; flex: 1 1 auto; height: 2px; min-width: 12px; background: var(--cizgi); border-radius: 2px; }
.vs-adim:last-child { flex: 0 0 auto; padding-right: 0; }
.vs-adim:last-child::after { display: none; }
.vs-no { flex: none; width: 32px; height: 32px; border-radius: 999px; display: flex; align-items: center; justify-content: center;
  background: var(--ink-100); color: var(--ink-700); font-weight: 700; font-size: .85rem; }
.vs-ad { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vs-adim.is-etkin { color: var(--ink-900); font-weight: 600; }
.vs-adim.is-etkin .vs-no { background: var(--marka-vurgu, var(--brand)); color: #fff; }
.vs-adim.is-bitti .vs-no { background: var(--ok-50); color: var(--ok); }
.vs-adim.is-bitti::after { background: var(--marka-vurgu, var(--brand)); }
.vs-adim:focus-visible { outline: 2px solid var(--odak); outline-offset: 2px; border-radius: 8px; }
.gonderim-form.vs-acik > section.kart[hidden], .gonderim-form.vs-acik > .gonderim-alt[hidden] { display: none; }
.vs-gezin { display: flex; gap: 10px; justify-content: space-between; margin-top: 16px; }
.vs-gezin[hidden] { display: none; }
.vs-gezin #vs-ileri { margin-left: auto; }
@media (max-width: 720px) { .vs-adim:not(.is-etkin) .vs-ad { display: none; } .vs-adim { padding-right: 6px; gap: 6px; } }

/* ═══ PAKET 760 — MUHASEBE referans düzeni ═══ */
.ma-ikili { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px; align-items: start; margin-bottom: 16px; }
.ma-ikili--tek { grid-template-columns: 1fr; }
.ma-ikili > .panel { margin-bottom: 0; min-width: 0; }
.ma-cip { padding-bottom: 12px; }
.ma-tablo tbody tr[hidden] { display: none; }
.ma-vade-satir { display: flex; align-items: center; gap: 12px; padding: 12px 22px; border-top: 1px solid var(--cizgi); font-size: .9rem; }
.ma-vade-yazi { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ma-vade-yazi strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.ma-vade-yazi small, .ma-vade-gun small { display: block; font-size: .78rem; color: var(--ink-500); }
.ma-vade-gun { flex: none; font-size: .86rem; font-variant-numeric: tabular-nums; }
.ma-vade-gun.is-gec, .ma-vade-gun.is-gec small { color: var(--err); }
.ma-vade-tutar { flex: none; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ma-vade-form { flex: none; margin: 0; }
.ma-vade-dugme { border-color: var(--brand); color: var(--brand); }
.ma-hesap-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; padding: 16px 22px 20px; }
.ma-hesap-kart { border: 1px solid var(--cizgi); border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ma-hesap-kart span { font-weight: 600; }
.ma-hesap-kart small { display: block; font-weight: 400; font-size: .8rem; color: var(--ink-500); }
.ma-hesap-kart strong { font-size: 1.2rem; font-variant-numeric: tabular-nums; }
.ma-hesap-kart strong.is-eksi { color: var(--err); }
@media (max-width: 1100px) { .ma-ikili { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .ma-vade-satir { flex-wrap: wrap; padding-left: 16px; padding-right: 16px; } .ma-vade-yazi { flex-basis: 100%; } }

/* ═══ PAKET 761 — PERSONEL: ekip ve iş yükü · personel ekle penceresi ═══ */
.pg-ekip-kisi { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.pg-ekip-kisi .bo-avatar { width: 32px; height: 32px; font-size: .72rem; }
.pg-yuk { display: inline-block; width: 120px; max-width: 100%; height: 8px; border-radius: 999px; background: var(--ink-100); overflow: hidden; vertical-align: middle; }
.pg-yuk > span { display: block; height: 100%; border-radius: 999px; background: var(--marka-vurgu, var(--brand)); }
.pe-pencere .modal-card { width: 760px; }
.pe-pencere .yt-bas { margin-bottom: 10px; }
.pe-pencere form .field { flex: 1 1 200px; }
.pe-pencere form .input { width: 100%; }

/* ═══ PAKET 762 — açıklamalar tek satırda (kapalı gelir) ═══ */
.bilgi-kat { margin: 0 0 12px; }
.bilgi-kat > summary { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; list-style: none; font-size: .84rem; font-weight: 500;
  color: var(--ink-500); padding: 4px 0; min-height: 28px; }
.bilgi-kat > summary::-webkit-details-marker { display: none; }
.bilgi-kat > summary::before { content: 'i'; width: 18px; height: 18px; border-radius: 999px; border: 1.5px solid currentColor; font-size: .72rem; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center; font-style: normal; }
.bilgi-kat > summary::after { content: '▾'; font-size: .8rem; }
.bilgi-kat[open] > summary::after { content: '▴'; }
.bilgi-kat > summary:hover { color: var(--ink-900); }
.bilgi-kat > summary:focus-visible { outline: 2px solid var(--odak); outline-offset: 2px; border-radius: 6px; }
.bilgi-kat > .kisa-kutu { background: transparent; border: 0; border-left: 3px solid var(--cizgi); border-radius: 0; padding: 2px 0 2px 12px; margin: 6px 0 0; box-shadow: none; }
.bilgi-kat > .kisa-kutu::before { display: none; }
.bilgi-kat > .kisa-kutu > .kisa-metin { color: var(--ink-600); font-size: .86rem; }
.bilgi-kat > .kisa-kutu > .kisa-metin-ac { display: none; }

/* ═══ PAKET 763 — personel: izin kararı düğmeleri ═══ */
.pg-izin-karar { display: flex; gap: 6px; margin: 0; flex: none; }

/* ═══ PAKET 764 — SOHBET yazma kutusu: emoji · Enter · açıklama · Gönder TEK SATIRDA ═══ */
.composer form.cpane[data-pane="serbest"] { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
.composer form.cpane[data-pane="serbest"] > * { flex: 0 0 100%; min-width: 0; }
.composer form.cpane[data-pane="serbest"] > .sm-emoji-sar { flex: 0 0 auto; margin: 0; position: relative; }
.composer form.cpane[data-pane="serbest"] > .sm-enter { flex: 0 0 auto; margin: 0; white-space: nowrap; }
.composer form.cpane[data-pane="serbest"] > .cbar { display: contents; }
.composer form.cpane[data-pane="serbest"] > .cbar > * { flex: 0 0 100%; min-width: 0; }
.composer form.cpane[data-pane="serbest"] > .cbar > .bilgi-kat,
.composer form.cpane[data-pane="serbest"] > .cbar > .hint,
.composer form.cpane[data-pane="serbest"] > .cbar > .kisa-kutu { flex: 1 1 120px; margin: 0; }
.composer form.cpane[data-pane="serbest"] > .cbar > button[type="submit"] { flex: 0 0 auto; margin-left: auto; min-width: 108px; }
/* Emoji paleti satırı itmesin: düğmenin üstünde açılır. */
.composer .cpane[data-pane="serbest"] .sm-emoji { position: absolute; left: 0; bottom: calc(100% + 6px); z-index: 6; width: 330px; max-width: 80vw; box-shadow: 0 10px 28px rgba(11,23,48,.14); }
.composer .cpane[data-pane="serbest"] .sm-emoji[hidden] { display: none; }
.composer { padding-top: 10px; margin-top: 14px; }
/* Sıra: araya giren boş kutular satırı bölmesin — dördü art arda dizilir. */
.composer form.cpane[data-pane="serbest"] > .sm-emoji-sar, .composer form.cpane[data-pane="serbest"] > .sm-enter,
.composer form.cpane[data-pane="serbest"] > .cbar > .bilgi-kat, .composer form.cpane[data-pane="serbest"] > .cbar > .hint,
.composer form.cpane[data-pane="serbest"] > .cbar > .kisa-kutu, .composer form.cpane[data-pane="serbest"] > .cbar > button[type="submit"] { order: 2; }
.composer form.cpane[data-pane="serbest"] > .cbar > * { order: 3; }

/* ═══ PAKET 765 — segment sayacı onarımı (stil değişikliği yok; kurulum işareti) ═══ */

/* ═══ PAKET 766 — GÖREV TAKİBİ PANOSU ═══ */
.gt-sutunlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding: 16px 22px 20px; }
.gt-sutun { border: 1px solid var(--cizgi); border-radius: 12px; background: var(--zemin); min-width: 0; padding-bottom: 8px; }
.gt-bas { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--cizgi); border-radius: 12px 12px 0 0; font-size: .9rem; }
.gt-sutun--bekliyor .gt-bas { background: var(--err-50); color: var(--err); }
.gt-sutun--suruyor .gt-bas { background: var(--mavi-50); color: var(--mavi-600); }
.gt-sutun--bitti .gt-bas { background: var(--ok-50); color: var(--ok); }
.gt-ekle { margin-left: auto; width: 28px; height: 28px; border-radius: 8px; border: 1px solid currentColor; background: transparent; color: inherit; font-size: 1.1rem; line-height: 1; cursor: pointer; }
.gt-kart { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px; margin: 8px 8px 0; padding: 12px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.gt-kart > strong { font-size: .9rem; font-weight: 600; overflow-wrap: anywhere; }
.gt-alt { display: flex; align-items: center; gap: 8px; font-size: .82rem; color: var(--ink-500); min-width: 0; }
.gt-alt .bo-avatar { width: 26px; height: 26px; font-size: .66rem; }
.gt-kisi { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt-gun { flex: none; white-space: nowrap; }
.gt-gun.is-gec { color: var(--err); font-weight: 600; }
.gt-form { margin: 0; }
.gt-form .btn { width: 100%; }
.gt-bos, .gt-daha { display: block; padding: 12px 14px 4px; font-size: .86rem; color: var(--ink-500); }
.gt-daha { color: var(--mavi); }
@media (max-width: 900px) { .gt-sutunlar { grid-template-columns: 1fr; padding-left: 16px; padding-right: 16px; } }

/* ═══ PAKET 767 — teklif panelinden kapatma ═══ */
.tkc-kapat { margin-top: 14px; border: 1px solid var(--cizgi); border-radius: 12px; padding: 0 16px; }
.tkc-kapat > summary { cursor: pointer; padding: 14px 0; font-weight: 600; font-size: .92rem; list-style: none; display: flex; justify-content: space-between; }
.tkc-kapat > summary::-webkit-details-marker { display: none; }
.tkc-kapat > summary::after { content: '▾'; color: var(--ink-500); }
.tkc-kapat[open] > summary::after { content: '▴'; }
.tkc-kapat form { display: flex; flex-direction: column; gap: 10px; padding-bottom: 16px; }
.tkc-secenek { display: flex; align-items: center; gap: 8px; font-size: .9rem; min-height: 32px; cursor: pointer; }
.tkc-kapat-dugme { border-color: var(--err); color: var(--err); }
.tkc-kapali { margin-top: 14px; }

/* ═══ PAKET 768 — hızlı işlem düğmeleri pencere açar (stil yok; kurulum işareti) ═══ */

/* ═══ PAKET 769 — bayi ekle penceresi · rehber açıklaması kapalı gelir ═══ */
.by-pencere .modal-card { width: 860px; }
.by-pencere .yt-bas { margin-bottom: 10px; }
.rh-nasil { margin-top: 14px; }
.rh-nasil > ul { margin: 6px 0 0; padding-left: 20px; color: var(--ink-600); font-size: .86rem; line-height: 1.6; }

/* ═══ PAKET 770 — GENEL BAKIŞ referans düzeni ═══ */
.gb-ikon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 12px; flex: none; }
.gb-ikon--turuncu { background: color-mix(in srgb, var(--marka-vurgu, var(--brand)) 14%, var(--yuzey)); color: var(--brand); }
.gb-ikon--mavi { background: color-mix(in srgb, var(--mavi) 12%, var(--yuzey)); color: var(--mavi); }
.gb-ikon--yesil { background: color-mix(in srgb, var(--ok) 13%, var(--yuzey)); color: var(--ok); }
.gb-ikon--mor { background: color-mix(in srgb, var(--mavi) 9%, var(--yuzey)); color: var(--mavi-950, var(--ink-900)); }
.dash-main > .baglan-kart { order: -6; }
.dash-main > .durum-serit { order: -5; }
.dash-main > .gb-sayilar { order: -4; }
.dash-main > .kurulum { order: -3; }
.dash-main > .gb-grafik { order: 10; }
.dash-main > .gb-sohbet { order: 11; }
.dash-main > .yen-kart { order: 12; }
.dash-main > .gb-donem { order: 13; }
.stat-cards.gb-sayilar > .stat-card { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 14px; align-items: center; }
.stat-cards.gb-sayilar > .stat-card > .gb-ikon { grid-row: 1 / span 3; }
.stat-cards.gb-sayilar > .stat-card > :not(.gb-ikon) { grid-column: 2; margin: 0; }
/* durum şeridi: tek satır, rozet yanında */
.dash-main > .durum-serit--dort { padding-top: 12px; padding-bottom: 12px; align-items: center; }
.dash-main > .durum-serit--dort .durum-oge { border-left: 1px solid var(--cizgi); padding-left: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.dash-main > .durum-serit--dort .durum-oge:first-child { border-left: 0; padding-left: 0; }
.dash-main > .durum-serit--dort .durum-lab { margin: 0; font-size: .86rem; color: var(--ink-900); }
.dash-main > .durum-serit--dort .durum-deger { margin: 0; }
.dash-main > .durum-serit--dort .durum-deger--sayi { font-size: .95rem; }
.dash-main > .durum-serit--dort .durum-not { flex-basis: 100%; font-size: .74rem; }
/* hızlı işlem sekmeleri */
.gb-hizli-sekme { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 22px 0; padding: 5px; border: 1px solid var(--cizgi); border-radius: 10px; }
.gb-hizli-sekme > button, .gb-hizli-sekme > a { border: 0; background: transparent; font: inherit; font-size: .88rem; font-weight: 600; color: var(--ink-600); padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; min-height: 36px; display: inline-flex; align-items: center; }
.gb-hizli-sekme > button:hover, .gb-hizli-sekme > a:hover { color: var(--ink-900); }
.gb-hizli-sekme > button.on { background: color-mix(in srgb, var(--marka-vurgu, var(--brand)) 13%, var(--yuzey)); color: var(--brand); }
.gb-hizli-sekme > button:focus-visible, .gb-hizli-sekme > a:focus-visible { outline: 2px solid var(--odak); outline-offset: 2px; }
.gb-hizli > .gb-hizli-ic { border: 0; box-shadow: none; background: transparent; margin: 0; border-radius: 0; }
.gb-hizli > .gb-hizli-ic > .panel-head h2 { display: none; }
.gb-hizli > .gb-hizli-ic > .panel-head { border: 0; padding-bottom: 0; min-height: 0; }
/* bugün kartı */
.dash-side > .hesap-kart { order: -2; }
.dash-side > .gb-bugun { order: -1; }
.gb-bugun-bas { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.gb-bugun-bas h2 { font-size: 1.05rem; font-weight: 700; margin: 0; }
.gb-bugun-bas span { font-size: .8rem; color: var(--ink-500); }
.gb-bugun-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.gb-kutu { display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid var(--cizgi); border-radius: 10px; text-decoration: none; color: inherit; min-width: 0; }
.gb-kutu:hover { border-color: var(--ink-300, var(--cizgi)); }
.gb-kutu .gb-ikon { width: 38px; height: 38px; border-radius: 10px; }
.gb-kutu-yazi { display: flex; flex-direction: column; min-width: 0; }
.gb-kutu-yazi em { font-style: normal; font-size: .74rem; color: var(--ink-500); }
.gb-kutu-yazi b { font-size: 1.05rem; font-weight: 700; color: var(--ink-900); }
.gb-bugun-bos { font-size: .84rem; color: var(--ink-500); margin: 0 0 8px; }
@media (max-width: 560px) { .gb-hizli-sekme { margin-left: 16px; margin-right: 16px; } }
.gb-bugun > a, .gb-bugun > span { display: inline-block; font-size: .88rem; font-weight: 600; }
.gb-bugun > a { color: var(--mavi); text-decoration: none; }
.gb-bugun > a:hover { text-decoration: underline; }

/* ═══ PAKET 771 — Genel Bakış durum şeridi kapalı gelir ═══ */
.dash-main > .gb-serit { grid-template-columns: repeat(4, minmax(0, 1fr)) auto; }
.gb-serit-ac { display: none; border: 0; background: transparent; font: inherit; font-size: .86rem; font-weight: 600; color: var(--ink-900); cursor: pointer; padding: 8px 10px; border-radius: 8px; min-height: 36px; align-self: center; white-space: nowrap; }
.gb-serit--js .gb-serit-ac { display: inline-flex; align-items: center; gap: 6px; }
.gb-serit-ac::before { content: '⚙'; font-size: 1rem; }
.gb-serit-ac:hover { background: var(--ink-100, var(--zemin)); }
.gb-serit-ac:focus-visible { outline: 2px solid var(--odak); outline-offset: 2px; }
.gb-serit--js:not(.acik) .durum-not:not(.durum-not--sorun):not(.durum-kaynak),
.gb-serit--js:not(.acik) .durum-ad-yenile,
.gb-serit--js:not(.acik) .sinir-elle { display: none; }
.gb-serit.acik { align-items: start; }
@media (max-width: 1080px) { .dash-main > .gb-serit { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gb-serit-ac { grid-column: 1 / -1; justify-self: start; } }
@media (max-width: 760px) { .dash-main > .gb-serit { grid-template-columns: 1fr; } }
.gb-serit--js:not(.acik) .durum-lab[data-kisa] { font-size: 0; white-space: nowrap; }
.gb-serit--js:not(.acik) .durum-lab[data-kisa]::before { content: attr(data-kisa); font-size: .86rem; }
.gb-serit--js:not(.acik) .durum-oge { flex-wrap: nowrap; padding-left: 12px; }
.gb-serit--js:not(.acik) .durum-oge:has(.durum-not--sorun) { flex-wrap: wrap; }
.gb-serit--js:not(.acik) .durum-deger { white-space: nowrap; }
@media (min-width: 761px) {
  .dash-main > .gb-serit.gb-serit--js:not(.acik) { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; }
  .gb-serit--js:not(.acik) .durum-oge { flex: 0 1 auto; min-width: 0; }
  .gb-serit--js:not(.acik) .gb-serit-ac { margin-left: auto; }
}
@media (min-width: 761px) { .dash-main > .gb-serit.gb-serit--js:not(.acik) { gap: 8px 12px; flex-wrap: nowrap; } .gb-serit--js:not(.acik) .gb-serit-ac { padding: 8px 4px; flex: none; } .gb-serit--js:not(.acik) .durum-oge { padding-left: 12px; overflow: hidden; } .dash-main > .gb-serit.gb-serit--js:not(.acik):has(.durum-not--sorun) { flex-wrap: wrap; } }
@media (max-width: 760px) { .dash-main > .gb-serit.gb-serit--js:not(.acik) { grid-template-columns: 1fr 1fr; gap: 10px; } .gb-serit--js:not(.acik) .durum-oge { flex-wrap: wrap; border-left: 0; padding-left: 0; } }

/* ═══ PAKET 772 — Genel Bakış: dönem seçimi · hat kartı · hızlı erişim ═══ */
.gb-donem-sec { display: inline-flex; margin: 0; }
.gb-donem-sec select { min-height: 40px; min-width: 132px; font-weight: 600; }
.gb-yan-bas { font-size: 1.05rem; font-weight: 700; margin: 0 0 14px; }
.dash-side .hesap-kart .hesap-numara { color: var(--mavi); font-weight: 700; }
.dash-side .hesap-kart .hesap-link { border: 1px solid var(--cizgi); border-radius: 10px; background: var(--yuzey); }
.dash-side .hesap-kart .hesap-link + .hint { display: none; }
.dash-side .hesap-kart .wa-profil > summary { border: 1px solid var(--cizgi); border-radius: 10px; padding: 10px 14px; font-weight: 600; font-size: .88rem; cursor: pointer; list-style: none; margin-top: 10px; }
.dash-side .hesap-kart .wa-profil > summary::-webkit-details-marker { display: none; }
.dash-side .hesap-kart .wa-profil > summary::after { content: ' →'; }
.dash-side .hizli .hizli-satir { padding: 9px 18px; position: relative; padding-right: 34px; }
.dash-side .hizli .hizli-satir::after { content: '›'; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--ink-400); font-size: 1.2rem; }
.dash-side .hizli .hizli-satir strong { font-size: .84rem; font-weight: 600; }
.dash-side .hizli .hizli-satir em { font-size: .73rem; }
.gb-kurulum-tamam { display: flex; align-items: center; gap: 8px; margin: 6px 10px 10px; padding: 9px 12px; border-radius: 8px; font-size: .82rem; font-weight: 600; text-decoration: none;
  background: color-mix(in srgb, var(--ok) 12%, var(--yuzey)); color: var(--ok); }
.gb-kurulum-tamam::before { content: '✓'; display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 999px; background: var(--ok); color: var(--yuzey); font-size: .7rem; }
.dash-main > .kurulum--bitti { order: 20; }

/* ═══ PAKET 773 — üst çubukta hesap ve kişi ═══ */
.ust-hesap { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border: 1px solid var(--cizgi); border-radius: 8px; background: var(--yuzey); color: var(--ink-900); font-size: .88rem; font-weight: 600; text-decoration: none; max-width: 240px; min-width: 0; }
.ust-hesap > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ust-hesap > svg { flex: none; color: var(--ink-500); }
.ust-hesap--tik::after { content: '⌄'; color: var(--ink-500); margin-left: 4px; line-height: 1; transform: translateY(-3px); }
.ust-hesap--tik:hover { border-color: var(--ink-300, var(--cizgi)); }
.ust-cubuk .hat-degistir { display: none; }
.ust-kisi { position: relative; }
.ust-kisi > summary { list-style: none; cursor: pointer; width: 40px; height: 40px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; font-weight: 700;
  background: color-mix(in srgb, var(--mavi) 14%, var(--yuzey)); color: var(--mavi-950, var(--ink-900)); }
.ust-kisi > summary::-webkit-details-marker { display: none; }
.ust-kisi > summary:focus-visible, .ust-hesap:focus-visible { outline: 2px solid var(--odak); outline-offset: 2px; }
.ust-kisi-menu { position: absolute; right: 0; top: 48px; z-index: 60; min-width: 220px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 12px; box-shadow: 0 12px 32px rgba(11, 23, 48, .14); padding: 8px; }
.ust-kisi-menu > p { margin: 0; padding: 8px 10px 10px; border-bottom: 1px solid var(--cizgi); display: flex; flex-direction: column; }
.ust-kisi-menu > p strong { font-size: .9rem; color: var(--ink-900); }
.ust-kisi-menu > p small { font-size: .74rem; color: var(--ink-500); }
.ust-kisi-menu > a { display: block; padding: 9px 10px; border-radius: 8px; font-size: .88rem; color: var(--ink-900); text-decoration: none; }
.ust-kisi-menu > a:hover { background: var(--ink-50, var(--zemin)); }
@media (max-width: 900px) { .ust-hesap { display: none; } }
@media (max-width: 900px) { .ust-kisi-menu { position: fixed; right: 12px; left: auto; top: 60px; max-width: calc(100vw - 24px); } }

/* ═══ PAKET 775 — belediyede sigorta ve maaş yazıları çizilmez (stil değişikliği yok) ═══ */

/* ═══ PAKET 776 — kişi silinince çapraz satış takip notu da silinir (stil değişikliği yok) ═══ */

/* ═══ PAKET 777 — açıklama işareti küçüldü: kapalıyken yalnız "i" yuvarlağı, satır kaplamaz ═══ */
.bilgi-kat:not([open]) { float: right; margin: 0 0 2px 8px; line-height: 1; }
.bilgi-kat:not([open]) > summary { gap: 0; padding: 0; min-height: 0; color: var(--ink-400, var(--ink-600)); }
.bilgi-kat:not([open]) > summary > .bilgi-kat-ad { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.bilgi-kat:not([open]) > summary::after { content: none; }
.bilgi-kat:not([open]) > summary::before { width: 16px; height: 16px; font-size: .66rem; border-width: 1px; opacity: .75; }
.bilgi-kat:not([open]) > summary:hover::before { opacity: 1; color: var(--brand); }
.bilgi-kat[open] { clear: both; }

/* ═══ PAKET 778 — ONAYLI TASARIMLAR V1: poliçe · yenileme takvimi · çapraz satış · müşteri kartı · bayi · personel · telefonda teklif listesi ═══ */
/* Pencere: uzun form görünür alana sığar, içi kayar (alttaki Kaydet'e ulaşılır). */
dialog.hk-pencere .modal-card { max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow-y: auto; }
/* 08 Poliçe Listesi */
.pol-modul { margin-bottom: 12px; }
.pol-tah-hucre { min-width: 150px; }
.pol-tah > summary { list-style: none; cursor: pointer; display: inline-flex; gap: 8px; align-items: center; }
.pol-tah > summary::-webkit-details-marker { display: none; }
.pol-tah-simdi { font-weight: 400; color: var(--ink-500); font-size: .82rem; }
.pol-tah[open] > summary { margin-bottom: 8px; }
.pol-tah .tahsilat-form { display: grid; gap: 6px; padding: 10px; border: 1px solid var(--cizgi); border-radius: 8px; background: var(--yuzey-2); min-width: 220px; }
.pol-tah .tahsilat-form .input { width: 100%; max-width: none; }
/* 09 Yenileme Takvimi */
.yt-kovalar { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px !important; }
.yt-kova { border-radius: 12px !important; padding: 14px 16px !important; min-width: 0 !important; }
.yt-kova.is-on { border-color: var(--brand) !important; box-shadow: 0 0 0 1px var(--brand) !important; }
.yt-kova b { font-size: 1.4rem !important; }
.yt-duzen--js { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 14px; align-items: start; }
.yt-duzen--js .yt-takip-hucre > .yt-takip-ic { display: none; }
.yt-duzen--js tr.yt-satir { cursor: pointer; }
.yt-duzen--js tr.yt-satir.is-secili > td { background: var(--brand-50); }
.yt-duzen--js tr.yt-satir.is-secili > td:first-child { box-shadow: inset 3px 0 0 var(--brand); }
.yt-duzen--js tr.yt-satir:focus-visible { outline: 2px solid var(--odak); outline-offset: -2px; }
.yt-panel { position: sticky; top: 76px; }
.yt-panel .yt-panel-kapat { display: none; }
.yt-panel-govde { padding: 0 20px 20px; }
.yt-kisi { display: flex; gap: 12px; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--cizgi); }
.yt-avatar { width: 44px; height: 44px; font-size: 1rem; flex: none; }
.yt-bilgi { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin: 14px 0; font-size: .9rem; }
.yt-bilgi dt { color: var(--ink-500); } .yt-bilgi dd { margin: 0; color: var(--ink-900); font-variant-numeric: tabular-nums; }
.yt-panel-form .yt-not { display: grid; gap: 8px; }
.yt-panel-form .yt-not .input { width: 100%; min-width: 0; }
.yt-panel-form .yt-not .btn { background: var(--brand); color: var(--ters-ink); border-color: var(--brand); justify-content: center; }
.yt-degisti { background: var(--uyari-50); color: var(--uyari); border-radius: 8px; padding: 8px 10px; margin-bottom: 10px; font-size: .86rem; display: flex; gap: 8px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.yt-degisti[hidden] { display: none; }
@media (max-width: 1199px) {
  .yt-duzen--js { grid-template-columns: minmax(0, 1fr); }
  .yt-panel { position: fixed; inset: 0 0 0 auto; width: min(420px, 100vw); z-index: 60; border-radius: 0; overflow-y: auto; transform: translateX(105%); transition: transform .18s ease; box-shadow: -8px 0 24px rgba(11, 23, 48, .18); top: 0; }
  .yt-panel.acik { transform: none; }
  .yt-panel .yt-panel-kapat { display: inline-flex; }
}
@media (prefers-reduced-motion: reduce) { .yt-panel { transition: none; } }
/* 10 Müşteri Kartı */
.mk-geciken { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center; padding: 10px 14px; margin: 0 0 14px; border: 1px solid var(--uyari-200); background: var(--uyari-50); color: var(--uyari); border-radius: 10px; text-decoration: none; font-size: .92rem; }
.mk-geciken span { font-weight: 600; }
.mk-duzen > .stat-cards > .stat-card .stat-card-value { font-size: 1.3rem; }
/* 07 Bayiler */
.by-tumliste > summary { cursor: pointer; color: var(--ink-600); font-size: .9rem; padding: 4px 0; }
.by-tumliste[open] > summary { margin-bottom: 12px; }
/* 06 Personel */
.pg-ekip-tablo th:nth-child(5), .pg-ekip-tablo td:nth-child(5) { display: none; }
/* 05 Teklif Listesi — telefonda kart */
@media (max-width: 700px) {
  .stat-cards.tkl-ozet { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .tkl-gorunum { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .tkl-gorunum > * { flex: none; }
  .tablo-kaydir > table.tkl-tablo { display: block; min-width: 0; width: 100%; }
  table.tkl-tablo > thead { display: none; }
  table.tkl-tablo > tbody { display: block; padding: 10px; min-width: 0 !important; width: auto; }
  table.tkl-tablo > tbody > tr { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 4px 10px; align-items: center;
    grid-template-areas: "sec no durum" "ad ad ad" "plaka plaka brans" "police police bekleme" "personel personel personel" "eylem eylem eylem";
    border: 1px solid var(--cizgi); border-radius: 12px; padding: 12px; margin-bottom: 10px; background: var(--yuzey); }
  table.tkl-tablo > tbody > tr > td { display: block; padding: 0; border: 0; min-width: 0 !important; text-align: left !important; white-space: normal !important; }
  table.tkl-tablo td.tkl-c-sec { grid-area: sec; } table.tkl-tablo td.tkl-c-no { grid-area: no; color: var(--ink-500); }
  table.tkl-tablo td.tkl-c-no strong::before { content: '#'; }
  table.tkl-tablo td.tkl-c-durum { grid-area: durum; justify-self: end; }
  table.tkl-tablo td.tkl-c-ad { grid-area: ad; font-size: 1.05rem; font-weight: 600; }
  table.tkl-tablo td.tkl-c-plaka { grid-area: plaka; } table.tkl-tablo td.tkl-c-brans { grid-area: brans; justify-self: end; color: var(--ink-600); }
  table.tkl-tablo td.tkl-c-police { grid-area: police; padding-top: 8px; margin-top: 4px; border-top: 1px solid var(--cizgi); color: var(--ink-600); }
  table.tkl-tablo td.tkl-c-police::before { content: attr(data-etiket) ': '; }
  table.tkl-tablo td.tkl-c-bekleme { grid-area: bekleme; justify-self: end; padding-top: 8px; margin-top: 4px; border-top: 1px solid var(--cizgi); font-size: .82rem; }
  table.tkl-tablo td.tkl-c-personel { grid-area: personel; } table.tkl-tablo td.tkl-c-personel select { width: 100%; min-height: 44px; }
  table.tkl-tablo td.tkl-eylem { grid-area: eylem; }
  table.tkl-tablo td.tkl-c-arac, table.tkl-tablo td.tkl-c-bayi { display: none; }
  table.tkl-tablo > tbody > tr > td:not([class*="tkl-"]) { grid-column: 1 / -1; }
}

/* ═══ PAKET 779 — onaylı tasarımların kalanı ═══ */
.yt-kayit { margin-left: auto; font-size: .86rem; font-weight: 600; white-space: nowrap; }
.yt-panel .panel-head { gap: 10px; }
.pol-ek { display: inline-block; position: relative; vertical-align: top; }
.pol-ek > summary { list-style: none; cursor: pointer; min-width: 36px; justify-content: center; font-weight: 700; }
.pol-ek > summary::-webkit-details-marker { display: none; }
.pol-ek-ic { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; min-width: 240px; padding: 12px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px; box-shadow: 0 8px 24px rgba(11, 23, 48, .14); text-align: left; }
.pol-tah-hucre { white-space: nowrap; } .pol-tah-hucre .pol-tah { display: inline-block; vertical-align: top; white-space: normal; }
.pol-sayfa { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.pol-sayfa-no { display: flex; gap: 4px; align-items: center; margin-left: auto; }
.pol-sayfa-no .btn { min-width: 36px; justify-content: center; }
.pol-boy { margin: 0; } .pol-boy .input { width: auto; }
.pg-ekip-islem { white-space: nowrap; text-align: right; }
.pg-kisayol { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 14px; }
.pg-kisayol a { display: block; padding: 14px 16px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 12px; color: inherit; text-decoration: none; }
.pg-kisayol a:hover { border-color: var(--brand); }
.pg-kisayol a[hidden] { display: none; }
.pg-kisayol strong { display: block; } .pg-kisayol span { color: var(--ink-600); font-size: .86rem; }
.bs-bolum { margin-bottom: 14px; }
.bs-dsekme { margin: 0 0 12px; } .bs-detay .bs-dsekme .btn { width: auto; margin-bottom: 0; }
.bs-detay [data-bs-pane] .bs-para { margin-bottom: 12px; }
.tkl-mobil { display: none; }
@media (max-width: 700px) {
  .tkl-mobil:not([hidden]) { display: flex; gap: 8px; padding: 0 14px 12px; }
  .tkl-mobil .btn { min-height: 44px; flex: 1; justify-content: center; }
  body.tkl-m details.tkl-suzgec:not([open]) { display: none; }
  body.tkl-m details.tkl-suzgec[open] { position: fixed; inset: auto 0 0 0; z-index: 70; max-height: 82dvh; overflow-y: auto; background: var(--yuzey); border-radius: 16px 16px 0 0; box-shadow: 0 -10px 40px rgba(11, 23, 48, .3); padding-bottom: 12px; }
  body.tkl-m details.tkl-suzgec[open] > summary { pointer-events: none; }
  body.tkl-m details.tkl-suzgec[open] > summary a { pointer-events: auto; }
  body.tkl-m .tkl-cek-kapat { position: absolute; right: 10px; top: 8px; min-width: 44px; min-height: 44px; justify-content: center; font-size: 1.2rem; z-index: 1; }
  body.tkl-m:not(.tkl-sec-acik) table.tkl-tablo td.tkl-c-sec, body.tkl-m:not(.tkl-sec-acik) #tkToplu { display: none !important; }
}
@media (min-width: 701px) { .tkl-cek-kapat { display: none; } }
.bs-detay .bs-dsekme .btn { border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; box-shadow: none; }
.bs-detay .bs-dsekme .btn.is-active { border-bottom-color: var(--brand); color: var(--brand); }

/* PAKET 780 — İçerik Stüdyosu stil/betik adresi sürümlü (yalnız işaret) */
/* PAKET 781 — Web Sitem ve yaratıcı stüdyo çerçevelerinde stil/betik adresi sürümlü (yalnız işaret) */
/* PAKET 782 — kısa açıklama cümleleri de "i" işaretine toplanır (kural assets/kisa-metin.js · yalnız işaret) */
/* PAKET 783 — servis mesajı sayacı (Bakiye ekranı · yalnız işaret) */
/* PAKET 784 — acente günlük özeti (inc/bildirim.php · yalnız işaret) */

/* ═══ PAKET 785 — MOBİL GÖRÜNÜM ONARIMI ═══
   751'in `.side { width: 232px }` kuralı telefonda da geçerliydi: lacivert bant ekranın yarısında kesiliyordu. */
@media (max-width: 900px) {
  .side { width: 100%; }
}
@media (max-width: 767px) {
  /* Üst çubuk TEK SATIR: arama + zil + kişi. Sayfa yolu gizlenir (başlık hemen altında yazıyor). */
  .ust-cubuk { flex-wrap: nowrap; align-items: center; gap: 8px; padding: 8px 14px; }
  .ust-cubuk .ust-yol { display: none; }
  .ust-cubuk-sag { flex-wrap: nowrap; gap: 8px; width: 100%; margin: 0; }
  .ust-cubuk-sag .ust-ara { order: -1; flex: 1 1 auto; min-width: 0; }
  .ust-cubuk-sag > :not(.ust-ara) { flex: none; }

  /* Sekme şeritleri alt alta dağılmaz; yana kaydırılır. */
  .sekme-cizgi, .yen-sekme, .gb-hizli-sekme { display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .sekme-cizgi::-webkit-scrollbar, .yen-sekme::-webkit-scrollbar, .gb-hizli-sekme::-webkit-scrollbar { display: none; }
  .sekme-cizgi > *, .yen-sekme > *, .gb-hizli-sekme > * { flex: none; white-space: nowrap; }

  /* Eylem düğmeleri iki sütun; ana düğme tam satır. */
  .pg-eylem { grid-template-columns: 1fr 1fr; gap: 8px; }
  .pg-eylem > .pg-eylem-ana { grid-column: 1 / -1; }
  .pg-eylem > .btn { min-height: 44px; padding: 8px 10px; white-space: normal; text-align: center; justify-content: center; font-size: .86rem; }
  .pg-kisayol { grid-template-columns: 1fr; }

  /* Simgeli özet kartı: yazı kelime kelime kırılmasın. */
  .stat-cards.bs-ozet { grid-template-columns: 1fr 1fr; gap: 10px; }
  .stat-cards.bs-ozet > .stat-card { padding: 12px 12px 12px 56px; min-height: 72px; }
  .stat-cards.bs-ozet > .stat-card > :first-child:not(p) { left: 12px; width: 34px; height: 34px; }
  .bs-ozet .stat-card-value { font-size: 1.15rem; white-space: normal; }
  .bs-ozet .stat-card-label { font-size: .78rem; }

  .stat-cards.gb-sayilar > .stat-card { grid-template-columns: 34px minmax(0, 1fr); column-gap: 10px; padding: 12px; }
  .stat-cards.gb-sayilar > .stat-card > .gb-ikon { width: 34px; height: 34px; }
  .stat-cards.gb-sayilar .stat-card-label { font-size: .78rem; }

  /* Genel Bakış hat şeridi: tek sütun, etiket tam adıyla. */
  .dash-main > .gb-serit.gb-serit--js:not(.acik), .dash-main > .gb-serit { grid-template-columns: 1fr; gap: 8px; }
  .gb-serit--js:not(.acik) .durum-lab[data-kisa] { font-size: .86rem; white-space: normal; }
  .gb-serit--js:not(.acik) .durum-lab[data-kisa]::before { content: none; }
  .gb-serit .durum-oge { min-width: 0; }
  .gb-serit .durum-deger, .gb-serit--js:not(.acik) .durum-deger { white-space: normal; }
}
/* PAKET 786 — İçerik Stüdyosu yapay zekâ ucu (panel/icerik-studyosu-yz.php · yalnız işaret) */
/* PAKET 787 — Web Sitem panelden yayın (inc/web-sitem-yayin.php · panel/web-sitem-yayin.php · yalnız işaret) */

/* ═══ PAKET 788 — KOYU TEMA ═══
   Kişi menüsündeki "Koyu tema" düğmesi <html data-tema="koyu"> yazar. Renkler TOKENLARDAN döner;
   aşağıdaki ek kurallar, tokene bağlı olmayan yüzeyler içindir (taramayla bulundu). */
:root[data-tema="koyu"] {
  color-scheme: dark;
  --yuzey:#161F31; --yuzey-2:#1B263B; --zemin:#0D1422;
  --ink-950:#F5F7FB; --ink-900:#E9EDF5; --ink-800:#D6DCE8; --ink-700:#C0C8D8; --ink-600:#AAB4C8;
  --ink-500:#98A4BA; --ink-400:#8792AA; --ink-300:#5A6680; --ink-200:#303E5A; --ink-100:#232F48; --ink-50:#1B263B;
  --cizgi:#2A3853; --cizgi-koyu:#384864;
  --brand:#D9501F; --brand-600:#E8643A; --brand-300:#8F4728; --brand-50:#3A2016; --brand-100:#4B281A;
  --mavi-950:#DDE8FD; --mavi-800:#BCD2FA; --mavi-600:#93B8F8; --mavi:#77A6F6; --mavi-300:#3F6FB2; --mavi-50:#17243F; --mavi-100:#1F3156;
  --ok:#52C790; --ok-50:#112A20; --ok-200:#1F4B38;
  --err:#F27F73; --err-50:#34191B; --err-200:#5C2B2D;
  --uyari:#E3B446; --uyari-50:#2F2711; --uyari-200:#564719;
  --golge-sm:0 1px 2px rgba(0,0,0,.35); --golge:0 2px 8px rgba(0,0,0,.40); --golge-lg:0 16px 40px rgba(0,0,0,.50);
  --odak:#93B8F8;
}
.ust-tema { display: block; width: 100%; text-align: left; padding: 9px 10px; border: 0; border-radius: 8px; background: transparent; font: inherit; font-size: .88rem; color: var(--ink-900); cursor: pointer; }
.ust-tema:hover { background: var(--ink-50, var(--zemin)); }
:root[data-tema="koyu"] img.side-logo-img, :root[data-tema="koyu"] .side img { filter: none; }
:root { --sabit-koyu:#17233B; }
:root[data-tema="koyu"] .flash--uyari, :root[data-tema="koyu"] .notice--warn, :root[data-tema="koyu"] .uyari-kutu,
:root[data-tema="koyu"] .mn-uyari, :root[data-tema="koyu"] .yt-uyari, :root[data-tema="koyu"] .anket-yorum--dikkat,
:root[data-tema="koyu"] .as-bol--kapali { background: var(--uyari-50) !important; border-color: var(--uyari-200) !important; color: var(--ink-900) !important; }
:root[data-tema="koyu"] .flash--uyari :is(a, strong, b), :root[data-tema="koyu"] .notice--warn :is(a, strong, b),
:root[data-tema="koyu"] .uyari-kutu :is(a, strong, b, h3) { color: inherit !important; }
:root[data-tema="koyu"] .body pre { background: var(--ink-50) !important; color: var(--ink-900) !important; border-color: var(--cizgi) !important; }
:root[data-tema="koyu"] .body :is(h3, h4) { background-color: transparent !important; }
/* WhatsApp balonu önizlemeleri açık kalır (gerçek görünümü taklit ediyorlar); yazıları sabit koyu. */
:root[data-tema="koyu"] :is(.sablon-onizleme, .mm-onizleme, .yen-sablon-kutu, .as-sb-on, .kart-no, .nm-harf, .mm-yer, .mm-rozet, .sablon-kat--pazar, .yen-baskasi, .as-rz--kapali),
:root[data-tema="koyu"] :is(.sablon-onizleme, .mm-onizleme, .yen-sablon-kutu) * { color: var(--sabit-koyu) !important; }
:root[data-tema="koyu"] :is(.ca-borclu, .tk-gec, .ia-durum--kapali, .rozet--kotu, .as-bol-bos) { color: var(--err) !important; }
:root[data-tema="koyu"] .ca-alacakli { color: var(--ok) !important; }
:root[data-tema="koyu"] .tk-tut { color: var(--ink-900) !important; }
:root[data-tema="koyu"] .sablon-kat--bilgi { color: var(--mavi) !important; }
:root[data-tema="koyu"] .sabit-sekme a.is-on, :root[data-tema="koyu"] a.is-on:not(.sekme) { background: var(--brand-50) !important; color: var(--ink-950) !important; }
:root[data-tema="koyu"] pre { background: var(--ink-50) !important; color: var(--ink-900) !important; border-color: var(--cizgi) !important; }
:root[data-tema="koyu"] .ga-bolum h4 { color: var(--ink-900) !important; }

/* ═══ PAKET 789 — koyu tema anahtarı üst çubukta ═══ */
.tema-anahtar { flex: none; position: relative; width: 52px; height: 28px; min-height: 0 !important; max-height: 28px; align-self: center; padding: 0; border: 1px solid var(--cizgi-koyu); border-radius: 999px; background: var(--ink-100); cursor: pointer; transition: background .15s; }
.tema-anahtar-top { position: absolute; top: 2px; left: 2px; width: 22px; height: 22px; border-radius: 50%; background: var(--yuzey); box-shadow: var(--golge-sm); display: flex; align-items: center; justify-content: center; font-size: 12px; line-height: 1; transition: transform .15s; }
.tema-anahtar-top::before { content: '☀'; color: var(--uyari); }
.tema-anahtar[aria-checked="true"] { background: var(--mavi-100); border-color: var(--mavi-300); }
.tema-anahtar[aria-checked="true"] .tema-anahtar-top { transform: translateX(24px); }
.tema-anahtar[aria-checked="true"] .tema-anahtar-top::before { content: '☾'; color: var(--mavi); }
.tema-anahtar:focus-visible { outline: 2px solid var(--odak); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .tema-anahtar, .tema-anahtar-top { transition: none; } }
/* PAKET 790 — stüdyo yapay zekâ bölümüyle açılır · logo yerleşimleri çeşitlendi (yalnız işaret) */
/* ═══ PAKET 791 — içerik stüdyosu: logolar büyütüldü (yalnız işaret) ═══ */
/* ═══ PAKET 792 — içerik stüdyosu: özel gün zemini yapay zekâdan (yalnız işaret) ═══ */

/* ═══ PAKET 793 — telefonda geniş tablo kart olur (table.mob-kart) · yönetimde tema anahtarı ═══ */
@media (max-width: 700px) {
  .tablo-kaydir:has(> table.mob-kart) { overflow: visible; border: 0; }
  .tablo-kaydir > table.mob-kart { display: block; min-width: 0 !important; width: 100%; }
  table.mob-kart > thead { display: none; }
  table.mob-kart > tbody { display: block; min-width: 0 !important; width: auto; }
  table.mob-kart > tbody > tr { display: block; margin: 0 0 10px; padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 12px; background: var(--yuzey); box-shadow: var(--golge-sm); }
  table.mob-kart > tbody > tr > td { display: flex; gap: 12px; justify-content: space-between; align-items: baseline; width: auto !important; min-width: 0 !important; padding: 5px 0; border: 0; text-align: right !important; white-space: normal !important; overflow-wrap: anywhere; }
  table.mob-kart > tbody > tr > td[data-bas]::before { content: attr(data-bas); flex: none; max-width: 42%; text-align: left; font-family: var(--font-metin); font-size: .78rem; font-weight: 600; color: var(--ink-500); }
  table.mob-kart > tbody > tr > td:empty { display: none; }
  table.mob-kart > tbody > tr > td[colspan] { display: block; text-align: left !important; }
  table.mob-kart > tbody > tr > td > details { text-align: left; }
  table.mob-kart .hide-sm { display: flex !important; }
}
.side-kisi-islem .tema-anahtar { margin-left: auto; }
/* 793 — koyu tema: telefonda ölçülen açık kalan rozetler ve okunmayan yazılar */
:root[data-tema="koyu"] .sablon-kat, :root[data-tema="koyu"] .mm-rozet, :root[data-tema="koyu"] .mm-yer, :root[data-tema="koyu"] .as-sb-on, :root[data-tema="koyu"] .kart-no, :root[data-tema="koyu"] .nm-harf, :root[data-tema="koyu"] .as-rz--kapali { background: var(--ink-100) !important; color: var(--ink-900) !important; border-color: var(--cizgi-koyu) !important; }
:root[data-tema="koyu"] .rozet--kotu { background: var(--err-50) !important; color: var(--err) !important; }
:root[data-tema="koyu"] .body pre { background: var(--yuzey-2) !important; color: var(--ink-900) !important; }
:root[data-tema="koyu"] .yen-alt, :root[data-tema="koyu"] .body .hint-kirp, :root[data-tema="koyu"] .body .hint-ac { color: var(--ink-600) !important; }

/* ═══ PAKET 794 — lacivert yerine mat siyah: sol menü (iki temada) ve koyu temanın zeminleri ═══ */
:root {
  --menu-zemin:#141414; --menu-cizgi:#262626; --menu-cizgi-2:#333333;
  --menu-yazi:#E2E2E2; --menu-yazi-guclu:#FFFFFF; --menu-yazi-2:#BDBDBD; --menu-yazi-3:#989898;
  --menu-yuzey:#1E1E1E; --menu-yuzey-2:#282828;
  --menu-aktif:#2B2B2B; --menu-aktif-yazi:#FFFFFF; --menu-ikon:#CFCFCF;
}
:root[data-tema="koyu"] {
  --yuzey:#1A1A1A; --yuzey-2:#212121; --zemin:#101010;
  --ink-950:#F6F6F6; --ink-900:#EBEBEB; --ink-800:#DADADA; --ink-700:#C6C6C6; --ink-600:#B0B0B0;
  --ink-500:#9E9E9E; --ink-400:#8C8C8C; --ink-300:#626262; --ink-200:#3A3A3A; --ink-100:#2A2A2A; --ink-50:#212121;
  --cizgi:#2E2E2E; --cizgi-koyu:#404040;
  --mavi-50:#1B2230; --mavi-100:#243044;
}

/* ═══ PAKET 795 — TELEFONDA ÜST ÇUBUK SIĞIYOR ═══
   Çok hatlı hesapta hat adı + "değiştir" düğmesi çubuğu ekranın dışına
   itiyordu. Telefonda hat düğmesi yalnız simge, arama kalan yeri alır,
   hiçbir öğe çubuğu genişletemez. Sayı kartlarında sözcük ortadan bölünmez. */
@media (max-width: 767px) {
  .ust-cubuk { max-width: 100%; min-width: 0; box-sizing: border-box; overflow: hidden; }
  .ust-cubuk-sag { min-width: 0; gap: 8px; }
  .ust-cubuk-sag .ust-ara { flex: 1 1 0; min-width: 96px; }
  .ust-cubuk .hat-degistir { width: 40px; height: 40px; padding: 0; justify-content: center; }
  .ust-cubuk .hat-degistir > span { display: none; }
  .ust-cubuk .bildirim-zil { min-width: 40px; padding-left: 8px; padding-right: 8px; }
  div.nm-liste { grid-template-columns: minmax(0, 1fr); }
  div.nm-liste .nm-kart, div.nm-liste .nm-dugme { min-width: 0; max-width: 100%; box-sizing: border-box; }
  .stat-card-label, .kd-etiket, .stat-ad, .stat-card-value { overflow-wrap: break-word; word-break: normal; hyphens: none; }
}
@media (max-width: 359px) {
  .ust-cubuk .tema-anahtar { display: none; }
}
/* Güvence: tek bir öğe sayfayı yana kaydıramaz. */
@media (max-width: 900px) { html, body { overflow-x: clip; } }

/* ═══ PAKET 796 — ÇAĞRI MERKEZİ AYAR EKRANI ═══ */
.snt-alan { display: grid; gap: 16px; }
.snt-alan h2 { font-size: 1.02rem; font-weight: 700; color: var(--ink-900); margin: 0 0 12px; }
.snt-acik { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.snt-acik h2 { margin-bottom: 2px; }
.snt-acik .hint { margin: 0; }
.snt-iki { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.snt-no { width: 84px; text-align: center; font-variant-numeric: tabular-nums; }
.snt-alt { display: flex; justify-content: flex-end; margin-top: 12px; }
.snt-cihaz { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 14px; margin: 4px 0 8px; font-size: .9rem; }
.snt-cihaz dt { color: var(--ink-500); }
.snt-cihaz dd { margin: 0; font-weight: 600; color: var(--ink-900); overflow-wrap: anywhere; }
.snt-kurulum { padding: 16px; }
.snt-alan .panel > .panel-body { padding: 18px 20px; }
@media (max-width: 900px) { .snt-iki { grid-template-columns: minmax(0, 1fr); } }

/* ═══ PAKET 797 — PANELDE TELEFON ═══ */
.tel-dugme { position: relative; min-width: 40px; padding-left: 10px; padding-right: 10px; }
.tel-nokta { position: absolute; top: 7px; right: 7px; width: 8px; height: 8px; border-radius: 50%; background: var(--ink-300, var(--cizgi-koyu)); }
.tel-dugme[data-durum="hazir"] .tel-nokta { background: var(--ok); }
.tel-dugme[data-durum="caliyor"] .tel-nokta, .tel-dugme[data-durum="arama"] .tel-nokta, .tel-dugme[data-durum="konusma"] .tel-nokta { background: var(--brand); }
.tel-dugme[data-durum="koptu"] .tel-nokta { background: var(--err); }
.tel-gelen { position: fixed; right: 20px; bottom: 20px; z-index: 1200; width: min(320px, calc(100vw - 32px)); background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 14px; box-shadow: 0 18px 48px rgba(0, 0, 0, .22); }
.tel-gelen-ic { padding: 16px 18px; }
.tel-gelen-ust { margin: 0 0 4px; font-size: .74rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--brand); }
.tel-gelen-ad { margin: 0; font-size: 1.05rem; font-weight: 700; color: var(--ink-900); overflow-wrap: anywhere; }
.tel-gelen-alt { margin: 2px 0 12px; font-size: .84rem; color: var(--ink-500); min-height: 1em; }
.tel-gelen-dugme { display: flex; gap: 8px; }
.tel-gelen-dugme .btn { flex: 1 1 0; justify-content: center; }
.tel-kutu [hidden], .tel-gelen[hidden] { display: none !important; }
.tel-govde { margin: 0; background: var(--zemin); min-height: 100vh; }
.tel-kutu { max-width: 360px; margin: 0 auto; padding: 18px; display: grid; gap: 14px; }
.tel-bas { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tel-bas strong { font-size: 1rem; color: var(--ink-900); }
.tel-durum { font-size: .82rem; font-weight: 600; color: var(--ink-500); }
.tel-kutu[data-durum="hazir"] .tel-durum { color: var(--ok); }
.tel-kutu[data-durum="koptu"] .tel-durum { color: var(--err); }
.tel-genis { width: 100%; justify-content: center; }
.tel-kutu section { display: grid; gap: 12px; }
.tel-no { font-size: 1.2rem; text-align: center; letter-spacing: .04em; }
.tel-tus { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.tel-tus .btn { justify-content: center; height: 48px; font-size: 1.1rem; font-weight: 600; }
.tel-kim { margin: 8px 0 0; text-align: center; font-size: 1.25rem; font-weight: 700; color: var(--ink-900); overflow-wrap: anywhere; }
.tel-kim-alt, .tel-sure { margin: 0; text-align: center; font-size: .9rem; color: var(--ink-500); min-height: 1.2em; }
.tel-sure { font-variant-numeric: tabular-nums; font-weight: 600; }
.tel-kart { text-align: center; font-size: .9rem; font-weight: 600; }
.tel-eylem { display: flex; gap: 8px; }
.tel-eylem .btn { flex: 1 1 0; justify-content: center; }
.tel-kapat { background: var(--err); color: var(--yuzey); border-color: var(--err); }
.tel-sessiz[aria-pressed="true"], #tel-sessiz[aria-pressed="true"] { background: var(--ink-900); color: var(--yuzey); }
.tel-hata { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--err-50); color: var(--err); font-size: .86rem; }
@media (max-width: 767px) { .tel-gelen { right: 16px; bottom: 16px; } }

/* ═══ PAKET 798 — ÇAĞRI MERKEZİ · DAĞITIM ═══ */
.snt-dort { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 16px; align-items: end; }
.snt-kutu { display: flex; align-items: center; gap: 8px; grid-column: 1 / -1; font-size: .92rem; color: var(--ink-900); }
@media (max-width: 900px) { .snt-dort { grid-template-columns: minmax(0, 1fr); } }

/* ═══ PAKET 799 — ÇAĞRI MERKEZİ · RAPOR VE MODÜL HAKKI ═══ */
.snt-kucuk { font-size: .82rem; font-weight: 500; color: var(--ink-500); }
.snt-suz { margin: 0 0 12px; }
.snt-rapor td:not(:first-child), .snt-rapor th:not(:first-child) { font-variant-numeric: tabular-nums; }

/* ═══ PAKET 800 — ÇAĞRI MERKEZİ · GÖRÜŞME KAYDI ═══ */
.snt-iki--ic { margin-bottom: 4px; }
.snt-anons audio, .snt-dinle { width: 100%; max-width: 260px; height: 36px; }
.snt-dinle { min-width: 200px; }
.snt-kayit-ayar { display: grid; gap: 12px; align-content: start; }

/* ═══ PAKET 801 — çağrı merkezi: kişi silme sözü (stil değişikliği yok) ═══ */

/* ═══ PAKET 802 · "Çok yakında" tanıtım kartı ═══ */
.yk-kart{max-width:560px;margin:48px auto;padding:40px 32px 32px;text-align:center;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:16px;box-shadow:0 8px 28px rgba(0,0,0,.06)}
.yk-simge{width:72px;height:72px;margin:0 auto 18px;display:grid;place-items:center;border-radius:20px;color:var(--brand);background:color-mix(in srgb,var(--brand) 12%,transparent)}
.yk-rozet{display:inline-block;padding:5px 14px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand);border:1px solid color-mix(in srgb,var(--brand) 40%,transparent)}
.yk-bas{margin:14px 0 8px;font-size:26px;font-weight:800;color:var(--ink)}
.yk-soz{margin:0 auto 20px;max-width:420px;font-size:15px;line-height:1.55;color:var(--ink-2)}
.yk-liste{list-style:none;margin:0 auto 22px;padding:0;max-width:380px;text-align:left;display:grid;gap:10px}
.yk-liste li{position:relative;padding-left:28px;font-size:14px;color:var(--ink)}
.yk-liste li::before{content:"";position:absolute;left:4px;top:3px;width:6px;height:11px;border:solid var(--brand);border-width:0 2px 2px 0;transform:rotate(45deg)}
.yk-alt{margin:0;padding-top:18px;border-top:1px solid var(--cizgi);font-size:13px;color:var(--ink-3)}
@media (max-width:767px){.yk-kart{margin:16px auto;padding:28px 18px 22px}.yk-bas{font-size:22px}}

/* ═══ PAKET 803 · yönetim dahilisi 999 (stil yok · yalnız işaret) ═══ */

/* ═══ PAKET 804 · TELEFONDA KAYMA: ızgara/esnek kutu çocuğu içeriği kadar genişliyordu ═══
   Sıfır özgüllük (:where): yalnız tarayıcının varsayılan "auto" değerini ezer,
   yazılmış bir min-width kuralına dokunmaz. */
@media (max-width: 900px) {
  :where(.body, .main) :where(div, section, form, aside, article, ul, ol, li, fieldset, nav, header, footer, p, label, details, summary, table, pre, code) { min-width: 0; }
  :where(.body) :where(pre, code) { white-space: pre-wrap; overflow-wrap: anywhere; }
  :where(.body) :where(.panel, .kart, .anket-yorum, .kisa-kutu, .hint, h1, h2, h3) { overflow-wrap: break-word; }
  :where(.body) :where(img, video, iframe, canvas, svg) { max-width: 100%; }
}
@media (max-width: 1199px) { .yt-panel:not(.acik) { visibility: hidden; } }

/* ═══ PAKET 805 · Telefon sayfanın sağında ═══ */
.tel-yan { position: fixed; top: 0; right: 0; bottom: 0; width: min(340px, 100vw); z-index: 1150; background: var(--zemin); border-left: 1px solid var(--cizgi); box-shadow: -8px 0 28px rgba(0, 0, 0, .12); display: flex; flex-direction: column; }
.tel-yan[hidden] { display: none !important; }
.tel-yan iframe { flex: 1 1 auto; width: 100%; border: 0; min-height: 0; }
.tel-yan-kapat { align-self: flex-end; width: 36px; height: 36px; margin: 6px 8px 0 0; border: 0; border-radius: 8px; background: transparent; color: var(--ink-2); font-size: 22px; line-height: 1; cursor: pointer; }
.tel-yan-kapat:hover { background: var(--yuzey); color: var(--ink); }
.tel-gezgin { position: fixed; inset: 0; width: 100%; height: 100%; border: 0; z-index: 1100; background: var(--zemin); }
.tel-gomulu .tel-kutu { padding-top: 4px; }
@media (min-width: 1100px) {
  body.tel-yan-acik { padding-right: 340px; }
  body.tel-yan-acik .tel-gezgin { width: calc(100% - 340px); }
  body.tel-yan-acik .tel-gelen { right: 360px; }
}
@media (max-width: 1699px) { body.tel-yan-acik .ust-hesap, body.tel-icte .ust-hesap { display: none; } }

/* ═══ PAKET 806 · Çağrı Merkezi ve Telefon: onaylı tasarım ═══ */
.snt-tel-ac { gap: 8px; }
.snt-tel-ac svg { width: 18px; height: 18px; }
.snt-nokta { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 10px; vertical-align: middle; background: var(--err); }
.snt-nokta--ok { background: var(--ok); }
.snt-sekme { margin: 0; }
.snt-alan [hidden] { display: none !important; }
.snt-iki--genis { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.snt-yan { display: grid; gap: 16px; }
.snt-alan h2 { margin-bottom: 4px; }
.snt-alt-bas { margin: 0 0 14px; }
.snt-bas-satir { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px !important; }
.snt-liste { border: 1px solid var(--cizgi); border-radius: 10px; overflow: hidden; }
.snt-liste-bas { display: flex; justify-content: space-between; padding: 10px 16px; font-size: .78rem; font-weight: 700; color: var(--ink-500); background: var(--zemin); }
.snt-liste-bas span:last-child { width: 104px; }
.snt-kisi { display: flex; align-items: center; gap: 14px; padding: 8px 16px; border-top: 1px solid var(--cizgi); cursor: text; }
.snt-kisi-ad { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; color: var(--ink-900); font-size: .92rem; }
.snt-kisi .snt-no { width: 104px; flex: 0 0 auto; text-align: left; }
.snt-avatar { flex: 0 0 auto; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-size: .78rem; font-weight: 700; background: var(--mavi-50); color: var(--mavi); }
.snt-avatar--1 { background: var(--brand-50); color: var(--brand); }
.snt-avatar--2 { background: var(--ok-50); color: var(--ok); }
.snt-avatar--3 { background: var(--uyari-50); color: var(--uyari); }
.snt-avatar--4 { background: var(--err-50); color: var(--err); }
.snt-bilgi { display: block; margin: 0 0 4px; padding-left: 26px; position: relative; font-size: .86rem; color: var(--ink-500); }
.snt-bilgi::before { content: "i"; position: absolute; left: 0; top: 1px; width: 17px; height: 17px; border: 1.5px solid var(--mavi); border-radius: 50%; color: var(--mavi); font-size: 11px; font-weight: 700; line-height: 15px; text-align: center; }
.snt-modul-satir { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; font-size: .94rem; color: var(--ink-900); }
.snt-modul-satir + .snt-modul-satir { border-top: 1px solid var(--cizgi); }
.snt-modul-satir .btn { min-width: 96px; justify-content: center; }
.snt-kapat { background: var(--yuzey); color: var(--brand); border: 1px solid var(--brand); }
.snt-kart-bas { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.snt-kart-bas p { margin: 0; }
.snt-simge { flex: 0 0 auto; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: var(--brand-50); color: var(--brand); }
.snt-dort .field { align-self: start; }
.snt-dort .field .snt-kucuk { display: block; margin-top: 4px; }
.snt-alt--iki { justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.snt-alt--cizgi { padding-top: 14px; border-top: 1px solid var(--cizgi); }
.snt-kutu { grid-column: auto; align-items: flex-start; }
.snt-kutu small { display: block; }
.snt-kutu input { margin-top: 3px; accent-color: var(--brand); width: 17px; height: 17px; }
.snt-anons { display: grid; gap: 10px; align-content: start; }
.snt-birak { display: grid; justify-items: center; gap: 4px; padding: 22px 16px; border: 1.5px dashed var(--cizgi-koyu, var(--cizgi)); border-radius: 10px; color: var(--ink-500); cursor: pointer; text-align: center; position: relative; }
.snt-birak strong { color: var(--ink-900); font-size: .92rem; }
.snt-birak input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.snt-birak:hover { border-color: var(--brand); }
.snt-genis { width: 100%; justify-content: center; }
.snt-anahtar { display: flex; align-items: center; gap: 12px; font-size: .94rem; color: var(--ink-900); cursor: pointer; }
.snt-anahtar input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.snt-anahtar-ray { flex: 0 0 auto; width: 46px; height: 26px; border-radius: 999px; background: var(--cizgi-koyu, var(--cizgi)); position: relative; transition: background .15s; }
.snt-anahtar-ray::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--yuzey); box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: transform .15s; }
.snt-anahtar input:checked + .snt-anahtar-ray { background: var(--brand); }
.snt-anahtar input:checked + .snt-anahtar-ray::after { transform: translateX(20px); }
.snt-anahtar input:disabled + .snt-anahtar-ray { opacity: .5; }
.snt-anahtar input:focus-visible + .snt-anahtar-ray { outline: 2px solid var(--brand); outline-offset: 2px; }
.snt-bos { display: grid; justify-items: center; gap: 4px; padding: 26px 12px 18px; text-align: center; color: var(--ink-900); font-size: .92rem; }
.snt-bos-simge { width: 60px; height: 60px; border-radius: 50%; display: grid; place-items: center; background: var(--zemin); color: var(--ink-500); margin-bottom: 8px; }
@media (max-width: 900px) { .snt-iki--genis, .snt-iki { grid-template-columns: minmax(0, 1fr); } .snt-dort { grid-template-columns: minmax(0, 1fr); } }

.tel-govde { display: flex; flex-direction: column; background: var(--yuzey); }
.tel-ust { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--menu-zemin); color: var(--menu-yazi-guclu); }
.tel-ust img { height: 26px; width: auto; max-width: 120px; object-fit: contain; }
.tel-ust-ad { padding-left: 12px; border-left: 1px solid var(--menu-cizgi); font-size: .92rem; }
.tel-ust-kapat { margin-left: auto; width: 34px; height: 34px; border: 0; border-radius: 8px; background: transparent; color: inherit; font-size: 24px; line-height: 1; cursor: pointer; }
.tel-ust-kapat:hover { background: var(--menu-yuzey); }
.tel-kutu { width: 100%; max-width: 420px; padding: 0 18px 16px; gap: 16px; flex: 1 1 auto; align-content: start; }
.tel-bas { margin: 0 -18px; padding: 12px 18px; border-bottom: 1px solid var(--cizgi); }
.tel-bas-sol { display: flex; align-items: center; gap: 12px; color: var(--ink-900); }
.tel-bas strong { font-size: 1.05rem; }
.tel-durum { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border-radius: 999px; background: var(--zemin); font-size: .8rem; font-weight: 600; color: var(--ink-500); }
.tel-durum::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: currentColor; }
.tel-kutu[data-durum="hazir"] .tel-durum { background: var(--ok-50); color: var(--ok); }
.tel-kutu[data-durum="koptu"] .tel-durum { background: var(--err-50); color: var(--err); }
.tel-kutu[data-durum="caliyor"] .tel-durum, .tel-kutu[data-durum="arama"] .tel-durum, .tel-kutu[data-durum="konusma"] .tel-durum { background: var(--brand-50); color: var(--brand); }
.tel-karsilama { justify-items: center; text-align: center; padding-top: 18px; }
.tel-buyuk-simge { width: 120px; height: 120px; border-radius: 50%; display: grid; place-items: center; background: var(--mavi-50); color: var(--ink-900); }
.tel-karsilama h1 { margin: 6px 0 0; font-size: 1.3rem; font-weight: 800; color: var(--ink-900); }
.tel-acik { margin: 0; font-size: .92rem; color: var(--ink-500); }
.tel-genis { height: 50px; font-size: 1.02rem; gap: 10px; }
.tel-not { width: 100%; display: grid; gap: 2px; padding: 12px 14px; border-radius: 10px; text-align: left; font-size: .88rem; color: var(--ink-700, var(--ink-900)); }
.tel-not strong { color: var(--ink-900); }
.tel-not--mavi { background: var(--mavi-50); }
.tel-not--uyari { background: var(--uyari-50); }
.tel-no-sar { position: relative; }
.tel-no { width: 100%; height: 50px; text-align: left; font-size: 1.1rem; padding-right: 48px; }
.tel-sil { position: absolute; right: 6px; top: 6px; width: 38px; height: 38px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-500); display: grid; place-items: center; cursor: pointer; }
.tel-sil:hover { background: var(--zemin); color: var(--ink-900); }
.tel-tus { gap: 10px; }
.tel-tus .btn { height: 62px; flex-direction: column; gap: 0; line-height: 1.1; box-shadow: 0 1px 2px rgba(0, 0, 0, .06); }
.tel-tus b { font-size: 1.45rem; font-weight: 700; color: var(--ink-900); }
.tel-tus small { font-size: .66rem; font-weight: 600; letter-spacing: .06em; color: var(--ink-500); }
.tel-bilgi { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding-top: 12px; border-top: 1px solid var(--cizgi); font-size: .82rem; color: var(--ink-500); }
.tel-bilgi svg { flex: 0 0 auto; }
.tel-gecmis h2 { margin: 0; font-size: .82rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-500); }
.tel-gecmis ul { list-style: none; margin: 0; padding: 0; border: 1px solid var(--cizgi); border-radius: 10px; overflow: hidden; }
.tel-gecmis li + li { border-top: 1px solid var(--cizgi); }
.tel-gecmis-satir { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px 9px 14px; border: 0; border-left: 3px solid var(--cizgi); background: var(--yuzey); text-align: left; cursor: pointer; font: inherit; }
.tel-gecmis-satir:hover { background: var(--zemin); }
.tel-gecmis-satir > span:first-child { display: grid; min-width: 0; }
.tel-gecmis-satir strong { font-size: .9rem; color: var(--ink-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tel-gecmis-satir small { font-size: .76rem; color: var(--ink-500); }
.tel-gecmis-zaman { flex: 0 0 auto; font-size: .78rem; color: var(--ink-500); font-variant-numeric: tabular-nums; }
.tel-gecmis--gelen { border-left-color: var(--ok); }
.tel-gecmis--giden { border-left-color: var(--mavi); }
.tel-gecmis--cevapsiz { border-left-color: var(--err); }
.tel-gecmis--cevapsiz strong { color: var(--err); }
.tel-gomulu .tel-kutu { padding-top: 0; }

/* ═══ PAKET 807 · ruhsatın yanında yazılan branş (yalnız işaret) ═══ */

/* ═══ PAKET 809 · telefon bölmesi açıkken teklif çekmecesi onun SOLUNDA durur ═══ */
@media (min-width: 1100px) {
  body.tel-yan-acik .tkl-cekmece { right: 340px; }
  body.tel-yan-acik.tkl-cekmece-acik .shell > :not(.side) { margin-right: 0; }
}

/* ═══ PAKET 810 · teklifte öteki branşlar (trafik · kasko · imm ayrı ayrı) ═══ */
.tk-ek { margin: 14px 0; }
.tk-ek .panel-head { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.tk-ek-brans { border: 1px solid var(--cizgi); border-radius: 10px; margin: 0 0 10px; background: var(--yuzey); }
.tk-ek-brans > summary { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 14px; cursor: pointer; list-style: none; }
.tk-ek-brans > summary::-webkit-details-marker { display: none; }
.tk-ek-brans > summary::before { content: "+"; width: 20px; height: 20px; border-radius: 6px; border: 1px solid var(--cizgi); display: inline-grid; place-items: center; color: var(--ink-2); font-weight: 700; line-height: 1; }
.tk-ek-brans[open] > summary::before { content: "−"; }
.tk-ek-brans[open] > summary { border-bottom: 1px solid var(--cizgi); }
.tk-ek-form, .tk-ek-alt { padding: 12px 14px; }
.tk-ek-alt { border-top: 1px solid var(--cizgi); display: flex; flex-direction: column; gap: 10px; }
.tk-ek-tablo td { padding: 4px 6px; }
.tk-ek-tablo td:first-child, .tk-ek-tablo th:first-child { width: 34px; text-align: center; }
.tk-ek-tablo .input { min-width: 90px; width: 100%; }
.tk-ek-dugme { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.tk-ek-satir { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tk-ek-satir .f-label { margin: 0; }
.tk-ek-satir .input { width: auto; max-width: 100%; flex: 1 1 200px; }
.tk-ek-belge a { margin-left: 8px; }
.tk-ek .pill--bilgi, .tkl-ek .pill--bilgi { background: var(--mavi-50, #e8f0fe); color: var(--mavi, #1a56db); }
.tkl-ek { margin-top: 4px; }
.tkl-ek .pill { white-space: nowrap; }

/* ═══ PAKET 811 · ek branşta "kopyalananı yapıştır" kutusu ═══ */
.tk-ek-satir .tk-ek-yp { flex: 1 1 220px; cursor: pointer; }

/* ═══ PAKET 812 · ek branşlar istatistikte ayrı teklif (yalnız işaret) ═══ */

/* PAKET 813 — GEO + SEO (yalnız işaret; görünüm değişmez) */

/* ═══ PAKET 814 — anket: kişiye göre akış kutusu ═══ */
.ab-akis > summary { cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; list-style: none; }
.ab-akis > summary::-webkit-details-marker { display: none; }
.ab-form h3 { margin: 20px 0 8px; font-size: 14px; }
.ab-ust { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px 16px; align-items: end; }
.ab-ust label, .ab-sinir { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.ab-onay { flex-direction: row !important; align-items: center; gap: 8px !important; }
.ab-secim { display: grid; gap: 8px; }
.ab-secim-satir { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ab-secim-satir .ab-sinir { flex-direction: row; align-items: center; gap: 8px; }
.ab-secim-satir .ab-sinir .input { width: 72px; }
.ab-tablo td { vertical-align: top; padding: 6px; }
.ab-tablo .input { min-width: 120px; width: 100%; }
.ab-tablo textarea.input { min-width: 240px; }

/* ═══ PAKET 815 — servis mesajı satırı (yalnız yönetim) ═══ */
.srv-serit { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 20px; margin: 12px 0; padding: 10px 16px; border: 1px dashed var(--cizgi); border-radius: 10px; background: var(--yuzey); font-size: 13px; }
.srv-serit b { font-weight: 700; }
.srv-serit strong { font-size: 15px; margin-left: 4px; }
.srv-serit em { margin-left: auto; font-style: normal; opacity: .6; font-size: 12px; }

/* ═══ PAKET 816 — anket raporu: uzun soru başlığı satırlara bölünür (stil değişmedi) ═══ */

/* ═══ PAKET 817 — poliçe kaynağı: bayi/şube hattı · acente adında form etiketi (stil değişmedi) ═══ */

/* ═══ PAKET 818 — ek branş bölümünde poliçe gönderme satırı ═══ */
.tk-ek-police { border-top: 1px solid var(--cizgi); padding-top: 12px; margin-top: 12px; }

/* ═══ PAKET 819 — teklif listesi sırası: en son gelen en üstte (stil değişmedi) ═══ */

/* ═══ PAKET 820 — bildirimler sağ bölmede ═══ */
.bz-yan { position: fixed; top: 64px; right: 0; bottom: 0; width: 420px; max-width: 100vw; z-index: 45; background: var(--zemin);
  border-left: 1px solid var(--cizgi); box-shadow: -12px 0 32px rgba(0,0,0,.10); display: flex; flex-direction: column; }
.bz-yan[hidden] { display: none; }
.bz-yan-ust { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px;
  background: var(--yuzey); border-bottom: 1px solid var(--cizgi); }
.bz-yan-ust h2 { margin: 0; font-size: 1.05rem; }
.bz-yan-kapat { width: 36px; height: 36px; border-radius: 8px; border: 1px solid var(--cizgi); background: var(--yuzey);
  font-size: 1.2rem; line-height: 1; cursor: pointer; color: var(--ink-700); }
.bz-yan-kapat:hover { background: var(--zemin); }
.bz-yan-govde { flex: 1 1 auto; overflow-y: auto; padding: 14px; font-size: .9rem; }
.bz-yan-ic .bz-sat { padding: 10px 12px; }
.bz-yan-ic .bz-metin { overflow-wrap: anywhere; }
.bz-yan-tam { display: block; text-align: center; margin: 14px 0 4px; font-size: .82rem; }
@media (min-width: 1100px) { body.tel-yan-acik .bz-yan { right: 340px; } }
@media (max-width: 767px) { .bz-yan { top: 0; width: 100vw; } }

/* ═══ PAKET 822 — gelen mesajları Excel’e alma düğmesi (yalnız yönetim) · stil gerekmedi ═══ */

/* ═══ PAKET 823 — ankette çoklu seçim formu ═══ */
.acf-hat { margin: 8px 0 16px; padding-left: 20px; }
.acf-hat li { margin: 4px 0; }

/* ═══ PAKET 825 — ankette kotalı gönderim ═══ */
.ak-tablo td, .ak-tablo th { white-space: nowrap; }
.ak-tablo .ak-toplam td { font-weight: 700; border-top: 2px solid var(--cizgi); }
.ak-tablo td.ak-az { color: var(--err); font-weight: 600; }
.ak-sure { margin: 0 0 12px; }
.ak-gunluk span { display: inline-block; margin-right: 12px; }
.ak-form { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.ak-alanlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.ak-alanlar label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.ak-oranlar > summary { cursor: pointer; margin-bottom: 8px; }
.ak-dugmeler { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* ═══ PAKET 826 — anket görseli düğmeli sorunun başlığında (stil yok, yalnız işaret) ═══ */

/* PAKET 827 — tanıtım sitesi ekleri (kurallar assets/style.css içinde) */

/* PAKET 828 — sohbetten talep: rozet · seçim · çubuk */
.st-rozet { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px;
  background: var(--ok-50, #e8f5ec); color: var(--ok, #1f7a3f); font-size: 11px; font-weight: 600; text-decoration: none; }
.st-rozet:hover { text-decoration: underline; }
.st-sec, .st-donustur { font-size: 11px; color: var(--ink-500); background: none; border: 0; padding: 0 4px; cursor: pointer; }
.st-sec { display: inline-flex; align-items: center; gap: 3px; }
.st-donustur:hover { color: var(--brand); text-decoration: underline; }
.bubble-row:not(:hover) .st-donustur, .bubble-row:not(:hover) .st-sec:not(:has(:checked)) { opacity: .45; }
.thread-akis:has(.st-kutu:checked) .st-sec { opacity: 1; }
.st-cubuk { position: sticky; top: 72px; z-index: 30; display: flex; gap: 10px; align-items: center;
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px; padding: 8px 12px; margin: 0 0 10px; box-shadow: 0 6px 20px rgba(0,0,0,.08); }
.st-cubuk[hidden] { display: none; }
.st-sec-satir { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.st-pencere .modal-card { max-width: 440px; }
@media (max-width: 767px) { .bubble-row .st-donustur, .bubble-row .st-sec { opacity: 1 !important; } }

/* PAKET 829 — uyarı penceresi referans tasarımda */
#uy-pencere { border: 0; border-radius: 16px; padding: 28px 32px 26px; max-width: 480px; width: calc(100% - 32px);
  background: var(--yuzey); color: var(--ink-700); text-align: center; box-shadow: 0 24px 60px rgba(0,0,0,.25); position: relative; }
#uy-pencere .uy-kapat { position: absolute; top: 12px; right: 14px; width: 32px; height: 32px; border: 0 !important; box-shadow: none !important; outline: none; background: none; font-size: 24px; line-height: 1; color: var(--ink-400); cursor: pointer; border-radius: 8px; }
#uy-pencere .uy-kapat:hover { background: var(--ink-50); color: var(--ink-700); }
#uy-pencere .uy-ikon { width: 84px; height: 84px; margin: 4px auto 14px; border-radius: 20px; display: grid; place-items: center; background: color-mix(in srgb, var(--brand) 12%, var(--yuzey)); color: var(--brand); }
#uy-pencere .uy-ikon-yakalanamadi { background: var(--uyari-50, #fff4dc); color: var(--uyari, #b06f00); }
#uy-pencere .uy-ust { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--brand); margin-bottom: 8px; }
#uy-pencere .uy-baslik { margin: 0 0 6px; font-size: 24px; color: var(--ink-900); }
#uy-pencere .uy-alt { margin: 0 0 16px; color: var(--ink-500); font-size: 14px; }
#uy-pencere .uy-kart { text-align: left; background: var(--zemin, var(--yuzey-2)); border: 1px solid var(--cizgi); border-radius: 12px; padding: 16px 18px; }
#uy-pencere .uy-kisi { display: flex; gap: 14px; align-items: center; }
#uy-pencere .uy-avatar { width: 48px; height: 48px; border-radius: 50%; background: color-mix(in srgb, var(--brand) 12%, var(--yuzey)); color: var(--brand); font-weight: 700; display: grid; place-items: center; flex: 0 0 auto; }
#uy-pencere .uy-kisi-yazi { display: flex; flex-direction: column; min-width: 0; }
#uy-pencere .uy-kisi-yazi b { font-size: 16px; color: var(--ink-900); }
#uy-pencere .uy-kisi-yazi span { color: var(--ink-500); font-size: 13px; overflow-wrap: anywhere; }
#uy-pencere .uy-satirlar { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--cizgi); }
#uy-pencere .uy-hucre + .uy-hucre { border-left: 1px solid var(--cizgi); padding-left: 18px; }
#uy-pencere .uy-hucre small { display: block; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-500); }
#uy-pencere .uy-hucre b { font-size: 16px; color: var(--ink-900); }
#uy-pencere .uy-meta { text-align: left; font-size: 13px; color: var(--ink-500); margin: 12px 0 16px; }
#uy-pencere .uy-dugmeler { display: flex; gap: 12px; }
#uy-pencere .uy-dugmeler .btn { flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; height: 46px; min-height: 46px; padding: 0 16px; font-size: 15px; box-sizing: border-box; }
#uy-pencere::backdrop { background: rgba(15,23,42,.55); }
@media (max-width: 480px) { #uy-pencere { padding: 22px 18px; } #uy-pencere .uy-dugmeler { flex-direction: column; } }

/* PAKET 830 — canlı destek paneli (iki sütun: liste + görüşme) */
.dsk-duzen { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 14px; align-items: start; }
.dsk-liste { padding: 0; overflow: hidden; }
.dsk-liste .sekme-cizgi { padding: 8px 10px 0; }
.dsk-satir { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-top: 1px solid var(--cizgi); color: inherit; text-decoration: none; }
.dsk-satir:hover { background: var(--yuzey-2); }
.dsk-satir.aktif { background: color-mix(in srgb, var(--brand) 10%, var(--yuzey)); }
.dsk-satir.yeni b { color: var(--brand); }
.dsk-satir-ic { min-width: 0; flex: 1; display: grid; gap: 2px; }
.dsk-satir-ic b, .dsk-son { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dsk-son { color: var(--ink-2, #5b6472); font-size: 13px; }
.dsk-satir small { color: var(--ink-3, #8a94a3); font-size: 12px; }
.dsk-avatar { width: 36px; height: 36px; border-radius: 50%; flex: 0 0 36px; display: grid; place-items: center; font-weight: 700; background: color-mix(in srgb, var(--brand) 14%, var(--yuzey)); color: var(--brand); }
.dsk-gorusme { padding: 0; display: flex; flex-direction: column; min-height: 520px; }
.dsk-gorusme > .empty-box { margin: 16px; }
.dsk-g-bas { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--cizgi); }
.dsk-g-kim { flex: 1; min-width: 0; display: grid; }
.dsk-g-kim small { color: var(--ink-3, #8a94a3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dsk-geri { display: none; font-size: 20px; text-decoration: none; color: inherit; padding: 0 4px; }
.dsk-g-akis { flex: 1; overflow: auto; padding: 14px; display: flex; flex-direction: column; gap: 8px; max-height: 60vh; background: var(--yuzey-2); }
.dsk-m { max-width: 78%; display: grid; gap: 2px; }
.dsk-m-in { align-self: flex-start; }
.dsk-m-out { align-self: flex-end; text-align: right; }
.dsk-m-sys { align-self: center; max-width: 92%; text-align: center; }
.dsk-m-govde { padding: 8px 12px; border-radius: 12px; background: var(--yuzey); border: 1px solid var(--cizgi); word-break: break-word; text-align: left; }
.dsk-m-out .dsk-m-govde { background: #DCF7E3; border-color: transparent; color: #0f2a16; }
.dsk-m-sys .dsk-m-govde { background: transparent; border-style: dashed; font-size: 13px; color: var(--ink-2, #5b6472); }
.dsk-m small { color: var(--ink-3, #8a94a3); font-size: 11px; }
.dsk-g-yaz { display: flex; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--cizgi); }
.dsk-g-yaz textarea { flex: 1; resize: none; }
.dsk-ayar { display: grid; gap: 4px; align-content: center; }
.dsk-ayar-l { display: flex; gap: 8px; align-items: center; font-weight: 600; cursor: pointer; }
.dsk-ayar small { color: var(--ink-3, #8a94a3); }
@media (max-width: 900px) {
  .dsk-duzen { grid-template-columns: 1fr; }
  .dsk-secili .dsk-liste { display: none; }
  .dsk-geri { display: inline-block; }
  .dsk-m { max-width: 92%; }
}
#uy-pencere .uy-ikon-destek { background: color-mix(in srgb, var(--brand) 14%, var(--yuzey)); color: var(--brand); }

/* PAKET 831 — işaret (ruhsatla açılan teklifte komşu yazı + kimlik doldurma; CSS değişmedi) */

/* PAKET 832 — işaret (canlı destek balonu düzeltmeleri; kurallar assets/style.css sonunda) */

/* PAKET 834 — işaret (boş ekran kutusu katlanmaz: assets/kisa-metin.js) */

/* PAKET 836 — satır eylemleri "⋯" menüsünde (assets/satir-eylem.js). Düğmeler DOM'da aynen durur, kapalı bir details içine alınır. */
details.satir-eylem { position: relative; display: inline-block; vertical-align: middle; }
details.satir-eylem > summary.satir-eylem-ac { list-style: none; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 6px; border: 1px solid var(--cizgi); background: var(--yuzey); color: var(--ink-500); font-weight: 700; font-size: 1rem; line-height: 1; user-select: none; }
details.satir-eylem > summary.satir-eylem-ac::-webkit-details-marker { display: none; }
details.satir-eylem > summary.satir-eylem-ac:hover, details.satir-eylem[open] > summary.satir-eylem-ac { background: var(--zemin); color: var(--ink-900); }
details.satir-eylem > .satir-eylem-ic { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; min-width: 180px; display: flex; flex-direction: column; align-items: stretch; gap: 2px; padding: 6px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 8px; box-shadow: 0 8px 24px rgba(11, 23, 48, .14); text-align: left; }
details.satir-eylem > .satir-eylem-ic > * { display: block; width: 100%; margin: 0; }
details.satir-eylem > .satir-eylem-ic form.inline { display: block; }
details.satir-eylem > .satir-eylem-ic a, details.satir-eylem > .satir-eylem-ic button { display: block; width: 100%; text-align: left; padding: 7px 10px; border-radius: 6px; background: none; border: 0; font: inherit; font-size: .85rem; color: var(--ink-900); cursor: pointer; white-space: nowrap; }
details.satir-eylem > .satir-eylem-ic a:hover, details.satir-eylem > .satir-eylem-ic button:hover { background: var(--zemin); }
details.satir-eylem > .satir-eylem-ic button.danger, details.satir-eylem > .satir-eylem-ic .danger { color: var(--err); }
.row-actions details.satir-eylem { margin-left: 2px; }

/* PAKET 837 — işaret: telefonda kart tablo (table.mob-kart · 793 kuralı) cari · taksitler · giderler · hakedisim · oz-uretim · gorevler ekranlarına yayıldı */

/* ═══ PAKET 838 — uzun ekranlarda ikincil bölümler kapalı gelir (bolum-katla.js) ═══ */
.bk-kat > .bk-bas { cursor: pointer; user-select: none; position: relative; padding-right: 40px; }
.bk-kat > .bk-bas:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; border-radius: 6px; }
.bk-kat > .bk-bas .bk-ok { position: absolute; right: 14px; top: 50%; width: 10px; height: 10px; margin-top: -8px;
  border-right: 2px solid var(--ink-500); border-bottom: 2px solid var(--ink-500); transform: rotate(45deg); transition: transform .15s; }
.bk-kat.bk-kapali > .bk-bas .bk-ok { transform: rotate(-45deg); margin-top: -4px; }
.bk-kat.bk-kapali > :not(.bk-bas) { display: none !important; }
.bk-kat.bk-kapali > .bk-bas { border-bottom: 0; margin-bottom: 0; }
.bk-kat.bk-kapali > .panel-head.bk-bas, .bk-kat.bk-kapali > .panel-title.bk-bas { border-bottom: 0; }
td.bk-tire, .bk-tire { color: var(--ink-500); opacity: .7; }

/* ═══ PAKET 839 — Salon giriş ekranı (güzellik merkezi · GZ-1) ═══ */
.salon-moduller { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.salon-moduller li { display: grid; grid-template-columns: 56px 1fr; gap: 2px 12px; align-items: center; padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 10px; background: var(--yuzey); }
.salon-moduller .pill { grid-row: 1 / span 2; justify-self: start; }
.salon-moduller .salon-aciklama { color: var(--ink-500); font-size: 13px; }

/* ═══ PAKET 840 — GÜZELLİK MERKEZİ · katalog · fiyat · mesai · ayar ═══ */
.gz-bos { text-align: center; padding: 40px 24px; }
.gz-bos h2 { margin-bottom: 8px; }
.gz-bos p { color: var(--ink-500); max-width: 520px; margin: 0 auto 18px; }
.gz-bos form { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.gz-bos-satir { text-align: center; color: var(--ink-500); padding: 28px 12px !important; }
.gz-grup-sekme { margin-bottom: 14px; }
.gz-grup-sekme .pill { margin-left: 6px; }
.gz-pasif { opacity: .55; }
.gz-kelime { font-size: .8rem; color: var(--ink-500); margin-top: 2px; }
.gz-para { font-variant-numeric: tabular-nums; white-space: nowrap; }
.gz-kampanya { color: var(--ok); font-weight: 700; }
.gz-suzgec { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.gz-suzgec .input { width: auto; min-width: 220px; }
.gz-gunluk { margin-top: 16px; }
.gz-gunluk summary { cursor: pointer; }
.gz-gunluk summary h2 { display: inline; font-size: 1rem; }
.gz-mesai-duzen { display: grid; grid-template-columns: 280px 1fr; gap: 16px; align-items: start; }
.gz-uzman-liste { padding: 8px; display: flex; flex-direction: column; gap: 4px; }
.gz-uzman { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 8px; color: var(--ink-900); min-height: 44px; }
.gz-uzman:hover { background: var(--zemin); }
.gz-uzman.is-active { background: var(--mavi-50); color: var(--mavi-600); font-weight: 600; }
.gz-mesai-form h2, .gz-ayar-form h2 { font-size: 1.05rem; margin: 6px 0 12px; }
.gz-ayar-form h2 + .hk-izgara { margin-bottom: 18px; }
.gz-mesai-tablo input[type=time] { width: 130px; }
.gz-mesai-tablo td { vertical-align: middle; }
.gz-ipucu { display: block; color: var(--ink-500); font-size: .8rem; margin-top: 4px; }
@media (max-width: 900px) { .gz-mesai-duzen { grid-template-columns: 1fr; } .gz-suzgec .input { min-width: 0; flex: 1 1 160px; } }

/* ═══ PAKET 842 — SALON TALEPLERİ ═══ */
.gz-talep-duzen { display: grid; grid-template-columns: 1fr 320px; gap: 16px; align-items: start; }
.gz-talep-bas { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.gz-talep-bas h2 { margin: 0; font-size: 1.1rem; display: flex; gap: 10px; align-items: center; }
.gz-fiyat-ozet { display: flex; gap: 18px; flex-wrap: wrap; padding: 12px 14px; border-radius: 10px; background: var(--zemin); margin: 4px 0 12px; }
.gz-fiyat-ozet span { display: block; font-size: .78rem; color: var(--ink-500); }
.gz-fiyat-ozet b { font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.gz-fiyat-ozet .gz-net b { color: var(--brand); font-size: 1.25rem; }
.gz-talep-not { margin-top: 16px; }
.gz-talep-not h2, .gz-talep-yan h2 { font-size: 1rem; margin: 0 0 10px; }
.gz-not { white-space: pre-wrap; font: inherit; font-size: .92rem; background: var(--zemin); border-radius: 8px; padding: 10px 12px; max-height: 260px; overflow: auto; margin: 0 0 10px; }
.gz-mesaj-form { display: flex; gap: 8px; }
.gz-mesaj-form .input { flex: 1 1 auto; }
.gz-talep-yan .panel + .panel { margin-top: 12px; }
.gz-alt { font-size: .85rem; color: var(--ink-500); margin: 12px 0 6px; }
.gz-liste-sade { list-style: none; padding: 0; margin: 0; font-size: .9rem; }
.gz-liste-sade li { padding: 5px 0; border-top: 1px solid var(--cizgi); }
.gz-liste-sade li:first-child { border-top: 0; }
.gz-sm-talep a:not(.btn) { display: block; font-size: .9rem; }
.gz-sm-talep .btn { margin-top: 6px; }
.stat-card--uyari .stat-card-value { color: var(--err); }
@media (max-width: 1100px) { .gz-talep-duzen { grid-template-columns: 1fr; } }

/* ═══ PAKET 844 — PAKETLER · RANDEVU TAKVİMİ ═══ */
.gz-borc { color: var(--err); font-weight: 700; }
.gz-seans-tablo td { vertical-align: middle; }
.gz-seans--yapildi td { color: var(--ink-500); }
.gz-rv-bar { align-items: center; }
.gz-rv-bar .input[type=date] { width: auto; min-width: 0; }
.gz-takvim { padding: 0; overflow: auto; }
.gz-tk-izgara { display: grid; grid-template-columns: 64px repeat(var(--sutun, 1), minmax(180px, 1fr)); min-width: 100%; }
.gz-tk-saat-bas, .gz-tk-bas { position: sticky; top: 0; background: var(--yuzey); border-bottom: 1px solid var(--cizgi); padding: 10px 12px; z-index: 2; }
.gz-tk-bas { display: flex; flex-direction: column; gap: 2px; border-left: 1px solid var(--cizgi); }
.gz-tk-saat { font-size: .78rem; color: var(--ink-500); padding: 6px 8px; border-top: 1px solid var(--cizgi); min-height: 44px; font-variant-numeric: tabular-nums; }
.gz-tk-hucre { border-top: 1px solid var(--cizgi); border-left: 1px solid var(--cizgi); min-height: 44px; padding: 3px; position: relative; }
.gz-tk-bos { cursor: pointer; }
.gz-tk-bos:hover, .gz-tk-bos:focus-visible { background: var(--mavi-50); outline: none; }
.gz-tk-disi { background: var(--zemin); }
.gz-tk-kart { border-radius: 8px; padding: 6px 8px; font-size: .82rem; background: var(--brand); color: #fff; margin-bottom: 3px; position: relative; z-index: 1; }
.gz-tk-kart strong { display: block; font-size: .86rem; }
.gz-tk-kart span { display: block; opacity: .9; }
.gz-tk-kart--bekliyor { background: var(--uyari); color: var(--ink-900); }
.gz-tk-kart--geldi { background: var(--ok); }
.gz-tk-kart--gelmedi { background: var(--ink-500); }
.gz-tk-islem { display: flex; gap: 4px; margin-top: 6px; flex-wrap: wrap; }
.gz-tk-islem .btn { min-height: 28px; padding: 2px 8px; font-size: .78rem; }
.gz-tk-kart .btn-ghost { color: #fff; border-color: rgba(255,255,255,.5); }
.gz-tk-kart--bekliyor .btn-ghost { color: var(--ink-900); border-color: rgba(0,0,0,.25); }
@media (max-width: 700px) { .gz-tk-izgara { grid-template-columns: 52px repeat(var(--sutun, 1), minmax(150px, 1fr)); } }

/* ═══ PAKET 845 — salon şablonları ═══ */
.gz-sablon { margin-top: 16px; }
.gz-sablon h2 { font-size: 1.05rem; margin: 0 0 8px; }
.gz-sablon .hk-alt { margin-top: 10px; }

/* ═══ PAKET 846 — salon raporu · müşteri eki ═══ */
.gz-rapor-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; margin-bottom: 16px; }
.gz-rapor-iki h2, .gz-ek h2 { font-size: 1.05rem; margin: 0 0 10px; }
.gz-huni { list-style: none; margin: 0; padding: 0; }
.gz-huni li { display: grid; grid-template-columns: 140px 1fr 48px; gap: 10px; align-items: center; padding: 6px 0; border-top: 1px solid var(--cizgi); font-size: .9rem; }
.gz-huni li:first-child { border-top: 0; }
.gz-huni-cubuk { height: 10px; background: var(--zemin); border-radius: 5px; overflow: hidden; }
.gz-huni-cubuk i { display: block; height: 100%; background: var(--brand); border-radius: 5px; }
.gz-huni b { text-align: right; font-variant-numeric: tabular-nums; }
.gz-fiyat-ozet small { display: block; }
.gz-saglik { white-space: pre-wrap; background: var(--err-50); color: var(--ink-900); padding: 6px 8px; border-radius: 6px; display: inline-block; }
@media (max-width: 1000px) { .gz-rapor-iki { grid-template-columns: 1fr; } .gz-huni li { grid-template-columns: 110px 1fr 40px; } }

/* ═══ PAKET 847 — hat köprüsü ═══ */
.hkp-not{border-left:4px solid var(--brand);margin-bottom:14px}
.hkp-kutu .hkp-form{display:grid;gap:12px;max-width:560px}
.hkp-kutu h2{margin:0 0 6px;font-size:16px}

/* ═══ PAKET 848 — numara seçiminde köprülü hesap kartı ═══ */
.nm-kart--kopru{border-style:dashed}
.nm-kart--kopru .nm-dugme{height:100%;box-sizing:border-box}
.nm-kart--kopru .nm-harf{background:var(--brand);color:#fff}

/* ═══ PAKET 849 — Salon Demo tam dolgu (yalnız işaret) ═══ */

/* ═══ PAKET 850 — Eğitim kurumu (EG-1): okul · öğrenci · sınıf · ders programı ═══ */
.eg-ozet { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; margin-bottom: 16px; }
.eg-kart { display: flex; flex-direction: column; gap: 2px; }
.eg-kart .eg-sayi { font-size: 1.9rem; font-weight: 700; color: var(--ink-900); line-height: 1.1; }
.eg-kart .eg-etiket { color: var(--ink-600); font-size: .9rem; }
.eg-kart--uyari { border-color: var(--uyari); background: var(--uyari-50); }
.eg-kisayollar { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-bottom: 16px; }
.eg-kisayol { display: flex; flex-direction: column; gap: 4px; text-decoration: none; color: inherit; }
.eg-kisayol:hover { border-color: var(--brand); }
.eg-aciklama { color: var(--ink-600); font-size: .86rem; line-height: 1.4; }
.eg-suzgec { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.eg-suzgec .input { max-width: 240px; }
.eg-kutu { display: inline-flex; gap: 6px; align-items: center; color: var(--ink-600); }
.eg-bos { text-align: center; padding: 40px 24px; }
.eg-bos h2 { margin-bottom: 8px; }
.eg-bos p { color: var(--ink-500); max-width: 520px; margin: 0 auto 18px; }
.eg-bos-satir { text-align: center; color: var(--ink-500); padding: 28px 12px !important; }
.eg-pasif { opacity: .55; }
.eg-sayac { margin-top: 8px; }
.eg-uyari { color: var(--uyari); }
.eg-iki-sutun { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; margin-bottom: 14px; }
.eg-dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
.eg-dl dt { color: var(--ink-500); }
.eg-dl dd { margin: 0; }
.eg-veli-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.eg-veli-liste li { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 8px 0; border-bottom: 1px solid var(--cizgi); }
.eg-veli-liste li:last-child { border-bottom: 0; }
.eg-satir-form { display: inline; }
.eg-hafta { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.eg-gun { padding: 12px; }
.eg-gun h3 { margin: 0 0 8px; font-size: .95rem; color: var(--ink-700); }
.eg-gun--bugun { border-color: var(--brand); }
.eg-gun-bos { text-align: center; padding: 10px 0; }
.eg-ders { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; margin-bottom: 8px; border-radius: var(--kose); background: var(--zemin); border-left: 3px solid var(--mavi); }
.eg-ders--benim { border-left-color: var(--brand); background: var(--brand-50); }
.eg-ders-saat { font-size: .8rem; color: var(--ink-600); font-variant-numeric: tabular-nums; }
.eg-ders-eylem { display: flex; gap: 6px; margin-top: 4px; }
.eg-ayar-form h2 { margin: 18px 0 10px; font-size: 1.05rem; }
.eg-ayar-form h2:first-of-type { margin-top: 0; }
@media (max-width: 640px) {
  .eg-suzgec .input { max-width: none; flex: 1 1 100%; }
  .eg-dl { grid-template-columns: 1fr; gap: 2px; }
  .eg-dl dd { margin-bottom: 8px; }
}

/* ═══ PAKET 852 — Eğitim kurumu (EG-1d): kayıt · taksit · ödeme ═══ */
.eg-sayi--kucuk { font-size: 1rem; }
.eg-gecikti td { background: var(--uyari-50); }
.eg-hareket { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: .9rem; }
.eg-h2-aralik { margin-top: 18px; }
.eg-iptal-satir { margin-top: 14px; }
.eg-plan-tablo td { padding: 4px 8px; font-size: .88rem; }
.eg-plan { min-height: 24px; }
.eg-tablo td.eg-para { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* ═══ PAKET 853 — Eğitim kurumu (EG-2): yoklama ═══ */
.eg-secili td { background: var(--brand-50); }
.eg-radyo { display: inline-flex; gap: 10px; flex-wrap: wrap; }
.eg-radyo label { display: inline-flex; gap: 4px; align-items: center; cursor: pointer; }
.eg-radyo-yok { color: var(--err); }
.eg-radyo-gec { color: var(--uyari); }
.eg-yoklama-tablo td { padding: 6px 8px; }
.eg-esik a { font-weight: 600; }
@media (min-width: 1100px) { .eg-yoklama-duzen { grid-template-columns: 1.2fr 1fr; } }

/* ═══ PAKET 854 — Eğitim kurumu (EG-3): duyuru · veli iletişimi (yalnız işaret · kurallar 850–853 bloklarında) ═══ */
.eg-duyuru-metin { white-space: pre-wrap; }

/* ═══ PAKET 855 — Eğitim kurumu (EG-4): taksit hatırlatma damgası · şube kırılımı ═══ */
.eg-tablo td.eg-hatirlatma { white-space: nowrap; }
.eg-tablo .pill--bilgi { background: var(--mavi-50); color: var(--mavi); }
.eg-sube-ozet { margin: 0 0 16px; }
.eg-sube-ozet th.eg-para, .eg-sube-ozet td.eg-para { text-align: right; }
.eg-iki-sutun > .panel { overflow-x: auto; }

/* ═══ PAKET 856 — Eğitim kurumu (EG-4b): kayıt zinciri · veliye gönder düğmesi ═══ */
.eg-veliye { margin-top: 10px; align-items: center; gap: 10px; flex-wrap: wrap; }

/* ═══ PAKET 857 — Eğitim kurumu: Eğitim Demo (yönetim) · işaret bloğu ═══ */

/* ═══ PAKET 858 — Eğitim kurumu (EG-5a): servis · harita · şoför telefonu ═══ */
.egs-harita-kutu { padding: 0; overflow: hidden; margin-bottom: 14px; }
.egs-harita { height: 380px; width: 100%; }
.egs-harita-not { margin: 8px 12px; }
.egs-no { width: 24px; height: 24px; border-radius: 50%; background: var(--brand); color: var(--yuzey); font: 700 12px/24px system-ui, sans-serif; text-align: center; box-shadow: 0 0 0 2px var(--yuzey); }
.egs-popup-dugme { display: block; width: 100%; margin: 4px 0; }
.egs-satir-form { display: inline; }
.eg-tablo tr.egs-pasif td { opacity: .6; }
.egs-yon { justify-content: flex-start; }
.egs-durak { margin: 14px 2px 6px; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-500); }
.m-ogr.egs-bindi { border-color: var(--ok); }
.m-ogr.egs-indi { opacity: .65; }
/* .m-sec button (_kabuk) iki sınıflık seçiciyle yenilir */
.m-sec .egs-dugme { min-width: 96px; height: 48px; border-radius: 10px; font-size: 1.05rem; font-weight: 700; }
.m-sec .egs-dugme--bin { background: var(--ok-50); border-color: var(--ok); color: var(--ok); }
.m-sec .egs-dugme--in { background: var(--mavi-50); border-color: var(--mavi); color: var(--mavi); }
.m-sec .egs-geri { min-width: 0; height: auto; background: none; border: 0; color: var(--ink-500); text-decoration: underline; font-size: .85rem; font-weight: 400; padding: 0 4px; }
@media (max-width: 720px) { .egs-harita { height: 300px; } }

/* ═══ PAKET 860 — Teklif cevabı: alıntı · plaka · numara ile doğru teklife (işaret bloğu) ═══ */

/* ═══ PAKET 862 — Sabit gönderim: büyük liste yazılırken medya yarışı (işaret bloğu) ═══ */

/* ═══ PAKET 863 — İşçi havuzları: video · meta · iş (işaret bloğu) ═══ */

/* ═══ PAKET 864 — Sunucu ekranı: her işçi tek tek (havuz kartları + liste) ═══ */
.isci-liste > summary { cursor: pointer; list-style: none; }
.isci-liste > summary::-webkit-details-marker { display: none; }
.isci-liste > summary::before { content: "▸ "; color: var(--ink-500); }
.isci-liste[open] > summary::before { content: "▾ "; }
.isci-liste .tablo-kaydir { margin-top: 10px; }
.isci-liste tr.isci-durmus td { background: var(--err-50); }
.isci-liste .eg-aciklama { padding: 8px 4px 0; }

/* ═══ PAKET 865 — Sabit gönderim: satır yazımı arka planda (işaret bloğu) ═══ */
.yazim-suruyor { color: var(--mavi-600); }
.yazim-hata { color: var(--err); }

/* ═══ PAKET 866 — Bildirim kartları (tasarım 15.10 · işaret bloğu) ═══ */

/* ═══ PAKET 867 — Canlı İş Takibi (panel/canli-is.php) ═══ */
.cis-ust { display:flex; gap:14px; align-items:center; justify-content:space-between; flex-wrap:wrap; margin-bottom:16px; }
.cis-suzgec { display:flex; gap:4px; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:12px; padding:4px; }
.cis-suzgec a { display:flex; align-items:center; gap:8px; padding:8px 16px; border-radius:9px; color:var(--ink-700); text-decoration:none; font-weight:600; font-size:.9rem; }
.cis-suzgec a.is-on { background:var(--marka-vurgu); color:var(--ters-ink); }
.cis-ara { display:flex; align-items:center; gap:10px; flex:1 1 320px; max-width:520px; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:12px; padding:0 14px; color:var(--ink-500); }
.cis-ara input { border:0; background:transparent; padding:11px 0; width:100%; font:inherit; color:var(--ink-900); outline:none; }
.cis-canli { display:inline-flex; align-items:center; gap:6px; color:var(--marka-vurgu); font-weight:700; }
.cis-canli i, .cis-nokta { width:9px; height:9px; border-radius:50%; background:var(--marka-vurgu); display:inline-block; animation:cis-nabiz 1.6s ease-in-out infinite; }
.cis-nokta { background:var(--ok); margin-right:6px; }
@keyframes cis-nabiz { 0%,100% { opacity:1; } 50% { opacity:.35; } }
.cis-son { color:var(--ink-500); font-size:.85rem; margin:0 8px; }
.cis-sayaclar { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:14px; margin-bottom:18px; }
.cis-sayac { background:var(--yuzey); border:1px solid var(--cizgi); border-radius:14px; padding:16px 18px; display:flex; gap:14px; align-items:center; }
.cis-sayac-ikon { width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:color-mix(in srgb, var(--marka-vurgu) 12%, var(--yuzey)); color:var(--marka-vurgu); flex:0 0 46px; }
.cis-ikon--mavi { background:var(--mavi-50); color:var(--mavi); }
.cis-sayac-ad { font-size:.85rem; color:var(--ink-600); }
.cis-sayac-deger { font-size:1.9rem; font-weight:800; line-height:1.1; }
.cis-ana { display:grid; grid-template-columns:minmax(0, 1fr) 360px; gap:18px; align-items:start; }
.cis-bolum-baslik { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:0 0 10px; }
.cis-bolum-baslik h2 { margin:0; font-size:1.3rem; }
.cis-not { font-size:.8rem; color:var(--ink-500); }
.cis-kartlar { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:14px; }
.cis-kart { background:var(--yuzey); border:1px solid var(--cizgi); border-radius:14px; padding:14px 16px; display:flex; flex-direction:column; gap:10px; }
.cis-kart-ust { display:flex; align-items:center; gap:12px; }
.cis-avatar { width:44px; height:44px; border-radius:50%; background:color-mix(in srgb, var(--marka-vurgu) 14%, var(--yuzey)); color:var(--marka-vurgu); font-weight:800; display:flex; align-items:center; justify-content:center; flex:0 0 44px; }
.cis-kart-ad { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.cis-kart-ad strong { font-size:1.05rem; }
.cis-mesai { font-size:.82rem; color:var(--ink-500); display:inline-flex; align-items:center; gap:6px; }
.cis-mesai i { width:8px; height:8px; border-radius:50%; background:var(--ink-300); display:inline-block; }
.cis-mesai--acik i { background:var(--marka-vurgu); }
.cis-uclu { display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; }
.cis-uclu > div { background:var(--zemin); border-radius:10px; padding:10px 12px; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:8px; align-items:center; color:var(--ink-600); }
.cis-uclu svg { grid-row:1 / span 2; }
.cis-uclu strong { font-size:1.05rem; color:var(--ink-900); line-height:1; }
.cis-uclu span { font-size:.78rem; }
.cis-satir, .cis-mini { display:flex; align-items:center; gap:10px; border:1px solid var(--cizgi); border-radius:10px; padding:8px 10px; text-decoration:none; color:inherit; }
.cis-satir:hover, .cis-mini:hover { border-color:var(--marka-vurgu); }
.cis-satir--onay { background:color-mix(in srgb, var(--marka-vurgu) 8%, var(--yuzey)); border-color:color-mix(in srgb, var(--marka-vurgu) 40%, var(--cizgi)); }
.cis-satir--onay .cis-satir-sure, .cis-satir--onay .cis-satir-ikon { color:var(--marka-vurgu); font-weight:700; }
.cis-satir--gec, .cis-mini--gec { background:var(--err-50); border-color:color-mix(in srgb, var(--err) 35%, var(--cizgi)); }
.cis-satir--gec .cis-satir-sure, .cis-mini--gec .cis-satir-sure { color:var(--err); font-weight:700; }
.cis-satir-ikon { color:var(--ink-500); display:flex; flex:0 0 auto; }
.cis-satir-govde { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.cis-satir-govde strong { font-size:.92rem; }
.cis-satir-govde small { color:var(--ink-600); font-size:.78rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cis-satir-sure { font-size:.85rem; color:var(--ink-600); white-space:nowrap; }
.cis-satir-ok { width:26px; height:26px; border:1px solid var(--cizgi); border-radius:8px; display:flex; align-items:center; justify-content:center; color:var(--ink-500); }
.cis-tumu { align-self:center; color:var(--marka-vurgu); font-weight:700; text-decoration:none; font-size:.9rem; margin-top:2px; }
.cis-bos { color:var(--ink-500); font-size:.85rem; margin:0; }
.cis-sag { display:flex; flex-direction:column; gap:14px; position:sticky; top:12px; }
.cis-panel { padding:14px 16px; display:flex; flex-direction:column; gap:8px; }
.cis-panel-ust { display:flex; align-items:center; gap:10px; }
.cis-panel-ust h3 { margin:0; font-size:1.05rem; flex:1 1 auto; }
.cis-rozet { background:var(--marka-vurgu); color:var(--ters-ink); border-radius:999px; min-width:26px; height:26px; padding:0 8px; display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem; }
.cis-rozet--gri { background:var(--ink-100); color:var(--ink-700); }
.cis-bildirim { display:flex; gap:10px; align-items:center; flex-wrap:wrap; border:1px solid var(--cizgi); border-radius:12px; padding:10px 12px; }
.cis-bildirim > .btn { margin-left:auto; white-space:nowrap; }
.cis-bildirim-govde { flex:1 1 150px; }
.cis-bildirim--onay { background:color-mix(in srgb, var(--marka-vurgu) 8%, var(--yuzey)); border-color:color-mix(in srgb, var(--marka-vurgu) 45%, var(--cizgi)); }
.cis-bildirim-ikon { width:38px; height:38px; border-radius:10px; background:var(--zemin); color:var(--ink-600); display:flex; align-items:center; justify-content:center; flex:0 0 38px; }
.cis-bildirim--onay .cis-bildirim-ikon { background:color-mix(in srgb, var(--marka-vurgu) 14%, var(--yuzey)); color:var(--marka-vurgu); }
.cis-bildirim-govde { flex:1 1 auto; min-width:0; font-size:.88rem; }
.cis-bildirim-govde strong { display:block; font-size:.95rem; }
.cis-bildirim-govde small { color:var(--ink-500); }
.cis-btn--dolu { background:var(--marka-vurgu); color:var(--ters-ink); border-color:var(--marka-vurgu); }
.cis-btn--cerceve { border:1px solid var(--marka-vurgu); color:var(--marka-vurgu); background:var(--yuzey); }
.cis-mini-dugme { color:var(--marka-vurgu); font-weight:700; font-size:.82rem; white-space:nowrap; }
.cis-okunmamis { background:var(--mavi); color:var(--ters-ink); border-radius:999px; min-width:22px; height:22px; padding:0 6px; display:inline-flex; align-items:center; justify-content:center; font-size:.78rem; font-weight:700; }
.cis-alt { display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-top:18px; padding-top:12px; border-top:1px solid var(--cizgi); font-size:.82rem; color:var(--ink-500); }
.cis-alt a { color:var(--ink-700); text-decoration:none; display:inline-flex; align-items:center; gap:6px; }
#cis-sayfa:fullscreen { background:var(--zemin); overflow:auto; padding:18px; }
@media (max-width: 1100px) { .cis-ana { grid-template-columns:1fr; } .cis-sag { position:static; } }
@media (max-width: 600px) { .cis-suzgec a { padding:8px 10px; font-size:.82rem; } .cis-sayaclar { grid-template-columns:1fr 1fr; } .cis-sayac { padding:12px; gap:10px; } .cis-sayac-deger { font-size:1.5rem; } .cis-uclu { gap:6px; } }

/* ═══ PAKET 868 — Kontrol Merkezi (panel/kontrol-merkezi.php) ═══ */
.km-sekmeler { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.km-sekmeler a { display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border:1px solid var(--cizgi); border-radius:12px; background:var(--yuzey); color:var(--ink-700); text-decoration:none; font-weight:600; }
.km-sekmeler a.is-on { border-color:var(--marka-vurgu); color:var(--marka-vurgu); background:color-mix(in srgb, var(--marka-vurgu) 8%, var(--yuzey)); }
.km-sayi { background:var(--ink-100); color:var(--ink-700); border-radius:999px; padding:1px 9px; font-size:.8rem; }
.km-sekmeler a.is-on .km-sayi { background:var(--marka-vurgu); color:var(--ters-ink); }
.km-panel { padding:0; overflow:hidden; }
.km-tablo td { vertical-align:middle; }
.km-kayit strong { display:block; font-size:1rem; }
.km-kayit small { color:var(--ink-600); font-size:.82rem; }
.km-neden { display:flex; align-items:center; gap:10px; }
.km-ikon { width:34px; height:34px; border-radius:9px; background:color-mix(in srgb, var(--marka-vurgu) 12%, var(--yuzey)); color:var(--marka-vurgu); display:flex; align-items:center; justify-content:center; flex:0 0 34px; }
.km-ikon--mavi { background:var(--mavi-50); color:var(--mavi); }
.km-bekleme { white-space:nowrap; color:var(--ink-600); }
.km-bekleme--gec { color:var(--err); font-weight:700; }
.km-satir--gec td { background:color-mix(in srgb, var(--marka-vurgu) 6%, var(--yuzey)); }
.km-avatar { display:inline-flex; width:30px; height:30px; border-radius:50%; background:var(--ink-100); color:var(--ink-700); align-items:center; justify-content:center; font-size:.75rem; font-weight:700; margin-right:8px; }
.km-btn { background:var(--marka-vurgu); color:var(--ters-ink); border-color:var(--marka-vurgu); white-space:nowrap; }
.km-not { margin-top:12px; }

/* ═══ PAKET 869 — İş Dağılımı ═══════════════════════════════════════ */
.idg-sayaclar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.idg-sayac{padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.idg-sayac-ad{font-size:12px;color:var(--ink-600)}
.idg-sayac strong{font-size:26px;line-height:1.1}
.idg-sayac small{font-size:11px;color:var(--ink-600)}
.idg-sayac--dikkat strong{color:var(--uyari)}
.idg-iki{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:14px;align-items:start}
.idg-sol,.idg-sag{display:flex;flex-direction:column;gap:14px;min-width:0}
.idg-tablo td{vertical-align:middle}
.idg-tablo td small{display:block;font-size:11px;color:var(--ink-600)}
.idg-satir--disi td{opacity:.6}
.idg-avatar{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--mavi-50);color:var(--marka-vurgu);font-size:11px;font-weight:600;margin-right:8px;vertical-align:middle}
.idg-brans{font-size:12px;color:var(--ink-600);max-width:220px}
.idg-aktif{font-weight:600}
.idg-yuk{min-width:130px}
.idg-yuk-ic{display:flex;align-items:center;gap:8px}
.idg-cubuk{flex:1;height:6px;border-radius:3px;background:var(--zemin);overflow:hidden}
.idg-cubuk i{display:block;height:100%;background:var(--marka-vurgu)}
.idg-sira-kisi{display:flex;align-items:center;gap:6px;font-size:16px;margin-bottom:6px}
.idg-sira-yok{color:var(--uyari);margin:0 0 6px}
.idg-kural .pad{display:flex;flex-direction:column;gap:14px}
.idg-kural-satir{display:flex;flex-direction:column;gap:2px}
.idg-kural-satir span{font-size:12px;color:var(--ink-600)}
.idg-kural-satir small{font-size:11px;color:var(--ink-600)}
.idg-form{display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:1px solid var(--cizgi)}
.idg-anahtar{display:flex;align-items:center;gap:8px;font-weight:600}
.idg-kaynaklar,.idg-gunler{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px}
.idg-saat{display:flex;align-items:center;gap:6px}
.idg-saat .input{width:auto}
.idg-form .btn{align-self:flex-start}
.idg-devir-liste{list-style:none;margin:0;padding:0}
.idg-devir-liste li{display:flex;flex-wrap:wrap;gap:4px 10px;padding:8px 16px;border-top:1px solid var(--cizgi);font-size:13px}
.idg-devir-zaman{font-variant-numeric:tabular-nums;color:var(--ink-600)}
.idg-not{margin-top:12px}
@media (max-width:900px){.idg-sayaclar{grid-template-columns:repeat(2,minmax(0,1fr))}.idg-iki{grid-template-columns:1fr}}

/* ═══ PAKET 870 — Bayi Ekle kısayolu · branş dağılımı ═══════════════ */
.bs-brans{margin:12px 0;padding-top:10px;border-top:1px solid var(--cizgi)}
.bs-brans-bas{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
.bs-brans-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}
.bs-brans-liste li{display:grid;grid-template-columns:minmax(70px,1fr) 2fr auto auto;align-items:center;gap:8px;font-size:12px}
.bs-brans-cubuk{height:6px;border-radius:3px;background:var(--zemin);overflow:hidden}
.bs-brans-cubuk i{display:block;height:100%;background:var(--marka-vurgu)}
.bs-brans-sayi,.bs-brans-prim{color:var(--ink-600);white-space:nowrap}
.pol-bayi-suz{margin-left:8px;vertical-align:middle;font-weight:500}

/* ═══ PAKET 871 — Tıklanabilir satır ════════════════════════════════ */
tr.satir-git{cursor:pointer}
tr.satir-git:hover > td{background:color-mix(in srgb, var(--marka-vurgu) 6%, var(--yuzey))}

/* ═══ PAKET 872 — Bayi resmi personeli ══════════════════════════════ */
.bp-bas{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:10px 0 6px}
.bp-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.bp-liste li{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:8px 10px;border:1px solid var(--cizgi);border-radius:8px;font-size:12px}
.bp-kisi{flex:1 1 140px;min-width:0}
.bp-kisi small{color:var(--ink-600)}
.bp-kisi .bp-tarih{display:block}
.bp-tutar{display:flex;gap:10px;white-space:nowrap}
.bp-tutar span{color:var(--ink-600)}
.bp-tutar b{color:var(--ink-900);font-weight:600}
.bp-eylem{display:flex;gap:4px;flex:1 0 100%;justify-content:flex-end}
.bp-ayrilan{opacity:.6}
.bp-defter-liste li{display:grid;grid-template-columns:auto 1fr auto;gap:8px}
.bp-defter-liste small{display:block;color:var(--ink-600);text-align:right}
.bp-ayar{display:grid;grid-template-columns:1fr 90px auto;gap:8px;align-items:end;margin:12px 0;padding-top:10px;border-top:1px solid var(--cizgi)}
.bp-ayar .field{margin:0}
.bp-ayar .sebep{grid-column:1 / -1;margin:0}
.bp-defter{padding-top:10px;border-top:1px solid var(--cizgi)}
.bp-uyari{color:var(--err)}
.bp-pencere .modal-card{width:640px}
form.inline{display:inline}
@media (max-width:560px){.bp-ayar{grid-template-columns:1fr}}

/* ═══ PAKET 874 — Bayi pencereleri · hakediş raporu ═════════════════ */
.by-rapor .modal-card{width:900px;max-width:96vw}
.by-rapor-kartlar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:12px}
.by-rapor-kartlar > div{padding:8px 10px;border:1px solid var(--cizgi);border-radius:8px}
.by-rapor-kartlar small{display:block;font-size:11px;color:var(--ink-600)}
.by-rapor-kartlar b{font-size:15px}
.by-rapor-tablo{max-height:50vh;overflow:auto}
.by-rapor-tablo td small{color:var(--ink-600);font-size:11px}
.by-mut{grid-template-columns:repeat(3,minmax(0,1fr))}
.by-mut-bas{font-size:13px;margin:12px 0 6px}
.by-rapor .yt-bas small{font-weight:400;margin-left:6px}
@media (max-width:700px){.by-rapor-kartlar{grid-template-columns:repeat(2,minmax(0,1fr))}.by-mut{grid-template-columns:1fr 1fr}}

/* ═══ PAKET 875 — Gönderim önizlemesi · kendime test gönder ═════════ */
.sbt-onizleme{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:16px;align-items:start;margin:0 0 16px;padding:14px;border:1px solid var(--cizgi);border-radius:10px;background:var(--zemin)}
.sbt-tel{background:color-mix(in srgb, var(--marka-vurgu) 4%, var(--yuzey));border:1px solid var(--cizgi);border-radius:14px;padding:10px}
.sbt-tel-ust{display:flex;align-items:center;gap:8px;padding:4px 4px 10px;border-bottom:1px solid var(--cizgi);margin-bottom:10px}
.sbt-tel-ust small{display:block;color:var(--ink-600);font-size:11px}
.sbt-av{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--marka-vurgu);color:var(--ters-ink);font-weight:700;font-size:12px}
.sbt-balon{position:relative;background:var(--yuzey);border-radius:10px;padding:8px 10px 18px;max-width:92%;box-shadow:0 1px 2px color-mix(in srgb, var(--ink-900) 10%, transparent)}
.sbt-medya img,.sbt-medya video{display:block;width:100%;max-height:240px;object-fit:cover;border-radius:8px;margin-bottom:8px}
.sbt-baslik{font-weight:700;margin-bottom:4px}
.sbt-govde{white-space:pre-wrap;font-size:13px;line-height:1.45}
.sbt-alt{color:var(--ink-600);font-size:11px;margin-top:6px}
.sbt-saat{position:absolute;right:8px;bottom:4px;font-size:10px;color:var(--ink-600)}
.sbt-not{margin:8px 0 0}
.sbt-test{display:flex;flex-direction:column;gap:8px;align-self:center}
.sbt-dugme{align-self:flex-start}
@media (max-width:700px){.sbt-onizleme{grid-template-columns:1fr}}

/* ═══ PAKET 876 — Kişiye özel video önizlemesi · kendime test gönder ═══ */
.vdt-ses{margin:8px 0 0;padding:8px 10px;border-radius:8px;background:var(--yuzey);border:1px dashed var(--cizgi);font-size:12px;line-height:1.45;color:var(--ink-600)}
.vdt-ses strong{color:var(--ink-900)}

/* ═══ PAKET 877 — Muhasebe ekranları: çalışma alanı · kasa ve banka · gün sonu ═══ */
.mh-alan{min-width:0}
.mh-eylem{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.mh-eylem--sag{justify-content:flex-end;align-items:center}
.mh-eylem.pg-eylem{display:flex;grid-template-columns:none}
.mh-eylem.pg-eylem > .btn{padding-top:9px;padding-bottom:9px;flex:0 0 auto}
.mh-eylem.pg-eylem > .pg-eylem-ana,.mh-eylem.pg-eylem > [data-hk-ac="hk-tahsilat"]{font-weight:600}
.mh-sayac{margin-bottom:16px}
.mh-sayac > .stat-card .stat-card-value{font-size:1.35rem;white-space:nowrap}
.ks-ozet.mh-sayac{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.mh-sayac > .stat-card.is-secili{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.mh-sayac > .stat-card .stat-card-label + .stat-card-label{color:var(--ink-500)}
.mh-izgara{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:16px;align-items:start}
.mh-ana,.mh-yan{min-width:0;display:flex;flex-direction:column;gap:16px}
.mh-ana > .panel,.mh-yan > .panel{margin-bottom:0}
.mh-head-eylem{display:flex;gap:6px;flex-wrap:wrap}
.panel-head .mh-head-eylem .btn{margin:0}
.mh-yapilacak td,.ks-tablo td,.ma-tablo td{vertical-align:middle}
.mh-yapilacak tr.pg-satir,.mh-yapilacak tr.ma-vade-satir{display:table-row;padding:0;border-top:0;font-size:inherit}
.mh-yapilacak .ma-vade-yazi small{white-space:normal}
.mh-yapilacak .pill.ma-vade-gun{font-variant-numeric:tabular-nums}
.mh-yapilacak .ma-vade-dugme{border-color:var(--brand)}
.mh-giris{color:var(--ok);font-variant-numeric:tabular-nums;white-space:nowrap}
.mh-cikis{color:var(--err);font-variant-numeric:tabular-nums;white-space:nowrap}
.ks-tablo td:nth-child(2),.ks-tablo td:last-child,.mh-yapilacak td:last-child{white-space:nowrap}
.mh-tarih{white-space:nowrap}
.mh-sayim{margin:0;padding:10px 22px 14px;font-size:.82rem}
.mh-hesap-liste{display:flex;flex-direction:column}
.mh-hesap-satir{display:grid;grid-template-columns:40px minmax(0,1fr) auto 14px;align-items:center;gap:12px;padding:12px 22px;border-top:1px solid var(--cizgi);text-decoration:none;color:inherit;border-radius:0;border-left:0;border-right:0;border-bottom:0;flex-direction:row}
.mh-hesap-satir:first-child{border-top:0}
.mh-hesap-satir:hover{background:color-mix(in srgb, var(--marka-vurgu, var(--brand)) 5%, var(--yuzey))}
.mh-hesap-satir .gb-ikon{width:40px;height:40px;border-radius:10px}
.mh-hesap-ad{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mh-hesap-ad small{display:block;font-weight:400;font-size:.78rem;color:var(--ink-500)}
.mh-hesap-satir strong{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:1rem}
.mh-ok{color:var(--ink-400);font-size:1.1rem}
.mh-zaman{list-style:none;margin:0;padding:6px 22px 14px}
.mh-zaman-satir{display:grid;grid-template-columns:44px 14px minmax(0,1fr);gap:10px;align-items:start;padding:8px 0;position:relative}
.mh-zaman-satir + .mh-zaman-satir::before{content:"";position:absolute;left:50px;top:-14px;height:18px;border-left:2px solid var(--cizgi)}
.mh-zaman-saat{font-size:.78rem;color:var(--ink-500);font-variant-numeric:tabular-nums;padding-top:2px}
.mh-zaman-nokta{width:12px;height:12px;border-radius:50%;border:2px solid var(--ok);background:var(--yuzey);margin-top:4px}
.mh-zaman-nokta--cikis{border-color:var(--err)}
.mh-zaman-yazi{display:flex;flex-direction:column;gap:2px;min-width:0}
.mh-zaman-yazi strong{font-weight:600;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mh-zaman-yazi small{font-size:.78rem;color:var(--ink-500)}
.mh-form{padding:14px 22px 18px}
.mh-form-not{margin:0 0 12px;font-size:.84rem}
.mh-dikey{display:flex;flex-direction:column;gap:10px}
.mh-dikey .field{margin:0}
.mh-ikili-alan{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mh-tam-dugme{width:100%;justify-content:center}
.mh-hesap-hucre{display:inline-flex;align-items:center;gap:10px}
.mh-ikon-kucuk{width:30px;height:30px;border-radius:8px}
.mh-kontrol-liste{display:flex;flex-direction:column}
.mh-kontrol-satir{gap:12px;padding:12px 22px}
.mh-kontrol-satir:first-child{border-top:0}
.gs-gun.mh-eylem .input{margin:0}
@media (max-width:1100px){.mh-izgara{grid-template-columns:1fr}}
@media (max-width:700px){.mh-ikili-alan{grid-template-columns:1fr}.mh-eylem--sag{justify-content:flex-start}}

/* ═══ PAKET 878 — Muhasebe ekranları: ekstre aktar · tahsilat kartları · tahsilat raporu ═══ */
.ek-serit{max-width:100%}
.ek-dosya{margin-bottom:16px}
.ek-dosya-ic{display:flex;align-items:center;gap:14px;padding:14px 22px}
.ek-dosya-ad{flex:1;min-width:0}
.ek-dosya-ad strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ek-dosya-ad small{color:var(--ink-500);font-size:.8rem}
.ek-tablo tr.ek-kontrol td{background:color-mix(in srgb, var(--uyari) 7%, var(--yuzey))}
.ek-tablo .ek-secim{min-width:170px}
.ek-etiket{flex-direction:column;align-items:stretch;gap:6px;padding:10px 0}
.ek-etiket:first-child{border-top:0;padding-top:0}
.ek-onay-serit{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 22px;margin-top:16px}
.ek-onay-dugmeler{display:flex;gap:8px;flex-wrap:wrap}
.ek-onay-ad{display:none}
.ek-yukle-form{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.ek-dosya-alan{flex:1;min-width:260px;display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px dashed var(--cizgi-koyu, var(--cizgi));border-radius:10px;cursor:pointer}
.ek-dosya-alan > span:nth-child(2){display:flex;flex-direction:column;gap:2px;flex:1}
.ek-dosya-alan small{color:var(--ink-500);font-size:.8rem}
.ek-dosya-alan .input{flex:0 1 240px;margin:0}
.kt-kartlar{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:16px}
.kt-kart{position:relative;display:flex;align-items:flex-start;gap:12px;padding:16px;border:1px solid var(--cizgi);border-radius:12px;background:var(--yuzey);text-decoration:none;color:inherit;min-height:92px}
.kt-kart:hover{border-color:var(--cizgi-koyu, var(--ink-400))}
.kt-kart.is-secili{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.kt-kart.is-pasif{opacity:.65}
.kt-kart-yazi{display:flex;flex-direction:column;gap:4px;min-width:0}
.kt-kart-yazi strong{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kt-kart-yazi small{color:var(--ink-600);letter-spacing:.08em}
.kt-kart-yazi .pill{align-self:flex-start;margin-top:4px}
.kt-tik{position:absolute;top:12px;right:12px;width:22px;height:22px;border-radius:50%;background:var(--brand);color:var(--ters-ink);display:inline-flex;align-items:center;justify-content:center}
.kt-bilgi-ust{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.kt-satirlar{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;margin:0 0 14px;font-size:.9rem}
.kt-satirlar dt{color:var(--ink-500)}
.kt-satirlar dd{margin:0;text-align:right}
.kt-bilgi form{margin-top:8px}
.kt-not{margin:12px 0 0}
.th-donem{margin-bottom:14px}
.th-donem .bo-cip{display:flex;flex-wrap:wrap;gap:6px}
.th-donem .bo-cip-d.is-active,.th-donem .bo-cip-d.is-on{background:var(--brand);color:var(--ters-ink);border-color:var(--brand)}
.th-kartlar tr.is-secili td{background:color-mix(in srgb, var(--marka-vurgu, var(--brand)) 7%, var(--yuzey))}
.th-dokum td{vertical-align:top}
.th-yontem{margin-top:16px}
.th-yontem-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px 28px;padding:14px 22px 18px}
.th-yontem-satir{display:grid;grid-template-columns:30px minmax(0,1fr) 44px;gap:12px;align-items:center}
.th-yontem-ust{display:flex;justify-content:space-between;gap:10px;font-size:.9rem;margin-bottom:6px}
.th-cubuk{height:8px;border-radius:999px;background:var(--ink-100);overflow:hidden}
.th-cubuk span{display:block;height:100%;background:var(--brand);border-radius:999px}
.th-yontem-yuzde{text-align:right;color:var(--ink-600);font-size:.86rem;font-variant-numeric:tabular-nums}
@media (max-width:700px){.kt-kartlar{grid-template-columns:1fr}}

/* ═══ PAKET 879 — Muhasebe ekranları: taksitler · cari · giderler · muhasebeye aktar ═══ */
.tk-kutular{margin:0 0 6px;display:flex;flex-wrap:wrap;gap:6px}
.tk-kutu b{font-weight:600}
.tk-kutu.is-active,.tk-kutu.is-on{background:var(--brand);color:var(--ters-ink);border-color:var(--brand)}
.tk-kutu--gec:not(.is-active){color:var(--err);border-color:color-mix(in srgb, var(--err) 40%, var(--cizgi))}
.tk-not{margin:0 0 14px;font-size:.85rem}
.tk-izgara{grid-template-columns:minmax(0,1.1fr) minmax(320px,1fr)}
.tk-baslik{margin:0;font-size:1.06rem}
.tk-ara{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.tk-ara .input{min-width:220px;margin:0}
.tk-tablo td{vertical-align:middle}
.tk-tablo tr.is-secili td,.tk-plan-tablo tr.is-secili td{background:color-mix(in srgb, var(--marka-vurgu, var(--brand)) 7%, var(--yuzey))}
.tk-tablo td.sag,.tk-tablo th.sag,.tk-plan-tablo td.sag,.tk-plan-tablo th.sag{text-align:right;font-variant-numeric:tabular-nums}
.tk-gec{color:var(--err)}
.tk-odendi{color:var(--ok)}
.tk-kucuk{font-size:.8rem;color:var(--ink-500)}
.tk-ozet-dort{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0 22px 12px;border:1px solid var(--cizgi);border-radius:10px;overflow:hidden}
.tk-ozet-dort > div{padding:10px 12px;border-left:1px solid var(--cizgi);display:flex;flex-direction:column;gap:4px}
.tk-ozet-dort > div:first-child{border-left:0}
.tk-ozet-dort span{font-size:.78rem;color:var(--ink-500)}
.tk-ozet-dort strong{font-variant-numeric:tabular-nums;font-size:1rem}
.tk-eylem{display:flex;flex-direction:column;gap:8px}
.tk-odeme-form{display:flex;flex-direction:column;gap:8px}
.tk-odeme-form .input{margin:0}
.tk-hatirlatma,.tk-plan-kur{margin-top:16px;padding:16px 22px}
.tk-plan{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;align-items:end}
.tk-plan label{font-size:.85rem;font-weight:600;display:block;margin-bottom:4px}
.ca-uclu{display:grid;grid-template-columns:minmax(230px,.75fr) minmax(0,2fr) minmax(250px,.8fr);gap:16px;align-items:start}
.ca-uclu > *{min-width:0}
.ca-orta,.ca-sag{display:flex;flex-direction:column;gap:16px}
.ca-orta > .panel,.ca-sag > .panel,.ca-liste{margin-bottom:0}
.ca-ara{display:flex;gap:6px;padding:10px 22px}
.ca-ara .input{margin:0;flex:1}
.ca-kisiler{list-style:none;margin:0;padding:0;max-height:640px;overflow:auto}
.ca-kisiler li a{display:flex;justify-content:space-between;gap:10px;padding:10px 22px;border-top:1px solid var(--cizgi);text-decoration:none;color:inherit}
.ca-kisiler li a:hover{background:color-mix(in srgb, var(--marka-vurgu, var(--brand)) 5%, var(--yuzey))}
.ca-kisiler li.is-secili a{background:color-mix(in srgb, var(--marka-vurgu, var(--brand)) 9%, var(--yuzey));box-shadow:inset 3px 0 0 var(--brand)}
.ca-kisi-ad,.ca-kisi-bakiye{display:flex;flex-direction:column;gap:2px;min-width:0}
.ca-kisi-ad strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca-kisi-ad small,.ca-kisi-bakiye small{font-size:.76rem;color:var(--ink-500)}
.ca-kisi-bakiye{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}
.ca-borclu{color:var(--err)}
.ca-alacakli{color:var(--ok)}
.ca-kucuk{font-size:.8rem}
.ca-kart-ust{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,300px);gap:16px;padding:14px 22px 18px;align-items:start}
.ca-kimlik{margin:0}
.ca-bakiye-kutu{border:1px solid color-mix(in srgb, var(--err) 25%, var(--cizgi));background:color-mix(in srgb, var(--err) 5%, var(--yuzey));border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.ca-bakiye-kutu.is-alacak{border-color:color-mix(in srgb, var(--ok) 25%, var(--cizgi));background:color-mix(in srgb, var(--ok) 5%, var(--yuzey))}
.ca-bakiye-kutu span{font-weight:600}
.ca-bakiye-kutu small{color:var(--ink-500);font-size:.8rem}
.ca-bakiye-kutu strong{font-size:1.5rem;font-variant-numeric:tabular-nums}
.ca-bakiye-kutu .eg-aciklama{margin:4px 0 0}
.ca-tablo td{vertical-align:middle;white-space:nowrap}
.ca-tablo td:nth-child(2){white-space:normal;min-width:220px}
.ca-tablo td.sag,.ca-tablo th.sag{text-align:right;font-variant-numeric:tabular-nums}
.ca-mini{list-style:none;margin:0;padding:6px 22px 14px}
.ca-mini li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--cizgi);font-size:.88rem}
.ca-mini li:first-child{border-top:0}
.ca-mini li > span:first-child{display:flex;flex-direction:column;min-width:0}
.ca-mini small{color:var(--ink-500);font-size:.76rem}
.gid-suzgec{display:flex;gap:8px;flex-wrap:wrap;padding:10px 22px;border-bottom:1px solid var(--cizgi)}
.gid-suzgec .input{margin:0;max-width:220px}
.gid-tablo td{vertical-align:middle;white-space:nowrap}
.gid-tablo td:first-child{white-space:normal;min-width:180px}
.gid-cubuklar{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.gid-avans{margin-top:16px}
.mha-esleme td{vertical-align:middle}
.mha-serit{margin-top:16px}
@media (max-width:1200px){.ca-uclu{grid-template-columns:1fr 1fr}.ca-liste{grid-column:1 / -1}}
@media (max-width:800px){.ca-uclu{grid-template-columns:1fr}.tk-ozet-dort{grid-template-columns:1fr 1fr}.ca-kart-ust{grid-template-columns:1fr}}
/* ═══ PAKET 881 — Acente sitesi: sade teklif formu (kutucuklu branş · kısa alanlar) · site stili inc/acente-site-gorunum.php içinde */

/* ═══ PAKET 883 — Acente sitesi: beş adımlı kurulum + canlı ön izleme (panel/site-acente.php · site-onizleme.php) ═══ */
.as-serit{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:10px 16px;border:1px solid var(--cizgi);border-radius:12px;background:var(--yuzey);margin-bottom:14px}
.as-serit .as-ilerleme{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:.85rem;color:var(--ink-600)}
.as-cubuk{width:220px;height:6px;border-radius:999px;background:var(--ink-100);overflow:hidden}
.as-cubuk i{display:block;height:100%;background:var(--marka-vurgu)}
.as-kayit{display:inline-flex;align-items:center;gap:6px;color:var(--ok);font-size:.88rem}
.as-duzen{display:grid;grid-template-columns:230px minmax(0,1fr) minmax(360px,520px);gap:16px;align-items:start}
.as-duzen--form{grid-template-columns:250px minmax(0,1fr) minmax(320px,400px)}
.as-adim-yatay{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.as-adim-yatay a{display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 8px;border-radius:999px;border:1px solid var(--cizgi);background:var(--yuzey);text-decoration:none;color:var(--ink-600);font-size:.88rem}
.as-adim-yatay a .no{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:.78rem;font-weight:700;background:var(--zemin)}
.as-adim-yatay a.is-on{border-color:var(--marka-vurgu);color:var(--ink-900);font-weight:600}
.as-adim-yatay a.is-on .no{background:var(--marka-vurgu);color:var(--ters-ink)}
.as-adim-yatay a.is-tamam .no{background:color-mix(in srgb,var(--ok) 15%,transparent);color:var(--ok)}
.as-fd-sol{position:sticky;top:12px}
.as-adimlar{position:sticky;top:12px}
.as-adimlar h3{margin:0 0 2px}
.as-ipuc--kisa{display:block;margin:0 0 10px;font-size:.84rem}
.as-adim{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:10px;text-decoration:none;color:inherit}
.as-adim:hover{background:var(--zemin)}
.as-adim.is-on{background:color-mix(in srgb,var(--marka-vurgu) 10%,transparent)}
.as-adim b{display:block;font-size:.95rem}
.as-adim small{color:var(--ink-600)}
.as-adim .no{flex:none;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--cizgi);display:grid;place-items:center;font-size:.85rem;font-weight:700;background:var(--yuzey)}
.as-adim.is-on .no{background:var(--marka-vurgu);color:var(--ters-ink);border-color:var(--marka-vurgu)}
.as-adim.is-tamam .no{background:color-mix(in srgb,var(--ok) 15%,transparent);color:var(--ok);border-color:transparent}
.as-uyari-kutu{margin-top:12px;border:1px solid color-mix(in srgb,var(--uyari) 45%,transparent);background:color-mix(in srgb,var(--uyari) 10%,var(--yuzey));border-radius:10px;padding:12px 14px;font-size:.88rem}
.as-uyari-kutu b{display:block;margin-bottom:4px}
.as-uyari-kutu ul{margin:0;padding-left:18px}
.as-onizleme{position:sticky;top:12px}
.as-onizleme-bas{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px}
.as-onizleme-bas h3{margin:0}
.as-onizleme-bas .hint{display:block}
.as-cihaz{margin-left:auto;display:flex;border:1px solid var(--cizgi);border-radius:8px;overflow:hidden}
.as-cihaz button{border:0;background:var(--yuzey);padding:6px 10px;cursor:pointer;color:var(--ink-600)}
.as-cihaz button.is-on{background:color-mix(in srgb,var(--marka-vurgu) 12%,transparent);color:var(--marka-vurgu)}
.as-tarayici{border:1px solid var(--cizgi);border-radius:12px;overflow:hidden;background:var(--yuzey)}
.as-tarayici-ust{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--cizgi);background:var(--zemin);font-size:.82rem;color:var(--ink-600)}
.as-tarayici-ust i{width:10px;height:10px;border-radius:50%;background:var(--ink-100);display:inline-block}
.as-tarayici-ust .adres{flex:1;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:6px;padding:4px 10px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.as-tarayici iframe{display:block;width:100%;height:640px;border:0;background:var(--yuzey);margin:0 auto;transition:width .2s}
.as-tarayici.is-telefon iframe{width:390px}
.as-sablonlar{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.as-sb{border-width:1.5px}
.as-sb.is-on{border-color:var(--marka-vurgu);box-shadow:0 0 0 3px color-mix(in srgb,var(--marka-vurgu) 15%,transparent)}
.as-sb-maket{display:block;position:relative;height:96px;background:var(--m-zemin);padding:8px 10px;font-size:0}
.as-sb-ust{display:flex;gap:4px;height:6px;margin-bottom:8px}
.as-sb-ust i{display:block;width:14px;height:6px;border-radius:2px;background:var(--m-ana);opacity:.5}
.as-sb-ust i:first-child{width:22px;opacity:1}
.as-sb-kapak{display:block;background:var(--m-ana);border-radius:6px;padding:8px;height:44px}
.as-sb-kapak b{display:block;height:5px;width:70%;background:var(--m-kart);opacity:.9;border-radius:2px;margin-bottom:4px}
.as-sb-kapak b.kisa{width:45%;opacity:.6}
.as-sb-kapak em{display:block;width:26px;height:8px;border-radius:2px;background:var(--m-vurgu);margin-top:6px}
.as-sb-kartlar{display:flex;gap:4px;margin-top:6px}
.as-sb-kartlar i{display:block;flex:1;height:12px;border-radius:3px;background:var(--m-kart);border:1px solid var(--cizgi)}
.as-sb-tik{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;background:var(--marka-vurgu);color:var(--ters-ink);display:grid;place-items:center}
.as-sb-renkler{display:flex;gap:6px;margin-top:8px}
.as-sb-renkler i{display:inline-block;width:16px;height:16px;border-radius:50%;border:1px solid var(--cizgi)}
.as-sb-renkler--buyuk i{width:30px;height:30px}
.as-sb-renkler a{width:30px;height:30px;border-radius:50%;border:1px dashed var(--cizgi);display:grid;place-items:center;text-decoration:none;color:var(--ink-600)}
.as-altbaslik{margin:22px 0 2px;font-size:1rem}
.as-marka{display:grid;grid-template-columns:auto 1fr 1.2fr;gap:14px;align-items:center;border:1px solid var(--cizgi);border-radius:12px;padding:14px}
.as-logo-kutu{display:grid;place-items:center;gap:4px;width:160px;height:84px;border:1.5px dashed var(--cizgi);border-radius:10px;text-decoration:none;color:var(--ink-600);font-size:.85rem;background:var(--zemin)}
.as-logo-kutu img{max-height:48px;max-width:140px}
.as-logo-kutu small{font-size:.72rem}
.as-marka-renk b,.as-marka-not b{display:block;font-size:.9rem;margin-bottom:6px}
.as-yayinda{display:inline-flex;align-items:center;gap:6px;padding:8px 14px}
/* 5 · teklif formu düzenleyici */
.as-fd-grup{display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:10px;text-decoration:none;color:inherit;border:1px solid transparent}
.as-fd-grup:hover{background:var(--zemin)}
.as-fd-grup.is-on{background:color-mix(in srgb,var(--marka-vurgu) 10%,transparent);border-color:color-mix(in srgb,var(--marka-vurgu) 35%,transparent)}
.as-fd-grup .ik{flex:none;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:var(--zemin);color:var(--ink-600)}
.as-fd-grup b{display:block;font-size:.93rem}
.as-fd-grup small{color:var(--ink-600)}
.as-fd-alan{display:flex;gap:10px;align-items:center;padding:9px 12px;border:1px solid var(--cizgi);border-radius:10px;margin-bottom:6px;text-decoration:none;color:inherit;background:var(--yuzey)}
.as-fd-alan.is-on{border-color:var(--marka-vurgu);box-shadow:0 0 0 2px color-mix(in srgb,var(--marka-vurgu) 15%,transparent)}
.as-fd-alan.is-sabit{color:var(--ink-600);background:var(--zemin)}
.as-fd-alan .tut{color:var(--ink-100);font-weight:700;letter-spacing:-2px}
.as-fd-alan .ad{flex:1;font-weight:600;font-size:.9rem}
.as-fd-alan .ok{display:flex;gap:2px}
.as-fd-alan .ok button{border:0;background:transparent;cursor:pointer;color:var(--ink-600);padding:2px 5px}
.as-fd-ekle{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:8px;padding:10px;border:1.5px dashed var(--marka-vurgu);border-radius:10px;background:color-mix(in srgb,var(--marka-vurgu) 6%,transparent);color:var(--marka-vurgu);font:inherit;font-weight:600;cursor:pointer}
.as-fd-bas{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.as-fd-bas h3{margin:0}
.as-fd-bas .btn{margin-left:auto}
.as-anahtar{display:flex;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--cizgi)}
.as-anahtar b{display:block;font-size:.93rem}
.as-anahtar .hint{display:block}
.as-anahtar label{margin-left:auto;position:relative;width:44px;height:26px;flex:none}
.as-anahtar input{opacity:0;width:0;height:0;position:absolute}
.as-anahtar span.k{position:absolute;inset:0;border-radius:999px;background:var(--ink-100);transition:.15s}
.as-anahtar span.k::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:var(--yuzey);transition:.15s}
.as-anahtar input:checked + span.k{background:var(--marka-vurgu)}
.as-anahtar input:checked + span.k::after{transform:translateX(18px)}
.as-sonrasi{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:10px;align-items:center}
.as-sonrasi .kutu{min-width:0;display:flex;gap:10px;align-items:center;border:1px solid var(--cizgi);border-radius:10px;padding:12px}
.as-sonrasi .kutu .ik{flex:none;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:var(--zemin);color:var(--ink-600)}
.as-sonrasi .kutu b{display:block;font-size:.9rem}
.as-sonrasi .kutu small{color:var(--ink-600)}
.as-sonrasi .ok{color:var(--ink-600);font-size:1.2rem}
.as-sonrasi-alt{display:flex;align-items:center;gap:10px;margin-top:10px}
.as-sonrasi-alt .btn{margin-left:auto}
@media(max-width:1280px){.as-duzen{grid-template-columns:230px minmax(0,1fr)}.as-duzen--form{grid-template-columns:250px minmax(0,1fr)}.as-onizleme{grid-column:1/-1;position:static}}
@media(max-width:900px){.as-duzen,.as-marka,.as-sonrasi{grid-template-columns:1fr}.as-adimlar,.as-onizleme,.as-fd-sol{position:static}.as-tarayici iframe{height:480px}.as-cubuk{width:120px}}
/* ═══ paket 883 bloğunun sonu ═══ */

/* ═══ PAKET 884 — Acente sitesi: [hidden] kuralı + teklif başlığı (inc/acente-site-gorunum.php · sayfa.php) · paneli değiştirmez ═══ */

/* ═══ PAKET 885 — Teklifler: "Poliçelenenler" sekmesi (inc/teklif-arac.php · panel/teklifler.php) · stil değişmedi ═══ */

/* ═══ PAKET 886 — Teklif poliçesi: kendi poliçesi onay beklemez · tam tarama · YZ prim (inc/teklif-police-gonder.php · inc/police-pdf.php · panel/teklif.php) · stil değişmedi ═══ */

/* ═══ PAKET 887 — Personel kartı: "Panelde ne yaptı" sekmesi (inc/gezinti.php · panel/personel.php) ═══ */
.gzn-bas .panel-head{flex-wrap:wrap;gap:10px}
.gzn-gun{display:flex;align-items:center;gap:6px;margin-left:auto}
.gzn-gun input[type=date]{padding:5px 8px;border:1px solid var(--cizgi);border-radius:8px;font:inherit;background:var(--yuzey)}
.gzn-sayac{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch}
.gzn-kart{flex:1 1 110px;min-width:110px;text-decoration:none;color:inherit;border:1px solid var(--cizgi);border-radius:10px;padding:10px 12px}
.gzn-kart.is-on{border-color:var(--marka-vurgu);box-shadow:0 0 0 2px color-mix(in srgb,var(--marka-vurgu) 15%,transparent)}
.gzn-ilk-son{flex-basis:100%;display:flex;gap:18px;flex-wrap:wrap;font-size:.88rem;color:var(--ink-600)}
.gzn-gunler{display:flex;gap:6px;flex-wrap:wrap;align-items:center;border-top:1px solid var(--cizgi)}
.gzn-gunler .pill{text-decoration:none}
.gzn-ayrinti{max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem}
.gzn-pill--arama{background:color-mix(in srgb,var(--mavi) 14%,transparent);color:var(--mavi)}
.gzn-pill--islem{background:color-mix(in srgb,var(--uyari) 18%,transparent);color:var(--uyari)}
.gzn-pill--olay{background:color-mix(in srgb,var(--ink-600) 14%,transparent);color:var(--ink-900)}
.gzn-pill--police,.gzn-pill--teklif,.gzn-pill--kisi,.gzn-pill--sohbet{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
/* ═══ paket 887 bloğunun sonu ═══ */

/* ═══ PAKET 889 — yakalanamayan sorumluları çoklu seçim ═══ */
.ym-kisiler{display:flex;flex-wrap:wrap;gap:8px 16px}
.ym-kisi{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--cizgi);border-radius:8px;background:var(--yuzey);cursor:pointer}

/* ═══ PAKET 891 — köprüden gelen medya (yalnız işaret · stil yok) ═══ */

/* ═══ PAKET 892 — Open fiyat çalışması (yalnız işaret) ═══ */

/* ═══ PAKET 893 — grup sohbeti: gönderen etiketi ve grup cipi ═══ */
.bubble-gonderen{display:block;font-size:.76rem;font-weight:600;color:var(--marka-vurgu);margin-bottom:2px}
.ust-cip--grup{display:inline-flex;align-items:center;gap:4px}

/* ═══ PAKET 895 — QR hattında doğrudan gönderim kuyruğa (işaret · görsel değişiklik yok) ═══ */

/* ═══ PAKET 896 — elle atamada bildirim (işaret · görsel değişiklik yok) ═══ */

/* ═══ PAKET 897 — geriye dönük kimlik bağlama (işaret · görsel değişiklik yok) ═══ */

/* ═══ PAKET 898 — satış faturasının fotoğrafından teklif (işaret · görsel değişiklik yok) ═══ */

/* ═══ PAKET 899 — numarası gizli kullanıcı (BSUID) ═══ */
.ust-cip--gizli{display:inline-flex;align-items:center;gap:4px;color:var(--uyari)}

/* ═══ PAKET 901 — bayi hattı @kullanıcı adıyla (işaret · görsel değişiklik yok) ═══ */

/* ═══ PAKET 903 — gizli kişi: listede numara yazımı + bayi ekle düğmesi her hâlde (işaret) ═══ */

/* ═══ PAKET 904 — cevap rozeti yanıp söner · cevaplı gönderilmiş teklif açık işte (işaret) ═══ */
.pill--yanip.pill--bekle{outline-color:var(--uyari)}
.pill--yanip.pill--dikkat{outline-color:var(--err)}
/* ═══ PAKET 908 — QR: numarasız LID kişisi · kod ekranı kendini yeniler (biçim yok) ═══ */
/* ═══ PAKET 909 — QR: kopukken gelen + geçmiş mesajlar (biçim yok) ═══ */
/* ═══ PAKET 910 — bir acenteye çoklu QR hattı (biçim yok) ═══ */
/* ═══ PAKET 911 — tek panel · gruptan teklif (kendi hat hariç) · QR toplu rastgele ara (biçim yok) ═══ */
/* ═══ PAKET 912 — QR: toplu = yalnız kampanya (biçim yok) ═══ */
/* ═══ PAKET 913 — patron görevi (WhatsApp) · görev listesi · durum bildirimi (biçim yok) ═══ */
/* ═══ PAKET 914 — kimlikle gelen araç dışı istek yeni teklif · devir yalnız araç teklifinde (biçim yok) ═══ */
/* ═══ PAKET 915 — Cevap Bekleyenler ekranı ═══ */
.cb-kartlar { margin-bottom: 14px; }
.cb-suzgec { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; align-items: center; }
.cb-suzgec input[type=search] { flex: 1 1 240px; }
.cb-suzgec select { width: auto; }
.cb-izgara { display: grid; grid-template-columns: 1fr 1fr 1.15fr; gap: 14px; align-items: start; }
@media (max-width: 1100px) { .cb-izgara { grid-template-columns: 1fr; } }
.cb-sutun { padding-bottom: 8px; }
.cb-aciklama { margin: -6px 18px 8px; }
.cb-satir { display: flex; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--cizgi); color: inherit; text-decoration: none; }
.cb-satir:hover { background: var(--yuzey-2); }
.cb-satir.is-secili { background: var(--brand-50); box-shadow: inset 3px 0 0 var(--brand); }
.cb-govde { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.cb-ust { display: flex; justify-content: space-between; gap: 8px; }
.cb-sure { color: var(--ink-500); font-size: .85rem; white-space: nowrap; }
.cb-sure.is-asti { color: var(--err); font-weight: 600; }
.cb-mesaj { color: var(--ink-600); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-alt { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.cb-alt .pill { margin-left: 0; }
.cb-onizleme-ust { display: flex; gap: 12px; align-items: center; padding: 16px; border-bottom: 1px solid var(--cizgi); }
.cb-mesajlar { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; max-height: 420px; overflow-y: auto; }
.cb-balon { max-width: 85%; padding: 8px 12px; border-radius: var(--kose); background: var(--yuzey-2); white-space: pre-wrap; overflow-wrap: anywhere; }
.cb-balon--giden { align-self: flex-end; background: var(--brand-50); }
.cb-saat { display: block; color: var(--ink-400); font-size: .74rem; margin-top: 4px; }
.cb-teklif-kart { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 0 16px 12px; padding: 12px; border: 1px solid var(--cizgi); border-radius: var(--kose); color: inherit; text-decoration: none; }
.cb-teklif-kart > span:first-child { display: flex; flex-direction: column; }
.cb-eylemler { display: flex; flex-direction: column; gap: 8px; padding: 0 16px 12px; }
.cb-ata { display: flex; gap: 8px; }
.cb-ata select { flex: 1; }
.cb-eylemler .btn { width: 100%; justify-content: center; }
.cb-ata .btn { width: auto; }
.cb-yenileme { text-align: right; margin-top: 10px; }
/* ═══ PAKET 916 — pencere kipi · Personel Yönetimi açılır pencere ═══ */
html.pencere-kip .side, html.pencere-kip .ust-cubuk, html.pencere-kip .tel-gelen, html.pencere-kip .tel-yan { display: none !important; }
html.pencere-kip .shell { min-height: 0; }
.pg-pencere { width: min(1180px, calc(100vw - 32px)); height: min(88dvh, 900px); max-width: none; padding: 0; display: none; flex-direction: column; overflow: hidden; }
.pg-pencere[open] { display: flex; }
.pg-pencere-ust { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--cizgi); background: var(--yuzey); }
.pg-pencere-ust strong { flex: 1; font-size: 1.05rem; }
.pg-pencere iframe { flex: 1; width: 100%; border: 0; background: var(--zemin); }
@media (max-width: 700px) { .pg-pencere { width: 100vw; height: 100dvh; max-height: 100dvh; border-radius: 0; } .pg-pencere #pg-pencere-sekme { display: none; } }
/* ═══ PAKET 918 — yükleniyor örtüsü 400 ms sonra · tani-hiz bütün hesaplar ═══ */
/* ═══ PAKET 919 — Numaralar ve gönderimler · duraklat/sürdür ═══ */
.nm-sayfa { max-width: 1520px; }
.nm-bas { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; margin-bottom: 18px; }
.nm-bas h1 { margin: 0 0 4px; font-size: 1.6rem; letter-spacing: -.01em; }
.nm-bas p { margin: 0; font-size: .95rem; }
.nm-yeni { white-space: nowrap; }
.nm-ozet { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.nm-ozet-kart { display: flex; align-items: center; gap: 14px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 14px; padding: 16px 18px; }
.nm-ozet-kart small { display: block; color: var(--ink-600); font-size: .82rem; }
.nm-ozet-kart b { display: block; font-size: 1.45rem; color: var(--ink-900); font-variant-numeric: tabular-nums; line-height: 1.2; }
.nm-ozet-ikon { flex: 0 0 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--zemin); color: var(--ink-600); }
.nm-ozet--ok .nm-ozet-ikon { background: var(--ok-50); color: var(--ok); }
.nm-ozet--bilgi .nm-ozet-ikon { background: var(--mavi-50); color: var(--mavi); }
.nm-ozet--kotu .nm-ozet-ikon { background: var(--err-50); color: var(--err); }
.nm-ozet--kotu b { color: var(--err); }
.nm-govde { display: grid; grid-template-columns: minmax(0, 1fr) 470px; gap: 16px; align-items: start; }
.nm-sol { padding: 14px 16px 16px; }
.nm-arac { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; border-bottom: 1px solid var(--cizgi); margin-bottom: 14px; }
.nm-sekmeler { display: flex; gap: 4px; overflow-x: auto; }
.nm-sekme { flex: 0 0 auto; background: none; border: 0; border-bottom: 2px solid transparent; padding: 10px 12px; font: inherit; font-size: .9rem; color: var(--ink-600); cursor: pointer; white-space: nowrap; }
.nm-sekme span { display: inline-block; min-width: 22px; padding: 1px 7px; margin-left: 4px; border-radius: 999px; background: var(--zemin); font-size: .75rem; color: var(--ink-600); }
.nm-sekme.is-aktif { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }
.nm-sekme.is-aktif span { background: var(--brand-50); color: var(--brand); }
.nm-gorunum { display: flex; border: 1px solid var(--cizgi); border-radius: 10px; overflow: hidden; margin-bottom: 8px; }
.nm-gorunum button { display: flex; align-items: center; gap: 6px; background: var(--yuzey); border: 0; padding: 7px 12px; font: inherit; font-size: .85rem; color: var(--ink-600); cursor: pointer; }
.nm-gorunum button.is-aktif { background: var(--brand); color: var(--ters-ink); }
.nm-suzgec { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 12px; margin-bottom: 14px; }
.nm-liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.nm-kart { display: flex; flex-direction: column; gap: 12px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 14px; padding: 16px; min-width: 0; }
.nm-kart[hidden] { display: none; }
.nm-kart--secili { border: 2px solid var(--brand); background: var(--brand-50); padding: 15px; }
.nm-ust { display: flex; gap: 12px; align-items: center; min-width: 0; }
.nm-harf { flex: 0 0 46px; height: 46px; border-radius: 50%; background: var(--mavi-950); color: var(--ters-ink); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .95rem; }
.nm-harf--kucuk { flex-basis: 44px; height: 44px; border-radius: 12px; }
.nm-adlar { display: flex; flex-direction: column; min-width: 0; }
.nm-ad { font-size: 1rem; color: var(--ink-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nm-numara { font-size: .95rem; color: var(--ink-900); font-variant-numeric: tabular-nums; }
.nm-hesap { font-size: .78rem; color: var(--ink-500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nm-haplar { display: flex; gap: 6px; flex-wrap: wrap; }
.nm-hap { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: .78rem; font-weight: 500; background: var(--zemin); color: var(--ink-600); }
.nm-hap i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.nm-hap--ok { background: var(--ok-50); color: var(--ok); }
.nm-hap--kotu { background: var(--err-50); color: var(--err); }
.nm-hap--marka { background: var(--brand-50); color: var(--brand); border: 1px solid var(--brand); }
.nm-hap--bilgi { background: var(--mavi-50); color: var(--mavi); }
.nm-hap--durak { background: var(--uyari-50); color: var(--uyari); }
.nm-mini { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.nm-mini > div { display: flex; align-items: center; gap: 8px; min-width: 0; border: 1px solid var(--cizgi); border-radius: 10px; padding: 8px 10px; background: var(--yuzey); color: var(--ink-600); }
.nm-mini span { display: flex; flex-direction: column; font-size: .7rem; line-height: 1.25; min-width: 0; }
.nm-mini b { font-size: .86rem; color: var(--ink-900); font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nm-mini--kotu { color: var(--err) !important; }
.nm-mini--kotu b { color: var(--err); font-size: 1rem; }
.nm-eylem { display: flex; gap: 8px; align-items: stretch; margin-top: auto; }
.nm-sec { flex: 1 1 auto; margin: 0; display: flex; }
.nm-ana { flex: 1 1 auto; width: 100%; justify-content: center; text-align: center; }
.nm-ana--sorun { border: 1px solid var(--brand); color: var(--brand); background: var(--brand-50); display: flex; align-items: center; gap: 6px; }
.nm-menu { position: relative; }
.nm-menu > summary { list-style: none; height: 100%; padding-inline: 14px; cursor: pointer; }
.nm-menu > summary::-webkit-details-marker { display: none; }
.nm-menu-ic { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; min-width: 200px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px; box-shadow: var(--golge); padding: 6px; display: flex; flex-direction: column; }
.nm-menu-ic a, .nm-menu-ic button { display: block; width: 100%; text-align: left; padding: 8px 10px; border: 0; background: none; font: inherit; font-size: .88rem; color: var(--ink-900); border-radius: 6px; cursor: pointer; text-decoration: none; }
.nm-menu-ic a:hover, .nm-menu-ic button:hover { background: var(--zemin); }
.nm-menu-ic form { margin: 0; }
.nm-liste--satir { grid-template-columns: 1fr; gap: 8px; }
.nm-liste--satir .nm-kart { flex-direction: row; align-items: center; flex-wrap: wrap; padding: 10px 14px; gap: 14px; }
.nm-liste--satir .nm-kart--secili { padding: 9px 13px; }
.nm-liste--satir .nm-ust { flex: 1 1 240px; }
.nm-liste--satir .nm-harf { flex-basis: 36px; height: 36px; font-size: .82rem; }
.nm-liste--satir .nm-mini { flex: 2 1 360px; }
.nm-liste--satir .nm-eylem { flex: 0 0 auto; margin: 0; }
.nm-liste--satir .nm-haplar { flex: 0 1 auto; }
.nm-bos { padding: 24px; text-align: center; color: var(--ink-500); }
.nm-sayfala { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; font-size: .85rem; }
.nm-sayfalar { display: flex; gap: 6px; }
.nm-sayfalar button { min-width: 34px; height: 32px; border: 1px solid var(--cizgi); background: var(--yuzey); border-radius: 8px; font: inherit; cursor: pointer; color: var(--ink-900); }
.nm-sayfalar button.is-aktif { background: var(--brand); border-color: var(--brand); color: var(--ters-ink); }
.nm-sayfalar button:disabled { opacity: .45; cursor: default; }
.nm-not { margin-top: 14px; font-size: .8rem; }
.nm-canli { padding: 16px; position: sticky; top: 16px; }
.nm-canli-bas { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; padding-left: 10px; border-left: 4px solid var(--brand); }
.nm-canli-bas h2 { margin: 0; font-size: 1.15rem; }
.nm-canli-isaret { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 999px; background: var(--ok-50); color: var(--ok); font-size: .78rem; }
.nm-canli-isaret span { width: 7px; height: 7px; border-radius: 50%; background: currentColor; animation: nm-nabiz 1.6s ease-in-out infinite; }
@keyframes nm-nabiz { 50% { opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .nm-canli-isaret span { animation: none; } }
.nm-canli-say { margin-left: auto; font-size: 1.05rem; color: var(--ink-900); font-weight: 600; }
.nm-canli-bos { padding: 28px 10px; text-align: center; color: var(--ink-500); border: 1px dashed var(--cizgi); border-radius: 12px; }
.nm-gk { border: 1px solid var(--cizgi); border-radius: 14px; padding: 14px; margin-bottom: 12px; background: var(--yuzey); }
.nm-gk--durak { background: var(--uyari-50); }
.nm-gk-ust { display: flex; gap: 12px; align-items: flex-start; }
.nm-gk-ad { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.nm-gk-ad strong { font-size: .98rem; color: var(--ink-900); }
.nm-gk-ad span { font-size: .85rem; color: var(--ink-600); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nm-gk-ad small { font-size: .76rem; color: var(--ink-500); }
.nm-gk-dugme { display: flex; gap: 8px; align-items: center; }
.nm-gk-dugme form { margin: 0; display: flex; }
.nm-ikon-dugme { width: 36px; height: 34px; display: flex; align-items: center; justify-content: center; border: 1.5px solid var(--brand); color: var(--brand); background: var(--yuzey); border-radius: 9px; cursor: pointer; }
.nm-ikon-dugme--surdur { background: var(--brand); color: var(--ters-ink); }
.nm-gk-cubuk { position: relative; display: flex; align-items: center; gap: 10px; margin: 14px 0 6px; }
.nm-gk-cubuk::before { content: ''; flex: 1 1 auto; height: 10px; border-radius: 999px; background: var(--zemin); }
.nm-gk-cubuk span { position: absolute; left: 0; height: 10px; border-radius: 999px; background: var(--brand); max-width: calc(100% - 52px); }
.nm-gk-cubuk b { flex: 0 0 42px; text-align: right; font-size: .85rem; color: var(--ink-900); }
.nm-gk-alt { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .88rem; color: var(--ink-900); margin-bottom: 10px; }
.nm-gk-sayi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.nm-gk-sayi > div { display: flex; align-items: center; gap: 8px; border: 1px solid var(--cizgi); border-radius: 10px; padding: 8px 10px; color: var(--ok); }
.nm-gk-sayi > div:nth-child(2) { color: var(--ink-500); }
.nm-gk-sayi > div:nth-child(3) { color: var(--ink-600); }
.nm-gk-sayi > div.nm-gk-hata { color: var(--err); }
.nm-gk-sayi span { display: flex; flex-direction: column; font-size: .72rem; color: var(--ink-600); }
.nm-gk-sayi b { font-size: .98rem; color: var(--ink-900); font-variant-numeric: tabular-nums; }
.nm-canli-dip { display: flex; justify-content: space-between; align-items: center; font-size: .82rem; margin-top: 4px; }
.nm-canli-not { margin-top: 10px; padding: 9px 12px; border-radius: 10px; background: var(--mavi-50); color: var(--mavi); font-size: .82rem; }
.kmp-durak-not { margin: 0 0 10px; padding: 9px 12px; border-radius: 10px; background: var(--uyari-50); color: var(--uyari); flex-basis: 100%; }
@media (max-width: 1280px) { .nm-govde { grid-template-columns: 1fr; } .nm-canli { position: static; } }
@media (max-width: 900px) { .nm-ozet { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nm-liste { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  .nm-suzgec { grid-template-columns: 1fr; }
  .nm-yeni { width: 100%; text-align: center; }
  .nm-mini, .nm-gk-sayi { grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
  .nm-mini > div, .nm-gk-sayi > div { flex-direction: column; align-items: flex-start; gap: 4px; padding: 7px 8px; }
  .nm-gk-ust { flex-wrap: wrap; }
  .nm-gk-dugme { width: 100%; justify-content: flex-end; }
}
/* ═══ PAKET 920 — Numaralar: yan yana 3 hat · daha sıkı kart · hesap türü süzgeci · kurum adı ═══ */
.nm-govde { grid-template-columns: minmax(0, 1fr) 400px; }
.nm-suzgec { display: flex; flex-wrap: wrap; gap: 10px; }
.nm-suzgec #nm-ara { flex: 1 1 240px; min-width: 0; }
.nm-suzgec select { flex: 0 0 210px; }
.nm-liste { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.nm-kart { gap: 9px; padding: 12px; border-radius: 12px; }
.nm-kart--secili { padding: 11px; }
.nm-ust { gap: 10px; }
.nm-harf { flex-basis: 38px; height: 38px; font-size: .82rem; }
.nm-adlar { flex: 1 1 auto; }
div.nm-ad { display: block; font-weight: 700; font-size: .95rem; line-height: 1.3; color: var(--ink-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nm-numara { font-size: .85rem; color: var(--ink-600); }
.nm-hap { padding: 2px 8px; font-size: .72rem; }
.nm-mini { gap: 6px; }
.nm-mini > div { gap: 6px; padding: 6px 8px; border-radius: 8px; }
.nm-mini > div > svg { display: none; }   /* üç sütunda kutu dar: yazı simgeden önemli */
.nm-mini span { font-size: .66rem; }
.nm-mini b { font-size: .8rem; }
.nm-mini--kotu b { font-size: .9rem; }
.nm-eylem { gap: 6px; }
.nm-eylem .btn { min-height: 34px; padding-top: 6px; padding-bottom: 6px; font-size: .86rem; }
.nm-menu > summary { padding-inline: 11px; }
.nm-canli { padding: 14px; }
.nm-gk { padding: 12px; }
@media (max-width: 1360px) { .nm-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1280px) { .nm-govde { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .nm-liste { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .nm-suzgec select { flex: 1 1 100%; } }
/* ═══ PAKET 921 — Pervis Sigorta Acente Müdürü rolü (yalnız acenteler + Pervis Test · WhatsApp ve Sistem kapalı) · görünüm değişikliği yok ═══ */
/* ═══ PAKET 922 — Kaybedilen Teklifler ekranı (kt-) ═══ */
.kt-suzgec { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.kt-suzgec select { width: 100%; }
.kt-kartlar { margin-bottom: 14px; }
.kt-kartlar a.stat-card { text-decoration: none; color: inherit; }
.kt-en-sik { font-size: 1.25rem; }
.kt-izgara { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 14px; margin-bottom: 14px; align-items: stretch; }
.kt-dagilim { padding-bottom: 12px; }
.kt-cubuk { display: grid; grid-template-columns: 170px minmax(0, 1fr) 40px; gap: 12px; align-items: center; padding: 6px 18px; color: inherit; text-decoration: none; border-radius: 8px; }
.kt-cubuk:hover, .kt-cubuk.is-secili { background: var(--brand-50); }
.kt-cubuk-ad { font-size: .9rem; color: var(--ink-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kt-cubuk-iz { display: block; height: 14px; background: var(--zemin); border-radius: 4px; overflow: hidden; }
.kt-cubuk-dolu { display: block; height: 100%; background: var(--brand); border-radius: 4px; min-width: 2px; }
.kt-cubuk-sayi { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.kt-gec { padding: 20px 22px; background: var(--brand-50); display: flex; flex-direction: column; gap: 8px; }
.kt-gec-sayi { font-size: 2rem; font-weight: 700; color: var(--brand); line-height: 1; }
.kt-gec-baslik { font-size: 1.05rem; margin: 0; color: var(--ink-900); }
.kt-gec-eylem { display: flex; gap: 8px; flex-wrap: wrap; margin-top: auto; }
.kt-sebep--fiyat { background: var(--err-50); color: var(--err); }
.kt-sebep--ulasilamadi { background: var(--mavi-50); color: var(--mavi); }
.kt-sebep--baska_acente, .kt-sebep--vazgecti { background: var(--uyari-50); color: var(--uyari); }
.kt-geri { margin-left: 4px; }
.kt-eylemler { white-space: nowrap; }
.kt-eylemler .btn { margin-left: 4px; }
@media (max-width: 1100px) { .kt-izgara { grid-template-columns: 1fr; } .kt-suzgec { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .kt-cubuk { grid-template-columns: 110px minmax(0, 1fr) 32px; padding: 6px 10px; } .kt-suzgec { grid-template-columns: 1fr; } }
.kt-sebep, .kt-geri { white-space: nowrap; display: inline-block; margin: 2px 4px 2px 0; }
.kt-gorev-form { display: inline; }
.kt-gec-alt { margin: 0; }
.kt-not { padding: 12px 18px; margin: 0; font-size: .85rem; }
/* ═══ PAKET 923 — İş Devralma Özeti ekranı (idv-) ═══ */
.idv-ust { padding: 18px 20px; margin-bottom: 14px; }
.idv-ust-bas { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.idv-arac-ikon { width: 46px; height: 46px; border-radius: 50%; background: var(--zemin); display: grid; place-items: center; flex: 0 0 46px; }
.idv-baslik { margin: 0; font-size: 1.15rem; }
.idv-musteri { color: var(--ink-600); }
.idv-durum { margin-left: auto; }
.idv-bilgi { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 0; }
.idv-bilgi dt { font-size: .78rem; color: var(--ink-500); }
.idv-bilgi dd { margin: 2px 0 0; font-weight: 600; overflow-wrap: anywhere; }
.idv-devir { display: grid; grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); gap: 16px; padding: 14px 20px; margin-bottom: 14px; background: var(--brand-50); align-items: center; }
.idv-devir > div { display: flex; flex-direction: column; gap: 2px; }
.idv-devir small { display: block; font-size: .75rem; color: var(--ink-500); }
.idv-devir-kim { flex-direction: row !important; align-items: center; gap: 8px !important; flex-wrap: wrap; }
.idv-devir-kim > span:not(.avatar) { display: flex; flex-direction: column; font-weight: 600; }
.idv-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; align-items: stretch; }
.idv-kutu { padding-bottom: 14px; }
.idv-ic { margin: 0 18px 8px; }
.idv-ozet { margin: 0; padding: 0 18px 0 36px; display: flex; flex-direction: column; gap: 8px; }
.idv-ozet li::marker { color: var(--brand); }
.idv-zaman { list-style: none; margin: 0; padding: 0 18px; display: flex; flex-direction: column; gap: 12px; }
.idv-zaman li { border-left: 2px solid var(--cizgi); padding-left: 12px; display: flex; flex-direction: column; gap: 2px; }
.idv-zaman-ust { display: flex; justify-content: space-between; gap: 8px; }
.idv-zaman-ust .mono { color: var(--ink-500); font-size: .8rem; white-space: nowrap; }
.idv-adim { background: var(--brand-50); }
.idv-adim-bas { margin: 0 18px 6px; font-weight: 700; font-size: 1.02rem; }
.idv-adimlar { margin: 4px 0 0; padding: 0 18px 0 38px; display: flex; flex-direction: column; gap: 6px; }
.idv-mesaj { display: flex; gap: 10px; margin: 0 18px 10px; padding: 12px; border: 1px solid var(--cizgi); border-radius: 10px; }
.idv-mesaj > div { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.idv-mesaja-git { margin: 0 18px; }
.idv-ekler { list-style: none; margin: 0; padding: 0 18px; display: flex; flex-direction: column; gap: 8px; }
.idv-ekler li { display: flex; justify-content: space-between; gap: 8px; padding: 10px 12px; border: 1px solid var(--cizgi); border-radius: 10px; }
.idv-eylem { display: flex; flex-direction: column; gap: 10px; padding: 18px; justify-content: center; }
.idv-eylem form, .idv-eylem .btn { width: 100%; }
.idv-eylem form .btn { width: 100%; }
.idv-not { font-size: .82rem; margin: 0; }
@media (max-width: 1100px) { .idv-izgara { grid-template-columns: 1fr; } .idv-devir { grid-template-columns: 1fr 1fr; } .idv-bilgi { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .idv-devir { grid-template-columns: 1fr; } .idv-ust-bas { flex-wrap: wrap; } .idv-durum { margin-left: 0; } }
.idv-alt { font-size: .82rem; color: var(--ink-500); line-height: 1.45; }   /* .sebep değil: kısa metin betiği dar kutudaki .sebep'i simgeye katlıyor (ölçüldü) */
/* ═══ PAKET 924 — Teklifin İşlem Geçmişi ekranı (ig-) ═══ */
.ig-ust { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-bottom: 14px; }
.ig-ust-hucre { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-right: 1px solid var(--cizgi); min-width: 0; flex-wrap: wrap; }
.ig-ust-hucre:last-child { border-right: 0; }
.ig-alt { display: block; font-size: .8rem; color: var(--ink-500); line-height: 1.4; overflow-wrap: anywhere; }
.ig-suzgec { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.ig-suzgec select { width: auto; min-width: 180px; }
.ig-izgara { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.ig-gun { padding: 10px 18px 4px; font-size: .78rem; font-weight: 600; color: var(--ink-500); }
.ig-satir { display: grid; grid-template-columns: 50px 34px minmax(0, 1fr) 150px; gap: 12px; align-items: center; padding: 10px 18px; border-top: 1px solid var(--cizgi); color: inherit; text-decoration: none; }
.ig-satir:hover { background: var(--zemin); }
.ig-satir.is-secili { background: var(--brand-50); box-shadow: inset 3px 0 0 var(--brand); }
.ig-saat { color: var(--ink-600); font-size: .85rem; }
.ig-ikon { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--zemin); color: var(--ink-600); }
.ig-ikon--musteri { background: var(--ok-50); color: var(--ok); }
.ig-ikon--personel { background: var(--mavi-50); color: var(--mavi); }
.ig-satir--hata .ig-ikon { background: var(--err-50); color: var(--err); }
.ig-satir--uyari .ig-ikon { background: var(--uyari-50); color: var(--uyari); }
.ig-govde { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ig-yapan { font-size: .88rem; min-width: 0; overflow-wrap: anywhere; }
.ig-ayrinti { padding: 18px; position: sticky; top: 12px; }
.ig-ayrinti-bas { display: flex; gap: 12px; align-items: center; margin-bottom: 14px; }
.ig-ayrinti-bas h2 { margin: 0; font-size: 1.05rem; }
.ig-dl { margin: 0 0 14px; display: flex; flex-direction: column; gap: 10px; border-top: 1px solid var(--cizgi); padding-top: 12px; }
.ig-dl > div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 10px; }
.ig-dl dt { color: var(--ink-500); font-size: .85rem; }
.ig-dl dd { margin: 0; overflow-wrap: anywhere; }
.ig-baslik3 { font-size: .92rem; margin: 6px 0 8px; }
.ig-konusma { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px; border: 1px solid var(--cizgi); border-radius: 10px; }
@media (max-width: 1100px) { .ig-izgara { grid-template-columns: 1fr; } .ig-ust { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ig-ust-hucre:nth-child(2) { border-right: 0; } .ig-ayrinti { position: static; } }
@media (max-width: 600px) { .ig-ust { grid-template-columns: 1fr; } .ig-ust-hucre { border-right: 0; border-bottom: 1px solid var(--cizgi); } .ig-satir { grid-template-columns: 42px 30px minmax(0, 1fr); } .ig-yapan { grid-column: 3; } .ig-suzgec select { flex: 1 1 100%; } }
/* ═══ PAKET 925 — Mükerrer Kayıt Kontrolü ekranı (mkt-) ═══ */
.mkt-kartlar { margin-bottom: 14px; }
.mkt-izgara { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 14px; align-items: start; margin-bottom: 14px; }
.mkt-satir { display: flex; flex-direction: column; gap: 3px; margin: 8px 12px; padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 10px; color: inherit; text-decoration: none; }
.mkt-satir:hover { background: var(--zemin); }
.mkt-satir.is-secili { border-color: var(--brand); background: var(--brand-50); }
.mkt-satir-ust { display: flex; justify-content: space-between; gap: 8px; }
.mkt-satir-ust .mono { color: var(--ink-500); font-size: .82rem; }
.mkt-alt { display: block; font-size: .82rem; color: var(--ink-500); line-height: 1.45; }
.mkt-orta { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.mkt-eslesme { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 12px 16px; border-radius: 12px; background: var(--ok-50); color: var(--ok); }
.mkt-eslesme .mkt-alt { flex-basis: 100%; color: var(--ink-600); }
.mkt-karsilastir { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.mkt-kart { padding-bottom: 14px; }
.mkt-kart > .btn { margin: 0 18px; }
.mkt-dl { margin: 0 0 12px; padding: 0 18px; display: flex; flex-direction: column; gap: 4px; }
.mkt-dl > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 10px; padding: 6px 8px; border-radius: 6px; }
.mkt-dl > div.is-esit { background: var(--ok-50); }
.mkt-dl dt { color: var(--ink-500); font-size: .86rem; }
.mkt-dl dd { margin: 0; overflow-wrap: anywhere; }
.mkt-mesaj { font-style: italic; color: var(--ink-600); }
.mkt-karar { padding-bottom: 16px; }
.mkt-secenekler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 0 18px 14px; }
.mkt-secenek { display: flex; gap: 10px; align-items: flex-start; padding: 14px; border: 1px solid var(--cizgi); border-radius: 10px; cursor: pointer; }
.mkt-secenek:has(input:checked) { border-color: var(--brand); background: var(--brand-50); }
.mkt-secenek.is-kapali { opacity: .6; cursor: not-allowed; }
.mkt-secenek > span { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.mkt-neden { margin-top: 6px; width: 100%; }
.mkt-uygula { margin: 0 18px; }
@media (max-width: 1100px) { .mkt-izgara { grid-template-columns: 1fr; } .mkt-secenekler { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .mkt-karsilastir { grid-template-columns: 1fr; } .mkt-dl > div { grid-template-columns: 100px minmax(0, 1fr); } }
/* ═══ PAKET 926 — Gönderim Öncesi Kontrol ekranı (gkk-) ═══ */
.gkk-ust { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 14px; }
.gkk-ust > div { display: flex; flex-direction: column; gap: 2px; padding: 16px 18px; border-right: 1px solid var(--cizgi); min-width: 0; }
.gkk-ust > div:last-child { border-right: 0; }
.gkk-alt { display: block; font-size: .82rem; color: var(--ink-500); line-height: 1.45; overflow-wrap: anywhere; }
.gkk-kartlar { margin-bottom: 14px; }
.gkk-izgara { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 14px; align-items: start; margin-bottom: 14px; }
.gkk-liste { padding-bottom: 10px; }
.gkk-satir { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 12px; align-items: center; margin: 6px 14px; padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 10px; }
.gkk-isaret { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; }
.gkk-satir--iyi .gkk-isaret { background: var(--ok-50); color: var(--ok); }
.gkk-satir--kotu .gkk-isaret { background: var(--err-50); color: var(--err); }
.gkk-satir--dikkat .gkk-isaret { background: var(--uyari-50); color: var(--uyari); }
.gkk-govde { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gkk-ayrinti { margin: 8px 14px 4px; }
.gkk-ayrinti summary { cursor: pointer; color: var(--brand); font-weight: 600; }
.gkk-alicilar { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; max-height: 320px; overflow-y: auto; }
.gkk-alicilar li { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 8px 10px; background: var(--zemin); border-radius: 8px; }
.gkk-onizleme { padding-bottom: 14px; }
.gkk-ic { margin: 8px 18px 0; font-size: .85rem; }
.gkk-balon { margin: 0 18px; padding: 12px 14px; border-radius: 12px; background: var(--ok-50); color: var(--ink-900); line-height: 1.5; overflow-wrap: anywhere; }
.gkk-alt-serit { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; padding: 14px 18px; }
.gkk-uyari { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border-radius: 10px; background: var(--uyari-50); flex: 1 1 320px; }
.gkk-uyari--iyi { background: var(--ok-50); }
.gkk-eylem { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.gkk-devam { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.gkk-onay { display: flex; align-items: center; gap: 6px; }
@media (max-width: 1000px) { .gkk-izgara { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .gkk-ust { grid-template-columns: 1fr; } .gkk-ust > div { border-right: 0; border-bottom: 1px solid var(--cizgi); } .gkk-satir { grid-template-columns: 28px minmax(0, 1fr); } .gkk-satir .pill { grid-column: 2; justify-self: start; } }
/* ═══ PAKET 927 — Otomasyon Test Alanı ekranı (ota-) ═══ */
.ota-serit { display: flex; gap: 12px; align-items: flex-start; padding: 14px 18px; margin-bottom: 14px; border-radius: 12px; background: var(--brand-50); color: var(--ink-900); }
.ota-alt { display: block; font-size: .84rem; color: var(--ink-500); line-height: 1.45; }
.ota-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 14px; align-items: start; }
.ota-form { padding-bottom: 18px; display: flex; flex-direction: column; gap: 10px; }
.ota-ic { margin: 0 18px; }
.ota-etiket { font-weight: 600; font-size: .9rem; }
.ota-metin { margin: 0 18px; width: calc(100% - 36px); resize: vertical; }
.ota-kutu { display: flex; gap: 8px; align-items: center; }
.ota-dugme { margin: 4px 18px 0; }
.ota-sonuc { padding-bottom: 16px; }
.ota-adimlar { list-style: none; margin: 0; padding: 14px 18px 0; display: flex; flex-direction: column; gap: 14px; }
.ota-adim { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; }
.ota-no { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; color: var(--ters-ink); background: var(--ok); }
.ota-adim--kotu .ota-no { background: var(--uyari); }
.ota-adim-govde { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ota-adim-ust { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; align-items: center; }
.ota-neden { font-size: .84rem; color: var(--ink-600); background: var(--zemin); padding: 8px 10px; border-radius: 8px; overflow-wrap: anywhere; }
.ota-alternatif { display: flex; gap: 10px; align-items: center; margin: 14px 18px 0; padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 10px; }
@media (max-width: 1000px) { .ota-izgara { grid-template-columns: 1fr; } }
/* ═══ PAKET 928 — Verilen Sözler ekranı (vs-) ═══ */
.vs-sekmeler { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 14px; border-bottom: 1px solid var(--cizgi); }
.vs-sekme { padding: 10px 14px; color: var(--ink-600); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; display: inline-flex; gap: 6px; align-items: center; }
.vs-sekme.is-aktif { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }
.vs-rozet { min-width: 22px; padding: 1px 7px; border-radius: 999px; background: var(--zemin); font-size: .78rem; text-align: center; }
.vs-sekme.is-aktif .vs-rozet { background: var(--brand); color: var(--ters-ink); }
.vs-kartlar { margin-bottom: 14px; }
.vs-kotu { color: var(--err); }
.vs-izgara { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.vs-satir { display: grid; grid-template-columns: 36px minmax(0, 1fr) 70px 120px auto; gap: 12px; align-items: center; padding: 10px 18px; border-top: 1px solid var(--cizgi); color: inherit; text-decoration: none; }
.vs-satir:hover { background: var(--zemin); }
.vs-satir.is-secili { background: var(--brand-50); box-shadow: inset 3px 0 0 var(--brand); }
.vs-govde { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.vs-alt { display: block; font-size: .82rem; color: var(--ink-500); line-height: 1.45; overflow-wrap: anywhere; }
.vs-satir--gecikti .vs-saat { color: var(--err); font-weight: 700; }
.vs-kisi { font-size: .86rem; overflow-wrap: anywhere; }
.vs-durum--gecikti { background: var(--err-50); color: var(--err); }
.vs-durum--yaklasiyor { background: var(--uyari-50); color: var(--uyari); }
.vs-durum--bitti { background: var(--ok-50); color: var(--ok); }
.vs-ayrinti { padding: 18px; }
.vs-ayrinti-bas { margin: 0 0 12px; font-size: 1.05rem; }
.vs-musteri { display: flex; gap: 10px; align-items: center; margin-bottom: 12px; }
.vs-baslik3 { font-size: .9rem; margin: 6px 0; }
.vs-mesaj { padding: 12px; background: var(--zemin); border-radius: 10px; margin-bottom: 12px; display: flex; flex-direction: column; gap: 6px; overflow-wrap: anywhere; }
.vs-form { display: flex; flex-direction: column; gap: 10px; }
.vs-dl { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.vs-dl > div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 10px; align-items: center; }
.vs-dl dt { color: var(--ink-500); font-size: .86rem; }
.vs-dl dd { margin: 0; overflow-wrap: anywhere; }
.vs-son { color: var(--err); font-weight: 700; }
.vs-oneri-not { padding: 10px 12px; border-radius: 10px; background: var(--uyari-50); color: var(--ink-900); display: flex; flex-direction: column; gap: 4px; }
@media (max-width: 1100px) { .vs-izgara { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .vs-satir { grid-template-columns: 36px minmax(0, 1fr) auto; } .vs-kisi, .vs-satir .pill { grid-column: 2 / -1; } }
/* ═══ PAKET 929 — Eksik Bilgi Asistanı ekranı (eba-) ═══ */
.eba-kartlar { margin-bottom: 14px; }
.eba-izgara { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.15fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.eba-liste { padding-bottom: 6px; }
.eba-satir { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--cizgi); color: inherit; text-decoration: none; }
.eba-satir:hover { background: var(--zemin); }
.eba-satir.is-secili { background: var(--brand-50); box-shadow: inset 3px 0 0 var(--brand); }
.eba-govde { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.eba-alt { display: block; font-size: .82rem; color: var(--ink-500); line-height: 1.45; overflow-wrap: anywhere; }
.eba-sag { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; text-align: right; }
.eba-orta-bas { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding-right: 16px; }
.eba-ilerleme { display: flex; justify-content: space-between; gap: 10px; padding: 0 18px; font-size: .88rem; color: var(--ink-600); }
.eba-cubuk { height: 6px; margin: 8px 18px 6px; border-radius: 999px; background: var(--zemin); overflow: hidden; }
.eba-cubuk > span { display: block; height: 100%; background: var(--brand); border-radius: 999px; }
.eba-alanlar { list-style: none; margin: 0; padding: 0; }
.eba-alan { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 11px 18px; border-top: 1px solid var(--cizgi); }
.eba-durum { display: inline-flex; align-items: center; gap: 5px; font-size: .84rem; font-weight: 600; white-space: nowrap; }
.eba-alan--tam .eba-durum { color: var(--ok); }
.eba-alan--eksik .eba-durum { color: var(--err); }
.eba-form { display: flex; flex-direction: column; gap: 10px; padding: 0 18px 16px; }
.eba-metin { width: 100%; min-height: 200px; resize: vertical; font: inherit; line-height: 1.5; background: var(--brand-50); }
.eba-eylem { display: flex; gap: 8px; flex-wrap: wrap; }
.eba-eylem .btn { flex: 1 1 160px; justify-content: center; }
.eba-ic { margin: 0; padding: 0 18px 14px; font-size: .82rem; }
.eba-form .eba-ic { padding: 0; }
.eba-uyari { margin: 0; padding: 8px 10px; border-radius: 8px; background: var(--err-50); color: var(--err); font-size: .84rem; }
@media (max-width: 1280px) { .eba-izgara { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .eba-sag-kutu { grid-column: 1 / -1; } }
@media (max-width: 820px) { .eba-izgara { grid-template-columns: minmax(0, 1fr); } }
/* ═══ PAKET 930 — Kontrol Merkezi: kartlar · durum rozeti · ayrıntı paneli (km-) ═══ */
.km-kartlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.km-kart { display: flex; gap: 14px; align-items: flex-start; padding: 18px; border: 1px solid var(--cizgi); border-radius: 14px; background: var(--yuzey); }
.km-kart-ikon { flex: 0 0 42px; height: 42px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--marka-vurgu) 12%, var(--yuzey)); color: var(--marka-vurgu); }
.km-kart-govde { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.km-kart-ad { font-weight: 600; color: var(--ink-900); }
.km-kart-govde strong { font-size: 1.8rem; line-height: 1.15; color: var(--marka-vurgu); }
.km-kart-alt { font-size: .82rem; color: var(--ink-500); }
.km-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); gap: 14px; align-items: start; }
.km-rozet { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; font-size: .78rem; font-weight: 600; white-space: nowrap; }
.km-rozet--hata { background: var(--err-50); color: var(--err); }
.km-rozet--uyari { background: var(--uyari-50); color: var(--uyari); }
.km-rozet--bilgi { background: var(--mavi-50); color: var(--mavi); }
.km-sec { color: inherit; text-decoration: none; }
.km-sec:hover strong { text-decoration: underline; }
.km-satir.is-secili td { background: var(--brand-50); }
.km-satir.is-secili td:first-child { box-shadow: inset 3px 0 0 var(--brand); }
.km-alt-serit { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 10px 16px; border-top: 1px solid var(--cizgi); font-size: .82rem; color: var(--ink-500); }
.km-ayrinti { padding: 18px; position: sticky; top: 12px; }
.km-ayrinti-bas { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: .82rem; }
.km-ayrinti-baslik { margin: 12px 0 4px; font-size: 1.15rem; line-height: 1.35; }
.km-ayrinti-kayit { margin: 0 0 12px; color: var(--ink-600); font-size: .9rem; overflow-wrap: anywhere; }
.km-ayrinti-bilgi { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 0 0 12px; font-size: .88rem; }
.km-ayrinti-bilgi dt { color: var(--ink-500); }
.km-ayrinti-bilgi dd { margin: 0; }
.km-ayrinti-ara { margin: 14px 0 8px; font-size: .95rem; }
.km-adimlar { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.km-adim { display: flex; gap: 10px; align-items: flex-start; }
.km-adim-nokta { flex: 0 0 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--zemin); color: var(--ink-500); }
.km-adim--tamam .km-adim-nokta { background: var(--ok-50); color: var(--ok); }
.km-adim--hata .km-adim-nokta { background: var(--err-50); color: var(--err); }
.km-adim-govde { display: flex; flex-direction: column; gap: 1px; min-width: 0; font-size: .88rem; }
.km-adim-govde small { color: var(--ink-500); }
.km-yapilacak { margin: 0; padding: 10px 12px; border-radius: 10px; font-size: .86rem; line-height: 1.5; background: var(--zemin); }
.km-yapilacak--hata { background: var(--err-50); color: var(--err); }
.km-yapilacak--uyari { background: var(--uyari-50); }
.km-ayrinti-eylem { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.km-ayrinti-eylem .btn { flex: 1 1 140px; justify-content: center; }
@media (max-width: 1280px) { .km-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .km-izgara { grid-template-columns: minmax(0, 1fr); } .km-ayrinti { position: static; } }
@media (max-width: 560px) { .km-kartlar { grid-template-columns: minmax(0, 1fr); } }
/* ═══ PAKET 931 — İletişim Öncelikleri ekranı (io-) ═══ */
.io-sekmeler { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 14px; border-bottom: 1px solid var(--cizgi); }
.io-sekme { padding: 10px 14px; color: var(--ink-600); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.io-sekme.is-aktif { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }
.io-kartlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.io-kart { display: flex; gap: 14px; align-items: center; padding: 16px 18px; border: 1px solid var(--cizgi); border-radius: 14px; background: var(--yuzey); color: inherit; text-decoration: none; }
.io-kart:hover { border-color: var(--brand); }
.io-kart > span:last-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.io-kart strong { font-size: 1.6rem; line-height: 1.15; }
.io-kart-ad { font-size: .88rem; color: var(--ink-600); }
.io-kart-ikon { flex: 0 0 42px; height: 42px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--uyari-50); color: var(--uyari); }
.io-kart-ikon--kotu { background: var(--err-50); color: var(--err); }
.io-kart-ikon--mavi { background: var(--mavi-50); color: var(--mavi); }
.io-kapali { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 10px 14px; border-radius: 10px; background: var(--uyari-50); color: var(--ink-900); font-size: .88rem; }
.io-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.io-sol, .io-sag { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.io-bas { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding-right: 16px; border-bottom: 1px solid var(--cizgi); }
.io-bas .panel-title { border-bottom: 0; flex: 1 1 auto; min-width: 0; }
.io-ic--ust { padding-top: 12px; }
.io-ic { margin: 0; padding: 0 18px 14px; font-size: .84rem; }
.io-form-satir { margin: 0; display: inline-flex; }
.io-sira { list-style: none; margin: 0; padding: 4px 16px 16px; display: flex; flex-direction: column; gap: 8px; }
.io-sira-oge { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--cizgi); border-radius: 12px; }
.io-no { flex: 0 0 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--zemin); font-weight: 700; font-size: .84rem; }
.io-sira-oge:first-child .io-no { background: var(--brand-50); color: var(--brand); }
.io-simge { flex: 0 0 34px; height: 34px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: var(--brand-50); color: var(--brand); }
.io-govde { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.io-alt { font-size: .8rem; color: var(--ink-500); line-height: 1.4; overflow-wrap: anywhere; }
.io-oklar { display: inline-flex; gap: 4px; }
.io-ok { min-width: 32px; justify-content: center; }
.io-ayar { display: flex; flex-direction: column; gap: 12px; padding: 0 18px 18px; }
.io-onay { display: inline-flex; align-items: center; gap: 8px; }
.io-alanlar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.io-alanlar label { display: flex; flex-direction: column; gap: 4px; font-size: .84rem; color: var(--ink-600); }
.io-bilgi { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--mavi-50); font-size: .84rem; line-height: 1.5; }
.io-ayar .btn-primary { align-self: flex-start; }
.io-plan { list-style: none; margin: 0; padding: 0; }
.io-plan-oge { display: flex; align-items: center; gap: 12px; padding: 10px 18px; border-top: 1px solid var(--cizgi); }
.io-saat { flex: 0 0 74px; font-weight: 600; font-size: .88rem; }
.io-ara { margin: 0; padding: 14px 18px 8px; font-size: .95rem; border-top: 1px solid var(--cizgi); }
@media (max-width: 1100px) { .io-izgara { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) { .io-kartlar, .io-alanlar { grid-template-columns: minmax(0, 1fr); } }
.io-ertele { background: var(--uyari-50); color: var(--uyari); }
/* ═══ PAKET 932 — yazı önce ruhsat sonra tek teklif (stil değişikliği yok, kurulum işareti) ═══ */
/* ═══ PAKET 933 — maskeli değerler ve yapıştırma (stil değişikliği yok, kurulum işareti) ═══ */
/* ═══ PAKET 934 — alıcı adayı ve teklifteki kişiler ═══ */
.tk-aday { border: 1px dashed var(--cizgi); border-radius: 10px; padding: 12px 14px; }
.tk-aday-bas { margin: 0 0 8px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tk-aday-bilgi { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 10px; }
.tk-aday-eylem { display: flex; gap: 8px; flex-wrap: wrap; }
.tk-aday-eylem form { margin: 0; }
.tk-aday-not { margin: 8px 0 0; font-size: 13px; }
.tk-kisiler .table td, .tk-kisiler .table th { white-space: nowrap; }
.tk-kisiler-not { margin: 8px 16px 14px; font-size: 13px; }
/* ═══ PAKET 935 — "bu cevap hangi teklife?" kutusu ═══ */
.tk-hangi-metin { margin: 0 0 10px; padding: 8px 12px; border-left: 3px solid var(--cizgi); }
.tk-hangi-not { margin: 0 0 10px; font-size: 13px; }
.tk-hangi-not a { margin-left: 6px; }
.tk-hangi-eylem { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.tk-hangi-eylem form { margin: 0; }
/* ═══ PAKET 936 — Hat Raporu ═══ */
.hr-suzgec { display: grid; grid-template-columns: repeat(2, minmax(0, 280px)); gap: 10px; margin-bottom: 10px; }
.hr-suzgec select { width: 100%; }
.hr-aktarim, .hr-kesik { margin: 0 0 12px; font-size: 13px; }
.hr-kartlar { margin-bottom: 14px; }
.hr-alt { display: block; margin-top: 4px; font-size: 12px; }
.hr-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; align-items: start; }
.hr-tablo td { padding-top: 8px; padding-bottom: 8px; }
.hr-tanim { font-size: 12px; margin: 14px 0 0; }
@media (max-width: 900px) { .hr-izgara, .hr-suzgec { grid-template-columns: 1fr; } }
/* ═══ PAKET 937 — WhatsApp grubu → şube (stil yok · önkoşul işareti) ═══ */
.hr-aday-not { margin: 0; font-size: 13px; }
.hr-aday-tel { font-size: 12px; }
.hr-aday-form { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; align-items: center; margin: 0; }
.hr-aday-form select { max-width: 220px; }
/* ═══ PAKET 938 — Hat Analizi (kullanıcının çizdiği rapor sayfası) ═══ */
:root { --hr-gelen: var(--brand); --hr-giden: var(--mavi); }
:root[data-tema="koyu"] { --hr-giden: #5B8DEB; }   /* doğrulayıcı: koyu zeminde --mavi (#77A6F6) açıklık bandı dışında */
.hr-hat { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; margin-bottom: 12px; }
.hr-hat-simge { width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--ok-50); color: var(--ok); flex: none; }
.hr-hat-simge svg { width: 18px; height: 18px; }
.hr-hat-sec { width: auto; min-width: 0; max-width: 100%; font-weight: 600; border-color: transparent; background: transparent; }
.hr-aralik { width: auto; margin-left: auto; max-width: 100%; }
.hr-bilgi { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; padding: 10px 14px; margin-bottom: 12px; border: 1px solid var(--mavi-100); background: var(--mavi-50); color: var(--mavi); border-radius: var(--kose, 10px); font-size: 14px; }
.hr-bilgi .muted { font-size: 13px; }
.hr-durum { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 14px 16px; margin-bottom: 12px; }
.hr-durum-bas { display: flex; align-items: center; gap: 10px; font-weight: 700; }
.hr-tik { width: 26px; height: 26px; border-radius: 50%; background: var(--cizgi); flex: none; position: relative; }
.hr-durum-bas.is-tamam .hr-tik { background: var(--ok); }
.hr-durum-bas.is-tamam .hr-tik::after { content: ""; position: absolute; left: 9px; top: 5px; width: 6px; height: 11px; border: solid var(--yuzey); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.hr-adimlar { list-style: none; margin: 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; }
.hr-adimlar li { position: relative; text-align: center; font-size: 13px; color: var(--ink-500); padding-top: 22px; }
.hr-adimlar li::before { content: ""; position: absolute; top: 7px; left: 0; right: 0; height: 2px; background: var(--cizgi); }
.hr-adimlar li.is-tamam::before { background: var(--brand); }
.hr-adimlar li:first-child::before { left: 50%; } .hr-adimlar li:last-child::before { right: 50%; }
.hr-nokta { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 16px; height: 16px; border-radius: 50%; background: var(--yuzey); border: 2px solid var(--cizgi-koyu); }
.hr-adimlar li.is-tamam .hr-nokta { background: var(--brand); border-color: var(--brand); }
.hr-adimlar li.is-tamam { color: var(--ink-900); }
.hr-kontrol-rozet { padding: 8px 12px; border-radius: 8px; background: var(--uyari-50); color: var(--uyari); font-weight: 600; text-decoration: none; white-space: nowrap; }
.hr-ekran .hr-kartlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.hr-kart { display: flex; gap: 14px; align-items: flex-start; padding: 16px; margin: 0; }
.hr-kart > div { display: flex; flex-direction: column; min-width: 0; }
.hr-kart-simge { width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.hr-kart-simge svg { width: 20px; height: 20px; }
.hr-kart-simge--gelen, .hr-kart-simge--talep { background: var(--brand-50); color: var(--brand); }
.hr-kart-simge--giden { background: var(--mavi-50); color: var(--mavi); }
.hr-kart-simge--police { background: var(--ok-50); color: var(--ok); }
.hr-kart-ad { font-size: 14px; color: var(--ink-500); }
.hr-kart-sayi { font-size: 30px; font-weight: 700; line-height: 1.2; color: var(--ink-900); font-variant-numeric: tabular-nums; }
.hr-kart-alt { font-size: 12px; }
.hr-izgara--genis { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); }
.hr-grafik-bas { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.hr-lejant { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-500); padding-right: 16px; }
.hr-lejant-nokta { width: 10px; height: 10px; border-radius: 50%; display: inline-block; margin-left: 8px; }
.hr-lejant-nokta--gelen { background: var(--hr-gelen); } .hr-lejant-nokta--giden { background: var(--hr-giden); }
.hr-cizim { padding: 4px 12px 0; }
.hr-cizim svg { width: 100%; height: 220px; display: block; overflow: visible; }
.hr-izgara-cizgi { stroke: var(--cizgi); stroke-width: 1; }
.hr-eksen { fill: var(--ink-500); font-size: 11px; }
.hr-cizgi { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.hr-cizgi--gelen { stroke: var(--hr-gelen); } .hr-cizgi--giden { stroke: var(--hr-giden); }
.hr-nok { stroke: var(--yuzey); stroke-width: 2; vector-effect: non-scaling-stroke; }
.hr-nok--gelen { fill: var(--hr-gelen); } .hr-nok--giden { fill: var(--hr-giden); }
.hr-isabet { fill: transparent; }
.hr-arti { stroke: var(--ink-300); stroke-width: 1; stroke-dasharray: 3 3; opacity: 0; vector-effect: non-scaling-stroke; }
.hr-gun:hover .hr-arti { opacity: 1; }
.hr-gun:hover .hr-nok { r: 6; }
.hr-tablo-gor { padding: 4px 16px 12px; font-size: 13px; }
.hr-tablo-gor summary { cursor: pointer; color: var(--ink-500); }
.hr-ozet { padding-bottom: 12px; }
.hr-cubuk { display: grid; grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1.4fr); gap: 12px; align-items: center; padding: 8px 16px; }
.hr-cubuk-sayi { text-align: right; font-weight: 700; }
.hr-cubuk-iz { height: 12px; border-radius: 6px; background: var(--ink-100); overflow: hidden; }
.hr-cubuk-dolu { display: block; height: 100%; border-radius: 6px; }
.hr-cubuk--talep .hr-cubuk-dolu { background: var(--hr-gelen); }
.hr-cubuk--fiyat .hr-cubuk-dolu { background: var(--hr-giden); }
.hr-cubuk--police .hr-cubuk-dolu { background: var(--ok); }
.hr-aday-kutu { display: flex; flex-direction: column; gap: 2px; margin: 10px 16px 0; padding: 12px 14px; border-radius: 10px; background: var(--uyari-50); border: 1px solid var(--uyari-200); font-size: 13px; }
.hr-aday-baslik { color: var(--uyari); font-weight: 700; font-size: 15px; }
.hr-not { margin: 10px 16px 0; font-size: 12px; }
.hr-kontrol { display: flex; flex-direction: column; padding-bottom: 12px; }
.hr-kontrol-satir { display: flex; justify-content: space-between; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--cizgi); color: var(--ink-900); text-decoration: none; }
.hr-kontrol-satir::after { content: "›"; color: var(--ink-500); }
.hr-kontrol-satir span:last-child { margin-left: auto; font-weight: 700; }
.hr-kontrol-dugme { margin: 12px 16px 0; justify-content: center; }
.hr-ara th { background: var(--yuzey-2); font-size: 13px; }
@media (max-width: 1100px) { .hr-ekran .hr-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hr-izgara--genis { grid-template-columns: 1fr; } .hr-durum { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .hr-ekran .hr-kartlar { grid-template-columns: 1fr; } .hr-adimlar { grid-auto-flow: row; } .hr-adimlar li { text-align: left; padding: 0 0 8px 26px; } .hr-adimlar li::before { display: none; } .hr-nokta { left: 8px; } .hr-aralik { margin-left: 0; } }
@media print { .hr-yazdir, .hr-hat select, .hr-aday-form, .hr-kontrol-dugme { display: none !important; } }
.hr-grafik-bas { border-bottom: 1px solid var(--cizgi); }
.hr-grafik-bas .panel-title { border-bottom: 0; }
/* ═══ PAKET 941 — iki hatlı hesapta gönderim kapısı sohbet ekranının kümesiyle aynı (stil yok) ═══ */
/* ═══ PAKET 939 — Yönetim → Paketler: özellik tablosunun grup satırı ═══ */
.pk-ozellik .pk-ozellik-grup th { background: var(--yuzey-2); text-align: start; font-weight: 600; }
.pk-ozellik td.center { text-align: center; }
.pk-ozellik > .muted { margin: 0; padding: 10px 16px 14px; }
/* ═══ PAKET 940 — Hat Analizi · Toplu Bilgileri Güncelle sekmesi ═══ */
.hr-sekmeler { display: flex; gap: 4px; flex-wrap: wrap; margin: 0 0 14px; border-bottom: 1px solid var(--cizgi); }
.hr-sekme { padding: 10px 14px; color: var(--ink-600); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.hr-sekme.is-aktif { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }
.hr-personel-form { display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; align-items: center; }
.hr-personel-form .input { width: 150px; }
.hr-personel-elle { display: flex; flex-direction: column; gap: 10px; border-top: 1px solid var(--cizgi); }
.hr-personel-elle .btn { align-self: flex-start; }
.hr-alt-baslik { margin: 0; font-size: 1rem; }
.hr-personel-alanlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.hr-personel-alanlar label { display: flex; flex-direction: column; gap: 4px; font-size: .84rem; color: var(--ink-600); }
@media (max-width: 900px) { .hr-personel-alanlar { grid-template-columns: minmax(0, 1fr); } .hr-personel-form .input { width: 100%; } }
/* ═══ PAKET 942 — Paketim ve Abonelik (pkm-) · Yönetim → Paketler talep formu ═══ */
.pkm-kartlar { display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 14px; margin-bottom: 14px; }
.pkm-kart { display: flex; gap: 14px; align-items: center; padding: 18px 20px; border: 1px solid var(--cizgi); border-radius: 14px; background: var(--yuzey); }
.pkm-simge { flex: 0 0 52px; height: 52px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--brand-50); color: var(--brand); }
.pkm-simge--kucuk { flex-basis: 44px; height: 44px; }
.pkm-etiket { font-size: .86rem; color: var(--ink-600); }
.pkm-deger { font-size: 1.35rem; font-weight: 700; line-height: 1.25; }
.pkm-deger small { font-size: .9rem; font-weight: 500; color: var(--ink-600); }
.pkm-video { flex: 1 1 auto; min-width: 0; }
.pkm-video-bas { display: flex; justify-content: space-between; gap: 8px; font-size: .86rem; }
.pkm-cubuk { height: 8px; border-radius: 99px; background: var(--yuzey-2); margin-top: 8px; overflow: hidden; }
.pkm-cubuk span { display: block; height: 100%; background: var(--brand); border-radius: 99px; }
.pkm-not { font-size: .8rem; margin: 6px 0 0; }
.pkm-talep { margin: 0 0 14px; padding: 12px 16px; border-radius: 12px; background: var(--mavi-50); font-size: .9rem; display: flex; flex-wrap: wrap; gap: 6px 10px; }
.pkm-talep--reddedildi { background: var(--err-50); }
.pkm-izgara { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 14px; align-items: start; }
.pkm-bas { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding-right: 16px; }
.pkm-bas .panel-title { border-bottom: 0; }
.pkm-alt { margin: -8px 0 0; padding: 0 18px; font-size: .86rem; }
.pkm-donem { display: inline-flex; padding: 3px; border: 1px solid var(--cizgi); border-radius: 10px; margin-top: 14px; }
.pkm-donem input, .pkm-paket > input { position: absolute; opacity: 0; pointer-events: none; }
.pkm-donem span { display: inline-block; padding: 7px 22px; border-radius: 8px; cursor: pointer; font-size: .88rem; }
.pkm-donem input:checked + span { background: var(--brand); color: var(--yuzey); font-weight: 600; }
.pkm-donem input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px; }
.pkm-paketler { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; padding: 16px 18px 18px; }
.pkm-paket { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 18px; border: 1px solid var(--cizgi); border-radius: 14px; cursor: pointer; }
.pkm-paket:has(> input:checked) { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand); background: var(--brand-50); }
.pkm-paket:has(> input:focus-visible) { outline: 2px solid var(--brand); outline-offset: 2px; }
.pkm-paket-bas { display: flex; gap: 12px; align-items: flex-start; }
.pkm-paket-ad { font-size: 1.05rem; }
.pkm-rozet { display: inline-block; padding: 2px 10px; border-radius: 99px; background: var(--brand); color: var(--yuzey); font-size: .74rem; font-weight: 600; vertical-align: middle; }
.pkm-fiyat { display: block; margin-top: 6px; }
.pkm-fiyat b { font-size: 1.4rem; }
.pkm-fiyat small { display: block; color: var(--ink-600); font-size: .82rem; }
.pkm-ekran [data-donem="yillik"] .pkm-fiyat-a, .pkm-ekran [data-donem="aylik"] .pkm-fiyat-y { display: none; }
.pkm-ekran form:not([data-donem]) .pkm-fiyat-a { display: none; }
.pkm-paket-govde { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; border-top: 1px solid var(--cizgi); padding-top: 12px; }
.pkm-maddeler { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; font-size: .88rem; }
.pkm-maddeler li::before { content: "✓"; color: var(--brand); font-weight: 700; margin-right: 8px; }
.pkm-maddeler li.is-yok::before { content: "✕"; color: var(--ink-500); }
.pkm-paket-video { max-width: 150px; font-size: .84rem; font-weight: 600; }
.pkm-paket-video small { display: block; font-weight: 400; color: var(--ink-600); margin-top: 6px; }
.pkm-ozet .panel-title { margin: 0; }
.pkm-sayi { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 12px; font-size: .9rem; }
.pkm-adim { display: inline-flex; gap: 4px; align-items: center; }
.pkm-adim .input { width: 64px; text-align: center; }
.pkm-siparis { border-top: 1px solid var(--cizgi); }
.pkm-siparis h3 { margin: 0 0 8px; font-size: 1rem; }
.pkm-siparis dl { margin: 0; display: flex; flex-direction: column; gap: 6px; font-size: .88rem; }
.pkm-siparis dl > div { display: flex; justify-content: space-between; gap: 10px; }
.pkm-siparis dd { margin: 0; font-weight: 600; white-space: nowrap; }
.pkm-toplam { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; margin: 12px 0; padding-top: 12px; border-top: 1px solid var(--cizgi); }
.pkm-toplam small { display: block; color: var(--ink-600); font-size: .8rem; }
.pkm-toplam strong { font-size: 1.25rem; }
.pkm-gonder { width: 100%; justify-content: center; }
.pkm-odeme { display: flex; align-items: center; gap: 14px; padding: 16px 18px; margin-top: 14px; }
.pkm-odeme > div { flex: 1 1 auto; }
.pk-talep-form { display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.pk-talep-sebep { width: 200px; }
@media (max-width: 1100px) { .pkm-kartlar { grid-template-columns: 1fr 1fr; } .pkm-kart--video { grid-column: 1 / -1; } .pkm-izgara { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .pkm-kartlar { grid-template-columns: minmax(0, 1fr); } .pkm-bas { flex-direction: column; padding: 0 16px; } .pkm-paket-govde { grid-template-columns: minmax(0, 1fr); } .pkm-paket-video { max-width: none; } }
/* ═══ PAKET 943 — panel: tutarın yanında "+ KDV" ═══ */
.pkm-kdv { font-size: .8rem; font-weight: 600; color: var(--ink-600); white-space: nowrap; }
/* ═══ PAKET 944 — Yönetim → Deneme → Üyelik başvuruları ═══ */
.ub-karar { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.ub-sebep { width: 180px; min-width: 0; }
.ub-tel { white-space: nowrap; }
.ub-not { margin-bottom: 12px; }
/* ═══ PAKET 945 — Poliçe Teslim ve Kontrol ═══ */
.pko-sekmeler { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.pko-kartlar { margin-bottom: 8px; }
.pko-not { margin: 0 0 12px; font-size: .84rem; }
.pko-suzgec { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.pko-suzgec .input { width: auto; min-width: 150px; flex: 0 1 200px; }
.pko-suzgec input[type=search] { flex: 1 1 220px; }
.pko-izgara { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.pko-liste tr.is-secili td { background: var(--brand-50); }
.pko-alt { display: block; font-size: .82rem; color: var(--ink-500); line-height: 1.45; overflow-wrap: anywhere; }
.pko-ayrinti { padding-bottom: 14px; }
.pko-bas { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; padding: 16px 18px 4px; }
.pko-bas .panel-title { padding: 0; margin: 0 0 4px; }
.pko-liste td .pko-alt { white-space: nowrap; }
.pko-belge { display: flex; align-items: center; gap: 8px; margin: 6px 18px 4px; padding: 10px 12px; border: 1px solid var(--cizgi); border-radius: 10px; color: inherit; text-decoration: none; }
.pko-belge:hover { background: var(--zemin); }
.pko-ara-baslik { margin: 14px 18px 6px; font-size: .95rem; }
.pko-cizelge { list-style: none; margin: 0; padding: 0 18px; }
.pko-adim { position: relative; padding: 10px 0 10px 22px; border-top: 1px solid var(--cizgi); }
.pko-adim::before { content: ""; position: absolute; left: 2px; top: 15px; width: 10px; height: 10px; border-radius: 50%; background: var(--ink-300); }
.pko-adim--tamam::before { background: var(--ok); }
.pko-adim--hata::before { background: var(--err); }
.pko-adim--eksik::before { background: var(--uyari); }
.pko-adim--suruyor::before { background: var(--mavi); }
.pko-adim-bas { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.pko-rozet { font-size: .78rem; font-weight: 600; padding: 2px 8px; border-radius: 999px; background: var(--zemin); color: var(--ink-600); white-space: nowrap; }
.pko-rozet--tamam { background: var(--ok-50); color: var(--ok); }
.pko-rozet--hata { background: var(--err-50); color: var(--err); }
.pko-rozet--eksik { background: var(--uyari-50); color: var(--uyari); }
.pko-rozet--suruyor { background: var(--mavi-50); color: var(--mavi); }
.pko-eylem { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.pko-eylem form { margin: 0; }
.pko-eylemler { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px 18px 0; border-top: 1px solid var(--cizgi); margin-top: 8px; }
.pko-eylemler form { margin: 0; }
@media (max-width: 1100px) { .pko-izgara { grid-template-columns: 1fr; } }
/* ═══ PAKET 946 — Otomasyon Açıklama ═══ */
.oa-secili { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; padding: 10px 14px; border: 1px solid var(--cizgi); border-radius: 12px; background: var(--yuzey); font-size: .9rem; }
.oa-secili > span { color: var(--ink-500); }
.oa-ozet { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; padding: 16px 18px; border: 1px solid var(--brand); border-radius: 14px; background: var(--brand-50); }
.oa-ozet > span:last-child, .oa-ozet--yok { display: flex; flex-direction: column; gap: 4px; }
.oa-ozet strong { font-size: 1.15rem; color: var(--brand); }
.oa-ozet--yok { border-color: var(--cizgi); background: var(--yuzey); }
.oa-ozet--yok strong { color: var(--ink-900); }
.oa-ozet-ikon { flex: 0 0 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--brand); color: var(--yuzey); }
.oa-uyari { margin: -4px 0 14px; padding: 10px 14px; border-radius: 10px; background: var(--uyari-50); color: var(--ink-900); font-size: .88rem; }
.oa-izgara { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.oa-sol, .oa-sag { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.oa-adimlar { list-style: none; margin: 0; padding: 4px 18px 16px; }
.oa-adim { display: grid; grid-template-columns: 28px 70px minmax(0, 1fr); gap: 10px; align-items: start; padding: 10px 0; border-top: 1px solid var(--cizgi); }
.oa-adim:first-child { border-top: 0; }
.oa-no { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--brand); color: var(--yuzey); font-weight: 700; font-size: .84rem; }
.oa-saat { font-variant-numeric: tabular-nums; color: var(--ink-500); font-size: .86rem; padding-top: 3px; }
.oa-govde { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.oa-alt { font-size: .84rem; color: var(--ink-500); line-height: 1.45; overflow-wrap: anywhere; }
.oa-kisi { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.oa-kisi .oa-avatar { flex: 0 0 28px; width: 28px; height: 28px; min-width: 28px; font-size: .72rem; }
.oa-nokta { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; background: var(--ok); }
.oa-nokta--kapali { background: var(--err); }
.oa-kural { margin: 0; padding: 0 18px 6px; }
.oa-kural > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 10px; padding: 9px 0; border-top: 1px solid var(--cizgi); }
.oa-kural > div:first-child { border-top: 0; }
.oa-kural dt { color: var(--ink-500); font-size: .88rem; }
.oa-kural dd { margin: 0; font-weight: 600; }
.oa-eylem { display: flex; flex-direction: column; gap: 8px; padding: 10px 18px 18px; }
.oa-eylem .btn { justify-content: center; }
.oa-ic { margin: 0; padding: 0 18px 12px; }
.oa-bilgi { margin: 0; padding: 12px 14px; border-radius: 12px; background: var(--mavi-50); font-size: .86rem; line-height: 1.5; }
.oa-bilgi strong { display: block; margin-bottom: 2px; }
@media (max-width: 1100px) { .oa-izgara { grid-template-columns: 1fr; } }
/* ═══ PAKET 947 — Bekleyen İşler (bki-) · Eksik Bilgi akıllı istek (eba-) ═══ */
.bki-kartlar { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.bki-kart { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border: 1px solid var(--cizgi); border-radius: 14px; background: var(--yuzey); color: inherit; text-decoration: none; }
.bki-kart span { color: var(--ink-500); font-size: .86rem; }
.bki-kart strong { font-size: 1.6rem; line-height: 1.1; }
.bki-kart small { color: var(--ink-500); font-size: .78rem; }
.bki-kart:hover { border-color: var(--brand); }
.bki-kart.is-secili { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
.bki-izgara { display: grid; grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr); gap: 14px; align-items: start; }
.bki-suzgec { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 14px 16px; }
.bki-suzgec .input { width: auto; min-width: 150px; }
.bki-sayi { margin-left: auto; }
.bki-liste .tablo-kaydir { margin: 0 16px 16px; }
.bki-liste .table td { vertical-align: top; }
.bki-alt { display: block; color: var(--ink-500); font-size: .8rem; margin-top: 2px; }
.bki-sure { white-space: nowrap; font-weight: 600; }
.bki-is { white-space: nowrap; }
.bki-bas { border-bottom: 1px solid var(--cizgi); margin-bottom: 12px; }
.bki-bas .panel-title { border-bottom: 0; }
.bki-gecikti { color: var(--err); font-weight: 600; }
.bki-liste tr.is-secili td { background: var(--mavi-50); }
.bki-ayrinti { padding-bottom: 16px; }
.bki-bas { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding-right: 16px; }
.bki-form { display: flex; flex-direction: column; gap: 10px; padding: 0 18px; }
.bki-form label { display: flex; flex-direction: column; gap: 4px; font-size: .86rem; color: var(--ink-500); }
.bki-ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bki-durum-satir > span { display: flex; flex-direction: column; gap: 4px; font-size: .86rem; }
.bki-durum-satir .pill { align-self: flex-start; }
.bki-eylem { display: flex; flex-wrap: wrap; gap: 8px; }
.bki-ara { margin: 18px 18px 8px; font-size: .95rem; }
.bki-ic { margin: 0 18px; }
.bki-taslak { font-size: .9rem; line-height: 1.5; }
.bki-uyari { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: var(--mavi-50); font-size: .86rem; }
.bki-form .bki-uyari { margin: 0; }
.bki-gecmis { list-style: none; margin: 0; padding: 0 18px; display: flex; flex-direction: column; gap: 8px; font-size: .86rem; }
.bki-gecmis li { padding-top: 8px; border-top: 1px solid var(--cizgi); }
.eba-sec { border: 1px solid var(--cizgi); border-radius: 10px; padding: 8px 12px; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.eba-sec legend { font-size: .82rem; padding: 0 4px; }
.eba-sec-satir { display: flex; gap: 8px; align-items: center; font-size: .88rem; }
.eba-hatirlat { padding: 8px 18px 0; }
.eba-ek { padding: 6px 18px 0; }
.eba-ek-bas { margin: 12px 0 6px; font-size: .9rem; }
.eba-ek .eba-ic { padding: 0; margin: 0; }
.eba-istekler { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; font-size: .86rem; }
.eba-istekler li { display: flex; flex-direction: column; gap: 2px; padding-top: 8px; border-top: 1px solid var(--cizgi); }
.eba-istek-metin { overflow-wrap: anywhere; }
@media (max-width: 1280px) { .bki-kartlar { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .bki-izgara { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .bki-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bki-ikili { grid-template-columns: 1fr; } }
/* ═══ PAKET 948 — Ekip Kapasite Planı (ekk-) ═══ */
.ekk-suzgec { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: flex-end; margin-bottom: 14px; }
.ekk-suzgec .input { width: auto; min-width: 180px; }
.ekk-gun { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border: 1px solid var(--cizgi); border-radius: 10px; background: var(--yuzey); font-weight: 600; font-size: .9rem; }
.ekk-kartlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.ekk-kart { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border: 1px solid var(--cizgi); border-radius: 14px; background: var(--yuzey); color: inherit; text-decoration: none; }
.ekk-kart small { display: block; color: var(--ink-500); font-size: .86rem; }
.ekk-kart strong { font-size: 1.6rem; line-height: 1.15; }
a.ekk-kart:hover { border-color: var(--brand); }
.ekk-ikon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 999px; }
.ekk-ikon--iyi { background: var(--ok-50); color: var(--ok); }
.ekk-ikon--bilgi { background: var(--mavi-50); color: var(--mavi); }
.ekk-ikon--kotu { background: var(--err-50); color: var(--err); }
.ekk-ikon--mor { background: var(--uyari-50); color: var(--uyari); }
.ekk-izgara { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(300px, 1fr); gap: 14px; align-items: start; margin-bottom: 14px; }
.ekk-sag { display: flex; flex-direction: column; gap: 14px; }
.ekk-bas { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding-right: 18px; border-bottom: 1px solid var(--cizgi); margin-bottom: 12px; }
.ekk-bas .panel-title { border-bottom: 0; }
.ekk-oneri .panel-title, .ekk-izin .panel-title { display: flex; align-items: center; gap: 8px; }
.ekk-tablo td:nth-child(5) { white-space: nowrap; }
.ekk-not { font-size: .82rem; }
.ekk-yuk .tablo-kaydir { margin: 0 16px 16px; }
.ekk-tablo td { vertical-align: middle; }
.ekk-kisi { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
.ekk-kisi small, .ekk-izinler small, .ekk-oneri-kisi small { display: block; font-size: .78rem; }
.ekk-avatar { width: 32px; height: 32px; font-size: .72rem; display: inline-flex; align-items: center; justify-content: center; }
.ekk-gec { display: block; color: var(--err); font-size: .76rem; white-space: nowrap; }
.ekk-cubuk { display: inline-block; width: 140px; max-width: 100%; height: 8px; border-radius: 999px; background: var(--ink-100); overflow: hidden; vertical-align: middle; margin-right: 6px; }
.ekk-cubuk > span { display: block; height: 100%; border-radius: 999px; background: var(--ink-300); }
.ekk-cubuk--yogun > span { background: var(--brand); }
.ekk-cubuk--dengeli > span { background: var(--uyari); }
.ekk-cubuk--uygun > span { background: var(--ok); }
.ekk-durum { white-space: nowrap; }
.ekk-durum--yogun { background: var(--err-50); color: var(--err); }
.ekk-durum--dengeli { background: var(--uyari-50); color: var(--uyari); }
.ekk-durum--uygun { background: var(--ok-50); color: var(--ok); }
.ekk-durum--izinli { background: var(--mavi-50); color: var(--mavi); }
.ekk-durum--molada, .ekk-durum--bitti { background: var(--ink-100); color: var(--ink-700); }
.ekk-ic { margin: 0; padding: 0 18px 14px; }
.ekk-oneri-kisi { display: flex; align-items: center; gap: 10px; margin: 0 18px 18px; padding: 12px; border-radius: 12px; background: var(--yuzey-2); }
.ekk-oneri-kisi > span:nth-child(2) { flex: 1; min-width: 0; }
.ekk-izinler { list-style: none; margin: 0; padding: 0 18px 14px; display: flex; flex-direction: column; }
.ekk-izinler li { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--cizgi); }
.ekk-izinler li:first-child { border-top: 0; }
.ekk-izinler li > span:nth-child(2) { flex: 1; min-width: 0; }
.ekk-aktar { margin-bottom: 14px; }
.ekk-aktar-form { padding: 0 18px 18px; }
.ekk-aktar-liste { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ekk-aktar-liste label { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .9rem; }
.ekk-eylem { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ekk-eylem label { display: inline-flex; align-items: center; gap: 8px; }
.ekk-plan { margin-bottom: 14px; padding-bottom: 14px; }
.ekk-lejant { margin-left: auto; display: inline-flex; flex-wrap: wrap; gap: 12px; font-size: .8rem; color: var(--ink-500); }
.ekk-lejant > span { display: inline-flex; align-items: center; gap: 5px; }
.ekk-l { display: inline-block; width: 10px; height: 10px; border-radius: 999px; }
.ekk-l--yogun, .ekk-p--yogun { background: var(--brand); }
.ekk-l--uygun, .ekk-p--uygun { background: var(--ok); }
.ekk-p--dengeli { background: var(--uyari); }
.ekk-l--mola, .ekk-p--mola { background: var(--ink-100); color: var(--ink-700); }
.ekk-l.ekk-l--mola { background: var(--ink-300); }
.ekk-l--dengeli { background: var(--uyari); }
.ekk-l.ekk-l--izinli { background: var(--mavi); }
.ekk-l--izinli, .ekk-p--izinli { background: var(--mavi-50); color: var(--mavi); }
.ekk-cizelge { padding: 0 18px; overflow-x: auto; }
.ekk-satir { display: grid; grid-template-columns: 140px minmax(560px, 1fr); align-items: center; min-height: 30px; border-top: 1px solid var(--cizgi); }
.ekk-saatler { border-top: 0; min-height: 26px; }
.ekk-ad { font-size: .86rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 8px; }
.ekk-zaman { position: relative; height: 22px; }
.ekk-saatler .ekk-zaman i { position: absolute; top: 2px; transform: translateX(-50%); font-style: normal; font-size: .74rem; color: var(--ink-500); }
.ekk-p { position: absolute; top: 4px; height: 14px; border-radius: 4px; font-weight: 600; font-size: .7rem; line-height: 14px; text-align: center; overflow: hidden; white-space: nowrap; }
.ekk-p--izinli { top: 2px; height: 18px; line-height: 18px; }
.ekk-yok { position: absolute; top: 3px; left: 0; font-size: .76rem; }
.ekk-simdi { position: absolute; top: -3px; bottom: -3px; width: 2px; background: var(--err); border-radius: 2px; }
.ekk-ayar summary { cursor: pointer; padding: 14px 18px; }
.ekk-ayar-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; padding: 0 18px 18px; }
.ekk-ayar-form label { display: flex; flex-direction: column; gap: 4px; font-size: .86rem; color: var(--ink-500); }
.ekk-ayar-form .input { width: 140px; }
.ekk-ayar-form p { flex-basis: 100%; margin: 0; font-size: .82rem; }
@media (max-width: 1100px) { .ekk-izgara { grid-template-columns: 1fr; } .ekk-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .ekk-suzgec { justify-content: flex-start; } .ekk-satir { grid-template-columns: 96px minmax(520px, 1fr); } }
/* ═══ PAKET 949 — Mesai Sonu Devir (msd-) ═══ */
.msd-uyari { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: var(--mavi-50); font-size: .86rem; }
.msd-kimlik { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; padding: 16px 20px; margin-bottom: 14px; }
.msd-avatar { width: 52px; height: 52px; font-size: 1rem; display: inline-flex; align-items: center; justify-content: center; }
.msd-ben { flex: 1; min-width: 200px; display: flex; flex-direction: column; gap: 4px; }
.msd-ben strong { font-size: 1.1rem; }
.msd-kpi { display: inline-flex; align-items: center; gap: 10px; padding-left: 20px; border-left: 1px solid var(--cizgi); color: var(--ink-500); }
.msd-kpi small { display: block; font-size: .82rem; }
.msd-kpi strong { font-size: 1.4rem; color: var(--ink-900, inherit); }
.msd-kpi--acil strong, .msd-kpi--acil svg { color: var(--err); }
.msd-gelen { margin-bottom: 14px; }
.msd-gelen-kutu { margin: 0 18px 14px; padding: 14px; border: 1px solid var(--cizgi); border-radius: 12px; background: var(--yuzey-2); }
.msd-gelen-kutu p { margin: 0 0 6px; }
.msd-not { white-space: pre-line; }
.msd-kalemler { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: .9rem; }
.msd-kalemler li { display: flex; align-items: center; gap: 6px; }
.msd-red { display: inline-flex; gap: 8px; align-items: center; }
.msd-red .input { width: 240px; max-width: 100%; }
.msd-adimlar { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0 0 14px; padding: 0; }
.msd-adimlar li { display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; align-items: center; }
.msd-adimlar li > span { grid-row: span 2; width: 32px; height: 32px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; background: var(--ink-100); color: var(--ink-700); }
.msd-adimlar li small { color: var(--ink-500); font-size: .8rem; }
.msd-adimlar li.is-aktif > span, .msd-adimlar li.is-tamam > span { background: var(--brand); color: var(--ters-ink); }
.msd-izgara { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(320px, 1fr); gap: 14px; align-items: start; }
.msd-sag { display: flex; flex-direction: column; gap: 14px; }
.msd-bas { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-right: 18px; border-bottom: 1px solid var(--cizgi); margin-bottom: 10px; }
.msd-bas .panel-title { border-bottom: 0; }
.msd-hepsi { display: inline-flex; align-items: center; gap: 6px; font-size: .88rem; }
.msd-is { display: grid; grid-template-columns: 20px 36px minmax(0, 1fr); gap: 10px; align-items: start; margin: 0 16px 10px; padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 12px; cursor: pointer; }
.msd-is:hover { border-color: var(--brand); }
.msd-is.is-kilit { cursor: default; opacity: .75; }
.msd-is input { margin-top: 10px; }
.msd-avatar-k { width: 34px; height: 34px; font-size: .74rem; display: inline-flex; align-items: center; justify-content: center; }
.msd-is-govde { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.msd-is-bas { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.msd-is-adim { font-weight: 600; }
.msd-is-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .84rem; color: var(--ink-500); }
.msd-is-meta > span { display: inline-flex; align-items: center; gap: 4px; }
.msd-gec { color: var(--err); font-weight: 600; }
.msd-son { display: flex; flex-direction: column; gap: 2px; margin-top: 4px; padding: 8px 10px; border-radius: 10px; background: var(--yuzey-2); font-size: .86rem; overflow-wrap: anywhere; }
.msd-alanlar { display: flex; flex-direction: column; gap: 12px; padding: 0 18px 18px; }
.msd-alanlar > label { display: flex; flex-direction: column; gap: 4px; font-size: .88rem; font-weight: 600; }
.msd-sayac { align-self: flex-end; font-weight: 400; }
.msd-kutu { flex-direction: row !important; align-items: flex-start; gap: 8px !important; }
.msd-kutu small { display: block; font-weight: 400; }
.msd-eylem { display: flex; flex-wrap: wrap; gap: 8px; }
.msd-ic { margin: 0; padding: 0 18px 12px; }
.msd-akis { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 0 18px 12px; }
.msd-akis > span:not(.pill):not(.msd-ok) { display: flex; flex-direction: column; }
.msd-ok { color: var(--ink-500); font-size: 1.2rem; }
.msd-bilgi { margin: 0 18px 18px; padding: 12px 14px; border-radius: 12px; background: var(--mavi-50); font-size: .86rem; line-height: 1.5; }
.msd-bilgi strong { display: block; }
.msd-geri { margin: 10px 0 0; display: flex; justify-content: flex-end; }
.msd-gecmis { margin-top: 14px; }
.msd-gecmis ul { list-style: none; margin: 0; padding: 0 18px 14px; display: flex; flex-direction: column; gap: 6px; font-size: .88rem; }
@media (max-width: 1100px) { .msd-izgara { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .msd-adimlar { grid-template-columns: 1fr; } .msd-kpi { padding-left: 0; border-left: 0; } }
/* ═══ PAKET 950 — İşlemden Yardım Talebi (yrd-) ═══ */
.yrd-uyari { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: var(--mavi-50); font-size: .86rem; }
.yrd-adimlar li { grid-template-columns: 34px 1fr; }
.yrd-adimlar li > span { grid-row: auto; }
.yrd-izgara { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr); gap: 14px; align-items: start; margin-bottom: 14px; }
.yrd-alanlar { display: flex; flex-direction: column; gap: 12px; padding: 0 18px 18px; }
.yrd-alanlar label { display: flex; flex-direction: column; gap: 4px; font-size: .88rem; font-weight: 600; }
.yrd-alanlar small { font-weight: 400; }
.yrd-ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.yrd-sayac { align-self: flex-end; }
.yrd-baglam { margin: 0 18px; border: 1px solid var(--cizgi); border-radius: 10px; overflow: hidden; }
.yrd-baglam > div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 10px; padding: 9px 12px; border-top: 1px solid var(--cizgi); font-size: .88rem; }
.yrd-baglam > div:first-child { border-top: 0; }
.yrd-baglam dt { color: var(--ink-500); }
.yrd-baglam dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.yrd-ara { margin: 16px 18px 8px; font-size: .92rem; }
.yrd-anahtarlar { display: flex; flex-direction: column; gap: 6px; padding: 0 18px; }
.yrd-anahtar { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: .9rem; }
.yrd-anahtar.is-bos { color: var(--ink-500); }
.yrd-onizle { margin: 12px 18px 0; font-size: .86rem; }
.yrd-onizle summary { cursor: pointer; color: var(--brand); display: inline-flex; align-items: center; gap: 6px; }
.yrd-blok { margin: 8px 0 0; padding: 10px; border-radius: 8px; background: var(--yuzey-2); white-space: pre-wrap; font-size: .8rem; max-height: 220px; overflow: auto; }
.yrd-ic { margin: 10px 18px; font-size: .84rem; }
.yrd-eylem { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 18px 18px; }
.yrd-talepler { list-style: none; margin: 0; padding: 0 18px 14px; display: flex; flex-direction: column; }
.yrd-talepler li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 10px 0; border-top: 1px solid var(--cizgi); }
.yrd-talepler li:first-child { border-top: 0; }
.yrd-talepler .pill { margin-left: auto; }
.yrd-bas { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding-right: 18px; border-bottom: 1px solid var(--cizgi); margin-bottom: 12px; }
.yrd-bas .panel-title { border-bottom: 0; }
.yrd-bas .btn { margin-left: auto; }
.yrd-akis { list-style: none; margin: 0; padding: 0 18px; display: flex; flex-direction: column; gap: 10px; }
.yrd-m { display: flex; flex-direction: column; gap: 4px; max-width: 80%; padding: 10px 12px; border-radius: 12px; background: var(--yuzey-2); white-space: pre-wrap; overflow-wrap: anywhere; font-size: .9rem; }
.yrd-m--in { align-self: flex-end; background: var(--mavi-50); }
.yrd-m--sys { max-width: 100%; font-size: .8rem; border: 1px dashed var(--cizgi); background: var(--yuzey); }
.yrd-cevap { display: flex; flex-direction: column; gap: 8px; padding: 14px 18px 18px; }
.yrd-cevap .btn { align-self: flex-end; }
@media (max-width: 1100px) { .yrd-izgara { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .yrd-ikili { grid-template-columns: 1fr; } .yrd-baglam > div { grid-template-columns: 1fr; gap: 2px; } .yrd-m { max-width: 100%; } }
/* ═══ PAKET 951 — Toplu İşlem Önizlemesi (tio-) ═══ */
.tio-adimlar li { grid-template-columns: 34px 1fr; }
.tio-adimlar li > span { grid-row: auto; }
.tio-uyari { flex-basis: 100%; margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--mavi-50); font-size: .86rem; }
.tio-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px; padding: 0 18px 18px; }
.tio-form > label { display: flex; flex-direction: column; gap: 4px; font-size: .88rem; font-weight: 600; }
.tio-form .input { min-width: 220px; }
.tio-turler { display: flex; gap: 14px; border: 1px solid var(--cizgi); border-radius: 10px; padding: 8px 12px; margin: 0; font-size: .9rem; }
.tio-turler legend { font-size: .8rem; color: var(--ink-500); padding: 0 4px; }
.tio-islem { display: flex; align-items: center; gap: 14px; padding: 16px 20px; margin-bottom: 14px; }
.tio-islem small { display: block; margin-top: 4px; }
.tio-ikon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 12px; background: var(--uyari-50); color: var(--brand); }
.tio-ikon--bilgi { background: var(--mavi-50); color: var(--mavi); border-radius: 999px; }
.tio-ikon--iyi { background: var(--ok-50); color: var(--ok); border-radius: 999px; }
.tio-ikon--kotu { background: var(--err-50); color: var(--err); border-radius: 999px; }
.tio-kartlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.tio-kart { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border: 1px solid var(--cizgi); border-radius: 14px; background: var(--yuzey); }
.tio-kart small { display: block; color: var(--ink-500); font-size: .86rem; }
.tio-kart strong { font-size: 1.6rem; }
.tio-izgara { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 14px; align-items: start; margin-bottom: 14px; }
.tio-sekmeler { display: flex; gap: 18px; padding: 0 18px; border-bottom: 1px solid var(--cizgi); margin-bottom: 12px; }
.tio-sekmeler a { padding: 14px 2px 12px; color: var(--ink-500); text-decoration: none; font-weight: 600; border-bottom: 2px solid transparent; }
.tio-sekmeler a.is-secili { color: var(--brand); border-bottom-color: var(--brand); }
.tio-liste .tablo-kaydir { margin: 0 16px; }
.tio-alt { display: block; font-size: .78rem; }
.tio-sayfa { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 18px 16px; font-size: .86rem; }
.tio-sayfalar { display: inline-flex; gap: 6px; }
.tio-sayfalar a { min-width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--cizgi); border-radius: 8px; color: inherit; text-decoration: none; }
.tio-sayfalar a.is-secili { background: var(--brand); border-color: var(--brand); color: var(--ters-ink); }
.tio-sebepler { list-style: none; margin: 0; padding: 0 18px; display: flex; flex-direction: column; gap: 12px; }
.tio-sebepler li { display: flex; gap: 12px; align-items: flex-start; }
.tio-sebepler small { display: block; font-size: .8rem; }
.tio-sayi { flex: none; width: 30px; height: 30px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: var(--uyari-50); color: var(--brand); font-weight: 700; }
.tio-incele { margin: 16px 18px 18px; justify-content: center; display: flex; }
.tio-ic { margin: 0; padding: 0 18px 14px; }
.tio-uygula { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 16px 20px; }
.tio-onay { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; padding-right: 14px; border-right: 1px solid var(--cizgi); }
.tio-not { flex: 1; min-width: 220px; display: flex; flex-direction: column; }
.tio-eylem { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 18px 18px; }
.tio-sonuc .tio-sebepler { margin-bottom: 14px; }
@media (max-width: 1100px) { .tio-izgara { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .tio-kartlar { grid-template-columns: 1fr; } .tio-onay { border-right: 0; } }
/* ═══ PAKET 953 — Poliçe tanıma 1 (yalnız işaret · stil yok) ═══ */
/* ═══ PAKET 954 — Poliçe tanıma 1b (yalnız işaret · stil yok) ═══ */
/* ═══ PAKET 955 — Poliçe tanıma 1c (yalnız işaret · stil yok) ═══ */
/* ═══ PAKET 956 — Poliçe tanıma hattı (yalnız işaret · stil yok) ═══ */
/* ═══ PAKET 957 — Poliçe tanıma: zeyil belgesi poliçeyi ezmez (yalnız işaret) ═══ */
/* ═══ PAKET 959 — Poliçe tanıma: boş sigortalı adı belgeden doldurulur (yalnız işaret) ═══ */
/* ═══ PAKET 960 — Poliçe okuyucu: Neova · katılım · Türk Nippon sigortalı adı (yalnız işaret) ═══ */
/* ═══ PAKET 961 — Poliçe sahibi adı: plaka/T.C. ile teklif · poliçe · sohbetten (yalnız işaret) ═══ */
/* ═══ PAKET 965 — Sohbette "Teklife geri dön" düğmesi (yalnız işaret) ═══ */
/* ═══ PAKET 966 — Yalnız emoji alıntısız sayılmaz · bildirim adresi · "Müşteri dönüş yapmadı" (yalnız işaret) ═══ */
/* ═══ PAKET 969 — Denetçi: otomasyon kararlarının tutarlılık denetimi (Kontrol Merkezi sekmesi) ═══ */
.km-yoksay { display: inline-flex; margin: 0; }
/* ═══ PAKET 970 — Maskeli sigortalı adı WhatsApp'tan · plaka belgedeki tek plakadan (yalnız işaret) ═══ */
/* ═══ PAKET 972 — Denetçi saha ayarı: yalnız aynı plaka · belgesi yeni gelen poliçe · yaş (yalnız işaret) ═══ */
/* ═══ PAKET 973 — Bayi komisyonu: bayiye verilecek + size kalacak ═══ */
.kom-kalan { display: flex; align-items: center; background: var(--yuzey-2); color: var(--ink-950); font-weight: 600; }
.bs-para .kom-size dd { color: var(--brand); font-weight: 700; }
/* ═══ PAKET 974 — Bayi Katılım ve Kurulum ═══ */
.bkr .bkr-ust { display: grid; grid-template-columns: minmax(220px, 1.4fr) minmax(220px, 1.4fr) 1fr 1fr; gap: 20px; align-items: center; padding: 18px 22px; margin-bottom: 16px; }
.bkr .bkr-ust-ad { display: flex; gap: 14px; align-items: center; }
.bkr .bkr-ust-ad h2 { margin: 0 0 6px; font-size: 20px; }
.bkr .bkr-ust-ikon { width: 52px; height: 52px; border-radius: 12px; background: var(--brand-50); color: var(--brand); display: grid; place-items: center; flex: none; }
.bkr .bkr-ust-ilerleme { display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; align-items: center; }
.bkr .bkr-ust-ilerleme strong { grid-column: 1 / -1; font-size: 14px; }
.bkr .bkr-ust-bilgi { display: grid; gap: 4px; border-left: 1px solid var(--cizgi); padding-left: 18px; }
.bkr .bkr-ust-bilgi small { color: var(--ink-500); }
.bkr-rozet { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; background: var(--ink-50); color: var(--ink-700); font-size: 12px; font-weight: 600; margin-right: 6px; }
.bkr-rozet--surer { background: var(--brand-50); color: var(--brand-600); }
.bkr-rozet--aktif { background: var(--mavi-50); color: var(--mavi-600); }
.bkr-cubuk { display: inline-block; width: 120px; height: 8px; border-radius: 999px; background: var(--ink-100); overflow: hidden; vertical-align: middle; }
.bkr-cubuk > span { display: block; height: 100%; background: var(--brand); border-radius: 999px; }
.bkr-cubuk--buyuk { width: 100%; height: 10px; }
.bkr .bkr-izgara { display: grid; grid-template-columns: 260px minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.bkr .bkr-adimlar { list-style: none; margin: 0; padding: 12px; }
.bkr .bkr-adim > a, .bkr .bkr-adim > span { display: flex; gap: 12px; align-items: center; padding: 12px; border-radius: 10px; color: inherit; text-decoration: none; position: relative; }
.bkr .bkr-adim.is-on > a, .bkr .bkr-adim.is-on > span { background: var(--brand-50); }
.bkr .bkr-adim-no { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--ink-100); color: var(--ink-600); font-weight: 700; font-size: 13px; }
.bkr .bkr-adim.is-tamam .bkr-adim-no { background: var(--ok); color: var(--yuzey); }
.bkr .bkr-adim.is-on:not(.is-tamam) .bkr-adim-no { background: var(--brand); color: var(--yuzey); }
.bkr .bkr-adim-govde { display: grid; gap: 2px; }
.bkr .bkr-adim-govde small { color: var(--ink-500); }
.bkr .bkr-adim.is-on .bkr-adim-govde strong { color: var(--brand-600); }
.bkr .bkr-govde h2 { margin: 0 0 6px; }
.bkr .bkr-form { margin-top: 16px; }
.bkr .bkr-form-ikincil { margin-top: 10px; }
.bkr .bkr-eylem { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; flex-wrap: wrap; }
.bkr .bkr-secim { display: flex; gap: 8px; align-items: center; margin: 6px 0 10px; }
.bkr .hint-yazi { color: var(--ink-500); font-size: 13px; margin: 8px 0 0; }
.bkr .bkr-dosya { display: flex; gap: 8px; align-items: center; margin: 12px 0 0; }
.bkr .bkr-kutu { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 10px; margin: 14px 0; border: 1px solid var(--cizgi); }
.bkr .bkr-kutu--bekliyor { background: var(--brand-50); border-color: var(--brand-100); }
.bkr .bkr-kutu--iyi { background: var(--mavi-50); border-color: var(--mavi-100); }
.bkr .bkr-bilgi { margin: 14px 0 0; }
.bkr .bkr-bilgi dt { color: var(--ink-500); font-size: 13px; }
.bkr .bkr-hatlar { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.bkr .bkr-hatlar li { display: grid; gap: 6px; }
.bkr .bkr-yan { display: grid; gap: 16px; }
.bkr .bkr-yan h3 { margin: 0 0 4px; font-size: 16px; }
.bkr .bkr-kontrol { list-style: none; margin: 12px 0 0; padding: 0; border: 1px solid var(--cizgi); border-radius: 10px; }
.bkr .bkr-kontrol li { display: grid; grid-template-columns: 22px 1fr auto; gap: 10px; align-items: center; padding: 10px 12px; border-top: 1px solid var(--cizgi); font-size: 14px; }
.bkr .bkr-kontrol li:first-child { border-top: 0; }
.bkr .bkr-kontrol em { font-style: normal; font-size: 13px; color: var(--ink-500); }
.bkr .bkr-kontrol li.is-tamam em { color: var(--ok); }
.bkr .bkr-kontrol-nokta { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--ink-300); display: grid; place-items: center; }
.bkr .bkr-kontrol li.is-tamam .bkr-kontrol-nokta { background: var(--ok); border-color: var(--ok); color: var(--yuzey); }
.bkr .bkr-kom { margin-top: 10px; }
@media (max-width: 1200px) { .bkr .bkr-izgara { grid-template-columns: 220px minmax(0, 1fr); } .bkr .bkr-yan { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .bkr .bkr-ust { grid-template-columns: 1fr; } .bkr .bkr-ust-bilgi { border-left: 0; padding-left: 0; } .bkr .bkr-izgara { grid-template-columns: 1fr; } .bkr .bkr-yan { grid-template-columns: 1fr; } }
/* ═══ PAKET 975 — Akıllı Yanıt Taslakları ═══ */
.ytk .ytk-izgara { display: grid; grid-template-columns: 320px minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.ytk h3 { margin: 0 0 12px; font-size: 16px; display: flex; gap: 8px; align-items: center; }
.ytk h4 { margin: 18px 0 8px; font-size: 14px; }
.ytk .ytk-kisi { display: flex; gap: 12px; align-items: center; }
.ytk .ytk-kisi small { display: block; color: var(--ink-500); }
.ytk .ytk-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--brand-50); color: var(--brand-600); display: grid; place-items: center; font-weight: 700; flex: none; }
.ytk .ytk-bilgi { margin: 14px 0 0; }
.ytk .ytk-bilgi dt { color: var(--ink-500); font-size: 13px; }
.ytk .ytk-son { margin-top: 14px; border-top: 1px solid var(--cizgi); padding-top: 12px; }
.ytk .ytk-son-bas { display: flex; justify-content: space-between; color: var(--ink-500); }
.ytk .ytk-balon { background: var(--ink-50); border-radius: 12px; padding: 10px 12px; margin: 8px 0 0; white-space: pre-wrap; }
.ytk .ytk-ilgili { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ytk .ytk-ilgili li { border: 1px solid var(--cizgi); border-radius: 10px; padding: 10px 12px; }
.ytk .ytk-ilgili li > a { color: inherit; text-decoration: none; display: block; }
.ytk .ytk-ilgili small { display: block; color: var(--ink-500); font-size: 12px; }
.ytk .ytk-ilgili [data-durum="hazir"], .ytk .ytk-ilgili [data-durum="eksik"] { color: var(--brand-600); }
.ytk .ytk-taslak-bas { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.ytk .ytk-durum { font-size: 13px; color: var(--brand-600); }
.ytk .ytk-durum[data-kayit="var"] { color: var(--mavi-600); }
.ytk .ytk-metin { min-height: 200px; resize: vertical; white-space: pre-wrap; }
.ytk .ytk-say { text-align: right; font-size: 12px; color: var(--ink-500); margin-top: 4px; }
.ytk .ytk-ton { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 12px; }
.ytk .ytk-ton .f-label { grid-column: 1 / -1; margin: 0; }
.ytk .ytk-ton-dugme.is-on { border-color: var(--brand); color: var(--brand-600); background: var(--brand-50); }
.ytk .ytk-hizli { margin-top: 12px; }
.ytk .ytk-not { background: var(--mavi-50); border: 1px solid var(--mavi-100); border-radius: 10px; padding: 10px 12px; font-size: 13px; color: var(--ink-700); margin: 14px 0 0; }
.ytk .ytk-eylem { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.ytk .ytk-eylem form { margin: 0; }
.ytk .ytk-duzenleyen { font-size: 12px; text-align: right; margin: 8px 0 0; }
.ytk .ytk-kaynak { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ytk .ytk-kaynak a { display: grid; gap: 2px; border: 1px solid var(--cizgi); border-radius: 10px; padding: 10px 12px; color: inherit; text-decoration: none; }
.ytk .ytk-kaynak small { color: var(--ink-500); }
.ytk .ytk-dogrula { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ytk .ytk-dogrula li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; }
.ytk .ytk-nokta { width: 18px; height: 18px; border-radius: 50%; flex: none; margin-top: 1px; }
.ytk .ytk-dogrula li.is-tamam .ytk-nokta { background: var(--ok); }
.ytk .ytk-dogrula li.is-uyari .ytk-nokta { background: var(--uyari); }
.ytk .ytk-kontrol { margin-top: 16px; background: var(--uyari-50); border: 1px solid var(--uyari-200); border-radius: 10px; padding: 12px 14px; }
.ytk .ytk-kontrol p { margin: 6px 0 0; font-size: 13px; }
@media (max-width: 1200px) { .ytk .ytk-izgara { grid-template-columns: minmax(0, 1fr) 300px; } .ytk .ytk-baglam { grid-column: 1 / -1; } }
@media (max-width: 760px) { .ytk .ytk-izgara { grid-template-columns: 1fr; } }
/* ═══ PAKET 976 — MÜŞTERİYE ÖZEL İŞLEM SAYFASI (panel/islemlerim.php · msy-) + personel ekranı (msyp-) ═══ */
.msy-body{--msy-vurgu:var(--marka-vurgu,var(--brand));margin:0;background:var(--zemin);color:var(--ink-900);font-family:var(--font-metin);min-height:100vh;display:flex;flex-direction:column}
.msy-ust{background:var(--yuzey);border-bottom:1px solid var(--cizgi)}
.msy-ust-ic{max-width:1100px;margin:0 auto;padding:14px 16px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.msy-marka{font-family:var(--font-baslik);font-weight:800;font-size:22px;color:var(--ink-950);flex:1;min-width:0}
.msy-marka span{color:var(--msy-vurgu)}
.msy-menu{display:flex;gap:18px}
.msy-menu a{color:var(--ink-600);text-decoration:none;font-size:14px}
.msy-menu a:hover{color:var(--ink-950)}
.msy-ana{max-width:1100px;width:100%;box-sizing:border-box;margin:0 auto;padding:16px;display:flex;flex-direction:column;gap:16px}
.msy-dar{max-width:520px;flex:1;justify-content:center}
.msy-selam h1{font-family:var(--font-baslik);font-size:30px;line-height:1.15;margin:12px 0 2px;color:var(--ink-950)}
.msy-alt{font-size:22px;margin:0 0 6px;color:var(--ink-900)}
.msy-soluk{color:var(--ink-500)}
.msy-kucuk{font-size:13px}
.msy-kart{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--kose);box-shadow:var(--golge-sm);padding:18px 20px}
.msy-kart h2{font-family:var(--font-baslik);font-size:19px;margin:0 0 6px;color:var(--ink-950)}
.msy-giris h1{font-family:var(--font-baslik);font-size:26px;margin:0 0 8px}
.msy-etiket{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-500);margin-bottom:4px}
.msy-adimlar{list-style:none;margin:18px 0 4px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;position:relative}
.msy-adim{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;font-size:14px;color:var(--ink-600);position:relative}
.msy-adim:not(:last-child)::after{content:"";position:absolute;top:14px;left:calc(50% + 18px);right:calc(-50% + 18px);height:2px;background:var(--cizgi)}
.msy-adim--tamam:not(:last-child)::after{background:var(--msy-vurgu)}
.msy-nokta{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;background:var(--ink-200);color:var(--ink-600)}
.msy-adim--tamam .msy-nokta{background:var(--msy-vurgu);color:var(--ters-ink)}
.msy-adim--simdi .msy-nokta{background:var(--yuzey);color:var(--msy-vurgu);box-shadow:0 0 0 3px var(--msy-vurgu)}
.msy-adim--simdi{color:var(--ink-950);font-weight:600}
.msy-eksik{display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--uyari-50);border-color:var(--uyari)}
.msy-eksik h2{color:var(--uyari)}
.msy-eksik ul{margin:4px 0 6px;padding-left:18px}
.msy-eksik-metin{flex:1 1 320px;min-width:0}
.msy-yukle-sade{display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.msy-yukle-sade p{margin:0}
.msy-yukle{display:flex;flex-direction:column;align-items:center;gap:6px}
.msy-dosya{position:relative;overflow:hidden;cursor:pointer}
.msy-dosya input{position:absolute;inset:0;opacity:0;cursor:pointer}
.msy-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 22px;border-radius:10px;border:1px solid var(--msy-vurgu);background:var(--msy-vurgu);color:var(--ters-ink);font-weight:600;font-size:15px;text-decoration:none;cursor:pointer;font-family:inherit;box-sizing:border-box}
.msy-btn:hover{filter:brightness(.95)}
.msy-btn:focus-visible{outline:3px solid var(--odak);outline-offset:2px}
.msy-btn--ikincil{background:var(--yuzey);color:var(--ink-900);border-color:var(--cizgi)}
.msy-btn--kucuk{min-height:36px;padding:0 14px;font-size:14px}
.msy-iki{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.msy-liste ul{list-style:none;margin:8px 0 0;padding:0}
.msy-satir{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--cizgi)}
.msy-satir:first-child{border-top:0}
.msy-satir>div{min-width:0}
.msy-rozet{display:inline-flex;align-items:center;gap:6px;font-size:13px;padding:3px 10px;border-radius:999px;background:var(--zemin);color:var(--ink-600);white-space:nowrap;margin-top:4px}
.msy-rozet::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.msy-rozet--iyi{background:var(--ok-50);color:var(--ok)}
.msy-rozet--uyari{background:var(--uyari-50);color:var(--uyari)}
.msy-rozet--surec{background:var(--brand-50);color:var(--brand)}
.msy-temsilci{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.msy-kim{display:flex;align-items:center;gap:14px;min-width:0}
.msy-avatar{width:52px;height:52px;border-radius:50%;background:var(--brand-50);color:var(--brand);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:20px;flex:none}
.msy-eylem{display:flex;gap:10px;flex-wrap:wrap}
.msy-eylem .msy-form{margin:0}
.msy-form{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.msy-kod input{font-size:24px;letter-spacing:.3em;text-align:center;padding:10px;border:1px solid var(--cizgi);border-radius:10px;font-family:inherit}
.msy-not{padding:12px 16px;border-radius:10px;background:var(--ok-50);color:var(--ink-900);border:1px solid var(--ok)}
.msy-not--hata{background:var(--err-50);border-color:var(--err)}
.msy-gizli{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.msy-alt-bilgi{max-width:1100px;width:100%;box-sizing:border-box;margin:auto auto 0;padding:18px 16px;display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--ink-600)}
.msy-cikis{margin:0}
@media (max-width:760px){
  .msy-menu{display:none}
  .msy-iki{grid-template-columns:1fr}
  .msy-selam h1{font-size:25px}
  .msy-alt{font-size:18px}
  .msy-yukle,.msy-eylem{width:100%}
  .msy-yukle .msy-btn,.msy-eylem .msy-btn,.msy-eylem .msy-form{width:100%}
  .msy-satir{flex-wrap:wrap}
}
.msyp-kutu{max-width:760px;padding:18px 20px;box-sizing:border-box}
.msyp-kutu h3{margin:0 0 8px}
.msyp-yeni{margin:14px 0;padding:14px;border:1px solid var(--cizgi);border-radius:var(--kose);background:var(--zemin);display:flex;flex-direction:column;gap:10px}
.msyp-satir{display:flex;gap:8px}
.msyp-satir input{flex:1;min-width:0}
.msyp-gonder{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.msyp-gonder textarea{width:100%;box-sizing:border-box;font:inherit;padding:8px 10px;border:1px solid var(--cizgi);border-radius:8px}
.msyp-satir input{font:inherit;padding:8px 10px;border:1px solid var(--cizgi);border-radius:8px}
/* ═══ PAKET 977 — HESABI SIFIRDAN BAŞLAT (admin/sifirla.php · sfr-) ═══ */
.sfr-kutu{padding:18px 20px;max-width:820px;box-sizing:border-box}
.sfr-kutu h2{margin:0 0 10px}
.sfr-liste{margin:0 0 8px;padding-left:20px;line-height:1.7}
.sfr-onay{display:flex;flex-direction:column;gap:10px;border:1px solid var(--err)}
.sfr-onay input{font:inherit;padding:9px 12px;border:1px solid var(--cizgi);border-radius:8px;max-width:420px}
.sfr-dugme{align-self:flex-start;background:var(--err);border-color:var(--err);color:var(--ters-ink)}
.sfr-dugme:hover{filter:brightness(.92)}
/* ═══ PAKET 978 — eski sohbetler de kapanır (admin/sifirla.php mevcut sfr- sınıflarını kullanır) ═══ */
/* ═══ PAKET 980 — ruhsat taramasında deneme taşması ve günlük sayaç ═══ */
/* ═══ PAKET 981 — sıfırlama öncesi yakalanamayan/okunamayan mesaj uyarı vermez ═══ */
/* ═══ PAKET 983 — teklif hazır mesajında fiyat listesi ═══ */
/* ═══ PAKET 984 — hesabın varsayılan hattı ═══ */
/* ═══ PAKET 985 — kişinin gönderim hattı ═══ */
/* ═══ PAKET 986 — teklif belgesinde not kalın, büyük, kırmızı ═══ */
/* ═══ PAKET 988 — DASK tek fiyat ═══ */
/* ═══ PAKET 989 — şefin bayi ekranı ═══ */
/* ═══ PAKET 990 — özel hat · sessiz hat ═══ */

/* ═══ PAKET 991 — teklif listesinde bayi adı kalın kırmızı ═══ */
table.tkl-tablo td.tkl-c-bayi > a { color: var(--err); font-weight: 800; }
/* ═══ PAKET 994 — fiyat mesajında not · poliçe mesajında ödeme kartı (yalnız işaret) ═══ */
/* ═══ PAKET 996 — özel hatta teklifi atanan personel o sohbeti görür (yalnız işaret) ═══ */
/* ═══ PAKET 997 — Tümü varsayılan · Bana Gelenler · kapalı hat (yalnız işaret) ═══ */
/* ═══ PAKET 999 — bayi grubundan poliçe · alıcı T.C. ile QR · QR yenile · poliçe düzenle (yalnız işaret) ═══ */
/* ═══ PAKET 1000 — poliçe dosyası kendi kaydıyla açılır · 404 (yalnız işaret) ═══ */
/* ═══ PAKET 1002 — ana sayfa: QR hattında iki kutu · bütün hatların bağlantısı · gönderim hattı ═══ */
.gb-serit--qr { --serit-sutun: 2; }
.hesap-hatlar { list-style: none; margin: 10px 0 4px; padding: 0; display: grid; gap: 8px; }
.hesap-hat { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; align-items: center; padding: 8px 10px; border: 1px solid var(--cizgi); border-radius: 8px; background: var(--yuzey); }
.hesap-hat--secili { border-color: var(--brand); }
.hesap-hat-ad { font-weight: 600; font-size: .9rem; }
.hesap-hat-link { grid-column: 1; font-size: .8rem; color: var(--muted); word-break: break-all; }
.hesap-hat .btn { grid-row: 1 / span 2; }
/* ═══ PAKET 1003 — fiyat belgesi kendi branşının bölümüne yazılır (yalnız işaret) ═══ */
/* ═══ PAKET 1004 — çıkar kuralı yalnız belediye · kapalı hat seçili kalmaz · hat kartı düzeni ═══ */
.hesap-hat { grid-template-columns: minmax(0, 1fr) auto; }
.hesap-hat-link { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* ═══ PAKET 1005 — gönderen personel her giden satırda · balonda telefon/toplu etiketi (yalnız işaret) ═══ */
/* ═══ PAKET 1006 — yazıyla/telefondan gönderilen fiyat teklife işlenir (yalnız işaret) ═══ */
/* ═══ PAKET 1010 — yavaş istek / oturum kilidi bekleme kaydı (yalnız işaret) ═══ */
/* ═══ PAKET 1011 · poliçe listesinde zeyil ve net prim ═══ */
.pol-zeyil-net{display:block;margin-top:2px;font-size:.78rem;color:var(--metin-2);}
.pol-zeyil-net strong{display:block;color:var(--metin);font-weight:700}
.pol-zeyil-net em{display:block;font-style:normal;color:var(--uyari)}
/* ═══ PAKET 1013 · poliçe: yalnız yükle / yükle ve müşteriye gönder ═══ */
/* ═══ PAKET 1014 · zeyil tutarı işareti · mükerrer · Doğa numarası · branş düzleme ═══ */
/* ═══ PAKET 1015 · poliçe listesi: dar sigortalı sütunu · brüt ve net prim ═══ */
.table th.pol-c-ad,.table td.pol-c-ad{max-width:160px;min-width:120px;overflow-wrap:anywhere}
.table td.pol-c-ad strong{font-size:.9rem}
.table td.pol-c-prim{white-space:nowrap}
.pol-prim-brut{display:block;font-weight:700}
.pol-prim-net{display:block;font-size:.8rem;color:var(--metin-2)}
.pol-c-prim small{font-family:inherit;font-size:.7rem;color:var(--metin-2);font-weight:400;margin-left:2px}
.table td.pol-c-no{font-size:.78rem;white-space:nowrap}
.table td.pol-tah-hucre{white-space:normal;min-width:0}
.table.pol-liste th,.table.pol-liste td{padding-left:10px;padding-right:10px}
/* ═══ PAKET 1016 · zeyil "asıl kendisi" düzeltmesi · rakamsız çöp numara ═══ */
/* ═══ PAKET 1018 · belge.php oturum kilidini dosya gönderiminden önce bırakır ═══ */
/* ═══ PAKET 1019 · ruhsat sohbetten okunur · ek branş yapıştırma · yalnız yazı teklif · teklifsiz gruplar ═══ */
/* ═══ PAKET 1021 · teklif belgesinde T.C. / Vergi No tam ═══ */
/* ═══ PAKET 1022 · yapıştırma: PDF dosyası · büyük görsel küçültülür ═══ */
/* ═══ PAKET 1023 · sohbet açılışında görseller yüklenirken dipte kal ═══ */
/* ═══ PAKET 1024 · kullanıcıya özel hat adı ═══ */
/* ═══ PAKET 1025 · trafik/kasko/İMM fiyat yükleme tek dal ═══ */
/* ═══ PAKET 1026 · teklifi bana ata ═══ */
/* ═══ PAKET 1027 · teklif notu · kesik listede görsel ═══ */
.tk-not-alan { width: 100%; min-height: 72px; color: var(--err); font-weight: 700; }
/* ═══ PAKET 1028 · listede bana ata ═══ */
/* ═══ PAKET 1030 · gönderen adı öneki ═══ */
.chat-snip-kim{font-weight:600;color:var(--ink-700)}
/* ═══ PAKET 1031 · bayiye sorumlu personel ═══ */
.bsp-form{margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--cizgi)}
/* ═══ PAKET 1032 · bayi formunda sorumlu personel ═══ */
.bsp-alan{margin-top:6px}
/* ═══ PAKET 1033 · QR hattında yalnız sohbet geçmişi ═══ */
/* ═══ PAKET 1036 · devir branşa uyar · sohbet bildirimi kapatılabilir ═══ */
/* ═══ PAKET 1038 · Canlı İş tazelenirken oturum kilidi tutulmaz ═══ */
/* ═══ PAKET 1039 · sessiz kişi: otomatik mesaj gitmez ═══ */
/* ═══ PAKET 1040 · yavaş istek kaydına sorgu dökümü ═══ */
/* ═══ PAKET 1041 · hat analizi sayımı dizinle ve 1033 kesimiyle ═══ */
/* ═══ PAKET 1042 · parçalı bildirim: ayrı yazılardaki ruhsat bilgileri birleşir ═══ */
/* ═══ PAKET 1045 · ekip de Meta + QR hatlarını tek panelde görür ═══ */
/* ═══ PAKET 1047 · canlı yoklama son mesajı pencereden okur ═══ */
/* ═══ PAKET 1048 · toplu teklif kapatma penceresi · Kontrol Merkezi tümünü kontrol et ═══ */
.tkp-dlg { border: 1px solid var(--cizgi); border-radius: 12px; padding: 0; max-width: 460px; width: calc(100% - 32px); background: var(--yuzey); color: inherit; }
.tkp-form { display: flex; flex-direction: column; gap: 12px; padding: 20px; }
.tkp-baslik { margin: 0; font-size: 17px; }
.tkp-acik { margin: 0; font-size: 13px; }
.tkp-etiket { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; }
.tkp-dugmeler { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.km-kontrol-form { display: inline-flex; margin: 0; }
/* ═══ PAKET 1049 · WhatsApp'tan otomatik işleme anahtarı ═══ */
.wot-kutu { display: inline-flex; align-items: center; gap: 8px; margin-right: 8px; }
.wot-etiket { font-size: 13px; font-weight: 600; color: var(--ink-700); white-space: nowrap; }
.wot-anahtar { flex: none; position: relative; width: 44px; height: 24px; min-height: 0 !important; padding: 0; border: 1px solid var(--cizgi-koyu); border-radius: 999px; background: var(--ink-100); cursor: pointer; transition: background .15s; }
.wot-anahtar-top { position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: var(--yuzey); box-shadow: var(--golge-sm); transition: transform .15s; }
.wot-anahtar[aria-checked="true"] { background: var(--brand); border-color: var(--brand); }
.wot-anahtar[aria-checked="true"] .wot-anahtar-top { transform: translateX(20px); }
.wot-durum { margin: 0 0 12px; padding: 8px 12px; border: 1px solid var(--cizgi); border-radius: 8px; background: var(--yuzey); font-size: 13px; color: var(--ink-700); }
.wot-durum.is-acik { border-color: var(--brand); }
@media (max-width: 640px) { .wot-etiket { white-space: normal; font-size: 12px; } }