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

  /* Bootstrap override — pas de bleu du tout */
  --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 */
html { scroll-behavior: smooth; }
body { color: var(--ink-900); background: var(--paper); }

/* Skip link (accessibilité) */
.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;width:auto;height:auto;
  padding:.5rem .75rem;background:var(--bg-100);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: 520px; }

/* 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: 8px; }
.form-label{ font-weight: 600; color: var(--ink-700); margin-bottom: 4px; }
.form-control{
  border-radius: 10px;
  border-color: rgba(0,0,0,.18);
  padding: .6rem .75rem;
}
.form-control:focus{
  border-color: var(--leaf-700);
  box-shadow: 0 0 0 .2rem var(--focus-ring);
  outline: 0;
}

/* Boutons 100% verts */
.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;
}
.btn-outline-primary{
  background: var(--bg-100);
  color: var(--leaf-800)!important;
  border-color: var(--leaf-800)!important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus-visible{
  color: var(--leaf-700)!important;
  border-color: var(--leaf-700)!important;
  background: #fff;
}

/* Liens */
a, .link-primary{ color: var(--leaf-800) !important; }
a:hover, .link-primary:hover{ color: var(--leaf-700) !important; }

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

/* Alertes (couleurs par défaut ok ; pas de bleu utilisé) */
.alert{ border-radius: 10px; }

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

/* Empêche le remplissage au hover des outline-primary */
.btn-outline-primary{
  /* Variables bouton Bootstrap 5.3 */
  --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;                 /* rester blanc au survol */
  --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;    /* focus ring vert */
}

/* Ceinture et bretelles si un autre CSS passe avant */
.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;
}
