﻿/* خلفية */
  .auth-bg {
    min-height: 100vh;
    background: radial-gradient(1200px 600px at 100% -10%, #9ae236 0%, transparent 60%),
                linear-gradient(135deg, #DCDCDC 0%, #FFFFFF 60%);
    display: grid;
    place-items: center;
    padding: 2rem 1rem;
  }

  /* الغلاف المقسوم */
  .auth-hero {
    width: min(100%, 1100px);
    border-radius: 20px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 25px 80px rgba(0,0,0,.25);
    display: grid;
    grid-template-columns: 1fr;
  }
  @media (min-width: 992px){
    .auth-hero { grid-template-columns: 1.1fr .9fr; }
  }

  /* جانب النموذج */
  .auth-form {
    padding: clamp(20px, 4vw, 48px);
  }
  .brand {
    display:flex; align-items:center; gap:.6rem;
    font-weight:800; color:#0f172a; font-size:1.25rem;
  }
  .brand .dot { width:12px; height:12px; background:#0ea5e9; border-radius:999px; display:inline-block; }
  .muted { color:#6b7280; font-size:.95rem; }

  /* المدخلات */
  .form-label { font-weight:700; color:#0f172a; }
  .ltr-input { direction:ltr; text-align:left; }
  .input-group-text { background:#f3f4f6; border-color:#e5e7eb; }

  /* الزر */
  .btn-brand { background:#0ea5e9; color:#fff; font-weight:700; }
  .btn-brand:hover { background:#0284c7; color:#fff; }

  /* جانب الصورة */
  .auth-visual {
     padding:10px;
    position: relative;
    background: linear-gradient(180deg, #75BEF6 0%, #0a2740 100%);
    display:flex; align-items:center; justify-content:center;
  }
  .auth-visual::before{
    content:"";
    position:absolute; inset:0;
    background:
      radial-gradient(600px 300px at 20% 0%, rgba(255,255,255,.15), transparent 60%),
      radial-gradient(600px 300px at 80% 100%, rgba(255,255,255,.12), transparent 60%);
    pointer-events:none;
  }
  .kiosk-img {
    width: min(92%, 520px);
    height: auto;
    display:block;
    filter: drop-shadow(0 20px 60px rgba(0,0,0,.45));
    border-radius: 14px;
    background:#0a1d30;
  }

  /* تنسيق بسيط لوصلة المساعدة */
  .helper-links a { color:#0ea5e9; text-decoration:none; }
  .helper-links a:hover { text-decoration:underline; }


/* reveal on view */
.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s ease, transform .7s ease;
  will-change: opacity, transform;
}
.reveal.show {
  opacity: 1;
  transform: translateY(0);
}

/* حركة خفيفة للصورة */
.kiosk-img {
  animation: floatY 6s ease-in-out infinite;
}
@keyframes floatY {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-6px); }
  100% { transform: translateY(0); }
}
