/**
 * Bloc quantité + ajout au panier — fûts (widget Produits d'Elementor).
 *
 * Le bouton d'ajout réutilise la classe `.lblf-box-etat` (box-produit.css,
 * boutons des tireuses) pour un style identique ; seuls les résets propres
 * à un <button> et les états survol/actif scopés aux fûts sont ajoutés ici.
 *
 * Ne cible que .lblf-box-fut (posée sur le <li> par
 * LBLF_Box_Fut::marquer_type_produit) : les tireuses et produits
 * classiques gardent leur rendu et leur bouton d'origine.
 */

.lblf-fut-controle {
	display: flex;
	flex-direction: column;
	gap: 0.5em;
	margin-top: 0.6em;
}

/* Le trigger jQuery 'added_to_cart' (nécessaire pour rafraîchir le panier
   latéral du thème, voir box-fut.js) fait insérer par le cœur de
   WooCommerce un lien natif « Voir le panier » juste après le bouton :
   on le masque, comme pour les tireuses (box-produit.css). */
.woocommerce ul.products li.product.lblf-box-fut a.added_to_cart,
.woocommerce ul.products li.product.lblf-box-fut a.add_to_cart_button {
	display: none !important;
}

/* Compteur et bouton sur la même ligne : le compteur garde sa largeur de
   contenu, le bouton occupe le reste. */
.lblf-fut-ligne {
	display: flex;
	align-items: stretch;
	gap: 0.5em;
}

.lblf-fut-quantite {
	display: inline-flex;
	align-items: stretch;
	flex: 0 0 auto;
	border: 1px solid var(--lblf-line);
	border-radius: var(--lblf-rayon-s);
	overflow: hidden;
}

/* Préfixés par "button" (comme .lblf-fut-ajouter plus bas) : ce sont de
   vrais <button>, en concurrence à spécificité égale avec le reset
   générique du thème ([type="button"], [type="submit"], button). Sans
   ce préfixe, le thème peut l'emporter selon l'ordre de chargement. */
button.lblf-fut-moins,
button.lblf-fut-plus {
	appearance: none;
	-webkit-appearance: none;
	margin: 0;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 0;
	background: var(--lblf-surface);
	color: var(--lblf-ink);
	font-family: var(--lblf-police);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1;
	white-space: nowrap;
	width: 2.1em;
	cursor: pointer;
	transition: background var(--lblf-transition);
}
/* hover/focus/active regroupés dans une seule règle (même fond) : les
   traiter séparément faisait qu'un état écrasait l'autre à spécificité
   égale selon l'ordre du fichier (ex. :focus qui repassait par-dessus
   :hover dès le clic, avant même que la souris ne bouge). Nécessaire
   aussi pour :focus, sans quoi le thème reprenait la main sur la
   couleur via sa propre règle :focus (même souci qu'avec :hover, voir
   plus haut dans ce fichier). */
button.lblf-fut-moins:hover,
button.lblf-fut-plus:hover,
button.lblf-fut-moins:focus,
button.lblf-fut-plus:focus,
button.lblf-fut-moins:active,
button.lblf-fut-plus:active {
	background: var(--lblf-accent-doux);
	color: var(--lblf-ink);
	outline: none;
}
button.lblf-fut-moins:focus-visible,
button.lblf-fut-plus:focus-visible {
	outline: 2px solid var(--lblf-accent-fort);
	outline-offset: 2px;
}
button.lblf-fut-moins[disabled],
button.lblf-fut-plus[disabled] {
	color: var(--lblf-muted);
	cursor: not-allowed;
}
button.lblf-fut-moins[disabled]:hover,
button.lblf-fut-plus[disabled]:hover {
	background: var(--lblf-surface);
}

.lblf-fut-nombre {
	width: 2.6em;
	border: none;
	border-left: 1px solid var(--lblf-line);
	border-right: 1px solid var(--lblf-line);
	text-align: center;
	font-family: var(--lblf-police);
	-moz-appearance: textfield;
}
.lblf-fut-nombre::-webkit-outer-spin-button,
.lblf-fut-nombre::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Résets propres au <button> : contrairement à la tireuse (un simple
   <span>), le bouton des fûts est un vrai <button type="button">, qui
   entre en concurrence avec le reset générique du thème
   ([type="button"], [type="submit"], button { ... }). Ce sélecteur a la
   même spécificité qu'une classe : en cas d'égalité c'est l'ordre de
   chargement qui tranche, donc le thème peut l'emporter si on ne
   redéclare pas explicitement les couleurs/rayons/etc. ici (plus
   spécifique que .lblf-box-etat seule, donc l'emporte à coup sûr). */
button.lblf-fut-ajouter.lblf-box-etat {
	appearance: none;
	-webkit-appearance: none;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 auto;
	width: auto;
	margin-top: 0;
	padding: 0.7em 1.4em;
	font-family: var(--lblf-police);
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--lblf-sur-accent);
	background-color: var(--lblf-accent);
	border: none;
	border-radius: var(--lblf-rayon);
	cursor: pointer;
	transition: background var(--lblf-transition), opacity var(--lblf-transition);
}

/* Rupture de stock : pas de compteur à côté, le bouton reprend toute la
   largeur (comme les tireuses). */
.lblf-fut-controle--rupture .lblf-fut-ajouter.lblf-box-etat {
	display: block;
	width: 100%;
}

/* Survol / actif : mêmes règles que .lblf-box-tireuse (box-produit.css),
   étendues aux fûts. */
.woocommerce ul.products li.product.lblf-box-fut:hover .lblf-box-etat {
	background: var(--lblf-accent-fort);
}
.lblf-box-fut.lblf-box--actif .lblf-box-etat {
	color: var(--lblf-accent-fort);
	background: var(--lblf-accent-doux);
}
.woocommerce ul.products li.product.lblf-box-fut.lblf-box--actif:hover .lblf-box-etat {
	background: var(--lblf-accent-doux);
}

.lblf-fut--chargement .lblf-fut-ajouter,
.lblf-fut--chargement .lblf-fut-moins,
.lblf-fut--chargement .lblf-fut-plus,
.lblf-fut--chargement .lblf-fut-nombre {
	pointer-events: none;
	opacity: 0.7;
}

/* Rupture de stock : mêmes règles que le survol/actif ci-dessus, pour
   l'emporter avec une spécificité au moins égale. */
.woocommerce ul.products li.product.lblf-box-fut .lblf-fut-ajouter[disabled],
.woocommerce ul.products li.product.lblf-box-fut:hover .lblf-fut-ajouter[disabled] {
	cursor: not-allowed;
	background: var(--lblf-line);
	color: var(--lblf-muted);
}

@media ( prefers-reduced-motion: reduce ) {
	.lblf-fut-moins,
	.lblf-fut-plus,
	.lblf-box-etat {
		transition: none;
	}
}
