/* ==========================================================================
   Smeg Responsive v1.0.1 — correctifs responsive, approche MOBILE FIRST
   Thème Impeka 2.1.3 (classes grve-*), WPBakery, WooCommerce, Polylang.
   IMPORTANT : tout ce qui modifie la mise en page est limité aux écrans
   < 768 px (mobile) ou < 1024 px (tablette). L'affichage ORDINATEUR reste
   celui du thème (aucune règle de mise en page ne s'y applique).
   ========================================================================== */

/* ---- 0. Base (inoffensif, toutes tailles) ------------------------------- */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; overflow-x: clip; }
body { overflow-x: clip; }
*, *::before, *::after { box-sizing: border-box; }
img, svg, video, canvas, iframe, embed, object { max-width: 100%; }
iframe { border: 0; }
p, li, h1, h2, h3, h4, h5, h6, td, th, a, label { overflow-wrap: break-word; }

@media (max-width: 767.98px) {
	img, video { height: auto; }
	table { max-width: 100%; }
	/* Tableaux larges : défilement horizontal interne plutôt que débordement de page */
	.entry-content table, .woocommerce-Tabs-panel table, .grve-wpb-ext table,
	table.smeg-specs, .shop_table, .woocommerce-tabs table {
		display: block; overflow-x: auto; -webkit-overflow-scrolling: touch;
	}

	/* Taille de lecture minimale (audit : textes < 13 px) */
	body { font-size: max(1rem, 16px); line-height: 1.55; }
	small, .small, .grve-subtitle-text, .grve-subtitle, .woocommerce-breadcrumb,
	.product_meta, .product_meta span, .product_meta a, .posted_in, .tagged_as,
	.sku_wrapper, .smeg-delivery__note, .cca-badge, .woocommerce-result-count,
	.grve-post-meta, .grve-post-meta li, .wc-tabs li a, legend, figcaption,
	.woocommerce-product-details__short-description small,
	.grve-footer-bottom, #grve-footer small, .grve-top-bar, .grve-top-bar a {
		font-size: max(0.875rem, 14px) !important; /* 14 px minimum */
		line-height: 1.5;
	}

	/* Champs de formulaire : 16 px = pas de zoom automatique sur iOS */
	input[type="text"], input[type="email"], input[type="tel"], input[type="url"],
	input[type="number"], input[type="search"], input[type="password"], textarea, select {
		font-size: 16px; max-width: 100%; min-height: 44px;
	}
	textarea { min-height: 120px; }
	input[type="checkbox"], input[type="radio"] { min-width: 20px; min-height: 20px; }
}

