/* =======================
   Thème (verts cohérents avec index.css)
   ======================= */
:root{
  --leaf-900:#0e3a22;
  --leaf-800:#1a6b3a; /* primaire */
  --leaf-700:#2a7f45; /* hover */
  --leaf-500:#6fbd5f; /* accent */
  --ink-900:#102a19;
  --ink-700:#3d5a4a;
  --bg-100:#ffffff;
  --paper:#f0f0f0;

  /* Bootstrap override — supprimer tout bleu */
  --bs-primary: var(--leaf-800);
  --bs-primary-rgb: 26,107,58;
  --bs-link-color: var(--leaf-800);
  --bs-link-hover-color: var(--leaf-700);
  --bs-body-color: var(--ink-900);
  --bs-body-bg: var(--paper);

  --focus-ring: rgba(26,107,58,.28);
}

/* Base & accessibilité */
html { scroll-behavior: smooth; }
body { color: var(--ink-900); background: var(--paper); }
a, .link-primary{ color: var(--leaf-800) !important; }
a:hover, .link-primary:hover{ color: var(--leaf-700) !important; }
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:16px;top:16px;z-index:10000;padding:.5rem .75rem;background:#fff;border:2px solid var(--leaf-700);border-radius:10px}

/* Mise en page simple (pas de card) */
.auth-simple{ padding: clamp(24px,4vw,40px) 0; }
.container-sm{ max-width: 680px; } /* un peu plus large que login, car + de champs */

/* Titre + divider */
h1{
  font-size: clamp(24px, 3.2vw, 34px);
  font-weight: 800;
  color: var(--leaf-900);
  letter-spacing: -.01em;
}
.divider{
  width: 72px; height: 5px; border-radius: 999px;
  background: linear-gradient(90deg, var(--leaf-800), var(--leaf-500));
}

/* Formulaire compact */
.auth-form{ margin-top: 6px; }
.form-label{ font-weight: 600; color: var(--ink-700); margin-bottom: 4px; }
.form-control, .form-select{
  border-radius: 10px;
  border-color: rgba(0,0,0,.18);
  padding: .6rem .75rem;
}
.form-control:focus, .form-select:focus{
  border-color: var(--leaf-700);
  box-shadow: 0 0 0 .2rem var(--focus-ring);
  outline: 0;
}

/* Boutons 100% verts (zéro bleu) */
.btn{
  border-radius: 10px;
  font-weight: 800;
  letter-spacing: .2px;
  min-height: 42px;
}
.btn-primary{
  background: var(--leaf-800) !important;
  border-color: var(--leaf-800) !important;
  color: #fff !important;
}
.btn-primary:hover, .btn-primary:focus-visible{
  background: var(--leaf-700) !important;
  border-color: var(--leaf-700) !important;
}

/* Outline : empêcher tout remplissage bleu/gris au hover */
.btn-outline-primary{
  /* Variables Bootstrap 5.3 pour normaliser les états */
  --bs-btn-color: var(--leaf-800);
  --bs-btn-border-color: var(--leaf-800);
  --bs-btn-hover-color: var(--leaf-700);
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: var(--leaf-700);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--leaf-800);
  --bs-btn-active-border-color: var(--leaf-800);
  --bs-btn-disabled-color: var(--leaf-800);
  --bs-btn-disabled-border-color: var(--leaf-800);
  --bs-btn-focus-shadow-rgb: 26,107,58;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus-visible,
.btn-outline-primary:active{
  background: #fff !important;
  color: var(--leaf-700) !important;
  border-color: var(--leaf-700) !important;
}

/* Alertes */
.alert{ border-radius: 10px; }

/* reCAPTCHA — s’adapte sur petits écrans */
.g-recaptcha{ transform-origin: left top; }
@media (max-width: 360px){ .g-recaptcha{ transform: scale(.9); } }

/* Spinner du bouton submit */
.btn-submit{
  position: relative;
}
.spinner{
  position: absolute;
  top: 50%; right: 12px;
  transform: translateY(-50%);
  display: none;
  width: 14px; height: 14px;
  border: 2px solid #fff;
  border-top: 2px solid rgba(255,255,255,.4);
  border-radius: 50%;
  animation: spin .6s linear infinite;
}
@keyframes spin{ to{ transform: translateY(-50%) rotate(360deg); } }

/* Mobile micro-ajustements */
@media (max-width: 575.98px){
  .auth-simple{ padding-top: 16px; }
}

/* === Bouton "J’ai déjà un compte" — contour 100% vert, jamais bleu === */
.btn-outline-primary{
  /* variables Bootstrap 5.3 (couleurs et focus) */
  --bs-btn-color: var(--leaf-800);
  --bs-btn-border-color: var(--leaf-800);
  --bs-btn-hover-color: var(--leaf-700);
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: var(--leaf-700);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--leaf-800);
  --bs-btn-active-border-color: var(--leaf-800);
  --bs-btn-focus-shadow-rgb: 26,107,58;
  border-color: var(--leaf-800) !important;      /* contour vert par défaut */
  color: var(--leaf-800) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:focus-visible{
  background: #fff !important;
  border-color: var(--leaf-700) !important;      /* contour vert plus foncé au survol/focus */
  color: var(--leaf-700) !important;
  box-shadow: 0 0 0 .2rem rgba(26,107,58,.25) !important; /* halo vert */
}

.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-check:checked + .btn-outline-primary{
  background: var(--leaf-800) !important;        /* état actif : plein vert */
  border-color: var(--leaf-800) !important;
  color: #fff !important;
}

/* Ceinture et bretelles : toute .btn garde un focus-ring vert */
.btn:focus,
.btn:focus-visible{
  box-shadow: 0 0 0 .2rem rgba(26,107,58,.25) !important;
}
