/* kopru.css — platform bağlantıları ekranı. reports.css (token'lar, topbar,
   tablo) ve users.css (modal, .field, .ghostbtn) ÜSTÜNE biner; burada yalnız
   bu ekrana özgü üç şey var: durum ışığı, oturum rozeti, jeton kutusu.

   DURUM IŞIĞI TASARIM KARARI: renk TEK BAŞINA anlam taşımaz — her ışığın
   yanında metin vardır. Operasyon ekranı gündüz vardiyasında uzaktan
   okunuyor ve renk körlüğü/parlama gerçek bir sorun. */

.lead { margin:0 0 18px; font-size:13px; color:var(--ink-2); max-width:72ch; line-height:1.55; }

/* --- durum ışığı --- */
.dot { display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:7px; vertical-align:-1px; }
.dot--on   { background:var(--green); box-shadow:0 0 0 3px color-mix(in srgb, var(--green) 22%, transparent); }
.dot--off  { background:var(--red);   box-shadow:0 0 0 3px color-mix(in srgb, var(--red) 22%, transparent); }
.dot--warn { background:var(--amber); box-shadow:0 0 0 3px color-mix(in srgb, var(--amber) 22%, transparent); }

.state { font-weight:600; font-size:12.5px; white-space:nowrap; }
.state--on   { color:var(--green); }
.state--off  { color:var(--red); }
.state--warn { color:var(--amber); }

/* Oturum rozeti: "parola gerekiyor" restoranın yapması gereken TEK iş, o
   yüzden diğer durumlardan görsel olarak ayrılır. */
.sess { display:inline-block; padding:1px 8px; border-radius:999px; font-size:11.5px; font-weight:600;
        border:1px solid var(--line); }
.sess--ok   { background:var(--accent-weak); color:var(--accent-ink); border-color:transparent; }
.sess--pass { background:var(--amber-bg);    color:var(--amber); }
.sess--err  { background:var(--red-bg);      color:var(--red); }
.sess--unk  { color:var(--ink-3); }

/* --- jeton kutusu --- */
.tokenwarn { margin:0; padding:12px 14px; background:var(--amber-bg); border:1px solid var(--line);
             border-radius:10px; font-size:12.5px; color:var(--ink-2); line-height:1.5; }
.token { margin:12px 0; padding:12px 14px; background:var(--surface-3); border:1px solid var(--line-2);
         border-radius:10px; font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:12.5px;
         word-break:break-all; white-space:pre-wrap; color:var(--ink); }
#tokenBox { padding:18px; display:flex; flex-direction:column; gap:10px; }

.msg { margin:0; font-size:12.5px; min-height:1em; }
.msg--err { color:var(--red); }
.msg--ok  { color:var(--green); }

.errcell { color:var(--red); font-size:12px; max-width:34ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Kurulum adımları: jeton üretildikten sonra "peki şimdi ne olacak" sorusunu
   panelde cevaplar. Bu metin olmadan kurulum kodu tek başına anlamsızdır. */
.adimlar { border-top:1px solid var(--line); padding-top:14px; margin-top:4px; }
.adimlar h4 { margin:0 0 8px; font-size:13px; font-weight:700; }
.adimlar ol { margin:0 0 10px; padding-left:20px; font-size:13px; color:var(--ink-2); line-height:1.7; }
.adimlar .muted { font-size:12.5px; margin:0; }

.indirsatir { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 10px; }
.indirsatir .btn { text-decoration:none; padding:8px 14px; border-radius:9px; border:1px solid var(--accent-weak); }