:root{
  --primary:#1A0033;
  --primary-light:#2E0A52;
  --primary-soft:#F4EFFA;
  --cta:#FF4500;
  --cta-hover:#E03D00;
  --gray:#EFEFEF;
  --white:#FFFFFF;
  --text:#171717;
  --text-secondary:#6B6B6B;
  --gold:#E8A33D;
  --radius:14px;
}
*{box-sizing:border-box;}
:root{color-scheme:light;}
body{
  font-family:'Manrope',sans-serif;
  color:var(--text);
  background:var(--gray);
  margin:0;
}
h1,h2,h3,.display-font{
  font-family:'Space Grotesk',sans-serif;
  letter-spacing:-0.01em;
}
a{text-decoration:none;}

.auth-wrapper{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:40px 16px;
}
.auth-card{
  background:var(--white);
  border-radius:var(--radius);
  box-shadow:0 20px 50px rgba(26,0,51,0.12);
  width:100%;
  max-width:420px;
  padding:36px 32px;
}
.auth-logo{
  font-family:'Space Grotesk',sans-serif;
  font-weight:700;
  font-size:1.4rem;
  color:var(--primary);
  display:block;
  margin-bottom:26px;
}
.auth-logo span{color:var(--cta);}
.auth-card h1{font-size:1.5rem; margin-bottom:6px;}
.auth-sub{color:var(--text-secondary); font-size:0.9rem; margin-bottom:24px;}

.form-label{font-weight:600; font-size:0.86rem; margin-bottom:6px;}
.form-control{
  /* background/color fixés explicitement : sans ça, un téléphone en mode
     sombre (très courant sur Android) peut forcer un fond sombre sur les
     champs de formulaire sans changer la couleur du texte, qui devient
     alors illisible (texte noir sur fond noir). */
  background:var(--white);
  color:var(--text);
  border:1.5px solid #E4E4E4;
  border-radius:10px;
  padding:11px 14px;
  font-size:0.92rem;
  width:100%;
  margin-bottom:16px;
}
.form-control:focus{
  outline:none;
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(26,0,51,0.08);
}
.btn-auth{
  background:var(--cta);
  color:var(--white);
  border:none;
  border-radius:10px;
  padding:12px;
  font-weight:700;
  font-size:0.95rem;
  width:100%;
  cursor:pointer;
  transition:background 0.15s ease;
}
.btn-auth:hover{background:var(--cta-hover);}
.auth-footer{
  text-align:center;
  margin-top:20px;
  font-size:0.88rem;
  color:var(--text-secondary);
}
.auth-footer a{color:var(--primary); font-weight:700;}

.alert-error{
  background:#FDEDED;
  border:1px solid #F6C6C6;
  color:#B42318;
  border-radius:10px;
  padding:12px 14px;
  font-size:0.85rem;
  margin-bottom:18px;
}
.form-row-split{display:flex; gap:12px;}
.form-row-split .form-control{flex:1;}