/* Popup Auth PRO styles */
.auth-noscroll { overflow: hidden; }
.auth-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.5); display: none; z-index: 9999; }
.auth-modal { background: #fff; max-width: 560px; width: calc(100% - 24px); margin: 5vh auto; border-radius: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.2); padding: 16px 16px 20px; position: relative; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans",sans-serif; }
.auth-close { position: absolute; right: 8px; top: 6px; border: 0; background: transparent; font-size: 28px; cursor: pointer; }
.auth-tabs { display: flex; gap: 8px; margin-top: 8px; }
.auth-tab { flex: 1; padding: 10px; border: 1px solid #e5e7eb; border-radius: 10px; background: #f9fafb; cursor: pointer; font-weight: 600; }
.auth-tab.active { background: #fff; border-color: #cfd4dc; box-shadow: inset 0 0 0 2px #e5e7eb; }

.auth-body { margin-top: 14px; }
.auth-form .auth-group { margin-bottom: 10px; }
.auth-form label { display: block; font-size: 13px; color: #374151; margin-bottom: 6px; }
.auth-form input[type="text"], .auth-form input[type="email"], .auth-form input[type="password"] { width: 100%; padding: 10px 12px; border: 1px solid #d1d5db; border-radius: 10px; font-size: 14px; }
.auth-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 460px){ .auth-grid { grid-template-columns: 1fr; } }

.auth-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; }
.auth-btn { padding: 10px 14px; border-radius: 10px; border: 0; cursor: pointer; font-weight: 700; }
.auth-btn-primary { background: #111827; color: #fff; }
.auth-btn-ghost { background: #f3f4f6; }
.auth-link-forgot { font-size: 13px; text-decoration: underline; color: #1f2937; }

.auth-feedback { margin-top: 10px; font-size: 13px; min-height: 18px; }
.auth-feedback.error { color: #b91c1c; }
.auth-feedback.success { color: #065f46; }

.auth-passwrap { position: relative; }
.auth-passwrap .auth-toggle { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); background: transparent; border: 0; font-size: 12px; text-decoration: underline; cursor: pointer; color: #374151; }
.auth-caps { font-size: 12px; color: #b91c1c; margin-top: 6px; }

.auth-meter { height: 8px; background: #f3f4f6; border-radius: 9999px; overflow: hidden; margin-top: 6px; }
.auth-meter span { display:block; height:100%; width:0%; background:#ef4444; text-indent:-9999px; }
.auth-meter span[data-score="3"] { background:#f59e0b; }
.auth-meter span[data-score="4"], .auth-meter span[data-score="5"] { background:#10b981; }

/* Toasts */
.auth-toast-container { position: fixed; right: 12px; top: 12px; z-index: 10000; display:flex; flex-direction:column; gap:8px; }
.auth-toast { transform: translateY(-8px); opacity: 0; transition: .25s ease; background:#111827; color:#fff; padding:10px 12px; border-radius:10px; font-size:13px; }
.auth-toast.show { transform: translateY(0); opacity: 1; }

/* Close (X) biraz daha yukarı */
.auth-modal { padding-top: 24px; } /* içeride üst boşluk artsın */
.auth-close { top: -1px; right: 8px; line-height: 1; padding: 4px; }
/* İstersen daha da artır: top: -16px; */

/* X'i büyüt ve konumu koru */
.auth-close {
  font-size: 38px;   /* 28px'ti; 34–42px arası deneyebilirsin */
  line-height: 1;
  padding: 4px;
  top: -10px;        /* büyüyünce biraz daha yukarı al */
  right: 8px;
}
@media (min-width: 480px){
  .auth-close { font-size: 40px; top: -18px; }
}