/* Shared login presentation for every portal. Portal-specific forms and branding stay intact. */
.login-page,
.login-view,
.login {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  grid-template-columns: minmax(0, 1fr) !important;
  place-items: center !important;
  gap: 0 !important;
  overflow-x: hidden;
  padding: clamp(18px, 4vw, 46px) !important;
  background: #02181f !important;
}

.login-backdrop,
.login::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  pointer-events: none;
  background-color: #02181f;
  background-image: url('/assets/login/tech-network-v3-2560.jpg');
  background-image: image-set(
    url('/assets/login/tech-network-v3-2560.webp') type('image/webp'),
    url('/assets/login/tech-network-v3-2560.jpg') type('image/jpeg')
  );
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: none !important;
}

.login-page::before,
.login-view::before,
.login::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 46%, rgba(2, 24, 31, .03) 0 20%, rgba(2, 21, 28, .17) 55%, rgba(1, 14, 22, .32) 100%),
    linear-gradient(180deg, rgba(1, 17, 24, .06), rgba(1, 13, 21, .18));
}

.login-scene-copy,
.login-orb {
  display: none !important;
}

.login-page > .login-card,
.login-view > .login-card,
.login > .login-card {
  position: relative;
  z-index: 3;
  justify-self: center !important;
  align-self: center !important;
  width: min(440px, 100%) !important;
  border: 1px solid rgba(255, 255, 255, .72) !important;
  border-radius: 20px !important;
  background: rgba(252, 253, 255, .965) !important;
  box-shadow: 0 28px 90px rgba(0, 5, 28, .52), 0 0 0 1px rgba(55, 144, 255, .10) !important;
  backdrop-filter: blur(18px);
}

.login-view > .login-card h1 {
  font-size: clamp(22px, 3vw, 26px);
  line-height: 1.3;
  word-break: keep-all;
}

@media (min-width: 2561px) {
  .login-backdrop,
  .login::before {
    background-image: url('/assets/login/tech-network-v3-3840.jpg');
    background-image: image-set(
      url('/assets/login/tech-network-v3-3840.webp') type('image/webp'),
      url('/assets/login/tech-network-v3-3840.jpg') type('image/jpeg')
    );
  }
}

@media (max-width: 1280px) {
  .login-backdrop,
  .login::before {
    background-image: url('/assets/login/tech-network-v3-1600.jpg');
    background-image: image-set(
      url('/assets/login/tech-network-v3-1600.webp') type('image/webp'),
      url('/assets/login/tech-network-v3-1600.jpg') type('image/jpeg')
    );
  }
}

@media (max-width: 600px) {
  .login-page,
  .login-view,
  .login {
    align-items: start !important;
    padding: max(16px, env(safe-area-inset-top)) 14px max(16px, env(safe-area-inset-bottom)) !important;
    overflow-y: auto;
  }

  .login-backdrop,
  .login::before {
    position: fixed;
    background-image: url('/assets/login/tech-network-v3-960.jpg');
    background-image: image-set(
      url('/assets/login/tech-network-v3-960.webp') type('image/webp'),
      url('/assets/login/tech-network-v3-960.jpg') type('image/jpeg')
    );
    background-position: center;
  }

  .login-page > .login-card,
  .login-view > .login-card,
  .login > .login-card {
    margin-block: auto;
    border-radius: 17px !important;
  }
}
