/* ===================================================================== */
/*                           BoutonCollGest.css                          */
/* � 2024  Dunin Technologie Inc.                                       */
/* ===================================================================== */

/* - DÉFINITION -------------------------------------------------------- */
/* Dispositions / espacements.                                           */
/* --------------------------------------------------------------------- */

/* - NOTES ------------------------------------------------------------- */
/* --------------------------------------------------------------------- */

/* --------------------------------------------------------------------- */
/* liste des références.                                                 */
.AjoutAlias > button { background: url("../../Client/Imgs/AjoutAlias.svg") no-repeat center; width: 36px; height: 26px;}
.AjoutProp  > button { background: url("../../Client/Imgs/AjoutProp.svg") no-repeat center; width: 36px; height: 26px;}
.AjoutAlias, .AjoutProp {align-items: center;}
.BoutonHoriz.AjoutAlias  button:hover { background-image: url(../../Client/Imgs/AjoutAlias-white.svg); }
.BoutonHoriz.AjoutProp   button:hover { background-image: url(../../Client/Imgs/AjoutProp-white.svg); }
.BoutonHoriz.BoutonAjout button:hover { background-image: url(../../Client/Imgs/Ajout-white.svg); }
.BoutonHoriz > button { width: -webkit-fill-available;}

/* --------------------------------------------------------------------- */
/* Bouton delet de val.                                                  */

.DelX button
{
  background-color: #f44336;
  border: none;
  color: white;
  border-radius: 0 5px 5px 0;
  cursor: pointer;
  padding: 5px 10px;
  transition: transform 0.2s;
}
.DelX button:hover {transform: scale(1.1);}
.DelX span {font-size: 1.2em;}

/* --------------------------------------------------------------------- */
/* Bouton pour la liste des catégories en mode d'utilisation.            */
div.UtilCategs
{
  display: inline-block;
  margin: 8px 12px;
  padding: 8px 20px;
  background-color: var(--couleurUtilCategs);
  border-radius: 25px;
  border: 2px solid transparent;
  transition: all 0.3s ease;
  cursor: pointer;
}

span.UtilCategs
{
  font-size: 16px;
  font-weight: 600;
  color: var(--couleurTexteUtilCategs);
  text-transform: capitalize;
  text-decoration: none;
}

div.UtilCategs:hover
{
  background-color: var(--couleurUtilCategsHover);
  border-color: var(--couleurBordureUtilCategsHover);
}

div.UtilCategs:hover span {color: var(--couleurTexteUtilCategsHover);}