/**
 * Ticket cosmétique — sélecteur de quantité (fiche produit)
 * Scope strict : #product. Desktop : alignement sur le CTA panier ;
 * mobile : dé-resserrage du sélecteur +/-, où il était comprimé.
 *
 * Cause racine du "serré" : sur la ligne flex, le conteneur quantité était
 * réduit à ~83px de large (il partage la ligne avec "Nos frais de port"),
 * ce qui collait les boutons +/- au chiffre. Sur mobile, on élargit donc le conteneur
 * (min-width) plutôt que d'agrandir les boutons (qui finissaient par se
 * chevaucher dans une boîte trop étroite).
 */

@media (min-width: 1000px) {
  #product .quantity-input-wrapper {
    height: 60px;
  }
}

@media (max-width: 999px) {
  /* Largeur minimale du sélecteur : laisse de l'air autour du chiffre */
  #product #quantity_wanted_container {
    min-width: 160px;
  }

  /* Zones de tap +/- légèrement élargies (~42px) sans déborder la boîte */
  #product .product_quantity_down {
    padding-left: 14px;
    padding-right: 8px;
  }

  #product .product_quantity_up {
    padding-right: 14px;
    padding-left: 8px;
  }
}