/* ==========================================================================
   SEKTOR RAPORLARI (KV-20)

   Iki is yapar:
     1. `.k-rapor` -- rapor YAZILARININ govdesinde `.k-prose`un tanimadigi
        iki oge: VERI TABLOSU ve KAYNAK ETIKETLI SEKIL. Kapsam yalnizca bu
        sinif; diger yazilar etkilenmez.
     2. `.k-rep`  -- rapor LISTESI. Iki yerde ayni: Essentials paftasindaki
        "One cikan raporlar" bolumu ve /raporlar/ (EN /en/reports/) sayfasi.
        Tek yerde tanimli, iki yerde kullanilir.

   ⛔ AYIRAC / ALTCIZGI / DEKORATIF YATAY KURAL YOK.
      Tabloda satir cizgisi de YOK: satirlari ayiran sey CIZGI degil, tek
      adimlik YUZEY farki (zebra) ve hizadir. Baslik satiri da cizgiyle degil
      yuzeyle ayrilir. Ritim hiza ve bosluktan gelir.
   ⛔ Hover'da yukselme / golge / olceklenme YOK. Baglantida renk degisir,
      bu bir eylem gostergesi -- dekor degil.
   ⛔ Yuvarlak koseli jenerik "kart" yigini YOK: rapor satiri kart degil,
      numarali sicil satiri (Essentials paftasindaki `.k-ess-reg` grameri).
   ⚠ prefers-color-scheme YOK -- site tek temali.
   ⚠ Tum degerler tokens.css'ten. Ham renk/olcu yok.
   ⚠ Bu dosya theme.css / v13-fixes.css'e DOKUNMAZ; kendi sinif adlariyla
     calisir. Ayri dosya olmasinin sebebi paralel yazma: ortak sayfalarda
     baska isler acik.
   ========================================================================== */

/* ── 1. Rapor govdesi ───────────────────────────────────────────────────── */

/* Sekil: grafik kendi kaynak altligini TASIYOR, o yuzden cerceve eklenmiyor.
   Grafiklerin zemini zaten acik; ustune ikinci bir kap koymak "cerceve icinde
   cerceve" uretiyordu (bkz. theme.css k-postcard__plate notu). */
.k-rapor__fig {
  margin: var(--space-8) 0;
}
.k-rapor__fig img {
  display: block;
  width: 100%;
  height: auto;
}
.k-rapor__fig figcaption {
  margin-top: var(--space-4);
  font-size: var(--size-caption);
  line-height: var(--lh-caption);
  color: var(--text-tertiary);
}
/* Kaynak baglantilari acikca baglanti gorunsun: kunye satiri kucuk, bu yuzden
   renk tek basina yeterli degil. */
