/* ─────────────────────────────────────────────────────────────────────────────
   Platform konsolu — ortak görsel dil (2026-09-21).

   Yedi ekran (hub, kurumlar, kurulum sihirbazı, iş listesi, iş ilerlemesi,
   bağlar, havuzlar) aynı kapak / rozet / kart ölçülerini paylaşır. Scoped CSS
   ile yazılsa yedi kopya olurdu ve biri düzeltilince diğerleri sessizce eski
   kalırdı (CSS token denetiminin 2026-08-23'te yakaladığı desen).

   KURAL: ham renk YOK. Her değer tasarım sisteminin token'ından gelir
   (`aurora.css`): --yuzey, --hat-kart, --metin-murekkep, --metin-ikincil,
   --marka-*, --analiz-* ailesi, --danger*. Tanımsız değişkene yedeksiz başvuru
   bildirimin TAMAMINI düşürür; `AnalizCssTokenTests` bunu kilitler.
   ──────────────────────────────────────────────────────────────────────────── */

body.edulive-cihaz .au-page.plt-vitrin {
  max-width: none;
  padding: 0;
  color: var(--metin-murekkep);
  font-family: var(--font-body);
}

/* ─── Kapak ─── */
.plt-kapak {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  grid-template-areas: "geri baslik eylem";
  align-items: center;
  gap: 14px 12px;
  margin-bottom: 16px;
  padding: 16px 24px 18px;
  border: 1px solid var(--hat-kart);
  border-radius: 3px 0 0 0;
  background: var(--yuzey);
  box-shadow:
    0 1px 0 color-mix(in srgb, var(--metin-murekkep) 4%, transparent),
    0 26px 48px -30px color-mix(in srgb, var(--marka-600) 65%, transparent);
}

.plt-kapak__geri { grid-area: geri; }
.plt-kapak__baslik { grid-area: baslik; min-width: 0; }
.plt-kapak__eylem { grid-area: eylem; display: flex; gap: 8px; flex-wrap: wrap; }

.plt-kapak .au-title {
  margin: 0;
  font: 700 23px/1.1 var(--font-display);
  letter-spacing: -.026em;
  color: var(--marka-700);
}

.plt-alt {
  margin: 4px 0 0;
  max-width: 72ch;
  color: var(--metin-ikincil);
  font-size: var(--yazi-kucuk, 12px);
  line-height: 1.5;
}

/* ─── Bölüm başlığı ─── */
.plt-bolum { margin-bottom: 20px; }
.plt-bolum:last-child { margin-bottom: 0; }

.plt-bolum-baslik {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 12px;
  color: var(--metin-murekkep);
  font: 700 15px/1.4 var(--font-display);
  letter-spacing: -.012em;
}

.plt-bolum-baslik::before {
  content: "";
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 8px solid var(--marka-500);
}

/* Ekran okuyucuya görünür, göze görünmez (tablo caption'ları).
   `display:none` OLMAZ — o, içeriği erişilebilirlik ağacından da siler. */
.plt-gizli {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* ─── Kart ─── */
.plt-kart {
  padding: 16px 20px 18px;
  margin-bottom: 14px;
  border: 1px solid var(--hat-kart);
  border-radius: var(--radius-sm, 12px);
  background: var(--yuzey);
}

.plt-kart:last-child { margin-bottom: 0; }

.plt-kart__baslik {
  margin: 0 0 4px;
  font: 700 14px/1.35 var(--font-display);
  color: var(--metin-murekkep);
}

.plt-kart__alt {
  margin: 0 0 12px;
  color: var(--metin-ikincil);
  font-size: var(--yazi-kucuk, 12px);
  line-height: 1.55;
}

/* ─── Rozet ─── */
.plt-rozet {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 9px;
  border-radius: var(--radius-pill, 999px);
  font: 600 11px/1.6 var(--font-body);
  white-space: nowrap;
}

.plt-rozet--iyi      { background: var(--analiz-iyi-acik);     color: var(--analiz-iyi-rozet-metin); }
.plt-rozet--bekleme  { background: var(--analiz-orta-acik);    color: var(--analiz-orta-rozet-metin); }
.plt-rozet--uyari    { background: var(--analiz-dikkat-acik);  color: var(--analiz-dikkat-rozet-metin); }
.plt-rozet--sonlu    { background: color-mix(in srgb, var(--metin-ikincil) 12%, transparent); color: var(--metin-ikincil); }
/* `--hassas` YALNIZ KVKK anlamındadır: "kişisel veriye ya da geri alınamaz işleme
   dokunan yetenek" (YetenekSozlugu). Hata/başarısızlık için ayrı bir sınıf vardır;
   aynı kırmızıyı iki anlama birden yüklemek okuyucuyu "bu yetenek mi bozuk mu"
   sorusuna düşürüyordu (şerit ailesinde bu ayrım `--uyari`/`--tehlike` ile zaten var). */
.plt-rozet--hassas   { background: color-mix(in srgb, var(--danger) 12%, transparent); color: var(--danger-rozet-metin); }
.plt-rozet--tehlike  { background: color-mix(in srgb, var(--danger) 12%, transparent); color: var(--danger-rozet-metin); }

/* ─── Tablo ─── */
.plt-tablo-kap { overflow-x: auto; }

.plt-tablo {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--yazi-kucuk, 12px);
}

