.zone-bt-effacer-liste {
    width: 70px;
}

.bt-effacer-liste {
    /*margin-left: 15px;*/
    margin-left: 15px;
    /*margin-right: 15px;*/
    height: 32px;
    width: 70px;
    border: 0;
    line-height: 2;
    padding: 0 10px;
    font-size: 1rem;
    font-style: italic;
    text-align: center;
    font-size: 12px;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-radius: 8px;
    background-color: rgb(220 0 0 / 100%);
    background-image: linear-gradient(
      to top left,
      rgb(0 0 0 / 20%),
      rgb(0 0 0 / 20%) 30%,
      rgb(0 0 0 / 0%)
    );
    box-shadow:
      inset 2px 2px 3px rgb(255 255 255 / 60%),
      inset -2px -2px 3px rgb(0 0 0 / 60%);
  }
  
  .styled:hover {
    background-color: rgb(255 0 0 / 100%);
  }
  
  .styled:active {
    box-shadow:
      inset -2px -2px 3px rgb(255 255 255 / 60%),
      inset 2px 2px 3px rgb(0 0 0 / 60%);
  }
  

.infos-choix-categorie {
    background-color: rgb(18, 169, 211);
    width: 70%;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 50px; 
    border-radius: 15px;
}

.infos-choix-categorie p{
    margin-left: 20px;
    margin-right: 20px;
    font-size: 15px;
    text-align : center;
    text-decoration: solid;
}   

/* CSS Partie Icones catégories produits */
.icones-choix-categorie {
    padding-top: 20px;
}

.zone-liste-icones-categories {
    vertical-align: middle;
    width: 100px;
    margin-left: 30px;
    margin-right: 30px;
    display: inline-block;
    text-align: center;
    font-size: 12px;
    font-style: italic;
    margin-bottom: 20px;
    cursor: pointer;

}

.liste-icones-categories img{
    margin-bottom: 5px; /* 5px entre l'image et le texte du dessous */
    max-width: 100px;
    cursor: pointer;
}
/* Fin CSS ICONES Catégories Produits */

.liste-produits {
    width: 100%;
    margin-top: 0px;
    border-width : 0;
    border-top: 1px solid black;
    border-spacing: 0;
}


.ligne-affichage-produits td{
    margin-left: 10px;
    border-top: 1px solid grey; /* ligne de séparation entre les produits */
    border-spacing: 0;
}

.ligne-affichage-produits a{
    text-decoration: none;
}


/* Affichage mini image produit */
.miniimage-produits {
    width: 100px; /* Largeur de la colonne mini-images */
    text-align: center;
}

/* Fixe la taille de la mini image produit à 80px */
.miniimage-produits img {
    max-width: 78px;
    max-height: 78px;
}

.miniimage-produits a{ /* Pour contrer Bootstrap */
    text-decoration: none;
    color: black;
}

.miniimage-produits a:hover{ /* Pour contrer Bootstrap */
    text-decoration: none;
    color: black;
}
/* Fin CCS affichage mini image produit */

.descriptif-produits {
    width:auto; /* La colonne descriptifs produits prend toute la place restante */
    text-decoration: none;
}

.img_marque {
    margin-left: 10px; 
    margin-bottom: 7px;
    opacity: 90%; /* Eclaircissement du logo pour trancher avec le descriptif court */

}

.affichage-ref-produit {
    font-size: 10px;
    text-align: center;
    font-style: italic;
}


.descriptif-court-produits {
    font-size: 14px;
    font-weight: bold;
    margin-left: 10px;
    margin-right: 10px;
    text-decoration: none;
    color: black;
}

.descriptif-court-produits a{
    text-decoration: none;
    color: black;
}

.descriptif-court-produits a:hover{ /* Pour contrer bootstrap */
    text-decoration: none;
    color: black;
}

.descriptif-long-produits {
    margin-left: 10px;
    margin-right: 10px;
    font-style: italic;
    font-size: 14px;
}

.descriptif-long-produits a {
    text-decoration: none;
    color: rgb(85, 82, 82);
}
.descriptif-long-produits a:hover {  /* Pour contrer bootstrap */
    text-decoration: none;
    color: rgb(85, 82, 82);
}

.dispo-produits {
    width: 30px; /* Fixe la colonne dispo à 30 px */
    text-align: center;
    margin-left: 10px;
    margin-right: 10px;
}


.quantite-dispo-produits {
    text-align: center;
    font-size: 10px;
    font-style: italic;
    color: green;
}

.prix-produits { 
    width: 120px; /* Fixe la taille de la colonne prix */
    text-align: center;
}
.prix-ttc-produits {
    font-size: 16px;
    font-weight: bold; 
    text-align: center;
    margin-top: 10px;
    cursor:default;
}
.prix-ht-produits{
    font-size: 10px;
    font-style: italic;
    text-align: center;
    cursor:default;
}

.message_bas_dispo {
    border-top: solid 1px black;
    font-size: 12px;
    font-style: italic; 
    padding-left: 15px; 
    padding-right: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
}

/*.message_bas_dispo img{
    margin-left: 20px;
    margin-right: 20px;
}*/


.ajouter-un-panier {
    margin-top: 10px;
    margin-bottom: 10px;
    cursor: pointer;
}
/****************************************************************************/
/* Barre de recherche                                                       */
/****************************************************************************/
.barre-recherche-produits {
    text-align: right;
    vertical-align: middle;
}


.barre-recherche-produits input{
    max-width: 300px;
    height: 32px;
    vertical-align: middle;
    margin-top: 5px;
    margin-bottom: 5px;
    border: 1px solid #999;
    font-size: 14px;
    font-weight: bold;
    font-style: italic;
    color: black;
    background-color: white;
    border-radius: 8px 0px 0px 8px;
    padding-left: 10px;
    padding-right: 10px;
}  

@media screen and (max-width: 500px) {
    .barre-recherche-produits input{      
        max-width: 150px;             /* Largeur minimale des liens */                      
    }
}

.bouton-envoyer-recherche{
    vertical-align: middle;
    margin-right: 10px;
    border: 0px;
    width: 40px;
    background: none;
    border-radius: 0px 18px 15px 0px;
    margin-left: -5px;
}

.button {
    margin-top: 0px;
    border-radius: 0px 8px 8px 0px;
    margin-left: -5px;
    margin-right: 5px;
}

/*************************************************/
/* Indicateur de validité du champs de recherche */
/*************************************************/

/*
input {
    margin-right: 10px;
  }
  
  input:invalid ~ span:after {
    vertical-align: middle;
    margin-right: 10px;
    content: "✖";
    font-size: 18px;
    color:red;
  }
  
  input:valid ~ span:after {
    vertical-align: middle;
    margin-right: 10px;
    content: "✓";
    font-size: 18px;
    color: rgb(3, 251, 3);
  }
*/
/****************************************************/  

/* Bouton Conseils choix des composants */
.bt-conseils {
    margin-bottom: 20px;
    margin-left: 30px;
    height: 30px;
    text-align: center;             
    background-color: #1d1c1c;    
    color: #fff;                 
    text-decoration: none;        
    border: 1px solid #0a0a0a;
    border-radius: 4px;
    box-shadow: 2px 2px #cccccc;
}

.bt-conseils a {
    margin-left: 10px;
    margin-right: 10px;
    font-size: 12px;
}

.bt-conseils :hover {
    /*background-color: #000000;*/
    color: #ff0000;
    border-color: #ff0000;
}