.k-rapor__fig figcaption a {
  color: var(--text-primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.k-rapor__fig figcaption a:hover { color: var(--text-link-hover); }

/* Kapsam / ornekleme notu paragrafi (kaynak metinde italik satir). */
.k-rapor__note {
  font-size: var(--size-caption);
  line-height: var(--lh-caption);
  color: var(--text-tertiary);
}

/* Tablo. Dar ekranda SAYFA degil TABLO kayar -- yatay tasma uretmez. */
.k-rapor__tw {
  margin: var(--space-6) 0 var(--space-7);
  overflow-x: auto;
  /* Kaydirilabilir alan klavyeyle de gezilebilmeli. */
  -webkit-overflow-scrolling: touch;
}
.k-rapor__t {
  width: 100%;
  min-width: 420px;
  border-collapse: collapse;
  font-size: var(--size-body-sm);
  line-height: var(--lh-body-sm);
  font-variant-numeric: tabular-nums;
}
.k-rapor__t th {
  /* Baslik satiri cizgiyle degil YUZEYLE ayrilir. */
  background: var(--grey-100);
  font-size: var(--size-caption);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--text-tertiary);
  font-weight: 600;
  text-align: left;
  vertical-align: bottom;
}
.k-rapor__t th,
.k-rapor__t td {
  padding: var(--space-3) var(--space-5);
}
/* Zebra = tek adimlik kagit tonu. Satir cizgisinin yerine gecer. */
.k-rapor__t tbody tr:nth-child(even) { background: var(--grey-25); }
.k-rapor__t td { color: var(--text-primary); vertical-align: top; }
.k-rapor__t .is-r { text-align: right; }
.k-rapor__t .is-c { text-align: center; }
.k-rapor__t a { color: var(--text-primary); text-decoration: underline; text-underline-offset: 2px; }
.k-rapor__t a:hover { color: var(--text-link-hover); }

/* Kaynak listesi uzun; madde arasi nefes govdedekinden biraz fazla. */
.k-rapor h2 + p,
.k-rapor h3 + p { margin-top: 0; }

/* ── 2. Rapor listesi (Essentials paftasi + /raporlar/ sayfasi) ─────────── */
.k-rep__t {
  margin: 0 0 var(--space-6);
  font-size: var(--size-micro); line-height: 1.4;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  color: var(--text-tertiary);
}
.k-rep__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: var(--space-7);
}
/* Numara sutunu Essentials sicili ile AYNI genislikte (28px): iki blok
   yan yana durdugunda numaralar tek datum uzerinde okunur. */
.k-rep__row {
  display: grid; grid-template-columns: 28px minmax(0, 1fr);
  gap: 0 var(--space-4); align-items: baseline;
}
.k-rep__i {
  font-size: var(--size-micro); letter-spacing: var(--ls-wide);
  color: var(--text-tertiary); font-variant-numeric: tabular-nums;
}
.k-rep__b { display: block; min-width: 0; }
.k-rep__a {
  display: block;
  font-size: var(--size-body); line-height: 1.3;
  letter-spacing: var(--ls-snug); font-weight: 600;
  color: var(--text-primary);
}
.k-rep__a:hover { color: var(--text-link-hover); }
.k-rep__d {
  display: block; margin-top: var(--space-2);
  font-size: var(--size-caption); line-height: var(--lh-caption);
  color: var(--text-secondary);
}
.k-rep__m {
  display: block; margin-top: var(--space-3);
  font-size: var(--size-micro); letter-spacing: var(--ls-wide);
  text-transform: uppercase; color: var(--text-tertiary);
  font-variant-numeric: tabular-nums;
}
.k-rep__all {
  display: inline-block; margin-top: var(--space-7);
  font-size: var(--size-caption); letter-spacing: var(--ls-wide);
  text-transform: uppercase; color: var(--text-primary);
}
.k-rep__all:hover { color: var(--text-link-hover); }

/* Rapor kartinin levhasi: grafik KENDI acik zeminini ve kendi kenarini
   tasiyor. Beyaz levha + ic bosluk birakilirsa "cerceve icinde cerceve"
   oluyor (ayni gerekce theme.css k-postcard__plate notunda kayitli).
   Bu yuzden zemin ve ic bosluk BURADA sifirlanir. */
.k-postcard__plate--rapor { background: transparent; padding: 0; }
/* ⚠ object-fit: cover DENENDI ve GERI ALINDI: grafik 1,70:1, levha 16/10
   (1,60:1) -- cover yatayda kirpiyor ve grafigin BASLIGI kartin solundan
   kesiliyordu (olcum: /news/ 1440px, iki kartta baslik kesik). contain ile
   grafik butun halde okunur; ustte altta kalan ince bant levhanin kendi
   zeminidir. Ayni gerekce theme.css k-postcard__plate notunda da kayitli. */
.k-postcard__plate--rapor img { object-fit: contain; }