.plt-tablo th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 9px 12px;
  border-bottom: 1px solid var(--hat-kart);
  background: var(--yuzey);
  color: var(--metin-ikincil);
  font: 600 11px/1.5 var(--font-body);
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.plt-tablo td {
  padding: 10px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--hat-kart) 60%, transparent);
  color: var(--metin-murekkep);
  vertical-align: top;
}

.plt-tablo tbody tr:hover td {
  background: color-mix(in srgb, var(--marka-500) 4%, transparent);
}

.plt-tablo__ad { font-weight: 600; }
.plt-tablo__sessiz { color: var(--metin-ikincil); }

/* ─── KPI şeridi ─── */
.plt-kpi-serit {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 14px;
}

.plt-kpi {
  flex: 1 1 130px;
  min-width: 110px;
  padding: 10px 14px;
  border: 1px solid var(--hat-kart);
  border-radius: var(--radius-sm, 12px);
  background: var(--yuzey);
}

.plt-kpi__d {
  display: block;
  font: 700 20px/1.15 var(--font-display);
  color: var(--marka-700);
}

.plt-kpi__d--metin { font-size: 14px; }

.plt-kpi__e {
  display: block;
  margin-top: 2px;
  color: var(--metin-ikincil);
  font-size: 11px;
}

/* ─── Bulgu listesi (önizleme) ─── */
.plt-bulgular { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }

.plt-bulgu {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--hat-kart);
  border-left-width: 3px;
  border-radius: var(--radius-sm, 12px);
  background: var(--yuzey);
}

.plt-bulgu--hata  { border-left-color: var(--danger); }
.plt-bulgu--uyari { border-left-color: var(--analiz-dikkat); }
.plt-bulgu--bilgi { border-left-color: var(--analiz-iyi); }

.plt-bulgu__metin { margin: 0; font-size: var(--yazi-kucuk, 12px); line-height: 1.55; }

.plt-bulgu__ornek {
  margin: 6px 0 0;
  padding-left: 16px;
  color: var(--metin-ikincil);
  font-size: 11px;
  line-height: 1.6;
}

/* ─── Adım kütüğü (kurulum ilerlemesi) ─── */
.plt-adimlar { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }

.plt-adim {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border: 1px solid var(--hat-kart);
  border-radius: var(--radius-sm, 12px);
  background: var(--yuzey);
}

.plt-adim--calisiyor { border-color: color-mix(in srgb, var(--marka-500) 45%, var(--hat-kart)); }
.plt-adim--basarisiz { border-color: color-mix(in srgb, var(--danger) 45%, var(--hat-kart)); }

.plt-adim__no {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--marka-500) 10%, transparent);
  color: var(--marka-700);
  font: 700 11px/1 var(--font-body);
}

.plt-adim__ad { font-size: var(--yazi-kucuk, 12px); font-weight: 600; min-width: 0; }
.plt-adim__hata { margin: 3px 0 0; color: var(--danger-metin); font-size: 11px; line-height: 1.5; }

/* ─── İlerleme çubuğu ─── */
.plt-ilerleme {
  height: 7px;
  margin: 10px 0 14px;
  border-radius: var(--radius-pill, 999px);
  background: color-mix(in srgb, var(--metin-ikincil) 12%, transparent);
  overflow: hidden;
}

.plt-ilerleme__dolu {
  height: 100%;
  background: var(--marka-rampa-serit);
  transition: width .35s var(--ease-smooth, ease);
}

/* ─── Yetenek listesi (rıza) ─── */
.plt-yetenekler { display: grid; gap: 14px; }

.plt-yetenek-aile__baslik {
  margin: 0 0 8px;
  color: var(--metin-ikincil);
  font: 600 11px/1.5 var(--font-body);
  text-transform: uppercase;
  letter-spacing: .05em;
}

