@import url(style.css);

body {
  background: linear-gradient(160deg, var(--violet-profond), var(--violet-moyen) 60%, var(--lavande-douce));
  color: var(--gris-anthracite);
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.login-brand {
  text-align: center;
  margin-bottom: -10px;
}
.login-brand img { width: 72px; height: 72px; border-radius: 16px; background: var(--white); padding: 8px; box-shadow: var(--shadow); }
.login-brand h1 { color: var(--white); font-size: 1.4rem; margin: 10px 0 0; }
.login-brand h1 span { color: var(--or-doux); }

form {
  max-width: 400px;
  width: 100%;
  margin: 20px auto;
  padding: 40px;
  background-color: var(--white);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}
form h2 {
  text-align: center;
  margin-bottom: 24px;
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--violet-moyen);
  text-transform: none;
}
form .field-icon { position: relative; }
form .field-icon i {
  position: absolute; left: 14px; top: 14px; color: var(--violet-moyen);
}
form .field-icon input { padding-left: 38px; }

button[type="submit"] { width: 100%; justify-content: center; padding: 12px; font-size: .95rem; }