/* Champ de saisie principal : largeur par défaut sur desktop */
.input_co{
  width: 50%;
}

/* Image admin : responsive avec largeur relative
   min-width pour éviter qu’elle devienne trop petite */
#img_admin{
  width: 30%!important;
  height: auto!important;
  min-width: 300px;
}

/* Écrans ≤ 1280px de large et ≤ 1024px de haut
   (ex: laptops standards) */
@media (max-width: 1280px) and (max-height: 1024px){
  .input_co{
    width: 60%;
  }
}

/* Écrans ≤ 1280px de large et ≤ 800px de haut
   (ex: laptops plus compacts) */
@media (max-width: 1280px) and (max-height: 800px){
  .input_co{
    width: 50%;
  }
}

/* Écrans ≤ 1280px de large et ≤ 720px de haut
   (ex: petits écrans ou fenêtres réduites) */
@media (max-width: 1280px) and (max-height: 720px){
  .input_co{
    width: 40%;
  }
}

/* Tablettes et petits écrans ≤ 1024px */
@media (max-width: 1024px){
  .input_co{
    width: 60%;
  }
}

/* Mobiles et petites tablettes ≤ 750px */
@media (max-width: 750px){
  .input_co{
    width: 80%;
  }
  /* Ajout d’espace en haut du bloc de connexion */
  #co_div{
    margin-top: 5%!important;
  }
}

/* Très petits écrans (mobiles étroits) ≤ 500px */
@media (max-width: 500px){
  .input_co{
    width: 100%;
  }
}