/* Document previews share paper typography, independently of the app theme.
   A4 size, per-template landscape rules and measured certificate frames remain
   in their original stylesheets. This file never styles .taslak-tuval. */
html[data-arayuz="modern"] :is(.belge, .belge-kagit) {
  --kart: #ffffff;
  --zemin: #ffffff;
  --yazi: #171d27;
  --yazi-soluk: #4a5565;
  --cizgi: #bcc4cf;
  --cizgi-koyu: #7b8797;
  --tablo-baslik-zemin: #f0f3f7;
  --tablo-baslik-yazi: #171d27;
  --satir-vurgu: #ffffff;
  --hucre-vurgu: #ffffff;
  --yesil-zemin: #e4f5ea;
  --yesil-yazi: #0f3f22;
  --yesil-cizgi: #14682f;
  --sari-zemin: #fbf0d6;
  --sari-yazi: #5d3803;
  --sari-cizgi: #8a5406;
  --kirmizi-zemin: #fbe2e7;
  --kirmizi-yazi: #720b23;
  --kirmizi-cizgi: #a3102f;
  background: #fff;
  color: var(--yazi);
  font-family: Arial, "Segoe UI", sans-serif;
  line-height: 1.5;
}

/* The same class is used for a flex signature group and for the attendance
   signature TABLE. A table must retain its row and column layout. */
html[data-arayuz="modern"] .belge table.imza-alani {
  display: table;
  width: 100%;
  table-layout: fixed;
}

@media screen {
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) {
    box-sizing: border-box;
    width: 100%;
    border: 1px solid #d4dae3;
    border-radius: 4px;
    box-shadow: 0 4px 20px rgba(23, 38, 61, .06);
    padding: clamp(22px, 3.5vw, 54px);
    margin-left: auto;
    margin-right: auto;
    overflow-wrap: break-word;
  }
  html[data-arayuz="modern"] .belge-kagit { max-width: 277mm; }
  html[data-arayuz="modern"] .icerik :is(.belge, .belge-kagit) :is(h1, h2, h3, h4, h5) {
    font-family: Arial, "Segoe UI", sans-serif;
    color: #171d27;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.35;
    text-transform: none;
  }
  html[data-arayuz="modern"] .icerik .belge :is(.belge-baslik, .belge-basligi h2) {
    margin: 0 0 7px;
    padding: 0;
    border: 0;
    font-size: 21px;
    text-align: center;
  }
  html[data-arayuz="modern"] .icerik .belge .belge-basligi { margin-bottom: 22px; }
  html[data-arayuz="modern"] .icerik .belge .belge-basligi .alt {
    margin-top: 5px;
    font-size: 13px;
    line-height: 1.5;
    color: #4a5565;
  }
  html[data-arayuz="modern"] .icerik .belge h3,
  html[data-arayuz="modern"] .icerik .belge-kagit h2 {
    font-size: 15px;
    margin: 22px 0 8px;
    padding: 0;
    border: 0;
  }
  html[data-arayuz="modern"] .icerik .belge h4 { font-size: 13px; margin: 14px 0 6px; }
  html[data-arayuz="modern"] .icerik .belge h5 { font-size: 12.5px; margin: 12px 0 5px; }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) p {
    font-size: 13px;
    line-height: 1.55;
    margin-top: 6px;
    margin-bottom: 8px;
  }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) :is(ul, ol) {
    padding-left: 22px;
    font-size: 13px;
    line-height: 1.55;
  }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) li + li { margin-top: 4px; }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) :is(.kucuk, .belge-dipnot, .belge-mevzuat) {
    font-size: 11.5px;
    line-height: 1.5;
  }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) .tablo {
    border-collapse: collapse !important;
    border-spacing: 0;
    border-radius: 0;
    box-shadow: none;
  }
  html[data-arayuz="modern"] .icerik :is(.belge, .belge-kagit) table :is(th, td) {
    padding: 6px 8px;
    border: 1px solid #bcc4cf;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.45;
    vertical-align: top;
    white-space: normal;
    text-transform: none;
    letter-spacing: 0;
  }
  html[data-arayuz="modern"] .icerik :is(.belge, .belge-kagit) table th {
    position: static;
    background: #f0f3f7;
    color: #171d27;
    font-weight: 700;
  }
  html[data-arayuz="modern"] .icerik :is(.belge, .belge-kagit) table td b { font-weight: 700; }

  /* 🔴 **YOĞUN FORM DÜZENİ — MODERN KATMANDA DA AÇILMALI.** Yukarıdaki
     `… table :is(th, td)` seçicisi (0,3,3) temel katmandaki `.belge-sik`
     kuralını (0,1,2) eziyor; yalnız `isgbys-cikti.css`e yazılsaydı form
     **hiç sıkışmazdı** — logoda aynı tuzak bugün yaşandı (ölçüm: 50 mm
     yazılıyken ekranda 58,1 mm).
     ⚠️ Sayılar burada **tekrarlanmıyor**, temel katmandan miras alınıyor:
     `font` ve `padding` değerleri `.belge-sik` kuralının kendisinde durur;
     burada yalnız o kuralın **kazanması** sağlanıyor. */
  html[data-arayuz="modern"] .icerik .belge.belge-sik table :is(th, td) {
    padding: 0 4px;
    font-size: 8pt;
    line-height: 1.1;
  }
  html[data-arayuz="modern"] .icerik .belge.belge-sik table { margin: 1px 0 3px; }
  /* ⚠️ Foto kutusu tablo dışında, mutlak konumlu (gerekçe `isgbys-cikti.css`
     ve şablondaki yorumda). Modern katmanın `… img { max-width: 100% }`
     kuralı kutuyu bozmasın diye görsel açıkça kutuyu dolduruyor. */
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) .belge-foto img {
    width: 100%; height: 100%; max-width: none; object-fit: cover;
  }
  html[data-arayuz="modern"] .icerik .belge.belge-sik .belge-basligi { margin-bottom: 6px; }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit).belge-sik { padding: 6px 10px; }
  html[data-arayuz="modern"] .icerik .belge.belge-sik table { margin: 1px 0 2px; }
  html[data-arayuz="modern"] .icerik .belge.belge-sik h3 { font-size: 9.5pt; margin: 2px 0 1px; }
  html[data-arayuz="modern"] .icerik .belge.belge-sik h4 { font-size: 8.6pt; margin: 3px 0 1px; }
  html[data-arayuz="modern"] .icerik .belge.belge-sik h5 { font-size: 8pt; margin: 3px 0 1px; }
  html[data-arayuz="modern"] .icerik :is(.belge, .belge-kagit).belge-sik :is(h1, h2) {
    font-size: 13pt; letter-spacing: 0; margin: 0;
  }
  html[data-arayuz="modern"] .belge.belge-sik p {
    font-size: 8pt; line-height: 1.25; margin: 1px 0;
  }
  html[data-arayuz="modern"] .belge.belge-sik :is(ul, ol) {
    font-size: 8pt; line-height: 1.25; margin: 1px 0; padding-left: 16px;
  }
  html[data-arayuz="modern"] .belge.belge-sik .imza-alani > div { line-height: 1.25; }
  /* Month columns keep their compact, explicitly chosen widths. */
  html[data-arayuz="modern"] .icerik .belge .egitim-ay-tablosu :is(th.ay, td.ay) {
    padding-left: 0;
    padding-right: 0;
    text-align: center;
  }
  html[data-arayuz="modern"] .belge .imza-alani { margin-top: 30px; }
  html[data-arayuz="modern"] .belge .imza-alani > div { min-width: 0; line-height: 1.5; }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) img { max-width: 100%; object-fit: contain; }
  /* 🔴 **LOGO YUKARIDAKİ KURALIN İSTİSNASIDIR.** `… img` seçicisi (0,2,2)
     `.belge .belge-logo`yu (0,2,0) **eziyor**: CSS'te 50 mm yazılıyken ekranda
     **58,1 mm** ölçüldü (28 Eyl 2026). Sinsi tarafı: aynı kuraldan
     `max-height` GEÇİYOR, `max-width` geçmiyordu — kusur "yarı uygulanmış"
     göründüğü için ölçmeden fark edilmiyordu.
     ⚠️ Ölçü burada TEKRARLANMAZ, `isgbys-cikti.css`teki değişken okunur. */
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) .belge-logo {
    max-width: var(--belge-logo-en);
    max-height: var(--belge-logo-boy);
    margin: 0 0 10px;
  }
}

