/* Pages publiques (connexion, création de compte, compte en attente) — même palette que
   assets/styles.css (couleurs du logo AIA). Accessible sans session : voir le "matcher" de
   middleware.mjs. */
:root{
  /* palette AIA (logo), voir assets/styles.css */
  --navy-950:#071E57; --navy-900:#0A2A78; --navy-800:#1E6AC6; --navy:#1E6AC6;
  --blue:#1E6AC6; --sky:#5A9BE6; --gold:#FA8C0A; --bronze:#C47B2C;
  --bg:#F3F5F9; --border:#C9D3E3; --text:#14213D; --muted:#667691;
  --danger:#C2412D; --danger-soft:#FCEFEC; --success:#1E8A5A; --success-soft:#E8F5EE;
  --font:"Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
*{ box-sizing:border-box; }
html, body{ height:100%; }
body{
  margin:0; min-height:100vh; display:flex;
  font-family:var(--font); color:var(--text); background:var(--bg);
  -webkit-font-smoothing:antialiased;
}

/* Panneau de marque (gauche sur grand écran, bandeau en haut sur mobile) */
.auth-brand{
  position:relative; overflow:hidden;
  flex:0 0 44%; max-width:620px;
  display:flex; flex-direction:column; justify-content:space-between;
  padding:48px 56px;
  color:#fff;
  background:
    radial-gradient(900px 500px at 110% 110%, rgba(90,155,230,.45), transparent 60%),
    radial-gradient(600px 400px at -20% -10%, rgba(250,140,10,.16), transparent 60%),
    linear-gradient(160deg, var(--navy-800), var(--navy-950));
}
.auth-brand::after{
  /* trame discrète en arrière-plan */
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:40px 40px;
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
          mask-image:linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
}
.auth-brand > *{ position:relative; z-index:1; }
.auth-brand-logo{ height:48px; width:auto; align-self:flex-start; }
.auth-brand-body h2{
  margin:0 0 14px; font-size:30px; line-height:1.2; font-weight:700; letter-spacing:-.02em;
}
.auth-brand-body h2 span{ color:#F6C10F; }
.auth-brand-body p{ margin:0 0 28px; font-size:15px; line-height:1.6; color:rgba(255,255,255,.68); max-width:420px; }
.auth-features{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.auth-features li{ display:flex; align-items:center; gap:12px; font-size:14px; color:rgba(255,255,255,.85); }
.auth-features svg{
  flex-shrink:0; width:34px; height:34px; padding:8px; border-radius:9px;
  color:#F6C10F; background:rgba(246,193,15,.12); border:1px solid rgba(246,193,15,.3);
}
.auth-brand-foot{ font-size:12px; letter-spacing:.04em; color:rgba(255,255,255,.4); }

/* Zone formulaire */
.auth-main{
  flex:1; background:#F2F3FA; display:flex; align-items:center; justify-content:center; padding:40px 24px;
}
.auth-card{ width:100%; max-width:420px; padding:36px 32px; background:#fff; border-radius:28px; box-shadow:0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.12), 0 1px 5px 0 rgba(0,0,0,.2); }
.auth-card-logo{ display:none; height:44px; width:auto; margin:0 0 28px; }
.auth-eyebrow{
  display:inline-flex; align-items:center; gap:8px; margin:0 0 12px;
  font-size:11.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--bronze);
}
.auth-eyebrow::before{ content:""; width:18px; height:2px; border-radius:2px; background:var(--gold); }
.auth-card h1{ margin:0 0 8px; font-size:30px; font-weight:400; letter-spacing:-.02em; color:var(--navy-900); }
.auth-card .auth-lead{ margin:0 0 28px; font-size:14px; line-height:1.6; color:var(--muted); }

.auth-field{ margin-bottom:16px; }
.auth-field label{ display:block; margin-bottom:6px; font-size:12.5px; font-weight:600; color:var(--text); }
.auth-card input, .auth-card select{
  width:100%; height:46px; padding:0 14px; font-size:15px; font-family:inherit;
  color:var(--text); background:#fff;
  border:1px solid #757780; border-radius:4px;
  transition:border-color .12s, box-shadow .12s;
}
.auth-card select{
  -webkit-appearance:none; appearance:none; cursor:pointer; padding-right:40px;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23667691' stroke-width='2' stroke-linecap='round' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center;
}
.auth-card input:hover, .auth-card select:hover{ border-color:var(--sky); }
.auth-card input:focus, .auth-card select:focus{
  outline:none; border-color:var(--navy); box-shadow:inset 0 0 0 1px var(--navy);
}
.auth-card input::placeholder{ color:#98A4B8; }

.auth-submit{
  display:flex; align-items:center; justify-content:center; gap:8px;
  width:100%; height:48px; margin-top:8px;
  font-size:15px; font-weight:600; font-family:inherit; letter-spacing:.01em;
  color:#fff; background:var(--navy); border:none; border-radius:24px; cursor:pointer;
  box-shadow:0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.12), 0 1px 5px 0 rgba(0,0,0,.2);
  transition:background .15s, transform .05s;
}
.auth-submit:hover{ background:#144EA0; box-shadow:0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.3); }
.auth-submit:active{ transform:translateY(1px); }
.auth-submit:disabled{ opacity:.65; cursor:default; }
.auth-submit svg{ width:18px; height:18px; }
.auth-submit.is-loading svg{ display:none; }
.auth-submit.is-loading::before{
  content:""; width:16px; height:16px; border-radius:50%;
  border:2px solid rgba(255,255,255,.35); border-top-color:#fff;
  animation:auth-spin .7s linear infinite;
}
@keyframes auth-spin{ to{ transform:rotate(360deg); } }

.auth-alert{
  display:none; margin-top:16px; padding:11px 14px; border-radius:10px;
  font-size:13px; line-height:1.5;
}
.auth-alert.error{ color:var(--danger); background:var(--danger-soft); border:1px solid rgba(194,65,45,.25); }
.auth-alert.success{ color:var(--success); background:var(--success-soft); border:1px solid rgba(30,138,90,.25); }

.auth-switch{
  margin:28px 0 0; padding-top:20px; border-top:1px solid #E1E6EF;
  font-size:13.5px; color:var(--muted); text-align:center;
}
.auth-switch a{ color:var(--navy); font-weight:600; text-decoration:none; }
.auth-switch a:hover{ color:var(--bronze); }

.auth-status-icon{
  width:56px; height:56px; margin:0 0 22px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  color:var(--bronze); background:#FBF3E4; border:1px solid #F0DDB8;
}
.auth-status-icon svg{ width:26px; height:26px; }
.auth-secondary-btn{
  display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 18px;
  font-size:14px; font-weight:600; color:var(--navy); text-decoration:none;
  border:1px solid #757780; border-radius:22px; background:#fff;
  transition:background .12s, border-color .12s;
}
.auth-secondary-btn:hover{ background:#EDF2FA; border-color:var(--sky); }
.auth-secondary-btn svg{ width:16px; height:16px; }

@media (max-width: 900px){
  body{ flex-direction:column; }
  .auth-brand{ display:none; }
  .auth-main{
    align-items:flex-start; padding:48px 22px;
    padding-top:calc(48px + env(safe-area-inset-top));
    background:
      radial-gradient(600px 300px at 50% -80px, rgba(63,107,184,.12), transparent 70%),
      var(--bg);
  }
  .auth-card-logo{ display:block; }
}