/* Form ve kontrol listesi — isgbys.css'in devamı */

.form-sayfa { max-width: 1000px; }

/* ⚠️ Form bloklarının dolgusu ve aralığı daraltıldı (25 Eyl 2026, genel
   daraltma): grup dolgusu 18 → 12 px, gruplar arası 14 → 10 px, alanlar
   arası 12 → 9 px. Yazı boyutlarına **dokunulmadı** (kullanıcı: *"yazıları
   küçültme, boşlukları küçült"*). */
.alan-grubu {
  background: var(--kart); border: 1px solid var(--cizgi);
  border-radius: var(--yuvarlak); padding: 4px 12px 12px; margin: 0 0 10px;
}
.alan-grubu legend {
  font-size: 12.5px; font-weight: 600; color: var(--yazi-soluk);
  text-transform: uppercase; letter-spacing: .04em; padding: 0 6px;
}

.alanlar { display: grid; gap: 9px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.alan label { display: block; font-size: 12.5px; margin-bottom: 2px; color: var(--yazi-soluk); }
.alan input, .alan select, .alan textarea { width: 100%; }
.alan textarea { font: inherit; padding: 8px 10px; border: 1px solid var(--cizgi-koyu);
  border-radius: 7px; resize: vertical; }
.alan input[type=checkbox] { width: auto; }
.zorunlu { color: var(--kirmizi-yazi); }
.ipucu { font-size: 11.5px; color: var(--yazi-soluk); margin-top: 3px; }
.alan-hata { font-size: 12px; color: var(--kirmizi-yazi); margin-top: 4px; }
.alan-hatali input, .alan-hatali select, .alan-hatali textarea { border-color: var(--kirmizi-cizgi); }

.form-alt { display: flex; gap: 10px; margin-top: 8px; }

/* ⚠️ Zemin jetondan (17 Eyl 2026): sabit leylak geçiş koyu temada (Tebeşir)
   neredeyse beyaz yazının arkasında kalıyordu — kutu okunmuyordu. */
.bilgi-kutu {
  background: var(--bilgi-zemin);
  border: 1px solid var(--cizgi); border-left: 5px solid var(--mavi-acik);
  border-radius: var(--yuvarlak);
  padding: 13px 16px; font-size: 13px; margin: 0 0 14px; line-height: 1.55;
}
/* ⚠️ 25 Ağu 2026 renk denetimi: iki şablon `bilgi-kutu sari` kullanıyordu
   ("hiçbir çalışanı göremiyor" uyarısı dâhil) ama bu çeşit hiç tanımlanmamıştı
   — kutu sessizce mor/mavi bilgi renginde kalıyor, UYARI olduğu görünmüyordu. */
.bilgi-kutu.sari {
  background: var(--sari-zemin);
  border-color: var(--sari-cizgi); border-left-color: var(--sari-cizgi);
}

/* Kontrol listesi — sahada telefondan işaretlenecek, hedefler büyük olmalı */
.kontrol-listesi { display: grid; gap: 8px; }
.kontrol-satir {
  display: flex; align-items: flex-start; gap: 11px;
  padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 9px;
  cursor: pointer; background: var(--kart);
}
.kontrol-satir:hover { border-color: var(--cizgi-koyu); }
/* --- Kısayol yönetimi ------------------------------------------------- */
.kisayol-liste { list-style: none; margin: 8px 0 0; padding: 0; }
/* ⭐ Yoğunluk (28 Eyl 2026 · kullanıcı: *"satırları mutlaka daralt, çok
   geniş"*). 21 modül satırı ekranı üç ekrana yayıyordu. Dolgu 8 → 5 px,
   aradaki boşluk 6 → 4 px, ikon 34 → 28 px; yazı yalnız %7 küçüldü
   (14 → 13) çünkü asıl yüksekliği ikon ve düğmeler belirliyor. */
.kisayol-satir {
  display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
  background: var(--kart); border: 1px solid var(--cizgi);
  border-radius: var(--yuvarlak); padding: 5px 11px; margin-bottom: 4px;
}
.kisayol-satir.suruklenen { opacity: .5; border-style: dashed; }
/* Tutamak yalnız betik yüklendiğinde anlamlı; betiksiz gizli kalır. */
/* ⭐ Saydamlık .45 idi; tutamak sürüklenen bir **denetim**, eşiği 3,0.
   .45'te etkin kontrast 1,92-2,62 ölçüldü (beş tema), .75'te 3,33-4,89. */
.kisayol-tut { display: none; cursor: grab; opacity: .75; font-size: 16px; }
.suruklenebilir .kisayol-tut { display: inline; }
.kisayol-ikon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 8px;
  background: var(--zemin); font-size: 15px; flex: none;
}
.kisayol-ad { flex: 1; min-width: 160px; font-weight: 600; font-size: 13px; }
.kisayol-islem { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.kisayol-islem form { display: flex; align-items: center; gap: 4px; margin: 0; }
.kisayol-islem button {
  border: 1px solid var(--cizgi-koyu); background: var(--kart);
  color: var(--yazi); border-radius: 8px; padding: 3px 8px;
  font-size: 12.5px; cursor: pointer;
}
.kisayol-islem button:hover:not(:disabled) { background: var(--zemin); }
.kisayol-islem button:disabled { opacity: .35; cursor: default; }
.kisayol-gorunum select {
  border: 1px solid var(--cizgi-koyu); border-radius: 8px;
  padding: 2px 6px; background: var(--kart); color: var(--yazi);
  font-size: 12.5px;
}

.kontrol-satir.secili { background: var(--yesil-zemin); border-color: var(--yesil-cizgi); }
.kontrol-satir input { width: 19px; height: 19px; margin-top: 1px; flex-shrink: 0; }
.kontrol-metin { font-size: 14px; }
.kontrol-sonuc {
  display: block; width: 100%; font-size: 12px; color: var(--yazi-soluk); margin-top: 3px;
}
.kontrol-satir.secili .kontrol-sonuc { color: var(--yesil-yazi); }

/* Tanı (ICD-10) öneri kutusu — `statik/isgbys-tani.js` tarafından açılır.
   Alanın hemen altına düşer; kutu kapalıyken (hidden) yer kaplamaz. */
.alan { position: relative; }
.tani-oneriler {
  position: absolute; z-index: 20; left: 0; right: 0; top: 100%;
  margin-top: 3px; max-height: 260px; overflow-y: auto;
  background: var(--kart); border: 1px solid var(--cizgi-koyu);
  border-radius: 8px; box-shadow: var(--golge-hover);
}
.tani-oneri {
  display: block; width: 100%; text-align: left; font: inherit; font-size: 13px;
  padding: 9px 12px; border: 0; border-bottom: 1px solid var(--cizgi);
  background: none; color: var(--yazi); cursor: pointer;
}
.tani-oneri:last-child { border-bottom: 0; }
.tani-oneri:hover, .tani-oneri:focus { background: var(--zemin); }
/* Müşterinin çalışan listesi yazmadan açılınca seçili kişi belli olsun. */
.tani-oneri[aria-current="true"] { font-weight: 600; }
/* İlaç adı önerisi (6 Eki 2026): ilaç tablosu yatay kaydırmalı sarmalayıcının
   (`.sarma`) içinde; `absolute` liste orada kırpılırdı. Konumu betik verir
   (`isgbys-poliklinik.js` → `ilacOnerisiniHazirla`). */
.ilac-oneriler { position: fixed; right: auto; top: auto; margin-top: 0; z-index: 60; }
/* Yaz-seç çalışan kutusu, gizlenen açılır listenin yerini tutar. */
.calisan-ara-kutu { width: 100%; }

/* ── Poliklinik hızlı kayıt ekranı ────────────────────────────────────
   Form solda, "önceki başvurular" paneli sağda. Panel yalnız bir kolaylık
   değil: tekrarlayan yakınma meslek hastalığı şüphesi doğurur, hekim
   geçmişi görmeden bunu fark edemez. Dar ekranda panel forma alta düşer. */
.poliklinik-duzen {
  display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px;
  align-items: start;
}
@media (max-width: 1100px) {
  .poliklinik-duzen { grid-template-columns: minmax(0, 1fr); }
}
.poliklinik-duzen .yan-panel {
  background: var(--kart); border: 1px solid var(--cizgi);
  border-radius: var(--yuvarlak); padding: 13px 15px;
  position: sticky; top: 14px; max-height: calc(100vh - 40px); overflow-y: auto;
}
.poliklinik-duzen .yan-panel h2 {
  margin: 0 0 10px; font-size: 13px; text-transform: uppercase;
  letter-spacing: .04em; color: var(--yazi-soluk);
}
.gecmis-kayit {
  border-left: 3px solid var(--cizgi-koyu); padding: 7px 0 7px 10px;
  margin-bottom: 9px;
}
.gecmis-kayit:last-child { margin-bottom: 0; }

/* İlaç satırları — dar sütunlar, klavyeyle hızlı geçilsin */
.ilac-tablosu input { width: 100%; }
.ilac-tablosu td { padding: 5px 6px; vertical-align: middle; }
.ilac-tablosu .dugme.sade { padding: 3px 10px; line-height: 1.2; }

/* ── Sihirbaz adım çubuğu ─────────────────────────────────────────────
   Üç adımlı eğitim sihirbazı; uzman hangi adımda olduğunu görsün. */
.sihirbaz-adimlar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin: 0 0 14px; font-size: 13px;
}
.sihirbaz-adim {
  padding: 6px 13px; border-radius: 999px;
  border: 1px solid var(--cizgi); background: var(--kart);
  color: var(--yazi-soluk);
}
/* ⚠️ Dolu zemin `--vurgu-dolu`, yazı `--vurgu-yazi` — bu çift her temada
   ölçülü. Marka rengi (`--mavi`) üstüne beyaz yazı «Mevcut»ta 3,56,
   Tebeşir'de 2,72 veriyordu (17 Eyl 2026). */