@media print {
  /* A long table may span pages; keep individual rows and repeat its header.
     The old whole-table avoid rule moved tall tables to mostly empty pages. */
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) table {
    page-break-inside: auto;
    break-inside: auto;
    border-collapse: collapse;
  }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) :is(.belge-tablo, table.imza-alani) {
    display: table;
    overflow: visible;
    width: 100%;
  }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) tr { page-break-inside: avoid; break-inside: avoid; }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) thead { display: table-header-group; }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) :is(h1, h2, h3, h4, h5) {
    page-break-after: avoid;
    break-after: avoid;
  }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) :is(p, li) { orphans: 3; widows: 3; }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) :is(.kunye, .belge-kunye, .imza-alani, .belge-imza, .kroki) {
    page-break-inside: avoid;
    break-inside: avoid;
  }
  html[data-arayuz="modern"] .belge-kagit {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    margin: 0;
    width: 100%;
    max-width: none;
  }
  html[data-arayuz="modern"] .belge-kagit .yorum-kutu { white-space: pre-wrap; }
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) th {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

@media screen and (max-width: 640px) {
  html[data-arayuz="modern"] :is(.belge, .belge-kagit) { padding: 18px 14px; }
  html[data-arayuz="modern"] .icerik .belge :is(.belge-baslik, .belge-basligi h2) { font-size: 18px; }
  html[data-arayuz="modern"] .icerik :is(.belge, .belge-kagit) table :is(th, td) { padding: 5px; }
  html[data-arayuz="modern"] .belge div.imza-alani { gap: 14px; flex-wrap: wrap; }
  html[data-arayuz="modern"] .belge div.imza-alani > div { flex-basis: 120px; }
}