.plt-yetenek {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--hat-kart);
  border-radius: var(--radius-sm, 12px);
  background: var(--yuzey);
}

.plt-yetenek + .plt-yetenek { margin-top: 6px; }
.plt-yetenek--hassas { border-color: color-mix(in srgb, var(--danger) 35%, var(--hat-kart)); }

.plt-yetenek__baslik {
  display: flex;
  align-items: center;
  gap: 7px;
  font: 600 13px/1.4 var(--font-body);
  color: var(--metin-murekkep);
}

.plt-yetenek__aciklama {
  margin: 3px 0 0;
  color: var(--metin-ikincil);
  font-size: var(--yazi-kucuk, 12px);
  line-height: 1.55;
}

.plt-yetenek__kutu { margin-top: 2px; }

/* ─── Şerit (banner) ─── */
.plt-serit {
  margin: 12px 0 0;
  padding: 10px 14px;
  border: 1px solid var(--hat-kart);
  border-left: 3px solid var(--hat-kart);
  border-radius: var(--radius-sm, 12px);
  font-size: var(--yazi-kucuk, 12px);
  line-height: 1.55;
}

.plt-serit--uyari {
  border-left-color: var(--analiz-dikkat);
  background: color-mix(in srgb, var(--analiz-dikkat-acik) 55%, var(--yuzey));
  color: var(--analiz-dikkat-metin);
}

.plt-serit--tehlike {
  border-left-color: var(--danger);
  background: color-mix(in srgb, var(--danger) 8%, var(--yuzey));
  color: var(--danger-metin);
}

.plt-serit--bilgi {
  border-left-color: var(--marka-500);
  background: color-mix(in srgb, var(--marka-500) 6%, var(--yuzey));
  color: var(--metin-murekkep);
}

/* ─── Özet listesi ─── */
.plt-ozet {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 10px 18px;
  margin: 0;
}

.plt-ozet > div {
  padding-bottom: 8px;
  border-bottom: 1px solid color-mix(in srgb, var(--hat-kart) 60%, transparent);
}

.plt-ozet dt {
  color: var(--metin-ikincil);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.plt-ozet dd {
  margin: 2px 0 0;
  color: var(--metin-murekkep);
  font: 600 13px/1.4 var(--font-body);
  word-break: break-word;
}

/* ─── Boş durum ─── */
.plt-bos {
  padding: 26px 24px;
  border: 1px dashed var(--hat-kart);
  border-radius: var(--radius-sm, 12px);
  background: var(--yuzey);
  color: var(--metin-ikincil);
  font-size: var(--yazi-kucuk, 12px);
  line-height: 1.6;
  text-align: center;
}

.plt-bos__baslik {
  margin: 0 0 6px;
  color: var(--metin-murekkep);
  font: 700 14px/1.35 var(--font-display);
}

/* ─── Rıza kütüğü (açılır) ─── */
.plt-kutuk { margin-top: 12px; }

.plt-kutuk > summary {
  cursor: pointer;
  color: var(--metin-ikincil);
  font-size: var(--yazi-kucuk, 12px);
}

.plt-kutuk > summary:focus-visible {
  outline: 2px solid var(--marka-500);
  outline-offset: 2px;
  border-radius: var(--radius-sm, 12px);
}

/* ─── Eylem satırı ─── */
.plt-eylemler {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

/* ─── Sekmeler ─── */
.plt-sekmeler {
  display: flex;
  gap: 4px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--hat-kart);
}

.plt-sekme {
  padding: 8px 14px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: none;
  color: var(--metin-ikincil);
  font: 600 13px/1.4 var(--font-body);
  cursor: pointer;
}

.plt-sekme:hover { color: var(--metin-murekkep); }

.plt-sekme[aria-selected="true"],
.plt-sekme[aria-pressed="true"] {
  border-bottom-color: var(--marka-500);
  color: var(--marka-700);
}

.plt-sekme:focus-visible {
  outline: 2px solid var(--marka-500);
  outline-offset: 2px;
  border-radius: var(--radius-sm, 12px) var(--radius-sm, 12px) 0 0;
}

/* ─── Form ızgarası (sihirbaz adımları) ─── */
.plt-form-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px 16px;
}

.plt-form-tam { grid-column: 1 / -1; }

