/*Contenedor de las piezas*/
.list-piezas{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 30px;
    justify-content: center;
}


/*CONTROLADOR DE NUMEROS*/
.resaltar{
    background: #8ecae6; /*Resalta el campo del numero para indicar que el valor fue alterado*/
}
.number-control { /* Los botones para añadir cantidad y restarla*/
    display: flex;
    align-items: center;
  }
  
  .number-left::before,
  .number-right::after {
    content: attr(data-content);
    background-color: #333333;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid black;
    width: 20px;
    color: white;
    transition: background-color 0.3s;
    cursor: pointer;
  }
  
  .number-left::before {
    content: "-";
  }
  
  .number-right::after {
    content: "+";
  }
  
  .number-quantity {
    padding: 0.25rem;
    border: 0;
    width: 50px;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
  }
  
  .number-left:hover::before,
  .number-right:hover::after {
    background-color: #666666;
  }