
/* Step 40: glass стартовая страница */
html.nikmed-glass-login-active,
body.nikmed-glass-login-active {
  min-height: 100%;
}

body.nikmed-glass-login-active {
  background:
    radial-gradient(circle at 15% 10%, rgba(56, 189, 248, .30), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(37, 99, 235, .20), transparent 30%),
    linear-gradient(135deg, #eaf6ff 0%, #f8fbff 42%, #eef7ff 100%) !important;
}

body.nikmed-glass-login-active::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(115deg, transparent 0 46%, rgba(255,255,255,.55) 48%, transparent 52%),
    url("/nikmed-logo-mark-transparent.png");
  background-size: 780px 780px, 64px auto;
  background-position: center, center;
  background-repeat: no-repeat, repeat;
  opacity: .105;
  filter: saturate(125%);
}

body.nikmed-glass-login-active::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(255,255,255,.30), transparent 28%, rgba(255,255,255,.34) 52%, transparent 74%),
    radial-gradient(circle at 50% 102%, rgba(14, 165, 233, .20), transparent 36%);
}

body.nikmed-glass-login-active #root {
  position: relative;
  z-index: 1;
}

body.nikmed-glass-login-active #root > div {
  background:
    radial-gradient(circle at 12% 10%, rgba(125, 211, 252, .22), transparent 30%),
    radial-gradient(circle at 86% 84%, rgba(59, 130, 246, .18), transparent 34%),
    linear-gradient(135deg, rgba(219, 239, 255, .70), rgba(248, 251, 255, .62)) !important;
  overflow: hidden !important;
}

body.nikmed-glass-login-active #root > div > div:nth-of-type(1),
body.nikmed-glass-login-active #root > div > div:nth-of-type(2),
body.nikmed-glass-login-active #root > div > div:nth-of-type(3) {
  display: none !important;
}

body.nikmed-glass-login-active #root > div > div.relative.z-10.grid {
  width: min(1120px, calc(100vw - 40px)) !important;
  max-width: 1120px !important;
  min-height: 650px !important;
  border-radius: 44px !important;
  border: 1px solid rgba(255, 255, 255, .78) !important;
  background: rgba(255, 255, 255, .38) !important;
  backdrop-filter: blur(30px) saturate(165%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(165%) !important;
  box-shadow:
    0 42px 120px -58px rgba(15, 23, 42, .55),
    inset 0 1px 0 rgba(255, 255, 255, .92),
    inset 0 0 0 1px rgba(255,255,255,.24) !important;
  isolation: isolate;
}

body.nikmed-glass-login-active #root > div > div.relative.z-10.grid::before {
  content: "";
  position: absolute;
  inset: 1px;
  z-index: -1;
  border-radius: 43px;
  background:
    linear-gradient(115deg, rgba(255,255,255,.42), rgba(255,255,255,.14) 35%, rgba(186,230,253,.16) 100%);
  pointer-events: none;
}

body.nikmed-glass-login-active #root > div > div.relative.z-10.grid::after {
  content: "";
  position: absolute;
  inset: -2px;
  z-index: -2;
  border-radius: 46px;
  background:
    radial-gradient(circle at 18% 14%, rgba(255,255,255,.95), transparent 22%),
    linear-gradient(135deg, rgba(37,99,235,.28), rgba(6,182,212,.20), rgba(255,255,255,.40));
  filter: blur(10px);
  opacity: .75;
  pointer-events: none;
}

body.nikmed-glass-login-active #root > div > div.relative.z-10.grid > section:first-child {
  margin: 16px !important;
  min-height: auto !important;
  border-radius: 34px !important;
  border: 1px solid rgba(255,255,255,.42) !important;
  background:
    linear-gradient(135deg, rgba(6, 88, 197, .92), rgba(14, 165, 233, .72)),
    radial-gradient(circle at 70% 22%, rgba(255,255,255,.26), transparent 32%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.48),
    inset 0 -60px 120px rgba(7, 89, 133, .14),
    0 30px 70px -44px rgba(14, 116, 144, .9) !important;
  overflow: hidden !important;
}

body.nikmed-glass-login-active #root > div > div.relative.z-10.grid > section:first-child::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(130deg, rgba(255,255,255,.18), transparent 30%, rgba(255,255,255,.13) 55%, transparent 78%),
    radial-gradient(circle at 78% 56%, rgba(255,255,255,.22), transparent 22%);
  pointer-events: none;
}

body.nikmed-glass-login-active #root > div > div.relative.z-10.grid > section:first-child::after {
  content: "STAFF";
  position: absolute;
  right: -18px;
  bottom: 52px;
  font-size: 120px;
  font-weight: 900;
  letter-spacing: -.08em;
  color: rgba(255,255,255,.075);
  transform: rotate(-8deg);
  pointer-events: none;
}