/* ─── Dar ekran ─── */
@media (max-width: 640px) {
  .plt-kapak {
    grid-template-columns: 30px minmax(0, 1fr);
    grid-template-areas: "geri baslik" "eylem eylem";
    padding: 14px 16px 16px;
  }
  .plt-kapak .au-title { font-size: 20px; }
  .plt-kart { padding: 14px 16px 16px; }
  .plt-adim { grid-template-columns: 22px minmax(0, 1fr); }
  .plt-sekmeler { overflow-x: auto; }
}

/* ─── Adım notu (atlama gerekçesi) ─── */
.plt-adim__not {
  margin: 3px 0 0;
  /* `--metin-soluk` tasarım sisteminde TANIMLI DEĞİL (aurora.css'te yok). Yedeksiz
     `var()` bildirimin tamamını düşürür, yani bu renk hiç uygulanmıyordu. Kanonik
     ikincil metin token'ı `--metin-ikincil`dir (aurora.css:218). */
  color: var(--metin-ikincil);
  font-size: 11px;
  line-height: 1.5;
}

/* ─── Dar ekranda tablo → kart ───────────────────────────────────────────
   Yatay kaydırma (`overflow-x`) telefonda bir çözüm değil: kullanıcı ilk
   sütunu görür, karar için gereken "Durum" sütununu hiç bulamaz. Her hücre
   kendi etiketiyle (`data-etiket`) alt alta dizilir.

   ⚠️ İKİ ERİŞİLEBİLİRLİK SONUCU — ikisi de işaretlemeyi ilgilendirir:
   • `display:block` tüm büyük tarayıcılarda table/row/cell rollerini
     erişilebilirlik ağacından SİLER. `caption` ve `scope="col"` telefonda
     hükümsüz kalır; bu yüzden roller işaretlemede AÇIKÇA bildirilir
     (`role="table"/"rowgroup"/"row"/"cell"`) ve satır içi eylem düğmeleri
     satırı taşıyan bir `aria-label` alır.
   • `::before` içeriği ekran okuyucular tarafından OKUNUR (NVDA/JAWS/VO).
     Bu yorum eskiden "aria-hidden nedeniyle tekrar üretilmez" diyordu;
     işaretlemede öyle bir `aria-hidden` yok ve olsa da rol silinmesini
     çözmezdi — etiket tekrarı bilinçli olarak kabul edilir, çünkü kart
     modunda hücrenin başlığı başka türlü hiç söylenmez.                     */
@media (max-width: 720px) {
  .plt-tablo-kap { overflow-x: visible; }

  .plt-tablo,
  .plt-tablo tbody,
  .plt-tablo tr,
  .plt-tablo td { display: block; width: 100%; }

  .plt-tablo thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

  .plt-tablo tr {
    /* `--cizgi` TANIMSIZDI ve yedeksizdi: bildirim tümüyle düşüyor, kart moduna
       geçen satırları birbirinden ayıran TEK görsel sınır yok oluyordu (satırları
       yalnız 10px margin ayırıyordu). Kanonik kenarlık token'ı `--hat-kart`. */
    border: 1px solid var(--hat-kart);
    border-radius: var(--radius-sm, 12px);
    padding: 10px 12px;
    margin-bottom: 10px;
  }

  .plt-tablo td {
    border: 0;
    padding: 4px 0;
    display: grid;
    grid-template-columns: minmax(0, 40%) minmax(0, 60%);
    gap: 8px;
    align-items: baseline;
  }

  .plt-tablo td::before {
    content: attr(data-etiket);
    /* `--metin-soluk` tanımsızdı → bildirim düşüyor, etiket `td`'nin mürekkep
       rengini miras alıyor ve etiket ile veri ayırt edilemiyordu. */
    color: var(--metin-ikincil);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .02em;
  }

  .plt-tablo td:not([data-etiket]) { grid-template-columns: minmax(0, 1fr); }
}

/* ─── Erişilebilirlik ────────────────────────────────────────────────────
   Bu ekranların ayrımlarının çoğu ZEMİN TONUYLA yapılıyor (aktif sekme, rozet
   tonları, şeritler). Zorlanmış renk kipinde tarayıcı zeminleri sistem
   renklerine indirir ve bu ayrımlar birden yok olur — ayrım kenarlığa taşınır. */
@media (forced-colors: active) {
  .plt-rozet,
  .plt-serit,
  .plt-kart,
  .plt-bos { border: 1px solid CanvasText; }

  .plt-sekme[aria-selected="true"],
  .plt-sekme[aria-pressed="true"] { border-bottom: 3px solid CanvasText; }

  .plt-bulgu { border-left: 4px solid CanvasText; }
  .plt-ilerleme__dolu { background: CanvasText; }
}

