/* IMMIMAX - page de connexion.
   Trois defauts au telephone : la carte ne faisait que 255 px de large, l'oeil
   du mot de passe flottait pres du libelle au lieu d'etre dans le champ, et
   les deux liens du bas, habilles en boutons pleins, se chevauchaient des
   qu'ils passaient a la ligne. Un formulaire de connexion a une seule action
   principale : le reste redevient du lien. */

.pmpro_login_wrap{
  width:100%!important;
  max-width:420px!important;
  margin-inline:auto!important;
  padding:0!important;
  box-sizing:border-box!important;
}
/* PMPro rembourre sa carte de 36 px de chaque cote : sur un ecran de 375 px
   il ne restait que 145 px au formulaire. C'est la vraie cause de l'etroitesse. */
.pmpro_login_wrap .pmpro_card_content{
  margin:0!important;              /* 19 px de marge de chaque cote, en plus du rembourrage */
  padding:28px!important; box-sizing:border-box!important;
}
@media (max-width:480px){
  .pmpro_login_wrap .pmpro_card_content{ padding:22px 20px!important; }
}

/* La carte gardait 19 px de rembourrage lateral en plus de sa marge : sur un
   ecran de 375 px, quatre niveaux de rembourrage empilés ne laissaient que
   177 px au formulaire. */
body .pmpro_login_wrap.pmpro_card{ padding-left:0!important; padding-right:0!important; }
body .pmpro_login_wrap .pmpro_card_content{ width:100%!important; }

@media (max-width:600px){
  body.page-id-2427 .entry-content{ padding-left:14px!important; padding-right:14px!important; }
}
.pmpro_login_wrap form,
.pmpro_login_wrap #loginform{
  width:100%!important; max-width:none!important;
}

.pmpro_login_wrap label{
  display:block; margin-bottom:6px; font-weight:600;
}

.pmpro_login_wrap input[type=text],
.pmpro_login_wrap input[type=email],
.pmpro_login_wrap input[type=password]{
  width:100%!important; box-sizing:border-box!important;
  /* 16 px : en deca, iOS zoome des la mise au point */
  font-size:16px!important;
  padding:12px 46px 12px 14px!important;
  border:1px solid var(--immimax-trait,#d5d6de)!important;
  border-radius:6px!important;
  background:var(--immimax-surface,#fff)!important;
  color:var(--immimax-encre,#15161d)!important;
}
.pmpro_login_wrap input:focus{
  outline:2px solid var(--immimax-accent,#2e3a8c)!important;
  outline-offset:1px!important; border-color:transparent!important;
}

/* L'oeil se range dans le champ. Le positionnement absolu dependait d'un bloc
   conteneur que PMPro deplace : une grille est deterministe. Le libelle occupe
   la premiere rangee, le champ et l'oeil partagent la seconde. */
.pmpro_login_wrap .login-password{
  display:grid!important;
  grid-template-columns:1fr!important;
  row-gap:6px!important;
  position:relative!important;
}
.pmpro_login_wrap .login-password label{ grid-row:1!important; grid-column:1!important; }
.pmpro_login_wrap .login-password input[type=password],
.pmpro_login_wrap .login-password input[type=text]{ grid-row:2!important; grid-column:1!important; }
.pmpro_login_wrap .pmpro_form_field-password-toggle{
  position:static!important;
  grid-row:2!important; grid-column:1!important;
  justify-self:end!important; align-self:center!important;
  margin:0 5px 0 0!important; padding:0!important;
}
.pmpro_login_wrap .pmpro_form_field-password-toggle .pmpro_btn{
  display:flex!important; align-items:center!important; justify-content:center!important;
  width:40px!important; height:40px!important; min-height:40px!important;
  padding:0!important; background:none!important; background-image:none!important;
  border:0!important; border-radius:6px!important; box-shadow:none!important;
}
.pmpro_login_wrap .pmpro_form_field-password-toggle .pmpro_btn:hover{
  background:rgba(46,58,140,.08)!important;
}

/* Se souvenir de moi : la case et son libelle sur une seule ligne. */
.pmpro_login_wrap .login-remember{ margin:16px 0!important; }
.pmpro_login_wrap .login-remember label{
  display:flex!important; align-items:center!important; gap:9px!important;
  margin:0!important; font-weight:400!important; cursor:pointer;
}
.pmpro_login_wrap .login-remember input[type=checkbox]{
  width:18px!important; height:18px!important; margin:0!important; flex:0 0 auto;
}

/* L'action principale prend la couleur du site, pas l'orange d'usine. */
.pmpro_login_wrap #wp-submit,
.pmpro_login_wrap .button-primary,
.pmpro_login_wrap .login-submit input[type=submit]{
  width:100%!important;
  background:var(--immimax-accent,#2e3a8c)!important; background-image:none!important;
  color:#fff!important; border:0!important; border-radius:6px!important;
  font-size:16px!important; font-weight:600!important;
  padding:13px 20px!important; min-height:48px!important;
  text-shadow:none!important; box-shadow:none!important; cursor:pointer;
}
.pmpro_login_wrap #wp-submit:hover{ opacity:.9!important; }

/* Deux liens secondaires, pas deux boutons : c'est le chevauchement en moins
   et la hierarchie en plus. */
body .pmpro_actions_nav{
  margin-top:18px!important; text-align:center!important;
  font-size:15px!important; line-height:1.9!important;
  color:var(--immimax-attenue,#5c5e6e)!important;
}
body .pmpro_actions_nav a{
  display:inline!important;
  background:none!important; background-image:none!important;
  color:var(--immimax-accent,#2e3a8c)!important;
  padding:0!important; border:0!important; border-radius:0!important;
  box-shadow:none!important; font-size:15px!important;
  text-decoration:underline!important; text-underline-offset:2px!important;
}
body .pmpro_actions_nav a:hover{ opacity:.8!important; }

@media (max-width:480px){
  .pmpro_login_wrap{ padding:22px 18px!important; }
}