/* Theme Name: Enwoo Child (Taghazit) Theme URI: https://www.taghazit.com/ Description: Thème enfant pour Enwoo. Styles UX pour cartes produits et catégories. Author: Taghazit Template: enwoo Version: 1.0.49 */ /* Palette « pro » + Lighthouse (contraste WCAG AA sur fond clair) : - Sur #fff / gris très clair : liens & textes verts = verts **saturés foncés** (forêt / émeraude 800+), jamais de lime (#6ac649) en corps de texte — le lime échoue aux ratios sur blanc. - Sur fond très sombre (#010101 footer) : accents **plus clairs** (#86efac type) pour rester lisibles. Tokens : --twm-link-on-light / hover → fil d’Ariane, liens discrets dans le contenu clair. --twm-green-brand → boutons pleins, filets, curseurs (émeraude 700). --twm-green-accent → prix, boutons secondaires, badges texte sur blanc. --twm-green-on-dark → icônes / liens sur footer noir uniquement. --twm-focus-ring → focus clavier accessible sur fond clair. */ #woocommerce_price_filter-3 > form > div > div.price_slider.ui-slider.ui-corner-all.ui-slider-horizontal.ui-widget.ui-widget-content { border: 0 !important; } #woocommerce_price_filter-3 > form > div > div.price_slider.ui-slider.ui-corner-all.ui-slider-horizontal.ui-widget.ui-widget-content > span { border-radius: 3px !important; background-color: #001207 !important; } #woocommerce_price_filter-3 > form > div > div.price_slider.ui-slider.ui-corner-all.ui-slider-horizontal.ui-widget.ui-widget-content > div { top: 0px !important; height: 6px !important; background-color: #d4ab05 !important; } /* ── Widget Elementor : classe « phone-widget-woo-products » (mobile + centrage ; styles carte = globaux .twm-product-card) ── */ @media (max-width: 767px) { .phone-widget-woo-products ul.products { display: flex !important; flex-direction: column !important; align-items: center !important; width: 100% !important; } .phone-widget-woo-products ul.products li.product { width: 100% !important; max-width: 280px !important; margin: 0 auto 30px auto !important; float: none !important; } } .phone-widget-woo-products .twm-product-meta { justify-content: center; flex-wrap: wrap; flex-direction: row; align-items: center; text-align: center; gap: 6px; min-height: 0; margin-top: 0; } .phone-widget-woo-products .twm-product-price { width: 100%; text-align: center; } .phone-widget-woo-products .twm-rating { width: 100%; text-align: center; } .phone-widget-woo-products .twm-rating .star-rating { margin-left: auto; margin-right: auto; } .phone-widget-woo-products .twm-add-to-cart { display: flex; justify-content: center; width: 100%; box-sizing: border-box; } .phone-widget-woo-products .twm-add-to-cart .button { float: none !important; margin-left: auto; margin-right: auto; } /* Accueil Elementor : une seule « carte » (.twm-product-card), pas de double cadre li + carte ; CTA = tokens :root */ .phone-widget-woo-products ul.products li.product, .phone-widget-woo-products ul.products li.product.type-product { border: none !important; box-shadow: none !important; background: transparent !important; outline: none !important; padding: 0 !important; transform: none !important; overflow: visible !important; } .phone-widget-woo-products ul.products li.product:hover, .phone-widget-woo-products ul.products li.product.type-product:hover { transform: none !important; box-shadow: none !important; border: none !important; } .phone-widget-woo-products ul.products li.product .twm-product-card .twm-add-to-cart a.button, .phone-widget-woo-products ul.products li.product .twm-product-card .twm-add-to-cart a.add_to_cart_button, .phone-widget-woo-products ul.products li.product .twm-product-card .twm-add-to-cart a.added_to_cart, .phone-widget-woo-products .twm-product-card .twm-add-to-cart a.button, .phone-widget-woo-products .twm-product-card .twm-add-to-cart a.add_to_cart_button { background-color: var(--twm-cta-bg) !important; background-image: none !important; border: none !important; color: #fff !important; font-weight: 700; border-radius: 9999px; box-shadow: var(--twm-cta-shadow); letter-spacing: 0.02em; min-height: 44px; display: inline-flex !important; align-items: center; justify-content: center; text-align: center !important; float: none !important; box-sizing: border-box; width: auto !important; max-width: 100% !important; padding: 12px 22px !important; transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease; } .phone-widget-woo-products ul.products li.product .twm-product-card .twm-add-to-cart a.button:hover, .phone-widget-woo-products ul.products li.product .twm-product-card .twm-add-to-cart a.add_to_cart_button:hover, .phone-widget-woo-products .twm-product-card .twm-add-to-cart a.button:hover { background-color: var(--twm-cta-bg-hover) !important; background-image: none !important; border: none !important; color: #fff !important; box-shadow: 0 2px 8px rgba(6, 95, 70, 0.4); transform: translateY(-1px); } .phone-widget-woo-products ul.products li.product .twm-product-card .twm-add-to-cart a.button:focus-visible, .phone-widget-woo-products .twm-product-card .twm-add-to-cart a.button:focus-visible { outline: 2px solid var(--twm-focus-ring); outline-offset: 2px; } .twm-product-meta--solo { justify-content: flex-end; } /* ── Cartes produit TWM (Elementor + archives) : couleurs, boutons verts, étoiles, pas de double rayon / trait bas ── */ .twm-product-card .twm-product-media { line-height: 0; overflow: hidden; } .twm-product-card .twm-product-media img { border-radius: 0 !important; vertical-align: bottom; } /* Boutique : réserve carrée stable (LCP + CLS) — complété par layout-hold / critical. */ body.woocommerce-shop .twm-product-card .twm-product-media, body.woocommerce-page .twm-shop-native-catalog .twm-product-card .twm-product-media, body.woocommerce-shop a.twm-product-media, body.woocommerce-page .twm-shop-native-catalog a.twm-product-media { aspect-ratio: 1 / 1; width: 100%; display: block; box-sizing: border-box; background: #f8fafc; } body.woocommerce-shop .twm-product-card .twm-product-media img, body.woocommerce-page .twm-shop-native-catalog .twm-product-card .twm-product-media img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; display: block; aspect-ratio: 1 / 1; } .twm-product-card .twm-product-body { border-bottom: none !important; } .twm-product-card .twm-add-to-cart { border-top: none !important; margin-top: 0; box-shadow: none !important; display: flex; justify-content: center; align-items: center; } body.woocommerce ul.products li.product .twm-product-card .twm-add-to-cart a.button, body.woocommerce ul.products li.product .twm-product-card .twm-add-to-cart a.added_to_cart, #blog.woocommerce ul.products .twm-product-card .twm-add-to-cart .button, .woocommerce .twm-product-card .twm-add-to-cart a.button.alt { background-color: var(--twm-cta-bg) !important; background-image: none !important; border: none !important; color: #fff !important; font-weight: 700; border-radius: 9999px; box-shadow: var(--twm-cta-shadow); letter-spacing: 0.02em; min-height: 44px; display: inline-flex !important; align-items: center; justify-content: center; text-align: center !important; float: none !important; box-sizing: border-box; width: auto !important; max-width: 100% !important; padding: 12px 22px !important; transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease; } body.woocommerce ul.products li.product .twm-product-card .twm-add-to-cart a.button:hover, .woocommerce .twm-product-card .twm-add-to-cart a.button:hover { background-color: var(--twm-cta-bg-hover) !important; background-image: none !important; border: none !important; color: #fff !important; box-shadow: 0 2px 8px rgba(1, 141, 57, 0.45); transform: translateY(-1px); } body.woocommerce ul.products li.product .twm-product-card .twm-add-to-cart a.button:focus-visible, .woocommerce .twm-product-card .twm-add-to-cart a.button:focus-visible { outline: 2px solid var(--twm-focus-ring); outline-offset: 2px; } .twm-product-card .twm-product-title a, .twm-product-card .twm-product-title a:hover, body.woocommerce ul.products li.product .twm-product-card .woocommerce-loop-product__title, body.woocommerce ul.products li.product .twm-product-card .woocommerce-loop-product__title a, .twm-product-card .twm-product-cats a, .twm-product-card .twm-product-cats .twm-product-cats__link, .twm-product-card .twm-product-cats a:hover, .twm-product-card .twm-product-cats .twm-product-cats__link:hover { color: var(--twm-link-on-light) !important; text-decoration: none; } .twm-product-card .twm-product-title a:hover, .twm-product-card .twm-product-cats a:hover, .twm-product-card .twm-product-cats .twm-product-cats__link:hover { color: var(--twm-link-on-light-hover) !important; } .woocommerce .twm-product-card .star-rating::before { color: #e5e7eb !important; opacity: 1; } .woocommerce .twm-product-card .star-rating span { color: #f59e0b !important; } .woocommerce .twm-product-card .star-rating span::before { color: #f59e0b !important; } /* Boutique / archives : le body ou le parent n’a pas toujours .woocommerce sur le même nœud — forcer couleur étoiles */ #blog ul.products .twm-product-card .star-rating::before, body#blog.woocommerce.post-type-archive-product .twm-product-card .star-rating::before, body#blog.woocommerce.tax-product_cat .twm-product-card .star-rating::before, body#blog.woocommerce.tax-product_tag .twm-product-card .star-rating::before { color: #e5e7eb !important; opacity: 1 !important; } #blog ul.products .twm-product-card .star-rating span::before, body#blog.woocommerce.post-type-archive-product .twm-product-card .star-rating span::before, body#blog.woocommerce.tax-product_cat .twm-product-card .star-rating span::before, body#blog.woocommerce.tax-product_tag .twm-product-card .star-rating span::before { color: #f59e0b !important; } #blog ul.products .twm-product-card .star-rating span, body#blog.woocommerce.post-type-archive-product .twm-product-card .star-rating span { color: #f59e0b !important; } #blog ul.products .twm-product-card .star-rating, body#blog.woocommerce.post-type-archive-product .twm-product-card .star-rating, body#blog.woocommerce.tax-product_cat .twm-product-card .star-rating, body#blog.woocommerce.tax-product_tag .twm-product-card .star-rating { color: #e5e7eb !important; } body.woocommerce ul.products li.product.type-product { border: none !important; outline: none; } /* * Archives Woo (parent / Customizer souvent plus spécifiques que body.woocommerce seul) : * même rendu que le widget Elementor (.twm-product-card + boutons verts + titres verts). */ body#blog.woocommerce.tax-product_cat ul.products li.product .twm-product-card .twm-add-to-cart a.button, body#blog.woocommerce.tax-product_cat ul.products li.product .twm-product-card .twm-add-to-cart a.add_to_cart_button, body#blog.woocommerce.tax-product_tag ul.products li.product .twm-product-card .twm-add-to-cart a.button, body#blog.woocommerce.tax-product_tag ul.products li.product .twm-product-card .twm-add-to-cart a.add_to_cart_button, body#blog.woocommerce.post-type-archive-product ul.products li.product .twm-product-card .twm-add-to-cart a.button, body#blog.woocommerce.post-type-archive-product ul.products li.product .twm-product-card .twm-add-to-cart a.add_to_cart_button { background-color: var(--twm-cta-bg) !important; background-image: none !important; border: none !important; color: #fff !important; font-weight: 700; border-radius: 9999px; box-shadow: var(--twm-cta-shadow); letter-spacing: 0.02em; min-height: 44px; display: inline-flex !important; align-items: center; justify-content: center; text-align: center !important; float: none !important; box-sizing: border-box; width: auto !important; max-width: 100% !important; padding: 12px 22px !important; transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease; } body#blog.woocommerce.tax-product_cat ul.products li.product .twm-product-card .twm-add-to-cart a.button:hover, body#blog.woocommerce.tax-product_tag ul.products li.product .twm-product-card .twm-add-to-cart a.button:hover, body#blog.woocommerce.post-type-archive-product ul.products li.product .twm-product-card .twm-add-to-cart a.button:hover { background-color: var(--twm-cta-bg-hover) !important; background-image: none !important; border: none !important; color: #fff !important; box-shadow: 0 2px 8px rgba(1, 141, 57, 0.45); transform: translateY(-1px); } body#blog.woocommerce.tax-product_cat ul.products li.product .twm-product-card .twm-product-title a, body#blog.woocommerce.tax-product_cat ul.products li.product .twm-product-card .twm-product-cats a, body#blog.woocommerce.tax-product_cat ul.products li.product .twm-product-card .twm-product-cats .twm-product-cats__link, body#blog.woocommerce.tax-product_tag ul.products li.product .twm-product-card .twm-product-title a, body#blog.woocommerce.tax-product_tag ul.products li.product .twm-product-card .twm-product-cats a, body#blog.woocommerce.tax-product_tag ul.products li.product .twm-product-card .twm-product-cats .twm-product-cats__link, body#blog.woocommerce.post-type-archive-product ul.products li.product .twm-product-card .twm-product-title a, body#blog.woocommerce.post-type-archive-product ul.products li.product .twm-product-card .twm-product-cats a, body#blog.woocommerce.post-type-archive-product ul.products li.product .twm-product-card .twm-product-cats .twm-product-cats__link { color: var(--twm-link-on-light) !important; text-decoration: none; } body#blog.woocommerce.tax-product_cat .twm-product-card .star-rating span::before, body#blog.woocommerce.tax-product_tag .twm-product-card .star-rating span::before, body#blog.woocommerce.post-type-archive-product .twm-product-card .star-rating span::before { color: #f59e0b !important; } body#blog.woocommerce.tax-product_cat .twm-product-card .star-rating::before, body#blog.woocommerce.tax-product_tag .twm-product-card .star-rating::before, body#blog.woocommerce.post-type-archive-product .twm-product-card .star-rating::before { color: #e5e7eb !important; } #second-site-navigation .twm-blog-tax-menu.envo-categories-menu { background-color: transparent !important; background-image: linear-gradient(180deg, #3d4542 0%, #303634 52%, #272c2a 100%) !important; } #second-site-navigation > div > div.twm-blog-tax-menu-wrap { background-color: transparent !important; background-image: linear-gradient(180deg, #3d4542 0%, #303634 52%, #272c2a 100%) !important; } #second-site-navigation > div > div.twm-blog-tax-menu-wrap > nav { background-color: transparent !important; background-image: linear-gradient(180deg, #3d4542 0%, #303634 52%, #272c2a 100%) !important; } #second-site-navigation > div > div.menu-heading { background-color: transparent !important; background-image: linear-gradient(180deg, #3d4542 0%, #303634 52%, #272c2a 100%) !important; } #second-site-navigation > div > div.twm-blog-tax-menu-wrap > nav > ul { background-color: transparent !important; background-image: linear-gradient(180deg, #3d4542 0%, #303634 52%, #272c2a 100%) !important; } :root { /* Lisibilité sur fond blanc (#fff) — ratio ≥ 4.5:1 pour texte normal */ --twm-ink: #0f172a; --twm-link-on-light: #14532d; --twm-link-on-light-hover: #0f2918; /* Marque (verts stables, pas néon) */ --twm-green-brand: #047857; --twm-green-accent: #166534; --twm-green-deep: #065f46; /* Accent clair réservé au footer sombre + rares hovers sur noir */ --twm-green-on-dark: #86efac; --twm-gold-hover: #fbbf24; --twm-focus-ring: #15803d; /* CTA catalogue : plat (pas de gradient parent), proche du vert barre #018d39 */ --twm-cta-bg: #065f46; --twm-cta-bg-hover: #047857; --twm-cta-border: transparent; --twm-cta-shadow: 0 1px 3px rgba(1, 141, 57, 0.35); /* Barre menu / header (différenciation bouton filtre vs CTA panier) */ --twm-bar-green: #018d39; --twm-bar-green-hover: #016b30; } /* ── Liens sur fond clair : fil d’Ariane Yoast / Woo (contraste Lighthouse, évite le « lime » Elementor) ── */ #breadcrumbs a, #breadcrumbs a:visited, p#breadcrumbs a, .woocommerce-breadcrumb a, nav.woocommerce-breadcrumb a, .wp-block-woocommerce-breadcrumbs a, .elementor-widget-woocommerce-breadcrumb a, .rank-math-breadcrumb a { color: var(--twm-link-on-light) !important; text-decoration: underline; text-decoration-color: rgba(20, 83, 45, 0.45); text-underline-offset: 0.12em; } #breadcrumbs a:hover, .woocommerce-breadcrumb a:hover, nav.woocommerce-breadcrumb a:hover, .wp-block-woocommerce-breadcrumbs a:hover, .elementor-widget-woocommerce-breadcrumb a:hover, .rank-math-breadcrumb a:hover { color: var(--twm-link-on-light-hover) !important; } .woocommerce-breadcrumb, nav.woocommerce-breadcrumb, #breadcrumbs, p#breadcrumbs, .rank-math-breadcrumb { color: var(--twm-ink); } .twm-shop-wrap { max-width: 1200px; margin: 0 auto; padding: 10px 15px; } /* Boutique : H1 unique (twm-document-h1) ; filtre sous l’intro ; grille produits pleine largeur */ body.woocommerce-shop .twm-shop-wrap > h1.page-title { display: none !important; } .twm-shop-price-filter-slot { box-sizing: border-box; width: 100%; } @media (max-width: 991px) { .twm-shop-price-filter-slot { display: block; max-width: min(100%, 340px); margin: 0 auto 1.25rem; padding: 0 12px; } .twm-shop-price-filter-slot .widget-title { text-align: center; } .twm-shop-price-filter-slot .price_slider_amount { justify-content: center; text-align: center; } .twm-shop-price-filter-slot .price_label.twm-price-label { flex-basis: 100%; justify-content: center; } .twm-shop-price-filter-slot .ui-slider-handle { width: 1.75rem; height: 1.75rem; top: 50%; margin-top: -0.875rem; touch-action: none; } .twm-shop-price-filter-slot .price_slider { touch-action: none; } } html[dir="rtl"] #blog .twm-shop-price-filter-slot .widget-title, html[dir="rtl"] #blog .twm-shop-price-filter-slot h3.widget-title { text-align: right; } @media (max-width: 991px) { html[dir="rtl"] #blog .twm-shop-price-filter-slot .widget-title, html[dir="rtl"] #blog .twm-shop-price-filter-slot h3.widget-title { text-align: right; width: 100%; } html[dir="rtl"] #blog .twm-shop-price-filter-slot .price_slider_amount { justify-content: flex-start; text-align: right; } html[dir="rtl"] #blog .twm-shop-price-filter-slot .price_label.twm-price-label { justify-content: flex-start; } } @media (min-width: 992px) { body.woocommerce-shop .twm-shop-wrap > .twm-shop-price-filter-slot { display: block; max-width: min(100%, 480px); margin: 0 0 1.5rem; padding: 0; } body.woocommerce-shop #site-content .page-area article.col-md-9, body.woocommerce-shop #site-content .page-area .col-md-9, body.woocommerce-shop .twm-shop-wrap > .row > article.col-md-9, body.woocommerce-shop .twm-shop-wrap > .row > article.col-md-12 { float: none !important; width: 100% !important; max-width: 100%; padding-left: 15px; padding-right: 15px; box-sizing: border-box; } body.woocommerce-shop ul.products.columns-twm { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); } } /* * Archives product_cat / product_tag / marque : filtre prix custom (slot) + grille columns-twm. * Le widget prix du thème en sidebar est masqué côté PHP ; le slot est injecté avant la grille. */ @media (min-width: 992px) { body.tax-product_cat .twm-shop-wrap > .twm-shop-price-filter-slot, body.tax-product_tag .twm-shop-wrap > .twm-shop-price-filter-slot, body.tax-product_brand .twm-shop-wrap > .twm-shop-price-filter-slot { display: block; max-width: min(100%, 480px); margin: 0 0 1.25rem; padding: 0; } body.tax-product_cat .twm-shop-wrap > .row > article.col-md-9 ul.products.columns-twm, body.tax-product_tag .twm-shop-wrap > .row > article.col-md-9 ul.products.columns-twm, body.tax-product_brand .twm-shop-wrap > .row > article.col-md-9 ul.products.columns-twm { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } } body.tax-product_cat .twm-shop-wrap .woocommerce-result-count, body.tax-product_tag .twm-shop-wrap .woocommerce-result-count, body.tax-product_brand .twm-shop-wrap .woocommerce-result-count { float: inline-start; margin: 0 0 1rem; line-height: 1.5; } body.tax-product_cat .twm-shop-wrap .woocommerce-ordering, body.tax-product_tag .twm-shop-wrap .woocommerce-ordering, body.tax-product_brand .twm-shop-wrap .woocommerce-ordering { float: inline-end; margin: 0 0 1rem; } body.tax-product_cat .twm-shop-wrap ul.products.columns-twm, body.tax-product_tag .twm-shop-wrap ul.products.columns-twm, body.tax-product_brand .twm-shop-wrap ul.products.columns-twm { clear: both; } @media (max-width: 991px) { body.tax-product_cat .twm-shop-wrap .woocommerce-result-count, body.tax-product_tag .twm-shop-wrap .woocommerce-result-count, body.tax-product_brand .twm-shop-wrap .woocommerce-result-count, body.tax-product_cat .twm-shop-wrap .woocommerce-ordering, body.tax-product_tag .twm-shop-wrap .woocommerce-ordering, body.tax-product_brand .twm-shop-wrap .woocommerce-ordering { float: none; width: 100%; max-width: 100%; margin-bottom: 0.65rem; } body.tax-product_cat .twm-shop-wrap .woocommerce-ordering select.orderby, body.tax-product_tag .twm-shop-wrap .woocommerce-ordering select.orderby, body.tax-product_brand .twm-shop-wrap .woocommerce-ordering select.orderby { width: 100%; max-width: 100%; box-sizing: border-box; } } .twm-shop-wrap--brand .twm-brand-archive-hero { margin: 0 0 1.5rem; padding: 1.1rem 1.15rem 1.15rem; border-radius: 12px; border: 1px solid rgba(4, 120, 87, 0.22); background: linear-gradient(135deg, #f0fdf4 0%, #fff 58%); box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06); } .twm-brand-kicker { margin: 0 0 0.35rem; font-size: 0.8125rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--twm-green-accent, #166534); font-weight: 600; } .twm-shop-wrap--brand .twm-brand-archive-hero .page-title { margin-top: 0; margin-bottom: 0.65rem; padding-bottom: 0.65rem; border-bottom: 2px solid var(--twm-green-brand, #047857); } .twm-shop-wrap--brand .twm-brand-desc--prose { margin: 0.85rem 0 0; padding: 0.75rem 0.85rem 0.75rem 1rem; border-left: 4px solid var(--twm-green-brand, #047857); border-radius: 0 8px 8px 0; background: rgba(240, 253, 244, 0.75); font-size: 0.95rem; line-height: 1.55; color: var(--twm-ink, #0f172a); } .twm-shop-wrap--brand .twm-brand-desc--prose::before, .twm-shop-wrap--brand .twm-brand-desc--prose::after { display: none !important; } .twm-shop-wrap--brand .twm-brand-desc--prose a { color: var(--twm-green-deep, #065f46); text-decoration: underline; text-underline-offset: 2px; } .twm-shop-wrap--brand .twm-brand-desc--prose a:hover, .twm-shop-wrap--brand .twm-brand-desc--prose a:focus-visible { color: var(--twm-green-brand, #047857); } .twm-brand-lead { margin: 0.5rem 0 0; font-size: 0.95rem; line-height: 1.55; color: #334155; max-width: 62ch; } .twm-brand-actions { margin: 1rem 0 0; } .twm-shop-wrap--brand a.twm-brand-shop-link.button, .twm-shop-wrap--brand .twm-brand-shop-link.button { display: inline-block; text-decoration: none !important; background: var(--twm-green-brand, #047857) !important; color: #fff !important; border: 2px solid var(--twm-green-brand, #047857) !important; border-radius: 8px; padding: 0.5rem 1.1rem; font-weight: 600; box-shadow: none; line-height: 1.35; } .twm-shop-wrap--brand a.twm-brand-shop-link.button:hover, .twm-shop-wrap--brand a.twm-brand-shop-link.button:focus-visible, .twm-shop-wrap--brand .twm-brand-shop-link.button:hover, .twm-shop-wrap--brand .twm-brand-shop-link.button:focus-visible { background: var(--twm-green-deep, #065f46) !important; border-color: var(--twm-green-deep, #065f46) !important; color: #fff !important; outline: none; box-shadow: 0 0 0 2px var(--twm-focus-ring, #15803d); } .twm-cats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 16px; margin: 10px 0 24px; } .twm-cat-card { border: 2px solid #22c55e; border-radius: 12px; background:#fff; box-shadow:0 0 0 0 rgba(34,197,94,.2); transition: box-shadow .2s ease, transform .2s ease; overflow:hidden; text-align:center; } .twm-cat-card:hover{ box-shadow:0 6px 22px rgba(34,197,94,.25); transform: translateY(-2px); } .twm-cat-card a{ display:block; padding:10px 12px; text-decoration:none; color:#0f172a; } .twm-cat-thumb{ width:100%; height:110px; object-fit:cover; background:#f8fafc; display:block; } .twm-cat-name{ font-weight:700; font-size:14px; margin-top:8px; } /* * Grille boutique : Woo impose souvent width:22–25% + float sur li.product pour les colonnes classiques. * Avec display:grid sur ul, chaque li restait à ~22 % de la cellule → bandes ultra étroites + titre vertical. */ ul.products.columns-twm { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; list-style: none; padding: 0; width: 100%; clear: both; } ul.products.columns-twm li.product { width: 100% !important; max-width: none !important; min-width: 0; float: none !important; clear: none !important; margin: 0 !important; list-style: none; display: flex; flex-direction: column; height: 100%; } .twm-shop-wrap ul.products.columns-twm .twm-product-card { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; } /* * PDP — Upsells (section.up-sells) : grille au lieu de columns-4 / 2 trop étroits (sidebar + mobile). */ /* PDP — Soumettre un avis : rayon (thème / WebKit exigent souvent appearance + !important). */ body.woocommerce.single-product #reviews #commentform p.form-submit input[type="submit"], body.woocommerce.single-product #reviews #commentform p.form-submit input#submit, body#blog.woocommerce.single-product #reviews #commentform p.form-submit input[type="submit"], body#blog.woocommerce.single-product #reviews #commentform p.form-submit input#submit, body.woocommerce.single-product #reviews #respond #commentform p.form-submit input[type="submit"], body#blog.woocommerce.single-product #reviews #respond #commentform p.form-submit input[type="submit"] { -webkit-appearance: none; appearance: none; border-radius: 12px !important; } body.woocommerce.single-product #reviews #commentform p.form-submit input#submit:hover, body.woocommerce.single-product #reviews #commentform p.form-submit input#submit:focus-visible, body#blog.woocommerce.single-product #reviews #commentform p.form-submit input#submit:hover, body#blog.woocommerce.single-product #reviews #commentform p.form-submit input#submit:focus-visible { color: var(--twm-green-brand, #047857) !important; } section.up-sells.upsells.products ul.products, .up-sells ul.products { display: grid !important; grid-template-columns: 1fr; gap: 16px !important; width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; padding: 0 !important; clear: both; list-style: none; float: none !important; } section.up-sells.upsells.products ul.products::before, section.up-sells.upsells.products ul.products::after, .up-sells ul.products::before, .up-sells ul.products::after { display: none !important; content: none !important; } section.up-sells.upsells.products ul.products li.product, .up-sells ul.products li.product { width: 100% !important; max-width: none !important; min-width: 0; float: none !important; clear: none !important; margin: 0 !important; list-style: none; } @media (min-width: 520px) { section.up-sells.upsells.products ul.products, .up-sells ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px !important; } } @media (min-width: 960px) { section.up-sells.upsells.products ul.products, .up-sells ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* * PDP — Titre « Vous aimerez aussi… » (upsells) : même charte que le H1 produit, sémantique H2. */ body.woocommerce.single-product section.up-sells.upsells.products > h2, body#blog.woocommerce.single-product section.up-sells.upsells.products > h2, body.woocommerce.single-product .up-sells.upsells.products > h2, body#blog.woocommerce.single-product .up-sells.upsells.products > h2 { color: var(--twm-green-deep, #065f46); font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif; font-weight: 800; font-size: clamp(1.375rem, 1.35vw + 1.05rem, 2.125rem); line-height: 1.18; letter-spacing: -0.03em; margin: 2.25rem 0 1.15rem; padding-bottom: 0.45rem; border-bottom: 3px solid var(--twm-green-brand, #047857); text-wrap: balance; } /* * PDP — Étoiles avis (formulaire) + bloc note produit : alignement sur l’or des cartes (#f59e0b). */ body.woocommerce.single-product .comment-form-rating p.stars a, body#blog.woocommerce.single-product .comment-form-rating p.stars a { color: #f59e0b !important; } body.woocommerce.single-product .comment-form-rating p.stars a::before, body#blog.woocommerce.single-product .comment-form-rating p.stars a::before { color: #f59e0b !important; } body.woocommerce.single-product .comment-form-rating p.stars:hover a, body.woocommerce.single-product .comment-form-rating p.stars.selected a, body#blog.woocommerce.single-product .comment-form-rating p.stars:hover a, body#blog.woocommerce.single-product .comment-form-rating p.stars.selected a { color: #d97706 !important; } body.woocommerce.single-product .comment-form-rating p.stars:hover a::before, body.woocommerce.single-product .comment-form-rating p.stars.selected a::before, body#blog.woocommerce.single-product .comment-form-rating p.stars:hover a::before, body#blog.woocommerce.single-product .comment-form-rating p.stars.selected a::before { color: #d97706 !important; } body.woocommerce.single-product .woocommerce-product-rating .star-rating::before, body#blog.woocommerce.single-product .woocommerce-product-rating .star-rating::before { color: #e5e7eb !important; opacity: 1; } body.woocommerce.single-product .woocommerce-product-rating .star-rating span, body.woocommerce.single-product .woocommerce-product-rating .star-rating span::before, body#blog.woocommerce.single-product .woocommerce-product-rating .star-rating span, body#blog.woocommerce.single-product .woocommerce-product-rating .star-rating span::before { color: #f59e0b !important; } /* * PDP — Lien « (N avis…) » + titre H1 produit (pile système, pas de webfont supplémentaire). */ body.woocommerce.single-product .woocommerce-review-link, body#blog.woocommerce.single-product .woocommerce-review-link { color: var(--twm-green-deep, #065f46) !important; font-weight: 600; text-decoration: underline; text-underline-offset: 0.18em; } body.woocommerce.single-product .woocommerce-review-link:hover, body.woocommerce.single-product .woocommerce-review-link:focus-visible, body#blog.woocommerce.single-product .woocommerce-review-link:hover, body#blog.woocommerce.single-product .woocommerce-review-link:focus-visible { color: var(--twm-green-brand, #047857) !important; } body.woocommerce.single-product div.product h1.product_title.entry-title, body#blog.woocommerce.single-product div.product h1.product_title.entry-title { color: var(--twm-green-deep, #065f46); font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif; font-weight: 800; font-size: clamp(1.375rem, 1.35vw + 1.05rem, 2.125rem); line-height: 1.18; letter-spacing: -0.03em; margin: 0 0 0.35em; text-wrap: balance; } /* * PDP — Onglets déballés (twm-pdp-tabs-unpacked) : titres de section + espacement. */ .twm-pdp-tabs-unpacked .twm-pdp-section { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid #e2e8f0; } .twm-pdp-tabs-unpacked .twm-pdp-section:first-of-type { margin-top: 0; padding-top: 0; border-top: none; } .twm-pdp-tabs-unpacked .twm-pdp-section__title { margin: 0 0 1rem; font-size: 1.625rem; line-height: 1.28; font-weight: 800; color: var(--twm-green-deep, #065f46); padding-bottom: 0.45rem; border-bottom: 3px solid var(--twm-green-brand, #047857); letter-spacing: -0.02em; } /* Titre avis Woo : calé sur les autres H2 de section (souvent surdimensionné par le thème). */ body.woocommerce.single-product #reviews h2.woocommerce-Reviews-title, body#blog.woocommerce.single-product #reviews h2.woocommerce-Reviews-title { font-size: 1.625rem !important; line-height: 1.28 !important; font-weight: 800 !important; letter-spacing: -0.02em !important; color: var(--twm-green-deep, #065f46) !important; margin: 0 0 1rem !important; padding-bottom: 0.45rem !important; border-bottom: 3px solid var(--twm-green-brand, #047857) !important; } .twm-pdp-tabs-unpacked .twm-pdp-section__body { clear: both; } /* Masque d’éventuelles listes d’onglets résiduelles du thème */ .twm-pdp-tabs-unpacked > ul.tabs, .twm-pdp-tabs-unpacked > ul.wc-tabs { display: none !important; } body.woocommerce.single-product .twm-pdp-tabs-unpacked .twm-pdp-section__body > .woocommerce-Tabs-panel, body#blog.woocommerce.single-product .twm-pdp-tabs-unpacked .twm-pdp-section__body > .woocommerce-Tabs-panel { display: block !important; max-height: none !important; height: auto !important; overflow: visible !important; opacity: 1 !important; visibility: visible !important; } /* * PDP — Ajouter au panier : CTA vert (plus de bleu au survol). */ body.woocommerce.single-product div.product form.cart .button.alt, body.woocommerce.single-product div.product form.cart button.single_add_to_cart_button, body.woocommerce.single-product div.product form.cart .single_add_to_cart_button.button, body#blog.woocommerce.single-product div.product form.cart .button.alt, body#blog.woocommerce.single-product div.product form.cart button.single_add_to_cart_button, body#blog.woocommerce.single-product div.product form.cart .single_add_to_cart_button.button { background-color: var(--twm-green-deep, #065f46) !important; background-image: none !important; border: 2px solid var(--twm-green-deep, #065f46) !important; color: #fff !important; font-weight: 700 !important; border-radius: 10px !important; padding: 0.65rem 1.5rem !important; min-height: 48px; box-shadow: 0 1px 3px rgba(6, 95, 70, 0.35); transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease; } body.woocommerce.single-product div.product form.cart .button.alt:hover, body.woocommerce.single-product div.product form.cart .button.alt:focus-visible, body.woocommerce.single-product div.product form.cart button.single_add_to_cart_button:hover, body.woocommerce.single-product div.product form.cart button.single_add_to_cart_button:focus-visible, body.woocommerce.single-product div.product form.cart .single_add_to_cart_button.button:hover, body.woocommerce.single-product div.product form.cart .single_add_to_cart_button.button:focus-visible, body#blog.woocommerce.single-product div.product form.cart .button.alt:hover, body#blog.woocommerce.single-product div.product form.cart .button.alt:focus-visible, body#blog.woocommerce.single-product div.product form.cart button.single_add_to_cart_button:hover, body#blog.woocommerce.single-product div.product form.cart button.single_add_to_cart_button:focus-visible, body#blog.woocommerce.single-product div.product form.cart .single_add_to_cart_button.button:hover, body#blog.woocommerce.single-product div.product form.cart .single_add_to_cart_button.button:focus-visible { background-color: var(--twm-green-brand, #047857) !important; border-color: var(--twm-green-brand, #047857) !important; color: #fff !important; box-shadow: 0 4px 14px rgba(6, 95, 70, 0.35); outline: none; transform: translateY(-1px); } /* * PDP — Quantité : + / − visibles (couleur marque). */ body.woocommerce.single-product div.product form.cart .quantity, body#blog.woocommerce.single-product div.product form.cart .quantity { display: inline-flex; align-items: center; flex-wrap: nowrap; gap: 0; vertical-align: middle; line-height: 1 !important; font-size: 1rem; } body.woocommerce.single-product div.product form.cart .quantity button.minus, body.woocommerce.single-product div.product form.cart .quantity button.plus, body.woocommerce.single-product div.product form.cart .quantity a.minus, body.woocommerce.single-product div.product form.cart .quantity a.plus, body#blog.woocommerce.single-product div.product form.cart .quantity button.minus, body#blog.woocommerce.single-product div.product form.cart .quantity button.plus, body#blog.woocommerce.single-product div.product form.cart .quantity a.minus, body#blog.woocommerce.single-product div.product form.cart .quantity a.plus { display: inline-flex !important; align-items: center; justify-content: center; width: 48px !important; height: 48px !important; min-width: 48px !important; min-height: 48px !important; max-width: none !important; flex: 0 0 48px !important; box-sizing: border-box !important; padding: 0 !important; margin: 0 !important; font-size: 1.5rem !important; font-weight: 800 !important; line-height: 1 !important; letter-spacing: 0; color: #fff !important; border: 2px solid var(--twm-green-deep, #065f46) !important; background: var(--twm-green-deep, #065f46) !important; box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12); border-radius: 12px !important; cursor: pointer; text-decoration: none !important; opacity: 1 !important; visibility: visible !important; -webkit-appearance: none; appearance: none; } body.woocommerce.single-product div.product form.cart .quantity button.minus:hover, body.woocommerce.single-product div.product form.cart .quantity button.plus:hover, body.woocommerce.single-product div.product form.cart .quantity button.minus:focus-visible, body.woocommerce.single-product div.product form.cart .quantity button.plus:focus-visible, body.woocommerce.single-product div.product form.cart .quantity a.minus:hover, body.woocommerce.single-product div.product form.cart .quantity a.plus:hover, body.woocommerce.single-product div.product form.cart .quantity a.minus:focus-visible, body.woocommerce.single-product div.product form.cart .quantity a.plus:focus-visible, body#blog.woocommerce.single-product div.product form.cart .quantity button.minus:hover, body#blog.woocommerce.single-product div.product form.cart .quantity button.plus:hover, body#blog.woocommerce.single-product div.product form.cart .quantity button.minus:focus-visible, body#blog.woocommerce.single-product div.product form.cart .quantity button.plus:focus-visible, body#blog.woocommerce.single-product div.product form.cart .quantity a.minus:hover, body#blog.woocommerce.single-product div.product form.cart .quantity a.plus:hover, body#blog.woocommerce.single-product div.product form.cart .quantity a.minus:focus-visible, body#blog.woocommerce.single-product div.product form.cart .quantity a.plus:focus-visible { background: var(--twm-green-brand, #047857) !important; border-color: var(--twm-green-brand, #047857) !important; color: #fff !important; outline: none; box-shadow: 0 2px 8px rgba(6, 95, 70, 0.35); } body.woocommerce.single-product div.product form.cart .quantity input.qty, body#blog.woocommerce.single-product div.product form.cart .quantity input.qty { min-width: 3.25rem; min-height: 44px; text-align: center; font-weight: 600; font-size: 1rem; border: 2px solid #cbd5e1 !important; border-radius: 8px; color: var(--twm-ink, #0f172a); margin: 0 6px; } /* * PDP — ± hors de .quantity : Enwoo les met en **enfants directs de form** * (ex. #product-1843 > .summary.entry-summary > form > button.plus). * Même bordure / rayon / hauteur que input.qty. */ body.woocommerce.single-product div.summary.entry-summary form.cart > button.plus, body.woocommerce.single-product div.summary.entry-summary form.cart > button.minus, body#blog.woocommerce.single-product div.summary.entry-summary form.cart > button.plus, body#blog.woocommerce.single-product div.summary.entry-summary form.cart > button.minus, body.woocommerce.single-product div.product form.cart > button.plus, body.woocommerce.single-product div.product form.cart > button.minus, body#blog.woocommerce.single-product div.product form.cart > button.plus, body#blog.woocommerce.single-product div.product form.cart > button.minus { display: inline-flex !important; align-items: center; justify-content: center; width: 48px !important; height: 44px !important; min-width: 48px !important; min-height: 44px !important; box-sizing: border-box !important; padding: 0 !important; margin: 0 !important; margin-inline-end: 4px !important; font-size: 1.35rem !important; font-weight: 800 !important; line-height: 1 !important; color: var(--twm-green-deep, #065f46) !important; background: #fff !important; border: 2px solid #cbd5e1 !important; border-radius: 8px !important; box-shadow: none !important; cursor: pointer; -webkit-appearance: none; appearance: none; vertical-align: middle; opacity: 1 !important; visibility: visible !important; } body.woocommerce.single-product div.summary.entry-summary form.cart > button.plus:hover, body.woocommerce.single-product div.summary.entry-summary form.cart > button.minus:hover, body.woocommerce.single-product div.summary.entry-summary form.cart > button.plus:focus-visible, body.woocommerce.single-product div.summary.entry-summary form.cart > button.minus:focus-visible, body#blog.woocommerce.single-product div.summary.entry-summary form.cart > button.plus:hover, body#blog.woocommerce.single-product div.summary.entry-summary form.cart > button.minus:hover, body#blog.woocommerce.single-product div.summary.entry-summary form.cart > button.plus:focus-visible, body#blog.woocommerce.single-product div.summary.entry-summary form.cart > button.minus:focus-visible, body.woocommerce.single-product div.product form.cart > button.plus:hover, body.woocommerce.single-product div.product form.cart > button.minus:hover, body.woocommerce.single-product div.product form.cart > button.plus:focus-visible, body.woocommerce.single-product div.product form.cart > button.minus:focus-visible, body#blog.woocommerce.single-product div.product form.cart > button.plus:hover, body#blog.woocommerce.single-product div.product form.cart > button.minus:hover, body#blog.woocommerce.single-product div.product form.cart > button.plus:focus-visible, body#blog.woocommerce.single-product div.product form.cart > button.minus:focus-visible { border-color: rgba(6, 95, 70, 0.45) !important; background: rgba(240, 253, 244, 0.85) !important; color: var(--twm-green-brand, #047857) !important; outline: none; } /* * PDP — Étoiles dans la liste des avis publiés (commentlist). */ body.woocommerce.single-product #reviews .commentlist .star-rating::before, body#blog.woocommerce.single-product #reviews .commentlist .star-rating::before { color: #e5e7eb !important; opacity: 1; } body.woocommerce.single-product #reviews .commentlist .star-rating span, body.woocommerce.single-product #reviews .commentlist .star-rating span::before, body#blog.woocommerce.single-product #reviews .commentlist .star-rating span, body#blog.woocommerce.single-product #reviews .commentlist .star-rating span::before { color: #f59e0b !important; } .twm-product-card{ border: 1px solid #e2e8f0; border-radius: 16px; background: #fff; overflow: hidden; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06); transition: box-shadow 0.28s ease, transform 0.28s ease, border-color 0.28s ease; display: flex; flex-direction: column; height: 100%; } .twm-product-card:hover{ border-color: rgba(4, 120, 87, 0.22); box-shadow: 0 12px 32px rgba(15, 23, 42, 0.1), 0 2px 8px rgba(4, 120, 87, 0.08); transform: translateY(-4px); } /* Archives catégorie / boutique : léger renfort visuel au survol */ body#blog.woocommerce.tax-product_cat .twm-shop-wrap .twm-product-card:hover, body#blog.woocommerce.tax-product_tag .twm-shop-wrap .twm-product-card:hover, body#blog.woocommerce.post-type-archive-product .twm-shop-wrap .twm-product-card:hover { box-shadow: 0 16px 36px rgba(15, 23, 42, 0.11), 0 3px 10px rgba(4, 120, 87, 0.1); } .twm-product-media{ background:#f8fafc; } .twm-product-media img{ width:100%; height:280px; object-fit:cover; display:block; } .twm-product-body { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; min-height: 0; } .twm-product-title { font-size: 16px; line-height: 1.35; font-weight: 700; color: #0f172a; margin: 0; min-height: 4.05em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; word-break: break-word; hyphens: auto; } .twm-product-cats { color: #5a4a3a; font-size: 0.875rem; font-weight: 500; line-height: 1.35; text-align: center; min-height: 1.35em; width: 100%; flex-shrink: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .twm-product-cats .twm-product-cats__link { color: inherit; text-decoration: none; font-weight: inherit; } .twm-product-cats .twm-product-cats__link:hover { color: var(--twm-link-on-light-hover) !important; text-decoration: underline; text-underline-offset: 0.12em; } .twm-product-cats .twm-product-cats__placeholder { display: inline-block; min-width: 1ch; visibility: hidden; } /* Bloc prix + notes : même hauteur réservée partout → prix et boutons alignés sur une rangée de cartes */ .twm-product-meta { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; margin-top: auto; flex-shrink: 0; min-height: 5.5rem; width: 100%; text-align: center; } .twm-product-meta .twm-rating { width: 100%; } .twm-product-meta .twm-rating .star-rating { margin-left: auto; margin-right: auto; } .twm-product-meta .twm-product-price { width: 100%; text-align: center; } .twm-product-price { font-weight: 800; color: #065f46; font-size: 18px; } .twm-add-to-cart { display: flex; justify-content: center; align-items: center; padding: 12px 14px; background: #fff; } .twm-add-to-cart .button { background: var(--twm-cta-bg); background-image: none !important; border: none; color: #fff; font-weight: 700; border-radius: 9999px; padding: 12px 22px; width: auto; max-width: 100%; text-align: center; float: none !important; display: inline-flex; align-items: center; justify-content: center; box-shadow: var(--twm-cta-shadow); letter-spacing: 0.02em; min-height: 44px; box-sizing: border-box; transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease; } .twm-add-to-cart .button:hover { background: var(--twm-cta-bg-hover); background-image: none !important; border: none; box-shadow: 0 2px 8px rgba(1, 141, 57, 0.45); transform: translateY(-1px); } .twm-rating .star-rating{ float:none; margin:0; } @media (max-width:480px){ .twm-product-media img{ height:220px; } } /* ── Styles globaux (ex-CSS Customizer) ─────────────────────────────────────── */ .woocommerce-product-details__short-description h2, .woocommerce-product-details__short-description h3, .woocommerce-Tabs-panel--description h2, .woocommerce-Tabs-panel--description h3 { color: #0e5501 !important; } #blog > div.page-wrap > div.top-bar-section.container-fluid { display: none; } @media (max-width: 600px) { #short-tarifs-ar, #short-tarifs-fr, #short-tarifs-en { margin-top: -120px; } } html[lang="ar"] body { direction: rtl; text-align: right; } /* Défilement horizontal involontaire (grilles Woo / widgets / header-right) */ html { overflow-x: clip; } body#blog { overflow-x: clip; } /* * Header boutique (#blog) : même disposition toutes langues (rangée LTR, pas de order). * Logo calé au bord gauche, icônes au bord droit — paddings 0 uniquement sur .heading-row / .col * (ne pas toucher aux .container de la ligne recherche : sinon pilule desktop trop étirée). */ #blog .woo-heading .heading-row.row, #blog .woo-heading .heading-row { display: flex; flex-direction: row; direction: ltr; flex-wrap: nowrap; align-items: center; justify-content: flex-start; gap: 0; width: 100%; box-sizing: border-box; min-width: 0; margin-left: 0 !important; margin-right: 0 !important; } #blog .woo-heading .heading-row [class*="col-"] { padding-left: 0 !important; padding-right: 0 !important; } #blog .woo-heading .heading-row .header-right { margin-left: auto !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; display: flex !important; flex-direction: row; flex-wrap: nowrap !important; align-items: center; justify-content: flex-end; direction: ltr; gap: 0.4rem; flex: 0 0 auto; flex-grow: 0; flex-shrink: 0; min-width: 0; max-width: 100%; } #blog .woo-heading .heading-row .header-right .header-cart, #blog .woo-heading .heading-row .header-right .header-my-account, #blog .woo-heading .heading-row .header-right .header-wishlist, #blog .woo-heading .heading-row .header-right .header-compare, #blog .woo-heading .heading-row .header-right .menu-button, #blog .woo-heading .heading-row .header-right .header-search { float: none !important; } #blog .woo-heading .heading-row > div:not(.header-right) { margin-left: 0 !important; padding-left: 0 !important; text-align: left !important; } @media (max-width: 767px) { #blog .woo-heading .heading-row > div:not(.header-right) { flex: 0 0 auto; width: auto; max-width: min(58%, 220px); min-width: 0; } } /* Recherche : desktop — largeur max raisonnable (évite la pilule qui s’étire au dézoom). */ @media (min-width: 768px) { #blog .woo-heading .head-form { width: 100%; max-width: 1140px; margin-left: auto; margin-right: auto; padding-left: max(12px, env(safe-area-inset-left, 0px)); padding-right: max(12px, env(safe-area-inset-right, 0px)); box-sizing: border-box; } #blog .woo-heading .head-form .header-search-form { max-width: min(920px, 100%); margin-left: auto; margin-right: auto; } } /* Recherche : mobile — barre pleine largeur et centrée quand le thème l’affiche (toggle loupe). */ @media (max-width: 767px) { #blog .woo-heading .header-search-widget { width: 100%; clear: both; float: none; } #blog .woo-heading .header-search-widget .head-form, #blog .woo-heading .head-form { width: 100% !important; max-width: 100% !important; float: none !important; margin-left: auto !important; margin-right: auto !important; padding-left: max(8px, env(safe-area-inset-left, 0px)); padding-right: max(8px, env(safe-area-inset-right, 0px)); box-sizing: border-box; clear: both; } #blog .woo-heading .head-form .header-search-form { width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; } } /* Secours si pas de feuille Core « screen-reader-text » chargée sur une.page shop isolée */ .screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } #site-content > div > div > article > ul { padding-top: 15px; align-items: flex-start; } [id^="post-"] > div > div.etww-grid-media.clr > a.etww-grid-img > img { height: 150px; width: 100%; object-fit: cover; object-position: center; } #site-content > div > div > article > ul > li { height: auto !important; } #site-content > div > div > div > article > div { border-radius: 12px; padding: 20px; box-shadow: 0 6px 15px rgba(0, 100, 0, 0.6); } @media only screen and (max-width: 768px) { #site-content > div > div > article > ul > li.product-category.product.last { height: 110px; } } #site-content > div > div > article > ul > li:nth-child(2) > a > img, #site-content > div > div > article > ul > li.product-category.product.first > a > img, #site-content > div > div > article > ul > li:nth-child(3) > a > img, #site-content > div > div > article > ul > li:nth-child(4) > a > img, #site-content > div > div > article > ul > li.product-category.product.last > a > img { padding: 5px; } #woocommerce_price_filter-3 > form > div > div.price_slider.ui-slider.ui-corner-all.ui-slider-horizontal.ui-widget.ui-widget-content > span.ui-slider-handle.ui-corner-all.ui-state-default.ui-state-hover, #woocommerce_price_filter-3 > form > div > div.price_slider.ui-slider.ui-corner-all.ui-slider-horizontal.ui-widget.ui-widget-content > span.ui-slider-handle.ui-corner-all.ui-state-default, #woocommerce_price_filter-3 > form > div > div.price_slider.ui-slider.ui-corner-all.ui-slider-horizontal.ui-widget.ui-widget-content > div { background-color: var(--twm-green-brand); } /* Filtre par prix (sidebar + emplacement mobile sous intro) */ #blog .widget_price_filter .price_slider .ui-slider-range, #blog .widget_price_filter .price_slider .ui-slider-handle, #blog .twm-shop-price-filter-slot .price_slider .ui-slider-range, #blog .twm-shop-price-filter-slot .price_slider .ui-slider-handle { background-color: var(--twm-green-brand, #047857) !important; border-color: #065f46 !important; } #blog .widget_price_filter .price_slider_amount, #blog .twm-shop-price-filter-slot .price_slider_amount { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; } /* Filtre prix : plage min — max (évite le bidi cassé avec symboles arabe / ريال) */ #blog .twm-shop-price-filter-slot .price_label.twm-price-label, #blog .widget_price_filter .price_label.twm-price-label { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.35em 0.55em; max-width: 100%; line-height: 1.4; } #blog .twm-shop-price-filter-slot .twm-price-label-range, #blog .widget_price_filter .twm-price-label-range { display: inline-flex; align-items: center; gap: 0.45em; direction: ltr; unicode-bidi: isolate; white-space: nowrap; } #blog .twm-shop-price-filter-slot .twm-price-label-range .from, #blog .twm-shop-price-filter-slot .twm-price-label-range .to, #blog .widget_price_filter .twm-price-label-range .from, #blog .widget_price_filter .twm-price-label-range .to { unicode-bidi: isolate; } #blog .twm-shop-price-filter-slot .twm-price-label-sep, #blog .widget_price_filter .twm-price-label-sep { opacity: 0.85; } html[dir="rtl"] #blog .twm-shop-price-filter-slot .price_label.twm-price-label, html[dir="rtl"] #blog .widget_price_filter .price_label.twm-price-label { justify-content: flex-start; text-align: right; } html[dir="rtl"] #blog .twm-shop-price-filter-slot .twm-price-label-caption, html[dir="rtl"] #blog .widget_price_filter .twm-price-label-caption { unicode-bidi: plaintext; } #blog .widget_price_filter .price_slider_amount .button, #blog .woocommerce.widget_price_filter .price_slider_amount button.button, #blog .twm-shop-price-filter-slot .price_slider_amount .button, #blog .twm-shop-price-filter-slot .price_slider_amount button.button { float: none !important; background-color: var(--twm-bar-green) !important; border: none !important; color: #fff !important; font-weight: 700; border-radius: 12px; padding: 8px 18px; cursor: pointer; box-shadow: 0 1px 3px rgba(1, 141, 57, 0.35); transition: background-color 0.2s ease, box-shadow 0.2s ease; } #blog .widget_price_filter .price_slider_amount .button:hover, #blog .widget_price_filter .price_slider_amount .button:focus-visible, #blog .woocommerce.widget_price_filter .price_slider_amount button.button:hover, #blog .woocommerce.widget_price_filter .price_slider_amount button.button:focus-visible, #blog .twm-shop-price-filter-slot .price_slider_amount .button:hover, #blog .twm-shop-price-filter-slot .price_slider_amount .button:focus-visible, #blog .twm-shop-price-filter-slot .price_slider_amount button.button:hover, #blog .twm-shop-price-filter-slot .price_slider_amount button.button:focus-visible { background-color: var(--twm-bar-green-hover) !important; border: none !important; color: #fff !important; outline: none; box-shadow: 0 2px 8px rgba(1, 141, 57, 0.45); } /* Liste produits sidebar (dont widget TWM / Woo) : étoiles or comme les cartes catalogue */ #blog .woocommerce ul.product_list_widget .star-rating::before, #blog .widget .product_list_widget .star-rating::before, #blog .widget_twm_widget_products_esi ul.product_list_widget .star-rating::before, #blog [class*="widget_twm_widget_products"] ul.product_list_widget .star-rating::before { color: #e5e7eb !important; opacity: 1; } #blog .woocommerce ul.product_list_widget .star-rating span::before, #blog .widget .product_list_widget .star-rating span::before, #blog .widget_twm_widget_products_esi ul.product_list_widget .star-rating span::before, #blog [class*="widget_twm_widget_products"] ul.product_list_widget .star-rating span::before { color: #f59e0b !important; } #block-4 > div > div > ol li { background-color: #def957; } .hidden-header { transform: translateY(-100%); opacity: 0; transition: transform 0.5s ease, opacity 0.5s ease; } #blog .page-wrap .site-header.container-fluid.woo-heading { position: fixed; top: 0; left: 0; width: 100%; /* Au-dessus du bandeau taxonomies mobile (.twm-blog-tax-menu-mobile-host z-index 1000 / toggle 1102) pour que la liste combobox (fixed, enfant du header) ne soit plus masquée. */ z-index: 1200; background-color: #fff; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5); padding-bottom: 12px; padding-top: 12px; padding-left: max(4px, env(safe-area-inset-left, 0px)); padding-right: max(4px, env(safe-area-inset-right, 0px)); box-sizing: border-box; transition: transform 0.5s ease, opacity 0.5s ease; } #blog .page-wrap { padding-top: 140px; } @media only screen and (max-width: 768px) { #blog .page-wrap { padding-top: 92px; } } #theme-menu-second { display: flex; justify-content: center; } @media screen and (max-width: 768px) { #theme-menu-second { width: 100%; } #menu-main-menu-right { display: flex; flex-wrap: wrap; justify-content: center; } #menu-main-menu-right li { margin: 5px; } } #blog > p.woocommerce-store-notice.demo_store { display: none !important; } .site-heading { width: auto; max-width: 126px; } /* Logo header : taille cohérente (évite logo surdimensionné vs icônes) */ /* Logo header : réserve d’espace alignée sur max-width 120px / max-height 60px (CLS + Lighthouse). */ #blog .woo-heading .site-heading .custom-logo-link { display: inline-flex; align-items: center; justify-content: flex-start; max-width: 120px; min-height: 60px; line-height: 0; } #blog .woo-heading .site-branding-logo img, #blog .woo-heading .site-heading .custom-logo-link img { max-height: 60px; width: auto; max-width: 120px; object-fit: contain; vertical-align: middle; } #polylang-6 ul li { display: inline-block; } #colophon { display: none; } /* Parent Enwoo : min-width max-content ; ne pas rétrécir le bloc icônes (évite glissement vers le centre). */ #blog .page-wrap .woo-heading .header-right { min-width: 0; flex-shrink: 0; align-self: center; margin-top: 0 !important; } @media only screen and (max-width: 766px) { .hc-offcanvas-nav .nav-content > .nav-close:first-child a, .hc-offcanvas-nav .nav-title + .nav-close a.has-label, .hc-offcanvas-nav li.nav-close a, .hc-offcanvas-nav .nav-back a { background: var(--twm-green-deep); } #hc-nav-1 div div div div a { color: #0f0f0f; } #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-wishlist > a > i, #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-my-account > div > a > i, #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-search.visible-xs > a > i, #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-compare.product > a > i, #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-cart > div > div > a > i { font-size: 34px; } #main-menu-panel > span { width: 27px; height: 4px; left: 50%; transform: translateX(-50%); } #main-menu-panel > span::before, #main-menu-panel > span::after { width: 27px; height: 3px; } a.cart-contents i, .header-my-account a, .header-wishlist a, .header-compare a, .header-search a { line-height: 29px; } /* Menu offcanvas (mobile) : zones tactiles suffisantes pour Lighthouse */ .hc-offcanvas-nav li.menu-item > a, .hc-offcanvas-nav .nav-wrapper li > a { min-height: 44px; display: flex; align-items: center; padding: 10px 12px; box-sizing: border-box; } } @media only screen and (min-width: 1430px) { #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-wishlist > a > i, #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-my-account > div > a > i, #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-search.visible-xs > a > i, #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-compare.product > a > i, #blog > div.page-wrap > div.site-header.container-fluid.woo-heading > div > div > div.header-right > div.header-cart > div > div > a > i { font-size: 30px; } a.cart-contents i, .header-my-account a, .header-wishlist a, .header-compare a, .header-search a { line-height: 29px; } } /* Ancien positionnement absolu du parent : neutralisé — le bouton est en flex dans twm_child_header_chrome_css() (functions.php). */ #blog .woo-heading .header-search-form button.header-search-button { right: auto; top: auto; width: auto; height: auto; } /* Chrome header (recherche, nav secondaire, panier) : voir twm_child_header_chrome_css() — wp_head prio 1999 (functions.php). */ .cart-open ul.site-header-cart, .product-added-to-cart .header-cart-block ul.site-header-cart { background-color: #f0f0f0 !important; border-color: #f0f0f0 !important; } a.button.checkout.wc-forward:hover, a.button.wc-forward:hover { color: #015b42 !important; } /* Pied de page injecté par twm-theme-head-footer.php — préfixe pour ne pas styler d’autres