@media (prefers-reduced-motion: reduce) {
  .plt-ilerleme__dolu,
  .plt-kart,
  .plt-sekme { transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   KAPSAM (kurum-üstü okuma + karışma) — 2026-09-22.

   Platform konsoluyla AYNI görsel dili kullanır (`plt-*` sınıfları aynen
   geçerlidir); burada yalnız bu modüle özgü üç şey var:
     • maskeli hücre rozeti  (.kps-maske)  — "söylenemez" ≠ "veri yok"
     • "X adına işlem" bandı (.kps-band)   — kalıcı, yapışkan, göz ardı edilemez
     • yan yana okul ızgarası (.kps-secim) — grup panosunun seçici satırı
   ─────────────────────────────────────────────────────────────────────────── */

/* ─── Maskeli hücre ───
   "—" KULLANILMAZ: o işaret "ölçülemedi" demektir ve maskeleme ondan farklıdır.
   Rozet, hücrenin gizlendiğini ve bunun bir veri eksikliği OLMADIĞINI söyler. */
.kps-maske {
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  border: 1px dashed var(--hat-kart);
  border-radius: var(--radius-pill, 999px);
  background: color-mix(in srgb, var(--metin-ikincil) 8%, transparent);
  color: var(--metin-ikincil);
  font: 600 11px/1.6 var(--font-body);
  white-space: nowrap;
  cursor: help;
}

/* ─── "X adına işlem yapıyorsunuz" bandı ───
   YAPIŞKAN ve HER ZAMAN görünür: kullanıcı sayfayı kaydırdıkça kaybolan bir
   uyarı, en çok kaydırıldıktan sonra — yani formu doldururken — gerekir.
   Kenarlık + zemin birlikte kullanılır; zorlanmış renk kipinde zemin düşer. */
.kps-band {
  position: sticky;
  top: 0;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin: 0 0 14px;
  padding: 11px 16px;
  border: 1px solid var(--analiz-dikkat);
  border-left-width: 4px;
  border-radius: var(--radius-sm, 12px);
  background: color-mix(in srgb, var(--analiz-dikkat-acik) 70%, var(--yuzey));
  color: var(--analiz-dikkat-metin);
  font-size: var(--yazi-kucuk, 12px);
  line-height: 1.5;
}

.kps-band__ad {
  font: 700 13px/1.35 var(--font-display);
  color: var(--metin-murekkep);
}

.kps-band__cik { margin-left: auto; }

/* ─── Kurum seçici satırı ─── */
.kps-secim {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}

.kps-secim__dugme {
  padding: 7px 13px;
  border: 1px solid var(--hat-kart);
  border-radius: var(--radius-pill, 999px);
  background: var(--yuzey);
  color: var(--metin-ikincil);
  font: 600 12px/1.4 var(--font-body);
  cursor: pointer;
}

.kps-secim__dugme:hover { color: var(--metin-murekkep); }

.kps-secim__dugme[aria-pressed="true"] {
  border-color: var(--marka-500);
  background: color-mix(in srgb, var(--marka-500) 9%, var(--yuzey));
  color: var(--marka-700);
}

.kps-secim__dugme:focus-visible {
  outline: 2px solid var(--marka-500);
  outline-offset: 2px;
}

/* ─── Satır içi sayım rozeti (yayım sonucu) ─── */
.kps-sayim {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin: 10px 0 0;
  font-size: var(--yazi-kucuk, 12px);
  color: var(--metin-ikincil);
}

.kps-sayim b { color: var(--metin-murekkep); }

@media (forced-colors: active) {
  .kps-maske,
  .kps-band,
  .kps-secim__dugme { border: 1px solid CanvasText; }

  .kps-secim__dugme[aria-pressed="true"] { border: 3px solid CanvasText; }
}

/* ─── Koltuk havuzu (F6) — tablo hücresindeki kullanım göstergesi ───
   Çubuk yeni bir bilgi taşımaz, "dağıtılan / toplam" sayısını görselleştirir;
   bu yüzden `aria-hidden` ile işaretlenir (markup'ta) ve ekranda sayının
   ALTINDA durur. Sayı olmadan tek başına bir çubuk okunamaz. */
.hvz-koltuk {
  display: block;
  min-width: 132px;
}

.hvz-koltuk__sayi {
  font: 600 var(--yazi-kucuk, 12px)/1.4 var(--font-body);
  color: var(--metin-murekkep);
}

/* Tablo hücresinde `.plt-ilerleme`nin varsayılan dikey boşluğu satırı şişirir. */
.hvz-koltuk .plt-ilerleme { margin: 5px 0 3px; }