/* --------- Contexte page login (fond + centrage) --------- */
.auth-wrap{
  min-height:calc(100vh - var(--tc-header-h));
  padding:clamp(16px, 3.2vw, 28px);
  background:
    radial-gradient(1200px 600px at 10% 0%, rgba(109,94,252,.12), rgba(109,94,252,0) 60%),
    radial-gradient(900px 460px at 92% 12%, rgba(139,124,255,.14), rgba(139,124,255,0) 55%),
    radial-gradient(760px 420px at 30% 110%, rgba(109,94,252,.08), rgba(109,94,252,0) 55%),
    var(--tc-bg);
  display:grid;
  place-items:center;
}

/* --------- Carte centrale --------- */
.auth-card{
  width:min(680px, 100%);
  background:var(--tc-paper);
  color:var(--tc-ink);
  border:1px solid var(--tc-border);
  border-radius:var(--tc-radius);
  box-shadow:var(--tc-shadow);
  padding:clamp(22px, 3vw, 32px);
  position:relative;
  overflow:hidden;
}

/* léger halo décoratif (sans images) */
.auth-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  background:
    radial-gradient(520px 220px at 20% 10%, rgba(109,94,252,.10), transparent 60%),
    radial-gradient(380px 200px at 90% 18%, rgba(139,124,255,.10), transparent 60%);
  pointer-events:none;
  z-index:0;
}
.auth-card > *{ position:relative; z-index:1; }

/* Titre */
.auth-card h1{
  margin:0 0 18px;
  font-size:clamp(22px, 2.1vw, 28px);
  line-height:1.25;
  letter-spacing:-.01em;
}

/* --------- Champs & labels --------- */
.auth-card label{
  display:block;
  font-weight:650;
  font-size:14px;
  color:var(--tc-ink);
  margin:14px 0 8px;
}

/* Inputs */
.auth-card input[type="email"],
.auth-card input[type="password"],
.auth-card input[type="text"],
.auth-card input[type="number"],
.auth-card input[type="tel"]{
  width:100%;
  height:46px;
  border-radius:12px;
  border:1px solid var(--tc-border);
  background:#fff;
  color:var(--tc-ink);
  padding:0 12px;
  outline:none;
  box-shadow:0 10px 22px rgba(17,24,39,.03);
  transition:border-color .18s ease, box-shadow .18s ease, transform .06s ease;
}

.auth-card input[type="email"]:focus,
.auth-card input[type="password"]:focus,
.auth-card input[type="text"]:focus,
.auth-card input[type="number"]:focus,
.auth-card input[type="tel"]:focus{
  border-color:rgba(109,94,252,.65);
  box-shadow:0 0 0 4px rgba(109,94,252,.16);
}

/* Placeholder */
.auth-card input::placeholder{
  color:#9aa3b2;
}

/* --------- Checkbox compacte --------- */
.auth-card .checkbox-group{
  display:flex;
  align-items:center;
  gap:8px;
  margin:10px 0 6px;
  color:var(--tc-muted);
  font-size:14px;
}
.auth-card .checkbox-group input[type="checkbox"]{
  width:16px;
  height:16px;
  accent-color:var(--tc-brand);
}

/* --------- Boutons --------- */
.auth-card .btn-connexion,
.auth-card .btn-validation-submit{
  width:100%;
  height:46px;
  border:none;
  border-radius:12px;
  background:linear-gradient(180deg, var(--tc-brand) 0%, var(--tc-brand-2) 100%);
  color:#fff;
  font-weight:850;
  letter-spacing:.2px;
  cursor:pointer;
  margin-top:14px;
  box-shadow:0 16px 34px rgba(109,94,252,.20);
  transition:filter .15s ease, transform .06s ease, box-shadow .15s ease;
}

.auth-card .btn-connexion:hover,
.auth-card .btn-validation-submit:hover{
  filter:brightness(1.05);
  box-shadow:0 20px 44px rgba(109,94,252,.24);
}
.auth-card .btn-connexion:active,
.auth-card .btn-validation-submit:active{
  transform:translateY(1px);
}
.auth-card .btn-connexion:focus-visible,
.auth-card .btn-validation-submit:focus-visible{
  outline:none;
  box-shadow:var(--tc-ring);
}

/* --------- Loader discret --------- */
.auth-card #loaderConnexion,
.auth-card .validation-loader{
  display:none; /* JS les affichera */
  margin-top:10px;
  color:var(--tc-muted);
  font-size:14px;
}
.auth-card .validation-loader img{
  width:24px;
  height:24px;
}

/* --------- Messages d’erreur (texte seul) --------- */
.auth-card .erreurConnexion,
.auth-card .validation-error-message{
  margin-top:12px;
  color:#d14343;
  font-weight:650;
  font-size:14px;
}

/* --------- Groupes du formulaire d’invitation --------- */
.auth-card .form-group-validation{
  margin:10px 0 8px;
}

/* --------- A11y focus visible --------- */
.auth-card input:focus-visible,
.auth-card button:focus-visible{
  outline:none;
  box-shadow:var(--tc-ring);
}

/* --------- Réduction animations si préférences --------- */
@media (prefers-reduced-motion: reduce){
  .auth-card,
  .auth-card *{
    transition:none !important;
  }
}

/* --------- Responsive --------- */
@media (max-width:640px){
  :root{ --tc-header-h:56px; }
  .auth-card{ border-radius:16px; padding:20px; }
  .auth-card h1{ font-size:20px; }
  .auth-card .btn-connexion,
  .auth-card .btn-validation-submit{ height:44px; }
  .auth-card input[type="email"],
  .auth-card input[type="password"],
  .auth-card input[type="text"],
  .auth-card input[type="number"],
  .auth-card input[type="tel"]{ height:44px; }
}

@media (max-width:380px){
  .auth-card{ padding:18px; }
  .auth-card h1{ font-size:19px; }
}