/* ============================================================
   Bidentist Pro - proto.css'e EK
   Prototip tek sayfa (JS) uygulamaydı; bu sürüm sunucu tarafında
   render ediliyor. Buradaki kurallar yalnızca o farkın gerektirdiği
   küçük eklemelerdir — prototipin görünümünü DEĞİŞTİRMEZ.
   ============================================================ */

/* Test ortamı şeridi (canlıda görünmez) */
.test-serit {
  background: var(--warn); color: #3b2c00; text-align: center;
  font-size: .78rem; font-weight: 800; letter-spacing: .02em;
  padding: .3rem .8rem;
}

/* Prototipte <a onclick="logout()"> vardı; burada CSRF için <form><button>.
   Görünümü bağlantıyla birebir aynı olsun. */
.baglanti-dugme {
  background: none; border: 0; padding: 0; margin: 0;
  font: inherit; color: inherit; cursor: pointer; text-decoration: none;
}
.baglanti-dugme:hover { text-decoration: underline; }

/* Geri bağlantısı (.top içinde başlığın üstünde) */
main > .geri { margin-bottom: .35rem; }
.geri {
  display: inline-block; font-size: .78rem; color: var(--muted);
  margin-bottom: .15rem;
}
.geri:hover { color: var(--text); }

/* Dashboard yan sütunundaki dar kart içinde .alert'in flex düzeni satırı
   parçalıyordu ("1 saat boşaldı" ile devamı ayrı satırlara düşüyordu).
   Dar bağlamda blok düzene geçer. */
.card .alert { display: block; font-size: .8rem; line-height: 1.45; }
.card .alert a { white-space: nowrap; }

