/* ═══════ صفحة التسجيل / الدخول — أنماط مخصصة ═══════ */

/* خلفية الفيديو الثابتة */
.auth-bg-video {
  position: fixed; inset: 0; z-index: 0;
  width: 100%; height: 100%; object-fit: cover;
  opacity: .35; filter: saturate(1.1) hue-rotate(-10deg);
  pointer-events: none;
}
.auth-bg-overlay {
  position: fixed; inset: 0; z-index: 1;
  background:
    radial-gradient(circle at 15% 10%, rgba(34,211,238,.1), transparent 45%),
    linear-gradient(180deg, rgba(5,13,26,.82), rgba(5,13,26,.94));
}

/* هيكل الصفحة */
.auth-shell {
  position: relative; z-index: 10;
  min-height: 100svh;
  display: flex; align-items: center; justify-content: center;
  padding: 4.4rem 1rem 2.2rem;
}
.auth-back {
  position: fixed; top: 1.1rem; right: 1.1rem; z-index: 20;
  display: inline-flex; align-items: center; gap: .5rem;
  background: rgba(8,21,39,.85); border: 1px solid rgba(34,211,238,.3);
  color: #67e8f9; font-size: .82rem; font-weight: 800;
  padding: .55rem 1.1rem; border-radius: 9999px;
  backdrop-filter: blur(10px);
  transition: all .25s;
}
.auth-back:hover { background: rgba(34,211,238,.14); transform: translateX(-3px); }

/* البطاقة */
.auth-card {
  width: min(560px, 100%);
  background: rgba(8,21,39,.92);
  border: 1px solid rgba(34,211,238,.22);
  border-radius: 1.8rem;
  padding: 1.9rem 1.5rem 1.5rem;
  box-shadow: 0 30px 80px rgba(0,0,0,.55), 0 0 60px rgba(34,211,238,.08);
  backdrop-filter: blur(18px);
  animation: cardIn .7s cubic-bezier(.2,.85,.3,1.1) both;
}
@keyframes cardIn { from { opacity: 0; transform: translateY(34px) scale(.97); } to { opacity: 1; transform: none; } }
@media (min-width: 640px) { .auth-card { padding: 2.2rem 2.4rem 1.8rem; } }

