/* =========================================
   Login Page — Two Columns
   Scoped to .auth-page
   ========================================= */

.auth-page{
  --surface:#ffffff;
  --ink:#0f172a;
  --muted:#6b7280;
  --line:#e5e7eb;

  /* يتبع الثيم */
  --btn: var(--btn-primary, #005e99);
  --btn-hov: color-mix(in srgb, var(--btn) 92%, white);
  --ring: color-mix(in srgb, var(--btn) 24%, transparent);

  /* تدرّج الهيرو حسب الثيم الجديد */
  --brand-from: var(--brand-dark, #021f32);
  --brand-to: var(--brand, #005e99);

  --warn-bg:#fff7ed;
  --warn-bd:#fdba74;
  --warn-ink:#92400e;
}

.auth-page *{ box-sizing:border-box }

/* لقرّاء الشاشة فقط */
.auth-page .sr-only{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ===== الحاوية العليا ===== */
.auth-page .auth-shell{
  background: transparent;
  padding: 32px 16px;
  min-height: calc(100dvh - 160px);
  display: grid;
  place-items: center;
}

/* إطار المحتوى */
.auth-page .auth-grid{
  width: min(1100px, 100%);
  margin: 0 auto;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0,0,0,.12);
  display: grid;
  grid-template-columns: 1fr 520px;
}

/* ===== لوحة الترحيب (بدون دوائر مشعّة) ===== */
.auth-page .panel--welcome{
  position: relative;
  color: #fff;
  padding: 48px 40px;
  min-height: 520px;
  display: flex;
  align-items: center;

  /* تدرّج بسيط فقط – أزلنا radial-gradients */
  background: linear-gradient(130deg, var(--brand-from) 0%, var(--brand-to) 100%);
}

/* نص اللوحة */
.auth-page .welcome-wrap{ max-width: 540px; }
.auth-page .welcome-en{ margin: 0 0 6px; letter-spacing: .2em; font-weight: 800; color: #fff; opacity: .95; }
.auth-page .welcome-ar{ margin: 0 0 10px; font-size: 36px; font-weight: 800; color: #fff; }
.auth-page .welcome-sub{ margin: 0; color: #e6f4ff; opacity: .95; line-height: 1.8; }

/* دوائر عادية (غير مشعّة) */
.auth-page .blob{
  position: absolute;
  border-radius: 50%;
  pointer-events: none;

  /* تعبئة موحّدة شبه شفافة بلا وهج ولا blur */
  background: rgba(255,255,255,.10);
  box-shadow: none;
  filter: none;
}

/* أماكن وأحجام تقريبية مثل القديم */
.auth-page .blob-1{ width: 220px; height: 220px; top: 36px; right: 60px; }
.auth-page .blob-2{ width: 280px; height: 280px; bottom: 40px; left: 40px; opacity: .12; }
.auth-page .blob-3{ width: 140px; height: 140px; top: 80px; left: 26px; opacity: .08; }

/* ===== بطاقة تسجيل الدخول ===== */
.auth-page .panel--card{ background: var(--surface); color: var(--ink); padding: 32px 28px; }
.auth-page .card-head{ margin-bottom: 14px; }
.auth-page .card-title{ margin: 0 0 4px; font-size: 28px; font-weight: 800; color: #0b1b3c; }
.auth-page .card-sub{ margin: 0; color: var(--muted); font-size: 14px; }

/* ===== النموذج ===== */
.auth-page .auth-form{ display: grid; gap: 14px; margin-top: 8px; }
.auth-page .label{ display:block; font-weight:700; margin-bottom:6px; color:#0b1b3c; }

.auth-page .control{
  display: grid;
  grid-template-columns: 28px 1fr auto;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8fafc;
  padding: 10px 12px;
  transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.auth-page .control:focus-within{
  border-color: var(--btn);
  box-shadow: 0 0 0 3px var(--ring);
  background: #fff;
}
.auth-page .control.invalid{
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220,38,38,.12);
  background: #fff;
}

/* الأيقونات */
.auth-page .icon{
  width:20px; height:20px; display:inline-block;
  background-position:center; background-repeat:no-repeat; background-size:contain;
}
.auth-page .i-user{ background-image: url('/assets/img/icons/user.svg'); }
.auth-page .i-lock{ background-image: url('/assets/img/icons/lock.svg'); }

.auth-page input[type="email"],
.auth-page input[type="password"],
.auth-page input[type="text"]{
  border:0; outline:0; background:transparent; color:var(--ink);
  font-size:16px; width:100%;
}

/* زر إظهار/إخفاء */
.auth-page .toggle-text{
  background: transparent; border: 0; color: var(--btn);
  font-weight: 800; cursor: pointer; padding: 4px 6px; border-radius: 8px;
}
.auth-page .toggle-text:hover{ background:#eef7fb; }

/* صف مساعد أسفل الحقول */
.auth-page .row{ display:flex; gap:12px; align-items:center; }
.auth-page .between{ justify-content: space-between; }
.auth-page .check input{ margin: 0 0 0 6px; }

/* روابط */
.auth-page .link{ color: var(--btn); text-decoration: none; font-weight: 800; }
.auth-page .link:hover{ text-decoration: underline; }
.auth-page .small{ font-size: 13px; }

/* أزرار */
.auth-page .btn{
  appearance:none; border:0; border-radius:14px;
  padding:12px 16px; font-weight:800; cursor:pointer;
  transition: transform .06s, box-shadow .2s, background-color .2s;
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px;
}
.auth-page .btn:active{ transform: translateY(1px); }
.auth-page .btn--block{ width:100%; }

.auth-page .btn--primary{
  background: var(--btn); color:#fff;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--btn) 30%, transparent);
}
.auth-page .btn--primary:hover{ background: var(--btn-hov); }
.auth-page .btn[disabled]{ opacity:.6; cursor:not-allowed; filter:saturate(.6); }

/* سبينر */
.auth-page .btn-spinner{
  width:16px; height:16px; border-radius:50%;
  border:2px solid rgba(255,255,255,.35);
  border-top-color:#fff; display:none;
  animation: spin .8s linear infinite;
}
.auth-page .btn.loading .btn-spinner{ display:inline-block; }
.auth-page .btn.loading .btn-text{ opacity:.85; }
@keyframes spin { to { transform: rotate(360deg); } }

/* أخطاء عامة */
.auth-page .form-error{
  background:#c31a2d; border:1px solid #5e1b23; color:#ffffff;
  padding:10px 12px; border-radius:12px; font-weight:700;
}

/* تنبيه CapsLock */
.auth-page .caps-hint{
  margin-top:8px;
  background: var(--warn-bg);
  border: 1px solid var(--warn-bd);
  color: var(--warn-ink);
  padding: 8px 10px;
  border-radius: 10px;
  font-weight: 700;
}

/* تلميح أسفل */
.auth-page .signup-hint{ margin: 6px 0 0; color: var(--muted); text-align: center; }

/* Responsive */
@media (max-width: 1024px){
  .auth-page .auth-grid{ grid-template-columns: 1fr; }
  .auth-page .panel--card{ order: 1; }
  .auth-page .panel--welcome{ order: 2; min-height: 360px; padding: 36px 28px; }
  .auth-page .blob-1, .auth-page .blob-2{ display: none; } /* تبقى دائرة صغيرة فقط على الجوال */
}
@media (max-width: 480px){
  .auth-page .panel--card{ padding: 24px 20px; }
  .auth-page .card-title{ font-size: 24px; }
  .auth-page .welcome-ar{ font-size: 28px; }
}