/* Sunucu tarafı bildirimleri — prototipteki .alert ile aynı dilde */
.alert.ok   { background: #e4f7ee; border-color: #b6e3cd; color: #127a4e; }
.alert.info { background: #e6f3fb; border-color: #cbe4f2; color: #1f5f8b; }
.dark .alert.ok   { background: #123326; border-color: #1d5540; color: #9ce8c4; }
.dark .alert.info { background: #12283a; border-color: #1f4a68; color: #b6dcf2; }

/* Talimat 40/4 — SARI (uyarı) türü SINIFA BAĞLANDI.
   Bu tür dört yerde SATIR İÇİ stille yazılmıştı
   (`style="background:#fff4d6;…"`). Satır içi stil `.dark .alert`
   kuralını EZER, bu yüzden koyu temada beyaza yakın kalıyordu ve
   ".dark .alert var" demek yanıltıcıydı — kural vardı ama hiç
   uygulanmıyordu. Artık tür de kardeşleri gibi bir sınıf. */
.alert.uyari      { background: #fff4d6; border-color: #f3dc9a; color: #6b4d00; }
.dark .alert.uyari { background: #3a3116; border-color: #6b5a2a; color: #f2d98b; }

/* Formda alan ızgarası (prototipte modal içindeydi, burada sayfada) */
.alanlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 0 1rem; }
.alanlar .tam { grid-column: 1 / -1; }
.form-dip { display: flex; gap: .6rem; justify-content: flex-end; margin-top: 1.2rem; }

/* Takvimde gece yarısını aşan slot işareti.

   Talimat 40 palet turu: metin `--muted` idi ve `--line` zemini üstünde
   4,16:1 veriyordu (AA eşiği 4,5). Bu 9,9 px'lik bir rozet — o boyutta
   zaten daha yüksek kontrast gerekir, soluk ton baştan yanlış seçimdi.
   Açık temada koyu bir tona alındı: 5,63:1.
   Koyu temada `--muted` #8d9bb8 / `--line` #1f2d4a zaten 4,97:1 —
   dokunulmadı. */
.ertesi-im {
  font-size: .62rem; background: var(--line); color: #4f5a72;
  border-radius: 3px; padding: 0 .2rem; margin-left: .15rem;
}
.dark .ertesi-im { color: var(--muted); }

/* Hekimin çalışmadığı saatler (prototipteki çizgili desen) */
.cal .c.kapali {
  background: repeating-linear-gradient(45deg, transparent, transparent 6px,
              rgba(20,32,58,.04) 6px, rgba(20,32,58,.04) 12px);
  cursor: default;
}
.dark .cal .c.kapali {
  background: repeating-linear-gradient(45deg, transparent, transparent 6px,
              rgba(255,255,255,.05) 6px, rgba(255,255,255,.05) 12px);
}

/* Sürükle-bırak hedefi */
.cal .c.hedef { background: #dcefe4; outline: 2px dashed var(--ok); outline-offset: -2px; }
.ev.suruklenen { opacity: .45; }

/* Belge kutuları (prototipte "öncesi–sonrası" kartları vardı) */
.belgeler { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: .9rem; }
.belge { margin: 0; }
.belge a {
  display: grid; place-items: center; aspect-ratio: 4/3; overflow: hidden;
  border: 1px solid var(--line); border-radius: 12px; background: #eef1f6;
}
.dark .belge a { background: #142240; }
.belge img { width: 100%; height: 100%; object-fit: cover; display: block; }
.belge figcaption { margin-top: .35rem; font-size: .76rem; line-height: 1.45; }

/* Geçici şifre kutusu */
.sifre-kutu { background: #fff4d6; border: 1px solid #f3dc9a; border-radius: 12px; padding: 1rem 1.2rem; }
.dark .sifre-kutu { background: #3a3116; border-color: #6b5a2a; }
.sifre-metin {
  font-family: ui-monospace, Consolas, monospace; font-size: 1.25rem;
  letter-spacing: .12em; font-weight: 800; user-select: all;
  background: var(--card); border: 1px solid var(--line);
  border-radius: 10px; padding: .6rem .9rem; display: inline-block; margin: .4rem 0;
}

/* Sayfalama */
/* Talimat 38/A · B7-1: 101 sayfada yalniz "Sonraki" vardi. Artik ilk/son ve
   bulunulan sayfanin cevresi gorunuyor; dar ekranda satir sarar. */
.sayfalama { display: flex; gap: .4rem; align-items: center; justify-content: center;
             flex-wrap: wrap; margin-top: 1rem; }
.sayfalama .sayfa-simdi { background: var(--brand); color: #fff; border-color: var(--brand);
                          cursor: default; pointer-events: none; }
.sayfalama .sayfa-bosluk { color: var(--muted); padding: 0 .15rem; user-select: none; }
/* Ozet en sona, genis ekranda saga yaslanir; dar ekranda alt satira duser */
.sayfalama .sayfa-ozet { margin-left: .6rem; font-size: .82rem; }
@media (max-width: 700px) { .sayfalama .sayfa-ozet { margin-left: 0; width: 100%; text-align: center; } }

/* Satır içi mini form (plan/lab satırlarında) */
.satir-form { display: inline-flex; gap: .3rem; align-items: center; margin: 0 .3rem .25rem 0; }
.satir-form input, .satir-form select { width: auto; padding: .3rem .45rem; font-size: .8rem; }

/* Boş durum */
.bos { text-align: center; color: var(--muted); padding: 2rem 1rem; }

/* Dashboard yan kartlarındaki satırlar */
.mini {
  display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  padding: .45rem 0; border-bottom: 1px solid var(--line); font-size: .84rem;
}
.mini:last-child { border-bottom: 0; }

@media (max-width: 900px) {
  .alanlar { grid-template-columns: 1fr; }
  .belgeler { grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); }
}

/* Sunucu tarafi gezinme icin .st icinde <a> kullaniyoruz;
   prototipteki .st button ile ayni gorunum. */
.st a {
  border: 1px solid var(--line); background: #fff; border-radius: 6px;
  padding: .1rem .4rem; font-size: .7rem; font-weight: 700;
  color: var(--text); text-decoration: none;
  display: inline-flex; align-items: center;
}
.st a.on { background: var(--brand); color: #fff; border-color: var(--brand); }
.dark .st a { background: #0f1a2e; color: #dfe9ff; }
.dark .st a.on { background: var(--brand); color: #fff; }

/* Prototipte üst üste gelen kartlara boşluk her seferinde inline veriliyordu.
   Sunucu tarafında aynı sayfada çok kart olduğu için genel kural veriyoruz;
   inline "margin-top" verilen yerlerde bu kural ezilir. */
main > .card + .card,
main > .card + .grid,
main > .grid + .card,
main > .grid + .grid,
main > .card + form,
main > form + .card,
main > form + .grid,
main > .alert + .card,
main > .alert + .grid,
main > p + .card { margin-top: 1rem; }

/* Hasta kartı sekmeleri: sunucu tarafında <a> kullanıyoruz (adres çubuğunda
   #plan gibi kalsın, orta tıkla yeni sekmede açılabilsin). Görünüm prototipteki
   .tabs button ile birebir aynı. */
.tabs a {
  background: none; border: 0; padding: .6rem .9rem; font-weight: 600;
  color: var(--muted); border-bottom: 2px solid transparent;
  margin-bottom: -1px; white-space: nowrap; text-decoration: none; cursor: pointer;
}
.tabs a.on { color: var(--text); border-color: var(--brand); }
.tabs a:hover { color: var(--text); }

/* Sekme gövdesi: gizli olan hiçbir koşulda görünmesin */
.sekme-govde[hidden] { display: none !important; }

/* Takvimde boş hücre tıklanabilir olduğunu belli etsin */
.cal .c[data-git] { cursor: pointer; }

/* Mobilde geniş tablolar (dashboard akışı, ödemeler, log…) gövdeyi yatay
   kaydırıyordu. Kart kendi içinde kaysın; sayfanın kendisi kaymasın.
   Takvim kartında bu zaten inline olarak vardı. */
@media (max-width: 700px) {
  main > .card,
  main > .grid > .card,
  main > .grid > .grid > .card { overflow-x: auto; }
}

/* Prototipin en dar kırılımı 900 px'te bitiyor: 390 px'lik telefonda .g4/.g3
   iki sütun kalıyor ve KPI kartları ekranın dışında kesiliyordu.
   560 px altında tek sütuna iniyoruz — prototipe göre bilinçli iyileştirme. */
@media (max-width: 560px) {
  .g4, .g3, .g2, .g31 { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------------------
   Üst çubuk — prototipteki düzen: solda arama, sağda "+ Randevu" / "+ Hasta".
   Marka işareti YALNIZCA kenar menüde durur; ana alanda logo yoktur.
   Tarih, arama kutusu ile düğmeler arasında küçük gri metindir.
   ------------------------------------------------------------------------ */
.topbar {
  height: 68px;              /* online randevu üst çubuğuyla aynı */
  align-items: center;       /* öğeler dikeyde ortalı */
  gap: 1rem;                 /* 16 px — arama ile düğmeler arasındaki en az boşluk */
}
.topbar .gsearch { flex: 1 1 auto; min-width: 0; }
.topbar .btn { flex: none; }

.topbar-tarih {
  flex: none; color: var(--muted); font-size: .8rem; white-space: nowrap;
}

/* Dar ekran: proto.css üst çubuğu sarmalayıp aramayı tam satır yapıyordu,
   böylece yükseklik 68 px'te kalmıyordu. Tek satırda tutulur; arama kutusu
   kalan alana göre daralır, tarih sığmadığı için gizlenir. */
@media (max-width: 900px) {
  .topbar { flex-wrap: nowrap; }
  .topbar .gsearch { width: auto; flex: 1 1 auto; min-width: 0; }
  .topbar-tarih { display: none; }
}
/* Çok dar ekranda düğmeler biraz daralır ki arama kutusuna yer kalsın */
@media (max-width: 460px) {
  .topbar .btn.sm { padding: .4rem .6rem; font-size: .78rem; }
  .topbar { gap: 1rem; }
}

/* ------------------------------------------------------------------------
   Çok geniş ekranlar: satırlar okunamayacak kadar uzuyordu.
   Ana alan 1600 px'te sınırlanır ve ortalanır; kartlar ve tablolar bu
   alanın içinde kaldığı için ayrıca bir şey gerekmiyor.
   ------------------------------------------------------------------------ */
@media (min-width: 1800px) {
  main { max-width: 1600px; width: 100%; margin-inline: auto; }
}

/* ------------------------------------------------------------------------
   Yazdırma başlığı — ekranda gizli, yalnızca kâğıtta görünür.
   Kenar menü yazdırmada gizlendiği için marka işareti oradan kalkıyordu.
   Öğede ayrıca `hidden` özniteliği var; buradaki kural onu yazdırmada açar.
   ------------------------------------------------------------------------ */
.yazdir-baslik { display: none; }

@media print {
  /* [hidden] seçicisi de yazılır: öğedeki `hidden` özniteliğini bu kural açar */
  .yazdir-baslik, .yazdir-baslik[hidden] {
    display: flex !important; align-items: center; gap: .6rem;
    padding: 0 0 .6rem; margin-bottom: 1rem;
    border-bottom: 1px solid #aab4c4; color: #101b30;
    font-size: 1rem; font-weight: 800;
  }
  .yazdir-baslik img { width: 44px; height: 28px; }
  .yazdir-baslik small { font-weight: 600; font-size: .68rem; letter-spacing: .12em; color: #2f9dc7; }
  /* 44/2: sağ sütun — belge türü üstte, tarih altında. `.tarih` eskiden
     doğrudan başlığın çocuğuydu ve `margin-left:auto` ile sağa itiliyordu;
     artık o iş sarmalayıcıya ait. */
  .yazdir-baslik .yb-sag {
    margin-left: auto; display: flex; flex-direction: column;
    align-items: flex-end; line-height: 1.3;
  }
  .yazdir-baslik .yb-tur { font-size: .95rem; font-weight: 800; color: #101b30; }
  .yazdir-baslik .tarih { font-weight: 500; font-size: .78rem; color: #3c4557; }  /* 41/2: kagit ciktisi da AA olculur (bkz. t40-tema-tarama.js) */
}

/* ------------------------------------------------------------------------
   BİLDİRİM ZİLİ VE TOAST  (Talimat 22)

   Zil üst çubukta, "+ Randevu" düğmesinin solunda durur. Açılır panel
   `position:absolute` ile zilin altına yerleşir; üst çubuk `overflow`
   kesmediği için ek bir kap gerekmiyor.
   ------------------------------------------------------------------------ */
.zil { position: relative; flex: none; }

.zil-btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; padding: 0;
  background: #fff; border: 1px solid var(--line); border-radius: 999px;
  color: var(--muted); cursor: pointer;
}
.zil-btn:hover { background: #f6f8fc; color: var(--text); }
.zil-btn.var   { color: var(--text); border-color: var(--accent2); }
.zil-btn svg   { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8;
                 stroke-linecap: round; stroke-linejoin: round; }

.zil-sayi {
  position: absolute; top: -4px; right: -4px; min-width: 17px; height: 17px;
  padding: 0 4px; border-radius: 999px; background: var(--bad); color: #fff;
  font-size: .66rem; font-weight: 800; line-height: 17px; text-align: center;
  border: 2px solid #fff;
}

.zil-panel {
  position: absolute; top: calc(100% + .5rem); right: 0; z-index: 40;
  width: min(360px, calc(100vw - 2rem));
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 14px 36px rgba(20, 32, 58, .16); overflow: hidden;
}
.zil-bas {
  display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  padding: .7rem .9rem; border-bottom: 1px solid var(--line); background: #fafbfd;
}
.zil-bas b { font-size: .9rem; }
.zil-bas button { font-size: .74rem; }

.zil-liste { max-height: 360px; overflow: auto; }
.zil-bos   { padding: 1.4rem .9rem; text-align: center; color: var(--muted); font-size: .84rem; }

.zil-satir {
  display: block; padding: .65rem .9rem .65rem 1.6rem; position: relative;
  border-bottom: 1px solid var(--line); color: inherit; cursor: pointer;
}
.zil-satir:last-child { border-bottom: 0; }
.zil-satir:hover      { background: #f6f8fc; }

/* Okunmamış: sol kenarda renkli şerit + hafif vurgu */
.zil-satir.yeni { background: #f2f8fd; }
.zil-satir.yeni::before {
  content: ""; position: absolute; left: .65rem; top: 50%; transform: translateY(-50%);
  width: 6px; height: 6px; border-radius: 999px; background: var(--accent2);
}
.zil-satir.yeni.ik-iptal::before  { background: var(--bad); }
.zil-satir.yeni.ik-uyari::before  { background: var(--warn); }
.zil-satir.yeni.ik-randevu::before{ background: var(--ok); }

.zil-satir-ust { display: flex; align-items: baseline; gap: .5rem; }
.zil-satir-ust b { font-size: .84rem; font-weight: 700; }
.zil-zaman { margin-left: auto; font-size: .7rem; color: var(--muted); white-space: nowrap; }
.zil-metin { display: block; margin-top: .15rem; font-size: .78rem; color: var(--muted); }

.zil-alt {
  display: block; padding: .6rem .9rem; text-align: center;
  border-top: 1px solid var(--line); background: #fafbfd;
  font-size: .78rem; font-weight: 600; color: var(--accent2);
}

.dark .zil-btn   { background: #121c30; }
.dark .zil-btn:hover { background: #142240; }
.dark .zil-panel { background: #121c30; }
.dark .zil-bas,
.dark .zil-alt   { background: #0f1a2e; }
.dark .zil-satir:hover { background: #142240; }
.dark .zil-satir.yeni  { background: #16253f; }
.dark .zil-sayi  { border-color: #121c30; }

/* --- toast --- */
.toast-kap {
  position: fixed; right: 1rem; bottom: 1rem; z-index: 60;
  display: flex; flex-direction: column; gap: .5rem; pointer-events: none;
}
.toast {
  pointer-events: auto; cursor: pointer;
  min-width: 240px; max-width: min(360px, calc(100vw - 2rem));
  padding: .7rem .9rem; border-radius: 12px;
  background: var(--navy); color: #eaf1ff;
  border: 1px solid rgba(143, 224, 255, .25);
  box-shadow: 0 12px 28px rgba(6, 15, 32, .3);
  opacity: 0; transform: translateY(8px);
  transition: opacity .22s ease, transform .22s ease;
}
.toast.gorunur { opacity: 1; transform: translateY(0); }
.toast b    { display: block; font-size: .86rem; }
.toast span { display: block; margin-top: .1rem; font-size: .78rem; color: #a9bdd8; }

@media (prefers-reduced-motion: reduce) {
  .toast { transition: none; }
}

/* ------------------------------------------------------------------------
   BİLDİRİM VE SMS AYAR SAYFASI
   ------------------------------------------------------------------------ */
.bil-matris th:first-child { width: 42%; }
.bil-matris td.k          { text-align: center; }
.bil-matris td.k input    { width: auto; }
.bil-matris .zorunlu-not  { font-size: .68rem; color: var(--muted); }
.bil-matris tr.pasif td   { opacity: .55; }

.bil-durum {
  display: flex; align-items: flex-start; gap: .7rem;
  padding: .8rem .9rem; border-radius: 12px;
  border: 1px solid var(--line); background: #fafbfd; margin-bottom: 1rem;
}
.bil-durum .nokta {
  flex: none; width: 10px; height: 10px; border-radius: 999px; margin-top: .35rem;
  background: var(--muted);
}
.bil-durum.acik      .nokta { background: var(--ok); }
.bil-durum.kapali    .nokta { background: var(--bad); }
.bil-durum.sorulmadi .nokta { background: var(--warn); }
.bil-durum.ios       .nokta { background: var(--warn); }
.dark .bil-durum { background: #0f1a2e; }

.bil-cihaz {
  display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  padding: .5rem .7rem; border: 1px solid var(--line); border-radius: 10px;
  font-size: .82rem; margin-bottom: .4rem;
}
.bil-cihaz small { color: var(--muted); }

/* ------------------------------------------------------------------------
   [hidden] ÖZNİTELİĞİ HER ZAMAN GİZLESİN

   Tarayıcı varsayılanı `[hidden] { display: none }` bir SINIF kuralıyla
   ezilir: `.btn { display: inline-flex }` daha spesifik olduğu için
   `hidden` özniteliği hiçbir işe yaramaz. Talimat 22'de tam bu oldu —
   bildirim izni verilmişken gizlenmesi gereken "Bildirimleri aç" düğmesi
   ekranda kalmaya devam etti.

   Aynı tuzak online tarafında daha önce yaşanmış ve orada çözülmüştü
   (online-v2.css). Panel tarafında da aynı kural konuyor.

   Yazdırma başlığı ve sekme gövdesi kendi `!important` kurallarını daha
   spesifik seçicilerle yazdığı için bundan etkilenmez.
   ------------------------------------------------------------------------ */
[hidden] { display: none !important; }

/* ------------------------------------------------------------------------
   ZİL PANELİ — MOBİL

   Masaüstünde panel zilin sağ kenarına hizalı açılır (`right: 0`). Mobilde
   zil ekranın ortasında kaldığı için aynı hizalama paneli EKRANIN SOLUNA
   TAŞIRIYOR ve içerik kesiliyordu.

   Bu, `scrollWidth` ile ölçülen yatay taşmaya YANSIMAZ (negatif tarafa
   taşan içerik belge genişliğini büyütmez) — bu yüzden ilk ölçümde
   "taşma yok" görünüyordu. Kabul testi artık panelin sol kenarını
   doğrudan ölçüyor.

   Çözüm: dar ekranda panel alttan açılan bir sayfa olur (bottom sheet).
   Mobilde beklenen desen budur ve konumu zilin yerinden bağımsızdır.
   ------------------------------------------------------------------------ */
@media (max-width: 720px) {
  .zil-panel {
    position: fixed;
    top: auto; bottom: 0; left: 0; right: 0;
    width: auto; max-width: none;
    border-radius: 14px 14px 0 0;
    box-shadow: 0 -14px 36px rgba(20, 32, 58, .22);
  }
  .zil-liste { max-height: min(52vh, 420px); }
}

/* ------------------------------------------------------------------------
   TAKVİMDE VURGULANAN RANDEVU  (Talimat 23/3)

   Bildirime tıklanınca takvim randevunun KENDİ GÜNÜNE açılır ve ilgili
   randevu bir süre belirgin durur. Adresteki #randevu-<id> parçası
   tarayıcıya kaydırmayı kendisi yaptırır; ek JS yok.

   Vurgu kalıcı DEĞİL: 6 saniye sonra söner. Kalıcı olsaydı sayfa
   yenilendiğinde de durur ve "bu randevuda bir sorun mu var?" izlenimi
   verirdi.
   ------------------------------------------------------------------------ */
.ev.vurgu {
  outline: 2px solid var(--accent2);
  outline-offset: 1px;
  box-shadow: 0 0 0 4px rgba(47, 157, 199, .18);
  animation: ev-vurgu 6s ease-out forwards;
}
@keyframes ev-vurgu {
  0%, 70% { outline-color: var(--accent2); box-shadow: 0 0 0 4px rgba(47, 157, 199, .18); }
  100%    { outline-color: transparent;    box-shadow: 0 0 0 4px rgba(47, 157, 199, 0); }
}
/* Kaydırma hedefi üst çubuğun altında kalmasın */
.ev[id^="randevu-"] { scroll-margin-top: 90px; }

@media (prefers-reduced-motion: reduce) {
  .ev.vurgu { animation: none; }
}

/* ------------------------------------------------------------------------
   MARKA BAĞLANTISI  (Talimat 23/4)

   Logo artık <div> değil <a href="/panel">. Bu, kenar menüdeki genel
   `aside a` kuralının markaya da uygulanması demek: gri renk, menü
   satırı dolgusu ve köşe yuvarlaması. Marka görünümü DEĞİŞMEMELİ —
   aşağıdaki kurallar onu eski hâline sabitliyor, yalnızca imleç ve
   hover geri bildirimi ekleniyor.
   ------------------------------------------------------------------------ */
aside a.brand {
  color: #fff;
  padding: 0;
  border-radius: 0;
  font-size: 1.05rem;
  background: transparent;
  cursor: pointer;
}
aside a.brand:hover        { background: transparent; color: var(--accent); }
aside a.brand:hover small  { color: #fff; }
aside a.brand:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 4px;
  border-radius: 6px;
}

/* ── Talimat 29/1 · hasta kartı "Yapılan işlemler" listesi ────────────── */

/* Boş durum: ne olmadığını değil, NE YAPILACAĞINI söyler. */
.bos-durum {
  padding: 1.6rem 1.2rem;
  text-align: center;
  border: 1px dashed var(--cizgi, #d6dae2);
  border-radius: 10px;
  background: var(--yumusak, #fafbfc);
}
.bos-durum .bos-baslik { font-weight: 600; margin-bottom: .35rem; }
.bos-durum .btn { margin-top: .9rem; }

/* Çok kayıtta okunabilirlik: satır ayrımı + sayısal hizalama.
   Tutar sağa yaslanır; göz aynı hizada tarar. */
.islem-listesi th, .islem-listesi td { vertical-align: top; }
.islem-listesi th:nth-child(5),
.islem-listesi td:nth-child(5) { text-align: right; white-space: nowrap; }
.islem-listesi th:nth-child(1),
.islem-listesi td:nth-child(1) { white-space: nowrap; }
.islem-listesi tr:nth-child(even) td { background: var(--yumusak, #fafbfc); }

/* 20 satırdan sonrası: DOM'da durur, katlanır. Tarayıcı içi arama çalışır. */
.eski-islemler { margin-top: .8rem; }
.eski-islemler > summary {
  cursor: pointer;
  color: var(--accent2, #2a6ef0);
  font-size: .9rem;
  padding: .35rem 0;
}
.eski-islemler > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* Dar ekranda tablo yatay kayar; sayfa gövdesi kaymaz. */
@media (max-width: 720px) {
  .islem-listesi { display: block; overflow-x: auto; }
}

/* ================= Talimat 33 düzeltmeleri ================= */

/* --- 33/7 · "şifreyi göster" düğmesi --------------------------------- */
.sifre-sar { position: relative; display: block; }
.sifre-sar input { width: 100%; padding-right: 2.9rem; }
.sifre-goz {
  position: absolute; right: .35rem; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px;            /* 33/5: parmak hedefi */
  display: flex; align-items: center; justify-content: center;
  border: 0; background: none; cursor: pointer; color: var(--muted); padding: 0;
}
.sifre-goz svg { width: 20px; height: 20px; }
.sifre-goz:hover { color: var(--text); }
.sifre-goz:focus-visible { outline: 2px solid var(--accent2); outline-offset: -4px; border-radius: 8px; }
.sifre-goz[aria-pressed="true"] { color: var(--accent2); }

/* --- 33/2 · randevu formunda hasta arama ----------------------------- */
.hasta-sec { position: relative; }
.hasta-sonuc {
  position: absolute; z-index: 40; left: 0; right: 0; top: 100%;
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 14px 36px rgba(20, 32, 58, .16);
  max-height: 17rem; overflow-y: auto; margin-top: 3px;
}
.dark .hasta-sonuc { background: #0f1a2e; box-shadow: 0 14px 36px rgba(0, 0, 0, .5); }
.hasta-satir {
  padding: .6rem .75rem; cursor: pointer; min-height: 44px;   /* 33/5 */
  display: flex; flex-direction: column; justify-content: center;
  border-bottom: 1px solid var(--line);
}
.hasta-satir:last-child { border-bottom: 0; }
.hasta-satir:hover, .hasta-satir.on { background: rgba(47, 157, 199, .12); }
.hasta-satir b { font-size: .9rem; }
.hasta-satir span { font-size: .78rem; }
.hasta-bos { padding: .75rem; font-size: .84rem; }
.hasta-secili { margin-top: .45rem; font-size: .82rem; display: flex; align-items: center; gap: .5rem; }

/* --- 33/3 · geniş tablolar sayfayı yatay kaydırmasın ----------------- */
/* Sayfa gövdesi ASLA yana kaymaz; geniş içerik KENDİ kabında kayar.
   Ölçüldü (Talimat 31): /katalog 222 px, /hastayonetim 82 px taşıyordu. */
.tablo-kap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 720px) {
  /* DIKKAT: min-width YALNIZ kaydirma kabindaki tabloya verilir.
     Ilk surumde .card > table de dahil edilmisti ve kabi OLMAYAN
     tablolar (ornegin /bildirim, /online) bu yuzden tasmaya basladi -
     duzeltme kendi gerilemesini uretmisti (kabul testi yakaladi). */
  .tablo-kap > table { min-width: 34rem; }
}

/* --- 33/5 · dokunma hedefleri --------------------------------------- */
@media (max-width: 720px) {
  /* Üst menü ve kart içi bağlantılar parmakla ıskalanmasın.
     En kötüsü ölçülmüştü: "← Hastalar" 62x19 px. */
  .nav a, .tabs a, .top a.btn, .btn.sm, .geri-bag {
    min-height: 44px; display: inline-flex; align-items: center;
  }
  .geri-bag { padding: .35rem .15rem; }
}

/* ============ Talimat 34/C · mobilde çıkış düğmesi — KALDIRILDI ============ */
/* v1.5.0'da mobilde `aside .user` bloğu yatay şeridin sağ kenarına
   yapıştırılıyordu (position:sticky), çünkü proto.css 900 px altında o bloğu
   gizliyor ve kullanıcı mobilde oturum kapatamıyordu.

   v1.5.1'de yama KALDIRILDI: kullanıcı eylemleri artık kenar menüde değil,
   üst çubuktaki PROFİL MENÜSÜNDE (aşağıdaki `.profil` bloğu). Masaüstü ve
   mobil aynı deseni kullanıyor, bu yüzden mobile özel bir yamaya gerek yok.
   `aside .user` bloğu kabuk.php'den tamamen çıkarıldı. */

/* ============ Talimat 34/B · Hareketler sekmesi ============ */
/* Üç kaynak (işlem kaydı · SMS · görüntüleme) tek zaman çizelgesinde.
   Süzgeç sunucu tarafında çalıştığı için chip'ler <a>; görsel olarak
   düğme gibi durur ama JS gerektirmez (CSP script-src 'self'). */

.hareket-suzgec {
  display: flex; flex-wrap: wrap; gap: .4rem;
  margin: .2rem 0 1rem;
}
.hareket-suzgec .chip {
  display: inline-flex; align-items: center;
  min-height: 34px; padding: 0 .75rem;
  border: 1px solid var(--line, #e3e8f0);
  border-radius: 999px;
  background: var(--card, #fff);
  color: var(--muted, #626e88);
  font-size: .82rem; font-weight: 600;
  text-decoration: none;
}
.hareket-suzgec .chip:hover { border-color: var(--accent2, #2f9dc7); color: var(--text, #14203a); }
.hareket-suzgec .chip.on {
  background: var(--brand, #253c66);
  border-color: var(--brand, #253c66);
  color: #fff;
}

.hareket-liste { list-style: none; margin: 0; padding: 0; }

.hareket {
  display: flex; gap: .7rem;
  padding: .6rem 0 .6rem .1rem;
  border-bottom: 1px solid var(--line, #e3e8f0);
}
.hareket:last-child { border-bottom: 0; }

/* İşaret sütunu sabit genişlikte: satırlar aynı hizadan başlar. */
.hareket .h-isaret {
  flex: 0 0 1.25rem; text-align: center;
  font-size: .8rem; line-height: 1.5rem;
  color: var(--muted, #626e88);
}
.hareket.h-islem       .h-isaret { color: var(--accent2, #2f9dc7); }
.hareket.h-sms         .h-isaret { color: var(--ok, #1fa971); }
.hareket.h-goruntuleme .h-isaret { opacity: .55; }

/* Görüntüleme kayıtları her kart açılışında yazılır; listeyi boğmasın
   diye soluk gösterilir ama gizlenmez (KVKK izi). */
.hareket.h-goruntuleme .h-ust b { font-weight: 500; color: var(--muted, #626e88); }

.hareket .h-govde { min-width: 0; flex: 1; }
.hareket .h-ust {
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem;
}
.hareket .h-zaman { margin-left: auto; font-size: .78rem; white-space: nowrap; }
.hareket .h-detay { font-size: .86rem; margin-top: .15rem; overflow-wrap: anywhere; }
.hareket .h-kim   { font-size: .76rem; margin-top: .15rem; }

/* Dar ekranda zaman alta insin, sağa yaslanmaya çalışıp satırı kırmasın. */
@media (max-width: 560px) {
  .hareket .h-zaman { margin-left: 0; width: 100%; }
}

/* Öncesi – sonrası: iki sütun, dar ekranda alt alta. */
.karsilastir {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
.karsilastir .k-sutun { min-width: 0; }
.karsilastir h3 {
  margin: 0 0 .5rem; font-size: .9rem;
  color: var(--muted, #626e88); text-transform: uppercase; letter-spacing: .04em;
}
.karsilastir .belge { margin: 0 0 .8rem; }
.karsilastir .belge img { width: 100%; height: auto; border-radius: 8px; display: block; }
@media (max-width: 700px) {
  .karsilastir { grid-template-columns: 1fr; }
}

/* ============ Talimat 34/A · tedavi girişi (kapsam / çoklu diş / çene) ============ */
/* Ölçülen sorun (Talimat 30): tek kalem için 44 tıklama, çene bazlı
   protez için 120. Buradaki hedef tıklamayı AZALTMAK: şema üzerinde
   çoklu seçim, "arayı doldur" ve katalogdan gelen adet kısayolları. */

/* Kapsam ve çene seçimi: radio'lar görsel olarak düğme. */
.kapsam-sec { display: flex; flex-wrap: wrap; gap: .4rem; }
.kapsam-dugme { position: relative; margin: 0; }
.kapsam-dugme input {
  position: absolute; opacity: 0; width: 100%; height: 100%;
  margin: 0; cursor: pointer;
}
.kapsam-dugme span {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 0 .9rem;
  border: 1px solid var(--line, #e3e8f0); border-radius: 10px;
  background: var(--card, #fff); color: var(--muted, #626e88);
  font-size: .85rem; font-weight: 600;
}
.kapsam-dugme input:checked + span {
  background: var(--brand, #253c66); border-color: var(--brand, #253c66); color: #fff;
}
/* Klavye kullanıcısı gizli radio'nun odağını görebilmeli. */
.kapsam-dugme input:focus-visible + span { outline: 2px solid var(--accent2, #2f9dc7); outline-offset: 2px; }

/* Diş seçici: iki sıra, üst ve alt çene. Dar ekranda yatay kaydırılır —
   dişleri küçültüp dokunulamaz hâle getirmek yerine kaydırma tercih edildi. */
.dis-secici {
  display: flex; flex-direction: column; gap: .4rem;
  padding: .6rem; border: 1px solid var(--line, #e3e8f0); border-radius: 10px;
  background: var(--yumusak, #fafbfc);
  overflow-x: auto;
}
.dis-sira { display: flex; align-items: center; gap: .2rem; }
.dis-cene-ad {
  flex: 0 0 2.2rem; font-size: .72rem; font-weight: 700;
  color: var(--muted, #626e88); text-transform: uppercase;
}
.dis-dugme {
  flex: 0 0 auto;
  min-width: 34px; min-height: 44px; padding: 0 .1rem;
  border: 1px solid var(--line, #e3e8f0); border-radius: 7px;
  background: var(--card, #fff); color: var(--text, #14203a);
  font: inherit; font-size: .74rem; font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.dis-dugme:hover { border-color: var(--accent2, #2f9dc7); }
.dis-dugme.on {
  background: var(--accent2, #2f9dc7); border-color: var(--accent2, #2f9dc7);
  color: #fff; font-weight: 700;
}
/* 8|1 sınırında (orta hat) görsel ayrım: 11/21 ve 41/31 arası boşluk. */
.dis-dugme[data-dis-no="11"], .dis-dugme[data-dis-no="41"] { margin-right: .5rem; }

.dis-ozet { margin-top: .5rem; align-items: center; gap: .5rem; flex-wrap: wrap; }
.dis-ozet b { font-variant-numeric: tabular-nums; }

/* Adet kısayolları — değerler KATALOGDAN gelir, burada yalnız görünüm. */
.kisayol-sar { display: flex; flex-direction: column; gap: .4rem; }
.kisayollar { display: flex; flex-wrap: wrap; gap: .35rem; }
.kisayollar .kisayol {
  min-width: 44px; min-height: 44px; padding: 0 .6rem;
  border: 1px solid var(--line, #e3e8f0); border-radius: 10px;
  background: var(--card, #fff); color: var(--muted, #626e88);
  font: inherit; font-weight: 700; cursor: pointer;
}
.kisayollar .kisayol:hover { border-color: var(--accent2, #2f9dc7); }
.kisayollar .kisayol.on {
  background: var(--brand, #253c66); border-color: var(--brand, #253c66); color: #fff;
}

/* ============ Talimat 35/8 · profil menüsü (üst çubuk) ============ */
/* Masaüstü ve mobil TEK desen. Zil ile aynı kalıp: düğme + açılır panel,
   satır içi JS yok (CSP script-src 'self'), davranış panel.js'te. */

.profil { position: relative; flex: none; }

.profil-btn {
  width: 44px; height: 44px;            /* Talimat 33/5 dokunma hedefi */
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line, #e3e8f0); border-radius: 50%;
  background: var(--brand, #253c66); color: #fff;
  font: inherit; cursor: pointer; padding: 0;
}
.profil-btn:hover { filter: brightness(1.12); }
.profil-btn:focus-visible { outline: 2px solid var(--accent2, #2f9dc7); outline-offset: 2px; }

.profil-bas {
  font-size: .82rem; font-weight: 800; letter-spacing: .02em;
  line-height: 1; user-select: none;
}
.profil-bas.buyuk {
  width: 40px; height: 40px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--brand, #253c66); color: #fff;
}

.profil-panel {
  position: absolute; top: calc(100% + .5rem); right: 0; z-index: 60;
  width: 16rem; max-width: calc(100vw - 1.6rem);
  background: var(--card, #fff);
  border: 1px solid var(--line, #e3e8f0); border-radius: 12px;
  box-shadow: 0 12px 28px -10px rgba(15, 26, 46, .35);
  overflow: hidden;
}
.dark .profil-panel { box-shadow: 0 12px 28px -10px rgba(0, 0, 0, .6); }

.profil-bas-blok {
  display: flex; align-items: center; gap: .6rem;
  padding: .8rem .9rem; border-bottom: 1px solid var(--line, #e3e8f0);
}
.profil-bas-blok b { display: block; font-size: .9rem; }
.profil-bas-blok .muted { font-size: .76rem; }

.profil-bolum {
  padding: .5rem .6rem; margin: 0;
  border-bottom: 1px solid var(--line, #e3e8f0);
}
.profil-panel .profil-bolum:last-of-type { border-bottom: 0; }

.profil-etiket {
  display: block; padding: 0 .3rem .35rem;
  font-size: .7rem; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: var(--muted, #626e88);
}

/* Satırlar: <a> ve <button> aynı görünsün */
.profil-satir {
  display: flex; align-items: center; width: 100%;
  min-height: 44px; padding: 0 .6rem;
  border: 0; border-radius: 8px; background: none;
  font: inherit; font-size: .86rem; color: var(--text, #14203a);
  text-align: left; text-decoration: none; cursor: pointer;
}
.profil-satir:hover { background: var(--yumusak, #f4f6fa); }
.dark .profil-satir:hover { background: #16233d; }
.profil-satir.cikis { color: var(--bad, #d64545); font-weight: 600; }

/* Tema seçimi: üç durumlu (açık / koyu / sistem) */
.tema-sec { display: flex; gap: .25rem; padding: 0 .3rem .2rem; }
.tema-dugme {
  flex: 1; min-height: 36px; padding: 0 .3rem;
  border: 1px solid var(--line, #e3e8f0); border-radius: 8px;
  background: var(--card, #fff); color: var(--muted, #626e88);
  font: inherit; font-size: .78rem; font-weight: 600; cursor: pointer;
}
.tema-dugme:hover { border-color: var(--accent2, #2f9dc7); }
.tema-dugme.on {
  background: var(--brand, #253c66); border-color: var(--brand, #253c66); color: #fff;
}

.profil-surum {
  padding: .5rem .9rem .6rem;
  font-size: .7rem; border-top: 1px solid var(--line, #e3e8f0);
}

/* Dar ekranda üst çubuk sarmalanıyor; profil düğmesi en sağda kalsın. */
@media (max-width: 900px) {
  .profil { margin-left: auto; }
}

/* ============ Talimat 35/4 · hekimsiz hasta uyarısı ============ */
.alert.hekimsiz {
  display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem;
  justify-content: space-between;
}
.alert.hekimsiz .muted { display: block; font-size: .82rem; margin-top: .15rem; }
.alert.hekimsiz .satir-form { margin: 0; }

/* ============ Talimat 35/6 · diş seçimi keşfedilebilirliği ============ */
/* Şerit: "bu şema diş DURUMU içindir, çoklu seçim şurada" yön tarifi. */
.alert.ipucu {
  display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem;
  justify-content: space-between; margin-bottom: 1rem;
}
.alert.ipucu .muted { display: block; font-size: .82rem; margin-top: .2rem; }

.dis-baslik {
  display: flex; align-items: center; flex-wrap: wrap; gap: .5rem;
  font-weight: 700;
}
/* Rozet: çoklu seçim yeteneği küçük gri bir nottan ibaret kalmasın. */
.rozet-ipucu {
  display: inline-flex; align-items: center;
  padding: .12rem .5rem; border-radius: 999px;
  background: var(--accent2, #2f9dc7); color: #fff;
  font-size: .7rem; font-weight: 700; letter-spacing: .01em;
}
.dis-yonerge { margin: .25rem 0 .5rem; font-size: .82rem; }

/* Ekran okuyucuya açık, gözle görünmeyen etiket */
.gizli-etiket {
  position: absolute; width: 1px; height: 1px;
  margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ============ Talimat 36/B · diş şeması çoklu seçim ============ */
/* Renk dili mevcut tasarımdan: --brand (lacivert) → --accent2 (turkuaz)
   geçişi. Yeni bir renk ailesi getirilmedi; kip açıkken şema belirgin
   biçimde değişiyor ama estetik bütünlük korunuyor. */

.chart-ust {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .6rem 1rem; margin-bottom: .7rem;
}
.chart-araclar { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; }

/* Kip düğmesi — masaüstü ve mobilde aynı, 44 px dokunma hedefi */
.kip-dugme {
  display: inline-flex; align-items: center; gap: .4rem;
  min-height: 44px; padding: 0 .9rem;
  border: 1px solid var(--line, #e3e8f0); border-radius: 999px;
  background: var(--card, #fff); color: var(--muted, #626e88);
  font: inherit; font-size: .84rem; font-weight: 600; cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease,
              box-shadow .18s ease;
}
.kip-dugme .kip-im { font-size: .95rem; line-height: 1; }
.kip-dugme:hover { border-color: var(--accent2, #2f9dc7); color: var(--text, #14203a); }
.kip-dugme:focus-visible { outline: 2px solid var(--accent2, #2f9dc7); outline-offset: 2px; }

/* AÇIK: geçişli lacivert→turkuaz, hafif parıltı */
.kip-dugme.on {
  background: linear-gradient(135deg, var(--brand, #253c66) 0%, var(--accent2, #2f9dc7) 100%);
  border-color: transparent; color: #fff;
  box-shadow: 0 4px 14px -4px rgba(47, 157, 199, .55);
}

.chart-bilgi { font-size: .82rem; color: var(--muted, #626e88); }

/* Kip açıkken şemanın kendisi de belli olsun — düğme gözden kaçmasın */
.chart.coklu-kip {
  border-radius: 14px;
  outline: 2px solid rgba(47, 157, 199, .45);
  outline-offset: 6px;
  background: linear-gradient(180deg, rgba(47,157,199,.06) 0%, transparent 70%);
}
.chart.coklu-kip .chart-bilgi { color: var(--accent2, #2f9dc7); font-weight: 600; }

/* Seçili diş: mevcut .sel korunur, çoklu kipte daha belirgin */
.chart .tooth { transition: transform .12s ease, filter .12s ease; }
.chart.coklu-kip .tooth { cursor: copy; }
.chart .tooth.sel { transform: translateY(-2px); }

/* Sürükleme önizlemesi: bırakmadan önce ne seçileceği görünür.
   Seçiliden AYRI bir görünüm — "olacak" ile "olan" karışmasın. */
.chart .tooth.onizleme {
  outline: 2px dashed var(--accent2, #2f9dc7);
  outline-offset: 1px; border-radius: 6px;
  filter: brightness(1.06);
}

/* Sürükleme sırasında metin seçimi olmasın (imleç dişler arasında gezerken) */
.chart.coklu-kip, .chart .arch { user-select: none; -webkit-user-select: none; }

/* Mobil: iki parmakla sayfa kaydırma ile seçim karışmasın.
   Şema dikey kaydırmaya izin verir; yatay hareket seçime aittir. */
@media (max-width: 900px) {
  .chart .arch { touch-action: pan-y; }
  .chart-araclar { width: 100%; justify-content: space-between; }
}

/* ============ Talimat 36/C · kenar menü: daraltılmış ikon kipi ============ */
/* Masaüstünde menü normalde yalnız ikon şeridi. Fareyle üzerine gelince
   geçici genişler; logoya tıklanınca açık kilitlenir (tercih hatırlanır).
   MOBİLDE (≤900 px) HİÇ UYGULANMAZ — orada menü yatay bir şerit, daraltmak
   yer kazandırmaz (madde 16). Sınıflar da JS tarafından yalnız geniş
   ekranda konur, yani bu bloklar dar ekranda hiç eşleşmez. */

@media (min-width: 901px) {
  /* Izgara: dar kipte sol sütun daralır, geçişli */
  #shell { transition: grid-template-columns .18s ease; }
  body.menu-dar #shell { grid-template-columns: 68px 1fr; }

  aside { transition: width .18s ease; }

  /* --- marka düğmesi --- */
  aside .brand {
    display: flex; align-items: center; gap: .6rem;
    width: 100%; min-height: 48px; padding: .2rem .5rem;
    margin: 0 0 1rem; border: 0; border-radius: 10px;
    background: none; color: #fff; font: inherit; font-size: 1.05rem;
    font-weight: 800; cursor: pointer; text-align: left;
    white-space: nowrap; overflow: hidden;
  }
  aside .brand:hover { background: rgba(255,255,255,.06); }
  aside .brand:focus-visible { outline: 2px solid var(--accent, #8fe0ff); outline-offset: 2px; }
  aside .brand img { flex: none; }
  aside .brand small { font-size: .62rem; letter-spacing: .12em; opacity: .75; }

  /* --- DAR kip --- */
  aside.dar {
    width: 68px; padding-left: .6rem; padding-right: .6rem;
    overflow: visible;              /* ipucu balonu dışarı taşabilsin */
  }
  aside.dar .etiket,
  aside.dar .marka-ad,
  aside.dar .sec { display: none; }

  aside.dar a { justify-content: center; padding: .55rem 0; }

  /* Aktif sayfa DARALTILMIŞKEN de belli olsun (madde 17):
     yalnız ikon kaldığı için arka plan + sol kenar çubuğu ile vurgulanır. */
  aside.dar a.on {
    background: var(--brand, #253c66);
    box-shadow: inset 3px 0 0 var(--accent, #8fe0ff);
  }
  aside.dar a.on svg { filter: drop-shadow(0 0 6px rgba(143,224,255,.55)); }

  /* --- fareyle GEÇİCİ genişleme: YALNIZ LOGO ÜZERİNDE --- */
  /* ÖLÇÜLDÜ (t36-menu 13-7): kural `aside.dar:hover` iken, bir ikonun
     üzerine gelmek de menüyü açıyor ve TÜM etiketler birden çıkıyordu.
     Oysa istenen: ikon üzerinde YALNIZ o öğenin etiketi (ipucu), menünün
     tamamı ancak LOGO üzerinde açılsın. `:has()` ile logoya bağlandı.
     Odak da dahil: klavyeyle logoya gelince de açılır. */
  aside.dar:has(.brand:hover),
  aside.dar:has(.brand:focus-visible) {
    width: 232px; padding-left: 1rem; padding-right: 1rem;
  }
  aside.dar:has(.brand:hover) .etiket,
  aside.dar:has(.brand:focus-visible) .etiket,
  aside.dar:has(.brand:hover) .marka-ad,
  aside.dar:has(.brand:focus-visible) .marka-ad { display: unset; }
  aside.dar:has(.brand:hover) .sec,
  aside.dar:has(.brand:focus-visible) .sec { display: block; }
  aside.dar:has(.brand:hover) a,
  aside.dar:has(.brand:focus-visible) a { justify-content: flex-start; padding: .55rem .8rem; }
  body.menu-dar #shell:has(aside.dar .brand:hover),
  body.menu-dar #shell:has(aside.dar .brand:focus-visible) { grid-template-columns: 232px 1fr; }

  /* --- İPUCU: dar kipte tek öğenin etiketi --- */
  /* Yalnız fareye bağlı DEĞİL: :focus-visible ile klavyede de çıkar (madde 17). */
  aside.dar > a { position: relative; }
  aside.dar > a:hover .etiket,
  aside.dar > a:focus-visible .etiket {
    display: block;
    position: absolute; left: calc(100% + .55rem); top: 50%;
    transform: translateY(-50%);
    z-index: 60; pointer-events: none;
    background: var(--navy2, #162543); color: #fff;
    border: 1px solid rgba(255,255,255,.14); border-radius: 8px;
    padding: .35rem .6rem; font-size: .8rem; white-space: nowrap;
    box-shadow: 0 8px 20px -8px rgba(0,0,0,.6);
  }
  /* Menünün tamamı genişlemişken ipucu balonu ÇIKMAZ; etiket zaten satırda */
  aside.dar:has(.brand:hover) > a:hover .etiket,
  aside.dar:has(.brand:hover) > a:focus-visible .etiket {
    position: static; transform: none; background: none; border: 0;
    padding: 0; box-shadow: none; display: unset;
  }

  /* Kilitli kip: normal genişlik, geçici genişlemeye gerek yok */
  aside.kilitli { width: auto; }
}

/* ============ Talimat 36/A · hata bildirimleri ekranı ============ */
.hata-liste { width: 100%; }
.hata-liste th { white-space: nowrap; }
.hata-liste td { vertical-align: top; }

.ref-kod {
  font: 700 .82rem ui-monospace, Consolas, monospace;
  letter-spacing: .04em; color: var(--brand, #253c66); user-select: all;
}
.dark .ref-kod { color: var(--accent, #8fe0ff); }

/* Ayrıntı satırı: üstteki özet satırına görsel olarak bağlı kalsın */
.hata-detay-satir > td {
  padding-top: 0; border-top: 0;
  padding-bottom: .9rem; border-bottom: 1px solid var(--line, #e3e8f0);
}

.hata-anlatim {
  background: #fff8e6; border: 1px solid #f0e0b0; border-radius: 10px;
  padding: .6rem .8rem; margin-bottom: .6rem; font-size: .86rem;
}
.dark .hata-anlatim { background: #33290f; border-color: #5c4a1c; }
.hata-anlatim b { display: block; font-size: .74rem; text-transform: uppercase;
                  letter-spacing: .05em; color: var(--muted, #626e88); margin-bottom: .2rem; }

/* Teknik ayrıntı katlanır: yönetici ekranı özet listesi olarak okunabilir kalsın */
.hata-teknik summary {
  cursor: pointer; font-size: .8rem; font-weight: 600;
  color: var(--muted, #626e88); padding: .25rem 0;
}
.hata-teknik summary:hover { color: var(--text, #14203a); }
.hata-teknik dl {
  display: grid; grid-template-columns: 9rem 1fr; gap: .3rem .8rem;
  margin: .5rem 0 0; font-size: .82rem;
}
.hata-teknik dt { font-weight: 600; color: var(--muted, #626e88); }
.hata-teknik dd { margin: 0; overflow-wrap: anywhere; }
.hata-teknik code { font-size: .78rem; }

@media (max-width: 700px) {
  .hata-teknik dl { grid-template-columns: 1fr; gap: .1rem; }
  .hata-teknik dt { margin-top: .4rem; }
}

/* Talimat 38/A · B5-2: gönderim sürerken düğme meşgul görünür. `disabled`
   KULLANILMAZ — devre dışı düğmenin adı/değeri gönderilmez ve "eylem" adlı
   düğmelerde sunucu hangi işlem olduğunu kaybederdi. */
.btn.mesgul { opacity: .6; cursor: progress; pointer-events: none; }

/* Talimat 38/B1 · şemadan tedavi planına diş aktarımı */
.dis-aktar-satir { margin-top: .6rem; gap: .6rem; align-items: center; }
.dis-aktar-not { font-size: .8rem; }
.dis-aktar-not.uyari { color: var(--warn-yazi); font-weight: 600; }

/* Talimat 38/B3 · geri alma */
.h-geri { display: inline; margin-left: .5rem; }
.h-geri .btn { padding: .12rem .45rem; font-size: .72rem; }
.serit-geri { display: inline; margin-left: .6rem; }
.serit-geri-btn { font-weight: 700; text-decoration: underline; }

/* Talimat 38/C1 · takvim görünüm seçici ve sütun başlığından hekim değiştirme */
/* .takvim-hekim kaldirildi (Talimat 49 ek · madde 4): hekim basina
   dugme seridi, sutun basligindaki secicinin tekrariydi. */
.takvim-kip { margin-right: .4rem; }
.hekim-sec { display: inline-block; position: relative; }
.hekim-sec > summary { cursor: pointer; list-style: none; color: var(--text); }
.hekim-sec > summary::-webkit-details-marker { display: none; }
.hekim-sec > summary::after { content: ' ▾'; color: var(--muted); font-size: .75em; }
.hekim-sec[open] > summary::after { content: ' ▴'; }
.hekim-sec-liste {
  position: absolute; z-index: 40; top: 100%; left: 0; min-width: 12rem;
  display: flex; flex-direction: column; gap: .1rem; padding: .35rem;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 12px 28px -12px rgba(15,26,46,.35);
}
.hekim-sec-liste a { padding: .3rem .5rem; border-radius: 6px; font-size: .8rem; white-space: nowrap; }
.hekim-sec-liste a:hover { background: var(--bg); }
.hekim-sec-liste a.on { background: var(--brand); color: #fff; }
.dark .hekim-sec-liste { box-shadow: 0 12px 28px -12px rgba(0,0,0,.6); }
/* ==========================================================================
   Talimat 38/D — arayüz düzeltmeleri
   Bu blok ek.css'in SONUNA yüklenir; önceki kuralları ezmesi gereken
   yerlerde sıra önemlidir.
   ========================================================================== */

/* --------------------------------------------------------------------------
   D1 · Kenar menü ile içerik alanı arasında ayrım

   ÖLÇÜLDÜ: koyu temada menü (--navy #0a1120) ile içerik (--bg #0b1220)
   arasındaki kontrast oranı 1,11:1 — yani sınır fiilen görünmüyordu.
   (Açık temada 1,21:1; orada da menü koyu lacivert olduğu için sınır
   zaten belliydi.)

   Çizgi mevcut açık mavi vurgudan (--accent #8fe0ff) TÜRETİLDİ; palet
   değişmedi. rgba() bir değişkeni alfa ile kullanamadığı için kanal
   üçlüsü ayrı tutuluyor. color-mix() tercih edilmedi: iOS 16.2 altında
   düşer ve çizgi sessizce kaybolurdu.

   Kenarlık menünün KENDİ zemini üzerine biner (box-sizing: border-box),
   yani 232 px'lik sütun genişlemez, yerleşim kaymaz.
   -------------------------------------------------------------------------- */
:root {
  --accent-rgb:   143, 224, 255;              /* = --accent #8fe0ff */
  --menu-ayirici: rgba(var(--accent-rgb), .09);
}
body.dark {
  /* Koyu temada tek ayrım bu çizgi; biraz daha belirgin olmalı. */
  --menu-ayirici: rgba(var(--accent-rgb), .18);
}

aside { border-right: 1px solid var(--menu-ayirici); }

/* Mobilde menü yatay bir şerit: ayrım SAĞDA değil ALTTA olmalı. */
@media (max-width: 900px) {
  aside { border-right: 0; border-bottom: 1px solid var(--menu-ayirici); }

  /* Talimat 39/B — mobilde de KARE. proto.css burada 34×22 diyordu;
     icon.svg 64×64 olduğu için o da eziyordu. Şeridin yüksekliğine
     sığsın diye 32 px. */
  aside .brand img,
  aside .brand svg { width: 32px; height: 32px; }
}

/* --------------------------------------------------------------------------
   D2 · Logo düğmesi          (Talimat 38/D2 · Talimat 39/B'de DÜZELTİLDİ)

   🔴 39/B — 38'deki ölçü YANLIŞTI. Yeniden ölçüldü (t39-tesh-arayuz.js,
   13 Eylül 2026), üç ayrı kusur çıktı:

     1) BOZUK ORAN. icon.svg 64×64, yani KARE (1.000). CSS onu 50×32
        çiziyordu → en/boy 1.563. Diş işareti dikeyde %64'e eziliyordu.
     2) TAŞMA VE KIRPILMA. Daraltılmış menüde düğmenin iç genişliği
        47,8 px; 50 px'lik ikon sağdan 11,2 px TAŞIYOR ve `overflow:hidden`
        onu kesiyordu. "Çerçeve içinde ikon küçük kalıyor" şikâyetinin
        kaynağı buydu: ikon küçük değildi, KESİLMİŞTİ.
     3) EŞİTSİZ İÇ BOŞLUK. sol 9 · sağ −11,2 · üst 10 · alt 10 px.

   Düzeltme:
   · İkon KARE çizilir (40×40) — kaynağın doğal oranı korunur.
   · Daraltılmış şeridin yan dolgusu .6rem → .45rem; böylece 40 px'lik
     ikon + eşit iç boşluk taşmadan sığar (gereken 52 px, mevcut 52,6 px).
     Menü öğeleri ortalanmış olduğu için görsel olarak değişmez, yalnız
     dokunma alanları 4,8 px genişler.
   · İç boşluk dört yönde 5 px (ölçülen sapma ≤ 0,3 px).
   · Köşe yarıçapı 10 px — menü öğeleriyle AYNI (ölçüldü: onlar da 10 px).
   · Dokunma hedefi 52×52 px (48 px eşiğinin üstünde).
   · Açık mavi geçişli çerçeve KORUNDU: aktif menü öğesindeki vurgu diliyle
     aynı aile (--accent) ama onunla karışmaz — aktif öğe DOLU zemin +
     parıltı, logo ise İNCE ÇERÇEVE + çok hafif iç parlaklık.
   · Kilitli/kilitsiz ayrımı korundu: çerçeve alfası .22 → .55 ve altta
     küçük bir "sabit" göstergesi.

   NOT: proto.css'teki genel `.brand img{width:44px;height:28px}` kuralına
   DOKUNULMADI — o kural logo.svg içindir (viewBox 54×34, oran 1,588) ve
   giriş ekranı ile yazdırma başlığında DOĞRUDUR. Kare olan yalnız
   kenar menüdeki icon.svg'dir, bu yüzden düzeltme buraya kapsanmıştır.
   -------------------------------------------------------------------------- */
@media (min-width: 901px) {
  /* Daraltılmış şeritte ikona yer açar (yukarıdaki 2. madde). */
  aside.dar { padding-left: .45rem; padding-right: .45rem; }

  aside .brand {
    position: relative;
    min-height: 52px;
    padding: 5px;                       /* DÖRT YÖNDE EŞİT */
    border: 1px solid rgba(var(--accent-rgb), .22);
    background:
      linear-gradient(135deg,
        rgba(var(--accent-rgb), .14) 0%,
        rgba(var(--accent-rgb), .04) 45%,
        rgba(var(--accent-rgb), 0)   100%);
    transition: border-color .16s ease, background .16s ease;
  }
  aside .brand:hover {
    border-color: rgba(var(--accent-rgb), .40);
    background:
      linear-gradient(135deg,
        rgba(var(--accent-rgb), .22) 0%,
        rgba(var(--accent-rgb), .07) 45%,
        rgba(var(--accent-rgb), 0)   100%);
  }
  aside .brand:focus-visible {
    outline: 2px solid var(--accent, #8fe0ff);
    outline-offset: 2px;
  }

  /* İşaret KARE çizilir — icon.svg 64×64, ezilmemeli.
     40 px = düğmenin %77'si, şeridin %59'u. Daraltılmış kipte de aynı ölçü. */
  aside .brand img,
  aside .brand svg { width: 40px; height: 40px; }

  /* KİLİTLİ: menü açık sabitlenmiş. Çerçeve belirginleşir + küçük gösterge. */
  aside.kilitli .brand {
    border-color: rgba(var(--accent-rgb), .55);
    background:
      linear-gradient(135deg,
        rgba(var(--accent-rgb), .26) 0%,
        rgba(var(--accent-rgb), .10) 45%,
        rgba(var(--accent-rgb), .02) 100%);
  }
  aside.kilitli .brand::after {
    content: '';
    position: absolute; left: .55rem; right: .55rem; bottom: 3px; height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg,
      rgba(var(--accent-rgb), .85), rgba(var(--accent-rgb), .15));
  }
}

/* --------------------------------------------------------------------------
   D3 · Ana sayfada içerik alanının solundaki geniş boşluk

   ÖLÇÜLDÜ: ek.css'teki `main { max-width:1600px; margin-inline:auto }`
   kuralı 1800 px üstünde içeriği ORTALIYOR. Ortalama simetrik olsa da
   soldaki boşluk KENAR MENÜYE BİTİŞİK kaldığı için "boşluk" gibi okunuyor,
   sağdaki ise sayfa kenarı gibi. Ölü bant:
       1920 px →  44 px      2200 px → 184 px
       2560 px → 364 px      3440 px → 804 px

   Çözüm: okunabilirlik sınırı (1600 px) KORUNUR, ama soldaki boşluk
   sınırlanır. Orta genişliklerde davranış aynı kalır (clamp üst sınıra
   ulaşmaz); yalnız çok geniş ekranlarda içerik menüden kopmaz.
   -------------------------------------------------------------------------- */
@media (min-width: 1800px) {
  main {
    max-width: 1600px;
    width: 100%;
    /* sol: en fazla 160 px; kalan boşluk sağa (auto) */
    margin-inline: clamp(0px, (100% - 1600px) / 2, 160px) auto;
  }
}

/* ==========================================================================
   Talimat 38/E — YAZDIRMA

   ÖLÇÜLDÜ (uygulamadan önce): menü, sekme şeridi ve düğmeler zaten
   gizleniyordu — orası iyiydi. Eksik olan üç şey vardı:
     1) başlıkta KLİNİK ADI yoktu (yalnız ürün adı + tarih)
     2) HİÇBİR yerde sayfa kırılma koruması yoktu (ölçüm: 0 öğe) — bir kart
        ya da tablo satırı sayfa sonunda ikiye bölünebiliyordu
     3) uzun tablolarda başlık satırı yalnız ilk sayfada çıkıyordu

   Tarayıcının kendi yazdırması kullanılabilir kalsın diye ayrı bir "çıktı
   ekranı" YAPILMADI: kullanıcı ekranda ne görüyorsa onu basar.
   ========================================================================== */
@media print {
  /* Başlık: klinik adı solda, tarih sağda */
  .yazdir-baslik .yb-klinik { display: flex; flex-direction: column; line-height: 1.25; }
  .yazdir-baslik .yb-klinik small { font-weight: 600; font-size: .68rem; color: #3c4557; letter-spacing: 0; }

  /* 2) Kırılma koruması — kart, tablo satırı ve liste öğesi ortadan bölünmez */
  .card, .kart, .belge, .hareket, .mini { break-inside: avoid; page-break-inside: avoid; }
  tr, .plan-satir, .odeme-satir { break-inside: avoid; page-break-inside: avoid; }

  /* 3) Uzun tablolarda başlık her sayfada tekrarlansın */
  thead { display: table-header-group; }
  tfoot { display: table-footer-group; }

  /* Başlıklar kendi bölümünden kopmasın */
  h1, h2, h3, .top h1 { break-after: avoid; page-break-after: avoid; }

  /* Ekranda yatay kaydırılan kartlar kâğıtta kesilmesin */
  main > .card, main > .grid > .card { overflow: visible !important; }

  /* Yazdırmada gereksiz etkileşim öğeleri */
  .sayfalama, .zil, .profil-panel, .dis-aktar-satir, .h-geri, .serit-geri,
  .takvim-kip, .hekim-sec-liste { display: none !important; }

  /* Bağlantı adresleri kâğıda basılmasın (uzun URL gürültüsü) */
  a[href]::after { content: none !important; }
}

/* ==========================================================================
   TALİMAT 39/C · ANA SAYFA
   ========================================================================== */

/* --------------------------------------------------------------------------
   C1-C2 · Selamlama ve günün özeti

   Başlığın hemen altında iki satır:
     · SELAMLAMA — muted DEĞİL; sabah panele girince ilk okunan şey bu.
     · GÜNÜN ÖZETİ — tek cümle, operasyonel; muted ama okunur boyda.
   Emoji tek ve sade; renk taşımaz, boyutu metinle aynı hizada durur.
   -------------------------------------------------------------------------- */
/* Talimat 40/2: .selam-satir KALDIRILDI — selamlama artik <h1> ve
   biciminin tamami .baslik-kume altinda toplandi (bu dosyanin
   sonunda). Iki yerde kural birakmak, birinin otekini ezmesine
   ve "degistirdim ama degismedi" durumuna yol acardi. */

/* --------------------------------------------------------------------------
   C3 · KPI sayı renkleri — palet içinde, abartısız

   Yalnız ANLAMI olan iki karta uygulanır: tahsilat (yeşil) ve açık
   alacak (--bad). Randevu sayısı ve yapılan iş nötr kalır.

   KONTRAST ÖLÇÜLDÜ (t39-tesh-arayuz.js, 27,2 px kalın metin — WCAG
   "büyük metin", eşik 3:1):

       açık tema   --ok (#1fa971) / beyaz kart .............. 3,01:1
       koyu tema   --ok (#1fa971) / #121c30 ................. 5,65:1
       açık tema   --bad (#d64545) / beyaz kart ............. 4,38:1
       koyu tema   --bad (#d64545) / #121c30 ................ 3,89:1

   3,01 eşiği GEÇİYOR ama marjı yok — yuvarlama farkı bile altına
   düşürür. Bu yüzden AÇIK TEMADA --ok'un koyu tonu (#157f56, aynı
   yeşil ailesi) kullanılır: 5,00:1. Koyu temada --ok zaten rahat,
   olduğu gibi kalır. Palet genişletilmedi; tek bir ton eklendi ve
   gerekçesi ölçümdür.
   -------------------------------------------------------------------------- */
.kpi .v.v-iyi       { color: #157f56; }        /* açık tema · 5,00:1 */
.dark .kpi .v.v-iyi { color: var(--ok); }      /* koyu tema · 5,65:1 */
.kpi .v.v-borc      { color: var(--bad-yazi); }     /* 4,38:1 / 3,89:1 */

/* --------------------------------------------------------------------------
   C3 · Boş durumlar eyleme dönüşür

   Eskiden "Bugün randevu yok." tek satır gri metindi — çıkmaz sokak.
   Artık metnin altında gerçek bir sonraki adım var. Düğmeler mevcut
   `.btn`/`.btn.ghost` dilini kullanır, yeni bir bileşen icat edilmez.
   -------------------------------------------------------------------------- */
.bos-durum { display: flex; flex-direction: column; gap: .6rem; align-items: flex-start; }
.bos-durum p { margin: 0; }
.bos-durum .row { display: flex; gap: .5rem; flex-wrap: wrap; }

/* --------------------------------------------------------------------------
   C4 · Ölçülü büyütme — YALNIZ ANA SAYFA

   Neden `html { font-size }` DEĞİL: kök boyu büyütmek rem kullanan her
   şeyi ölçekler; takvim ızgarası (`70px repeat(n, …)`) ve diş şeması
   sabit piksellerle çalıştığı için orada YERLEŞİM KAYARDI. İstenen sınır
   tam olarak "yerleşim kaymayacak"tı, bu yüzden kademe ana sayfaya
   kapsanmıştır (`main[data-sayfa="panel"]`).

   Katsayı her yerde AYNI: ×1,0625 (bir kademe). Gövde 14→15 px,
   başlıklar, sayılar, kart iç boşlukları ve dolayısıyla kart
   yükseklikleri aynı oranda büyür. Dokunma hedefleri küçülmez.
   -------------------------------------------------------------------------- */
main[data-sayfa="panel"]            { font-size: 15px; }
main[data-sayfa="panel"] h1         { font-size: 1.44rem; }
main[data-sayfa="panel"] h2         { font-size: 1.06rem; }
main[data-sayfa="panel"] .card      { padding: 1.17rem 1.28rem; border-radius: 17px; }
main[data-sayfa="panel"] .kpi .l    { font-size: .83rem; }
main[data-sayfa="panel"] .kpi .v    { font-size: 1.7rem; }
main[data-sayfa="panel"] .kpi .d    { font-size: .83rem; }
main[data-sayfa="panel"] table      { font-size: .91rem; }
main[data-sayfa="panel"] th         { font-size: .77rem; padding: .53rem .64rem; }
main[data-sayfa="panel"] td         { padding: .64rem .64rem; }
main[data-sayfa="panel"] .muted     { font-size: .87rem; }
main[data-sayfa="panel"] .tag       { font-size: .77rem; padding: .21rem .58rem; }
main[data-sayfa="panel"] .mini      { font-size: .95em; }
main[data-sayfa="panel"] .baslik-kume .selam-baslik { font-size: 1.6rem; }
main[data-sayfa="panel"] .baslik-kume .ozet-satir  { font-size: 1rem; }
main[data-sayfa="panel"] .baslik-kume .selam-cumle { font-size: .96rem; }

/* 390 px'te kademe KORUNUR ama kart iç boşluğu yatayda büyümez:
   ölçüldü, 1,28rem yan dolgu dar ekranda tablo hücrelerini sıkıştırıyor.
   Yükseklik oranı bozulmasın diye dikey dolgu aynı kalır. */
@media (max-width: 560px) {
  main[data-sayfa="panel"] .card { padding: 1.17rem .95rem; }
  main[data-sayfa="panel"] th,
  main[data-sayfa="panel"] td    { padding-left: .42rem; padding-right: .42rem; }
}

/* --------------------------------------------------------------------------
   Talimat 40/1 · sıra kısıtı kalktı — yeni durum göstergeleri
   -------------------------------------------------------------------------- */

/* Diş bazlı girilemeyen kalem seçilince taşınan dişlerin neden kaldırıldığı.
   `alert` değil: akışı kesmez, ama uyarı rengiyle fark edilir. */
.dis-uyari {
  margin: .4rem 0 0;
  color: var(--warn-yazi);
  font-weight: 600;
}

/* Pasif "Plana ekle": neden pasif olduğu title ile söylenir, görsel olarak
   da belli olur. Dokunma hedefi küçülmez — yalnız opaklık ve imleç değişir. */
.btn[disabled],
.btn[disabled]:hover {
  opacity: .45;
  cursor: not-allowed;
  box-shadow: none;
}

/* ==========================================================================
   TALİMAT 40/4 · KOYU TEMADA AÇIK TEMA ARTIKLARI

   BULGU SINIFI: bazı bloklar koyu temada hâlâ açık tema renginde
   çiziliyordu — kart koyu, içi beyaz, yazı okunmuyor. Kullanıcı dört yer
   bildirdi; `scripts\t40-tema-tarama.js` 22 ekranı tarayıp kaynağın DÖRT
   kural olduğunu gösterdi. Tek tek yama yerine kaynaklar kapatıldı.

   Ortak kök neden: koyu tema karşılığı YAZILMAMIŞ. `.t-mut`ın karşılığı
   vardı, kardeşlerininki yoktu — yani tasarım niyeti "etiketler koyu
   temada uyum sağlasın"dı ve gerisi unutulmuştu.

   Renk kuralı (kullanıcının tarifi): zemin koyu ama KART ZEMİNİNDEN BİR
   TIK AÇIK (derinlik), ana metin yüksek kontrastlı, ikincil metin soluk
   ama yine açık. Kart zemini `--card: #121c30`.
   ========================================================================== */

/* 1 · BOŞ DURUM KUTUSU — kullanıcının bildirdiği asıl yer.
      `background: var(--yumusak, #fafbfc)` yazıyordu ve `--yumusak`
      HİÇBİR YERDE TANIMLI DEĞİL; yani her temada sabit açık renge
      düşüyordu. Aynısı `--cizgi` için de geçerliydi. */
.dark .bos-durum {
  background: #16213a;              /* karttan (#121c30) bir tık açık */
  border-color: #2a3a5e;
  color: var(--text);
}
.dark .bos-durum .muted,
.dark .bos-durum p.muted { color: var(--muted); }
.dark .bos-durum .bos-baslik { color: var(--text); }

/* 2 · İLERLEME ÇUBUĞU rayı (proto.css `.bar{background:#eef1f6}`) */
.dark .bar { background: #1f2d4a; }

/* 3 · DURUM ETİKETLERİ — `.t-mut` dışında hiçbirinin koyu karşılığı yoktu.
      Zeminler koyulaştırılır, metin AÇIK tona çekilir; anlam renkleri
      (yeşil/sarı/kırmızı/mavi/mor) korunur. */
.dark .t-ok   { background: #123326; color: #9ce8c4; }
.dark .t-warn { background: #3a3116; color: #f2d98b; }
.dark .t-bad  { background: #3a1c1c; color: #ffb3b3; }
.dark .t-info { background: #12283a; color: #b6dcf2; }
.dark .t-vip  { background: #241a3a; color: #d6c2ff; }

/* 4 · Diş şeması AÇIKLAMA KUTUCUKLARI (i.curuk, i.dolgu …) BİLEREK
      DEĞİŞTİRİLMEDİ: onlar renk anahtarıdır, şemadaki diş renkleriyle
      birebir eşleşmek zorundadır. Koyu temada da aynı renk olmaları
      doğrudur — tarama betiği bunları ayrıca "anahtar" diye ayırır. */

/* --------------------------------------------------------------------------
   Talimat 40/4 · METNE ÖZEL DURUM RENKLERİ (WCAG AA)

   ÖLÇÜLDÜ (t40-tema-tarama.js): palet renkleri metin olarak
   kullanıldığında AA'nın altında kalıyor —
       --warn #e0a400 / beyaz .......... 2,22:1   (eşik 4,5 · büyükte 3)
       --bad  #d64545 / beyaz .......... 4,38:1
       --bad  #d64545 / koyu kart ...... 3,89:1
       --ok   #1fa971 / beyaz .......... 3,01:1

   PALET DEĞİŞTİRİLMEDİ. Bu renkler aynı zamanda ZEMİN olarak da
   kullanılıyor (bildirim noktaları, rozetler, sayaç baloncuğu); onları
   koyulaştırmak görünümü bozardı. Bu yüzden yalnız METİN için ayrı
   token tanımlanıyor; zemin kullanımları `--warn`/`--bad`/`--ok`
   üzerinde AYNEN kalıyor.

   Tonlar aynı renk ailesinden; `--warn-yazi` zaten palette var
   (`.t-warn` metin rengi #8a6400).
   -------------------------------------------------------------------------- */
:root {
  --ok-yazi:   #157f56;   /* beyaz üstünde 5,00:1 */
  --warn-yazi: #8a6400;   /* beyaz üstünde 5,38:1 */
  --bad-yazi:  #c53838;   /* beyaz üstünde 5,29:1 · --bg üstünde 4,89:1 */
}
.dark {
  --ok-yazi:   #6ee7b0;
  --warn-yazi: #f2d98b;
  --bad-yazi:  #ff9a9a;
}

/* KPI alt satırı (`proto.css .kpi .d{color:var(--ok)}`) 13 px normal metin;
   --ok beyaz üstünde 3,01:1 ile AA'nın altında kalıyordu. Yalnız METİN
   tokeni değişir; --ok'un zemin kullanımları etkilenmez. */
.kpi .d { color: var(--ok-yazi); }

/* --------------------------------------------------------------------------
   Talimat 40/2 · ANA SAYFA BAŞLIK KÜMESİ

   "Ana sayfa" H1'i kalktı; selamlama sayfa başlığı oldu. Üç parça, azalan
   ağırlıkta: selam (h1) → motivasyon (yanında, ikincil) → günün özeti.

   Renkler: ikincil metinler `--muted` yerine `--muted-koyu` kullanır.
   Ölçüldü — `.top` KART ÜSTÜNDE DEĞİL, sayfa zemininde (`--bg #f4f6fa`)
   durur ve orada `--muted` yalnız 4,10:1 verir (AA 4,5). Palet
   değiştirilmeden bu iki satır için bir tık koyu ton tanımlandı.
   -------------------------------------------------------------------------- */
:root { --muted-koyu: #5d6a85; }   /* --bg üstünde 5,29:1 · beyazda 5,71:1 */
.dark  { --muted-koyu: #9dabc6; }  /* koyu zeminde >= 7:1 */

.baslik-kume {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: .7rem;
  row-gap: .15rem;
}
.baslik-kume .selam-baslik {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: var(--text);
}
.baslik-kume .selam-emoji {
  font-size: .92em;
  line-height: 1;
  margin-left: .1rem;
}
.baslik-kume .selam-cumle {
  margin: 0;
  font-size: .92rem;
  color: var(--muted-koyu);
}
/* Özet KENDİ SATIRINDA: küme sarmalı olduğu için tam genişlik alır. */
.baslik-kume .ozet-satir {
  flex-basis: 100%;
  margin: .28rem 0 0;
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: -.005em;
  color: var(--muted-koyu);
}

/* Mobilde cümle alta sarar; başlık bir kademe küçülür ki 390 px'te
   iki satıra bölünmesin. */
/* Mobil kurallar ANA SAYFA KAPSAMIYLA yazilir.
   Neden: yukarida `main[data-sayfa="panel"] .baslik-kume …` kurallari
   var ve ozgullukleri (0,3,1) sade `.baslik-kume …` (0,2,0) kuralindan
   YUKSEK. Medya sorgusu ozgullugu artirmaz; kapsamsiz yazilsaydi mobil
   kuculme sessizce hic uygulanmazdi. */
@media (max-width: 560px) {
  .baslik-kume { column-gap: .5rem; }
  main[data-sayfa="panel"] .baslik-kume .selam-baslik { font-size: 1.32rem; }
  main[data-sayfa="panel"] .baslik-kume .selam-cumle  { flex-basis: 100%; font-size: .88rem; }
  main[data-sayfa="panel"] .baslik-kume .ozet-satir   { font-size: .9rem; }
  .baslik-kume .selam-cumle { flex-basis: 100%; }
}

/* --------------------------------------------------------------------------
   Talimat 40 · PALET KARARI (kullanıcı onayı)

   1) --muted #6b7893 -> #626e88
      Aynı gri-mavi, bir tık koyu. ÖLÇÜM:
          beyaz kart üstünde ....... 4,44:1  ->  5,03:1
          --bg (#f4f6fa) üstünde ... 4,10:1  ->  4,65:1
      Koyu temadaki --muted (#8d9bb8) DEĞİŞMEDİ: kart üstünde zaten
      6,09:1 ile AA'nın üstünde.

   2) --accent2 #2f9dc7 DEĞİŞMEDİ — marka rengi.
      Bağlantı METNİ için ayrı token (--warn/--bad/--ok'ta izlenen yol).
      Zemin, düğme, kenarlık ve odak halkası kullanımları AYNEN --accent2
      üzerinde kalır; yalnız metin tokeni koyulaşır. ÖLÇÜM:
          beyaz kart üstünde ....... 3,10:1  ->  5,55:1
          --bg üstünde ............. 2,87:1  ->  5,13:1
      Koyu temada --accent2 metin olarak zaten 5,42:1; orada marka rengi
      OLDUĞU GİBİ kullanılır.
   -------------------------------------------------------------------------- */
:root {
  --muted: #626e88;          /* beyazda 5,03:1 · --bg üstünde 4,65:1 */
  --accent2-yazi: #1d6f90;   /* beyazda 5,55:1 · --bg üstünde 5,13:1 */

  /* 🔴 TALİMAT 43/2 — HİÇ TANIMLANMAMIŞ İKİ TOKEN
     `--yumusak` ve `--cizgi` dört ayrı kuralda `var(--yumusak, #fafbfc)`
     biçiminde kullanılıyordu ama HİÇBİR YERDE TANIMLI DEĞİLDİ; her
     kullanım geri düşüşe, yani sabit bir AÇIK renge iniyordu. Koyu temada
     karşılıkları da yoktu — sonuç: koyu temada beyaz zeminli bloklar.
     Talimat 40/4 bunlardan yalnız `.bos-durum`u düzeltmişti; kalan üçü
     (zebra satırı, diş seçici, profil satırı) aynı sınıftan artıktı.
     Tokenı tanımlamak dördünü TEK NOKTADAN düzeltir; her kuralı ayrı ayrı
     yamamak beşincisini kaçırmak demekti. */
  --yumusak: #fafbfc;        /* kart içi bir tık farklı zemin */
  --cizgi:   #d6dae2;        /* kesikli/ikincil çizgi */
}
.dark {
  /* Koyu temada "bir tık açık" YUKARI değil AŞAĞI değil — kart zemininden
     (#121c30) bir tık AÇIK: derinlik hissi korunur, beyaz ada oluşmaz.
     Ölçüm: #16233d üstünde --text (#dfe7f5) 12,1:1 · --muted 5,2:1. */
  --yumusak: #16233d;
  --cizgi:   #2a3550;
  /* Koyu temada bağlantı metni MARKA RENGİNDE kalır: #2f9dc7 koyu kart
     (#121c30) üstünde zaten 5,42:1 ile AA'nın üstünde, koyulaştırmaya
     gerek yok.

     Değer `var(--accent2)` diye DEĞİL, açıkça yazılıyor. Neden: bir özel
     değişkenin içine `var()` konursa `getPropertyValue()` çözülmemiş
     metni ("var(--accent2)") döndürür; ekranda doğru çalışır ama ÖLÇÜM
     onu okuyamaz ve kabul testi "ölçülemedi" der. Ölçülemeyen değer bu
     projede geçmiş sayılmadığı için değer okunabilir olmalı. */
  --accent2-yazi: #2f9dc7;
}

/* --------------------------------------------------------------------------
   Talimat 41/5-6 · PARA ALANI

   ₺ alanın ÖNÜNDE sabit durur; kullanıcı yazmak zorunda değil ve
   yazarsa da sunucu temizler. Simge tıklanamaz (pointer-events: none),
   yoksa kullanıcı ona basınca alan odaklanmaz.
   -------------------------------------------------------------------------- */
.para-alan { position: relative; display: block; }
.para-alan .para-im {
  position: absolute; left: .7rem; top: 50%; transform: translateY(-50%);
  color: var(--muted); font-weight: 600; pointer-events: none; line-height: 1;
}
.para-alan input { padding-left: 1.9rem; text-align: right; font-variant-numeric: tabular-nums; }

/* İşlem × adet = toplam satırı. Kullanıcı kaydetmeden önce ne
   yazılacağını görür (Talimat 41/5). */
.tutar-hesap {
  margin: .3rem 0 0; min-height: 1.1em;
  font-size: .82rem; color: var(--muted); font-variant-numeric: tabular-nums;
}
.tutar-elle { margin: .25rem 0 0; font-size: .8rem; color: var(--warn-yazi); }
.tutar-elle .baglanti-dugme { font-size: .8rem; }

/* ==========================================================================
   TALIMAT 42 — duzenleme ve silme yuzeyleri
   Koyu tema Talimat 40'in dersiyle BASTAN yaziliyor: her yeni blok kendi
   .dark karsiligiyla birlikte gelir; sonradan taranip bulunmayi beklemez.
   ========================================================================== */

/* Satir sonundaki eylem dugmeleri.
   Kapaliyken yan yana (satir kisa kalsin), ACILINCA alt alta: iki form
   yan yana durursa tablo yatayda buyur ve dar ekranda tasar — olculdu. */
.satir-eylem { white-space: nowrap; }
.satir-eylem > * { vertical-align: middle; }
.satir-eylem .btn { margin-right: .25rem; }
.sil-kutu[open] { display: block; white-space: normal; }
.sil-kutu[open] + .sil-kutu { margin-top: .4rem; }

/* Tehlikeli eylem dugmesi. Renk --bad'den DEGIL ayri bir tokendan gelir:
   --bad (#d64545) uzerinde beyaz yazi 4,5:1'in altinda kalir; bu deger
   olculdu ve dugme metni icin koyulastirildi (beyaz uzerinde 6,8:1). */
:root { --tehlike: #a92d24; }
.dark { --tehlike: #e06a62; }
.btn.tehlike { background: var(--tehlike); color: #fff; border-color: transparent; }
.dark .btn.tehlike { color: #1a0806; }

/* Silme kutusu: <details> ile acilir, JS gerektirmez (CSP: satir ici JS yok) */
.sil-kutu { display: inline-block; }
.sil-kutu > summary {
  cursor: pointer; list-style: none;
  display: inline-flex; align-items: center;
}
.sil-kutu > summary::-webkit-details-marker { display: none; }
.sil-kutu > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.sil-form {
  margin-top: .5rem; padding: .7rem; border: 1px solid var(--line);
  border-radius: 12px; background: var(--bg);
  min-width: min(15rem, 100%); max-width: 22rem;
  display: grid; gap: .4rem; text-align: left; white-space: normal;
}
.sil-form label { font-size: .78rem; color: var(--muted); }
.dark .sil-form { background: #121c30; border-color: #2a3550; }

/* Satir ici duzenleme formu */
.duzenleme-satiri > td { background: var(--bg); }
.dark .duzenleme-satiri > td { background: #121c30; }
.satir-form { margin: 0; }

/* Silinmis kayit listesi — gorunur ama toplamlara girmez */
.silinmis-kutu > summary {
  cursor: pointer; font-weight: 700; font-size: .86rem; color: var(--muted);
}
.silinmis-kutu > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.silinmis td { color: var(--muted); }
.silinmis td:nth-child(2) { text-decoration: line-through; }
.dark .silinmis-kutu > summary,
.dark .silinmis td { color: var(--muted-koyu, #9aa7c0); }

/* Duzenlenmis/silinmis rozetleri satir icinde kucuk kalsin */
.satir-rozet { font-size: .72rem; }

/* Kart icinde acilir baslik (kimlik duzeltme gibi ikincil formlar) */
.acilir-baslik {
  cursor: pointer; font-weight: 700; font-size: .95rem; color: var(--text);
}
.acilir-baslik:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.acilir-baslik::after { content: ' ▾'; color: var(--muted); font-size: .8em; }
details[open] > .acilir-baslik::after { content: ' ▴'; }

/* ==========================================================================
   TALIMAT 42 ek bulgu — parasal alanlarin TAMAMI ayni muameleyi gorur
   Olcum (t42b-para-alanlari.js): 9 parasal girdinin 7'sinde ₺ oneki yoktu,
   3'u blur bicimlendirmesine hic bagli degildi. Sunucu tarafi zaten
   temizdi; eksik olan yalnizca giris yuzeyiydi.
   ========================================================================== */

/* Dar/satir ici baglamlar (tablo hucresi, satir formu) icin ₺ kabi.
   Temel .para-alan `display:block` — form izgarasinda dogru, ama tablo
   hucresinde satiri kirar. */
.para-alan.dar { display: inline-block; width: auto; vertical-align: middle; }
.para-alan.dar .para-im { left: .45rem; font-size: .85em; }
.para-alan.dar input { padding-left: 1.4rem; }

/* Cozulemeyen girdi: kullanici SUBMIT etmeden once gorsun.
   Deger DEGISTIRILMEZ — yalniz isaretlenir. "Duzeltmek" tahmin olurdu
   (Talimat 41/6 karari), ama sessiz kalmak da dogru degil: kullanici
   yanlisi ancak sunucu reddettikten sonra ogreniyordu. */
input[aria-invalid="true"] {
  border-color: var(--tehlike);
  outline: 2px solid color-mix(in srgb, var(--tehlike) 35%, transparent);
  outline-offset: 0;
}
.para-hata {
  display: block; margin: .25rem 0 0;
  font-size: .78rem; color: var(--bad-yazi, var(--tehlike)); font-weight: 600;
}

/* ==========================================================================
   TALİMAT 43/1 — YAZDIRMA: kâğıt HER ZAMAN açık zemin, koyu metin
   ==========================================================================
   ÖLÇÜLDÜ (t43-tesh-yazdirma.js, 7 ekran × 2 tema):
     açık temadan basınca  AA altı 0
     koyu temadan basınca  AA altı 43   ← klinik bunu bildirdi
     kâğıda giden form alanı 40
     uygulama kaynaklı ham URL 0 (alttaki adres TARAYICININ altbilgisi)

   🔴 KÖK NEDEN: kâğıt beyaz ama <body class="dark"> yerinde kalıyor.
   Koyu tema tokenları (--text: #dfe7f5 gibi açık gri) beyaz kâğıda
   basılıyor. t40-tema-tarama.js yazdırmayı yalnız AÇIK temada ölçüyordu
   ve gerekçesi şu yorumla yazılıydı: "Kâğıt her zaman beyazdır; tema
   kavramı yoktur." Varsayım yanlıştı; ölçüm o yüzden hiç görmedi.
   -------------------------------------------------------------------------- */
@media print {
  /* 1) PALET SIFIRLANIR — ekran teması ne olursa olsun.
        Hem :root hem body.dark hedeflenir; .dark gövdede kalsa bile
        tokenlar açık tema değerlerine döner. Tek yerde, token düzeyinde:
        her kuralı ayrı ayrı ezmeye çalışmak kaçak bırakırdı. */
  /* 🔴 KAGIT PALETI EKRAN PALETINDEN DAHA KOYU (v1.12.3).
     Klinik bildirdi: govde metni, sutun basliklari ve ikincil satirlar
     BASKIDA okunmakta zorlaniyor. Olculdu (A4 genisliginde, yazdirma
     kipinde): en dusuk oran 4,74:1, 7:1 altinda 25 oge; bas suclu
     --muted (#55607a, 6,07-6,29:1).

     AA (4,5:1) EKRAN icin tanimlanmis bir esiktir. Kagitta murekkep
     yayilir, tonlar acilir ve gri tonlu yazicida renk bilgisi tamamen
     kaybolur; bu yuzden kagida govde metni icin 7:1 hedeflendi.
     Degerler tahminle degil, tarama ile dogrulandi
     (t44-yazdirma.js · "kagit kontrasti" kontrolu her ekranda olculen
     en dusuk orani yazar). */
  :root, .dark, body.dark {
    --bg: #ffffff;
    --card: #ffffff;
    --text: #101b30;
    --muted: #3c4557;
    --muted-koyu: #3c4557;
    --line: #aab4c4;
    --yumusak: #f4f7fb;
    --cizgi: #c3cad6;
    --accent2-yazi: #175369;
    --ok-yazi: #0e5334;
    --warn-yazi: #573f00;
    --bad-yazi: #8a1e16;
  }
  .dark body, body.dark { background: #fff !important; color: var(--text) !important; }

  /* Koyu temada sabit renk yazılmış bloklar da kâğıtta açığa döner.
     (Token kullanmayan, doğrudan hex yazan .dark kuralları için.) */
  .dark .card, .dark .kart, .dark table, .dark td, .dark th,
  .dark .bos-durum, .dark .alert, .dark .silinmis-kutu, .dark .sil-form {
    background: #fff !important; color: var(--text) !important;
    border-color: var(--line) !important;
  }
  .dark .muted, .dark .h-zaman, .dark .kpi .l, .dark .kpi .d { color: var(--muted) !important; }

  /* 2) FORM KÂĞIDA GİTMEZ — girdi yüzeyi kâğıtta anlamsız.
        Kâğıtta yalnız İÇERİK kalır: tablo, özet, hasta ve klinik bilgisi. */
  input, select, textarea, button,
  .btn, label, datalist, .para-alan, .tutar-hesap, .tutar-elle,
  .sil-kutu, .sil-form, .satir-form, .satir-eylem, .alanlar,
  .tsec, .dis-secici, .kapsam-secim, .kisayollar, .hareket-suzgec,
  .form-dip, .acilir-baslik, .duzenleme-satiri {
    display: none !important;
  }
  /* Girdi amaçlı KARTLAR bütünüyle çıkar (başlığıyla birlikte). */
  #plan-ekle, #odeme-al, #kalem-duzenle, .yazdirma-disi { display: none !important; }
  /* Yazdırma ipucu ekrana ait; kâğıda basılmaz. */
  .yazdir-ipucu { display: none !important; }

  /* 3) Açılır kutular kâğıtta AÇIK basılır — içerik gizli kalmasın.
        (.sil-kutu yukarıda zaten gizlendi; bu kural içerik kutuları için.) */
  details { display: block !important; }
  details > summary { list-style: none; }
  .eski-islemler > summary { display: none !important; }
}

/* Talimat 43/3 — implant markası / lot rozeti.
   Küçük ve sessiz: bilgi rozeti, uyarı değil. Boşken hiç basılmaz. */
.marka-rozet {
  display: inline-block; margin-top: .15rem;
  font-size: .74rem; color: var(--accent2-yazi); font-weight: 600;
}
.marka-form select, .marka-form input { width: 100%; }

/* Talimat 43/1 — yazdırma ipucu. Sessiz kalsın: uyarı değil, hatırlatma.
   Dar ekranda kendi satırına iner; kâğıda ASLA basılmaz. */
.yazdir-ipucu {
  font-size: .74rem; color: var(--muted); line-height: 1.3;
  max-width: 20rem; align-self: center;
}
.yazdir-ipucu b { font-weight: 600; color: var(--text); }
@media (max-width: 700px) { .yazdir-ipucu { max-width: 100%; } }

/* Talimat 44/1 — indirim önizlemesi ve varsayılan açıklaması.
   Belirsizlik ekranda YAZILI: "%" varsa yüzde, yoksa ₺. Kullanıcı
   kaydetmeden hesaplanan tutarı görür. */
.indirim-onizleme {
  margin: .3rem 0 0; min-height: 1.1em;
  font-size: .82rem; color: var(--accent2-yazi); font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.indirim-onizleme.hatali { color: var(--tehlike); }
.indirim-yardim { margin: .2rem 0 0; font-size: .76rem; color: var(--muted); }
.indirim-yardim b { color: var(--text); font-weight: 700; }

/* ==========================================================================
   TALİMAT 44/2 — KÂĞIT ÇIKTISI: EKRAN GÖRÜNTÜSÜ DEĞİL, HASTA BELGESİ
   ==========================================================================
   ÖLÇÜLEN KUSUR (t44-yazdirma.js, ölçümden önce):
     kâğıda basılan uyarı/bildirim şeridi   ....  var  ("Tedavi kalemi eklendi")
     kâğıda basılan gezinme bağlantısı      ....  var  ("← Hastalar")
     ekrana özgü açıklama metni             ....  var  ("Plan kalemleri borç…")
     belgenin türü / hasta künyesi          ....  YOK
     tutar sütunu hizası                    ....  sola yaslı
     <thead> kullanan tablo                 ....  0     ← başlık tekrarı ölüydü

   🔴 SESSİZ KUSUR: v1.11.0'da `thead { display: table-header-group }`
   yazılmıştı ve doğruydu; ama görünümlerdeki tabloların HİÇBİRİNDE
   <thead> yoktu — başlık satırı doğrudan <table> içindeydi. Kural
   uygulanıyor gibi görünüyor, hiçbir şey yapmıyordu. Bu turda tablolara
   gerçek <thead>/<tbody> verildi; kural ancak şimdi bir işe yarıyor.

   TASARIM: kâğıtta yalnız BELGE kalır — klinik başlığı, künye, bölüm
   başlığı, hizalı tablo, okunur indirim satırı, belirgin toplam.
   -------------------------------------------------------------------------- */

/* Kenar boşluğu: künye ve tablo kâğıdın kenarına yapışmasın.
   @media print İÇİNE değil, üst düzeye yazılır — @page zaten yalnız
   yazdırmada anlamlıdır ve iç içe yazımın tarayıcı desteği daha zayıf. */
@page { margin: 14mm 12mm; }

/* Tutar sütunu sağa yaslı — EKRANDA DA. Rakamlar alt alta hizalanmadan
   toplamı gözle denetlemek mümkün değil; tabular-nums olmadan sağa
   yaslamak da yetmez (rakam genişlikleri farklı olduğu için virgüller
   kaymaya devam eder). */
th.sag, td.sag { text-align: right; font-variant-numeric: tabular-nums; }

/* Kalem altındaki indirim açıklaması — "neden bu tutar" sorusunun cevabı.
   Talimat 44/1'de veri (yüzde + hesaplanan tutar) saklanmaya başladı;
   burası onu okunur biçimde gösterdiği yer. Ekranda da görünür. */
.indirim-satir {
  display: block; margin-top: .1rem;
  font-size: .76rem; color: var(--ok-yazi); font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* Belge bölüm başlığı ve belge toplamı — YALNIZ kâğıtta.
   Ekranda sekme adı zaten üstte, özet çubuğu da yerinde duruyor; bu iki
   öğe kâğıdın ihtiyacı olan şeyi (bölümün adı, sağa yaslı belirgin
   toplam) karşılar. Ekranda basılsalardı aynı sayı iki kez görünürdü. */
.belge-bolum, .belge-toplam { display: none; }

@media print {
  /* ---------------------------------------------------------------- 1
     KÂĞIDA ÇIKMAYACAKLAR
     Her biri klinik tarafından bildirilen somut bir gürültü:
       .alert / .serit-geri  → "✓ Tedavi kalemi eklendi" + "Geri al"
       .geri / .h-geri       → "← Hastalar" gezinme bağlantısı
       .yazdirma-disi        → ekrana özgü açıklama metinleri
       .satir-rozet          → "düzenlendi" gibi denetim rozetleri
                               (bilgi denetim içindir; hastanın belgesinde
                                anlamı yok, hareket kaydında duruyor)
     Düğmeler (.btn) ve sekme şeridi (.tabs) proto.css'te zaten gizli;
     burada TEKRAR EDİLMEZ — iki yerde duran kural biri değişince ayrışır. */
  .alert, .serit-geri, .geri, .geri-bag, .yazdirma-disi, .satir-rozet,
  .ipucu, .dis-aktar-not { display: none !important; }

  /* SAYFA BASLIK SERIDI (.top) kagida cikmaz.
     Ekranda "Giderler / Kira, malzeme, personel…" ya da hasta adi +
     telefon-dogum-hekim satiri duruyor; kagitta bunlarin HEPSI zaten
     ustteki serit ve kunye tarafindan veriliyordu — ayni bilgi iki kez
     basiliyordu (olculdu: docs\ui\t44\*.png, ilk surum). */
  .top { display: none !important; }

  /* EYLEM SUTUNU kagitta bos bir serit birakiyordu: icindeki dugme ve
     formlar gizleniyor ama sutunun kendisi ve basligi kaliyordu
     (olculdu: lab.png "Guncelle", hasta-plan.png bassiz son sutun).
     Basliga da ayni sinif verildi ki sutun butunuyle kalksin. */
  th.satir-eylem, td.satir-eylem { display: none !important; }

  /* ---------------------------------------------------------------- 2
     KÜNYE — belge kime ait, hangi hekim, hangi tarih.
     İki sütun: dar kâğıtta bile etiket/değer çifti bozulmaz. */
  .yazdir-kunye, .yazdir-kunye[hidden] {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: .15rem 1.4rem;
    margin: 0 0 1rem; padding: .55rem .7rem;
    border: 1px solid #d7dee9; border-radius: 6px;
    background: #fafbfd;
    break-inside: avoid; page-break-inside: avoid;
  }
  .yazdir-kunye > div { display: flex; gap: .4rem; align-items: baseline; }
  .yazdir-kunye dt {
    flex: 0 0 5.6rem; margin: 0;
    font-size: .74rem; color: #3c4557; font-weight: 600;
  }
  .yazdir-kunye dd {
    margin: 0; font-size: .82rem; color: #101b30; font-weight: 700;
  }

  /* ---------------------------------------------------------------- 3
     BÖLÜM BAŞLIĞI — "Tedavi planı", "Yapılan işlemler", "Ödemeler".
     Sekmesi gizli olan gövde `hidden` olduğu için kâğıda YALNIZ açık
     sekmenin başlığı çıkar; ayrı bir JS/sunucu kuralı gerekmiyor. */
  .belge-bolum {
    display: block !important;
    margin: 0 0 .5rem; padding-bottom: .25rem;
    border-bottom: 2px solid #101b30;
    font-size: .95rem; font-weight: 800; color: #101b30;
    break-after: avoid; page-break-after: avoid;
  }

  /* ---------------------------------------------------------------- 4
     TABLO — hizalı, çerçeveli, başlığı her sayfada.
     thead kuralı 43/1 blogunda; burada onu GÖRÜNÜR kılan biçim var. */
  main table { width: 100%; border-collapse: collapse; font-size: .82rem; }
  main table thead th {
    border-bottom: 1.5px solid #101b30; background: #f2f5f9;
    color: #101b30; font-weight: 700; text-align: left;
    padding: .3rem .4rem; white-space: nowrap;
  }
  main table tbody td { border-bottom: 1px solid #e3e8ef; padding: .3rem .4rem; vertical-align: top; }
  main table tbody tr:last-child td { border-bottom: 1px solid #d7dee9; }

  /* ---------------------------------------------------------------- 5
     TOPLAM — belirgin. Ekranda satır içi metin; kâğıtta belgenin sonucu. */
  main table tfoot td, main table tfoot th, .belge-toplam {
    border-top: 2px solid #101b30; padding: .4rem;
    font-size: .92rem; font-weight: 800; color: #101b30;
    background: transparent;
  }
  .belge-toplam {
    display: flex !important; justify-content: flex-end; gap: 1.2rem;
    margin-top: .2rem; font-variant-numeric: tabular-nums;
    break-inside: avoid; page-break-inside: avoid;
  }
  /* Ust uste gelen toplam satirlari (yapilan / odenen / kalan) TEK blok
     olsun: her birine ayri kalin cizgi cekilince kagitta uc ayri ayrac
     cikiyordu (olculdu: docs\ui\t44\hasta-yapilan.png, ilk surum). */
  .belge-toplam + .belge-toplam { border-top: 0; padding-top: 0; margin-top: 0; }
  .belge-toplam .bt-etiket { font-weight: 600; color: #3c4557; }

  /* Etiket rozetleri (Lab, Yapıldı, Kart…) kâğıtta anlamlarını korur ama
     dolgu rengi taşımaz: mürekkep tasarrufu değil, okunurluk — renkli
     zeminler gri tonlu yazıcıda metni yutuyordu. */
  .tag {
    background: transparent !important; border: 1px solid #b9c3d2 !important;
    color: #14203a !important; font-weight: 600;
  }

  /* ---------------------------------------------------------------- 6
     SAYFA KIRILMASI — künye ve bölüm başlığı tek başına sayfa sonunda
     kalmasın; iki satırlık dul/yetim satır bırakılmasın. */
  p, li, td { orphans: 2; widows: 2; }
  .yazdir-baslik { break-after: avoid; page-break-after: avoid; }
}

/* --------------------------------------------------------------------------
   Talimat 44/2 — TABLOSUZ EKRANLAR (aylık rapor).
   Rapor bir tablo değil; KPI kutuları, oran çubukları ve "mini" satırlardan
   oluşuyor. Aynı belge düzenini bu ekranda tablo uydurarak değil, kâğıda
   uygun bir kutu düzeniyle veriyoruz.
   -------------------------------------------------------------------------- */
@media print {
  /* KPI kutuları: kâğıtta çerçeveli, sıkışık, ortadan bölünmez. */
  .card.kpi {
    border: 1px solid #aab4c4 !important; box-shadow: none !important;
    padding: .45rem .6rem !important;
    break-inside: avoid; page-break-inside: avoid;
  }
  .card.kpi .l { font-size: .72rem; color: #3c4557; }
  .card.kpi .v { font-size: 1.05rem; font-weight: 800; color: #101b30; }

  /* Oran çubuğu: tarayıcı varsayılan olarak zemin rengi basmaz, geriye boş
     bir kutu kalıyordu. print-color-adjust ile çubuk kâğıda da çıkar; gri
     tonlu yazıcıda gri olur, yine okunur. Kutunun kendisi çerçeveli ki
     renk hiç basılmasa bile ölçek görünsün. */
  .bar { border: 1px solid #d7dee9; background: #fff !important; }
  .bar i {
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
    background: #2f9dc7 !important;
  }

  /* "mini" satırları: etiket solda, sayı sağda, ince ayraçla. */
  .mini { border-bottom: 1px solid #e3e8ef; padding: .18rem 0; font-size: .82rem; }
  .mini strong { font-variant-numeric: tabular-nums; }

  /* Boş durum kutuları kâğıtta çerçevesiz düz metin olsun. */
  .card.bos, .bos-durum { border: 0 !important; padding: 0 !important; }
}

/* ==========================================================================
   TALİMAT 44/3 — MOBİL ÜST ŞERİT: LOGO VE DOKUNMA HEDEFLERİ
   ==========================================================================
   ÖLÇÜLDÜ (390 × 844, t44-mobil-serit.js, düzeltmeden önce):

     öğe              boyut            sorun
     ---------------  ---------------  ------------------------------------
     logo             45,6 × 36 px     zemin rgb(240,240,240), kenarlık
                                       2px outset — tarayıcı varsayılan
                                       düğme kutusu; şerit rgb(15,26,46)
     menü bağlantısı  ~100 × 36 px     dokunma hedefi 44 px altında
     arama            62 × 38,6 px     tek satıra sıkışıp kullanılamaz
                                       hâle gelmiş
     bildirim         38 × 38 px       dokunma hedefi 44 px altında
     + Randevu        83,6 × 44 px     uygun
     + Hasta          66,4 × 44 px     uygun
     profil           44 × 44 px       uygun

   🔴 KÖK NEDEN (logo): `.brand` görünüm kuralları YALNIZCA
   `@media (min-width: 901px)` bloğunda yazılıydı (Talimat 36/C, daraltma
   kipi için). Mobilde hiçbir kural eşleşmiyordu ve öğe bir <button>
   olduğu için tarayıcının varsayılan düğme görünümüne düşüyordu.
   Öğe artık <a>; aşağıdaki kurallar mobil kipi ayrıca tanımlıyor.

   Dokunma hedefi alt sınırı 44 px: WCAG 2.2 "Target Size (Minimum)"
   2.5.8 (24 px) değil, daha yüksek olan Apple/Material ölçüsü alındı —
   şerit tek elle, yürürken kullanılıyor.
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  /* Seçici `aside a.brand` — üstteki 23/4 kuralı da bu özgüllükte
     (padding:0, border-radius:0) ve daha zayıf bir seçici onu ezemezdi. */
  aside a.brand {
    display: inline-flex; align-items: center; justify-content: center;
    flex: none;
    min-width: 44px; min-height: 44px;      /* ölçülen dokunma hedefi */
    padding: 4px;                            /* ikon ile kenar arası */
    margin: 0 .35rem 0 0;
    background: transparent;                 /* beyaz kutuyu kaldıran satır */
    border: 0;
    border-radius: 10px;
    color: #fff;
    font: inherit;
    -webkit-appearance: none; appearance: none;
  }
  /* Dokunma geri bildirimi: mobilde :hover yok, :active var. */
  aside a.brand:active { background: rgba(255, 255, 255, .12); }
  aside a.brand:focus-visible {
    outline: 2px solid var(--accent, #8fe0ff); outline-offset: 2px;
  }
  /* İkon 34 px kare kalır; kutu 44 px olduğu için çevresinde 5'er px boşluk.
     proto.css mobilde 34 × 22 diyordu (eski yatay logo ölçüsü); icon.svg
     KARE, o oran onu eziyordu. */
  aside a.brand img { width: 34px; height: 34px; flex: none; }
  aside a.brand .marka-ad { display: none; }

  /* Menü bağlantıları: 36 px yükseklikteydi. Metin boyu değişmeden
     yalnız dokunma alanı büyür. */
  aside a { min-height: 44px; display: inline-flex; align-items: center; }

  /* Bildirim zili: 38 px kareydi. */
  .zil-btn { width: 44px; height: 44px; }

  /* Arama alani 38,6 px yuksekligindeydi. Sabit yukseklik degil, dolgu
     buyutulur: yazi boyu degisirse alan da onunla buyusun. */
  .topbar .gsearch input { min-height: 44px; }
}

/* Dar telefonda ARAMA KENDİ SATIRINA iner.
   ÖLÇÜLDÜ: 390 px'te arama kutusu 62 px'e sıkışıyordu — içine yazılanın
   görülemediği bir alan. Şeritteki beş öğe tek satıra sığmıyor; doğru
   çözüm hepsini küçültmek değil, aramayı alta almak. */
@media (max-width: 560px) {
  /* 🔴 SABİT YÜKSEKLİK KALKAR. .topbar { height: 68px } tek satır varsayar;
     iki satıra sarınca içerik kutudan TAŞIYOR ve arama kutusu alttaki
     "← Ana sayfa" bağlantısının üzerine biniyordu (ölçüldü: kutunun
     yüksekliği 68 px, içeriğin gerçek yüksekliği 112 px). min-height
     aynı görünümü tek satırda korur, iki satırda büyümesine izin verir. */
  .topbar { flex-wrap: wrap; height: auto; min-height: 68px; }
  .topbar .gsearch { flex: 1 0 100%; order: 5; min-width: 0; margin-bottom: .4rem; }
  .topbar .gsearch input { width: 100%; }
}

/* --------------------------------------------------------------------------
   KOYU TEMA ARTIĞI — hazırlık notu rozeti (.note-ic)
   --------------------------------------------------------------------------
   ÖLÇÜLDÜ (t40-tema-tarama.js, 14 Eylül 2026): ana sayfa ve takvimde koyu
   temada zemin rgb(255,244,214) (parlaklık 0,91) — koyu kart üzerinde açık
   sarı bir kutu. proto.css'te sabit hex yazılı ve koyu tema karşılığı hiç
   yazılmamış.

   🔴 TALİMAT 44 KAPSAMINDA DEĞİL — bu tarama, Talimat 43'te konan fikstür
   kuralı sayesinde görünür oldu: bulgu ancak hazırlık NOTU OLAN bir randevu
   çizildiğinde ortaya çıkıyor ve fikstür artık onu kuruyor. Sessizce
   bırakmak, v1.11.0'da düzeltilen kusurun aynısını başka bir öğede
   sürdürmek olurdu.

   Renk seçimi v1.11.0'daki koyu tema paletiyle aynı yoldan: uyarı tonunun
   koyu karşılığı; metin AA üstünde (ölçüm taramada).
   -------------------------------------------------------------------------- */
.dark .note-ic { background: #3a2f10; color: #f0d38a; }

/* ==========================================================================
   TALİMAT 44 — DÜZELTME TURU · KÂĞIDA SIĞMA VE SÜTUN DENGESİ
   ==========================================================================
   KLİNİK BİLDİRDİ (canlı v1.12.0, hasta kartı çıktısı):
     · sağdaki "Kontrol" sütunu kesiliyor, tablonun altına yatay kaydırma
       çubuğu basılıyor
     · hekim adı üç satıra bölünüyor
     · kalemler "Planlandı" iken başlık "Yapılan işlemler" diyor
     · tabloda 85.000 ve 180.000 varken toplamlar ₺0,00

   🔴 KÖK NEDEN (kesilme ve kaydırma): A4 içerik kutusu 186 mm = **703 px**.
   Bu, kod tabanındaki **720 px'lik mobil eşiğin ALTINDA** — tarayıcı için
   kâğıt, bir telefon kadar dardır. Dolayısıyla kâğıda basarken
   `@media (max-width: 720px)` kuralları da devreye giriyor ve
   `.islem-listesi { display: block; overflow-x: auto }` tabloyu bir
   KAYDIRMA KUTUSUNA çeviriyordu. Kâğıtta kaydırma diye bir şey yoktur:
   kaydırılan içerik basılmaz, kesilir.

   Bu kusur v1.12.0 taramasından geçti çünkü tarama yazdırma KİPİNİ
   1100 px'lik bir pencerede ölçüyordu; mobil eşiğin altına hiç inmedi.
   Tarama artık A4 içerik kutusunda koşuyor (bkz. t44-yazdirma.js).
   -------------------------------------------------------------------------- */
@media print {
  /* 1) MOBİL KAYDIRMA KİPİ KÂĞITTA İPTAL. Ekranda dar cihazda kaydırma
        doğru çözüm; kâğıtta anlamsız ve zararlı. */
  .islem-listesi { display: table !important; overflow-x: visible !important; }
  .tablo-kap, .dis-secici, .hareket-suzgec { overflow: visible !important; }

  /* 2) TABLO SAYFAYI AŞMAZ. Sabit yerleşim + yüzdelik sütunlar: içerik ne
        olursa olsun toplam genişlik %100'dür, taşma matematiksel olarak
        imkânsız hâle gelir. Uzun tek kelimeler (lot no, e-posta) hücre
        içinde kırılır — sayfayı itmez. */
  main table { table-layout: fixed !important; width: 100% !important; }
  main table th, main table td {
    white-space: normal !important;
    /* `anywhere` DEGIL `break-word`: ilki kelimeyi gerek olmadan da
       bolebiliyor ve "Kürümlüoğlu" adini "Kürümlü / oğlu" diye ikiye
       ayirdi (olculdu). `break-word` yalnizca kelime kendi basina satira
       sigmiyorsa boler — ad bolunmesi son care olur. */
    overflow-wrap: break-word;
  }

  /* 3) "KONTROL" SÜTUNU KÂĞIDA ÇIKMAZ — GEREKÇESİYLE.
        Kontrol (recall) tarihi bir KLİNİK HATIRLATMASIDIR: hastanın ne
        zaman çağrılacağını klinik takip eder ve zaten SMS/randevu
        yolundan bildirilir. Hastaya verilen belgede kalemlerin çoğunda
        boş ("—") duruyor ve altı sütunu sıkıştırarak hekim adını üç
        satıra bölüyordu. Yer açmak için çıkarıldı; bilgi kaybolmuyor,
        ekranda ve randevu geçmişinde duruyor.
        Geri istenirse doğru yeri ayrı bir sütun değil, işlem adının
        altındaki küçük satırdır (marka rozetiyle aynı desen). */
  .islem-listesi .k-kontrol { display: none !important; }

  /* 4) SÜTUN GENİŞLİKLERİ — içeriğe göre dengeli.
        Otomatik yerleşim, içeriği çok olan sütuna yer veriyor ve hekim
        sütununu 89 px'e sıkıştırıyordu (ölçüldü: 27 karakterlik ad üç
        satır). Yüzdeler ölçülerek verildi; toplam %100. */
  /* 🔴 GENISLIKLER GERCEK CANLI VERIYE GORE OLCULDU (14 Eylul 2026):
     10 disli liste + 27 karakterlik hekim adi + marka rozeti + indirim
     satiri AYNI SATIRDA. Onceki degerler tek disli fiksturle verilmisti
     ve 10 disli satirda Dis sutunu komsusuna 94 px biniyordu. */
  .islem-listesi th:nth-child(1), .islem-listesi td:nth-child(1) { width: 11%; }  /* Tarih   */
  .islem-listesi th:nth-child(2), .islem-listesi td:nth-child(2) { width: 14%; }  /* Diş     */
  .islem-listesi th:nth-child(3), .islem-listesi td:nth-child(3) { width: 25%; }  /* İşlem   */
  .islem-listesi th:nth-child(4), .islem-listesi td:nth-child(4) { width: 22%; }  /* Hekim   */
  .islem-listesi th:nth-child(5), .islem-listesi td:nth-child(5) { width: 16%; }  /* Tutar   */
  .islem-listesi th:nth-child(6), .islem-listesi td:nth-child(6) { width: 12%; }  /* Durum   */

  /* 🔴 TEK PARCA DEGERLER BOLUNMEZ. Olculdu: "14.09.2026" tarihi
     "14.09.202 / 6" diye ikiye ayriliyordu. Bir tarih, bir tutar ya da
     bir durum rozeti icinde satir sonu OLMAZ — okunurlugu bozmakla
     kalmaz, belgeyi guvenilmez gosterir. Bu hucreler kirilma kuralinin
     disinda tutulur; sutun genisligi onlari tasiyacak kadar verilir. */
  /* nowrap YALNIZ VERI HUCRELERINE. Basliga da verilince "Diş / üye"
     (60 px) 51 px'lik hucreden tasip yandaki basligin uzerine bindi ve
     kagitta "Diş / üyeİşlem" diye okundu (olculdu). Baslik gerekirse
     iki satira iner — bir tarihin bolunmesiyle ayni sey degildir. */
  /* nowrap YALNIZ TARIH sutununda.
     🔴 Dis sutununa da verilmisti ve ayni kusuru veri hucresinde
     tekrarladi: "11,12,13,14,15,16,17,18,21,22" sarmayinca 14 px'lik
     hucreden tasip "İşlem" sutununun uzerine bindi (olculdu: +94 px).
     Tarih tek parca ve kisadir; dis listesi ne kisadir ne tek parca —
     virgulden sonra bosluk konarak sarabilir hale getirildi
     (bkz. hasta.php ). */
  .islem-listesi td:nth-child(1) {
    white-space: nowrap !important; overflow-wrap: normal !important;
  }
  /* Dis listesi sarabilir ama RAKAM ORTASINDAN bolunmez: kirilma yalniz
     virgulden sonraki boslukta olur. */
  .islem-listesi td:nth-child(2) {
    white-space: normal !important; overflow-wrap: normal !important;
    word-break: normal !important;
  }

  /* Indirim satiri bir ACIKLAMADIR, tek parca bir deger degil: sarabilir.
     `.sag` hucresine verilen nowrap onu da kapsayinca "İndirim %10 =
     ₺8.500,00" tutar sutunundan tasiyordu (olculdu). */
  main table td.sag .indirim-satir {
    white-space: normal !important; overflow-wrap: break-word;
  }
  main table .tag { white-space: nowrap !important; }

  /* Kâğıtta yazı bir tık küçülür: aynı sütun daha çok karakter alır,
     ad bölünmesi azalır. Okunurluk AA ölçümüyle ayrıca sınanıyor. */
  main table { font-size: .78rem; }
  main table th, main table td { padding: .26rem .35rem; }

  /* 5) YALNIZ KÂĞIDA ÇIKAN BLOKLAR (ekranda tek liste, kâğıtta iki bölüm) */
  .yalniz-yazdirma { display: block !important; }
}

/* Ekranda gizli: kâğıttaki "Yapılan işlemler" / "Planlanan işlemler"
   bölümleri. Ekran tek listeyi gösterir (Talimat 29/1 kararı). */
.yalniz-yazdirma { display: none; }

@media print {
  /* Tahsilat dökümü — sütun dengesi.
     `table-layout: fixed` eşit dağıtım yapıyor (6 sütun × %16,7 = 117 px)
     ve hasta adı 105 px'e sıkışıp dört satıra bölünüyordu (ölçüldü).
     Adın ve açıklamanın payı artırıldı; yöntem/tarih zaten dar içerik. */
  main[data-sayfa="odemeler"] table th:nth-child(1),
  main[data-sayfa="odemeler"] table td:nth-child(1) { width: 11%; }   /* Tarih    */
  main[data-sayfa="odemeler"] table th:nth-child(2),
  main[data-sayfa="odemeler"] table td:nth-child(2) { width: 25%; }   /* Hasta    */
  main[data-sayfa="odemeler"] table th:nth-child(3),
  main[data-sayfa="odemeler"] table td:nth-child(3) { width: 11%; }   /* Yöntem   */
  main[data-sayfa="odemeler"] table th:nth-child(4),
  main[data-sayfa="odemeler"] table td:nth-child(4) { width: 14%; }   /* Tutar    */
  main[data-sayfa="odemeler"] table th:nth-child(5),
  main[data-sayfa="odemeler"] table td:nth-child(5) { width: 22%; }   /* Açıklama */
  main[data-sayfa="odemeler"] table th:nth-child(6),
  main[data-sayfa="odemeler"] table td:nth-child(6) { width: 17%; }   /* Kaydeden */
}

@media print {
  /* 🔴 TUTAR ASLA BÖLÜNMEZ. `overflow-wrap: anywhere` uzun kelimeleri
     kırıyor — bu metin için doğru, PARA için felaket: "₺143.167,00"
     satır ortasından bölünürse belge okunamaz hâle gelir. Sayısal
     hücreler kırılma kuralının dışında tutulur ve sütun onları tek
     satırda taşıyacak kadar geniş verilir. */
  main table td.sag, main table th.sag {
    white-space: nowrap !important;
    overflow-wrap: normal !important; word-break: normal !important;
  }
  /* Tutar sütunu bir tık genişler; Açıklama'dan alınır. */
  main[data-sayfa="odemeler"] table th:nth-child(4),
  main[data-sayfa="odemeler"] table td:nth-child(4) { width: 16%; }
  main[data-sayfa="odemeler"] table th:nth-child(5),
  main[data-sayfa="odemeler"] table td:nth-child(5) { width: 20%; }
}

@media print {
  /* Tahsilat dökümü — tarih sütunu 70 px'e sıkışıp "14.09.2026" tarihini
     iki satıra bölüyordu (ölçüldü). Tarih tek parça bir değerdir; bölünmez
     ve sütun onu taşıyacak kadar geniş verilir. Fark "Kaydeden"den alındı. */
  main[data-sayfa="odemeler"] table th:nth-child(1),
  main[data-sayfa="odemeler"] table td:nth-child(1) {
    width: 13%; white-space: nowrap !important; overflow-wrap: normal !important;
  }
  main[data-sayfa="odemeler"] table th:nth-child(6),
  main[data-sayfa="odemeler"] table td:nth-child(6) { width: 15%; }
}

/* --------------------------------------------------------------------------
   v1.12.3 — TEKRAR / YENİLEME İŞARETİ ve ONAY EKRANI
   --------------------------------------------------------------------------
   Aynı dişe aynı işlem ikinci kez girildiğinde kayıt durur ve kullanıcı
   açıkça onaylar. Onaylanan kalem işaretini kendi üzerinde taşır; işaret
   hem ekranda hem KÂĞITTA görünür — hastaya verilen belgede iki benzer
   satır varsa ikincisinin neden orada olduğu yazılı olmalı.
   -------------------------------------------------------------------------- */
.tekrar-rozet {
  display: inline-block; margin-top: .15rem;
  font-size: .74rem; font-weight: 700; color: var(--warn-yazi);
}
.tekrar-not { font-weight: 500; color: var(--muted); }

.tekrar-onay { max-width: 46rem; }
.tekrar-cakisma {
  margin: 0 0 .9rem; padding: .7rem .9rem;
  border-left: 4px solid var(--warn); border-radius: 6px;
  background: var(--yumusak); font-weight: 600; color: var(--text);
}
.tekrar-onay .muted { margin: .5rem 0; }
.tekrar-eylem { margin-top: 1.1rem; gap: .8rem; }

@media print {
  /* Kâğıtta rozet renge değil METNE ve KOYULUĞA dayanır: gri tonlu
     yazıcıda da okunur kalsın. */
  .tekrar-rozet { color: #573f00 !important; font-weight: 700; }
  .tekrar-not   { color: #3c4557 !important; }
}

/* --------------------------------------------------------------------------
   v1.12.3 — KÂĞITTA DİŞ ŞEMASI
   --------------------------------------------------------------------------
   Hasta belgesinde hangi dişe ne yapıldığı/yapılacağı tek bakışta görünsün.
   🔴 SİYAH-BEYAZ YAZICI KURALI: renk TEK BAŞINA ayırt edici değildir. Her
   durum üç bağımsız işaret taşır — DOLGU (koyu / taramalı / boş),
   KENARLIK (kalın düz / kalın kesikli / ince) ve RAKAM KOYULUĞU. Yazıcı
   gri tonluysa bile üçü birden kaybolmaz.

   print-color-adjust: exact olmadan tarayıcı dolguları basmaz ve üç durum
   birbirinin aynısı çıkar — bu satır şemanın işe yaramasının koşulu.
   -------------------------------------------------------------------------- */
.dis-semasi { display: none; }

@media print {
  .dis-semasi { display: block !important; break-inside: avoid; page-break-inside: avoid; }

  .ds-sira {
    display: flex; gap: 2px; justify-content: center;
    margin: 0 0 3px;
  }
  /* 16 diş + boşluklar 703 px'e sığar: 38 px kutu + 2 px aralık. */
  .ds-dis {
    flex: 0 0 38px; height: 26px; line-height: 22px;
    text-align: center; font-size: .66rem; font-variant-numeric: tabular-nums;
    border-radius: 3px;
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  /* YAPILDI — koyu dolgu, kalın düz kenarlık, beyaz rakam */
  .ds-dis.ds-yapildi {
    background: #101b30 !important; color: #ffffff !important;
    border: 2px solid #101b30; font-weight: 800;
  }
  /* PLANLANDI — DÜZ BEYAZ zemin + kalın KESİKLİ kenarlık + koyu alt bant.
     🔴 ÖNCE ÇAPRAZ TARAMA DENENDİ ve iki ayrı sebeple bırakıldı:
       1) OKUNAKLILIK — gerçek PDF çıktısında 21/22/23 rakamları desenin
          üzerinde kayboldu (ölçüldü: docs/ui/t44/hasta-yapilan.png).
          Talimat açıkça "diş numaraları okunaklı" diyor.
       2) ÖLÇÜLEBİLİRLİK — gradyan zeminde kontrast hesaplanamaz;
          tarama zemini sessizce "beyaz" sayıyor ve rakamın gerçekte
          okunup okunmadığını göremiyordu. Ölçülemeyen bir tasarıma
          güvenilmez (Talimat 43 kuralının aynısı).
     Yerine gelen üç işaret renge bağlı DEĞİL ve ölçülebilir:
       kenarlık kalın+kesikli · alt bant koyu · rakam düz beyaz üstünde. */
  .ds-dis.ds-planlandi {
    background: #ffffff !important;
    color: #101b30 !important; border: 2px dashed #101b30; font-weight: 800;
    box-shadow: inset 0 -4px 0 0 #101b30;
  }
  /* İŞLEM YOK — dolgu yok, ince kenarlık, soluk rakam */
  .ds-dis.ds-yok {
    background: #ffffff !important; color: #434c61 !important;
    border: 1px solid #c3cad6; font-weight: 500;
  }

  .ds-aciklama {
    display: flex; align-items: center; gap: .35rem; justify-content: center;
    margin-top: .35rem; font-size: .7rem; color: #3c4557;
  }
  .ds-aciklama .ds-dis { flex: 0 0 22px; height: 16px; line-height: 13px; margin-left: .6rem; }
  .ds-aciklama .ds-dis:first-child { margin-left: 0; }
}

@media print {
  /* 🔴 "+1" ROZETI — KAGIT PALETI KOYULASINCA KONTRASTI DUSTU.
     ÖLÇÜLDÜ (t40-tema-tarama, yazdırma kipi): `rgb(79,90,114)` metin,
     `rgb(170,180,196)` zemin üzerinde **3,3:1** — AA altı.

     Sebep bu turun kendi değişikliği: rozet zemini `var(--line)` okuyor ve
     kâğıt paleti okunurluk için koyulaştırılınca (#d7dee9 → #aab4c4) zemin
     metne yaklaştı. Sabit yazılmış metin rengi (#4f5a72) ise değişmedi.

     Kâğıtta rozet ters çevriliyor: açık zemin, koyu metin. 9,9 px'lik bir
     rozet için yüksek kontrast zaten gerekli (ekran tarafındaki notun
     söylediği şey). Ekran davranışı DEĞİŞMEDİ. */
  .ertesi-im { background: #e9edf3 !important; color: #101b30 !important; }
}

/* ==========================================================================
   🔴 BELIRGIN SERIT — uyari ve hata (Talimat 48)

   NEDEN: mesajlar kucuk ve fark edilmesi zordu; kismen uygulanan bir islem
   yesil basari seridiyle bildiriliyordu. Uc kanal kuruldu ve uyari/hata
   AYNI belirginlige getirildi. Basari sade kaldi — dikkat cekmesi
   gerekmiyor, her kayitta goz yormamali.

   Pop-up/modal YOK (talimat): refleksle kapatilan pencere asil uyariyi da
   goturur. Serit kendiliginden de KAYBOLMAZ; kullanici kapatana kadar
   durur.

   Renk ve zemin MEVCUT siniflardan gelir (.alert, .alert.uyari) — Talimat
   40 palet turunda iki temada olculmuslerdi. Burada yalniz BOYUT, IKON ve
   duzen var, yeni renk cifti YOK.
   ========================================================================== */
.alert.serit-onemli {
  display: flex; gap: .65rem; align-items: flex-start;
  font-size: .92rem; line-height: 1.45; padding: .8rem .9rem;
}
.alert.serit-onemli .serit-ikon { font-size: 1.15rem; line-height: 1.25; flex: none; }
.alert.serit-onemli .serit-govde { flex: 1; }
.alert.serit-onemli .serit-govde b { display: block; margin-bottom: .15rem; }

/* 🔴 KAPATMA DUGMESI: opaklik YOK.
   Maket turunda `opacity:.65` kullanmistim; opaklik metin rengini zemine
   karistirir ve ETKIN KONTRASTI dusurur — yani olculmemis yeni bir renk
   cifti yaratir. Bunun yerine renk `currentColor`, yani seridin kendi
   olculmus metin rengi; yalniz boyut kucuk. */
.alert.serit-onemli .serit-kapat {
  flex: none; background: none; border: 0; cursor: pointer;
  color: currentColor; font-size: 1.05rem; line-height: 1;
  padding: .1rem .25rem; border-radius: 6px;
}
.alert.serit-onemli .serit-kapat:hover,
.alert.serit-onemli .serit-kapat:focus-visible {
  background: color-mix(in srgb, currentColor 14%, transparent);
}

/* 🔴 ALAN DUZEYI ISARET — v1.9.0 para alani deseni, SUNUCU tarafinda da.
   `input[aria-invalid="true"]` ve `.para-hata` zaten vardi ama yalniz
   istemci (panel.js) suruyordu; sunucu dogrulamasi reddettiginde alan
   isaretlenmiyordu. Ayni gorunum sunucu tarafi icin de kullanilir —
   kullanici hatali alani ARAMAK zorunda kalmasin. */
.alan-hata {
  display: block; margin: .25rem 0 0;
  font-size: .78rem; color: var(--bad-yazi, var(--tehlike)); font-weight: 600;
}

/* ==========================================================================
   TALIMAT 49/3 — YEREL BILESENLERI TASARIM DILINE ALMA

   🔴 OLCULEN DURUM (scripts/t49-bilesen-tarama.js · 14 ekran x 2 tema):
   206 yerel bilesen tarayicinin varsayilan gorunumunde ciziliyordu —
   checkbox 141 · select 41 · number 6 · radio 4 · month 3 · color 2.
   Kutularin KONTRASTI iyiydi (acik 16.19:1 · koyu 14.34-14.66:1); sorun
   kontrast degil TASARIM DILI ve ACILIR PANEL rengiydi.

   PALET DEGISMEZ: burada tek bir yeni renk tanimlanmiyor; yalnizca var
   olan --brand / --line / --text / --muted / --card degiskenleri
   kullaniliyor.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1 · color-scheme — YEREL ACILIR PANELIN TEK KOLU

   🔴 Olculdu: hicbir CSS dosyasinda tanimli DEGILDI (html/body: normal).
   `.dark input/select` kutuyu koyu yapiyor, ama ACILIR PANELI (takvim
   izgarasi, select listesi, renk paleti, kaydirma cubugu) CSS boyayamaz —
   onu tarayici kendi katmaninda cizer ve `color-scheme` yoksa ACIK temada
   cizer. Kullanicinin bildirdigi "kutu koyu, acilan panel beyaz" tam bu.

   Panelin kendisi DOM'da olmadigi icin olculemez; olculebilen sey bu
   degerdir ve tarama onu okur.
   -------------------------------------------------------------------------- */
:root { color-scheme: light; }
.dark { color-scheme: dark; }

/* 🔴 :root DA KOYUYA GECER (olculdu).
   Tema sinifi <body>'ye uygulaniyor, bu yuzden `.dark` kurali yalniz
   body ve altini kapsiyordu; olcum `koyu tema html: light body: dark`
   dedi. `color-scheme` kalitsal oldugu icin FORM kontrolleri body'den
   dogru degeri aliyor, ama SAYFA KAYDIRMA CUBUGU :root'tan besleniyor
   ve koyu temada acik kaliyordu.
   `:has()` desteklemeyen eski tarayicida kural dusurulur: body yine
   koyu olur, yalniz kaydirma cubugu acik kalir — zararsiz geri dusus. */
:root:has(body.dark) { color-scheme: dark; }

/* --------------------------------------------------------------------------
   2 · accent-color — 145 checkbox/radio tek satirla tasarim diline girer
   (olculdu: accent-color hic tanimli degildi, hepsi `auto`)
   -------------------------------------------------------------------------- */
input[type="checkbox"],
input[type="radio"] { accent-color: var(--brand); }

/* 3 · checkbox/radio YARICAP TUTARSIZLIGI (olculdu: 0px, digerleri 8-10px).
   Yerel kutunun kendi bicimi korunur (kare/daire ayrimi okunabilirlik
   icin anlamli); yalnizca kare olan checkbox hafif yuvarlatilir. */
input[type="checkbox"] { border-radius: 4px; }

/* --------------------------------------------------------------------------
   4 · select — ok ikonu ve kutu bicimi
   (olculdu: 41 select, appearance:auto, ok ikonu yok, yaricap 8px)

   Ok ikonu SVG veri adresi olarak gomulur; rengi `--muted`'in sabit
   karsiligi degil, currentColor ile cizilemedigi icin iki tema icin iki
   kural yazilir. Yeni renk GETIRILMEZ: ikisi de mevcut --muted degerleri.
   -------------------------------------------------------------------------- */
select {
  -webkit-appearance: none; appearance: none;
  border-radius: 10px;                     /* input/number ile ayni */
  padding-right: 2rem;                     /* ok icin yer */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238d9bb8' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M4 6.5 8 10.5l4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .6rem center;
  background-size: 16px 16px;
}
/* Koyu temada ok daha acik: zemin koyulastigi icin ayni gri kayboluyor.

   🔴 DIGER UC OZELLIK DE TEKRAR YAZILMAK ZORUNDA (Talimat 51'de olculdu).
   proto.css'te su kural var:
       .dark input, .dark select, .dark textarea { background: #0f1a2e; ... }
   `background` bir KISAYOLDUR ve yazilmayan tum `background-*`
   ozelliklerini BASLANGIC degerine dondurur:
       repeat -> repeat     position -> 0% 0%     size -> auto
   Asagida yalnizca `background-image` verilince ok geri gelir ama
   REPEAT ve POSITION baslangicta kalir: ok TEKRARLANIR ve sol ustten
   baslar. Ekranda "yan yana asagi yonlu oklar" gorunur ve metnin
   uzerine biner.

   🔴 Olcum notu: bu kusur YALNIZ KOYU TEMADA var. Ilk teshisimi acik
   temada yaptim ve "tek ok" olcup temiz sandim — kapsami tema boyutunda
   daraltmistim. Simdi t51-ekran-kare.js her iki temayi da olcuyor
   (9-8 iddiasi). */
.dark select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23b8c4dc' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M4 6.5 8 10.5l4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .6rem center;
  background-size: 16px 16px;
}
/* Cok secimli ve boyutlu listelerde ok anlamsiz; yer kaplamasin. */
select[multiple], select[size]:not([size="1"]) {
  background-image: none; padding-right: .7rem;
}

/* --------------------------------------------------------------------------
   5 · number — hizalama
   (olculdu: 6 adet; sayi sagda okunur, artirma oklari kutuyu daraltiyordu)
   -------------------------------------------------------------------------- */
input[type="number"] { text-align: right; }
/* Dokunmatikte oklar cok kucuk kaliyor; masaustunde kalsin, mobilde
   kalkar — deger klavyeden yaziliyor. */
@media (pointer: coarse) {
  input[type="number"]::-webkit-inner-spin-button,
  input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
  input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
}

/* --------------------------------------------------------------------------
   6 · renk secimi — SABIT PALET KUTUCUKLARI
   Yerel renk secici (olculdu: 2 adet) yerine, klinik takviminde kullanilan
   renklerden olusan kutucuklar. Serbest renk yerine sinirli palet: hekim
   renkleri takvimde birbirinden ayirt edilebilir kalmali.
   Kutucuk renkleri HTML'den (value) gelir; burada yalnizca BICIM var.
   -------------------------------------------------------------------------- */
.renk-palet { display: flex; flex-wrap: wrap; gap: .45rem; }
/* 🔴 RADIO ERISILEBILIR BICIMDE GIZLENIR — `opacity:0` YETMEZ.
   Ilk surumde `position:absolute; opacity:0` yazmistim ve /hekimler
   ekrani 390 px'de 36 px YATAY KAYDI (t33/3-1 yakaladi). Sebep olculdu:
   konumlanmis bir ata olmadigi icin absolute radio'lar sayfanin disina
   uzaniyordu — `.renk-palet input` gizlenince tasma 0'a dusuyor,
   `label` gizlenince 36 px kaliyor, yani suclu radio'lardi.
   Projede bunun dogru deseni zaten var (`.gizli-metin`): 1 px + clip.
   Oge DOM'da ve odaklanabilir kalir, yer KAPLAMAZ, tasma uretmez. */
.renk-palet input[type="radio"] {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.renk-palet label {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 10px; cursor: pointer;
  border: 2px solid var(--line); box-sizing: border-box;
}
.renk-palet label span {            /* renk dairesi */
  display: block; width: 20px; height: 20px; border-radius: 50%;
}
.renk-palet input[type="radio"]:checked + label {
  border-color: var(--brand);
  box-shadow: 0 0 0 2px var(--card), 0 0 0 4px var(--brand);
}
.renk-palet input[type="radio"]:focus-visible + label { outline: 2px solid var(--brand); outline-offset: 2px; }

/* 🔴 Talimat 49/3 — renk paletinin iki eksik yardimcisi (olculdu: ikisi de
   hicbir CSS dosyasinda tanimli DEGILDI).

   1) `.gizli-metin`: kutucukta hex degeri EKRAN OKUYUCU icin durur ama
      gorunmez. Tanimli olmasaydi "#2f9dc7" yazisi kutucugun icinde
      gorunur ve bilesen bozuk gorunurdu.
   2) `.label`: proto.css yalniz `label` ETIKETINE stil veriyor
      (display:block · --muted · ust bosluk). Renk paletinin basligi
      <span> oldugu icin (radiogroup'ta `for` baglanacak tek alan yok)
      ayni gorunumu sinif olarak da tanimlamak gerekiyor; yoksa baslik
      komsu alanlarin basliklarindan farkli cizilirdi. */
.gizli-metin {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.label { display: block; font-size: .76rem; color: var(--muted); margin: .6rem 0 .25rem; }

/* Global `label{display:block;margin:.6rem 0 .25rem}` kurali kutucuklara
   siziyordu: her kutucuk alt alta duser ve aralarinda bosluk birikirdi.
   Palet icindeki etiketler satir ici ve bosluksuz olmali. */
.renk-palet label { margin: 0; }

/* ------------------------------------------------------------------------
   SÜRÜM DEĞİŞTİ ŞERİDİ  (Talimat 51)

   🔴 Neden var: açık duran bir sayfa, sunucuda sürüm değişse bile ESKİ
   JS'i çalıştırmaya devam eder. Sayfalar `Cache-Control: no-store` ve
   `sw.js` sayfaları önbelleğe almıyor — ama ikisi de YENİ İSTEKLER için
   geçerli; zaten yüklenmiş bir sayfayı tazelemezler. PWA ana ekrandan
   açık kaldığında bu günlerce sürebilir ve "düzeltme çalışmıyor" gibi
   görünür. Şerit `bildirim.js`'in 60 sn'lik yoklamasındaki sürüm
   damgası değişince çıkar.

   Konum ÜSTTE: mobilde `.zil-panel` alttan açılan bir sayfa
   (bottom sheet, yukarıda) ve alta koymak ikisini üst üste bindirirdi.
   z-index 90: kilit ekranının (200) altında, geri kalanın üstünde.
   ------------------------------------------------------------------------ */
.surum-serit {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 90;
  display: flex;
  gap: .8rem;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: .7rem 1rem;
  padding-top: calc(.7rem + env(safe-area-inset-top, 0px));
  background: var(--brand);
  color: #fff;
  font-size: .9rem;
  line-height: 1.3;
  text-align: center;
  box-shadow: 0 8px 24px -14px rgba(20, 32, 58, .6);
}
.surum-serit .btn {
  min-height: 36px;
  padding: 0 .9rem;
  background: #fff;
  color: var(--brand);
  border-color: #fff;
  flex: 0 0 auto;
}

/* ------------------------------------------------------------------------
   ÇOKLU SEÇİM KİP DÜĞMESİ — MASAÜSTÜNDE GİZLİ  (Talimat 51)

   🔴 Ölçülen gerekçe: Talimat 49/2'de masaüstünde fare ile sürükleme
   KOŞULSUZ hâle geldi (kip ya da Ctrl gerektirmiyor). t36/7-1 bunu
   ölçüyor: kip kapalı + Ctrl yokken sürükleme aralığı zaten seçiyor.
   Talimat 51'de klavye dalı da koşulsuz `degistir()`e çevrildi.
   Geriye `kipAcik`'in masaüstünde yaptığı bir iş KALMADI — düğme
   duruyor ama hiçbir şeyi değiştirmiyor.

   MOBİLDE KALIR ve bu kasıtlı: dokunmatikte sürükleme yalnız kip
   açıkken aralık seçer (t36/7-5 — kaydırmayı bozmamak için). Orada
   düğme işlevin tek anahtarı.

   Ölçüt `panel.js`'in kullandığıyla AYNI: `matchMedia('(pointer: fine)')`.
   İki ayrı ölçüt kullanmak, görünürlük ile davranışın ayrışması
   demekti — düğme görünüp işlememesi ya da tersi.

   Temizle düğmesi HER İKİSİNDE de kalır: Esc görünmez bir kısayol,
   Temizle seçimi boşaltmanın keşfedilebilir tek yolu.
   ------------------------------------------------------------------------ */
@media (pointer: fine) {
  [data-coklu-kip] { display: none; }
}

/* ------------------------------------------------------------------------
   ETİKET YOK DURUMU  (Talimat 51 · madde 8)

   🔴 Seçenek yokken açılır liste gösterilmez. Klinik canlıda "yan yana
   oklar ve tek seçenek" bildirdi; ölçüldü ki mekanizma çalışıyor ama
   `patient_tags` boş. Tek seçenekli bir seçici kullanıcıya bozuk
   görünür — oysa bozuk değil, boş. Durum metni bunu okunur kılar ve
   etiketin NEREDEN ekleneceğini de söyler.
   ------------------------------------------------------------------------ */
.etiket-yok {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  min-height: 38px;
  padding: 0 .2rem;
  font-size: .82rem;
  color: var(--muted);
  white-space: nowrap;
}
.etiket-yok a { color: var(--accent); text-decoration: underline; }
/* 390 px'te satır kırılabilsin — şerit taşma üretmemeli. */
@media (max-width: 480px) {
  .etiket-yok { white-space: normal; min-height: 0; padding: .3rem 0; }
}

/* ------------------------------------------------------------------------
   KLİNİK AYARLARI — YENİ ALANLAR  (Talimat 51 · madde 9)

   🔴 Mevcut düzen bozulmadan eklendi: alanlar aynı `grid g2` desenine
   girdi, yeni bir yerleşim kurulmadı. Yalnız bir şey CSS istiyor:
   KVKK metninin tam genişlik kartı.

   🔴 `.tema-renk-satir` ve `.tema-renk-onizleme` KALDIRILDI
   (Talimat 56/6): ikisi de serbest hex kutusu icindi — giris ile
   canli onizleme karesini yan yana koyuyorlardi. Kutu kalkinca bu
   kurallar OLU kaldi. Olu CSS zararsiz gorunur ama degildir: sonraki
   okuyucu "demek ki bir onizleme var" diye okur ve olmayan bir
   bileseni varsayar. Marka rengi artik yalniz paletten seciliyor ve
   paletin kendi stili `.renk-palet` altinda.
   ------------------------------------------------------------------------ */

/* 🔴 İki sütunlu ızgarada satırın tamamını kaplar. KVKK metni uzun;
   tek sütuna sıkışırsa hem okunmaz hem öteki kartları aşağı iter. */
.grid.g2 > .g2-tam { grid-column: 1 / -1; }
.g2-tam textarea {
  width: 100%;
  min-height: 7rem;
  resize: vertical;
  font: inherit;
}

/* ===== Talimat 55 / B2 =============================================
   Marka slogani ve kayitli-deger isareti. */

/* 🔴 SLOGAN iki yere baglandi: online randevu basligi ve yazdirma
   kunyesi. `clinics.slogan` yaziliyordu ama hicbir ekranda
   gosterilmiyordu (olu alan); canlida DOLUYDU. */
.marka-slogan {
  font-size: .82rem;
  color: var(--muted);
  margin: -.2rem 0 .4rem;
  line-height: 1.3;
}
.yazdir-baslik .yb-slogan {
  display: block;
  font-style: italic;
}

/* 🔴 KAYITLI DEGER ISARETI — artik METINDE degil NITELIKTE.
   Eskiden etiketin icine `· kayıtlı değer` yaziliyordu ve bu bizim
   teknik duzeltmemizin adiydi; kullanici "TL · kayıtlı değer"
   goruyordu. Simdi `data-kayitli` niteligi var ve GORSEL ipucu
   veriyor: deger listede yok, ama korunuyor.
   `option` icinde stil destegi sinirli oldugu icin ipucu select'in
   kendisine veriliyor. */
select:has(option[data-kayitli]:checked) {
  border-color: var(--warn, #e0a400);
}

/* 🔴 ZORUNLU ALAN IMI (Talimat 55/B2)
   211 form alaninin 35'i zorunlu (%17). Azinlik isaretlenir — 176
   alana "istege bagli" yazmak ekrani bogardi.
   Yildiz `aria-hidden`; anlami yanindaki `.gizli-metin` tasiyor, yani
   ekran okuyucu "Ad Soyad (zorunlu)" duyar, "yildiz" demez. */
/* 🔴 ZORUNLULUK YILDIZI (Talimat 56/5 · olculdu)
   Renk `--bad` DEGIL `--bad-yazi`. `--bad` (#d64545) bir YUZEY rengi:
   beyaz uzerinde 4,38:1, --bg uzerinde 4,05:1 — ikisi de AA metin
   esigi 4,5'in ALTINDA. Projede metin icin ayrilmis ton zaten var ve
   tema basina tanimli: acik #c53838 (beyaz 5,25 · --bg 4,86), koyu
   #ff9a9a (koyu zemin 8,17). Yildiz `aria-hidden` olsa da GORSEL
   kullanici icin bilgi tasir, yani metin esigine tabidir.
   Tek bir kirmizi iki temada AA gecmiyor; bu yuzden sabit renk degil
   DEGISKEN kullanilir. */
.zorunlu-im {
  color: var(--bad-yazi, #c53838);
  font-weight: 600;
  margin-left: .1rem;
}

/* =====================================================================
   TELEFON ALANI (v2.0.16) — secici + abone alani
   =====================================================================
   🔴 OLCU SINIFTA, RENK BAGLAMDA: bayragin kendi renkleri var, buradan
   yalniz BOYUT veriliyor. Sabit bir renk gomseydik baska bir zeminde
   gorunmez metin uretirdi.
   🔴 Bayraklar tasarim dilinin "cizgi, 2 px, currentColor" kuralinin
   ISTISNASIDIR ve gerekcesi yazili: bir bayragin bilgisi RENGINDEDIR.
   ===================================================================== */
.tel-alani { display: flex; align-items: center; gap: .45rem; max-width: 20rem; }
/* 🔴 DUZ ETIKET, DUGME DEGIL (29 Ekim 2026 · kullanici karari).
   Once cerceveli ve gri zeminliydi: `+90` giris alanina bitisik
   bir DUGME gibi goruluyordu ve kullanici ustune basip acilmasini
   bekledi. Ok isareti hic yoktu; izlenimi KUTU veriyordu.
   Gercek secici alti ulkeyle v2.0.17'de gelecek (Verimor'un yurt
   disi gonderim cevabi bekleniyor). O gune kadar: cerceve yok,
   zemin yok, ikincil ton — tutamayacagimiz bir vaadi ekranda
   tutmuyoruz. */
.tel-ulke {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: 0; white-space: nowrap;
  border: 0; background: none; color: var(--muted, #6b7893);
}
.tel-bayrak { height: 1.15em; width: 1.15em; display: block; border-radius: 50%;
              box-shadow: 0 0 0 1px rgba(0,0,0,.14); flex: 0 0 auto; }
.tel-kod { font-variant-numeric: tabular-nums; }
.tel-alani .tel-abone {
  /* Alan artik kendi basina bir giris: dort kosesi de yuvarlak. */
  flex: 1 1 auto; min-width: 0;
  font-variant-numeric: tabular-nums; letter-spacing: .02em;
}
/* Cozulemeyen kayitli deger: SESSIZCE BOSALTILMAZ, ISARETLENIR. */
.tel-alani.tel-cozulemedi .tel-abone { border-color: #d6a73a; background: #fffaf0; }
.tel-uyari { margin: .35rem 0 0; font-size: .82rem; color: #8a6d1f; }
@media (prefers-color-scheme: dark) {
  .tel-alani.tel-cozulemedi .tel-abone { background: #2a2416; border-color: #6b5520; }
  .tel-uyari { color: #e0c070; }
}
/* =====================================================================
   KANAL SECIMI (v2.0.16) — iki dugmeli sifirlama 2. adimi
   =====================================================================
   🔴 Devre disi dugme GIZLENMEZ: gorunur, tiklanamaz ve SEBEBI altinda
   yazilidir. Sessiz devre disi, kullaniciya nicin tiklayamadigini
   soylememektir.
   ===================================================================== */
.kanal-liste { display: grid; gap: .7rem; margin: 1.1rem 0; }
.kanal-dugme {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; width: 100%; min-height: 56px; padding: .8rem 1rem;
  border: 1px solid rgba(255,255,255,.22); border-radius: 12px;
  background: rgba(255,255,255,.06); color: inherit;
  font: inherit; text-align: left; cursor: pointer;
}
.kanal-dugme:hover:not(.kapali) { background: rgba(255,255,255,.12); }
.kanal-ad { font-weight: 600; }
.kanal-hedef { font-variant-numeric: tabular-nums; letter-spacing: .08em; opacity: .8; }
.kanal-dugme.kapali { display: block; cursor: default; opacity: .62; }
.kanal-dugme.kapali .kanal-ic {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; width: 100%; background: none; border: 0; color: inherit;
  font: inherit; padding: 0; cursor: not-allowed;
}
.kanal-sebep { margin: .45rem 0 0; font-size: .8rem; color: #e0c070; }