/* Insurance-oriented login surface. The authentication contract remains the
   existing AuthController form; this file only owns the visual treatment. */
:root {
  --soheil-navy: #061b46;
  --soheil-blue: #0d5c9d;
  --soheil-cyan: #35b8d4;
  --soheil-ink: #0c234a;
  --soheil-soft: #f4f8fc;
}

body.soheil-auth-page,
.soheil-auth-page {
  color: var(--soheil-ink);
}

body:has(.soheil-auth-page) {
  background: #071b42;
}

body:has(.soheil-auth-page) .fixed-background {
  background:
    linear-gradient(135deg, rgba(6, 22, 56, .84), rgba(10, 66, 126, .62)),
    url("../img/login/images.jfif") center center / cover no-repeat;
}

.soheil-auth-page .container,
.soheil-auth-page .row {
  position: relative;
  z-index: 1;
}

.soheil-auth-card {
  overflow: hidden;
  border: 0;
  border-radius: 24px;
  box-shadow: 0 24px 70px rgba(2, 15, 45, .34);
  background: #fff;
}

.soheil-auth-hero {
  display: flex;
  align-items: flex-end;
  min-height: 450px;
  padding: 3rem;
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(6, 24, 62, .78), rgba(10, 66, 126, .52)),
    url("../img/login/images.jfif") center center / cover no-repeat !important;
}

.soheil-auth-hero::before,
.soheil-auth-hero::after {
  position: absolute;
  content: '';
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 50%;
  transform: rotate(-18deg);
}

.soheil-auth-hero::before { width: 440px; height: 440px; top: -220px; left: -180px; }
.soheil-auth-hero::after { width: 340px; height: 340px; right: -180px; bottom: -180px; }

.soheil-auth-hero__glow {
  position: absolute;
  width: 9rem;
  height: 9rem;
  border-radius: 50%;
  filter: blur(4px);
  opacity: .7;
}

.soheil-auth-hero__glow--one { top: 18%; right: 18%; background: rgba(77, 211, 222, .24); }
.soheil-auth-hero__glow--two { bottom: 12%; left: 10%; background: rgba(103, 160, 255, .25); }

.soheil-auth-mark {
  position: absolute;
  top: 3rem;
  right: 3rem;
  display: grid;
  width: 72px;
  height: 82px;
  place-items: center;
  color: #fff;
  font-size: 2.6rem;
  filter: drop-shadow(0 8px 15px rgba(0, 0, 0, .18));
}

.soheil-auth-mark__cross {
  position: absolute;
  right: 11px;
  bottom: 8px;
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 50%;
  background: var(--soheil-cyan);
  font-size: 1.1rem;
  line-height: 1;
}

.soheil-auth-hero__content { position: relative; max-width: 390px; }
.soheil-auth-eyebrow,
.soheil-auth-form-kicker {
  display: block;
  margin-bottom: 1rem;
  color: var(--soheil-cyan);
  font-size: .75rem;
  font-weight: bold;
  letter-spacing: .02em;
}

.soheil-auth-hero h2 { margin-bottom: .9rem; font-weight: bold; }
.soheil-auth-features { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 2rem; }
.soheil-auth-features span { padding: .45rem .7rem; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; color: rgba(255,255,255,.86); font-size: .7rem; }
.soheil-auth-features i { margin-left: .25rem; color: var(--soheil-cyan); }

.soheil-auth-form-side { padding: 3.5rem 3.5rem 3rem; }
.soheil-auth-logo { display: inline-flex; align-items: center; justify-content: center; margin-bottom: 1.1rem; }
.soheil-auth-logo .logo-single { width: 108px; height: 52px; margin: 0; background: none; }
.soheil-auth-logo img { display: block; width: 108px; max-width: 100%; height: auto; }
.soheil-auth-form-kicker { margin-bottom: .35rem; color: var(--soheil-blue); }
.soheil-auth-form-side h6 { color: var(--soheil-ink); font-size: 1.3rem; }
.soheil-auth-form-side .form-control { border-color: #d6e0ec; background: var(--soheil-soft); color: var(--soheil-ink); }
.soheil-auth-form-side .form-control:focus { border-color: var(--soheil-cyan); box-shadow: 0 0 0 .18rem rgba(53, 184, 212, .15); background: #fff; }
.soheil-auth-form-side .has-float-label > span { color: #70819a; }
.soheil-auth-submit { min-height: 52px; border: 0; background: linear-gradient(100deg, #0b4c91, #1293ac); }
.soheil-auth-submit:hover { background: linear-gradient(100deg, #08396f, #0b718b); }

@media (max-width: 767px) {
  .soheil-auth-hero { min-height: 300px; padding: 2rem; }
  .soheil-auth-mark { top: 2rem; right: 2rem; }
  .soheil-auth-hero__content { margin-top: 3rem; }
  .soheil-auth-form-side { padding: 2.25rem 1.5rem 2rem; }
}