.sihirbaz-adim.aktif {
  background: var(--vurgu-dolu); border-color: var(--vurgu-dolu);
  color: var(--vurgu-yazi); font-weight: 600;
}
.sihirbaz-adim.gecildi {
  background: var(--yesil-zemin); border-color: var(--yesil-cizgi);
  color: var(--yesil-yazi);
}
.sihirbaz-ok { color: var(--yazi-soluk); }

/* ── Eğitim planı takvimi ─────────────────────────────────────────────
   12 ay yan yana; dolu aylar vurgulu. Dar ekranda alt alta iner. */
.takvim-izgara {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 10px; margin-bottom: 18px;
}
.takvim-ay {
  background: var(--kart); border: 1px solid var(--cizgi);
  border-radius: var(--yuvarlak); padding: 10px 12px; min-height: 72px;
}
.takvim-ay.dolu { border-color: var(--cizgi-koyu); }
.takvim-baslik {
  font-size: 12px; text-transform: uppercase; letter-spacing: .04em;
  color: var(--yazi-soluk); margin-bottom: 6px;
}
.takvim-madde {
  display: block; font-size: 13px; padding: 5px 8px; margin-bottom: 5px;
  border-radius: 7px; border-left: 3px solid var(--cizgi-koyu);
  background: var(--zemin); color: var(--yazi); text-decoration: none;
}
.takvim-madde:hover { background: var(--vurgu-yumusak); }
.takvim-madde.yesil { border-left-color: var(--yesil-cizgi); background: var(--yesil-zemin); }
.takvim-madde.sari { border-left-color: var(--sari-cizgi); background: var(--sari-zemin); }
/* ⚠️ 25 Ağu 2026 renk denetimi: `renk` kaynağı (planlama.models) RET ve
   gecikmiş maddede "kirmizi" döndürüyor ama bu çeşit tanımlanmamıştı —
   reddedilen eğitim planı maddesi takvimde NÖTR görünüyordu. */
