
/* ============================================================
   DODO-MI — CONNEXION MOBILE 18T6B
   Objectifs :
   - défilement vertical garanti dans les navigateurs mobiles ;
   - espace libre sous la carte pour les barres flottantes ;
   - formulaire plus compact sans modifier son fonctionnement.
   ============================================================ */

html{
  width:100%;
  min-height:100%;
  height:auto !important;
  overflow-x:hidden !important;
  overflow-y:scroll !important;
  scroll-padding-bottom:190px;
}

body{
  position:static !important;
  inset:auto !important;
  display:block !important;
  width:100%;
  min-height:100%;
  height:auto !important;
  max-height:none !important;
  margin:0;
  overflow-x:hidden !important;
  overflow-y:visible !important;
  touch-action:pan-y !important;
  overscroll-behavior-y:auto;
  -webkit-overflow-scrolling:touch;
}

.c8d-page{
  position:relative !important;
  inset:auto !important;
  display:block !important;
  width:100%;
  min-height:100vh;
  min-height:100svh;
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
  padding:
    max(8px,env(safe-area-inset-top))
    max(8px,env(safe-area-inset-right))
    calc(190px + env(safe-area-inset-bottom))
    max(8px,env(safe-area-inset-left))
    !important;
}

.c8d-card{
  position:relative !important;
  inset:auto !important;
  display:block !important;
  width:min(100%,416px) !important;
  min-height:0 !important;
  height:auto !important;
  max-height:none !important;
  margin:0 auto !important;
  overflow:visible !important;
}

/* Le lien ne doit pas chevaucher le bouton suivant. */
.c8d-password-help{
  position:static !important;
  width:100%;
  min-height:24px;
}

/* Petit espace final même si une barre d'application recouvre l'écran. */
.c8d-card::after{
  content:"";
  display:block;
  height:2px;
}

@media screen and (max-width:600px){
  .c8d-page{
    padding-top:max(6px,env(safe-area-inset-top)) !important;
    padding-right:max(7px,env(safe-area-inset-right)) !important;
    padding-bottom:calc(210px + env(safe-area-inset-bottom)) !important;
    padding-left:max(7px,env(safe-area-inset-left)) !important;
  }

  .c8d-card{
    padding:17px 15px 20px !important;
    border-radius:18px !important;
  }

  .c8d-header{
    margin-bottom:12px !important;
  }

  .c8d-logo{
    font-size:1.85rem !important;
    line-height:1.05;
  }

  .c8d-header h1{
    margin:5px 0 6px !important;
    font-size:1.75rem !important;
    line-height:1.08;
  }

  .c8d-header p{
    font-size:.96rem !important;
    line-height:1.35;
  }

  .c8d-mode-buttons{
    gap:7px !important;
    margin-bottom:11px !important;
  }

  .c8d-mode-buttons button{
    min-height:48px;
    padding:10px 8px !important;
    line-height:1.2;
  }

  .c8d-message{
    margin-bottom:10px !important;
    padding:10px 11px !important;
    font-size:.93rem;
    line-height:1.35;
  }

  #formConnexionC8D label{
    margin:10px 0 5px !important;
  }

  #formConnexionC8D input{
    min-height:48px;
    padding:10px 12px !important;
    font-size:16px !important;
  }

  #formConnexionC8D small{
    margin-top:4px !important;
    font-size:.84rem;
    line-height:1.3;
  }

  .c8d-password-help{
    justify-content:flex-end;
    margin:0 0 9px !important;
  }

  .c8d-password-help a{
    display:inline-block;
    padding:2px 0;
    font-size:.9rem !important;
    line-height:1.25;
  }

  .c8d-submit{
    min-height:48px;
    margin-top:5px !important;
    padding:11px 12px !important;
  }

  .c8d-secondary-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:7px !important;
    margin-top:9px !important;
  }

  .c8d-secondary-actions button,
  .c8d-secondary-actions a{
    width:100%;
    min-height:44px;
    padding:9px 10px !important;
  }

  .c8d-footer{
    margin-top:13px !important;
    padding-top:11px !important;
    font-size:.79rem !important;
    line-height:1.4;
  }
}

/* Téléphones de faible hauteur : priorité au formulaire. */
@media screen and (max-width:600px) and (max-height:760px){
  .c8d-card{
    padding-top:13px !important;
  }

  .c8d-logo{
    font-size:1.55rem !important;
  }

  .c8d-header h1{
    font-size:1.45rem !important;
  }

  .c8d-header p{
    font-size:.85rem !important;
  }

  .c8d-header{
    margin-bottom:9px !important;
  }

  .c8d-mode-buttons button{
    min-height:43px;
  }

  .c8d-message{
    padding:8px 10px !important;
  }

  #formConnexionC8D input{
    min-height:44px;
  }
}