/* ---- 1. Zones tactiles ≥ 44 px (mobile + tablette uniquement) ----------- */
@media (max-width: 1023.98px) {
	.grve-top-bar a, #grve-top-bar a, .grve-header-top a,
	#grve-footer .grve-footer-menu a, #grve-footer .menu a, #grve-footer .widget a,
	#grve-footer ul li a, .grve-footer-bottom a,
	.grve-social a, .grve-social-icons a, [class*="social"] > a, a[class*="fa-facebook"],
	a[class*="fa-instagram"], a[class*="fa-whatsapp"], a[class*="fa-tiktok"],
	a[class*="fa-youtube"], a[class*="fa-linkedin"], a[class*="fa-twitter"],
	.wc-tabs li a, .woocommerce-breadcrumb a,
	.yith-wcwl-add-to-wishlist-button, .woocommerce-product-gallery__trigger,
	a.button, button.button, .button, .added_to_cart, .single_add_to_cart_button,
	.grve-btn, .grve-button, input[type="submit"], button[type="submit"],
	.woocommerce-pagination a, .woocommerce-pagination span, .page-numbers,
	.grve-pagination a, .quantity .qty, .quantity input {
		display: inline-flex; align-items: center; justify-content: center;
		min-height: 44px; min-width: 44px; padding-top: 0.5em; padding-bottom: 0.5em;
	}
	/* Icônes réseaux : zone cliquable élargie sans changer l'icône */
	a[class*="fa-facebook"], a[class*="fa-instagram"], a[class*="fa-whatsapp"],
	a[class*="fa-tiktok"], a[class*="fa-youtube"], a[class*="fa-linkedin"], a[class*="fa-twitter"] {
		padding-left: 0.6em; padding-right: 0.6em;
	}
	/* Barre supérieure : liens Smeg Store / Revendeurs / Devenir revendeur */
	#grve-top-bar a, .grve-top-bar a { min-height: 44px; padding-left: 0.35em; padding-right: 0.35em; }
	/* Icônes d'en-tête mobile : panier, recherche, burger (24 px → 44 px) */
	#grve-main-responsive-header a, #grve-main-responsive-header .grve-safe-button,
	#grve-main-responsive-header .grve-toggle-responsive-menu {
		position: relative;
	}
	#grve-main-responsive-header a::after {
		content: ""; position: absolute; top: 50%; left: 50%;
		width: 44px; height: 44px; transform: translate(-50%, -50%);
	}
	#grve-main-responsive-header a[href^="http"]:not(.grve-logo-link) img { pointer-events: none; }
	/* Liens « lire la suite / découvrir » des tuiles */
	.grve-link-text, a.grve-media-read, .grve-media-read, .grve-element a.grve-link-text {
		display: inline-flex; align-items: center; min-height: 44px;
	}
	/* Points du slider (24 × 4 px) : zone tactile agrandie, trait inchangé */
	.grve-slider button.grve-dot, button.grve-dot { position: relative; }
	button.grve-dot::after {
		content: ""; position: absolute; left: 0; right: 0; top: -20px; bottom: -20px;
	}
	/* Éléments du menu mobile (255 × 24 px) */
	#grve-responsive-main-menu a, #grve-responsive-main-menu .grve-menu-item a {
		display: block; min-height: 44px; padding-top: 10px; padding-bottom: 10px; line-height: 1.3;
	}
}

/* ---- 2. Menu mobile (audit n°8) ---------------------------------------- */
/* Impeka ouvre le panneau avec GSAP : si la modale « Newsletter » est active,
   le thème bloque l'ouverture et le panneau reste en display:none.
   Repli CSS : l'état du bouton (classe .grve-close) pilote l'affichage. */
body:has(a.grve-toggle-responsive-menu.grve-close) #grve-responsive-menu-area {
	display: block !important; z-index: 100001; visibility: visible;
}
body:has(a.grve-toggle-responsive-menu.grve-close) #grve-responsive-menu-area .grve-area-content {
	visibility: visible !important;
}
body:has(a.grve-toggle-responsive-menu.grve-close) #grve-responsive-menu-area .grve-area-scroller {
	-webkit-overflow-scrolling: touch; overscroll-behavior: contain;
}
/* Le panneau ouvert passe au-dessus de la modale, la page dessous ne défile plus */
body:has(a.grve-toggle-responsive-menu.grve-close) { overflow: hidden; }
body:has(a.grve-toggle-responsive-menu.grve-close) .grve-modal-overlay,
body:has(a.grve-toggle-responsive-menu.grve-close) .grve-modal-element { pointer-events: none; }
/* Marges sûres (encoche, barre d'accueil iOS) */
#grve-responsive-menu-area .grve-area-container {
	padding-top: max(12vh, env(safe-area-inset-top));
	padding-bottom: max(12vh, env(safe-area-inset-bottom));
}
/* Menu dupliqué (audit n°29) : le DOM double est conservé (géré par le thème) ; aucun impact visuel. */

