/* ═══════════════════════════════════════════════════════════════
   ARKUN — giriş / kayıt katmanı
   Yayındaki public/index.html'den OLDUĞU GİBİ taşındı (satır 1699-1755).
   Kasıtlı olarak arkun.css'e karıştırılmadı: bu blok çalışan ve
   sertleştirilmiş bir akışa ait, tasarım sisteminden ayrı tutuluyor ki
   ileride biri tasarımı değiştirirken buraya dokunmasın.
   ═══════════════════════════════════════════════════════════════ */

  .ark-katman {
    position: fixed; inset: 0; z-index: 9999;
    background: rgba(0,0,0,.82);
    display: none; align-items: center; justify-content: center;
    padding: 20px; overflow-y: auto;
  }
  .ark-katman.acik { display: flex; }
  .ark-sarmal { width: 100%; max-width: 380px; }
  .ark-kutu {
    background: #141414; border: 1px solid var(--accent);
    border-radius: 16px; padding: 22px;
    box-shadow: 0 0 40px rgba(255,94,0,.25);
  }
  .ark-sekmeler { display: flex; gap: 8px; margin-bottom: 16px; }
  .ark-sekme {
    flex: 1; padding: 9px; border-radius: 9px; cursor: pointer;
    background: #1e1e1e; color: #aaa; border: 1px solid #2a2a2a;
    font-weight: 800; font-size: 13px; font-family: inherit;
  }
  .ark-sekme.secili {
    background: var(--accent); color: #000; border-color: var(--accent);
  }
  .ark-kutu label {
    display: block; font-size: 12px; color: #9a9a9a;
    margin: 10px 0 4px; font-weight: 700;
  }
  .ark-kutu input {
    width: 100%; padding: 11px 12px; border-radius: 9px;
    background: #0e0e0e; border: 1px solid #2a2a2a; color: #f0f0f0;
    font-size: 14px; font-family: inherit;
  }
  .ark-kutu input:focus { outline: none; border-color: var(--accent); }
  .ark-gonder {
    width: 100%; margin-top: 16px; padding: 12px; border: none;
    border-radius: 999px; background: var(--accent); color: #000;
    font-weight: 900; font-size: 14px; cursor: pointer; font-family: inherit;
  }
  .ark-gonder:disabled { opacity: .6; cursor: default; }
  .ark-mesaj {
    margin-top: 12px; font-size: 13px; line-height: 1.5;
    padding: 10px; border-radius: 8px; display: none;
  }
  .ark-mesaj.hata { display: block; background: rgba(239,68,68,.12); color: #ff8a8a; }
  .ark-mesaj.iyi { display: block; background: rgba(34,197,94,.12); color: #7ee2a8; }
  /* Kutunun ALTINDA — bilerek kutu dışında */
  .ark-yardim { margin-top: 14px; text-align: center; font-size: 13px; color: #8a8a8a; }
  .ark-yardim button {
    background: none; border: none; color: var(--accent);
    cursor: pointer; font: inherit; text-decoration: underline; padding: 4px 6px;
  }
  .ark-kapat {
    position: absolute; top: 16px; right: 20px;
    background: none; border: none; color: #888;
    font-size: 30px; cursor: pointer; line-height: 1;
  }

/* ── DOKUNMA HEDEFİ DÜZELTMESİ ────────────────────────────────────
   Aşağıdakiler taşınan koda EK. Mantık değişmedi, yalnızca ölçüler.
   Ölçüldü: sekmeler ve alanlar 41px, kapat düğmesi 30px, "unuttum"
   bağlantıları 29px idi — hepsi 44px eşiğinin altında ve bu form
   telefonda dolduruluyor. */
.ark-sekme,
.ark-kutu input,
.ark-gonder { min-height: 44px; }

.ark-kapat {
  width: 44px; height: 44px;
  display: grid; place-items: center;
}

.ark-yardim button {
  min-height: 44px;
  padding-inline: 8px;
}

/* Klavye odağı — arkun.css'teki :focus-visible kuralıyla aynı dil */
.ark-katman :focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* ── KOD ADIMI ─────────────────────────────────────────────────
   Tanınmayan cihazdan giriş yapılınca formların yerine geçen bölüm.
   Kutu içinde kalıyor, katman yeniden boyutlanmıyor. */
.ark-kod-baslik {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 8px;
}
.ark-kod-aciklama {
  color: var(--dim);
  font-size: 0.9rem;
  line-height: 1.5;
  margin-bottom: 20px;
}
#kodAdimi .kod-alani { display: flex; align-items: center; }
.ark-kod-alt { margin-top: 18px; }
.ark-kod-alt button {
  appearance: none;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  color: var(--dimmer);
  font: inherit;
  font-size: 0.85rem;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.ark-kod-alt button:hover { color: var(--fg); }

/* Yaş / koşul onayı.
   .ark-kutu label kuralını EZMEK zorunda: oradaki display:block ve
   font-weight:700 form etiketleri için doğru ama burada metin bir
   etiket değil, cümle — kalın ve blok olunca hem çığlık atıyor hem de
   kutunun yanına geçmiyor. */
.ark-kutu label.ark-onay {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 16px 0 4px;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.5;
  color: #9a9a9a;
  cursor: pointer;
}
.ark-onay input[type="checkbox"] {
  width: 16px;
  height: 16px;
  /* .ark-kutu input kuralindaki 11px dolgu buraya da geliyordu: kutu
     38px yuksekliginde bir alan kaplayip isaret kutucugunu ortaliyor,
     ilk satirla hizali gorunmuyordu. */
  padding: 0;
  box-sizing: border-box;
  /* .ark-kutu input kuralindaki min-height:44px dokunma hedefi icin
     kondu ama isaret kutusuna uymuyor: kutu 44px'e uzayip metnin
     ortasina kayiyordu. Burada guvenle kaldiriliyor cunku dokunma
     hedefini ETIKETIN KENDISI sagliyor — <label> tikliyor ve iki
     satirlik metniyle zaten 40px'in uzerinde. */
  min-height: 0;
  margin: 2px 0 0;
  flex: none;
  accent-color: #FF5E00;
  cursor: pointer;
}
/* Metin kalan genişliği alsın; min-width:0 olmazsa uzun kelime
   taşırıp kutuyu sıkıştırıyor. */
.ark-onay > span { flex: 1; min-width: 0; }
.ark-onay strong { color: #d8d8d8; font-weight: 600; }
.ark-onay a { color: #FF5E00; }

/* ── ŞİFRE GÖZ SİMGESİ ────────────────────────────────────────────
   Alan sarmalanıyor; düğme alanın İÇİNDE sağda duruyor. Alanın sağ
   iç boşluğu düğme genişliği kadar açıldı, yoksa uzun şifre simgenin
   altına giriyor. */
.ark-sifre { position: relative; display: block; }
.ark-sifre input { width: 100%; padding-right: 46px; }
.ark-goz {
  position: absolute; top: 0; right: 0;
  width: 44px; height: 100%;
  background: none; border: none; padding: 0;
  cursor: pointer; color: #8a8a8a;
  display: flex; align-items: center; justify-content: center;
}
.ark-goz:hover { color: var(--accent); }
/* Simge CSS ile çiziliyor: kapalıyken üstü çizili göz. */
.ark-goz::before {
  content: ""; width: 20px; height: 12px;
  border: 1.6px solid currentColor;
  border-radius: 12px / 9px;
  box-shadow: inset 0 0 0 1.6px currentColor;
  background: transparent;
}
.ark-goz::after {
  content: ""; position: absolute;
  width: 24px; height: 1.6px; background: currentColor;
  transform: rotate(-45deg);
  transition: opacity .15s ease;
}
.ark-goz.acik::after { opacity: 0; }

/* ── PANEL ALTI KAYIT SATIRI ──────────────────────────────────── */
.ark-kayit-satiri {
  margin-top: 6px; text-align: center;
  font-size: 13px; color: #8a8a8a;
}
.ark-kayit-satiri[hidden] { display: none; }
.ark-kayit-satiri button {
  background: none; border: none; color: var(--accent);
  cursor: pointer; font: inherit; font-weight: 600;
  text-decoration: underline;
  min-height: 44px; padding-inline: 8px;
}
