/* ============================================================
   EDOUARGOT — Connexion : formulaire mieux contenu
   Corrige les labels/champs trop proches du bord du cadre.
   ============================================================ */

html body .connexion-container,
html body .login-container,
html body .form-container {
  width: min(520px, calc(100vw - 36px)) !important;
  max-width: calc(100vw - 36px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* Le formulaire reçoit le vrai padding interne */
html body .connexion-container form,
html body .login-container form,
html body .form-container form,
html body form {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;

  padding: 22px 26px 26px 26px !important;
  margin-left: auto !important;
  margin-right: auto !important;

  overflow: hidden !important;
  border-radius: 24px !important;
}

/* Les groupes restent dans la zone utile */
html body form .mb-3,
html body form .form-group,
html body form p,
html body form div {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Labels éloignés du bord */
html body form label {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;

  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 9px !important;

  padding-left: 0 !important;
  padding-right: 0 !important;

  box-sizing: border-box !important;
  line-height: 1.2 !important;
}

/* Champs strictement contenus dans le padding du formulaire */
html body form input,
html body form select,
html body form textarea {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;

  margin-left: 0 !important;
  margin-right: 0 !important;

  box-sizing: border-box !important;
}

/* Bouton aligné sur les champs */
html body form button,
html body form input[type="submit"],
html body form .btn {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;

  margin-left: 0 !important;
  margin-right: 0 !important;

  box-sizing: border-box !important;
}

/* Mobile : on garde une marge extérieure et un padding confortable */
@media (max-width: 560px) {
  html body .connexion-container,
  html body .login-container,
  html body .form-container {
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
  }

  html body .connexion-container form,
  html body .login-container form,
  html body .form-container form,
  html body form {
    padding: 20px 20px 24px 20px !important;
    border-radius: 22px !important;
  }
}