.product_list.list .ajax_block_product .pro_first_box{max-width: 280px;}.product_list.list .ajax_block_product .pro_second_box{margin-left: 300px;}.is_rtl .product_list.list .ajax_block_product .pro_second_box{margin-left:0;margin-right: 300px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.cart_default, .product_list.grid .ajax_block_product .pro_outer_box.cart_default{max-width: 70px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.cart_default_2x, .product_list.grid .ajax_block_product .pro_outer_box.cart_default_2x{max-width: 140px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.home_default, .product_list.grid .ajax_block_product .pro_outer_box.home_default{max-width: 280px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.home_default_2x, .product_list.grid .ajax_block_product .pro_outer_box.home_default_2x{max-width: 560px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.large_default, .product_list.grid .ajax_block_product .pro_outer_box.large_default{max-width: 700px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.large_default_2x, .product_list.grid .ajax_block_product .pro_outer_box.large_default_2x{max-width: 1200px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.medium_default, .product_list.grid .ajax_block_product .pro_outer_box.medium_default{max-width: 370px;}.images-container .pro_gallery_top_inner, .images-container .pro_gallery_thumbs_horizontal{margin-left: auto;margin-right:auto;}.images-container.pro_number_1 .pro_gallery_top_inner, .images-container.pro_number_1 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_2 .pro_gallery_top_inner, .images-container.pro_number_2 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_3 .pro_gallery_top_inner, .images-container.pro_number_3 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_4 .pro_gallery_top_inner, .images-container.pro_number_4 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_5 .pro_gallery_top_inner, .images-container.pro_number_5 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_6 .pro_gallery_top_inner, .images-container.pro_number_6 .pro_gallery_thumbs_horizontal{max-width: 370px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.medium_default_2x, .product_list.grid .ajax_block_product .pro_outer_box.medium_default_2x{max-width: 740px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.small_default, .product_list.grid .ajax_block_product .pro_outer_box.small_default{max-width: 105px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.small_default_2x, .product_list.grid .ajax_block_product .pro_outer_box.small_default_2x{max-width: 210px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.superlarge_default, .product_list.grid .ajax_block_product .pro_outer_box.superlarge_default{max-width: 1200px;}.products_sldier_swiper .ajax_block_product .pro_outer_box.superlarge_default_2x, .product_list.grid .ajax_block_product .pro_outer_box.superlarge_default_2x{max-width: 1200px;}.st_image_scrolling_item{margin-bottom:10px;}.st_image_scrolling_wrap .st_image_scrolling_item {padding-left:5px;padding-right:5px;}.st_image_scrolling_wrap .row{margin-left:-5px;margin-right:-5px;}.featured_categories_item .pro_outer_box.category_default{max-width: 140px;}.featured_categories_item .pro_outer_box.category_default_2x{max-width: 280px;}.featured_categories_item .pro_outer_box.home_default{max-width: 280px;}.featured_categories_item .pro_outer_box.home_default_2x{max-width: 560px;}.featured_categories_item .pro_outer_box.medium_default{max-width: 370px;}.featured_categories_item .pro_outer_box.medium_default_2x{max-width: 740px;}body{}.price,#our_price_display,.old_price,.sale_percentage{}.btn.ajax_add_to_cart_button, .btn.add-to-cart, .btn.view_button{font-family:"Signika", Tahoma, sans-serif, Arial;font-weight:400;}.style_wide .ma_level_1{font-family: "Signika";font-weight:400;}.title_block .title_block_inner, .page_heading, .product_info_tabs .nav-tabs .nav-link, .pc_slider_block_container .nav-tabs .nav-link, .heading_font{font-weight:400;text-transform: uppercase;font-family: "Signika";}.st-menu-title{font-weight:400;text-transform: uppercase;font-family: "Signika";}.title_block .title_block_inner, .page_heading {}.st_mega_menu .ma_level_0, .mobile_bar_tri_text, #st_mega_menu_column_mobile .mo_advanced_ma_level_0{text-transform: uppercase;font-family: "Signika";font-weight:400;}#st_mobile_menu .mo_ma_level_0{text-transform: uppercase;font-family: "Signika";}.style_wide .ma_level_1{text-transform: uppercase;}.style_wide .ma_level_1{}.style_wide .mu_level_2 a.ma_item, .stmenu_multi_level a.ma_item,.mo_sub_a{}.mv_item{}.product_name_wrap .product_name{}.title_style_0,.title_style_0 .title_block_inner{border-bottom-width:2px;}.title_style_0 .title_block_inner{margin-bottom:-2px;}#footer-secondary .title_block .title_block_inner{color: #3b252a;}a:hover, a.link_color:hover, button.link_color:hover, .additional-information a.link_color:hover, .theme_color, a.theme_color, a.theme_color:hover, .st_added, .add_to_love.st_added, .add_to_love.st_added:hover, .add_to_wishlit.st_added, .add_to_wishlit.st_added:hover, .stcompare_add.st_added, .stcompare_add.st_added:hover, .dropdown_wrap.open .dropdown_tri, .ajax_block_product .s_title_block a:hover, .block_blog .s_title_block a:hover, .btn-link:hover{color: #bab0a1;}a.text_color:hover{color: #bab0a1;}.title_block a.title_block_inner:hover{color: #bab0a1;}#st_mega_menu_wrap .ml_level_0.current .ma_level_0,#st_mega_menu_wrap .ma_level_0:hover{border-bottom-color:#bab0a1;}.checkout-step .sttab_2_1 .nav-tabs .nav-link.active, .checkout-step .sttab_2_1 .nav-tabs .nav-link:hover, .checkout-step .sttab_2_1 .nav-tabs .nav-link:focus{color:#bab0a1;}.btn-white:hover,.btn-white:focus{}.btn,.hover_fly_btn{text-transform: uppercase;}.hover_fly .hover_fly_btn,.hover_fly_0:hover .hover_fly_btn:first-child{color: #ffffff;}.hover_fly .hover_fly_btn.add_to_love, .hover_fly .hover_fly_btn.add_to_love:hover, .hover_fly .hover_fly_btn.add_to_wishlit, .hover_fly .hover_fly_btn.add_to_wishlit:hover, .hover_fly .hover_fly_btn.stcompare_add, .hover_fly .hover_fly_btn.stcompare_add:hover{color: #ffffff;}.hover_fly_0 .hover_fly_btn:first-child, .hover_fly_0:hover .hover_fly_btn:first-child:hover{color: #bab0a1;}.hover_fly .hover_fly_btn:hover{color: #bab0a1;}.hover_fly .hover_fly_btn.add_to_love.st_added, .hover_fly .hover_fly_btn.add_to_love.st_added:hover, .hover_fly .hover_fly_btn.add_to_wishlit.st_added, .hover_fly .hover_fly_btn.add_to_wishlit.st_added:hover, .hover_fly .hover_fly_btn.stcompare_add.st_added, .hover_fly .hover_fly_btn.stcompare_add.st_added:hover{color: #bab0a1;}.hover_fly, .hover_fly .hover_fly_btn,.hover_fly_0:hover .hover_fly_btn:first-child{background-color: #333333;}.hover_fly .hover_fly_btn.add_to_love, .hover_fly .hover_fly_btn.add_to_love:hover, .hover_fly .hover_fly_btn.add_to_wishlit, .hover_fly .hover_fly_btn.add_to_wishlit:hover, .hover_fly .hover_fly_btn.stcompare_add, .hover_fly .hover_fly_btn.stcompare_add:hover{background-color: #333333;}.hover_fly_0 .hover_fly_btn:first-child, .hover_fly_0:hover .hover_fly_btn:first-child:hover{background-color: #333333;}.hover_fly .hover_fly_btn:hover{background-color: #333333!important;}.hover_fly .hover_fly_btn.add_to_love.st_added, .hover_fly .hover_fly_btn.add_to_love.st_added:hover, .hover_fly .hover_fly_btn.add_to_wishlit.st_added, .hover_fly .hover_fly_btn.add_to_wishlit.st_added:hover, .hover_fly .hover_fly_btn.stcompare_add.st_added, .hover_fly .hover_fly_btn.stcompare_add.st_added:hover{background-color: #333333;}#st_header .header_item{text-transform: uppercase;}#st_header #top_bar, #st_header #top_bar #top_bar_container{border-bottom:none;}#st_mega_menu_wrap .ml_level_0.current .ma_level_0,#st_mega_menu_wrap .ma_level_0:hover{color:#bab0a1;border-bottom-color:#bab0a1;}#st_mega_menu_wrap .stmenu_sub{border-top-width:0px;}#st_mega_menu_wrap .ma_level_0{margin-bottom:-0px;border-bottom-width:0px;}#top_extra .st_mega_menu_container{border-bottom-width:0px;}#header_primary #st_mega_menu_wrap{border-bottom-width:0px;}#st_ma_0{ text-align: left; }#footer-secondary {border-top-width:1px;border-top-style: solid;}#footer-secondary, #footer-secondary #footer-secondary-container{border-top-color:#f0dadd;}#left_column.sidebar_opened,#right_column.sidebar_opened{background-color:#fff;}#st_header.stuck, #top_extra .st_mega_menu_container.stuck, .steasym_main.stuck{-webkit-box-shadow: 0px 1px 4px rgba(0,0,0,0.1); -moz-box-shadow: 0px 1px 4px rgba(0,0,0,0.1); box-shadow: 0px 1px 4px rgba(0,0,0,0.1); }#footer-primary{background-image:url(https://preprod.foliessecretes.fr/stupload/stthemeeditor/dca39179c71a6177fce6aa31a3562cc3.jpg);}#footer-primary{background-repeat:no-repeat;}#footer-primary {border-top-width:1px;border-top-style: solid;}#footer-primary{background-color:#fff7f8;}#footer-secondary{background-repeat:no-repeat;}#footer-tertiary{background-repeat:no-repeat;}#footer-tertiary {border-top-width:1px;border-top-style: solid;}#footer-bottom{background-repeat:no-repeat;}#st_header #header_primary_container{height: 100px;}.fto-glyph.icon_btn:before{ content: "\e868"; }.fto-ajust.icon_btn{ display: none; }.quick-view .fto-search-1.icon_btn:before{ content: "\e80b"; }.fto-eye-2.icon_btn:before{ content: "\e818"; }.fto-history.icon_btn:before{ content: "\e87a"; }body#index .header-container{ margin-bottom: 0px; }.products_sldier_swiper .pro_outer_box:hover .pro_second_box,.product_list.grid .pro_outer_box:hover .pro_second_box{ background-color: #f2f2f2; }.products_sldier_swiper{margin: -10px; padding: 10px; }.product_view_more_box{margin-top:10px;}.products_slider .swiper-button-lr.swiper-navigation_visible>.swiper-button-next, .swiper-button-lr:hover>.swiper-button-next{right:10px;}.is_rtl .products_slider .swiper-button-lr.swiper-navigation_visible>.swiper-button-next, .is_rtl .swiper-button-lr:hover>.swiper-button-next{left:10px;}.products_slider .swiper-button-lr.swiper-navigation_visible>.swiper-button-prev, .swiper-button-lr:hover>.swiper-button-prev{left:10px;}.is_rtl .products_slider .swiper-button-lr.swiper-navigation_visible>.swiper-button-prev, .is_rtl .swiper-button-lr:hover>.swiper-button-prev{right:10px;}.products_sldier_swiper .ajax_block_product.swiper-slide-visible .pro_outer_box:hover, .product_list.grid .ajax_block_product .pro_outer_box:hover, .product_list.list .ajax_block_product:hover{-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.3); -moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.3); box-shadow: 0px 0px 10px rgba(0,0,0,0.3); }.boxed_page_wrapper{-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.1); box-shadow: 0px 0px 3px rgba(0,0,0,0.1); }#mobile_bar_top{ height: 50px;}.pro_gallery_thumbs_vertical .swiper-container{height: 574px;}.pro_gallery_thumbs_vertical .swiper-slide{height: 82px;}.ajax_block_product .s_title_block a,.pro_column_right .s_title_block a{}body#authentication .columns-container{padding-top: 38px;}body#authentication .columns-container{padding-bottom: 50px;}.checkout-step .sttab_2_1 .nav-tabs .nav-link.active, .checkout-step .sttab_2_1 .nav-tabs .nav-link:hover, .checkout-step .sttab_2_1 .nav-tabs .nav-link:focus{border-bottom-color: #ffffff;}@media (max-width: 1219px) { .images-container.pro_number_lg_1 .pro_gallery_top_inner, .images-container.pro_number_lg_1 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_lg_2 .pro_gallery_top_inner, .images-container.pro_number_lg_2 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_lg_3 .pro_gallery_top_inner, .images-container.pro_number_lg_3 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_lg_4 .pro_gallery_top_inner, .images-container.pro_number_lg_4 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_lg_5 .pro_gallery_top_inner, .images-container.pro_number_lg_5 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_lg_6 .pro_gallery_top_inner, .images-container.pro_number_lg_6 .pro_gallery_thumbs_horizontal{max-width: 370px;} }@media (max-width: 991px) { .images-container.pro_number_md_1 .pro_gallery_top_inner, .images-container.pro_number_md_1 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_md_2 .pro_gallery_top_inner, .images-container.pro_number_md_2 .pro_gallery_thumbs_horizontal{max-width: 750px;} .images-container.pro_number_md_3 .pro_gallery_top_inner, .images-container.pro_number_md_3 .pro_gallery_thumbs_horizontal{max-width: 750px;} .images-container.pro_number_md_4 .pro_gallery_top_inner, .images-container.pro_number_md_4 .pro_gallery_thumbs_horizontal{max-width: 750px;} .images-container.pro_number_md_5 .pro_gallery_top_inner, .images-container.pro_number_md_5 .pro_gallery_thumbs_horizontal{max-width: 750px;} .images-container.pro_number_md_6 .pro_gallery_top_inner, .images-container.pro_number_md_6 .pro_gallery_thumbs_horizontal{max-width: 750px;} }@media (max-width: 767px) { .images-container.pro_number_sm_1 .pro_gallery_top_inner, .images-container.pro_number_sm_1 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_sm_2 .pro_gallery_top_inner, .images-container.pro_number_sm_2 .pro_gallery_thumbs_horizontal{max-width: 750px;} .images-container.pro_number_sm_3 .pro_gallery_top_inner, .images-container.pro_number_sm_3 .pro_gallery_thumbs_horizontal{max-width: 750px;} .images-container.pro_number_sm_4 .pro_gallery_top_inner, .images-container.pro_number_sm_4 .pro_gallery_thumbs_horizontal{max-width: 750px;} .images-container.pro_number_sm_5 .pro_gallery_top_inner, .images-container.pro_number_sm_5 .pro_gallery_thumbs_horizontal{max-width: 750px;} .images-container.pro_number_sm_6 .pro_gallery_top_inner, .images-container.pro_number_sm_6 .pro_gallery_thumbs_horizontal{max-width: 750px;} }@media (max-width: 479px) { .images-container.pro_number_xs_1 .pro_gallery_top_inner, .images-container.pro_number_xs_1 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_xs_2 .pro_gallery_top_inner, .images-container.pro_number_xs_2 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_xs_3 .pro_gallery_top_inner, .images-container.pro_number_xs_3 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_xs_4 .pro_gallery_top_inner, .images-container.pro_number_xs_4 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_xs_5 .pro_gallery_top_inner, .images-container.pro_number_xs_5 .pro_gallery_thumbs_horizontal{max-width: 370px;} .images-container.pro_number_xs_6 .pro_gallery_top_inner, .images-container.pro_number_xs_6 .pro_gallery_thumbs_horizontal{max-width: 370px;} }/* ===================================================== THEME.CSS - FOLIES SECRÈTES Version nettoyée - 04/05/2026 Nettoyage ciblé footer : anciens hooks EasyContent supprimés, footer global Tracking code conservé, raccourcis catégories conservés. ===================================================== */ /* ===================================================== PALETTE SAUGE PREMIUM - FOLIES SECRÈTES Inspirée du slider sauge / ivoire / doré Ivoire fond : #f7f4ec Ivoire clair : #fbfaf6 Sauge principal : #8f9677 Sauge foncé : #6f765c Sauge très doux : #eef0e6 Bordures douces : #ded9ca Doré premium : #c7a45a Texte chaud : #2b2b2b ===================================================== */ /* ===================================================== 01 - HERO HOMEPAGE ===================================================== */ .fs-hero-caption { width: 100%; max-width: 520px; margin-left: 0; margin-top: -20px; text-align: left; position: relative; z-index: 5; transform: translateX(-28vw); } .fs-hero-kicker { font-size: 13px; text-transform: uppercase; letter-spacing: 1.5px; color: #8f9677; font-weight: 600; margin-bottom: 12px; } .fs-hero-caption h1 { font-family: Georgia, "Times New Roman", serif; font-size: 52px; line-height: 1.08; font-weight: 400; color: #2b2b2b; margin: 0 0 18px 0; } .fs-hero-caption h1 span { color: #8f9677; } .fs-hero-text { font-size: 17px; line-height: 1.6; color: #555; max-width: 430px; margin: 0 0 28px 0; } .fs-hero-btn { display: inline-block; background: #8f9677; color: #fff !important; padding: 14px 30px; border-radius: 30px; font-size: 13px; font-weight: 700; text-transform: uppercase; text-decoration: none !important; box-shadow: 0 8px 20px rgba(143, 150, 119, 0.25); } .fs-hero-btn:hover { background: #8f9677; } .st_swiper_slider .swiper-pagination, .swiper-pagination, .swiper-pagination-bullets { display: none !important; } /* ===================================================== 02 - CATÉGORIES RAPIDES ===================================================== */ .fs-category-shortcuts { max-width: 1180px; margin: 18px auto 18px !important; padding: 0 20px; display: grid; grid-template-columns: repeat(7, 1fr); gap: 22px; text-align: center; } .fs-category-item { text-decoration: none; color: #4a4a4a; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; } .fs-category-icon { width: 72px; height: 72px; margin: 0 auto 12px; border-radius: 50%; background: #eef0e6; color: #8f9677; display: flex; align-items: center; justify-content: center; font-size: 30px; transition: all .25s ease; } .fs-category-item:hover { color: #8f9677; } .fs-category-item:hover .fs-category-icon { background: #8f9677; color: #fff; transform: translateY(-3px); } /* ===================================================== 03 - LES INCONTOURNABLES ===================================================== */ .fs-best-section { max-width: 1280px; margin: 0 auto 26px !important; padding: 0 24px; } .fs-section-heading { position: relative; margin-bottom: 22px; } .fs-kicker { color: #8f9677; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 4px; } .fs-section-heading h2 { font-family: Georgia, "Times New Roman", serif; font-size: 34px; line-height: 1.1; color: #2d2d2d; margin: 0; font-weight: 400; } .fs-see-all { position: absolute; right: 0; bottom: 6px; color: #3d3d3d; text-decoration: none; font-weight: 700; font-size: 13px; text-transform: uppercase; } .fs-see-all:hover { color: #8f9677; } .fs-best-grid { display: grid; grid-template-columns: 1.55fr 1fr; gap: 28px; align-items: stretch; } .fs-products-preview { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; } .fs-product-card { position: relative; transition: all .3s ease; } .fs-product-card:hover { transform: translateY(-5px); } .fs-product-image { display: block !important; width: 100% !important; height: 190px !important; min-height: 190px !important; border-radius: 8px !important; background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; overflow: hidden !important; position: relative; margin-bottom: 12px; transition: all .35s ease; } .fs-product-card:hover .fs-product-image { transform: scale(1.03); filter: brightness(.96); } .fs-product-overlay-btn { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%) translateY(16px); background: #8f9677; color: #fff; padding: 10px 18px; border-radius: 25px; font-size: 12px; font-weight: 700; opacity: 0; transition: all .3s ease; white-space: nowrap; } .fs-product-card:hover .fs-product-overlay-btn { opacity: 1; transform: translateX(-50%) translateY(0); } .fs-product-badge { position: absolute; top: 9px; left: 9px; z-index: 2; background: #8f9677; color: #fff; border-radius: 20px; padding: 5px 10px; font-size: 10px; text-transform: uppercase; font-weight: 700; } .fs-stars { color: #c7a45a; font-size: 12px; margin-bottom: 5px; } .fs-stars span { color: #999; } .fs-product-card h3 { font-size: 14px; line-height: 1.25; color: #333; margin: 0 0 10px; font-weight: 600; } .fs-price { color: #8f9677; font-weight: 700; font-size: 16px; margin: 0; } /* ===================================================== 04 - BANNIÈRE PROMO À DROITE ===================================================== */ .fs-promo-card { min-height: 250px !important; border-radius: 10px; padding: 42px 38px; background-color: #f3f1e8; background-size: cover !important; background-position: center right !important; background-repeat: no-repeat !important; display: flex; align-items: center; overflow: hidden; } .fs-promo-card > div { max-width: 300px !important; position: relative; z-index: 2; display: block !important; } .fs-promo-card span { display: block; color: #8f9677; text-transform: uppercase; font-weight: 700; font-size: 13px; margin-bottom: 14px; } .fs-promo-card h3 { font-family: Georgia, "Times New Roman", serif; font-size: 34px; line-height: 1.05; color: #2d2d2d; font-weight: 400; margin: 0 0 16px; } .fs-promo-card p { max-width: 280px; color: #555; font-size: 15px; line-height: 1.5; margin: 0 0 24px; } .fs-promo-card a { display: inline-block; background: #8f9677; color: #fff !important; text-decoration: none; border-radius: 24px; padding: 12px 24px; font-size: 13px; font-weight: 700; text-transform: uppercase; } /* ===================================================== 05 - BANDEAU CONFIANCE HOMEPAGE ===================================================== */ .fs-trust-strip { max-width: 1280px; margin: 0 auto 28px !important; padding: 26px 34px; background: #f3f1e8; border-radius: 10px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; } .fs-trust-item { display: flex; align-items: center; gap: 16px; border-right: 1px solid rgba(143,150,119,.22); } .fs-trust-item:last-child { border-right: 0; } .fs-trust-item span { width: 54px; height: 54px; border: 1px solid rgba(143,150,119,.35); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #8f9677; font-size: 25px; flex: 0 0 54px; } .fs-trust-item h3 { margin: 0 0 5px; color: #6f765c; font-size: 13px; text-transform: uppercase; font-weight: 700; } .fs-trust-item p { margin: 0; color: #555; font-size: 13px; line-height: 1.35; } /* ===================================================== 06 - BANNIÈRES MARKETING ===================================================== */ .fs-marketing-banners { max-width: 1280px; margin: 0 auto 28px !important; padding: 0 24px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; } .fs-marketing-card { min-height: 210px; border-radius: 10px; padding: 32px 34px; display: flex; align-items: center; text-decoration: none; overflow: hidden; position: relative; color: #2d2d2d; background: #f3f1e8; } .fs-marketing-card::after { content: ""; position: absolute; right: -30px; bottom: -35px; width: 180px; height: 180px; border-radius: 50%; background: rgba(143,150,119,.18); } .fs-marketing-card::before { content: "♡"; position: absolute; right: 42px; bottom: 38px; color: rgba(143,150,119,.35); font-size: 72px; line-height: 1; } .fs-marketing-card span { display: block; color: #6f765c; text-transform: uppercase; font-size: 13px; font-weight: 700; margin-bottom: 10px; } .fs-marketing-card h3 { font-family: Georgia, "Times New Roman", serif; font-size: 25px; line-height: 1.15; font-weight: 400; margin: 0 0 20px; } .fs-marketing-card strong { display: inline-block; background: #8f9677; color: #fff; border-radius: 24px; padding: 10px 20px; font-size: 12px; text-transform: uppercase; } .fs-marketing-card:hover { transform: translateY(-3px); transition: all .25s ease; box-shadow: 0 14px 28px rgba(143,150,119,.14); } /* ===================================================== 07 - BARRE HAUTE / HEADER ===================================================== */ .fs-top-reassurance { background: #e7e2d3; font-size: 13px; text-align: center; padding: 8px 0; letter-spacing: .5px; border-bottom: 1px solid rgba(0,0,0,.05); position: relative !important; top: auto !important; } .fs-top-reassurance-inner { display: flex; justify-content: center; gap: 25px; color: #6f765c; font-weight: 500; } .fs-top-reassurance-inner .sep { opacity: .5; } /* Homepage — bandeau réassurance : wrap tablette (768–991px) */ @media (min-width: 768px) and (max-width: 991px) { body#index #displayBanner .fs-top-reassurance-inner, body#index .header-banner .fs-top-reassurance-inner { flex-wrap: wrap !important; justify-content: center !important; white-space: normal !important; gap: 0.35rem 0.65rem !important; text-align: center !important; line-height: 1.45 !important; } body#index #displayBanner .fs-top-reassurance, body#index .header-banner .fs-top-reassurance { padding-top: 0.65rem !important; padding-bottom: 0.65rem !important; } } #header { position: relative !important; top: auto !important; z-index: 10 !important; background: #fff !important; box-shadow: 0 4px 18px rgba(0,0,0,.035); } #header .header-top, #header .header-container { padding-top: 12px !important; padding-bottom: 12px !important; } #header .logo img, .logo img, .header_logo img { max-height: 54px !important; width: auto !important; } /* Menu principal : styles délégués au bloc B — MENU PRINCIPAL PREMIUM (~11076) */ #st_advanced_menu_wrap a { position: relative; color: #333 !important; font-weight: 600; letter-spacing: .03em; transition: all .25s ease; } #st_advanced_menu_wrap a:hover { color: #8f9677 !important; } #st_advanced_menu_wrap a::after { content: ""; position: absolute; left: 50%; bottom: -8px; width: 0; height: 2px; background: #8f9677; transform: translateX(-50%); transition: width .25s ease; } #st_advanced_menu_wrap li:hover > a::after { width: 26px; } /* ===================================================== 08 - NEWSLETTER PREMIUM HOME ===================================================== */ .fs-newsletter-band { max-width: 1280px; margin: 0 auto 38px !important; padding: 0 24px; } .fs-newsletter-inner { position: relative; overflow: hidden; border-radius: 18px; padding: 46px 52px; background: radial-gradient(circle at 85% 20%, rgba(255,255,255,.72), transparent 28%), linear-gradient(135deg, #f7f4ec 0%, #ded9ca 100%); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 30px; box-shadow: 0 18px 45px rgba(143,150,119,.13); } .fs-newsletter-inner::after { content: "♡"; position: absolute; right: 38px; bottom: -28px; font-size: 150px; color: rgba(143,150,119,.12); line-height: 1; } .fs-newsletter-icon { width: 76px; height: 76px; border-radius: 50%; background: rgba(255,255,255,.55); color: #8f9677; display: flex; align-items: center; justify-content: center; font-size: 34px; border: 1px solid rgba(143,150,119,.22); } .fs-newsletter-content { position: relative; z-index: 2; } .fs-newsletter-content span { color: #8f9677; text-transform: uppercase; font-size: 13px; font-weight: 700; letter-spacing: .08em; display: block; margin-bottom: 8px; } .fs-newsletter-content h2 { font-family: Georgia, "Times New Roman", serif; font-size: 36px; line-height: 1.05; font-weight: 400; color: #2d2d2d; margin: 0 0 10px; } .fs-newsletter-content p { max-width: 520px; margin: 0; color: #555; font-size: 15px; line-height: 1.55; } .fs-newsletter-form { position: relative; z-index: 2; display: flex; gap: 10px; min-width: 420px; } .fs-newsletter-form input { height: 48px; flex: 1; border: 1px solid rgba(143,150,119,.25); border-radius: 28px; padding: 0 20px; background: rgba(255,255,255,.9); color: #333; outline: none; } .fs-newsletter-form input:focus { border-color: #8f9677; box-shadow: 0 0 0 3px rgba(143,150,119,.12); } .fs-newsletter-form button { height: 48px; border: 0; border-radius: 28px; padding: 0 24px; background: #8f9677; color: #fff; font-weight: 700; text-transform: uppercase; font-size: 12px; cursor: pointer; box-shadow: 0 10px 22px rgba(143,150,119,.22); } .fs-newsletter-form button:hover { background: #8f9677; } /* ===================================================== 13 - ESPACEMENTS HOME COMPACT PREMIUM ===================================================== */ .easycontent, .easy_brother_block { margin-bottom: 0 !important; } /* ===================================================== 14 - RESPONSIVE TABLETTE ===================================================== */ @media (max-width: 991px) { .fs-category-shortcuts { grid-template-columns: repeat(4, 1fr); } .fs-best-grid { grid-template-columns: 1fr; } .fs-products-preview { grid-template-columns: repeat(2, 1fr); } .fs-see-all { position: static; display: inline-block; margin-top: 10px; } .fs-trust-strip { grid-template-columns: repeat(2, 1fr); } .fs-trust-item { border-right: 0; } .fs-marketing-banners { grid-template-columns: 1fr; } .fs-newsletter-inner { grid-template-columns: 1fr; text-align: center; padding: 38px 28px; } .fs-newsletter-icon { margin: 0 auto; } .fs-newsletter-form { min-width: 0; width: 100%; } #footer .stlinkgroups_links_footer .row { grid-template-columns: repeat(2, 1fr) !important; column-gap: 40px !important; row-gap: 28px !important; } } /* ===================================================== 15 - RESPONSIVE MOBILE ===================================================== */ @media (max-width: 600px) { .fs-newsletter-form { flex-direction: column; } #footer .stlinkgroups_links_footer .row { grid-template-columns: 1fr !important; } } @media (max-width: 575px) { .fs-category-shortcuts { grid-template-columns: repeat(2, 1fr); gap: 16px; } .fs-products-preview { grid-template-columns: 1fr; } .fs-section-heading h2, .fs-promo-card h3 { font-size: 28px; } .fs-trust-strip { grid-template-columns: 1fr; padding: 22px; } .fs-newsletter-content h2 { font-size: 30px; } } /* ===================================================== PAGE PRODUIT PREMIUM - FOLIES SECRÈTES Version nettoyée ===================================================== */ body#product, body.product { background: #fbfaf6 !important; } body#product #wrapper, body.product #wrapper, body#product .columns-container, body.product .columns-container { background: #fbfaf6 !important; } /* ===================================================== 01 - STRUCTURE HAUT DE FICHE PRODUIT ===================================================== */ body#product #columns, body.product #columns, body#product .columns-container .container, body.product .columns-container .container, body#product #center_column, body.product #center_column { max-width: 1180px !important; margin-left: auto !important; margin-right: auto !important; } body#product #primary_block, body.product #primary_block { max-width: 1180px !important; margin: 32px auto 28px !important; display: flex !important; align-items: flex-start !important; gap: 54px !important; } body#product #primary_block .pb-left-column, body.product #primary_block .pb-left-column { width: 56% !important; max-width: 660px !important; padding: 0 !important; float: none !important; display: flex !important; align-items: flex-start !important; gap: 22px !important; min-height: 0 !important; flex-wrap: wrap !important; } body#product #primary_block .pb-center-column, body.product #primary_block .pb-center-column, body#product #primary_block .pb-right-column, body.product #primary_block .pb-right-column { width: 44% !important; max-width: 430px !important; padding: 0 !important; float: none !important; } /* ===================================================== 02 - GALERIE PRODUIT ===================================================== */ body#product #primary_block .product_img_box, body.product #primary_block .product_img_box { width: 100% !important; max-width: 660px !important; min-height: 0 !important; height: auto !important; } body#product #primary_block #views_block, body.product #primary_block #views_block, body#product #primary_block #thumbs_list, body.product #primary_block #thumbs_list { width: 72px !important; min-width: 72px !important; max-height: 430px !important; margin: 0 !important; padding: 0 4px 0 0 !important; overflow-y: auto !important; overflow-x: hidden !important; } body#product #primary_block #thumbs_list li, body.product #primary_block #thumbs_list li { width: 68px !important; height: 68px !important; margin: 0 0 10px 0 !important; } body#product #primary_block #thumbs_list img, body.product #primary_block #thumbs_list img, body#product .thumb-container img, body.product .thumb-container img { max-width: 68px !important; max-height: 68px !important; object-fit: contain !important; border-radius: 10px !important; border: 1px solid #d8d2bf !important; background: #f3f1e8 !important; transition: all 0.25s ease !important; } body#product #primary_block #thumbs_list img:hover, body.product #primary_block #thumbs_list img:hover, body#product .thumb-container img:hover, body.product .thumb-container img:hover { border-color: #8f9677 !important; box-shadow: 0 8px 20px rgba(143, 150, 119, 0.18) !important; } body#product #primary_block #image-block, body.product #primary_block #image-block { flex: 1 !important; width: 100% !important; max-width: 560px !important; min-height: 0 !important; height: auto !important; margin: 0 !important; border-radius: 18px !important; overflow: hidden !important; background: #ffffff !important; display: flex !important; align-items: center !important; justify-content: center !important; } body#product #primary_block #image-block a, body.product #primary_block #image-block a { width: 100% !important; display: flex !important; align-items: center !important; justify-content: center !important; } body#product #primary_block #bigpic, body.product #primary_block #bigpic, body#product #primary_block img#bigpic, body.product #primary_block img#bigpic, body#product #primary_block .js-qv-product-cover, body.product #primary_block .js-qv-product-cover, body#product #primary_block .product-cover img, body.product #primary_block .product-cover img { width: auto !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; max-height: 430px !important; object-fit: contain !important; border-radius: 16px !important; box-shadow: none !important; } body#product #primary_block #views_block::-webkit-scrollbar, body.product #primary_block #views_block::-webkit-scrollbar, body#product #primary_block #thumbs_list::-webkit-scrollbar, body.product #primary_block #thumbs_list::-webkit-scrollbar { width: 4px; } body#product #primary_block #views_block::-webkit-scrollbar-track, body.product #primary_block #views_block::-webkit-scrollbar-track, body#product #primary_block #thumbs_list::-webkit-scrollbar-track, body.product #primary_block #thumbs_list::-webkit-scrollbar-track { background: #eef0e6; border-radius: 999px; } body#product #primary_block #views_block::-webkit-scrollbar-thumb, body.product #primary_block #views_block::-webkit-scrollbar-thumb, body#product #primary_block #thumbs_list::-webkit-scrollbar-thumb, body.product #primary_block #thumbs_list::-webkit-scrollbar-thumb { background: #b5b99f; border-radius: 999px; } /* ===================================================== 03 - BLOC CONSEIL SOUS IMAGE ===================================================== */ .fs-product-left-advice { width: calc(100% - 94px) !important; margin-left: 94px !important; margin-top: 22px !important; padding: 24px 28px !important; border-radius: 18px !important; background: linear-gradient(135deg, #eef0e6 0%, #fbfaf6 100%) !important; border: 1px solid #ded9ca !important; box-shadow: 0 12px 28px rgba(143, 150, 119, 0.08) !important; } .fs-product-left-advice span { display: block !important; margin-bottom: 8px !important; color: #8f9677 !important; font-size: 11px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 1px !important; } .fs-product-left-advice h3 { font-family: Georgia, "Times New Roman", serif !important; font-size: 24px !important; line-height: 1.2 !important; font-weight: 500 !important; color: #2b2b2b !important; margin: 0 0 10px !important; } .fs-product-left-advice p { color: #5d5b50 !important; font-size: 14px !important; line-height: 1.65 !important; margin: 0 0 18px !important; } .fs-product-left-advice a { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 38px !important; padding: 0 20px !important; border-radius: 999px !important; background: #ffffff !important; border: 1px solid #ded9ca !important; color: #8f9677 !important; font-size: 12px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.4px !important; text-decoration: none !important; transition: all 0.25s ease !important; } .fs-product-left-advice a:hover { background: #8f9677 !important; color: #ffffff !important; box-shadow: 0 10px 22px rgba(143, 150, 119, 0.18) !important; } /* ===================================================== 04 - TITRE / PRIX / BOUTON PANIER ===================================================== */ body#product h1, body.product h1, body#product .product_name, body.product .product_name, body#product .pb-center-column h1, body.product .pb-center-column h1 { font-family: Georgia, "Times New Roman", serif !important; font-size: 34px !important; line-height: 1.16 !important; font-weight: 500 !important; color: #2b2b2b !important; letter-spacing: -0.3px !important; margin-bottom: 16px !important; } body#product .product-description-short, body.product .product-description-short, body#product #short_description_block, body.product #short_description_block { color: #5d5b50 !important; font-size: 14px !important; line-height: 1.6 !important; } body#product .price, body.product .price, body#product #our_price_display, body.product #our_price_display, body#product .current-price, body.product .current-price { color: #8f9677 !important; font-size: 26px !important; font-weight: 600 !important; } body#product .tax-shipping-delivery-label, body.product .tax-shipping-delivery-label, body#product .price small, body.product .price small { color: #8f9677 !important; font-weight: 600 !important; } body#product .add-to-cart, body.product .add-to-cart, body#product button.add-to-cart, body.product button.add-to-cart, body#product .btn-primary, body.product .btn-primary, body#product .exclusive, body.product .exclusive { background: linear-gradient(135deg, #9ca584 0%, #6f765c 100%) !important; border: none !important; border-radius: 999px !important; min-height: 50px !important; padding: 0 34px !important; color: #ffffff !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: 0.4px !important; text-transform: uppercase !important; box-shadow: 0 12px 28px rgba(111, 118, 92, 0.28) !important; transition: all 0.25s ease !important; } body#product .add-to-cart:hover, body.product .add-to-cart:hover, body#product button.add-to-cart:hover, body.product button.add-to-cart:hover, body#product .btn-primary:hover, body.product .btn-primary:hover, body#product .exclusive:hover, body.product .exclusive:hover { background: linear-gradient(135deg, #87906f 0%, #5f664e 100%) !important; transform: translateY(-1px) !important; box-shadow: 0 14px 30px rgba(111, 118, 92, 0.32) !important; } body#product .product-quantity .qty, body.product .product-quantity .qty, body#product .product-quantity .input-group, body.product .product-quantity .input-group, body#product .qty_wrap, body.product .qty_wrap { border-radius: 999px !important; } body#product .product-quantity input, body.product .product-quantity input { border-color: #ded9ca !important; border-radius: 999px !important; } /* ===================================================== 05 - ATTRIBUTS / DÉCLINAISONS ===================================================== */ body#product .product-variants, body.product .product-variants, body#product .product_attributes, body.product .product_attributes, body#product #attributes, body.product #attributes { margin: 18px 0 18px !important; padding: 16px 0 6px !important; border-top: 1px solid #ded9ca !important; border-bottom: 1px solid #ded9ca !important; } body#product .product-variants-item, body.product .product-variants-item, body#product .attribute_fieldset, body.product .attribute_fieldset { margin-bottom: 14px !important; } body#product .product-variants-item .control-label, body.product .product-variants-item .control-label, body#product .attribute_fieldset label, body.product .attribute_fieldset label, body#product .attribute_label, body.product .attribute_label { display: block !important; color: #2b2b2b !important; font-size: 12px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; margin-bottom: 8px !important; } body#product .product-variants select, body.product .product-variants select, body#product #attributes select, body.product #attributes select { width: 100% !important; height: 44px !important; border: 1px solid #ded9ca !important; border-radius: 999px !important; background: #fbfaf6 !important; color: #3f4036 !important; font-size: 13px !important; padding: 0 18px !important; box-shadow: none !important; outline: none !important; } body#product .product-variants select:focus, body.product .product-variants select:focus, body#product #attributes select:focus, body.product #attributes select:focus { border-color: #8f9677 !important; background: #ffffff !important; } body#product .color_pick, body.product .color_pick, body#product #attributes .color_pick, body.product #attributes .color_pick, body#product .product-variants .color, body.product .product-variants .color { width: 30px !important; height: 30px !important; border-radius: 50% !important; border: 2px solid #ffffff !important; box-shadow: 0 0 0 1px #ded9ca, 0 6px 14px rgba(143, 150, 119, 0.12) !important; transition: all 0.2s ease !important; } body#product .color_pick:hover, body.product .color_pick:hover, body#product .color_pick.selected, body.product .color_pick.selected, body#product .color_pick.checked, body.product .color_pick.checked { box-shadow: 0 0 0 2px #8f9677, 0 8px 18px rgba(143, 150, 119, 0.18) !important; transform: translateY(-1px) !important; } /* ===================================================== 06 - BÉNÉFICES SOUS PANIER ===================================================== */ .fs-product-benefits-mini { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 10px !important; margin: 24px 0 14px !important; padding: 20px 0 18px !important; border-top: 1px solid #ded9ca !important; border-bottom: 1px solid #ded9ca !important; } .fs-benefit-mini { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; text-align: center !important; gap: 8px !important; min-width: 0 !important; } .fs-benefit-icon { position: relative !important; min-width: 38px !important; width: 38px !important; height: 38px !important; border-radius: 50% !important; background: #eef0e6 !important; border: 1px solid #ded9ca !important; box-shadow: 0 7px 16px rgba(143, 150, 119, 0.10) !important; } .fs-benefit-icon::before { position: absolute !important; inset: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #8f9677 !important; font-size: 15px !important; font-family: Arial, sans-serif !important; font-weight: 700 !important; } .fs-benefit-star::before { content: "✦" !important; } .fs-benefit-secret::before { content: "♡" !important; } .fs-benefit-soft::before { content: "○" !important; } .fs-benefit-clean::before { content: "✓" !important; } .fs-benefit-mini strong { display: block !important; color: #2b2b2b !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1.25 !important; margin: 0 !important; } .fs-benefit-mini small { display: none !important; } body#product .right_more_info_block, body.product .right_more_info_block { margin-top: 0 !important; } /* ===================================================== 07 - ACCORDÉONS COLONNE DROITE ===================================================== */ body#product .right_more_info_block a[href="#description"], body.product .right_more_info_block a[href="#description"], body#product .right_more_info_block [aria-controls="description"], body.product .right_more_info_block [aria-controls="description"], body#product .right_more_info_block #description, body.product .right_more_info_block #description { display: none !important; } body#product .right_more_info_block li:has(a[href="#description"]), body.product .right_more_info_block li:has(a[href="#description"]) { display: none !important; } body#product .page-product-heading, body.product .page-product-heading, body#product .accordion .card-header, body.product .accordion .card-header, body#product .product-accordion-title, body.product .product-accordion-title { color: #2b2b2b !important; font-weight: 600 !important; border-color: #ded9ca !important; } /* ===================================================== 08 - DESCRIPTION PREMIUM DYNAMIQUE ===================================================== */ .fs-product-description-premium { max-width: 1180px; margin: 24px auto 38px !important; padding: 46px 56px !important; border-radius: 18px; background: #ffffff; border: 1px solid #ded9ca; box-shadow: 0 14px 34px rgba(143, 150, 119, 0.07); display: grid; grid-template-columns: 1.35fr 0.75fr !important; gap: 48px; align-items: flex-start !important; } .fs-section-kicker { display: inline-block; margin-bottom: 12px; color: #8f9677; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px; } .fs-product-description-premium h2 { font-family: Georgia, "Times New Roman", serif; font-size: 30px; line-height: 1.2; font-weight: 500; color: #2b2b2b; margin: 0 0 16px; } .fs-product-description-intro { color: #3f4036 !important; font-size: 15px !important; line-height: 1.75 !important; margin-bottom: 18px !important; } .fs-product-highlights { list-style: none !important; padding: 0 !important; margin: 18px 0 18px !important; } .fs-product-highlights li, .fs-product-description-premium li { position: relative !important; padding-left: 26px !important; margin-bottom: 10px !important; color: #3f4036 !important; font-size: 14px !important; line-height: 1.5 !important; } .fs-product-highlights li::before, .fs-product-description-premium li::before { content: "✓" !important; position: absolute !important; left: 0 !important; top: 0 !important; color: #8f9677 !important; font-weight: 700 !important; } .fs-product-description-card { align-self: flex-start !important; padding: 30px; border-radius: 16px; background: linear-gradient(135deg, #eef0e6 0%, #fff8f8 100%); border: 1px solid #ded9ca; } .fs-product-description-card h3 { font-family: Georgia, "Times New Roman", serif; font-size: 23px; line-height: 1.2; color: #2b2b2b; font-weight: 500; margin: 0 0 12px; } .fs-product-description-card p { margin: 0; color: #5d5b50; font-size: 14px; line-height: 1.7; } .fs-product-full-description { grid-column: 1 / -1 !important; margin-top: 18px !important; border-top: 1px solid #ded9ca !important; padding-top: 18px !important; } .fs-product-full-description summary { cursor: pointer !important; display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 13px 18px !important; border-radius: 999px !important; background: #eef0e6 !important; border: 1px solid #ded9ca !important; color: #8f9677 !important; font-size: 12px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.6px !important; list-style: none !important; } .fs-product-full-description summary::-webkit-details-marker { display: none !important; } .fs-product-full-description summary::after { content: "+" !important; width: 20px !important; height: 20px !important; border-radius: 50% !important; background: #ffffff !important; border: 1px solid #ded9ca !important; color: #8f9677 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 15px !important; line-height: 1 !important; } .fs-product-full-description[open] summary::after { content: "−" !important; } .fs-product-description-content { max-height: 360px !important; overflow-y: auto !important; margin-top: 18px !important; padding: 26px 30px !important; border-radius: 14px !important; background: #fbfaf6 !important; border: 1px solid #ded9ca !important; color: #3f4036 !important; font-size: 13px !important; line-height: 1.75 !important; } .fs-product-description-content p { font-size: 13px !important; line-height: 1.75 !important; margin: 0 0 14px !important; } .fs-product-description-content h2, .fs-product-description-content h3, .fs-product-description-content h4, .fs-product-description-content p strong { display: block !important; margin: 24px 0 10px !important; font-size: 13px !important; line-height: 1.4 !important; text-transform: uppercase !important; letter-spacing: 0.7px !important; color: #8f9677 !important; font-weight: 700 !important; } .fs-product-description-content::-webkit-scrollbar { width: 6px; } .fs-product-description-content::-webkit-scrollbar-track { background: #eef0e6; border-radius: 999px; } .fs-product-description-content::-webkit-scrollbar-thumb { background: #b5b99f; border-radius: 999px; } /* ===================================================== 09 - VOUS AIMEREZ AUSSI ===================================================== */ body#product #category_products_container, body.product #category_products_container { max-width: 1180px !important; margin: 42px auto 46px !important; padding: 0 !important; } body#product #category_products_container .title_block, body.product #category_products_container .title_block { margin: 0 0 26px !important; padding: 0 0 18px !important; border-bottom: 1px solid #ded9ca !important; align-items: center !important; font-size: 0 !important; } body#product #category_products_container .title_block::before, body.product #category_products_container .title_block::before { content: none !important; display: none !important; } body#product #category_products_container .title_block_inner, body.product #category_products_container .title_block_inner { font-size: 0 !important; line-height: 1 !important; margin: 0 !important; padding: 0 !important; border: none !important; text-transform: none !important; letter-spacing: 0 !important; } body#product #category_products_container .title_block_inner::before, body.product #category_products_container .title_block_inner::before { content: "Vous aimerez aussi"; display: block; font-family: Georgia, "Times New Roman", serif !important; font-size: 30px !important; line-height: 1.2 !important; font-weight: 500 !important; color: #2b2b2b !important; text-transform: none !important; letter-spacing: 0 !important; } body#product #category_products_container .title_block_inner::after, body.product #category_products_container .title_block_inner::after { display: none !important; content: none !important; } body#product #category_products_container .products_slider, body.product #category_products_container .products_slider, body#product #category_products_container .block_content, body.product #category_products_container .block_content { overflow: visible !important; } body#product #category_products_container .products_slider_swiper, body.product #category_products_container .products_slider_swiper, body#product #category_products_container .swiper-container, body.product #category_products_container .swiper-container { padding: 10px 4px 12px !important; overflow: hidden !important; } body#product #category_products_container .swiper-slide, body.product #category_products_container .swiper-slide { background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 18px !important; padding: 14px !important; box-shadow: 0 8px 24px rgba(143, 150, 119, 0.06) !important; transition: all 0.25s ease !important; } body#product #category_products_container .swiper-slide:hover, body.product #category_products_container .swiper-slide:hover { transform: translateY(-4px) !important; box-shadow: 0 16px 34px rgba(143, 150, 119, 0.13) !important; } body#product #category_products_container .pro_outer_box, body.product #category_products_container .pro_outer_box { background: transparent !important; } body#product #category_products_container .pro_first_box, body.product #category_products_container .pro_first_box, body#product #category_products_container .product_img_link, body.product #category_products_container .product_img_link { height: 240px !important; background: #eef0e6 !important; border-radius: 16px !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; margin-bottom: 14px !important; } body#product #category_products_container .pro_first_box img, body.product #category_products_container .pro_first_box img, body#product #category_products_container .product_img_link img, body.product #category_products_container .product_img_link img { max-width: 100% !important; max-height: 230px !important; width: auto !important; height: auto !important; object-fit: contain !important; transition: transform 0.25s ease !important; } body#product #category_products_container .swiper-slide:hover img, body.product #category_products_container .swiper-slide:hover img { opacity: 1 !important; filter: none !important; transform: scale(1.03) !important; } body#product #category_products_container .pro_second_box, body.product #category_products_container .pro_second_box { display: block !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; position: static !important; background: #ffffff !important; padding: 4px 6px 4px !important; text-align: center !important; } body#product #category_products_container .pro_second_box *, body.product #category_products_container .pro_second_box * { background-color: transparent !important; } body#product #category_products_container .s_title_block, body.product #category_products_container .s_title_block, body#product #category_products_container .product-name, body.product #category_products_container .product-name, body#product #category_products_container .product-title, body.product #category_products_container .product-title { display: block !important; opacity: 1 !important; visibility: visible !important; font-size: 14px !important; line-height: 1.35 !important; font-weight: 600 !important; color: #2b2b2b !important; margin: 6px 0 8px !important; text-align: center !important; text-transform: none !important; } body#product #category_products_container .price, body.product #category_products_container .price, body#product #category_products_container .product-price, body.product #category_products_container .product-price { display: inline-block !important; opacity: 1 !important; visibility: visible !important; color: #8f9677 !important; font-size: 15px !important; font-weight: 700 !important; text-align: center !important; } body#product #category_products_container .tax-shipping-delivery-label, body.product #category_products_container .tax-shipping-delivery-label { display: inline-block !important; color: #8f9677 !important; font-size: 11px !important; font-weight: 600 !important; } body#product #category_products_container .hover_fly, body.product #category_products_container .hover_fly, body#product #category_products_container .hover_fly_btn, body.product #category_products_container .hover_fly_btn, body#product #category_products_container .ajax_add_to_cart_button, body.product #category_products_container .ajax_add_to_cart_button, body#product #category_products_container .add_to_love, body.product #category_products_container .add_to_love, body#product #category_products_container .wishlist_button, body.product #category_products_container .wishlist_button, body#product #category_products_container .product_buttons, body.product #category_products_container .product_buttons { display: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } /* ===================================================== 10 - BANDEAU GARANTIES PRODUIT ===================================================== */ .fs-product-reassurance { max-width: 1180px; margin: 34px auto 46px auto !important; padding: 28px 34px; border-radius: 18px; background: linear-gradient(135deg, #eef0e6 0%, #fff8f8 100%); display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; box-shadow: 0 14px 34px rgba(143, 150, 119, 0.09); border: 1px solid #ded9ca; } .fs-reassurance-item { display: flex; align-items: flex-start; gap: 14px; padding-right: 18px; border-right: 1px solid #ded9ca; } .fs-reassurance-item:last-child { border-right: none; } .fs-reassurance-icon { position: relative !important; min-width: 46px; width: 46px; height: 46px; border-radius: 50%; background: #ffffff; color: #8f9677; display: flex; align-items: center; justify-content: center; font-size: 0 !important; box-shadow: 0 8px 20px rgba(143, 150, 119, 0.13); } .fs-reassurance-icon::before { font-size: 21px !important; line-height: 1 !important; color: #8f9677 !important; font-family: Arial, sans-serif !important; font-weight: 400 !important; } .fs-icon-box::before { content: "□"; } .fs-icon-lock::before { content: "◦"; } .fs-icon-heart::before { content: "♡"; } .fs-icon-return::before { content: "↺"; } .fs-reassurance-item strong { display: block; color: #8f9677; font-size: 13px; text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 5px; font-weight: 700; } .fs-reassurance-item p { margin: 0; color: #5d5b50; font-size: 13px; line-height: 1.45; } .fs-reassurance-note { grid-column: 1 / -1; margin: -6px 0 0; padding-top: 12px; border-top: 1px solid #ded9ca; color: #6f765c; font-size: 11px; line-height: 1.4; text-align: center; } /* ===================================================== 11 - RESPONSIVE PRODUIT ===================================================== */ @media (max-width: 991px) { body#product #primary_block, body.product #primary_block { display: block !important; } body#product #primary_block .pb-left-column, body.product #primary_block .pb-left-column, body#product #primary_block .pb-center-column, body.product #primary_block .pb-center-column, body#product #primary_block .pb-right-column, body.product #primary_block .pb-right-column { width: 100% !important; max-width: none !important; } body#product #primary_block #views_block, body.product #primary_block #views_block, body#product #primary_block #thumbs_list, body.product #primary_block #thumbs_list { max-height: none !important; overflow: visible !important; } body#product #primary_block #bigpic, body.product #primary_block #bigpic, body#product #primary_block img#bigpic, body.product #primary_block img#bigpic { max-height: none !important; } .fs-product-left-advice { width: 100% !important; margin-left: 0 !important; margin-top: 20px !important; } .fs-product-description-premium { grid-template-columns: 1fr !important; padding: 32px 24px !important; gap: 28px !important; } .fs-product-full-description { grid-column: auto !important; } .fs-product-reassurance { grid-template-columns: repeat(2, 1fr); } .fs-reassurance-item { border-right: none; } } @media (max-width: 575px) { .fs-product-benefits-mini { grid-template-columns: repeat(2, 1fr) !important; } .fs-product-reassurance { grid-template-columns: 1fr; padding: 24px 22px; } } /* Masquer la barre flottante Panda sur mobile */ @media (max-width: 768px) { #rightbar, .rightbar, .st_right_bar, .st_rightbar, .st_sticky_right, .mobile_bar_bottom, .mobile-bar-bottom { display: none !important; } } /* ===== HERO MOBILE FIX ===== */ @media (max-width: 768px) { .fs-hero-caption { transform: none !important; margin-top: 0 !important; padding: 20px !important; max-width: 100% !important; text-align: center !important; } .fs-hero-caption h1 { font-size: 32px !important; line-height: 1.2 !important; } .fs-hero-text { font-size: 15px !important; margin: 10px auto 20px !important; } .fs-hero-btn { padding: 12px 20px !important; font-size: 12px !important; } /* image mieux cadrée */ .st_swiper_slider img { object-fit: cover !important; height: 420px !important; } /* espace autour */ .fs-hero-caption { background: rgba(251,250,246,0.88); border-radius: 12px; } } /* ===================================================== PAGE PRODUIT MOBILE - GALERIE PRODUIT Miniatures sous l'image principale ===================================================== */ @media (max-width: 767px) { body#product #primary_block, body.product #primary_block { display: block !important; width: 100% !important; max-width: 100% !important; margin: 18px auto 24px !important; padding: 0 16px !important; } body#product #primary_block .pb-left-column, body.product #primary_block .pb-left-column { width: 100% !important; max-width: 100% !important; display: flex !important; flex-direction: column !important; gap: 12px !important; padding: 0 !important; } body#product #primary_block #image-block, body.product #primary_block #image-block { order: 1 !important; width: 100% !important; max-width: 100% !important; margin: 0 auto !important; background: #ffffff !important; } body#product #primary_block #image-block a, body.product #primary_block #image-block a { width: 100% !important; } body#product #primary_block #bigpic, body.product #primary_block #bigpic, body#product #primary_block img#bigpic, body.product #primary_block img#bigpic, body#product #primary_block .js-qv-product-cover, body.product #primary_block .js-qv-product-cover, body#product #primary_block .product-cover img, body.product #primary_block .product-cover img { width: 100% !important; max-width: 100% !important; max-height: none !important; height: auto !important; object-fit: contain !important; } body#product #primary_block #views_block, body.product #primary_block #views_block, body#product #primary_block #thumbs_list, body.product #primary_block #thumbs_list { order: 2 !important; width: 100% !important; min-width: 0 !important; max-height: none !important; overflow-x: auto !important; overflow-y: hidden !important; padding: 0 0 8px 0 !important; margin: 8px 0 0 0 !important; } body#product #primary_block #thumbs_list ul, body.product #primary_block #thumbs_list ul, body#product #primary_block .product-images, body.product #primary_block .product-images { display: flex !important; flex-direction: row !important; gap: 10px !important; width: max-content !important; min-width: 100% !important; padding: 0 !important; margin: 0 !important; } body#product #primary_block #thumbs_list li, body.product #primary_block #thumbs_list li, body#product #primary_block .thumb-container, body.product #primary_block .thumb-container { flex: 0 0 64px !important; width: 64px !important; height: 64px !important; margin: 0 !important; } body#product #primary_block #thumbs_list img, body.product #primary_block #thumbs_list img, body#product #primary_block .thumb-container img, body.product #primary_block .thumb-container img { width: 64px !important; height: 64px !important; max-width: 64px !important; max-height: 64px !important; object-fit: contain !important; } body#product #primary_block .pb-center-column, body.product #primary_block .pb-center-column, body#product #primary_block .pb-right-column, body.product #primary_block .pb-right-column { width: 100% !important; max-width: 100% !important; padding: 0 !important; margin-top: 22px !important; } } /* ===================================================== POPUP PANIER PREMIUM - FOLIES SECRÈTES Module Panda stshoppingcart ===================================================== */ #st_shopping_cart_modal, #st_shopping_cart_modal .modal-dialog, #st_shopping_cart_modal .modal-content, #blockcart-modal, #blockcart-modal .modal-dialog, #blockcart-modal .modal-content { font-family: inherit; } /* Fond sombre plus doux */ .modal-backdrop, .modal-backdrop.in { background: rgba(32, 26, 28, 0.72); } /* Boîte principale */ #st_shopping_cart_modal .modal-dialog, #blockcart-modal .modal-dialog { max-width: 760px; margin: 45px auto; } #st_shopping_cart_modal .modal-content, #blockcart-modal .modal-content { border: 0; border-radius: 24px; overflow: hidden; background: radial-gradient(circle at top left, rgba(247, 244, 236, 0.95), transparent 32%), linear-gradient(135deg, #ffffff 0%, #fbfaf6 100%); box-shadow: 0 30px 90px rgba(0, 0, 0, 0.32); } /* Contenu */ #st_shopping_cart_modal .modal-body, #blockcart-modal .modal-body { padding: 34px 38px 36px; } /* Image produit */ #st_shopping_cart_modal img, #blockcart-modal img { max-width: 96px; border-radius: 16px; background: #fff; padding: 6px; box-shadow: 0 14px 35px rgba(0, 0, 0, 0.10); } /* Titre produit */ #st_shopping_cart_modal h1, #st_shopping_cart_modal h2, #st_shopping_cart_modal h3, #st_shopping_cart_modal h4, #st_shopping_cart_modal .product-name, #blockcart-modal h1, #blockcart-modal h2, #blockcart-modal h3, #blockcart-modal h4, #blockcart-modal .product-name { font-family: Georgia, "Times New Roman", serif; font-size: 32px !important; line-height: 1.18 !important; font-weight: 500; color: #2b2b2b; letter-spacing: -0.4px; text-transform: none; margin-bottom: 16px; } /* Quantité */ #st_shopping_cart_modal .product-quantity, #blockcart-modal .product-quantity, #st_shopping_cart_modal p, #blockcart-modal p { color: #5d5b50; font-size: 14px; } /* Message succès */ #st_shopping_cart_modal .alert-success, #blockcart-modal .alert-success { background: #f4f7ee; border: 1px solid #d8dfc8; color: #66734e; border-radius: 13px; padding: 15px 18px; margin: 24px 0 22px; font-size: 14px; } /* Texte nombre articles */ #st_shopping_cart_modal .cart-products-count, #blockcart-modal .cart-products-count, #st_shopping_cart_modal strong, #blockcart-modal strong { color: #333628; font-weight: 700; } /* Bloc résumé */ #st_shopping_cart_modal .cart-content, #blockcart-modal .cart-content { margin-top: 6px; } #st_shopping_cart_modal .cart-content p, #blockcart-modal .cart-content p { margin-bottom: 7px; color: #5d5b50; font-size: 14px; } /* Total plus premium */ #st_shopping_cart_modal .cart-content p:last-of-type, #blockcart-modal .cart-content p:last-of-type { margin-top: 12px; padding-top: 12px; border-top: 1px solid #ded9ca; font-size: 18px; font-weight: 700; color: #6f765c; } /* Boutons */ #st_shopping_cart_modal .cart-content-btn, #blockcart-modal .cart-content-btn { display: flex; gap: 18px; margin-top: 24px; align-items: center; } #st_shopping_cart_modal .cart-content-btn .btn, #blockcart-modal .cart-content-btn .btn { min-width: 180px; height: 48px; padding: 0 28px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: 0.9px; text-transform: uppercase; display: inline-flex; align-items: center; justify-content: center; white-space: nowrap; transition: all 0.25s ease; } /* Bouton secondaire */ #st_shopping_cart_modal .cart-content-btn .btn-secondary, #st_shopping_cart_modal .cart-content-btn .btn-default, #blockcart-modal .cart-content-btn .btn-secondary, #blockcart-modal .cart-content-btn .btn-default { background: #ffffff; border: 1px solid #4f5143; color: #333628; } #st_shopping_cart_modal .cart-content-btn .btn-secondary:hover, #st_shopping_cart_modal .cart-content-btn .btn-default:hover, #blockcart-modal .cart-content-btn .btn-secondary:hover, #blockcart-modal .cart-content-btn .btn-default:hover { background: #f7f4ec; border-color: #8f9677; color: #6f765c; } /* Bouton principal */ #st_shopping_cart_modal .cart-content-btn .btn-primary, #blockcart-modal .cart-content-btn .btn-primary { background: linear-gradient(135deg, #6f765c 0%, #9ca584 100%); border: 1px solid #6f765c; color: #fff; box-shadow: 0 12px 28px rgba(111, 118, 92, 0.28); } #st_shopping_cart_modal .cart-content-btn .btn-primary:hover, #blockcart-modal .cart-content-btn .btn-primary:hover { background: linear-gradient(135deg, #5f664e 0%, #87906f 100%); border-color: #5f664e; color: #fff; transform: translateY(-1px); } /* Bouton fermer */ #st_shopping_cart_modal .close, #blockcart-modal .close { position: absolute; top: 18px; right: 18px; width: 36px; height: 36px; border-radius: 50%; background: #eef0e6; color: #6f765c; opacity: 1; font-size: 26px; line-height: 32px; text-shadow: none; z-index: 20; transition: all 0.25s ease; } #st_shopping_cart_modal .close:hover, #blockcart-modal .close:hover { background: #6f765c; color: #fff; } /* ===================================================== MOBILE ===================================================== */ @media (max-width: 767px) { #st_shopping_cart_modal .modal-dialog, #blockcart-modal .modal-dialog { width: calc(100% - 24px); margin: 24px auto; } #st_shopping_cart_modal .modal-body, #blockcart-modal .modal-body { padding: 28px 22px 30px; } #st_shopping_cart_modal img, #blockcart-modal img { max-width: 82px; margin-bottom: 14px; } #st_shopping_cart_modal h1, #st_shopping_cart_modal h2, #st_shopping_cart_modal h3, #st_shopping_cart_modal h4, #st_shopping_cart_modal .product-name, #blockcart-modal h1, #blockcart-modal h2, #blockcart-modal h3, #blockcart-modal h4, #blockcart-modal .product-name { font-size: 24px !important; line-height: 1.18 !important; } #st_shopping_cart_modal .cart-content-btn, #blockcart-modal .cart-content-btn { flex-direction: column; gap: 12px; } #st_shopping_cart_modal .cart-content-btn .btn, #blockcart-modal .cart-content-btn .btn { width: 100%; min-width: 100%; } } /* ===================================================== PANIER LATÉRAL PREMIUM - FOLIES SECRÈTES ID réel : #side_products_cart ===================================================== */ #side_products_cart { background: radial-gradient(circle at top left, rgba(247, 244, 236, 0.95), transparent 35%), linear-gradient(180deg, #ffffff 0%, #fbfaf6 100%) !important; border-left: 1px solid rgba(111, 118, 92, 0.22) !important; box-shadow: -22px 0 70px rgba(0, 0, 0, 0.22) !important; padding: 22px 22px 26px 34px !important; } #side_products_cart .fs-side-cart-inner, #side_products_cart .fs-side-cart-content, #side_products_cart .st-menu-content { max-width: 300px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 8px !important; padding-right: 8px !important; } #side_products_cart .side_title, #side_products_cart .title, #side_products_cart h3, #side_products_cart .st-menu-title { font-family: Georgia, "Times New Roman", serif !important; font-size: 22px !important; line-height: 1.2 !important; font-weight: 500 !important; color: #2b2b2b !important; text-transform: none !important; letter-spacing: 0 !important; padding-bottom: 16px !important; margin-bottom: 18px !important; border-bottom: 1px solid #ded9ca !important; } #side_products_cart .close, #side_products_cart .st-menu-close, #side_products_cart .close_right_side { width: 34px !important; height: 34px !important; border-radius: 50% !important; background: #eef0e6 !important; color: #6f765c !important; opacity: 1 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; transition: all 0.25s ease !important; } #side_products_cart .close:hover, #side_products_cart .st-menu-close:hover, #side_products_cart .close_right_side:hover { background: #6f765c !important; color: #ffffff !important; } #side_products_cart .cart_block_product, #side_products_cart .stcart_product, #side_products_cart .cart-item, #side_products_cart li { border-bottom: 1px solid #e4dfd2 !important; padding: 14px 0 18px !important; } #side_products_cart img { border-radius: 14px !important; background: #ffffff !important; padding: 5px !important; box-shadow: 0 10px 26px rgba(0, 0, 0, 0.10) !important; } #side_products_cart .product-name, #side_products_cart .cart_block_product_name, #side_products_cart a { color: #2b2b2b !important; font-weight: 500 !important; text-transform: none !important; } #side_products_cart .product-name a, #side_products_cart .cart_block_product_name a { font-family: Georgia, "Times New Roman", serif !important; font-size: 15px !important; line-height: 1.25 !important; } #side_products_cart .price, #side_products_cart .product-price, #side_products_cart .cart_block_product_price { color: #6f765c !important; font-weight: 700 !important; } #side_products_cart .cart-summary-line, #side_products_cart .cart-prices-line, #side_products_cart .cart_block_summary .row, #side_products_cart .cart_block_total .row, #side_products_cart .line_item, #side_products_cart .steco_item, #side_products_cart .fs-side-cart-line { padding: 12px 0 !important; border-bottom: 1px solid #e4dfd2 !important; color: #5d5b50 !important; font-size: 14px !important; } #side_products_cart .fs-side-cart-summary, #side_products_cart .cart-prices, #side_products_cart .cart-summary { margin-top: 20px !important; } #side_products_cart .cart-total, #side_products_cart .cart_block_total, #side_products_cart .total, #side_products_cart strong { color: #2b2b2b !important; font-weight: 700 !important; } #side_products_cart .cart_block_total, #side_products_cart .cart-total { margin-top: 8px !important; padding-top: 12px !important; border-top: 1px solid #d8d2bf !important; } #side_products_cart .fs-cart-checkout-btn, #side_products_cart .btn, #side_products_cart .btn-default, #side_products_cart .btn-primary, #side_products_cart .btn_to_checkout { display: flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; width: calc(100% - 10px) !important; min-height: 48px !important; height: 48px !important; margin-left: auto !important; margin-right: auto !important; padding: 0 22px !important; line-height: 1.2 !important; border-radius: 999px !important; border: 1px solid #6f765c !important; background: linear-gradient(135deg, #6f765c 0%, #9ca584 100%) !important; color: #ffffff !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 0.9px !important; text-transform: uppercase !important; box-shadow: 0 12px 28px rgba(111, 118, 92, 0.26) !important; transition: all 0.25s ease !important; } #side_products_cart .fs-cart-checkout-btn:hover, #side_products_cart .btn:hover, #side_products_cart .btn-default:hover, #side_products_cart .btn-primary:hover, #side_products_cart .btn_to_checkout:hover { background: linear-gradient(135deg, #5f664e 0%, #87906f 100%) !important; border-color: #5f664e !important; color: #ffffff !important; transform: translateY(-1px); } /* ===================================================== RESPONSIVE MOBILE ===================================================== */ /* ===================================================== OVERRIDES FINAUX - SAUGE PREMIUM Sécurité pour les éléments Panda / PrestaShop non ciblés plus haut ===================================================== */ a:hover, .header_item a:hover, #header a:hover, .st_mega_menu a:hover, #st_mega_menu_wrap a:hover { color: #8f9677 !important; } .btn-primary, .button.ajax_add_to_cart_button, .ajax_add_to_cart_button, .add-to-cart, .exclusive, .fs-hero-btn, .fs-promo-card a, .fs-marketing-card strong, .fs-newsletter-form button { background: linear-gradient(135deg, #9ca584 0%, #6f765c 100%) !important; border-color: #6f765c !important; color: #ffffff !important; box-shadow: 0 12px 28px rgba(111, 118, 92, 0.24) !important; } .btn-primary:hover, .button.ajax_add_to_cart_button:hover, .ajax_add_to_cart_button:hover, .add-to-cart:hover, .exclusive:hover, .fs-hero-btn:hover, .fs-promo-card a:hover, .fs-marketing-card strong:hover, .fs-newsletter-form button:hover { background: linear-gradient(135deg, #87906f 0%, #5f664e 100%) !important; border-color: #5f664e !important; color: #ffffff !important; } .fs-category-icon, .fs-benefit-icon, .fs-product-full-description summary, .fs-trust-strip, .fs-marketing-card, .fs-promo-card, .fs-product-reassurance, .fs-product-left-advice, .fs-product-description-card { background-color: #f3f1e8 !important; border-color: #ded9ca !important; } .fs-category-icon, .fs-kicker, .fs-section-kicker, .fs-price, .fs-product-card h3:hover, .fs-product-badge, .fs-promo-card span, .fs-trust-item span, .fs-trust-item h3, .fs-marketing-card span, .fs-newsletter-icon, .fs-newsletter-content span, body#product .price, body.product .price, body#product #our_price_display, body.product #our_price_display, body#product .current-price, body.product .current-price { color: #8f9677 !important; } .fs-product-badge, .fs-product-overlay-btn, .fs-category-item:hover .fs-category-icon { background: #8f9677 !important; color: #ffffff !important; } .fs-stars { color: #c7a45a !important; } body, body#index, body#product, body.product, #wrapper, .columns-container { background-color: #fbfaf6 !important; } #footer, .footer-container { background: #f7f4ec !important; } #footer-bottom { background: #333628 !important; color: #f7f4ec !important; } /* Mobile : cartes fluides */ /* Mobile : hauteur automatique pour éviter les grands vides */ /* ===================================================== FIX HOME - ESPACE HERO / CATÉGORIES / BEST-SELLERS Version propre et équilibrée ===================================================== */ /* Supprime les marges parasites du slider */ #index .st_swiper_slider, #index .st_swiper_slider .swiper-container, #index .st_swiper_slider .swiper-wrapper, #index .st_swiper_slider .swiper-slide { margin-bottom: 0 !important; padding-bottom: 0 !important; background: transparent !important; } /* Supprime l'espace ajouté par EasyContent après le hero */ #index .st_swiper_slider + .easycontent, #index .st_swiper_slider ~ .easycontent { margin-top: 0 !important; padding-top: 0 !important; } /* Catégories : rapprochement doux sous le hero */ #index .fs-category-shortcuts { margin-top: -32px !important; margin-bottom: 12px !important; padding-top: 0 !important; position: relative !important; z-index: 5 !important; } /* Best-sellers : remonte légèrement */ #index .fs-best-section { margin-top: -10px !important; margin-bottom: 32px !important; } /* Icônes catégories plus lisibles */ #index .fs-category-icon { background: #e3e7d6 !important; } /* Cartes produits : relief premium */ #index .fs-product-card { border-radius: 10px !important; overflow: hidden !important; } #index .fs-product-card:hover { box-shadow: 0 20px 40px rgba(0,0,0,0.08) !important; } /* ===================================================== FIX HOME - SUPPRESSION BANDE BLANCHE SOUS HERO ===================================================== */ #index .st_swiper_slider { margin-bottom: -36px !important; } #index .fs-category-shortcuts { margin-top: 0 !important; padding-top: 0 !important; position: relative !important; z-index: 6 !important; } /* ===================================================== HOME PAGE 2 - SUPPRESSION BANDE BLANCHE SOUS SLIDER Objectif : coller proprement le slider au bloc suivant ===================================================== */ /* 01 - Supprime l’espace après le slider homepage */ #index .swiper-container, #index .swiper-wrapper, #index .stswiper, #index .stswiper_container, #index .stswiper_slider, #index .st_banner_block, #index .st_banner_container { margin-bottom: 0 !important; padding-bottom: 0 !important; } /* 02 - Supprime l’espace du conteneur Panda sous le slider */ #index .st_slideshow, #index .st_slideshow_block, #index .st_slideshow_inner, #index .elementor-section-wrap > section:first-child { margin-bottom: 0 !important; padding-bottom: 0 !important; } /* 03 - Remonte le bloc juste après le slider */ #index .fs-category-shortcuts, #index .stfeaturedcategories, #index .st_category_block, #index .st_categories_slider, #index .elementor-section:nth-of-type(2) { margin-top: 0 !important; padding-top: 0 !important; } /* 04 - Si le thème ajoute une section vide entre slider et catégories */ #index .elementor-section:empty, #index .elementor-widget-spacer { display: none !important; } /* 05 - Sécurité : retire les marges des blocs principaux de la home */ #index #content-wrapper, #index #main, #index .page-home { padding-top: 0 !important; margin-top: 0 !important; } /* ===================================================== HOME PAGE 2 - SUPPRESSION BANDE BLANCHE SOUS SLIDER Objectif : supprimer l'espace entre le slider hero et les catégories rondes de la page d'accueil ===================================================== */ /* 01 - Supprime les marges/paddings sous le slider Panda */ #index #swiper_container_out_1, #index #swiper_container_1, #index .swiper-container-out, #index .swiper_wraper_out, #index .st_swiper, #index .swiper-container, #index .swiper-wrapper, #index .swiper-slide, #index .st_swiper_block { margin-bottom: 0 !important; padding-bottom: 0 !important; } /* 02 - Supprime le conteneur vide qui crée la bande blanche */ #index .full_width_top2_container { display: none !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; } /* 03 - Colle le wrapper principal directement après le slider */ #index #wrapper, #index section#wrapper.columns-container, #index #columns, #index #main, #index #content, #index .page-home { margin-top: 0 !important; padding-top: 0 !important; } /* 04 - Réduit l'espace avant les catégories rondes */ #index .stfeatured_categories, #index .st_featured_categories, #index .stfeatured_cate, #index .stfeaturedcategory, #index .st_category_block, #index .fs-category-shortcuts { margin-top: 0 !important; padding-top: 28px !important; } /* 05 - Harmonise le fond de la zone sous le slider */ #index #wrapper, #index #main, #index .page-home { background: #fbfaf6 !important; } /* Mobile */ /* ===================================================== FIX DÉFINITIF CRÉATION DE COMPTE Correction colonne Bootstrap : col-lg-6 offset-lg-3 ===================================================== */ /* ===================================================== FIX PREMIUM FINAL - SUPPRESSION DOUBLE CADRE Création de compte ===================================================== */ /* On garde uniquement la carte extérieure */ body#registration #content.page-content { max-width: 720px !important; margin: 28px auto 48px !important; padding: 44px 52px !important; background: #ffffff !important; border: 1px solid rgba(143,150,119,.22) !important; border-radius: 24px !important; box-shadow: 0 22px 60px rgba(55,56,46,.08) !important; } /* ❌ SUPPRIME le cadre intérieur gris */ body#registration #customer-form, body#registration #customer-form section, body#registration #customer-form .form_content, body#registration #customer-form .form_content_inner, body#registration .register-form { border: none !important; box-shadow: none !important; background: transparent !important; padding: 0 !important; } /* Ajuste le spacing pour compenser */ body#registration #customer-form { margin-top: 0 !important; } /* Harmonisation des blocs checkbox */ body#registration .custom-checkbox { background: #f7f4ec !important; border: 1px solid #ded9ca !important; border-radius: 14px !important; padding: 12px 14px !important; } /* ===================================================== FIX FINAL - SUPPRESSION CADRE INTÉRIEUR INSCRIPTION ===================================================== */ body#registration #content.page-content .col-lg-6, body#registration #content.page-content .offset-lg-3, body#registration #content.page-content .form_content, body#registration #content.page-content .form_content_inner, body#registration #content.page-content .js-customer-form, body#registration #content.page-content form { border: none !important; outline: none !important; box-shadow: none !important; background: transparent !important; } /* Au cas où le cadre vient directement d'une bordure Panda sur section */ body#registration #content.page-content section, body#registration #content.page-content .from_blcok, body#registration #content.page-content .form_block { border: none !important; box-shadow: none !important; } /* On enlève aussi les marges internes qui donnent l'effet cadre */ body#registration #content.page-content .col-lg-6.offset-lg-3 { padding: 0 !important; } /* ===================================================== CRÉATION DE COMPTE - CONFORT DE LECTURE FINAL ===================================================== */ body#registration #content.page-content { max-width: 760px !important; padding: 48px 62px !important; } body#registration #customer-form { max-width: 620px !important; margin: 0 auto !important; } body#registration #content.page-content h1, body#registration #content.page-content h2, body#registration #content.page-content h3, body#registration #content.page-content .page-heading { font-size: 28px !important; margin-bottom: 24px !important; } body#registration #customer-form .form-group { margin-bottom: 18px !important; } body#registration #customer-form .btn-primary, body#registration #customer-form button[type="submit"] { margin-top: 24px !important; } /* ===================================================== PAGE CATÉGORIE PREMIUM - FOLIES SECRÈTES ===================================================== */ /* Fond général page catégorie */ body#category { background: #fbf8f5 !important; } /* Zone principale */ #category #wrapper, #category .columns-container, #category #content-wrapper { background: #fbf8f5 !important; } /* Fil d’Ariane */ #category .breadcrumb, #category .breadcrumb_wrapper { background: transparent !important; font-size: 12px !important; color: #8a7f78 !important; margin-bottom: 22px !important; } #category .breadcrumb a { color: #8a7f78 !important; text-decoration: none !important; } #category .breadcrumb a:hover { color: #b98a78 !important; } /* Bloc filtre / tri */ #category #js-product-list-top, #category .products-selection { background: #ffffff !important; border: 1px solid rgba(185, 138, 120, 0.16) !important; border-radius: 18px !important; padding: 16px 20px !important; margin-bottom: 32px !important; box-shadow: 0 12px 35px rgba(43, 35, 31, 0.045) !important; } #category .products-sort-order .select-title, #category .sort-by-row, #category .products-sort-order { color: #4a3d38 !important; font-size: 13px !important; } /* Sidebar catégories */ #category #left-column { padding-right: 26px !important; } #category #left-column .block, #category #left-column .block-categories, #category #search_filters { background: #ffffff !important; border: 1px solid rgba(185, 138, 120, 0.18) !important; border-radius: 22px !important; padding: 22px 20px !important; box-shadow: 0 14px 38px rgba(43, 35, 31, 0.055) !important; overflow: hidden !important; } /* Titre sidebar */ #category #left-column .block-title, #category #left-column .title_block, #category #left-column h4 { font-family: Georgia, "Times New Roman", serif !important; font-size: 18px !important; font-weight: 400 !important; color: #3a302c !important; letter-spacing: 0.4px !important; margin-bottom: 18px !important; text-transform: none !important; } /* Liens sidebar */ #category #left-column a { color: #514640 !important; font-size: 13px !important; text-decoration: none !important; transition: all 0.25s ease !important; } #category #left-column a:hover { color: #b98a78 !important; padding-left: 4px !important; } /* Lignes sidebar */ #category #left-column li { border-bottom: 1px solid rgba(185, 138, 120, 0.13) !important; padding: 11px 0 !important; } #category #left-column li:last-child { border-bottom: none !important; } /* Grille produits */ #category .products { gap: 28px 18px !important; } /* Carte produit */ #category .product-miniature, #category .product-miniature .thumbnail-container { background: #ffffff !important; border-radius: 22px !important; overflow: hidden !important; border: 1px solid rgba(185, 138, 120, 0.14) !important; box-shadow: 0 12px 34px rgba(43, 35, 31, 0.045) !important; transition: all 0.3s ease !important; } #category .product-miniature:hover, #category .product-miniature:hover .thumbnail-container { transform: translateY(-5px) !important; box-shadow: 0 20px 45px rgba(43, 35, 31, 0.095) !important; border-color: rgba(185, 138, 120, 0.32) !important; } /* Image produit */ #category .product-miniature img, #category .thumbnail-container img { background: #fff !important; padding: 14px !important; object-fit: contain !important; transition: transform 0.35s ease !important; } #category .product-miniature:hover img { transform: scale(1.035) !important; } /* Infos produit */ #category .product-description, #category .product-miniature .product-description { background: #ffffff !important; padding: 15px 12px 20px !important; text-align: center !important; min-height: 112px !important; } /* Nom produit */ #category .product-title, #category .product-title a { font-size: 13px !important; font-weight: 500 !important; color: #2f2825 !important; line-height: 1.35 !important; text-transform: none !important; min-height: 36px !important; } #category .product-title a:hover { color: #b98a78 !important; } /* Prix */ #category .product-price-and-shipping, #category .price, #category .product-price { font-size: 15px !important; font-weight: 700 !important; color: #2f2825 !important; margin-top: 8px !important; } #category .regular-price { color: #9d948e !important; font-size: 13px !important; margin-left: 5px !important; } /* TTC */ #category .product-price-and-shipping span { vertical-align: baseline !important; } /* Pagination / affichage */ #category .pagination, #category .product-count, #category .showing { color: #7b706a !important; font-size: 12px !important; } /* Footer mieux séparé */ #category #footer { margin-top: 40px !important; } /* Mobile */ @media (max-width: 767px) { #category #left-column { padding-right: 0 !important; margin-bottom: 22px !important; } #category #left-column .block, #category #left-column .block-categories, #category #search_filters { border-radius: 18px !important; padding: 18px !important; } #category #js-product-list-top, #category .products-selection { border-radius: 16px !important; padding: 14px !important; } #category .product-miniature, #category .product-miniature .thumbnail-container { border-radius: 18px !important; } #category .product-description { min-height: auto !important; } } /* ===================================================== PAGE CATÉGORIE ULTRA PREMIUM - FOLIES SECRÈTES ===================================================== */ body#category { background: linear-gradient(180deg, #fff 0%, #fbf8f5 180px, #fbf8f5 100%) !important; } /* Wrapper général */ #category #wrapper, #category .columns-container { background: transparent !important; padding-top: 34px !important; } /* Largeur et respiration */ #category .container, #category .container-fluid { max-width: 1280px !important; } /* Fil d’Ariane */ #category .breadcrumb, #category .breadcrumb_wrapper { background: transparent !important; color: #8d827b !important; font-size: 12px !important; margin-bottom: 26px !important; } #category .breadcrumb a { color: #8d827b !important; } #category .breadcrumb a:hover { color: #c98991 !important; } /* ===================================================== TITRE CATÉGORIE PREMIUM ===================================================== */ #category h1, #category .page-heading, #category .category-name { font-family: Georgia, "Times New Roman", serif !important; font-size: 38px !important; font-weight: 400 !important; letter-spacing: 0.5px !important; color: #2d2725 !important; text-transform: uppercase !important; margin-bottom: 12px !important; } #category h1:after, #category .page-heading:after, #category .category-name:after { content: ""; display: block; width: 42px; height: 2px; background: #d49aa4; margin-top: 14px; } /* Description catégorie */ #category .category-description, #category #category-description, #category .cat_desc { max-width: 760px !important; color: #746964 !important; font-size: 14px !important; line-height: 1.8 !important; margin-bottom: 30px !important; } /* ===================================================== SIDEBAR ULTRA PREMIUM ===================================================== */ #category #left-column { padding-right: 32px !important; } #category #left-column .block, #category #left-column .block-categories, #category #search_filters { background: rgba(255,255,255,0.92) !important; border: 1px solid rgba(201, 137, 145, 0.20) !important; border-radius: 26px !important; padding: 26px 24px !important; box-shadow: 0 20px 55px rgba(43, 35, 31, 0.07) !important; backdrop-filter: blur(8px) !important; overflow: hidden !important; } /* Titre sidebar */ #category #left-column .block-title, #category #left-column .title_block, #category #left-column h4 { font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-weight: 400 !important; color: #2f2825 !important; letter-spacing: 2px !important; text-transform: uppercase !important; margin-bottom: 20px !important; } #category #left-column .block-title:after, #category #left-column .title_block:after, #category #left-column h4:after { content: ""; display: block; width: 34px; height: 1px; background: #d49aa4; margin-top: 12px; } /* Liens sidebar */ #category #left-column li { border-bottom: 1px solid rgba(201, 137, 145, 0.12) !important; padding: 0 !important; } #category #left-column li:last-child { border-bottom: none !important; } #category #left-column a { display: flex !important; align-items: center !important; justify-content: space-between !important; min-height: 46px !important; color: #403835 !important; font-size: 14px !important; font-weight: 400 !important; text-decoration: none !important; transition: all 0.25s ease !important; } #category #left-column a:hover { color: #c98991 !important; padding-left: 8px !important; } /* Icônes + */ #category #left-column .navbar-toggler, #category #left-column .collapse-icons, #category #left-column .add { color: #a88d86 !important; } /* ===================================================== BARRE TRI / FILTRE PREMIUM ===================================================== */ #category #js-product-list-top, #category .products-selection { background: rgba(255,255,255,0.95) !important; border: 1px solid rgba(201, 137, 145, 0.18) !important; border-radius: 22px !important; padding: 18px 24px !important; margin-bottom: 38px !important; box-shadow: 0 18px 45px rgba(43, 35, 31, 0.06) !important; } #category .products-selection, #category .sort-by-row, #category .products-sort-order, #category .products-sort-order .select-title { color: #4b403c !important; font-size: 13px !important; } #category .products-sort-order .select-title { background: transparent !important; border: none !important; box-shadow: none !important; } /* ===================================================== GRILLE PRODUITS ULTRA PREMIUM ===================================================== */ #category .products { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 34px 28px !important; } /* Carte produit */ #category .product-miniature, #category .product-miniature .thumbnail-container { background: #ffffff !important; border-radius: 26px !important; border: 1px solid rgba(201, 137, 145, 0.14) !important; box-shadow: 0 16px 42px rgba(43, 35, 31, 0.055) !important; overflow: hidden !important; transition: all 0.35s ease !important; } #category .product-miniature:hover, #category .product-miniature:hover .thumbnail-container { transform: translateY(-8px) !important; box-shadow: 0 28px 68px rgba(43, 35, 31, 0.12) !important; border-color: rgba(201, 137, 145, 0.35) !important; } /* Image produit */ #category .product-miniature img, #category .thumbnail-container img { background: #fff !important; padding: 18px !important; object-fit: contain !important; transition: transform 0.45s ease, opacity 0.3s ease !important; } #category .product-miniature:hover img { transform: scale(1.045) !important; } /* Hauteur image uniforme */ #category .thumbnail-container { min-height: 360px !important; } #category .product-thumbnail { min-height: 260px !important; display: flex !important; align-items: center !important; justify-content: center !important; } /* Description produit */ #category .product-description, #category .product-miniature .product-description { background: #ffffff !important; padding: 18px 18px 24px !important; text-align: center !important; min-height: 120px !important; } /* Nom produit */ #category .product-title, #category .product-title a { font-size: 14px !important; font-weight: 400 !important; color: #302926 !important; line-height: 1.45 !important; text-transform: none !important; min-height: 42px !important; transition: color 0.25s ease !important; } #category .product-title a:hover { color: #c98991 !important; } /* Prix */ #category .product-price-and-shipping, #category .price, #category .product-price { font-size: 16px !important; font-weight: 700 !important; color: #211c1a !important; margin-top: 10px !important; } #category .regular-price { color: #aaa09a !important; font-size: 13px !important; margin-left: 7px !important; } /* Badge promo */ #category .discount-percentage, #category .product-flag.discount, #category .product-flags .discount { background: #d49aa4 !important; color: #fff !important; border-radius: 999px !important; padding: 7px 11px !important; font-size: 12px !important; font-weight: 600 !important; box-shadow: 0 8px 22px rgba(201, 137, 145, 0.35) !important; } /* Badges nouveaux / promo */ #category .product-flags li { border-radius: 999px !important; border: none !important; font-size: 11px !important; letter-spacing: 0.5px !important; } /* Boutons hover éventuels */ #category .quick-view, #category .add-to-cart, #category .btn-primary { border-radius: 999px !important; background: #2f2825 !important; color: #fff !important; border: none !important; transition: all 0.25s ease !important; } #category .quick-view:hover, #category .add-to-cart:hover, #category .btn-primary:hover { background: #c98991 !important; color: #fff !important; } /* ===================================================== PAGINATION / COMPTE PRODUITS ===================================================== */ #category .pagination, #category .product-count, #category .showing { color: #80746e !important; font-size: 13px !important; margin-top: 24px !important; } #category .pagination a, #category .pagination span { border-radius: 50% !important; } #category .pagination .current a, #category .pagination .current span { background: #c98991 !important; color: #fff !important; } /* ===================================================== BLOC RASSURANCE BAS DE PAGE SI PRÉSENT ===================================================== */ #category .reassurance, #category .blockreassurance, #category #block-reassurance { background: rgba(255,255,255,0.75) !important; border: 1px solid rgba(201, 137, 145, 0.16) !important; border-radius: 24px !important; padding: 22px !important; margin-top: 46px !important; box-shadow: 0 16px 42px rgba(43, 35, 31, 0.045) !important; } /* Footer */ #category #footer { margin-top: 52px !important; } /* ===================================================== RESPONSIVE ===================================================== */ @media (max-width: 1199px) { #category .products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } @media (max-width: 767px) { #category #wrapper, #category .columns-container { padding-top: 20px !important; } #category #left-column { padding-right: 0 !important; margin-bottom: 28px !important; } #category #left-column .block, #category #left-column .block-categories, #category #search_filters { border-radius: 22px !important; padding: 22px 18px !important; } #category h1, #category .page-heading, #category .category-name { font-size: 30px !important; } #category #js-product-list-top, #category .products-selection { border-radius: 20px !important; padding: 16px !important; } #category .products { grid-template-columns: 1fr !important; gap: 28px !important; } #category .thumbnail-container { min-height: auto !important; } #category .product-thumbnail { min-height: 230px !important; } #category .product-description { min-height: auto !important; } } /* ===================================================== FIX CATÉGORIE - RESTAURATION GRILLE PANDA ===================================================== */ #category .products { display: flex !important; flex-wrap: wrap !important; gap: 0 !important; } #category .product-miniature { display: block !important; padding: 0 15px 35px !important; } #category .product-miniature .thumbnail-container { width: 100% !important; height: auto !important; min-height: auto !important; background: #fff !important; border-radius: 22px !important; overflow: hidden !important; border: 1px solid rgba(201, 137, 145, 0.14) !important; box-shadow: 0 14px 38px rgba(43, 35, 31, 0.055) !important; } #category .product-miniature .product-thumbnail { display: block !important; width: 100% !important; min-height: 260px !important; text-align: center !important; } #category .product-miniature .product-thumbnail img, #category .product-miniature img { width: 100% !important; max-width: 100% !important; height: auto !important; padding: 0 !important; object-fit: contain !important; } #category .product-description { position: relative !important; width: 100% !important; height: auto !important; min-height: 105px !important; padding: 16px 12px 20px !important; background: #fff !important; text-align: center !important; } #category .product-title, #category .product-title a { font-size: 14px !important; line-height: 1.35 !important; color: #302926 !important; } #category .product-price-and-shipping, #category .price { font-size: 15px !important; font-weight: 700 !important; color: #211c1a !important; } /* ===================================================== CATÉGORIE PREMIUM SAFE (compatible Panda) ===================================================== */ /* Fond global */ body#category { background: #fbf8f5 !important; } /* Contenu centré + aéré */ #category #wrapper { padding-top: 30px !important; } /* ===================================================== BARRE FILTRE PREMIUM ===================================================== */ #category #js-product-list-top, #category .products-selection { background: #fff !important; border-radius: 20px !important; padding: 18px 24px !important; margin-bottom: 30px !important; border: 1px solid rgba(0,0,0,0.05) !important; box-shadow: 0 10px 30px rgba(0,0,0,0.04) !important; } /* ===================================================== SIDEBAR PREMIUM ===================================================== */ #category #left-column .block, #category #search_filters { background: #fff !important; border-radius: 20px !important; padding: 22px !important; border: 1px solid rgba(0,0,0,0.05) !important; box-shadow: 0 12px 30px rgba(0,0,0,0.05) !important; } /* titres sidebar */ #category #left-column h4 { font-family: Georgia, serif !important; font-weight: 400 !important; font-size: 16px !important; letter-spacing: 1px !important; } /* liens */ #category #left-column a { font-size: 13px !important; color: #4a3f3a !important; transition: 0.2s !important; } #category #left-column a:hover { color: #c98991 !important; padding-left: 5px !important; } /* ===================================================== CARTES PRODUITS PREMIUM ===================================================== */ #category .product-miniature .thumbnail-container { border-radius: 20px !important; overflow: hidden !important; border: 1px solid rgba(0,0,0,0.05) !important; background: #fff !important; transition: 0.3s !important; } /* hover premium */ #category .product-miniature:hover .thumbnail-container { transform: translateY(-6px) !important; box-shadow: 0 20px 45px rgba(0,0,0,0.08) !important; } /* image */ #category .product-thumbnail img { padding: 12px !important; transition: 0.3s !important; } #category .product-miniature:hover img { transform: scale(1.04) !important; } /* description */ #category .product-description { padding: 14px !important; text-align: center !important; } /* titre */ #category .product-title { font-size: 13px !important; color: #2f2825 !important; } /* prix */ #category .price { font-weight: 700 !important; font-size: 15px !important; } /* ===================================================== ESPACES (clé du premium) ===================================================== */ #category .product-miniature { margin-bottom: 30px !important; } /* ===================================================== PAGINATION CLEAN ===================================================== */ #category .pagination a { border-radius: 50% !important; } #category .pagination .current a { background: #c98991 !important; color: #fff !important; } /* ===================================================== BOOST VISUEL ULTRA PREMIUM ===================================================== */ /* === CARTES PRODUITS (effet bloc visible) === */ #category .product-miniature .thumbnail-container { background: #fff !important; border-radius: 22px !important; border: 1px solid rgba(0,0,0,0.06) !important; box-shadow: 0 8px 25px rgba(0,0,0,0.05) !important; transition: all 0.35s ease !important; } /* Hover premium */ #category .product-miniature:hover .thumbnail-container { transform: translateY(-8px) scale(1.01) !important; box-shadow: 0 25px 60px rgba(0,0,0,0.12) !important; } /* Image plus clean */ #category .product-thumbnail img { padding: 16px !important; transition: 0.4s ease !important; } #category .product-miniature:hover img { transform: scale(1.06) !important; } /* Description */ #category .product-description { padding: 18px 16px 22px !important; } /* Nom produit */ #category .product-title { font-size: 13px !important; line-height: 1.4 !important; color: #2f2825 !important; } /* Prix plus premium */ #category .price { font-size: 16px !important; font-weight: 700 !important; letter-spacing: 0.3px !important; } /* === ESPACE GLOBAL (clé du luxe) === */ #category .product-miniature { margin-bottom: 40px !important; } /* === SIDEBAR BOOST === */ #category #left-column .block { background: #fff !important; border-radius: 20px !important; padding: 22px !important; border: 1px solid rgba(0,0,0,0.05) !important; box-shadow: 0 10px 30px rgba(0,0,0,0.05) !important; } /* liens sidebar */ #category #left-column li { padding: 10px 0 !important; } #category #left-column a:hover { color: #c98991 !important; padding-left: 6px !important; } /* === BARRE FILTRE === */ #category #js-product-list-top { background: #fff !important; border-radius: 18px !important; padding: 16px 22px !important; border: 1px solid rgba(0,0,0,0.05) !important; box-shadow: 0 8px 25px rgba(0,0,0,0.04) !important; } /* === PETIT DÉTAIL QUI CHANGE TOUT === */ #category .products { margin-top: 10px !important; } /* ===================================================== PAGE CATÉGORIE - FINAL CLEAN SANS COEUR Compatible Panda : aucun override header/menu ===================================================== */ body#category { background: #fbfaf6 !important; } body#category #wrapper, body#category .columns-container, body#category #content-wrapper { background: #fbfaf6 !important; } body#category #left-column .block, body#category #left-column .block-categories, body#category #search_filters, body#category .category-top-menu { background: #ffffff !important; border: 1px solid rgba(143,150,119,.18) !important; border-radius: 24px !important; padding: 24px 22px !important; box-shadow: 0 18px 45px rgba(55,56,46,.07) !important; overflow: hidden !important; } body#category #left-column a { min-height: 42px !important; color: #3f4036 !important; font-size: 13px !important; text-decoration: none !important; transition: all .22s ease !important; } body#category #left-column a:hover { color: #8f9677 !important; padding-left: 6px !important; } body#category #js-product-list-top, body#category .products-selection, body#category .product_list_top { background: #ffffff !important; border: 1px solid rgba(143,150,119,.14) !important; border-radius: 999px !important; padding: 16px 22px !important; margin-bottom: 34px !important; box-shadow: 0 14px 38px rgba(70,65,55,.07) !important; } body#category .product-miniature, body#category .ajax_block_product, body#category .pro_outer_box { position: relative !important; margin-bottom: 44px !important; } body#category .product-miniature .thumbnail-container, body#category .ajax_block_product .pro_outer_box, body#category .pro_outer_box { background: #ffffff !important; border: 1px solid rgba(143,150,119,.16) !important; border-radius: 26px !important; overflow: hidden !important; box-shadow: 0 18px 45px rgba(70,65,55,.08) !important; transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease !important; } body#category .product-miniature:hover .thumbnail-container, body#category .ajax_block_product:hover .pro_outer_box, body#category .pro_outer_box:hover { transform: translateY(-7px) !important; border-color: rgba(143,150,119,.30) !important; box-shadow: 0 28px 70px rgba(70,65,55,.14) !important; } body#category .product-thumbnail, body#category .pro_first_box, body#category .product_img_link { position: relative !important; background: #ffffff !important; overflow: hidden !important; } body#category .product-thumbnail img, body#category .pro_first_box img, body#category .product_img_link img, body#category .product-miniature img { max-width: 100% !important; height: auto !important; object-fit: contain !important; padding: 18px !important; transition: transform .4s ease, filter .4s ease !important; } body#category .product-miniature:hover img, body#category .ajax_block_product:hover img, body#category .pro_outer_box:hover img { transform: scale(1.045) !important; filter: brightness(.98) contrast(1.02) !important; } body#category .product-description, body#category .pro_second_box, body#category .product_list_item .pro_second_box { background: #ffffff !important; padding: 18px 14px 22px !important; text-align: center !important; } body#category .product-title, body#category .product-title a, body#category .s_title_block, body#category .s_title_block a, body#category .product-name, body#category .product-name a { color: #2b2b2b !important; font-size: 14px !important; line-height: 1.4 !important; font-weight: 500 !important; text-transform: none !important; text-decoration: none !important; } body#category .product-price-and-shipping, body#category .price, body#category .product-price, body#category .current-price { color: #1f1f1f !important; font-size: 16px !important; font-weight: 800 !important; letter-spacing: .2px !important; margin-top: 8px !important; } body#category .hover_fly { position: absolute !important; left: 50% !important; bottom: 42px !important; transform: translateX(-50%) translateY(8px) !important; opacity: 0 !important; visibility: hidden !important; z-index: 30 !important; width: auto !important; min-width: 0 !important; max-width: none !important; background: transparent !important; box-shadow: none !important; transition: all .28s ease !important; } body#category .product-miniature:hover .hover_fly, body#category .ajax_block_product:hover .hover_fly, body#category .pro_outer_box:hover .hover_fly { opacity: 1 !important; visibility: visible !important; transform: translateX(-50%) translateY(0) !important; } body#category .hover_fly .add_to_love, body#category .hover_fly .wishlist_button, body#category .add_to_love, body#category .wishlist_button { display: none !important; } body#category .hover_fly .ajax_add_to_cart_button, body#category .hover_fly a:first-child, body#category .hover_fly button:first-child { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; min-width: 150px !important; max-width: 165px !important; height: 34px !important; padding: 0 16px !important; border-radius: 999px !important; border: none !important; background: rgba(255,255,255,.96) !important; color: #2b2b2b !important; font-size: 10px !important; font-weight: 800 !important; line-height: 34px !important; text-transform: uppercase !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; box-shadow: 0 12px 28px rgba(0,0,0,.14) !important; backdrop-filter: blur(8px) !important; } body#category .hover_fly .ajax_add_to_cart_button:hover, body#category .hover_fly a:first-child:hover, body#category .hover_fly button:first-child:hover { background: #8f9677 !important; color: #ffffff !important; } body#category .alert.alert-warning, body#category #js-product-list-top + .alert, body#category #js-product-list .alert { display: none !important; } @media (max-width: 767px) { body#category .hover_fly { display: none !important; } body#category #left-column { padding-right: 0 !important; margin-bottom: 24px !important; } } /* ===================================================== HEADER PANDA - PLEINE LARGEUR COMME AVANT Correctif final : ne touche pas à la page produit ===================================================== */ #st_header #header_primary_container, #st_header #header_primary_container.container-fluid, #header_primary_container, #header_primary_container.container-fluid { width: 100% !important; max-width: none !important; padding-left: 20px !important; padding-right: 20px !important; } #st_header #header_primary_row, #header_primary_row, #header_primary_row.flex_container, #header_primary_row.flex_container.logo_left { width: 100% !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: nowrap !important; } #st_header #header_left, #st_header #header_center, #st_header #header_right, #header_left, #header_center, #header_right { flex-basis: auto !important; max-width: none !important; min-width: 0 !important; } #st_header #header_left, #header_left { flex: 0 0 auto !important; margin-right: 36px !important; } #st_header #header_left img.logo, #header_left img.logo, #header .logo img, .logo img { width: auto !important; max-width: 250px !important; height: auto !important; max-height: 64px !important; } #st_header #header_center, #header_center { flex: 1 1 auto !important; display: flex !important; justify-content: center !important; overflow: visible !important; } #st_header #st_mega_menu_wrap, #st_header .st_mega_menu, #st_header .st_mega_menu_ul, #st_mega_menu_wrap, .st_mega_menu, .st_mega_menu_ul { display: flex !important; align-items: center !important; flex-wrap: nowrap !important; white-space: nowrap !important; } #st_header .st_mega_menu a, #st_header #st_mega_menu_wrap a, #st_header li.ma_level_0 > a, .st_mega_menu a, #st_mega_menu_wrap a, li.ma_level_0 > a { white-space: nowrap !important; } #st_header #header_right, #header_right { flex: 0 0 auto !important; margin-left: 36px !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; white-space: nowrap !important; } /* ===================================================== FIX CATÉGORIE - BOUTON PANIER PLUS PROPRE ===================================================== */ body#category .hover_fly { bottom: 24px !important; width: auto !important; min-width: 0 !important; max-width: none !important; background: transparent !important; box-shadow: none !important; } body#category .hover_fly .ajax_add_to_cart_button, body#category .hover_fly a:first-child, body#category .hover_fly button:first-child { width: auto !important; min-width: 150px !important; max-width: 165px !important; height: 34px !important; padding: 0 14px !important; border-radius: 999px !important; font-size: 10px !important; line-height: 34px !important; white-space: nowrap !important; background: rgba(255,255,255,.96) !important; color: #2b2b2b !important; box-shadow: 0 12px 28px rgba(0,0,0,.14) !important; } /* Supprime définitivement le cœur/wishlist */ body#category .hover_fly .add_to_love, body#category .hover_fly .wishlist_button { display: none !important; } /* FIX NETTETÉ + POSITION BOUTON PANIER CATÉGORIE */ body#category .product-miniature .hover_fly, body#category .pro_outer_box .hover_fly { bottom: 34px !important; transform: translateX(-50%) !important; filter: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body#category .hover_fly .ajax_add_to_cart_button, body#category .hover_fly a:first-child, body#category .hover_fly button:first-child { background: #ffffff !important; color: #2b2b2b !important; font-size: 10px !important; font-weight: 800 !important; line-height: 34px !important; height: 34px !important; min-width: 154px !important; padding: 0 16px !important; border-radius: 999px !important; box-shadow: 0 10px 22px rgba(0,0,0,.12) !important; text-shadow: none !important; filter: none !important; transform: none !important; -webkit-font-smoothing: antialiased !important; } /* FIX FINAL POSITION BOUTON PANIER CATÉGORIE */ body#category .hover_fly { left: 50% !important; right: auto !important; margin-left: 0 !important; transform: translateX(-50%) !important; bottom: 34px !important; width: 154px !important; min-width: 154px !important; max-width: 154px !important; background: transparent !important; box-shadow: none !important; filter: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body#category .hover_fly .ajax_add_to_cart_button, body#category .hover_fly a:first-child, body#category .hover_fly button:first-child { width: 154px !important; min-width: 154px !important; max-width: 154px !important; height: 34px !important; padding: 0 !important; line-height: 34px !important; border-radius: 999px !important; background: #ffffff !important; color: #2b2b2b !important; font-size: 10px !important; font-weight: 800 !important; text-align: center !important; white-space: nowrap !important; box-shadow: 0 10px 22px rgba(0,0,0,.12) !important; text-shadow: none !important; filter: none !important; } body#category .hover_fly .add_to_love, body#category .hover_fly .wishlist_button { display: none !important; } /* ===================================================== CATÉGORIE - MENU TRI PREMIUM ===================================================== */ body#category .products-sort-order .dropdown-menu { margin-top: 10px !important; padding: 10px !important; border: 1px solid rgba(143,150,119,.18) !important; border-radius: 18px !important; background: #ffffff !important; box-shadow: 0 18px 45px rgba(55,56,46,.14) !important; overflow: hidden !important; } body#category .products-sort-order .dropdown-menu a, body#category .products-sort-order .dropdown-menu .select-list { padding: 12px 16px !important; border-radius: 12px !important; border: none !important; color: #3f4036 !important; font-size: 13px !important; transition: all .2s ease !important; } body#category .products-sort-order .dropdown-menu a:hover, body#category .products-sort-order .dropdown-menu .select-list:hover { background: #f3f1e8 !important; color: #6f765c !important; padding-left: 20px !important; } /* ===================================================== PAGE CMS PREMIUM - SERVICE CLIENT RÉACTIF ===================================================== */ .fs-cms-premium { max-width: 1180px; margin: 0 auto 70px; padding: 10px 18px 40px; color: #3f3a3a; } /* Supprime l'effet trop brut du contenu CMS */ .fs-cms-premium h1, .fs-cms-premium h2, .fs-cms-premium p { letter-spacing: normal; } /* HERO */ .fs-cms-hero { position: relative; overflow: hidden; margin: 10px 0 34px; padding: 58px 58px; border-radius: 28px; background: radial-gradient(circle at top right, rgba(232, 166, 176, 0.28), transparent 35%), linear-gradient(135deg, #fff8f7 0%, #f4e5df 100%); border: 1px solid rgba(190, 135, 128, 0.22); box-shadow: 0 22px 55px rgba(70, 45, 45, 0.08); } .fs-cms-hero::after { content: ""; position: absolute; right: -80px; bottom: -90px; width: 240px; height: 240px; border-radius: 50%; background: rgba(255, 255, 255, 0.46); } .fs-cms-kicker { position: relative; z-index: 1; margin: 0 0 12px; font-size: 13px; font-weight: 700; letter-spacing: 1.8px !important; text-transform: uppercase; color: #bd6a78; } .fs-cms-hero h1 { position: relative; z-index: 1; margin: 0 0 18px; font-family: Georgia, "Times New Roman", serif; font-size: 48px; line-height: 1.08; font-weight: 400; color: #2f2727; } .fs-cms-intro { position: relative; z-index: 1; max-width: 790px; margin: 0; font-size: 16px; line-height: 1.85; color: #5c5353; } /* CARTES */ .fs-cms-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-bottom: 32px; } .fs-cms-card { background: #ffffff; border: 1px solid rgba(190, 135, 128, 0.18); border-radius: 22px; padding: 32px 28px; box-shadow: 0 15px 38px rgba(60, 40, 40, 0.055); transition: transform 0.25s ease, box-shadow 0.25s ease; } .fs-cms-card:hover { transform: translateY(-4px); box-shadow: 0 22px 48px rgba(60, 40, 40, 0.10); } .fs-cms-icon { width: 48px; height: 48px; margin-bottom: 20px; border-radius: 999px; background: #f5e4e1; display: flex; align-items: center; justify-content: center; font-size: 20px; } .fs-cms-card h2 { margin: 0 0 13px; font-size: 22px; line-height: 1.25; font-weight: 600; color: #302929; } .fs-cms-card p { margin: 0; font-size: 15px; line-height: 1.75; color: #625a5a; } /* BLOC ENGAGEMENT */ .fs-cms-highlight { margin-bottom: 32px; padding: 38px 42px; border-radius: 24px; background: #2f2929; box-shadow: 0 20px 45px rgba(38, 25, 25, 0.15); } .fs-cms-highlight h2 { margin: 0 0 14px; font-family: Georgia, "Times New Roman", serif; font-size: 34px; line-height: 1.2; font-weight: 400; color: #ffffff; } .fs-cms-highlight p:not(.fs-cms-kicker) { max-width: 850px; margin: 0; font-size: 15px; line-height: 1.8; color: rgba(255, 255, 255, 0.82); } .fs-cms-highlight .fs-cms-kicker { color: #e7b0b7; } /* INFO RETOURS */ .fs-cms-info-box { margin-bottom: 32px; padding: 30px 34px; border-radius: 20px; background: #fbf6f2; border: 1px solid rgba(190, 135, 128, 0.22); border-left: 5px solid #c97986; } .fs-cms-info-box h2 { margin: 0 0 12px; font-size: 26px; line-height: 1.25; font-weight: 500; color: #302929; } .fs-cms-info-box p { margin: 0; font-size: 15px; line-height: 1.8; color: #5f5757; } .fs-cms-info-box a { color: #b85f72; font-weight: 700; text-decoration: underline; } /* CTA */ .fs-cms-cta { text-align: center; padding: 46px 34px; border-radius: 26px; background: radial-gradient(circle at top left, rgba(232, 166, 176, 0.26), transparent 34%), linear-gradient(135deg, #fff8f7 0%, #f3e1dc 100%); border: 1px solid rgba(190, 135, 128, 0.22); box-shadow: 0 18px 48px rgba(70, 45, 45, 0.08); } .fs-cms-cta h2 { margin: 0 0 12px; font-family: Georgia, "Times New Roman", serif; font-size: 36px; line-height: 1.18; font-weight: 400; color: #2f2727; } .fs-cms-cta p:not(.fs-cms-kicker) { max-width: 640px; margin: 0 auto 24px; font-size: 15px; line-height: 1.75; color: #5c5353; } .fs-cms-button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 13px 30px; border-radius: 999px; background: #2f2929; color: #ffffff !important; font-size: 14px; font-weight: 700; text-decoration: none !important; box-shadow: 0 12px 28px rgba(47, 41, 41, 0.18); transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease; } .fs-cms-button:hover { transform: translateY(-2px); background: #b85f72; box-shadow: 0 16px 34px rgba(184, 95, 114, 0.24); } /* Correction espace CMS */ #cms .page-content.page-cms { padding-top: 0; } /* RESPONSIVE */ @media (max-width: 991px) { .fs-cms-grid { grid-template-columns: 1fr; } .fs-cms-hero { padding: 44px 34px; } .fs-cms-hero h1 { font-size: 40px; } .fs-cms-highlight h2, .fs-cms-cta h2 { font-size: 31px; } } @media (max-width: 575px) { .fs-cms-premium { padding: 6px 14px 36px; margin-bottom: 45px; } .fs-cms-hero { padding: 34px 24px; border-radius: 22px; } .fs-cms-hero h1 { font-size: 32px; } .fs-cms-intro, .fs-cms-card p, .fs-cms-info-box p, .fs-cms-highlight p:not(.fs-cms-kicker), .fs-cms-cta p:not(.fs-cms-kicker) { font-size: 14px; } .fs-cms-card, .fs-cms-highlight, .fs-cms-info-box, .fs-cms-cta { padding: 26px 22px; border-radius: 20px; } .fs-cms-card h2 { font-size: 21px; } .fs-cms-info-box h2 { font-size: 23px; } .fs-cms-highlight h2, .fs-cms-cta h2 { font-size: 28px; } .fs-cms-button { width: 100%; } } /* ===================================================== CORRECTIF PAGE SERVICE CLIENT - CARTES PREMIUM ===================================================== */ #cms .fs-cms-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 22px !important; margin: 0 0 34px 0 !important; padding: 0 !important; } #cms .fs-cms-grid .fs-cms-card { display: block !important; width: auto !important; min-height: 100% !important; margin: 0 !important; padding: 30px 28px !important; background: #ffffff !important; border: 1px solid rgba(190, 135, 128, 0.22) !important; border-radius: 22px !important; box-shadow: 0 15px 38px rgba(60, 40, 40, 0.065) !important; text-align: left !important; } #cms .fs-cms-grid .fs-cms-card .fs-cms-icon { width: 48px !important; height: 48px !important; margin: 0 0 18px 0 !important; border-radius: 50% !important; background: #f5e4e1 !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 20px !important; } #cms .fs-cms-grid .fs-cms-card h2 { margin: 0 0 12px 0 !important; padding: 0 !important; font-size: 22px !important; line-height: 1.25 !important; font-weight: 600 !important; color: #302929 !important; text-align: left !important; } #cms .fs-cms-grid .fs-cms-card p { margin: 0 !important; padding: 0 !important; font-size: 15px !important; line-height: 1.75 !important; color: #625a5a !important; text-align: left !important; } #cms .fs-cms-grid .fs-cms-card:hover { transform: translateY(-4px); box-shadow: 0 22px 48px rgba(60, 40, 40, 0.11) !important; } /* Amélioration CTA bouton */ #cms .fs-cms-button { min-width: 190px !important; padding: 14px 30px !important; font-size: 13px !important; } /* Responsive */ @media (max-width: 991px) { #cms .fs-cms-grid { grid-template-columns: 1fr !important; } } @media (max-width: 575px) { #cms .fs-cms-grid .fs-cms-card { padding: 26px 22px !important; } } /* ===================================================== SERVICE CLIENT - CARTES PREMIUM STABLES ===================================================== */ #cms .fs-service-cards { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 22px !important; margin: 0 0 34px 0 !important; padding: 0 !important; } #cms .fs-service-card { display: block !important; background: #ffffff !important; border: 1px solid rgba(190, 135, 128, 0.22) !important; border-radius: 22px !important; padding: 32px 28px !important; box-shadow: 0 15px 38px rgba(60, 40, 40, 0.065) !important; text-align: left !important; min-height: 100% !important; } #cms .fs-service-card:hover { transform: translateY(-4px) !important; box-shadow: 0 22px 48px rgba(60, 40, 40, 0.11) !important; } #cms .fs-service-icon { width: 48px !important; height: 48px !important; margin: 0 0 20px 0 !important; border-radius: 999px !important; background: #f5e4e1 !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 20px !important; } #cms .fs-service-card h2 { margin: 0 0 13px 0 !important; padding: 0 !important; font-size: 22px !important; line-height: 1.25 !important; font-weight: 600 !important; color: #302929 !important; text-align: left !important; } #cms .fs-service-card p { margin: 0 !important; padding: 0 !important; font-size: 15px !important; line-height: 1.75 !important; color: #625a5a !important; text-align: left !important; } @media (max-width: 991px) { #cms .fs-service-cards { grid-template-columns: 1fr !important; } } @media (max-width: 575px) { #cms .fs-service-card { padding: 26px 22px !important; } } /* ===================================================== CORRECTIF FINAL - CARTES SERVICE CLIENT PREMIUM ===================================================== */ #cms .fs-service-client .fs-service-cards { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 22px !important; width: 100% !important; margin: 0 0 34px 0 !important; padding: 0 !important; } #cms .fs-service-client .fs-service-card { display: block !important; width: auto !important; min-width: 0 !important; min-height: 100% !important; margin: 0 !important; padding: 32px 28px !important; background: #ffffff !important; border: 1px solid rgba(190, 135, 128, 0.22) !important; border-radius: 22px !important; box-shadow: 0 15px 38px rgba(60, 40, 40, 0.065) !important; text-align: left !important; } #cms .fs-service-client .fs-service-card:hover { transform: translateY(-4px) !important; box-shadow: 0 22px 48px rgba(60, 40, 40, 0.11) !important; } #cms .fs-service-client .fs-service-icon { width: 48px !important; height: 48px !important; margin: 0 0 20px 0 !important; padding: 0 !important; border-radius: 999px !important; background: #f5e4e1 !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 20px !important; line-height: 1 !important; } #cms .fs-service-client .fs-service-card h2 { margin: 0 0 13px 0 !important; padding: 0 !important; font-size: 22px !important; line-height: 1.25 !important; font-weight: 600 !important; color: #302929 !important; text-align: left !important; } #cms .fs-service-client .fs-service-card p { margin: 0 !important; padding: 0 !important; font-size: 15px !important; line-height: 1.75 !important; color: #625a5a !important; text-align: left !important; } /* Sécurité : empêche Panda/PrestaShop de casser les blocs */ #cms .fs-service-client .fs-service-cards > div { float: none !important; clear: none !important; } /* Responsive */ @media (max-width: 991px) { #cms .fs-service-client .fs-service-cards { grid-template-columns: 1fr !important; } } @media (max-width: 575px) { #cms .fs-service-client .fs-service-card { padding: 26px 22px !important; border-radius: 20px !important; } #cms .fs-service-client .fs-service-card h2 { font-size: 21px !important; } } /* ===================================================== FINITION PREMIUM - PAGE SERVICE CLIENT ===================================================== */ /* Page un peu plus large et plus élégante */ #cms .fs-service-client { max-width: 1060px !important; } /* Hero plus respirant */ #cms .fs-service-client .fs-cms-hero { padding: 54px 58px !important; margin-bottom: 28px !important; } /* Cartes plus premium */ #cms .fs-service-client .fs-service-card { padding: 34px 30px !important; min-height: 210px !important; } #cms .fs-service-client .fs-service-card h2 { font-size: 21px !important; margin-bottom: 14px !important; } #cms .fs-service-client .fs-service-card p { font-size: 14px !important; line-height: 1.75 !important; } /* Bloc noir plus haut de gamme */ #cms .fs-service-client .fs-cms-highlight { padding: 40px 42px !important; } /* Encadré retours plus lisible */ #cms .fs-service-client .fs-cms-info-box { padding: 32px 36px !important; } /* CTA plus premium */ #cms .fs-service-client .fs-cms-cta { padding: 48px 36px !important; } #cms .fs-service-client .fs-cms-button { min-width: 210px !important; min-height: 44px !important; padding: 13px 28px !important; font-size: 13px !important; font-weight: 700 !important; } /* Mobile */ @media (max-width: 575px) { #cms .fs-service-client { max-width: 100% !important; } #cms .fs-service-client .fs-cms-hero { padding: 34px 24px !important; } #cms .fs-service-client .fs-service-card { min-height: auto !important; } } /* ===================================================== MICRO-FINITIONS - SERVICE CLIENT ===================================================== */ #cms .fs-service-client .fs-cms-highlight p:not(.fs-cms-kicker) { font-size: 14px !important; line-height: 1.85 !important; max-width: 900px !important; } #cms .fs-service-client .fs-cms-button { min-width: 230px !important; min-height: 48px !important; font-size: 13px !important; border-radius: 999px !important; } #cms .fs-service-client .fs-cms-button:hover { background: #b85f72 !important; color: #ffffff !important; } /* ===================================================== AJUSTEMENT CTA SERVICE CLIENT - PLUS COMPACT ===================================================== */ #cms .fs-service-client .fs-cms-cta { padding: 38px 34px 36px !important; margin-bottom: 0 !important; } #cms .fs-service-client .fs-cms-cta h2 { font-size: 32px !important; margin-bottom: 12px !important; } #cms .fs-service-client .fs-cms-cta p:not(.fs-cms-kicker) { max-width: 620px !important; margin-bottom: 22px !important; line-height: 1.65 !important; } #cms .fs-service-client .fs-cms-button { min-width: 220px !important; min-height: 46px !important; padding: 12px 28px !important; } /* ===================================================== ESPACE BAS PAGE SERVICE CLIENT ===================================================== */ #cms .fs-service-client { margin-bottom: 45px !important; } #cms .fs-service-client .fs-cms-cta { margin-bottom: 45px !important; } /* ===================================================== PAGE EXPÉDITION DISCRÈTE - FINITIONS PREMIUM ===================================================== */ /* Espace avant le footer */ .fs-shipping-page { padding-bottom: 55px; } /* FAQ plus premium */ .fs-cms-faq { margin-top: 34px; } .fs-cms-faq h2 { margin-bottom: 18px; } .fs-cms-faq-item { background: #ffffff; border: 1px solid rgba(68, 44, 44, 0.08); border-radius: 12px; padding: 16px 18px; margin-bottom: 12px; box-shadow: 0 8px 22px rgba(43, 35, 35, 0.05); } .fs-cms-faq-item h3 { font-size: 15px; font-weight: 600; color: #2d2424; margin: 0 0 7px 0; } .fs-cms-faq-item p { font-size: 13px; line-height: 1.65; color: #5f5555; margin: 0; } /* Responsive mobile */ @media (max-width: 767px) { .fs-shipping-page { padding-bottom: 40px; } .fs-cms-faq-item { padding: 15px; border-radius: 10px; } } /* ===================================================== PAGE CMS - PAIEMENT 100% SÉCURISÉ - VERSION PREMIUM ===================================================== */ .fs-cms-premium { max-width: 1180px; margin: 0 auto; padding: 35px 20px 70px; color: #2f2a2a; } /* HERO */ .fs-cms-hero { position: relative; overflow: hidden; text-align: center; max-width: 740px; margin: 0 auto 42px; padding: 48px 48px 46px; border-radius: 22px; border: 1px solid rgba(185, 130, 116, 0.25); background: radial-gradient(circle at 88% 95%, rgba(255,255,255,0.75) 0, rgba(255,255,255,0.75) 14%, transparent 15%), linear-gradient(135deg, #fff7f6 0%, #fae0df 100%); box-shadow: 0 24px 55px rgba(92, 54, 54, 0.10); } .fs-cms-kicker { margin-bottom: 12px; font-size: 13px; letter-spacing: 1.9px; text-transform: uppercase; color: #8f6f67; font-weight: 700; } .fs-cms-hero h1 { margin: 0 0 18px; font-family: Georgia, "Times New Roman", serif; font-size: 40px; line-height: 1.15; font-weight: 400; color: #332727; } .fs-cms-hero p { max-width: 620px; margin: 0 auto; font-size: 15.5px; line-height: 1.8; color: #5f5353; } /* CONTENT */ .fs-cms-content { display: flex; flex-direction: column; gap: 28px; } .fs-info-card { background: #ffffff; border: 1px solid rgba(185, 130, 116, 0.18); border-radius: 16px; padding: 32px; box-shadow: 0 16px 40px rgba(65, 45, 45, 0.055); } .fs-highlight-card { background: linear-gradient(135deg, #fffdfc 0%, #fff7f5 100%); } .fs-info-card h2 { margin: 0 0 16px; font-family: Georgia, "Times New Roman", serif; font-size: 27px; line-height: 1.25; font-weight: 400; color: #332727; } .fs-info-card h3 { margin: 0 0 7px; font-size: 15.5px; font-weight: 700; color: #332727; } .fs-info-card p { margin: 0 0 14px; font-size: 15.2px; line-height: 1.75; color: #5f5353; } .fs-info-card p:last-child { margin-bottom: 0; } /* MOYENS DE PAIEMENT */ .fs-payment-methods { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 26px; } .fs-payment-item { display: flex; gap: 14px; align-items: flex-start; min-height: 118px; padding: 22px; background: #ffffff; border-radius: 15px; border: 1px solid rgba(185, 130, 116, 0.16); transition: all 0.25s ease; } .fs-payment-item:hover { transform: translateY(-3px); box-shadow: 0 14px 32px rgba(65, 45, 45, 0.08); border-color: rgba(185, 130, 116, 0.32); } .fs-payment-icon { display: flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; border-radius: 50%; background: #f7e7e4; font-size: 18px; } .fs-payment-item p { font-size: 14.5px; line-height: 1.65; } /* COLONNES */ .fs-two-columns { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; } /* BANDEAU RÉASSURANCE */ .fs-reassurance-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: -4px; padding: 28px 26px; border-radius: 16px; background: linear-gradient(135deg, #332727 0%, #251d1d 100%); color: #ffffff; box-shadow: 0 18px 40px rgba(37, 29, 29, 0.18); } .fs-reassurance-strip div { text-align: center; padding: 6px 12px; } .fs-reassurance-strip strong { display: block; margin-bottom: 7px; font-size: 15px; font-weight: 700; } .fs-reassurance-strip span { display: block; font-size: 13.5px; color: rgba(255,255,255,0.72); } /* RESPONSIVE */ @media (max-width: 900px) { .fs-payment-methods, .fs-two-columns, .fs-reassurance-strip { grid-template-columns: 1fr; } .fs-cms-hero { padding: 38px 26px; } .fs-cms-hero h1 { font-size: 34px; } .fs-info-card { padding: 26px 22px; } } @media (max-width: 480px) { .fs-cms-premium { padding: 28px 15px 50px; } .fs-cms-hero h1 { font-size: 30px; } .fs-cms-hero p, .fs-info-card p { font-size: 15px; } .fs-info-card h2 { font-size: 24px; } .fs-payment-item { padding: 18px; } } /* ===================================================== AJUSTEMENTS LISIBILITÉ PAGE PAIEMENT SÉCURISÉ ===================================================== */ /* Page un peu plus respirante */ .fs-cms-premium { padding-top: 42px !important; padding-bottom: 80px !important; } /* Hero un peu plus lisible */ .fs-cms-hero { max-width: 760px !important; padding: 50px 52px 48px !important; } .fs-cms-hero h1 { font-size: 42px !important; } .fs-cms-hero p { font-size: 16px !important; line-height: 1.85 !important; } /* Titres et textes plus confortables */ .fs-info-card h2 { font-size: 28px !important; } .fs-info-card p { font-size: 15.8px !important; line-height: 1.85 !important; } /* Cartes moyens de paiement moins serrées */ .fs-payment-item { min-height: 126px !important; padding: 24px !important; } .fs-payment-item h3 { font-size: 16px !important; } .fs-payment-item p { font-size: 14.8px !important; line-height: 1.7 !important; } /* Bandeau bas plus élégant */ .fs-reassurance-strip { margin-top: 0 !important; padding: 30px 28px !important; } .fs-reassurance-strip strong { font-size: 15.5px !important; } .fs-reassurance-strip span { font-size: 13.8px !important; } /* ===================================================== PAGE CMS - EMBALLAGE NEUTRE Version propre sur le modèle des pages CMS premium Service client / Expédition discrète Ne casse ni le menu, ni le footer ===================================================== */ /* Conteneur principal */ .fs-packaging-page, .fs-neutral-packaging-page { max-width: 1180px !important; margin: 34px auto 70px !important; padding: 0 18px !important; color: #3f4036 !important; font-family: inherit !important; } .fs-packaging-page *, .fs-neutral-packaging-page * { box-sizing: border-box !important; } /* Hero premium */ .fs-packaging-page .fs-premium-hero, .fs-neutral-packaging-page .fs-premium-hero { position: relative !important; overflow: hidden !important; border-radius: 28px !important; padding: 58px 46px !important; margin-bottom: 34px !important; background: radial-gradient(circle at top left, rgba(255,255,255,.70), transparent 38%), linear-gradient(135deg, #f7f4ec 0%, #eef0e6 52%, #ded9ca 100%) !important; box-shadow: 0 24px 70px rgba(78,50,56,.10) !important; } .fs-packaging-page .fs-premium-hero::after, .fs-neutral-packaging-page .fs-premium-hero::after { content: "" !important; position: absolute !important; right: -90px !important; top: -90px !important; width: 260px !important; height: 260px !important; border-radius: 50% !important; background: rgba(255,255,255,.42) !important; } .fs-packaging-page .fs-premium-kicker, .fs-neutral-packaging-page .fs-premium-kicker { position: relative !important; z-index: 2 !important; display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 8px 15px !important; margin-bottom: 18px !important; border-radius: 999px !important; background: rgba(255,255,255,.72) !important; color: #6f765c !important; font-size: 12px !important; line-height: 1.2 !important; font-weight: 700 !important; letter-spacing: 1.4px !important; text-transform: uppercase !important; } .fs-packaging-page .fs-premium-hero h1, .fs-neutral-packaging-page .fs-premium-hero h1 { position: relative !important; z-index: 2 !important; max-width: 760px !important; margin: 0 !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(34px, 5vw, 58px) !important; line-height: 1.05 !important; font-weight: 400 !important; color: #2b2b2b !important; text-transform: none !important; letter-spacing: 0 !important; } .fs-packaging-page .fs-premium-hero h1 span, .fs-neutral-packaging-page .fs-premium-hero h1 span { color: #8f9677 !important; } .fs-packaging-page .fs-premium-hero p, .fs-neutral-packaging-page .fs-premium-hero p { position: relative !important; z-index: 2 !important; max-width: 760px !important; margin: 22px 0 0 !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-size: 17px !important; line-height: 1.75 !important; color: #5d5b50 !important; } /* 3 cartes hautes */ .fs-packaging-page .fs-premium-grid, .fs-neutral-packaging-page .fs-premium-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 18px !important; margin: 28px 0 34px !important; } .fs-packaging-page .fs-premium-card, .fs-neutral-packaging-page .fs-premium-card { background: #ffffff !important; border: 1px solid rgba(143,150,119,.18) !important; border-radius: 24px !important; padding: 28px 26px !important; box-shadow: 0 16px 42px rgba(64,42,48,.07) !important; } .fs-packaging-page .fs-premium-icon, .fs-neutral-packaging-page .fs-premium-icon { width: 48px !important; height: 48px !important; border-radius: 16px !important; display: flex !important; align-items: center !important; justify-content: center !important; background: #eef0e6 !important; color: #8f9677 !important; font-size: 22px !important; margin-bottom: 17px !important; } .fs-packaging-page .fs-premium-card h2, .fs-packaging-page .fs-premium-card h3, .fs-neutral-packaging-page .fs-premium-card h2, .fs-neutral-packaging-page .fs-premium-card h3 { margin: 0 0 12px !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 22px !important; line-height: 1.25 !important; font-weight: 400 !important; color: #2b2b2b !important; text-transform: none !important; letter-spacing: 0 !important; } .fs-packaging-page .fs-premium-card p, .fs-neutral-packaging-page .fs-premium-card p { margin: 0 !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-size: 15px !important; line-height: 1.7 !important; color: #5d5b50 !important; } /* Sections contenu */ .fs-packaging-page .fs-premium-section, .fs-neutral-packaging-page .fs-premium-section { background: #ffffff !important; border-radius: 28px !important; padding: 38px !important; margin: 0 0 26px !important; border: 1px solid rgba(143,150,119,.16) !important; box-shadow: 0 16px 45px rgba(64,42,48,.06) !important; } .fs-packaging-page .fs-premium-section h2, .fs-neutral-packaging-page .fs-premium-section h2 { margin: 0 0 16px !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(27px, 3vw, 38px) !important; line-height: 1.18 !important; font-weight: 400 !important; color: #2b2b2b !important; text-transform: none !important; letter-spacing: 0 !important; } .fs-packaging-page .fs-premium-section p, .fs-neutral-packaging-page .fs-premium-section p { margin: 0 0 16px !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-size: 16px !important; line-height: 1.78 !important; color: #5d5b50 !important; } /* Liste premium */ .fs-packaging-page .fs-premium-list, .fs-neutral-packaging-page .fs-premium-list { display: grid !important; gap: 13px !important; margin: 22px 0 0 !important; padding: 0 !important; list-style: none !important; } .fs-packaging-page .fs-premium-list li, .fs-neutral-packaging-page .fs-premium-list li { position: relative !important; margin: 0 !important; padding: 15px 18px 15px 48px !important; background: #f7f4ec !important; border-radius: 18px !important; color: #4f5143 !important; line-height: 1.55 !important; border: 1px solid #ded9ca !important; box-shadow: none !important; } .fs-packaging-page .fs-premium-list li::before, .fs-neutral-packaging-page .fs-premium-list li::before { content: "✓" !important; position: absolute !important; left: 18px !important; top: 15px !important; width: 21px !important; height: 21px !important; border-radius: 50% !important; background: #8f9677 !important; color: #ffffff !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 13px !important; font-weight: 700 !important; } /* Bloc double */ .fs-packaging-page .fs-premium-highlight, .fs-neutral-packaging-page .fs-premium-highlight { display: grid !important; grid-template-columns: 1.1fr .9fr !important; gap: 22px !important; align-items: stretch !important; margin: 28px 0 26px !important; } .fs-packaging-page .fs-premium-soft-box, .fs-neutral-packaging-page .fs-premium-soft-box { background: linear-gradient(135deg, #f7f4ec, #eef0e6) !important; border-radius: 26px !important; padding: 32px !important; border: 1px solid #ded9ca !important; } .fs-packaging-page .fs-premium-note, .fs-neutral-packaging-page .fs-premium-note { border-radius: 26px !important; padding: 30px !important; background: #333628 !important; color: #ffffff !important; box-shadow: 0 22px 55px rgba(47,41,43,.16) !important; } .fs-packaging-page .fs-premium-soft-box h3, .fs-packaging-page .fs-premium-note h3, .fs-neutral-packaging-page .fs-premium-soft-box h3, .fs-neutral-packaging-page .fs-premium-note h3 { margin: 0 0 12px !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 24px !important; line-height: 1.22 !important; font-weight: 400 !important; color: #2b2b2b !important; } .fs-packaging-page .fs-premium-note h3, .fs-packaging-page .fs-premium-note p, .fs-neutral-packaging-page .fs-premium-note h3, .fs-neutral-packaging-page .fs-premium-note p { color: #ffffff !important; } .fs-packaging-page .fs-premium-soft-box p, .fs-packaging-page .fs-premium-note p, .fs-neutral-packaging-page .fs-premium-soft-box p, .fs-neutral-packaging-page .fs-premium-note p { margin: 0 !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-size: 15px !important; line-height: 1.75 !important; } /* FAQ */ .fs-packaging-page .fs-premium-faq, .fs-neutral-packaging-page .fs-premium-faq { display: grid !important; gap: 14px !important; margin-top: 22px !important; } .fs-packaging-page .fs-premium-faq-item, .fs-neutral-packaging-page .fs-premium-faq-item { padding: 22px 24px !important; border-radius: 20px !important; background: #f7f4ec !important; border: 1px solid #ded9ca !important; } .fs-packaging-page .fs-premium-faq-item h3, .fs-neutral-packaging-page .fs-premium-faq-item h3 { margin: 0 0 8px !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-size: 18px !important; line-height: 1.35 !important; color: #2b2b2b !important; font-weight: 700 !important; } .fs-packaging-page .fs-premium-faq-item p, .fs-neutral-packaging-page .fs-premium-faq-item p { margin: 0 !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-size: 15px !important; line-height: 1.7 !important; color: #5d5b50 !important; } /* CTA final */ .fs-packaging-page .fs-premium-cta, .fs-neutral-packaging-page .fs-premium-cta { margin-top: 30px !important; padding: 34px 38px !important; border-radius: 28px !important; background: linear-gradient(135deg, #9ca584 0%, #6f765c 100%) !important; color: #ffffff !important; text-align: center !important; box-shadow: 0 20px 55px rgba(111,118,92,.23) !important; } .fs-packaging-page .fs-premium-cta h2, .fs-neutral-packaging-page .fs-premium-cta h2 { margin: 0 0 12px !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(26px, 3vw, 38px) !important; line-height: 1.18 !important; font-weight: 400 !important; color: #ffffff !important; text-align: center !important; } .fs-packaging-page .fs-premium-cta p, .fs-neutral-packaging-page .fs-premium-cta p { max-width: 760px !important; margin: 0 auto !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; color: rgba(255,255,255,.88) !important; font-size: 16px !important; line-height: 1.72 !important; text-align: center !important; } /* Responsive */ @media (max-width: 900px) { .fs-packaging-page .fs-premium-grid, .fs-neutral-packaging-page .fs-premium-grid, .fs-packaging-page .fs-premium-highlight, .fs-neutral-packaging-page .fs-premium-highlight { grid-template-columns: 1fr !important; } .fs-packaging-page .fs-premium-hero, .fs-neutral-packaging-page .fs-premium-hero { padding: 42px 28px !important; } .fs-packaging-page .fs-premium-section, .fs-neutral-packaging-page .fs-premium-section { padding: 30px 24px !important; } } @media (max-width: 520px) { .fs-packaging-page, .fs-neutral-packaging-page { padding: 0 12px !important; margin: 26px auto 48px !important; } .fs-packaging-page .fs-premium-hero, .fs-packaging-page .fs-premium-section, .fs-packaging-page .fs-premium-card, .fs-packaging-page .fs-premium-soft-box, .fs-packaging-page .fs-premium-note, .fs-packaging-page .fs-premium-cta, .fs-neutral-packaging-page .fs-premium-hero, .fs-neutral-packaging-page .fs-premium-section, .fs-neutral-packaging-page .fs-premium-card, .fs-neutral-packaging-page .fs-premium-soft-box, .fs-neutral-packaging-page .fs-premium-note, .fs-neutral-packaging-page .fs-premium-cta { border-radius: 22px !important; padding: 24px 20px !important; } .fs-packaging-page .fs-premium-hero h1, .fs-neutral-packaging-page .fs-premium-hero h1 { font-size: 32px !important; } .fs-packaging-page .fs-premium-hero p, .fs-packaging-page .fs-premium-section p, .fs-neutral-packaging-page .fs-premium-hero p, .fs-neutral-packaging-page .fs-premium-section p { font-size: 15px !important; } } /* ===================================================== PAGE EMBALLAGE NEUTRE - FINITIONS PREMIUM ===================================================== */ /* Espace avant le footer */ .fs-packaging-page { padding-bottom: 55px; } /* FAQ plus premium */ .fs-packaging-page .fs-cms-faq { margin-top: 34px; } .fs-packaging-page .fs-cms-faq h2 { margin-bottom: 18px; } .fs-packaging-page .fs-cms-faq-item { background: #ffffff; border: 1px solid rgba(68, 44, 44, 0.08); border-radius: 12px; padding: 16px 18px; margin-bottom: 12px; box-shadow: 0 8px 22px rgba(43, 35, 35, 0.05); } .fs-packaging-page .fs-cms-faq-item h3 { font-size: 15px; font-weight: 600; color: #2d2424; margin: 0 0 7px 0; } .fs-packaging-page .fs-cms-faq-item p { font-size: 13px; line-height: 1.65; color: #5f5555; margin: 0; } /* Responsive mobile */ @media (max-width: 767px) { .fs-packaging-page { padding-bottom: 40px; } .fs-packaging-page .fs-cms-faq-item { padding: 15px; border-radius: 10px; } } /* ===================================================== PAGE EXPÉDITION DISCRÈTE - BLOCS TEXTE PREMIUM ===================================================== */ .fs-shipping-info { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 34px 0 30px 0; } .fs-shipping-info-card { background: #ffffff; border: 1px solid rgba(68, 44, 44, 0.08); border-radius: 16px; padding: 24px 26px; box-shadow: 0 14px 34px rgba(43, 35, 35, 0.06); } .fs-shipping-info-card:hover { transform: translateY(-2px); box-shadow: 0 18px 42px rgba(43, 35, 35, 0.09); transition: all 0.25s ease; } .fs-shipping-label { display: inline-block; margin-bottom: 10px; font-size: 11px; line-height: 1; text-transform: uppercase; letter-spacing: 1.1px; font-weight: 700; color: #d96f82; } .fs-shipping-info-card h2 { margin: 0 0 12px 0; font-family: Georgia, "Times New Roman", serif; font-size: 25px; line-height: 1.2; font-weight: 400; color: #2d2424; } .fs-shipping-info-card p { margin: 0 0 10px 0; font-size: 14px; line-height: 1.75; color: #5d5555; } .fs-shipping-info-card p:last-child { margin-bottom: 0; } .fs-shipping-warning { background: linear-gradient(135deg, #fffafa 0%, #fff4f5 100%); border-color: rgba(217, 111, 130, 0.18); } /* Mobile */ @media (max-width: 767px) { .fs-shipping-info { grid-template-columns: 1fr; gap: 14px; margin: 26px 0 26px 0; } .fs-shipping-info-card { padding: 20px 18px; border-radius: 14px; } .fs-shipping-info-card h2 { font-size: 22px; } .fs-shipping-info-card p { font-size: 13px; line-height: 1.65; } } /* ===================================================== PAGE EMBALLAGE NEUTRE - BLOCS TEXTE PREMIUM ===================================================== */ .fs-packaging-page { padding-bottom: 55px; } .fs-packaging-info { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 34px 0 30px 0; } .fs-packaging-info-card { background: #ffffff; border: 1px solid rgba(68, 44, 44, 0.08); border-radius: 16px; padding: 24px 26px; box-shadow: 0 14px 34px rgba(43, 35, 35, 0.06); } .fs-packaging-info-card:hover { transform: translateY(-2px); box-shadow: 0 18px 42px rgba(43, 35, 35, 0.09); transition: all 0.25s ease; } .fs-packaging-label { display: inline-block; margin-bottom: 10px; font-size: 11px; line-height: 1; text-transform: uppercase; letter-spacing: 1.1px; font-weight: 700; color: #d96f82; } .fs-packaging-info-card h2 { margin: 0 0 12px 0; font-family: Georgia, "Times New Roman", serif; font-size: 25px; line-height: 1.2; font-weight: 400; color: #2d2424; } .fs-packaging-info-card p { margin: 0 0 10px 0; font-size: 14px; line-height: 1.75; color: #5d5555; } .fs-packaging-info-card p:last-child { margin-bottom: 0; } .fs-packaging-warning { background: linear-gradient(135deg, #fffafa 0%, #fff4f5 100%); border-color: rgba(217, 111, 130, 0.18); } /* FAQ plus premium */ .fs-packaging-page .fs-cms-faq { margin-top: 34px; } .fs-packaging-page .fs-cms-faq h2 { margin-bottom: 18px; } .fs-packaging-page .fs-cms-faq-item { background: #ffffff; border: 1px solid rgba(68, 44, 44, 0.08); border-radius: 12px; padding: 16px 18px; margin-bottom: 12px; box-shadow: 0 8px 22px rgba(43, 35, 35, 0.05); } .fs-packaging-page .fs-cms-faq-item h3 { font-size: 15px; font-weight: 600; color: #2d2424; margin: 0 0 7px 0; } .fs-packaging-page .fs-cms-faq-item p { font-size: 13px; line-height: 1.65; color: #5f5555; margin: 0; } /* Mobile */ @media (max-width: 767px) { .fs-packaging-page { padding-bottom: 40px; } .fs-packaging-info { grid-template-columns: 1fr; gap: 14px; margin: 26px 0 26px 0; } .fs-packaging-info-card { padding: 20px 18px; border-radius: 14px; } .fs-packaging-info-card h2 { font-size: 22px; } .fs-packaging-info-card p { font-size: 13px; line-height: 1.65; } .fs-packaging-page .fs-cms-faq-item { padding: 15px; border-radius: 10px; } } /* ===================================================== PAGE GESTION DES COOKIES - VERSION ISOLÉE V2 Folies Secrètes ===================================================== */ .fs-cookie-v2-page { width: 100%; padding: 32px 18px 80px 18px; box-sizing: border-box; color: #2b2b2b; } /* Bandeau haut */ .fs-cookie-v2-hero { width: 100%; max-width: 720px; margin: 0 auto 34px auto; padding: 46px 48px; text-align: center; border-radius: 24px; border: 1px solid rgba(217, 111, 130, 0.25); background: radial-gradient(circle at top left, rgba(231, 71, 114, 0.14), transparent 36%), linear-gradient(135deg, #fff7f8 0%, #ffffff 55%, #f7efec 100%); box-shadow: 0 18px 45px rgba(43, 43, 43, 0.08); box-sizing: border-box; } .fs-cookie-v2-kicker { margin: 0 0 12px 0; font-size: 13px; font-weight: 700; letter-spacing: 1.7px; text-transform: uppercase; color: #5f5652; } .fs-cookie-v2-hero h1 { margin: 0 0 18px 0; font-family: Georgia, "Times New Roman", serif; font-size: 42px; line-height: 1.08; font-weight: 400; color: #2b2b2b; } .fs-cookie-v2-hero p { max-width: 610px; margin: 0 auto; font-size: 16px; line-height: 1.75; color: #5a5050; } /* Conteneur principal */ .fs-cookie-v2-container { width: 100%; max-width: 900px; margin: 0 auto; } /* Sections et cartes */ .fs-cookie-v2-section, .fs-cookie-v2-card { width: 100%; margin: 0 0 24px 0; padding: 32px 36px; border-radius: 20px; background: #ffffff; border: 1px solid rgba(217, 111, 130, 0.16); box-shadow: 0 12px 34px rgba(43, 43, 43, 0.06); box-sizing: border-box; } .fs-cookie-v2-intro { background: linear-gradient(135deg, rgba(255, 247, 248, 0.98), rgba(255, 255, 255, 1)); } /* Titres */ .fs-cookie-v2-section h2 { margin: 0 0 16px 0; font-family: Georgia, "Times New Roman", serif; font-size: 30px; line-height: 1.2; font-weight: 400; color: #2b2b2b; } .fs-cookie-v2-card h3 { margin: 0 0 10px 0; font-size: 18px; line-height: 1.35; font-weight: 700; color: #2b2b2b; } /* Textes */ .fs-cookie-v2-section p, .fs-cookie-v2-card p { margin: 0 0 12px 0; font-size: 15.5px; line-height: 1.75; color: #555; } .fs-cookie-v2-section p:last-child, .fs-cookie-v2-card p:last-child { margin-bottom: 0; } /* Numéros des cartes */ .fs-cookie-v2-card span { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; margin-bottom: 16px; border-radius: 999px; background: linear-gradient(135deg, #e74772, #d96f82); color: #ffffff; font-size: 12px; font-weight: 700; box-shadow: 0 10px 22px rgba(231, 71, 114, 0.22); } /* Note dans chaque carte */ .fs-cookie-v2-card div { margin-top: 15px; padding: 14px 16px; border-radius: 14px; background: #fff7f8; color: #6b4b50; font-size: 14.5px; line-height: 1.58; border-left: 3px solid #d96f82; } /* Encadré "Votre choix reste libre" */ .fs-cookie-v2-box { margin-top: 22px; padding: 22px 24px; border-radius: 18px; background: #fff7f8; border: 1px solid rgba(217, 111, 130, 0.20); } .fs-cookie-v2-box h3 { margin: 0 0 10px 0; font-family: Georgia, "Times New Roman", serif; font-size: 24px; font-weight: 400; color: #2b2b2b; } .fs-cookie-v2-box p { margin-bottom: 0; } /* Tableau */ .fs-cookie-v2-table-wrap { width: 100%; overflow-x: auto; margin-top: 18px; border-radius: 16px; border: 1px solid rgba(217, 111, 130, 0.16); } .fs-cookie-v2-table { width: 100%; min-width: 680px; border-collapse: collapse; background: #ffffff; } .fs-cookie-v2-table th { padding: 16px 18px; text-align: left; background: #fff7f8; color: #2b2b2b; font-size: 14px; font-weight: 700; border-bottom: 1px solid rgba(217, 111, 130, 0.16); } .fs-cookie-v2-table td { padding: 16px 18px; font-size: 14.5px; line-height: 1.55; color: #555; border-bottom: 1px solid rgba(217, 111, 130, 0.10); } .fs-cookie-v2-table tbody tr:last-child td { border-bottom: none; } /* Bloc contact */ .fs-cookie-v2-contact { margin-bottom: 0; background: radial-gradient(circle at top right, rgba(231, 71, 114, 0.10), transparent 36%), linear-gradient(135deg, #ffffff 0%, #fff7f8 100%); } .fs-cookie-v2-email { display: inline-flex; margin-top: 8px !important; padding: 12px 18px; border-radius: 999px; background: #ffffff; color: #d96f82 !important; font-weight: 700; border: 1px solid rgba(217, 111, 130, 0.22); } /* Effet hover léger */ .fs-cookie-v2-card { transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; } .fs-cookie-v2-card:hover { transform: translateY(-2px); box-shadow: 0 16px 38px rgba(43, 43, 43, 0.085); border-color: rgba(217, 111, 130, 0.28); } /* Responsive tablette */ @media (max-width: 768px) { .fs-cookie-v2-page { padding: 24px 14px 55px 14px; } .fs-cookie-v2-hero { padding: 36px 24px; border-radius: 22px; } .fs-cookie-v2-hero h1 { font-size: 32px; } .fs-cookie-v2-hero p { font-size: 15px; line-height: 1.65; } .fs-cookie-v2-kicker { font-size: 12px; letter-spacing: 1.3px; } .fs-cookie-v2-section, .fs-cookie-v2-card { padding: 26px 22px; border-radius: 18px; } .fs-cookie-v2-section h2 { font-size: 25px; } .fs-cookie-v2-box { padding: 22px 20px; } .fs-cookie-v2-table { min-width: 640px; } } /* Responsive mobile */ @media (max-width: 480px) { .fs-cookie-v2-hero h1 { font-size: 29px; } .fs-cookie-v2-section h2 { font-size: 24px; } .fs-cookie-v2-section p, .fs-cookie-v2-card p { font-size: 15px; } .fs-cookie-v2-card div { font-size: 14px; } } /* ===================================================== PAGE COOKIES V2 - LARGEUR PLUS PREMIUM ===================================================== */ .fs-cookie-v2-hero { max-width: 760px; } .fs-cookie-v2-container { max-width: 820px; } .fs-cookie-v2-section, .fs-cookie-v2-card { padding: 34px 40px; } @media (max-width: 768px) { .fs-cookie-v2-hero, .fs-cookie-v2-container { max-width: 100%; } .fs-cookie-v2-section, .fs-cookie-v2-card { padding: 26px 22px; } } /* ===================================================== MENTIONS LÉGALES - CORRECTION FINALE ===================================================== */ .fs-legal-readable { max-width: 1040px !important; margin: 0 auto !important; padding-bottom: 60px !important; } /* Hero */ .fs-legal-readable .fs-cms-hero { max-width: 620px !important; margin: 0 auto 34px !important; } /* Blocs noirs */ .fs-legal-readable .fs-cms-highlight { max-width: 900px !important; margin-left: auto !important; margin-right: auto !important; padding: 34px 38px !important; } /* Grille Directeur / Hébergement */ .fs-legal-readable .fs-cms-grid { max-width: 900px !important; margin: 0 auto 36px !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 28px !important; } .fs-legal-readable .fs-cms-card { padding: 30px 32px !important; min-height: 100% !important; } /* Sections texte */ .fs-legal-readable .fs-cms-section:not(.fs-cms-highlight) { max-width: 900px !important; margin: 0 auto 32px !important; } /* Typo */ .fs-legal-readable .fs-cms-highlight h2 { font-size: 26px !important; } .fs-legal-readable .fs-cms-section:not(.fs-cms-highlight) h2 { font-size: 25px !important; margin-bottom: 12px !important; } .fs-legal-readable .fs-cms-card h2 { font-size: 22px !important; margin-bottom: 12px !important; } .fs-legal-readable .fs-cms-section p, .fs-legal-readable .fs-cms-card p, .fs-legal-readable .fs-cms-highlight p, .fs-legal-readable a, .fs-legal-readable strong { font-size: 15.5px !important; line-height: 1.85 !important; letter-spacing: normal !important; } /* Contact */ .fs-legal-readable .fs-cms-highlight:last-child { margin-top: 42px !important; margin-bottom: 0 !important; } /* Mobile */ @media (max-width: 768px) { .fs-legal-readable { padding-left: 15px !important; padding-right: 15px !important; } .fs-legal-readable .fs-cms-grid { grid-template-columns: 1fr !important; gap: 18px !important; } .fs-legal-readable .fs-cms-highlight, .fs-legal-readable .fs-cms-card { padding: 24px 22px !important; } .fs-legal-readable .fs-cms-section p, .fs-legal-readable .fs-cms-card p, .fs-legal-readable .fs-cms-highlight p, .fs-legal-readable a, .fs-legal-readable strong { font-size: 14.5px !important; line-height: 1.75 !important; } } /* Ajustement largeur cartes Mentions légales */ .fs-legal-readable .fs-cms-grid { max-width: 900px !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .fs-legal-readable .fs-cms-card { padding: 30px 34px !important; } .fs-legal-readable .fs-cms-card p { font-size: 15px !important; line-height: 1.8 !important; } /* ===================================================== PAGE CGV - FOLIES SECRÈTES CSS COMPLET FINAL Page CMS ID : 13 ===================================================== */ /* ===================================================== BASE PAGE ===================================================== */ body.cms-id-13 #content-wrapper, body.cms-id-13 #main, body.cms-id-13 .page-content, body.cms-id-13 .cms-page, body.cms-id-13 .rte { width: 100% !important; max-width: 100% !important; } body.cms-id-13 .fs-cgv-page { width: 100% !important; max-width: 980px !important; margin: 0 auto !important; padding: 24px 28px 90px !important; color: #342b2e !important; font-family: inherit !important; transform: none !important; } /* Liens */ body.cms-id-13 .fs-cgv-page a { color: #b85b73 !important; text-decoration: none !important; font-weight: 600 !important; } body.cms-id-13 .fs-cgv-page a:hover { color: #8f3f55 !important; text-decoration: underline !important; } /* ===================================================== FIL D'ARIANE / HAUT DE PAGE ===================================================== */ body.cms-id-13 .breadcrumb_wrapper, body.cms-id-13 .breadcrumb, body.cms-id-13 nav.breadcrumb { margin-bottom: 12px !important; } /* ===================================================== HERO ===================================================== */ body.cms-id-13 .fs-cgv-hero { position: relative !important; max-width: 720px !important; margin: 0 auto 34px !important; padding: 40px 46px !important; text-align: center !important; border-radius: 22px !important; background: radial-gradient(circle at 92% 88%, rgba(255,255,255,0.65) 0, rgba(255,255,255,0.65) 70px, transparent 72px), linear-gradient(135deg, #fff6f8 0%, #f9e7eb 100%) !important; border: 1px solid rgba(184, 91, 115, 0.22) !important; box-shadow: 0 18px 44px rgba(70, 45, 52, 0.08) !important; overflow: hidden !important; } body.cms-id-13 .fs-cgv-kicker { margin: 0 0 8px !important; font-size: 12px !important; line-height: 1.4 !important; letter-spacing: 1.8px !important; text-transform: uppercase !important; color: #9c5268 !important; font-weight: 700 !important; } body.cms-id-13 .fs-cgv-hero h1 { margin: 0 0 16px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 38px !important; line-height: 1.15 !important; font-weight: 400 !important; color: #2f282a !important; } body.cms-id-13 .fs-cgv-hero p { max-width: 650px !important; margin: 0 auto !important; font-size: 16px !important; line-height: 1.85 !important; color: #5a4d51 !important; } /* ===================================================== ALERTE ===================================================== */ body.cms-id-13 .fs-cgv-alert { width: 100% !important; max-width: 880px !important; margin: 0 auto 34px !important; padding: 18px 24px !important; border-radius: 16px !important; background: #fff6f8 !important; border: 1px solid rgba(184, 91, 115, 0.25) !important; color: #4a343a !important; font-size: 15.8px !important; line-height: 1.75 !important; box-shadow: 0 10px 28px rgba(60, 35, 42, 0.05) !important; } body.cms-id-13 .fs-cgv-alert strong { color: #342b2e !important; font-weight: 700 !important; } /* ===================================================== SECTIONS ===================================================== */ body.cms-id-13 .fs-cgv-section { width: 100% !important; max-width: 880px !important; margin: 0 auto 24px !important; padding: 30px 34px !important; border-radius: 20px !important; background: #ffffff !important; border: 1px solid rgba(70, 45, 52, 0.08) !important; box-shadow: 0 10px 28px rgba(45, 30, 35, 0.038) !important; color: #342b2e !important; } body.cms-id-13 .fs-cgv-section h2 { margin: 0 0 18px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 27px !important; line-height: 1.25 !important; font-weight: 400 !important; color: #342b2e !important; } body.cms-id-13 .fs-cgv-section p { margin: 0 0 14px !important; font-size: 15.8px !important; line-height: 1.85 !important; color: #51474a !important; } body.cms-id-13 .fs-cgv-section p:last-child { margin-bottom: 0 !important; } body.cms-id-13 .fs-cgv-section strong { font-weight: 700 !important; color: inherit !important; } /* ===================================================== SECTIONS FONCÉES ===================================================== */ body.cms-id-13 .fs-cgv-section-dark { background: linear-gradient(135deg, #302829 0%, #463438 100%) !important; border: none !important; color: #ffffff !important; box-shadow: 0 18px 44px rgba(45, 30, 35, 0.16) !important; } body.cms-id-13 .fs-cgv-section-dark h2, body.cms-id-13 .fs-cgv-section-dark p, body.cms-id-13 .fs-cgv-section-dark strong { color: #ffffff !important; } body.cms-id-13 .fs-cgv-section-dark a { color: #f4c2cf !important; } body.cms-id-13 .fs-cgv-section-dark a:hover { color: #ffffff !important; } /* ===================================================== BLOC SOCIÉTÉ ===================================================== */ body.cms-id-13 .fs-cgv-company { margin: 24px 0 !important; padding: 24px 28px !important; border-radius: 18px !important; background: #fbfaf8 !important; border: 1px solid rgba(70, 45, 52, 0.10) !important; box-shadow: 0 12px 28px rgba(45, 30, 35, 0.08) !important; color: #2f2a2b !important; } body.cms-id-13 .fs-cgv-company div { display: block !important; margin: 0 0 7px !important; padding: 0 !important; font-size: 15.8px !important; line-height: 1.75 !important; color: #2f2a2b !important; } body.cms-id-13 .fs-cgv-company div:last-child { margin-bottom: 0 !important; } body.cms-id-13 .fs-cgv-company strong { color: #2f2a2b !important; font-weight: 700 !important; } body.cms-id-13 .fs-cgv-company a { color: #b85b73 !important; font-weight: 700 !important; } /* ===================================================== CARTES PAIEMENT ===================================================== */ body.cms-id-13 .fs-cgv-payment-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; align-items: stretch !important; margin: 26px 0 !important; } body.cms-id-13 .fs-cgv-payment-card { padding: 20px 22px !important; border-radius: 18px !important; background: #fbfaf8 !important; border: 1px solid rgba(70, 45, 52, 0.08) !important; box-shadow: 0 10px 26px rgba(45, 30, 35, 0.045) !important; transition: transform 0.25s ease, box-shadow 0.25s ease !important; } body.cms-id-13 .fs-cgv-payment-card:hover { transform: translateY(-3px) !important; box-shadow: 0 16px 36px rgba(45, 30, 35, 0.08) !important; } body.cms-id-13 .fs-cgv-payment-card h3 { margin: 0 0 8px !important; font-size: 16px !important; line-height: 1.35 !important; color: #382d31 !important; font-weight: 700 !important; } body.cms-id-13 .fs-cgv-payment-card p { margin: 0 !important; font-size: 14.8px !important; line-height: 1.65 !important; color: #5d5154 !important; } /* ===================================================== SECTION DOUCE / RÉTRACTATION ===================================================== */ body.cms-id-13 .fs-cgv-section-soft { background: linear-gradient(135deg, #ffffff 0%, #fff7f9 100%) !important; border-left: 4px solid #b85b73 !important; } /* ===================================================== SECTION ATTENTION ===================================================== */ body.cms-id-13 .fs-cgv-section-warning { background: linear-gradient(135deg, #fff8f4 0%, #fff1ec 100%) !important; border: 1px solid rgba(184, 91, 115, 0.22) !important; box-shadow: 0 16px 40px rgba(184, 91, 115, 0.08) !important; } body.cms-id-13 .fs-cgv-section-warning h2 { color: #8f3f55 !important; } /* ===================================================== LISTE ===================================================== */ body.cms-id-13 .fs-cgv-list { margin: 20px 0 !important; padding: 0 !important; list-style: none !important; } body.cms-id-13 .fs-cgv-list li { position: relative !important; margin: 0 0 13px !important; padding-left: 30px !important; font-size: 15.8px !important; line-height: 1.75 !important; color: #4c4245 !important; } body.cms-id-13 .fs-cgv-list li::before { content: "" !important; position: absolute !important; left: 2px !important; top: 10px !important; width: 8px !important; height: 8px !important; border-radius: 50% !important; background: #b85b73 !important; box-shadow: 0 0 0 5px rgba(184, 91, 115, 0.13) !important; } /* ===================================================== CONTACT ===================================================== */ body.cms-id-13 .fs-cgv-contact-box { margin-top: 22px !important; padding: 22px 24px !important; border-radius: 18px !important; background: #fbfaf8 !important; border: 1px solid rgba(70, 45, 52, 0.08) !important; box-shadow: 0 10px 28px rgba(45, 30, 35, 0.05) !important; } body.cms-id-13 .fs-cgv-contact-box p { margin: 0 0 10px !important; } body.cms-id-13 .fs-cgv-contact-box p:last-child { margin-bottom: 0 !important; } /* ===================================================== BLOC FINAL ===================================================== */ body.cms-id-13 .fs-cgv-final { width: 100% !important; max-width: 880px !important; margin: 44px auto 0 !important; padding: 30px 38px !important; border-radius: 22px !important; background: linear-gradient(135deg, #3b2c31 0%, #60454e 100%) !important; color: #ffffff !important; box-shadow: 0 20px 48px rgba(45, 30, 35, 0.18) !important; } body.cms-id-13 .fs-cgv-final p { margin: 0 0 12px !important; font-size: 15.5px !important; line-height: 1.85 !important; color: rgba(255, 255, 255, 0.92) !important; } body.cms-id-13 .fs-cgv-final p:last-child { margin-bottom: 0 !important; } body.cms-id-13 .fs-cgv-final strong { color: #ffffff !important; } /* ===================================================== RESPONSIVE TABLETTE ===================================================== */ @media (max-width: 991px) { body.cms-id-13 .fs-cgv-page { max-width: 100% !important; padding-left: 18px !important; padding-right: 18px !important; } body.cms-id-13 .fs-cgv-payment-grid { grid-template-columns: 1fr !important; } body.cms-id-13 .fs-cgv-hero { padding: 34px 28px !important; } body.cms-id-13 .fs-cgv-hero h1 { font-size: 32px !important; } } /* ===================================================== RESPONSIVE MOBILE ===================================================== */ @media (max-width: 575px) { body.cms-id-13 .fs-cgv-page { padding: 18px 14px 60px !important; } body.cms-id-13 .fs-cgv-hero { padding: 30px 20px !important; border-radius: 18px !important; } body.cms-id-13 .fs-cgv-hero h1 { font-size: 28px !important; } body.cms-id-13 .fs-cgv-hero p, body.cms-id-13 .fs-cgv-alert, body.cms-id-13 .fs-cgv-section p, body.cms-id-13 .fs-cgv-company div, body.cms-id-13 .fs-cgv-list li { font-size: 15px !important; } body.cms-id-13 .fs-cgv-section { padding: 24px 20px !important; margin-bottom: 22px !important; border-radius: 18px !important; } body.cms-id-13 .fs-cgv-section h2 { font-size: 23px !important; } body.cms-id-13 .fs-cgv-company, body.cms-id-13 .fs-cgv-contact-box, body.cms-id-13 .fs-cgv-final { padding: 20px !important; border-radius: 16px !important; } body.cms-id-13 .fs-cgv-final { margin-top: 34px !important; } body.cms-id-13 .fs-cgv-payment-card p { font-size: 15px !important; } } /* ===================================================== PAGE CMS PREMIUM - POLITIQUE DE CONFIDENTIALITÉ Folies Secrètes - CSS FINAL ===================================================== */ /* ===================================================== 00 - DÉBLOCAGE DES PARENTS CMS PRESTASHOP / PANDA ===================================================== */ body:has(.fs-privacy-page) #wrapper, body:has(.fs-privacy-page) #wrapper .container, body:has(.fs-privacy-page) #content-wrapper, body:has(.fs-privacy-page) #main, body:has(.fs-privacy-page) #content, body:has(.fs-privacy-page) .page-content, body:has(.fs-privacy-page) .page-cms, body:has(.fs-privacy-page) .cms-page, body:has(.fs-privacy-page) .rte, body:has(.fs-privacy-page) .cms-block, body:has(.fs-privacy-page) .center_column, body:has(.fs-privacy-page) .main_content_area, body:has(.fs-privacy-page) .st_content, body:has(.fs-privacy-page) .stretched_container { overflow: visible !important; } html, body { overflow-x: hidden !important; } /* ===================================================== 01 - CONTENEUR GLOBAL FULL BLEED MAÎTRISÉ ===================================================== */ .fs-privacy-page { position: relative !important; left: 50% !important; width: 100vw !important; max-width: 100vw !important; margin-left: -50vw !important; margin-right: 0 !important; margin-bottom: 80px !important; padding: 34px 0 70px !important; background: #fbfaf7 !important; color: #2f2b2c !important; font-size: 16px !important; line-height: 1.75 !important; box-sizing: border-box !important; } .fs-privacy-page * { box-sizing: border-box !important; } .fs-privacy-inner { width: min(1050px, calc(100vw - 48px)) !important; max-width: 1050px !important; margin: 0 auto !important; } /* ===================================================== 02 - HERO ===================================================== */ .fs-privacy-page .fs-cms-hero { width: min(820px, 100%) !important; margin: 0 auto 44px !important; padding: 56px 46px !important; text-align: center !important; border-radius: 22px !important; overflow: hidden !important; background: radial-gradient(circle at bottom right, rgba(255, 255, 255, 0.95), transparent 34%), linear-gradient(135deg, #fff7f8 0%, #f8e1e4 48%, #fffaf9 100%) !important; border: 1px solid rgba(181, 105, 117, 0.25) !important; box-shadow: 0 18px 45px rgba(83, 45, 51, 0.10) !important; } .fs-privacy-page .fs-cms-kicker { margin: 0 0 12px !important; color: #8f5c63 !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 2px !important; text-transform: uppercase !important; } .fs-privacy-page .fs-cms-hero h1 { margin: 0 0 18px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(34px, 4.8vw, 52px) !important; font-weight: 400 !important; line-height: 1.08 !important; color: #2d2527 !important; } .fs-privacy-page .fs-cms-intro { max-width: 720px !important; margin: 0 auto !important; color: #5f5457 !important; font-size: 18px !important; line-height: 1.75 !important; } /* ===================================================== 03 - SECTIONS PREMIUM ===================================================== */ .fs-privacy-page .fs-cms-section { width: 100% !important; margin: 28px auto !important; padding: 38px 44px !important; background: #ffffff !important; border: 1px solid rgba(181, 105, 117, 0.14) !important; border-radius: 22px !important; box-shadow: 0 16px 42px rgba(64, 42, 46, 0.055) !important; } .fs-privacy-page .fs-cms-section:first-of-type { margin-top: 0 !important; } /* ===================================================== 04 - BLOCS FONCÉS PREMIUM ===================================================== */ .fs-privacy-page .fs-cms-highlight { color: #ffffff !important; background: radial-gradient(circle at top right, rgba(255, 255, 255, 0.08), transparent 28%), linear-gradient(135deg, #2c2426 0%, #35292c 100%) !important; border-color: rgba(255, 255, 255, 0.08) !important; box-shadow: 0 18px 42px rgba(45, 37, 39, 0.18) !important; } .fs-privacy-page .fs-cms-highlight h2, .fs-privacy-page .fs-cms-highlight h3, .fs-privacy-page .fs-cms-highlight p, .fs-privacy-page .fs-cms-highlight strong { color: #ffffff !important; } /* ===================================================== 05 - TYPOGRAPHIE ===================================================== */ .fs-privacy-page h2 { margin: 0 0 18px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(28px, 3vw, 36px) !important; font-weight: 400 !important; line-height: 1.2 !important; color: #2d2527 !important; } .fs-privacy-page h3 { margin: 0 0 10px !important; font-size: 17px !important; font-weight: 700 !important; color: #3a3033 !important; } .fs-privacy-page p { margin: 0 0 15px !important; color: #51484b !important; font-size: 16px !important; line-height: 1.75 !important; } .fs-privacy-page p:last-child { margin-bottom: 0 !important; } .fs-privacy-page strong { color: #2f282a !important; font-weight: 700 !important; } /* ===================================================== 06 - CARTE INFORMATIONS SOCIÉTÉ ===================================================== */ .fs-privacy-page .fs-info-card { padding: 24px 26px !important; border-radius: 18px !important; background: #fff8f9 !important; border: 1px solid rgba(181, 105, 117, 0.18) !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55) !important; } .fs-privacy-page .fs-info-card p { font-size: 15.8px !important; line-height: 1.75 !important; } /* ===================================================== 07 - GRILLES ET CARTES ===================================================== */ .fs-privacy-page .fs-cms-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 22px !important; margin-top: 24px !important; } .fs-privacy-page .fs-cms-card { padding: 26px 24px !important; border-radius: 18px !important; background: linear-gradient(180deg, #fffafa 0%, #ffffff 100%) !important; border: 1px solid rgba(181, 105, 117, 0.16) !important; box-shadow: 0 10px 28px rgba(64, 42, 46, 0.055) !important; transition: transform 0.25s ease, box-shadow 0.25s ease !important; } .fs-privacy-page .fs-cms-card:hover { transform: translateY(-3px) !important; box-shadow: 0 16px 34px rgba(64, 42, 46, 0.08) !important; } .fs-privacy-page .fs-cms-card p { margin-bottom: 0 !important; color: #62575a !important; font-size: 15.5px !important; line-height: 1.65 !important; } /* ===================================================== 08 - LISTES ===================================================== */ .fs-privacy-page .fs-cms-list { margin: 20px 0 0 !important; padding: 0 !important; list-style: none !important; } .fs-privacy-page .fs-cms-list li { position: relative !important; margin: 0 0 12px !important; padding-left: 28px !important; color: #51484b !important; font-size: 16px !important; line-height: 1.7 !important; } .fs-privacy-page .fs-cms-list li::before { content: "" !important; position: absolute !important; left: 0 !important; top: 10px !important; width: 9px !important; height: 9px !important; border-radius: 50% !important; background: #c87884 !important; box-shadow: 0 0 0 5px rgba(200, 120, 132, 0.12) !important; } /* ===================================================== 09 - TABLEAUX ===================================================== */ .fs-privacy-page .fs-table-wrap { width: 100% !important; overflow-x: auto !important; margin-top: 22px !important; border-radius: 18px !important; border: 1px solid rgba(181, 105, 117, 0.16) !important; background: #ffffff !important; } .fs-privacy-page .fs-cms-table { width: 100% !important; min-width: 860px !important; border-collapse: collapse !important; background: #ffffff !important; } .fs-privacy-page .fs-cms-table th, .fs-privacy-page .fs-cms-table td { padding: 18px 20px !important; text-align: left !important; vertical-align: top !important; border-bottom: 1px solid rgba(181, 105, 117, 0.12) !important; font-size: 15.5px !important; line-height: 1.6 !important; } .fs-privacy-page .fs-cms-table th { background: #fff3f5 !important; color: #3a3033 !important; font-weight: 700 !important; } .fs-privacy-page .fs-cms-table td { color: #574d50 !important; } .fs-privacy-page .fs-cms-table tr:last-child td { border-bottom: none !important; } /* ===================================================== 10 - DERNIÈRE MISE À JOUR ===================================================== */ .fs-privacy-page .fs-last-update { text-align: center !important; background: #2d2527 !important; color: #ffffff !important; border-color: #2d2527 !important; padding: 24px 30px !important; } .fs-privacy-page .fs-last-update p, .fs-privacy-page .fs-last-update strong { color: #ffffff !important; } /* ===================================================== 11 - RESPONSIVE TABLETTE ===================================================== */ @media (max-width: 900px) { .fs-privacy-page { left: auto !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; padding: 28px 14px 54px !important; } .fs-privacy-inner { width: 100% !important; max-width: 100% !important; } .fs-privacy-page .fs-cms-hero { width: 100% !important; max-width: 100% !important; padding: 44px 28px !important; } .fs-privacy-page .fs-cms-section { width: 100% !important; max-width: 100% !important; padding: 28px 24px !important; } .fs-privacy-page .fs-cms-grid { grid-template-columns: 1fr !important; } .fs-privacy-page .fs-cms-table { min-width: 760px !important; } } /* ===================================================== 12 - RESPONSIVE MOBILE ===================================================== */ @media (max-width: 560px) { .fs-privacy-page { padding: 22px 11px 44px !important; font-size: 15px !important; } .fs-privacy-page .fs-cms-hero { padding: 34px 18px !important; border-radius: 18px !important; } .fs-privacy-page .fs-cms-hero h1 { font-size: 32px !important; } .fs-privacy-page .fs-cms-intro { font-size: 16px !important; } .fs-privacy-page .fs-cms-section { padding: 24px 18px !important; border-radius: 18px !important; } .fs-privacy-page .fs-info-card, .fs-privacy-page .fs-cms-card { padding: 20px 18px !important; } .fs-privacy-page .fs-cms-table th, .fs-privacy-page .fs-cms-table td { padding: 15px 16px !important; } } /* ===================================================== COOKIE BANNER - ULTRA PREMIUM FOLIES SECRÈTES ===================================================== */ #lgcookieslaw_banner { max-width: 720px !important; width: calc(100% - 32px) !important; padding: 26px 30px !important; border-radius: 22px !important; border: 1px solid rgba(231, 71, 114, 0.18) !important; background: rgba(255, 250, 251, 0.92) !important; backdrop-filter: blur(14px) saturate(130%) !important; -webkit-backdrop-filter: blur(14px) saturate(130%) !important; box-shadow: 0 24px 60px rgba(43, 43, 43, 0.16), 0 2px 0 rgba(255, 255, 255, 0.85) inset !important; color: #2b2b2b !important; } #lgcookieslaw_banner, #lgcookieslaw_banner p, #lgcookieslaw_banner span, #lgcookieslaw_banner div { color: #2b2b2b !important; font-size: 14.5px !important; line-height: 1.65 !important; font-weight: 400 !important; } #lgcookieslaw_banner a, #lgcookieslaw_banner .lgcookieslaw-link-button, #lgcookieslaw_banner .lgcookieslaw-link { color: #5f5652 !important; text-decoration: none !important; border-bottom: 1px solid rgba(95, 86, 82, 0.45) !important; font-weight: 500 !important; transition: all 0.2s ease !important; } #lgcookieslaw_banner a:hover, #lgcookieslaw_banner .lgcookieslaw-link-button:hover, #lgcookieslaw_banner .lgcookieslaw-link:hover { color: #e74772 !important; border-bottom-color: #e74772 !important; } #lgcookieslaw_banner .lgcookieslaw-button-container { display: flex !important; gap: 14px !important; margin-top: 22px !important; } #lgcookieslaw_reject_all, #lgcookieslaw_accept { height: 48px !important; min-height: 48px !important; line-height: 48px !important; border-radius: 999px !important; font-size: 13.5px !important; font-weight: 700 !important; letter-spacing: 0.8px !important; text-transform: uppercase !important; box-shadow: none !important; text-decoration: none !important; transition: all 0.22s ease !important; } #lgcookieslaw_reject_all { background: rgba(255, 255, 255, 0.75) !important; color: #6b4b50 !important; border: 1px solid rgba(231, 71, 114, 0.35) !important; } #lgcookieslaw_accept { background: linear-gradient(135deg, #e74772, #d96f82) !important; color: #ffffff !important; border: 1px solid transparent !important; box-shadow: 0 12px 24px rgba(231, 71, 114, 0.22) !important; } #lgcookieslaw_reject_all:hover { background: #fff1f4 !important; color: #e74772 !important; border-color: #e74772 !important; } #lgcookieslaw_accept:hover { transform: translateY(-1px) !important; background: linear-gradient(135deg, #d63c66, #c95f74) !important; box-shadow: 0 16px 30px rgba(231, 71, 114, 0.28) !important; } #lgcookieslaw_reject_all *, #lgcookieslaw_accept * { text-decoration: none !important; } /* ===================================================== COOKIE MODAL - PREMIUM ===================================================== */ #lgcookieslaw_modal .modal-content, #lgcookieslaw_modal .modal-dialog { border-radius: 22px !important; } #lgcookieslaw_modal .modal-content { border: 1px solid rgba(231, 71, 114, 0.16) !important; box-shadow: 0 28px 70px rgba(0, 0, 0, 0.18) !important; overflow: hidden !important; } #lgcookieslaw_modal h2, #lgcookieslaw_modal h3 { font-family: Georgia, "Times New Roman", serif !important; color: #2b2b2b !important; font-weight: 400 !important; } #lgcookieslaw_modal .panel, #lgcookieslaw_modal .lgcookieslaw-panel { border-radius: 18px !important; border: 1px solid rgba(217, 111, 130, 0.16) !important; box-shadow: 0 10px 28px rgba(43, 43, 43, 0.05) !important; } #lgcookieslaw_modal .btn { border-radius: 999px !important; font-weight: 700 !important; letter-spacing: 0.5px !important; text-transform: uppercase !important; } #lgcookieslaw_modal .btn-primary { background: linear-gradient(135deg, #e74772, #d96f82) !important; border: 1px solid transparent !important; color: #ffffff !important; } #lgcookieslaw_modal .btn-default { background: #ffffff !important; border: 1px solid rgba(231, 71, 114, 0.45) !important; color: #e74772 !important; } @media (max-width: 768px) { #lgcookieslaw_banner { width: calc(100% - 24px) !important; padding: 22px 18px !important; border-radius: 18px !important; } #lgcookieslaw_banner .lgcookieslaw-button-container { flex-direction: column !important; gap: 10px !important; } #lgcookieslaw_reject_all, #lgcookieslaw_accept { width: 100% !important; font-size: 13px !important; } } #lgcookieslaw_banner { top: 68% !important; } /* ===================================================== PAGE CONNEXION CLIENT - FOLIES SECRÈTES Version finale nettoyée - Palette sauge premium À placer tout en bas du custom CSS ===================================================== */ /* ---------- Reset local : empêche Panda de déplacer les blocs ---------- */ body#authentication, body#authentication *, body#authentication *::before, body#authentication *::after { box-sizing: border-box !important; } body#authentication { background: #fbfaf6 !important; } body#authentication #wrapper, body#authentication .columns-container, body#authentication #columns, body#authentication #main, body#authentication #content-wrapper, body#authentication section#content.page-content { background: transparent !important; overflow: visible !important; } /* On neutralise l'ancien cadre page-content pour laisser la nouvelle page respirer */ body#authentication section#content.page-content { width: 100% !important; max-width: 100% !important; margin: 0 auto !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; } /* ---------- Structure premium si authentication.tpl utilise fs-auth ---------- */ body#authentication .fs-auth-page { width: 100% !important; margin: 0 !important; padding: 34px 18px 78px !important; background: radial-gradient(circle at top left, rgba(143, 150, 119, 0.13), transparent 32%), linear-gradient(180deg, #fbfaf6 0%, #ffffff 42%, #fbfaf6 100%) !important; } body#authentication .fs-auth-shell { width: 100% !important; max-width: 1180px !important; margin: 0 auto !important; padding: 0 !important; } body#authentication .fs-auth-hero { width: 100% !important; max-width: 850px !important; margin: 0 auto 30px !important; padding: 0 !important; text-align: center !important; } body#authentication .fs-auth-kicker { margin: 0 0 9px !important; color: #8f9677 !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 1.8px !important; line-height: 1.4 !important; text-transform: uppercase !important; } body#authentication .fs-auth-hero h1 { margin: 0 0 12px !important; color: #2b2b2b !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 42px !important; font-weight: 400 !important; line-height: 1.12 !important; text-transform: none !important; } body#authentication .fs-auth-intro { max-width: 680px !important; margin: 0 auto !important; color: #5d5b50 !important; font-size: 15px !important; line-height: 1.75 !important; } body#authentication .fs-auth-layout { width: 100% !important; display: grid !important; grid-template-columns: minmax(0, 760px) minmax(280px, 360px) !important; align-items: stretch !important; justify-content: center !important; gap: 26px !important; margin: 0 auto !important; padding: 0 !important; } /* ---------- Fallback si l'ancien authentication.tpl Panda est encore utilisé ---------- */ body#authentication section#content.page-content > .row { width: 100% !important; max-width: 1180px !important; display: grid !important; grid-template-columns: minmax(0, 760px) minmax(280px, 360px) !important; align-items: stretch !important; justify-content: center !important; gap: 26px !important; margin: 34px auto 78px !important; padding: 0 18px !important; } /* Si l'ancien tpl place "Créer compte" avant "Connexion", on remet connexion à gauche */ body#authentication .login_form_column { order: 1 !important; } body#authentication .create_account_column { order: 2 !important; } /* ---------- Cartes ---------- */ body#authentication .fs-auth-card, body#authentication #login_form_block, body#authentication #create_account_block, body#authentication .login_form_column > section, body#authentication .create_account_column > section { width: 100% !important; min-width: 0 !important; min-height: 100% !important; margin: 0 !important; padding: 38px 44px 42px !important; background: #ffffff !important; border: 1px solid rgba(143, 150, 119, 0.22) !important; border-radius: 26px !important; box-shadow: 0 24px 60px rgba(55, 56, 46, 0.10) !important; overflow: visible !important; position: relative !important; transform: none !important; float: none !important; display: flex !important; flex-direction: column !important; } body#authentication .fs-auth-login-card, body#authentication #login_form_block { max-width: 760px !important; } body#authentication .fs-auth-register-card, body#authentication #create_account_block { max-width: 360px !important; background: radial-gradient(circle at top left, rgba(247, 244, 236, 0.90), transparent 42%), linear-gradient(180deg, #ffffff 0%, #fbfaf6 100%) !important; } /* Anciennes colonnes Bootstrap neutralisées */ body#authentication section#content.page-content > .row > div, body#authentication .login_form_column, body#authentication .create_account_column { width: auto !important; max-width: none !important; flex: none !important; padding: 0 !important; margin: 0 !important; } /* ---------- En-têtes de carte ---------- */ body#authentication .fs-auth-card-head { display: flex !important; align-items: flex-start !important; gap: 14px !important; margin: 0 0 26px !important; padding: 0 !important; } body#authentication .fs-auth-card-icon { width: 42px !important; height: 42px !important; min-width: 42px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: #eef0e6 !important; color: #8f9677 !important; font-size: 20px !important; line-height: 1 !important; border: 1px solid #ded9ca !important; } body#authentication .fs-auth-card-head h2, body#authentication #login_form_block .page_heading, body#authentication #create_account_block .page_heading { margin: 0 0 5px !important; color: #2b2b2b !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 26px !important; font-weight: 400 !important; line-height: 1.2 !important; text-transform: none !important; letter-spacing: 0 !important; } body#authentication .fs-auth-card-head p { margin: 0 !important; color: #5d5b50 !important; font-size: 14px !important; line-height: 1.55 !important; } /* Si ancien tpl : titre Panda visible mais propre */ body#authentication #login_form_block .page_heading, body#authentication #create_account_block .page_heading { display: block !important; text-align: left !important; margin-bottom: 22px !important; } /* ---------- Suppression cadres internes Panda / PrestaShop ---------- */ body#authentication .login-form, body#authentication .register-form, body#authentication .no-account, body#authentication .form_content, body#authentication .form_content_inner, body#authentication .card, body#authentication .block, body#authentication .from_blcok { border: none !important; background: transparent !important; box-shadow: none !important; } body#authentication #login_form_block .form_content, body#authentication #create_account_block .form_content, body#authentication #login_form_block .form_content_inner, body#authentication #create_account_block .form_content_inner { width: 100% !important; max-width: 100% !important; padding: 0 !important; margin: 0 !important; } /* ---------- Formulaire : flux normal obligatoire ---------- */ body#authentication #login_form_block form, body#authentication .login-form form, body#authentication form#login-form, body#authentication #login-form { width: 100% !important; max-width: 100% !important; height: auto !important; display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; margin: 0 !important; padding: 0 !important; position: static !important; float: none !important; clear: both !important; transform: none !important; overflow: visible !important; } body#authentication #login_form_block .form-group, body#authentication #login_form_block .form-control-label, body#authentication #login_form_block .col-md-3, body#authentication #login_form_block .col-md-6, body#authentication #login_form_block .col-md-8, body#authentication #login_form_block .col-md-9, body#authentication #login_form_block .col-md-12, body#authentication #login_form_block .col-lg-6, body#authentication #login_form_block .col-lg-8, body#authentication #login_form_block .col-xs-12, body#authentication #login_form_block .col-sm-12 { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; margin-left: 0 !important; margin-right: 0 !important; } /* ---------- Labels et champs ---------- */ body#authentication #login_form_block .form-group { width: 100% !important; margin: 0 0 19px !important; padding: 0 !important; position: relative !important; float: none !important; clear: both !important; } body#authentication #login_form_block label, body#authentication #login_form_block .form-control-label { display: block !important; width: 100% !important; margin: 0 0 7px !important; padding: 0 !important; color: #4f5143 !important; font-size: 13px !important; font-weight: 600 !important; line-height: 1.4 !important; text-align: left !important; } body#authentication #login_form_block .form-control, body#authentication #login_form_block input[type="email"], body#authentication #login_form_block input[type="password"], body#authentication #login_form_block input[type="text"] { width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: 52px !important; min-height: 52px !important; margin: 0 !important; padding: 13px 16px !important; color: #2b2b2b !important; background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 14px !important; box-shadow: none !important; font-size: 15px !important; line-height: 1.35 !important; outline: none !important; position: static !important; float: none !important; transform: none !important; } body#authentication #login_form_block .form-control:focus, body#authentication #login_form_block input[type="email"]:focus, body#authentication #login_form_block input[type="password"]:focus, body#authentication #login_form_block input[type="text"]:focus { border-color: #8f9677 !important; box-shadow: 0 0 0 4px rgba(143, 150, 119, 0.14) !important; } /* ---------- Champ mot de passe + bouton afficher ---------- */ body#authentication #login_form_block .input-group { width: 100% !important; max-width: 100% !important; height: 52px !important; display: flex !important; align-items: stretch !important; margin: 0 !important; padding: 0 !important; position: relative !important; float: none !important; transform: none !important; overflow: visible !important; border: none !important; background: transparent !important; } body#authentication #login_form_block .input-group .form-control { flex: 1 1 auto !important; min-width: 0 !important; border-radius: 14px 0 0 14px !important; border-right: 0 !important; } body#authentication #login_form_block .input-group-btn, body#authentication #login_form_block .input-group-append { width: auto !important; min-width: 54px !important; display: flex !important; align-items: stretch !important; position: static !important; float: none !important; transform: none !important; } body#authentication #login_form_block .input-group-btn button, body#authentication #login_form_block .input-group-append button, body#authentication #login_form_block button[data-action="show-password"] { width: auto !important; min-width: 54px !important; height: 52px !important; min-height: 52px !important; margin: 0 !important; padding: 0 13px !important; background: #ffffff !important; border: 1px solid #ded9ca !important; border-left: 0 !important; border-radius: 0 14px 14px 0 !important; color: #8f9677 !important; box-shadow: none !important; position: static !important; float: none !important; transform: none !important; } /* ---------- Mot de passe oublié / liens ---------- */ body#authentication #login_form_block a, body#authentication #create_account_block a { color: #6f765c !important; text-decoration: none !important; } body#authentication #login_form_block a:hover, body#authentication #create_account_block a:hover { color: #8f9677 !important; text-decoration: underline !important; } body#authentication #login_form_block .forgot-password { width: 100% !important; margin: -4px 0 22px !important; text-align: right !important; font-size: 13px !important; } /* ---------- Footer formulaire : jamais en absolu ---------- */ body#authentication #login_form_block .form-footer, body#authentication #login_form_block footer, body#authentication #login_form_block .submit, body#authentication #create_account_block .form-footer, body#authentication #create_account_block footer { width: 100% !important; max-width: 100% !important; display: block !important; margin: 26px 0 0 !important; padding: 0 !important; clear: both !important; position: static !important; float: none !important; left: auto !important; right: auto !important; bottom: auto !important; top: auto !important; transform: none !important; overflow: visible !important; text-align: left !important; } body#authentication #login_form_block .form-footer *, body#authentication #login_form_block footer *, body#authentication #login_form_block .submit *, body#authentication #create_account_block .form-footer *, body#authentication #create_account_block footer * { position: static !important; float: none !important; left: auto !important; right: auto !important; bottom: auto !important; top: auto !important; transform: none !important; } /* ---------- Bouton connexion : dans la carte, pleine largeur ---------- */ body#authentication #submit-login, body#authentication #SubmitLogin, body#authentication #login_form_block button#submit-login, body#authentication #login_form_block button#SubmitLogin, body#authentication #login_form_block button[type="submit"], body#authentication #login_form_block input[type="submit"], body#authentication #login_form_block .btn-primary { width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 54px !important; height: auto !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 15px 24px !important; background: linear-gradient(135deg, #9ca584 0%, #6f765c 100%) !important; border: 1px solid #6f765c !important; border-radius: 999px !important; color: #ffffff !important; box-shadow: 0 14px 28px rgba(111, 118, 92, 0.28) !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: 0.7px !important; line-height: 1.25 !important; text-align: center !important; text-transform: uppercase !important; white-space: normal !important; cursor: pointer !important; position: static !important; float: none !important; clear: both !important; left: auto !important; right: auto !important; bottom: auto !important; top: auto !important; transform: none !important; z-index: 1 !important; } body#authentication #submit-login:hover, body#authentication #SubmitLogin:hover, body#authentication #login_form_block button[type="submit"]:hover, body#authentication #login_form_block .btn-primary:hover { background: linear-gradient(135deg, #87906f 0%, #5f664e 100%) !important; color: #ffffff !important; box-shadow: 0 16px 34px rgba(111, 118, 92, 0.34) !important; transform: translateY(-1px) !important; } /* ---------- Carte création compte ---------- */ body#authentication .fs-auth-benefits { list-style: none !important; margin: 0 0 25px !important; padding: 0 !important; } body#authentication .fs-auth-benefits li { display: flex !important; align-items: flex-start !important; gap: 9px !important; margin: 0 0 12px !important; color: #4f5143 !important; font-size: 14px !important; line-height: 1.5 !important; } body#authentication .fs-auth-benefits li::before { content: "✓" !important; width: 22px !important; height: 22px !important; min-width: 22px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: #eef0e6 !important; color: #8f9677 !important; font-size: 12px !important; font-weight: 700 !important; border: 1px solid #ded9ca !important; } body#authentication .fs-auth-register-btn, body#authentication #SubmitCreate, body#authentication #create_account_block .btn, body#authentication #create_account_block .btn-primary, body#authentication #create_account_block .btn-default { width: 100% !important; min-height: 52px !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: auto 0 0 !important; padding: 14px 20px !important; background: #ffffff !important; border: 1px solid #6f765c !important; border-radius: 999px !important; color: #6f765c !important; box-shadow: none !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: 0.7px !important; text-align: center !important; text-decoration: none !important; text-transform: uppercase !important; position: static !important; transform: none !important; } body#authentication .fs-auth-register-btn:hover, body#authentication #SubmitCreate:hover, body#authentication #create_account_block .btn:hover, body#authentication #create_account_block .btn-primary:hover, body#authentication #create_account_block .btn-default:hover { background: linear-gradient(135deg, #9ca584 0%, #6f765c 100%) !important; color: #ffffff !important; text-decoration: none !important; } /* ---------- Bandeau confiance ---------- */ body#authentication .fs-auth-reassurance, body#authentication section#content.page-content::after { content: "Livraison discrète · Paiement sécurisé · Emballage neutre · Service client à votre écoute" !important; display: block !important; width: 100% !important; max-width: 920px !important; margin: 34px auto 0 !important; padding: 17px 24px !important; text-align: center !important; background: #ffffff !important; border: 1px solid rgba(143, 150, 119, 0.22) !important; border-radius: 999px !important; color: #5e604e !important; font-size: 13px !important; line-height: 1.5 !important; letter-spacing: 0.4px !important; box-shadow: 0 12px 30px rgba(55, 56, 46, 0.06) !important; } body#authentication .fs-auth-reassurance { content: none !important; } /* Si la nouvelle structure fs-auth existe, on évite le ::after de page-content en doublon */ body#authentication section#content.page-content:has(.fs-auth-page)::after { display: none !important; } /* ---------- Sécurité anti chevauchement ---------- */ body#authentication #login_form_block::after, body#authentication #create_account_block::after, body#authentication #login_form_block form::after { content: "" !important; display: table !important; clear: both !important; } body#authentication #login_form_block, body#authentication #create_account_block { overflow: visible !important; } /* ---------- Tablette ---------- */ @media (max-width: 991px) { body#authentication .fs-auth-page { padding: 28px 16px 62px !important; } body#authentication .fs-auth-hero { margin-bottom: 24px !important; } body#authentication .fs-auth-hero h1 { font-size: 36px !important; } body#authentication .fs-auth-layout, body#authentication section#content.page-content > .row { grid-template-columns: minmax(0, 760px) !important; gap: 20px !important; } body#authentication .fs-auth-login-card, body#authentication .fs-auth-register-card, body#authentication #login_form_block, body#authentication #create_account_block { max-width: 760px !important; margin: 0 auto !important; } body#authentication .fs-auth-card, body#authentication #login_form_block, body#authentication #create_account_block { padding: 34px 34px 38px !important; } } /* ---------- Mobile ---------- */ @media (max-width: 575px) { body#authentication .fs-auth-page { padding: 22px 12px 48px !important; } body#authentication section#content.page-content > .row { margin: 22px auto 48px !important; padding: 0 12px !important; } body#authentication .fs-auth-hero { margin-bottom: 20px !important; } body#authentication .fs-auth-kicker { font-size: 11px !important; letter-spacing: 1.4px !important; } body#authentication .fs-auth-hero h1 { font-size: 29px !important; } body#authentication .fs-auth-intro { font-size: 14px !important; line-height: 1.65 !important; } body#authentication .fs-auth-card, body#authentication #login_form_block, body#authentication #create_account_block { padding: 26px 18px 30px !important; border-radius: 20px !important; } body#authentication .fs-auth-card-head { gap: 12px !important; margin-bottom: 22px !important; } body#authentication .fs-auth-card-icon { width: 38px !important; height: 38px !important; min-width: 38px !important; font-size: 18px !important; } body#authentication .fs-auth-card-head h2, body#authentication #login_form_block .page_heading, body#authentication #create_account_block .page_heading { font-size: 23px !important; } body#authentication #login_form_block .form-group { margin-bottom: 17px !important; } body#authentication #login_form_block .form-control, body#authentication #login_form_block input[type="email"], body#authentication #login_form_block input[type="password"], body#authentication #login_form_block input[type="text"], body#authentication #login_form_block .input-group, body#authentication #login_form_block .input-group-btn button, body#authentication #login_form_block .input-group-append button, body#authentication #login_form_block button[data-action="show-password"] { height: 50px !important; min-height: 50px !important; font-size: 14px !important; } body#authentication #submit-login, body#authentication #SubmitLogin, body#authentication #login_form_block button[type="submit"], body#authentication #login_form_block .btn-primary, body#authentication .fs-auth-register-btn, body#authentication #SubmitCreate { min-height: 50px !important; font-size: 12px !important; } body#authentication .fs-auth-reassurance, body#authentication section#content.page-content::after { border-radius: 18px !important; line-height: 1.8 !important; } } /* ===================================================== ESPACE CLIENT PREMIUM UNIFIÉ - FOLIES SECRÈTES Socle unique pour pages natives + pages modules Palette : ivoire / sauge / blanc premium ===================================================== */ /* ----------------------------------------------------- 01 - FOND GLOBAL DES PAGES COMPTE CLIENT ----------------------------------------------------- */ body#my-account, body#identity, body#address, body#addresses, body#history, body#order-slip, body#discount, body#module-psgdpr-gdpr, body#module-ps_emailalerts-account, body#module-stblogcomments-mycomments, body#module-stproductcomments-mycomments, body#module-stwishlist-mywishlist, body#module-stwishlist-view, body#module-stlovedproduct-myloved { background: #fbfaf6 !important; } body#my-account #wrapper, body#identity #wrapper, body#address #wrapper, body#addresses #wrapper, body#history #wrapper, body#order-slip #wrapper, body#discount #wrapper, body#module-psgdpr-gdpr #wrapper, body#module-ps_emailalerts-account #wrapper, body#module-stblogcomments-mycomments #wrapper, body#module-stproductcomments-mycomments #wrapper, body#module-stwishlist-mywishlist #wrapper, body#module-stwishlist-view #wrapper, body#module-stlovedproduct-myloved #wrapper, body#my-account .columns-container, body#identity .columns-container, body#address .columns-container, body#addresses .columns-container, body#history .columns-container, body#order-slip .columns-container, body#discount .columns-container, body#module-psgdpr-gdpr .columns-container, body#module-ps_emailalerts-account .columns-container, body#module-stblogcomments-mycomments .columns-container, body#module-stproductcomments-mycomments .columns-container, body#module-stwishlist-mywishlist .columns-container, body#module-stwishlist-view .columns-container, body#module-stlovedproduct-myloved .columns-container { background: #fbfaf6 !important; } /* Masque les titres natifs affichés au-dessus de la carte compte client */ body#identity #main > .page_heading, body#address #main > .page_heading, body#addresses #main > .page_heading, body#history #main > .page_heading, body#order-slip #main > .page_heading, body#discount #main > .page_heading, body#module-psgdpr-gdpr #main > .page_heading, body#module-ps_emailalerts-account #main > .page_heading, body#module-stblogcomments-mycomments #main > .page_heading, body#module-stproductcomments-mycomments #main > .page_heading, body#module-stwishlist-mywishlist #main > .page_heading, body#module-stlovedproduct-myloved #main > .page_heading, body#identity #main > h1, body#address #main > h1, body#addresses #main > h1, body#history #main > h1, body#order-slip #main > h1, body#discount #main > h1, body#module-psgdpr-gdpr #main > h1, body#module-ps_emailalerts-account #main > h1, body#module-stblogcomments-mycomments #main > h1, body#module-stproductcomments-mycomments #main > h1, body#module-stwishlist-mywishlist #main > h1, body#module-stlovedproduct-myloved #main > h1 { display: none !important; } /* ----------------------------------------------------- 02 - CARTE PRINCIPALE UNIQUE ----------------------------------------------------- */ body#identity section#content.page-content, body#address section#content.page-content, body#addresses section#content.page-content, body#history section#content.page-content, body#order-slip section#content.page-content, body#discount section#content.page-content, body#module-psgdpr-gdpr section#content.page-content, body#module-ps_emailalerts-account section#content.page-content, body#module-stblogcomments-mycomments section#content.page-content, body#module-stproductcomments-mycomments section#content.page-content, body#module-stwishlist-mywishlist section#content.page-content, body#module-stlovedproduct-myloved section#content.page-content, section#content.fs-account-layout { width: calc(100% - 40px) !important; max-width: 1120px !important; min-height: 650px !important; margin: 34px auto 60px !important; padding: 34px 38px 42px !important; display: grid !important; grid-template-columns: 220px minmax(0, 1fr) !important; column-gap: 42px !important; row-gap: 0 !important; align-items: start !important; background: radial-gradient(circle at top left, rgba(143,150,119,.08), transparent 34%), linear-gradient(180deg, #ffffff 0%, #fbfaf6 100%) !important; border: 1px solid rgba(143,150,119,.22) !important; border-radius: 28px !important; box-shadow: 0 28px 80px rgba(55,56,46,.10) !important; overflow: hidden !important; } /* Les pages longues restent naturelles */ body#identity section#content.page-content, body#address section#content.page-content, body#module-psgdpr-gdpr section#content.page-content, body#module-stblogcomments-mycomments section#content.page-content, body#module-stwishlist-mywishlist section#content.page-content { min-height: 0 !important; } /* ----------------------------------------------------- 03 - MENU GAUCHE UNIQUE ----------------------------------------------------- */ body#identity section#content.page-content .my_account_left_column, body#address section#content.page-content .my_account_left_column, body#addresses section#content.page-content .my_account_left_column, body#history section#content.page-content .my_account_left_column, body#order-slip section#content.page-content .my_account_left_column, body#discount section#content.page-content .my_account_left_column, body#module-psgdpr-gdpr section#content.page-content .my_account_left_column, body#module-ps_emailalerts-account section#content.page-content .my_account_left_column, body#module-stblogcomments-mycomments section#content.page-content .my_account_left_column, body#module-stproductcomments-mycomments section#content.page-content .my_account_left_column, body#module-stwishlist-mywishlist section#content.page-content .my_account_left_column, body#module-stlovedproduct-myloved section#content.page-content .my_account_left_column, section#content.fs-account-layout .my_account_left_column { grid-column: 1 !important; width: 220px !important; max-width: 220px !important; min-width: 220px !important; margin: 0 !important; padding: 0 !important; float: none !important; background: #ffffff !important; border: 1px solid rgba(143,150,119,.22) !important; border-radius: 18px !important; box-shadow: 0 14px 34px rgba(55,56,46,.06) !important; overflow: hidden !important; } section#content.page-content .my_account_left_column .list-group, section#content.page-content .my_account_left_column .list-group-item, section#content.fs-account-layout .my_account_left_column .list-group, section#content.fs-account-layout .my_account_left_column .list-group-item { margin: 0 !important; padding: 0 !important; border-radius: 0 !important; background: transparent !important; border-left: none !important; border-right: none !important; } section#content.page-content .my_account_left_column a, section#content.fs-account-layout .my_account_left_column a { position: relative !important; width: 100% !important; min-height: 48px !important; padding: 12px 16px !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; background: #ffffff !important; border-bottom: 1px solid rgba(143,150,119,.16) !important; color: #3f4036 !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.25 !important; text-decoration: none !important; box-sizing: border-box !important; transition: all .22s ease !important; } section#content.page-content .my_account_left_column a:hover, section#content.fs-account-layout .my_account_left_column a:hover { background: #f7f4ec !important; color: #6f765c !important; } section#content.page-content .my_account_left_column a i, section#content.page-content .my_account_left_column a::before, section#content.fs-account-layout .my_account_left_column a i, section#content.fs-account-layout .my_account_left_column a::before { color: #8f9677 !important; font-size: 13px !important; margin: 0 !important; } section#content.page-content .my_account_left_column a span, section#content.page-content .my_account_left_column a .link-item, section#content.page-content .my_account_left_column a strong, section#content.fs-account-layout .my_account_left_column a span, section#content.fs-account-layout .my_account_left_column a .link-item, section#content.fs-account-layout .my_account_left_column a strong { background: transparent !important; color: inherit !important; } /* État actif uniforme */ body#my-account section#content .my_account_left_column a[href*="mon-compte"], body#my-account section#content .my_account_left_column a[href*="my-account"], body#identity section#content .my_account_left_column a[href*="identity"], body#identity section#content .my_account_left_column a[href*="identite"], body#address section#content .my_account_left_column a[href*="address"], body#address section#content .my_account_left_column a[href*="adresse"], body#addresses section#content .my_account_left_column a[href*="addresses"], body#addresses section#content .my_account_left_column a[href*="adresses"], body#history section#content .my_account_left_column a[href*="history"], body#history section#content .my_account_left_column a[href*="historique"], body#order-slip section#content .my_account_left_column a[href*="order-slip"], body#order-slip section#content .my_account_left_column a[href*="avoirs"], body#discount section#content .my_account_left_column a[href*="discount"], body#discount section#content .my_account_left_column a[href*="bons"], body#module-ps_emailalerts-account section#content .my_account_left_column a[href*="emailalerts"], body#module-ps_emailalerts-account section#content .my_account_left_column a[href*="alert"], body#module-psgdpr-gdpr section#content .my_account_left_column a[href*="psgdpr"], body#module-psgdpr-gdpr section#content .my_account_left_column a[href*="gdpr"], body#module-psgdpr-gdpr section#content .my_account_left_column a[href*="donnees"], body#module-stblogcomments-mycomments section#content .my_account_left_column a[href*="stblogcomments"], body#module-stproductcomments-mycomments section#content .my_account_left_column a[href*="stproductcomments"], body#module-stwishlist-mywishlist section#content .my_account_left_column a[href*="stwishlist"], body#module-stlovedproduct-myloved section#content .my_account_left_column a[href*="stlovedproduct"], body#module-stlovedproduct-myloved section#content .my_account_left_column a[href*="myloved"], body#module-stlovedproduct-myloved section#content .my_account_left_column a[href*="love"] { background: #f3f1e8 !important; color: #6f765c !important; font-weight: 800 !important; } body#identity section#content .my_account_left_column a[href*="identity"]::after, body#identity section#content .my_account_left_column a[href*="identite"]::after, body#address section#content .my_account_left_column a[href*="address"]::after, body#address section#content .my_account_left_column a[href*="adresse"]::after, body#addresses section#content .my_account_left_column a[href*="addresses"]::after, body#addresses section#content .my_account_left_column a[href*="adresses"]::after, body#history section#content .my_account_left_column a[href*="history"]::after, body#history section#content .my_account_left_column a[href*="historique"]::after, body#order-slip section#content .my_account_left_column a[href*="order-slip"]::after, body#order-slip section#content .my_account_left_column a[href*="avoirs"]::after, body#discount section#content .my_account_left_column a[href*="discount"]::after, body#discount section#content .my_account_left_column a[href*="bons"]::after, body#module-ps_emailalerts-account section#content .my_account_left_column a[href*="emailalerts"]::after, body#module-ps_emailalerts-account section#content .my_account_left_column a[href*="alert"]::after, body#module-psgdpr-gdpr section#content .my_account_left_column a[href*="psgdpr"]::after, body#module-psgdpr-gdpr section#content .my_account_left_column a[href*="gdpr"]::after, body#module-psgdpr-gdpr section#content .my_account_left_column a[href*="donnees"]::after, body#module-stblogcomments-mycomments section#content .my_account_left_column a[href*="stblogcomments"]::after, body#module-stproductcomments-mycomments section#content .my_account_left_column a[href*="stproductcomments"]::after, body#module-stwishlist-mywishlist section#content .my_account_left_column a[href*="stwishlist"]::after, body#module-stlovedproduct-myloved section#content .my_account_left_column a[href*="stlovedproduct"]::after, body#module-stlovedproduct-myloved section#content .my_account_left_column a[href*="myloved"]::after, body#module-stlovedproduct-myloved section#content .my_account_left_column a[href*="love"]::after { content: "" !important; position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important; width: 3px !important; background: #8f9677 !important; } /* ----------------------------------------------------- 04 - COLONNE CONTENU UNIQUE ----------------------------------------------------- */ body#identity section#content.page-content > .col-lg-9, body#address section#content.page-content > .col-lg-9, body#addresses section#content.page-content > .col-lg-9, body#history section#content.page-content > .col-lg-9, body#order-slip section#content.page-content > .col-lg-9, body#discount section#content.page-content > .col-lg-9, body#module-psgdpr-gdpr section#content.page-content > .col-lg-9, body#module-ps_emailalerts-account section#content.page-content > .col-lg-9, body#module-stblogcomments-mycomments section#content.page-content > .col-lg-9, body#module-stproductcomments-mycomments section#content.page-content > .col-lg-9, body#module-stwishlist-mywishlist section#content.page-content > .col-lg-9, body#module-stlovedproduct-myloved section#content.page-content > .col-lg-9, section#content.fs-account-layout > .fs-account-main, section#content.fs-account-layout > .col-lg-9 { grid-column: 2 !important; width: 100% !important; max-width: none !important; min-width: 0 !important; padding: 0 !important; margin: 0 !important; float: none !important; color: #3f4036 !important; } .fs-account-heading { margin: 0 0 8px 0 !important; } .fs-account-title, section#content.page-content .col-lg-9 > h1, section#content.page-content .col-lg-9 > h2, section#content.page-content .col-lg-9 > .page_heading, section#content.page-content .col-lg-9 > .page-heading { display: block !important; margin: 0 0 8px 0 !important; font-family: Georgia, "Times New Roman", serif !important; color: #2b2b2b !important; font-size: 30px !important; font-weight: 400 !important; line-height: 1.2 !important; text-transform: none !important; letter-spacing: 0 !important; } .fs-account-intro, section#content.page-content .col-lg-9 > p:first-child:not(.warning):not(.alert) { display: block !important; max-width: 760px !important; margin: 0 0 26px 0 !important; color: #5d5b50 !important; font-size: 14px !important; line-height: 1.7 !important; } .fs-account-content { width: 100% !important; max-width: 820px !important; } /* ----------------------------------------------------- 05 - FORMULAIRES, CHAMPS, BOUTONS ----------------------------------------------------- */ section#content.page-content .form-group, section#content.fs-account-layout .form-group { margin-bottom: 18px !important; } section#content.page-content label, section#content.fs-account-layout label, section#content.page-content .form-control-label, section#content.fs-account-layout .form-control-label { color: #4f5143 !important; font-size: 13px !important; font-weight: 700 !important; margin-bottom: 7px !important; } section#content.page-content input.form-control, section#content.page-content select.form-control, section#content.page-content textarea.form-control, section#content.page-content .input-group, section#content.fs-account-layout input.form-control, section#content.fs-account-layout select.form-control, section#content.fs-account-layout textarea.form-control, section#content.fs-account-layout .input-group { width: 100% !important; min-height: 44px !important; border: 1px solid #ded9ca !important; border-radius: 14px !important; background: #ffffff !important; box-shadow: none !important; color: #2b2b2b !important; } section#content.page-content input.form-control:focus, section#content.page-content select.form-control:focus, section#content.page-content textarea.form-control:focus, section#content.fs-account-layout input.form-control:focus, section#content.fs-account-layout select.form-control:focus, section#content.fs-account-layout textarea.form-control:focus { border-color: #8f9677 !important; box-shadow: 0 0 0 3px rgba(143,150,119,.14) !important; } section#content.page-content .input-group input, section#content.fs-account-layout .input-group input { border: none !important; box-shadow: none !important; } section#content.page-content .btn-primary, section#content.page-content button[type="submit"], section#content.page-content input[type="submit"], section#content.page-content .btn-default.btn_send, section#content.fs-account-layout .btn-primary, section#content.fs-account-layout button[type="submit"], section#content.fs-account-layout input[type="submit"], section#content.fs-account-layout .btn-default.btn_send { min-height: 44px !important; padding: 0 28px !important; border-radius: 999px !important; border: 1px solid #6f765c !important; background: linear-gradient(135deg, #9ca584 0%, #6f765c 100%) !important; color: #ffffff !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: .5px !important; text-transform: uppercase !important; box-shadow: 0 12px 26px rgba(111,118,92,.24) !important; transition: all .22s ease !important; } section#content.page-content .btn-primary:hover, section#content.page-content button[type="submit"]:hover, section#content.page-content input[type="submit"]:hover, section#content.fs-account-layout .btn-primary:hover, section#content.fs-account-layout button[type="submit"]:hover, section#content.fs-account-layout input[type="submit"]:hover { transform: translateY(-1px) !important; background: linear-gradient(135deg, #87906f 0%, #5f664e 100%) !important; } /* ----------------------------------------------------- 06 - MESSAGES VIDES / ALERTES ----------------------------------------------------- */ section#content.page-content .fs-account-message, section#content.page-content .alert-info, section#content.page-content .alert-warning, section#content.page-content .warning, section#content.page-content .fs-wishlist-empty-message, section#content.fs-account-layout .fs-account-message, section#content.fs-account-layout .alert-info, section#content.fs-account-layout .alert-warning, section#content.fs-account-layout .warning { position: relative !important; width: 100% !important; max-width: 720px !important; margin: 0 0 24px 0 !important; padding: 18px 22px 18px 58px !important; background: #f7f4ec !important; border: 1px solid #ded9ca !important; border-radius: 18px !important; box-shadow: 0 12px 34px rgba(55,56,46,.055) !important; color: #5e604e !important; font-size: 14px !important; line-height: 1.6 !important; } section#content.page-content .fs-account-message::before, section#content.page-content .alert-info::before, section#content.page-content .alert-warning::before, section#content.page-content .warning::before, section#content.page-content .fs-wishlist-empty-message::before, section#content.fs-account-layout .fs-account-message::before, section#content.fs-account-layout .alert-info::before, section#content.fs-account-layout .alert-warning::before, section#content.fs-account-layout .warning::before { content: "✓" !important; position: absolute !important; left: 20px !important; top: 50% !important; transform: translateY(-50%) !important; width: 28px !important; height: 28px !important; display: flex !important; align-items: center !important; justify-content: center !important; background: #eef0e6 !important; border: 1px solid #ded9ca !important; border-radius: 999px !important; color: #8f9677 !important; font-size: 13px !important; font-weight: 800 !important; } section#content.page-content .alert-warning.fs-account-message-error, section#content.page-content .fs-account-message-error { background: #fff3ef !important; border-color: #ecc8bd !important; color: #9a4f3e !important; } section#content.page-content .alert-warning.fs-account-message-error::before, section#content.page-content .fs-account-message-error::before { content: "!" !important; background: #fff8f5 !important; border-color: #ecc8bd !important; color: #9a4f3e !important; } /* ----------------------------------------------------- 07 - FOOTER RETOUR / ACCUEIL ----------------------------------------------------- */ section#content.page-content .page-footer, section#content.page-content footer.page-footer, section#content.fs-account-layout .page-footer, .fs-account-bottom-links { width: 100% !important; max-width: 760px !important; margin: 28px 0 0 !important; padding: 0 !important; border: none !important; background: transparent !important; box-shadow: none !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 42px !important; flex-wrap: wrap !important; } section#content.page-content .page-footer a, section#content.page-content footer.page-footer a, section#content.fs-account-layout .page-footer a, .fs-account-bottom-links a { min-height: 40px !important; padding: 0 4px !important; display: inline-flex !important; align-items: center !important; gap: 8px !important; color: #3f4036 !important; font-size: 13px !important; font-weight: 700 !important; text-decoration: none !important; } section#content.page-content .page-footer a:hover, section#content.fs-account-layout .page-footer a:hover, .fs-account-bottom-links a:hover { color: #6f765c !important; } /* ----------------------------------------------------- 08 - TABLEAUX / LISTES ----------------------------------------------------- */ section#content.page-content .fs-account-table, section#content.page-content table.table { width: 100% !important; max-width: 760px !important; background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 18px !important; overflow: hidden !important; box-shadow: 0 12px 34px rgba(55,56,46,.045) !important; } section#content.page-content table.table th, section#content.page-content table.table td { border-color: #e7e2d6 !important; color: #3f4036 !important; font-size: 13px !important; vertical-align: middle !important; } .fs-account-list-card { background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 16px !important; padding: 16px !important; box-shadow: 0 12px 30px rgba(55,56,46,.05) !important; } /* ----------------------------------------------------- 09 - GDPR ----------------------------------------------------- */ .fs-gdpr-page { max-width: 760px !important; } .fs-gdpr-card { position: relative !important; padding: 30px 34px !important; background: #f7f4ec !important; border: 1px solid #ded9ca !important; border-radius: 20px !important; box-shadow: 0 12px 34px rgba(55,56,46,.055) !important; } .fs-gdpr-card + .fs-gdpr-card { margin-top: -1px !important; } .fs-gdpr-card h2 { margin: 0 0 14px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 28px !important; font-weight: 400 !important; line-height: 1.2 !important; color: #2b2b2b !important; } .fs-gdpr-card p { margin: 0 0 16px !important; color: #3f4036 !important; font-size: 14px !important; line-height: 1.75 !important; } .fs-gdpr-actions { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; margin-top: 18px !important; } .fs-gdpr-actions .btn { min-width: 230px !important; } .fs-account-text-link { color: #6f765c !important; font-weight: 800 !important; text-decoration: underline !important; } /* ----------------------------------------------------- 10 - ALERTES MAIL ----------------------------------------------------- */ .fs-emailalerts-list { max-width: 760px !important; list-style: none !important; padding: 0 !important; margin: 0 !important; } .fs-emailalerts-item { margin: 0 0 16px !important; padding: 0 !important; } .fs-emailalert-line { display: grid !important; grid-template-columns: 76px minmax(0, 1fr) 42px !important; gap: 16px !important; align-items: center !important; padding: 16px !important; background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 18px !important; box-shadow: 0 12px 34px rgba(55,56,46,.055) !important; } .fs-emailalert-cover img { width: 76px !important; height: 76px !important; object-fit: contain !important; border-radius: 14px !important; background: #f7f4ec !important; border: 1px solid #ded9ca !important; } .fs-emailalert-info, .fs-emailalert-info a { color: #2b2b2b !important; text-decoration: none !important; } .fs-emailalert-info strong, .fs-emailalert-info .s_title_block { display: block !important; margin: 0 0 6px !important; font-size: 14px !important; font-weight: 800 !important; } .fs-emailalert-info span, .fs-emailalert-attributes { color: #6f765c !important; font-size: 12px !important; } .fs-emailalert-remove { width: 38px !important; height: 38px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: #fff7f4 !important; border: 1px solid #efd0c8 !important; color: #a95745 !important; text-decoration: none !important; } /* ----------------------------------------------------- 11 - BLOG COMMENTS ----------------------------------------------------- */ .fs-blogcomments-page { max-width: 760px !important; } .fs-blog-avatar-card { display: grid !important; grid-template-columns: 150px minmax(0, 1fr) !important; gap: 36px !important; align-items: center !important; margin: 0 0 28px !important; padding: 28px 34px !important; background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 22px !important; box-shadow: 0 16px 42px rgba(55,56,46,.06) !important; } .fs-blog-avatar-preview img { width: 92px !important; height: 92px !important; object-fit: cover !important; border-radius: 999px !important; padding: 10px !important; background: #f7f4ec !important; border: 1px solid #ded9ca !important; box-shadow: 0 10px 28px rgba(55,56,46,.08) !important; } .fs-blog-avatar-form .form-control-label span { display: block !important; margin-top: 4px !important; font-weight: 500 !important; color: #6f765c !important; } .fs-blog-avatar-form input[type="file"] { width: 100% !important; max-width: 320px !important; min-height: 44px !important; padding: 10px 12px !important; border-radius: 14px !important; border: 1px solid #ded9ca !important; background: #fbfaf6 !important; color: #4f5143 !important; } .fs-blog-avatar-actions { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; margin-top: 14px !important; } .fs-blogcomments-list-card { padding: 24px 28px !important; background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 20px !important; box-shadow: 0 14px 34px rgba(55,56,46,.055) !important; } .fs-blogcomments-list-card h2 { margin: 0 0 18px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 24px !important; font-weight: 400 !important; } .fs-blogcomments-list { list-style: none !important; margin: 0 !important; padding: 0 !important; } .fs-blogcomment-item { padding: 16px 0 !important; border-bottom: 1px solid #e7e2d6 !important; } .fs-blogcomment-item:last-child { border-bottom: none !important; } /* ----------------------------------------------------- 12 - COMMENTAIRES PRODUIT ----------------------------------------------------- */ .fs-productcomments-orders { max-width: 760px !important; } .fs-productcomment-order-card { margin: 0 0 18px !important; background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 20px !important; overflow: hidden !important; box-shadow: 0 14px 34px rgba(55,56,46,.055) !important; } .fs-productcomment-order-header { display: flex !important; flex-wrap: wrap !important; gap: 12px 20px !important; padding: 16px 20px !important; background: #f7f4ec !important; border-bottom: 1px solid #ded9ca !important; color: #4f5143 !important; font-size: 13px !important; font-weight: 700 !important; } .fs-productcomment-order-body { padding: 18px !important; } .fs-productcomment-product-row { align-items: center !important; padding: 16px 0 !important; border-bottom: 1px solid #e7e2d6 !important; } .fs-productcomment-product-row:last-child { border-bottom: none !important; } .fs-productcomment-cover img { max-width: 76px !important; height: auto !important; border-radius: 12px !important; background: #f7f4ec !important; border: 1px solid #ded9ca !important; } /* ----------------------------------------------------- 13 - WISHLIST ----------------------------------------------------- */ .fs-wishlist-page { max-width: 760px !important; } .fs-wishlist-create-card, .fs-wishlist-share-card, .fs-wishlist-card { background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 22px !important; box-shadow: 0 16px 42px rgba(55,56,46,.06) !important; } .fs-wishlist-create-card { margin: 0 0 28px !important; padding: 28px 34px !important; } .fs-wishlist-create-text h2, .fs-wishlist-share-card h2 { margin: 0 0 8px !important; color: #3f4036 !important; font-size: 17px !important; font-weight: 800 !important; } .fs-wishlist-create-text p { margin: 0 0 20px !important; color: #5d5b50 !important; font-size: 14px !important; } .fs-wishlist-form { display: grid !important; grid-template-columns: 92px minmax(0, 1fr) auto !important; gap: 12px !important; align-items: center !important; } .fs-wishlist-form button { white-space: nowrap !important; } .fs-wishlist-list { list-style: none !important; padding: 0 !important; margin: 0 !important; } .fs-wishlist-card { position: relative !important; display: grid !important; grid-template-columns: 112px minmax(0, 1fr) 44px !important; gap: 22px !important; align-items: center !important; margin: 0 0 18px !important; padding: 20px !important; } .fs-wishlist-cover img { width: 112px !important; height: 112px !important; object-fit: contain !important; border-radius: 16px !important; background: #f7f4ec !important; border: 1px solid #ded9ca !important; } .fs-wishlist-title { color: #3f4036 !important; font-size: 16px !important; font-weight: 800 !important; text-decoration: none !important; } .fs-wishlist-count { display: block !important; margin-top: 8px !important; color: #6f765c !important; font-size: 13px !important; font-weight: 700 !important; } .fs-wishlist-delete { width: 38px !important; height: 38px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: #fff7f4 !important; border: 1px solid #efd0c8 !important; color: #a95745 !important; text-decoration: none !important; } .fs-wishlist-share-card { margin-bottom: 22px !important; padding: 26px 30px !important; } .fs-wishlist-share-row { display: grid !important; grid-template-columns: 140px minmax(0, 1fr) auto !important; gap: 12px !important; align-items: center !important; margin-top: 14px !important; } .fs-wishlist-products { margin-top: 20px !important; } .fs-wishlist-back-wrap { margin-top: 22px !important; } /* ----------------------------------------------------- 14 - MES ARTICLES AIMÉS ----------------------------------------------------- */ body#module-stlovedproduct-myloved .fs-loved-page, body#module-stlovedproduct-myloved .col-lg-9 { max-width: 760px !important; } body#module-stlovedproduct-myloved .fs-loved-empty, body#module-stlovedproduct-myloved .col-lg-9 > p:not(.fs-account-intro) { position: relative !important; width: 100% !important; max-width: 720px !important; margin: 0 0 24px 0 !important; padding: 18px 22px 18px 58px !important; background: #f7f4ec !important; border: 1px solid #ded9ca !important; border-radius: 18px !important; color: #5e604e !important; font-size: 14px !important; line-height: 1.6 !important; box-shadow: 0 12px 34px rgba(55,56,46,.055) !important; } body#module-stlovedproduct-myloved .fs-loved-empty::before, body#module-stlovedproduct-myloved .col-lg-9 > p:not(.fs-account-intro)::before { content: "♡" !important; position: absolute !important; left: 20px !important; top: 50% !important; transform: translateY(-50%) !important; width: 28px !important; height: 28px !important; display: flex !important; align-items: center !important; justify-content: center !important; background: #eef0e6 !important; border: 1px solid #ded9ca !important; border-radius: 999px !important; color: #8f9677 !important; font-size: 14px !important; font-weight: 800 !important; } /* ----------------------------------------------------- 15 - DASHBOARD MON COMPTE ----------------------------------------------------- */ body#my-account section#content.fs-account-dashboard, body#my-account section#content.page-content { width: calc(100% - 40px) !important; max-width: 1120px !important; min-height: 650px !important; margin: 34px auto 60px !important; padding: 44px 54px 46px !important; display: block !important; background: radial-gradient(circle at top left, rgba(143,150,119,.08), transparent 34%), linear-gradient(180deg, #ffffff 0%, #fbfaf6 100%) !important; border: 1px solid rgba(143,150,119,.22) !important; border-radius: 28px !important; box-shadow: 0 28px 80px rgba(55,56,46,.10) !important; overflow: hidden !important; } body#my-account .my_account_left_column { display: none !important; } .fs-account-dashboard-hero { text-align: center !important; margin: 0 auto 34px !important; } .fs-account-kicker { margin: 0 0 12px !important; color: #8f9677 !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 2px !important; text-transform: uppercase !important; } .fs-account-dashboard-intro { margin: 0 0 24px !important; color: #3f4036 !important; font-size: 15px !important; line-height: 1.6 !important; } .fs-account-dashboard-title, body#my-account .page_heading { margin: 0 0 22px !important; color: #2b2b2b !important; font-size: 15px !important; font-weight: 900 !important; letter-spacing: .7px !important; text-transform: uppercase !important; } .fs-account-dashboard-pills { max-width: 720px !important; min-height: 54px !important; margin: 0 auto !important; padding: 0 24px !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 26px !important; flex-wrap: wrap !important; background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 999px !important; box-shadow: 0 14px 36px rgba(55,56,46,.055) !important; } .fs-account-dashboard-pills span { color: #4f5143 !important; font-size: 13px !important; } body#my-account .myaccount_dashboard_list, body#my-account .myacount_dashbord_list, body#my-account .fs-dashboard-grid { max-width: 860px !important; margin: 0 auto !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 22px !important; } body#my-account .myaccount_dashboard_list > .list-group-item, body#my-account .myacount_dashbord_list > .list-group-item { padding: 0 !important; margin: 0 !important; border: none !important; background: transparent !important; } body#my-account .myaccount_dashboard_list > .list-group-item > a, body#my-account .myacount_dashbord_list > .list-group-item > a, body#my-account .myaccount_dashboard_list > a, body#my-account .myacount_dashbord_list > a, body#my-account #lgcookieslaw-link { min-height: 92px !important; padding: 16px !important; display: flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; background: #ffffff !important; border: 1px solid #ded9ca !important; border-radius: 18px !important; color: #2b2b2b !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.35 !important; text-decoration: none !important; box-shadow: 0 14px 36px rgba(55,56,46,.055) !important; } body#my-account .myaccount_dashboard_list > .list-group-item > a:hover, body#my-account .myacount_dashbord_list > .list-group-item > a:hover, body#my-account #lgcookieslaw-link:hover { transform: translateY(-3px) !important; border-color: rgba(143,150,119,.34) !important; box-shadow: 0 22px 52px rgba(55,56,46,.09) !important; } body#my-account .myaccount_dashboard_list i, body#my-account .myacount_dashbord_list i { color: #8f9677 !important; } .fs-dashboard-bottom-links { max-width: 980px !important; margin: 30px auto 0 !important; } /* ----------------------------------------------------- 16 - PROTECTION FOOTER GLOBAL ----------------------------------------------------- */ body#identity #footer, body#address #footer, body#addresses #footer, body#history #footer, body#order-slip #footer, body#discount #footer, body#module-psgdpr-gdpr #footer, body#module-ps_emailalerts-account #footer, body#module-stblogcomments-mycomments #footer, body#module-stproductcomments-mycomments #footer, body#module-stwishlist-mywishlist #footer, body#module-stlovedproduct-myloved #footer, body#my-account #footer { clear: both !important; width: 100% !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; } @media (min-width: 992px) { body#identity #footer-primary-container .footer_first_level_row, body#address #footer-primary-container .footer_first_level_row, body#addresses #footer-primary-container .footer_first_level_row, body#history #footer-primary-container .footer_first_level_row, body#order-slip #footer-primary-container .footer_first_level_row, body#discount #footer-primary-container .footer_first_level_row, body#module-psgdpr-gdpr #footer-primary-container .footer_first_level_row, body#module-ps_emailalerts-account #footer-primary-container .footer_first_level_row, body#module-stblogcomments-mycomments #footer-primary-container .footer_first_level_row, body#module-stproductcomments-mycomments #footer-primary-container .footer_first_level_row, body#module-stwishlist-mywishlist #footer-primary-container .footer_first_level_row, body#module-stlovedproduct-myloved #footer-primary-container .footer_first_level_row, body#my-account #footer-primary-container .footer_first_level_row { max-width: 1050px !important; margin-left: auto !important; margin-right: auto !important; display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; column-gap: 28px !important; align-items: stretch !important; justify-content: center !important; } } /* ----------------------------------------------------- 17 - RESPONSIVE ----------------------------------------------------- */ @media (max-width: 991px) { body#identity section#content.page-content, body#address section#content.page-content, body#addresses section#content.page-content, body#history section#content.page-content, body#order-slip section#content.page-content, body#discount section#content.page-content, body#module-psgdpr-gdpr section#content.page-content, body#module-ps_emailalerts-account section#content.page-content, body#module-stblogcomments-mycomments section#content.page-content, body#module-stproductcomments-mycomments section#content.page-content, body#module-stwishlist-mywishlist section#content.page-content, body#module-stlovedproduct-myloved section#content.page-content, section#content.fs-account-layout { grid-template-columns: 1fr !important; gap: 28px !important; width: calc(100% - 32px) !important; padding: 34px 30px !important; } section#content.page-content .my_account_left_column, section#content.fs-account-layout .my_account_left_column { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } body#my-account .myaccount_dashboard_list, body#my-account .myacount_dashbord_list, body#my-account .fs-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .fs-wishlist-form, .fs-wishlist-share-row { grid-template-columns: 1fr !important; } } @media (max-width: 575px) { body#identity section#content.page-content, body#address section#content.page-content, body#addresses section#content.page-content, body#history section#content.page-content, body#order-slip section#content.page-content, body#discount section#content.page-content, body#module-psgdpr-gdpr section#content.page-content, body#module-ps_emailalerts-account section#content.page-content, body#module-stblogcomments-mycomments section#content.page-content, body#module-stproductcomments-mycomments section#content.page-content, body#module-stwishlist-mywishlist section#content.page-content, body#module-stlovedproduct-myloved section#content.page-content, section#content.fs-account-layout, body#my-account section#content.fs-account-dashboard { width: calc(100% - 24px) !important; margin: 22px auto 42px !important; padding: 28px 20px !important; border-radius: 22px !important; } .fs-account-title, section#content.page-content .col-lg-9 > h1, section#content.page-content .col-lg-9 > h2, section#content.page-content .col-lg-9 > .page_heading, section#content.page-content .col-lg-9 > .page-heading { font-size: 26px !important; } .fs-blog-avatar-card, .fs-emailalert-line, .fs-wishlist-card { grid-template-columns: 1fr !important; } .fs-gdpr-card, .fs-wishlist-create-card, .fs-blog-avatar-card { padding: 24px 22px !important; } .fs-gdpr-actions .btn, .fs-blog-avatar-actions .btn, section#content.page-content .btn-primary, section#content.page-content button[type="submit"], section#content.page-content input[type="submit"] { width: 100% !important; min-width: 0 !important; } section#content.page-content .page-footer, .fs-account-bottom-links { flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; } body#my-account .myaccount_dashboard_list, body#my-account .myacount_dashbord_list, body#my-account .fs-dashboard-grid { grid-template-columns: 1fr !important; } .fs-account-dashboard-pills { border-radius: 22px !important; gap: 10px !important; padding: 16px !important; } } /* ===================================================== MODULE COOKIES - COMPTE CLIENT PREMIUM Corrige le lien cookies dans le menu gauche + tableau de bord ===================================================== */ /* ===================================================== 01 - MENU GAUCHE : PRÉFÉRENCES COOKIES ===================================================== */ .my_account_left_column #lgcookieslaw-link, .my_account_left_column a[href*="lgcookieslaw"], .my_account_left_column a[href*="cookies"] { width: 100% !important; min-height: 48px !important; padding: 12px 16px !important; margin: 0 !important; display: flex !important; align-items: center !important; gap: 10px !important; background: #ffffff !important; border: 0 !important; border-bottom: 1px solid rgba(143,150,119,.16) !important; border-radius: 0 !important; box-shadow: none !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; text-decoration: none !important; overflow: hidden !important; } /* Supprime l’ancienne grosse image cookies */ .my_account_left_column #lgcookieslaw-link img, .my_account_left_column a[href*="lgcookieslaw"] img, .my_account_left_column a[href*="cookies"] img { display: none !important; } /* Icône premium sobre */ .my_account_left_column #lgcookieslaw-link::before, .my_account_left_column a[href*="lgcookieslaw"]::before, .my_account_left_column a[href*="cookies"]::before { content: "◌" !important; width: 16px !important; min-width: 16px !important; height: 16px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #8f9677 !important; font-size: 16px !important; line-height: 1 !important; } /* Texte court propre */ .my_account_left_column #lgcookieslaw-link::after, .my_account_left_column a[href*="lgcookieslaw"]::after, .my_account_left_column a[href*="cookies"]::after { content: "Préférences cookies" !important; display: block !important; color: #3f4036 !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.25 !important; } /* Hover */ .my_account_left_column #lgcookieslaw-link:hover, .my_account_left_column a[href*="lgcookieslaw"]:hover, .my_account_left_column a[href*="cookies"]:hover { background: #f7f4ec !important; } .my_account_left_column #lgcookieslaw-link:hover::after, .my_account_left_column a[href*="lgcookieslaw"]:hover::after, .my_account_left_column a[href*="cookies"]:hover::after { color: #6f765c !important; } /* ===================================================== 02 - TABLEAU DE BORD : CARTE COOKIES PREMIUM ===================================================== */ body#my-account #lgcookieslaw-link, body#my-account a[href*="lgcookieslaw"], body#my-account a[href*="cookies"] { min-height: 88px !important; height: 88px !important; padding: 18px 22px !important; margin: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 9px !important; background: #ffffff !important; border: 1px solid rgba(143,150,119,.22) !important; border-radius: 18px !important; box-shadow: 0 14px 34px rgba(55,56,46,.06) !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; text-align: center !important; text-decoration: none !important; overflow: hidden !important; box-sizing: border-box !important; } /* Supprime l’image noire sur la tuile */ body#my-account #lgcookieslaw-link img, body#my-account a[href*="lgcookieslaw"] img, body#my-account a[href*="cookies"] img { display: none !important; } /* Icône dashboard */ body#my-account #lgcookieslaw-link::before, body#my-account a[href*="lgcookieslaw"]::before, body#my-account a[href*="cookies"]::before { content: "◌" !important; color: #8f9677 !important; font-size: 18px !important; line-height: 1 !important; } /* Texte dashboard */ body#my-account #lgcookieslaw-link::after, body#my-account a[href*="lgcookieslaw"]::after, body#my-account a[href*="cookies"]::after { content: "Préférences cookies" !important; color: #2f302a !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.35 !important; } /* Hover dashboard */ body#my-account #lgcookieslaw-link:hover, body#my-account a[href*="lgcookieslaw"]:hover, body#my-account a[href*="cookies"]:hover { background: #fbfaf6 !important; border-color: rgba(143,150,119,.34) !important; transform: translateY(-1px) !important; box-shadow: 0 18px 42px rgba(55,56,46,.09) !important; } body#my-account #lgcookieslaw-link:hover::after, body#my-account a[href*="lgcookieslaw"]:hover::after, body#my-account a[href*="cookies"]:hover::after { color: #6f765c !important; } /* ===================================================== 03 - SÉCURITÉ : ÉVITE LA CARTE TROP ÉTROITE ===================================================== */ body#my-account .myaccount_dashboard_list #lgcookieslaw-link, body#my-account .myaccount_dashboard_list a[href*="lgcookieslaw"], body#my-account .myaccount_dashboard_list a[href*="cookies"], body#my-account .my_account_dashboard_list #lgcookieslaw-link, body#my-account .my_account_dashboard_list a[href*="lgcookieslaw"], body#my-account .my_account_dashboard_list a[href*="cookies"] { width: 100% !important; max-width: none !important; min-width: 0 !important; } /* Si le module injecte une colonne Bootstrap différente */ body#my-account #lgcookieslaw-link[class*="col-"], body#my-account a[href*="lgcookieslaw"][class*="col-"], body#my-account a[href*="cookies"][class*="col-"] { flex: unset !important; max-width: none !important; width: 100% !important; } /* ===================================================== FINAL FIX - MODULE COOKIES DANS MENU COMPTE CLIENT ===================================================== */ /* Force le lien cookies du menu gauche à redevenir une ligne premium */ .my_account_left_column #lgcookieslaw-link, .my_account_left_column a#lgcookieslaw-link, .my_account_left_column a[href*="lgcookieslaw"] { width: 100% !important; min-height: 48px !important; padding: 12px 16px !important; margin: 0 !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; background: #ffffff !important; border: 0 !important; border-bottom: 1px solid rgba(143,150,119,.16) !important; border-radius: 0 !important; box-shadow: none !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; text-decoration: none !important; overflow: hidden !important; box-sizing: border-box !important; } /* Cache totalement l'ancien contenu : image noire + texte long */ .my_account_left_column #lgcookieslaw-link *, .my_account_left_column a#lgcookieslaw-link *, .my_account_left_column a[href*="lgcookieslaw"] * { display: none !important; visibility: hidden !important; } /* Icône sobre */ .my_account_left_column #lgcookieslaw-link::before, .my_account_left_column a#lgcookieslaw-link::before, .my_account_left_column a[href*="lgcookieslaw"]::before { content: "◌" !important; width: 16px !important; min-width: 16px !important; height: 16px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #8f9677 !important; font-size: 16px !important; line-height: 1 !important; } /* Texte premium court */ .my_account_left_column #lgcookieslaw-link::after, .my_account_left_column a#lgcookieslaw-link::after, .my_account_left_column a[href*="lgcookieslaw"]::after { content: "Préférences cookies" !important; display: block !important; color: #3f4036 !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.25 !important; white-space: normal !important; } /* Hover */ .my_account_left_column #lgcookieslaw-link:hover, .my_account_left_column a#lgcookieslaw-link:hover, .my_account_left_column a[href*="lgcookieslaw"]:hover { background: #f7f4ec !important; } .my_account_left_column #lgcookieslaw-link:hover::after, .my_account_left_column a#lgcookieslaw-link:hover::after, .my_account_left_column a[href*="lgcookieslaw"]:hover::after { color: #6f765c !important; } /* ===================================================== CORRECTIF FINAL - COMPTE CLIENT + MODULE COOKIES Folies Secrètes - Premium À coller tout en bas du CSS personnalisé Panda ===================================================== */ /* ===================================================== 01 - MENU GAUCHE : LIEN COOKIES PREMIUM ROBUSTE Fonctionne même si le module injecte encore l'ancien texte/image. ===================================================== */ .fs-account-sidebar .lgcookies, .my_account_left_column .lgcookies, .fs-account-sidebar li[class*="lgcookies"], .my_account_left_column li[class*="lgcookies"] { position: relative !important; width: 100% !important; min-height: 48px !important; margin: 0 !important; padding: 12px 16px !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; background: #ffffff !important; border: 0 !important; border-bottom: 1px solid rgba(143,150,119,.16) !important; border-radius: 0 !important; box-shadow: none !important; overflow: hidden !important; box-sizing: border-box !important; list-style: none !important; } .fs-account-sidebar .lgcookies:hover, .my_account_left_column .lgcookies:hover, .fs-account-sidebar li[class*="lgcookies"]:hover, .my_account_left_column li[class*="lgcookies"]:hover { background: #f7f4ec !important; } /* Le lien reste cliquable mais son ancien contenu devient invisible. */ .fs-account-sidebar .lgcookies > a, .my_account_left_column .lgcookies > a, .fs-account-sidebar li[class*="lgcookies"] > a, .my_account_left_column li[class*="lgcookies"] > a, .fs-account-sidebar #lgcookieslaw-link, .my_account_left_column #lgcookieslaw-link, .fs-account-sidebar a[href*="lgcookieslaw"], .my_account_left_column a[href*="lgcookieslaw"] { position: absolute !important; inset: 0 !important; z-index: 3 !important; display: block !important; width: 100% !important; height: 100% !important; min-height: 48px !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; text-decoration: none !important; overflow: hidden !important; } /* Cache l'image noire + tous les textes anciens du module. */ .fs-account-sidebar .lgcookies > a *, .my_account_left_column .lgcookies > a *, .fs-account-sidebar li[class*="lgcookies"] > a *, .my_account_left_column li[class*="lgcookies"] > a *, .fs-account-sidebar #lgcookieslaw-link *, .my_account_left_column #lgcookieslaw-link *, .fs-account-sidebar a[href*="lgcookieslaw"] *, .my_account_left_column a[href*="lgcookieslaw"] * { display: none !important; visibility: hidden !important; opacity: 0 !important; } /* Icône premium affichée par le LI, pas par le lien module. */ .fs-account-sidebar .lgcookies::before, .my_account_left_column .lgcookies::before, .fs-account-sidebar li[class*="lgcookies"]::before, .my_account_left_column li[class*="lgcookies"]::before { content: "◌" !important; position: relative !important; z-index: 1 !important; width: 16px !important; min-width: 16px !important; height: 16px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #8f9677 !important; font-size: 16px !important; line-height: 1 !important; } /* Texte premium court. */ .fs-account-sidebar .lgcookies::after, .my_account_left_column .lgcookies::after, .fs-account-sidebar li[class*="lgcookies"]::after, .my_account_left_column li[class*="lgcookies"]::after { content: "Préférences cookies" !important; position: relative !important; z-index: 1 !important; display: block !important; color: #3f4036 !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.25 !important; white-space: normal !important; } .fs-account-sidebar .lgcookies:hover::after, .my_account_left_column .lgcookies:hover::after, .fs-account-sidebar li[class*="lgcookies"]:hover::after, .my_account_left_column li[class*="lgcookies"]:hover::after { color: #6f765c !important; } /* Si le module injecte directement une ancre sans li.lgcookies dans le menu. */ .fs-account-sidebar > #lgcookieslaw-link, .my_account_left_column > #lgcookieslaw-link, .fs-account-sidebar > a[href*="lgcookieslaw"], .my_account_left_column > a[href*="lgcookieslaw"] { position: relative !important; inset: auto !important; z-index: 1 !important; width: 100% !important; min-height: 48px !important; padding: 12px 16px !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; background: #ffffff !important; border-bottom: 1px solid rgba(143,150,119,.16) !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; } .fs-account-sidebar > #lgcookieslaw-link::before, .my_account_left_column > #lgcookieslaw-link::before, .fs-account-sidebar > a[href*="lgcookieslaw"]::before, .my_account_left_column > a[href*="lgcookieslaw"]::before { content: "◌" !important; color: #8f9677 !important; font-size: 16px !important; line-height: 1 !important; } .fs-account-sidebar > #lgcookieslaw-link::after, .my_account_left_column > #lgcookieslaw-link::after, .fs-account-sidebar > a[href*="lgcookieslaw"]::after, .my_account_left_column > a[href*="lgcookieslaw"]::after { content: "Préférences cookies" !important; color: #3f4036 !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.25 !important; } /* ===================================================== 02 - TABLEAU DE BORD : GARDE LA TUILE COOKIES PROPRE ===================================================== */ body#my-account #lgcookieslaw-link, body#my-account a[href*="lgcookieslaw"] { color: transparent !important; font-size: 0 !important; line-height: 0 !important; text-decoration: none !important; } body#my-account #lgcookieslaw-link img, body#my-account a[href*="lgcookieslaw"] img { display: none !important; } body#my-account #lgcookieslaw-link .fs-cookie-account-card, body#my-account #lgcookieslaw-link .link-item { width: 100% !important; height: 100% !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 9px !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } body#my-account #lgcookieslaw-link .fs-cookie-account-icon, body#my-account #lgcookieslaw-link .fs-cookie-account-icon svg { width: 18px !important; height: 18px !important; color: #8f9677 !important; } body#my-account #lgcookieslaw-link .fs-cookie-account-label { color: #2f302a !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.35 !important; } /* ===================================================== 03 - SÉCURITÉ : MASQUER UN ÉVENTUEL TEXTE PILL EN DOUBLE Si le hook dashboard revient malgré le template, cette règle évite l'effet amateur. ===================================================== */ body#my-account .fs-account-dashboard-hero + div:not(.fs-dashboard-grid), body#my-account .fs-account-dashboard-hero + p, body#my-account .fs-account-dashboard-pills + div:not(.fs-dashboard-grid), body#my-account .fs-account-dashboard-pills + p { display: none !important; } /* ===================================================== COOKIE ACCOUNT FINAL CLEAN Une seule version - pas de doublon - premium ===================================================== */ /* ===================================================== 01 - RESET TOTAL DES ANCIENS PSEUDO COOKIES ===================================================== */ html body .my_account_left_column li.lgcookies::before, html body .my_account_left_column li.lgcookies::after, html body .my_account_left_column li.fs-cookie-account-menu-item::before, html body .my_account_left_column li.fs-cookie-account-menu-item::after, html body .my_account_left_column a#lgcookieslaw-link::before, html body .my_account_left_column a#lgcookieslaw-link::after, html body .my_account_left_column a[href*="lgcookieslaw"]::before, html body .my_account_left_column a[href*="lgcookieslaw"]::after, html body#my-account a#lgcookieslaw-link::before, html body#my-account a#lgcookieslaw-link::after, html body#my-account a[href*="lgcookieslaw"]::before, html body#my-account a[href*="lgcookieslaw"]::after { content: none !important; display: none !important; } /* ===================================================== 02 - MENU GAUCHE : PRÉFÉRENCES COOKIES PROPRE ===================================================== */ html body .my_account_left_column li.lgcookies, html body .my_account_left_column li.fs-cookie-account-menu-item { width: 100% !important; min-height: 48px !important; height: auto !important; margin: 0 !important; padding: 0 !important; display: block !important; background: #ffffff !important; border: 0 !important; border-bottom: 1px solid rgba(143,150,119,.16) !important; border-radius: 0 !important; box-shadow: none !important; overflow: hidden !important; list-style: none !important; box-sizing: border-box !important; } html body .my_account_left_column li.lgcookies:hover, html body .my_account_left_column li.fs-cookie-account-menu-item:hover { background: #f7f4ec !important; } html body .my_account_left_column li.lgcookies > a, html body .my_account_left_column li.fs-cookie-account-menu-item > a, html body .my_account_left_column a#lgcookieslaw-link, html body .my_account_left_column a[href*="lgcookieslaw"] { position: relative !important; inset: auto !important; z-index: 1 !important; width: 100% !important; min-height: 48px !important; height: auto !important; margin: 0 !important; padding: 12px 16px !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: #3f4036 !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.25 !important; text-align: left !important; text-decoration: none !important; overflow: visible !important; box-sizing: border-box !important; } /* Cache l’ancienne image noire uniquement */ html body .my_account_left_column a#lgcookieslaw-link img, html body .my_account_left_column a[href*="lgcookieslaw"] img { display: none !important; } /* Icône du nouveau template */ html body .my_account_left_column a#lgcookieslaw-link .fs-cookie-account-icon, html body .my_account_left_column a[href*="lgcookieslaw"] .fs-cookie-account-icon { width: 16px !important; min-width: 16px !important; height: 16px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; visibility: visible !important; opacity: 1 !important; color: #8f9677 !important; line-height: 1 !important; } html body .my_account_left_column a#lgcookieslaw-link .fs-cookie-account-icon svg, html body .my_account_left_column a[href*="lgcookieslaw"] .fs-cookie-account-icon svg { width: 16px !important; height: 16px !important; display: block !important; } /* Texte menu */ html body .my_account_left_column a#lgcookieslaw-link .fs-cookie-account-label, html body .my_account_left_column a[href*="lgcookieslaw"] .fs-cookie-account-label { display: inline-flex !important; visibility: visible !important; opacity: 1 !important; color: #3f4036 !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.25 !important; white-space: normal !important; } html body .my_account_left_column a#lgcookieslaw-link:hover .fs-cookie-account-label, html body .my_account_left_column a[href*="lgcookieslaw"]:hover .fs-cookie-account-label { color: #6f765c !important; } /* ===================================================== 03 - TABLEAU DE BORD : TUILE COOKIES SANS DOUBLON ===================================================== */ html body#my-account a#lgcookieslaw-link, html body#my-account a[href*="lgcookieslaw"] { width: 100% !important; min-height: 88px !important; height: 88px !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: stretch !important; justify-content: stretch !important; background: #ffffff !important; border: 1px solid rgba(143,150,119,.22) !important; border-radius: 18px !important; box-shadow: 0 14px 34px rgba(55,56,46,.06) !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; text-decoration: none !important; overflow: hidden !important; box-sizing: border-box !important; } html body#my-account a#lgcookieslaw-link:hover, html body#my-account a[href*="lgcookieslaw"]:hover { background: #fbfaf6 !important; border-color: rgba(143,150,119,.34) !important; transform: translateY(-1px) !important; box-shadow: 0 18px 42px rgba(55,56,46,.09) !important; } /* Contenu interne unique */ html body#my-account a#lgcookieslaw-link .fs-cookie-account-card, html body#my-account a[href*="lgcookieslaw"] .fs-cookie-account-card, html body#my-account a#lgcookieslaw-link .link-item, html body#my-account a[href*="lgcookieslaw"] .link-item { width: 100% !important; height: 100% !important; min-height: 88px !important; margin: 0 !important; padding: 18px 22px !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 9px !important; background: transparent !important; border: 0 !important; border-radius: 18px !important; box-shadow: none !important; visibility: visible !important; opacity: 1 !important; box-sizing: border-box !important; } /* Icône dashboard */ html body#my-account a#lgcookieslaw-link .fs-cookie-account-icon, html body#my-account a[href*="lgcookieslaw"] .fs-cookie-account-icon { width: 18px !important; min-width: 18px !important; height: 18px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; visibility: visible !important; opacity: 1 !important; color: #8f9677 !important; line-height: 1 !important; } html body#my-account a#lgcookieslaw-link .fs-cookie-account-icon svg, html body#my-account a[href*="lgcookieslaw"] .fs-cookie-account-icon svg { width: 18px !important; height: 18px !important; display: block !important; } /* Texte dashboard : une seule fois */ html body#my-account a#lgcookieslaw-link .fs-cookie-account-label, html body#my-account a[href*="lgcookieslaw"] .fs-cookie-account-label { display: inline-flex !important; visibility: visible !important; opacity: 1 !important; color: #2f302a !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.35 !important; white-space: normal !important; } /* ===================================================== 04 - SÉCURITÉ : SI ANCIEN TEXTE DIRECT RESTE ===================================================== */ html body#my-account a#lgcookieslaw-link > img, html body#my-account a[href*="lgcookieslaw"] > img { display: none !important; } /* ===================================================== PAGE PRÉFÉRENCES COOKIES - VERSION PREMIUM Module lgcookieslaw / page réinitialisation consentement ===================================================== */ body[id*="lgcookieslaw"] { background: #fbfaf6 !important; } body[id*="lgcookieslaw"] #wrapper, body[id*="lgcookieslaw"] .columns-container, body[id*="lgcookieslaw"] #content-wrapper, body[id*="lgcookieslaw"] #center_column { background: #fbfaf6 !important; } /* Conteneur principal de la page */ body[id*="lgcookieslaw"] #main, body[id*="lgcookieslaw"] section#content, body[id*="lgcookieslaw"] section#content.page-content { width: calc(100% - 40px) !important; max-width: 1120px !important; margin: 34px auto 60px !important; padding: 48px 56px !important; background: radial-gradient(circle at top left, rgba(143,150,119,.08), transparent 34%), linear-gradient(180deg, #ffffff 0%, #fbfaf6 100%) !important; border: 1px solid rgba(143,150,119,.22) !important; border-radius: 28px !important; box-shadow: 0 28px 80px rgba(55,56,46,.10) !important; color: #3f4036 !important; box-sizing: border-box !important; } /* Breadcrumb / petit titre haut */ body[id*="lgcookieslaw"] .breadcrumb, body[id*="lgcookieslaw"] .breadcrumb_wrapper, body[id*="lgcookieslaw"] .breadcrumb-container { max-width: 1120px !important; margin: 0 auto !important; padding: 18px 20px 0 !important; background: transparent !important; border: 0 !important; color: #7a786d !important; font-size: 13px !important; } /* Titre */ body[id*="lgcookieslaw"] h1, body[id*="lgcookieslaw"] .page-heading, body[id*="lgcookieslaw"] .page_heading { margin: 0 0 14px 0 !important; font-family: Georgia, "Times New Roman", serif !important; color: #2b2b2b !important; font-size: 34px !important; font-weight: 400 !important; line-height: 1.2 !important; } /* Texte */ body[id*="lgcookieslaw"] #main p, body[id*="lgcookieslaw"] section#content p, body[id*="lgcookieslaw"] section#content.page-content p { max-width: 760px !important; margin: 0 0 22px 0 !important; color: #5d5b50 !important; font-size: 15px !important; line-height: 1.75 !important; } /* Message premium avec icône */ body[id*="lgcookieslaw"] #main p:first-of-type, body[id*="lgcookieslaw"] section#content p:first-of-type { position: relative !important; max-width: 760px !important; padding: 20px 24px 20px 58px !important; background: #f7f4ec !important; border: 1px solid #ded9ca !important; border-radius: 18px !important; box-shadow: 0 14px 34px rgba(55,56,46,.06) !important; } body[id*="lgcookieslaw"] #main p:first-of-type::before, body[id*="lgcookieslaw"] section#content p:first-of-type::before { content: "✓" !important; position: absolute !important; left: 20px !important; top: 50% !important; transform: translateY(-50%) !important; width: 28px !important; height: 28px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; background: #eef0e6 !important; border: 1px solid #ded9ca !important; border-radius: 999px !important; color: #8f9677 !important; font-size: 14px !important; font-weight: 800 !important; } /* Liens Retour / Accueil */ body[id*="lgcookieslaw"] #main a, body[id*="lgcookieslaw"] section#content a, body[id*="lgcookieslaw"] section#content.page-content a { min-height: 42px !important; padding: 0 18px !important; margin-right: 12px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; background: #ffffff !important; border: 1px solid rgba(143,150,119,.22) !important; border-radius: 999px !important; box-shadow: 0 10px 26px rgba(55,56,46,.06) !important; color: #3f4036 !important; font-size: 13px !important; font-weight: 700 !important; text-decoration: none !important; transition: all .22s ease !important; } body[id*="lgcookieslaw"] #main a:hover, body[id*="lgcookieslaw"] section#content a:hover, body[id*="lgcookieslaw"] section#content.page-content a:hover { background: #f7f4ec !important; color: #6f765c !important; border-color: rgba(143,150,119,.34) !important; transform: translateY(-1px) !important; } /* Footer : éviter qu’il colle trop à la page */ body[id*="lgcookieslaw"] #footer, body[id*="lgcookieslaw"] .footer-container { margin-top: 0 !important; clear: both !important; } /* Mobile */ @media (max-width: 575px) { body[id*="lgcookieslaw"] #main, body[id*="lgcookieslaw"] section#content, body[id*="lgcookieslaw"] section#content.page-content { width: calc(100% - 24px) !important; margin: 22px auto 42px !important; padding: 34px 22px !important; border-radius: 22px !important; } body[id*="lgcookieslaw"] h1, body[id*="lgcookieslaw"] .page-heading, body[id*="lgcookieslaw"] .page_heading { font-size: 28px !important; } body[id*="lgcookieslaw"] #main p:first-of-type, body[id*="lgcookieslaw"] section#content p:first-of-type { padding-left: 20px !important; } body[id*="lgcookieslaw"] #main p:first-of-type::before, body[id*="lgcookieslaw"] section#content p:first-of-type::before { display: none !important; } }/* ===================================================== FINAL - SUPPRESSION LIGNE VIDE COOKIES MENU GAUCHE On garde la carte cookies sur le tableau de bord, mais on supprime la ligne vide dans le menu latéral. ===================================================== */ /* Cache le lien cookies dans le menu gauche */ .my_account_left_column #lgcookieslaw-link, .my_account_left_column a#lgcookieslaw-link, .my_account_left_column a[href*="lgcookieslaw"] { display: none !important; } /* Cache aussi le LI parent si le navigateur supporte :has() */ .my_account_left_column li:has(#lgcookieslaw-link), .my_account_left_column li:has(a[href*="lgcookieslaw"]) { display: none !important; } /* Sécurité si le module utilise une classe dédiée */ .my_account_left_column li.lgcookies, .my_account_left_column li.fs-cookie-account-menu-item { display: none !important; } /* Supprime les hauteurs résiduelles si le bloc est vide */ .my_account_left_column li:empty, .my_account_left_column .lgcookies:empty, .my_account_left_column .fs-cookie-account-menu-item:empty { display: none !important; } /* ===================================================== FIX FINAL - SUPPRIME LE CONTENEUR VIDE COOKIES ===================================================== */ /* Cache le bloc parent du lien cookies dans le menu gauche */ .my_account_left_column .list-group-item:has(#lgcookieslaw-link), .my_account_left_column .list-group-item:has(a#lgcookieslaw-link), .my_account_left_column .list-group-item:has(a[href*="lgcookieslaw"]), .my_account_left_column div:has(> #lgcookieslaw-link), .my_account_left_column div:has(> a#lgcookieslaw-link), .my_account_left_column div:has(> a[href*="lgcookieslaw"]) { display: none !important; height: 0 !important; min-height: 0 !important; max-height: 0 !important; padding: 0 !important; margin: 0 !important; border: 0 !important; overflow: hidden !important; } /* Sécurité : si le module laisse un bloc vide stylé comme une ligne */ .my_account_left_column .list-group-item.fs-cookie-account-menu-item, .my_account_left_column .list-group-item.lgcookies, .my_account_left_column div.fs-cookie-account-menu-item, .my_account_left_column div.lgcookies { display: none !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important; border: 0 !important; } /* Cas extrême : masque l’avant-dernière ligne uniquement si elle est vide visuellement */ .my_account_left_column .list-group-item:has(a[href*="lgcookieslaw"]) + .list-group-item { border-top: 0 !important; } /* ===================================================== RESTAURATION MENU COMPTE CLIENT - APRÈS CONFLIT COOKIES ===================================================== */ .my_account_left_column, .col-lg-3.my_account_left_column { display: block !important; visibility: visible !important; opacity: 1 !important; } .my_account_left_column .list-group-item, .my_account_left_column div.list-group-item { display: block !important; visibility: visible !important; opacity: 1 !important; height: auto !important; min-height: 48px !important; max-height: none !important; padding: 0 !important; margin: 0 !important; border-bottom: 1px solid rgba(143,150,119,.16) !important; overflow: visible !important; } .my_account_left_column .list-group-item > a, .my_account_left_column a { display: flex !important; visibility: visible !important; opacity: 1 !important; width: 100% !important; min-height: 48px !important; padding: 12px 16px !important; align-items: center !important; gap: 10px !important; color: #3f4036 !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.25 !important; text-decoration: none !important; } /* ===================================================== FOLIES SECRÈTES - HEADER PREMIUM Recherche + compte client + icônes panier ===================================================== */ /* Icônes header : recherche / compte / panier */ #header .search_widget, #header .st_search_widget, #header .header_user_info, #header .userinfo_mod_top, #header .shopping_cart, #header .cart_block, #header .st_shopping_cart { font-size: 14px !important; } #header .search_widget a, #header .st_search_widget a, #header .header_user_info a, #header .userinfo_mod_top a, #header .shopping_cart a, #header .st_shopping_cart a { color: #2f3033 !important; text-decoration: none !important; transition: all 0.25s ease !important; } #header .search_widget a:hover, #header .st_search_widget a:hover, #header .header_user_info a:hover, #header .userinfo_mod_top a:hover, #header .shopping_cart a:hover, #header .st_shopping_cart a:hover { color: #7d8765 !important; } /* Texte "RECHERCHER" */ #header .search_widget, #header .st_search_widget { color: #3a3a3a !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: 0.02em !important; text-transform: uppercase !important; } #header .search_widget i, #header .st_search_widget i, #header .header_user_info i, #header .userinfo_mod_top i, #header .shopping_cart i, #header .st_shopping_cart i { color: #2f3033 !important; font-size: 16px !important; transition: all 0.25s ease !important; } #header .search_widget:hover i, #header .st_search_widget:hover i, #header .header_user_info:hover i, #header .userinfo_mod_top:hover i, #header .shopping_cart:hover i, #header .st_shopping_cart:hover i { color: #7d8765 !important; } /* ===================================================== MENU COMPTE PREMIUM ===================================================== */ #header .dropdown-menu, #header .userinfo_mod_top .dropdown-menu, #header .header_user_info .dropdown-menu, #header .st_user_info .dropdown-menu, #header .user-info .dropdown-menu { min-width: 220px !important; padding: 10px !important; margin-top: 14px !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; border-radius: 16px !important; background: rgba(255, 252, 247, 0.98) !important; box-shadow: 0 22px 48px rgba(45, 40, 32, 0.16) !important; overflow: hidden !important; } /* Petite pointe élégante au-dessus du menu */ #header .dropdown-menu::before, #header .userinfo_mod_top .dropdown-menu::before, #header .header_user_info .dropdown-menu::before { content: "" !important; position: absolute !important; top: -7px !important; right: 18px !important; width: 14px !important; height: 14px !important; background: #fffcf7 !important; border-left: 1px solid rgba(125, 135, 101, 0.14) !important; border-top: 1px solid rgba(125, 135, 101, 0.14) !important; transform: rotate(45deg) !important; } /* Liens du menu compte */ #header .dropdown-menu li, #header .userinfo_mod_top .dropdown-menu li, #header .header_user_info .dropdown-menu li { margin: 0 !important; padding: 0 !important; border: none !important; } #header .dropdown-menu a, #header .dropdown-menu span, #header .userinfo_mod_top .dropdown-menu a, #header .userinfo_mod_top .dropdown-menu span, #header .header_user_info .dropdown-menu a, #header .header_user_info .dropdown-menu span { display: block !important; padding: 11px 13px !important; border-radius: 10px !important; color: #383838 !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.25 !important; text-decoration: none !important; transition: all 0.22s ease !important; } /* Ligne du nom client */ #header .dropdown-menu li:first-child a, #header .dropdown-menu li:first-child span, #header .userinfo_mod_top .dropdown-menu li:first-child a, #header .userinfo_mod_top .dropdown-menu li:first-child span, #header .header_user_info .dropdown-menu li:first-child a, #header .header_user_info .dropdown-menu li:first-child span { background: #f1efe5 !important; color: #7d8765 !important; font-weight: 700 !important; margin-bottom: 6px !important; } /* Hover menu compte */ #header .dropdown-menu a:hover, #header .userinfo_mod_top .dropdown-menu a:hover, #header .header_user_info .dropdown-menu a:hover { background: #f5f2ea !important; color: #7d8765 !important; padding-left: 16px !important; } /* Déconnexion plus discrète */ #header .dropdown-menu li:last-child a, #header .userinfo_mod_top .dropdown-menu li:last-child a, #header .header_user_info .dropdown-menu li:last-child a { color: #6f6f6f !important; border-top: 1px solid rgba(125, 135, 101, 0.10) !important; margin-top: 6px !important; padding-top: 12px !important; } /* ===================================================== RECHERCHE PREMIUM ===================================================== */ /* Conteneur de recherche déroulant */ #header .search_widget form, #header .st_search_widget form, #header .searchbox, #header .search_widget .searchbox, #header .st_search_widget .searchbox { border: none !important; background: transparent !important; } /* Champ recherche */ #header .search_widget input[type="text"], #header .search_widget input[type="search"], #header .st_search_widget input[type="text"], #header .st_search_widget input[type="search"], #header input[name="s"], #header input[name="search_query"] { width: 285px !important; height: 44px !important; padding: 0 48px 0 18px !important; border: 1px solid rgba(125, 135, 101, 0.20) !important; border-radius: 999px !important; background: rgba(255, 252, 247, 0.98) !important; color: #2f3033 !important; font-size: 13px !important; box-shadow: 0 16px 34px rgba(45, 40, 32, 0.13) !important; outline: none !important; transition: all 0.25s ease !important; } #header .search_widget input[type="text"]:focus, #header .search_widget input[type="search"]:focus, #header .st_search_widget input[type="text"]:focus, #header .st_search_widget input[type="search"]:focus, #header input[name="s"]:focus, #header input[name="search_query"]:focus { border-color: rgba(125, 135, 101, 0.48) !important; box-shadow: 0 18px 42px rgba(45, 40, 32, 0.18) !important; } /* Placeholder */ #header .search_widget input::placeholder, #header .st_search_widget input::placeholder, #header input[name="s"]::placeholder, #header input[name="search_query"]::placeholder { color: #aaa49a !important; font-size: 13px !important; } /* Bouton loupe dans le champ */ #header .search_widget button, #header .st_search_widget button, #header .searchbox button { width: 40px !important; height: 40px !important; border: none !important; border-radius: 50% !important; background: transparent !important; color: #2f3033 !important; position: absolute !important; right: 4px !important; top: 2px !important; transition: all 0.25s ease !important; } #header .search_widget button:hover, #header .st_search_widget button:hover, #header .searchbox button:hover { color: #7d8765 !important; background: #f1efe5 !important; } /* Si le champ recherche apparaît en bloc sous le menu */ #header .search_widget form, #header .st_search_widget form { position: relative !important; margin-top: 10px !important; } /* ===================================================== PANIER / COMPTE : PETITE FINITION ===================================================== */ #header .header_user_info, #header .userinfo_mod_top, #header .shopping_cart, #header .st_shopping_cart { margin-left: 12px !important; } #header .header_user_info .dropdown-toggle, #header .userinfo_mod_top .dropdown-toggle { display: inline-flex !important; align-items: center !important; gap: 5px !important; } /* Flèche compte plus fine */ #header .dropdown-toggle::after { border-top-color: #9a927f !important; opacity: 0.75 !important; } /* ===================================================== VERSION MOBILE ===================================================== */ @media (max-width: 767px) { #header .search_widget input[type="text"], #header .search_widget input[type="search"], #header .st_search_widget input[type="text"], #header .st_search_widget input[type="search"], #header input[name="s"], #header input[name="search_query"] { width: 230px !important; } #header .dropdown-menu, #header .userinfo_mod_top .dropdown-menu, #header .header_user_info .dropdown-menu { min-width: 205px !important; right: 0 !important; } } /* ===================================================== FOLIES SECRÈTES - CORRECTIFS FINAUX CONSOLIDÉS Header + menu + barre flottante + page catégorie premium Version nettoyée intégrée au CSS complet ===================================================== */ /* ===================================================== A - HEADER DROIT PREMIUM : RECHERCHE / COMPTE / PANIER ===================================================== */ #header_right_top { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 10px !important; white-space: nowrap !important; } #header_right_top .search_widget_simple.stsearchbar_link, #header_right_top .userinfo_mod_top, #header_right_top .quick_login, #header_right_top #languages-block-top-mod, #header_right_top .languages-block, #header_right_top .blockcart { margin-left: 0 !important; position: relative !important; } #header_right_top .search_widget_simple.stsearchbar_link > .dropdown_tri, #header_right_top .userinfo_mod_top > .dropdown_tri, #header_right_top .quick_login > .dropdown_tri, #header_right_top #languages-block-top-mod > .dropdown_tri, #header_right_top .languages-block > .dropdown_tri, #header_right_top .blockcart > .st_shopping_cart { height: 40px !important; min-width: 40px !important; padding: 0 14px !important; border-radius: 999px !important; background: linear-gradient(135deg, #fffdf8 0%, #f5f2ea 100%) !important; border: 1px solid rgba(125,135,101,.20) !important; box-shadow: 0 8px 20px rgba(55,48,38,.055), inset 0 1px 0 rgba(255,255,255,.9) !important; color: #2f3033 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; text-decoration: none !important; transition: all .25s ease !important; overflow: visible !important; } #header_right_top .blockcart > .st_shopping_cart { width: 40px !important; padding: 0 !important; position: relative !important; } #header_right_top a.login.top_bar_item { height: 40px !important; min-width: 40px !important; padding: 0 14px !important; border-radius: 999px !important; background: linear-gradient(135deg, #fffdf8 0%, #f5f2ea 100%) !important; border: 1px solid rgba(125,135,101,.20) !important; box-shadow: 0 8px 20px rgba(55,48,38,.055), inset 0 1px 0 rgba(255,255,255,.9) !important; color: #2f3033 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; text-decoration: none !important; transition: all .25s ease !important; } #header_right_top a.login.top_bar_item > .header_item { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; } #header_right_top .search_widget_simple.stsearchbar_link:hover > .dropdown_tri, #header_right_top .userinfo_mod_top:hover > .dropdown_tri, #header_right_top .quick_login:hover > .dropdown_tri, #header_right_top #languages-block-top-mod:hover > .dropdown_tri, #header_right_top .languages-block:hover > .dropdown_tri, #header_right_top a.login.top_bar_item:hover, #header_right_top .blockcart:hover > .st_shopping_cart { background: linear-gradient(135deg, #f4f1e8 0%, #eae6d8 100%) !important; border-color: rgba(125,135,101,.30) !important; color: #6f7958 !important; transform: translateY(-1px) !important; box-shadow: 0 12px 28px rgba(55,48,38,.10), inset 0 1px 0 rgba(255,255,255,.9) !important; } #header_right_top .header_icon_btn_icon, #header_right_top .icon_btn, #header_right_top i { color: inherit !important; font-size: 15px !important; line-height: 1 !important; margin: 0 !important; } #header_right_top .header_icon_btn_text, #header_right_top .search_widget_simple .header_icon_btn_text, #header_right_top .quick_login .header_icon_btn_text, #header_right_top #languages-block-top-mod .dropdown_tri, #header_right_top .languages-block .dropdown_tri { color: #2e2e2e !important; font-size: 12.5px !important; font-weight: 600 !important; letter-spacing: 0.025em !important; text-transform: none !important; } #header_right_top #languages-block-top-mod .dropdown_tri img { margin-right: 4px !important; } #header_right_top .blockcart .header_icon_btn_text:not(.fs-cart-badge-header), #header_right_top .blockcart .cart_text { display: none !important; } #header_right_top .userinfo_mod_top .arrow, #header_right_top .userinfo_mod_top .fto-angle-down, #header_right_top .quick_login .arrow, #header_right_top .quick_login .fto-angle-down, #header_right_top #languages-block-top-mod .arrow, #header_right_top #languages-block-top-mod .fto-angle-down { color: #9a927f !important; font-size: 10px !important; margin-left: 2px !important; } #header_right_top .header_item { background: transparent !important; border: none !important; box-shadow: none !important; } /* Recherche déroulante */ #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list { width: 330px !important; min-width: 330px !important; padding: 12px !important; margin-top: 0 !important; top: 100% !important; padding-top: 10px !important; right: 0 !important; left: auto !important; border-radius: 20px !important; background: rgba(255,252,247,.99) !important; border: 1px solid rgba(125,135,101,.14) !important; box-shadow: 0 24px 54px rgba(45,40,32,.15), inset 0 1px 0 rgba(255,255,255,.9) !important; overflow: visible !important; pointer-events: auto !important; z-index: 200 !important; } /* Pont souris bouton → popup (évite fermeture au descente) */ #header_right_top .search_widget_simple.stsearchbar_link.open::after, #header_right_top .search_widget_simple.stsearchbar_link:hover::after { content: "" !important; position: absolute !important; left: 0 !important; right: 0 !important; top: 100% !important; height: 14px !important; width: 100% !important; background: transparent !important; pointer-events: auto !important; z-index: 199 !important; } #header_right_top .search_widget_simple.stsearchbar_link.open .dropdown_list, #header_right_top .search_widget_simple.stsearchbar_link:hover .dropdown_list { display: block !important; visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; } #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list::before, #header_right_top .userinfo_mod_top .dropdown_list::before { content: "" !important; position: absolute !important; top: 1px !important; right: 30px !important; width: 14px !important; height: 14px !important; background: #fffcf7 !important; border-left: 1px solid rgba(125,135,101,.14) !important; border-top: 1px solid rgba(125,135,101,.14) !important; transform: rotate(45deg) !important; box-shadow: none !important; } #header_right_top .userinfo_mod_top .dropdown_list::before { right: 22px !important; } #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list form, #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list .searchbox, #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list .input-group, #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list .input-group-btn, #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list .search_widget_form_inner { border: none !important; outline: none !important; background: transparent !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; position: relative !important; } #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list input, #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list input[type="text"], #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list input[type="search"], #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list input[name="search_query"] { width: 100% !important; height: 43px !important; border-radius: 999px !important; border: 1px solid rgba(125,135,101,.18) !important; outline: none !important; background: #fffefb !important; color: #2f3033 !important; font-size: 13px !important; padding: 0 48px 0 17px !important; box-shadow: inset 0 1px 2px rgba(0,0,0,.035) !important; } #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list input:focus { border-color: rgba(125,135,101,.48) !important; box-shadow: inset 0 1px 2px rgba(0,0,0,.03), 0 0 0 4px rgba(125,135,101,.08) !important; } #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list input::placeholder { color: #aaa49a !important; font-size: 13px !important; } #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list button { position: absolute !important; right: 6px !important; top: 1px !important; width: 40px !important; height: 40px !important; border: none !important; outline: none !important; border-radius: 50% !important; background: transparent !important; color: #6f7958 !important; box-shadow: none !important; transition: all .25s ease !important; } #header_right_top .search_widget_simple.stsearchbar_link .dropdown_list button:hover { background: #f1efe5 !important; } /* Menu compte */ #header_right_top .userinfo_mod_top .dropdown_list { width: 230px !important; min-width: 230px !important; padding: 11px !important; margin-top: 12px !important; right: 0 !important; left: auto !important; border-radius: 20px !important; background: rgba(255,252,247,.99) !important; border: 1px solid rgba(125,135,101,.14) !important; box-shadow: 0 24px 54px rgba(45,40,32,.15), inset 0 1px 0 rgba(255,255,255,.9) !important; overflow: visible !important; } #header_right_top .userinfo_mod_top .dropdown_list li { border: none !important; margin: 0 !important; padding: 0 !important; } #header_right_top .userinfo_mod_top .dropdown_list a, #header_right_top .userinfo_mod_top .dropdown_list span { display: block !important; border: none !important; box-shadow: none !important; border-radius: 11px !important; padding: 11px 13px !important; font-size: 13px !important; color: #333 !important; background: transparent !important; text-decoration: none !important; transition: all .22s ease !important; } #header_right_top .userinfo_mod_top .dropdown_list li:first-child a, #header_right_top .userinfo_mod_top .dropdown_list li:first-child span { text-transform: capitalize !important; border-radius: 13px !important; background: linear-gradient(135deg, #f0ede2 0%, #e4e0d0 100%) !important; color: #6f7958 !important; font-weight: 800 !important; margin-bottom: 5px !important; } #header_right_top .userinfo_mod_top .dropdown_list a:hover { background: #f4f1e9 !important; color: #6f7958 !important; padding-left: 16px !important; } #header_right_top .userinfo_mod_top .dropdown_list li:last-child a { border: none !important; margin-top: 7px !important; padding-top: 11px !important; background: rgba(244,241,233,.55) !important; color: #77736a !important; border-radius: 12px !important; } #header_right_top .userinfo_mod_top .dropdown_list li:last-child a:hover { background: #eeeadd !important; color: #6f7958 !important; } /* Pastille panier header : classe ajoutée dans stshoppingcart.tpl */ #header_right_top .blockcart > .st_shopping_cart, #header_right_top .blockcart .st_shopping_cart { position: relative !important; overflow: visible !important; } #header_right_top .blockcart .header_icon_btn_icon { position: static !important; overflow: visible !important; } #header_right_top .blockcart .fs-cart-badge-header, #header_right_top .blockcart .amount_circle.fs-cart-badge-header { display: inline-flex !important; position: absolute !important; top: -5px !important; right: -5px !important; min-width: 17px !important; height: 17px !important; padding: 0 5px !important; border-radius: 999px !important; background: #e74772 !important; color: #fff !important; font-size: 10px !important; font-weight: 800 !important; line-height: 17px !important; align-items: center !important; justify-content: center !important; z-index: 100 !important; box-shadow: 0 4px 10px rgba(231,71,114,.28) !important; transform: none !important; margin: 0 !important; } /* ===================================================== B - MENU PRINCIPAL PREMIUM ===================================================== */ #st_mega_menu_wrap, .st_mega_menu, .st_mega_menu_ul { display: flex !important; align-items: center !important; justify-content: center !important; } #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0, .st_mega_menu_ul > li.ml_level_0, #st_mega_menu_wrap li.ml_level_0 { margin: 0 7px !important; } #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0, .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0, #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0 { position: relative !important; display: inline-flex !important; align-items: center !important; min-height: 42px !important; padding: 0 1px !important; color: #4a4543 !important; font-size: 15px !important; font-weight: 500 !important; letter-spacing: 0.04em !important; text-transform: none !important; text-decoration: none !important; transition: color .25s ease !important; background: transparent !important; box-shadow: none !important; } #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0::after, .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0::after { content: "" !important; position: absolute !important; left: 50% !important; bottom: 2px !important; width: 0 !important; height: 1px !important; background: #c7a45a !important; transform: translateX(-50%) !important; transition: width .28s ease !important; opacity: .85 !important; } #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0:hover > a.ma_level_0, .st_mega_menu_ul > li.ml_level_0:hover > a.ma_level_0, #st_mega_menu_wrap li.ml_level_0:hover > a.ma_level_0 { color: #6f765c !important; transform: none !important; } #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0:hover > a.ma_level_0::after, .st_mega_menu_ul > li.ml_level_0:hover > a.ma_level_0::after, #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0.current > a.ma_level_0::after, #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0.active > a.ma_level_0::after, .st_mega_menu_ul > li.ml_level_0.current > a.ma_level_0::after, .st_mega_menu_ul > li.ml_level_0.active > a.ma_level_0::after { width: 24px !important; } #st_mega_menu_wrap a:hover, .st_mega_menu a:hover, #st_mega_menu_wrap li:hover > a, .st_mega_menu li:hover > a { background: transparent !important; box-shadow: none !important; } #st_mega_menu_wrap .stmenu_sub, .st_mega_menu .stmenu_sub, #st_mega_menu_wrap .dropdown-menu, .st_mega_menu .dropdown-menu { border-radius: 18px !important; border: 1px solid rgba(143,150,119,.16) !important; background: rgba(255,252,247,.98) !important; box-shadow: 0 24px 58px rgba(45,40,32,.15) !important; overflow: hidden !important; } #st_mega_menu_wrap .stmenu_sub a, .st_mega_menu .stmenu_sub a, #st_mega_menu_wrap .dropdown-menu a, .st_mega_menu .dropdown-menu a { color: #3f4036 !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: .02em !important; text-transform: none !important; padding: 10px 14px !important; border-radius: 10px !important; transition: all .22s ease !important; } #st_mega_menu_wrap .stmenu_sub a:hover, .st_mega_menu .stmenu_sub a:hover, #st_mega_menu_wrap .dropdown-menu a:hover, .st_mega_menu .dropdown-menu a:hover { background: #f3f1e8 !important; color: #6f765c !important; padding-left: 18px !important; } @media (max-width: 1450px) { #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0, .st_mega_menu_ul > li.ml_level_0, #st_mega_menu_wrap li.ml_level_0 { margin: 0 5px !important; } #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0, .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0, #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0 { font-size: 14px !important; font-weight: 500 !important; color: #4a4543 !important; letter-spacing: 0.035em !important; } } /* B — adoucissement desktop : priorité sur correctif header 01b (≥992px) */ @media (min-width: 992px) and (max-width: 1199px) { html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0, html body #header_center #st_mega_menu_wrap li.ml_level_0 { margin: 0 5px !important; } html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0, html body #header_center #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0 { font-size: 13px !important; font-weight: 500 !important; color: #4a4543 !important; letter-spacing: 0.035em !important; text-transform: none !important; } } @media (min-width: 1200px) and (max-width: 1440px) { html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0, html body #header_center #st_mega_menu_wrap li.ml_level_0 { margin: 0 5px !important; } html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0, html body #header_center #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0 { font-size: 14px !important; font-weight: 500 !important; color: #4a4543 !important; letter-spacing: 0.035em !important; text-transform: none !important; } } @media (min-width: 1441px) { html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0, html body #header_center #st_mega_menu_wrap li.ml_level_0 { margin: 0 7px !important; } html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0, html body #header_center #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0 { font-size: 15px !important; font-weight: 500 !important; color: #4a4543 !important; letter-spacing: 0.04em !important; text-transform: none !important; } } /* B — hover premium desktop : priorité adoucissement (≥992px) */ @media (min-width: 992px) { html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0, html body #header_center #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0 { position: relative !important; transition: color .25s ease !important; } html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0 > a.ma_level_0::after, html body #header_center #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0::after { content: "" !important; position: absolute !important; left: 50% !important; bottom: 2px !important; width: 0 !important; height: 1px !important; background: #c7a45a !important; transform: translateX(-50%) !important; transition: width .25s ease, opacity .25s ease !important; opacity: .85 !important; pointer-events: none !important; } html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0:hover > a.ma_level_0, html body #header_center #st_mega_menu_wrap li.ml_level_0:hover > a.ma_level_0, html body #header_center #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0:hover { color: #6f765c !important; transform: none !important; background: transparent !important; box-shadow: none !important; } html body #header_center #st_mega_menu_wrap .st_mega_menu_ul > li.ml_level_0:hover > a.ma_level_0::after, html body #header_center #st_mega_menu_wrap li.ml_level_0:hover > a.ma_level_0::after, html body #header_center #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0:hover::after { width: 24px !important; } } /* B1 - Drawer mobile menu premium */ #side_stmobilemenu.st-menu, #side_stmobilemenu .st-menu-header { background: #fffdf8 !important; border-right: 1px solid rgba(143, 150, 119, 0.14) !important; } #side_stmobilemenu .st-menu-title { color: #2e2e2e !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; } #side_stmobilemenu .close_right_side, #side_stmobilemenu .close_right_side i { color: #6f765c !important; } #side_stmobilemenu #st_mobile_menu, #side_stmobilemenu .stmobilemenu_box { background: #fffdf8 !important; } #side_stmobilemenu #st_mobile_menu a.mo_ma_level_0, #side_stmobilemenu .stmobilemenu_box a.mo_ma_level_0 { display: block !important; padding: 14px 20px !important; min-height: 48px !important; line-height: 1.35 !important; color: #2e2e2e !important; font-size: 15px !important; font-weight: 500 !important; letter-spacing: 0.02em !important; text-transform: none !important; text-decoration: none !important; background: transparent !important; border-bottom: 1px solid rgba(143, 150, 119, 0.12) !important; transition: color .22s ease, background .22s ease !important; } #side_stmobilemenu #st_mobile_menu li:last-child > a.mo_ma_level_0, #side_stmobilemenu .stmobilemenu_box li:last-child > a.mo_ma_level_0 { border-bottom: none !important; } #side_stmobilemenu #st_mobile_menu a.mo_ma_level_0:hover, #side_stmobilemenu #st_mobile_menu a.mo_ma_level_0:focus, #side_stmobilemenu .stmobilemenu_box a.mo_ma_level_0:hover, #side_stmobilemenu .stmobilemenu_box a.mo_ma_level_0:focus { color: #6f765c !important; background: #f3f1e8 !important; } /* ===================================================== C - BARRE FLOTTANTE DROITE PREMIUM ===================================================== */ #rightbar, .rightbar, .st_sticky_right, .st_sticky_rightbar, .st_sticky_right_bar, .fixed-right, .stsocial_list_fixed { position: fixed !important; right: 16px !important; top: auto !important; bottom: 26px !important; z-index: 9999 !important; width: 46px !important; padding: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; } #rightbar li, #rightbar .rightbar_item, #rightbar .rightbar_wrap, #rightbar .rightbar_tri, #rightbar a, .rightbar li, .rightbar .rightbar_item, .rightbar .rightbar_wrap, .rightbar .rightbar_tri, .rightbar a { width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; max-width: 44px !important; max-height: 44px !important; margin: 0 0 10px 0 !important; padding: 0 !important; border-radius: 50% !important; background: transparent !important; border: none !important; box-shadow: none !important; overflow: visible !important; display: flex !important; align-items: center !important; justify-content: center !important; position: relative !important; } #rightbar .rightbar_tri, #rightbar a.rightbar_tri, #rightbar .rightbar_item > a, #rightbar .rightbar_wrap > a, .rightbar .rightbar_tri, .rightbar a.rightbar_tri, .rightbar .rightbar_item > a, .rightbar .rightbar_wrap > a { background: rgba(255,252,247,.94) !important; border: 1px solid rgba(125,135,101,.18) !important; box-shadow: 0 12px 28px rgba(45,40,32,.12), inset 0 1px 0 rgba(255,255,255,.9) !important; color: #2f3033 !important; transition: all .28s ease !important; } #rightbar .rightbar_tri:hover, #rightbar a.rightbar_tri:hover, #rightbar .rightbar_item > a:hover, #rightbar .rightbar_wrap > a:hover, .rightbar .rightbar_tri:hover, .rightbar a.rightbar_tri:hover, .rightbar .rightbar_item > a:hover, .rightbar .rightbar_wrap > a:hover { background: linear-gradient(135deg, #f4f1e8 0%, #eae6d8 100%) !important; border-color: rgba(125,135,101,.30) !important; color: #6f7958 !important; transform: translateX(-3px) !important; box-shadow: 0 16px 36px rgba(45,40,32,.18), inset 0 1px 0 rgba(255,255,255,.95) !important; } #rightbar i, #rightbar .icon_btn, #rightbar .fto-glyph, .rightbar i, .rightbar .icon_btn, .rightbar .fto-glyph { font-size: 17px !important; color: inherit !important; line-height: 1 !important; margin: 0 !important; padding: 0 !important; } #rightbar span:not(.ajax_cart_quantity):not(.cart-products-count):not(.cart_num):not(.fs-cart-badge-header), #rightbar .rightbar_text, #rightbar .rightbar_name, #rightbar em, .rightbar span:not(.ajax_cart_quantity):not(.cart-products-count):not(.cart_num):not(.fs-cart-badge-header), .rightbar .rightbar_text, .rightbar .rightbar_name, .rightbar em { display: none !important; } #rightbar .ajax_cart_quantity, #rightbar .cart-products-count, #rightbar .cart_num, #rightbar .fs-cart-badge-header, .rightbar .ajax_cart_quantity, .rightbar .cart-products-count, .rightbar .cart_num, .rightbar .fs-cart-badge-header { display: inline-flex !important; position: absolute !important; top: -5px !important; right: -5px !important; min-width: 17px !important; height: 17px !important; padding: 0 5px !important; border-radius: 999px !important; background: #e74772 !important; color: #fff !important; font-size: 10px !important; font-weight: 800 !important; line-height: 17px !important; align-items: center !important; justify-content: center !important; text-align: center !important; z-index: 5 !important; box-shadow: 0 4px 10px rgba(231,71,114,.25) !important; } @media (max-width: 768px) { #rightbar, .rightbar, .st_right_bar, .st_rightbar, .st_sticky_right, .mobile_bar_bottom, .mobile-bar-bottom { display: none !important; } } /* ===================================================== /* ===================================================== FOLIES SECRÈTES - CORRECTIF SAFE CATÉGORIE V4 Rollback du ciblage trop large V3 + premium prudent ===================================================== */ /* 01 - Header : menu centré sans décaler les icônes */ @media (min-width: 992px) { #st_header #header_primary_row, #header_primary_row, #header_primary_row.flex_container, #header_primary_row.flex_container.logo_left { display: grid !important; grid-template-columns: 260px minmax(0, 1fr) 260px !important; align-items: center !important; column-gap: 24px !important; width: 100% !important; max-width: none !important; } #st_header #header_left, #header_left { grid-column: 1 !important; justify-self: start !important; max-width: 260px !important; margin: 0 !important; flex: none !important; } #st_header #header_center, #header_center { grid-column: 2 !important; justify-self: center !important; width: auto !important; max-width: 100% !important; margin: 0 auto !important; flex: none !important; display: flex !important; justify-content: center !important; } #st_header #header_right, #header_right { grid-column: 3 !important; justify-self: end !important; max-width: 260px !important; margin: 0 !important; flex: none !important; display: flex !important; justify-content: flex-end !important; } } /* 01b - Header medium (992–1440px) : anti-chevauchement logo / menu / utilitaires */ @media (min-width: 992px) and (max-width: 1440px) { #st_header #header_primary_row, #header_primary_row, #header_primary_row.flex_container, #header_primary_row.flex_container.logo_left { grid-template-columns: minmax(0, 188px) minmax(0, 1fr) minmax(0, 248px) !important; column-gap: 10px !important; } #st_header #header_left, #header_left { max-width: 188px !important; min-width: 0 !important; } #st_header #header_center, #header_center { min-width: 0 !important; max-width: 100% !important; overflow: visible !important; } #header_center > .header_box, #header_center .flex_container.header_box { display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; min-width: 0 !important; width: 100% !important; max-width: 100% !important; } #header_center #st_mega_menu_wrap, #header_center .st_mega_menu_container, #header_center #st_mega_menu_header_container { flex: 1 1 auto !important; min-width: 0 !important; max-width: 100% !important; overflow: visible !important; } #header_center #currencies_block_top_mod, #header_center .currencies-block { flex: 0 0 auto !important; margin: 0 !important; } #header_center #currencies_block_top_mod .header_item, #header_center #currencies_block_top_mod .dropdown_tri { font-size: 11px !important; padding: 0 6px !important; min-height: 32px !important; } #st_mega_menu_wrap ul.st_mega_menu, #st_mega_menu_wrap .st_mega_menu { gap: 0 !important; min-width: 0 !important; } #st_mega_menu_wrap li.ml_level_0 { margin: 0 !important; padding: 0 !important; } #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0 { font-size: 14px !important; font-weight: 600 !important; letter-spacing: 0.025em !important; padding: 0 1px !important; min-height: 40px !important; } #st_header #header_right, #header_right { max-width: 248px !important; min-width: 0 !important; } #header_right_top { gap: 6px !important; } #header_right_top .search_widget_simple .header_icon_btn_text { display: none !important; } #header_right_top .search_widget_simple.stsearchbar_link > .dropdown_tri { min-width: 34px !important; width: 34px !important; padding: 0 !important; } #header_right_top .userinfo_mod_top > .dropdown_tri { min-width: 34px !important; width: 34px !important; padding: 0 !important; } #header_right_top .userinfo_mod_top .header_icon_btn_text { display: none !important; } #header_primary_container, #header_primary_row { min-height: 88px !important; } } @media (min-width: 992px) and (max-width: 1199px) { #st_header #header_primary_row, #header_primary_row, #header_primary_row.flex_container, #header_primary_row.flex_container.logo_left { grid-template-columns: minmax(0, 158px) minmax(0, 1fr) minmax(0, 218px) !important; column-gap: 6px !important; } #st_header #header_left, #header_left { max-width: 158px !important; } #st_header #header_right, #header_right { max-width: 218px !important; } #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0 { font-size: 13px !important; font-weight: 600 !important; padding: 0 1px !important; letter-spacing: 0.02em !important; } #header_right_top #languages-block-top-mod, #header_right_top .language_selector { display: none !important; } #header_center #currencies_block_top_mod .dropdown_tri .header_item { font-size: 10px !important; } } @media (min-width: 992px) and (max-width: 1100px) { #header_center > .header_box, #header_center .flex_container.header_box { flex-wrap: wrap !important; row-gap: 4px !important; align-content: center !important; } #header_center #st_mega_menu_wrap, #header_center .st_mega_menu_container { flex: 1 1 100% !important; width: 100% !important; max-width: 100% !important; justify-content: center !important; } #header_center #currencies_block_top_mod { flex: 0 0 auto !important; margin: 0 auto !important; order: 2 !important; } #st_mega_menu_wrap li.ml_level_0 > a.ma_level_0 { font-size: 13px !important; font-weight: 600 !important; padding: 0 1px !important; letter-spacing: 0.02em !important; } } @media (min-width: 1441px) { #st_header #header_primary_row, #header_primary_row, #header_primary_row.flex_container, #header_primary_row.flex_container.logo_left { grid-template-columns: 280px minmax(0, 1fr) 280px !important; column-gap: 24px !important; } #st_header #header_left, #header_left { max-width: 280px !important; } #st_header #header_right, #header_right { max-width: 280px !important; } } #header_center #st_mega_menu_wrap, #header_center .st_mega_menu, #header_center .st_mega_menu_ul, #st_mega_menu_wrap, .st_mega_menu, .st_mega_menu_ul { justify-content: center !important; } /* 02 - Catégorie : suppression du doublon UniversUnivers */ body#category #left-column .title_block::before, body#category #left-column .title_block_inner::before, body#category #left-column .block-title::before, body#category #left-column .block_title::before, body#category #left-column h4::before, body#category #left-column .title_block::after, body#category #left-column .title_block_inner::after, body#category #left-column .block-title::after, body#category #left-column .block_title::after, body#category #left-column h4::after { content: none !important; display: none !important; } body#category #left-column .title_block, body#category #left-column .title_block_inner, body#category #left-column .block-title, body#category #left-column .block_title, body#category #left-column h4 { font-size: 0 !important; line-height: 0 !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; color: transparent !important; overflow: hidden !important; } body#category #left-column .block-categories { position: relative !important; padding-top: 82px !important; } body#category #left-column .block-categories::before { content: "Univers" !important; position: absolute !important; top: 28px !important; left: 24px !important; display: block !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 24px !important; line-height: 1.15 !important; font-weight: 400 !important; color: #2b2b2b !important; letter-spacing: -0.02em !important; } body#category #left-column .block-categories::after { content: "" !important; position: absolute !important; top: 60px !important; left: 24px !important; width: 36px !important; height: 1px !important; background: linear-gradient(90deg, #8f9677, #c7a45a) !important; } /* 03 - Sidebar stable */ body#category #left-column { padding-right: 32px !important; } body#category #left-column .block, body#category #left-column .block-categories, body#category #search_filters { background: #ffffff !important; border: 1px solid rgba(143,150,119,.16) !important; border-radius: 24px !important; box-shadow: 0 20px 52px rgba(70,65,55,.075) !important; overflow: hidden !important; } body#category #left-column .block-categories, body#category #search_filters { padding-left: 24px !important; padding-right: 24px !important; padding-bottom: 24px !important; } body#category #left-column ul, body#category #left-column .category-sub-menu, body#category #left-column .category-top-menu { margin: 0 !important; padding: 0 !important; } body#category #left-column li { margin: 0 !important; padding: 0 !important; border-bottom: 1px solid rgba(143,150,119,.11) !important; } body#category #left-column li:last-child { border-bottom: none !important; } body#category #left-column a { min-height: 44px !important; display: flex !important; align-items: center !important; color: #3f4036 !important; font-size: 13px !important; font-weight: 500 !important; text-decoration: none !important; transition: all .22s ease !important; } body#category #left-column a:hover { color: #6f765c !important; padding-left: 5px !important; } /* 04 - Tri compact */ body#category #js-product-list-top, body#category .products-selection, body#category .product_list_top { background: #ffffff !important; border: 1px solid rgba(143,150,119,.13) !important; border-radius: 999px !important; padding: 12px 18px !important; margin-bottom: 34px !important; box-shadow: 0 16px 40px rgba(70,65,55,.06) !important; } body#category .products-sort-order .select-title, body#category .products-sort-order button, body#category .products-sort-order .dropdown-toggle { min-height: 36px !important; border-radius: 999px !important; border: 1px solid rgba(143,150,119,.15) !important; background: #fbfaf6 !important; color: #2f3033 !important; font-size: 13px !important; padding: 0 18px !important; } /* 05 - Cartes produits : premium léger, sans forcer la grille */ body#category .product-miniature, body#category .ajax_block_product { margin-bottom: 42px !important; } body#category .product-miniature .thumbnail-container, body#category .ajax_block_product .pro_outer_box, body#category .pro_outer_box { background: linear-gradient(180deg, #ffffff 0%, #fffdf9 100%) !important; border: 1px solid rgba(143,150,119,.14) !important; border-radius: 24px !important; overflow: hidden !important; box-shadow: 0 18px 48px rgba(70,65,55,.075) !important; transition: transform .32s ease, box-shadow .32s ease, border-color .32s ease !important; } body#category .product-miniature:hover .thumbnail-container, body#category .ajax_block_product:hover .pro_outer_box, body#category .pro_outer_box:hover { transform: translateY(-6px) !important; border-color: rgba(143,150,119,.28) !important; box-shadow: 0 28px 68px rgba(70,65,55,.13) !important; } body#category .product-thumbnail, body#category .pro_first_box, body#category .product_img_link { background: radial-gradient(circle at center, rgba(238,240,230,.50), transparent 62%), #ffffff !important; overflow: hidden !important; } body#category .product-thumbnail img, body#category .pro_first_box img, body#category .product_img_link img, body#category .product-miniature img { transition: transform .38s ease, filter .32s ease !important; } body#category .product-miniature:hover img, body#category .ajax_block_product:hover img, body#category .pro_outer_box:hover img { transform: scale(1.035) !important; filter: brightness(.985) contrast(1.02) !important; } body#category .product-title, body#category .product-title a, body#category .s_title_block, body#category .s_title_block a, body#category .product-name, body#category .product-name a { color: #2b2b2b !important; font-size: 13.5px !important; line-height: 1.38 !important; font-weight: 500 !important; text-transform: none !important; text-decoration: none !important; } body#category .product-price-and-shipping, body#category .price, body#category .product-price, body#category .current-price { color: #2b2b2b !important; font-size: 17px !important; font-weight: 700 !important; letter-spacing: .01em !important; } @media (max-width: 991px) { body#category #left-column { padding-right: 0 !important; margin-bottom: 26px !important; } } /* ===================================================== FOLIES SECRÈTES - HERO CATÉGORIE PREMIUM V2 SAFE À ajouter tout en bas du CSS personnalisé Ne touche pas à la grille produits Panda ===================================================== */ /* Masque uniquement l'ancien titre/image/description natif du haut. Le bas de page SEO reste intact. */ body#category .category_page_heading, body#category .category-cover, body#category #category-description { display: none !important; } /* Bandeau premium catégorie */ body#category .fs-cat-hero-v2 { position: relative !important; overflow: hidden !important; margin: 0 0 30px 0 !important; min-height: 250px !important; padding: 48px 58px !important; border-radius: 28px !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; background: radial-gradient(circle at 88% 25%, rgba(255,255,255,0.62), transparent 33%), linear-gradient(120deg, #fbfaf6 0%, #f1ecdf 52%, #ded5c2 100%) !important; box-shadow: 0 24px 64px rgba(70, 65, 55, 0.10), inset 0 1px 0 rgba(255,255,255,0.78) !important; } /* Si une image catégorie est renseignée dans PrestaShop */ body#category .fs-cat-hero-v2--with-image::before { content: "" !important; position: absolute !important; inset: 0 !important; background-image: linear-gradient(90deg, rgba(251,250,246,0.98) 0%, rgba(251,250,246,0.90) 38%, rgba(251,250,246,0.36) 72%, rgba(251,250,246,0.18) 100%), var(--fs-cat-hero-image) !important; background-size: cover !important; background-position: center right !important; opacity: 1 !important; z-index: 0 !important; } body#category .fs-cat-hero-v2::after { content: "" !important; position: absolute !important; right: 0 !important; top: 0 !important; width: 42% !important; height: 100% !important; background: radial-gradient(circle at 70% 32%, rgba(199,164,90,0.16), transparent 34%), radial-gradient(circle at 85% 78%, rgba(125,135,101,0.13), transparent 32%) !important; z-index: 1 !important; pointer-events: none !important; } body#category .fs-cat-hero-v2__content { position: relative !important; z-index: 2 !important; max-width: 610px !important; } body#category .fs-cat-hero-v2__kicker { margin: 0 0 16px 0 !important; color: #7d8765 !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.30em !important; text-transform: uppercase !important; } body#category .fs-cat-hero-v2__kicker::after { content: "" !important; display: inline-block !important; vertical-align: middle !important; width: 42px !important; height: 1px !important; margin-left: 16px !important; background: #c7a45a !important; } body#category .fs-cat-hero-v2__title { margin: 0 0 16px 0 !important; max-width: 520px !important; color: #2d2d2d !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(38px, 3.6vw, 58px) !important; line-height: 1.02 !important; font-weight: 400 !important; letter-spacing: -0.045em !important; text-transform: none !important; } body#category .fs-cat-hero-v2__intro { margin: 0 !important; max-width: 540px !important; color: #4f4d46 !important; font-size: 15.5px !important; line-height: 1.72 !important; font-weight: 400 !important; } body#category .fs-cat-hero-v2__decor { position: absolute !important; z-index: 2 !important; right: 22% !important; bottom: 36px !important; color: rgba(199,164,90,0.80) !important; font-size: 54px !important; line-height: 1 !important; transform: rotate(-8deg) !important; pointer-events: none !important; } /* Mobile */ @media (max-width: 991px) { body#category .fs-cat-hero-v2 { min-height: 210px !important; padding: 38px 32px !important; border-radius: 24px !important; } body#category .fs-cat-hero-v2--with-image::before { background-image: linear-gradient(90deg, rgba(251,250,246,0.98) 0%, rgba(251,250,246,0.88) 100%), var(--fs-cat-hero-image) !important; } body#category .fs-cat-hero-v2__decor { display: none !important; } } @media (max-width: 575px) { body#category .fs-cat-hero-v2 { margin-bottom: 22px !important; padding: 32px 24px !important; } body#category .fs-cat-hero-v2__title { font-size: 34px !important; } body#category .fs-cat-hero-v2__intro { font-size: 14px !important; } } /* ===================================================== FOLIES SECRÈTES - SIDEBAR CATÉGORIE PREMIUM V1 SAFE Colonne gauche uniquement ===================================================== */ /* Titre ACCUEIL -> UNIVERS */ body#category #left-column .title_block, body#category #left-column .block-title, body#category #left-column h4 { font-size: 0 !important; color: transparent !important; margin-bottom: 22px !important; } body#category #left-column .title_block::before, body#category #left-column .block-title::before, body#category #left-column h4::before { content: "UNIVERS" !important; display: inline-block !important; color: #2d2d2d !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; } body#category #left-column .title_block::after, body#category #left-column .block-title::after, body#category #left-column h4::after { content: "" !important; display: inline-block !important; width: 44px !important; height: 1px !important; margin-left: 18px !important; vertical-align: middle !important; background: #c7a45a !important; } /* Carte catégories */ body#category #left-column .block-categories, body#category #left-column .category-top-menu { background: rgba(255, 255, 255, 0.96) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; border-radius: 24px !important; padding: 26px 22px !important; box-shadow: 0 22px 58px rgba(70, 65, 55, 0.09), inset 0 1px 0 rgba(255,255,255,0.85) !important; } /* Liens catégories */ body#category #left-column .block-categories li, body#category #left-column .category-top-menu li { border-bottom: 1px solid rgba(125, 135, 101, 0.11) !important; } body#category #left-column .block-categories li:last-child, body#category #left-column .category-top-menu li:last-child { border-bottom: none !important; } body#category #left-column .block-categories a, body#category #left-column .category-top-menu a { min-height: 42px !important; display: flex !important; align-items: center !important; color: #333333 !important; font-size: 13px !important; font-weight: 500 !important; text-decoration: none !important; transition: all 0.22s ease !important; } body#category #left-column .block-categories a:hover, body#category #left-column .category-top-menu a:hover { color: #7d8765 !important; padding-left: 5px !important; } /* Catégorie active */ body#category #left-column .block-categories .current > a, body#category #left-column .block-categories .active > a, body#category #left-column .category-top-menu .current > a, body#category #left-column .category-top-menu .active > a { color: #8f7650 !important; font-weight: 700 !important; } /* Icônes + plus */ body#category #left-column .navbar-toggler, body#category #left-column .collapse-icons, body#category #left-column .add, body#category #left-column .remove { color: #7d8765 !important; font-weight: 400 !important; } /* Bloc conseil sous la colonne */ body#category #left-column::after { content: "BESOIN DE CONSEIL ?\A Notre équipe vous répond en toute discrétion.\A\A NOUS CONTACTER" !important; display: block !important; margin-top: 24px !important; padding: 26px 24px !important; border-radius: 22px !important; background: radial-gradient(circle at 16% 24%, rgba(255,255,255,0.92), transparent 36%), #f1efe5 !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; box-shadow: 0 18px 46px rgba(70, 65, 55, 0.08) !important; white-space: pre-line !important; color: #4f4b43 !important; font-size: 13px !important; line-height: 1.55 !important; font-weight: 500 !important; } /* Le faux bouton "NOUS CONTACTER" dans le bloc texte */ body#category #left-column::after { letter-spacing: 0 !important; } /* Responsive */ @media (max-width: 991px) { body#category #left-column::after { margin-bottom: 28px !important; } } /* ===================================================== FOLIES SECRÈTES - SIDEBAR CATÉGORIE PREMIUM V2 Ciblage Panda large : #left-column + #left_column ===================================================== */ /* Remplacer visuellement ACCUEIL par UNIVERS */ body#category #left-column h4, body#category #left-column .title_block, body#category #left-column .title_block_inner, body#category #left-column .block-title, body#category #left_column h4, body#category #left_column .title_block, body#category #left_column .title_block_inner, body#category #left_column .block-title, #left-column h4, #left-column .title_block, #left-column .title_block_inner, #left-column .block-title, #left_column h4, #left_column .title_block, #left_column .title_block_inner, #left_column .block-title { font-size: 0 !important; line-height: 1 !important; color: transparent !important; margin-bottom: 22px !important; padding: 0 !important; } body#category #left-column h4::before, body#category #left-column .title_block::before, body#category #left-column .title_block_inner::before, body#category #left-column .block-title::before, body#category #left_column h4::before, body#category #left_column .title_block::before, body#category #left_column .title_block_inner::before, body#category #left_column .block-title::before, #left-column h4::before, #left-column .title_block::before, #left-column .title_block_inner::before, #left-column .block-title::before, #left_column h4::before, #left_column .title_block::before, #left_column .title_block_inner::before, #left_column .block-title::before { content: "UNIVERS" !important; display: inline-block !important; color: #2d2d2d !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; } body#category #left-column h4::after, body#category #left-column .title_block::after, body#category #left-column .title_block_inner::after, body#category #left-column .block-title::after, body#category #left_column h4::after, body#category #left_column .title_block::after, body#category #left_column .title_block_inner::after, body#category #left_column .block-title::after, #left-column h4::after, #left-column .title_block::after, #left-column .title_block_inner::after, #left-column .block-title::after, #left_column h4::after, #left_column .title_block::after, #left_column .title_block_inner::after, #left_column .block-title::after { content: "" !important; display: inline-block !important; width: 44px !important; height: 1px !important; margin-left: 18px !important; vertical-align: middle !important; background: #c7a45a !important; } /* Carte catégories Panda */ body#category #left-column .block, body#category #left-column .block-categories, body#category #left-column .category-top-menu, body#category #left_column .block, body#category #left_column .block-categories, body#category #left_column .category-top-menu, #left-column .block, #left-column .block-categories, #left-column .category-top-menu, #left_column .block, #left_column .block-categories, #left_column .category-top-menu { background: rgba(255, 255, 255, 0.96) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; border-radius: 24px !important; padding: 26px 22px !important; box-shadow: 0 22px 58px rgba(70, 65, 55, 0.09), inset 0 1px 0 rgba(255,255,255,0.85) !important; } /* Liens de catégories */ body#category #left-column .block a, body#category #left-column .block-categories a, body#category #left-column .category-top-menu a, body#category #left_column .block a, body#category #left_column .block-categories a, body#category #left_column .category-top-menu a, #left-column .block a, #left-column .block-categories a, #left-column .category-top-menu a, #left_column .block a, #left_column .block-categories a, #left_column .category-top-menu a { min-height: 42px !important; display: flex !important; align-items: center !important; color: #333333 !important; font-size: 13px !important; font-weight: 500 !important; text-decoration: none !important; transition: all 0.22s ease !important; } body#category #left-column .block a:hover, body#category #left-column .block-categories a:hover, body#category #left-column .category-top-menu a:hover, body#category #left_column .block a:hover, body#category #left_column .block-categories a:hover, body#category #left_column .category-top-menu a:hover, #left-column .block a:hover, #left-column .block-categories a:hover, #left-column .category-top-menu a:hover, #left_column .block a:hover, #left_column .block-categories a:hover, #left_column .category-top-menu a:hover { color: #7d8765 !important; padding-left: 5px !important; } /* Séparateurs */ body#category #left-column li, body#category #left_column li, #left-column li, #left_column li { border-bottom: 1px solid rgba(125, 135, 101, 0.11) !important; } body#category #left-column li:last-child, body#category #left_column li:last-child, #left-column li:last-child, #left_column li:last-child { border-bottom: none !important; } /* Bloc conseil sous sidebar */ body#category #left-column::after, body#category #left_column::after, #left-column::after, #left_column::after { content: "BESOIN DE CONSEIL ?\A Notre équipe vous répond en toute discrétion.\A\A NOUS CONTACTER" !important; display: block !important; margin-top: 24px !important; padding: 26px 24px !important; border-radius: 22px !important; background: radial-gradient(circle at 16% 24%, rgba(255,255,255,0.92), transparent 36%), #f1efe5 !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; box-shadow: 0 18px 46px rgba(70, 65, 55, 0.08) !important; white-space: pre-line !important; color: #4f4b43 !important; font-size: 13px !important; line-height: 1.55 !important; font-weight: 500 !important; } /* ===================================================== FOLIES SECRÈTES - CORRECTION SIDEBAR UNIVERS Supprime UNIVERS doublé + ancien ACCUEIL ===================================================== */ /* 1. On neutralise tous les faux titres ajoutés auparavant */ body#category #left-column h1::before, body#category #left-column h2::before, body#category #left-column h3::before, body#category #left-column h4::before, body#category #left-column .title_block::before, body#category #left-column .title_block_inner::before, body#category #left-column .block-title::before, body#category #left_column h1::before, body#category #left_column h2::before, body#category #left_column h3::before, body#category #left_column h4::before, body#category #left_column .title_block::before, body#category #left_column .title_block_inner::before, body#category #left_column .block-title::before, #left-column h1::before, #left-column h2::before, #left-column h3::before, #left-column h4::before, #left-column .title_block::before, #left-column .title_block_inner::before, #left-column .block-title::before, #left_column h1::before, #left_column h2::before, #left_column h3::before, #left_column h4::before, #left_column .title_block::before, #left_column .title_block_inner::before, #left_column .block-title::before, body#category #left-column h1::after, body#category #left-column h2::after, body#category #left-column h3::after, body#category #left-column h4::after, body#category #left-column .title_block::after, body#category #left-column .title_block_inner::after, body#category #left-column .block-title::after, body#category #left_column h1::after, body#category #left_column h2::after, body#category #left_column h3::after, body#category #left_column h4::after, body#category #left_column .title_block::after, body#category #left_column .title_block_inner::after, body#category #left_column .block-title::after, #left-column h1::after, #left-column h2::after, #left-column h3::after, #left-column h4::after, #left-column .title_block::after, #left-column .title_block_inner::after, #left-column .block-title::after, #left_column h1::after, #left_column h2::after, #left_column h3::after, #left_column h4::after, #left_column .title_block::after, #left_column .title_block_inner::after, #left_column .block-title::after { content: none !important; display: none !important; } /* 2. On masque vraiment l'ancien titre ACCUEIL */ body#category #left-column h1, body#category #left-column h2, body#category #left-column h3, body#category #left-column h4, body#category #left-column .title_block, body#category #left-column .title_block_inner, body#category #left-column .block-title, body#category #left_column h1, body#category #left_column h2, body#category #left_column h3, body#category #left_column h4, body#category #left_column .title_block, body#category #left_column .title_block_inner, body#category #left_column .block-title { display: none !important; } /* 3. La carte catégories devient le seul endroit qui affiche UNIVERS */ body#category #left-column .block-categories, body#category #left-column .category-top-menu, body#category #left_column .block-categories, body#category #left_column .category-top-menu { position: relative !important; padding-top: 82px !important; } /* 4. Titre unique UNIVERS */ body#category #left-column .block-categories::before, body#category #left-column .category-top-menu::before, body#category #left_column .block-categories::before, body#category #left_column .category-top-menu::before { content: "UNIVERS" !important; position: absolute !important; top: 32px !important; left: 28px !important; display: block !important; color: #2d2d2d !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; } /* 5. Petit trait doré à côté du titre */ body#category #left-column .block-categories::after, body#category #left-column .category-top-menu::after, body#category #left_column .block-categories::after, body#category #left_column .category-top-menu::after { content: "" !important; position: absolute !important; top: 41px !important; left: 142px !important; width: 44px !important; height: 1px !important; display: block !important; background: #c7a45a !important; } /* 6. Le bloc conseil reste propre */ body#category #left-column::after, body#category #left_column::after { content: "BESOIN DE CONSEIL ?\A Notre équipe vous répond en toute discrétion.\A\A NOUS CONTACTER" !important; display: block !important; margin-top: 24px !important; padding: 26px 24px !important; border-radius: 22px !important; background: radial-gradient(circle at 16% 24%, rgba(255,255,255,0.92), transparent 36%), #f1efe5 !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; box-shadow: 0 18px 46px rgba(70, 65, 55, 0.08) !important; white-space: pre-line !important; color: #4f4b43 !important; font-size: 13px !important; line-height: 1.55 !important; font-weight: 500 !important; } /* ===================================================== FOLIES SECRÈTES - SIDEBAR UNIVERS FINAL CLEAN Supprime le double bloc UNIVERS / double carte ===================================================== */ /* Le bloc parent garde le titre UNIVERS */ body#category #left-column .block-categories, body#category #left_column .block-categories, #left-column .block-categories, #left_column .block-categories { position: relative !important; padding: 82px 24px 24px !important; border-radius: 24px !important; background: rgba(255,255,255,0.96) !important; border: 1px solid rgba(125,135,101,0.14) !important; box-shadow: 0 22px 58px rgba(70,65,55,0.09), inset 0 1px 0 rgba(255,255,255,0.85) !important; } /* Titre unique UNIVERS sur le bloc parent */ body#category #left-column .block-categories::before, body#category #left_column .block-categories::before, #left-column .block-categories::before, #left_column .block-categories::before { content: "UNIVERS" !important; position: absolute !important; top: 32px !important; left: 28px !important; display: block !important; color: #2d2d2d !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; } /* Trait doré unique */ body#category #left-column .block-categories::after, body#category #left_column .block-categories::after, #left-column .block-categories::after, #left_column .block-categories::after { content: "" !important; position: absolute !important; top: 41px !important; left: 142px !important; width: 44px !important; height: 1px !important; display: block !important; background: #c7a45a !important; } /* On neutralise le bloc interne category-top-menu pour éviter la deuxième carte */ body#category #left-column .category-top-menu, body#category #left_column .category-top-menu, #left-column .category-top-menu, #left_column .category-top-menu { padding: 0 !important; margin: 0 !important; background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; } /* On supprime le deuxième UNIVERS injecté sur le bloc interne */ body#category #left-column .category-top-menu::before, body#category #left-column .category-top-menu::after, body#category #left_column .category-top-menu::before, body#category #left_column .category-top-menu::after, #left-column .category-top-menu::before, #left-column .category-top-menu::after, #left_column .category-top-menu::before, #left_column .category-top-menu::after { content: none !important; display: none !important; } /* Sécurité : pas de titre ACCUEIL visible */ body#category #left-column > h1, body#category #left-column > h2, body#category #left-column > h3, body#category #left-column > h4, body#category #left-column > .title_block, body#category #left-column > .block-title, body#category #left_column > h1, body#category #left_column > h2, body#category #left_column > h3, body#category #left_column > h4, body#category #left_column > .title_block, body#category #left_column > .block-title { display: none !important; } /* Liens bien alignés dans le bloc unique */ body#category #left-column .category-top-menu li, body#category #left_column .category-top-menu li, #left-column .category-top-menu li, #left_column .category-top-menu li { border-bottom: 1px solid rgba(125,135,101,0.11) !important; } body#category #left-column .category-top-menu li:last-child, body#category #left_column .category-top-menu li:last-child, #left-column .category-top-menu li:last-child, #left_column .category-top-menu li:last-child { border-bottom: none !important; } body#category #left-column .category-top-menu a, body#category #left_column .category-top-menu a, #left-column .category-top-menu a, #left_column .category-top-menu a { min-height: 42px !important; padding: 0 !important; color: #333333 !important; font-size: 13px !important; font-weight: 500 !important; } /* ===================================================== FOLIES SECRÈTES - TRI CATÉGORIE PREMIUM Ciblage réel Panda : #js-product-list-top ===================================================== */ /* Barre principale du tri */ body#category #js-product-list-top.products-selection, body#category #js-product-list-top { position: relative !important; display: flex !important; align-items: center !important; gap: 16px !important; width: 100% !important; min-height: 58px !important; margin: 28px 0 34px 0 !important; padding: 10px 18px !important; border-radius: 999px !important; background: rgba(255, 255, 255, 0.94) !important; border: 1px solid rgba(125, 135, 101, 0.13) !important; box-shadow: 0 16px 42px rgba(70, 65, 55, 0.065), inset 0 1px 0 rgba(255,255,255,0.9) !important; font-size: 0 !important; /* masque "Filtrer par" si c'est du texte direct */ } /* Nouveau libellé premium */ body#category #js-product-list-top.products-selection::before, body#category #js-product-list-top::before { content: "TRIER PAR" !important; display: inline-flex !important; align-items: center !important; height: 38px !important; padding-left: 6px !important; color: #2d2d2d !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; white-space: nowrap !important; } /* Petit trait premium après le libellé */ body#category #js-product-list-top.products-selection::after, body#category #js-product-list-top::after { content: "" !important; display: inline-block !important; width: 34px !important; height: 1px !important; margin-left: -6px !important; margin-right: 2px !important; background: #c7a45a !important; opacity: 0.85 !important; } /* Bloc du select */ body#category #js-product-list-top .products-sort-order { position: relative !important; display: inline-flex !important; align-items: center !important; margin: 0 !important; font-size: 13px !important; } /* Bouton Pertinence */ body#category #js-product-list-top .products-sort-order .dropdown_tri, body#category #js-product-list-top .products-sort-order .select-title, body#category #js-product-list-top .products-sort-order .dropdown-toggle { display: inline-flex !important; align-items: center !important; justify-content: space-between !important; min-width: 170px !important; height: 38px !important; padding: 0 18px !important; border-radius: 999px !important; background: linear-gradient(135deg, #fffdf8 0%, #f6f3eb 100%) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; color: #2f3033 !important; font-size: 13px !important; font-weight: 600 !important; text-decoration: none !important; box-shadow: 0 8px 20px rgba(55, 48, 38, 0.045), inset 0 1px 0 rgba(255,255,255,0.9) !important; transition: all 0.25s ease !important; } /* Hover du select */ body#category #js-product-list-top .products-sort-order .dropdown_tri:hover, body#category #js-product-list-top .products-sort-order .select-title:hover, body#category #js-product-list-top .products-sort-order .dropdown-toggle:hover { background: linear-gradient(135deg, #f4f1e8 0%, #eae6d8 100%) !important; border-color: rgba(125, 135, 101, 0.25) !important; color: #6f765c !important; transform: translateY(-1px) !important; } /* Flèche */ body#category #js-product-list-top .products-sort-order .dropdown_tri i, body#category #js-product-list-top .products-sort-order .dropdown_tri .arrow, body#category #js-product-list-top .products-sort-order .select-title i, body#category #js-product-list-top .products-sort-order .dropdown-toggle i { color: #8f9677 !important; font-size: 10px !important; margin-left: 8px !important; } /* Menu déroulant du tri */ body#category #js-product-list-top .products-sort-order .dropdown_list, body#category #js-product-list-top .products-sort-order .dropdown-menu { min-width: 210px !important; margin-top: 12px !important; padding: 10px !important; border-radius: 18px !important; background: rgba(255, 252, 247, 0.99) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 24px 54px rgba(45, 40, 32, 0.15), inset 0 1px 0 rgba(255,255,255,0.9) !important; overflow: hidden !important; } /* Liens du menu déroulant */ body#category #js-product-list-top .products-sort-order .dropdown_list a, body#category #js-product-list-top .products-sort-order .dropdown-menu a, body#category #js-product-list-top .products-sort-order .select-list { display: block !important; padding: 11px 14px !important; border-radius: 11px !important; color: #3f4036 !important; font-size: 13px !important; font-weight: 500 !important; text-decoration: none !important; transition: all 0.22s ease !important; } body#category #js-product-list-top .products-sort-order .dropdown_list a:hover, body#category #js-product-list-top .products-sort-order .dropdown-menu a:hover, body#category #js-product-list-top .products-sort-order .select-list:hover { background: #f3f1e8 !important; color: #6f765c !important; padding-left: 18px !important; } /* Si Panda affiche un compteur produits dans cette zone */ body#category #js-product-list-top .total-products, body#category #js-product-list-top .showing, body#category #js-product-list-top .products-counter { margin-left: auto !important; color: #77736a !important; font-size: 12px !important; font-weight: 600 !important; } /* Mobile */ @media (max-width: 767px) { body#category #js-product-list-top.products-selection, body#category #js-product-list-top { border-radius: 22px !important; flex-wrap: wrap !important; gap: 10px !important; padding: 16px !important; } body#category #js-product-list-top .products-sort-order, body#category #js-product-list-top .products-sort-order .dropdown_tri, body#category #js-product-list-top .products-sort-order .select-title, body#category #js-product-list-top .products-sort-order .dropdown-toggle { width: 100% !important; } } /* ===================================================== FOLIES SECRÈTES - TRI CATÉGORIE CORRECTIF FINAL Supprime l'ancien "Filtrer par" + corrige le trait doré ===================================================== */ /* Supprime l'ancien libellé "Filtrer par" Panda */ body#category #js-product-list-top > label, body#category #js-product-list-top > .sort-by, body#category #js-product-list-top > .sort-by-row, body#category #js-product-list-top .sort-by, body#category #js-product-list-top .sort-by-row label, body#category #js-product-list-top .products-sort-order + label, body#category #js-product-list-top label[for], body#category .products-selection > label, body#category .products-selection > .sort-by, body#category .products-selection .sort-by { display: none !important; visibility: hidden !important; opacity: 0 !important; width: 0 !important; height: 0 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; } /* Sécurité : le parent ne doit pas réafficher le texte brut */ body#category #js-product-list-top.products-selection, body#category #js-product-list-top { font-size: 0 !important; } /* On garde uniquement notre libellé TRIER PAR */ body#category #js-product-list-top.products-selection::before, body#category #js-product-list-top::before { content: "TRIER PAR" !important; display: inline-flex !important; align-items: center !important; height: 38px !important; margin-right: 18px !important; color: #2d2d2d !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; white-space: nowrap !important; } /* Supprime le trait doré qui partait à droite */ body#category #js-product-list-top.products-selection::after, body#category #js-product-list-top::after { content: none !important; display: none !important; } /* Petit trait doré propre après TRIER PAR, placé avant le select */ body#category #js-product-list-top .products-sort-order { position: relative !important; margin-left: 22px !important; } body#category #js-product-list-top .products-sort-order::before { content: "" !important; position: absolute !important; left: -22px !important; top: 50% !important; width: 34px !important; height: 1px !important; background: #c7a45a !important; transform: translateY(-50%) !important; opacity: 0.85 !important; } /* Bouton Pertinence bien aligné */ body#category #js-product-list-top .products-sort-order .dropdown_tri, body#category #js-product-list-top .products-sort-order .select-title, body#category #js-product-list-top .products-sort-order .dropdown-toggle { min-width: 170px !important; height: 38px !important; padding: 0 18px !important; border-radius: 999px !important; background: linear-gradient(135deg, #fffdf8 0%, #f6f3eb 100%) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; color: #2f3033 !important; font-size: 13px !important; font-weight: 600 !important; } /* Sur mobile, on évite que le trait gêne */ @media (max-width: 767px) { body#category #js-product-list-top .products-sort-order { margin-left: 0 !important; } body#category #js-product-list-top .products-sort-order::before { display: none !important; } } /* ===================================================== FOLIES SECRÈTES - TRI CATÉGORIE FINAL CLEAN Masque définitivement l'ancien "Filtrer par" ===================================================== */ /* On masque le texte brut hérité autour du tri */ body#category #product-list-top-wrap, body#category #js-product-list-top, body#category .products-selection, body#category .product_list_top { color: transparent !important; font-size: 0 !important; } /* On restaure uniquement notre barre premium */ body#category #js-product-list-top.products-selection, body#category #js-product-list-top { position: relative !important; display: flex !important; align-items: center !important; width: 100% !important; min-height: 58px !important; margin: 24px 0 34px 0 !important; padding: 10px 24px !important; border-radius: 999px !important; background: rgba(255, 255, 255, 0.94) !important; border: 1px solid rgba(125, 135, 101, 0.13) !important; box-shadow: 0 16px 42px rgba(70, 65, 55, 0.065), inset 0 1px 0 rgba(255,255,255,0.9) !important; } /* Notre libellé propre */ body#category #js-product-list-top::before { content: "TRIER PAR" !important; display: inline-flex !important; align-items: center !important; margin-right: 20px !important; color: #2d2d2d !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; white-space: nowrap !important; } /* On supprime le trait doré précédent qui gênait l'alignement */ body#category #js-product-list-top::after, body#category #js-product-list-top .products-sort-order::before { content: none !important; display: none !important; } /* Bloc select restauré */ body#category #js-product-list-top .products-sort-order { display: inline-flex !important; align-items: center !important; margin: 0 !important; color: #2f3033 !important; font-size: 13px !important; } /* Bouton Pertinence */ body#category #js-product-list-top .products-sort-order .dropdown_tri, body#category #js-product-list-top .products-sort-order .select-title, body#category #js-product-list-top .products-sort-order .dropdown-toggle { display: inline-flex !important; align-items: center !important; justify-content: space-between !important; min-width: 170px !important; height: 38px !important; padding: 0 18px !important; border-radius: 999px !important; background: linear-gradient(135deg, #fffdf8 0%, #f6f3eb 100%) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; color: #2f3033 !important; font-size: 13px !important; font-weight: 600 !important; text-decoration: none !important; box-shadow: 0 8px 20px rgba(55, 48, 38, 0.045), inset 0 1px 0 rgba(255,255,255,0.9) !important; } /* Tout le contenu utile du select reste visible */ body#category #js-product-list-top .products-sort-order *, body#category #js-product-list-top .dropdown_tri *, body#category #js-product-list-top .dropdown_list *, body#category #js-product-list-top .dropdown-menu * { color: inherit !important; font-size: inherit !important; } /* Flèche */ body#category #js-product-list-top .products-sort-order i, body#category #js-product-list-top .products-sort-order .arrow { color: #8f9677 !important; font-size: 10px !important; margin-left: 8px !important; } /* Menu déroulant */ body#category #js-product-list-top .products-sort-order .dropdown_list, body#category #js-product-list-top .products-sort-order .dropdown-menu { min-width: 210px !important; margin-top: 12px !important; padding: 10px !important; border-radius: 18px !important; background: rgba(255, 252, 247, 0.99) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 24px 54px rgba(45, 40, 32, 0.15), inset 0 1px 0 rgba(255,255,255,0.9) !important; overflow: hidden !important; } /* Liens menu déroulant */ body#category #js-product-list-top .products-sort-order .dropdown_list a, body#category #js-product-list-top .products-sort-order .dropdown-menu a, body#category #js-product-list-top .products-sort-order .select-list { display: block !important; padding: 11px 14px !important; border-radius: 11px !important; color: #3f4036 !important; font-size: 13px !important; font-weight: 500 !important; text-decoration: none !important; } body#category #js-product-list-top .products-sort-order .dropdown_list a:hover, body#category #js-product-list-top .products-sort-order .dropdown-menu a:hover, body#category #js-product-list-top .products-sort-order .select-list:hover { background: #f3f1e8 !important; color: #6f765c !important; } /* ===================================================== FOLIES SECRÈTES - SUPPRESSION "FILTRER PAR" VIDE Bloc filtres actifs Panda / PrestaShop ===================================================== */ /* Masque le titre brut "Filtrer par" */ body#category #js-active-search-filters .active_filter_title, body#category #js-active-search-filters .font-weight-bold.active_filter_title { display: none !important; visibility: hidden !important; opacity: 0 !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; } /* Si aucun filtre actif n'est présent, on masque tout le bloc */ body#category #js-active-search-filters:not(:has(.active_filter_item)):not(:has(.filter-block)):not(:has(.js-search-link)) { display: none !important; margin: 0 !important; padding: 0 !important; min-height: 0 !important; } /* Sécurité : réduit l'espace du bloc même si :has n'est pas pris en charge */ body#category #js-active-search-filters { margin: 0 !important; padding: 0 !important; min-height: 0 !important; } /* Si un jour il y a de vrais filtres actifs, on garde un rendu propre */ body#category #js-active-search-filters .active_filter_item, body#category #js-active-search-filters .filter-block, body#category #js-active-search-filters .js-search-link { display: inline-flex !important; align-items: center !important; min-height: 32px !important; margin: 0 8px 8px 0 !important; padding: 0 13px !important; border-radius: 999px !important; background: #f1efe5 !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; color: #6f765c !important; font-size: 12px !important; font-weight: 600 !important; } /* ===================================================== FOLIES SECRÈTES - TRI CATÉGORIE FINAL DESKTOP Masque "Filtres à bascule" + affine dropdown tri ===================================================== */ /* Masquer le bouton "Filtres à bascule" sur desktop */ @media (min-width: 768px) { body#category #js-active-search-filters .toggle_btn, body#category #js-active-search-filters .active_filter_item.st_show_on_mobile, body#category #js-active-search-filters a[href="#horizontal_filters"], body#category .active_filters_box .toggle_btn, body#category .active_filters_box .st_show_on_mobile { display: none !important; visibility: hidden !important; opacity: 0 !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; } body#category #js-active-search-filters, body#category .active_filters_box { display: none !important; margin: 0 !important; padding: 0 !important; min-height: 0 !important; } } /* Dropdown tri plus premium */ body#category #js-product-list-top .products-sort-order .dropdown_list, body#category #js-product-list-top .products-sort-order .dropdown-menu { min-width: 230px !important; margin-top: 12px !important; padding: 10px !important; border-radius: 18px !important; background: rgba(255, 252, 247, 0.99) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 24px 54px rgba(45, 40, 32, 0.16), inset 0 1px 0 rgba(255,255,255,0.9) !important; overflow: hidden !important; } /* Lignes du menu déroulant */ body#category #js-product-list-top .products-sort-order .dropdown_list a, body#category #js-product-list-top .products-sort-order .dropdown-menu a, body#category #js-product-list-top .products-sort-order .select-list { display: flex !important; align-items: center !important; min-height: 39px !important; padding: 0 14px !important; border-radius: 11px !important; border-bottom: none !important; color: #3f4036 !important; font-size: 13px !important; font-weight: 500 !important; text-decoration: none !important; background: transparent !important; transition: all 0.22s ease !important; } /* Petite flèche dans les options */ body#category #js-product-list-top .products-sort-order .dropdown_list a::before, body#category #js-product-list-top .products-sort-order .dropdown-menu a::before, body#category #js-product-list-top .products-sort-order .select-list::before { content: "›" !important; margin-right: 9px !important; color: #c7a45a !important; font-size: 16px !important; line-height: 1 !important; } /* Hover option */ body#category #js-product-list-top .products-sort-order .dropdown_list a:hover, body#category #js-product-list-top .products-sort-order .dropdown-menu a:hover, body#category #js-product-list-top .products-sort-order .select-list:hover { background: #f3f1e8 !important; color: #6f765c !important; padding-left: 18px !important; } /* Option active */ body#category #js-product-list-top .products-sort-order .dropdown_list a.current, body#category #js-product-list-top .products-sort-order .dropdown-menu a.current, body#category #js-product-list-top .products-sort-order .select-list.current { background: #f1efe5 !important; color: #6f765c !important; font-weight: 700 !important; } /* Mobile : on garde le bouton filtres, mais plus propre */ @media (max-width: 767px) { body#category #js-active-search-filters .toggle_btn, body#category #js-active-search-filters .active_filter_item.st_show_on_mobile, body#category #js-active-search-filters a[href="#horizontal_filters"] { display: inline-flex !important; align-items: center !important; min-height: 36px !important; padding: 0 15px !important; border-radius: 999px !important; background: #f1efe5 !important; border: 1px solid rgba(125,135,101,0.16) !important; color: #6f765c !important; font-size: 12px !important; font-weight: 700 !important; } } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS CATÉGORIE PREMIUM V1 Ciblage réel Panda : pro_outer_box / pro_first_box / pro_second_box ===================================================== */ /* Espacement global des produits */ body#category #js-product-list .product_list_item, body#category #js-product-list .ajax_block_product { margin-bottom: 42px !important; } /* Carte produit complète */ body#category #js-product-list .product_list_item .pro_outer_box, body#category #js-product-list .ajax_block_product .pro_outer_box, body#category .product_list.grid .pro_outer_box { position: relative !important; height: 100% !important; min-height: 398px !important; overflow: hidden !important; border-radius: 24px !important; background: radial-gradient(circle at 50% 28%, rgba(241,239,229,0.50), transparent 46%), linear-gradient(180deg, #ffffff 0%, #fffdf9 100%) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; box-shadow: 0 22px 58px rgba(70, 65, 55, 0.08), inset 0 1px 0 rgba(255,255,255,0.90) !important; transition: transform 0.34s ease, box-shadow 0.34s ease, border-color 0.34s ease !important; } /* Hover carte */ body#category #js-product-list .product_list_item .pro_outer_box:hover, body#category #js-product-list .ajax_block_product .pro_outer_box:hover { transform: translateY(-6px) !important; border-color: rgba(125, 135, 101, 0.28) !important; box-shadow: 0 30px 78px rgba(70, 65, 55, 0.14), inset 0 1px 0 rgba(255,255,255,0.95) !important; } /* Zone image */ body#category #js-product-list .pro_first_box { position: relative !important; min-height: 265px !important; padding: 24px 22px 10px !important; background: transparent !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } /* Lien image */ body#category #js-product-list .product_img_link { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 235px !important; background: transparent !important; } /* Image produit */ body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img, body#category #js-product-list .back_image_pic img { display: block !important; width: auto !important; max-width: 100% !important; max-height: 245px !important; object-fit: contain !important; margin: 0 auto !important; padding: 0 !important; filter: brightness(0.995) contrast(1.02) !important; transition: transform 0.48s ease, filter 0.34s ease !important; } /* Hover image */ body#category #js-product-list .pro_outer_box:hover .product_img_link img, body#category #js-product-list .pro_outer_box:hover img.front-image { transform: scale(1.035) !important; filter: brightness(0.985) contrast(1.04) !important; } /* Petit cœur premium décoratif en haut à droite */ body#category #js-product-list .pro_outer_box::after { content: "♡" !important; position: absolute !important; top: 18px !important; right: 20px !important; width: 30px !important; height: 30px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: rgba(255, 255, 255, 0.86) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; color: #8f9677 !important; font-size: 20px !important; line-height: 1 !important; box-shadow: 0 8px 18px rgba(70, 65, 55, 0.06) !important; opacity: 0.92 !important; transition: all 0.24s ease !important; z-index: 3 !important; } body#category #js-product-list .pro_outer_box:hover::after { color: #c7a45a !important; transform: translateY(-1px) scale(1.04) !important; } /* Zone texte */ body#category #js-product-list .pro_second_box { background: transparent !important; padding: 18px 22px 26px !important; text-align: center !important; } /* Boîte du nom produit */ body#category #js-product-list .mini_name, body#category #js-product-list .pro_kuan_box { justify-content: center !important; text-align: center !important; } /* Nom produit */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { display: block !important; min-height: 40px !important; color: #262626 !important; font-size: 13px !important; line-height: 1.38 !important; font-weight: 600 !important; letter-spacing: 0.015em !important; text-transform: none !important; text-decoration: none !important; margin: 0 auto 10px !important; transition: color 0.22s ease !important; } body#category #js-product-list .s_title_block a:hover, body#category #js-product-list .product-name a:hover, body#category #js-product-list .product-title a:hover { color: #7d8765 !important; } /* Prix */ body#category #js-product-list .product-price-and-shipping { margin-top: 8px !important; text-align: center !important; color: #222 !important; } /* Prix principal */ body#category #js-product-list .price, body#category #js-product-list span.price { color: #222 !important; font-size: 17px !important; font-weight: 800 !important; letter-spacing: 0.015em !important; line-height: 1.1 !important; } /* TTC plus discret */ body#category #js-product-list .tax_label { display: inline-block !important; margin-left: 6px !important; color: #8f9677 !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.10em !important; text-transform: uppercase !important; vertical-align: baseline !important; } /* Ancien prix barré */ body#category #js-product-list .regular-price, body#category #js-product-list .old-price { color: #aaa49a !important; font-size: 12px !important; font-weight: 500 !important; text-decoration-thickness: 1px !important; } /* Hover fly : on garde discret pour ne pas polluer */ body#category #js-product-list .hover_fly { opacity: 0 !important; visibility: hidden !important; transform: translateY(8px) !important; transition: all 0.25s ease !important; } body#category #js-product-list .pro_outer_box:hover .hover_fly { opacity: 1 !important; visibility: visible !important; transform: translateY(0) !important; } /* Boutons hover fly premium si affichés */ body#category #js-product-list .hover_fly a, body#category #js-product-list .hover_fly button { border-radius: 999px !important; background: rgba(255,255,255,0.94) !important; border: 1px solid rgba(125,135,101,0.18) !important; color: #2f3033 !important; box-shadow: 0 10px 24px rgba(70,65,55,0.12) !important; transition: all 0.22s ease !important; } body#category #js-product-list .hover_fly a:hover, body#category #js-product-list .hover_fly button:hover { background: #7d8765 !important; color: #ffffff !important; } /* Séparateurs entre lignes produits plus discrets */ body#category #js-product-list .product_list_item { border-top: none !important; } /* Grille : respiration horizontale sans casser Bootstrap */ body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { row-gap: 34px !important; } /* Responsive */ @media (max-width: 991px) { body#category #js-product-list .pro_first_box { min-height: 235px !important; } body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image { max-height: 218px !important; } body#category #js-product-list .pro_outer_box { min-height: 360px !important; } } @media (max-width: 575px) { body#category #js-product-list .pro_first_box { min-height: 220px !important; } body#category #js-product-list .pro_second_box { padding: 16px 18px 22px !important; } } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS CATÉGORIE PREMIUM V2 Correction image / hover / bouton panier / prix ===================================================== */ /* Carte globale plus luxe */ body#category #js-product-list .product_list_item .pro_outer_box, body#category #js-product-list .ajax_block_product .pro_outer_box, body#category .product_list.grid .pro_outer_box { position: relative !important; min-height: 430px !important; border-radius: 28px !important; overflow: hidden !important; background: radial-gradient(circle at 50% 18%, rgba(241,239,229,0.55), transparent 48%), linear-gradient(180deg, #ffffff 0%, #fffdf9 100%) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; box-shadow: 0 24px 62px rgba(70, 65, 55, 0.085), inset 0 1px 0 rgba(255,255,255,0.95) !important; transition: transform 0.34s ease, box-shadow 0.34s ease, border-color 0.34s ease !important; } /* Hover plus subtil */ body#category #js-product-list .product_list_item .pro_outer_box:hover, body#category #js-product-list .ajax_block_product .pro_outer_box:hover { transform: translateY(-5px) !important; border-color: rgba(125, 135, 101, 0.24) !important; box-shadow: 0 32px 82px rgba(70, 65, 55, 0.13), inset 0 1px 0 rgba(255,255,255,0.98) !important; } /* Zone image parfaitement maîtrisée */ body#category #js-product-list .pro_first_box { position: relative !important; height: 285px !important; min-height: 285px !important; max-height: 285px !important; padding: 28px 28px 8px !important; background: transparent !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } /* Lien image */ body#category #js-product-list .product_img_link { width: 100% !important; height: 245px !important; min-height: 245px !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; background: transparent !important; } /* Désactive l'image secondaire au hover si elle casse le cadrage */ body#category #js-product-list .back_image_pic { display: none !important; opacity: 0 !important; visibility: hidden !important; } /* Image principale : jamais coupée, jamais énorme */ body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img { display: block !important; width: auto !important; height: auto !important; max-width: 88% !important; max-height: 235px !important; object-fit: contain !important; margin: 0 auto !important; padding: 0 !important; transform: none !important; filter: brightness(1) contrast(1.02) !important; transition: transform 0.45s ease, filter 0.35s ease !important; } /* Hover image : zoom très léger uniquement */ body#category #js-product-list .pro_outer_box:hover .product_img_link img, body#category #js-product-list .pro_outer_box:hover img.front-image { transform: scale(1.018) !important; filter: brightness(0.99) contrast(1.035) !important; } /* Supprime les anciens zooms agressifs hérités */ body#category .ajax_block_product:hover img, body#category .pro_outer_box:hover img, body#category .product-miniature:hover img { transform: scale(1.018) !important; } /* Zone texte plus premium */ body#category #js-product-list .pro_second_box { min-height: 145px !important; padding: 20px 24px 28px !important; background: transparent !important; text-align: center !important; display: flex !important; flex-direction: column !important; justify-content: flex-start !important; align-items: center !important; } /* Nom produit : moins brut, plus boutique */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { max-width: 92% !important; min-height: 42px !important; margin: 0 auto 14px !important; color: #242424 !important; font-size: 13.2px !important; line-height: 1.42 !important; font-weight: 600 !important; letter-spacing: 0.015em !important; text-transform: none !important; text-align: center !important; text-decoration: none !important; } /* Prix plus luxe */ body#category #js-product-list .product-price-and-shipping { margin-top: auto !important; text-align: center !important; } body#category #js-product-list .price, body#category #js-product-list span.price { color: #1f1f1f !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 20px !important; font-weight: 700 !important; letter-spacing: -0.01em !important; line-height: 1 !important; } /* TTC en petit, discret */ body#category #js-product-list .tax_label { display: block !important; margin: 8px 0 0 0 !important; color: #c7a45a !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; line-height: 1 !important; } /* Ancien prix */ body#category #js-product-list .regular-price, body#category #js-product-list .old-price { display: inline-block !important; margin-left: 7px !important; color: #aaa49a !important; font-size: 12px !important; font-weight: 500 !important; } /* Coeur wishlist premium */ body#category #js-product-list .pro_outer_box::after { content: "♡" !important; position: absolute !important; top: 18px !important; right: 18px !important; width: 34px !important; height: 34px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: rgba(255, 255, 255, 0.92) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; color: #9aa186 !important; font-size: 21px !important; line-height: 1 !important; box-shadow: 0 10px 22px rgba(70, 65, 55, 0.08), inset 0 1px 0 rgba(255,255,255,0.95) !important; z-index: 5 !important; transition: all 0.24s ease !important; } body#category #js-product-list .pro_outer_box:hover::after { color: #c7a45a !important; transform: translateY(-1px) scale(1.04) !important; } /* Bouton ajouter au panier : version premium, centrée, discrète */ body#category #js-product-list .hover_fly { position: absolute !important; left: 50% !important; right: auto !important; bottom: 18px !important; width: auto !important; min-width: 0 !important; max-width: none !important; transform: translateX(-50%) translateY(10px) !important; opacity: 0 !important; visibility: hidden !important; z-index: 10 !important; background: transparent !important; box-shadow: none !important; transition: all 0.25s ease !important; } /* Apparition douce au hover */ body#category #js-product-list .pro_outer_box:hover .hover_fly { opacity: 1 !important; visibility: visible !important; transform: translateX(-50%) translateY(0) !important; } /* Bouton panier propre */ body#category #js-product-list .hover_fly a, body#category #js-product-list .hover_fly button, body#category #js-product-list .hover_fly .ajax_add_to_cart_button { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; min-width: 155px !important; max-width: 185px !important; height: 38px !important; padding: 0 18px !important; border-radius: 999px !important; background: rgba(125, 135, 101, 0.96) !important; border: 1px solid rgba(125, 135, 101, 0.28) !important; color: #ffffff !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.035em !important; text-transform: uppercase !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; box-shadow: 0 14px 32px rgba(70, 65, 55, 0.18), inset 0 1px 0 rgba(255,255,255,0.22) !important; } /* Icône dans le bouton panier */ body#category #js-product-list .hover_fly a i, body#category #js-product-list .hover_fly button i { margin-right: 6px !important; font-size: 12px !important; color: inherit !important; } /* Hover bouton */ body#category #js-product-list .hover_fly a:hover, body#category #js-product-list .hover_fly button:hover, body#category #js-product-list .hover_fly .ajax_add_to_cart_button:hover { background: #6f765c !important; color: #ffffff !important; transform: translateY(-1px) !important; } /* Empêche le bouton de dépasser de la carte */ body#category #js-product-list .pro_outer_box, body#category #js-product-list .pro_first_box { overflow: hidden !important; } /* Si le produit est survolé, on garde l'image lisible sous le bouton */ body#category #js-product-list .pro_outer_box:hover .product_img_link img { opacity: 0.96 !important; } /* Alignement des colonnes */ body#category #js-product-list .product_list_item { padding-left: 18px !important; padding-right: 18px !important; } /* Espace entre les lignes */ body#category #js-product-list .product_list.row { margin-left: -18px !important; margin-right: -18px !important; } /* Mobile */ @media (max-width: 767px) { body#category #js-product-list .pro_outer_box { min-height: 390px !important; } body#category #js-product-list .pro_first_box { height: 250px !important; min-height: 250px !important; } body#category #js-product-list .product_img_link { height: 220px !important; min-height: 220px !important; } body#category #js-product-list .hover_fly { display: none !important; } } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS CATÉGORIE PREMIUM V2 Correction image / hover / bouton panier / prix ===================================================== */ /* Carte globale plus luxe */ body#category #js-product-list .product_list_item .pro_outer_box, body#category #js-product-list .ajax_block_product .pro_outer_box, body#category .product_list.grid .pro_outer_box { position: relative !important; min-height: 430px !important; border-radius: 28px !important; overflow: hidden !important; background: radial-gradient(circle at 50% 18%, rgba(241,239,229,0.55), transparent 48%), linear-gradient(180deg, #ffffff 0%, #fffdf9 100%) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; box-shadow: 0 24px 62px rgba(70, 65, 55, 0.085), inset 0 1px 0 rgba(255,255,255,0.95) !important; transition: transform 0.34s ease, box-shadow 0.34s ease, border-color 0.34s ease !important; } /* Hover plus subtil */ body#category #js-product-list .product_list_item .pro_outer_box:hover, body#category #js-product-list .ajax_block_product .pro_outer_box:hover { transform: translateY(-5px) !important; border-color: rgba(125, 135, 101, 0.24) !important; box-shadow: 0 32px 82px rgba(70, 65, 55, 0.13), inset 0 1px 0 rgba(255,255,255,0.98) !important; } /* Zone image parfaitement maîtrisée */ body#category #js-product-list .pro_first_box { position: relative !important; height: 285px !important; min-height: 285px !important; max-height: 285px !important; padding: 28px 28px 8px !important; background: transparent !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } /* Lien image */ body#category #js-product-list .product_img_link { width: 100% !important; height: 245px !important; min-height: 245px !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; background: transparent !important; } /* Désactive l'image secondaire au hover si elle casse le cadrage */ body#category #js-product-list .back_image_pic { display: none !important; opacity: 0 !important; visibility: hidden !important; } /* Image principale : jamais coupée, jamais énorme */ body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img { display: block !important; width: auto !important; height: auto !important; max-width: 88% !important; max-height: 235px !important; object-fit: contain !important; margin: 0 auto !important; padding: 0 !important; transform: none !important; filter: brightness(1) contrast(1.02) !important; transition: transform 0.45s ease, filter 0.35s ease !important; } /* Hover image : zoom très léger uniquement */ body#category #js-product-list .pro_outer_box:hover .product_img_link img, body#category #js-product-list .pro_outer_box:hover img.front-image { transform: scale(1.018) !important; filter: brightness(0.99) contrast(1.035) !important; } /* Supprime les anciens zooms agressifs hérités */ body#category .ajax_block_product:hover img, body#category .pro_outer_box:hover img, body#category .product-miniature:hover img { transform: scale(1.018) !important; } /* Zone texte plus premium */ body#category #js-product-list .pro_second_box { min-height: 145px !important; padding: 20px 24px 28px !important; background: transparent !important; text-align: center !important; display: flex !important; flex-direction: column !important; justify-content: flex-start !important; align-items: center !important; } /* Nom produit : moins brut, plus boutique */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { max-width: 92% !important; min-height: 42px !important; margin: 0 auto 14px !important; color: #242424 !important; font-size: 13.2px !important; line-height: 1.42 !important; font-weight: 600 !important; letter-spacing: 0.015em !important; text-transform: none !important; text-align: center !important; text-decoration: none !important; } /* Prix plus luxe */ body#category #js-product-list .product-price-and-shipping { margin-top: auto !important; text-align: center !important; } body#category #js-product-list .price, body#category #js-product-list span.price { color: #1f1f1f !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 20px !important; font-weight: 700 !important; letter-spacing: -0.01em !important; line-height: 1 !important; } /* TTC en petit, discret */ body#category #js-product-list .tax_label { display: block !important; margin: 8px 0 0 0 !important; color: #c7a45a !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; line-height: 1 !important; } /* Ancien prix */ body#category #js-product-list .regular-price, body#category #js-product-list .old-price { display: inline-block !important; margin-left: 7px !important; color: #aaa49a !important; font-size: 12px !important; font-weight: 500 !important; } /* Coeur wishlist premium */ body#category #js-product-list .pro_outer_box::after { content: "♡" !important; position: absolute !important; top: 18px !important; right: 18px !important; width: 34px !important; height: 34px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: rgba(255, 255, 255, 0.92) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; color: #9aa186 !important; font-size: 21px !important; line-height: 1 !important; box-shadow: 0 10px 22px rgba(70, 65, 55, 0.08), inset 0 1px 0 rgba(255,255,255,0.95) !important; z-index: 5 !important; transition: all 0.24s ease !important; } body#category #js-product-list .pro_outer_box:hover::after { color: #c7a45a !important; transform: translateY(-1px) scale(1.04) !important; } /* Bouton ajouter au panier : version premium, centrée, discrète */ body#category #js-product-list .hover_fly { position: absolute !important; left: 50% !important; right: auto !important; bottom: 18px !important; width: auto !important; min-width: 0 !important; max-width: none !important; transform: translateX(-50%) translateY(10px) !important; opacity: 0 !important; visibility: hidden !important; z-index: 10 !important; background: transparent !important; box-shadow: none !important; transition: all 0.25s ease !important; } /* Apparition douce au hover */ body#category #js-product-list .pro_outer_box:hover .hover_fly { opacity: 1 !important; visibility: visible !important; transform: translateX(-50%) translateY(0) !important; } /* Bouton panier propre */ body#category #js-product-list .hover_fly a, body#category #js-product-list .hover_fly button, body#category #js-product-list .hover_fly .ajax_add_to_cart_button { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; min-width: 155px !important; max-width: 185px !important; height: 38px !important; padding: 0 18px !important; border-radius: 999px !important; background: rgba(125, 135, 101, 0.96) !important; border: 1px solid rgba(125, 135, 101, 0.28) !important; color: #ffffff !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.035em !important; text-transform: uppercase !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; box-shadow: 0 14px 32px rgba(70, 65, 55, 0.18), inset 0 1px 0 rgba(255,255,255,0.22) !important; } /* Icône dans le bouton panier */ body#category #js-product-list .hover_fly a i, body#category #js-product-list .hover_fly button i { margin-right: 6px !important; font-size: 12px !important; color: inherit !important; } /* Hover bouton */ body#category #js-product-list .hover_fly a:hover, body#category #js-product-list .hover_fly button:hover, body#category #js-product-list .hover_fly .ajax_add_to_cart_button:hover { background: #6f765c !important; color: #ffffff !important; transform: translateY(-1px) !important; } /* Empêche le bouton de dépasser de la carte */ body#category #js-product-list .pro_outer_box, body#category #js-product-list .pro_first_box { overflow: hidden !important; } /* Si le produit est survolé, on garde l'image lisible sous le bouton */ body#category #js-product-list .pro_outer_box:hover .product_img_link img { opacity: 0.96 !important; } /* Alignement des colonnes */ body#category #js-product-list .product_list_item { padding-left: 18px !important; padding-right: 18px !important; } /* Espace entre les lignes */ body#category #js-product-list .product_list.row { margin-left: -18px !important; margin-right: -18px !important; } /* Mobile */ @media (max-width: 767px) { body#category #js-product-list .pro_outer_box { min-height: 390px !important; } body#category #js-product-list .pro_first_box { height: 250px !important; min-height: 250px !important; } body#category #js-product-list .product_img_link { height: 220px !important; min-height: 220px !important; } body#category #js-product-list .hover_fly { display: none !important; } } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS CATÉGORIE PREMIUM V3 Correction taille / largeur / suppression hover brut Panda ===================================================== */ /* ===================================================== 01 - LARGEUR GÉNÉRALE PAGE CATÉGORIE ===================================================== */ body#category .columns.container, body#category #wrapper .container, body#category .container { max-width: 1480px !important; width: 100% !important; } /* Colonne gauche stable */ body#category #left-column, body#category #left_column { flex: 0 0 300px !important; max-width: 300px !important; } /* Colonne produits plus large */ body#category #center_column, body#category #content-wrapper { flex: 1 1 auto !important; max-width: calc(100% - 300px) !important; } /* ===================================================== 02 - GRILLE PRODUITS PLUS PREMIUM ===================================================== */ /* On force une grille propre en 3 colonnes larges */ body#category #js-product-list .product_list.row { display: grid !important; grid-template-columns: repeat(3, minmax(260px, 1fr)) !important; gap: 34px !important; margin-left: 0 !important; margin-right: 0 !important; } /* Neutralise les largeurs Bootstrap Panda sur les articles */ body#category #js-product-list .product_list_item, body#category #js-product-list .ajax_block_product { width: 100% !important; max-width: 100% !important; flex: none !important; padding: 0 !important; margin: 0 0 42px 0 !important; } /* ===================================================== 03 - CARTE PRODUIT GRANDE ET PREMIUM ===================================================== */ body#category #js-product-list .pro_outer_box { position: relative !important; width: 100% !important; min-height: 455px !important; border-radius: 28px !important; overflow: hidden !important; background: radial-gradient(circle at 50% 22%, rgba(241,239,229,0.48), transparent 50%), linear-gradient(180deg, #ffffff 0%, #fffdf9 100%) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; box-shadow: 0 24px 62px rgba(70, 65, 55, 0.09), inset 0 1px 0 rgba(255,255,255,0.95) !important; transition: transform 0.32s ease, box-shadow 0.32s ease, border-color 0.32s ease !important; } body#category #js-product-list .pro_outer_box:hover { transform: translateY(-5px) !important; border-color: rgba(125, 135, 101, 0.24) !important; box-shadow: 0 32px 82px rgba(70, 65, 55, 0.14), inset 0 1px 0 rgba(255,255,255,0.98) !important; } /* ===================================================== 04 - IMAGE PRODUIT AGRANDIE MAIS NON COUPÉE ===================================================== */ body#category #js-product-list .pro_first_box { height: 292px !important; min-height: 292px !important; max-height: 292px !important; padding: 30px 30px 8px !important; background: transparent !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } body#category #js-product-list .product_img_link { width: 100% !important; height: 250px !important; min-height: 250px !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } /* Image principale propre */ body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img { width: auto !important; height: auto !important; max-width: 92% !important; max-height: 245px !important; object-fit: contain !important; margin: 0 auto !important; transform: none !important; filter: brightness(1) contrast(1.02) !important; transition: transform 0.35s ease, filter 0.35s ease !important; } /* Hover image très léger */ body#category #js-product-list .pro_outer_box:hover .product_img_link img, body#category #js-product-list .pro_outer_box:hover img.front-image { transform: scale(1.015) !important; filter: brightness(0.99) contrast(1.035) !important; } /* On désactive l’image secondaire Panda qui casse le cadrage */ body#category #js-product-list .back_image_pic { display: none !important; opacity: 0 !important; visibility: hidden !important; } /* ===================================================== 05 - SUPPRESSION DES BOUTONS HOVER BRUTS ===================================================== */ /* Pour l’instant on masque les boutons Panda dans la carte. On les remettra ensuite proprement si besoin. */ body#category #js-product-list .hover_fly, body#category #js-product-list .hover_fly *, body#category #js-product-list .add_to_cart, body#category #js-product-list .add_to_love, body#category #js-product-list .wishlist_button { display: none !important; visibility: hidden !important; opacity: 0 !important; } /* ===================================================== 06 - CŒUR DISCRET EN HAUT À DROITE ===================================================== */ body#category #js-product-list .pro_outer_box::after { content: "♡" !important; position: absolute !important; top: 18px !important; right: 18px !important; width: 34px !important; height: 34px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: rgba(255, 255, 255, 0.92) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; color: #9aa186 !important; font-size: 21px !important; line-height: 1 !important; box-shadow: 0 10px 22px rgba(70, 65, 55, 0.08), inset 0 1px 0 rgba(255,255,255,0.95) !important; z-index: 5 !important; transition: all 0.24s ease !important; } body#category #js-product-list .pro_outer_box:hover::after { color: #c7a45a !important; transform: translateY(-1px) scale(1.04) !important; } /* ===================================================== 07 - TEXTE PRODUIT PLUS LUXE ===================================================== */ body#category #js-product-list .pro_second_box { min-height: 150px !important; padding: 22px 26px 30px !important; background: transparent !important; text-align: center !important; display: flex !important; flex-direction: column !important; align-items: center !important; } /* Nom produit */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { max-width: 92% !important; min-height: 44px !important; margin: 0 auto 16px !important; color: #242424 !important; font-size: 13.4px !important; line-height: 1.42 !important; font-weight: 600 !important; letter-spacing: 0.015em !important; text-transform: none !important; text-align: center !important; text-decoration: none !important; } body#category #js-product-list .s_title_block a:hover, body#category #js-product-list .product-name a:hover, body#category #js-product-list .product-title a:hover { color: #7d8765 !important; } /* Prix */ body#category #js-product-list .product-price-and-shipping { margin-top: auto !important; text-align: center !important; } body#category #js-product-list .price, body#category #js-product-list span.price { color: #1f1f1f !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 20px !important; font-weight: 700 !important; letter-spacing: -0.01em !important; line-height: 1 !important; } /* TTC en dessous, discret */ body#category #js-product-list .tax_label { display: block !important; margin: 8px 0 0 0 !important; color: #c7a45a !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; line-height: 1 !important; } /* Prix barré */ body#category #js-product-list .regular-price, body#category #js-product-list .old-price { display: inline-block !important; margin-left: 7px !important; color: #aaa49a !important; font-size: 12px !important; font-weight: 500 !important; } /* ===================================================== 08 - RESPONSIVE ===================================================== */ @media (max-width: 1199px) { body#category #js-product-list .product_list.row { grid-template-columns: repeat(2, minmax(250px, 1fr)) !important; } } @media (max-width: 767px) { body#category #left-column, body#category #left_column, body#category #center_column, body#category #content-wrapper { flex: 0 0 100% !important; max-width: 100% !important; } body#category #js-product-list .product_list.row { grid-template-columns: 1fr !important; } body#category #js-product-list .pro_outer_box { min-height: 405px !important; } body#category #js-product-list .pro_first_box { height: 255px !important; min-height: 255px !important; } } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS PREMIUM V4 FINAL Cartes plus larges / plus boutique / moins étriquées ===================================================== */ /* 01 - Zone produit plus large */ body#category #js-product-list, body#category #product-list-wrap { width: 100% !important; } /* 02 - Grille produits : 3 vraies colonnes larges */ body#category #js-product-list .products.product_list, body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { display: grid !important; grid-template-columns: repeat(3, minmax(285px, 1fr)) !important; gap: 38px !important; align-items: stretch !important; margin: 0 !important; } /* 03 - Neutralise les colonnes Bootstrap/Panda */ body#category #js-product-list .product_list_item, body#category #js-product-list .ajax_block_product, body#category #js-product-list .js-product-miniature { width: 100% !important; max-width: none !important; min-width: 0 !important; flex: none !important; padding: 0 !important; margin: 0 !important; float: none !important; display: block !important; } /* 04 - Carte produit : plus large, plus premium */ body#category #js-product-list .pro_outer_box { width: 100% !important; max-width: none !important; min-width: 0 !important; min-height: 440px !important; border-radius: 28px !important; overflow: hidden !important; background: radial-gradient(circle at 50% 18%, rgba(241,239,229,0.42), transparent 50%), linear-gradient(180deg, #ffffff 0%, #fffdf9 100%) !important; border: 1px solid rgba(125, 135, 101, 0.15) !important; box-shadow: 0 24px 62px rgba(70, 65, 55, 0.09), inset 0 1px 0 rgba(255,255,255,0.95) !important; transition: transform 0.32s ease, box-shadow 0.32s ease, border-color 0.32s ease !important; } body#category #js-product-list .pro_outer_box:hover { transform: translateY(-5px) !important; border-color: rgba(125, 135, 101, 0.26) !important; box-shadow: 0 34px 82px rgba(70, 65, 55, 0.14), inset 0 1px 0 rgba(255,255,255,0.98) !important; } /* 05 - Zone image plus grande */ body#category #js-product-list .pro_first_box { height: 285px !important; min-height: 285px !important; max-height: 285px !important; padding: 26px 26px 8px !important; background: transparent !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } /* 06 - Lien image */ body#category #js-product-list .product_img_link { width: 100% !important; height: 245px !important; min-height: 245px !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } /* 07 - Image produit plus visible mais jamais coupée */ body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img { width: auto !important; height: auto !important; max-width: 94% !important; max-height: 245px !important; object-fit: contain !important; margin: 0 auto !important; padding: 0 !important; transform: none !important; filter: brightness(1) contrast(1.02) !important; transition: transform 0.35s ease, filter 0.35s ease !important; } /* Hover image très doux */ body#category #js-product-list .pro_outer_box:hover .product_img_link img, body#category #js-product-list .pro_outer_box:hover img.front-image { transform: scale(1.018) !important; filter: brightness(0.99) contrast(1.035) !important; } /* Désactive image secondaire qui casse certains cadrages */ body#category #js-product-list .back_image_pic { display: none !important; opacity: 0 !important; visibility: hidden !important; } /* 08 - Zone texte */ body#category #js-product-list .pro_second_box { min-height: 150px !important; padding: 20px 24px 28px !important; background: transparent !important; text-align: center !important; display: flex !important; flex-direction: column !important; align-items: center !important; } /* Nom produit plus lisible */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { max-width: 96% !important; min-height: 42px !important; margin: 0 auto 14px !important; color: #242424 !important; font-size: 13.8px !important; line-height: 1.42 !important; font-weight: 600 !important; letter-spacing: 0.01em !important; text-transform: none !important; text-align: center !important; text-decoration: none !important; } /* Prix plus premium */ body#category #js-product-list .product-price-and-shipping { margin-top: auto !important; text-align: center !important; } body#category #js-product-list .price, body#category #js-product-list span.price { color: #1f1f1f !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 21px !important; font-weight: 700 !important; letter-spacing: -0.01em !important; line-height: 1 !important; } /* TTC discret */ body#category #js-product-list .tax_label { display: block !important; margin: 8px 0 0 0 !important; color: #c7a45a !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; line-height: 1 !important; } /* Prix barré */ body#category #js-product-list .regular-price, body#category #js-product-list .old-price { display: inline-block !important; margin-left: 7px !important; color: #aaa49a !important; font-size: 12px !important; font-weight: 500 !important; } /* 09 - Cœur discret */ body#category #js-product-list .pro_outer_box::after { content: "♡" !important; position: absolute !important; top: 18px !important; right: 18px !important; width: 34px !important; height: 34px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: rgba(255, 255, 255, 0.92) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; color: #9aa186 !important; font-size: 21px !important; line-height: 1 !important; box-shadow: 0 10px 22px rgba(70, 65, 55, 0.08), inset 0 1px 0 rgba(255,255,255,0.95) !important; z-index: 5 !important; } body#category #js-product-list .pro_outer_box:hover::after { color: #c7a45a !important; } /* 10 - Masque les boutons hover Panda pour garder le rendu luxe */ body#category #js-product-list .hover_fly, body#category #js-product-list .hover_fly *, body#category #js-product-list .add_to_cart, body#category #js-product-list .add_to_love, body#category #js-product-list .wishlist_button { display: none !important; visibility: hidden !important; opacity: 0 !important; } /* 11 - Responsive */ @media (max-width: 1199px) { body#category #js-product-list .products.product_list, body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { grid-template-columns: repeat(2, minmax(260px, 1fr)) !important; } } @media (max-width: 767px) { body#category #js-product-list .products.product_list, body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { grid-template-columns: 1fr !important; } body#category #js-product-list .pro_outer_box { min-height: 405px !important; } body#category #js-product-list .pro_first_box { height: 250px !important; min-height: 250px !important; } } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS PREMIUM V5 Rendu plus luxe : images plus grandes + bouton découvrir ===================================================== */ /* Grille plus dense et plus équilibrée */ body#category #js-product-list .products.product_list, body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { display: grid !important; grid-template-columns: repeat(3, minmax(300px, 1fr)) !important; gap: 34px 38px !important; align-items: stretch !important; margin: 0 !important; } /* Carte plus basse et mieux proportionnée */ body#category #js-product-list .pro_outer_box { min-height: 470px !important; border-radius: 30px !important; background: radial-gradient(circle at 50% 18%, rgba(241,239,229,0.55), transparent 52%), linear-gradient(180deg, #ffffff 0%, #fffdf9 100%) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 26px 70px rgba(70, 65, 55, 0.10), inset 0 1px 0 rgba(255,255,255,0.95) !important; } /* Image beaucoup plus présente */ body#category #js-product-list .pro_first_box { height: 315px !important; min-height: 315px !important; max-height: 315px !important; padding: 28px 28px 6px !important; } body#category #js-product-list .product_img_link { height: 285px !important; min-height: 285px !important; } /* Image agrandie mais jamais coupée */ body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img { max-width: 100% !important; max-height: 280px !important; object-fit: contain !important; } /* Hover image très premium, pas agressif */ body#category #js-product-list .pro_outer_box:hover .product_img_link img, body#category #js-product-list .pro_outer_box:hover img.front-image { transform: scale(1.012) !important; filter: brightness(0.995) contrast(1.035) !important; } /* Texte produit mieux posé */ body#category #js-product-list .pro_second_box { min-height: 155px !important; padding: 18px 24px 28px !important; } /* Nom produit plus élégant */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { max-width: 96% !important; min-height: 44px !important; margin: 0 auto 14px !important; color: #232323 !important; font-size: 14px !important; line-height: 1.42 !important; font-weight: 600 !important; letter-spacing: 0.005em !important; text-align: center !important; } /* Prix plus chic */ body#category #js-product-list .price, body#category #js-product-list span.price { font-family: Georgia, "Times New Roman", serif !important; font-size: 22px !important; font-weight: 700 !important; color: #1f1f1f !important; } /* TTC discret sous le prix */ body#category #js-product-list .tax_label { display: block !important; margin-top: 8px !important; color: #c7a45a !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; } /* Boutons hover Panda toujours masqués */ body#category #js-product-list .hover_fly, body#category #js-product-list .hover_fly *, body#category #js-product-list .add_to_cart, body#category #js-product-list .add_to_love, body#category #js-product-list .wishlist_button { display: none !important; visibility: hidden !important; opacity: 0 !important; } /* Bouton premium "Découvrir" ajouté dans le lien produit */ body#category #js-product-list .s_title_block a::after, body#category #js-product-list .product-name a::after, body#category #js-product-list .product-title a::after { content: "Découvrir" !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 18px auto 0 !important; min-width: 118px !important; height: 34px !important; padding: 0 18px !important; border-radius: 999px !important; background: rgba(125, 135, 101, 0.95) !important; color: #ffffff !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; box-shadow: 0 12px 28px rgba(70, 65, 55, 0.14) !important; transition: all 0.24s ease !important; } /* Hover bouton découvrir */ body#category #js-product-list .s_title_block a:hover::after, body#category #js-product-list .product-name a:hover::after, body#category #js-product-list .product-title a:hover::after { background: #6f765c !important; transform: translateY(-1px) !important; } /* Le cœur reste propre */ body#category #js-product-list .pro_outer_box::after { top: 18px !important; right: 18px !important; width: 34px !important; height: 34px !important; background: rgba(255,255,255,0.94) !important; border: 1px solid rgba(125,135,101,0.16) !important; color: #9aa186 !important; } /* Ancien prix plus discret */ body#category #js-product-list .regular-price, body#category #js-product-list .old-price { display: block !important; margin: 6px 0 0 0 !important; color: #aaa49a !important; font-size: 12px !important; } /* Responsive */ @media (max-width: 1199px) { body#category #js-product-list .products.product_list, body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { grid-template-columns: repeat(2, minmax(280px, 1fr)) !important; } } @media (max-width: 767px) { body#category #js-product-list .products.product_list, body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { grid-template-columns: 1fr !important; } body#category #js-product-list .pro_outer_box { min-height: 450px !important; } body#category #js-product-list .pro_first_box { height: 285px !important; min-height: 285px !important; } } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS PREMIUM V6 FINAL CLEAN Suppression faux bouton + finition luxe ===================================================== */ /* Supprime le faux bouton Découvrir qui se transforme en trait */ body#category #js-product-list .s_title_block a::after, body#category #js-product-list .product-name a::after, body#category #js-product-list .product-title a::after { content: none !important; display: none !important; } /* Carte plus élégante, moins haute */ body#category #js-product-list .pro_outer_box { min-height: 425px !important; border-radius: 28px !important; background: radial-gradient(circle at 50% 18%, rgba(241,239,229,0.38), transparent 52%), linear-gradient(180deg, #ffffff 0%, #fffdf9 100%) !important; border: 1px solid rgba(125, 135, 101, 0.15) !important; box-shadow: 0 24px 62px rgba(70, 65, 55, 0.09), inset 0 1px 0 rgba(255,255,255,0.96) !important; } /* Zone image mieux proportionnée */ body#category #js-product-list .pro_first_box { height: 270px !important; min-height: 270px !important; max-height: 270px !important; padding: 26px 26px 4px !important; } /* Image produit premium */ body#category #js-product-list .product_img_link { height: 245px !important; min-height: 245px !important; } body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img { max-width: 96% !important; max-height: 238px !important; object-fit: contain !important; } /* Zone texte plus respirante */ body#category #js-product-list .pro_second_box { min-height: 140px !important; padding: 18px 24px 26px !important; } /* Nom produit */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { max-width: 94% !important; min-height: 40px !important; margin: 0 auto 14px !important; color: #232323 !important; font-size: 13.6px !important; line-height: 1.38 !important; font-weight: 600 !important; letter-spacing: 0.005em !important; text-align: center !important; } /* Petit séparateur premium entre nom et prix */ body#category #js-product-list .product-price-and-shipping::before { content: "" !important; display: block !important; width: 42px !important; height: 1px !important; margin: 0 auto 13px !important; background: linear-gradient(90deg, transparent, #c7a45a, transparent) !important; opacity: 0.8 !important; } /* Prix chic */ body#category #js-product-list .price, body#category #js-product-list span.price { font-family: Georgia, "Times New Roman", serif !important; font-size: 20px !important; font-weight: 700 !important; color: #1f1f1f !important; letter-spacing: -0.01em !important; } /* TTC discret */ body#category #js-product-list .tax_label { display: block !important; margin-top: 7px !important; color: #c7a45a !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; } /* Ancien prix */ body#category #js-product-list .regular-price, body#category #js-product-list .old-price { display: block !important; margin: 6px 0 0 0 !important; color: #aaa49a !important; font-size: 11px !important; font-weight: 500 !important; } /* Coeur plus discret */ body#category #js-product-list .pro_outer_box::after { top: 16px !important; right: 16px !important; width: 31px !important; height: 31px !important; font-size: 19px !important; background: rgba(255,255,255,0.92) !important; border-color: rgba(125,135,101,0.14) !important; color: #9aa186 !important; } /* Hover très doux */ body#category #js-product-list .pro_outer_box:hover { transform: translateY(-4px) !important; border-color: rgba(125,135,101,0.25) !important; box-shadow: 0 32px 76px rgba(70,65,55,0.135), inset 0 1px 0 rgba(255,255,255,0.98) !important; } /* On garde les boutons Panda masqués pour éviter l’effet e-commerce brut */ body#category #js-product-list .hover_fly, body#category #js-product-list .hover_fly *, body#category #js-product-list .add_to_cart, body#category #js-product-list .add_to_love, body#category #js-product-list .wishlist_button { display: none !important; visibility: hidden !important; opacity: 0 !important; } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS PREMIUM V7 Plus de présence / images plus grandes / rendu boutique luxe ===================================================== */ /* Grille plus ample */ body#category #js-product-list .products.product_list, body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { display: grid !important; grid-template-columns: repeat(3, minmax(310px, 1fr)) !important; gap: 42px 42px !important; align-items: stretch !important; margin: 0 !important; } /* Cartes plus larges et plus statut premium */ body#category #js-product-list .pro_outer_box { min-height: 455px !important; border-radius: 30px !important; background: radial-gradient(circle at 50% 20%, rgba(241,239,229,0.55), transparent 50%), linear-gradient(180deg, #ffffff 0%, #fffdf9 100%) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 28px 76px rgba(70, 65, 55, 0.11), inset 0 1px 0 rgba(255,255,255,0.96) !important; } /* Zone image plus grande */ body#category #js-product-list .pro_first_box { height: 295px !important; min-height: 295px !important; max-height: 295px !important; padding: 24px 22px 4px !important; } /* Cadre image */ body#category #js-product-list .product_img_link { height: 270px !important; min-height: 270px !important; overflow: visible !important; } /* Image agrandie pour compenser les marges blanches fournisseur */ body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img { max-width: 108% !important; max-height: 270px !important; object-fit: contain !important; transform: scale(1.12) !important; transform-origin: center center !important; } /* Hover très doux */ body#category #js-product-list .pro_outer_box:hover .product_img_link img, body#category #js-product-list .pro_outer_box:hover img.front-image { transform: scale(1.15) !important; } /* Zone texte plus respirante */ body#category #js-product-list .pro_second_box { min-height: 150px !important; padding: 20px 26px 30px !important; } /* Nom produit plus élégant, moins massif */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { max-width: 92% !important; min-height: 42px !important; margin: 0 auto 14px !important; color: #242424 !important; font-size: 13.8px !important; line-height: 1.42 !important; font-weight: 600 !important; letter-spacing: 0.01em !important; } /* Séparateur prix plus fin */ body#category #js-product-list .product-price-and-shipping::before { width: 52px !important; margin: 0 auto 14px !important; background: linear-gradient(90deg, transparent, rgba(199,164,90,0.95), transparent) !important; } /* Prix chic mais pas trop gros */ body#category #js-product-list .price, body#category #js-product-list span.price { font-family: Georgia, "Times New Roman", serif !important; font-size: 21px !important; font-weight: 700 !important; color: #1f1f1f !important; } /* TTC très discret */ body#category #js-product-list .tax_label { margin-top: 7px !important; color: #c7a45a !important; font-size: 9px !important; letter-spacing: 0.18em !important; } /* Coeur plus fin */ body#category #js-product-list .pro_outer_box::after { top: 17px !important; right: 17px !important; width: 32px !important; height: 32px !important; font-size: 19px !important; } /* Responsive */ @media (max-width: 1199px) { body#category #js-product-list .products.product_list, body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { grid-template-columns: repeat(2, minmax(280px, 1fr)) !important; } } @media (max-width: 767px) { body#category #js-product-list .products.product_list, body#category #js-product-list .product_list.row, body#category #js-product-list .products.row { grid-template-columns: 1fr !important; } body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img { transform: scale(1.05) !important; } } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS PREMIUM V8 FINITION Typographie plus luxe / prix plus élégant / rendu moins brut ===================================================== */ /* Nom produit moins agressif */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { max-width: 88% !important; margin: 0 auto 18px !important; color: #242424 !important; font-size: 13.2px !important; line-height: 1.46 !important; font-weight: 600 !important; letter-spacing: 0.015em !important; text-align: center !important; } /* Séparateur doré plus fin et plus chic */ body#category #js-product-list .product-price-and-shipping::before { content: "" !important; display: block !important; width: 42px !important; height: 1px !important; margin: 0 auto 15px !important; background: linear-gradient( 90deg, transparent, rgba(199, 164, 90, 0.75), transparent ) !important; } /* Prix un peu moins massif */ body#category #js-product-list .price, body#category #js-product-list span.price { font-family: Georgia, "Times New Roman", serif !important; font-size: 20px !important; font-weight: 600 !important; letter-spacing: -0.015em !important; color: #1f1f1f !important; } /* TTC discret et premium */ body#category #js-product-list .tax_label { display: block !important; margin-top: 8px !important; color: #c7a45a !important; font-size: 8.5px !important; font-weight: 800 !important; letter-spacing: 0.20em !important; text-transform: uppercase !important; opacity: 0.88 !important; } /* Ancien prix barré plus propre */ body#category #js-product-list .regular-price, body#category #js-product-list .old-price { display: block !important; margin-top: 7px !important; color: #a9a398 !important; font-size: 11px !important; font-weight: 500 !important; opacity: 0.75 !important; } /* Carte : ombre légèrement plus raffinée */ body#category #js-product-list .pro_outer_box { box-shadow: 0 26px 72px rgba(70, 65, 55, 0.105), inset 0 1px 0 rgba(255,255,255,0.96) !important; } /* Hover plus subtil */ body#category #js-product-list .pro_outer_box:hover { transform: translateY(-4px) !important; box-shadow: 0 34px 86px rgba(70, 65, 55, 0.145), inset 0 1px 0 rgba(255,255,255,0.98) !important; } /* Coeur plus discret */ body#category #js-product-list .pro_outer_box::after { color: rgba(125, 135, 101, 0.72) !important; border-color: rgba(125, 135, 101, 0.13) !important; box-shadow: 0 8px 20px rgba(70, 65, 55, 0.07), inset 0 1px 0 rgba(255,255,255,0.95) !important; } body#category #js-product-list .pro_outer_box:hover::after { color: #c7a45a !important; border-color: rgba(199, 164, 90, 0.28) !important; } /* Image : on évite un zoom trop fort sur certains visuels */ body#category #js-product-list .product_img_link img, body#category #js-product-list img.front-image, body#category #js-product-list .front_image_pic img { transform: scale(1.08) !important; } body#category #js-product-list .pro_outer_box:hover .product_img_link img, body#category #js-product-list .pro_outer_box:hover img.front-image { transform: scale(1.10) !important; } /* ===================================================== FOLIES SECRÈTES - DROPDOWN TRI FINAL PREMIUM Correction chevrons + position + rendu luxe ===================================================== */ /* Le bloc tri doit passer au-dessus des cartes produits */ body#category #js-product-list-top, body#category #js-product-list-top .products-sort-order { position: relative !important; z-index: 80 !important; } /* Dropdown tri au-dessus des produits */ body#category #js-product-list-top .products-sort-order .dropdown_list, body#category #js-product-list-top .products-sort-order .dropdown-menu { position: absolute !important; top: calc(100% + 12px) !important; left: 0 !important; z-index: 999 !important; min-width: 250px !important; padding: 10px !important; border-radius: 18px !important; background: rgba(255, 252, 247, 0.99) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 24px 60px rgba(45, 40, 32, 0.18), inset 0 1px 0 rgba(255,255,255,0.92) !important; overflow: hidden !important; } /* Supprime les chevrons doublés ajoutés en CSS */ body#category #js-product-list-top .products-sort-order .dropdown_list a::before, body#category #js-product-list-top .products-sort-order .dropdown-menu a::before, body#category #js-product-list-top .products-sort-order .select-list::before { content: none !important; display: none !important; } /* Options du dropdown */ body#category #js-product-list-top .products-sort-order .dropdown_list a, body#category #js-product-list-top .products-sort-order .dropdown-menu a, body#category #js-product-list-top .products-sort-order .select-list { position: relative !important; display: flex !important; align-items: center !important; min-height: 40px !important; padding: 0 14px 0 30px !important; border-radius: 11px !important; border: none !important; color: #3f4036 !important; font-size: 13px !important; font-weight: 500 !important; text-decoration: none !important; background: transparent !important; transition: all 0.22s ease !important; } /* Un seul chevron propre */ body#category #js-product-list-top .products-sort-order .dropdown_list a::after, body#category #js-product-list-top .products-sort-order .dropdown-menu a::after, body#category #js-product-list-top .products-sort-order .select-list::after { content: "›" !important; position: absolute !important; left: 13px !important; top: 50% !important; transform: translateY(-50%) !important; color: #c7a45a !important; font-size: 16px !important; line-height: 1 !important; } /* Option au survol */ body#category #js-product-list-top .products-sort-order .dropdown_list a:hover, body#category #js-product-list-top .products-sort-order .dropdown-menu a:hover, body#category #js-product-list-top .products-sort-order .select-list:hover { background: #f3f1e8 !important; color: #6f765c !important; padding-left: 34px !important; } /* Option active */ body#category #js-product-list-top .products-sort-order .dropdown_list a.current, body#category #js-product-list-top .products-sort-order .dropdown-menu a.current, body#category #js-product-list-top .products-sort-order .select-list.current { background: #eeeadd !important; color: #6f765c !important; font-weight: 700 !important; } /* La grille produits reste derrière le dropdown */ body#category #js-product-list { position: relative !important; z-index: 1 !important; } /* ===================================================== FOLIES SECRÈTES - CORRECTIF FINAL TRI + GRILLE PRODUITS Dropdown propre + suppression lignes parasites ===================================================== */ /* Le tri reste au-dessus, mais ne doit pas écraser visuellement les cartes */ body#category #js-product-list-top { z-index: 120 !important; margin-bottom: 46px !important; } /* Dropdown tri : plus compact, plus propre, mieux positionné */ body#category #js-product-list-top .products-sort-order .dropdown_list, body#category #js-product-list-top .products-sort-order .dropdown-menu { top: calc(100% + 10px) !important; left: 0 !important; z-index: 9999 !important; min-width: 245px !important; padding: 9px !important; border-radius: 18px !important; background: rgba(255, 252, 247, 0.995) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 24px 60px rgba(45, 40, 32, 0.18), inset 0 1px 0 rgba(255,255,255,0.92) !important; } /* Options dropdown : pas trop hautes, rendu premium */ body#category #js-product-list-top .products-sort-order .dropdown_list a, body#category #js-product-list-top .products-sort-order .dropdown-menu a, body#category #js-product-list-top .products-sort-order .select-list { min-height: 37px !important; padding: 0 14px 0 30px !important; border-radius: 10px !important; border: none !important; font-size: 12.5px !important; line-height: 1.2 !important; } /* Un seul chevron */ body#category #js-product-list-top .products-sort-order .dropdown_list a::before, body#category #js-product-list-top .products-sort-order .dropdown-menu a::before, body#category #js-product-list-top .products-sort-order .select-list::before { content: none !important; display: none !important; } body#category #js-product-list-top .products-sort-order .dropdown_list a::after, body#category #js-product-list-top .products-sort-order .dropdown-menu a::after, body#category #js-product-list-top .products-sort-order .select-list::after { content: "›" !important; position: absolute !important; left: 13px !important; top: 50% !important; transform: translateY(-50%) !important; color: #c7a45a !important; font-size: 15px !important; } /* Produits derrière le dropdown */ body#category #js-product-list, body#category #js-product-list .products, body#category #js-product-list .product_list { position: relative !important; z-index: 1 !important; } /* Suppression des lignes / bordures parasites sous les produits */ body#category #js-product-list .product_list_item, body#category #js-product-list .ajax_block_product, body#category #js-product-list .products, body#category #js-product-list .product_list, body#category #js-product-list .first-item-of-tablet-line, body#category #js-product-list .last-item-of-tablet-line, body#category #js-product-list .first-item-of-mobile-line, body#category #js-product-list .last-item-of-mobile-line, body#category #js-product-list .first-portrait-line, body#category #js-product-list .last-portrait-line { border: none !important; border-top: none !important; border-bottom: none !important; } /* Bas de liste plus premium */ body#category .bottom_pagination, body#category .pagination, body#category .pagination_bottom { margin-top: 42px !important; padding-top: 0 !important; border-top: none !important; color: #8f897f !important; font-size: 12px !important; } /* Texte "Affichage 1-5..." plus discret */ body#category .bottom_pagination, body#category .bottom_pagination *, body#category .pagination, body#category .pagination * { color: #8f897f !important; font-size: 12px !important; font-weight: 500 !important; } /* ===================================================== FOLIES SECRÈTES - CARTES PRODUITS PREMIUM V9 Alignement prix / prix barré / suppression bouton ajout ===================================================== */ /* Sécurité : aucun bouton ajout panier / aimer dans les cartes catégorie */ body#category #js-product-list .hover_fly, body#category #js-product-list .hover_fly *, body#category #js-product-list .add_to_cart, body#category #js-product-list .add_to_love, body#category #js-product-list .wishlist_button, body#category #js-product-list .ajax_add_to_cart_button { display: none !important; visibility: hidden !important; opacity: 0 !important; } /* Toutes les cartes ont la même logique verticale */ body#category #js-product-list .pro_outer_box { display: flex !important; flex-direction: column !important; min-height: 455px !important; } /* Zone texte fixe pour que les prix tombent au même niveau */ body#category #js-product-list .pro_second_box { flex: 1 1 auto !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; min-height: 155px !important; padding: 18px 24px 26px !important; } /* Nom produit : hauteur réservée identique */ body#category #js-product-list .s_title_block, body#category #js-product-list .s_title_block a, body#category #js-product-list .product-name, body#category #js-product-list .product-name a, body#category #js-product-list .product-title, body#category #js-product-list .product-title a { min-height: 46px !important; max-height: 46px !important; overflow: hidden !important; margin: 0 auto 14px !important; display: flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; } /* Bloc prix : même hauteur pour tous les produits */ body#category #js-product-list .product-price-and-shipping { position: relative !important; width: 100% !important; min-height: 72px !important; height: 72px !important; margin-top: auto !important; padding-top: 15px !important; text-align: center !important; } /* Séparateur doré toujours au même endroit */ body#category #js-product-list .product-price-and-shipping::before { content: "" !important; position: absolute !important; top: 0 !important; left: 50% !important; width: 42px !important; height: 1px !important; background: linear-gradient( 90deg, transparent, rgba(199, 164, 90, 0.75), transparent ) !important; transform: translateX(-50%) !important; } /* Prix principal */ body#category #js-product-list .price, body#category #js-product-list span.price { display: inline-block !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 20px !important; font-weight: 600 !important; line-height: 1 !important; color: #1f1f1f !important; letter-spacing: -0.015em !important; } /* TTC toujours au même niveau */ body#category #js-product-list .tax_label { display: block !important; height: 10px !important; margin-top: 8px !important; color: #c7a45a !important; font-size: 8.5px !important; font-weight: 800 !important; line-height: 10px !important; letter-spacing: 0.20em !important; text-transform: uppercase !important; opacity: 0.88 !important; } /* Prix barré : placé dans l'espace réservé, sans modifier la hauteur */ body#category #js-product-list .regular-price, body#category #js-product-list .old-price { display: block !important; height: 13px !important; margin: 6px 0 0 0 !important; color: #a9a398 !important; font-size: 11px !important; font-weight: 500 !important; line-height: 13px !important; opacity: 0.75 !important; text-decoration: line-through !important; } /* Si pas de prix barré, le bloc conserve quand même la même hauteur */ body#category #js-product-list .product-price-and-shipping::after { content: "" !important; display: block !important; height: 13px !important; margin-top: 6px !important; } /* Quand un vrai ancien prix existe, il occupe la place du faux espace */ body#category #js-product-list .product-price-and-shipping:has(.regular-price)::after, body#category #js-product-list .product-price-and-shipping:has(.old-price)::after { display: none !important; } /* ===================================================== FOLIES SECRÈTES - BLOC CONSEIL SIDEBAR PREMIUM Finition luxe / discret / rassurant ===================================================== */ /* Bloc conseil premium */ body#category #left-column::after, body#category #left_column::after { content: "♡\A BESOIN DE CONSEIL ?\A Notre équipe vous répond en toute discrétion.\A\A NOUS CONTACTER" !important; display: block !important; margin-top: 28px !important; padding: 30px 26px 28px !important; border-radius: 26px !important; background: radial-gradient(circle at 18% 18%, rgba(255,255,255,0.96), transparent 34%), linear-gradient(135deg, #f7f4ec 0%, #eeeadd 100%) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 22px 56px rgba(70, 65, 55, 0.10), inset 0 1px 0 rgba(255,255,255,0.92) !important; white-space: pre-line !important; color: #3f4036 !important; font-size: 13px !important; line-height: 1.58 !important; font-weight: 500 !important; } /* Petit effet typographique global */ body#category #left-column::after, body#category #left_column::after { letter-spacing: 0.01em !important; } /* Le rendu reste propre même si la colonne change de hauteur */ body#category #left-column, body#category #left_column { overflow: visible !important; } /* ===================================================== FOLIES SECRÈTES - BLOC CONSEIL CATÉGORIE PREMIUM Advanced Custom Content / Colonne gauche ===================================================== */ body#category .fs-category-advice-card { position: relative !important; margin-top: 28px !important; padding: 30px 26px 28px !important; border-radius: 26px !important; background: radial-gradient(circle at 18% 18%, rgba(255,255,255,0.96), transparent 34%), linear-gradient(135deg, #f7f4ec 0%, #eeeadd 100%) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 22px 56px rgba(70, 65, 55, 0.10), inset 0 1px 0 rgba(255,255,255,0.92) !important; overflow: hidden !important; } /* Décor discret en fond */ body#category .fs-category-advice-card::after { content: "♡" !important; position: absolute !important; right: -12px !important; bottom: -34px !important; color: rgba(125, 135, 101, 0.10) !important; font-size: 112px !important; line-height: 1 !important; pointer-events: none !important; } /* Icône ronde */ body#category .fs-category-advice-icon { width: 48px !important; height: 48px !important; margin-bottom: 18px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: rgba(255,255,255,0.88) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; color: #8f9677 !important; font-size: 25px !important; box-shadow: 0 10px 24px rgba(70, 65, 55, 0.08) !important; } /* Contenu */ body#category .fs-category-advice-content { position: relative !important; z-index: 2 !important; } /* Petit surtitre */ body#category .fs-category-advice-kicker { margin: 0 0 8px !important; color: #8f9677 !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; } /* Titre */ body#category .fs-category-advice-card h3 { margin: 0 0 12px !important; color: #2d2d2d !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 22px !important; line-height: 1.16 !important; font-weight: 400 !important; letter-spacing: -0.02em !important; } /* Texte */ body#category .fs-category-advice-card p { margin: 0 0 18px !important; color: #4f4b43 !important; font-size: 13px !important; line-height: 1.62 !important; font-weight: 500 !important; } /* Bouton */ body#category .fs-category-advice-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 38px !important; padding: 0 20px !important; border-radius: 999px !important; background: #7d8765 !important; color: #ffffff !important; font-size: 10.5px !important; font-weight: 800 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; text-decoration: none !important; box-shadow: 0 14px 30px rgba(70, 65, 55, 0.16), inset 0 1px 0 rgba(255,255,255,0.22) !important; transition: all 0.24s ease !important; } body#category .fs-category-advice-btn:hover { background: #6f765c !important; color: #ffffff !important; transform: translateY(-1px) !important; } /* Responsive */ @media (max-width: 991px) { body#category .fs-category-advice-card { margin-bottom: 28px !important; } } /* Affiche le bloc conseil uniquement sur les pages catégories */ .fs-category-advice-card { display: none !important; } body#category .fs-category-advice-card { display: block !important; } /* ===================================================== FOLIES SECRÈTES - SIDEBAR CATÉGORIE FINAL PREMIUM Suppression doublon conseil + finition des + ===================================================== */ /* 1. Supprime définitivement l'ancien bloc conseil injecté en CSS */ body#category #left-column::after, body#category #left_column::after { content: none !important; display: none !important; visibility: hidden !important; opacity: 0 !important; } /* 2. Le bloc Advanced Custom Content ne doit pas être enfermé dans une double carte */ body#category #left-column .block:has(.fs-category-advice-card), body#category #left_column .block:has(.fs-category-advice-card), body#category #left-column .stadvancedcustomcontent:has(.fs-category-advice-card), body#category #left_column .stadvancedcustomcontent:has(.fs-category-advice-card), body#category #left-column .stadvancedcontent:has(.fs-category-advice-card), body#category #left_column .stadvancedcontent:has(.fs-category-advice-card) { margin-top: 28px !important; padding: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; } /* 3. Bloc conseil ACC plus large et plus premium */ body#category .fs-category-advice-card { position: relative !important; margin: 0 !important; padding: 30px 26px 28px !important; border-radius: 26px !important; background: radial-gradient(circle at 18% 18%, rgba(255,255,255,0.96), transparent 34%), linear-gradient(135deg, #f7f4ec 0%, #eeeadd 100%) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; box-shadow: 0 22px 56px rgba(70, 65, 55, 0.10), inset 0 1px 0 rgba(255,255,255,0.92) !important; overflow: hidden !important; } /* Décor cœur discret */ body#category .fs-category-advice-card::after { content: "♡" !important; position: absolute !important; right: -10px !important; bottom: -34px !important; color: rgba(125, 135, 101, 0.11) !important; font-size: 112px !important; line-height: 1 !important; pointer-events: none !important; } /* Icône ronde */ body#category .fs-category-advice-icon { width: 48px !important; height: 48px !important; margin-bottom: 18px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: rgba(255,255,255,0.90) !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; color: #8f9677 !important; font-size: 24px !important; box-shadow: 0 10px 24px rgba(70, 65, 55, 0.08) !important; } /* Contenu */ body#category .fs-category-advice-content { position: relative !important; z-index: 2 !important; } /* Surtitre */ body#category .fs-category-advice-kicker { margin: 0 0 10px !important; color: #6f765c !important; font-size: 10px !important; font-weight: 800 !important; line-height: 1.35 !important; letter-spacing: 0.17em !important; text-transform: uppercase !important; } /* Titre */ body#category .fs-category-advice-card h3 { margin: 0 0 12px !important; color: #2d2d2d !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 22px !important; line-height: 1.16 !important; font-weight: 400 !important; letter-spacing: -0.02em !important; } /* Texte */ body#category .fs-category-advice-card p { margin: 0 0 18px !important; color: #4f4b43 !important; font-size: 13px !important; line-height: 1.62 !important; font-weight: 500 !important; } /* Bouton */ body#category .fs-category-advice-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 38px !important; padding: 0 20px !important; border-radius: 999px !important; background: #7d8765 !important; color: #ffffff !important; font-size: 10.5px !important; font-weight: 800 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; text-decoration: none !important; box-shadow: 0 14px 30px rgba(70, 65, 55, 0.16), inset 0 1px 0 rgba(255,255,255,0.22) !important; transition: all 0.24s ease !important; } body#category .fs-category-advice-btn:hover { background: #6f765c !important; color: #ffffff !important; transform: translateY(-1px) !important; } /* ===================================================== 4. FINITION PREMIUM DES + CATÉGORIES ===================================================== */ /* Le + reste utile, mais il doit être plus fin */ body#category #left-column .category-top-menu .navbar-toggler, body#category #left-column .category-top-menu .collapse-icons, body#category #left-column .category-top-menu .add, body#category #left-column .category-top-menu .remove, body#category #left_column .category-top-menu .navbar-toggler, body#category #left_column .category-top-menu .collapse-icons, body#category #left_column .category-top-menu .add, body#category #left_column .category-top-menu .remove { width: 26px !important; height: 26px !important; min-width: 26px !important; border-radius: 50% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #7d8765 !important; font-size: 0 !important; font-weight: 400 !important; background: transparent !important; border: none !important; transition: all 0.22s ease !important; } /* Remplace le + brut par un + typographique plus élégant */ body#category #left-column .category-top-menu .navbar-toggler::before, body#category #left-column .category-top-menu .collapse-icons::before, body#category #left-column .category-top-menu .add::before, body#category #left-column .category-top-menu .remove::before, body#category #left_column .category-top-menu .navbar-toggler::before, body#category #left_column .category-top-menu .collapse-icons::before, body#category #left_column .category-top-menu .add::before, body#category #left_column .category-top-menu .remove::before { content: "+" !important; display: block !important; color: #7d8765 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 21px !important; line-height: 1 !important; font-weight: 300 !important; } /* Hover plus premium */ body#category #left-column .category-top-menu li:hover .navbar-toggler, body#category #left-column .category-top-menu li:hover .collapse-icons, body#category #left-column .category-top-menu li:hover .add, body#category #left-column .category-top-menu li:hover .remove, body#category #left_column .category-top-menu li:hover .navbar-toggler, body#category #left_column .category-top-menu li:hover .collapse-icons, body#category #left_column .category-top-menu li:hover .add, body#category #left_column .category-top-menu li:hover .remove { background: rgba(125,135,101,0.08) !important; } /* Couleur active / hover */ body#category #left-column .category-top-menu li:hover .navbar-toggler::before, body#category #left-column .category-top-menu li:hover .collapse-icons::before, body#category #left-column .category-top-menu li:hover .add::before, body#category #left-column .category-top-menu li:hover .remove::before, body#category #left_column .category-top-menu li:hover .navbar-toggler::before, body#category #left_column .category-top-menu li:hover .collapse-icons::before, body#category #left_column .category-top-menu li:hover .add::before, body#category #left_column .category-top-menu li:hover .remove::before { color: #c7a45a !important; } /* ===================================================== FOLIES SECRÈTES - FINITION BLOC CONSEIL SIDEBAR ===================================================== */ body#category .fs-category-advice-card { padding: 30px 24px 30px !important; } /* Cœur décoratif plus discret */ body#category .fs-category-advice-card::after { right: -18px !important; bottom: -42px !important; font-size: 118px !important; color: rgba(125, 135, 101, 0.075) !important; } /* Texte du bloc conseil un peu plus lisible */ body#category .fs-category-advice-card p { font-size: 12.8px !important; line-height: 1.68 !important; } /* Bouton plus chic et mieux proportionné */ body#category .fs-category-advice-btn { min-height: 36px !important; padding: 0 18px !important; font-size: 10px !important; letter-spacing: 0.055em !important; white-space: nowrap !important; } /* + catégories : encore plus fin */ body#category #left-column .category-top-menu .navbar-toggler::before, body#category #left-column .category-top-menu .collapse-icons::before, body#category #left-column .category-top-menu .add::before, body#category #left-column .category-top-menu .remove::before, body#category #left_column .category-top-menu .navbar-toggler::before, body#category #left_column .category-top-menu .collapse-icons::before, body#category #left_column .category-top-menu .add::before, body#category #left_column .category-top-menu .remove::before { font-size: 20px !important; font-weight: 300 !important; opacity: 0.86 !important; } /* ===================================================== FOLIES SECRÈTES - BAS DE PAGE CATÉGORIE PREMIUM Advanced Custom Content ===================================================== */ /* Par défaut, le bloc est masqué hors catégories */ .fs-category-bottom-premium { display: none !important; } /* Visible uniquement sur les pages catégories */ body#category .fs-category-bottom-premium { display: block !important; max-width: 1180px !important; margin: 56px auto 0 !important; padding: 0 18px !important; } /* ===================================================== 01 - BANDEAU RASSURANCE ===================================================== */ body#category .fs-category-trust-strip { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0 !important; margin-bottom: 34px !important; padding: 24px 26px !important; border-radius: 26px !important; background: rgba(255, 255, 255, 0.92) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; box-shadow: 0 22px 58px rgba(70, 65, 55, 0.075), inset 0 1px 0 rgba(255,255,255,0.95) !important; } /* Item rassurance */ body#category .fs-category-trust-item { display: flex !important; align-items: center !important; gap: 14px !important; padding: 0 22px !important; border-right: 1px solid rgba(125, 135, 101, 0.13) !important; } body#category .fs-category-trust-item:last-child { border-right: none !important; } /* Icône */ body#category .fs-category-trust-icon { width: 44px !important; height: 44px !important; min-width: 44px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: #f7f4ec !important; border: 1px solid rgba(125, 135, 101, 0.16) !important; color: #8f9677 !important; font-size: 20px !important; box-shadow: 0 10px 22px rgba(70, 65, 55, 0.06) !important; } /* Textes */ body#category .fs-category-trust-item strong { display: block !important; margin-bottom: 4px !important; color: #2d2d2d !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; } body#category .fs-category-trust-item span { display: block !important; color: #5b574e !important; font-size: 12.5px !important; line-height: 1.45 !important; font-weight: 500 !important; } /* ===================================================== 02 - BLOC ÉDITORIAL SEO PREMIUM ===================================================== */ body#category .fs-category-editorial-card { display: grid !important; grid-template-columns: 38% 62% !important; min-height: 230px !important; border-radius: 28px !important; overflow: hidden !important; background: linear-gradient(135deg, #ffffff 0%, #fbfaf6 100%) !important; border: 1px solid rgba(125, 135, 101, 0.14) !important; box-shadow: 0 24px 64px rgba(70, 65, 55, 0.085), inset 0 1px 0 rgba(255,255,255,0.95) !important; } /* Partie image décorative */ body#category .fs-category-editorial-image { min-height: 230px !important; background: radial-gradient(circle at 30% 35%, rgba(255,255,255,0.40), transparent 34%), linear-gradient(135deg, rgba(247,244,236,0.92), rgba(222,212,191,0.74)), url("/img/cms/category-editorial-soft.jpg") center/cover no-repeat !important; position: relative !important; } /* Si l'image n'existe pas encore, décor élégant quand même */ body#category .fs-category-editorial-image::after { content: "✿" !important; position: absolute !important; left: 34px !important; bottom: 28px !important; color: rgba(125, 135, 101, 0.22) !important; font-size: 42px !important; line-height: 1 !important; } /* Contenu éditorial */ body#category .fs-category-editorial-content { padding: 44px 54px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; } /* Surtitre */ body#category .fs-category-editorial-kicker { margin: 0 0 12px !important; color: #8f9677 !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0.24em !important; text-transform: uppercase !important; } body#category .fs-category-editorial-kicker::after { content: "" !important; display: inline-block !important; width: 44px !important; height: 1px !important; margin-left: 16px !important; vertical-align: middle !important; background: #c7a45a !important; } /* Titre */ body#category .fs-category-editorial-content h2 { margin: 0 0 16px !important; color: #242424 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 32px !important; line-height: 1.12 !important; font-weight: 400 !important; letter-spacing: -0.025em !important; } /* Paragraphes */ body#category .fs-category-editorial-content p { max-width: 680px !important; margin: 0 0 12px !important; color: #4f4b43 !important; font-size: 14px !important; line-height: 1.72 !important; font-weight: 500 !important; } body#category .fs-category-editorial-content p:last-child { margin-bottom: 0 !important; } /* ===================================================== 03 - RESPONSIVE ===================================================== */ @media (max-width: 1199px) { body#category .fs-category-trust-strip { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 20px 0 !important; } body#category .fs-category-trust-item:nth-child(2) { border-right: none !important; } } @media (max-width: 767px) { body#category .fs-category-bottom-premium { margin-top: 38px !important; padding: 0 14px !important; } body#category .fs-category-trust-strip { grid-template-columns: 1fr !important; padding: 22px !important; } body#category .fs-category-trust-item { border-right: none !important; border-bottom: 1px solid rgba(125, 135, 101, 0.12) !important; padding: 0 0 18px !important; } body#category .fs-category-trust-item:last-child { border-bottom: none !important; padding-bottom: 0 !important; } body#category .fs-category-editorial-card { grid-template-columns: 1fr !important; } body#category .fs-category-editorial-image { min-height: 170px !important; } body#category .fs-category-editorial-content { padding: 32px 26px !important; } body#category .fs-category-editorial-content h2 { font-size: 28px !important; } } /* ===================================================== FOLIES SECRÈTES - BAS CATÉGORIE FINITION PREMIUM Image éditoriale + compteur produits discret ===================================================== */ /* Compteur produits plus discret */ body#category .bottom_pagination, body#category .bottom_pagination *, body#category .pagination, body#category .pagination *, body#category .product-count, body#category .product-count * { color: #8f897f !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.02em !important; } /* Espace avant le bloc rassurance */ body#category .fs-category-bottom-premium { margin-top: 54px !important; } /* Image éditoriale plus premium même sans fichier image */ body#category .fs-category-editorial-image { position: relative !important; overflow: hidden !important; background: radial-gradient(circle at 24% 26%, rgba(255,255,255,0.62), transparent 30%), radial-gradient(circle at 78% 82%, rgba(199,164,90,0.16), transparent 32%), linear-gradient(135deg, #f8f5ed 0%, #eee8da 52%, #ddd3bf 100%) !important; } /* Grand décor floral discret */ body#category .fs-category-editorial-image::before { content: "♡" !important; position: absolute !important; right: 42px !important; top: 38px !important; color: rgba(125, 135, 101, 0.10) !important; font-size: 132px !important; line-height: 1 !important; } /* Fleur plus élégante en bas */ body#category .fs-category-editorial-image::after { content: "✿" !important; position: absolute !important; left: 46px !important; bottom: 34px !important; color: rgba(125, 135, 101, 0.20) !important; font-size: 46px !important; line-height: 1 !important; } /* Petite texture premium */ body#category .fs-category-editorial-image span, body#category .fs-category-editorial-image p { display: none !important; } /* Bloc éditorial un peu plus luxueux */ body#category .fs-category-editorial-card { box-shadow: 0 28px 74px rgba(70,65,55,0.10), inset 0 1px 0 rgba(255,255,255,0.96) !important; } /* Texte éditorial plus confortable */ body#category .fs-category-editorial-content { padding: 48px 58px !important; } body#category .fs-category-editorial-content h2 { font-size: 34px !important; margin-bottom: 18px !important; } body#category .fs-category-editorial-content p { font-size: 14.2px !important; line-height: 1.78 !important; } /* Bandeau rassurance encore plus premium */ body#category .fs-category-trust-strip { box-shadow: 0 24px 64px rgba(70,65,55,0.085), inset 0 1px 0 rgba(255,255,255,0.96) !important; } body#category .fs-category-trust-icon { background: linear-gradient(135deg, #fffdf8 0%, #f1efe5 100%) !important; } body#category .fs-category-editorial-image { background: linear-gradient(135deg, rgba(247,244,236,0.10), rgba(222,212,191,0.18)), url("/img/cms/category-editorial-soft.jpg") center center / cover no-repeat !important; } body#category .fs-category-editorial-image::before, body#category .fs-category-editorial-image::after { display: none !important; } /* ===================================================== FOLIES SECRÈTES - RACCOURCIS CATÉGORIES HOME V2 8 entrées alignées : Indispensables à Chroniques ===================================================== */ .fs-category-shortcuts { display: grid !important; grid-template-columns: repeat(8, minmax(0, 1fr)) !important; gap: 24px !important; align-items: start !important; justify-items: center !important; max-width: 1240px !important; margin-left: auto !important; margin-right: auto !important; } .fs-category-shortcuts .fs-category-item { width: 100% !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; text-align: center !important; } .fs-category-shortcuts .fs-category-icon { width: 72px !important; height: 72px !important; min-width: 72px !important; min-height: 72px !important; margin-bottom: 14px !important; } .fs-category-shortcuts .fs-category-item span:last-child { font-size: 13px !important; line-height: 1.2 !important; letter-spacing: 0.04em !important; white-space: nowrap !important; } /* Chroniques sans lien pour l’instant */ .fs-category-item-disabled { cursor: default !important; pointer-events: none !important; opacity: 0.86 !important; } .fs-category-item-disabled .fs-category-icon { opacity: 0.95 !important; } /* Tablette : 4 par ligne */ @media (max-width: 991px) { .fs-category-shortcuts { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 24px 18px !important; max-width: 720px !important; } } /* Mobile : 2 par ligne */ @media (max-width: 575px) { .fs-category-shortcuts { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 22px 14px !important; max-width: 100% !important; } .fs-category-shortcuts .fs-category-icon { width: 64px !important; height: 64px !important; min-width: 64px !important; min-height: 64px !important; } .fs-category-shortcuts .fs-category-item span:last-child { font-size: 12px !important; white-space: normal !important; } } /* ===================================================== FOLIES SECRÈTES - FOOTER GLOBAL FINAL SANS WRAPPER Version nettoyée compatible Tracking code Panda Le HTML commence directement par .fs-footer-reassurance-top ===================================================== */ /* Masque les blocs newsletter natifs PrestaShop/Panda affichés en brut */ #blockEmailSubscription_displayFooterBefore, #blockEmailSubscription_displayFooter, #blockEmailSubscription_footer, #ps_emailsubscription_displayFooterBefore, #ps_emailsubscription_displayFooter, #ps_emailsubscription_footer, .block_newsletter:not(.fs-newsletter-band), .newsletter_block:not(.fs-newsletter-band), .st_newsletter_block, .stnewsletter, .st_news_letter { display: none !important; height: 0 !important; min-height: 0 !important; max-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; border: 0 !important; background: transparent !important; } /* Neutralise le footer Panda natif sans masquer notre footer injecté */ footer#footer.footer-container { margin: 0 !important; padding: 0 !important; min-height: 0 !important; background: transparent !important; } footer#footer.footer-container #footer-before-container:empty, footer#footer.footer-container #footer-primary-container, footer#footer.footer-container .footer-primary-container, footer#footer.footer-container .stlinkgroups_links_footer, footer#footer.footer-container .footer_block, footer#footer.footer-container #footer-bottom, footer#footer.footer-container #footer_bottom, footer#footer.footer-container .copyright, footer#footer.footer-container .copyright-container, footer#footer.footer-container .footer-copyright { display: none !important; height: 0 !important; min-height: 0 !important; max-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; border: none !important; } /* Évite une micro barre horizontale avec les blocs 100vw */ html, body { overflow-x: hidden !important; } /* Partie sombre : rassurance + contenu + copyright */ body .fs-footer-reassurance-top, body .fs-footer-content, body .fs-footer-bottom { position: relative !important; left: 50% !important; width: 100vw !important; max-width: 100vw !important; margin-left: -50vw !important; margin-right: -50vw !important; box-sizing: border-box !important; background: radial-gradient(circle at 15% 0%, rgba(199,164,90,0.16), transparent 29%), radial-gradient(circle at 82% 34%, rgba(231,71,114,0.03), transparent 31%), linear-gradient(135deg, #171c16 0%, #1b2019 48%, #11150f 100%) !important; color: #fffaf0 !important; } body .fs-footer-reassurance-top { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0 !important; padding: 34px max(28px, calc((100vw - 1480px) / 2 + 28px)) 24px !important; border-top: 1px solid rgba(199,164,90,0.32) !important; border-bottom: 1px solid rgba(199,164,90,0.22) !important; } /* Phase A.1 — homepage : masquer reassurance footer (doublon #53) */ body#index .fs-footer-reassurance-top { display: none !important; } body .fs-footer-content { display: grid !important; grid-template-columns: 1.25fr 0.9fr 1.1fr 1.05fr 1.15fr !important; gap: 42px !important; align-items: start !important; padding: 32px max(28px, calc((100vw - 1480px) / 2 + 28px)) 30px !important; } body .fs-footer-bottom { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; padding: 18px max(28px, calc((100vw - 1480px) / 2 + 28px)) !important; border-top: 1px solid rgba(199,164,90,0.22) !important; } body .fs-footer-reassurance-top, body .fs-footer-content, body .fs-footer-bottom, body .fs-footer-reassurance-top span, body .fs-footer-content p, body .fs-footer-content span, body .fs-footer-content li, body .fs-footer-content a, body .fs-footer-bottom, body .fs-footer-bottom span { color: rgba(255,250,240,0.84) !important; } body .fs-footer-reassurance-item strong, body .fs-footer-col h3, body .fs-footer-contact h3, body .fs-footer-contact-item strong { color: #fffaf0 !important; } body .fs-footer-icon, body .fs-footer-contact-item > span, body .fs-footer-payments span, body .fs-footer-payments strong, body .fs-footer-mini-newsletter button, body .fs-footer-socials a { color: #d3b56b !important; border-color: rgba(211,181,107,0.55) !important; } body .fs-footer-col h3, body .fs-footer-contact h3 { font-family: Georgia, "Times New Roman", serif !important; font-size: 18px !important; line-height: 1.1 !important; font-weight: 500 !important; text-transform: uppercase !important; letter-spacing: 0.03em !important; margin: 0 0 20px !important; } body .fs-footer-col h3::after, body .fs-footer-contact h3::after { content: "" !important; display: block !important; width: 42px !important; height: 1px !important; margin-top: 12px !important; background: #d3b56b !important; } body .fs-footer-col ul { list-style: none !important; margin: 0 !important; padding: 0 !important; } body .fs-footer-col li { margin: 0 0 10px !important; padding: 0 !important; } body .fs-footer-col a, body .fs-footer-contact a { text-decoration: none !important; font-size: 14px !important; } body .fs-footer-col a:hover, body .fs-footer-contact a:hover, body .fs-footer-main a:hover { color: #d3b56b !important; } body .fs-footer-brand { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; text-align: center !important; border-right: 1px solid rgba(199,164,90,0.22) !important; padding-right: 36px !important; } body .fs-footer-brand .fs-footer-logo, body .fs-footer-logo { display: block !important; width: 280px !important; max-width: 100% !important; height: auto !important; margin: -28px auto -16px auto !important; transform: translateX(0) !important; } body .fs-footer-brand p { max-width: 310px !important; margin: 0 auto 18px !important; text-align: center !important; font-size: 14px !important; line-height: 1.65 !important; color: rgba(255,250,240,0.86) !important; } body .fs-footer-about-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 38px !important; margin-left: auto !important; margin-right: auto !important; padding: 0 24px !important; border-radius: 999px !important; border: 1px solid rgba(211,181,107,0.72) !important; color: #fffaf0 !important; font-size: 12px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0.08em !important; text-decoration: none !important; } body .fs-footer-about-btn:hover { background: rgba(211,181,107,0.16) !important; color: #d3b56b !important; } body .fs-footer-reassurance-item { text-align: center !important; padding: 0 24px !important; border-right: 1px solid rgba(199,164,90,0.20) !important; } body .fs-footer-reassurance-item:last-child { border-right: none !important; } body .fs-footer-icon { width: 44px !important; height: 44px !important; margin: 0 auto 14px !important; border-radius: 50% !important; border: 1px solid rgba(211,181,107,0.58) !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 20px !important; } body .fs-footer-reassurance-item strong { display: block !important; font-size: 14px !important; text-transform: uppercase !important; letter-spacing: 0.04em !important; margin-bottom: 6px !important; } body .fs-footer-reassurance-item span { display: block !important; font-size: 13px !important; } body .fs-footer-contact-item { display: flex !important; gap: 12px !important; align-items: flex-start !important; margin-bottom: 20px !important; } body .fs-footer-contact-item p { margin: 4px 0 0 !important; font-size: 14px !important; line-height: 1.55 !important; } body .fs-footer-mini-newsletter { display: flex !important; align-items: center !important; height: 44px !important; margin-top: 18px !important; border: 1px solid rgba(211,181,107,0.55) !important; border-radius: 999px !important; overflow: hidden !important; } /* Phase A.2 — homepage : masquer mini-newsletter footer (doublon #59) */ body#index .fs-footer-mini-newsletter { display: none !important; } body .fs-footer-mini-newsletter input { flex: 1 !important; height: 100% !important; border: none !important; background: transparent !important; color: #fffaf0 !important; font-size: 13px !important; padding: 0 16px !important; outline: none !important; } body .fs-footer-mini-newsletter input::placeholder { color: rgba(255,250,240,0.62) !important; opacity: 1 !important; } body .fs-footer-mini-newsletter button { width: 48px !important; height: 100% !important; border: none !important; background: transparent !important; cursor: pointer !important; } body .fs-footer-socials { display: flex !important; justify-content: center !important; gap: 10px !important; margin-top: 16px !important; } body .fs-footer-socials a { width: 32px !important; height: 32px !important; border-radius: 50% !important; border: 1px solid rgba(211,181,107,0.58) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; text-decoration: none !important; } body .fs-footer-payments { display: flex !important; align-items: center !important; gap: 14px !important; flex-wrap: wrap !important; text-transform: uppercase !important; } body .fs-footer-payments span { font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.12em !important; } body .fs-footer-payments strong { font-size: 14px !important; } body .fs-footer-final-strip { position: relative !important; left: 50% !important; width: 100vw !important; max-width: 100vw !important; margin-left: -50vw !important; margin-right: -50vw !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0 !important; padding: 20px max(28px, calc((100vw - 1480px) / 2 + 28px)) !important; background: linear-gradient(180deg, #fffaf2 0%, #fbf7ef 100%) !important; border-top: 1px solid rgba(199,164,90,0.18) !important; color: #26261f !important; } body .fs-footer-final-strip div { text-align: center !important; padding: 0 20px !important; border-right: 1px solid rgba(80,75,60,0.16) !important; } body .fs-footer-final-strip div:last-child { border-right: none !important; } body .fs-footer-final-strip strong { display: block !important; color: #26261f !important; font-size: 13px !important; text-transform: uppercase !important; letter-spacing: 0.08em !important; margin-bottom: 5px !important; } body .fs-footer-final-strip span { display: block !important; color: #5f5a50 !important; font-size: 13px !important; } @media (max-width: 1199px) { body .fs-footer-content { grid-template-columns: 1fr 1fr !important; gap: 34px !important; } body .fs-footer-brand { border-right: none !important; padding-right: 0 !important; } } @media (max-width: 767px) { body .fs-footer-reassurance-top { grid-template-columns: 1fr !important; gap: 20px !important; padding: 30px 22px 24px !important; } body .fs-footer-reassurance-item { border-right: none !important; padding: 0 !important; } body .fs-footer-content { grid-template-columns: 1fr !important; padding: 30px 22px !important; gap: 28px !important; text-align: center !important; } body .fs-footer-brand { padding-right: 0 !important; } body .fs-footer-brand .fs-footer-logo, body .fs-footer-logo { width: 360px !important; max-width: 100% !important; margin: -32px auto -22px !important; } body .fs-footer-col h3::after, body .fs-footer-contact h3::after { margin-left: auto !important; margin-right: auto !important; } body .fs-footer-contact-item { justify-content: center !important; text-align: left !important; } body .fs-footer-bottom { flex-direction: column !important; text-align: center !important; padding: 22px !important; } body .fs-footer-payments { justify-content: center !important; } body .fs-footer-final-strip { grid-template-columns: 1fr !important; padding: 22px !important; gap: 18px !important; } body .fs-footer-final-strip div { border-right: none !important; padding: 0 !important; } } /* ===================================================== FOLIES SECRÈTES - LOGO HEADER PLUS VISIBLE ===================================================== */ /* Desktop large uniquement (≥1441px) — medium géré plus haut (01b) */ @media (min-width: 1441px) { #header .logo img, #st_header #header_left img.logo, #header_left img.logo, .logo img, .header_logo img { width: 280px !important; max-width: 280px !important; height: auto !important; max-height: 82px !important; } #header .header-top, #header .header-container, #header_primary_container, #header_primary_row { min-height: 100px !important; } #st_header #header_primary_row, #header_primary_row, #header_primary_row.flex_container, #header_primary_row.flex_container.logo_left { grid-template-columns: 295px minmax(0, 1fr) 280px !important; } #st_header #header_left, #header_left { max-width: 295px !important; } } /* Header medium (992–1440px) : logo compact */ @media (min-width: 992px) and (max-width: 1440px) { #header .logo img, #st_header #header_left img.logo, #header_left img.logo, .logo img, .header_logo img { width: 168px !important; max-width: 168px !important; height: auto !important; max-height: 56px !important; } } @media (min-width: 992px) and (max-width: 1199px) { #header .logo img, #st_header #header_left img.logo, #header_left img.logo, .logo img, .header_logo img { width: 150px !important; max-width: 150px !important; max-height: 52px !important; } } @media (min-width: 1200px) and (max-width: 1440px) { #header .logo img, #st_header #header_left img.logo, #header_left img.logo, .logo img, .header_logo img { width: 198px !important; max-width: 198px !important; max-height: 64px !important; } #st_header #header_primary_row, #header_primary_row, #header_primary_row.flex_container, #header_primary_row.flex_container.logo_left { grid-template-columns: minmax(0, 198px) minmax(0, 1fr) minmax(0, 248px) !important; } #st_header #header_left, #header_left { max-width: 198px !important; } } /* Mobile */ @media (max-width: 767px) { #header .logo img, #st_header #header_left img.logo, #header_left img.logo, .logo img, .header_logo img { width: 210px !important; max-width: 210px !important; max-height: 68px !important; } } /* ========================================================= FOLIES SECRÈTES - PAGE DROIT DE RÉTRACTATION Design CMS premium ========================================================= */ .fs-cms-premium.fs-withdrawal-page { max-width: 1180px; margin: 0 auto; padding: 34px 18px 56px; color: #2b1f25; font-family: inherit; } /* HERO */ .fs-withdrawal-page .fs-cms-hero { position: relative; overflow: hidden; padding: 54px 42px; border-radius: 30px; background: radial-gradient(circle at top left, rgba(231, 71, 114, 0.18), transparent 34%), linear-gradient(135deg, #fff7fa 0%, #fff 48%, #f8edf1 100%); border: 1px solid rgba(231, 71, 114, 0.18); box-shadow: 0 22px 60px rgba(61, 33, 43, 0.08); text-align: center; margin-bottom: 34px; } .fs-withdrawal-page .fs-cms-hero::before { content: ""; position: absolute; inset: 16px; border: 1px solid rgba(231, 71, 114, 0.14); border-radius: 24px; pointer-events: none; } .fs-withdrawal-page .fs-cms-kicker { display: inline-flex; align-items: center; justify-content: center; margin: 0 0 14px; padding: 8px 18px; border-radius: 999px; background: rgba(231, 71, 114, 0.10); color: #c73560; font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; } .fs-withdrawal-page .fs-cms-hero h1 { margin: 0 0 18px; color: #22171d; font-size: clamp(32px, 4vw, 52px); line-height: 1.08; font-weight: 800; letter-spacing: -0.035em; } .fs-withdrawal-page .fs-cms-intro { max-width: 820px; margin: 0 auto; color: #6b5961; font-size: 17px; line-height: 1.8; } /* SECTIONS */ .fs-withdrawal-page .fs-cms-section, .fs-withdrawal-page .fs-cms-card { background: #ffffff; border: 1px solid rgba(231, 71, 114, 0.13); border-radius: 26px; box-shadow: 0 18px 44px rgba(56, 32, 41, 0.065); } .fs-withdrawal-page .fs-cms-section { padding: 34px 36px; margin-bottom: 24px; } .fs-withdrawal-page .fs-cms-highlight { background: linear-gradient(135deg, rgba(231, 71, 114, 0.10), rgba(255, 255, 255, 0.96)), #ffffff; border-color: rgba(231, 71, 114, 0.20); } .fs-withdrawal-page .fs-cms-soft { background: radial-gradient(circle at top right, rgba(231, 71, 114, 0.11), transparent 36%), #fffafd; } .fs-withdrawal-page .fs-cms-warning { background: linear-gradient(135deg, #fff7fa 0%, #ffffff 55%, #fff3f7 100%); border: 1px solid rgba(231, 71, 114, 0.28); box-shadow: 0 20px 50px rgba(231, 71, 114, 0.10); } .fs-withdrawal-page .fs-cms-section h2, .fs-withdrawal-page .fs-cms-card h2 { margin: 0 0 16px; color: #2a1921; font-size: 24px; line-height: 1.25; font-weight: 800; letter-spacing: -0.02em; } .fs-withdrawal-page .fs-cms-section p, .fs-withdrawal-page .fs-cms-card p { margin: 0 0 14px; color: #64545b; font-size: 15.8px; line-height: 1.78; } .fs-withdrawal-page .fs-cms-section p:last-child, .fs-withdrawal-page .fs-cms-card p:last-child { margin-bottom: 0; } .fs-withdrawal-page strong { color: #2b1f25; font-weight: 800; } /* GRIDS */ .fs-withdrawal-page .fs-cms-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-bottom: 24px; } .fs-withdrawal-page .fs-cms-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fs-withdrawal-page .fs-cms-card { position: relative; padding: 30px 28px; overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; } .fs-withdrawal-page .fs-cms-card::after { content: ""; position: absolute; top: -70px; right: -70px; width: 150px; height: 150px; border-radius: 999px; background: rgba(231, 71, 114, 0.08); pointer-events: none; } .fs-withdrawal-page .fs-cms-card:hover { transform: translateY(-4px); border-color: rgba(231, 71, 114, 0.28); box-shadow: 0 24px 58px rgba(56, 32, 41, 0.10); } .fs-withdrawal-page .fs-cms-card-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; margin-bottom: 18px; border-radius: 50%; background: linear-gradient(135deg, #e74772, #c73560); color: #ffffff; font-size: 14px; font-weight: 800; box-shadow: 0 12px 24px rgba(231, 71, 114, 0.22); } /* FORMULAIRE */ .fs-withdrawal-page .fs-cms-form-box { margin-top: 24px; padding: 28px; border-radius: 22px; background: linear-gradient(135deg, #fff9fb 0%, #ffffff 100%); border: 1px dashed rgba(231, 71, 114, 0.34); } .fs-withdrawal-page .fs-cms-form-box h3 { margin: 0 0 16px; color: #2a1921; font-size: 20px; font-weight: 800; } .fs-withdrawal-page .fs-cms-form-box p { color: #57464e; } /* RESPONSIVE */ @media (max-width: 991px) { .fs-cms-premium.fs-withdrawal-page { padding: 24px 14px 44px; } .fs-withdrawal-page .fs-cms-hero { padding: 42px 26px; border-radius: 24px; } .fs-withdrawal-page .fs-cms-grid, .fs-withdrawal-page .fs-cms-grid-two { grid-template-columns: 1fr; } .fs-withdrawal-page .fs-cms-section, .fs-withdrawal-page .fs-cms-card { padding: 28px 24px; border-radius: 22px; } } @media (max-width: 575px) { .fs-withdrawal-page .fs-cms-hero { padding: 36px 20px; } .fs-withdrawal-page .fs-cms-hero::before { inset: 10px; border-radius: 20px; } .fs-withdrawal-page .fs-cms-intro { font-size: 15.5px; line-height: 1.72; } .fs-withdrawal-page .fs-cms-section h2, .fs-withdrawal-page .fs-cms-card h2 { font-size: 21px; } .fs-withdrawal-page .fs-cms-section p, .fs-withdrawal-page .fs-cms-card p { font-size: 15px; } .fs-withdrawal-page .fs-cms-form-box { padding: 22px; } } /* ========================================================= RETOUCHE PREMIUM - BAS DE PAGE DROIT DE RÉTRACTATION À ajouter à la fin du CSS existant ========================================================= */ /* Donne plus de présence aux sections simples du bas */ .fs-withdrawal-page .fs-cms-section:not(.fs-cms-highlight):not(.fs-cms-warning):not(.fs-cms-soft) { position: relative; padding: 34px 38px; margin: 26px auto; max-width: 980px; background: linear-gradient(135deg, rgba(255, 247, 250, 0.95), rgba(255, 255, 255, 0.98)), #ffffff; border: 1px solid rgba(231, 71, 114, 0.16); border-radius: 26px; box-shadow: 0 18px 46px rgba(43, 31, 37, 0.075); } /* Petit liseré premium en haut des blocs */ .fs-withdrawal-page .fs-cms-section:not(.fs-cms-highlight):not(.fs-cms-warning):not(.fs-cms-soft)::before { content: ""; position: absolute; top: 0; left: 34px; right: 34px; height: 3px; border-radius: 0 0 999px 999px; background: linear-gradient(90deg, transparent, #e74772, #c9a45c, transparent); opacity: 0.8; } /* Titre plus élégant */ .fs-withdrawal-page .fs-cms-section h2 { position: relative; margin-bottom: 18px; padding-bottom: 12px; color: #2a1d23; font-size: 24px; font-weight: 800; letter-spacing: -0.02em; } /* Soulignement discret sous les titres */ .fs-withdrawal-page .fs-cms-section h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 58px; height: 2px; border-radius: 999px; background: linear-gradient(90deg, #e74772, #c9a45c); } /* Texte plus lisible */ .fs-withdrawal-page .fs-cms-section p { max-width: 880px; color: #5d4d54; font-size: 16px; line-height: 1.82; } /* Bloc hygiène plus premium et plus visible */ .fs-withdrawal-page .fs-cms-warning { position: relative; max-width: 980px; margin: 30px auto; padding: 36px 40px; background: radial-gradient(circle at top right, rgba(231, 71, 114, 0.14), transparent 34%), linear-gradient(135deg, #fff5f8 0%, #ffffff 58%, #fff8fb 100%); border: 1px solid rgba(231, 71, 114, 0.30); border-radius: 28px; box-shadow: 0 22px 58px rgba(231, 71, 114, 0.12); } /* Icône discrète sur le bloc hygiène */ .fs-withdrawal-page .fs-cms-warning::before { content: "!"; position: absolute; top: 28px; right: 32px; width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, #e74772, #c73560); color: #ffffff; font-size: 20px; font-weight: 800; line-height: 38px; text-align: center; box-shadow: 0 12px 26px rgba(231, 71, 114, 0.25); } /* Le titre du bloc warning garde une bonne marge avec l’icône */ .fs-withdrawal-page .fs-cms-warning h2 { padding-right: 58px; } /* Cartes frais de retour / remboursement plus haut de gamme */ .fs-withdrawal-page .fs-cms-grid-two { max-width: 980px; margin: 28px auto; gap: 24px; } .fs-withdrawal-page .fs-cms-grid-two .fs-cms-card { background: linear-gradient(135deg, #ffffff 0%, #fff9fb 100%); border: 1px solid rgba(231, 71, 114, 0.16); border-radius: 24px; box-shadow: 0 18px 44px rgba(43, 31, 37, 0.075); } /* Formulaire de rétractation plus premium */ .fs-withdrawal-page .fs-cms-form-box { margin-top: 26px; padding: 30px 32px; border-radius: 24px; background: linear-gradient(135deg, rgba(255, 247, 250, 0.95), #ffffff); border: 1px dashed rgba(231, 71, 114, 0.38); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.75); } .fs-withdrawal-page .fs-cms-form-box h3 { margin-bottom: 18px; color: #2a1d23; font-size: 21px; font-weight: 800; } .fs-withdrawal-page .fs-cms-form-box p { color: #56464d; font-size: 15.5px; line-height: 1.85; } /* Bloc final besoin d’aide */ .fs-withdrawal-page .fs-cms-soft { max-width: 980px; margin: 30px auto 0; padding: 34px 38px; background: radial-gradient(circle at top left, rgba(201, 164, 92, 0.14), transparent 36%), linear-gradient(135deg, #fffaf4 0%, #ffffff 62%, #fff7fa 100%); border: 1px solid rgba(201, 164, 92, 0.24); border-radius: 28px; box-shadow: 0 20px 50px rgba(43, 31, 37, 0.075); } /* Responsive */ @media (max-width: 767px) { .fs-withdrawal-page .fs-cms-section:not(.fs-cms-highlight):not(.fs-cms-warning):not(.fs-cms-soft), .fs-withdrawal-page .fs-cms-warning, .fs-withdrawal-page .fs-cms-soft { padding: 28px 24px; border-radius: 22px; } .fs-withdrawal-page .fs-cms-warning::before { position: static; display: block; margin-bottom: 16px; } .fs-withdrawal-page .fs-cms-warning h2 { padding-right: 0; } .fs-withdrawal-page .fs-cms-section p { font-size: 15px; line-height: 1.75; } } /* ========================================================= FOLIES SECRÈTES - PAGE CONTACTEZ-NOUS PREMIUM MEUBLÉE CSS COMPLET FINAL - VERSION LARGE 2 COLONNES ========================================================= */ /* ========================================================= 1. NETTOYAGE DES ANCIENNES RÈGLES CONTACT ========================================================= */ body#contact #main::before, body#contact #main::after, body#contact #content::before, body#contact #content::after, body#contact .page-content::before, body#contact .page-content::after, body#contact .contact-form::before, body#contact .contact-form::after, body#contact .contact-form h1::before, body#contact .contact-form h3::before, body#contact .contact-form .h3::before, body#contact .contact-form form::before { content: none !important; display: none !important; } /* Reset des anciennes largeurs qui cassaient la page */ body#contact .contact-form, body#contact section.contact-form, body#contact .contact-form form { max-width: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; float: none !important; clear: none !important; box-shadow: none !important; border: 0 !important; background: transparent !important; border-radius: 0 !important; } /* ========================================================= 2. STRUCTURE GÉNÉRALE PAGE ========================================================= */ body#contact { background: #f8f5ef !important; } body#contact #wrapper, body#contact #content-wrapper, body#contact #main, body#contact #content, body#contact .page-content { background: #f8f5ef !important; } body#contact #main, body#contact #content, body#contact .page-content { width: 100% !important; max-width: none !important; margin: 0 auto !important; padding: 0 !important; float: none !important; } /* Fil d’Ariane */ body#contact .breadcrumb, body#contact .breadcrumb ol, body#contact .breadcrumb li, body#contact .breadcrumb a { font-size: 13px !important; color: #7d7468 !important; } /* ========================================================= 3. WRAPPER PREMIUM ========================================================= */ body#contact .fs-contact-premium { width: 100% !important; max-width: 1180px !important; margin: 0 auto !important; padding: 54px 24px 78px !important; box-sizing: border-box !important; } /* Hero */ body#contact .fs-contact-hero { max-width: 760px !important; margin: 0 auto 38px !important; text-align: center !important; } body#contact .fs-contact-kicker { margin: 0 0 8px !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; color: #b89a4f !important; } body#contact .fs-contact-hero h1 { margin: 0 0 14px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 38px !important; font-weight: 500 !important; line-height: 1.15 !important; color: #28251f !important; } body#contact .fs-contact-intro { max-width: 680px !important; margin: 0 auto !important; font-size: 15px !important; line-height: 1.8 !important; color: #6f675d !important; } /* ========================================================= 4. GRILLE 2 COLONNES ========================================================= */ body#contact .fs-contact-layout { display: grid !important; grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr) !important; gap: 34px !important; align-items: start !important; width: 100% !important; max-width: 980px !important; margin: 0 auto !important; } /* ========================================================= 5. CARTE FORMULAIRE ========================================================= */ body#contact .fs-contact-form-card, body#contact .fs-contact-premium .contact-form { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 42px 42px 40px !important; background: #fffdfa !important; border: 1px solid rgba(186, 157, 95, 0.38) !important; border-radius: 28px !important; box-shadow: 0 30px 85px rgba(37, 31, 24, 0.10) !important; box-sizing: border-box !important; overflow: visible !important; } body#contact .fs-contact-premium .contact-form form { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } /* Titre formulaire */ body#contact .fs-contact-premium .contact-form h1, body#contact .fs-contact-premium .contact-form h3, body#contact .fs-contact-premium .contact-form .h3 { position: relative !important; display: block !important; width: 100% !important; margin: 0 0 30px !important; padding: 0 0 15px !important; text-align: left !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.3 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: #39332c !important; } body#contact .fs-contact-premium .contact-form h1::after, body#contact .fs-contact-premium .contact-form h3::after, body#contact .fs-contact-premium .contact-form .h3::after { content: "" !important; position: absolute !important; left: 0 !important; bottom: 0 !important; width: 68px !important; height: 2px !important; background: #b89a4f !important; border-radius: 30px !important; } /* Champs */ body#contact .fs-contact-premium .contact-form .form-group, body#contact .fs-contact-premium .contact-form .form-field, body#contact .fs-contact-premium .contact-form label { display: block !important; margin-bottom: 20px !important; } body#contact .fs-contact-premium .contact-form label span, body#contact .fs-contact-premium .contact-form .form-control-label { display: block !important; margin-bottom: 8px !important; font-size: 13px !important; font-weight: 700 !important; color: #39332c !important; } body#contact .fs-contact-premium .contact-form input[type="text"], body#contact .fs-contact-premium .contact-form input[type="email"], body#contact .fs-contact-premium .contact-form input[type="password"], body#contact .fs-contact-premium .contact-form select, body#contact .fs-contact-premium .contact-form textarea, body#contact .fs-contact-premium .contact-form .form-control { width: 100% !important; min-height: 50px !important; padding: 0 17px !important; background: #fffefa !important; border: 1px solid rgba(176, 157, 128, 0.58) !important; border-radius: 15px !important; box-shadow: none !important; color: #2c2823 !important; font-size: 14px !important; font-weight: 400 !important; box-sizing: border-box !important; transition: all 0.25s ease !important; } body#contact .fs-contact-premium .contact-form textarea, body#contact .fs-contact-premium .contact-form textarea.form-control { min-height: 140px !important; height: 140px !important; padding: 15px 17px !important; resize: vertical !important; } body#contact .fs-contact-premium .contact-form input::placeholder, body#contact .fs-contact-premium .contact-form textarea::placeholder { color: #bfb7ab !important; opacity: 1 !important; } body#contact .fs-contact-premium .contact-form input:focus, body#contact .fs-contact-premium .contact-form select:focus, body#contact .fs-contact-premium .contact-form textarea:focus, body#contact .fs-contact-premium .contact-form .form-control:focus { border-color: #c6a45a !important; background: #ffffff !important; box-shadow: 0 0 0 4px rgba(198, 164, 90, 0.14) !important; outline: none !important; } /* Fichier */ body#contact .fs-contact-premium .contact-form input[type="file"] { width: 100% !important; min-height: 50px !important; padding: 8px 10px !important; background: #fffefa !important; border: 1px solid rgba(176, 157, 128, 0.58) !important; border-radius: 15px !important; color: #39332c !important; font-size: 13px !important; box-sizing: border-box !important; } body#contact .fs-contact-premium .contact-form input[type="file"]::file-selector-button { margin-right: 14px !important; padding: 11px 17px !important; background: #ffffff !important; border: 1px solid #b89a4f !important; border-radius: 999px !important; color: #3a332b !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; cursor: pointer !important; } /* Consentement */ body#contact .fs-contact-consent { display: flex !important; align-items: flex-start !important; gap: 10px !important; margin: 4px 0 22px !important; font-size: 12px !important; line-height: 1.55 !important; color: #4d463d !important; } body#contact .fs-contact-consent input[type="checkbox"] { width: 15px !important; height: 15px !important; margin: 2px 0 0 !important; flex: 0 0 auto !important; accent-color: #b89a4f !important; } body#contact .fs-contact-consent span { display: block !important; margin: 0 !important; font-size: 12px !important; line-height: 1.55 !important; color: #4d463d !important; } /* Bouton */ body#contact .fs-contact-premium .contact-form footer, body#contact .fs-contact-premium .contact-form .form-footer { text-align: center !important; } body#contact .fs-contact-premium .contact-form button[type="submit"], body#contact .fs-contact-premium .contact-form input[type="submit"], body#contact .fs-contact-premium .contact-form .btn-primary { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 172px !important; height: 50px !important; margin: 6px auto 0 !important; padding: 0 32px !important; background: #aeb39f !important; border: 1px solid #aeb39f !important; border-radius: 999px !important; color: #ffffff !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.11em !important; text-transform: uppercase !important; box-shadow: 0 16px 34px rgba(74, 57, 25, 0.18) !important; transition: all 0.25s ease !important; } body#contact .fs-contact-premium .contact-form button[type="submit"]:hover, body#contact .fs-contact-premium .contact-form input[type="submit"]:hover, body#contact .fs-contact-premium .contact-form .btn-primary:hover { background: #e74772 !important; border-color: #e74772 !important; transform: translateY(-2px) !important; box-shadow: 0 18px 38px rgba(231, 71, 114, 0.24) !important; } /* ========================================================= 6. COLONNE INFORMATIONS ========================================================= */ body#contact .fs-contact-side { display: grid !important; grid-template-columns: 1fr !important; gap: 18px !important; width: 100% !important; } body#contact .fs-contact-card { position: relative !important; padding: 28px 28px 26px !important; background: #fffdfa !important; border: 1px solid rgba(186, 157, 95, 0.32) !important; border-radius: 24px !important; box-shadow: 0 22px 58px rgba(37, 31, 24, 0.07) !important; overflow: hidden !important; } body#contact .fs-contact-card::before { content: "" !important; position: absolute !important; top: -42px !important; right: -42px !important; width: 120px !important; height: 120px !important; background: rgba(184, 154, 79, 0.10) !important; border-radius: 50% !important; } body#contact .fs-contact-card-dark { background: linear-gradient(135deg, #171b12 0%, #242918 100%) !important; border-color: rgba(184, 154, 79, 0.48) !important; color: #ffffff !important; } body#contact .fs-contact-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 38px !important; height: 38px !important; margin-bottom: 18px !important; border: 1px solid #b89a4f !important; border-radius: 999px !important; color: #b89a4f !important; font-size: 16px !important; } body#contact .fs-contact-card h2, body#contact .fs-contact-card h3 { position: relative !important; margin: 0 0 12px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 22px !important; font-weight: 500 !important; line-height: 1.25 !important; color: #2c2823 !important; } body#contact .fs-contact-card-dark h2, body#contact .fs-contact-card-dark h3 { color: #ffffff !important; } body#contact .fs-contact-card p { position: relative !important; margin: 0 !important; font-size: 14px !important; line-height: 1.75 !important; color: #6f675d !important; } body#contact .fs-contact-card-dark p { color: rgba(255, 255, 255, 0.82) !important; } /* ========================================================= 7. BLOCS RASSURANCE BAS ========================================================= */ body#contact .fs-contact-reassurance { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 18px !important; width: 100% !important; max-width: 980px !important; margin: 28px auto 0 !important; } body#contact .fs-contact-mini { padding: 24px 22px !important; background: #fffdfa !important; border: 1px solid rgba(186, 157, 95, 0.32) !important; border-radius: 20px !important; box-shadow: 0 18px 46px rgba(37, 31, 24, 0.06) !important; } body#contact .fs-contact-mini strong { display: block !important; margin-bottom: 8px !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: #2c2823 !important; } body#contact .fs-contact-mini span, body#contact .fs-contact-mini p { display: block !important; margin: 0 !important; font-size: 13px !important; line-height: 1.65 !important; color: #6f675d !important; } /* ========================================================= 8. RESPONSIVE ========================================================= */ @media (max-width: 991px) { body#contact .fs-contact-premium { padding: 44px 18px 68px !important; } body#contact .fs-contact-layout { grid-template-columns: 1fr !important; max-width: 680px !important; } body#contact .fs-contact-reassurance { grid-template-columns: 1fr !important; max-width: 680px !important; } } @media (max-width: 767px) { body#contact .fs-contact-premium { padding: 34px 14px 56px !important; } body#contact .fs-contact-hero h1 { font-size: 29px !important; } body#contact .fs-contact-intro { font-size: 14px !important; } body#contact .fs-contact-form-card, body#contact .fs-contact-premium .contact-form { padding: 30px 22px !important; border-radius: 22px !important; } body#contact .fs-contact-card { padding: 24px 22px !important; border-radius: 22px !important; } body#contact .fs-contact-premium .contact-form button[type="submit"], body#contact .fs-contact-premium .contact-form input[type="submit"], body#contact .fs-contact-premium .contact-form .btn-primary { width: 100% !important; } } /* ========================================================= FOLIES SECRÈTES - PAGE CONTACTEZ-NOUS PREMIUM MEUBLÉE CSS COMPLET FINAL - VERSION LARGE 2 COLONNES ========================================================= */ /* ========================================================= 1. NETTOYAGE DES ANCIENNES RÈGLES CONTACT ========================================================= */ body#contact #main::before, body#contact #main::after, body#contact #content::before, body#contact #content::after, body#contact .page-content::before, body#contact .page-content::after, body#contact .contact-form::before, body#contact .contact-form::after, body#contact .contact-form h1::before, body#contact .contact-form h3::before, body#contact .contact-form .h3::before, body#contact .contact-form form::before { content: none !important; display: none !important; } /* Reset des anciennes largeurs qui cassaient la page */ body#contact .contact-form, body#contact section.contact-form, body#contact .contact-form form { max-width: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; float: none !important; clear: none !important; box-shadow: none !important; border: 0 !important; background: transparent !important; border-radius: 0 !important; } /* ========================================================= 2. STRUCTURE GÉNÉRALE PAGE ========================================================= */ body#contact { background: #f8f5ef !important; } body#contact #wrapper, body#contact #content-wrapper, body#contact #main, body#contact #content, body#contact .page-content { background: #f8f5ef !important; } body#contact #main, body#contact #content, body#contact .page-content { width: 100% !important; max-width: none !important; margin: 0 auto !important; padding: 0 !important; float: none !important; } /* Fil d’Ariane */ body#contact .breadcrumb, body#contact .breadcrumb ol, body#contact .breadcrumb li, body#contact .breadcrumb a { font-size: 13px !important; color: #7d7468 !important; } /* ========================================================= 3. WRAPPER PREMIUM ========================================================= */ body#contact .fs-contact-premium { width: 100% !important; max-width: 1180px !important; margin: 0 auto !important; padding: 54px 24px 78px !important; box-sizing: border-box !important; } /* Hero */ body#contact .fs-contact-hero { max-width: 760px !important; margin: 0 auto 38px !important; text-align: center !important; } body#contact .fs-contact-kicker { margin: 0 0 8px !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; color: #b89a4f !important; } body#contact .fs-contact-hero h1 { margin: 0 0 14px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 38px !important; font-weight: 500 !important; line-height: 1.15 !important; color: #28251f !important; } body#contact .fs-contact-intro { max-width: 680px !important; margin: 0 auto !important; font-size: 15px !important; line-height: 1.8 !important; color: #6f675d !important; } /* ========================================================= 4. GRILLE 2 COLONNES ========================================================= */ body#contact .fs-contact-layout { display: grid !important; grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr) !important; gap: 34px !important; align-items: start !important; width: 100% !important; max-width: 980px !important; margin: 0 auto !important; } /* ========================================================= 5. CARTE FORMULAIRE ========================================================= */ body#contact .fs-contact-form-card, body#contact .fs-contact-premium .contact-form { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 42px 42px 40px !important; background: #fffdfa !important; border: 1px solid rgba(186, 157, 95, 0.38) !important; border-radius: 28px !important; box-shadow: 0 30px 85px rgba(37, 31, 24, 0.10) !important; box-sizing: border-box !important; overflow: visible !important; } body#contact .fs-contact-premium .contact-form form { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } /* Titre formulaire */ body#contact .fs-contact-premium .contact-form h1, body#contact .fs-contact-premium .contact-form h3, body#contact .fs-contact-premium .contact-form .h3 { position: relative !important; display: block !important; width: 100% !important; margin: 0 0 30px !important; padding: 0 0 15px !important; text-align: left !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.3 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: #39332c !important; } body#contact .fs-contact-premium .contact-form h1::after, body#contact .fs-contact-premium .contact-form h3::after, body#contact .fs-contact-premium .contact-form .h3::after { content: "" !important; position: absolute !important; left: 0 !important; bottom: 0 !important; width: 68px !important; height: 2px !important; background: #b89a4f !important; border-radius: 30px !important; } /* Champs */ body#contact .fs-contact-premium .contact-form .form-group, body#contact .fs-contact-premium .contact-form .form-field, body#contact .fs-contact-premium .contact-form label { display: block !important; margin-bottom: 20px !important; } body#contact .fs-contact-premium .contact-form label span, body#contact .fs-contact-premium .contact-form .form-control-label { display: block !important; margin-bottom: 8px !important; font-size: 13px !important; font-weight: 700 !important; color: #39332c !important; } body#contact .fs-contact-premium .contact-form input[type="text"], body#contact .fs-contact-premium .contact-form input[type="email"], body#contact .fs-contact-premium .contact-form input[type="password"], body#contact .fs-contact-premium .contact-form select, body#contact .fs-contact-premium .contact-form textarea, body#contact .fs-contact-premium .contact-form .form-control { width: 100% !important; min-height: 50px !important; padding: 0 17px !important; background: #fffefa !important; border: 1px solid rgba(176, 157, 128, 0.58) !important; border-radius: 15px !important; box-shadow: none !important; color: #2c2823 !important; font-size: 14px !important; font-weight: 400 !important; box-sizing: border-box !important; transition: all 0.25s ease !important; } body#contact .fs-contact-premium .contact-form textarea, body#contact .fs-contact-premium .contact-form textarea.form-control { min-height: 140px !important; height: 140px !important; padding: 15px 17px !important; resize: vertical !important; } body#contact .fs-contact-premium .contact-form input::placeholder, body#contact .fs-contact-premium .contact-form textarea::placeholder { color: #bfb7ab !important; opacity: 1 !important; } body#contact .fs-contact-premium .contact-form input:focus, body#contact .fs-contact-premium .contact-form select:focus, body#contact .fs-contact-premium .contact-form textarea:focus, body#contact .fs-contact-premium .contact-form .form-control:focus { border-color: #c6a45a !important; background: #ffffff !important; box-shadow: 0 0 0 4px rgba(198, 164, 90, 0.14) !important; outline: none !important; } /* Fichier */ body#contact .fs-contact-premium .contact-form input[type="file"] { width: 100% !important; min-height: 50px !important; padding: 8px 10px !important; background: #fffefa !important; border: 1px solid rgba(176, 157, 128, 0.58) !important; border-radius: 15px !important; color: #39332c !important; font-size: 13px !important; box-sizing: border-box !important; } body#contact .fs-contact-premium .contact-form input[type="file"]::file-selector-button { margin-right: 14px !important; padding: 11px 17px !important; background: #ffffff !important; border: 1px solid #b89a4f !important; border-radius: 999px !important; color: #3a332b !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; cursor: pointer !important; } /* Consentement */ body#contact .fs-contact-consent { display: flex !important; align-items: flex-start !important; gap: 10px !important; margin: 4px 0 22px !important; font-size: 12px !important; line-height: 1.55 !important; color: #4d463d !important; } body#contact .fs-contact-consent input[type="checkbox"] { width: 15px !important; height: 15px !important; margin: 2px 0 0 !important; flex: 0 0 auto !important; accent-color: #b89a4f !important; } body#contact .fs-contact-consent span { display: block !important; margin: 0 !important; font-size: 12px !important; line-height: 1.55 !important; color: #4d463d !important; } /* Bouton */ body#contact .fs-contact-premium .contact-form footer, body#contact .fs-contact-premium .contact-form .form-footer { text-align: center !important; } body#contact .fs-contact-premium .contact-form button[type="submit"], body#contact .fs-contact-premium .contact-form input[type="submit"], body#contact .fs-contact-premium .contact-form .btn-primary { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 172px !important; height: 50px !important; margin: 6px auto 0 !important; padding: 0 32px !important; background: #aeb39f !important; border: 1px solid #aeb39f !important; border-radius: 999px !important; color: #ffffff !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.11em !important; text-transform: uppercase !important; box-shadow: 0 16px 34px rgba(74, 57, 25, 0.18) !important; transition: all 0.25s ease !important; } body#contact .fs-contact-premium .contact-form button[type="submit"]:hover, body#contact .fs-contact-premium .contact-form input[type="submit"]:hover, body#contact .fs-contact-premium .contact-form .btn-primary:hover { background: #e74772 !important; border-color: #e74772 !important; transform: translateY(-2px) !important; box-shadow: 0 18px 38px rgba(231, 71, 114, 0.24) !important; } /* ========================================================= 6. COLONNE INFORMATIONS ========================================================= */ body#contact .fs-contact-side { display: grid !important; grid-template-columns: 1fr !important; gap: 18px !important; width: 100% !important; } body#contact .fs-contact-card { position: relative !important; padding: 28px 28px 26px !important; background: #fffdfa !important; border: 1px solid rgba(186, 157, 95, 0.32) !important; border-radius: 24px !important; box-shadow: 0 22px 58px rgba(37, 31, 24, 0.07) !important; overflow: hidden !important; } body#contact .fs-contact-card::before { content: "" !important; position: absolute !important; top: -42px !important; right: -42px !important; width: 120px !important; height: 120px !important; background: rgba(184, 154, 79, 0.10) !important; border-radius: 50% !important; } body#contact .fs-contact-card-dark { background: linear-gradient(135deg, #171b12 0%, #242918 100%) !important; border-color: rgba(184, 154, 79, 0.48) !important; color: #ffffff !important; } body#contact .fs-contact-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 38px !important; height: 38px !important; margin-bottom: 18px !important; border: 1px solid #b89a4f !important; border-radius: 999px !important; color: #b89a4f !important; font-size: 16px !important; } body#contact .fs-contact-card h2, body#contact .fs-contact-card h3 { position: relative !important; margin: 0 0 12px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 22px !important; font-weight: 500 !important; line-height: 1.25 !important; color: #2c2823 !important; } body#contact .fs-contact-card-dark h2, body#contact .fs-contact-card-dark h3 { color: #ffffff !important; } body#contact .fs-contact-card p { position: relative !important; margin: 0 !important; font-size: 14px !important; line-height: 1.75 !important; color: #6f675d !important; } body#contact .fs-contact-card-dark p { color: rgba(255, 255, 255, 0.82) !important; } /* ========================================================= 7. BLOCS RASSURANCE BAS ========================================================= */ body#contact .fs-contact-reassurance { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 18px !important; width: 100% !important; max-width: 980px !important; margin: 28px auto 0 !important; } body#contact .fs-contact-mini { padding: 24px 22px !important; background: #fffdfa !important; border: 1px solid rgba(186, 157, 95, 0.32) !important; border-radius: 20px !important; box-shadow: 0 18px 46px rgba(37, 31, 24, 0.06) !important; } body#contact .fs-contact-mini strong { display: block !important; margin-bottom: 8px !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: #2c2823 !important; } body#contact .fs-contact-mini span, body#contact .fs-contact-mini p { display: block !important; margin: 0 !important; font-size: 13px !important; line-height: 1.65 !important; color: #6f675d !important; } /* ========================================================= 8. RESPONSIVE ========================================================= */ @media (max-width: 991px) { body#contact .fs-contact-premium { padding: 44px 18px 68px !important; } body#contact .fs-contact-layout { grid-template-columns: 1fr !important; max-width: 680px !important; } body#contact .fs-contact-reassurance { grid-template-columns: 1fr !important; max-width: 680px !important; } } @media (max-width: 767px) { body#contact .fs-contact-premium { padding: 34px 14px 56px !important; } body#contact .fs-contact-hero h1 { font-size: 29px !important; } body#contact .fs-contact-intro { font-size: 14px !important; } body#contact .fs-contact-form-card, body#contact .fs-contact-premium .contact-form { padding: 30px 22px !important; border-radius: 22px !important; } body#contact .fs-contact-card { padding: 24px 22px !important; border-radius: 22px !important; } body#contact .fs-contact-premium .contact-form button[type="submit"], body#contact .fs-contact-premium .contact-form input[type="submit"], body#contact .fs-contact-premium .contact-form .btn-primary { width: 100% !important; } } /* ========================================================= PAGE QUI SOMMES-NOUS - FOLIES SECRÈTES Version premium large + compatible CMS PrestaShop ========================================================= */ /* Débloque la largeur CMS Panda / PrestaShop */ body#cms .fs-about-page, body.cms .fs-about-page, .fs-about-page { width: min(1180px, calc(100vw - 40px)) !important; max-width: 1180px !important; margin-left: 50% !important; transform: translateX(-50%) !important; padding: 34px 0 72px !important; color: #3b2630; font-family: inherit; box-sizing: border-box; } .fs-about-page *, .fs-about-page *::before, .fs-about-page *::after { box-sizing: border-box; } /* HERO */ .fs-about-hero { position: relative; overflow: hidden; text-align: center; padding: 76px 46px; border-radius: 34px; background: radial-gradient(circle at top left, rgba(231, 71, 114, 0.18), transparent 34%), radial-gradient(circle at bottom right, rgba(255, 228, 236, 0.95), transparent 38%), linear-gradient(135deg, #fff8fa 0%, #ffffff 48%, #fbe8ee 100%); border: 1px solid rgba(231, 71, 114, 0.16); box-shadow: 0 22px 60px rgba(75, 36, 53, 0.10); } .fs-about-hero::before { content: ""; position: absolute; inset: 18px; border: 1px solid rgba(231, 71, 114, 0.16); border-radius: 26px; pointer-events: none; } .fs-about-kicker, .fs-about-label { display: inline-flex; align-items: center; justify-content: center; margin-bottom: 14px; color: #e74772; font-size: 12px; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; } .fs-about-hero h1 { margin: 0; color: #2d1d25; font-size: clamp(38px, 5vw, 60px); line-height: 1.05; font-weight: 700; letter-spacing: -0.04em; } .fs-about-hero p { max-width: 760px; margin: 22px auto 0; color: #6d5660; font-size: 18px; line-height: 1.75; } /* INTRO */ .fs-about-intro { display: grid !important; grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr) !important; gap: 28px !important; margin-top: 34px !important; align-items: stretch; } .fs-about-intro-text, .fs-about-intro-card, .fs-about-story-card, .fs-about-promise { border-radius: 28px; background: #ffffff; border: 1px solid rgba(231, 71, 114, 0.14); box-shadow: 0 18px 46px rgba(75, 36, 53, 0.08); } .fs-about-intro-text, .fs-about-intro-card { padding: 42px; } .fs-about-intro-text h2, .fs-about-section-title h2, .fs-about-story-card h2, .fs-about-final h2 { margin: 0; color: #2f2028; font-size: clamp(28px, 3vw, 40px); line-height: 1.16; letter-spacing: -0.03em; } .fs-about-intro-text p, .fs-about-section-title p, .fs-about-story-card p, .fs-about-final p { margin: 18px 0 0; color: #66515a; font-size: 16px; line-height: 1.85; } .fs-about-intro-card { background: linear-gradient(145deg, rgba(255, 247, 250, 0.98), rgba(255, 255, 255, 1)); } .fs-about-card-icon { width: 58px; height: 58px; display: flex; align-items: center; justify-content: center; margin-bottom: 24px; color: #e74772; font-size: 30px; border-radius: 50%; background: #fff0f5; box-shadow: inset 0 0 0 1px rgba(231, 71, 114, 0.15); } .fs-about-intro-card h3, .fs-about-value-card h3, .fs-about-promise h3 { margin: 0 0 14px; color: #33222a; font-size: 21px; line-height: 1.25; } .fs-about-intro-card p, .fs-about-value-card p { margin: 0; color: #6a535d; font-size: 15px; line-height: 1.8; } /* ENGAGEMENTS */ .fs-about-values { margin-top: 42px; padding: 52px 42px; border-radius: 34px; background: linear-gradient(180deg, #fff7fa 0%, #ffffff 100%); border: 1px solid rgba(231, 71, 114, 0.13); box-shadow: 0 18px 46px rgba(75, 36, 53, 0.06); } .fs-about-section-title { max-width: 780px; margin: 0 auto 38px; text-align: center; } .fs-about-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 20px !important; } .fs-about-value-card { display: block !important; min-height: 255px; padding: 30px 26px; border-radius: 24px; background: #ffffff; border: 1px solid rgba(231, 71, 114, 0.13); box-shadow: 0 14px 34px rgba(75, 36, 53, 0.07); transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; } .fs-about-value-card:hover { transform: translateY(-4px); border-color: rgba(231, 71, 114, 0.30); box-shadow: 0 22px 44px rgba(75, 36, 53, 0.11); } .fs-about-number { display: block; margin-bottom: 22px; color: rgba(231, 71, 114, 0.48); font-size: 36px; line-height: 1; font-weight: 800; letter-spacing: -0.06em; } /* STORY */ .fs-about-story { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(320px, 0.55fr) !important; gap: 28px !important; margin-top: 34px !important; align-items: stretch; } .fs-about-story-card { padding: 44px; } .fs-about-promise { padding: 40px; background: radial-gradient(circle at top right, rgba(231, 71, 114, 0.15), transparent 38%), linear-gradient(145deg, #3a2430 0%, #23171e 100%); color: #ffffff; border: 0; } .fs-about-promise h3 { color: #ffffff; font-size: 26px; } .fs-about-promise ul { list-style: none; margin: 24px 0 0; padding: 0; } .fs-about-promise li { position: relative; padding: 13px 0 13px 30px; color: rgba(255, 255, 255, 0.86); font-size: 15px; line-height: 1.55; border-bottom: 1px solid rgba(255, 255, 255, 0.10); } .fs-about-promise li:last-child { border-bottom: 0; } .fs-about-promise li::before { content: "◇"; position: absolute; left: 0; top: 12px; color: #f4a9bd; font-size: 15px; } /* TRUST */ .fs-about-trust { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 18px !important; margin-top: 34px !important; } .fs-about-trust-item { padding: 28px; border-radius: 24px; background: #ffffff; border: 1px solid rgba(231, 71, 114, 0.13); box-shadow: 0 14px 34px rgba(75, 36, 53, 0.07); text-align: center; } .fs-about-trust-item strong { display: block; margin-bottom: 9px; color: #322129; font-size: 17px; } .fs-about-trust-item span { display: block; color: #725a65; font-size: 14px; line-height: 1.65; } /* FINAL */ .fs-about-final { margin-top: 38px; padding: 58px 42px; border-radius: 34px; text-align: center; background: radial-gradient(circle at top, rgba(255, 255, 255, 0.45), transparent 42%), linear-gradient(135deg, #fff6f9 0%, #ffe7ef 100%); border: 1px solid rgba(231, 71, 114, 0.15); box-shadow: 0 22px 58px rgba(75, 36, 53, 0.10); } .fs-about-final-inner { max-width: 840px; margin: 0 auto; } .fs-about-actions { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; margin-top: 30px; } .fs-about-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 28px; border-radius: 999px; font-size: 14px; font-weight: 800; text-decoration: none !important; transition: all 0.22s ease; } .fs-about-btn-primary { color: #ffffff !important; background: #e74772; box-shadow: 0 14px 28px rgba(231, 71, 114, 0.25); } .fs-about-btn-primary:hover { color: #ffffff !important; background: #d93b66; transform: translateY(-2px); } .fs-about-btn-secondary { color: #e74772 !important; background: #ffffff; border: 1px solid rgba(231, 71, 114, 0.28); } .fs-about-btn-secondary:hover { color: #ffffff !important; background: #e74772; transform: translateY(-2px); } /* RESPONSIVE */ @media (max-width: 1100px) { .fs-about-intro, .fs-about-story { grid-template-columns: 1fr !important; } .fs-about-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } @media (max-width: 768px) { body#cms .fs-about-page, body.cms .fs-about-page, .fs-about-page { width: calc(100vw - 24px) !important; padding: 22px 0 50px !important; } .fs-about-hero { padding: 54px 22px; border-radius: 26px; } .fs-about-hero::before { inset: 12px; border-radius: 20px; } .fs-about-hero p { font-size: 16px; } .fs-about-intro-text, .fs-about-intro-card, .fs-about-story-card, .fs-about-promise { padding: 28px; border-radius: 24px; } .fs-about-values { padding: 34px 20px; border-radius: 26px; } .fs-about-grid, .fs-about-trust { grid-template-columns: 1fr !important; } .fs-about-value-card { min-height: auto; } .fs-about-final { padding: 42px 22px; border-radius: 26px; } .fs-about-actions { flex-direction: column; } .fs-about-btn { width: 100%; } } /* ========================================================= FOLIES SECRÈTES - BLOG HOME LES CHRONIQUES SECRÈTES Compatible Page CMS PrestaShop / Panda ========================================================= */ .fs-blog-home { width: 100%; background: #fbfaf7; color: #28231f; font-family: inherit; } /* ========================= SLIDER ========================= */ .fs-blog-slider { position: relative; width: 100%; min-height: 500px; overflow: hidden; background: #f3ede4; border-radius: 0 0 28px 28px; } .fs-blog-slide { position: absolute; inset: 0; opacity: 0; display: flex; align-items: center; padding: 80px 8%; background-size: cover; background-position: center right; animation: fsBlogSlider 18s infinite; } .fs-blog-slide-1 { opacity: 1; background: linear-gradient(90deg, rgba(251,250,247,0.98) 0%, rgba(251,250,247,0.88) 42%, rgba(251,250,247,0.22) 78%), url("/img/cms/blog/hero-blog-01.jpg"); background-color: #f3ede4; animation-delay: 0s; } .fs-blog-slide-2 { background: linear-gradient(90deg, rgba(251,250,247,0.98) 0%, rgba(251,250,247,0.88) 42%, rgba(251,250,247,0.22) 78%), url("/img/cms/blog/hero-blog-02.jpg"); background-color: #eee6da; animation-delay: 6s; } .fs-blog-slide-3 { background: linear-gradient(90deg, rgba(251,250,247,0.98) 0%, rgba(251,250,247,0.88) 42%, rgba(251,250,247,0.22) 78%), url("/img/cms/blog/hero-blog-03.jpg"); background-color: #f2ebe1; animation-delay: 12s; } @keyframes fsBlogSlider { 0% { opacity: 0; transform: scale(1.015); } 5% { opacity: 1; transform: scale(1); } 30% { opacity: 1; transform: scale(1); } 36% { opacity: 0; transform: scale(1.015); } 100% { opacity: 0; transform: scale(1.015); } } .fs-blog-slide-content { max-width: 560px; position: relative; z-index: 2; } .fs-blog-kicker, .fs-blog-section-kicker, .fs-blog-card-cat { margin: 0 0 12px; font-size: 12px; line-height: 1.2; letter-spacing: 0.13em; text-transform: uppercase; color: #6c7353; font-weight: 700; } .fs-blog-slide-content h1, .fs-blog-slide-content h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-size: clamp(38px, 4.5vw, 64px); line-height: 1.04; color: #171513; } .fs-blog-line { width: 52px; height: 1px; background: #b5905d; margin: 26px 0 22px; } .fs-blog-slide-content p:not(.fs-blog-kicker) { max-width: 500px; margin: 0 0 30px; font-size: 16px; line-height: 1.85; color: #37312c; } .fs-blog-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 30px; border-radius: 999px; background: #69704e; color: #fff !important; text-decoration: none !important; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; box-shadow: 0 12px 30px rgba(105,112,78,0.22); transition: all 0.25s ease; } .fs-blog-btn:hover { background: #50583b; color: #fff !important; transform: translateY(-2px); box-shadow: 0 16px 36px rgba(105,112,78,0.30); } /* ========================= INTRO ========================= */ .fs-blog-intro { max-width: 940px; margin: 0 auto; padding: 72px 24px 42px; text-align: center; } .fs-blog-intro h2, .fs-blog-featured h2, .fs-blog-categories h2, .fs-blog-newsletter h2 { margin: 0 0 18px; font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-size: clamp(30px, 3vw, 44px); line-height: 1.15; color: #1e1a17; } .fs-blog-intro p:not(.fs-blog-section-kicker) { margin: 0 auto; max-width: 760px; font-size: 16px; line-height: 1.9; color: #5a5149; } /* ========================= ARTICLES À LA UNE ========================= */ .fs-blog-featured { max-width: 1320px; margin: 0 auto; padding: 30px 24px 64px; } .fs-blog-section-title { display: flex; justify-content: space-between; gap: 24px; align-items: flex-end; margin-bottom: 28px; } .fs-blog-link { color: #6c7353 !important; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; text-decoration: none !important; } .fs-blog-link:hover { color: #4e5539 !important; } .fs-blog-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; } .fs-blog-card { overflow: hidden; border-radius: 16px; background: #fff; border: 1px solid rgba(122, 105, 78, 0.13); box-shadow: 0 18px 45px rgba(58, 49, 39, 0.08); transition: all 0.28s ease; } .fs-blog-card:hover { transform: translateY(-6px); box-shadow: 0 24px 60px rgba(58, 49, 39, 0.14); } .fs-blog-card-image { height: 220px; background-size: cover; background-position: center; background-color: #e8dfd2; transition: transform 0.45s ease; } .fs-blog-card:hover .fs-blog-card-image { transform: scale(1.045); } .fs-blog-img-1 { background-image: linear-gradient(rgba(57,44,30,0.05), rgba(57,44,30,0.05)), url("/img/cms/blog/article-maison-close.jpg"); } .fs-blog-img-2 { background-image: linear-gradient(rgba(57,44,30,0.05), rgba(57,44,30,0.05)), url("/img/cms/blog/article-art-desir.jpg"); } .fs-blog-img-3 { background-image: linear-gradient(rgba(57,44,30,0.05), rgba(57,44,30,0.05)), url("/img/cms/blog/article-feu-au-corps.jpg"); } .fs-blog-card-content { padding: 26px 24px 22px; } .fs-blog-card-content h3 { margin: 0 0 14px; font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-size: 24px; line-height: 1.24; color: #211d19; } .fs-blog-card-content p:not(.fs-blog-card-cat) { margin: 0 0 20px; font-size: 14px; line-height: 1.75; color: #61584f; } .fs-blog-card-meta { display: flex; justify-content: space-between; gap: 18px; padding-top: 14px; border-top: 1px solid rgba(122, 105, 78, 0.13); font-size: 12px; color: #7b7168; } /* ========================= CATÉGORIES ========================= */ .fs-blog-categories { max-width: 1320px; margin: 0 auto; padding: 18px 24px 72px; } .fs-blog-category-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; margin-top: 28px; } .fs-blog-category-card { min-height: 205px; padding: 26px 20px; border-radius: 16px; background: linear-gradient(145deg, rgba(255,255,255,0.96), rgba(241,236,228,0.92)); border: 1px solid rgba(122, 105, 78, 0.13); text-decoration: none !important; color: #28231f !important; box-shadow: 0 16px 40px rgba(58, 49, 39, 0.06); transition: all 0.25s ease; } .fs-blog-category-card:hover { transform: translateY(-5px); box-shadow: 0 22px 52px rgba(58, 49, 39, 0.12); color: #28231f !important; } .fs-blog-category-card span { display: block; margin-bottom: 28px; font-family: Georgia, "Times New Roman", serif; font-size: 30px; color: rgba(181, 144, 93, 0.58); } .fs-blog-category-card strong { display: block; margin-bottom: 10px; font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-size: 21px; line-height: 1.2; color: #1f1b18; } .fs-blog-category-card em { display: block; font-style: normal; font-size: 13px; line-height: 1.65; color: #6b6259; } /* ========================= NEWSLETTER VISUELLE Compatible CMS : pas de form/input/button ========================= */ .fs-blog-newsletter { max-width: 1320px; margin: 0 auto 74px; padding: 36px 44px; display: grid; grid-template-columns: auto 1fr auto; gap: 28px; align-items: center; border-radius: 20px; background: radial-gradient(circle at 8% 20%, rgba(181,144,93,0.15), transparent 28%), linear-gradient(135deg, #f2ece3, #fbfaf7); border: 1px solid rgba(122, 105, 78, 0.13); box-shadow: 0 18px 50px rgba(58, 49, 39, 0.08); } .fs-blog-newsletter-icon { width: 76px; height: 76px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #fff; border: 1px solid rgba(122, 105, 78, 0.16); color: #6c7353; font-size: 34px; } .fs-blog-newsletter h2 { margin-bottom: 8px; } .fs-blog-newsletter p { margin: 0; color: #5f564e; line-height: 1.7; } .fs-blog-newsletter-form { display: flex; gap: 12px; min-width: 430px; } .fs-blog-newsletter-placeholder { display: flex; align-items: center; width: 100%; height: 46px; border-radius: 999px; border: 1px solid rgba(122, 105, 78, 0.16); background: #fff; padding: 0 22px; font-size: 14px; color: #9b9187; white-space: nowrap; } .fs-blog-newsletter-button { display: inline-flex; align-items: center; justify-content: center; height: 46px; border-radius: 999px; background: #69704e; color: #fff !important; padding: 0 28px; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; text-decoration: none !important; white-space: nowrap; transition: all 0.25s ease; } .fs-blog-newsletter-button:hover { background: #50583b; color: #fff !important; transform: translateY(-1px); } /* ========================= RESPONSIVE TABLETTE ========================= */ @media (max-width: 1100px) { .fs-blog-card-grid { grid-template-columns: repeat(2, 1fr); } .fs-blog-category-grid { grid-template-columns: repeat(2, 1fr); } .fs-blog-newsletter { grid-template-columns: 1fr; text-align: center; } .fs-blog-newsletter-icon { margin: 0 auto; } .fs-blog-newsletter-form { min-width: 0; max-width: 620px; margin: 0 auto; width: 100%; } } /* ========================= RESPONSIVE MOBILE ========================= */ @media (max-width: 767px) { .fs-blog-slider { min-height: 540px; border-radius: 0 0 22px 22px; } .fs-blog-slide { padding: 58px 24px; background-position: center; } .fs-blog-slide-1, .fs-blog-slide-2, .fs-blog-slide-3 { background: linear-gradient(90deg, rgba(251,250,247,0.96), rgba(251,250,247,0.86)), #f3ede4; } .fs-blog-slide-content h1, .fs-blog-slide-content h2 { font-size: 38px; } .fs-blog-slide-content p:not(.fs-blog-kicker) { font-size: 15px; } .fs-blog-intro { padding: 56px 22px 34px; } .fs-blog-section-title { display: block; } .fs-blog-link { display: inline-block; margin-top: 8px; } .fs-blog-card-grid, .fs-blog-category-grid { grid-template-columns: 1fr; } .fs-blog-card-image { height: 190px; } .fs-blog-newsletter { margin-left: 18px; margin-right: 18px; padding: 30px 22px; } .fs-blog-newsletter-form { flex-direction: column; } .fs-blog-newsletter-placeholder, .fs-blog-newsletter-button { width: 100%; } } /* ========================================================= CORRECTIF LARGEUR PREMIUM - HOME BLOG À mettre tout à la fin du CSS ========================================================= */ /* Fait sortir la home blog du conteneur CMS PrestaShop */ .fs-blog-home { width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; overflow-x: hidden; } /* Hero plus premium */ .fs-blog-slider { width: 100vw !important; max-width: 100vw !important; min-height: 560px; border-radius: 0; margin-top: 0; } /* Contenu du hero mieux positionné */ .fs-blog-slide { padding-left: max(8vw, 90px); padding-right: max(8vw, 90px); } .fs-blog-slide-content { max-width: 620px; } /* Titre hero plus magazine */ .fs-blog-slide-content h1, .fs-blog-slide-content h2 { font-size: clamp(46px, 5vw, 76px); line-height: 1.02; } /* Texte hero un peu plus lisible */ .fs-blog-slide-content p:not(.fs-blog-kicker) { max-width: 540px; font-size: 17px; } /* Sections centrées dans une vraie largeur premium */ .fs-blog-intro, .fs-blog-featured, .fs-blog-categories, .fs-blog-newsletter { max-width: 1280px; } /* Intro un peu plus respirante */ .fs-blog-intro { padding-top: 78px; padding-bottom: 48px; } /* Cartes articles un peu plus haut de gamme */ .fs-blog-card { border-radius: 18px; } .fs-blog-card-image { height: 250px; } .fs-blog-card-content h3 { font-size: 25px; } /* Catégories plus visibles */ .fs-blog-category-card { min-height: 230px; padding: 30px 22px; } /* Newsletter plus premium */ .fs-blog-newsletter { margin-top: 10px; margin-bottom: 80px; padding: 42px 52px; } /* Mobile : on garde propre sans débordement */ @media (max-width: 767px) { .fs-blog-home { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } .fs-blog-slider { width: 100% !important; max-width: 100% !important; min-height: 520px; } .fs-blog-slide { padding-left: 24px; padding-right: 24px; } .fs-blog-slide-content h1, .fs-blog-slide-content h2 { font-size: 38px; } .fs-blog-card-image { height: 210px; } } /* ========================================================= COLONNE DROITE BLOG - STYLE MAGAZINE PREMIUM ========================================================= */ .fs-blog-content-wrap { max-width: 1280px; margin: 0 auto; padding: 20px 24px 72px; display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 34px; align-items: start; } .fs-blog-main-column { min-width: 0; } .fs-blog-content-wrap .fs-blog-featured, .fs-blog-content-wrap .fs-blog-categories { max-width: none; margin: 0; padding: 0; } .fs-blog-content-wrap .fs-blog-categories { padding-top: 58px; } .fs-blog-content-wrap .fs-blog-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; } .fs-blog-content-wrap .fs-blog-card-image { height: 210px; } .fs-blog-content-wrap .fs-blog-card-content { padding: 22px 20px 20px; } .fs-blog-content-wrap .fs-blog-card-content h3 { font-size: 21px; } .fs-blog-content-wrap .fs-blog-category-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; } .fs-blog-content-wrap .fs-blog-category-card { min-height: 205px; padding: 24px 18px; } /* Sidebar */ .fs-blog-sidebar { position: sticky; top: 110px; display: flex; flex-direction: column; gap: 18px; } .fs-blog-side-box { background: #fff; border: 1px solid rgba(122, 105, 78, 0.12); border-radius: 18px; padding: 24px 22px; box-shadow: 0 18px 45px rgba(58, 49, 39, 0.07); } .fs-blog-side-title { margin: 0 0 18px; font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: #2a2520; } .fs-blog-search-fake { height: 46px; border-radius: 999px; border: 1px solid rgba(122, 105, 78, 0.14); background: #fbfaf7; display: flex; align-items: center; justify-content: space-between; padding: 0 16px 0 18px; color: #9a9188; font-size: 13px; } .fs-blog-search-fake strong { font-size: 19px; font-weight: 400; color: #8c826f; } /* Catégories sidebar */ .fs-blog-side-cat { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 0; border-bottom: 1px solid rgba(122, 105, 78, 0.10); color: #51483f !important; text-decoration: none !important; font-size: 14px; transition: all 0.22s ease; } .fs-blog-side-cat:last-child { border-bottom: 0; padding-bottom: 0; } .fs-blog-side-cat span { font-weight: 500; } .fs-blog-side-cat em { font-style: normal; color: #b5905d; font-size: 20px; line-height: 1; } .fs-blog-side-cat:hover { color: #69704e !important; padding-left: 4px; } /* Articles populaires */ .fs-blog-popular { display: grid; grid-template-columns: 72px 1fr; gap: 14px; padding: 14px 0; border-bottom: 1px solid rgba(122, 105, 78, 0.10); text-decoration: none !important; color: #2a2520 !important; } .fs-blog-popular:last-child { border-bottom: 0; padding-bottom: 0; } .fs-blog-popular-img { width: 72px; height: 72px; border-radius: 12px; background-size: cover; background-position: center; background-color: #e8dfd2; box-shadow: 0 10px 24px rgba(58, 49, 39, 0.12); } .fs-blog-popular-img-1 { background-image: url("/img/cms/blog/article-maison-close.jpg"); } .fs-blog-popular-img-2 { background-image: url("/img/cms/blog/article-art-desir.jpg"); } .fs-blog-popular-img-3 { background-image: url("/img/cms/blog/article-feu-au-corps.jpg"); } .fs-blog-popular-text { display: flex; flex-direction: column; justify-content: center; } .fs-blog-popular-text strong { display: block; font-family: Georgia, "Times New Roman", serif; font-size: 15px; font-weight: 400; line-height: 1.32; color: #2a2520; } .fs-blog-popular-text em { display: block; margin-top: 7px; font-style: normal; font-size: 12px; color: #7b7168; } .fs-blog-popular:hover .fs-blog-popular-text strong { color: #69704e; } /* Responsive */ @media (max-width: 1180px) { .fs-blog-content-wrap { grid-template-columns: 1fr; } .fs-blog-sidebar { position: static; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; } .fs-blog-content-wrap .fs-blog-card-grid { grid-template-columns: repeat(3, 1fr); } } @media (max-width: 900px) { .fs-blog-sidebar { grid-template-columns: 1fr; } .fs-blog-content-wrap .fs-blog-card-grid, .fs-blog-content-wrap .fs-blog-category-grid { grid-template-columns: 1fr; } } /* ========================================================= CORRECTIF VISUELS SLIDER - SUPPRESSION BORD DROIT ========================================================= */ .fs-blog-slider { overflow: hidden !important; } /* On évite toute répétition d'image et on zoome légèrement le fond */ .fs-blog-slide-1, .fs-blog-slide-2, .fs-blog-slide-3 { background-repeat: no-repeat, no-repeat !important; background-size: 100% 100%, 116% 116% !important; background-position: center center, center center !important; } /* Slide 3 : correction renforcée car la cassure est visible à droite */ .fs-blog-slide-3 { background-size: 100% 100%, 120% 120% !important; background-position: center center, center center !important; } /* Sécurité : empêche le débordement horizontal */ html, body { overflow-x: hidden !important; } /* ========================================================= MASQUER LE FIL D’ARIANE SUR LA HOME BLOG UNIQUEMENT Les Chroniques Secrètes ========================================================= */ body:has(.fs-blog-home) .breadcrumb, body:has(.fs-blog-home) .breadcrumb-wrapper, body:has(.fs-blog-home) .breadcrumb_container, body:has(.fs-blog-home) .breadcrumb_nav, body:has(.fs-blog-home) .page-breadcrumb, body:has(.fs-blog-home) #breadcrumb { display: none !important; } /* Supprime aussi l’espace vide éventuel sous le header */ body:has(.fs-blog-home) .breadcrumb_wrapper, body:has(.fs-blog-home) .breadcrumb_container, body:has(.fs-blog-home) .page_breadcrumb { margin: 0 !important; padding: 0 !important; height: 0 !important; min-height: 0 !important; overflow: hidden !important; } /* ===================================================== FOLIES SECRÈTES - FIL D’ARIANE PREMIUM ===================================================== */ .breadcrumb, .breadcrumb_wrapper, nav.breadcrumb { max-width: 1280px !important; margin: 0 auto !important; padding: 18px 24px 16px !important; background: transparent !important; border: none !important; color: #8a8578 !important; font-size: 12px !important; line-height: 1.4 !important; } .breadcrumb a, .breadcrumb_wrapper a, nav.breadcrumb a { color: #7b776b !important; text-decoration: none !important; font-weight: 400 !important; } .breadcrumb a:hover, .breadcrumb_wrapper a:hover, nav.breadcrumb a:hover { color: #8f9677 !important; } .breadcrumb span, .breadcrumb_wrapper span, nav.breadcrumb span { color: #9a9488 !important; } .breadcrumb .navigation-pipe, .breadcrumb_wrapper .navigation-pipe, nav.breadcrumb .navigation-pipe { color: #c7a45a !important; opacity: 0.75 !important; margin: 0 8px !important; } /* ===================================================== FOLIES SECRÈTES - FIL D’ARIANE PREMIUM Catégories / Produits / CMS ===================================================== */ .breadcrumb_wrapper, .breadcrumb, nav.breadcrumb, #breadcrumb_wrapper, #breadcrumbs { max-width: 1280px !important; margin: 0 auto !important; padding: 18px 24px 20px !important; background: transparent !important; border: none !important; box-shadow: none !important; } /* Bloc interne si Panda ajoute un conteneur */ .breadcrumb_wrapper .container, .breadcrumb .container, nav.breadcrumb .container { max-width: 1280px !important; padding-left: 0 !important; padding-right: 0 !important; } /* Texte général */ .breadcrumb_wrapper, .breadcrumb, nav.breadcrumb, .breadcrumb_wrapper span, .breadcrumb span, nav.breadcrumb span { font-size: 12px !important; line-height: 1.4 !important; color: #8b867b !important; font-weight: 400 !important; letter-spacing: 0.02em !important; } /* Liens */ .breadcrumb_wrapper a, .breadcrumb a, nav.breadcrumb a { color: #777267 !important; text-decoration: none !important; font-size: 12px !important; font-weight: 500 !important; transition: color 0.22s ease !important; } .breadcrumb_wrapper a:hover, .breadcrumb a:hover, nav.breadcrumb a:hover { color: #8f9677 !important; } /* Séparateur */ .breadcrumb_wrapper .navigation-pipe, .breadcrumb .navigation-pipe, nav.breadcrumb .navigation-pipe, .breadcrumb_wrapper i, .breadcrumb i, nav.breadcrumb i { color: #c7a45a !important; opacity: 0.75 !important; margin: 0 9px !important; font-size: 11px !important; } /* Dernier élément */ .breadcrumb_wrapper span:last-child, .breadcrumb span:last-child, nav.breadcrumb span:last-child { color: #6f765c !important; font-weight: 500 !important; } /* Version premium : petite capsule très légère */ body#category .breadcrumb_wrapper, body#category .breadcrumb, body#product .breadcrumb_wrapper, body#product .breadcrumb, body#cms .breadcrumb_wrapper, body#cms .breadcrumb { position: relative !important; } /* Petite ligne décorative très discrète sous le fil */ body#category .breadcrumb_wrapper::after, body#category .breadcrumb::after, body#product .breadcrumb_wrapper::after, body#product .breadcrumb::after, body#cms .breadcrumb_wrapper::after, body#cms .breadcrumb::after { content: "" !important; display: block !important; width: 42px !important; height: 1px !important; margin-top: 12px !important; background: linear-gradient(90deg, #c7a45a, transparent) !important; opacity: 0.55 !important; } /* Réduction de l'espace si le breadcrumb est trop haut */ #category #wrapper, #product #wrapper, #cms #wrapper { padding-top: 24px !important; } /* Mobile */ @media (max-width: 767px) { .breadcrumb_wrapper, .breadcrumb, nav.breadcrumb, #breadcrumb_wrapper, #breadcrumbs { padding: 14px 18px 16px !important; font-size: 11px !important; } .breadcrumb_wrapper a, .breadcrumb a, nav.breadcrumb a, .breadcrumb_wrapper span, .breadcrumb span, nav.breadcrumb span { font-size: 11px !important; } } /* ===================================================== FOLIES SECRÈTES - COMPACTAGE FIL D’ARIANE / CATÉGORIE ===================================================== */ /* Réduit la hauteur de la zone breadcrumb */ body#category .breadcrumb_wrapper, body#category .breadcrumb, body#category nav.breadcrumb { padding-top: 8px !important; padding-bottom: 10px !important; margin-top: 0 !important; margin-bottom: 0 !important; } /* Ligne décorative plus proche et plus discrète */ body#category .breadcrumb_wrapper::after, body#category .breadcrumb::after, body#category nav.breadcrumb::after { margin-top: 8px !important; } /* Réduit l’espace entre breadcrumb et contenu catégorie */ body#category #wrapper, body#category .columns-container, body#category #content-wrapper { padding-top: 18px !important; } /* Si Panda ajoute une marge au-dessus du bloc catégorie */ body#category #main, body#category #content, body#category .page-content, body#category .category-cover, body#category .category-description { margin-top: 0 !important; } /* Bloc hero catégorie un peu plus proche */ body#category .fs-category-hero, body#category .fs-category-premium, body#category .fs-cms-hero { margin-top: 0 !important; } /* ===================================================== FOLIES SECRÈTES - HOME PREMIUM V2 Hero + sélection produits + respiration globale ===================================================== */ /* Fond home plus doux */ body#index, body#index #wrapper, body#index .columns-container, body#index #content-wrapper { background: #fbfaf6 !important; } /* ===================================================== HERO HOME PREMIUM ===================================================== */ body#index .fs-hero-premium-v2 { max-width: 470px !important; padding: 34px 38px !important; border-radius: 24px !important; background: rgba(251,250,246,0.78) !important; border: 1px solid rgba(222,217,202,0.75) !important; box-shadow: 0 24px 60px rgba(70,65,55,0.11) !important; backdrop-filter: blur(8px) !important; } body#index .fs-hero-premium-v2 .fs-hero-kicker { color: #7c8465 !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 1.7px !important; text-transform: uppercase !important; margin-bottom: 12px !important; } body#index .fs-hero-premium-v2 h1 { font-family: Georgia, "Times New Roman", serif !important; font-size: 46px !important; line-height: 1.05 !important; font-weight: 400 !important; color: #25231f !important; margin: 0 0 18px !important; } body#index .fs-hero-premium-v2 .fs-hero-text { max-width: 410px !important; color: #514f48 !important; font-size: 15.5px !important; line-height: 1.7 !important; margin: 0 0 26px !important; } body#index .fs-hero-premium-v2 .fs-hero-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 44px !important; padding: 0 26px !important; border-radius: 999px !important; background: linear-gradient(135deg, #9ca584 0%, #6f765c 100%) !important; color: #ffffff !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; text-decoration: none !important; box-shadow: 0 14px 32px rgba(111,118,92,0.28) !important; } body#index .fs-hero-premium-v2 .fs-hero-btn:hover { background: linear-gradient(135deg, #87906f 0%, #5f664e 100%) !important; transform: translateY(-2px) !important; } /* Si le slider écrase le texte */ body#index .fs-hero-caption { z-index: 10 !important; } /* ===================================================== CATÉGORIES RONDES PLUS PREMIUM ===================================================== */ body#index .fs-category-shortcuts { max-width: 1180px !important; margin-top: 34px !important; margin-bottom: 34px !important; gap: 24px !important; } body#index .fs-category-item { color: #34342f !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.055em !important; } body#index .fs-category-icon { width: 68px !important; height: 68px !important; margin-bottom: 12px !important; background: #e7eadc !important; color: #7c8465 !important; border: 1px solid rgba(143,150,119,0.18) !important; box-shadow: 0 10px 24px rgba(70,65,55,0.055) !important; } body#index .fs-category-item:hover .fs-category-icon { background: #8f9677 !important; color: #ffffff !important; transform: translateY(-4px) !important; box-shadow: 0 16px 34px rgba(111,118,92,0.20) !important; } /* ===================================================== SECTION PRODUITS HOME PLUS LUXE ===================================================== */ body#index .fs-best-section { max-width: 1240px !important; margin-top: 14px !important; margin-bottom: 38px !important; padding-left: 24px !important; padding-right: 24px !important; } body#index .fs-section-heading { margin-bottom: 24px !important; } body#index .fs-kicker { color: #7c8465 !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.12em !important; } body#index .fs-section-heading h2 { font-family: Georgia, "Times New Roman", serif !important; font-size: 38px !important; line-height: 1.1 !important; color: #292720 !important; font-weight: 400 !important; } body#index .fs-see-all { color: #2f302a !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.05em !important; } body#index .fs-see-all:hover { color: #8f9677 !important; } /* Produits moins compactés */ body#index .fs-products-preview { gap: 22px !important; } body#index .fs-product-card { background: #ffffff !important; border: 1px solid rgba(143,150,119,0.14) !important; border-radius: 18px !important; padding: 12px 12px 16px !important; box-shadow: 0 14px 34px rgba(70,65,55,0.065) !important; overflow: hidden !important; } body#index .fs-product-card:hover { transform: translateY(-6px) !important; box-shadow: 0 22px 52px rgba(70,65,55,0.12) !important; } body#index .fs-product-image { height: 220px !important; min-height: 220px !important; border-radius: 14px !important; background-color: #fbfaf6 !important; margin-bottom: 14px !important; } body#index .fs-product-card h3 { font-size: 14px !important; line-height: 1.35 !important; min-height: 38px !important; color: #2b2b2b !important; } body#index .fs-price { color: #6f765c !important; font-size: 16px !important; font-weight: 800 !important; } /* Badge produit plus fin */ body#index .fs-product-badge { background: #e78a9a !important; color: #ffffff !important; font-size: 9px !important; letter-spacing: 0.04em !important; padding: 5px 10px !important; } /* Promo card plus premium */ body#index .fs-promo-card { border-radius: 18px !important; min-height: 300px !important; box-shadow: 0 18px 44px rgba(70,65,55,0.09) !important; } body#index .fs-promo-card h3 { font-size: 38px !important; } body#index .fs-promo-card a { min-height: 42px !important; padding: 0 24px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } /* ===================================================== BLOCS CONFIANCE / MARKETING PLUS RESPIRANTS ===================================================== */ body#index .fs-trust-strip, body#index .fs-marketing-banners, body#index .fs-newsletter-band { max-width: 1240px !important; } body#index .fs-trust-strip { margin-top: 12px !important; margin-bottom: 34px !important; border-radius: 16px !important; box-shadow: 0 14px 34px rgba(70,65,55,0.055) !important; } body#index .fs-marketing-card { border-radius: 18px !important; box-shadow: 0 14px 34px rgba(70,65,55,0.055) !important; } body#index .fs-newsletter-inner { border-radius: 22px !important; } /* ===================================================== MOBILE HOME ===================================================== */ @media (max-width: 991px) { body#index .fs-hero-premium-v2 { max-width: 92% !important; margin: 0 auto !important; padding: 30px 26px !important; text-align: center !important; } body#index .fs-hero-premium-v2 h1 { font-size: 36px !important; } body#index .fs-hero-premium-v2 .fs-hero-text { margin-left: auto !important; margin-right: auto !important; } body#index .fs-products-preview { grid-template-columns: repeat(2, 1fr) !important; } body#index .fs-product-image { height: 190px !important; min-height: 190px !important; } } @media (max-width: 575px) { body#index .fs-hero-premium-v2 h1 { font-size: 31px !important; } body#index .fs-hero-premium-v2 { padding: 26px 22px !important; } body#index .fs-category-shortcuts { grid-template-columns: repeat(2, 1fr) !important; } body#index .fs-products-preview { grid-template-columns: 1fr !important; } body#index .fs-section-heading h2 { font-size: 31px !important; } } /* ===================================================== FOLIES SECRÈTES - HOME PREMIUM V2.1 Ampleur desktop + meilleure respiration ===================================================== */ /* Donne plus de largeur aux sections centrales de la home */ body#index .fs-category-shortcuts, body#index .fs-best-section, body#index .fs-trust-strip, body#index .fs-marketing-banners, body#index .fs-newsletter-band { max-width: 1320px !important; } /* Catégories : un peu plus présentes */ body#index .fs-category-shortcuts { margin-top: 42px !important; margin-bottom: 42px !important; gap: 30px !important; } body#index .fs-category-icon { width: 76px !important; height: 76px !important; font-size: 28px !important; } body#index .fs-category-item { font-size: 12.5px !important; } /* Section incontournable plus visible */ body#index .fs-best-section { margin-top: 6px !important; margin-bottom: 48px !important; } body#index .fs-section-heading h2 { font-size: 42px !important; } /* Produits home un peu plus grands */ body#index .fs-products-preview { gap: 24px !important; } body#index .fs-product-card { padding: 14px 14px 18px !important; border-radius: 20px !important; } body#index .fs-product-image { height: 245px !important; min-height: 245px !important; } body#index .fs-product-card h3 { font-size: 14.5px !important; } body#index .fs-price { font-size: 17px !important; } /* Carte promo à droite plus premium */ body#index .fs-promo-card { min-height: 330px !important; border-radius: 20px !important; } /* Bande réassurance plus lisible */ body#index .fs-trust-strip { padding: 28px 36px !important; margin-bottom: 42px !important; } /* Mobile : ne pas agrandir excessivement */ @media (max-width: 991px) { body#index .fs-product-image { height: 200px !important; min-height: 200px !important; } body#index .fs-section-heading h2 { font-size: 34px !important; } } @media (max-width: 575px) { body#index .fs-category-icon { width: 66px !important; height: 66px !important; } body#index .fs-product-image { height: 210px !important; min-height: 210px !important; } } /* Pages maintenance/404 : CSS retiré du Custom CSS global. Les styles doivent rester intégrés dans les templates .tpl uniquement, pour éviter de bloquer la homepage. */ /* ===================================================== FOLIES SECRÈTES - ÉTAPE 2 CATÉGORIE (préprod) Masquer filtres vides + bouton mobile tant que catalogue minimal Réactiver après config ps_facetedsearch cat. 44 + import catalogue ===================================================== */ body#category #horizontal_filters_wrap, body#category #horizontal_filters, body#category #js-active-search-filters, body#category .active_filters_box { display: none !important; visibility: hidden !important; margin: 0 !important; padding: 0 !important; min-height: 0 !important; height: 0 !important; overflow: hidden !important; } body#category #js-active-search-filters .toggle_btn, body#category #js-active-search-filters a[href="#horizontal_filters"], body#category .active_filters_box .toggle_btn, body#category .active_filters_box .st_show_on_mobile { display: none !important; } /* Sécurité sidebar : bestsellers colonne (si re-hook accidentel) */ body#category .stbestsellers_container.column_block { display: none !important; }