/* ===================================================================== Europe Technologie — Premium Dark Thème enfant de v1_electron_1 (ThemeVolty "Electron") Les classes du thème sont préfixées "tv" / "tvcms". ===================================================================== */ :root { --et-bg: #0C1722; --et-surface: #13212F; --et-surface-2: #1B2D3E; --et-border: #25394C; --et-accent: #16A6BE; --et-accent-2: #3FD2E2; --et-price: #2BD4C0; --et-text: #EAF1F5; --et-text-soft: #9DB2C2; --et-glow: 0 0 .85rem rgba(63,210,226,.38); --et-radius: 14px; --et-shadow: 0 12px 32px -14px rgba(0,0,0,.7); --et-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; --et-font-display: 'Sora', 'Inter', sans-serif; } /* ---------- Polices premium (auto-hébergées) ---------- */ @font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/themes/v1_electron_1_child/assets/fonts/inter-latin-400-normal.woff2') format('woff2');} @font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/themes/v1_electron_1_child/assets/fonts/inter-latin-500-normal.woff2') format('woff2');} @font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/themes/v1_electron_1_child/assets/fonts/inter-latin-600-normal.woff2') format('woff2');} @font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/themes/v1_electron_1_child/assets/fonts/inter-latin-700-normal.woff2') format('woff2');} @font-face{font-family:'Sora';font-style:normal;font-weight:500;font-display:swap;src:url('/themes/v1_electron_1_child/assets/fonts/sora-latin-500-normal.woff2') format('woff2');} @font-face{font-family:'Sora';font-style:normal;font-weight:600;font-display:swap;src:url('/themes/v1_electron_1_child/assets/fonts/sora-latin-600-normal.woff2') format('woff2');} @font-face{font-family:'Sora';font-style:normal;font-weight:700;font-display:swap;src:url('/themes/v1_electron_1_child/assets/fonts/sora-latin-700-normal.woff2') format('woff2');} /* ---------- Typographie premium (sans casser les icônes) ---------- */ body { font-family: var(--et-font-body); } body, p, li, td, dd, dt, a, label, blockquote, figcaption, .tvproduct-name, .tvproduct-name a, .product-title, .product-title a, .product-name, .price, .product-price, .tvproduct-price, .current-price span, .regular-price, button, .btn, input, select, textarea, .form-control, .breadcrumb, .page-content, .product-description, .product-information, .header-menu a, .tvcmsmega-menu a, .menu-content a, .sub-menu a, .tvcategory-img-block, .tvall-category-wrapper, .category-item, .footer-title, #footer, .tvcmsfooter, .nav-tabs .nav-link, table, .table { font-family: var(--et-font-body) !important; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .tvcms-main-title, .tvcmstab-title-product, .tvmain-slider-title, .main-title, .footer-title, .footer-title-wrapper, .page-header h1, .section-title, .header-menu > ul > li > a, .tvcmsmega-menu > ul > li > a, .btn-primary, button.add-to-cart, .add-to-cart, .price, .product-price { font-family: var(--et-font-display) !important; letter-spacing: .005em; } /* Note: on ne cible volontairement PAS i / .fa / .tvicon / ::before pour que les polices d'icônes (FontAwesome, tvicon…) restent intactes. */ /* ---------- Base ---------- */ html, body { background-color: var(--et-bg) !important; color: var(--et-text); } body, p, span, li, td, dd, dt, label, h1,h2,h3,h4,h5,h6, .h1,.h2,.h3,.h4 { color: var(--et-text); } small, .text-muted, .product-comments { color: var(--et-text-soft) !important; } a { color: var(--et-accent); transition: color .2s ease; } a:hover, a:focus { color: var(--et-accent-2); text-decoration: none; } ::selection { background: var(--et-accent); color: #04141A; } hr, .separator { border-color: var(--et-border) !important; } /* ---------- Conteneurs structurels -> transparents ---------- */ #wrapper, .wrapper, #content-wrapper, #content, .page-home, .tv-main-div, .main-div, main, #main, .page-content, [class*="tvcmsblock"], [class*="tvcms-block"], .tvcms-slider-offerbanner-wrapper, .tvall-category-wrapper, .tvcms-category-wrapper, .featured-products, .tvcmstab-wrapper, .tvproduct-tab-wrapper, .tvcms-product-wrapper, .container, .container-fluid, .row, [class^="col-"], [class*=" col-"] { background-color: transparent !important; } /* ---------- Header ---------- */ #header, .header-wrapper, .tvcmsdesktop-top-header-wrapper, .header-1, .tvcmsheader-sticky, .tvcms-header-menu-offer-wrapper, .header-menu, .tvcmsmobile-top-wrapper, .tvcmsmega-menu, .header-sticky { background-color: var(--et-surface-2) !important; color: var(--et-text); border-color: var(--et-border) !important; } #header a, .header-wrapper a, .header-menu a, .tvcmsmega-menu a { color: var(--et-text); } #header a:hover, .header-menu a:hover, .tvcmsmega-menu a:hover { color: var(--et-accent-2); } /* Barre de recherche */ .header-search input, input.search, #search_widget input, .tvcms-header-search input, input[type="text"].ui-autocomplete-input { background-color: var(--et-bg) !important; border: 1px solid var(--et-border) !important; color: var(--et-text) !important; } .header-search input::placeholder { color: var(--et-text-soft); } /* Menus déroulants */ .dropdown-menu, .sub-menu, ul.menu-content, .tvcmsmega-menu .sub-menu, .tvheader-language-wrapper .dropdown-menu, .tvheader-currency-wrapper .dropdown-menu { background-color: var(--et-surface-2) !important; border: 1px solid var(--et-border) !important; box-shadow: var(--et-shadow) !important; } /* ---------- Titres de section ---------- */ .main-title, .page-header h1, .h1.page-title, .tvcms-title, .section-title, .products-section-title, .featured-products .h2 { color: var(--et-text) !important; } /* ---------- Tuiles catégories (page d'accueil) ---------- */ .tvall-category-wrapper .category-item, .tvcms-category-item, .category-miniature, .tvcategory-block { background-color: var(--et-surface) !important; border: 1px solid var(--et-border) !important; border-radius: var(--et-radius) !important; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; } .tvall-category-wrapper .category-item:hover, .tvcms-category-item:hover { transform: translateY(-4px); border-color: var(--et-accent) !important; box-shadow: var(--et-glow) !important; } /* ---------- Cartes produit (tv*) ---------- */ .tvproduct-wrapper, .tvproduct-info-box-wrapper, .product-miniature, .js-product-miniature, .card.product-container { background-color: var(--et-surface) !important; border: 1px solid var(--et-border) !important; border-radius: var(--et-radius) !important; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; } .tvproduct-wrapper:hover, .product-miniature:hover { transform: translateY(-5px); border-color: var(--et-accent) !important; box-shadow: var(--et-shadow), var(--et-glow) !important; } /* Tuile image -> claire pour que les photos produit (souvent sur fond blanc) restent nettes */ .tvproduct-image, .product-thumbnail, .thumbnail.product-thumbnail { background-color: #fff !important; border-radius: calc(var(--et-radius) - 4px) !important; overflow: hidden; } .tvproduct-image img, .tvproduct-defult-img, .tvproduct-hover-img { mix-blend-mode: normal; } /* Texte produit */ .tvproduct-name, .tvproduct-name a, .product-title, .product-title a, .product-name, .product-name a { color: var(--et-text) !important; font-weight: 600; } .tvproduct-name a:hover, .product-title a:hover { color: var(--et-accent-2) !important; } /* Prix */ .price, .product-price, .tvproduct-price, .current-price span, .product-price-and-shipping .price, span.price { color: var(--et-price) !important; font-weight: 700; } .regular-price { color: var(--et-text-soft) !important; text-decoration: line-through; } /* Badges */ .product-flag, .tvproduct-flag, .product-flags li .product-flag { background-color: var(--et-accent) !important; color: #04141A !important; border: none; font-weight: 600; letter-spacing: .02em; } .product-flag.discount, .product-flag.on-sale, .product-flag.sale { background-color: var(--et-accent-2) !important; } /* Étoiles */ .tvproduct-star-icon, .product-star-icon, .star, .grade-stars, .star_content .star.star_on { color: var(--et-accent-2) !important; } /* ---------- Boutons / CTA ---------- */ .btn-primary, .btn.btn-primary, button.add-to-cart, .add-to-cart, [data-button-action="add-to-cart"], .tvproduct-add-to-cart .btn, .tvcart-button, .product-add-to-cart .btn { background-color: var(--et-accent) !important; border-color: var(--et-accent) !important; color: #04141A !important; font-weight: 700; border-radius: 999px; transition: background-color .2s ease, box-shadow .2s ease, transform .15s ease; } .btn-primary:hover, button.add-to-cart:hover, .add-to-cart:hover, [data-button-action="add-to-cart"]:hover, .tvcart-button:hover { background-color: var(--et-accent-2) !important; border-color: var(--et-accent-2) !important; box-shadow: var(--et-glow) !important; transform: translateY(-1px); } .btn-secondary, .btn-outline-primary { background: transparent !important; border: 1px solid var(--et-accent) !important; color: var(--et-accent) !important; border-radius: 999px; } .btn-secondary:hover, .btn-outline-primary:hover { background: var(--et-accent) !important; color:#04141A !important; } /* Icônes d'action (wishlist, compare, quickview) */ .tvproduct-online-new-wrapper a, .tvquick-view, .tvwishlist, .tvcompare, .product-flags + .tv-icon a { color: var(--et-text); } .tvquick-view:hover, .tvwishlist:hover, .tvcompare:hover { color: var(--et-accent-2); } /* ---------- Formulaires ---------- */ input, select, textarea, .form-control { background-color: var(--et-surface) !important; border: 1px solid var(--et-border) !important; color: var(--et-text) !important; } input:focus, select:focus, textarea:focus, .form-control:focus { border-color: var(--et-accent) !important; box-shadow: var(--et-glow) !important; outline: none; } /* Newsletter (souvent bloc clair) */ .tvcms-newsletter-wrapper, .ps_emailsubscription, .block_newsletter { background-color: var(--et-surface-2) !important; border: 1px solid var(--et-border) !important; border-radius: var(--et-radius) !important; } /* ---------- Footer ---------- */ #footer, .footer, .footer-container, .tvcmsfooter, .footer-wrapper, .tvcms-footer-wrapper, .footer-top, .footer-bottom { background-color: var(--et-surface-2) !important; color: var(--et-text-soft); border-top: 1px solid var(--et-border); } #footer a, .footer a, .tvcmsfooter a { color: var(--et-text-soft); } #footer a:hover, .footer a:hover { color: var(--et-accent-2); } .footer-title, .footer-title-wrapper, #footer h3, .footer h3 { color: var(--et-text) !important; } .footer-social-icon a { color: var(--et-text-soft); transition: color .2s, transform .2s; } .footer-social-icon a:hover { color: var(--et-accent-2); transform: translateY(-2px); } /* ---------- Fil d'ariane ---------- */ .breadcrumb, .breadcrumb-wrapper, .tvcms-breadcrumb { background: transparent !important; } .breadcrumb a { color: var(--et-text-soft); } .breadcrumb .active, .breadcrumb li:last-child a { color: var(--et-accent-2); } /* ---------- Tableaux / pagination ---------- */ table, .table { color: var(--et-text); } .table thead th { background: var(--et-surface-2); border-color: var(--et-border); } .table td, .table th { border-color: var(--et-border); } .pagination .page-link { background: var(--et-surface) !important; border-color: var(--et-border) !important; color: var(--et-text) !important; } .pagination .active .page-link { background: var(--et-accent) !important; color:#04141A !important; border-color: var(--et-accent) !important; } /* ---------- Page produit ---------- */ .product-information, .product-actions, .tab-content, .product-tabs, .tvproduct-detail-wrapper, .product-prices { background: transparent !important; color: var(--et-text); } .product-prices .current-price .price, .current-price-value { color: var(--et-price) !important; } .nav-tabs .nav-link { color: var(--et-text-soft); border-color: var(--et-border); } .nav-tabs .nav-link.active { color: var(--et-accent-2); background: transparent; border-color: var(--et-accent-2) var(--et-accent-2) transparent; } /* ==================================================================== POLISH ==================================================================== */ /* ---- Titres de section premium (NOS CATÉGORIES, NOUVEAUTÉS…) ---- */ .tvcms-main-title, .tvcmstab-title-product, .tvcmstab-title-product h2, .tvcms-main-title h2, .products-section-title, .featured-products .h2 { color: var(--et-text) !important; font-family: var(--et-font-display) !important; font-weight: 700 !important; letter-spacing: .04em; text-transform: uppercase; } .tvcms-main-title, .tvcmstab-title-product { position: relative; padding-bottom: .55rem; margin-bottom: 1.75rem; } /* petit trait teal sous le titre */ .tvcms-main-title::after, .tvcmstab-title-product::after { content: ""; position: absolute; left: 0; bottom: 0; width: 56px; height: 3px; background: linear-gradient(90deg, var(--et-accent), var(--et-accent-2)); border-radius: 3px; } /* si le titre est centré, centrer le trait */ .text-center .tvcms-main-title::after, .tvcms-main-title.text-center::after { left: 50%; transform: translateX(-50%); } /* ---- Colonne gauche (évite le bloc blanc qui dépasse) ---- */ #left-column, .theiaStickySidebar, .tvleft-column-remove { background: transparent !important; } #left-column .block, #left-column .tvcategory-img-block, #left-column [class*="tvcms"] { background-color: var(--et-surface) !important; border: 1px solid var(--et-border) !important; border-radius: var(--et-radius) !important; } /* ---- Bandeau catégories accueil : transparent + tuiles soignées ---- */ .tvall-category-wrapper, .tvcategory-slider-wrapper-info, .tvcategory-slider-wrapper, .tvcms-category-wrapper { background: transparent !important; } .tvcategory-img-block { background-color: var(--et-surface) !important; border: 1px solid var(--et-border) !important; border-radius: var(--et-radius) !important; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; } .tvcategory-img-block:hover { transform: translateY(-4px); border-color: var(--et-accent) !important; box-shadow: var(--et-glow) !important; } .tvcategory-img-block .tvcategory-title, .tvcategory-img-block a { color: var(--et-text) !important; } .tvcategory-img-block:hover .tvcategory-title { color: var(--et-accent-2) !important; } /* ---- Logo : garantir la lisibilité sur header sombre ---- */ .header-logo img, .tvcmsmobile-header-logo img, .logo img { max-height: 56px; width: auto; } /* ---- Scrollbar premium ---- */ * { scrollbar-color: var(--et-accent) var(--et-bg); } ::-webkit-scrollbar { width: 11px; height: 11px; } ::-webkit-scrollbar-track { background: var(--et-bg); } ::-webkit-scrollbar-thumb { background: var(--et-surface-2); border-radius: 8px; border: 2px solid var(--et-bg); } ::-webkit-scrollbar-thumb:hover { background: var(--et-accent); } /* ---- Finitions ---- */ .btn { letter-spacing: .02em; } .tvproduct-wrapper { padding: 10px; } .tvproduct-name { min-height: 2.6em; line-height: 1.3; } /* Accueil : pas de colonne gauche (rendu pleine largeur premium) */ body.page-index #left-column { display: none !important; } body.page-index #content-wrapper { flex: 0 0 100% !important; max-width: 100% !important; } /* (la colonne gauche reste sur les pages catégorie pour les filtres) */ /* ==================================================================== CORRECTIFS CIBLÉS (éléments restés clairs) ==================================================================== */ /* 1) Panneau démo de bascule de layout ThemeVolty -> masqué (prod) */ .tvtheme-control-wrapper, .tvtheme-layout-wrapper, .tvtheme-setting, .tvtheme-setting-btn, [class*="tvtheme-control"], [class*="tvtheme-layout"], .tvcms-theme-control, #tvcms-theme-setting { display: none !important; } /* 2) Bande catégories : tous les wrappers du slider en transparent */ .tvcategory-slider-inner-info-box, .tvcategory-slider-inner, .tvcategory-slider, .tvcategory-slider-wrapper, .tvcategory-slider-content, .tvcategory-main-wrapper { background: transparent !important; box-shadow: none !important; } /* 3) Popup produit flottant promo -> masqué (intrusif, pas premium) */ .tvcms-prod-popup, .tvcms-prod-popup.show { display: none !important; } /* Menu déroulant panier (fonctionnel) -> sombre */ .ttvcmscart-show-dropdown-right, .tvcms-cart-dropdown, .blockcart .cart-dropdown { background-color: var(--et-surface) !important; border: 1px solid var(--et-border) !important; border-radius: var(--et-radius) !important; color: var(--et-text) !important; box-shadow: var(--et-shadow) !important; } .ttvcmscart-show-dropdown-right a, .tvcms-cart-dropdown a { color: var(--et-text) !important; } /* 4) Formulaire de recherche : fond sombre */ .header-search form, form#searchbox, .tvcms-header-search form, .ps-search-form, .tvcmsheader-search-form, .header-top-search form, .ui-autocomplete { background: var(--et-bg) !important; border: 1px solid var(--et-border) !important; border-radius: 999px !important; } .ui-autocomplete { border-radius: var(--et-radius) !important; } .ui-autocomplete .ui-menu-item a { color: var(--et-text) !important; } .ui-autocomplete .ui-menu-item a:hover { background: var(--et-surface-2) !important; color: var(--et-accent-2) !important; } /* ==================================================================== CONTRASTE V2 — textes restés noirs/gris sur fond sombre ==================================================================== */ /* --- Barre du haut : langue / monnaie / compte --- */ .tv-language-btn, .tv-language-span, .tv-currency-btn, .tv-currency-span, .tv-myaccount-btn, .tv-myaccount-btn span, .tv-myaccount-span, .tvheader-language-wrapper, .tvheader-language-wrapper *, .tvheader-currency-wrapper, .tvheader-currency-wrapper *, .tvcms-myaccount-wrapper, .tvcms-myaccount-wrapper * { color: var(--et-text) !important; } .tv-language-btn .expand-more, .tv-currency-btn .expand-more, .tv-myaccount-btn .expand-more, .header .expand-more, .header .material-icons { color: var(--et-text) !important; } /* dropdowns langue / monnaie / compte */ .tv-language-dropdown, .tv-currency-dropdown, .tv-myaccount-dropdown, .tvheader-language-wrapper .dropdown-menu, .tvheader-currency-wrapper .dropdown-menu { background-color: var(--et-surface-2) !important; border: 1px solid var(--et-border) !important; box-shadow: var(--et-shadow) !important; } .tv-language-dropdown a, .tv-currency-dropdown a, .tv-myaccount-dropdown a { color: var(--et-text) !important; } .tv-language-dropdown a:hover, .tv-currency-dropdown a:hover, .tv-myaccount-dropdown a:hover { color: var(--et-accent-2) !important; } /* --- MÉGA-MENU principal (était en noir) : clair + police premium --- */ .container_tv_megamenu a, #tv-menu-horizontal a, ul.menu-content a, #tv-menu-horizontal .menu-content li > a, .tv-menu-horizontal a, .container_tv_megamenu .menu-content li a { color: var(--et-text) !important; font-family: var(--et-font-display) !important; font-weight: 600; } .container_tv_megamenu a:hover, #tv-menu-horizontal a:hover, ul.menu-content a:hover { color: var(--et-accent-2) !important; } /* panneaux déroulants du méga-menu (catégories / sous-catégories) */ #tv-menu-horizontal ul.menu-content ul, .container_tv_megamenu .sub-menu, .tvcms-megamenu-dropdown, .menu-content .sub-menu, #tv-menu-horizontal .tvmenu-dropdown { background-color: var(--et-surface-2) !important; border: 1px solid var(--et-border) !important; opacity: 1 !important; } #tv-menu-horizontal ul ul a, .container_tv_megamenu .sub-menu a, #tv-menu-horizontal .sub-menu a, .menu-content .sub-menu a { color: var(--et-text-soft) !important; font-family: var(--et-font-display) !important; font-weight: 500; } #tv-menu-horizontal ul ul a:hover, .container_tv_megamenu .sub-menu a:hover { color: var(--et-accent-2) !important; } /* --- Slider catégories : SANS cadre + texte clair --- */ .tvcategory-img-block, .tvcategory-slider-inner-info-box, .tvcategory-slider-info-box, .tvcategory-slider-wrapper-info, .item.tvcategory-slider-wrapper-info { background: transparent !important; border: none !important; box-shadow: none !important; } .tvcategory-slider-info-box, .tvcategory-slider-info-box *, .tvcategory-title, .tvcategory-img-block a, .tvcategory-img-block span { color: var(--et-text) !important; } .tvcategory-img-block:hover { transform: translateY(-4px); box-shadow: none !important; } .tvcategory-img-block:hover .tvcategory-title, .tvcategory-img-block:hover a { color: var(--et-accent-2) !important; } /* --- Prix produits (toujours clairs/cyan) --- */ .product-price-and-shipping, .product-price-and-shipping .price, .product-price-and-shipping span:not(.regular-price) { color: var(--et-price) !important; } .product-price-and-shipping .regular-price { color: var(--et-text-soft) !important; } /* --- Footer : titres + contacts lisibles --- */ .tvfooter-title, .tvnewsletter-title, .tvfooter-title *, p.tvnewsletter-title, #footer .tvfooter-title, .footer-title { color: var(--et-text) !important; } .tvfooter-store-link, .tvfooter-store-link-content, .tvfooter-store-link *, #footer p, #footer li, #footer a { color: var(--et-text-soft) !important; } #footer a:hover, .tvfooter-store-link a:hover { color: var(--et-accent-2) !important; } .tvfooter-store-link .material-icons, #footer .material-icons { color: var(--et-accent) !important; } /* --- Titres de section sans cadre blanc (ex. "Nouveautés") --- */ .tvcmstab-title-product, .tvproduct-tab-title, .tvcms-tab-title, .tvcmstab-title-product .tvcms-main-title { background: transparent !important; border: none !important; box-shadow: none !important; } /* --- Anti-tremblement au survol (langue/monnaie/compte) --- */ .tv-language-btn, .tv-currency-btn, .tv-myaccount-btn, .tv-language-btn:hover, .tv-currency-btn:hover, .tv-myaccount-btn:hover { transform: none !important; font-weight: 500 !important; transition: color .18s ease !important; } /* ==================================================================== MOBILE ==================================================================== */ @media (max-width: 991px) { /* bouton menu hamburger : plus de carré blanc, icône visible */ .tvmobile-sliderbar-btn, .tvmobile-sliderbar-btn a, .tvcmsmobile-header-menu, .tvcmsmobile-header-menu a { background: transparent !important; border: none !important; box-shadow: none !important; } .tvmobile-sliderbar-btn i, .tvmobile-sliderbar-btn .material-icons, .tvcmsmobile-header-menu i, .tvcmsmobile-header-menu .material-icons { color: var(--et-text) !important; } /* off-canvas menu mobile sombre */ .tvmobile-slidebar, .tvmobile-sliderbar, .tvmobile-menu-content { background-color: var(--et-surface-2) !important; color: var(--et-text) !important; } .tvmobile-slidebar a, .tvmobile-sliderbar a { color: var(--et-text) !important; } } /* ==================================================================== CONTRASTE V3 — onglets produits, bouton recherche, bandeau promo ==================================================================== */ /* Onglets produits ("Nouveautés"…) : plus de cadre blanc, onglets épurés */ .tvtab-title-wrapper, .tvtabs-products, .tvtab-name, .tvtab-name.active, li.tvtab-name, li.tvtab-name.active { background: transparent !important; border: none !important; box-shadow: none !important; } .tvtabs-products { display: inline-flex !important; gap: 10px; } .tvtabs-products .tvtab-name { padding: 4px 4px 8px !important; cursor: pointer; transition: color .2s ease; } .tvtabs-products .tvtab-name, .tvtabs-products .tvtab-name span { color: var(--et-text-soft) !important; font-family: var(--et-font-display) !important; font-weight: 600; letter-spacing: .02em; } .tvtabs-products .tvtab-name.active, .tvtabs-products .tvtab-name.active span { color: var(--et-accent-2) !important; } .tvtabs-products .tvtab-name.active { border-bottom: 2px solid var(--et-accent) !important; } .tvtabs-products .tvtab-name:hover span { color: var(--et-accent-2) !important; } /* Bouton de recherche : teal au lieu de blanc */ .header-search button, #search_widget button, .tvcms-header-search button, .tvcmsheader-search-form button, button.search-btn, .ps-search button, .tvcms-search-button, .header-top-search button, form[id*="search"] button { background: var(--et-accent) !important; color: #04141A !important; border: none !important; border-radius: 0 999px 999px 0 !important; } .header-search button i, .header-search button .material-icons, .tvcms-search-button i, form[id*="search"] button i, .header-top-search button .material-icons { color: #04141A !important; } /* Bandeau promo du haut (texte clair) */ .header-nav-offer-text, .tvcms-offer-text, .header-top-offer, .top-header-offer, [class*="offer-text"], .tvcmsheader-offer, .tvcms-header-offer-text, .tvcmsheader-offer-text, .header-offer-text * { color: var(--et-text) !important; } .header-nav-offer-text .material-icons, [class*="offer-text"] .material-icons { color: var(--et-accent-2) !important; } /* ==================================================================== NETTETÉ V4 — suppression des halos, texte plus clair, flicker, slider ==================================================================== */ /* 1) Supprimer TOUS les halos de texte (cause du "flou") */ body, body *, #tv-menu-horizontal a, .tvproduct-name, .product-title, h1, h2, h3, h4, h5, h6, a, span, p, li, .tvfooter-title { text-shadow: none !important; } /* 2) Texte plus lumineux et net partout */ :root { --et-text: #F4F8FB; --et-text-soft: #C4D0DB; } /* 3) Titres de produits : blanc franc et net */ .tvproduct-name, .tvproduct-name a, .product-title, .product-title a, .product-name, .product-name a, .product-miniature .product-title a { color: #FFFFFF !important; font-weight: 600 !important; text-shadow: none !important; -webkit-font-smoothing: antialiased; } /* 4) Méga-menu : net, sans halo (top + sous-catégories) */ #tv-menu-horizontal a, .container_tv_megamenu a, ul.menu-content a { text-shadow: none !important; color: var(--et-text) !important; } #tv-menu-horizontal ul ul a, .container_tv_megamenu .sub-menu a, #tv-menu-horizontal .sub-menu a, .menu-content .sub-menu a, .menu-content li li a { color: #DCE6EE !important; text-shadow: none !important; font-weight: 500; } #tv-menu-horizontal ul ul a:hover, .container_tv_megamenu .sub-menu a:hover { color: var(--et-accent-2) !important; } /* 5) Footer : textes/liens lisibles (fini le gris terne) */ #footer a, #footer li, #footer p, .tvfooter-store-link, .tvfooter-store-link *, .tvfooter-link a, #footer .tvfooter-menu a { color: #C4D0DB !important; } #footer a:hover, .tvfooter-link a:hover { color: var(--et-accent-2) !important; } /* 6) Newsletter : champ + placeholder lisibles */ .tvnewsletter input, .ps-emailsubscription input, #footer input[type="text"], #footer input[type="email"], #block-newsletter-label + * input { color: var(--et-text) !important; background: var(--et-bg) !important; border: 1px solid var(--et-border) !important; } .tvnewsletter input::placeholder, .ps-emailsubscription input::placeholder, #footer input::placeholder { color: #A8B6C2 !important; opacity: 1 !important; } /* 7) FLICKER : le JS positionne le déroulant (top:95px inline !important) avec un gap sous le bouton -> au lieu de le déplacer, on garde le survol CONTINU : - le déroulant reste ouvert tant qu'on survole le wrapper (CSS, pas JS) - un pont invisible comble le vide bouton -> déroulant */ .tv-header-account, .tv-account-wrapper, .tvcms-header-myaccount { position: relative !important; } .tv-account-wrapper:hover .tv-account-dropdown, .tvcms-header-myaccount:hover .tv-account-dropdown, .tv-account-wrapper:hover .tv-dropdown { display: block !important; opacity: 1 !important; visibility: visible !important; z-index: 1000 !important; /* écrase l'animation jQuery (height/padding inline) -> ouverture instantanée, plus de tremblement */ height: auto !important; min-height: 0 !important; max-height: none !important; padding-top: 8px !important; padding-bottom: 8px !important; overflow: visible !important; } /* (pont invisible retiré : il interceptait les survols des éléments en dessous) */ /* le déroulant compte est collé sous le bouton pour ne pas perdre le survol */ .tv-account-dropdown, .tv-dropdown { top: 100% !important; margin-top: 0 !important; } /* Contenu du déroulant compte : tout en blanc (Connexion, Comparer, Liste de souhaits + compteurs) — certains liens/spans étaient en noir (rgb(0,0,0)). */ .tv-account-dropdown, .tv-account-dropdown a, .tv-account-dropdown span, .tv-account-dropdown li, .tv-account-dropdown i, .tvhedaer-sign-btn, .tvhedaer-sign-span, .tvheader-sign-btn, .tvheader-sign-span, .tv-account-dropdown .count-product, .tvheader-compare, .tvheader-compare a, .tvheader-compare span, .link_wishlist, .wishtlist_top, .tvdesktop-view-compare, .tvdesktop-wishlist, .tv-account-dropdown .cart-wishlist-number { color: #F4F8FB !important; } .tv-account-dropdown a:hover, .tv-account-dropdown a:hover span, .tvhedaer-sign-btn:hover, .tvheader-compare a:hover { color: var(--et-accent-2) !important; } .tv-account-dropdown i, .tv-account-dropdown .material-icons { color: var(--et-accent) !important; } /* compteur (0) de comparer/wishlist (rendu en noir par le module) */ .count-product, span.count-product, .tvheader-compare .count-product, .compare-count, .product-compare-count { color: #F4F8FB !important; } .btn-unstyle.tv-myaccount-btn, .btn-unstyle.tv-myaccount-btn:hover { transform: none !important; transition: none !important; } /* 7b) Langue / Monnaie : le JS ouvre/ferme le déroulant par à-coups (tremblement sur la home à cause des events du slider). On force l'ouverture EN CSS au survol (prioritaire sur le JS) -> état stable, plus de tremblement. */ .tvheader-language-btn-wrapper, .tvheader-currency-btn-wrapper, .tvheader-language-wrapper, .tvheader-currency-wrapper, .tvcms-header-language, .tvcms-header-currency { position: relative !important; } .tvheader-language-btn-wrapper:hover .tv-language-dropdown, .tvheader-language-wrapper:hover .tv-language-dropdown, .tvheader-language-wrapper:hover .tv-dropdown, .tvcms-header-language:hover .tv-dropdown, .tvheader-currency-btn-wrapper:hover .tv-currency-dropdown, .tvheader-currency-wrapper:hover .tv-currency-dropdown, .tvheader-currency-wrapper:hover .tv-dropdown, .tvcms-header-currency:hover .tv-dropdown { display: block !important; opacity: 1 !important; visibility: visible !important; z-index: 1001 !important; /* écrase l'animation jQuery -> ouverture instantanée, plus de tremblement */ height: auto !important; min-height: 0 !important; max-height: none !important; padding-top: 6px !important; padding-bottom: 6px !important; overflow: visible !important; } /* aucune transition/animation sur ces déroulants -> ouverture instantanée, zéro tremblement */ .tv-language-dropdown, .tv-currency-dropdown, .tv-account-dropdown, .tv-dropdown { transition: none !important; animation: none !important; -webkit-animation: none !important; } .tv-language-btn, .tv-currency-btn, .tv-language-btn:hover, .tv-currency-btn:hover { transform: none !important; transition: none !important; } /* 8) Slider mobile : le titre (h2.animated) est gardé invisible par l'animation (Owl/WOW) qui ne se déclenche pas sur mobile. On neutralise l'animation et on force l'affichage + une zone assez haute. */ @media (max-width: 991px) { .tvcmsmain-slider-wrapper, #tvmain-slider, .tvmain-slider-content-wrapper { overflow: visible !important; } /* le thème masque le bloc texte du slider sur mobile (.tvmain-slider-contant* en display:none) -> on le réaffiche */ .tvmain-slider-contant, .tvmain-slider-contant-left, .tvmain-slider-contant-right, .tvmain-slider-contant-center { display: block !important; } .tvmain-slider-content-inner.active { display: block !important; position: absolute !important; } .tvmain-slider-content-inner.active .tvmain-slider-title, .tvmain-slider-content-inner.active .tvmain-slider-info, h2.tvmain-slider-title, .tvmain-slider-title.animated, .tvmain-slider-info.animated { display: block !important; position: static !important; width: auto !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; min-height: 1em !important; flex: none !important; white-space: normal !important; overflow: visible !important; opacity: 1 !important; visibility: visible !important; transform: none !important; animation: none !important; -webkit-animation: none !important; clip: auto !important; clip-path: none !important; color: #FFFFFF !important; left: auto !important; top: auto !important; right: auto !important; } .tvmain-slider-content-inner.active .tvmain-slider-title { font-size: 1.35rem !important; line-height: 1.25 !important; margin-bottom: .4rem !important; } .tvmain-slider-content-inner.active .tvmain-slider-info { font-size: .9rem !important; } .tvmain-slider-content-inner.active * { color: #FFFFFF !important; } } /* ==================================================================== PAGE PRODUIT — descriptions, détails, caractéristiques lisibles ==================================================================== */ body#product, body.page-product { color: var(--et-text); } .product-description, .product-description *, .product-information, .product-information *, .product-features, .product-features *, .product-features-list, .data-sheet, .data-sheet *, .rte, .rte-content, .rte *, .product-description-short, .product-description-short *, .tab-content, .tab-content *, .product-tabs, .product-tabs *, .tabs .tab-pane, .tabs .tab-pane *, .nav-tabs .nav-link, .product-manufacturer, .product-manufacturer *, .product-reference, .product-reference *, .product-quantity, .product-quantity *, .control-label, .product-actions label, .product-variants, .product-variants *, .product-additional-info, .product-additional-info *, .tvproduct-page-decs, .tvproduct-page-decs *, .product-description-short, .product-description-short *, [id^="product-description-short"], [id^="product-description-short"] *, .product-flags + *, #product .breadcrumb, #product .breadcrumb *, .breadcrumb, .breadcrumb a, .breadcrumb li, .breadcrumb li a, .breadcrumb span { color: var(--et-text) !important; } .product-features dl.data-sheet dt, .product-features dl.data-sheet dd { background: var(--et-surface) !important; border-color: var(--et-border) !important; color: var(--et-text) !important; } #product .current-price, #product .current-price *, #product .product-price, .product-prices .price, .product-prices .current-price-value { color: var(--et-price) !important; } .product-prices .regular-price { color: var(--et-text-soft) !important; } .breadcrumb a:hover, .breadcrumb [aria-current], .breadcrumb li:last-child a { color: var(--et-accent-2) !important; } /* --- Blocs réassurance (Paiement sécurisé / Livraison / Retours) : fond blanc -> sombre --- */ .blockreassurance, .block-reassurance, .blockreassurance_product, .block-reassurance-item, .blockreassurance-item, [class*="reassurance"] > div, .block-reassurance > div { background-color: var(--et-surface) !important; border: 1px solid var(--et-border) !important; border-radius: var(--et-radius) !important; color: var(--et-text) !important; } .block-reassurance-item *, .blockreassurance *, .blockreassurance_product * { color: var(--et-text) !important; } .block-reassurance-item span:last-child, .block-reassurance-item p { color: var(--et-text-soft) !important; } /* Mise en page premium des items réassurance (icône à gauche, titre + desc empilés) */ .blockreassurance_product .item-product, .block-reassurance .item-product, .block-reassurance-item { display: block !important; position: relative !important; padding: 12px 14px 12px 52px !important; min-height: 34px; } .blockreassurance_product .item-product img, .block-reassurance .item-product img, .blockreassurance_product .item-product .svg, .block-reassurance-item img.svg, .block-reassurance-item img { position: absolute !important; left: 14px !important; top: 50% !important; transform: translateY(-50%) !important; width: 28px !important; height: 28px !important; margin: 0 !important; } .blockreassurance_product .item-product .block-title, .block-reassurance .item-product .block-title, .block-reassurance-item .block-title { display: block !important; font-weight: 600 !important; color: var(--et-text) !important; margin: 0 0 2px !important; line-height: 1.3 !important; font-family: var(--et-font-display) !important; font-size: .98rem !important; } .blockreassurance_product .item-product p:not(.block-title), .block-reassurance .item-product p:not(.block-title), .block-reassurance-item p:not(.block-title), .block-reassurance-item span:not(.block-title) { display: block !important; margin: 0 !important; color: var(--et-text-soft) !important; font-size: .82rem !important; line-height: 1.4 !important; } /* espacement entre les 3 panneaux */ .blockreassurance_product > div, .block-reassurance > div { margin-bottom: 10px; padding: 12px 16px !important; } /* Boutique non assujettie à la TVA (art. 293 B du CGI) : prix nets -> on masque le suffixe HT/TTC */ .tvproduct-tax-label { display: none !important; } /* icônes réassurance (svg/img) -> teal/visible */ .block-reassurance svg, .block-reassurance-item svg, .blockreassurance svg { fill: var(--et-accent) !important; } .block-reassurance svg path, .block-reassurance-item svg path { fill: var(--et-accent) !important; stroke: var(--et-accent) !important; } .block-reassurance img, .block-reassurance-item img { filter: brightness(0) saturate(100%) invert(62%) sepia(38%) saturate(900%) hue-rotate(140deg); } /* --- Onglets produit (Description / Détails / Avis) : fond blanc -> sombre --- */ .nav-tabs, .product-tabs .nav-tabs, .tabs .nav-tabs { border-bottom: 1px solid var(--et-border) !important; background: transparent !important; } .nav-tabs .nav-link, .product-tabs .nav-link, .tabs .nav-link { background-color: transparent !important; color: var(--et-text-soft) !important; border: 1px solid transparent !important; } .nav-tabs .nav-link:hover { color: var(--et-accent-2) !important; } .nav-tabs .nav-link.active, .product-tabs .nav-link.active, .tabs .nav-link.active { background-color: var(--et-surface) !important; color: var(--et-accent-2) !important; border-color: var(--et-border) var(--et-border) var(--et-surface) !important; } .tab-content, .tab-pane, #product-details, .product-tabs .tab-content { background-color: transparent !important; color: var(--et-text) !important; } .tab-content p, .tab-content li, .tab-content span, .tab-content td, .tab-content div, .tab-pane p, .tab-pane li, .tab-pane span, #product-details p, #product-details li { color: var(--et-text) !important; } /* ==================================================================== PAGE PANIER — barres, lignes produit, totaux lisibles ==================================================================== */ body#cart, body.page-cart { color: var(--et-text); } .cart-grid, .cart-grid *, .cart-item, .cart-item *, .cart-overview, .cart-overview *, .cart-summary, .cart-summary *, .product-line-info, .product-line-info *, .cart-summary-line, .cart-summary-line *, .cart-detailed-totals, .cart-detailed-totals *, .cart-grid-right, .cart-grid-right *, .cart-grid-body *, .product-line-grid, .product-line-grid * { color: var(--et-text) !important; } /* surfaces & barres du panier -> sombres (fini le blanc/flou) */ .cart-grid-body, .cart-container, .cart-item, .card.cart-summary, .cart-grid-right .card, .cart-overview, .cart-summary-products, .block-promo, .product-line-grid, .cart-grid-body .card, .cart-grid-body .row, .tvcms-cart-wrapper, .cart-products-count { background-color: var(--et-surface) !important; border-color: var(--et-border) !important; } .cart-summary-line.cart-total .value, .cart-total .value, .total-line .price, .cart-summary-totals .value { color: var(--et-price) !important; } /* image produit du panier reste claire pour la photo */ .cart-item .product-image, .cart-item img, .product-line-grid-image { background:#fff !important; border-radius:10px; } /* ==================================================================== MODALE « Produit ajouté au panier » (#blockcart-modal) — fond blanc -> sombre ==================================================================== */ #blockcart-modal .modal-content { background-color: var(--et-surface) !important; border: 1px solid var(--et-border) !important; color: var(--et-text) !important; border-radius: var(--et-radius) !important; } #blockcart-modal .modal-header { background-color: var(--et-surface-2) !important; border-bottom: 1px solid var(--et-border) !important; } #blockcart-modal, #blockcart-modal .modal-title, #blockcart-modal .modal-body, #blockcart-modal .modal-footer, #blockcart-modal .cart-content, #blockcart-modal .cart-content *, #blockcart-modal .product-name, #blockcart-modal .label, #blockcart-modal p, #blockcart-modal span, #blockcart-modal strong, #blockcart-modal li { color: var(--et-text) !important; } #blockcart-modal .cart-content .value, #blockcart-modal .product-total .value, #blockcart-modal .cart-products-count + .value, #blockcart-modal .product-price { color: var(--et-price) !important; } #blockcart-modal .close, #blockcart-modal .close span, #blockcart-modal button.close, #blockcart-modal .modal-header .material-icons { color: var(--et-text) !important; opacity: 1 !important; text-shadow: none !important; } /* image produit dans la modale reste claire */ #blockcart-modal .product-image img, #blockcart-modal img.product-image { background: #fff !important; border-radius: 8px; } /* boutons de la modale */ #blockcart-modal .btn-primary, #blockcart-modal .cart-content-btn .btn-primary, #blockcart-modal a.btn-primary { background-color: var(--et-accent) !important; color: #04141A !important; border: none !important; border-radius: 999px !important; font-weight: 700; } #blockcart-modal .btn-primary:hover { background-color: var(--et-accent-2) !important; } #blockcart-modal .btn-secondary, #blockcart-modal .cart-content-btn .btn-secondary { background-color: transparent !important; color: var(--et-accent-2) !important; border: 1px solid var(--et-accent) !important; border-radius: 999px !important; } #blockcart-modal .btn-secondary:hover { background-color: var(--et-accent) !important; color: #04141A !important; } /* ==================================================================== H1 SEO — accueil (masqué visuellement) + catégorie (titre premium) ==================================================================== */ .et-home-h1 { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px; } .et-category-title { font-family: var(--et-font-display) !important; color: var(--et-text) !important; font-size: 1.9rem; font-weight: 700; line-height: 1.2; margin: .4rem 0 1.4rem; letter-spacing: .01em; } /* éviter le doublon de titre sur la catégorie (l'ancien div) */ body#category .tv-all-page-main-title, body.category-id .tv-all-page-main-title { display: none !important; } /* ---- Bloc marque du footer (logo + slogan) premium ---- */ .et-footer-brand { margin-bottom: 1.5rem; } .et-footer-logo { display: inline-block; margin-bottom: .9rem; } .et-footer-logo img { max-width: 210px; height: auto; } .et-footer-tagline { color: var(--et-text-soft) !important; font-size: .9rem; line-height: 1.6; max-width: 320px; margin: 0; } /* le bloc marque occupe sa colonne dans le footer */ .tvfooter-storelogo-weapper { min-width: 240px; } /* ==================================================================== FLÈCHES DE DÉFILEMENT (slider + carrousels) — étaient blanc sur blanc ==================================================================== */ .tvcmsprev-btn, .tvcmsnext-btn, .tvcategory-slider-prev, .tvcategory-slider-next, .tvmain-slider-prev, .tvmain-slider-next, .tvcmsmain-prev, .tvcmsmain-next, .owl-prev, .owl-next, .main-prev, .main-next, .slick-prev, .slick-next, [class*="slider-prev"] > .tvcmsprev-btn, [class*="slider-next"] > .tvcmsnext-btn { background-color: var(--et-surface-2) !important; border: 1px solid var(--et-border) !important; color: var(--et-text) !important; border-radius: 50% !important; width: 38px !important; height: 38px !important; display: flex !important; align-items: center; justify-content: center; box-shadow: var(--et-shadow); transition: background-color .2s ease, border-color .2s ease; transform: none !important; opacity: 1 !important; } .tvcmsprev-btn i, .tvcmsnext-btn i, .tvcategory-slider-prev i, .tvcategory-slider-next i, .tvmain-slider-prev i, .tvmain-slider-next i, .tvcmsmain-prev i, .tvcmsmain-next i, .owl-prev i, .owl-next i, .main-prev i, .main-next i, .tvcmsprev-btn .material-icons, .tvcmsnext-btn .material-icons { color: var(--et-text) !important; font-size: 22px !important; line-height: 1 !important; } /* survol : teal lumineux */ .tvcmsprev-btn:hover, .tvcmsnext-btn:hover, .tvcategory-slider-prev:hover, .tvcategory-slider-next:hover, .tvmain-slider-prev:hover, .tvmain-slider-next:hover, .owl-prev:hover, .owl-next:hover, .main-prev:hover, .main-next:hover { background-color: var(--et-accent) !important; border-color: var(--et-accent) !important; transform: none !important; /* aucun déplacement au survol */ } .tvcmsprev-btn:hover i, .tvcmsnext-btn:hover i, .tvcategory-slider-prev:hover i, .tvcategory-slider-next:hover i, .tvmain-slider-prev:hover i, .tvmain-slider-next:hover i, .owl-prev:hover i, .owl-next:hover i { color: #04141A !important; } /* owl arrows par défaut (gris) -> alignées sur le thème */ .owl-prev, .owl-next { font-size: 0 !important; } /* masque un éventuel texte, garde l'icône */ /* ==================================================================== ACCESSIBILITÉ — focus clavier visible (anneau teal), sans gêner la souris ==================================================================== */ a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible, .btn:focus-visible, summary:focus-visible, .tv-myaccount-btn:focus-visible, .tv-language-btn:focus-visible, .tv-currency-btn:focus-visible, #tv-menu-horizontal a:focus-visible, .tvproduct-wrapper a:focus-visible, .facet a:focus-visible { outline: 2px solid var(--et-accent-2) !important; outline-offset: 2px !important; border-radius: 4px; box-shadow: 0 0 0 4px rgba(63,210,226,.25) !important; } /* le focus souris reste discret (focus-visible gère le clavier) */ a:focus:not(:focus-visible), button:focus:not(:focus-visible) { outline: none; box-shadow: none; } /* champ de recherche : focus net */ .header-search input:focus-visible, #search_widget input:focus-visible { outline: none !important; border-color: var(--et-accent-2) !important; box-shadow: var(--et-glow) !important; } /* ==================================================================== AUDIT Lighthouse/axe — CLS (dimensions images) + contraste WCAG AA ==================================================================== */ /* CLS : réserver l'espace des visuels -> plus de saut de mise en page */ .tvproduct-image, .thumbnail.product-thumbnail, .product-thumbnail, .tvcategory-img-block, .tvcategory-slider-wrapper-info .tvcategory-img-block { aspect-ratio: 1 / 1; } .tvproduct-image img, .product-thumbnail img, .tvcategory-img-block img { width: 100% !important; height: 100% !important; object-fit: contain !important; } .tvproduct-image, .product-thumbnail { overflow: hidden; } /* Contraste WCAG AA : footer (adresse/contacts) + avis produit éclaircis */ .tvfooter-addresses, .tvfooter-addresses *, .tvfooter-store-link, .tvfooter-store-link *, .tvfooter-store-link-content, .tvfooter-store-link-content *, #footer a, #footer li, #footer p, .tvfooter-link a { color: #CBD8E2 !important; } .tvall-product-review, .product-comments-additional-info, .tvall-product-review *, .comments_note, .star_content + *, .reviews_note { color: #CBD8E2 !important; } #footer a:hover, .tvfooter-link a:hover { color: var(--et-accent-2) !important; } /* ==================================================================== LIENS DE CONTENU — cyan lisible (CMS, descriptions, légal, RTE) ==================================================================== */ .rte a, .rte-content a, .cms-content a, .block-cms a, .page-cms a, #content .page-content a, .product-description a, .product-information a, .product-features a, .cms-block a, .checkout a, .page-customer-account a, .address a, .order-confirmation a { color: var(--et-accent-2) !important; text-decoration: none; } .rte a:hover, .cms-content a:hover, #content .page-content a:hover, .product-description a:hover { color: #7FE6F0 !important; text-decoration: underline; } /* ==================================================================== PAGES CMS (Mentions légales, Livraison, CGV, À propos…) — texte noir saisi dans le contenu -> tout passer en clair (liens en cyan) ==================================================================== */ .cms, .cms p, .cms div, .cms span, .cms li, .cms td, .cms th, .cms dd, .cms dt, .cms h1, .cms h2, .cms h3, .cms h4, .cms h5, .cms h6, .cms strong, .cms b, .cms em, .cms u, .cms small, .cms blockquote, .cms-content, .cms-content p, .cms-content div, .cms-content span, .cms-content li, .cms-content h1, .cms-content h2, .cms-content h3, .cms-content h4, .cms-content strong, .rte p, .rte div, .rte span, .rte li, .rte td, .rte h1, .rte h2, .rte h3, .rte h4, .rte strong, .rte b, .page-cms p, .page-cms div, .page-cms span, .page-cms li, .page-cms h1, .page-cms h2, .page-cms h3 { color: var(--et-text) !important; } .cms a, .cms-content a, .rte a, .page-cms a { color: var(--et-accent-2) !important; } /* titres CMS en police premium */ .cms h1, .cms h2, .cms h3, .cms-content h1, .cms-content h2, .cms-content h3, .rte h2, .rte h3 { font-family: var(--et-font-display) !important; } /* ==================================================================== PAGES CATÉGORIE / LISTING / RECHERCHE / CONTACT — fonds blancs -> sombre (même couleur que l'accueil sur toute la boutique) ==================================================================== */ .block-categories, .block-category, .block-category.card, .tv-category-main-div, .tvcms-category-header, .category-header, .category-top, .subcategories, .tvsubcategory-wrapper, #js-product-list-top, .products-selection, .products-sort-order, #search_filters, .card.card-block, #content.page-content.card, #left-column .block, #left-column .block-categories, .category-sub-menu, .contact-rich, .contact-form, .page-content.page-cms, .block-category .category-cover, .tvcategory-description { background-color: var(--et-surface) !important; border-color: var(--et-border) !important; color: var(--et-text) !important; } /* texte clair dans ces blocs */ .block-categories *, .block-category *, .tv-category-main-div *, .products-selection *, .subcategories *, .tvsubcategory-wrapper *, #left-column *, .category-sub-menu *, .contact-rich *, .contact-form *, #js-product-list-top * { color: var(--et-text) !important; } /* liens & éléments interactifs gardent l'accent */ .block-categories a:hover, #left-column a:hover, .subcategories a:hover { color: var(--et-accent-2) !important; } .contact-rich a, .contact-form a { color: var(--et-accent-2) !important; } /* tuiles image produit RESTENT claires (photos) */ .tvproduct-image, .thumbnail.product-thumbnail, .product-thumbnail { background: #fff !important; } /* le