/* ---- 3. Slider : titres coupés en plein mot ---------------------------- */
.grve-split-text { word-break: normal; overflow-wrap: normal; hyphens: manual; }
.grve-split-text .grve-char { display: inline-block; }
.smr-word { display: inline-block; white-space: nowrap; }  /* ajouté par smeg-responsive.js */
@media (max-width: 767.98px) {
	.grve-slider .grve-title, .grve-slider h1, .grve-slider h2, .grve-slider h3,
	.grve-hero .grve-title, .grve-title.grve-h1 {
		font-size: clamp(1.75rem, 8.5vw, 2.6rem); line-height: 1.15;
	}
	.grve-slider .grve-subtitle-text, .grve-slider p { font-size: max(0.9375rem, 15px) !important; }
}
/* Slider Revolution : textes lisibles et sans débordement */
rs-module-wrap, sr7-module, .rev_slider_wrapper { max-width: 100vw; }

/* ---- 4. Grilles produits / catégories (mobile + tablette seulement) ----- */
@media (max-width: 1023.98px) {
	.woocommerce ul.products, ul.products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; margin-left: 0; margin-right: 0; }
	.woocommerce ul.products li.product, ul.products li.product { width: auto !important; margin: 0 !important; float: none !important; }
	.woocommerce ul.products li.product .button, ul.products li.product .button { width: 100%; text-align: center; white-space: normal; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: max(0.9375rem, 15px); }
	ul.products li.product img { width: 100%; }
	.grve-woo-product-title, .woocommerce-loop-product__title { overflow-wrap: anywhere; hyphens: auto; }
}
@media (min-width: 768px) and (max-width: 1023.98px) {
	ul.products, .woocommerce ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 20px; }
}

/* ---- 5. Fiche produit (mobile uniquement : le thème gère tablette/ordinateur) */
@media (max-width: 767.98px) {
	.woocommerce div.product div.images, .woocommerce div.product div.summary,
	.woocommerce #content div.product div.images, .woocommerce #content div.product div.summary {
		width: 100% !important; float: none !important;
	}
	.woocommerce-product-gallery { max-width: 100%; overflow: hidden; }
	.woocommerce-product-gallery__wrapper { max-width: 100%; }
	.woocommerce-product-gallery img.zoomImg { display: none !important; } /* zoom au survol inutile au doigt */
	.woocommerce div.product form.cart { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch; }
	.woocommerce div.product form.cart .single_add_to_cart_button { flex: 1 1 200px; }
	.woocommerce div.product form.cart .variations, .woocommerce div.product form.cart .variations td,
	.woocommerce div.product form.cart .variations th { display: block; width: 100%; }
	.woocommerce div.product .woocommerce-tabs ul.tabs,
	.wc-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; gap: 4px; margin: 0 0 16px; padding: 0; }
	.wc-tabs::-webkit-scrollbar { display: none; }
	.wc-tabs li { flex: 0 0 auto; margin: 0 !important; }
	/* Onglets Smart Tabs (images externes) : défilement interne, jamais de débordement page */
	.sptpro-tabs-wrapper, .sp-tab__nav, [class*="sptpro_tab"], .sptpro-tab-content, .sptpro_tab_panel { max-width: 100%; }
	.sp-tab__nav, ul[class*="sptpro"] { display: flex; overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
	.sp-tab__nav > li, ul[class*="sptpro"] > li { flex: 0 0 auto; }

	/* Barre d'achat collante */
	.woocommerce div.product form.cart:not(.variations_form), .woocommerce div.product .woocommerce-variation-add-to-cart {
		position: sticky; bottom: 0; z-index: 20; background: #fff; padding: 8px 0 max(8px, env(safe-area-inset-bottom));
	}
	.woocommerce-product-gallery .flex-control-thumbs { display: flex; overflow-x: auto; gap: 8px; -webkit-overflow-scrolling: touch; }
	.woocommerce-product-gallery .flex-control-thumbs li { flex: 0 0 22%; width: auto !important; }
}