/* Gorseli de grafigi de olmayan yazinin TIPOGRAFIK levhasi ────────────────
   ⚠ NEDEN VAR: `kavela_v13_post_plate()` ucuncu asamada BOS bir <span>
     basiyordu; ayni izgarada komsu kartlarda fotograf/grafik varken 16/10'luk
     beyaz bir DELIK olarak duruyordu (olcum 27.08.2026, ?cb= ile: TR /news/
     butun sayfalarda 10, EN /en/blog/ 2, TR anasayfa 1, EN anasayfa 1).
   ⚠ Kutu AYNEN kalir: aspect-ratio, radius ve ic bosluk `.k-postcard__plate`
     temel kuralindan gelir -- izgara ve kart yuksekligi degismez, yalnizca
     zemin notr yuzeye cekilir (beyaz sayfada beyaz levha okunmuyordu).
   ⛔ Yeni token TANIMLANMADI: renk, font ailesi ve tipografi olcegi tema
      token'larindan. Ayirac cizgisi, altcizgi, kenarlik ritmi, golge ve
      hover yukselmesi YOK -- hiyerarsi yalniz boyut, ton ve yakinlik.
   ⚠ text-transform YOK: `uppercase` Turkce "i" harfini bozabiliyor.
     REFERANS/REFERENCE etiketi zaten PHP'de buyuk harf yaziliyor, kategori
     adi ise postun kendi yazimiyla basiliyor.
   ⚠ Uzun baslik KIRPILIR (-webkit-line-clamp), tasmaz; tam baslik zaten
     levhanin hemen altinda `.k-postcard__t` olarak duruyor.
   ⚠ prefers-color-scheme YOK -- site tek temali (acik). */
