/* Job Formazione password reset screens — v2 polish */

:root {
  --jf-reset-coral: #fa6863;
  --jf-reset-coral-deep: #dc514c;
  --jf-reset-ink: #181928;
  --jf-reset-muted: rgba(24, 25, 40, 0.66);
  --jf-reset-soft: #f4f5f8;
}

html {
  min-height: 100%;
}

body {
  min-height: 100vh !important;
  margin: 0 !important;
  padding: clamp(18px, 4vw, 44px) !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, #df7667 0%, #bc575f 34%, #834791 68%, #2151a1 100%) !important;
  color: var(--jf-reset-ink) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.reset-shell {
  width: min(100%, 520px) !important;
  padding: clamp(26px, 4vw, 42px) !important;
  border: 1px solid rgba(255, 255, 255, 0.42) !important;
  border-radius: 30px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 32px 80px -28px rgba(18, 19, 44, 0.45) !important;
  text-align: left !important;
}

.reset-shell img {
  width: min(210px, 70%) !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto 26px !important;
  filter: drop-shadow(0 8px 18px rgba(18, 19, 44, 0.18));
}

.reset-shell h1,
.reset-shell h3,
.reset-shell h4 {
  margin-inline: 0 !important;
  color: var(--jf-reset-ink) !important;
  text-align: center !important;
  letter-spacing: -0.04em !important;
}

.reset-shell h1 {
  margin: 0 !important;
  font-size: clamp(34px, 6vw, 52px) !important;
  line-height: 0.98 !important;
}

.reset-shell h3,
.reset-shell h4 {
  max-width: 36rem !important;
  margin: 14px auto 0 !important;
  color: var(--jf-reset-muted) !important;
  font-size: clamp(16px, 2.4vw, 20px) !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.02em !important;
}

.reset-shell form {
  width: 100% !important;
  margin: 28px 0 0 !important;
  display: grid !important;
  gap: 12px !important;
}

.reset-shell input {
  width: 100% !important;
  height: auto !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border: 1px solid rgba(24, 25, 40, 0.12) !important;
  border-radius: 17px !important;
  background: var(--jf-reset-soft) !important;
  color: var(--jf-reset-ink) !important;
  font-size: 16px !important;
}

.reset-shell input::placeholder {
  color: rgba(24, 25, 40, 0.48) !important;
}

.reset-shell input:focus {
  border-color: rgba(250, 104, 99, 0.56) !important;
  background: #fff !important;
  color: var(--jf-reset-ink) !important;
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(250, 104, 99, 0.16) !important;
}

.reset-shell input[type="submit"] {
  min-height: 56px !important;
  border: 0 !important;
  background: var(--jf-reset-coral) !important;
  color: #fff !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  box-shadow: 0 16px 32px -20px rgba(250, 104, 99, 0.82) !important;
}

.reset-shell input[type="submit"]:hover {
  background: var(--jf-reset-coral-deep) !important;
}

.reset-shell a {
  color: var(--jf-reset-coral-deep) !important;
  font-weight: 800 !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 3px !important;
}

.errorDiv {
  width: 100% !important;
  margin: 18px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(220, 38, 38, 0.28) !important;
  border-radius: 16px !important;
  background: rgba(220, 38, 38, 0.08) !important;
  color: #991b1b !important;
}

.errorDiv p {
  margin: 0 !important;
}

@media (max-width: 520px) {
  .reset-shell {
    border-radius: 24px !important;
  }
}