body.nikmed-glass-login-active #root > div > div.relative.z-10.grid > section:first-child .rounded-2xl {
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border-color: rgba(255,255,255,.28) !important;
  background: rgba(255,255,255,.13) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 14px 34px -28px rgba(0,0,0,.45);
}

body.nikmed-glass-login-active #root > div > div.relative.z-10.grid > section:last-child {
  margin: 16px 16px 16px 0 !important;
  border-radius: 34px !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  background: rgba(255,255,255,.50) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.80),
    0 30px 84px -58px rgba(15, 23, 42, .40) !important;
  backdrop-filter: blur(24px) saturate(155%);
  -webkit-backdrop-filter: blur(24px) saturate(155%);
}

body.nikmed-glass-login-active #root > div > div.relative.z-10.grid > section:last-child > div {
  max-width: 440px !important;
}

body.nikmed-glass-login-active h1 {
  color: #0f172a !important;
  letter-spacing: -.04em !important;
}

body.nikmed-glass-login-active input,
body.nikmed-glass-login-active select {
  min-height: 56px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(186, 230, 253, .92) !important;
  background: rgba(255,255,255,.58) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.70), 0 15px 36px -32px rgba(15,23,42,.55) !important;
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
}

body.nikmed-glass-login-active input:focus,
body.nikmed-glass-login-active select:focus {
  border-color: rgba(14, 165, 233, .90) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.82),
    0 0 0 5px rgba(125,211,252,.28),
    0 18px 42px -32px rgba(14,165,233,.85) !important;
}

body.nikmed-glass-login-active form button[type="submit"] {
  min-height: 58px !important;
  border-radius: 21px !important;
  background: linear-gradient(135deg, #2563eb 0%, #0284c7 48%, #22d3ee 100%) !important;
  box-shadow:
    0 22px 46px -28px rgba(37, 99, 235, .92),
    inset 0 1px 0 rgba(255,255,255,.30) !important;
}

body.nikmed-glass-login-active form button[type="submit"]:hover {
  filter: brightness(1.06) saturate(112%);
}

body.nikmed-glass-login-active .nikmed-step31-forgot-row {
  margin-top: 4px;
  border-radius: 18px;
  padding: 2px 4px;
}

body.nikmed-glass-login-active .nikmed-step31-forgot-link {
  color: #1d4ed8 !important;
}

body.nikmed-glass-login-active .nikmed-glass-medical-symbols {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

body.nikmed-glass-login-active .nikmed-glass-medical-symbols span {
  position: absolute;
  color: rgba(14, 116, 144, .10);
  font-size: 54px;
  font-weight: 800;
  line-height: 1;
  filter: blur(.1px);
  animation: nikmedGlassFloat 10s ease-in-out infinite;
}

body.nikmed-glass-login-active .nikmed-glass-medical-symbols span:nth-child(1) { left: 7%; top: 12%; animation-delay: -1s; }
body.nikmed-glass-login-active .nikmed-glass-medical-symbols span:nth-child(2) { right: 8%; top: 18%; animation-delay: -3s; }
body.nikmed-glass-login-active .nikmed-glass-medical-symbols span:nth-child(3) { left: 10%; bottom: 16%; animation-delay: -4s; }
body.nikmed-glass-login-active .nikmed-glass-medical-symbols span:nth-child(4) { right: 12%; bottom: 19%; animation-delay: -6s; }
body.nikmed-glass-login-active .nikmed-glass-medical-symbols span:nth-child(5) { left: 50%; top: 7%; animation-delay: -7s; }

@keyframes nikmedGlassFloat {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); opacity: .60; }
  50% { transform: translate3d(0, -18px, 0) rotate(8deg); opacity: .92; }
}

@media (max-width: 1023px) {
  body.nikmed-glass-login-active #root > div > div.relative.z-10.grid {
    min-height: auto !important;
    width: min(540px, calc(100vw - 28px)) !important;
  }

  body.nikmed-glass-login-active #root > div > div.relative.z-10.grid > section:last-child {
    margin: 14px !important;
  }
}

@media (max-width: 640px) {
  body.nikmed-glass-login-active #root > div {
    align-items: flex-start !important;
    padding-top: 20px !important;
  }

  body.nikmed-glass-login-active #root > div > div.relative.z-10.grid {
    border-radius: 30px !important;
  }

  body.nikmed-glass-login-active #root > div > div.relative.z-10.grid > section:last-child {
    border-radius: 26px !important;
    padding: 24px !important;
  }
}