.takvim-madde.kirmizi { border-left-color: var(--kirmizi-cizgi); background: var(--kirmizi-zemin); }

/* ⭐ Sertifika çerçevesi önizlemesi (20 Eyl 2026). Otuz çerçeveyi addan
   seçmek mümkün değil; seçilen kâğıt burada görünür.
   ⚠️ Kâğıt zemini **beyaz sabit değil** `--kart`: koyu temada beyaz kutu
   ekranı deler. Çerçeve çizgileri kendi renklerini taşıdığı için zemin
   açık kalmalı, bu yüzden `--kart` seçildi (koyu temada da kâğıt beyazı). */
.cerceve-onizleme {
  margin-top: 10px; padding: 10px; border: 1px solid var(--cizgi);
  border-radius: 8px; background: var(--zemin-yumusak); text-align: center;
}
.cerceve-onizleme img {
  max-width: 220px; max-height: 300px; width: auto; height: auto;
  background: var(--kart); border: 1px solid var(--cizgi-koyu);
}
.cerceve-onizleme .ipucu { margin-top: 6px; }

/* ============================================================
   İKİLİ SEÇİM — «Hayır | Evet», «Yapıldı | Yapılmadı» (9 Eki 2026)
   ------------------------------------------------------------
   🔴 NEDEN: EK-2 formunda yuvarlak seçim düğmeleri telefonda alt alta
   diziliyor ve her düğme KENDİ YAZISININ ÜSTÜNDE kalıyordu (375 px'te
   ölçüldü: düğme 902 / «Hayır» 920 / düğme 939 / «Evet» 956). Hekim
   yazının altındaki düğmeye bastı; «Hayır» diye bastığı «Evet» kaydoldu
   ve resmî belge öyle basıldı. Burada düğme ile yazı TEK PARÇADIR:
   aralarına satır giremez, dokunulan şey yazının kendisidir.
   ⚠️ Seçili olan yalnız renkle değil «✓» ve kalın yazıyla da belli
   (renk tek başına işaret olamaz).
   ⚠️ `.bulgu`: «Evet» bir bulgu demek (anamnez) — sarıyla öne çıkar ki
   hekim uzun listede işaretlediklerini bir bakışta görsün. Laboratuvarda
   «Yapıldı» bulgu değildir, orada sınıf yok.
   ============================================================ */
