/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

/* =========================================================================
   TROTTI&TECH - Corrections mobile de la fiche produit
   Ajoute le 13/09/2026. Sauvegarde de l'original : style.css.bak-20260913
   Portee volontairement limitee a la page produit (.single-product).
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Fleches des carrousels de produits hors de l'ecran
   Les fleches "wd-pos-sep" sont positionnees a l'exterieur du conteneur.
   Sur un element pleine largeur, la fleche suivante tombait a 40px au-dela
   du bord droit : invisible, intouchable, et source de debordement
   horizontal a toutes les largeurs (mobile, tablette et desktop).
   ------------------------------------------------------------------------- */
.single-product .wd-products-element .wd-nav-arrows.wd-pos-sep .wd-btn-arrow.wd-prev {
	left: 0;
	right: auto;
}

.single-product .wd-products-element .wd-nav-arrows.wd-pos-sep .wd-btn-arrow.wd-next {
	right: 0;
	left: auto;
}

/* -------------------------------------------------------------------------
   2. Bloc des avis plus large que l'ecran
   .woocommerce-Reviews porte une marge negative de -20px de chaque cote,
   ce qui le rendait plus large que la fenetre sur mobile (contenu rogne).
   ------------------------------------------------------------------------- */
@media (max-width: 1024px) {
	.single-product .woocommerce-Reviews {
		margin-left: 0;
		margin-right: 0;
	}
}

/* -------------------------------------------------------------------------
   3. Navigation produit precedent/suivant qui deborde
   Le widget etait contraint a 39px alors que son contenu fait 72px :
   les fleches sortaient de 18px hors de l'ecran.
   ------------------------------------------------------------------------- */
@media (max-width: 1024px) {
	.single-product .elementor-widget-wd_single_product_nav {
		flex: 0 0 auto;
		width: auto;
	}

	.single-product .wd-products-nav {
		margin-left: auto;
	}
}

/* -------------------------------------------------------------------------
   4. Titres des cartes produits coupes en plein mot
   Les titres etaient limites a une seule ligne avec text-overflow: clip,
   ce qui affichait "Gants de" au lieu de "Gants de Protection".
   On autorise deux lignes avec points de suspension.
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.single-product .wd-products-element .wd-entities-title,
	.single-product .wd-products-element .wd-loop-prod-title,
	.single-product .wd-products-element .wd-entities-title.wd-line-clamp,
	.single-product .wd-products-element .wd-loop-prod-title.wd-line-clamp {
		/* le theme impose max-height = 1 ligne via .wd-line-clamp */
		display: -webkit-box !important;
		-webkit-line-clamp: 2 !important;
		-webkit-box-orient: vertical;
		max-height: none !important;
		white-space: normal;
		overflow: hidden;
		text-overflow: ellipsis;
	}
}

/* -------------------------------------------------------------------------
   5. Zones tactiles trop petites (cible recommandee : 44x44px)
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {

	/* Bouton "Ajouter au panier" principal */
	.single-product .single_add_to_cart_button,
	.single-product .wd-buy-now-btn {
		min-height: 48px;
	}

	/* Selecteur de quantite : 42px de haut, boutons de 25px de large */
	.single-product form.cart .quantity input.qty {
		min-height: 48px;
	}

	.single-product form.cart .quantity .minus,
	.single-product form.cart .quantity .plus {
		min-width: 30px;
		min-height: 48px;
	}

	/* Icone "ajouter au panier" des cartes produits : 18x18px a l'origine */
	.single-product .wd-products-element .wd-add-btn > a,
	.single-product .wd-products-element .add_to_cart_button,
	.single-product .wd-products-element .wd-loop-prod-btn > a {
		min-width: 44px;
		min-height: 44px;
		display: -webkit-box;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	/* Cases a cocher de la boite "Frequemment achetes ensemble" : 13x13px.
	   On garde une case de taille normale mais on elargit la zone
	   cliquable autour d'elle via le conteneur .woobt-choose. */
	.single-product .woobt-wrap input[type="checkbox"].woobt-checkbox {
		width: 20px;
		height: 20px;
	}

	.single-product .woobt-wrap .woobt-choose {
		min-width: 44px;
		min-height: 44px;
		display: -webkit-box;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}