/* الهيدر */
.auth-head { text-align: center; margin-bottom: 1.4rem; }
.auth-logo {
  width: 74px; height: 74px; object-fit: contain; margin: 0 auto .6rem;
  filter: drop-shadow(0 0 20px rgba(34,211,238,.5));
  animation: logoFloat 5s ease-in-out infinite;
}
@keyframes logoFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.auth-head h1 { font-size: 1.35rem; font-weight: 900; color: #fff; }
.auth-head p { font-size: .8rem; color: #67e8f9; font-weight: 700; margin-top: .25rem; }

/* التبويبات مع المؤشر المنزلق */
.auth-tabs2 {
  position: relative;
  display: grid; grid-template-columns: 1fr 1fr;
  background: rgba(5,13,26,.75);
  border: 1px solid rgba(34,211,238,.14);
  padding: .35rem; border-radius: 1.1rem; margin-bottom: 1.5rem;
}
.tab-glider {
  position: absolute; top: .35rem; bottom: .35rem; right: .35rem;
  width: calc(50% - .35rem);
  background: linear-gradient(120deg, #22d3ee, #0891b2);
  border-radius: .8rem;
  box-shadow: 0 6px 20px rgba(34,211,238,.35);
  transition: transform .45s cubic-bezier(.65,0,.35,1);
}
.auth-tabs2.mode-login .tab-glider { transform: translateX(calc(-100% - .0rem)); }
.auth-tab2 {
  position: relative; z-index: 2;
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .72rem .5rem; border-radius: .8rem;
  font-weight: 800; font-size: .88rem; color: #94a3b8;
  transition: color .35s; cursor: pointer;
}
.auth-tab2.active { color: #050d1a; }

/* حاوية الفورمات: انزلاق أفقي بين التبويبين */
.forms-viewport { overflow: hidden; }
.forms-track {
  display: flex; width: 200%;
  transition: transform .55s cubic-bezier(.65,0,.35,1);
}
.forms-track.show-login { transform: translateX(50%); }
.pane { width: 50%; flex-shrink: 0; padding: .2rem .15rem; }
.pane[aria-hidden="true"] { visibility: hidden; }

/* الفورم والحقول العائمة */
.auth-form2 { display: flex; flex-direction: column; gap: .95rem; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
@media (max-width: 480px) { .field-row { grid-template-columns: 1fr; gap: .95rem; } }

.field2 {
  position: relative;
  display: flex; align-items: center; gap: .7rem;
  background: rgba(12,31,56,.72);
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 1rem; padding: .3rem 1rem;
  transition: border-color .3s, box-shadow .3s, transform .3s;
  animation: fieldIn .55s ease both;
  animation-delay: calc(var(--i, 0) * 70ms);
}
@keyframes fieldIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.field2:focus-within {
  border-color: rgba(34,211,238,.6);
  box-shadow: 0 0 0 3px rgba(34,211,238,.13), 0 0 22px rgba(34,211,238,.1);
  transform: translateY(-2px);
}
.field2 > i { color: #22d3ee; font-size: .95rem; width: 18px; text-align: center; transition: transform .3s; }
.field2:focus-within > i { transform: scale(1.2); }
.field2 input, .field2 select {
  flex: 1; background: transparent; border: 0; outline: 0;
  color: #e2e8f0; font-family: inherit; font-size: .9rem; font-weight: 600;
  padding: 1.15rem 0 .5rem; min-width: 0;
}
.field2 select { cursor: pointer; }
.field2 select option { background: #0c1f38; }

/* الليبل العائم */
.fl {
  position: absolute; right: 2.75rem; top: 50%;
  transform: translateY(-50%);
  font-size: .84rem; font-weight: 700; color: #64748b;
  pointer-events: none;
  transition: all .28s cubic-bezier(.3,.8,.4,1);
}
.field2:focus-within .fl,
.field2 input:not(:placeholder-shown) ~ .fl,
.field2 select:valid ~ .fl {
  top: .62rem; transform: none;
  font-size: .62rem; color: #22d3ee; font-weight: 800;
}

/* زر إظهار كلمة السر */
.pw-eye {
  color: #64748b; font-size: .9rem; padding: .4rem;
  transition: color .25s; cursor: pointer;
}
.pw-eye:hover, .pw-eye.on { color: #22d3ee; }

/* زر الإرسال */
.auth-submit2 {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  background: linear-gradient(120deg, #22d3ee, #0891b2);
  color: #050d1a; font-weight: 900; font-size: .95rem;
  padding: .95rem; border-radius: 1.05rem;
  box-shadow: 0 10px 28px rgba(34,211,238,.28);
  transition: transform .25s, box-shadow .25s;
  margin-top: .25rem; cursor: pointer;
  animation: fieldIn .55s ease both;
  animation-delay: calc(var(--i, 0) * 70ms);
}
.auth-submit2:hover { transform: translateY(-3px); box-shadow: 0 16px 38px rgba(34,211,238,.42); }
.auth-submit2:active { transform: translateY(0) scale(.98); }

/* عناصر فورم الدخول */
.login-hello { text-align: center; font-size: .88rem; font-weight: 800; color: #a5f3fc; margin-bottom: .2rem; }
.forgot-link { align-self: flex-start; font-size: .74rem; font-weight: 700; color: #64748b; transition: color .25s; }
.forgot-link:hover { color: #22d3ee; }

/* الفوتر والتبديل */
.auth-foot { text-align: center; margin-top: 1.3rem; padding-top: 1.1rem; border-top: 1px solid rgba(255,255,255,.06); }
.auth-foot p { font-size: .82rem; color: #94a3b8; font-weight: 600; }
.switch-link { color: #22d3ee; font-weight: 900; cursor: pointer; transition: color .25s; }
.switch-link:hover { color: #67e8f9; text-decoration: underline; }

/* تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
  .auth-bg-video { display: none; }
}