.ikili-secim { display: inline-flex; flex-wrap: nowrap; gap: 6px; vertical-align: middle; }
.ikili-secim label { position: relative; display: inline-flex; margin: 0; white-space: nowrap; cursor: pointer; }
html .ikili-secim label > input[type="radio"] {
  position: absolute; inset: 0; width: 100%; height: 100%; margin: 0;
  opacity: 0; cursor: pointer;
}
.ikili-secim label > span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 72px; min-height: 36px; padding: 6px 10px;
  border: 1px solid var(--cizgi-koyu); border-radius: 8px;
  background: var(--kart); color: var(--yazi-soluk);
  font-size: 13px; font-weight: 500; line-height: 1.2;
}
.ikili-secim label:hover > span { border-color: var(--yazi-soluk); }
.ikili-secim input:checked + span {
  background: var(--zemin-yumusak); border-color: var(--yazi); color: var(--yazi);
  font-weight: 700; box-shadow: inset 0 0 0 1px var(--yazi);
}
.ikili-secim input:checked + span::before { content: "✓"; margin-right: 5px; }
.ikili-secim.bulgu label[data-deger="EVET"] input:checked + span {
  background: var(--sari-zemin); border-color: var(--sari-cizgi); color: var(--sari-yazi);
  box-shadow: inset 0 0 0 1px var(--sari-cizgi);
}
.ikili-secim input:focus-visible + span { outline: 2px solid var(--yazi); outline-offset: 2px; }

/* Düğme ile yazısı ayrılmaz — klasik yuvarlak düğmeli satırlar için. */
.dugme-yazi { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }

.toplu-yanit { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }

.hazir-sonuc {
  margin-top: 4px; padding: 3px 9px; border: 1px dashed var(--cizgi-koyu); border-radius: 999px;
  background: none; color: var(--yazi-soluk); font: inherit; font-size: 12px; cursor: pointer;
}
.hazir-sonuc:hover { color: var(--yazi); border-color: var(--yazi-soluk); }
.ek2-secim-tablosu .ek2-yanit { white-space: nowrap; }

/* Telefonda tablo satırı ikiye bölünür: üstte soru + iki düğme, altta
   (gerekiyorsa) açıklama. Sütunlu tablo 375 px'e sığmıyor, yanıt hücresi
   64 px'e düşüyordu. */
@media (max-width: 640px) {
  .ek2-secim-tablosu,
  .ek2-secim-tablosu tbody { display: block; width: 100%; }
  .ek2-secim-tablosu thead { display: none; }
  .ek2-secim-tablosu tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px;
    align-items: center; padding: 9px 0; border-bottom: 1px solid var(--cizgi);
  }
  .ek2-secim-tablosu.ek2-secim-tablosu td {
    display: block; min-width: 0; padding-top: 0; padding-right: 0; padding-bottom: 0; border: 0;
  }
  .ek2-secim-tablosu.ek2-secim-tablosu td:first-child:not([style]) { padding-left: 0; }
  .ek2-secim-tablosu td.ek2-ek { grid-column: 1 / -1; padding-left: 0; }
  .ek2-secim-tablosu td.ek2-ek input { width: 100%; }
  .ek2-secim-tablosu .ikili-secim label > span { min-height: 44px; }
  /* Anamnezde açıklama yalnız «Evet»te ya da yazı varken görünür. */
  .ek2-secim-tablosu.anamnez tr:not(:has(label[data-deger="EVET"] input:checked))
    td.ek2-ek:not(:has(input:not(:placeholder-shown))) { display: none; }
}

@media print {
  .ikili-secim label > span { opacity: .55; }
  .ikili-secim input:checked + span { opacity: 1; border-width: 2px; font-weight: 700; }
  .toplu-yanit, .hazir-sonuc { display: none !important; }
}