/* ============================================================
   ZEO GEO-RADAR — Davet kabul yüzeyi (assets/invite.css)

   Kapsam: yalnızca "inv-" ön ekli sınıflar. Yüzeyin iskeleti (
   .auth-page-wrapper / .auth-container.auth-solo / .auth-step-box /
   .auth-title / .auth-btn-primary …) auth.css'ten AYNEN ödünç alınır —
   09 §2 açılış kapılarının (radar.js renderBootGate) yaptığı gibi. Bu
   dosya o sınıfların HİÇBİRİNİ yeniden stillemez; ettiği an davet ekranı
   auth ekranından görsel olarak ayrışmaya başlardı.

   PLAYBOOK §1/§7: renk yalnız token üzerinden, !important yok, her kural
   iki temada da geçerli (--green/--red/--panel/--border tema-uyarlanır).
   ============================================================ */

/* Ekranın kimliğini tek bakışta veren rozet: bekleme (marka), başarı
   (yeşil), hata (kırmızı). Renkler tema-uyarlanır token'lardan gelir;
   koyu temada --green/--red zaten aydınlatılmış değerlerdir. */
.inv-hero {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-bottom: 18px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--chip-bg);
  color: var(--ink-3);
}
.inv-hero-wait {
  border-color: var(--pink-200);
  background: var(--pink-100);
  color: var(--accent);
}
.inv-hero-ok {
  border-color: var(--green);
  background: var(--chip-bg);
  color: var(--green);
}
.inv-hero-bad {
  border-color: var(--red);
  background: var(--chip-bg);
  color: var(--red);
}

/* Koyu temada --accent (#cc0a4d) aydınlatılmıyor (tokens.css:72) ve
   --pink-100 yarı saydam kırmızıya dönüyor; rozet metni bu yüzden koyu
   panelde okunaksız kalırdı. Düzeltme token'da DEĞİL, seçicide yapılır. */
body.dark .inv-hero-wait { color: var(--accent-dark); }

/* Yükleniyor satırı: dönen gösterge + tek cümle. */
.inv-wait-row {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 20px;
  color: var(--ink-3);
  font-size: 13px;
}

/* Katılınan çalışma alanı kartı — seçici ekrandaki satırlarla (renderBootGate
   wsRowsHTML) aynı ritim, ama tıklanabilir DEĞİL: burada seçim yok, sonuç var. */
.inv-ws-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin-top: 18px;
  padding: 13px 15px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--panel);
  box-shadow: var(--shadow-sm);
}
.inv-ws-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--font-head);
  font-size: 15.5px;
  font-weight: 700;
  color: var(--ink);
}

/* Dar ekran: kart dikeye döner ki uzun çalışma alanı adı rozeti ezmesin.
   PLAYBOOK: @media taban kuralın ARDINDAN gelir (eşit özgüllük, son kazanır). */
@media (max-width: 640px) {
  .inv-ws-card {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
  .inv-ws-name { white-space: normal; }
}