/* Panier / paiement (mobile) */
@media (max-width: 767.98px) {
	.woocommerce table.shop_table_responsive tr td { text-align: right; }
	.woocommerce-cart table.cart td.actions .coupon { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; }
	.woocommerce-cart table.cart td.actions .coupon input { flex: 1 1 140px; width: auto; }
	.woocommerce form .form-row-first, .woocommerce form .form-row-last,
	.woocommerce-page form .form-row-first, .woocommerce-page form .form-row-last { width: 100% !important; float: none; }
}

/* ---- 6. Colonnes WPBakery : empilées sur mobile ------------------------ */
@media (max-width: 767.98px) {
	.wpb_column, .vc_column_container { max-width: 100%; }
	.vc_row.vc_row-flex > .wpb_column, .grve-wpb-ext .vc_col-xs-12 { min-width: 0; }
	.wpb_text_column img, .wpb_single_image img { height: auto; }
	.grve-wpb-ext .grve-column-content, .vc_column-inner { padding-left: 0; padding-right: 0; }
	.vc_row[data-vc-full-width] { max-width: 100vw; }
}

/* ---- 7. Contact Form 7 / formulaires (mobile) --------------------------- */
@media (max-width: 767.98px) {
	.wpcf7 form .wpcf7-form-control-wrap, .wpcf7 input, .wpcf7 textarea, .wpcf7 select { width: 100%; max-width: 100%; }
	.wpcf7 .uacf7-col, .uacf7-row .uacf7-col, [class*="uacf7-col-"] { width: 100% !important; flex: 0 0 100% !important; max-width: 100% !important; }
	.wpcf7-submit { width: 100%; }
	.wpcf7-response-output { margin-left: 0 !important; margin-right: 0 !important; }
}

/* ---- 8. Plugin Revendeurs ------------------------------------------------ */
@media (max-width: 1023.98px) {
	.smeg-rv { font-size: 16px; }
	.smeg-rv-loc__city, .smeg-rv-loc__detail, .smeg-rv legend, .smeg-rv small, .smeg-rv label,
	.smeg-rv-loc__meta, .smeg-rv-loc__activity { font-size: 14px !important; }
	.smeg-rv-loc__detail, .smeg-rv a, .smeg-rv button, .smeg-rv .button { min-height: 44px; display: inline-flex; align-items: center; }
	.smeg-rv input[type="checkbox"], .smeg-rv input[type="radio"] { width: 22px; height: 22px; }
	.smeg-rv .leaflet-control-zoom a { width: 44px !important; height: 44px !important; line-height: 44px !important; font-size: 22px !important; }
	.smeg-rv-locator .leaflet-container, .smeg-rv .leaflet-container { min-height: 320px; max-width: 100%; }
	.smeg-rv-loc__list { max-height: 60vh; overflow-y: auto; -webkit-overflow-scrolling: touch; }
}

/* ---- 9. Mega Menu (plugin) : accordéon mobile -------------------------- */
#grve-responsive-main-menu .smm-panel, #grve-responsive-main-menu [class*="smm-"] { max-width: 100%; }

/* ---- 10. Arabe / RTL --------------------------------------------------- */
html[dir="rtl"] body, body.rtl { text-align: right; }
html[dir="rtl"] .wc-tabs, html[dir="rtl"] .flex-control-thumbs { direction: rtl; }
html[dir="rtl"] .woocommerce ul.products { direction: rtl; }
html[dir="rtl"] input, html[dir="rtl"] textarea { text-align: right; }
html[dir="rtl"] input[type="email"], html[dir="rtl"] input[type="tel"], html[dir="rtl"] input[type="url"] { direction: ltr; text-align: right; }

/* ---- 11. Modale Newsletter : n'envahit pas l'écran mobile -------------- */
.grve-modal-element.grve-modal-dialog { max-width: 100vw; max-height: 100dvh; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.grve-modal-dialog .grve-close-btn { min-width: 44px; min-height: 44px; }

/* ---- 12. Accessibilité ------------------------------------------------- */
:focus-visible { outline: 2px solid #c8102e; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
