/* Login page polish: frosted-glass card, softer inputs, gradient button with hover/press motion.
   Loaded after login.css; changes only look and motion, not layout, sizes or behaviour. */

:root {
  --lg-green: #1f8a70;
  --lg-green-deep: #126650;
  --lg-lime: #bedb39;
  --lg-ease: cubic-bezier(.22, 1, .36, 1);
  --lg-spring: cubic-bezier(.34, 1.56, .64, 1);
}

/* card */
#msform fieldset,
#msform fieldset:hover {
  background: rgba(255, 255, 255, .80);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  backdrop-filter: blur(20px) saturate(150%);
  border: 1px solid rgba(255, 255, 255, .6);
  border-radius: 22px;
  box-shadow: 0 32px 64px -24px rgba(6, 10, 44, .6), 0 2px 0 rgba(255, 255, 255, .5) inset;
}
#msform fieldset {
  overflow: visible;
}

/* headings */
.fs-title {
  letter-spacing: .14em;
  color: #17423a;
}

/* inputs: light, soft, green focus ring instead of the raised grey "buttons" */
#msform input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
#msform fieldset:hover input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
#msform textarea {
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(31, 138, 112, .16);
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 8px 18px -12px rgba(16, 24, 40, .25);
  transition: border-color .3s var(--lg-ease), box-shadow .35s var(--lg-ease), transform .3s var(--lg-ease), background-color .3s ease;
}
#msform input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):hover {
  border-color: rgba(31, 138, 112, .38);
}
#msform input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
#msform textarea:focus {
  background: #fff;
  border-color: var(--lg-green);
  box-shadow: 0 0 0 4px rgba(31, 138, 112, .16), 0 12px 24px -14px rgba(31, 138, 112, .55);
  transform: translate3d(0, -1px, 0);
}

#msform input:focus,
#msform textarea:focus {
  outline: none;   /* the green ring above replaces the browser's default outline */
}

/* primary + back buttons */
#msform .action-button,
#msform .action-button-previous {
  position: relative;
  overflow: hidden;
  transition: transform .3s var(--lg-ease), box-shadow .35s var(--lg-ease), filter .25s ease, background .3s ease, color .25s ease;
}
#msform .action-button {
  background: linear-gradient(135deg, var(--lg-green), var(--lg-green-deep));
  box-shadow: 0 12px 24px -12px rgba(18, 102, 80, .9);
}
#msform .action-button:hover,
#msform #sign.action-button:focus {
  background: linear-gradient(135deg, #27a184, var(--lg-green));
  color: #fff;
  box-shadow: 0 16px 28px -12px rgba(18, 102, 80, .95), 0 0 0 3px rgba(190, 219, 57, .35);
  transform: translate3d(0, -2px, 0);
}
#msform .action-button:active,
#msform .action-button-previous:active {
  transform: translate3d(0, 0, 0) scale(.96);
  transition-duration: .08s;
}
/* light sweep across the primary button on hover */
#msform .action-button::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -60%;
  width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .45), transparent);
  transform: skewX(-20deg);
  pointer-events: none;
}
#msform .action-button:hover::after {
  left: 130%;
  transition: left .7s var(--lg-ease);
}
#msform .action-button-previous {
  box-shadow: 0 10px 20px -12px rgba(120, 140, 20, .9);
}
#msform .action-button-previous:hover,
#msform .action-button-previous:focus {
  box-shadow: 0 14px 24px -12px rgba(120, 140, 20, .95), 0 0 0 3px rgba(190, 219, 57, .35);
  transform: translate3d(0, -2px, 0);
}

/* step indicator */
#progressbar li:before {
  transition: background-color .4s ease, color .4s ease, transform .5s var(--lg-spring), box-shadow .5s ease;
}
#progressbar li.active:before {
  transform: scale(1.12);
  box-shadow: 0 0 0 5px rgba(190, 219, 57, .28), 0 6px 16px -4px rgba(190, 219, 57, .8);
  animation: lg-step-pulse 2.6s ease-in-out infinite;
}
@keyframes lg-step-pulse {
  0%, 100% { box-shadow: 0 0 0 5px rgba(190, 219, 57, .28), 0 6px 16px -4px rgba(190, 219, 57, .8); }
  50%      { box-shadow: 0 0 0 9px rgba(190, 219, 57, .10), 0 6px 16px -4px rgba(190, 219, 57, .8); }
}
#progressbar li:after {
  background: rgba(255, 255, 255, .7);
  transition: background-color .5s ease;
}

/* links inside the card */
#msform fieldset a {
  transition: color .2s ease, opacity .2s ease;
}
#msform fieldset a:hover {
  opacity: .8;
}

@media (prefers-reduced-motion: reduce) {
  #progressbar li.active:before { animation: none; }
  #msform .action-button,
  #msform .action-button-previous,
  #msform input,
  #msform textarea { transition-duration: .01s !important; }
  #msform .action-button:hover::after { transition: none; }
}