.k-postcard__plate--yazi {
  background: var(--surface-sunken);
  display: flex; flex-direction: column;
}
/* Ustteki sessiz satir: kategori adi ya da REFERANS/REFERENCE. */
.k-plate__x {
  display: block;
  font-size: var(--size-caption); line-height: var(--lh-caption);
  letter-spacing: var(--ls-caption); color: var(--text-tertiary);
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
/* Ana ton: baslik ya da yazinin kendi iddia satiri. */
.k-plate__t {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4;
  overflow: hidden;
  margin-top: var(--space-4);
  font-size: var(--size-h1); line-height: var(--lh-h1);
  letter-spacing: var(--ls-h1); font-weight: var(--weight-semibold);
  color: var(--text-primary); overflow-wrap: break-word; text-wrap: pretty;
}
/* Alttaki sessiz satir: yazida GECEN kaynak adlari. Yoksa hic basilmaz. */
.k-plate__s {
  display: block; margin-top: auto; padding-top: var(--space-4);
  font-size: var(--size-caption); line-height: var(--lh-caption);
  letter-spacing: var(--ls-caption); color: var(--text-tertiary);
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
/* ⚠ Dar ekranda levha kucuk: blog arsivi mobilde de IKI kolon (responsive.css
   479px notu), 390px'de kart ~171px ve levha ~107px yuksek. Masaustu olcegi
   orada satir sayisini tasiriyordu. Kirilma noktalari temanin kendi
   noktalari (767/479), olcek yine mevcut token'lardan bir kademe asagi. */
@media (max-width: 767px) {
  .k-postcard__plate--yazi { padding: var(--space-5); }
  .k-plate__t {
    -webkit-line-clamp: 3;
    margin-top: var(--space-3);
    font-size: var(--size-body); line-height: var(--lh-body);
    letter-spacing: var(--ls-body);
  }
  .k-plate__s { padding-top: var(--space-3); }
}
@media (max-width: 479px) {
  .k-postcard__plate--yazi { padding: var(--space-4); }
  .k-plate__x, .k-plate__s { font-size: var(--size-micro); }
  .k-plate__t {
    -webkit-line-clamp: 2;
    margin-top: var(--space-2);
    font-size: var(--size-body-sm); line-height: var(--lh-caption);
  }
  .k-plate__s { padding-top: var(--space-2); }
}

/* ── 3. /raporlar/ sayfasi ──────────────────────────────────────────────── */
/* Sayfa kendi kabugunu getirmez: k-container/k-arch zaten var. Burada yalniz
   giris metninin olcusu ve listenin ustundeki ara ayarlanir. */
.k-repp__lead {
  max-width: var(--container-narrow);
  margin: var(--space-5) 0 0;
  font-size: var(--size-body-lg); line-height: var(--lh-body-lg);
  color: var(--text-secondary);
}
.k-repp__list { margin-top: var(--space-10); max-width: var(--container-narrow); }
.k-repp__note {
  max-width: var(--container-narrow);
  margin: var(--space-10) 0 0;
  font-size: var(--size-caption); line-height: var(--lh-caption);
  color: var(--text-tertiary);
}

@media (max-width: 519px) {
  .k-rapor__t { min-width: 360px; }
  .k-rep__list { gap: var(--space-6); }
}

/* ── R119: RENKLI tipografik levha ──────────────────────────────────────────
   Onceden her tipografik levha `--surface-sunken` idi: beyaz kartlarin yaninda
   neredeyse gorunmuyordu ve /news/ izgarasi tek tonda akiyordu. Grafik
   levhalari (`--rapor`) kart olceginde okunaksizdi -- eksen ve cubuk etiketleri
   ~228x160px'te gri gurultuye donuyordu -- onlarin yerini de bu aldi.

   ⚠ UYDURMA RENK YOK. Uc ton da temanin KENDI token'lari:
     t1 marka bordosu (--brand-burgundy-600), t2 krem (--brand-cream),
     t3 murekkep (--ink). Yeni renk tanimlanmadi.
   ⚠ Ton POST ID'sinden turer (PHP: `$p->ID % 3`), rastgele DEGIL -- ayni yazi
     her render'da ayni tonu alir, sayfa yenilenince renk ziplamaz.
   ⚠ Kontrast tek tek olculdu (WCAG AA esigi normal metin 4.5, buyuk metin 3.0):
     t1 baslik #FFF / #6B1E2C      -> 10.9:1
     t1 sessiz satir #D5C0C4 / #6B1E2C ->  7.3:1
     t2 baslik #1D1B19 / #E6D4C0   -> 12.3:1
     t2 sessiz satir #545049 / #E6D4C0 ->  5.7:1
     t3 baslik #FFF / #1D1B19      -> 16.9:1
     t3 sessiz satir #C9C5BF / #1D1B19 -> 10.4:1
   ⚠ text-transform YOK -- `uppercase` Turkce "i" harfini bozuyor (etiket zaten
     PHP'de buyuk harf yaziliyor).
   ⚠ prefers-color-scheme YOK -- site tek temali (acik). */

/* t1 — marka bordosu */
.k-postcard__plate--yazi.k-plate--t1 { background: var(--brand-burgundy-600); }
.k-postcard__plate--yazi.k-plate--t1 .k-plate__t { color: var(--text-inverse); }
.k-postcard__plate--yazi.k-plate--t1 .k-plate__x,
.k-postcard__plate--yazi.k-plate--t1 .k-plate__s { color: #D5C0C4; }

/* t2 — krem */
.k-postcard__plate--yazi.k-plate--t2 { background: var(--brand-cream); }
.k-postcard__plate--yazi.k-plate--t2 .k-plate__t { color: var(--ink); }
.k-postcard__plate--yazi.k-plate--t2 .k-plate__x,
.k-postcard__plate--yazi.k-plate--t2 .k-plate__s { color: var(--grey-700); }

/* t3 — murekkep */
.k-postcard__plate--yazi.k-plate--t3 { background: var(--ink); }
.k-postcard__plate--yazi.k-plate--t3 .k-plate__t { color: var(--text-inverse); }
.k-postcard__plate--yazi.k-plate--t3 .k-plate__x,
.k-postcard__plate--yazi.k-plate--t3 .k-plate__s { color: #C9C5BF; }