/* Kayıt formu - koyu mavi / lacivert, yarı şeffaf, kompakt
   Güncelleme: sadece logo ortalandı; başlık sola hizalı kaldı */

/* Genel modal */
.modal.hidden { display: none; }
.modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index: 9999;
  padding: 12px;
}

/* Kart */
.modal-card {
  width: 100%;
  max-width: 360px;
  border-radius: 10px;
  /* Üst padding artırıldı, logonun kart üstünde ortalanması için yer açıldı */
  padding: 28px 14px 14px;
  box-shadow: 0 10px 30px rgba(2,6,23,0.6);
  background: linear-gradient(180deg, rgba(5,28,57,0.92) 0%, rgba(12,42,84,0.86) 60%, rgba(10,32,64,0.80) 100%);
  color: #fff;
  font-family: 'Poppins', system-ui, sans-serif;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* Header: başlık sola hizalı, logo kartın üstünde ortalanmış */
.modal-header {
  position: relative;
  display: block;
  margin-bottom: 6px;
  text-align: left;
}
#register-title {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .2px;
  color: #e8f2ff;
  text-align: left;
}

/* Logo: kartın üstünde, yatayda ortaya hizalanmış */
.modal-logo {
  position: absolute;
  left: 50%;
  top: -26px; /* kartın üst kenarının biraz üstünde görünmesi için */
  transform: translateX(-50%);
  width:52px;
  height:52px;
  border-radius:50%;
  object-fit:cover;
  border: 2px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  opacity: 0.92;
  box-shadow: 0 4px 12px rgba(2,6,23,0.6);
  display: block;
  margin: 0;
}

/* Form alanları */
#register-form { display:block; margin-top:6px; }
#register-form label {
  display:block;
  font-size: 12px;
  margin-top: 8px;
  color: rgba(255,255,255,0.88);
}
#register-form input[type="text"],
#register-form input[type="email"],
#register-form input[type="password"] {
  width: 100%;
  padding: 8px 10px;
  margin-top: 6px;
  border-radius: 6px;
  border: none;
  outline: none;
  font-size: 13px;
  background: rgba(255,255,255,0.95);
  color: #0b2230;
  box-shadow: 0 2px 6px rgba(16,24,40,0.08) inset;
}

/* Placeholder */
#register-form input::placeholder { color: #95a9c2; }

/* Hata mesajı */
.error { color: #ffd6d6; font-size: 12px; min-height:18px; margin-top:8px; }

/* Butonlar */
.actions { display:flex; gap:8px; justify-content:flex-end; margin-top:12px; }
button#r-submit {
  background: linear-gradient(180deg,#083f78 0%, #042b56 100%);
  color:#fff;
  border:none;
  padding:8px 12px;
  border-radius:6px;
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  box-shadow: 0 6px 14px rgba(2,24,48,0.45);
}
button#r-submit[disabled] { opacity:0.6; cursor:wait; }
button#r-cancel {
  background: transparent;
  color: rgba(255,255,255,0.95);
  border:1px solid rgba(255,255,255,0.08);
  padding:8px 10px;
  border-radius:6px;
  font-size:13px;
  cursor:pointer;
}

/* Password bar */
.password-meter { height:6px; background: rgba(255,255,255,0.06); border-radius:4px; margin-top:8px; overflow:hidden; }
.pw-bar { height:100%; width:0%; background:linear-gradient(90deg,#ffb677,#ffd166,#7ee5b9,#6ee7f6); transition:width .18s ease; }

/* Responsive */
@media (max-width:420px){
  .modal-card { max-width: 340px; padding: 22px 12px 12px; }
  #register-title { font-size:16px; }
  .modal-logo { width:46px; height:46px; top: -22px; }
}

/* mobilde otomatik zoom'u engellemek için input font-size >= 16px yapıyoruz */
#login-form input,
#register-form input,
#login-form textarea,
#register-form textarea,
.modal input,
.modal textarea,
input[type="text"],
input[type="email"],
input[type="password"],
select {
  font-size: 16px;            /* iOS Safari otomatik zoom tetiklemesini engellemek için */
  -webkit-text-size-adjust: 100%;
}