:root{--wine:#4b0f20;--wine2:#260812;--cream:#f6f0e8;--ink:#171313;--gold:#bb9258;--line:#ded6cc}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}.announcement{background:var(--wine2);color:#f8ead8;text-align:center;padding:10px 16px;font-size:12px;letter-spacing:.08em}.header{height:84px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 5vw;border-bottom:1px solid #eee;position:relative;background:#fff;z-index:20}.brand{font-family:Georgia,serif;font-size:28px;letter-spacing:.18em;line-height:.8;text-align:center}.brand span{color:var(--wine)}.brand small{display:block;font:8px Arial,sans-serif;letter-spacing:.5em;margin:8px 0 0 5px}.nav{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:28px;font-size:13px}.header>.brand{justify-self:start}.header-actions{justify-self:end;display:flex;gap:20px}.header-actions a,.icon-button,.bag{border:0;background:transparent;display:grid;place-items:center;cursor:pointer}.bag{position:relative}.bag span{position:absolute;right:-10px;top:-10px;background:var(--wine);color:#fff;border-radius:50%;font-size:10px;width:17px;height:17px;display:grid;place-items:center}.mobile-only{display:none}.hero{min-height:650px;background:var(--wine);color:#fff;display:grid;grid-template-columns:44% 56%;overflow:hidden}.hero-copy{padding:9vw 4vw 7vw 8vw;z-index:2}.eyebrow{font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);font-weight:700}.hero h1{font:clamp(48px,6vw,84px)/.98 Georgia,serif;max-width:680px;margin:25px 0}.hero-copy>p:not(.eyebrow){max-width:520px;color:#eadce0;font:18px/1.7 Georgia,serif}.hero-image{min-height:650px;background:linear-gradient(90deg,var(--wine) 0%,transparent 25%),linear-gradient(0deg,rgba(27,4,11,.4),transparent 45%)}.cta{display:inline-flex;align-items:center;gap:12px;margin-top:24px;padding:16px 22px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}.cta-light{background:#fff;color:var(--wine)}.cta-dark{background:var(--wine);color:#fff}.trustbar{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);padding:26px 6vw;background:#fff}.trustbar>div{display:flex;align-items:center;justify-content:center;gap:13px;border-right:1px solid var(--line)}.trustbar>div:last-child{border:0}.trustbar svg{color:var(--wine)}.trustbar span{font-size:12px;color:#756c66}.trustbar strong{display:block;color:var(--ink);font-size:13px;margin-bottom:3px}.section{padding:95px 6vw}.section-head{text-align:center;margin-bottom:45px}.section-head h2,.story h2,.newsletter h2{font:clamp(34px,4vw,54px)/1.08 Georgia,serif;margin:12px 0}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.category{height:460px;position:relative;padding:35px;color:#fff;display:flex;align-items:flex-end;overflow:hidden;background-position:center;background-size:cover}.category:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(22,6,12,.86),rgba(22,6,12,0) 68%)}.category>span{position:absolute;top:25px;left:25px;border:1px solid #ffffff80;padding:8px 10px;font-size:9px;letter-spacing:.18em}.category>div{position:relative}.category h3{font:38px Georgia,serif;margin:0 0 7px}.category p{color:#e9dde0;margin:0 0 20px}.category b{font-size:11px;letter-spacing:.1em;display:flex;gap:8px;align-items:center}.category-1{background:linear-gradient(145deg,#6c4b3f,#20191a)}.category-2{background:linear-gradient(145deg,#c58d91,#56283b)}.category-3{background:linear-gradient(145deg,#7b5531,#1f130d)}.shop{background:#faf8f5}.section-head.inline{display:flex;text-align:left;align-items:end;justify-content:space-between}.section-head .search{display:flex;gap:10px;align-items:center;border-bottom:1px solid #a99c91;padding:10px 0;width:280px}.section-head .search input{border:0;outline:0;background:transparent;width:100%;font-size:13px}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px 22px}.product-visual{height:380px;position:relative;display:grid;place-items:center;overflow:hidden}.product-visual.amber{background:#d7b080}.product-visual.smoke{background:#79736e}.product-visual.rose{background:#d5a8aa}.product-visual.noir{background:#292524}.product-visual.ivory{background:#e3dacb}.product-visual.gold{background:#a9854e}.badge{position:absolute;top:15px;left:15px;background:#fff;padding:7px 10px;font-size:9px;letter-spacing:.1em;text-transform:uppercase}.bottle{width:130px;height:185px;background:linear-gradient(145deg,rgba(255,255,255,.65),rgba(255,255,255,.08));border:1px solid #ffffff70;box-shadow:0 20px 35px #0004;display:grid;place-items:center;position:relative;color:#fff}.bottle i{position:absolute;width:52px;height:34px;top:-34px;background:#2c2524;border:1px solid #ffffff40}.bottle b{font:16px Georgia,serif;letter-spacing:.1em;text-align:center}.bottle small{display:block;font:6px Arial,sans-serif;letter-spacing:.15em;margin-top:6px}.quick{position:absolute;bottom:-55px;left:15px;right:15px;height:48px;border:0;background:var(--wine);color:#fff;text-transform:uppercase;font-size:10px;letter-spacing:.13em;cursor:pointer;transition:.25s}.product-visual:hover .quick,.quick:focus{bottom:15px}.family{font-size:10px;text-transform:uppercase;letter-spacing:.15em;color:#8d8077;margin:18px 0 7px}.product h3{font:22px Georgia,serif;margin:0}.price{display:flex;gap:10px;margin-top:8px;font-size:13px}.price del{color:#9d9189}.price strong{color:var(--wine)}.text-link{margin:45px auto 0;display:flex;width:max-content;gap:10px;align-items:center;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;border-bottom:1px solid}.empty{text-align:center;padding:60px}.story{display:grid;grid-template-columns:1fr 1fr;min-height:620px}.story-art{background:radial-gradient(circle at 50% 35%,#8d4054,#360b18 60%);color:#d8b57d;display:grid;place-items:center;font:64px Georgia,serif;letter-spacing:.2em}.story-copy{padding:8vw;background:var(--cream)}.story-copy>p:not(.eyebrow){font:17px/1.8 Georgia,serif;color:#5f5550}.story ul{list-style:none;padding:0;margin:30px 0}.story li{display:flex;gap:12px;margin:15px 0;font-size:13px}.story li svg{color:var(--wine)}.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.review-grid blockquote{margin:0;border:1px solid var(--line);padding:35px}.review-grid blockquote p{font:18px/1.6 Georgia,serif}.stars{color:#b08243;letter-spacing:.2em}.review-grid cite{font-style:normal;font-size:11px;text-transform:uppercase;letter-spacing:.1em}.newsletter{text-align:center;background:var(--wine2);color:#fff;padding:75px 20px}.newsletter>p:not(.eyebrow){color:#d7c5ca}.newsletter form{max-width:520px;margin:25px auto 0;display:flex}.newsletter input{flex:1;padding:16px;border:1px solid #ffffff60;background:transparent;color:#fff;outline:0}.newsletter button{background:#fff;color:var(--wine);border:0;padding:0 28px;text-transform:uppercase;font-size:10px;letter-spacing:.12em;font-weight:700}footer{background:#170b0f;color:#d9cdd0;padding:70px 7vw 30px;display:grid;grid-template-columns:2fr repeat(3,1fr);gap:45px;position:relative}.inverse{color:#fff;text-align:left;display:inline-block}.inverse span{color:#c69c63}footer p{font-size:12px;color:#8f8185}footer h4{color:#fff;font:16px Georgia,serif;margin:0 0 18px}footer>div:not(:first-child){display:flex;flex-direction:column;gap:11px;font-size:12px}footer>div a{display:flex;align-items:center;gap:8px}.copyright{grid-column:1/-1;border-top:1px solid #ffffff1a;padding-top:25px}.whatsapp{position:fixed;right:22px;bottom:22px;background:#25d366;color:#fff;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;z-index:30;box-shadow:0 8px 25px #0004}
@media(max-width:1000px){.nav{display:none;top:84px;left:0;right:0;transform:none;background:#fff;padding:25px;box-shadow:0 10px 30px #0002}.nav.open{display:flex;flex-direction:column}.mobile-only{display:grid}.header{grid-template-columns:1fr auto 1fr}.header>.brand{justify-self:center}.hero{grid-template-columns:1fr}.hero-copy{padding:90px 8vw 55px}.hero-image{min-height:380px}.trustbar{grid-template-columns:repeat(2,1fr);gap:20px}.trustbar>div{border:0}.category{height:370px}.product-grid{grid-template-columns:repeat(2,1fr)}.story{grid-template-columns:1fr}.story-art{min-height:400px}.review-grid{grid-template-columns:1fr}footer{grid-template-columns:2fr 1fr 1fr}}
@media(max-width:650px){.announcement{font-size:9px}.header{height:68px;padding:0 18px}.brand{font-size:22px}.header-actions a{display:none}.hero{min-height:auto}.hero-copy{padding:70px 24px}.hero h1{font-size:48px}.hero-image{min-height:300px}.trustbar{grid-template-columns:1fr 1fr;padding:25px 12px}.trustbar>div{justify-content:flex-start}.section{padding:70px 20px}.category-grid{grid-template-columns:1fr}.category{height:360px}.section-head.inline{display:block}.section-head .search{width:100%;margin-top:25px}.product-grid{gap:25px 12px}.product-visual{height:260px}.bottle{transform:scale(.75)}.product h3{font-size:18px}.story-art{min-height:310px;font-size:38px}.story-copy{padding:70px 24px}.newsletter form{display:block}.newsletter input{width:100%}.newsletter button{height:48px;width:100%;margin-top:8px}footer{grid-template-columns:1fr 1fr;padding:60px 25px}.copyright{grid-column:1/-1}}
/* WordPress + WooCommerce */
.site-header{height:84px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 5vw;border-bottom:1px solid #eee;position:relative;background:#fff;z-index:20}.site-header>.brand{justify-self:start}.custom-logo{max-height:58px;width:auto}.main-nav{position:absolute;left:50%;transform:translateX(-50%)}.main-nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;font-size:13px}.header-tools{justify-self:end;display:flex;gap:20px;font-size:23px}.cart-link{position:relative}.cart-count{position:absolute;right:-13px;top:-7px;background:var(--wine);color:#fff;border-radius:50%;font-size:10px;width:17px;height:17px;display:grid;place-items:center}.menu-toggle{display:none;border:0;background:none;font-size:21px}.content-wrap{max-width:1280px;margin:auto;padding:70px 5vw;min-height:55vh}.page-content{max-width:920px}.page-content h1,.shop-content .page-title,.empty-page h1{font:clamp(38px,5vw,64px)/1.05 Georgia,serif}.screen-reader-text{position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);overflow:hidden}.setup-note{text-align:center;padding:70px;border:1px solid var(--line)}
.woocommerce ul.products{display:grid!important;grid-template-columns:repeat(3,1fr);gap:35px 22px;margin:0!important}.woocommerce ul.products:before,.woocommerce ul.products:after{display:none}.woocommerce ul.products li.product{width:auto!important;margin:0!important;float:none!important}.woocommerce ul.products li.product a img{height:380px;object-fit:contain;background:#eee8df;margin:0 0 18px!important}.woocommerce ul.products li.product .woocommerce-loop-product__title{font:22px Georgia,serif;padding:0!important}.woocommerce ul.products li.product .price{color:var(--wine)!important;font-size:13px!important}.woocommerce ul.products li.product .button,.woocommerce button.button,.woocommerce a.button,.woocommerce input.button{background:var(--wine)!important;color:#fff!important;border-radius:0!important;padding:14px 18px!important;font-size:11px!important;text-transform:uppercase;letter-spacing:.08em}.woocommerce span.onsale{background:var(--wine)!important;border-radius:0!important;min-height:auto!important;line-height:1!important;padding:9px!important;top:12px!important;left:12px!important}.woocommerce div.product .product_title{font:clamp(36px,4vw,56px)/1.05 Georgia,serif}.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--wine)!important}.woocommerce-message,.woocommerce-info{border-top-color:var(--wine)!important}.woocommerce-message:before,.woocommerce-info:before{color:var(--wine)!important}.woocommerce .quantity .qty{padding:10px}.woocommerce-cart table.cart img{width:90px}.woocommerce-checkout #customer_details,.woocommerce-checkout #order_review{margin-bottom:35px}
@media(max-width:1000px){.main-nav{display:none;top:84px;left:0;right:0;transform:none;background:#fff;padding:25px;box-shadow:0 10px 30px #0002}.main-nav.open{display:block}.main-nav ul{flex-direction:column}.menu-toggle{display:block}.site-header{grid-template-columns:1fr auto 1fr}.site-header>.brand{justify-self:center}.woocommerce ul.products{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.site-header{height:68px;padding:0 18px}.woocommerce ul.products li.product a img{height:250px}.content-wrap{padding:50px 20px}.woocommerce div.product div.images,.woocommerce div.product div.summary{float:none!important;width:100%!important}.newsletter .wpcf7-form p{display:block}}
/* ORILOM 2.0 - palette conversion et parcours COD */
:root{--wine:#0b1220;--wine2:#07101f;--cream:#f7f7f2;--ink:#101828;--gold:#17b6a4;--line:#e4e7ec;--navy:#0b1220;--teal:#17b6a4;--orange:#f97316}
body{background:#f7f7f2;color:#101828}.announcement{background:#0b1220;color:#d0d5dd}.announcement strong{color:#8ff3e5}.site-header{position:sticky;top:0;background:#ffffffed;backdrop-filter:blur(12px)}.brand span{color:#17b6a4}.main-nav a:hover{color:#17b6a4}.cart-count{background:#f97316}.hero{background:#0b1220}.hero-copy>p:not(.eyebrow){color:#c7d0df}.cta-light,.woocommerce ul.products li.product .button,.woocommerce button.button,.woocommerce a.button,.woocommerce input.button{background:#f97316!important;color:#fff!important;border-radius:9px!important}.cta-light:hover,.woocommerce button.button:hover,.woocommerce a.button:hover{background:#ea580c!important}.trustbar b,.trustbar svg{color:#17b6a4}.category{border-radius:14px}.featured{background:#f7f7f2}.woocommerce ul.products li.product{background:#fff;border:1px solid #e4e7ec;border-radius:14px;overflow:hidden;padding-bottom:18px!important}.woocommerce ul.products li.product .woocommerce-loop-product__title,.woocommerce ul.products li.product .price,.woocommerce ul.products li.product .button{margin-left:18px!important;margin-right:18px!important}.woocommerce ul.products li.product a img{background:#edf0ef}.woocommerce span.onsale{background:#0b1220!important}.story-art{background:radial-gradient(circle at 50% 35%,#1d6464,#0b1220 68%);color:#8ff3e5}.story-copy{background:#eef7f5}.story li svg{color:#17b6a4}.newsletter{background:#0b1220}.site-footer{background:#07101f}.whatsapp{width:auto;height:auto;padding:14px 18px;border-radius:999px}.orilom-cod-box{background:#e9f9f6;border:2px solid #17b6a4;padding:15px;border-radius:10px;margin:18px 0;display:flex;flex-direction:column}.orilom-cod-box strong{color:#0b1220}.orilom-cod-box span{color:#52606d;font-size:11px;margin-top:4px}.woocommerce div.product .product_title{color:#0b1220}.woocommerce div.product p.price,.woocommerce div.product span.price{color:#ea580c!important}.woocommerce div.product div.images .flex-control-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px!important}.woocommerce div.product div.images .flex-control-thumbs li{width:100%!important;float:none!important}.woocommerce div.product div.images .flex-control-thumbs img{border:2px solid transparent;border-radius:8px}.woocommerce div.product div.images .flex-control-thumbs img.flex-active{border-color:#17b6a4}.woocommerce div.product div.images .woocommerce-product-gallery__image img{border-radius:14px}.woocommerce div.product form.cart{display:flex;gap:10px}.woocommerce div.product form.cart .button{flex:1}.woocommerce-tabs ul.tabs li.active a{color:#17b6a4!important}.woocommerce-checkout #payment{background:#eef7f5!important;border:2px solid #17b6a4;border-radius:12px!important}.woocommerce-checkout #payment ul.payment_methods{border:0!important}.woocommerce-checkout #payment .payment_box{background:#fff!important}.woocommerce-checkout #payment .payment_box:before{border-bottom-color:#fff!important}.orilom-blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.orilom-blog-grid article{background:#fff;border:1px solid #e4e7ec;border-radius:14px;padding:28px;min-height:220px}.orilom-blog-grid article>span{color:#17b6a4;font-size:9px;font-weight:900;letter-spacing:.12em}.orilom-blog-grid h3{font:25px/1.15 Georgia,serif}.orilom-blog-grid p{color:#667085;font-size:12px;line-height:1.6}.read-more{font-size:10px;font-weight:900}.blog .site-main,.single-post .site-main{max-width:900px;margin:auto;padding:70px 5vw}.single-post article{background:#fff;padding:50px;border-radius:14px}.single-post h1{font:clamp(42px,5vw,64px)/1.05 Georgia,serif}.single-post .entry-content{color:#475467;line-height:1.8}
@media(max-width:800px){.orilom-blog-grid{grid-template-columns:1fr}.woocommerce div.product form.cart{display:grid;grid-template-columns:90px 1fr}.single-post article{padding:25px}}
/* Fiche produit ORILOM 4.0 — galerie 3 images, décision rapide et COD visible. */
.single-product .shop-content{max-width:1380px;padding-top:70px}.single-product div.product{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);gap:6vw;align-items:start}.single-product div.product:before,.single-product div.product:after{display:none!important}.single-product div.product div.images,.single-product div.product div.summary{float:none!important;width:auto!important;margin:0!important}.single-product div.product div.summary{position:sticky;top:125px;background:#fff;border:1px solid #e4e7ec;border-radius:20px;padding:38px;box-shadow:0 24px 70px #0b12200d}.single-product .product_title{font:700 clamp(42px,4.8vw,66px)/.98 Georgia,serif!important;letter-spacing:-.025em;margin:10px 0 18px}.single-product div.product p.price{font-size:25px!important;font-weight:900;margin:0 0 22px}.single-product div.product p.price del{color:#98a2b3;opacity:1;font-size:17px}.single-product .woocommerce-product-details__short-description{color:#475467;font-size:15px;line-height:1.75}.orilom-notes{border-top:1px solid #e4e7ec;border-bottom:1px solid #e4e7ec;padding:20px 0;margin:22px 0}.orilom-notes>span{display:block;color:#667085;font-size:10px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;margin-bottom:12px}.orilom-notes>div{display:flex;gap:8px;flex-wrap:wrap}.orilom-notes b{background:#e9f9f6;color:#126b63;border:1px solid #b6ece5;border-radius:999px;padding:8px 12px;font-size:11px}.single-product .orilom-cod-box{margin:18px 0 16px}.single-product div.product form.cart{display:grid!important;grid-template-columns:92px 1fr;gap:10px;margin:18px 0!important}.single-product div.product form.cart .quantity,.single-product div.product form.cart .qty{width:100%;height:54px}.single-product div.product form.cart .qty{border:1px solid #d0d5dd;border-radius:10px}.single-product div.product form.cart .single_add_to_cart_button{min-height:54px;background:#f97316!important;font-size:12px!important;font-weight:900!important;box-shadow:0 12px 24px #f973162b}.single-product div.product form.cart .single_add_to_cart_button:hover{background:#ea580c!important;transform:translateY(-1px)}.orilom-product-trust{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}.orilom-product-trust span{background:#f7f7f2;border-radius:10px;padding:12px;color:#475467;font-size:10px;line-height:1.4}.orilom-product-trust b{color:#17b6a4}.single-product .product_meta{margin-top:24px;color:#667085;font-size:10px}.single-product .woocommerce-product-gallery__wrapper{border-radius:20px;overflow:hidden;background:#eef0ed}.single-product .woocommerce-product-gallery__image img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:0!important}.single-product div.product div.images .flex-control-thumbs{grid-template-columns:repeat(3,1fr);gap:12px}.single-product div.product div.images .flex-control-thumbs li img{aspect-ratio:1/1;object-fit:cover;border-radius:12px}.single-product .woocommerce-tabs,.single-product .related{grid-column:1/-1}.single-product .woocommerce-tabs{margin-top:55px;background:#fff;border:1px solid #e4e7ec;border-radius:18px;padding:25px 35px}.single-product .woocommerce-tabs ul.tabs{padding:0!important}.single-product .related{margin-top:55px}.single-product .related>h2{font:700 38px Georgia,serif}.single-product .woocommerce-breadcrumb{grid-column:1/-1;color:#667085;font-size:11px}
@media(max-width:900px){.single-product div.product{grid-template-columns:1fr}.single-product div.product div.summary{position:static;padding:26px}.single-product .product_title{font-size:44px!important}.orilom-product-trust{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.single-product .shop-content{padding-top:35px}.single-product div.product div.summary{padding:20px}.single-product .product_title{font-size:38px!important}.orilom-product-trust{grid-template-columns:1fr}.single-product .woocommerce-tabs{padding:18px}}
/* Home complète sans image intégrée : l'image hero vient uniquement du personnalisateur */
.hero-image{background-image:none;background-color:#101d33;background-image:radial-gradient(circle at 72% 34%,#1b6d6a 0,transparent 26%),radial-gradient(circle at 58% 70%,#17304d 0,transparent 34%),linear-gradient(145deg,#101d33,#07101f);position:relative}.hero-image.has-image{background-position:center;background-size:cover;background-repeat:no-repeat}.hero-image:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b1220,transparent 35%)}.hero-visual-copy{position:absolute;z-index:2;left:12%;right:12%;bottom:12%;border:1px dashed #ffffff45;border-radius:14px;padding:22px;color:#fff;background:#07101f55}.hero-image.has-image .hero-visual-copy{display:none}.hero-visual-copy small{display:block;color:#8ff3e5;font-size:9px;letter-spacing:.14em;font-weight:800}.hero-visual-copy strong{display:block;max-width:360px;font:24px/1.25 Georgia,serif;margin-top:8px}.hero-pill{display:inline-block;border:1px solid #2a6d69;background:#123839;color:#8ff3e5;border-radius:999px;padding:8px 12px;font-size:9px;font-weight:900;letter-spacing:.1em}.hero-actions{display:flex;gap:12px}.cta-outline{border:1px solid #ffffff55;color:#fff}.hero-mini-proof{display:flex;gap:24px;margin-top:24px;color:#cbd5e1;font-size:10px}.choice-section{padding:90px 7vw;background:#0b1220;color:#fff;display:grid;grid-template-columns:36% 64%;gap:7vw}.choice-section>div>h2,.cod-final h2{font:clamp(36px,4vw,54px)/1.05 Georgia,serif;margin:12px 0}.choice-section>div>p:not(.eyebrow){color:#b8c2d1;line-height:1.7}.choice-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.choice-steps article{border:1px solid #ffffff24;background:#ffffff08;border-radius:14px;padding:26px}.choice-steps article>b{color:#17b6a4}.choice-steps h3{font:22px Georgia,serif}.choice-steps p{color:#aab5c5;font-size:12px;line-height:1.6}.cod-final{margin:0;background:linear-gradient(120deg,#0b1220,#164846);color:#fff;padding:70px 8vw;display:flex;align-items:center;justify-content:space-between;gap:30px}.cod-final>div>p:not(.eyebrow){color:#c5d4d1;max-width:720px;line-height:1.7}
@media(max-width:1000px){.choice-section{grid-template-columns:1fr}.cod-final{display:block}.cod-final .cta{margin-top:15px}}
@media(max-width:650px){.hero-actions{display:block}.hero-actions .cta{width:100%;margin-top:10px}.hero-mini-proof{display:block}.hero-mini-proof span{display:block;margin-top:7px}.hero-visual-copy{left:20px;right:20px;bottom:20px}.choice-section{padding:65px 22px}.choice-steps{grid-template-columns:1fr}.cod-final{padding:60px 22px}}
/* ORILOM 3.0 - transposition fidèle de la démo 2.0 */
.orilom-home-v3{background:#f7f7f2}.hero-new{min-height:665px;display:grid;grid-template-columns:48% 52%;background:#0b1220;color:#fff;overflow:hidden}.hero-new .hero-copy{padding:105px 5vw 80px 7vw}.hero-new .pill{display:inline-flex;background:#143a3c;color:#9ff7ea;border:1px solid #1d5b5b;border-radius:999px;padding:8px 12px;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.hero-new h1{font:700 clamp(46px,5.4vw,78px)/1.01 Georgia,serif;margin:25px 0}.hero-new .hero-copy>p{color:#c7d0df;max-width:620px;font-size:17px;line-height:1.7}.hero-new .hero-actions{display:flex;gap:14px;margin-top:32px}.primary,.ghost{min-height:52px;padding:0 22px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:12px;font-weight:900;letter-spacing:.04em}.primary{background:#f97316;color:#fff;box-shadow:0 8px 24px #f9731636}.primary:hover{background:#ea580c}.ghost{border:1px solid #ffffff5c;color:#fff}.hero-proof{display:flex;gap:28px;margin-top:28px;color:#d1d8e3;font-size:11px}.hero-photo{position:relative;min-height:665px;background:radial-gradient(circle at 72% 34%,#1b6d6a 0,transparent 26%),radial-gradient(circle at 58% 70%,#17304d 0,transparent 34%),linear-gradient(145deg,#101d33,#07101f);background-size:cover;background-position:center}.hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b1220,transparent 35%)}.visual-placeholder{position:absolute;z-index:2;left:12%;right:12%;bottom:12%;border:1px dashed #ffffff45;border-radius:14px;padding:22px;color:#fff;background:#07101f55}.visual-placeholder small{display:block;color:#8ff3e5;font-size:9px;letter-spacing:.14em;font-weight:800}.visual-placeholder strong{display:block;font:26px/1.25 Georgia,serif;margin:8px 0}.visual-placeholder span{color:#c7d0df;font-size:10px}.conversion-strip{background:#fff;border-bottom:1px solid #e4e7ec;display:flex;align-items:center;padding:18px 6vw;gap:40px}.conversion-strip p{margin:0}.conversion-strip div{display:flex;flex:1;justify-content:space-between;color:#475467;font-size:11px}.shop-section,.blog-preview-v3{padding:95px 6vw;background:#f7f7f2}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:40px}.section-title h2,.choice-v3 h2,.final-cta-v3 h2{font:700 clamp(34px,4vw,52px)/1.05 Georgia,serif;margin:10px 0}.section-title p{color:#667085;margin:0}.kicker{color:#17b6a4;font-weight:900;font-size:10px;text-transform:uppercase;letter-spacing:.15em}.filters{display:flex;gap:5px;background:#fff;border:1px solid #e4e7ec;padding:5px;border-radius:12px}.filters a{padding:10px 16px;border-radius:8px;font-size:11px;font-weight:800}.filters .active{background:#0b1220;color:#fff}.shop-section .woocommerce ul.products li.product{border-radius:14px}.shop-section .woocommerce ul.products li.product a img{height:335px}.shop-section .woocommerce-loop-product__title{font:700 23px Georgia,serif!important}.shop-section .woocommerce ul.products li.product .button{display:block;text-align:center;margin-top:12px!important;background:#fff!important;color:#0b1220!important;border:1px solid #0b1220!important}.shop-section .woocommerce ul.products li.product .button:hover{background:#0b1220!important;color:#fff!important}.choice-v3{padding:100px 7vw;background:#0b1220;color:#fff;display:grid;grid-template-columns:38% 62%;gap:7vw}.choice-v3>div>p{color:#bfc8d6;line-height:1.7}.choice-v3 .primary{margin-top:20px}.choice-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.choice-cards article{background:#ffffff0d;border:1px solid #ffffff20;border-radius:14px;padding:28px}.choice-cards article>b{color:#17b6a4;font-size:12px}.choice-cards h3{font:22px Georgia,serif}.choice-cards p{color:#aeb8c8;font-size:12px;line-height:1.6}.blog-preview-v3{background:#fff}.blog-preview-v3 .section-title>a{font-size:11px;font-weight:900}.blog-preview-v3 .orilom-blog-grid article{min-height:235px}.final-cta-v3{margin:0 6vw 90px;padding:40px;background:linear-gradient(120deg,#dff8f4,#f7eee8);border-radius:18px;display:flex;align-items:center;gap:25px}.final-icon{width:52px;height:52px;border-radius:50%;background:#17b6a4;color:#fff;display:grid;place-items:center;font-size:22px}.final-cta-v3>div:nth-child(2){flex:1}.final-cta-v3 h2{font-size:34px;margin:4px 0}.final-cta-v3 span{font-size:11px;color:#667085}.blog-page-v3{max-width:1380px;margin:auto;padding:75px 5vw}.blog-page-v3>header{max-width:760px}.blog-page-v3 h1,.article-page-v3 h1{font:700 clamp(48px,6vw,72px)/1 Georgia,serif;margin:12px 0}.blog-page-v3 header>p,.article-page-v3 header>p{color:#667085;font-size:18px;line-height:1.7}.blog-list-v3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:55px}.blog-list-v3 article{background:#fff;border:1px solid #e4e7ec;border-radius:14px;overflow:hidden}.post-art-v3{height:180px;background:linear-gradient(135deg,#0b1220,#1f4f55);color:#ffffff17;display:grid;place-items:center;font:80px Georgia,serif}.blog-list-v3 article>div{padding:25px}.blog-list-v3 h2{font:27px/1.15 Georgia,serif}.blog-list-v3 p{color:#667085;font-size:12px;line-height:1.6}.article-page-v3{max-width:1000px;margin:auto;padding:75px 5vw}.article-page-v3 header{margin:55px 0}.article-page-v3>article{background:#fff;border-radius:18px;padding:55px;max-width:820px}.article-page-v3 article h2{font:32px Georgia,serif;margin-top:38px}.article-page-v3 article p,.article-page-v3 article li{color:#475467;line-height:1.8}.article-page-v3 article table{width:100%;border-collapse:collapse}.article-page-v3 th,.article-page-v3 td{border:1px solid #e4e7ec;padding:13px;text-align:left}.article-page-v3 th{background:#0b1220;color:#fff}.article-back{font-size:11px}.article-cta-v3{background:#e9f9f6;border-radius:12px;padding:25px;margin-top:40px}.article-cta-v3 .primary{margin-top:10px}
@media(max-width:1050px){.hero-new{grid-template-columns:1fr}.hero-photo{min-height:420px}.conversion-strip{display:block}.conversion-strip div{margin-top:12px}.choice-v3{grid-template-columns:1fr}.blog-list-v3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.hero-new .hero-copy{padding:70px 22px}.hero-new h1{font-size:47px}.hero-new .hero-actions{display:block}.hero-new .hero-actions a{width:100%;margin-top:10px}.hero-proof{display:block}.hero-proof span{display:block;margin-top:8px}.hero-photo{min-height:330px}.conversion-strip{padding:18px}.conversion-strip div{display:grid;grid-template-columns:1fr 1fr;gap:10px}.shop-section,.blog-preview-v3{padding:70px 18px}.section-title{display:block}.filters{margin-top:20px}.choice-v3{padding:70px 22px}.choice-cards{grid-template-columns:1fr}.final-cta-v3{margin:0 18px 60px;display:block}.final-cta-v3 .primary{width:100%;margin-top:16px}.blog-page-v3,.article-page-v3{padding:55px 18px}.blog-list-v3{grid-template-columns:1fr}.article-page-v3>article{padding:25px}}
/* ORILOM 5.0 — langage visuel de Parfumerie Lux : blanc, noir et or. */
:root{--lux-gold:#dfb913;--lux-gold-dark:#b88f00;--lux-black:#0b0b0b;--lux-soft:#f5f5f5;--lux-gray:#707070;--lux-line:#e5e5e5}
body{background:#fff;color:#111}.lux-topline{background:#f3f3f3;color:#1b1b1b;text-align:center;padding:13px 20px;font-size:12px;font-weight:600}.site-header.lux-header{height:auto;display:block;padding:0;background:#fff;position:relative;top:auto;border:0;box-shadow:none}.lux-header-main{max-width:1450px;margin:auto;min-height:105px;padding:18px 2.4vw;display:grid;grid-template-columns:220px 190px minmax(320px,1fr) 100px;gap:16px;align-items:center}.lux-brand{display:flex!important;flex-direction:column;align-items:center;justify-content:center;line-height:1;color:#080808!important;letter-spacing:.08em}.lux-brand strong{font:800 31px/1 Georgia,serif;letter-spacing:.06em}.lux-brand small{font:700 9px/1 Arial,sans-serif;letter-spacing:.35em;color:var(--lux-gold);margin-top:8px}.lux-brand .custom-logo-link{display:block}.lux-brand .custom-logo{max-width:210px;max-height:72px}.lux-brands{min-height:58px;background:#080808;color:#fff!important;display:flex;align-items:center;justify-content:center;gap:14px;font-size:12px;font-weight:700;letter-spacing:.05em}.lux-search{height:58px;border:1px solid #d9d9d9;display:grid;grid-template-columns:180px 1fr 58px;background:#fff}.lux-search select,.lux-search input,.lux-search button{border:0;background:transparent;outline:0}.lux-search select{border-right:1px solid #e4e4e4;color:#777;padding:0 15px;font-size:11px}.lux-search input{padding:0 18px;font-size:12px}.lux-search button{font-size:28px;cursor:pointer}.lux-header .header-tools{display:flex;justify-content:center;gap:25px;font-size:27px}.lux-header .cart-count{background:var(--lux-gold);color:#111}.lux-nav{position:static!important;left:auto!important;transform:none!important;border-top:1px solid #eee;border-bottom:1px solid #eee;padding:0 20px;background:#fff}.lux-nav ul{min-height:64px;justify-content:center;align-items:center;gap:42px!important;font-size:12px!important;font-weight:700}.lux-nav a:hover{color:var(--lux-gold-dark)}
.lux-home-v5{background:#fff}.lux-hero{height:min(650px,58vw);min-height:520px;position:relative;background-color:#fff;background-image:none;background-size:cover;background-position:center;overflow:hidden}.lux-hero:after{content:none;display:none;background:none;opacity:0}.lux-hero-copy{position:absolute;z-index:2;right:7%;top:50%;transform:translateY(-50%);width:min(520px,42vw);text-align:center}.lux-hero-copy>span,.lux-product-section header>span,.lux-auth>span,.lux-split-banner span,.lux-blog-v5 header>span{font-size:10px;font-weight:800;letter-spacing:.22em;color:var(--lux-gold-dark)}.lux-hero h1{font:700 clamp(44px,5vw,72px)/1.02 Georgia,serif;margin:18px 0;color:#18130e}.lux-hero p{color:#554b40;line-height:1.7;font-size:14px}.lux-hero-copy>a,.lux-auth>a,.lux-split-banner a{display:inline-flex;min-height:50px;align-items:center;justify-content:center;background:transparent;border:1px solid #111;padding:0 32px;margin-top:18px;font-size:11px;font-weight:900;letter-spacing:.12em}.lux-hero-copy>a:hover,.lux-auth>a:hover,.lux-split-banner a:hover{background:#111;color:#fff}.lux-hero-placeholder{position:absolute;z-index:3;left:7%;bottom:8%;padding:18px 22px;border:1px dashed #17171788;background:#ffffffa8;display:flex;flex-direction:column;gap:6px}.lux-hero-placeholder b{font-size:11px;letter-spacing:.15em}.lux-hero-placeholder span{font-size:10px;color:#555}.lux-trust{max-width:1450px;margin:auto;padding:42px 3vw;display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #eee}.lux-trust article{display:flex;justify-content:center;align-items:center;gap:15px;border-right:1px solid #ddd}.lux-trust article:last-child{border:0}.lux-trust article>b{font-size:30px;color:var(--lux-gold-dark)}.lux-trust h3{font:700 15px Georgia,serif;margin:0 0 4px}.lux-trust p{margin:0;color:#777;font-size:10px}.lux-categories{max-width:1450px;margin:35px auto 0;padding:0 3vw;display:grid;grid-template-columns:1fr 1fr;gap:20px}.lux-categories>a{min-height:340px;padding:45px;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;position:relative;overflow:hidden}.lux-categories>a:first-child{background:linear-gradient(145deg,#232323,#6f675e)}.lux-categories>a:last-child{background:linear-gradient(145deg,#5e420e,#1a1207)}.lux-categories>a:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#000b,transparent 70%)}.lux-categories span,.lux-categories h2,.lux-categories b{position:relative}.lux-categories span{font-size:9px;letter-spacing:.22em;color:#ecd87b}.lux-categories h2{font:42px Georgia,serif;margin:10px 0}.lux-categories b{font-size:10px;letter-spacing:.13em}.lux-product-section{max-width:1450px;margin:auto;padding:85px 3vw}.lux-product-section>header{text-align:center;margin-bottom:42px}.lux-product-section h2,.lux-blog-v5 h2{font:700 clamp(35px,4vw,50px)/1 Georgia,serif;margin:12px 0}.lux-product-section .woocommerce ul.products{gap:28px 18px}.lux-product-section .woocommerce ul.products.columns-6{grid-template-columns:repeat(6,1fr)}.lux-product-section .woocommerce ul.products.columns-4{grid-template-columns:repeat(4,1fr)}.lux-product-section .woocommerce ul.products li.product{border:0;border-radius:0;padding:0!important;text-align:center;background:#fff}.lux-product-section .woocommerce ul.products li.product a img{height:auto!important;aspect-ratio:1/1;object-fit:cover;background:#f6f6f6;margin:0 0 18px!important}.lux-product-section .woocommerce-loop-product__title{font:700 13px/1.45 Arial,sans-serif!important;text-transform:uppercase;min-height:42px;margin:0!important;padding:0 8px!important}.lux-product-section .woocommerce ul.products li.product .price{justify-content:center;color:#111!important;font-size:12px!important;font-weight:800;margin:8px 0 0!important}.lux-product-section .woocommerce ul.products li.product .button{opacity:0;transform:translateY(5px);transition:.2s;display:block!important;background:#111!important;color:#fff!important;border:0!important;border-radius:0!important;margin:10px 8px 0!important}.lux-product-section .woocommerce ul.products li.product:hover .button{opacity:1;transform:none}.lux-product-section .onsale{background:var(--lux-gold)!important;color:#111!important}.lux-light{background:#fafafa;max-width:none;padding-left:max(3vw,calc((100vw - 1450px)/2 + 3vw));padding-right:max(3vw,calc((100vw - 1450px)/2 + 3vw))}.lux-auth{background:#101010;color:#fff;text-align:center;padding:95px 20px}.lux-auth h2{font:50px/1.08 Georgia,serif;margin:18px 0}.lux-auth p{max-width:720px;margin:0 auto;color:#bbb;line-height:1.8}.lux-auth a{border-color:var(--lux-gold);color:var(--lux-gold)}.lux-auth a:hover{background:var(--lux-gold);color:#111}.lux-split-banner{max-width:1450px;margin:auto;padding:25px 3vw 0;display:grid;grid-template-columns:1fr 1fr;gap:20px}.lux-split-banner>div{min-height:360px;padding:55px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.lux-split-banner>div:first-child{background:linear-gradient(135deg,#efe4cf,#c7a969)}.lux-split-banner>div:last-child{background:linear-gradient(135deg,#f5f5f5,#d7d7d7)}.lux-split-banner h2{font:44px Georgia,serif;margin:12px 0}.lux-split-banner p{max-width:520px;color:#555;line-height:1.7}.lux-blog-v5{padding:90px max(3vw,calc((100vw - 1450px)/2 + 3vw));background:#f7f7f7}.lux-blog-v5>header{text-align:center;margin-bottom:40px}.lux-blog-v5>header>a{font-size:10px;font-weight:800;letter-spacing:.1em;border-bottom:1px solid}.lux-blog-v5 .orilom-blog-grid article{border-radius:0;border:0;border-top:3px solid var(--lux-gold)}
.newsletter{background:var(--lux-gold);color:#111}.newsletter>p:not(.eyebrow){color:#473900}.newsletter input{border-color:#111;color:#111}.newsletter input::placeholder{color:#5d4c00}.newsletter button{background:#111;color:#fff}.site-footer{background:#0c0c0c}.site-footer .brand span,.site-footer a:hover{color:var(--lux-gold)}
/* Fiche produit v5 inspirée de la hiérarchie de l’ancienne boutique. */
.single-product .shop-content{max-width:none;padding:0 0 80px}.lux-product-bar{background:var(--lux-gold);padding:21px max(3vw,calc((100vw - 1320px)/2));display:flex;align-items:center;gap:12px;color:#4a3a00;font-size:12px}.lux-product-nav{margin-left:auto}.single-product div.product{max-width:1320px;margin:0 auto!important;padding:58px 20px 0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}.single-product div.product div.summary{position:static;background:#fff;border:0;border-radius:0;padding:0;box-shadow:none}.single-product div.product p.price{font-size:19px!important;color:#111!important;margin:0 0 25px}.single-product .product_title{font:800 clamp(25px,2.4vw,34px)/1.25 Arial,sans-serif!important;letter-spacing:0;text-transform:uppercase;margin:0 0 22px}.single-product .woocommerce-product-rating{color:#bbb;font-size:11px;margin-bottom:45px!important}.single-product .woocommerce-product-details__short-description{color:#686868;font-size:13px;line-height:1.8}.single-product .orilom-notes{border-color:#eee}.single-product .orilom-notes>span{color:#777}.single-product .orilom-notes b{background:#fff9dc;border-color:#ead470;color:#5f4b00}.single-product .orilom-cod-box{background:#fff;border:0;border-left:3px solid var(--lux-gold);border-radius:0;padding:10px 15px}.single-product div.product form.cart{grid-template-columns:100px 1fr 1fr!important;gap:8px!important;background:#f7f7f7;padding:16px;margin-top:22px!important}.single-product div.product form.cart .qty{border-radius:0;background:#fff}.single-product div.product form.cart .single_add_to_cart_button{background:#111!important;border-radius:0!important;box-shadow:none;letter-spacing:.15em!important}.single-product div.product form.cart .single_add_to_cart_button:hover{background:#333!important}.single-product .lux-buy-now{background:var(--lux-gold)!important;color:#111!important;border-radius:0!important}.single-product .lux-buy-now:hover{background:var(--lux-gold-dark)!important}.single-product .orilom-product-trust{grid-template-columns:repeat(3,1fr);gap:8px}.single-product .orilom-product-trust span{background:#fff;border:1px solid #e7e1cf;border-radius:10px;padding:13px 11px;display:grid;grid-template-columns:32px 1fr;grid-template-rows:auto auto;align-items:center;text-align:left}.single-product .orilom-product-trust b{grid-row:1/3;font-size:21px;color:var(--lux-gold-dark)}.single-product .orilom-product-trust strong{font-size:10px}.single-product .orilom-product-trust small{font-size:8px;color:#777}.single-product .woocommerce-product-gallery__wrapper{border-radius:0;background:#fafafa}.single-product .woocommerce-product-gallery__image img{aspect-ratio:1/1;object-fit:contain}.single-product div.product div.images .flex-control-thumbs li img{border-radius:0}.single-product div.product div.images .flex-control-thumbs img.flex-active{border-color:var(--lux-gold)}.single-product .woocommerce-tabs{margin-top:70px;border:0;border-radius:0;border-top:1px solid #ddd;padding:0}.single-product .woocommerce-tabs ul.tabs{display:flex;justify-content:center;gap:18px;border-bottom:1px solid #ddd}.single-product .woocommerce-tabs ul.tabs:before{display:none!important}.single-product .woocommerce-tabs ul.tabs li{border:0!important;background:transparent!important}.single-product .woocommerce-tabs ul.tabs li.active{border-bottom:3px solid var(--lux-gold)!important}.single-product .woocommerce-tabs .panel{max-width:1050px;margin:45px auto!important;color:#555;line-height:1.8}.single-product .woocommerce-tabs .panel h2{color:#111}.single-product .related>h2{text-align:center;font:42px Georgia,serif}.single-product .related{max-width:1320px;margin-left:auto;margin-right:auto}
@media(max-width:1100px){.lux-header-main{grid-template-columns:190px 1fr 90px}.lux-brands{display:none}.lux-product-section .woocommerce ul.products.columns-6{grid-template-columns:repeat(3,1fr)}.lux-nav ul{gap:22px!important}.lux-hero-copy{right:5%;width:48vw}.single-product .orilom-product-trust{grid-template-columns:1fr}}
@media(max-width:780px){.lux-topline{font-size:10px}.lux-header-main{min-height:78px;grid-template-columns:55px 1fr 75px;padding:10px 16px}.lux-header .menu-toggle{display:block}.lux-brand strong{font-size:25px}.lux-search{grid-column:1/-1;grid-row:2;height:48px;grid-template-columns:120px 1fr 45px}.lux-nav{display:none!important}.lux-nav.open{display:block!important}.lux-nav ul{display:flex!important;min-height:auto;padding:20px!important}.lux-hero{height:auto;min-height:580px}.lux-hero-copy{position:relative;right:auto;top:auto;transform:none;width:auto;padding:90px 25px;text-align:center}.lux-hero-placeholder{left:18px;right:18px;bottom:18px}.lux-trust{grid-template-columns:1fr 1fr;gap:22px}.lux-trust article{border:0;justify-content:flex-start}.lux-categories,.lux-split-banner{grid-template-columns:1fr}.lux-categories>a{min-height:280px}.lux-product-section{padding:65px 18px}.lux-product-section .woocommerce ul.products.columns-6,.lux-product-section .woocommerce ul.products.columns-4{grid-template-columns:repeat(2,1fr)}.lux-product-section .woocommerce ul.products li.product .button{opacity:1;transform:none}.lux-auth{padding:70px 20px}.lux-auth h2{font-size:38px}.lux-split-banner{padding:18px}.lux-split-banner>div{min-height:300px;padding:35px}.single-product div.product{grid-template-columns:1fr;padding-top:35px}.single-product div.product form.cart{grid-template-columns:82px 1fr!important}.single-product .lux-buy-now{grid-column:1/-1}.single-product .woocommerce-tabs ul.tabs{display:block}.lux-product-nav{display:none}}
@media(max-width:480px){.lux-search select{display:none}.lux-search{grid-template-columns:1fr 45px}.lux-trust{grid-template-columns:1fr}.lux-categories{padding:0 18px}.lux-product-section .woocommerce ul.products.columns-6,.lux-product-section .woocommerce ul.products.columns-4{gap:24px 10px}.lux-product-section .woocommerce-loop-product__title{font-size:11px!important}.lux-split-banner h2{font-size:36px}.single-product .product_title{font-size:26px!important}}
/* ORILOM 5.1 — wishlist et espace client, sans modification du design v5. */
.wishlist-link{position:relative}.wishlist-count{position:absolute;right:-12px;top:-8px;background:var(--lux-gold);color:#111;border-radius:50%;font-size:9px;width:17px;height:17px;display:grid;place-items:center}.lux-header .header-tools{min-width:135px}.orilom-wishlist-button{display:block;width:calc(100% - 16px);margin:8px auto 0;padding:9px 10px;border:1px solid #d7d7d7;color:#333;text-align:center;font-size:9px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.orilom-wishlist-button:hover,.orilom-wishlist-button.is-active{border-color:var(--lux-gold);background:#fff9dc;color:#6b5300}.single-product .orilom-wishlist-button{width:auto;display:inline-flex;padding:11px 16px;margin:12px 0 0}.orilom-resend-verification{margin-top:35px;padding:25px;border-top:1px solid #ddd}.orilom-resend-verification h3{font:22px Georgia,serif}.orilom-resend-verification input{width:min(100%,420px);padding:13px;border:1px solid #ccc}.orilom-account-wishlist h2{font:34px Georgia,serif}.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{color:var(--lux-gold-dark)}
/* =========================================================
ORILOM — HEADER ACTIONS PREMIUM
Favoris / Panier / Compte lisibles + compteurs propres
========================================================= */
.lux-header-main{
grid-template-columns:
220px
190px
minmax(320px, 1fr)
minmax(300px, 340px) !important;
}
.lux-header .header-tools{
min-width:0 !important;
width:100% !important;
display:flex !important;
align-items:center !important;
justify-content:flex-end !important;
gap:10px !important;
font-size:16px !important;
}
.lux-header .header-tools > a{
position:relative !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:44px !important;
margin:0 !important;
padding:0 13px !important;
gap:8px !important;
color:#111 !important;
background:#fff !important;
border:1px solid transparent !important;
border-radius:999px !important;
text-decoration:none !important;
font-family:Arial,sans-serif !important;
font-size:12px !important;
line-height:1 !important;
font-weight:700 !important;
white-space:nowrap !important;
transition:
background-color .18s ease,
border-color .18s ease,
color .18s ease,
box-shadow .18s ease !important;
}
.lux-header .header-tools > a svg,
.lux-header .header-tools > a i{
width:21px !important;
height:21px !important;
min-width:21px !important;
font-size:21px !important;
line-height:1 !important;
}
/* Ordre : Favoris / Panier / Compte */
.lux-header .header-tools > .wishlist-link{
order:1 !important;
}
.lux-header .header-tools > .cart-link{
order:2 !important;
}
.lux-header .header-tools > a:not(.wishlist-link):not(.cart-link){
order:3 !important;
}
/* Libellés */
.lux-header .header-tools > .wishlist-link::after{
content:"Favoris";
display:inline-block;
}
.lux-header .header-tools > .cart-link::after{
content:"Mon Panier";
display:inline-block;
}
.lux-header .header-tools > a:not(.wishlist-link):not(.cart-link)::after{
content:"Se connecter";
display:inline-block;
}
/* Favoris */
.lux-header .header-tools > .wishlist-link:hover{
background:#fafafa !important;
border-color:#e7e7e7 !important;
}
/* Panier = CTA principal */
.lux-header .header-tools > .cart-link{
min-width:116px !important;
padding-left:15px !important;
padding-right:17px !important;
color:#fff !important;
background:#111 !important;
border-color:#111 !important;
box-shadow:0 5px 16px rgba(0,0,0,.10) !important;
}
.lux-header .header-tools > .cart-link:hover{
color:#111 !important;
background:var(--lux-gold,#dfb913) !important;
border-color:var(--lux-gold,#dfb913) !important;
}
/* Compte */
.lux-header .header-tools > a:not(.wishlist-link):not(.cart-link):hover{
background:#fafafa !important;
border-color:#e7e7e7 !important;
}
/* Compteurs */
.lux-header .wishlist-link,
.lux-header .cart-link{
position:relative !important;
}
.lux-header .wishlist-count,
.lux-header .cart-count{
position:absolute !important;
top:-6px !important;
right:4px !important;
z-index:20 !important;
display:grid !important;
place-items:center !important;
width:19px !important;
min-width:19px !important;
height:19px !important;
min-height:19px !important;
margin:0 !important;
padding:0 3px !important;
border-radius:999px !important;
border:2px solid #fff !important;
background:var(--lux-gold,#dfb913) !important;
color:#111 !important;
font-family:Arial,sans-serif !important;
font-size:9px !important;
line-height:1 !important;
font-weight:900 !important;
box-sizing:border-box !important;
text-align:center !important;
transform:none !important;
}
.lux-header .cart-link .cart-count{
top:-7px !important;
right:3px !important;
}
.lux-header .wishlist-link .wishlist-count{
top:-7px !important;
right:2px !important;
}
.lux-header .wishlist-count:empty,
.lux-header .cart-count:empty{
display:none !important;
}
.lux-header .header-tools > a:focus-visible{
outline:2px solid #111 !important;
outline-offset:3px !important;
}
/* Tablette */
@media(max-width:1250px){
.lux-header-main{
grid-template-columns:
190px
165px
minmax(280px,1fr)
minmax(235px,270px) !important;
gap:10px !important;
}
.lux-header .header-tools{
gap:4px !important;
}
.lux-header .header-tools > a{
padding-left:9px !important;
padding-right:9px !important;
font-size:11px !important;
}
.lux-header .header-tools > .cart-link{
min-width:104px !important;
}
}
/* Petit desktop : icônes seules pour protéger la barre de recherche */
@media(max-width:1050px){
.lux-header-main{
grid-template-columns:
170px
150px
minmax(230px,1fr)
150px !important;
}
.lux-header .header-tools{
gap:8px !important;
}
.lux-header .header-tools > a{
width:42px !important;
min-width:42px !important;
height:42px !important;
min-height:42px !important;
padding:0 !important;
}
.lux-header .header-tools > .cart-link{
width:46px !important;
min-width:46px !important;
}
.lux-header .header-tools > a::after{
display:none !important;
content:none !important;
}
.lux-header .wishlist-count,
.lux-header .cart-count{
top:-6px !important;
right:-3px !important;
}
}
/* Mobile */
@media(max-width:720px){
.lux-header .header-tools{
width:auto !important;
min-width:0 !important;
gap:6px !important;
}
.lux-header .header-tools > a{
width:40px !important;
min-width:40px !important;
height:40px !important;
min-height:40px !important;
padding:0 !important;
}
.lux-header .header-tools > a::after{
display:none !important;
content:none !important;
}
.lux-header .wishlist-count,
.lux-header .cart-count{
width:18px !important;
min-width:18px !important;
height:18px !important;
min-height:18px !important;
top:-5px !important;
right:-4px !important;
font-size:8px !important;
}
}
/* =========================================================
ORILOM — MON COMPTE FAVORIS PREMIUM V2
Corrige la grille écrasée + modernise sidebar/cartes.
Scope principal : .orilom-account-wishlist
========================================================= */
/* ---------- Structure générale compte ---------- */
body.woocommerce-account .content-wrap.page-content{
max-width: 1480px !important;
width: calc(100% - 48px) !important;
margin: 0 auto !important;
padding: 48px 0 80px !important;
}
body.woocommerce-account .content-wrap.page-content > h1,
body.woocommerce-account .content-wrap.page-content .entry-title{
margin: 0 0 34px !important;
color: #111 !important;
font: 700 clamp(34px, 3.2vw, 48px)/1.08 Georgia, serif !important;
letter-spacing: -.02em !important;
}
/* vraie grille compte */
body.woocommerce-account .woocommerce{
display: grid !important;
grid-template-columns: 240px minmax(0, 1fr) !important;
gap: 42px !important;
align-items: start !important;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
}
body.woocommerce-account .woocommerce::before,
body.woocommerce-account .woocommerce::after{
display: none !important;
content: none !important;
}
/* ---------- Sidebar compte ---------- */
body.woocommerce-account .woocommerce-MyAccount-navigation{
float: none !important;
clear: none !important;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 12px !important;
background: #fff !important;
border: 1px solid #e9e9e9 !important;
border-radius: 16px !important;
box-shadow: 0 8px 28px rgba(0,0,0,.035) !important;
position: sticky !important;
top: 24px !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation ul{
display: flex !important;
flex-direction: column !important;
gap: 4px !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li{
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li a{
display: flex !important;
align-items: center !important;
min-height: 44px !important;
width: 100% !important;
padding: 0 14px !important;
border-radius: 10px !important;
color: #343434 !important;
background: transparent !important;
font-size: 13px !important;
line-height: 1.2 !important;
font-weight: 600 !important;
text-decoration: none !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover{
background: #f7f7f7 !important;
color: #111 !important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation
li.is-active a{
background: #111 !important;
color: #fff !important;
}
/* ---------- Colonne contenu ---------- */
body.woocommerce-account .woocommerce-MyAccount-content{
float: none !important;
clear: none !important;
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
/* ---------- Wishlist wrapper ---------- */
body.woocommerce-account .orilom-account-wishlist{
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
}
body.woocommerce-account .orilom-account-wishlist > h2{
margin: 0 0 8px !important;
color: #111 !important;
font: 700 30px/1.15 Georgia, serif !important;
letter-spacing: -.015em !important;
}
body.woocommerce-account .orilom-account-wishlist > h2::after{
content: "Retrouvez ici vos parfums sauvegardés.";
display: block !important;
margin-top: 8px !important;
color: #777 !important;
font-family: Arial, sans-serif !important;
font-size: 13px !important;
line-height: 1.5 !important;
font-weight: 400 !important;
letter-spacing: 0 !important;
}
/* ---------- IMPORTANT : annule les largeurs Woo classiques ---------- */
body.woocommerce-account
.orilom-account-wishlist
ul.products{
display: grid !important;
grid-template-columns:
repeat(3, minmax(0, 1fr)) !important;
gap: 24px !important;
width: 100% !important;
max-width: none !important;
margin: 30px 0 0 !important;
padding: 0 !important;
list-style: none !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products::before,
body.woocommerce-account
.orilom-account-wishlist
ul.products::after{
display: none !important;
content: none !important;
}
/* Carte */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product{
position: relative !important;
float: none !important;
clear: none !important;
display: flex !important;
flex-direction: column !important;
width: 100% !important;
min-width: 0 !important;
max-width: none !important;
margin: 0 !important;
padding: 0 0 18px !important;
background: #fff !important;
border: 1px solid #e8e8e8 !important;
border-radius: 15px !important;
overflow: hidden !important;
box-shadow: 0 8px 26px rgba(0,0,0,.04) !important;
}
/* Le lien produit remplit la carte */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
> a.woocommerce-LoopProduct-link{
display: block !important;
width: 100% !important;
color: inherit !important;
text-decoration: none !important;
}
/* Image */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
img.wp-post-image,
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
img.attachment-woocommerce_thumbnail{
display: block !important;
width: 100% !important;
height: auto !important;
aspect-ratio: 1 / 1 !important;
margin: 0 !important;
padding: 18px !important;
object-fit: contain !important;
background: #f7f7f5 !important;
border: 0 !important;
border-radius: 0 !important;
}
/* Badge promo */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.onsale{
top: 12px !important;
left: 12px !important;
right: auto !important;
min-width: 0 !important;
min-height: 0 !important;
padding: 7px 10px !important;
border-radius: 999px !important;
background: #111 !important;
color: #fff !important;
font-size: 10px !important;
line-height: 1 !important;
font-weight: 800 !important;
z-index: 5 !important;
}
/* Titre */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.woocommerce-loop-product__title{
min-height: 54px !important;
margin: 0 !important;
padding: 16px 16px 6px !important;
color: #111 !important;
font-family: Arial, sans-serif !important;
font-size: 14px !important;
line-height: 1.4 !important;
font-weight: 700 !important;
text-transform: none !important;
overflow-wrap: normal !important;
word-break: normal !important;
hyphens: none !important;
}
/* Prix */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.price{
display: flex !important;
align-items: center !important;
flex-wrap: wrap !important;
gap: 7px !important;
margin: 0 !important;
padding: 0 16px 15px !important;
color: #111 !important;
font-size: 13px !important;
line-height: 1.35 !important;
font-weight: 700 !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.price del{
color: #999 !important;
font-weight: 400 !important;
opacity: 1 !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.price ins{
color: #111 !important;
text-decoration: none !important;
font-weight: 800 !important;
}
/* Bouton panier */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.button{
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: calc(100% - 32px) !important;
min-width: 0 !important;
min-height: 44px !important;
margin: auto 16px 8px !important;
padding: 11px 14px !important;
border: 1px solid #111 !important;
border-radius: 9px !important;
background: #111 !important;
color: #fff !important;
font-size: 11px !important;
line-height: 1.2 !important;
font-weight: 800 !important;
letter-spacing: .03em !important;
text-transform: uppercase !important;
text-align: center !important;
white-space: normal !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.button:hover{
background: var(--lux-gold,#dfb913) !important;
border-color: var(--lux-gold,#dfb913) !important;
color: #111 !important;
}
/* Favori actif = action secondaire */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.orilom-wishlist-button{
position: static !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: calc(100% - 32px) !important;
min-width: 0 !important;
max-width: none !important;
min-height: 40px !important;
margin: 0 16px !important;
padding: 9px 12px !important;
overflow: visible !important;
border: 1px solid #e0c65a !important;
border-radius: 9px !important;
background: #fff9dc !important;
color: #6b5300 !important;
font-family: Arial, sans-serif !important;
font-size: 10px !important;
line-height: 1.2 !important;
font-weight: 800 !important;
text-indent: 0 !important;
white-space: normal !important;
text-align: center !important;
text-transform: uppercase !important;
}
/* Empêche les règles anti-flash des cartes boutique de toucher Mes favoris */
body.woocommerce-account
.orilom-account-wishlist
.orilom-wishlist-button::before,
body.woocommerce-account
.orilom-account-wishlist
.orilom-wishlist-button::after{
position: static !important;
}
/* lien ajouté après AJAX Woo */
body.woocommerce-account
.orilom-account-wishlist
.added_to_cart{
margin: 4px 16px 0 !important;
color: #555 !important;
font-size: 11px !important;
font-weight: 700 !important;
text-align: center !important;
}
/* ---------- Empty state ---------- */
body.woocommerce-account
.orilom-account-wishlist
.woocommerce-info{
margin-top: 26px !important;
padding: 26px !important;
border: 1px solid #e8e8e8 !important;
border-top: 3px solid var(--lux-gold,#dfb913) !important;
border-radius: 12px !important;
background: #fafafa !important;
}
/* ---------- Responsive ---------- */
@media (max-width: 1100px){
body.woocommerce-account .woocommerce{
grid-template-columns: 210px minmax(0, 1fr) !important;
gap: 26px !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products{
grid-template-columns:
repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 780px){
body.woocommerce-account .content-wrap.page-content{
width: calc(100% - 28px) !important;
padding-top: 28px !important;
}
body.woocommerce-account .woocommerce{
display: flex !important;
flex-direction: column !important;
gap: 20px !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation{
position: static !important;
width: 100% !important;
overflow-x: auto !important;
overflow-y: hidden !important;
padding: 8px !important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation ul{
flex-direction: row !important;
width: max-content !important;
min-width: 100% !important;
gap: 5px !important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation li{
width: auto !important;
flex: 0 0 auto !important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation li a{
width: auto !important;
min-height: 40px !important;
padding: 0 12px !important;
white-space: nowrap !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products{
grid-template-columns:
repeat(2, minmax(0, 1fr)) !important;
gap: 14px !important;
}
}
@media (max-width: 520px){
body.woocommerce-account
.orilom-account-wishlist
ul.products{
grid-template-columns:
minmax(0, 1fr) !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.woocommerce-loop-product__title{
min-height: 0 !important;
}
}
/* =========================================================
ORILOM — FAVORIS LAYOUT HARD FIX V3
Fix structurel : la colonne contenu doit réellement
occuper toute la 2e colonne du compte.
========================================================= */
body.woocommerce-account .woocommerce{
display:grid !important;
grid-template-columns:
240px
minmax(0,1fr) !important;
grid-template-areas:
"account-nav account-content" !important;
column-gap:42px !important;
row-gap:0 !important;
width:100% !important;
max-width:100% !important;
align-items:start !important;
justify-items:stretch !important;
}
/* Force chaque enfant dans SA colonne */
body.woocommerce-account
.woocommerce
> .woocommerce-MyAccount-navigation{
grid-area:account-nav !important;
grid-column:1 !important;
width:240px !important;
min-width:240px !important;
max-width:240px !important;
justify-self:start !important;
}
body.woocommerce-account
.woocommerce
> .woocommerce-MyAccount-content{
grid-area:account-content !important;
grid-column:2 !important;
display:block !important;
width:100% !important;
min-width:0 !important;
max-width:none !important;
justify-self:stretch !important;
box-sizing:border-box !important;
}
/* Aucun parent de la wishlist ne doit shrink-to-fit */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist{
display:block !important;
width:100% !important;
min-width:0 !important;
max-width:none !important;
box-sizing:border-box !important;
}
/* Grille produits : largeur réelle + cartes confortables */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products{
display:grid !important;
grid-template-columns:
repeat(3,minmax(220px,1fr)) !important;
gap:24px !important;
width:100% !important;
min-width:0 !important;
max-width:none !important;
margin:30px 0 0 !important;
padding:0 !important;
align-items:stretch !important;
justify-content:stretch !important;
}
/* Neutralise définitivement les largeurs WooCommerce columns-* */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products[class*="columns-"]
> li.product,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products
> li.product{
float:none !important;
width:100% !important;
min-width:0 !important;
max-width:none !important;
margin:0 !important;
box-sizing:border-box !important;
}
/* Carte plus premium et moins haute */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product{
min-height:0 !important;
padding-bottom:16px !important;
border-radius:14px !important;
box-shadow:
0 5px 18px rgba(0,0,0,.045) !important;
}
/* Zone image régulière */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
> a.woocommerce-LoopProduct-link{
display:flex !important;
flex-direction:column !important;
width:100% !important;
min-width:0 !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
img.wp-post-image,
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
img.attachment-woocommerce_thumbnail{
width:100% !important;
height:auto !important;
aspect-ratio:1 / 1 !important;
padding:22px !important;
object-fit:contain !important;
}
/* Titres : jamais lettre par lettre */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.woocommerce-loop-product__title{
width:100% !important;
min-width:0 !important;
min-height:0 !important;
padding:16px 16px 8px !important;
font-size:14px !important;
line-height:1.4 !important;
word-break:normal !important;
overflow-wrap:break-word !important;
hyphens:none !important;
}
/* Prix */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.price{
min-height:38px !important;
padding:0 16px 14px !important;
font-size:13px !important;
}
/* Actions plus compactes */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.button{
width:calc(100% - 32px) !important;
min-height:42px !important;
margin:auto 16px 8px !important;
padding:10px 12px !important;
font-size:10px !important;
white-space:nowrap !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.orilom-wishlist-button{
width:calc(100% - 32px) !important;
min-height:38px !important;
margin:0 16px !important;
padding:9px 10px !important;
font-size:9px !important;
white-space:nowrap !important;
}
/* Desktop moyen : 2 colonnes plutôt que des cartes écrasées */
@media(max-width:1180px){
body.woocommerce-account .woocommerce{
grid-template-columns:
210px
minmax(0,1fr) !important;
column-gap:28px !important;
}
body.woocommerce-account
.woocommerce
> .woocommerce-MyAccount-navigation{
width:210px !important;
min-width:210px !important;
max-width:210px !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products{
grid-template-columns:
repeat(2,minmax(210px,1fr)) !important;
}
}
/* Mobile/tablette : navigation au-dessus */
@media(max-width:780px){
body.woocommerce-account .woocommerce{
display:flex !important;
flex-direction:column !important;
width:100% !important;
gap:20px !important;
}
body.woocommerce-account
.woocommerce
> .woocommerce-MyAccount-navigation,
body.woocommerce-account
.woocommerce
> .woocommerce-MyAccount-content{
width:100% !important;
min-width:0 !important;
max-width:none !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products{
grid-template-columns:
repeat(2,minmax(0,1fr)) !important;
gap:14px !important;
}
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.button,
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.orilom-wishlist-button{
white-space:normal !important;
}
}
@media(max-width:520px){
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products{
grid-template-columns:
minmax(0,1fr) !important;
}
}
/* =========================================================
ORILOM — FAVORIS HIDE TITLE V4
Cache uniquement le titre "Mes favoris"
et conserve la petite phrase descriptive.
========================================================= */
body.woocommerce-account
.orilom-account-wishlist
> h2{
margin: 0 0 20px !important;
padding: 0 !important;
font-size: 0 !important;
line-height: 0 !important;
color: transparent !important;
}
/* Conserve la phrase descriptive ajoutée sous le titre */
body.woocommerce-account
.orilom-account-wishlist
> h2::after{
content: "Retrouvez ici vos parfums sauvegardés.";
display: block !important;
margin: 0 !important;
color: #777 !important;
font-family: Arial, sans-serif !important;
font-size: 13px !important;
line-height: 1.5 !important;
font-weight: 400 !important;
letter-spacing: 0 !important;
}
/* =========================================================
ORILOM — MY ACCOUNT UNIFIED UX V5
Unifie Orders / Downloads / Addresses / Account details /
Mes favoris avec une même hiérarchie visuelle.
========================================================= */
/* ---------------------------------------------------------
1. CONTENU : même largeur, même rythme, même trait
--------------------------------------------------------- */
body.woocommerce-account .woocommerce-MyAccount-content{
position: relative !important;
width: 100% !important;
min-width: 0 !important;
max-width: none !important;
padding-top: 22px !important;
border-top: 2px solid #111 !important;
box-sizing: border-box !important;
}
/* Supprime les anciens traits Woo afin d'avoir UN seul séparateur */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-error{
border-top: 0 !important;
}
/* ---------------------------------------------------------
2. TYPOGRAPHIE / ESPACEMENTS GÉNÉRAUX
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-MyAccount-content > p:first-child{
margin-top: 0 !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content p{
color: #555 !important;
font-size: 13px !important;
line-height: 1.65 !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content h2,
body.woocommerce-account
.woocommerce-MyAccount-content h3{
color: #111 !important;
}
/* ---------------------------------------------------------
3. NOTICES ORDERS / DOWNLOADS
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message{
display: flex !important;
align-items: center !important;
min-height: 68px !important;
margin: 0 0 24px !important;
padding: 14px 18px !important;
background: #f7f7f7 !important;
border: 1px solid #ececec !important;
border-radius: 12px !important;
color: #333 !important;
box-shadow: none !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info::before,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message::before{
position: static !important;
flex: 0 0 auto !important;
margin: 0 12px 0 0 !important;
color: var(--lux-gold,#dfb913) !important;
}
/* Boutons des notices : à droite, CTA net */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info .button,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message .button{
margin-left: auto !important;
min-height: 42px !important;
padding: 0 18px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
border: 1px solid #111 !important;
border-radius: 9px !important;
background: #111 !important;
color: #fff !important;
font-size: 10px !important;
line-height: 1 !important;
font-weight: 800 !important;
letter-spacing: .06em !important;
white-space: nowrap !important;
box-shadow: 0 5px 14px rgba(0,0,0,.08) !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info .button:hover,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message .button:hover{
background: var(--lux-gold,#dfb913) !important;
border-color: var(--lux-gold,#dfb913) !important;
color: #111 !important;
}
/* ---------------------------------------------------------
4. TABLE COMMANDES
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-orders-table{
width: 100% !important;
margin: 0 !important;
border: 1px solid #e6e6e6 !important;
border-radius: 12px !important;
border-collapse: separate !important;
border-spacing: 0 !important;
overflow: hidden !important;
background: #fff !important;
}
body.woocommerce-account
.woocommerce-orders-table th{
padding: 13px 14px !important;
background: #fafafa !important;
color: #555 !important;
font-size: 10px !important;
font-weight: 800 !important;
letter-spacing: .05em !important;
text-transform: uppercase !important;
border-bottom: 1px solid #e8e8e8 !important;
}
body.woocommerce-account
.woocommerce-orders-table td{
padding: 15px 14px !important;
color: #222 !important;
font-size: 12px !important;
border-bottom: 1px solid #eee !important;
vertical-align: middle !important;
}
body.woocommerce-account
.woocommerce-orders-table tr:last-child td{
border-bottom: 0 !important;
}
body.woocommerce-account
.woocommerce-orders-table
.woocommerce-button{
min-height: 38px !important;
padding: 0 15px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 8px !important;
background: #111 !important;
color: #fff !important;
font-size: 10px !important;
font-weight: 800 !important;
}
/* ---------------------------------------------------------
5. ADRESSES : intro + cartes unifiées
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-Addresses{
margin-top: 22px !important;
}
body.woocommerce-account
.woocommerce-Address{
padding: 24px !important;
border: 1px solid #e6e6e6 !important;
border-radius: 16px !important;
background: #fff !important;
box-shadow: 0 7px 24px rgba(0,0,0,.03) !important;
}
body.woocommerce-account
.woocommerce-Address-title h3{
font-size: 20px !important;
line-height: 1.15 !important;
}
body.woocommerce-account
.woocommerce-Address-title a.edit{
min-height: 38px !important;
padding: 0 13px !important;
display: inline-flex !important;
align-items: center !important;
border: 1px solid #ddd !important;
border-radius: 8px !important;
background: #fff !important;
color: #111 !important;
font-size: 10px !important;
font-weight: 700 !important;
}
body.woocommerce-account
.woocommerce-Address-title a.edit:hover{
border-color: #111 !important;
}
/* ---------------------------------------------------------
6. ACCOUNT DETAILS — formulaire premium
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-EditAccountForm{
width: 100% !important;
max-width: 940px !important;
margin: 0 !important;
}
/* Prénom + nom sur une ligne */
body.woocommerce-account
.woocommerce-EditAccountForm
.form-row-first,
body.woocommerce-account
.woocommerce-EditAccountForm
.form-row-last{
width: calc(50% - 8px) !important;
margin-bottom: 18px !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm
.form-row-first{
float: left !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm
.form-row-last{
float: right !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm
.form-row-wide{
width: 100% !important;
float: none !important;
clear: both !important;
margin-bottom: 18px !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm label{
display: block !important;
margin: 0 0 7px !important;
color: #222 !important;
font-size: 12px !important;
line-height: 1.3 !important;
font-weight: 700 !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm input[type="text"],
body.woocommerce-account
.woocommerce-EditAccountForm input[type="email"],
body.woocommerce-account
.woocommerce-EditAccountForm input[type="password"]{
width: 100% !important;
height: 48px !important;
padding: 0 14px !important;
border: 1px solid #d9d9d9 !important;
border-radius: 9px !important;
background: #fff !important;
color: #111 !important;
font-size: 13px !important;
outline: 0 !important;
box-shadow: none !important;
box-sizing: border-box !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm input:focus{
border-color: #111 !important;
box-shadow: 0 0 0 3px rgba(0,0,0,.06) !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm em{
display: block !important;
margin-top: 6px !important;
color: #888 !important;
font-size: 10px !important;
line-height: 1.45 !important;
}
/* Bloc mot de passe */
body.woocommerce-account
.woocommerce-EditAccountForm fieldset{
clear: both !important;
margin: 28px 0 22px !important;
padding: 24px !important;
border: 1px solid #e6e6e6 !important;
border-radius: 14px !important;
background: #fafafa !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm fieldset legend{
padding: 0 9px !important;
color: #111 !important;
font-size: 13px !important;
font-weight: 800 !important;
}
/* bouton enregistrer */
body.woocommerce-account
.woocommerce-EditAccountForm
button[name="save_account_details"]{
min-height: 46px !important;
padding: 0 22px !important;
border: 1px solid #111 !important;
border-radius: 9px !important;
background: #111 !important;
color: #fff !important;
font-size: 11px !important;
font-weight: 800 !important;
letter-spacing: .05em !important;
box-shadow: 0 6px 18px rgba(0,0,0,.08) !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm
button[name="save_account_details"]:hover{
background: var(--lux-gold,#dfb913) !important;
border-color: var(--lux-gold,#dfb913) !important;
color: #111 !important;
}
/* ---------------------------------------------------------
7. FAVORIS — même trait + meilleure respiration
--------------------------------------------------------- */
/* Le titre h2 est caché en V4 : son pseudo-texte devient intro */
body.woocommerce-account
.orilom-account-wishlist
> h2{
margin: 0 0 22px !important;
}
/* Trait désormais fourni par .woocommerce-MyAccount-content */
body.woocommerce-account
.orilom-account-wishlist
> h2::after{
margin: 0 !important;
color: #777 !important;
font-size: 12px !important;
}
/* Réduit l'espace avant la grille pour rester cohérent */
body.woocommerce-account
.orilom-account-wishlist
ul.products{
margin-top: 22px !important;
}
/* Favoris : action secondaire plus propre */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.orilom-wishlist-button{
border-color: #dfc65b !important;
background: #fffdf4 !important;
color: #695300 !important;
letter-spacing: .02em !important;
}
/* ---------------------------------------------------------
8. SIDEBAR — petite amélioration hiérarchique
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-MyAccount-navigation{
padding: 10px !important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation li a{
min-height: 42px !important;
padding: 0 13px !important;
font-size: 12px !important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation li.is-active a{
box-shadow: 0 5px 13px rgba(0,0,0,.08) !important;
}
/* ---------------------------------------------------------
9. ACCESSIBILITÉ / FOCUS
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-MyAccount-navigation a:focus-visible,
body.woocommerce-account
.woocommerce-MyAccount-content a:focus-visible,
body.woocommerce-account
.woocommerce-MyAccount-content button:focus-visible{
outline: 2px solid #111 !important;
outline-offset: 3px !important;
}
/* ---------------------------------------------------------
10. RESPONSIVE
--------------------------------------------------------- */
@media(max-width:780px){
body.woocommerce-account
.woocommerce-MyAccount-content{
padding-top: 18px !important;
}
body.woocommerce-account
.woocommerce-EditAccountForm
.form-row-first,
body.woocommerce-account
.woocommerce-EditAccountForm
.form-row-last{
width: 100% !important;
float: none !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message{
align-items: flex-start !important;
flex-wrap: wrap !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info .button,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message .button{
width: 100% !important;
margin: 12px 0 0 !important;
}
body.woocommerce-account
.woocommerce-orders-table{
display: block !important;
overflow-x: auto !important;
-webkit-overflow-scrolling: touch;
}
}
/* =========================================================
ORILOM — MY ACCOUNT HIERARCHY V6
H1 constant "Mon compte" + titre endpoint + séparateur premium.
========================================================= */
/* ---------------------------------------------------------
1. H1 TOUJOURS "MON COMPTE" — taille plus logique
--------------------------------------------------------- */
body.woocommerce-account
.content-wrap.page-content > h1,
body.woocommerce-account
.content-wrap.page-content .entry-title{
margin: 0 0 28px !important;
padding: 0 !important;
color: transparent !important;
font-size: 0 !important;
line-height: 0 !important;
}
body.woocommerce-account
.content-wrap.page-content > h1::after,
body.woocommerce-account
.content-wrap.page-content .entry-title::after{
content: "Mon compte";
display: block !important;
color: #111 !important;
font-family: Georgia, serif !important;
font-size: clamp(34px, 3vw, 46px) !important;
line-height: 1.08 !important;
font-weight: 500 !important;
letter-spacing: -.025em !important;
}
/* ---------------------------------------------------------
2. SUPPRIME L'ANCIEN TRAIT BRUT
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-MyAccount-content{
padding-top: 0 !important;
border-top: 0 !important;
}
/* ---------------------------------------------------------
3. TITRE DE SECTION DYNAMIQUE + TRAIT PREMIUM
Le titre correspond à l'élément actif de la sidebar.
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-MyAccount-content::before{
content: "Vue d’ensemble";
display: block !important;
width: 100% !important;
margin: 0 0 22px !important;
padding: 0 0 14px !important;
color: #111 !important;
font-family: Arial, sans-serif !important;
font-size: 18px !important;
line-height: 1.2 !important;
font-weight: 800 !important;
letter-spacing: -.01em !important;
/*
* 72 px noirs à gauche + ligne gris clair sur toute la largeur.
* Plus élégant qu'une bordure noire lourde.
*/
background-image:
linear-gradient(#111,#111),
linear-gradient(#dedede,#dedede) !important;
background-repeat: no-repeat !important;
background-size:
72px 2px,
100% 1px !important;
background-position:
left bottom,
left bottom !important;
box-shadow:
0 7px 12px -13px rgba(0,0,0,.55) !important;
}
/* Dashboard */
body.woocommerce-account
.woocommerce:has(
.woocommerce-MyAccount-navigation-link--dashboard.is-active
)
.woocommerce-MyAccount-content::before{
content: "Vue d’ensemble";
}
/* Orders */
body.woocommerce-account
.woocommerce:has(
.woocommerce-MyAccount-navigation-link--orders.is-active
)
.woocommerce-MyAccount-content::before{
content: "Mes commandes";
}
/* Downloads */
body.woocommerce-account
.woocommerce:has(
.woocommerce-MyAccount-navigation-link--downloads.is-active
)
.woocommerce-MyAccount-content::before{
content: "Mes téléchargements";
}
/* Addresses */
body.woocommerce-account
.woocommerce:has(
.woocommerce-MyAccount-navigation-link--edit-address.is-active
)
.woocommerce-MyAccount-content::before{
content: "Mes adresses";
}
/* Account details */
body.woocommerce-account
.woocommerce:has(
.woocommerce-MyAccount-navigation-link--edit-account.is-active
)
.woocommerce-MyAccount-content::before{
content: "Mes informations";
}
/* Favoris custom endpoint */
body.woocommerce-account
.woocommerce:has(
.woocommerce-MyAccount-navigation-link--favoris.is-active
)
.woocommerce-MyAccount-content::before{
content: "Mes favoris";
}
/* Fallback si le slug ajoute une classe légèrement différente */
body.woocommerce-account
.woocommerce:has(
[class*="MyAccount-navigation-link"][class*="favor"].is-active
)
.woocommerce-MyAccount-content::before{
content: "Mes favoris";
}
/* ---------------------------------------------------------
4. HIÉRARCHIE SIDEBAR
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce-MyAccount-navigation{
border-radius: 14px !important;
box-shadow:
0 7px 24px rgba(0,0,0,.035) !important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation li a{
min-height: 42px !important;
padding: 0 13px !important;
border-radius: 9px !important;
color: #333 !important;
font-size: 12px !important;
line-height: 1.2 !important;
font-weight: 600 !important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation li.is-active a{
color: #fff !important;
background: #111 !important;
font-weight: 800 !important;
box-shadow:
0 5px 14px rgba(0,0,0,.10) !important;
}
/* ---------------------------------------------------------
5. ÉVITE LES DOUBLONS VISUELS DANS FAVORIS
Le nouveau titre de section est désormais fourni ci-dessus.
--------------------------------------------------------- */
body.woocommerce-account
.orilom-account-wishlist > h2{
display: none !important;
}
/* L'intro reste visible, recréée proprement */
body.woocommerce-account
.orilom-account-wishlist::before{
content: "Retrouvez ici vos parfums sauvegardés.";
display: block !important;
margin: -6px 0 20px !important;
color: #777 !important;
font-family: Arial, sans-serif !important;
font-size: 12px !important;
line-height: 1.5 !important;
font-weight: 400 !important;
}
/* ---------------------------------------------------------
6. DASHBOARD — meilleure lecture
--------------------------------------------------------- */
body.woocommerce-account
.woocommerce:has(
.woocommerce-MyAccount-navigation-link--dashboard.is-active
)
.woocommerce-MyAccount-content > p{
max-width: 860px !important;
}
body.woocommerce-account
.woocommerce:has(
.woocommerce-MyAccount-navigation-link--dashboard.is-active
)
.woocommerce-MyAccount-content > p:first-of-type{
margin-top: 0 !important;
}
/* ---------------------------------------------------------
7. RESPONSIVE
--------------------------------------------------------- */
@media(max-width:780px){
body.woocommerce-account
.content-wrap.page-content > h1::after,
body.woocommerce-account
.content-wrap.page-content .entry-title::after{
font-size: 34px !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content::before{
margin-bottom: 18px !important;
padding-bottom: 12px !important;
font-size: 16px !important;
background-size:
56px 2px,
100% 1px !important;
}
}
/* =========================================================
ORILOM — ACCOUNT HEADER + EDIT FORM V7
- Connecté : "Se déconnecter"
- Visiteur : "Se connecter"
- Formulaire Mes informations compact et structuré
========================================================= */
/* ---------------------------------------------------------
HEADER : libellé cohérent avec l'état de session
--------------------------------------------------------- */
/* L'action de session reste secondaire : pas de gros CTA */
.lux-header
.header-tools
> a.orilom-account-session-link{
min-width:118px !important;
}
body.logged-in
.lux-header
.header-tools
> a.orilom-account-session-link:hover{
background:#f7f7f7 !important;
border-color:#dedede !important;
color:#111 !important;
}
/* ---------------------------------------------------------
EDIT ACCOUNT : largeur maîtrisée
--------------------------------------------------------- */
body.woocommerce-edit-account
.woocommerce-MyAccount-content{
max-width:none !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm{
display:grid !important;
grid-template-columns:
repeat(2,minmax(0,1fr)) !important;
column-gap:18px !important;
row-gap:16px !important;
width:100% !important;
max-width:920px !important;
margin:0 !important;
padding:0 !important;
align-items:start !important;
}
/* Les deviennent de vraies cellules de grille */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
> p.form-row,
body.woocommerce-edit-account
.woocommerce-EditAccountForm
> p.woocommerce-form-row{
width:100% !important;
min-width:0 !important;
float:none !important;
clear:none !important;
margin:0 !important;
padding:0 !important;
grid-column:auto !important;
}
/* Prénom + Nom côte à côte */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
> .form-row-first{
grid-column:1 !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
> .form-row-last{
grid-column:2 !important;
}
/*
* Les deux champs suivants (Display name + Email) utilisent
* aussi la grille 2 colonnes au lieu de créer 2 longues barres.
*/
body.woocommerce-edit-account
.woocommerce-EditAccountForm
> .form-row-wide{
grid-column:auto !important;
}
/* Label */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
label{
display:block !important;
margin:0 0 7px !important;
color:#222 !important;
font-size:11px !important;
line-height:1.3 !important;
font-weight:700 !important;
}
/* Champs */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
input[type="text"],
body.woocommerce-edit-account
.woocommerce-EditAccountForm
input[type="email"],
body.woocommerce-edit-account
.woocommerce-EditAccountForm
input[type="password"]{
display:block !important;
width:100% !important;
height:46px !important;
margin:0 !important;
padding:0 13px !important;
border:1px solid #d9d9d9 !important;
border-radius:9px !important;
background:#fff !important;
color:#111 !important;
font-size:12px !important;
outline:none !important;
box-shadow:none !important;
box-sizing:border-box !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
input:focus{
border-color:#111 !important;
box-shadow:
0 0 0 3px rgba(0,0,0,.055) !important;
}
/* Aide sous Display name */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
em{
display:block !important;
margin:6px 0 0 !important;
color:#8a8a8a !important;
font-size:9px !important;
line-height:1.45 !important;
}
/* ---------------------------------------------------------
SÉCURITÉ : bloc mot de passe compact
--------------------------------------------------------- */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset{
grid-column:1 / -1 !important;
display:grid !important;
grid-template-columns:
repeat(2,minmax(0,1fr)) !important;
column-gap:18px !important;
row-gap:14px !important;
width:100% !important;
margin:8px 0 2px !important;
padding:20px !important;
border:1px solid #e5e5e5 !important;
border-radius:13px !important;
background:#fafafa !important;
box-sizing:border-box !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset legend{
padding:0 9px !important;
color:#111 !important;
font-size:12px !important;
font-weight:800 !important;
}
/* p dans le fieldset */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset
p.form-row,
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset
p.woocommerce-form-row{
width:100% !important;
float:none !important;
clear:none !important;
margin:0 !important;
padding:0 !important;
}
/* Mot de passe actuel = pleine largeur */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset
p:nth-of-type(1){
grid-column:1 / -1 !important;
}
/* Nouveau + confirmation restent côte à côte */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset
p:nth-of-type(2){
grid-column:1 !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset
p:nth-of-type(3){
grid-column:2 !important;
}
/* Bouton save : vraie fin de formulaire */
body.woocommerce-edit-account
.woocommerce-EditAccountForm
> p:last-child{
grid-column:1 / -1 !important;
margin-top:4px !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
button[name="save_account_details"]{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
width:auto !important;
min-width:220px !important;
min-height:44px !important;
margin:0 !important;
padding:0 20px !important;
border:1px solid #111 !important;
border-radius:9px !important;
background:#111 !important;
color:#fff !important;
font-size:10px !important;
line-height:1 !important;
font-weight:800 !important;
letter-spacing:.05em !important;
box-shadow:
0 5px 15px rgba(0,0,0,.08) !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
button[name="save_account_details"]:hover{
background:var(--lux-gold,#dfb913) !important;
border-color:var(--lux-gold,#dfb913) !important;
color:#111 !important;
}
/* ---------------------------------------------------------
RESPONSIVE FORM
--------------------------------------------------------- */
@media(max-width:780px){
body.woocommerce-edit-account
.woocommerce-EditAccountForm{
grid-template-columns:1fr !important;
row-gap:14px !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
> .form-row-first,
body.woocommerce-edit-account
.woocommerce-EditAccountForm
> .form-row-last,
body.woocommerce-edit-account
.woocommerce-EditAccountForm
> .form-row-wide{
grid-column:1 !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset{
grid-template-columns:1fr !important;
padding:16px !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset
p:nth-of-type(1),
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset
p:nth-of-type(2),
body.woocommerce-edit-account
.woocommerce-EditAccountForm
fieldset
p:nth-of-type(3){
grid-column:1 !important;
}
body.woocommerce-edit-account
.woocommerce-EditAccountForm
button[name="save_account_details"]{
width:100% !important;
min-width:0 !important;
}
}
/* =========================================================
ORILOM — FAVORIS UX CLEAN V8
- Retire le bouton redondant "Dans mes favoris"
- Étire réellement la grille jusqu'à la largeur du trait
- Conserve 3 cartes premium sur desktop
========================================================= */
/* Le wrapper Favoris prend exactement la largeur du contenu */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist{
display:block !important;
width:100% !important;
inline-size:100% !important;
min-width:0 !important;
max-width:100% !important;
max-inline-size:100% !important;
margin:0 !important;
padding:0 !important;
box-sizing:border-box !important;
}
/*
* Sur la page Favoris, le bouton "Dans mes favoris" est redondant :
* l'utilisateur sait déjà que les produits affichés sont sauvegardés.
*/
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.orilom-wishlist-button{
display:none !important;
}
/* La grille occupe toute la même largeur que le séparateur supérieur */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products{
display:grid !important;
grid-template-columns:
repeat(3,minmax(0,1fr)) !important;
gap:24px !important;
width:100% !important;
inline-size:100% !important;
min-width:0 !important;
max-width:100% !important;
max-inline-size:100% !important;
margin:22px 0 0 !important;
padding:0 !important;
justify-content:stretch !important;
justify-items:stretch !important;
align-items:stretch !important;
box-sizing:border-box !important;
}
/* WooCommerce ne peut plus imposer ses anciennes largeurs de colonnes */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products[class*="columns-"]
> li.product,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products
> li.product{
display:flex !important;
flex-direction:column !important;
width:100% !important;
inline-size:100% !important;
min-width:0 !important;
max-width:none !important;
max-inline-size:none !important;
margin:0 !important;
justify-self:stretch !important;
box-sizing:border-box !important;
}
/* Carte légèrement plus raffinée après suppression du 2e bouton */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product{
padding-bottom:14px !important;
}
/* Le CTA panier devient la seule action principale */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.button{
width:calc(100% - 28px) !important;
min-height:42px !important;
margin:auto 14px 0 !important;
padding:10px 14px !important;
border-radius:9px !important;
font-size:10px !important;
}
/* Un peu moins de vide sous le texte d'introduction */
body.woocommerce-account
.orilom-account-wishlist::before{
margin:-6px 0 16px !important;
}
/* Tablette */
@media(max-width:1180px){
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products{
grid-template-columns:
repeat(2,minmax(0,1fr)) !important;
gap:18px !important;
}
}
/* Mobile */
@media(max-width:620px){
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
ul.products{
grid-template-columns:
minmax(0,1fr) !important;
gap:16px !important;
}
}
/* =========================================================
ORILOM — FAVORIS NESTED WOO FIX V9
Correctif RACINE :
le rendu de la wishlist contient un .woocommerce imbriqué.
L'ancienne règle "body.woocommerce-account .woocommerce"
le prenait à tort pour la grille principale Mon compte.
========================================================= */
/*
* IMPORTANT :
* la grille 240px + contenu doit concerner uniquement le conteneur
* principal du compte, jamais le .woocommerce généré dans Mes favoris.
*/
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
.woocommerce{
display:block !important;
grid-template-columns:none !important;
grid-template-rows:none !important;
grid-template-areas:none !important;
column-gap:0 !important;
row-gap:0 !important;
gap:0 !important;
width:100% !important;
min-width:0 !important;
max-width:100% !important;
margin:0 !important;
padding:0 !important;
position:static !important;
float:none !important;
clear:both !important;
box-sizing:border-box !important;
}
/* Aucun pseudo élément Woo imbriqué ne participe au layout */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
.woocommerce::before,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
.woocommerce::after{
display:none !important;
content:none !important;
}
/*
* Le UL utilise désormais exactement la largeur du contenu
* de droite, donc la même largeur que le trait "Mes favoris".
*/
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
.woocommerce
ul.products,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
> ul.products{
display:grid !important;
grid-template-columns:
repeat(3,minmax(0,1fr)) !important;
grid-auto-flow:row !important;
width:100% !important;
min-width:0 !important;
max-width:100% !important;
margin:20px 0 0 !important;
padding:0 !important;
gap:22px !important;
float:none !important;
clear:both !important;
box-sizing:border-box !important;
}
/* Cartes : aucune largeur WooCommerce résiduelle */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
.woocommerce
ul.products
> li.product,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
> ul.products
> li.product{
width:auto !important;
min-width:0 !important;
max-width:none !important;
margin:0 !important;
float:none !important;
clear:none !important;
justify-self:stretch !important;
box-sizing:border-box !important;
}
/* Images : taille cohérente avec les nouvelles cartes */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
img.wp-post-image,
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
img.attachment-woocommerce_thumbnail{
display:block !important;
width:100% !important;
height:auto !important;
aspect-ratio:1 / 1 !important;
margin:0 !important;
padding:18px !important;
object-fit:contain !important;
background:#f7f7f5 !important;
box-sizing:border-box !important;
}
/* CTA unique et totalement visible */
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
> .button,
body.woocommerce-account
.orilom-account-wishlist
ul.products
li.product
.button{
position:static !important;
top:auto !important;
right:auto !important;
bottom:auto !important;
left:auto !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
width:calc(100% - 28px) !important;
max-width:none !important;
min-height:42px !important;
margin:auto 14px 0 !important;
padding:10px 12px !important;
opacity:1 !important;
visibility:visible !important;
transform:none !important;
}
/* Suppression définitive du bouton redondant de wishlist sur cet endpoint */
body.woocommerce-account
.orilom-account-wishlist
.orilom-wishlist-button{
display:none !important;
}
/* ---------- Responsive ---------- */
@media(max-width:1180px){
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
.woocommerce
ul.products,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
> ul.products{
grid-template-columns:
repeat(2,minmax(0,1fr)) !important;
}
}
@media(max-width:620px){
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
.woocommerce
ul.products,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-wishlist
> ul.products{
grid-template-columns:
minmax(0,1fr) !important;
}
}
/* =========================================================
ORILOM — HEADER ACCOUNT ACTIONS V10
Connecté : Mon compte + Se déconnecter
Visiteur : Se connecter
========================================================= */
/* Neutralise l'ancien label générique */
.lux-header
.header-tools
> a.orilom-account-link::after,
.lux-header
.header-tools
> a.orilom-logout-link::after{
display:inline-block !important;
}
/* Compte */
.lux-header
.header-tools
> a.orilom-account-link{
order:3 !important;
min-width:104px !important;
}
.lux-header
.header-tools
> a.orilom-account-link::after{
content:"Mon compte" !important;
}
/* Déconnexion = action distincte */
.lux-header
.header-tools
> a.orilom-logout-link{
order:4 !important;
min-width:118px !important;
color:#333 !important;
background:#fff !important;
border:1px solid transparent !important;
}
.lux-header
.header-tools
> a.orilom-logout-link::after{
content:"Se déconnecter" !important;
}
.lux-header
.header-tools
> a.orilom-logout-link:hover{
background:#f7f7f7 !important;
border-color:#dedede !important;
color:#111 !important;
}
/* Visiteur : le lien compte devient "Se connecter" */
body:not(.logged-in)
.lux-header
.header-tools
> a.orilom-account-link::after{
content:"Se connecter" !important;
}
/* Connecté : Mon compte */
body.logged-in
.lux-header
.header-tools
> a.orilom-account-link::after{
content:"Mon compte" !important;
}
/* Un peu plus de place pour 4 actions desktop */
@media(min-width:1251px){
body.logged-in .lux-header-main{
grid-template-columns:
220px
190px
minmax(300px,1fr)
minmax(405px,455px) !important;
}
body.logged-in
.lux-header
.header-tools{
gap:6px !important;
}
body.logged-in
.lux-header
.header-tools
> a{
padding-left:10px !important;
padding-right:10px !important;
font-size:11px !important;
}
body.logged-in
.lux-header
.header-tools
> .cart-link{
min-width:108px !important;
}
}
/* Petit desktop/tablette : icônes seulement, comme avant */
@media(max-width:1050px){
.lux-header
.header-tools
> a.orilom-account-link::after,
.lux-header
.header-tools
> a.orilom-logout-link::after{
display:none !important;
content:none !important;
}
.lux-header
.header-tools
> a.orilom-account-link,
.lux-header
.header-tools
> a.orilom-logout-link{
width:42px !important;
min-width:42px !important;
height:42px !important;
min-height:42px !important;
padding:0 !important;
}
}
@media(max-width:720px){
.lux-header
.header-tools
> a.orilom-account-link,
.lux-header
.header-tools
> a.orilom-logout-link{
width:40px !important;
min-width:40px !important;
height:40px !important;
min-height:40px !important;
}
}
/* =========================================================
ORILOM — HEADER ACCOUNT LABEL HARD FIX V11
Corrige le conflit V7/V10 :
- lien compte = "Mon compte"
- lien logout = "Se déconnecter"
========================================================= */
body.logged-in
.lux-header
.header-tools
> a.orilom-account-link:not(.wishlist-link):not(.cart-link)::after{
content:"Mon compte" !important;
display:inline-block !important;
}
body.logged-in
.lux-header
.header-tools
> a.orilom-logout-link:not(.wishlist-link):not(.cart-link)::after{
content:"Se déconnecter" !important;
display:inline-block !important;
}
body:not(.logged-in)
.lux-header
.header-tools
> a.orilom-account-link:not(.wishlist-link):not(.cart-link)::after{
content:"Se connecter" !important;
display:inline-block !important;
}
/* Empêche toute ancienne règle générique d'écraser les 2 actions */
body.logged-in
.lux-header
.header-tools
> a.orilom-account-link{
order:3 !important;
}
body.logged-in
.lux-header
.header-tools
> a.orilom-logout-link{
order:4 !important;
}
/* Mobile/tablette : icônes seules comme prévu */
@media(max-width:1050px){
body.logged-in
.lux-header
.header-tools
> a.orilom-account-link::after,
body.logged-in
.lux-header
.header-tools
> a.orilom-logout-link::after,
body:not(.logged-in)
.lux-header
.header-tools
> a.orilom-account-link::after{
display:none !important;
content:none !important;
}
}
/* =========================================================
ORILOM — ACCOUNT DROPDOWN PREMIUM V12
Header plus léger :
Favoris | Mon Panier | Mon compte ▾
Déconnexion déplacée dans le menu compte.
========================================================= */
/* On masque l'ancien logout standalone si jamais il subsiste */
body.logged-in
.lux-header
.header-tools
> a.orilom-logout-link{
display:none !important;
}
/* Wrapper compte */
.lux-header
.header-tools
.orilom-account-menu{
position:relative !important;
order:3 !important;
display:inline-flex !important;
align-items:center !important;
min-width:0 !important;
}
/* Le lien Mon compte devient le trigger du dropdown */
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link{
position:relative !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:44px !important;
min-width:112px !important;
margin:0 !important;
padding:0 30px 0 12px !important;
gap:7px !important;
color:#111 !important;
background:#fff !important;
border:1px solid transparent !important;
border-radius:999px !important;
text-decoration:none !important;
font-family:Arial,sans-serif !important;
font-size:11px !important;
line-height:1 !important;
font-weight:700 !important;
white-space:nowrap !important;
cursor:pointer !important;
}
/* Flèche */
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link::before{
content:"";
position:absolute !important;
right:12px !important;
top:50% !important;
width:6px !important;
height:6px !important;
border-right:1.5px solid currentColor !important;
border-bottom:1.5px solid currentColor !important;
transform:translateY(-65%) rotate(45deg) !important;
transition:transform .18s ease !important;
}
.lux-header
.header-tools
.orilom-account-menu.is-open
> a.orilom-account-link::before{
transform:translateY(-35%) rotate(225deg) !important;
}
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link:hover{
background:#fafafa !important;
border-color:#e7e7e7 !important;
}
/* Dropdown */
.lux-header
.header-tools
.orilom-account-dropdown{
position:absolute !important;
top:calc(100% + 10px) !important;
right:0 !important;
z-index:99999 !important;
display:none !important;
width:238px !important;
margin:0 !important;
padding:10px !important;
background:#fff !important;
border:1px solid #e9e9e9 !important;
border-radius:14px !important;
box-shadow:
0 18px 45px rgba(0,0,0,.12) !important;
box-sizing:border-box !important;
}
.lux-header
.header-tools
.orilom-account-menu.is-open
.orilom-account-dropdown{
display:block !important;
}
/* petit triangle */
.lux-header
.header-tools
.orilom-account-dropdown::before{
content:"";
position:absolute !important;
top:-7px !important;
right:24px !important;
width:12px !important;
height:12px !important;
background:#fff !important;
border-left:1px solid #e9e9e9 !important;
border-top:1px solid #e9e9e9 !important;
transform:rotate(45deg) !important;
}
/* Bonjour */
.lux-header
.header-tools
.orilom-account-dropdown
.orilom-account-dropdown-head{
position:relative !important;
z-index:1 !important;
padding:10px 10px 11px !important;
margin:0 0 6px !important;
border-bottom:1px solid #ededed !important;
}
.lux-header
.header-tools
.orilom-account-dropdown
.orilom-account-dropdown-head strong{
display:block !important;
margin:0 0 3px !important;
color:#111 !important;
font-size:12px !important;
line-height:1.25 !important;
font-weight:800 !important;
}
.lux-header
.header-tools
.orilom-account-dropdown
.orilom-account-dropdown-head span{
display:block !important;
color:#8a8a8a !important;
font-size:9px !important;
line-height:1.35 !important;
font-weight:500 !important;
}
/* Liens */
.lux-header
.header-tools
.orilom-account-dropdown
a{
position:relative !important;
z-index:1 !important;
display:flex !important;
align-items:center !important;
min-height:38px !important;
margin:0 !important;
padding:0 10px !important;
border:0 !important;
border-radius:8px !important;
background:transparent !important;
color:#222 !important;
text-decoration:none !important;
font-size:10px !important;
line-height:1.2 !important;
font-weight:650 !important;
white-space:nowrap !important;
}
.lux-header
.header-tools
.orilom-account-dropdown
a:hover{
background:#f6f6f6 !important;
color:#111 !important;
}
.lux-header
.header-tools
.orilom-account-dropdown
a.orilom-account-logout{
margin-top:6px !important;
border-top:1px solid #ededed !important;
border-radius:0 0 8px 8px !important;
color:#6b2d2d !important;
}
.lux-header
.header-tools
.orilom-account-dropdown
a.orilom-account-logout:hover{
background:#fff5f5 !important;
color:#a11 !important;
}
/* Desktop : on récupère de l'espace */
@media(min-width:1251px){
body.logged-in .lux-header-main{
grid-template-columns:
220px
190px
minmax(320px,1fr)
minmax(315px,355px) !important;
}
body.logged-in
.lux-header
.header-tools{
gap:7px !important;
}
}
/* Tablette / petit desktop */
@media(max-width:1050px){
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link{
width:42px !important;
min-width:42px !important;
height:42px !important;
min-height:42px !important;
padding:0 !important;
}
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link::after{
display:none !important;
content:none !important;
}
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link::before{
right:7px !important;
bottom:6px !important;
top:auto !important;
width:5px !important;
height:5px !important;
}
.lux-header
.header-tools
.orilom-account-dropdown{
right:-6px !important;
}
}
/* Mobile */
@media(max-width:720px){
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link{
width:40px !important;
min-width:40px !important;
height:40px !important;
min-height:40px !important;
}
.lux-header
.header-tools
.orilom-account-dropdown{
position:fixed !important;
top:auto !important;
right:12px !important;
left:12px !important;
bottom:14px !important;
width:auto !important;
max-width:none !important;
border-radius:16px !important;
box-shadow:
0 18px 50px rgba(0,0,0,.20) !important;
}
.lux-header
.header-tools
.orilom-account-dropdown::before{
display:none !important;
}
}
/* =========================================================
ORILOM — HEADER ICONS READABILITY V13
Plus lisible sans alourdir :
- icônes header 16px
- Mon compte visible
- icônes dropdown 15px
========================================================= */
/* ---------- Actions header : icônes plus présentes ---------- */
.lux-header
.header-tools
> a svg,
.lux-header
.header-tools
> a i,
.lux-header
.header-tools
.orilom-account-menu
> a svg,
.lux-header
.header-tools
.orilom-account-menu
> a i{
width:16px !important;
min-width:16px !important;
height:16px !important;
min-height:16px !important;
font-size:16px !important;
line-height:1 !important;
stroke-width:2 !important;
opacity:1 !important;
flex:0 0 16px !important;
}
/* Favoris / panier : meilleure séparation icône + texte */
.lux-header
.header-tools
> .wishlist-link,
.lux-header
.header-tools
> .cart-link{
gap:7px !important;
}
/* Compte : vrai label visible sur desktop */
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link{
min-width:124px !important;
padding-left:13px !important;
padding-right:30px !important;
gap:8px !important;
}
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link
.orilom-account-label{
display:inline-block !important;
color:#111 !important;
font-family:Arial,sans-serif !important;
font-size:11px !important;
line-height:1 !important;
font-weight:750 !important;
white-space:nowrap !important;
}
/* Icône compte légèrement plus forte */
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link
.orilom-account-trigger-icon{
width:17px !important;
min-width:17px !important;
height:17px !important;
min-height:17px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
flex:0 0 17px !important;
}
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link
.orilom-account-trigger-icon svg{
width:17px !important;
height:17px !important;
stroke-width:2 !important;
}
/* ---------- Dropdown : icônes visibles mais premium ---------- */
.lux-header
.header-tools
.orilom-account-dropdown
a{
gap:10px !important;
min-height:40px !important;
padding-left:10px !important;
padding-right:10px !important;
}
.lux-header
.header-tools
.orilom-account-dropdown
.orilom-menu-icon{
width:17px !important;
min-width:17px !important;
height:17px !important;
min-height:17px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
color:#444 !important;
flex:0 0 17px !important;
}
.lux-header
.header-tools
.orilom-account-dropdown
.orilom-menu-icon svg{
display:block !important;
width:15px !important;
height:15px !important;
stroke:currentColor !important;
stroke-width:1.9 !important;
}
.lux-header
.header-tools
.orilom-account-dropdown
a:hover
.orilom-menu-icon{
color:#111 !important;
}
.lux-header
.header-tools
.orilom-account-dropdown
a.orilom-account-logout
.orilom-menu-icon{
color:#8b2e2e !important;
}
/* Le texte du dropdown gagne légèrement en contraste */
.lux-header
.header-tools
.orilom-account-dropdown
.orilom-menu-label{
display:inline-block !important;
color:inherit !important;
font-size:10.5px !important;
font-weight:700 !important;
}
/* ---------- Compteurs : plus lisibles ---------- */
.lux-header
.wishlist-count,
.lux-header
.cart-count{
min-width:18px !important;
height:18px !important;
padding:0 5px !important;
font-size:9px !important;
line-height:18px !important;
font-weight:800 !important;
box-shadow:0 1px 4px rgba(0,0,0,.12) !important;
}
/* ---------- Responsive ---------- */
@media(max-width:1050px){
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link{
min-width:42px !important;
width:42px !important;
padding:0 !important;
}
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link
.orilom-account-label{
display:none !important;
}
.lux-header
.header-tools
.orilom-account-menu
> a.orilom-account-link
.orilom-account-trigger-icon{
margin:0 auto !important;
}
}
@media(max-width:720px){
.lux-header
.header-tools
> a svg,
.lux-header
.header-tools
> a i,
.lux-header
.header-tools
.orilom-account-menu
> a svg,
.lux-header
.header-tools
.orilom-account-menu
> a i{
width:17px !important;
height:17px !important;
font-size:17px !important;
}
}
/* =========================================================
ORILOM — ORDERS NOTICE CTA POSITION FIX V14
Le bouton "Confirm email address" ne doit plus couper le texte.
========================================================= */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message{
display:block !important;
position:relative !important;
min-height:68px !important;
padding:
17px
18px
17px
48px !important;
line-height:1.55 !important;
overflow:hidden !important;
}
/* Icône Woo fixée proprement à gauche */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info::before,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message::before{
position:absolute !important;
left:17px !important;
top:50% !important;
margin:0 !important;
transform:translateY(-50%) !important;
}
/* CTA à droite : le texte s'écoule naturellement à sa gauche */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info .button,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message .button{
float:right !important;
margin:
-4px
0
0
18px !important;
min-width:0 !important;
max-width:240px !important;
min-height:38px !important;
padding:0 16px !important;
position:relative !important;
top:auto !important;
right:auto !important;
bottom:auto !important;
left:auto !important;
transform:none !important;
}
/* Nettoyage du float */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info::after,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message::after{
content:"" !important;
display:block !important;
clear:both !important;
}
/* Mobile : CTA sous le texte en pleine largeur */
@media(max-width:700px){
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message{
padding:
16px
15px
16px
42px !important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-info .button,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-message .button{
float:none !important;
width:100% !important;
max-width:none !important;
margin:13px 0 0 !important;
}
}
/* ==========================================================
ORILOM ACCOUNT V15 — LEGENDARY DASHBOARD
Root /mon-compte/ only. Other validated endpoints untouched.
========================================================== */
body.woocommerce-account
.woocommerce:has(.woocommerce-MyAccount-navigation-link--dashboard.is-active)
.woocommerce-MyAccount-content::before{
display:none!important;
content:none!important;
}
body.woocommerce-account
.woocommerce:has(.woocommerce-MyAccount-navigation-link--dashboard.is-active)
.woocommerce-MyAccount-content{
padding-top:0!important;
overflow:visible;
}
/* Profile identity above the navigation */
body.woocommerce-account .orilom-account-identity{
display:flex;
align-items:center;
gap:11px;
padding:0 2px 17px;
margin:0 0 12px;
border-bottom:1px solid #ececec;
}
body.woocommerce-account .orilom-account-avatar{
width:38px;
height:38px;
flex:0 0 38px;
display:grid;
place-items:center;
border-radius:50%;
background:#111;
color:#fff;
font:800 12px/1 Arial,sans-serif;
letter-spacing:.02em;
}
body.woocommerce-account .orilom-account-identity-copy{
min-width:0;
}
body.woocommerce-account .orilom-account-identity-copy strong{
display:block;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
color:#111;
font:800 11px/1.25 Arial,sans-serif;
}
body.woocommerce-account .orilom-account-identity-copy span{
display:block;
margin-top:3px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
color:#8b8b8b;
font:500 8.5px/1.25 Arial,sans-serif;
}
/* Root dashboard */
.orilom-account-dashboard{
width:100%;
min-width:0;
font-family:Arial,sans-serif;
color:#111;
}
.orilom-account-dashboard *,
.orilom-account-dashboard *::before,
.orilom-account-dashboard *::after{
box-sizing:border-box;
}
.orilom-dashboard-hero{
position:relative;
overflow:hidden;
min-height:164px;
padding:30px 32px;
margin:0 0 20px;
border:1px solid #e8e8e8;
border-radius:16px;
background:
radial-gradient(circle at 88% 14%,rgba(181,138,42,.11),transparent 32%),
linear-gradient(135deg,#fff 0%,#fbfbfa 100%);
}
.orilom-dashboard-hero::after{
content:"O";
position:absolute;
right:22px;
top:50%;
transform:translateY(-50%);
color:rgba(17,17,17,.025);
font:700 144px/1 Georgia,serif;
pointer-events:none;
}
.orilom-dashboard-kicker{
display:flex;
align-items:center;
gap:8px;
margin:0 0 11px;
color:#96711e;
font:800 8px/1 Arial,sans-serif;
letter-spacing:.16em;
text-transform:uppercase;
}
.orilom-dashboard-kicker::before{
content:"";
width:22px;
height:1px;
background:#b58a2a;
}
.orilom-dashboard-hero h2{
position:relative;
z-index:1;
margin:0;
color:#101010;
font:700 27px/1.14 Georgia,"Times New Roman",serif;
letter-spacing:-.02em;
}
.orilom-dashboard-hero p{
position:relative;
z-index:1;
max-width:570px;
margin:9px 0 0;
color:#777;
font:500 10px/1.65 Arial,sans-serif;
}
.orilom-dashboard-hero-actions{
position:relative;
z-index:1;
display:flex;
flex-wrap:wrap;
gap:8px;
margin-top:18px;
}
.orilom-dashboard-primary,
.orilom-dashboard-secondary{
min-height:37px;
display:inline-flex;
align-items:center;
justify-content:center;
gap:7px;
padding:0 14px;
border-radius:8px;
text-decoration:none!important;
font:800 8.5px/1 Arial,sans-serif;
letter-spacing:.045em;
text-transform:uppercase;
transition:transform .18s ease,background .18s ease,border-color .18s ease,color .18s ease;
}
.orilom-dashboard-primary{
border:1px solid #111;
background:#111;
color:#fff!important;
}
.orilom-dashboard-secondary{
border:1px solid #dedede;
background:#fff;
color:#111!important;
}
.orilom-dashboard-primary:hover,
.orilom-dashboard-secondary:hover{
transform:translateY(-1px);
}
.orilom-dashboard-secondary:hover{
border-color:#b58a2a;
}
/* Task cards */
.orilom-dashboard-stats{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:12px;
margin:0 0 26px;
}
.orilom-dashboard-stat{
position:relative;
min-height:112px;
display:flex;
flex-direction:column;
justify-content:space-between;
padding:17px 17px 15px;
border:1px solid #e8e8e8;
border-radius:13px;
background:#fff;
color:#111!important;
text-decoration:none!important;
transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.orilom-dashboard-stat:hover{
transform:translateY(-2px);
border-color:#d7d0bf;
box-shadow:0 10px 28px rgba(0,0,0,.045);
}
.orilom-dashboard-stat-top{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
}
.orilom-dashboard-stat-label{
color:#747474;
font:800 8px/1 Arial,sans-serif;
letter-spacing:.09em;
text-transform:uppercase;
}
.orilom-dashboard-stat-icon{
width:29px;
height:29px;
display:grid;
place-items:center;
border-radius:8px;
background:#f7f7f7;
color:#222;
}
.orilom-dashboard-stat-icon svg{
width:14px;
height:14px;
fill:none;
stroke:currentColor;
stroke-width:1.8;
stroke-linecap:round;
stroke-linejoin:round;
}
.orilom-dashboard-stat-value{
margin-top:14px;
color:#111;
font:700 24px/1 Georgia,"Times New Roman",serif;
}
.orilom-dashboard-stat-link{
margin-top:7px;
color:#8a8a8a;
font:600 8.5px/1.25 Arial,sans-serif;
}
.orilom-dashboard-stat:hover .orilom-dashboard-stat-link{
color:#96711e;
}
/* Shared section head */
.orilom-dashboard-section{
margin-top:26px;
}
.orilom-dashboard-section-head{
display:flex;
align-items:end;
justify-content:space-between;
gap:18px;
padding:0 0 12px;
margin:0 0 12px;
border-bottom:1px solid #e4e4e4;
}
.orilom-dashboard-section-title{
margin:0;
color:#111;
font:800 15px/1.2 Arial,sans-serif;
}
.orilom-dashboard-section-subtitle{
display:block;
margin-top:4px;
color:#8b8b8b;
font:500 8.5px/1.35 Arial,sans-serif;
}
.orilom-dashboard-section-link{
flex:0 0 auto;
color:#111!important;
text-decoration:none!important;
font:800 8.5px/1 Arial,sans-serif;
border-bottom:1px solid #111;
padding-bottom:2px;
}
/* Latest order */
.orilom-latest-order{
overflow:hidden;
border:1px solid #e6e6e6;
border-radius:14px;
background:#fff;
}
.orilom-latest-order-top{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:16px;
padding:18px 19px 15px;
}
.orilom-latest-order-number{
display:block;
color:#111;
font:800 13px/1.15 Arial,sans-serif;
}
.orilom-latest-order-date{
display:block;
margin-top:5px;
color:#8a8a8a;
font:500 8.5px/1 Arial,sans-serif;
}
.orilom-order-status{
display:inline-flex;
align-items:center;
gap:6px;
min-height:26px;
padding:0 9px;
border-radius:999px;
background:#f4f4f4;
color:#292929;
font:800 8px/1 Arial,sans-serif;
white-space:nowrap;
}
.orilom-order-status::before{
content:"";
width:6px;
height:6px;
border-radius:50%;
background:#b58a2a;
}
.orilom-latest-order-body{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
gap:20px;
align-items:center;
padding:17px 19px;
border-top:1px solid #eee;
background:#fcfcfc;
}
.orilom-latest-order-products{
min-width:0;
}
.orilom-latest-order-products strong{
display:block;
color:#111;
font:700 9.5px/1.35 Arial,sans-serif;
}
.orilom-latest-order-products span{
display:block;
margin-top:5px;
color:#858585;
font:500 8.5px/1.5 Arial,sans-serif;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.orilom-latest-order-total{
text-align:right;
}
.orilom-latest-order-total strong{
display:block;
color:#111;
font:800 15px/1.15 Arial,sans-serif;
}
.orilom-latest-order-total span{
display:block;
margin-top:4px;
color:#8a8a8a;
font:500 8px/1 Arial,sans-serif;
}
.orilom-latest-order-actions{
display:flex;
align-items:center;
justify-content:flex-end;
gap:8px;
padding:12px 19px;
border-top:1px solid #eee;
}
.orilom-latest-order-actions a{
min-height:34px;
display:inline-flex;
align-items:center;
justify-content:center;
padding:0 12px;
border:1px solid #ddd;
border-radius:7px;
background:#fff;
color:#111!important;
text-decoration:none!important;
font:800 8px/1 Arial,sans-serif;
text-transform:uppercase;
letter-spacing:.04em;
}
.orilom-latest-order-actions a:first-child{
border-color:#111;
background:#111;
color:#fff!important;
}
/* Empty order state */
.orilom-dashboard-empty{
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
padding:22px;
border:1px dashed #d8d8d8;
border-radius:14px;
background:#fcfcfc;
}
.orilom-dashboard-empty strong{
display:block;
color:#111;
font:800 11px/1.3 Arial,sans-serif;
}
.orilom-dashboard-empty p{
margin:5px 0 0!important;
color:#888!important;
font:500 9px/1.5 Arial,sans-serif!important;
}
/* Quick actions */
.orilom-dashboard-shortcuts{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
}
.orilom-dashboard-shortcut{
display:flex;
align-items:center;
gap:11px;
min-height:64px;
padding:12px 13px;
border:1px solid #e8e8e8;
border-radius:11px;
background:#fff;
color:#111!important;
text-decoration:none!important;
transition:border-color .18s ease,background .18s ease;
}
.orilom-dashboard-shortcut:hover{
border-color:#d6c69c;
background:#fffdf8;
}
.orilom-dashboard-shortcut-icon{
width:32px;
height:32px;
display:grid;
place-items:center;
flex:0 0 32px;
border-radius:9px;
background:#f6f6f6;
}
.orilom-dashboard-shortcut-icon svg{
width:15px;
height:15px;
fill:none;
stroke:#222;
stroke-width:1.8;
stroke-linecap:round;
stroke-linejoin:round;
}
.orilom-dashboard-shortcut strong{
display:block;
color:#111;
font:800 9px/1.25 Arial,sans-serif;
}
.orilom-dashboard-shortcut span{
display:block;
margin-top:3px;
color:#8a8a8a;
font:500 8px/1.25 Arial,sans-serif;
}
/* Focus accessibility */
.orilom-account-dashboard a:focus-visible{
outline:2px solid #b58a2a!important;
outline-offset:3px!important;
}
/* Tablet */
@media(max-width:980px){
.orilom-dashboard-hero{
padding:26px;
}
.orilom-dashboard-stats{
grid-template-columns:repeat(3,minmax(135px,1fr));
}
}
/* Mobile: account navigation becomes a compact horizontal task bar */
@media(max-width:760px){
body.woocommerce-account .content-wrap.page-content{
width:calc(100% - 28px)!important;
padding-top:24px!important;
}
body.woocommerce-account .woocommerce{
display:block!important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation{
position:static!important;
width:100%!important;
margin:0 0 20px!important;
padding:11px!important;
border-radius:13px!important;
}
body.woocommerce-account .orilom-account-identity{
padding:1px 3px 11px;
margin-bottom:9px;
}
body.woocommerce-account .woocommerce-MyAccount-navigation ul{
display:flex!important;
overflow-x:auto;
gap:6px!important;
padding:1px 0 4px!important;
scroll-snap-type:x proximity;
scrollbar-width:none;
}
body.woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar{
display:none;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li{
flex:0 0 auto!important;
width:auto!important;
scroll-snap-align:start;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li a{
min-height:35px!important;
display:flex!important;
align-items:center!important;
padding:0 12px!important;
border-radius:8px!important;
font-size:8.5px!important;
white-space:nowrap;
}
body.woocommerce-account .woocommerce-MyAccount-content{
width:100%!important;
}
.orilom-dashboard-hero{
min-height:0;
padding:23px 20px;
border-radius:14px;
}
.orilom-dashboard-hero::after{
right:8px;
font-size:112px;
}
.orilom-dashboard-hero h2{
font-size:23px;
}
.orilom-dashboard-stats{
grid-template-columns:repeat(3,minmax(0,1fr));
gap:7px;
}
.orilom-dashboard-stat{
min-height:100px;
padding:13px 11px 12px;
}
.orilom-dashboard-stat-icon{
display:none;
}
.orilom-dashboard-stat-value{
font-size:21px;
}
.orilom-dashboard-stat-link{
font-size:7.5px;
}
.orilom-latest-order-body{
grid-template-columns:1fr;
gap:13px;
}
.orilom-latest-order-total{
text-align:left;
}
.orilom-dashboard-shortcuts{
grid-template-columns:1fr;
}
}
/* Very small phones */
@media(max-width:430px){
.orilom-dashboard-stats{
grid-template-columns:1fr;
}
.orilom-dashboard-stat{
min-height:82px;
}
.orilom-dashboard-stat-value{
margin-top:9px;
}
.orilom-dashboard-section-head{
align-items:flex-start;
flex-direction:column;
gap:7px;
}
.orilom-latest-order-top{
padding:15px;
}
.orilom-latest-order-body,
.orilom-latest-order-actions{
padding-left:15px;
padding-right:15px;
}
.orilom-latest-order-actions{
justify-content:stretch;
}
.orilom-latest-order-actions a{
flex:1 1 0;
}
}
/* ==========================================================
ORILOM ACCOUNT V15.1 — visual emergency correction
========================================================== */
/* Keep account area spacious on desktop */
body.woocommerce-account .content-wrap.page-content{
max-width:1480px!important;
width:calc(100% - 48px)!important;
margin-left:auto!important;
margin-right:auto!important;
}
/* The identity is now moved inside the navigation with JS. */
body.woocommerce-account .woocommerce-MyAccount-navigation > .orilom-account-identity{
margin:0 0 10px!important;
padding:3px 4px 14px!important;
}
/* Prevent it from appearing as an orphan below the menu before JS runs. */
body.woocommerce-account .woocommerce > .orilom-account-identity{
display:none!important;
}
/* Root dashboard needs usable width, never a cramped 300px content column */
body.woocommerce-account
.woocommerce:has(.woocommerce-MyAccount-navigation-link--dashboard.is-active){
grid-template-columns:240px minmax(0,1fr)!important;
column-gap:38px!important;
align-items:start!important;
}
body.woocommerce-account
.woocommerce:has(.woocommerce-MyAccount-navigation-link--dashboard.is-active)
.woocommerce-MyAccount-content{
min-width:0!important;
width:100%!important;
max-width:none!important;
}
/* Make the hero feel premium without becoming huge */
.orilom-dashboard-hero{
min-height:154px!important;
}
.orilom-dashboard-hero h2{
max-width:650px;
}
/* Header containment: avoid action pills visually escaping on medium desktop */
@media(min-width:1051px) and (max-width:1320px){
.lux-header .lux-header-main{
grid-template-columns:190px 150px minmax(260px,1fr) minmax(270px,320px)!important;
gap:10px!important;
}
.lux-header .header-tools{
gap:6px!important;
}
}
/* On normal mobile, do not allow desktop account grid rules to leak */
@media(max-width:760px){
body.woocommerce-account
.woocommerce:has(.woocommerce-MyAccount-navigation-link--dashboard.is-active){
display:block!important;
}
}
/* ==========================================================
ORILOM ACCOUNT V15.2 — SHORTCUT ICONS + PROFILE PLACEMENT
========================================================== */
/* --- 1) Profile identity: visually part of the account navigation card --- */
body.woocommerce-account .woocommerce-MyAccount-navigation > .orilom-account-identity{
display:flex!important;
align-items:center!important;
gap:11px!important;
width:100%!important;
margin:0 0 10px!important;
padding:4px 5px 14px!important;
border-bottom:1px solid #ececec!important;
}
/* Before JS relocates it, do not let it become a third grid item under the sidebar. */
body.woocommerce-account .woocommerce > .orilom-account-identity{
visibility:hidden!important;
position:absolute!important;
width:1px!important;
height:1px!important;
overflow:hidden!important;
pointer-events:none!important;
}
/* Once moved inside the nav, restore normally. */
body.woocommerce-account .woocommerce-MyAccount-navigation > .orilom-account-identity{
visibility:visible!important;
position:static!important;
height:auto!important;
overflow:visible!important;
pointer-events:auto!important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation > .orilom-account-identity .orilom-account-avatar{
width:38px!important;
height:38px!important;
min-width:38px!important;
margin:0!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
line-height:1!important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation > .orilom-account-identity .orilom-account-identity-copy{
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
min-width:0!important;
margin:0!important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation > .orilom-account-identity .orilom-account-identity-copy strong,
body.woocommerce-account .woocommerce-MyAccount-navigation > .orilom-account-identity .orilom-account-identity-copy span{
margin-left:0!important;
padding-left:0!important;
}
/* --- 2) Shortcut icon bug ---
The previous generic ".orilom-dashboard-shortcut span" rule also targeted
the icon wrapper and pushed the SVG down. These selectors separate icon
geometry from text geometry. */
.orilom-dashboard-shortcut{
align-items:center!important;
}
.orilom-dashboard-shortcut > .orilom-dashboard-shortcut-icon{
width:34px!important;
height:34px!important;
min-width:34px!important;
flex:0 0 34px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
margin:0!important;
padding:0!important;
border-radius:9px!important;
line-height:0!important;
font-size:0!important;
color:#222!important;
}
.orilom-dashboard-shortcut > .orilom-dashboard-shortcut-icon svg{
display:block!important;
width:15px!important;
height:15px!important;
margin:0!important;
padding:0!important;
transform:none!important;
vertical-align:middle!important;
}
.orilom-dashboard-shortcut > span:last-child:not(.orilom-dashboard-shortcut-icon){
min-width:0!important;
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
align-items:flex-start!important;
margin:0!important;
padding:0!important;
line-height:1!important;
}
.orilom-dashboard-shortcut > span:last-child:not(.orilom-dashboard-shortcut-icon) > strong{
display:block!important;
margin:0!important;
padding:0!important;
line-height:1.25!important;
}
.orilom-dashboard-shortcut > span:last-child:not(.orilom-dashboard-shortcut-icon) > span{
display:block!important;
margin:4px 0 0!important;
padding:0!important;
line-height:1.25!important;
}
/* Better visual balance: same left inset and vertical rhythm on all 3 cards */
.orilom-dashboard-shortcut{
min-height:66px!important;
padding:12px 14px!important;
gap:12px!important;
}
/* Mobile: identity remains inside the account navigation, shortcuts stack cleanly. */
@media(max-width:760px){
body.woocommerce-account .woocommerce-MyAccount-navigation > .orilom-account-identity{
margin-bottom:9px!important;
padding:2px 3px 11px!important;
}
.orilom-dashboard-shortcut{
min-height:62px!important;
}
}
/* ==========================================================
ORILOM ACCOUNT V15.3 — shortcut hover consistency
+ invoice button micro-interactions
========================================================== */
/* SHORTCUTS: never invert to black.
Keep premium white card + subtle gold affordance on every shortcut. */
.orilom-dashboard-shortcut,
.orilom-dashboard-shortcut:link,
.orilom-dashboard-shortcut:visited{
background:#fff!important;
color:#111!important;
border-color:#e8e8e8!important;
box-shadow:none!important;
}
.orilom-dashboard-shortcut:hover,
.orilom-dashboard-shortcut:focus-visible{
background:#fffdf8!important;
color:#111!important;
border-color:#cfae5b!important;
box-shadow:0 8px 22px rgba(0,0,0,.035)!important;
transform:translateY(-1px);
}
.orilom-dashboard-shortcut:active{
transform:translateY(0) scale(.995);
background:#fffaf0!important;
border-color:#b58a2a!important;
}
.orilom-dashboard-shortcut:hover strong,
.orilom-dashboard-shortcut:focus-visible strong,
.orilom-dashboard-shortcut:hover span,
.orilom-dashboard-shortcut:focus-visible span{
color:inherit!important;
}
/* Keep text tones readable, even if generic theme anchor hover rules fire */
.orilom-dashboard-shortcut > span:last-child:not(.orilom-dashboard-shortcut-icon) > strong{
color:#111!important;
}
.orilom-dashboard-shortcut > span:last-child:not(.orilom-dashboard-shortcut-icon) > span{
color:#8a8a8a!important;
}
/* Icon tile: elegant state change, no black card takeover */
.orilom-dashboard-shortcut > .orilom-dashboard-shortcut-icon{
background:#f6f6f6!important;
color:#222!important;
transition:background .18s ease,color .18s ease,transform .18s ease;
}
.orilom-dashboard-shortcut:hover > .orilom-dashboard-shortcut-icon,
.orilom-dashboard-shortcut:focus-visible > .orilom-dashboard-shortcut-icon{
background:#f3ead3!important;
color:#8d6918!important;
transform:translateY(-1px);
}
/* ORDER ACTIONS: both buttons must clearly react to hover/focus/click */
.orilom-latest-order-actions a{
position:relative;
overflow:hidden;
transition:
background .18s ease,
color .18s ease,
border-color .18s ease,
transform .16s ease,
box-shadow .18s ease!important;
}
/* Primary: View order */
.orilom-latest-order-actions a:first-child:hover,
.orilom-latest-order-actions a:first-child:focus-visible{
background:#2a2a2a!important;
border-color:#2a2a2a!important;
color:#fff!important;
transform:translateY(-1px);
box-shadow:0 8px 20px rgba(0,0,0,.12);
}
.orilom-latest-order-actions a:first-child:active{
transform:translateY(0) scale(.985);
box-shadow:none;
}
/* Secondary: View invoice */
.orilom-latest-order-actions a:last-child:not(:first-child){
background:#fff!important;
color:#111!important;
border-color:#d9d9d9!important;
}
.orilom-latest-order-actions a:last-child:not(:first-child):hover,
.orilom-latest-order-actions a:last-child:not(:first-child):focus-visible{
background:#fffaf0!important;
color:#8d6918!important;
border-color:#b58a2a!important;
transform:translateY(-1px);
box-shadow:0 7px 18px rgba(0,0,0,.055);
}
.orilom-latest-order-actions a:last-child:not(:first-child):active{
transform:translateY(0) scale(.985);
background:#f8edcf!important;
box-shadow:none;
}
/* Accessible keyboard focus */
.orilom-latest-order-actions a:focus-visible,
.orilom-dashboard-shortcut:focus-visible{
outline:2px solid #b58a2a!important;
outline-offset:3px!important;
}
/* Small arrow affordance for invoice CTA only */
.orilom-latest-order-actions a:last-child:not(:first-child)::after{
content:"→";
display:inline-block;
margin-left:6px;
font-size:10px;
line-height:1;
transform:translateX(0);
transition:transform .18s ease;
}
.orilom-latest-order-actions a:last-child:not(:first-child):hover::after,
.orilom-latest-order-actions a:last-child:not(:first-child):focus-visible::after{
transform:translateX(2px);
}
/* ==========================================================
ORILOM ACCOUNT V15.4 — UNIFIED INTERACTION SYSTEM
One coherent hover/focus/active language for dashboard shortcuts.
========================================================== */
/*
* WHY THIS EXISTS
* Some global theme/WooCommerce anchor hover rules are stronger than the
* dashboard shortcut rules and can invert one card to black. This block
* intentionally uses the full account/dashboard selector chain.
*/
/* NORMAL — identical on all 3 shortcuts */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:link,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:visited{
background:#fff!important;
background-image:none!important;
border:1px solid #e5e5e5!important;
color:#111!important;
box-shadow:none!important;
transform:none!important;
text-decoration:none!important;
}
/* HOVER + KEYBOARD FOCUS — same visual language for every shortcut */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:hover,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:focus,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:focus-visible{
background:#fffaf0!important;
background-image:none!important;
border-color:#c9a84f!important;
color:#111!important;
box-shadow:0 8px 20px rgba(17,17,17,.045)!important;
transform:translateY(-1px)!important;
}
/* CLICK/PRESS — subtle physical feedback, never black */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:active{
background:#f8f1df!important;
background-image:none!important;
border-color:#b58a2a!important;
color:#111!important;
box-shadow:0 3px 10px rgba(17,17,17,.035)!important;
transform:translateY(0) scale(.992)!important;
}
/* CONTENT COLORS — protect against generic anchor:hover descendant rules */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut
> span:last-child:not(.orilom-dashboard-shortcut-icon)
> strong{
color:#111!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut
> span:last-child:not(.orilom-dashboard-shortcut-icon)
> span{
color:#8a8a8a!important;
}
/* ICON TILE — same on every card */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut
> .orilom-dashboard-shortcut-icon{
background:#f5f5f5!important;
color:#222!important;
border:0!important;
box-shadow:none!important;
transform:none!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:hover
> .orilom-dashboard-shortcut-icon,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:focus-visible
> .orilom-dashboard-shortcut-icon{
background:#f2e8cf!important;
color:#8a681d!important;
transform:none!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:active
> .orilom-dashboard-shortcut-icon{
background:#ebdfbd!important;
color:#765813!important;
}
/* Motion consistency */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut{
transition:
background-color .16s ease,
border-color .16s ease,
box-shadow .16s ease,
transform .16s ease!important;
}
/* Accessibility: visible focus without changing the design language */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:focus-visible{
outline:2px solid rgba(181,138,42,.65)!important;
outline-offset:3px!important;
}
/* ==========================================================
ORILOM ACCOUNT V15.5 — FINAL UX POLISH SYSTEM
Scope: My Account dashboard + navigation.
Goal: one interaction language, readable typography,
accessible focus, touch-safe hover behavior.
========================================================== */
body.woocommerce-account{
--orilom-ink:#111111;
--orilom-muted:#707070;
--orilom-line:#e4e4e4;
--orilom-soft:#f7f7f7;
--orilom-ivory:#fffaf0;
--orilom-gold:#b58a2a;
--orilom-gold-border:#c9a84f;
--orilom-radius:10px;
--orilom-motion:160ms cubic-bezier(.2,.7,.2,1);
}
/* ---------- READABILITY ---------- */
.orilom-dashboard-hero p{
font-size:11px!important;
line-height:1.6!important;
}
.orilom-dashboard-stat-label{
font-size:9px!important;
}
.orilom-dashboard-stat-link{
font-size:9.5px!important;
}
.orilom-dashboard-section-subtitle{
font-size:9.5px!important;
}
.orilom-latest-order-date{
font-size:9.5px!important;
}
.orilom-latest-order-products strong{
font-size:10px!important;
}
.orilom-latest-order-products span{
font-size:9px!important;
}
.orilom-dashboard-shortcut strong{
font-size:10px!important;
}
.orilom-dashboard-shortcut > span:last-child:not(.orilom-dashboard-shortcut-icon) > span{
font-size:9px!important;
}
.orilom-dashboard-primary,
.orilom-dashboard-secondary,
.orilom-latest-order-actions a{
font-size:9px!important;
}
/* ---------- GLOBAL ACCOUNT FOCUS LANGUAGE ---------- */
body.woocommerce-account
.woocommerce-MyAccount-navigation a:focus-visible,
body.woocommerce-account
.orilom-account-dashboard a:focus-visible{
outline:2px solid rgba(181,138,42,.72)!important;
outline-offset:3px!important;
}
/* ---------- SIDEBAR NAVIGATION ---------- */
body.woocommerce-account .woocommerce-MyAccount-navigation li a{
min-height:40px!important;
display:flex!important;
align-items:center!important;
transition:
background-color var(--orilom-motion),
color var(--orilom-motion),
transform var(--orilom-motion)!important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation li:not(.is-active) a:hover{
background:#f7f7f7!important;
color:#111!important;
transform:translateX(2px)!important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation li:not(.is-active) a:active{
background:#f0f0f0!important;
transform:translateX(1px) scale(.995)!important;
}
body.woocommerce-account
.woocommerce-MyAccount-navigation li.is-active a{
background:#111!important;
color:#fff!important;
box-shadow:0 6px 16px rgba(0,0,0,.08)!important;
}
/* ---------- HERO CTA SYSTEM ---------- */
.orilom-dashboard-primary,
.orilom-dashboard-secondary{
min-height:40px!important;
border-radius:8px!important;
transition:
background-color var(--orilom-motion),
border-color var(--orilom-motion),
color var(--orilom-motion),
transform var(--orilom-motion),
box-shadow var(--orilom-motion)!important;
}
.orilom-dashboard-primary:hover,
.orilom-dashboard-primary:focus-visible{
background:#262626!important;
border-color:#262626!important;
color:#fff!important;
transform:translateY(-1px)!important;
box-shadow:0 8px 20px rgba(0,0,0,.10)!important;
}
.orilom-dashboard-primary:active{
transform:translateY(0) scale(.99)!important;
box-shadow:none!important;
}
.orilom-dashboard-secondary:hover,
.orilom-dashboard-secondary:focus-visible{
background:var(--orilom-ivory)!important;
border-color:var(--orilom-gold-border)!important;
color:#8a681d!important;
transform:translateY(-1px)!important;
}
.orilom-dashboard-secondary:active{
background:#f8f1df!important;
transform:translateY(0) scale(.99)!important;
}
/* ---------- STAT CARDS ---------- */
.orilom-dashboard-stat{
cursor:pointer!important;
transition:
background-color var(--orilom-motion),
border-color var(--orilom-motion),
box-shadow var(--orilom-motion),
transform var(--orilom-motion)!important;
}
.orilom-dashboard-stat:hover,
.orilom-dashboard-stat:focus-visible{
background:#fffdf8!important;
border-color:#d6c69c!important;
transform:translateY(-2px)!important;
box-shadow:0 10px 26px rgba(0,0,0,.045)!important;
}
.orilom-dashboard-stat:active{
background:#fff9ea!important;
transform:translateY(0) scale(.995)!important;
box-shadow:none!important;
}
.orilom-dashboard-stat:hover .orilom-dashboard-stat-icon,
.orilom-dashboard-stat:focus-visible .orilom-dashboard-stat-icon{
background:#f3ead3!important;
color:#8a681d!important;
}
/* ---------- SECTION TEXT LINKS ---------- */
.orilom-dashboard-section-link{
position:relative!important;
border-bottom:0!important;
padding-bottom:3px!important;
color:#111!important;
transition:color var(--orilom-motion)!important;
}
.orilom-dashboard-section-link::after{
content:""!important;
position:absolute!important;
left:0!important;
bottom:0!important;
width:100%!important;
height:1px!important;
background:#111!important;
transform:scaleX(.35)!important;
transform-origin:left!important;
transition:
transform var(--orilom-motion),
background-color var(--orilom-motion)!important;
}
.orilom-dashboard-section-link:hover,
.orilom-dashboard-section-link:focus-visible{
color:#8a681d!important;
}
.orilom-dashboard-section-link:hover::after,
.orilom-dashboard-section-link:focus-visible::after{
transform:scaleX(1)!important;
background:var(--orilom-gold)!important;
}
/* ---------- ORDER ACTIONS ---------- */
.orilom-latest-order-actions a{
min-height:40px!important;
border-radius:8px!important;
}
/* Primary order CTA */
.orilom-latest-order-actions a:first-child{
background:#111!important;
border-color:#111!important;
color:#fff!important;
}
.orilom-latest-order-actions a:first-child:hover,
.orilom-latest-order-actions a:first-child:focus-visible{
background:#272727!important;
border-color:#272727!important;
color:#fff!important;
transform:translateY(-1px)!important;
box-shadow:0 8px 20px rgba(0,0,0,.10)!important;
}
.orilom-latest-order-actions a:first-child:active{
transform:translateY(0) scale(.99)!important;
box-shadow:none!important;
}
/* Secondary invoice CTA */
.orilom-latest-order-actions a:last-child:not(:first-child){
background:#fff!important;
border-color:#d9d9d9!important;
color:#111!important;
}
.orilom-latest-order-actions a:last-child:not(:first-child):hover,
.orilom-latest-order-actions a:last-child:not(:first-child):focus-visible{
background:var(--orilom-ivory)!important;
border-color:var(--orilom-gold-border)!important;
color:#8a681d!important;
transform:translateY(-1px)!important;
box-shadow:0 7px 18px rgba(0,0,0,.05)!important;
}
.orilom-latest-order-actions a:last-child:not(:first-child):active{
background:#f8f1df!important;
transform:translateY(0) scale(.99)!important;
box-shadow:none!important;
}
/* ---------- SHORTCUTS: FINAL LOCKED SYSTEM ---------- */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut{
min-height:68px!important;
cursor:pointer!important;
background:#fff!important;
color:#111!important;
border:1px solid var(--orilom-line)!important;
border-radius:11px!important;
box-shadow:none!important;
transform:none!important;
transition:
background-color var(--orilom-motion),
border-color var(--orilom-motion),
box-shadow var(--orilom-motion),
transform var(--orilom-motion)!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:hover,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:focus-visible{
background:var(--orilom-ivory)!important;
color:#111!important;
border-color:var(--orilom-gold-border)!important;
transform:translateY(-1px)!important;
box-shadow:0 8px 20px rgba(0,0,0,.04)!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-shortcuts
> a.orilom-dashboard-shortcut:active{
background:#f8f1df!important;
color:#111!important;
border-color:var(--orilom-gold)!important;
transform:translateY(0) scale(.995)!important;
box-shadow:none!important;
}
/* ---------- LOADING / BUSY STATE ---------- */
.orilom-latest-order-actions a.is-loading{
opacity:.70!important;
cursor:progress!important;
pointer-events:none!important;
}
/* ---------- MOTION SAFETY ---------- */
@media (prefers-reduced-motion: reduce){
body.woocommerce-account *,
body.woocommerce-account *::before,
body.woocommerce-account *::after{
transition-duration:.001ms!important;
animation-duration:.001ms!important;
animation-iteration-count:1!important;
scroll-behavior:auto!important;
}
}
/* ---------- TOUCH: no sticky fake hover ----------
Hover effects are reserved for devices that truly support hover. */
@media (hover:none){
.orilom-dashboard-stat:hover,
.orilom-dashboard-primary:hover,
.orilom-dashboard-secondary:hover,
.orilom-dashboard-shortcut:hover,
.orilom-latest-order-actions a:hover{
transform:none!important;
box-shadow:none!important;
}
}
/* ---------- MOBILE TARGETS ---------- */
@media(max-width:760px){
body.woocommerce-account .woocommerce-MyAccount-navigation li a{
min-height:44px!important;
}
.orilom-dashboard-primary,
.orilom-dashboard-secondary,
.orilom-latest-order-actions a{
min-height:44px!important;
}
.orilom-dashboard-shortcut{
min-height:70px!important;
}
.orilom-dashboard-section-subtitle,
.orilom-latest-order-products span,
.orilom-dashboard-shortcut > span:last-child:not(.orilom-dashboard-shortcut-icon) > span{
font-size:10px!important;
}
}
/* =========================================================
ORILOM HOME V5 — CORRECTIFS UI/UX HOME UNIQUEMENT
Scope strict : .lux-home-v5
========================================================= */
/* Réassurance directement sous le Hero */
.lux-home-v5 > .lux-trust{
max-width:1450px !important;
margin:0 auto !important;
padding:22px 3vw !important;
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr)) !important;
gap:0 !important;
background:#fff !important;
border-top:1px solid #eee !important;
border-bottom:1px solid #e8e8e8 !important;
box-shadow:0 8px 28px rgba(0,0,0,.025) !important;
}
.lux-home-v5 > .lux-trust article{
min-height:74px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:13px !important;
padding:10px 20px !important;
border-right:1px solid #ececec !important;
transition:background .18s ease !important;
}
.lux-home-v5 > .lux-trust article:last-child{border-right:0 !important}
.lux-home-v5 > .lux-trust article:hover{background:#fffaf0 !important}
.lux-home-v5 > .lux-trust article>b{
width:36px !important;height:36px !important;flex:0 0 36px !important;
display:grid !important;place-items:center !important;margin:0 !important;
border:1px solid #e4d8b5 !important;border-radius:50% !important;
background:#fffaf0 !important;color:#b58a2a !important;
font-size:18px !important;line-height:1 !important;
}
.lux-home-v5 > .lux-trust h3{
margin:0 0 4px !important;color:#111 !important;
font:700 13px/1.2 Arial,sans-serif !important;
}
.lux-home-v5 > .lux-trust p{
margin:0 !important;color:#777 !important;
font:500 10px/1.4 Arial,sans-serif !important;
}
/* 4 produits par ligne sur desktop */
.lux-home-v5 .lux-product-section .woocommerce ul.products,
.lux-home-v5 .lux-product-section .woocommerce ul.products.columns-4,
.lux-home-v5 .lux-product-section .woocommerce ul.products.columns-6{
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr)) !important;
gap:34px 20px !important;
width:100% !important;
margin:0 !important;
padding:0 !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products::before,
.lux-home-v5 .lux-product-section .woocommerce ul.products::after{
display:none !important;
content:none !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product{
position:relative !important;
width:100% !important;
min-width:0 !important;
float:none !important;
margin:0 !important;
padding:0 0 6px !important;
overflow:visible !important;
background:#fff !important;
border:0 !important;
border-radius:0 !important;
box-shadow:none !important;
text-align:left !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product a img{
display:block !important;
width:100% !important;
height:auto !important;
aspect-ratio:1/1 !important;
object-fit:contain !important;
margin:0 0 13px !important;
background:#f8f8f7 !important;
transition:transform .24s ease,filter .24s ease !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product:hover a img{
transform:scale(1.018) !important;
filter:brightness(.985) !important;
}
.lux-home-v5 .lux-product-section .woocommerce-loop-product__title{
min-height:0 !important;
margin:0 !important;
padding:0 !important;
color:#111 !important;
font:700 11px/1.45 Arial,sans-serif !important;
text-transform:uppercase !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product .price{
display:flex !important;
align-items:center !important;
justify-content:flex-start !important;
gap:5px !important;
margin:7px 0 5px !important;
color:#111 !important;
font:800 11px/1.2 Arial,sans-serif !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product .price del{
color:#929292 !important;font-weight:500 !important;opacity:1 !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product .price ins{
color:#111 !important;font-weight:800 !important;text-decoration:none !important;
}
/* Petit cœur flottant, jamais le gros bouton jaune */
.lux-home-v5 .lux-product-section ul.products li.product .orilom-wishlist-button{
position:absolute !important;
z-index:12 !important;
top:11px !important;
right:11px !important;
left:auto !important;
bottom:auto !important;
display:grid !important;
place-items:center !important;
width:34px !important;
min-width:34px !important;
max-width:34px !important;
height:34px !important;
min-height:34px !important;
max-height:34px !important;
margin:0 !important;
padding:0 !important;
border:1px solid #eee !important;
border-radius:50% !important;
background:#fff !important;
color:transparent !important;
font-size:0 !important;
line-height:0 !important;
text-indent:-9999px !important;
box-shadow:0 5px 16px rgba(0,0,0,.12) !important;
overflow:hidden !important;
transform:none !important;
}
.lux-home-v5 .lux-product-section ul.products li.product .orilom-wishlist-button::before{
content:"♥" !important;
position:static !important;
display:block !important;
width:auto !important;height:auto !important;
color:#d2ad25 !important;
background:none !important;border:0 !important;
font-family:Arial,sans-serif !important;
font-size:17px !important;line-height:1 !important;
text-indent:0 !important;
}
.lux-home-v5 .lux-product-section ul.products li.product .orilom-wishlist-button::after{
display:none !important;content:none !important;
}
.lux-home-v5 .lux-product-section ul.products li.product .orilom-wishlist-button:hover,
.lux-home-v5 .lux-product-section ul.products li.product .orilom-wishlist-button:focus-visible{
transform:scale(1.08) !important;
border-color:#ddc36a !important;
box-shadow:0 7px 20px rgba(0,0,0,.16) !important;
outline:none !important;
}
.lux-home-v5 .lux-product-section ul.products li.product .orilom-wishlist-button.is-active{
background:#fffaf0 !important;border-color:#d5b33d !important;
}
/* Panier rond flottant sur l'image */
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .button,
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product a.button{
position:absolute !important;
z-index:11 !important;
top:42% !important;
left:50% !important;
right:auto !important;
bottom:auto !important;
display:block !important;
width:54px !important;min-width:54px !important;max-width:54px !important;
height:54px !important;min-height:54px !important;max-height:54px !important;
margin:0 !important;padding:0 !important;
border:1px solid rgba(181,138,42,.22) !important;
border-radius:50% !important;
background-color:#fffdf6 !important;
background-repeat:no-repeat !important;
background-position:center !important;
background-size:22px 22px !important;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.5 11h10.5l2-8H6'/%3E%3C/svg%3E") !important;
color:transparent !important;
font-size:0 !important;line-height:0 !important;text-indent:-9999px !important;
opacity:0 !important;visibility:hidden !important;
transform:translate(-50%,-42%) scale(.88) !important;
box-shadow:0 8px 22px rgba(0,0,0,.13) !important;
transition:opacity .18s ease,visibility .18s ease,transform .18s ease,box-shadow .18s ease,background-color .18s ease !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product:hover > .button,
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product:hover a.button,
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .button:focus-visible,
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product a.button:focus-visible{
opacity:1 !important;
visibility:visible !important;
transform:translate(-50%,-42%) scale(1) !important;
box-shadow:0 10px 26px rgba(0,0,0,.16),0 0 0 9px rgba(213,179,61,.10) !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .button:hover,
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product a.button:hover{
background-color:#fff6cf !important;
transform:translate(-50%,-42%) scale(1.08) !important;
box-shadow:0 12px 30px rgba(0,0,0,.18),0 0 0 11px rgba(213,179,61,.13) !important;
}
/* Responsive */
@media(max-width:1100px){
.lux-home-v5 .lux-product-section .woocommerce ul.products,
.lux-home-v5 .lux-product-section .woocommerce ul.products.columns-4,
.lux-home-v5 .lux-product-section .woocommerce ul.products.columns-6{
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
}
@media(max-width:780px){
.lux-home-v5 > .lux-trust{
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
padding:14px !important;
gap:1px !important;
background:#eee !important;
}
.lux-home-v5 > .lux-trust article{
justify-content:flex-start !important;
min-height:78px !important;
padding:12px !important;
background:#fff !important;
border:0 !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products,
.lux-home-v5 .lux-product-section .woocommerce ul.products.columns-4,
.lux-home-v5 .lux-product-section .woocommerce ul.products.columns-6{
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:28px 12px !important;
}
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .button,
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product a.button{
width:46px !important;min-width:46px !important;max-width:46px !important;
height:46px !important;min-height:46px !important;max-height:46px !important;
opacity:1 !important;visibility:visible !important;
transform:translate(-50%,-42%) scale(1) !important;
background-size:19px 19px !important;
}
}
@media(max-width:480px){
.lux-home-v5 > .lux-trust{grid-template-columns:1fr 1fr !important}
.lux-home-v5 > .lux-trust h3{font-size:11px !important}
.lux-home-v5 > .lux-trust p{font-size:9px !important}
.lux-home-v5 .lux-product-section .woocommerce-loop-product__title{font-size:10px !important}
}
@media(hover:none){
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .button,
.lux-home-v5 .lux-product-section .woocommerce ul.products li.product a.button{
opacity:1 !important;
visibility:visible !important;
}
}
/* =========================================================
ORILOM HOME V5 — BAS DE PAGE PREMIUM V3
Collections / Guide / Newsletter / Footer
Scope Home uniquement.
========================================================= */
/* ---- respiration avant les cartes de collections ---- */
body.home .lux-home-v5 .lux-categories-premium{
max-width:1450px !important;
margin:0 auto !important;
padding:96px 3vw 24px !important;
gap:22px !important;
background:#fff !important;
}
/* ---- cartes collections : image Woo si disponible + fallback ORILOM ---- */
body.home .lux-home-v5 .lux-categories-premium > .lux-category-card{
min-height:390px !important;
position:relative !important;
isolation:isolate !important;
overflow:hidden !important;
padding:44px !important;
border:1px solid rgba(255,255,255,.08) !important;
background-size:cover !important;
background-position:center !important;
color:#fff !important;
transition:transform .24s ease, box-shadow .24s ease !important;
}
body.home .lux-home-v5 .lux-categories-premium > .lux-category-designer{
background:
linear-gradient(145deg,rgba(20,20,20,.18),rgba(9,9,9,.72)),
linear-gradient(145deg,#4b4742,#121212) !important;
}
body.home .lux-home-v5 .lux-categories-premium > .lux-category-niche{
background:
linear-gradient(145deg,rgba(75,48,10,.16),rgba(9,7,3,.78)),
linear-gradient(145deg,#5a3d0d,#110d06) !important;
}
body.home .lux-home-v5 .lux-categories-premium > .has-category-image{
background-image:
linear-gradient(180deg,rgba(10,10,10,.10) 0%,rgba(10,10,10,.25) 45%,rgba(10,10,10,.88) 100%),
var(--orilom-category-image) !important;
}
body.home .lux-home-v5 .lux-categories-premium > .lux-category-card::before{
content:"ORILOM" !important;
position:absolute !important;
z-index:-1 !important;
top:34px !important;
right:34px !important;
color:rgba(255,255,255,.06) !important;
font:700 clamp(46px,5vw,78px)/1 Georgia,serif !important;
letter-spacing:.08em !important;
pointer-events:none !important;
}
body.home .lux-home-v5 .lux-categories-premium > .lux-category-card::after{
content:"" !important;
position:absolute !important;
inset:auto 0 0 !important;
z-index:-1 !important;
height:46% !important;
background:linear-gradient(to top,rgba(0,0,0,.32),transparent) !important;
pointer-events:none !important;
}
body.home .lux-home-v5 .lux-categories-premium > .lux-category-card:hover{
transform:translateY(-3px) !important;
box-shadow:0 18px 42px rgba(0,0,0,.14) !important;
}
body.home .lux-home-v5 .lux-categories-premium .lux-category-card > span{
margin-bottom:auto !important;
color:#e4bf26 !important;
font:800 9px/1 Arial,sans-serif !important;
letter-spacing:.20em !important;
}
body.home .lux-home-v5 .lux-categories-premium .lux-category-card h2{
margin:0 0 10px !important;
max-width:80% !important;
color:#fff !important;
font:500 clamp(34px,3vw,46px)/1.02 Georgia,serif !important;
letter-spacing:-.02em !important;
}
body.home .lux-home-v5 .lux-categories-premium .lux-category-card p{
max-width:420px !important;
margin:0 0 20px !important;
color:rgba(255,255,255,.72) !important;
font:500 12px/1.55 Arial,sans-serif !important;
}
body.home .lux-home-v5 .lux-categories-premium .lux-category-card b{
display:inline-flex !important;
align-items:center !important;
gap:8px !important;
width:max-content !important;
color:#fff !important;
font:800 10px/1 Arial,sans-serif !important;
letter-spacing:.10em !important;
}
body.home .lux-home-v5 .lux-categories-premium .lux-category-card b i{
font-style:normal !important;
transition:transform .18s ease !important;
}
body.home .lux-home-v5 .lux-categories-premium .lux-category-card:hover b i{
transform:translateX(4px) !important;
}
/* ---- Guide : identité ORILOM noire, plus compacte et mieux cadrée ---- */
body.home .lux-home-v5 .lux-auth-premium{
margin-top:24px !important;
padding:0 !important;
background:#0d0d0d !important;
color:#fff !important;
position:relative !important;
overflow:hidden !important;
}
body.home .lux-home-v5 .lux-auth-premium::before{
content:"ORILOM" !important;
position:absolute !important;
left:50% !important;
top:50% !important;
transform:translate(-50%,-50%) !important;
color:rgba(255,255,255,.025) !important;
font:700 clamp(110px,17vw,260px)/1 Georgia,serif !important;
letter-spacing:.06em !important;
pointer-events:none !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
position:relative !important;
z-index:1 !important;
max-width:900px !important;
margin:0 auto !important;
padding:88px 28px 92px !important;
text-align:center !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > span{
color:#ddb700 !important;
font:800 9px/1 Arial,sans-serif !important;
letter-spacing:.24em !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
margin:18px auto 18px !important;
max-width:820px !important;
color:#fff !important;
font:500 clamp(38px,4vw,58px)/1.04 Georgia,serif !important;
letter-spacing:-.025em !important;
}
body.home .lux-home-v5 .lux-auth-premium p{
max-width:690px !important;
margin:0 auto !important;
color:#bdbdbd !important;
font:400 13px/1.75 Arial,sans-serif !important;
}
body.home .lux-home-v5 .lux-auth-premium a{
min-height:46px !important;
margin-top:26px !important;
padding:0 24px !important;
border:1px solid #d8b300 !important;
background:transparent !important;
color:#e2bd00 !important;
font:800 10px/1 Arial,sans-serif !important;
letter-spacing:.08em !important;
box-shadow:none !important;
}
body.home .lux-home-v5 .lux-auth-premium a:hover{
background:#d8b300 !important;
color:#111 !important;
transform:translateY(-1px) !important;
}
/* ---- newsletter : conserve le jaune ORILOM mais réduit le "mur jaune" ---- */
body.home .newsletter{
padding:60px 20px 62px !important;
background:#dfb913 !important;
color:#111 !important;
border-top:1px solid #cba500 !important;
}
body.home .newsletter .eyebrow,
body.home .newsletter > p.eyebrow{
color:#0b7869 !important;
font-size:9px !important;
font-weight:900 !important;
letter-spacing:.24em !important;
}
body.home .newsletter h2{
margin:12px 0 10px !important;
font:500 clamp(34px,3.4vw,50px)/1.05 Georgia,serif !important;
letter-spacing:-.025em !important;
}
body.home .newsletter > p:not(.eyebrow){
margin:0 auto !important;
color:#4f4000 !important;
font-size:12px !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
max-width:560px !important;
margin:24px auto 0 !important;
}
body.home .newsletter input[type="email"]{
min-height:44px !important;
background:rgba(255,255,255,.16) !important;
border-color:#111 !important;
color:#111 !important;
}
body.home .newsletter button,
body.home .newsletter input[type="submit"]{
min-height:44px !important;
background:#111 !important;
color:#fff !important;
border:1px solid #111 !important;
transition:background .18s ease,color .18s ease !important;
}
body.home .newsletter button:hover,
body.home .newsletter input[type="submit"]:hover{
background:#2a2a2a !important;
}
/* ---- footer : plus premium et plus compact ---- */
body.home .site-footer:not(.orilom-footer-v34){
background:#0b0b0b !important;
color:#d8d8d8 !important;
padding-top:56px !important;
padding-bottom:26px !important;
border-top:1px solid rgba(255,255,255,.04) !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand{
color:#fff !important;
}
body.home .site-footer:not(.orilom-footer-v34) h4{
color:#fff !important;
font-size:13px !important;
}
body.home .site-footer:not(.orilom-footer-v34) a{
color:#e6e6e6 !important;
transition:color .16s ease !important;
}
body.home .site-footer:not(.orilom-footer-v34) a:hover{
color:#dfb913 !important;
}
body.home .site-footer:not(.orilom-footer-v34) p{
color:#878787 !important;
}
body.home .site-footer:not(.orilom-footer-v34) .copyright{
margin-top:22px !important;
padding-top:20px !important;
border-top-color:rgba(255,255,255,.10) !important;
color:#777 !important;
font-size:10px !important;
}
/* ---- responsive bas de Home ---- */
@media(max-width:780px){
body.home .lux-home-v5 .lux-categories-premium{
grid-template-columns:1fr !important;
padding:62px 18px 18px !important;
}
body.home .lux-home-v5 .lux-categories-premium > .lux-category-card{
min-height:300px !important;
padding:30px !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
padding:66px 20px 70px !important;
}
body.home .newsletter{
padding:48px 18px 50px !important;
}
}
@media(max-width:480px){
body.home .lux-home-v5 .lux-categories-premium > .lux-category-card{
min-height:270px !important;
}
body.home .lux-home-v5 .lux-categories-premium .lux-category-card h2{
max-width:100% !important;
font-size:34px !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
font-size:38px !important;
}
}
/* =========================================================
ORILOM HOME V5 — FINAL BOTTOM POLISH V3.1
Corrige uniquement Guide + Newsletter + Footer sur la Home
========================================================= */
/* GUIDE : moins massif, watermark plus discret */
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
max-width:860px !important;
padding:72px 28px 76px !important;
}
body.home .lux-home-v5 .lux-auth-premium::before{
color:rgba(255,255,255,.016) !important;
font-size:clamp(96px,14vw,210px) !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
margin:15px auto 16px !important;
font-size:clamp(36px,3.6vw,54px) !important;
}
body.home .lux-home-v5 .lux-auth-premium p{
max-width:650px !important;
font-size:12px !important;
line-height:1.7 !important;
}
body.home .lux-home-v5 .lux-auth-premium a{
min-height:44px !important;
margin-top:22px !important;
padding:0 22px !important;
}
/* NEWSLETTER : identité noir/or cohérente, moins de "mur jaune" */
body.home .newsletter{
padding:48px 20px 50px !important;
background:#dfb913 !important;
border-top:0 !important;
border-bottom:1px solid #bd9700 !important;
}
body.home .newsletter .eyebrow,
body.home .newsletter > p.eyebrow{
color:#342a00 !important;
font-size:9px !important;
letter-spacing:.26em !important;
}
body.home .newsletter h2{
margin:10px 0 9px !important;
font-size:clamp(32px,3.1vw,46px) !important;
line-height:1.03 !important;
}
body.home .newsletter > p:not(.eyebrow){
max-width:560px !important;
font-size:11px !important;
line-height:1.55 !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
max-width:520px !important;
margin:20px auto 0 !important;
}
body.home .newsletter input[type="email"]{
min-height:44px !important;
padding:0 14px !important;
background:rgba(255,255,255,.20) !important;
border:1px solid #111 !important;
font-size:12px !important;
}
body.home .newsletter button,
body.home .newsletter input[type="submit"]{
min-height:44px !important;
padding:0 24px !important;
font-size:9px !important;
font-weight:900 !important;
letter-spacing:.10em !important;
}
/* FOOTER : plus lisible, plus premium, proportions plus équilibrées */
body.home .site-footer:not(.orilom-footer-v34){
max-width:none !important;
padding:
48px
max(5vw, calc((100vw - 1450px) / 2 + 4vw))
24px !important;
grid-template-columns:minmax(260px,1.55fr) repeat(3,minmax(150px,1fr)) !important;
column-gap:64px !important;
row-gap:28px !important;
background:#0a0a0a !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand{
font-size:26px !important;
letter-spacing:.15em !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand small,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand small{
font-size:7px !important;
letter-spacing:.42em !important;
}
body.home .site-footer:not(.orilom-footer-v34) h4{
margin-bottom:16px !important;
font:600 14px/1.2 Georgia,serif !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:not(:first-child){
gap:10px !important;
font-size:11px !important;
}
body.home .site-footer:not(.orilom-footer-v34) a{
font-size:11px !important;
line-height:1.35 !important;
}
body.home .site-footer:not(.orilom-footer-v34) p{
max-width:300px !important;
font-size:10px !important;
line-height:1.55 !important;
}
body.home .site-footer:not(.orilom-footer-v34) .copyright{
margin-top:10px !important;
padding-top:18px !important;
font-size:9px !important;
}
/* Hover propre, sans mouvement excessif */
body.home .site-footer:not(.orilom-footer-v34) a:hover{
color:#dfb913 !important;
}
/* Mobile */
@media(max-width:900px){
body.home .site-footer:not(.orilom-footer-v34){
grid-template-columns:1.35fr 1fr 1fr !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:nth-child(4){
grid-column:2 / -1 !important;
}
}
@media(max-width:650px){
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
padding:58px 20px 62px !important;
}
body.home .newsletter{
padding:42px 18px 44px !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
max-width:100% !important;
}
body.home .site-footer:not(.orilom-footer-v34){
grid-template-columns:1fr 1fr !important;
padding:42px 22px 22px !important;
column-gap:26px !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:first-child,
body.home .site-footer:not(.orilom-footer-v34) .copyright{
grid-column:1 / -1 !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:nth-child(4){
grid-column:auto !important;
}
}
/* =========================================================
ORILOM HOME — FINAL LUXURY BALANCE V4
Objectif : alléger la fin de page sans perdre l'identité.
Scope strict : Home uniquement.
========================================================= */
/* 1) GUIDE : moment éditorial premium, mais court */
body.home .lux-home-v5 .lux-auth-premium{
margin-top:20px !important;
background:#0b0b0b !important;
border-top:1px solid rgba(255,255,255,.04) !important;
border-bottom:1px solid rgba(255,255,255,.06) !important;
}
body.home .lux-home-v5 .lux-auth-premium::before{
content:"ORILOM" !important;
color:rgba(255,255,255,.012) !important;
font-size:clamp(82px,11vw,165px) !important;
letter-spacing:.08em !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
max-width:820px !important;
padding:56px 24px 60px !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > span{
color:#d8b300 !important;
font-size:8px !important;
letter-spacing:.25em !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
max-width:760px !important;
margin:12px auto 12px !important;
font-size:clamp(32px,3.15vw,46px) !important;
line-height:1.03 !important;
letter-spacing:-.025em !important;
}
body.home .lux-home-v5 .lux-auth-premium p{
max-width:610px !important;
margin:0 auto !important;
color:#aaa !important;
font-size:11px !important;
line-height:1.65 !important;
}
body.home .lux-home-v5 .lux-auth-premium a{
min-height:40px !important;
margin-top:18px !important;
padding:0 20px !important;
border-color:#d8b300 !important;
color:#d8b300 !important;
font-size:9px !important;
letter-spacing:.09em !important;
}
body.home .lux-home-v5 .lux-auth-premium a:hover{
background:#d8b300 !important;
color:#0b0b0b !important;
}
/* 2) NEWSLETTER : supprimer le "mur jaune".
Ivoire chaud + or comme accent = plus parfum/luxe. */
body.home .newsletter{
position:relative !important;
padding:44px 20px 46px !important;
background:#f6f2e9 !important;
color:#111 !important;
border-top:0 !important;
border-bottom:1px solid #e5dfd2 !important;
box-shadow:none !important;
}
body.home .newsletter::before{
content:"" !important;
position:absolute !important;
top:0 !important;
left:50% !important;
width:54px !important;
height:2px !important;
transform:translateX(-50%) !important;
background:#d8b300 !important;
}
body.home .newsletter .eyebrow,
body.home .newsletter > p.eyebrow{
margin:0 !important;
color:#9b7b00 !important;
font-size:8px !important;
font-weight:900 !important;
letter-spacing:.26em !important;
}
body.home .newsletter h2{
max-width:760px !important;
margin:10px auto 8px !important;
color:#111 !important;
font-size:clamp(30px,2.8vw,42px) !important;
line-height:1.04 !important;
letter-spacing:-.025em !important;
}
body.home .newsletter > p:not(.eyebrow){
max-width:520px !important;
margin:0 auto !important;
color:#6f6a60 !important;
font-size:11px !important;
line-height:1.55 !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
max-width:500px !important;
margin:18px auto 0 !important;
}
body.home .newsletter input[type="email"]{
min-height:42px !important;
padding:0 14px !important;
background:#fff !important;
border:1px solid #cfc7b7 !important;
color:#111 !important;
font-size:12px !important;
box-shadow:none !important;
}
body.home .newsletter input[type="email"]:focus{
border-color:#a88600 !important;
outline:2px solid rgba(216,179,0,.16) !important;
outline-offset:1px !important;
}
body.home .newsletter button,
body.home .newsletter input[type="submit"]{
min-height:42px !important;
padding:0 22px !important;
background:#111 !important;
border:1px solid #111 !important;
color:#fff !important;
font-size:9px !important;
font-weight:900 !important;
letter-spacing:.10em !important;
}
body.home .newsletter button:hover,
body.home .newsletter input[type="submit"]:hover{
background:#d8b300 !important;
border-color:#d8b300 !important;
color:#111 !important;
}
/* 3) FOOTER : compact mais lisible */
body.home .site-footer:not(.orilom-footer-v34){
padding:
42px
max(5vw, calc((100vw - 1450px) / 2 + 4vw))
20px !important;
grid-template-columns:minmax(250px,1.5fr) repeat(3,minmax(140px,1fr)) !important;
column-gap:52px !important;
row-gap:24px !important;
background:#090909 !important;
border-top:0 !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand{
color:#d8b300 !important;
font-size:24px !important;
letter-spacing:.14em !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand small,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand small{
color:#eee !important;
font-size:7px !important;
letter-spacing:.38em !important;
}
body.home .site-footer:not(.orilom-footer-v34) h4{
margin:0 0 13px !important;
color:#fff !important;
font-size:13px !important;
line-height:1.2 !important;
}
body.home .site-footer:not(.orilom-footer-v34) a{
color:#d8d8d8 !important;
font-size:10.5px !important;
line-height:1.45 !important;
}
body.home .site-footer:not(.orilom-footer-v34) a:hover{
color:#d8b300 !important;
}
body.home .site-footer:not(.orilom-footer-v34) p{
max-width:290px !important;
color:#858585 !important;
font-size:9.5px !important;
line-height:1.55 !important;
}
body.home .site-footer:not(.orilom-footer-v34) .copyright{
margin-top:8px !important;
padding-top:16px !important;
border-top:1px solid rgba(255,255,255,.09) !important;
color:#686868 !important;
font-size:8.5px !important;
line-height:1.5 !important;
}
/* 4) Mobile : même hiérarchie, pas de gros aplats */
@media(max-width:780px){
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
padding:48px 20px 52px !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
font-size:34px !important;
}
body.home .newsletter{
padding:38px 18px 40px !important;
}
body.home .newsletter h2{
font-size:31px !important;
}
body.home .site-footer:not(.orilom-footer-v34){
grid-template-columns:1fr 1fr !important;
padding:38px 22px 20px !important;
column-gap:28px !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:first-child,
body.home .site-footer:not(.orilom-footer-v34) .copyright{
grid-column:1 / -1 !important;
}
}
@media(max-width:480px){
body.home .lux-home-v5 .lux-auth-premium h2{
font-size:30px !important;
}
body.home .newsletter h2{
font-size:28px !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
max-width:100% !important;
}
}
/* =========================================================
ORILOM HOME — GUIDE CLOUD BACKGROUND V5
Image: assets/images/orilom-guide-bg.png
Scope strict : section guide de la Home uniquement
========================================================= */
body.home .lux-home-v5 .lux-auth-cloud-bg{
position:relative !important;
isolation:isolate !important;
overflow:hidden !important;
/* theme.css est dans /assets/css/ ; l'image est dans /assets/images/ */
background-image:url("../images/orilom-guide-bg.png") !important;
background-repeat:no-repeat !important;
background-size:cover !important;
background-position:center 23% !important;
min-height:360px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
border-top:0 !important;
border-bottom:0 !important;
}
/* voile ivoire très léger pour garder la lisibilité sans tuer l'image */
body.home .lux-home-v5 .lux-auth-cloud-bg::after{
content:"" !important;
position:absolute !important;
inset:0 !important;
z-index:-1 !important;
background:
linear-gradient(
90deg,
rgba(255,248,236,.10) 0%,
rgba(255,248,236,.18) 24%,
rgba(255,248,236,.34) 50%,
rgba(255,248,236,.18) 76%,
rgba(255,248,236,.10) 100%
) !important;
pointer-events:none !important;
}
/* on retire le watermark ORILOM géant de l'ancienne version */
body.home .lux-home-v5 .lux-auth-cloud-bg::before{
display:none !important;
content:none !important;
}
/* texte HTML posé sur le fond */
body.home .lux-home-v5 .lux-auth-cloud-bg .lux-auth-inner{
width:min(760px,calc(100% - 40px)) !important;
max-width:760px !important;
margin:0 auto !important;
padding:94px 24px 50px !important;
text-align:center !important;
position:relative !important;
z-index:2 !important;
background:transparent !important;
}
/* Le symbole ORILOM est déjà intégré à l'image : on descend le contenu dessous */
body.home .lux-home-v5 .lux-auth-cloud-bg .lux-auth-inner > span{
color:#9a7300 !important;
text-shadow:none !important;
}
body.home .lux-home-v5 .lux-auth-cloud-bg h2{
color:#17120d !important;
text-shadow:0 1px 0 rgba(255,255,255,.55) !important;
font-size:clamp(34px,3.35vw,50px) !important;
line-height:1.03 !important;
margin:12px auto 12px !important;
}
body.home .lux-home-v5 .lux-auth-cloud-bg p{
max-width:620px !important;
color:#4f4538 !important;
font-size:11px !important;
line-height:1.65 !important;
text-shadow:0 1px 0 rgba(255,255,255,.40) !important;
}
body.home .lux-home-v5 .lux-auth-cloud-bg a{
min-height:42px !important;
margin-top:18px !important;
padding:0 22px !important;
border:1px solid #9f7c00 !important;
background:rgba(255,248,226,.50) !important;
color:#17120d !important;
box-shadow:0 6px 22px rgba(100,69,0,.08) !important;
backdrop-filter:blur(2px) !important;
}
body.home .lux-home-v5 .lux-auth-cloud-bg a:hover{
background:#111 !important;
border-color:#111 !important;
color:#e1b900 !important;
}
/* Mobile : conserver les nuages et le symbole visible */
@media(max-width:780px){
body.home .lux-home-v5 .lux-auth-cloud-bg{
min-height:390px !important;
background-position:center 18% !important;
}
body.home .lux-home-v5 .lux-auth-cloud-bg .lux-auth-inner{
width:calc(100% - 30px) !important;
padding:110px 18px 44px !important;
}
body.home .lux-home-v5 .lux-auth-cloud-bg h2{
font-size:34px !important;
}
}
@media(max-width:480px){
body.home .lux-home-v5 .lux-auth-cloud-bg{
min-height:420px !important;
background-position:center 16% !important;
}
body.home .lux-home-v5 .lux-auth-cloud-bg .lux-auth-inner{
padding-top:118px !important;
}
body.home .lux-home-v5 .lux-auth-cloud-bg h2{
font-size:30px !important;
}
}
/* =========================================================
ORILOM HOME — GUIDE DARK + CERCLE CLOUD V6
Architecture finale : NOIR -> LUMIERE -> NOIR
Image utilisée : ../images/orilom-guide-bg.png
Scope strict : Home uniquement
========================================================= */
/* ---------------------------------------------------------
1. GUIDE : NOIR EDITORIAL PREMIUM
--------------------------------------------------------- */
body.home .lux-home-v5 .lux-auth-premium{
position:relative !important;
isolation:isolate !important;
overflow:hidden !important;
min-height:270px !important;
margin-top:22px !important;
padding:0 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
background:
radial-gradient(circle at 50% 38%, rgba(180,137,20,.10), transparent 34%),
radial-gradient(circle at 8% 52%, rgba(255,255,255,.025), transparent 25%),
radial-gradient(circle at 92% 44%, rgba(255,255,255,.022), transparent 24%),
#090909 !important;
color:#fff !important;
border:0 !important;
}
/* supprimer tous les anciens watermarks/images du Guide */
body.home .lux-home-v5 .lux-auth-premium::before{
content:"" !important;
display:block !important;
position:absolute !important;
inset:0 !important;
z-index:-2 !important;
background:
linear-gradient(115deg, transparent 0 38%, rgba(216,179,0,.025) 48%, transparent 58%),
linear-gradient(245deg, transparent 0 42%, rgba(216,179,0,.018) 50%, transparent 60%) !important;
pointer-events:none !important;
}
body.home .lux-home-v5 .lux-auth-premium::after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:-1 !important;
left:50% !important;
bottom:0 !important;
width:90px !important;
height:1px !important;
transform:translateX(-50%) !important;
background:linear-gradient(90deg,transparent,#d8b300,transparent) !important;
pointer-events:none !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:min(760px,calc(100% - 40px)) !important;
max-width:760px !important;
margin:0 auto !important;
padding:50px 22px 54px !important;
text-align:center !important;
background:transparent !important;
position:relative !important;
z-index:2 !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > span{
color:#d8b300 !important;
font-size:8px !important;
font-weight:900 !important;
letter-spacing:.25em !important;
text-shadow:none !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
max-width:720px !important;
margin:12px auto 12px !important;
color:#fff !important;
font:500 clamp(32px,3.15vw,46px)/1.03 Georgia,serif !important;
letter-spacing:-.025em !important;
text-shadow:none !important;
}
body.home .lux-home-v5 .lux-auth-premium p{
max-width:610px !important;
margin:0 auto !important;
color:#aaa !important;
font-size:11px !important;
line-height:1.65 !important;
text-shadow:none !important;
}
body.home .lux-home-v5 .lux-auth-premium a{
min-height:40px !important;
margin-top:18px !important;
padding:0 20px !important;
border:1px solid #d8b300 !important;
background:transparent !important;
color:#d8b300 !important;
font-size:9px !important;
font-weight:900 !important;
letter-spacing:.09em !important;
box-shadow:none !important;
backdrop-filter:none !important;
}
body.home .lux-home-v5 .lux-auth-premium a:hover{
background:#d8b300 !important;
border-color:#d8b300 !important;
color:#090909 !important;
transform:translateY(-1px) !important;
}
/* ---------------------------------------------------------
2. CERCLE ORILOM : L'IMAGE NUAGE DEVIENT LE BG NEWSLETTER
--------------------------------------------------------- */
body.home .newsletter{
position:relative !important;
isolation:isolate !important;
overflow:hidden !important;
min-height:310px !important;
padding:56px 20px 58px !important;
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
background-image:
linear-gradient(
90deg,
rgba(255,249,238,.14) 0%,
rgba(255,249,238,.30) 24%,
rgba(255,249,238,.40) 50%,
rgba(255,249,238,.30) 76%,
rgba(255,249,238,.14) 100%
),
url("../images/orilom-guide-bg.png") !important;
background-repeat:no-repeat,no-repeat !important;
background-size:cover,cover !important;
background-position:center,center 24% !important;
color:#111 !important;
border:0 !important;
box-shadow:none !important;
}
/* petit voile central uniquement pour la lisibilité */
body.home .newsletter::after{
content:"" !important;
position:absolute !important;
z-index:-1 !important;
top:20px !important;
bottom:20px !important;
left:50% !important;
width:min(760px,88vw) !important;
transform:translateX(-50%) !important;
background:radial-gradient(
ellipse at center,
rgba(255,248,232,.50) 0%,
rgba(255,248,232,.24) 54%,
transparent 76%
) !important;
pointer-events:none !important;
}
/* garder visible le symbole ORILOM intégré dans l'image :
le contenu commence plus bas */
body.home .newsletter .eyebrow,
body.home .newsletter > p.eyebrow{
margin:28px 0 0 !important;
color:#8d6d00 !important;
font-size:8px !important;
font-weight:900 !important;
letter-spacing:.27em !important;
}
body.home .newsletter h2{
max-width:760px !important;
margin:9px auto 7px !important;
color:#111 !important;
font:500 clamp(31px,2.8vw,42px)/1.04 Georgia,serif !important;
letter-spacing:-.025em !important;
text-shadow:0 1px 0 rgba(255,255,255,.38) !important;
}
body.home .newsletter > p:not(.eyebrow){
max-width:520px !important;
margin:0 auto !important;
color:#62584b !important;
font-size:11px !important;
line-height:1.55 !important;
text-shadow:0 1px 0 rgba(255,255,255,.28) !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
width:min(500px,100%) !important;
max-width:500px !important;
margin:17px auto 0 !important;
}
body.home .newsletter input[type="email"]{
min-height:42px !important;
padding:0 14px !important;
background:rgba(255,255,255,.82) !important;
border:1px solid rgba(87,68,20,.38) !important;
color:#111 !important;
font-size:12px !important;
box-shadow:0 7px 24px rgba(100,75,0,.06) !important;
}
body.home .newsletter input[type="email"]:focus{
border-color:#9a7600 !important;
outline:2px solid rgba(216,179,0,.18) !important;
outline-offset:1px !important;
}
body.home .newsletter button,
body.home .newsletter input[type="submit"]{
min-height:42px !important;
padding:0 22px !important;
background:#111 !important;
border:1px solid #111 !important;
color:#fff !important;
font-size:9px !important;
font-weight:900 !important;
letter-spacing:.10em !important;
}
body.home .newsletter button:hover,
body.home .newsletter input[type="submit"]:hover{
background:#d8b300 !important;
border-color:#d8b300 !important;
color:#111 !important;
}
/* ---------------------------------------------------------
3. FOOTER : NOIR, COMPACT, CONTINUITE DE LA FIN DE PAGE
--------------------------------------------------------- */
body.home .site-footer:not(.orilom-footer-v34){
background:#090909 !important;
border-top:1px solid rgba(255,255,255,.04) !important;
}
/* ---------------------------------------------------------
4. RESPONSIVE
--------------------------------------------------------- */
@media(max-width:780px){
body.home .lux-home-v5 .lux-auth-premium{
min-height:250px !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
padding:44px 18px 48px !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
font-size:34px !important;
}
body.home .newsletter{
min-height:330px !important;
padding:52px 18px 48px !important;
background-position:center,center 20% !important;
}
body.home .newsletter .eyebrow,
body.home .newsletter > p.eyebrow{
margin-top:42px !important;
}
body.home .newsletter h2{
font-size:31px !important;
}
}
@media(max-width:480px){
body.home .lux-home-v5 .lux-auth-premium h2{
font-size:30px !important;
}
body.home .newsletter{
min-height:350px !important;
background-position:center,center 17% !important;
}
body.home .newsletter h2{
font-size:28px !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
width:100% !important;
}
}
/* =========================================================
ORILOM HOME — CERCLE RESPONSIVE V6.1
Même image, adaptation CSS desktop/mobile
========================================================= */
/* Desktop large : cadrage plus cinématographique */
@media (min-width: 1200px){
body.home .newsletter{
min-height:320px !important;
padding:62px 20px 54px !important;
background-size:cover,cover !important;
background-position:center,center 22% !important;
}
body.home .newsletter .eyebrow,
body.home .newsletter > p.eyebrow{
margin-top:34px !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
width:500px !important;
max-width:500px !important;
}
}
/* Tablette */
@media (max-width: 900px){
body.home .newsletter{
min-height:330px !important;
padding:54px 18px 50px !important;
background-position:center,center 20% !important;
}
}
/* Mobile : on garde la même image mais on la recadre pour le format portrait */
@media (max-width: 650px){
body.home .newsletter{
min-height:360px !important;
padding:62px 20px 38px !important;
/* Le second calque est l'image réelle */
background-size:cover,auto 100% !important;
background-position:center,center top !important;
background-color:#ead7b7 !important;
}
body.home .newsletter::after{
top:12px !important;
bottom:12px !important;
width:92vw !important;
background:radial-gradient(
ellipse at center,
rgba(255,248,232,.56) 0%,
rgba(255,248,232,.28) 58%,
transparent 80%
) !important;
}
body.home .newsletter .eyebrow,
body.home .newsletter > p.eyebrow{
margin-top:36px !important;
font-size:8px !important;
}
body.home .newsletter h2{
width:100% !important;
max-width:390px !important;
margin:9px auto 8px !important;
font-size:29px !important;
line-height:1.05 !important;
}
body.home .newsletter > p:not(.eyebrow){
max-width:330px !important;
font-size:10px !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
width:min(100%,400px) !important;
max-width:400px !important;
margin:18px auto 0 !important;
}
body.home .newsletter form p,
body.home .newsletter .wpcf7-form p{
margin:0 !important;
}
body.home .newsletter input[type="email"]{
width:100% !important;
min-height:44px !important;
margin:0 !important;
border-radius:0 !important;
}
body.home .newsletter button,
body.home .newsletter input[type="submit"]{
width:100% !important;
min-height:44px !important;
margin-top:8px !important;
border-radius:0 !important;
}
}
/* Très petit mobile */
@media (max-width: 420px){
body.home .newsletter{
min-height:350px !important;
padding:58px 16px 34px !important;
background-size:cover,auto 100% !important;
background-position:center,center top !important;
}
body.home .newsletter h2{
font-size:27px !important;
}
body.home .newsletter form,
body.home .newsletter .wpcf7-form{
max-width:100% !important;
}
}
/* ORILOM HOME — masquer "LE CERCLE ORILOM" dans la newsletter */
body.home .newsletter .eyebrow,
body.home .newsletter > p.eyebrow{
display:none !important;
}
/* Rééquilibrage après suppression du libellé */
body.home .newsletter h2{
margin-top:22px !important;
}
@media(max-width:650px){
body.home .newsletter h2{
margin-top:30px !important;
}
}
/* =========================================================
ORILOM HOME — GUIDE + NEWSLETTER UNIFIES V7
========================================================= */
body.home .newsletter{display:none !important;}
body.home .lux-home-v5 .lux-auth-premium{
min-height:0 !important;margin:22px 0 0 !important;padding:0 !important;
background:radial-gradient(circle at 50% 28%,rgba(183,139,20,.085),transparent 32%),linear-gradient(180deg,#0b0b0b 0%,#080808 100%) !important;
border-bottom:1px solid rgba(255,255,255,.07) !important;
}
body.home .lux-home-v5 .lux-auth-premium::after{display:none !important;}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:min(940px,calc(100% - 40px)) !important;max-width:940px !important;padding:52px 20px 42px !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner>a{
min-height:38px !important;margin-top:17px !important;padding:0 18px !important;
}
body.home .orilom-guide-newsletter{
width:min(760px,100%) !important;margin:34px auto 0 !important;padding:27px 0 0 !important;
display:grid !important;grid-template-columns:minmax(0,1fr) minmax(330px,1.15fr) !important;
align-items:center !important;gap:28px !important;border-top:1px solid rgba(255,255,255,.11) !important;text-align:left !important;
}
body.home .orilom-guide-newsletter-copy strong{
display:block !important;margin:0 0 6px !important;color:#fff !important;
font:500 19px/1.15 Georgia,serif !important;letter-spacing:-.015em !important;
}
body.home .orilom-guide-newsletter-copy small{
display:block !important;color:#8d8d8d !important;font:400 10px/1.5 Arial,sans-serif !important;
}
body.home .orilom-guide-newsletter-form{
display:grid !important;grid-template-columns:minmax(0,1fr) auto !important;width:100% !important;margin:0 !important;padding:0 !important;gap:0 !important;
}
body.home .orilom-guide-newsletter-form input[type="email"]{
width:100% !important;min-width:0 !important;height:42px !important;min-height:42px !important;margin:0 !important;padding:0 14px !important;
border:1px solid #383838 !important;border-right:0 !important;border-radius:0 !important;background:#111 !important;color:#fff !important;
font:400 11px/1 Arial,sans-serif !important;box-shadow:none !important;
}
body.home .orilom-guide-newsletter-form input[type="email"]::placeholder{color:#777 !important;opacity:1 !important;}
body.home .orilom-guide-newsletter-form input[type="email"]:focus{
position:relative !important;z-index:1 !important;border-color:#d8b300 !important;outline:1px solid #d8b300 !important;outline-offset:-1px !important;
}
body.home .orilom-guide-newsletter-form button{
height:42px !important;min-height:42px !important;margin:0 !important;padding:0 18px !important;border:1px solid #d8b300 !important;
border-radius:0 !important;background:#d8b300 !important;color:#080808 !important;font:900 8px/1 Arial,sans-serif !important;
letter-spacing:.10em !important;white-space:nowrap !important;cursor:pointer !important;
}
body.home .orilom-guide-newsletter-form button:hover{background:#fff !important;border-color:#fff !important;color:#080808 !important;}
body.home .site-footer:not(.orilom-footer-v34){padding-top:38px !important;border-top:0 !important;background:#080808 !important;}
@media(max-width:780px){
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{width:calc(100% - 32px) !important;padding:44px 0 36px !important;}
body.home .orilom-guide-newsletter{margin-top:28px !important;padding-top:24px !important;grid-template-columns:1fr !important;gap:16px !important;text-align:center !important;}
body.home .orilom-guide-newsletter-copy strong{font-size:20px !important;}
body.home .orilom-guide-newsletter-copy small{max-width:330px !important;margin:0 auto !important;}
body.home .orilom-guide-newsletter-form{width:min(420px,100%) !important;margin:0 auto !important;grid-template-columns:1fr !important;gap:8px !important;}
body.home .orilom-guide-newsletter-form input[type="email"]{border-right:1px solid #383838 !important;}
body.home .orilom-guide-newsletter-form button{width:100% !important;}
body.home .site-footer:not(.orilom-footer-v34){padding-top:34px !important;}
}
/* =========================================================
ORILOM HOME — FOOTER PREMIUM V8.2 FIX
Correctif ciblé : Guide + Newsletter + Réassurance + Footer
Aucun sélecteur global hors body.home.
========================================================= */
/* 1) GUIDE / NEWSLETTER : meilleure présence sans toucher au reste */
body.home .lux-home-v5 .lux-auth-premium{
margin-top:22px !important;
background:
radial-gradient(circle at 50% 23%,rgba(216,179,0,.10),transparent 31%),
linear-gradient(180deg,#0b0b0b 0%,#080808 100%) !important;
border-top:1px solid rgba(255,255,255,.05) !important;
border-bottom:0 !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:min(1040px,calc(100% - 48px)) !important;
max-width:1040px !important;
padding:58px 24px 46px !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > span{
display:block !important;
margin-bottom:14px !important;
color:#d8b300 !important;
font:800 8px/1.2 Arial,sans-serif !important;
letter-spacing:.28em !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
max-width:820px !important;
margin:0 auto 13px !important;
color:#fff !important;
font:500 clamp(38px,3.15vw,52px)/.99 Georgia,serif !important;
letter-spacing:-.035em !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > p{
max-width:760px !important;
margin:0 auto !important;
color:#b8b8b8 !important;
font:400 11px/1.65 Arial,sans-serif !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a{
min-height:40px !important;
margin-top:19px !important;
padding:0 24px !important;
border:1px solid #d8b300 !important;
background:#d8b300 !important;
color:#080808 !important;
font:900 9px/1 Arial,sans-serif !important;
letter-spacing:.11em !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a:hover{
background:#fff !important;
border-color:#fff !important;
color:#080808 !important;
}
body.home .orilom-guide-newsletter{
width:min(900px,100%) !important;
margin:38px auto 0 !important;
padding:29px 0 0 !important;
display:grid !important;
grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr) !important;
align-items:center !important;
gap:42px !important;
border-top:1px solid rgba(255,255,255,.13) !important;
text-align:left !important;
}
body.home .orilom-guide-newsletter-copy strong{
display:block !important;
margin:0 0 7px !important;
color:#fff !important;
font:500 21px/1.1 Georgia,serif !important;
letter-spacing:-.02em !important;
}
body.home .orilom-guide-newsletter-copy small{
display:block !important;
color:#929292 !important;
font:400 11px/1.55 Arial,sans-serif !important;
}
body.home .orilom-guide-newsletter-form{
display:grid !important;
grid-template-columns:minmax(0,1fr) auto !important;
width:100% !important;
margin:0 !important;
padding:0 !important;
gap:0 !important;
}
body.home .orilom-guide-newsletter-form input[type="email"]{
width:100% !important;
min-width:0 !important;
height:46px !important;
min-height:46px !important;
margin:0 !important;
padding:0 16px !important;
border:1px solid #3c3c3c !important;
border-right:0 !important;
border-radius:0 !important;
background:#111 !important;
color:#fff !important;
font:400 11px/1 Arial,sans-serif !important;
box-shadow:none !important;
}
body.home .orilom-guide-newsletter-form button{
height:46px !important;
min-height:46px !important;
margin:0 !important;
padding:0 22px !important;
border:1px solid #d8b300 !important;
border-radius:0 !important;
background:#d8b300 !important;
color:#080808 !important;
font:900 9px/1 Arial,sans-serif !important;
letter-spacing:.11em !important;
white-space:nowrap !important;
cursor:pointer !important;
}
body.home .orilom-guide-newsletter-form button:hover{
background:#fff !important;
border-color:#fff !important;
}
/* 2) RÉASSURANCE : le bloc était blanc car aucun style n'existait */
body.home .orilom-footer-trust{
width:100% !important;
margin:0 !important;
padding:24px max(5vw,calc((100vw - 1280px)/2)) !important;
display:grid !important;
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
gap:0 !important;
background:#0a0a0a !important;
color:#fff !important;
border-top:1px solid rgba(255,255,255,.08) !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
}
body.home .orilom-footer-trust article{
min-width:0 !important;
min-height:72px !important;
margin:0 !important;
padding:10px 30px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:14px !important;
background:transparent !important;
border:0 !important;
border-right:1px solid rgba(255,255,255,.10) !important;
}
body.home .orilom-footer-trust article:first-child{padding-left:0 !important;}
body.home .orilom-footer-trust article:last-child{
padding-right:0 !important;
border-right:0 !important;
}
body.home .orilom-footer-trust-icon{
width:34px !important;
min-width:34px !important;
height:34px !important;
display:grid !important;
place-items:center !important;
border:1px solid rgba(216,179,0,.50) !important;
border-radius:999px !important;
color:#d8b300 !important;
font:700 15px/1 Arial,sans-serif !important;
}
body.home .orilom-footer-trust h3{
margin:0 0 5px !important;
color:#fff !important;
font:600 14px/1.2 Georgia,serif !important;
letter-spacing:0 !important;
}
body.home .orilom-footer-trust p{
margin:0 !important;
color:#8f8f8f !important;
font:400 10.5px/1.45 Arial,sans-serif !important;
}
/* 3) FOOTER : largeur, lisibilité et hiérarchie */
body.home .site-footer:not(.orilom-footer-v34){
width:100% !important;
max-width:none !important;
margin:0 !important;
padding:46px max(5vw,calc((100vw - 1280px)/2)) 24px !important;
display:grid !important;
grid-template-columns:minmax(280px,1.45fr) repeat(3,minmax(150px,1fr)) !important;
column-gap:64px !important;
row-gap:26px !important;
background:#080808 !important;
color:#d7d7d7 !important;
border-top:0 !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div{
min-width:0 !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand{
color:#d8b300 !important;
font-size:27px !important;
letter-spacing:.16em !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand small,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand small{
margin-top:8px !important;
color:#f0f0f0 !important;
font-size:8px !important;
letter-spacing:.34em !important;
}
body.home .site-footer:not(.orilom-footer-v34) h4{
margin:0 0 16px !important;
color:#fff !important;
font:600 14px/1.2 Georgia,serif !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:not(:first-child){
gap:11px !important;
font-size:12px !important;
}
body.home .site-footer:not(.orilom-footer-v34) a{
color:#d8d8d8 !important;
font-size:12px !important;
line-height:1.45 !important;
}
body.home .site-footer:not(.orilom-footer-v34) a:hover{color:#d8b300 !important;}
body.home .site-footer:not(.orilom-footer-v34) p{
max-width:310px !important;
margin-top:12px !important;
color:#858585 !important;
font-size:10.5px !important;
line-height:1.6 !important;
}
body.home .site-footer:not(.orilom-footer-v34) .copyright{
grid-column:1 / -1 !important;
margin-top:8px !important;
padding-top:20px !important;
border-top:1px solid rgba(255,255,255,.10) !important;
color:#777 !important;
font-size:10px !important;
line-height:1.6 !important;
}
/* 4) TABLETTE */
@media(max-width:980px){
body.home .orilom-guide-newsletter{
grid-template-columns:1fr !important;
gap:18px !important;
text-align:center !important;
}
body.home .orilom-guide-newsletter-form{
width:min(560px,100%) !important;
margin:0 auto !important;
}
body.home .orilom-footer-trust{
padding-left:28px !important;
padding-right:28px !important;
}
body.home .orilom-footer-trust article{
padding-left:18px !important;
padding-right:18px !important;
}
body.home .site-footer:not(.orilom-footer-v34){
grid-template-columns:minmax(230px,1.35fr) repeat(2,minmax(150px,1fr)) !important;
column-gap:38px !important;
padding-left:32px !important;
padding-right:32px !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:nth-child(4){
grid-column:2 / -1 !important;
}
}
/* 5) MOBILE */
@media(max-width:700px){
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:calc(100% - 32px) !important;
padding:46px 0 38px !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
font-size:34px !important;
line-height:1.02 !important;
}
body.home .orilom-guide-newsletter{
margin-top:29px !important;
padding-top:24px !important;
}
body.home .orilom-guide-newsletter-form{
grid-template-columns:1fr !important;
gap:8px !important;
}
body.home .orilom-guide-newsletter-form input[type="email"]{
border-right:1px solid #3c3c3c !important;
}
body.home .orilom-guide-newsletter-form button{width:100% !important;}
body.home .orilom-footer-trust{
grid-template-columns:1fr !important;
padding:12px 22px !important;
}
body.home .orilom-footer-trust article,
body.home .orilom-footer-trust article:first-child,
body.home .orilom-footer-trust article:last-child{
justify-content:flex-start !important;
min-height:70px !important;
padding:13px 0 !important;
border-right:0 !important;
border-bottom:1px solid rgba(255,255,255,.09) !important;
}
body.home .orilom-footer-trust article:last-child{border-bottom:0 !important;}
body.home .site-footer:not(.orilom-footer-v34){
grid-template-columns:1fr 1fr !important;
gap:30px 24px !important;
padding:38px 22px 20px !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:first-child,
body.home .site-footer:not(.orilom-footer-v34) .copyright{
grid-column:1 / -1 !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:nth-child(4){grid-column:auto !important;}
}
@media(max-width:460px){
body.home .lux-home-v5 .lux-auth-premium h2{font-size:30px !important;}
body.home .site-footer:not(.orilom-footer-v34){grid-template-columns:1fr !important;}
body.home .site-footer:not(.orilom-footer-v34) > div,
body.home .site-footer:not(.orilom-footer-v34) > div:first-child,
body.home .site-footer:not(.orilom-footer-v34) .copyright{grid-column:1 !important;}
}
/* =========================================================
ORILOM HOME — FOOTER PREMIUM V3 / UX 9.5
Compression + alignement + hiérarchie
Scope strict : Home uniquement
========================================================= */
/* Container commun : guide/newsletter, trustbar et footer */
body.home{
--orilom-footer-max:1180px;
--orilom-footer-gutter:24px;
--orilom-footer-edge:max(
var(--orilom-footer-gutter),
calc((100vw - var(--orilom-footer-max))/2)
);
}
/* 1) GUIDE : même impact premium, moins de vide vertical */
body.home .lux-home-v5 .lux-auth-premium{
margin-top:18px !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:min(var(--orilom-footer-max),calc(100% - 48px)) !important;
max-width:var(--orilom-footer-max) !important;
padding:38px 0 30px !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > span{
margin-bottom:9px !important;
font-size:7.5px !important;
letter-spacing:.30em !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
max-width:760px !important;
margin:8px auto 10px !important;
font-size:clamp(38px,3.5vw,46px) !important;
line-height:.98 !important;
letter-spacing:-.025em !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > p{
max-width:720px !important;
margin:0 auto !important;
font-size:10.5px !important;
line-height:1.55 !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a{
min-height:36px !important;
margin-top:12px !important;
padding:0 18px !important;
font-size:8.5px !important;
letter-spacing:.12em !important;
}
/* 2) NEWSLETTER : intégrée au guide, plus compacte et mieux alignée */
body.home .orilom-guide-newsletter{
width:100% !important;
max-width:var(--orilom-footer-max) !important;
margin:24px auto 0 !important;
padding:20px 0 0 !important;
grid-template-columns:minmax(250px,.9fr) minmax(390px,1.1fr) !important;
gap:34px !important;
border-top:1px solid rgba(255,255,255,.11) !important;
}
body.home .orilom-guide-newsletter-copy strong{
margin-bottom:4px !important;
font-size:18px !important;
line-height:1.12 !important;
}
body.home .orilom-guide-newsletter-copy small{
font-size:9.5px !important;
line-height:1.45 !important;
}
body.home .orilom-guide-newsletter-form input[type="email"],
body.home .orilom-guide-newsletter-form button{
height:40px !important;
min-height:40px !important;
}
body.home .orilom-guide-newsletter-form button{
padding:0 20px !important;
font-size:8px !important;
}
/* 3) TRUST STRIP : devient une vraie sous-barre du footer */
body.home .orilom-footer-trust{
padding:0 var(--orilom-footer-edge) !important;
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
background:#090909 !important;
border-top:1px solid rgba(255,255,255,.08) !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
}
body.home .orilom-footer-trust article{
min-height:78px !important;
padding:13px 28px !important;
justify-content:flex-start !important;
gap:12px !important;
}
body.home .orilom-footer-trust article:first-child{padding-left:0 !important;}
body.home .orilom-footer-trust article:last-child{padding-right:0 !important;}
body.home .orilom-footer-trust-icon{
width:28px !important;
min-width:28px !important;
height:28px !important;
font-size:12px !important;
border-color:rgba(216,179,0,.55) !important;
}
body.home .orilom-footer-trust h3{
margin-bottom:3px !important;
font-size:12.5px !important;
line-height:1.18 !important;
}
body.home .orilom-footer-trust p{
font-size:9px !important;
line-height:1.4 !important;
}
/* 4) FOOTER BAS : mêmes axes que la trustbar, moins de hauteur */
body.home .site-footer:not(.orilom-footer-v34){
padding:34px var(--orilom-footer-edge) 18px !important;
grid-template-columns:minmax(250px,1.35fr) repeat(3,minmax(135px,1fr)) !important;
column-gap:54px !important;
row-gap:18px !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand{
font-size:25px !important;
letter-spacing:.15em !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand small,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand small{
margin-top:7px !important;
font-size:7.5px !important;
}
body.home .site-footer:not(.orilom-footer-v34) h4{
margin-bottom:12px !important;
font-size:13px !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:not(:first-child){
gap:8px !important;
}
body.home .site-footer:not(.orilom-footer-v34) a{
font-size:11px !important;
line-height:1.4 !important;
}
body.home .site-footer:not(.orilom-footer-v34) p{
max-width:290px !important;
margin-top:9px !important;
font-size:9.5px !important;
line-height:1.5 !important;
}
body.home .site-footer:not(.orilom-footer-v34) .copyright{
margin-top:4px !important;
padding-top:14px !important;
font-size:9.5px !important;
line-height:1.45 !important;
border-top-color:rgba(255,255,255,.09) !important;
}
/* 5) Tablet : garder l'alignement commun sans écrasement */
@media(max-width:980px){
body.home{
--orilom-footer-gutter:28px;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:calc(100% - 56px) !important;
}
body.home .orilom-guide-newsletter{
grid-template-columns:1fr !important;
gap:14px !important;
text-align:center !important;
}
body.home .orilom-guide-newsletter-copy small{
max-width:420px !important;
margin:0 auto !important;
}
body.home .orilom-guide-newsletter-form{
width:min(560px,100%) !important;
margin:0 auto !important;
}
body.home .orilom-footer-trust article{
padding-left:18px !important;
padding-right:18px !important;
}
body.home .orilom-footer-trust article:first-child{padding-left:0 !important;}
body.home .orilom-footer-trust article:last-child{padding-right:0 !important;}
body.home .site-footer:not(.orilom-footer-v34){
grid-template-columns:minmax(220px,1.25fr) repeat(2,minmax(140px,1fr)) !important;
column-gap:34px !important;
}
}
/* 6) Mobile : densité premium, lisibilité et cibles tactiles */
@media(max-width:700px){
body.home{
--orilom-footer-gutter:22px;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:calc(100% - 44px) !important;
padding:34px 0 28px !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
margin:8px auto 9px !important;
font-size:32px !important;
line-height:1 !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > p{
font-size:10px !important;
}
body.home .orilom-guide-newsletter{
margin-top:21px !important;
padding-top:18px !important;
gap:13px !important;
}
body.home .orilom-guide-newsletter-copy strong{
font-size:18px !important;
}
body.home .orilom-guide-newsletter-form input[type="email"],
body.home .orilom-guide-newsletter-form button{
min-height:44px !important;
height:44px !important;
}
body.home .orilom-footer-trust{
grid-template-columns:1fr !important;
padding-left:var(--orilom-footer-edge) !important;
padding-right:var(--orilom-footer-edge) !important;
}
body.home .orilom-footer-trust article,
body.home .orilom-footer-trust article:first-child,
body.home .orilom-footer-trust article:last-child{
min-height:62px !important;
padding:11px 0 !important;
}
body.home .orilom-footer-trust-icon{
width:27px !important;
min-width:27px !important;
height:27px !important;
}
body.home .site-footer:not(.orilom-footer-v34){
grid-template-columns:1fr 1fr !important;
gap:24px 22px !important;
padding:30px var(--orilom-footer-edge) 16px !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div:first-child,
body.home .site-footer:not(.orilom-footer-v34) .copyright{
grid-column:1 / -1 !important;
}
}
@media(max-width:460px){
body.home{
--orilom-footer-gutter:18px;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:calc(100% - 36px) !important;
}
body.home .lux-home-v5 .lux-auth-premium h2{
font-size:29px !important;
}
body.home .site-footer:not(.orilom-footer-v34){
grid-template-columns:1fr !important;
gap:20px !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div,
body.home .site-footer:not(.orilom-footer-v34) > div:first-child,
body.home .site-footer:not(.orilom-footer-v34) .copyright{
grid-column:1 !important;
}
}
/* =========================================================
ORILOM HOME — FOOTER FUTURISTE LUXE V4
Amélioration visuelle uniquement. Aucun impact hors Home.
========================================================= */
/* A) Atmosphère futuriste très légère : noir profond + halos champagne */
body.home .lux-home-v5 .lux-auth-premium{
position:relative !important;
overflow:hidden !important;
isolation:isolate !important;
background:
radial-gradient(circle at 18% 12%, rgba(216,179,0,.085), transparent 24%),
radial-gradient(circle at 82% 6%, rgba(255,244,210,.05), transparent 22%),
radial-gradient(circle at 52% 120%, rgba(216,179,0,.055), transparent 34%),
linear-gradient(180deg,#090909 0%,#070707 100%) !important;
}
/* voile technologique presque invisible, sans image externe */
body.home .lux-home-v5 .lux-auth-premium::before{
content:"" !important;
display:block !important;
position:absolute !important;
inset:0 !important;
z-index:0 !important;
pointer-events:none !important;
opacity:.28 !important;
background-image:
linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px) !important;
background-size:44px 44px !important;
mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 82%) !important;
-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 82%) !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
position:relative !important;
z-index:2 !important;
}
/* B) titre + CTA : plus net, plus premium, pas plus gros */
body.home .lux-home-v5 .lux-auth-premium h2{
text-wrap:balance !important;
text-shadow:0 1px 0 rgba(255,255,255,.03),0 12px 34px rgba(0,0,0,.32) !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a{
position:relative !important;
overflow:hidden !important;
border-color:rgba(216,179,0,.82) !important;
background:linear-gradient(180deg,#ddb900,#cfa800) !important;
color:#090909 !important;
box-shadow:0 8px 24px rgba(216,179,0,.10) !important;
}
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a:hover{
background:#fff !important;
border-color:#fff !important;
color:#090909 !important;
}
/* C) newsletter : effet verre sombre très discret */
body.home .orilom-guide-newsletter{
position:relative !important;
padding:22px 0 2px !important;
}
body.home .orilom-guide-newsletter-form{
border:1px solid rgba(255,255,255,.10) !important;
background:rgba(255,255,255,.025) !important;
box-shadow:0 12px 38px rgba(0,0,0,.18) !important;
}
body.home .orilom-guide-newsletter-form input[type="email"]{
background:rgba(255,255,255,.025) !important;
border:0 !important;
border-right:1px solid rgba(255,255,255,.10) !important;
}
body.home .orilom-guide-newsletter-form button{
border:0 !important;
background:linear-gradient(180deg,#ddb900 0%,#caa500 100%) !important;
box-shadow:none !important;
}
body.home .orilom-guide-newsletter-form button:hover{
background:#fff !important;
}
/* D) trustbar : intégration continue, plus futuriste et plus compacte */
body.home .orilom-footer-trust{
position:relative !important;
overflow:hidden !important;
background:
linear-gradient(90deg,rgba(216,179,0,.025),transparent 22%,transparent 78%,rgba(216,179,0,.025)),
#080808 !important;
}
body.home .orilom-footer-trust::before{
content:"" !important;
position:absolute !important;
left:var(--orilom-footer-edge) !important;
right:var(--orilom-footer-edge) !important;
top:0 !important;
height:1px !important;
background:linear-gradient(90deg,transparent,rgba(216,179,0,.42),transparent) !important;
pointer-events:none !important;
}
body.home .orilom-footer-trust article{
min-height:70px !important;
position:relative !important;
}
body.home .orilom-footer-trust article:not(:last-child)::after{
content:"" !important;
position:absolute !important;
top:17px !important;
right:0 !important;
bottom:17px !important;
width:1px !important;
background:linear-gradient(to bottom,transparent,rgba(255,255,255,.13),transparent) !important;
}
body.home .orilom-footer-trust-icon{
border:1px solid rgba(216,179,0,.62) !important;
background:rgba(216,179,0,.035) !important;
box-shadow:inset 0 0 14px rgba(216,179,0,.035) !important;
}
body.home .orilom-footer-trust h3{
color:#f4f1e8 !important;
letter-spacing:-.01em !important;
}
body.home .orilom-footer-trust p{
color:#777 !important;
}
/* E) footer bas : structure plus nette, petite signature lumineuse */
body.home .site-footer:not(.orilom-footer-v34){
position:relative !important;
overflow:hidden !important;
background:
radial-gradient(circle at 12% 110%,rgba(216,179,0,.045),transparent 28%),
linear-gradient(180deg,#080808 0%,#060606 100%) !important;
}
body.home .site-footer:not(.orilom-footer-v34)::before{
content:"" !important;
position:absolute !important;
left:var(--orilom-footer-edge) !important;
right:var(--orilom-footer-edge) !important;
top:0 !important;
height:1px !important;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent) !important;
pointer-events:none !important;
}
body.home .site-footer:not(.orilom-footer-v34) > div{
position:relative !important;
z-index:1 !important;
}
body.home .site-footer:not(.orilom-footer-v34) .brand,
body.home .site-footer:not(.orilom-footer-v34) .lux-brand{
color:#e1bd19 !important;
text-shadow:0 0 24px rgba(216,179,0,.08) !important;
}
body.home .site-footer:not(.orilom-footer-v34) h4{
color:#f1eee6 !important;
letter-spacing:-.01em !important;
}
body.home .site-footer:not(.orilom-footer-v34) a{
position:relative !important;
width:max-content !important;
max-width:100% !important;
color:#d2d2d2 !important;
}
body.home .site-footer:not(.orilom-footer-v34) a::after{
content:"" !important;
position:absolute !important;
left:0 !important;
right:100% !important;
bottom:-3px !important;
height:1px !important;
background:#d8b300 !important;
transition:right .18s ease !important;
}
body.home .site-footer:not(.orilom-footer-v34) a:hover::after{right:0 !important;}
/* F) ligne légale : plus propre et moins lourde */
body.home .site-footer:not(.orilom-footer-v34) .copyright{
color:#666 !important;
border-top:1px solid rgba(255,255,255,.075) !important;
}
/* Responsive : préserver la lisibilité, supprimer les séparateurs verticaux */
@media(max-width:700px){
body.home .lux-home-v5 .lux-auth-premium::before{
background-size:34px 34px !important;
opacity:.18 !important;
}
body.home .orilom-guide-newsletter-form{
border:0 !important;
background:transparent !important;
box-shadow:none !important;
}
body.home .orilom-guide-newsletter-form input[type="email"]{
border:1px solid rgba(255,255,255,.11) !important;
}
body.home .orilom-footer-trust article::after{
display:none !important;
}
body.home .orilom-footer-trust article:not(:last-child){
border-bottom:1px solid rgba(255,255,255,.065) !important;
}
}
@media(prefers-reduced-motion:reduce){
body.home .site-footer:not(.orilom-footer-v34) a::after{transition:none !important;}
}
/* =========================================================
ORILOM — GLOBAL UI POLISH + HOME HERO LUXURY V6
Base conservée intégralement. Correctif ajouté en fin de fichier.
Objectif : hiérarchie plus premium, header plus fin, hero mieux équilibré,
réassurance compacte et transition produits plus directe.
========================================================= */
/* ---------- 1) HEADER GLOBAL : plus fin, plus premium ---------- */
.lux-header .lux-header-main{
min-height:92px !important;
padding-top:14px !important;
padding-bottom:14px !important;
}
.lux-header .lux-brands{
min-height:52px !important;
}
.lux-header .lux-search{
height:52px !important;
border-color:#e3dfd8 !important;
box-shadow:0 1px 0 rgba(0,0,0,.02) !important;
}
.lux-header .lux-search select{
color:#777 !important;
border-right-color:#ece8e1 !important;
}
.lux-header .lux-search input{
color:#222 !important;
}
.lux-header .lux-search input::placeholder{
color:#999 !important;
opacity:1 !important;
}
.lux-header .lux-nav ul{
min-height:54px !important;
}
.lux-header .lux-nav{
border-color:#efefef !important;
}
/* ---------- 2) HERO HOME : priorité à l'image / sculpture ---------- */
body.home .lux-home-v5 .lux-hero{
height:clamp(520px,31vw,590px) !important;
min-height:520px !important;
background-position:center center !important;
}
body.home .lux-home-v5 .lux-hero::after{
content:none !important;
display:none !important;
background:none !important;
opacity:0 !important;
pointer-events:none !important;
}
body.home .lux-home-v5 .lux-hero-copy{
right:6.2% !important;
top:50% !important;
width:min(440px,30vw) !important;
transform:translateY(-50%) !important;
text-align:center !important;
}
body.home .lux-home-v5 .lux-hero-copy > span{
display:block !important;
margin-bottom:12px !important;
color:#caa83a !important;
font-size:9px !important;
line-height:1.2 !important;
letter-spacing:.22em !important;
text-shadow:0 1px 10px rgba(255,255,255,.20) !important;
}
body.home .lux-home-v5 .lux-hero h1{
max-width:440px !important;
margin:0 auto 15px !important;
font-size:clamp(42px,3.35vw,58px) !important;
line-height:.98 !important;
letter-spacing:-.025em !important;
color:#fff !important;
text-shadow:0 3px 10px rgba(0,0,0,.42) !important;
text-wrap:balance !important;
}
body.home .lux-home-v5 .lux-hero-copy > p{
max-width:390px !important;
margin:0 auto !important;
color:rgba(255,255,255,.93) !important;
font-size:12px !important;
line-height:1.55 !important;
text-shadow:0 2px 6px rgba(0,0,0,.48) !important;
}
body.home .lux-home-v5 .lux-hero-copy > a{
min-height:44px !important;
margin-top:20px !important;
padding:0 27px !important;
border:1px solid #cda640 !important;
background:linear-gradient(180deg,#d5b15a 0%,#c69b3b 100%) !important;
color:#090909 !important;
font-size:10px !important;
font-weight:900 !important;
letter-spacing:.12em !important;
box-shadow:0 8px 24px rgba(0,0,0,.14) !important;
transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease !important;
}
body.home .lux-home-v5 .lux-hero-copy > a:hover,
body.home .lux-home-v5 .lux-hero-copy > a:focus-visible{
background:#111 !important;
border-color:#111 !important;
color:#fff !important;
box-shadow:0 10px 28px rgba(0,0,0,.22) !important;
}
/* ---------- 3) RÉASSURANCE : plus compacte, plus lisible ---------- */
body.home .lux-home-v5 > .lux-trust{
max-width:1180px !important;
margin:0 auto !important;
padding:20px 18px !important;
border-bottom:1px solid #eee !important;
box-shadow:0 12px 34px rgba(0,0,0,.025) !important;
}
body.home .lux-home-v5 > .lux-trust article{
min-height:50px !important;
gap:12px !important;
}
body.home .lux-home-v5 > .lux-trust article > b{
font-size:24px !important;
}
body.home .lux-home-v5 > .lux-trust h3{
margin-bottom:3px !important;
font-size:13px !important;
line-height:1.15 !important;
}
body.home .lux-home-v5 > .lux-trust p{
color:#767676 !important;
font-size:9.5px !important;
line-height:1.35 !important;
}
/* ---------- 4) TRANSITION PRODUITS : supprimer le grand vide ---------- */
body.home .lux-home-v5 .lux-product-section{
padding-top:56px !important;
}
body.home .lux-home-v5 .lux-product-section > header{
margin-bottom:34px !important;
}
body.home .lux-home-v5 .lux-product-section > header > span{
font-size:9px !important;
letter-spacing:.20em !important;
}
body.home .lux-home-v5 .lux-product-section > header h2{
margin-top:9px !important;
}
/* ---------- 5) TABLETTE ---------- */
@media(max-width:1100px){
.lux-header .lux-header-main{
min-height:86px !important;
}
body.home .lux-home-v5 .lux-hero{
height:540px !important;
min-height:540px !important;
}
body.home .lux-home-v5 .lux-hero-copy{
right:4.5% !important;
width:min(390px,38vw) !important;
}
body.home .lux-home-v5 .lux-hero h1{
font-size:clamp(38px,4.6vw,50px) !important;
}
}
/* ---------- 6) MOBILE : texte lisible sans masquer le visuel ---------- */
@media(max-width:780px){
.lux-header .lux-header-main{
min-height:76px !important;
padding:9px 16px !important;
}
.lux-header .lux-search{
height:46px !important;
}
body.home .lux-home-v5 .lux-hero{
min-height:560px !important;
height:auto !important;
background-position:56% center !important;
}
body.home .lux-home-v5 .lux-hero-copy{
position:absolute !important;
left:20px !important;
right:20px !important;
top:auto !important;
bottom:28px !important;
width:auto !important;
padding:22px 18px !important;
transform:none !important;
background:linear-gradient(180deg,rgba(10,10,10,.10),rgba(10,10,10,.58)) !important;
border:1px solid rgba(255,255,255,.16) !important;
backdrop-filter:blur(3px) !important;
}
body.home .lux-home-v5 .lux-hero h1{
max-width:520px !important;
font-size:clamp(36px,9.8vw,48px) !important;
line-height:1 !important;
}
body.home .lux-home-v5 .lux-hero-copy > p{
font-size:11px !important;
}
body.home .lux-home-v5 > .lux-trust{
grid-template-columns:1fr 1fr !important;
gap:0 !important;
padding:16px !important;
}
body.home .lux-home-v5 > .lux-trust article{
justify-content:flex-start !important;
padding:12px !important;
}
body.home .lux-home-v5 .lux-product-section{
padding-top:42px !important;
}
}
@media(max-width:480px){
body.home .lux-home-v5 .lux-hero{
min-height:530px !important;
}
body.home .lux-home-v5 .lux-hero-copy{
left:14px !important;
right:14px !important;
bottom:16px !important;
padding:18px 14px !important;
}
body.home .lux-home-v5 .lux-hero h1{
font-size:34px !important;
}
body.home .lux-home-v5 .lux-hero-copy > span{
font-size:8px !important;
}
body.home .lux-home-v5 > .lux-trust{
padding:10px 12px !important;
}
body.home .lux-home-v5 > .lux-trust h3{
font-size:11px !important;
}
body.home .lux-home-v5 > .lux-trust p{
font-size:8.5px !important;
}
}
@media(prefers-reduced-motion:reduce){
body.home .lux-home-v5 .lux-hero-copy > a{
transition:none !important;
}
}
/* =========================================================
ORILOM HOME V7 — PERFECTION HERO + HEADER
Final polish only. Keeps V6/account/shop/footer intact.
========================================================= */
/* HEADER — tighter luxury proportions */
@media (min-width:1101px){
.lux-header .lux-header-main{
max-width:1320px !important;
min-height:82px !important;
padding-top:11px !important;
padding-bottom:11px !important;
grid-template-columns:190px 165px minmax(320px,1fr) minmax(285px,320px) !important;
gap:12px !important;
}
.lux-header .lux-brand .custom-logo{max-height:58px !important;max-width:190px !important;}
.lux-header .lux-brands{min-height:48px !important;font-size:11px !important;letter-spacing:.045em !important;}
.lux-header .lux-search{height:48px !important;}
.lux-header .lux-search select{font-size:10px !important;padding-left:13px !important;padding-right:13px !important;}
.lux-header .lux-search input{font-size:11px !important;padding-left:15px !important;padding-right:15px !important;}
.lux-header .header-tools{gap:7px !important;}
.lux-header .header-tools > a{min-height:40px !important;padding-left:10px !important;padding-right:10px !important;font-size:10.5px !important;}
.lux-header .header-tools > .cart-link{min-width:104px !important;padding-left:13px !important;padding-right:15px !important;}
.lux-header .header-tools > a svg,
.lux-header .header-tools > a i{width:18px !important;height:18px !important;min-width:18px !important;font-size:18px !important;}
.lux-header .wishlist-count,.lux-header .cart-count{width:17px !important;min-width:17px !important;height:17px !important;min-height:17px !important;font-size:8px !important;top:-5px !important;}
.lux-header .lux-nav ul{min-height:44px !important;gap:38px !important;font-size:10.5px !important;}
.lux-header .lux-nav a{padding:2px 0 !important;}
}
/* HERO — preserve full campaign while reducing first-screen mass */
@media (min-width:1101px){
body.home .lux-home-v5 .lux-hero{
height:450px !important;
min-height:450px !important;
max-height:450px !important;
background-position:center center !important;
}
body.home .lux-home-v5 .lux-hero-copy{
right:5.4% !important;
width:min(420px,30vw) !important;
}
body.home .lux-home-v5 .lux-hero-copy > span{margin-bottom:10px !important;font-size:8.5px !important;}
body.home .lux-home-v5 .lux-hero h1{
max-width:420px !important;
margin:0 auto 12px !important;
font-size:clamp(42px,3.15vw,54px) !important;
line-height:.99 !important;
}
body.home .lux-home-v5 .lux-hero-copy > p{
max-width:385px !important;
font-size:11px !important;
line-height:1.5 !important;
}
body.home .lux-home-v5 .lux-hero-copy > a{
min-height:41px !important;
margin-top:14px !important;
padding:0 25px !important;
font-size:9px !important;
}
}
/* TRUST — keep visible but secondary to the campaign */
@media (min-width:781px){
body.home .lux-home-v5 > .lux-trust{
max-width:1120px !important;
padding:14px 12px !important;
}
body.home .lux-home-v5 > .lux-trust article{min-height:44px !important;gap:10px !important;}
body.home .lux-home-v5 > .lux-trust article > b{font-size:21px !important;}
body.home .lux-home-v5 > .lux-trust h3{font-size:12px !important;}
body.home .lux-home-v5 > .lux-trust p{font-size:8.5px !important;}
}
/* Bring catalogue into the visual journey sooner */
body.home .lux-home-v5 .lux-product-section{padding-top:46px !important;}
body.home .lux-home-v5 .lux-product-section > header{margin-bottom:30px !important;}
/* Mid-size desktops: avoid over-cropping and protect header search */
@media (min-width:1101px) and (max-width:1350px){
.lux-header .lux-header-main{
grid-template-columns:175px 150px minmax(280px,1fr) minmax(250px,285px) !important;
padding-left:18px !important;padding-right:18px !important;
}
.lux-header .lux-search{grid-template-columns:145px 1fr 48px !important;}
.lux-header .header-tools > a{padding-left:8px !important;padding-right:8px !important;}
body.home .lux-home-v5 .lux-hero-copy{right:4.5% !important;width:min(390px,31vw) !important;}
body.home .lux-home-v5 .lux-hero h1{font-size:clamp(40px,3.25vw,50px) !important;}
}
/* Tablet: V6 behavior retained, just slightly leaner */
@media (min-width:781px) and (max-width:1100px){
.lux-header .lux-header-main{min-height:80px !important;}
body.home .lux-home-v5 .lux-hero{height:500px !important;min-height:500px !important;}
body.home .lux-home-v5 .lux-product-section{padding-top:44px !important;}
}
/* =========================================================
ORILOM — NAVBAR LIVE SEARCH V2
Dropdown large, lisible, sans scroll horizontal.
========================================================= */
.lux-header .lux-search {
overflow: visible !important;
position: relative;
}
.lux-header .orilom-live-search-wrap {
position: relative;
min-width: 0;
height: 100%;
}
.lux-header .orilom-live-search-input {
width: 100%;
height: 100%;
}
/* Le panneau est volontairement plus large que l'input. */
.lux-header .orilom-live-search-results {
display: none;
position: absolute;
z-index: 100000;
top: calc(100% + 8px);
right: -48px;
left: auto;
width: 440px;
max-width: min(440px, calc(100vw - 24px));
max-height: min(560px, 68vh);
overflow-x: hidden !important;
overflow-y: auto;
overscroll-behavior: contain;
background: #fff;
border: 1px solid #e7e2d8;
border-radius: 12px;
box-shadow: 0 18px 45px rgba(0, 0, 0, .18);
scrollbar-width: thin;
}
.lux-header .orilom-live-search-results.is-open {
display: block;
}
.lux-header .orilom-live-search-item {
box-sizing: border-box;
display: grid;
grid-template-columns: 64px minmax(0, 1fr);
gap: 14px;
align-items: center;
width: 100%;
min-width: 0;
min-height: 82px;
padding: 9px 14px;
color: #111 !important;
text-decoration: none !important;
background: #fff;
border-bottom: 1px solid #f0ede7;
transition: background-color .15s ease;
}
.lux-header .orilom-live-search-item:last-child {
border-bottom: 0;
}
.lux-header .orilom-live-search-item:hover,
.lux-header .orilom-live-search-item:focus-visible {
background: #fbf8f1;
outline: none;
}
.lux-header .orilom-live-search-thumb {
width: 64px;
height: 64px;
display: flex;
align-items: center;
justify-content: center;
flex: 0 0 64px;
background: #fafafa;
border: 1px solid #f1eee8;
border-radius: 8px;
overflow: hidden;
}
.lux-header .orilom-live-search-thumb img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
}
.lux-header .orilom-live-search-content {
display: flex;
flex-direction: column;
justify-content: center;
min-width: 0;
max-width: 100%;
line-height: 1.3;
overflow: hidden;
}
.lux-header .orilom-live-search-content strong {
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: normal;
overflow-wrap: anywhere;
text-overflow: ellipsis;
font-size: 12.5px;
line-height: 1.35;
font-weight: 700;
color: #111;
}
.lux-header .orilom-live-search-content small {
display: block;
max-width: 100%;
margin-top: 6px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-size: 11.5px;
line-height: 1.25;
font-weight: 700;
color: #a37b22;
}
.lux-header .orilom-live-search-empty,
.lux-header .orilom-live-search-message {
box-sizing: border-box;
width: 100%;
padding: 18px;
font-size: 12px;
color: #666;
background: #fff;
}
@media (max-width: 780px) {
.lux-header .orilom-live-search-results {
position: fixed;
top: auto;
left: 12px;
right: 12px;
width: auto;
max-width: none;
max-height: 58vh;
border-radius: 12px;
}
.lux-header .orilom-live-search-item {
grid-template-columns: 58px minmax(0, 1fr);
min-height: 74px;
padding: 8px 11px;
gap: 11px;
}
.lux-header .orilom-live-search-thumb {
width: 58px;
height: 58px;
flex-basis: 58px;
}
}
@media (max-width: 480px) {
.lux-header .orilom-live-search-results {
left: 8px;
right: 8px;
}
}
/* =========================================================
ORILOM — MEGA MENU "NOS COLLECTIONS"
========================================================= */
.orilom-collections-menu{
position:relative;
z-index:9998;
}
.orilom-collections-trigger{
border:0;
cursor:pointer;
font:inherit;
}
.orilom-collections-panel{
position:absolute;
top:calc(100% + 8px);
left:0;
width:min(760px,calc(100vw - 32px));
max-height:min(68vh,620px);
padding:14px;
background:#fff;
border:1px solid rgba(0,0,0,.12);
box-shadow:0 16px 38px rgba(0,0,0,.16);
overflow:auto;
opacity:0;
visibility:hidden;
transform:translateY(8px);
transition:
opacity .16s ease,
transform .16s ease,
visibility .16s ease;
}
.orilom-collections-menu.is-open .orilom-collections-panel{
opacity:1;
visibility:visible;
transform:translateY(0);
}
.orilom-collections-shortcuts{
display:flex;
flex-wrap:wrap;
gap:7px;
padding-bottom:12px;
margin-bottom:12px;
border-bottom:1px solid #ececec;
}
.orilom-collections-shortcuts a{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:34px;
padding:7px 10px;
color:#111;
background:#fafafa;
border:1px solid #e7e7e7;
border-radius:4px;
font-size:10px;
line-height:1.1;
font-weight:700;
letter-spacing:.045em;
text-decoration:none;
}
.orilom-collections-shortcuts a:hover{
background:#111;
color:#fff;
border-color:#111;
}
.orilom-brands-heading{
display:flex;
align-items:center;
justify-content:space-between;
margin:0 0 10px;
}
.orilom-brands-heading strong{
color:#111;
font-size:11px;
letter-spacing:.08em;
}
.orilom-brands-heading span{
color:#777;
font-size:10px;
}
.orilom-brands-grid{
display:grid;
grid-template-columns:repeat(6,minmax(0,1fr));
gap:7px;
}
.orilom-brand-card{
display:flex;
align-items:center;
justify-content:center;
min-height:48px;
padding:8px 6px;
color:#151515;
background:#fff;
border:1px solid #e2e2e2;
border-radius:5px;
text-align:center;
text-decoration:none;
transition:
border-color .15s ease,
box-shadow .15s ease,
transform .15s ease;
}
.orilom-brand-card span{
display:block;
font-size:9px;
line-height:1.25;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
}
.orilom-brand-card:hover{
border-color:#b89a53;
box-shadow:0 4px 12px rgba(0,0,0,.08);
transform:translateY(-1px);
}
.orilom-brands-empty{
padding:18px;
color:#777;
background:#fafafa;
border:1px solid #eee;
text-align:center;
font-size:12px;
}
@media (min-width: 901px){
.orilom-collections-menu:hover .orilom-collections-panel,
.orilom-collections-menu:focus-within .orilom-collections-panel{
opacity:1;
visibility:visible;
transform:translateY(0);
}
}
@media (max-width: 1100px){
.orilom-brands-grid{
grid-template-columns:repeat(4,minmax(0,1fr));
}
}
@media (max-width: 720px){
.orilom-collections-panel{
position:fixed;
top:auto;
left:12px;
right:12px;
width:auto;
max-height:72vh;
}
.orilom-brands-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
/* =========================================================
ORILOM — APP BAR PREMIUM UI/UX V2
Modernisation header uniquement — logique inchangée
========================================================= */
.site-header.lux-header{
position:sticky !important;
top:0 !important;
z-index:9990 !important;
background:rgba(255,255,255,.96) !important;
backdrop-filter:saturate(160%) blur(18px);
-webkit-backdrop-filter:saturate(160%) blur(18px);
border-bottom:1px solid rgba(17,17,17,.06) !important;
transition:box-shadow .22s ease, border-color .22s ease, background-color .22s ease;
}
.site-header.lux-header.is-scrolled{
background:rgba(255,255,255,.985) !important;
border-bottom-color:rgba(17,17,17,.10) !important;
box-shadow:0 10px 34px rgba(15,15,15,.075) !important;
}
.lux-topline{
min-height:34px !important;
padding:9px 20px !important;
background:#f7f7f5 !important;
border-bottom:1px solid #ededeb;
color:#4a4a46 !important;
font-size:10.5px !important;
line-height:1.35;
font-weight:650 !important;
letter-spacing:.035em;
}
.lux-header-main{
max-width:1500px !important;
min-height:88px !important;
padding:13px 2.2vw !important;
grid-template-columns:205px 175px minmax(360px,1fr) auto !important;
gap:14px !important;
}
.lux-brand .custom-logo{
max-width:190px !important;
max-height:62px !important;
}
.lux-brand strong{
font-size:29px !important;
}
.orilom-collections-menu{
min-width:0;
}
.lux-brands.orilom-collections-trigger{
width:100%;
min-height:52px !important;
padding:0 15px;
gap:10px !important;
border:1px solid #111 !important;
border-radius:10px;
background:#0c0c0c !important;
box-shadow:0 6px 18px rgba(0,0,0,.09);
transition:transform .16s ease, background-color .16s ease, box-shadow .16s ease;
}
.lux-brands.orilom-collections-trigger:hover,
.orilom-collections-menu.is-open .lux-brands.orilom-collections-trigger{
background:#1a1a1a !important;
transform:translateY(-1px);
box-shadow:0 8px 22px rgba(0,0,0,.13);
}
.orilom-collections-trigger-icon{
width:18px;
height:18px;
display:inline-flex;
align-items:center;
justify-content:center;
}
.orilom-collections-trigger-icon svg,
.orilom-collections-chevron{
display:block;
width:18px;
height:18px;
fill:none;
stroke:currentColor;
stroke-width:1.8;
stroke-linecap:round;
stroke-linejoin:round;
}
.orilom-collections-chevron{
width:14px;
height:14px;
margin-left:auto;
opacity:.75;
transition:transform .18s ease;
}
.orilom-collections-menu.is-open .orilom-collections-chevron{
transform:rotate(180deg);
}
.lux-search{
height:52px !important;
grid-template-columns:165px minmax(0,1fr) 52px !important;
border:1px solid #dededb !important;
border-radius:12px !important;
overflow:visible !important;
background:#fbfbfa !important;
box-shadow:0 2px 10px rgba(0,0,0,.025);
transition:border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.lux-search:focus-within{
border-color:#b99a45 !important;
background:#fff !important;
box-shadow:0 0 0 3px rgba(223,185,19,.10),0 8px 22px rgba(0,0,0,.045);
}
.lux-search select{
border-right:1px solid #e8e8e5 !important;
padding:0 14px !important;
color:#555 !important;
font-size:10.5px !important;
font-weight:650;
background:#f8f8f6 !important;
border-radius:12px 0 0 12px;
cursor:pointer;
}
.orilom-live-search-wrap{
min-width:0;
position:relative;
}
.lux-search .orilom-live-search-input{
width:100%;
height:100%;
padding:0 16px !important;
color:#1b1b1b;
font-size:12px !important;
}
.lux-search .orilom-live-search-input::placeholder{
color:#94948f;
opacity:1;
}
.lux-search .orilom-search-submit{
width:52px;
height:50px;
display:flex;
align-items:center;
justify-content:center;
border-left:1px solid #e8e8e5 !important;
border-radius:0 11px 11px 0;
color:#161616;
background:#fff !important;
cursor:pointer;
transition:background-color .15s ease, color .15s ease;
}
.lux-search .orilom-search-submit:hover{
background:#111 !important;
color:#fff;
}
.lux-search .orilom-search-submit svg{
width:19px;
height:19px;
fill:none;
stroke:currentColor;
stroke-width:1.8;
stroke-linecap:round;
}
.lux-header .header-tools{
min-width:0 !important;
display:flex !important;
justify-content:flex-end !important;
align-items:center;
gap:5px !important;
font-size:inherit !important;
}
.lux-header .header-tools > a.orilom-header-action{
position:relative;
width:auto !important;
min-width:58px !important;
height:52px !important;
min-height:52px !important;
padding:6px 9px !important;
display:flex !important;
flex-direction:column;
align-items:center !important;
justify-content:center !important;
gap:3px;
border:1px solid transparent;
border-radius:10px;
color:#181818 !important;
background:transparent !important;
transition:background-color .15s ease,border-color .15s ease,transform .15s ease;
}
.lux-header .header-tools > a.orilom-header-action:hover{
background:#f7f7f5 !important;
border-color:#e7e7e3;
transform:translateY(-1px);
}
.orilom-header-action-icon{
width:21px;
height:21px;
display:flex;
align-items:center;
justify-content:center;
}
.orilom-header-action-icon svg{
width:21px !important;
height:21px !important;
display:block;
fill:none;
stroke:currentColor;
stroke-width:1.7 !important;
stroke-linecap:round;
stroke-linejoin:round;
}
.orilom-header-action-label{
display:block;
color:#4f4f4a;
font-size:8.5px;
line-height:1;
font-weight:700;
letter-spacing:.035em;
}
.lux-header .wishlist-count,
.lux-header .cart-count{
top:3px !important;
right:5px !important;
width:auto !important;
min-width:16px !important;
height:16px !important;
padding:0 4px;
display:flex !important;
align-items:center;
justify-content:center;
border:2px solid #fff;
border-radius:999px !important;
background:var(--lux-gold) !important;
color:#111 !important;
font-size:8px !important;
line-height:1 !important;
font-weight:850 !important;
box-shadow:none !important;
}
.lux-nav{
border-top:1px solid #f0f0ed !important;
border-bottom:1px solid #ededeb !important;
padding:0 18px !important;
}
.lux-nav ul{
min-height:48px !important;
gap:34px !important;
font-size:10.5px !important;
letter-spacing:.045em;
}
.lux-nav a{
position:relative;
padding:16px 0;
transition:color .15s ease;
}
.lux-nav a::after{
content:"";
position:absolute;
left:50%;
right:50%;
bottom:10px;
height:1px;
background:var(--lux-gold-dark);
transition:left .18s ease,right .18s ease;
}
.lux-nav a:hover::after,
.lux-nav .current-menu-item > a::after,
.lux-nav .current_page_item > a::after{
left:0;
right:0;
}
/* Mega-menu : plus propre et plus proche d'une app-bar premium */
.orilom-collections-panel{
top:calc(100% + 10px) !important;
width:min(820px,calc(100vw - 28px)) !important;
padding:16px !important;
border:1px solid #e2e2df !important;
border-radius:14px;
box-shadow:0 24px 60px rgba(0,0,0,.16) !important;
}
.orilom-collections-shortcuts{
gap:8px !important;
}
.orilom-collections-shortcuts a{
min-height:36px !important;
border-radius:8px !important;
background:#f8f8f6 !important;
}
.orilom-collections-shortcuts a:hover{
background:#111 !important;
}
.orilom-brand-card{
min-height:52px !important;
border-radius:8px !important;
}
.orilom-brand-card:hover{
border-color:var(--lux-gold-dark) !important;
}
/* Accessibilité clavier */
.lux-header a:focus-visible,
.lux-header button:focus-visible,
.lux-header select:focus-visible,
.lux-header input:focus-visible{
outline:2px solid var(--lux-gold-dark) !important;
outline-offset:2px;
}
@media(max-width:1200px){
.lux-header-main{
grid-template-columns:185px 160px minmax(280px,1fr) auto !important;
}
.orilom-header-action-label{
display:none;
}
.lux-header .header-tools > a.orilom-header-action{
min-width:44px !important;
width:44px !important;
}
}
@media(max-width:1100px){
.lux-header-main{
grid-template-columns:175px minmax(0,1fr) auto !important;
}
.orilom-collections-menu{
display:none !important;
}
}
@media(max-width:780px){
.site-header.lux-header{
position:sticky !important;
}
.lux-header-main{
min-height:70px !important;
grid-template-columns:46px minmax(0,1fr) auto !important;
padding:9px 14px 10px !important;
gap:8px !important;
}
.lux-header .menu-toggle{
width:42px;
height:42px;
display:flex !important;
align-items:center;
justify-content:center;
border:1px solid #e6e6e2;
border-radius:10px;
color:#151515;
background:#fff;
}
.lux-header .menu-toggle svg{
width:20px;
height:20px;
fill:none;
stroke:currentColor;
stroke-width:1.8;
stroke-linecap:round;
}
.lux-brand .custom-logo{
max-width:145px !important;
max-height:48px !important;
}
.lux-brand strong{
font-size:24px !important;
}
.lux-search{
grid-column:1/-1 !important;
grid-row:2 !important;
height:46px !important;
grid-template-columns:125px minmax(0,1fr) 46px !important;
border-radius:11px !important;
}
.lux-search .orilom-search-submit{
width:46px;
height:44px;
}
.lux-header .header-tools{
gap:2px !important;
}
.lux-header .header-tools > a.orilom-header-action{
min-width:40px !important;
width:40px !important;
height:42px !important;
min-height:42px !important;
padding:0 !important;
}
.orilom-header-action-icon,
.orilom-header-action-icon svg{
width:20px !important;
height:20px !important;
}
.lux-header .wishlist-count,
.lux-header .cart-count{
top:1px !important;
right:1px !important;
}
.lux-nav{
padding:0 14px !important;
}
.lux-nav ul{
gap:0 !important;
}
}
@media(max-width:520px){
.lux-topline{
min-height:30px !important;
padding:7px 12px !important;
font-size:9px !important;
}
.lux-search{
grid-template-columns:minmax(0,1fr) 46px !important;
}
.lux-search select{
display:none !important;
}
.lux-header .header-tools > .orilom-account-action{
display:none !important;
}
}
@media(prefers-reduced-motion:reduce){
.site-header.lux-header,
.lux-brands.orilom-collections-trigger,
.orilom-collections-chevron,
.lux-header .header-tools > a.orilom-header-action,
.lux-nav a::after{
transition:none !important;
}
}
/* =========================================================
ORILOM — HEADER ACTIONS CONSISTENCY FIX V3
Favoris / Panier / Compte + recherche + select catégorie
========================================================= */
/* --- Recherche : un seul bloc continu, sans trait parasite --- */
.lux-search{
overflow:hidden !important;
border:1px solid #dededb !important;
border-radius:11px !important;
background:#fff !important;
}
.lux-search select,
.lux-search input,
.lux-search button,
.lux-search .orilom-live-search-wrap{
margin:0 !important;
box-shadow:none !important;
outline:0 !important;
}
.lux-search select{
height:50px !important;
min-height:50px !important;
border:0 !important;
border-right:1px solid #ecebe7 !important;
border-bottom:0 !important;
border-radius:10px 0 0 10px !important;
background:#fafaf8 !important;
color:#575753 !important;
text-decoration:none !important;
appearance:auto;
}
.lux-search select:hover,
.lux-search select:focus{
border-bottom:0 !important;
box-shadow:none !important;
text-decoration:none !important;
}
.lux-search .orilom-live-search-wrap{
height:50px !important;
border:0 !important;
border-bottom:0 !important;
background:#fff !important;
}
.lux-search .orilom-live-search-input{
height:50px !important;
min-height:50px !important;
border:0 !important;
border-bottom:0 !important;
background:#fff !important;
box-shadow:none !important;
}
.lux-search .orilom-live-search-input:focus{
border:0 !important;
border-bottom:0 !important;
box-shadow:none !important;
}
/* Supprime tout pseudo-trait provenant d'un ancien thème */
.lux-search select::before,
.lux-search select::after,
.lux-search .orilom-live-search-wrap::before,
.lux-search .orilom-live-search-wrap::after{
content:none !important;
display:none !important;
}
/* --- Bouton chercher : compact, net et cohérent --- */
.lux-search .orilom-search-submit{
width:52px !important;
min-width:52px !important;
height:50px !important;
min-height:50px !important;
padding:0 !important;
border:0 !important;
border-left:1px solid #ecebe7 !important;
border-radius:0 10px 10px 0 !important;
background:#fff !important;
color:#151515 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
box-shadow:none !important;
transition:background-color .16s ease,color .16s ease,border-color .16s ease !important;
}
.lux-search .orilom-search-submit:hover,
.lux-search .orilom-search-submit:focus{
background:#111 !important;
color:#fff !important;
border-left-color:#111 !important;
}
.lux-search .orilom-search-submit svg{
width:18px !important;
height:18px !important;
stroke-width:1.85 !important;
}
/* --- Actions : même silhouette pour les 3 éléments --- */
.lux-header .header-tools{
display:grid !important;
grid-template-columns:repeat(3,64px) !important;
align-items:center !important;
justify-content:end !important;
gap:4px !important;
min-width:200px !important;
}
.lux-header .header-tools > a.orilom-header-action,
.lux-header .header-tools > a.wishlist-link,
.lux-header .header-tools > a.cart-link{
position:relative !important;
width:64px !important;
min-width:64px !important;
height:52px !important;
min-height:52px !important;
padding:5px 4px !important;
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
gap:4px !important;
border:1px solid transparent !important;
border-radius:9px !important;
background:transparent !important;
color:#151515 !important;
box-shadow:none !important;
font-size:inherit !important;
line-height:1 !important;
text-decoration:none !important;
transition:
background-color .16s ease,
border-color .16s ease,
transform .16s ease !important;
}
/* Retire le gros contour "pilule" du panier venant d'anciens styles */
.lux-header .header-tools > a.cart-link{
border-color:transparent !important;
border-radius:9px !important;
background:transparent !important;
box-shadow:none !important;
}
.lux-header .header-tools > a.orilom-header-action:hover,
.lux-header .header-tools > a.wishlist-link:hover,
.lux-header .header-tools > a.cart-link:hover{
background:#f7f7f5 !important;
border-color:#e8e8e3 !important;
transform:translateY(-1px) !important;
}
.lux-header .orilom-header-action-icon{
width:20px !important;
height:20px !important;
flex:0 0 20px !important;
}
.lux-header .orilom-header-action-icon svg{
display:block !important;
width:20px !important;
height:20px !important;
min-width:20px !important;
min-height:20px !important;
fill:none !important;
stroke:currentColor !important;
stroke-width:1.65 !important;
}
.lux-header .orilom-header-action-label{
display:block !important;
max-width:58px !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
white-space:nowrap !important;
color:#33332f !important;
font-size:8px !important;
line-height:1 !important;
font-weight:700 !important;
letter-spacing:.015em !important;
text-align:center !important;
}
/* Badges : même position et taille */
.lux-header .wishlist-count,
.lux-header .cart-count{
position:absolute !important;
top:1px !important;
right:8px !important;
min-width:15px !important;
width:auto !important;
height:15px !important;
padding:0 3px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
border:1.5px solid #fff !important;
border-radius:999px !important;
background:var(--lux-gold) !important;
color:#111 !important;
font-size:7.5px !important;
line-height:1 !important;
font-weight:800 !important;
box-shadow:none !important;
}
/* Le compte ne doit pas devenir un grand bouton texte */
.lux-header .header-tools > .orilom-account-action{
width:64px !important;
min-width:64px !important;
}
/* neutralise d'anciens ::before/::after ou libellés injectés */
.lux-header .header-tools > a.orilom-header-action::before,
.lux-header .header-tools > a.orilom-header-action::after,
.lux-header .header-tools > a.wishlist-link::before,
.lux-header .header-tools > a.wishlist-link::after,
.lux-header .header-tools > a.cart-link::before,
.lux-header .header-tools > a.cart-link::after{
box-shadow:none !important;
}
/* --- Desktop intermédiaire : on garde les 3 actions identiques --- */
@media (max-width:1250px) and (min-width:1101px){
.lux-header .header-tools{
grid-template-columns:repeat(3,48px) !important;
min-width:148px !important;
}
.lux-header .header-tools > a.orilom-header-action,
.lux-header .header-tools > a.wishlist-link,
.lux-header .header-tools > a.cart-link,
.lux-header .header-tools > .orilom-account-action{
width:48px !important;
min-width:48px !important;
}
.lux-header .orilom-header-action-label{
display:none !important;
}
}
/* --- Mobile : icônes simples et propres --- */
@media(max-width:780px){
.lux-header .header-tools{
grid-template-columns:repeat(3,40px) !important;
min-width:auto !important;
gap:1px !important;
}
.lux-header .header-tools > a.orilom-header-action,
.lux-header .header-tools > a.wishlist-link,
.lux-header .header-tools > a.cart-link,
.lux-header .header-tools > .orilom-account-action{
width:40px !important;
min-width:40px !important;
height:40px !important;
min-height:40px !important;
padding:0 !important;
border-radius:8px !important;
}
.lux-header .orilom-header-action-label{
display:none !important;
}
.lux-header .wishlist-count,
.lux-header .cart-count{
top:0 !important;
right:1px !important;
}
}
@media(max-width:520px){
.lux-header .header-tools{
grid-template-columns:repeat(2,40px) !important;
}
.lux-header .header-tools > .orilom-account-action{
display:none !important;
}
}
/* =========================================================
ORILOM — APP BAR FINAL BALANCE V4
Corrige les anciens conflits Account V10/V11/V12
et rééquilibre Logo / Collections / Recherche / Actions.
========================================================= */
/* 1) LARGEUR & PROPORTIONS DU HEADER */
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
width:100% !important;
max-width:1440px !important;
min-height:84px !important;
margin:0 auto !important;
padding:12px 24px !important;
display:grid !important;
grid-template-columns:
190px
165px
minmax(430px,1fr)
250px !important;
gap:14px !important;
align-items:center !important;
}
/* Logo : présent mais pas surdimensionné */
body .lux-header .lux-brand{
min-width:0 !important;
}
body .lux-header .lux-brand .custom-logo{
max-width:175px !important;
max-height:58px !important;
}
body .lux-header .lux-brand strong{
font-size:28px !important;
}
/* 2) COLLECTIONS */
body .lux-header .orilom-collections-menu{
width:165px !important;
min-width:165px !important;
}
body .lux-header .lux-brands.orilom-collections-trigger{
width:165px !important;
min-width:165px !important;
height:50px !important;
min-height:50px !important;
padding:0 13px !important;
border-radius:9px !important;
font-size:10px !important;
line-height:1.05 !important;
letter-spacing:.025em !important;
}
/* 3) RECHERCHE — c'est l'élément principal */
body .lux-header .lux-search{
width:100% !important;
min-width:0 !important;
height:50px !important;
display:grid !important;
grid-template-columns:145px minmax(220px,1fr) 50px !important;
border:1px solid #deded9 !important;
border-radius:9px !important;
overflow:hidden !important;
background:#fff !important;
box-shadow:none !important;
}
body .lux-header .lux-search:focus-within{
border-color:#c6a73f !important;
box-shadow:0 0 0 3px rgba(223,185,19,.09) !important;
}
/* Catégorie : aucune ligne basse / aucun effet input parasite */
body .lux-header .lux-search select.orilom-header-category{
width:100% !important;
height:48px !important;
min-height:48px !important;
margin:0 !important;
padding:0 30px 0 13px !important;
border:0 !important;
border-right:1px solid #e9e9e5 !important;
border-bottom:0 !important;
border-radius:0 !important;
background-color:#fafaf8 !important;
color:#555 !important;
box-shadow:none !important;
outline:0 !important;
text-decoration:none !important;
font-size:10px !important;
font-weight:600 !important;
}
body .lux-header .lux-search .orilom-live-search-wrap,
body .lux-header .lux-search .orilom-live-search-input{
height:48px !important;
min-height:48px !important;
border:0 !important;
border-bottom:0 !important;
border-radius:0 !important;
box-shadow:none !important;
background:#fff !important;
}
body .lux-header .lux-search .orilom-live-search-input{
padding:0 15px !important;
font-size:11px !important;
}
body .lux-header .lux-search .orilom-search-submit{
width:50px !important;
min-width:50px !important;
height:48px !important;
min-height:48px !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
border-left:1px solid #e9e9e5 !important;
border-radius:0 !important;
background:#fff !important;
color:#111 !important;
box-shadow:none !important;
}
body .lux-header .lux-search .orilom-search-submit:hover{
background:#111 !important;
color:#fff !important;
}
body .lux-header .lux-search .orilom-search-submit svg{
width:17px !important;
height:17px !important;
}
/* 4) ACTIONS — Favoris | Panier | Mon compte */
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:250px !important;
min-width:250px !important;
max-width:250px !important;
display:grid !important;
grid-template-columns:60px 60px minmax(118px,1fr) !important;
gap:5px !important;
justify-content:end !important;
align-items:center !important;
margin:0 !important;
padding:0 !important;
}
/* Favoris + panier : deux actions jumelles */
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link,
body .lux-header .header-tools > a.orilom-header-action.wishlist-link,
body .lux-header .header-tools > a.orilom-header-action.cart-link{
position:relative !important;
width:60px !important;
min-width:60px !important;
max-width:60px !important;
height:50px !important;
min-height:50px !important;
margin:0 !important;
padding:5px 3px !important;
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
gap:4px !important;
border:1px solid transparent !important;
border-radius:9px !important;
background:transparent !important;
color:#111 !important;
box-shadow:none !important;
text-decoration:none !important;
}
body .lux-header .header-tools > a.wishlist-link:hover,
body .lux-header .header-tools > a.cart-link:hover{
background:#f7f7f5 !important;
border-color:#e9e9e4 !important;
}
/* Icône + petit label identiques */
body .lux-header .header-tools .orilom-header-action-icon{
width:19px !important;
height:19px !important;
flex:0 0 19px !important;
}
body .lux-header .header-tools .orilom-header-action-icon svg{
width:19px !important;
height:19px !important;
min-width:19px !important;
min-height:19px !important;
stroke-width:1.65 !important;
}
body .lux-header .header-tools .orilom-header-action-label{
display:block !important;
width:auto !important;
max-width:56px !important;
color:#252525 !important;
font-size:8px !important;
line-height:1 !important;
font-weight:700 !important;
overflow:hidden !important;
white-space:nowrap !important;
text-overflow:ellipsis !important;
}
/* Compteurs */
body .lux-header .wishlist-count,
body .lux-header .cart-count{
position:absolute !important;
top:1px !important;
right:7px !important;
min-width:14px !important;
width:auto !important;
height:14px !important;
padding:0 3px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
border:1.5px solid #fff !important;
border-radius:999px !important;
background:var(--lux-gold) !important;
color:#111 !important;
font-size:7px !important;
font-weight:800 !important;
line-height:1 !important;
box-shadow:none !important;
}
/*
* COMPTE :
* couvre le header.php récent ET l'ancien wrapper/dropdown
* déjà présent sur certaines versions ORILOM.
*/
body .lux-header .header-tools > a.orilom-account-action,
body .lux-header .header-tools .orilom-account-menu,
body.logged-in .lux-header .header-tools .orilom-account-menu,
body:not(.logged-in) .lux-header .header-tools .orilom-account-menu{
width:118px !important;
min-width:118px !important;
max-width:118px !important;
height:50px !important;
min-height:50px !important;
margin:0 !important;
padding:0 !important;
}
body .lux-header .header-tools > a.orilom-account-action{
display:flex !important;
flex-direction:row !important;
align-items:center !important;
justify-content:center !important;
gap:7px !important;
border:1px solid transparent !important;
border-radius:9px !important;
background:transparent !important;
color:#111 !important;
}
body .lux-header .header-tools > a.orilom-account-action .orilom-header-action-label{
max-width:none !important;
font-size:9px !important;
}
/* Ancien trigger "Mon compte ▾" : neutralise les gros styles V10/V11/V12 */
body .lux-header .header-tools .orilom-account-menu > a.orilom-account-link,
body.logged-in .lux-header .header-tools .orilom-account-menu > a.orilom-account-link,
body:not(.logged-in) .lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
width:118px !important;
min-width:118px !important;
max-width:118px !important;
height:50px !important;
min-height:50px !important;
margin:0 !important;
padding:0 24px 0 10px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:6px !important;
border:1px solid transparent !important;
border-radius:9px !important;
background:transparent !important;
color:#111 !important;
font-size:9px !important;
font-weight:700 !important;
line-height:1 !important;
box-shadow:none !important;
}
body .lux-header .header-tools .orilom-account-menu > a.orilom-account-link:hover{
background:#f7f7f5 !important;
border-color:#e9e9e4 !important;
}
/* Si les anciennes règles injectent "Mon compte", on le garde propre */
body.logged-in .lux-header .header-tools .orilom-account-menu > a.orilom-account-link::after{
content:"Mon compte" !important;
display:inline-block !important;
font-size:9px !important;
font-weight:700 !important;
line-height:1 !important;
white-space:nowrap !important;
}
/* Pas de texte dupliqué sur notre nouveau lien compte */
body .lux-header .header-tools > a.orilom-account-action::after{
content:none !important;
display:none !important;
}
/* 5) NAVIGATION SOUS LE HEADER : plus fine */
body .lux-header .lux-nav{
padding:0 20px !important;
border-top:1px solid #f1f1ee !important;
border-bottom:1px solid #ecece8 !important;
}
body .lux-header .lux-nav ul{
min-height:44px !important;
gap:30px !important;
font-size:10px !important;
}
/* 6) DESKTOP MOYEN */
@media(max-width:1280px) and (min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:
175px
155px
minmax(330px,1fr)
218px !important;
padding-left:18px !important;
padding-right:18px !important;
gap:10px !important;
}
body .lux-header .orilom-collections-menu,
body .lux-header .lux-brands.orilom-collections-trigger{
width:155px !important;
min-width:155px !important;
}
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:218px !important;
min-width:218px !important;
max-width:218px !important;
grid-template-columns:48px 48px 112px !important;
}
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link{
width:48px !important;
min-width:48px !important;
max-width:48px !important;
}
body .lux-header .header-tools .orilom-account-menu,
body .lux-header .header-tools > a.orilom-account-action,
body .lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
width:112px !important;
min-width:112px !important;
max-width:112px !important;
}
body .lux-header .header-tools > a.wishlist-link .orilom-header-action-label,
body .lux-header .header-tools > a.cart-link .orilom-header-action-label{
display:none !important;
}
}
/* 7) TABLETTE */
@media(max-width:1100px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:170px minmax(280px,1fr) 138px !important;
gap:10px !important;
}
body .lux-header .orilom-collections-menu{
display:none !important;
}
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:138px !important;
min-width:138px !important;
max-width:138px !important;
grid-template-columns:44px 44px 44px !important;
gap:2px !important;
}
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link,
body .lux-header .header-tools > a.orilom-account-action,
body .lux-header .header-tools .orilom-account-menu,
body .lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
width:44px !important;
min-width:44px !important;
max-width:44px !important;
}
body .lux-header .header-tools .orilom-header-action-label,
body.logged-in .lux-header .header-tools .orilom-account-menu > a.orilom-account-link::after{
display:none !important;
content:none !important;
}
}
/* 8) MOBILE */
@media(max-width:780px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
min-height:68px !important;
padding:9px 12px !important;
grid-template-columns:42px minmax(110px,1fr) 86px !important;
grid-template-rows:auto auto !important;
gap:8px !important;
}
body .lux-header .lux-search{
grid-column:1/-1 !important;
grid-row:2 !important;
height:46px !important;
grid-template-columns:110px minmax(0,1fr) 46px !important;
}
body .lux-header .lux-search select.orilom-header-category,
body .lux-header .lux-search .orilom-live-search-wrap,
body .lux-header .lux-search .orilom-live-search-input,
body .lux-header .lux-search .orilom-search-submit{
height:44px !important;
min-height:44px !important;
}
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:86px !important;
min-width:86px !important;
max-width:86px !important;
grid-template-columns:42px 42px !important;
gap:2px !important;
}
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link{
width:42px !important;
min-width:42px !important;
max-width:42px !important;
height:42px !important;
min-height:42px !important;
}
/* Compte accessible via menu mobile à cette largeur */
body .lux-header .header-tools > a.orilom-account-action,
body .lux-header .header-tools .orilom-account-menu{
display:none !important;
}
}
@media(max-width:520px){
body .lux-header .lux-search{
grid-template-columns:minmax(0,1fr) 46px !important;
}
body .lux-header .lux-search select.orilom-header-category{
display:none !important;
}
}
/* =========================================================
ORILOM — APP BAR CLEAN + LIVE SEARCH RESTORE V5
- restaure le dropdown de recherche automatique
- réduit l'encombrement du header
- actions desktop en icônes compactes
- neutralise les anciens doublons "Mon compte"
========================================================= */
/* ---------------------------------------------------------
1. LIVE SEARCH — IMPORTANT : ne jamais clipper le dropdown
--------------------------------------------------------- */
body .lux-header .lux-search{
position:relative !important;
overflow:visible !important;
}
/* Le champ conserve visuellement son arrondi sans couper le panneau */
body .lux-header .lux-search > select.orilom-header-category{
border-radius:8px 0 0 8px !important;
}
body .lux-header .lux-search .orilom-search-submit{
border-radius:0 8px 8px 0 !important;
}
/* Le wrapper doit laisser sortir les résultats */
body .lux-header .orilom-live-search-wrap{
position:relative !important;
overflow:visible !important;
z-index:30 !important;
}
/* Restauration explicite du dropdown dynamique */
body .lux-header .orilom-live-search-results{
position:absolute !important;
z-index:1000000 !important;
top:calc(100% + 9px) !important;
left:0 !important;
right:auto !important;
width:min(500px,calc(100vw - 30px)) !important;
max-width:500px !important;
max-height:min(560px,68vh) !important;
overflow-x:hidden !important;
overflow-y:auto !important;
background:#fff !important;
border:1px solid #e5e2dc !important;
border-radius:12px !important;
box-shadow:0 20px 48px rgba(0,0,0,.16) !important;
}
body .lux-header .orilom-live-search-results.is-open{
display:block !important;
}
/* ---------------------------------------------------------
2. APP BAR DESKTOP — proportions plus aérées
--------------------------------------------------------- */
@media(min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
width:100% !important;
max-width:1460px !important;
min-height:76px !important;
margin:0 auto !important;
padding:10px 22px !important;
display:grid !important;
grid-template-columns:
180px
150px
minmax(470px,1fr)
132px !important;
gap:12px !important;
align-items:center !important;
}
/* Logo légèrement plus compact */
body .lux-header .lux-brand .custom-logo{
max-width:165px !important;
max-height:54px !important;
}
body .lux-header .lux-brand strong{
font-size:27px !important;
}
/* Collections : moins massif */
body .lux-header .orilom-collections-menu,
body .lux-header .lux-brands.orilom-collections-trigger{
width:150px !important;
min-width:150px !important;
}
body .lux-header .lux-brands.orilom-collections-trigger{
height:46px !important;
min-height:46px !important;
padding:0 11px !important;
border-radius:8px !important;
font-size:9px !important;
letter-spacing:.02em !important;
}
body .lux-header .orilom-collections-trigger-icon{
width:16px !important;
height:16px !important;
}
/* Recherche = élément dominant */
body .lux-header .lux-search{
height:46px !important;
grid-template-columns:125px minmax(300px,1fr) 46px !important;
border-radius:9px !important;
box-shadow:none !important;
}
body .lux-header .lux-search select.orilom-header-category,
body .lux-header .lux-search .orilom-live-search-wrap,
body .lux-header .lux-search .orilom-live-search-input,
body .lux-header .lux-search .orilom-search-submit{
height:44px !important;
min-height:44px !important;
}
body .lux-header .lux-search select.orilom-header-category{
padding-left:12px !important;
padding-right:25px !important;
font-size:9px !important;
}
body .lux-header .lux-search .orilom-live-search-input{
padding:0 14px !important;
font-size:10.5px !important;
}
body .lux-header .lux-search .orilom-search-submit{
width:46px !important;
min-width:46px !important;
}
/* -----------------------------------------------------
Actions : icône uniquement = beaucoup moins encombré
----------------------------------------------------- */
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:132px !important;
min-width:132px !important;
max-width:132px !important;
display:grid !important;
grid-template-columns:repeat(3,40px) !important;
gap:6px !important;
align-items:center !important;
justify-content:end !important;
}
body .lux-header .header-tools > a.orilom-header-action,
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link,
body .lux-header .header-tools > a.orilom-account-action{
position:relative !important;
width:40px !important;
min-width:40px !important;
max-width:40px !important;
height:40px !important;
min-height:40px !important;
max-height:40px !important;
padding:0 !important;
margin:0 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
flex-direction:row !important;
border:1px solid transparent !important;
border-radius:9px !important;
background:transparent !important;
box-shadow:none !important;
/* supprime tout texte injecté hors SVG */
font-size:0 !important;
line-height:0 !important;
}
body .lux-header .header-tools > a.orilom-header-action:hover,
body .lux-header .header-tools > a.wishlist-link:hover,
body .lux-header .header-tools > a.cart-link:hover,
body .lux-header .header-tools > a.orilom-account-action:hover{
background:#f6f6f3 !important;
border-color:#e8e8e3 !important;
transform:none !important;
}
body .lux-header .orilom-header-action-icon{
width:19px !important;
height:19px !important;
flex:0 0 19px !important;
}
body .lux-header .orilom-header-action-icon svg{
width:19px !important;
height:19px !important;
}
/* Les libellés existent pour le HTML mais ne surchargent plus l'app bar */
body .lux-header .orilom-header-action-label{
display:none !important;
}
/* Neutralise tous les anciens textes/pseudo-textes Account */
body .lux-header .header-tools > a.orilom-account-action::before,
body .lux-header .header-tools > a.orilom-account-action::after,
body .lux-header .header-tools .orilom-account-menu > a.orilom-account-link::before,
body .lux-header .header-tools .orilom-account-menu > a.orilom-account-link::after,
body.logged-in .lux-header .header-tools .orilom-account-menu > a.orilom-account-link::after{
content:none !important;
display:none !important;
}
/* Si un ancien wrapper account existe encore, il devient compact */
body .lux-header .header-tools .orilom-account-menu,
body.logged-in .lux-header .header-tools .orilom-account-menu,
body:not(.logged-in) .lux-header .header-tools .orilom-account-menu{
width:40px !important;
min-width:40px !important;
max-width:40px !important;
height:40px !important;
min-height:40px !important;
}
body .lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
width:40px !important;
min-width:40px !important;
max-width:40px !important;
height:40px !important;
min-height:40px !important;
padding:0 !important;
font-size:0 !important;
line-height:0 !important;
border-radius:9px !important;
}
/* badges plus discrets */
body .lux-header .wishlist-count,
body .lux-header .cart-count{
top:-2px !important;
right:0 !important;
min-width:14px !important;
height:14px !important;
font-size:7px !important;
}
/* Nav secondaire : moins haute */
body .lux-header .lux-nav ul{
min-height:40px !important;
gap:28px !important;
font-size:9.5px !important;
}
body .lux-header .lux-nav a{
padding:13px 0 !important;
}
}
/* ---------------------------------------------------------
3. ÉCRANS 1101–1250 : préserver la recherche
--------------------------------------------------------- */
@media(max-width:1250px) and (min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:
160px
140px
minmax(360px,1fr)
126px !important;
padding-left:16px !important;
padding-right:16px !important;
gap:9px !important;
}
body .lux-header .orilom-collections-menu,
body .lux-header .lux-brands.orilom-collections-trigger{
width:140px !important;
min-width:140px !important;
}
body .lux-header .header-tools{
width:126px !important;
min-width:126px !important;
max-width:126px !important;
gap:3px !important;
}
}
/* ---------------------------------------------------------
4. MOBILE/TABLETTE — dropdown live search visible
--------------------------------------------------------- */
@media(max-width:1100px){
body .lux-header .lux-search{
overflow:visible !important;
}
body .lux-header .orilom-live-search-wrap{
overflow:visible !important;
}
}
@media(max-width:780px){
body .lux-header .orilom-live-search-results{
position:fixed !important;
z-index:1000000 !important;
left:10px !important;
right:10px !important;
top:auto !important;
width:auto !important;
max-width:none !important;
max-height:58vh !important;
}
}
/* =========================================================
ORILOM — SEARCH PROPORTION REBALANCE V6
Barre de recherche premium, plus courte et mieux intégrée.
Live search conservé.
========================================================= */
@media(min-width:1101px){
/* Le header ne donne plus toute la place libre à la recherche */
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1380px !important;
grid-template-columns:
180px
150px
minmax(520px,680px)
132px !important;
justify-content:center !important;
gap:14px !important;
}
/* Recherche : largeur maîtrisée */
body .lux-header .lux-search{
width:100% !important;
max-width:680px !important;
justify-self:center !important;
grid-template-columns:
120px
minmax(280px,1fr)
46px !important;
}
/* Catégorie plus discrète */
body .lux-header .lux-search select.orilom-header-category{
padding-left:11px !important;
padding-right:23px !important;
font-size:8.8px !important;
}
/* Input légèrement plus respirant */
body .lux-header .lux-search .orilom-live-search-input{
padding-left:14px !important;
padding-right:12px !important;
font-size:10.5px !important;
}
/* Dropdown suggestions : même logique visuelle que la barre */
body .lux-header .orilom-live-search-results{
width:min(460px,calc(100vw - 30px)) !important;
max-width:460px !important;
}
}
/* Desktop intermédiaire : encore plus compact */
@media(max-width:1250px) and (min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1220px !important;
grid-template-columns:
160px
138px
minmax(430px,580px)
126px !important;
gap:10px !important;
}
body .lux-header .orilom-collections-menu,
body .lux-header .lux-brands.orilom-collections-trigger{
width:138px !important;
min-width:138px !important;
}
body .lux-header .lux-search{
max-width:580px !important;
grid-template-columns:
112px
minmax(240px,1fr)
44px !important;
}
body .lux-header .lux-search .orilom-search-submit{
width:44px !important;
min-width:44px !important;
}
}
/* Grand écran : elle reste volontairement contenue */
@media(min-width:1500px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1420px !important;
grid-template-columns:
190px
155px
700px
138px !important;
gap:16px !important;
}
body .lux-header .lux-search{
max-width:700px !important;
}
}
/* =========================================================
ORILOM — SEARCH PROPORTION REBALANCE V7
Recherche plus courte pour un header plus premium.
========================================================= */
@media(min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1240px !important;
grid-template-columns:
170px
145px
520px
132px !important;
gap:12px !important;
justify-content:center !important;
}
body .lux-header .lux-search{
width:520px !important;
max-width:520px !important;
grid-template-columns:
110px
364px
46px !important;
}
body .lux-header .orilom-live-search-results{
width:400px !important;
max-width:400px !important;
}
}
@media(max-width:1250px) and (min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1130px !important;
grid-template-columns:
155px
135px
460px
126px !important;
gap:10px !important;
}
body .lux-header .lux-search{
width:460px !important;
max-width:460px !important;
grid-template-columns:
105px
311px
44px !important;
}
body .lux-header .orilom-live-search-results{
width:370px !important;
max-width:370px !important;
}
}
@media(min-width:1500px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1300px !important;
grid-template-columns:
180px
150px
560px
138px !important;
gap:14px !important;
}
body .lux-header .lux-search{
width:560px !important;
max-width:560px !important;
grid-template-columns:
115px
399px
46px !important;
}
body .lux-header .orilom-live-search-results{
width:420px !important;
max-width:420px !important;
}
}
/* =========================================================
ORILOM — SEARCH -30% V8
Réduction supplémentaire demandée.
========================================================= */
@media(min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1080px !important;
grid-template-columns:170px 145px 364px 132px !important;
gap:12px !important;
justify-content:center !important;
}
body .lux-header .lux-search{
width:364px !important;
max-width:364px !important;
grid-template-columns:92px 226px 46px !important;
}
body .lux-header .orilom-live-search-results{
width:330px !important;
max-width:330px !important;
}
}
@media(max-width:1250px) and (min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1010px !important;
grid-template-columns:155px 135px 322px 126px !important;
gap:10px !important;
}
body .lux-header .lux-search{
width:322px !important;
max-width:322px !important;
grid-template-columns:84px 194px 44px !important;
}
body .lux-header .orilom-live-search-results{
width:300px !important;
max-width:300px !important;
}
}
@media(min-width:1500px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1120px !important;
grid-template-columns:180px 150px 392px 138px !important;
gap:14px !important;
}
body .lux-header .lux-search{
width:392px !important;
max-width:392px !important;
grid-template-columns:96px 250px 46px !important;
}
body .lux-header .orilom-live-search-results{
width:350px !important;
max-width:350px !important;
}
}
/* =========================================================
ORILOM — SEARCH RIGHT BORDER FIX V9
Ferme visuellement la barre après l'icône recherche.
========================================================= */
body .lux-header .lux-search .orilom-search-submit{
border-right:1px solid #deded9 !important;
border-radius:0 8px 8px 0 !important;
}
/* =========================================================
ORILOM — SEARCH FRAME + CATEGORY WIDTH V10
- bordure droite parfaitement cadrée par le conteneur
- zone catégorie x1.5
- largeur totale de recherche inchangée
========================================================= */
@media(min-width:1101px){
/* La bordure extérieure appartient au formulaire complet */
body .lux-header .lux-search{
box-sizing:border-box !important;
border:1px solid #deded9 !important;
border-radius:9px !important;
}
/* Pas de deuxième bordure à droite du bouton */
body .lux-header .lux-search .orilom-search-submit{
box-sizing:border-box !important;
border-right:0 !important;
border-radius:0 8px 8px 0 !important;
}
/* Desktop V8 : catégorie 92px -> 138px (+50%).
La largeur totale reste 364px. */
body .lux-header .lux-search{
width:364px !important;
max-width:364px !important;
grid-template-columns:138px 180px 46px !important;
}
body .lux-header .lux-search select.orilom-header-category{
padding-left:11px !important;
padding-right:24px !important;
font-size:8.8px !important;
}
}
/* Desktop moyen : 84px -> 126px (+50%) */
@media(max-width:1250px) and (min-width:1101px){
body .lux-header .lux-search{
width:322px !important;
max-width:322px !important;
grid-template-columns:126px 152px 44px !important;
}
}
/* Très grand écran : 96px -> 144px (+50%) */
@media(min-width:1500px){
body .lux-header .lux-search{
width:392px !important;
max-width:392px !important;
grid-template-columns:144px 202px 46px !important;
}
}
/* =========================================================
ORILOM — CATEGORY READABILITY + SEARCH EDGE V11
========================================================= */
/* Catégories : texte plus lisible dans la liste native */
body .lux-header .lux-search select.orilom-header-category{
color:#2a2a2a !important;
font-size:10px !important;
font-weight:600 !important;
}
body .lux-header .lux-search select.orilom-header-category option{
color:#222 !important;
background:#fff !important;
font-size:13px !important;
font-weight:500 !important;
line-height:1.5 !important;
}
/* Fermeture droite de la recherche :
le contour est porté par le bouton pour rester bien visible */
body .lux-header .lux-search .orilom-search-submit{
position:relative !important;
border-right:1px solid #cfcfc9 !important;
border-top:1px solid transparent !important;
border-bottom:1px solid transparent !important;
border-radius:0 9px 9px 0 !important;
}
/* Renforce uniquement l'extrémité droite, sans doubler le reste */
body .lux-header .lux-search .orilom-search-submit::after{
content:"" !important;
display:block !important;
position:absolute !important;
top:-1px !important;
right:-1px !important;
bottom:-1px !important;
width:1px !important;
background:#c8c8c2 !important;
border-radius:0 9px 9px 0 !important;
pointer-events:none !important;
}
/* =========================================================
ORILOM — SEARCH CLEAN FRAME V12
- "Toutes les catégories" entièrement lisible
- suppression du trait parasite après l'icône recherche
- contour unique propre autour de toute la barre
========================================================= */
@media(min-width:1101px){
/* Largeur totale légèrement augmentée juste assez
pour afficher "Toutes les catégories" sans ellipsis */
body .lux-header .lux-search{
width:410px !important;
max-width:410px !important;
grid-template-columns:
158px
206px
46px !important;
border:1px solid #d8d8d2 !important;
border-radius:9px !important;
overflow:visible !important;
background:#fff !important;
}
/* Catégorie entièrement visible */
body .lux-header .lux-search select.orilom-header-category{
width:158px !important;
min-width:158px !important;
padding-left:12px !important;
padding-right:30px !important;
font-size:10px !important;
font-weight:650 !important;
white-space:nowrap !important;
text-overflow:clip !important;
overflow:visible !important;
border-right:1px solid #e6e6e1 !important;
}
/* Input central */
body .lux-header .lux-search .orilom-live-search-wrap{
min-width:0 !important;
}
/* Bouton recherche :
aucune bordure droite propre au bouton,
le contour extérieur du formulaire suffit */
body .lux-header .lux-search .orilom-search-submit{
position:relative !important;
width:46px !important;
min-width:46px !important;
border:0 !important;
border-left:1px solid #e6e6e1 !important;
border-right:0 !important;
border-radius:0 8px 8px 0 !important;
background:#fff !important;
box-shadow:none !important;
}
/* Supprime le pseudo-trait ajouté en V11 */
body .lux-header .lux-search .orilom-search-submit::after{
content:none !important;
display:none !important;
}
}
/* Desktop moyen */
@media(max-width:1250px) and (min-width:1101px){
body .lux-header .lux-search{
width:390px !important;
max-width:390px !important;
grid-template-columns:
150px
196px
44px !important;
}
body .lux-header .lux-search select.orilom-header-category{
width:150px !important;
min-width:150px !important;
}
body .lux-header .lux-search .orilom-search-submit{
width:44px !important;
min-width:44px !important;
}
}
/* Très grand écran */
@media(min-width:1500px){
body .lux-header .lux-search{
width:430px !important;
max-width:430px !important;
grid-template-columns:
160px
224px
46px !important;
}
body .lux-header .lux-search select.orilom-header-category{
width:160px !important;
min-width:160px !important;
}
}
/* =========================================================
ORILOM — HEADER SPACING / UI UX V13
Sépare visuellement les 4 zones du header sans toucher
au live-search ni à son JavaScript.
========================================================= */
@media(min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1320px !important;
grid-template-columns:180px 150px 410px 150px !important;
column-gap:24px !important;
justify-content:center !important;
align-items:center !important;
}
/* Respiration après le logo */
body .lux-header .lux-brand{
padding-right:4px !important;
}
/* Collections ne colle plus à la recherche */
body .lux-header .orilom-collections-menu{
margin-right:0 !important;
}
/* Recherche : conserve exactement la V12 */
body .lux-header .lux-search{
width:410px !important;
max-width:410px !important;
margin:0 !important;
}
/* Zone actions : petit espace interne régulier */
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:150px !important;
min-width:150px !important;
max-width:150px !important;
grid-template-columns:repeat(3,40px) !important;
column-gap:10px !important;
justify-content:start !important;
}
}
@media(max-width:1250px) and (min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1180px !important;
grid-template-columns:160px 138px 390px 138px !important;
column-gap:18px !important;
}
body .lux-header .lux-search{
width:390px !important;
max-width:390px !important;
}
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:138px !important;
min-width:138px !important;
max-width:138px !important;
column-gap:7px !important;
}
}
@media(min-width:1500px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
max-width:1380px !important;
grid-template-columns:190px 150px 430px 156px !important;
column-gap:28px !important;
}
body .lux-header .lux-search{
width:430px !important;
max-width:430px !important;
}
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:156px !important;
min-width:156px !important;
max-width:156px !important;
column-gap:12px !important;
}
}
/* =========================================================
ORILOM — SEARCH RIGHT EDGE DEFINITIVE FIX V14
Le défaut venait du fait que le conteneur avait
overflow:visible : son arrondi ne pouvait pas masquer
proprement le fond du bouton à droite.
On dessine donc le bord final avec un pseudo-élément
du FORMULAIRE, pas du bouton.
========================================================= */
body .lux-header .lux-search{
position:relative !important;
border-right:0 !important;
}
/* Aucun trait / pseudo-élément sur le bouton lui-même */
body .lux-header .lux-search .orilom-search-submit{
border-right:0 !important;
border-radius:0 !important;
}
body .lux-header .lux-search .orilom-search-submit::before,
body .lux-header .lux-search .orilom-search-submit::after{
content:none !important;
display:none !important;
}
/* Dessine uniquement l'extrémité droite du cadre */
body .lux-header .lux-search::after{
content:"" !important;
display:block !important;
position:absolute !important;
z-index:20 !important;
top:-1px !important;
right:-1px !important;
bottom:-1px !important;
width:14px !important;
border-top:1px solid #d8d8d2 !important;
border-right:1px solid #d8d8d2 !important;
border-bottom:1px solid #d8d8d2 !important;
border-radius:0 9px 9px 0 !important;
background:transparent !important;
pointer-events:none !important;
box-sizing:border-box !important;
}
/* La loupe reste bien centrée, avec séparation à gauche */
body .lux-header .lux-search .orilom-search-submit{
border-left:1px solid #e6e6e1 !important;
}
/* =========================================================
ORILOM — SEARCH RIGHT EDGE FINAL V15
Un seul contour externe : plus de petit trait qui dépasse.
Live-search reste visible.
========================================================= */
body .lux-header .lux-search{
position:relative !important;
border:1px solid #d8d8d2 !important;
border-radius:9px !important;
overflow:visible !important;
background:#fff !important;
}
/* Supprime complètement le faux cadre V14 */
body .lux-header .lux-search::after{
content:none !important;
display:none !important;
}
/* Le bouton ne dessine QUE la séparation intérieure gauche */
body .lux-header .lux-search .orilom-search-submit{
position:relative !important;
box-sizing:border-box !important;
border:0 !important;
border-left:1px solid #e6e6e1 !important;
border-radius:0 8px 8px 0 !important;
background:#fff !important;
box-shadow:none !important;
}
/* Aucun pseudo-élément parasite sur le bouton */
body .lux-header .lux-search .orilom-search-submit::before,
body .lux-header .lux-search .orilom-search-submit::after{
content:none !important;
display:none !important;
}
/* Masque précisément les éventuels débordements du fond du bouton
dans les coins, sans clipper le dropdown de recherche. */
body .lux-header .lux-search .orilom-search-submit{
clip-path:inset(0 0 0 0 round 0 8px 8px 0) !important;
}
/* =========================================================
ORILOM — SEARCH BORDER SIMPLE / STABLE V16
Structure simple :
- le formulaire porte TOUT le contour
- le bouton n'a qu'une séparation à gauche
- aucun pseudo-element
- aucun clip-path
- autocomplete conservé
========================================================= */
body .lux-header .lux-search{
position:relative !important;
box-sizing:border-box !important;
border:1px solid #d8d8d2 !important;
border-radius:9px !important;
background:#fff !important;
overflow:visible !important;
}
/* Supprime toutes les anciennes techniques de bordure */
body .lux-header .lux-search::before,
body .lux-header .lux-search::after{
content:none !important;
display:none !important;
}
/* Bouton recherche : rectangle interne simple */
body .lux-header .lux-search .orilom-search-submit{
position:relative !important;
width:46px !important;
min-width:46px !important;
height:100% !important;
min-height:0 !important;
margin:0 !important;
padding:0 !important;
box-sizing:border-box !important;
border:0 !important;
border-left:1px solid #e6e6e1 !important;
border-radius:0 8px 8px 0 !important;
background:#fff !important;
color:#111 !important;
box-shadow:none !important;
clip-path:none !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
}
/* Aucun pseudo-element sur la loupe */
body .lux-header .lux-search .orilom-search-submit::before,
body .lux-header .lux-search .orilom-search-submit::after{
content:none !important;
display:none !important;
}
/* Evite tout dépassement visuel du bouton sans toucher au dropdown */
body .lux-header .lux-search .orilom-search-submit{
overflow:hidden !important;
}
/* Desktop moyen */
@media(max-width:1250px) and (min-width:1101px){
body .lux-header .lux-search .orilom-search-submit{
width:44px !important;
min-width:44px !important;
}
}
/* Mobile */
@media(max-width:780px){
body .lux-header .lux-search .orilom-search-submit{
width:46px !important;
min-width:46px !important;
}
}
/* =========================================================
ORILOM — SEARCH GRID WIDTH ROOT FIX V17
Cause réelle corrigée :
les anciennes colonnes fixes totalisaient la largeur
extérieure du formulaire sans soustraire ses bordures.
Le bouton dépassait donc de ~2px à droite.
========================================================= */
@media(min-width:1101px){
body .lux-header .lux-search{
box-sizing:border-box !important;
/* Largeur externe */
width:410px !important;
max-width:410px !important;
/* IMPORTANT :
catégorie fixe + centre flexible + loupe fixe.
Le 1fr absorbe automatiquement les bordures. */
grid-template-columns:
158px
minmax(0,1fr)
46px !important;
border:1px solid #d8d8d2 !important;
border-radius:9px !important;
overflow:visible !important;
background:#fff !important;
}
body .lux-header .lux-search select.orilom-header-category{
width:auto !important;
min-width:0 !important;
max-width:none !important;
}
body .lux-header .lux-search .orilom-live-search-wrap{
width:auto !important;
min-width:0 !important;
max-width:none !important;
}
body .lux-header .lux-search .orilom-search-submit{
width:auto !important;
min-width:0 !important;
max-width:none !important;
height:auto !important;
min-height:0 !important;
align-self:stretch !important;
margin:0 !important;
padding:0 !important;
box-sizing:border-box !important;
border:0 !important;
border-left:1px solid #e6e6e1 !important;
border-radius:0 8px 8px 0 !important;
background:#fff !important;
box-shadow:none !important;
clip-path:none !important;
overflow:hidden !important;
}
/* Nettoyage définitif des anciennes techniques V11-V15 */
body .lux-header .lux-search::before,
body .lux-header .lux-search::after,
body .lux-header .lux-search .orilom-search-submit::before,
body .lux-header .lux-search .orilom-search-submit::after{
content:none !important;
display:none !important;
}
}
/* Desktop moyen */
@media(max-width:1250px) and (min-width:1101px){
body .lux-header .lux-search{
width:390px !important;
max-width:390px !important;
grid-template-columns:
150px
minmax(0,1fr)
44px !important;
}
}
/* Très grand écran */
@media(min-width:1500px){
body .lux-header .lux-search{
width:430px !important;
max-width:430px !important;
grid-template-columns:
160px
minmax(0,1fr)
46px !important;
}
}
/* =========================================================
ORILOM — SEARCH RIGHT EDGE TRUE FIX V18
Ajoute uniquement la verticale droite manquante,
sans pseudo-element et sans casser le live-search.
========================================================= */
body .lux-header .lux-search{
border-right:1px solid #d8d8d2 !important;
/* Trait intérieur de sécurité parfaitement aligné
entre les deux arrondis existants */
box-shadow:
inset -1px 0 0 #d8d8d2 !important;
}
/* Le bouton ne doit jamais masquer le bord extérieur */
body .lux-header .lux-search .orilom-search-submit{
margin-right:1px !important;
border-right:0 !important;
border-radius:0 7px 7px 0 !important;
}
/* =========================================================
ORILOM — ROUE DE BIENVENUE V2 FUTURE LUX
Noir / Or / Verre fumé — cohérent avec l'univers ORILOM
========================================================= */
.orilom-wheel-overlay[hidden]{
display:none !important;
}
.orilom-wheel-overlay{
position:fixed !important;
inset:0 !important;
z-index:999999 !important;
display:grid !important;
place-items:center !important;
padding:20px !important;
overflow:auto !important;
background:
radial-gradient(circle at 50% 20%, rgba(223,185,19,.10), transparent 30%),
rgba(4,4,5,.82) !important;
backdrop-filter:blur(18px) saturate(115%) !important;
-webkit-backdrop-filter:blur(18px) saturate(115%) !important;
}
/* ambient gold halo */
.orilom-wheel-overlay::before{
content:"" !important;
position:fixed !important;
inset:0 !important;
pointer-events:none !important;
background:
radial-gradient(circle at 50% 45%, rgba(223,185,19,.10), transparent 26%),
radial-gradient(circle at 30% 80%, rgba(184,143,0,.06), transparent 28%);
opacity:.95 !important;
}
.orilom-wheel-modal{
position:relative !important;
isolation:isolate !important;
width:min(94vw,520px) !important;
max-height:calc(100vh - 32px) !important;
overflow:auto !important;
scrollbar-width:none !important;
padding:30px 30px 24px !important;
border:1px solid rgba(223,185,19,.42) !important;
border-radius:26px !important;
background:
linear-gradient(180deg, rgba(18,18,19,.96), rgba(7,7,8,.98)) !important;
box-shadow:
0 0 0 1px rgba(255,255,255,.025),
0 28px 100px rgba(0,0,0,.62),
0 0 72px rgba(223,185,19,.10) !important;
text-align:center !important;
color:#fff !important;
}
.orilom-wheel-modal::-webkit-scrollbar{
display:none !important;
}
/* futuristic inner frame */
.orilom-wheel-modal::before{
content:"" !important;
position:absolute !important;
inset:7px !important;
z-index:-1 !important;
pointer-events:none !important;
border:1px solid rgba(255,255,255,.045) !important;
border-radius:20px !important;
}
/* subtle top scan glow */
.orilom-wheel-modal::after{
content:"" !important;
position:absolute !important;
z-index:-1 !important;
top:-1px !important;
left:14% !important;
right:14% !important;
height:1px !important;
background:linear-gradient(90deg, transparent, #dfb913, transparent) !important;
box-shadow:0 0 18px rgba(223,185,19,.70) !important;
}
.orilom-wheel-close{
position:absolute !important;
top:15px !important;
right:15px !important;
z-index:20 !important;
width:38px !important;
height:38px !important;
min-width:38px !important;
min-height:38px !important;
display:grid !important;
place-items:center !important;
margin:0 !important;
padding:0 !important;
border:1px solid rgba(255,255,255,.10) !important;
border-radius:12px !important;
background:rgba(255,255,255,.055) !important;
color:#ddd !important;
font:300 24px/1 Arial,sans-serif !important;
cursor:pointer !important;
backdrop-filter:blur(10px) !important;
transition:.22s ease !important;
}
.orilom-wheel-close:hover{
color:#111 !important;
background:#dfb913 !important;
border-color:#dfb913 !important;
transform:rotate(5deg) scale(1.04) !important;
}
.orilom-wheel-kicker{
display:inline-flex !important;
align-items:center !important;
gap:8px !important;
margin:0 0 10px !important;
padding:7px 11px !important;
border:1px solid rgba(223,185,19,.28) !important;
border-radius:999px !important;
background:rgba(223,185,19,.055) !important;
color:#e8c94f !important;
font-size:8px !important;
font-weight:900 !important;
letter-spacing:.22em !important;
text-transform:uppercase !important;
}
.orilom-wheel-kicker::before{
content:"✦" !important;
color:#dfb913 !important;
font-size:10px !important;
}
.orilom-wheel-copy h2{
max-width:410px !important;
margin:0 auto 8px !important;
color:#fff !important;
text-wrap:balance !important;
font:700 clamp(27px,3.3vw,38px)/1.03 Georgia,serif !important;
letter-spacing:-.025em !important;
text-shadow:0 1px 0 rgba(255,255,255,.03) !important;
}
.orilom-wheel-intro{
max-width:385px !important;
margin:0 auto !important;
color:#aaa !important;
font-size:11px !important;
line-height:1.65 !important;
}
.orilom-wheel-intro strong{
color:#f0cf4d !important;
font-weight:900 !important;
}
/* stage + holographic rings */
.orilom-wheel-stage{
position:relative !important;
width:272px !important;
height:272px !important;
margin:21px auto 18px !important;
}
.orilom-wheel-stage::before,
.orilom-wheel-stage::after{
content:"" !important;
position:absolute !important;
pointer-events:none !important;
border-radius:50% !important;
}
.orilom-wheel-stage::before{
inset:-11px !important;
border:1px solid rgba(223,185,19,.24) !important;
box-shadow:
inset 0 0 22px rgba(223,185,19,.05),
0 0 28px rgba(223,185,19,.10) !important;
animation:orilomWheelPulse 2.8s ease-in-out infinite !important;
}
.orilom-wheel-stage::after{
inset:-20px !important;
border:1px dashed rgba(223,185,19,.16) !important;
animation:orilomWheelOrbit 18s linear infinite !important;
}
.orilom-wheel-pointer{
position:absolute !important;
z-index:8 !important;
top:-9px !important;
left:50% !important;
width:26px !important;
height:34px !important;
transform:translateX(-50%) !important;
border:0 !important;
background:linear-gradient(180deg,#f3d65a,#b88f00) !important;
clip-path:polygon(50% 100%,0 0,100% 0) !important;
filter:drop-shadow(0 0 8px rgba(223,185,19,.75)) !important;
}
.orilom-wheel-disc{
position:relative !important;
width:100% !important;
height:100% !important;
overflow:hidden !important;
border:3px solid #dfb913 !important;
border-radius:50% !important;
background:
conic-gradient(
from -30deg,
#0d0d0f 0deg 60deg,
#d7b124 60deg 120deg,
#171719 120deg 180deg,
#f0d253 180deg 240deg,
#0c0c0d 240deg 300deg,
#b88f00 300deg 360deg
) !important;
box-shadow:
inset 0 0 0 4px rgba(255,255,255,.06),
inset 0 0 55px rgba(0,0,0,.34),
0 0 0 6px #09090a,
0 0 0 7px rgba(223,185,19,.32),
0 18px 45px rgba(0,0,0,.52),
0 0 38px rgba(223,185,19,.14) !important;
transition:transform 3.6s cubic-bezier(.12,.74,.13,1) !important;
will-change:transform !important;
}
/* glass light sweep on wheel */
.orilom-wheel-disc::before{
content:"" !important;
position:absolute !important;
inset:0 !important;
border-radius:50% !important;
background:
linear-gradient(115deg,
rgba(255,255,255,.10),
transparent 25%,
transparent 65%,
rgba(255,255,255,.035)
) !important;
pointer-events:none !important;
}
.orilom-wheel-disc::after{
content:"" !important;
position:absolute !important;
top:50% !important;
left:50% !important;
width:74px !important;
height:74px !important;
transform:translate(-50%,-50%) !important;
border:2px solid rgba(223,185,19,.75) !important;
border-radius:50% !important;
background:
radial-gradient(circle at 35% 30%, #262628, #080809 72%) !important;
box-shadow:
0 0 0 5px rgba(255,255,255,.05),
0 0 0 7px rgba(0,0,0,.65),
0 0 22px rgba(223,185,19,.35) !important;
}
.orilom-wheel-center{
position:absolute !important;
z-index:7 !important;
top:50% !important;
left:50% !important;
transform:translate(-50%,-50%) !important;
color:#f1cf44 !important;
font:700 32px/1 Georgia,serif !important;
text-shadow:0 0 12px rgba(223,185,19,.55) !important;
}
.orilom-wheel-label{
position:absolute !important;
z-index:5 !important;
width:74px !important;
color:#f4f0df !important;
font-size:8px !important;
line-height:1.1 !important;
font-weight:900 !important;
letter-spacing:.06em !important;
text-align:center !important;
text-shadow:0 1px 2px rgba(0,0,0,.45) !important;
}
.orilom-wheel-label.label-1{top:27px !important;left:99px !important;transform:rotate(0deg) !important}
.orilom-wheel-label.label-2{top:67px !important;right:15px !important;transform:rotate(60deg) !important;color:#111 !important;text-shadow:none !important}
.orilom-wheel-label.label-3{bottom:53px !important;right:19px !important;transform:rotate(120deg) !important}
.orilom-wheel-label.label-4{bottom:24px !important;left:99px !important;transform:rotate(180deg) !important;color:#111 !important;text-shadow:none !important}
.orilom-wheel-label.label-5{bottom:57px !important;left:10px !important;transform:rotate(240deg) !important}
.orilom-wheel-label.label-6{top:66px !important;left:12px !important;transform:rotate(300deg) !important;color:#111 !important;text-shadow:none !important}
.orilom-wheel-spin,
.orilom-wheel-shop{
position:relative !important;
width:100% !important;
min-height:48px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
margin:0 !important;
padding:0 18px !important;
overflow:hidden !important;
border:1px solid rgba(223,185,19,.46) !important;
border-radius:12px !important;
background:
linear-gradient(180deg,rgba(223,185,19,.14),rgba(223,185,19,.055)),
#111 !important;
color:#f0cf4d !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.05),
0 10px 25px rgba(0,0,0,.26) !important;
font-size:9px !important;
font-weight:900 !important;
letter-spacing:.16em !important;
text-decoration:none !important;
cursor:pointer !important;
transition:.22s ease !important;
}
.orilom-wheel-spin::before,
.orilom-wheel-shop::before{
content:"" !important;
position:absolute !important;
top:0 !important;
bottom:0 !important;
left:-45% !important;
width:30% !important;
transform:skewX(-22deg) !important;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent) !important;
transition:left .55s ease !important;
}
.orilom-wheel-spin:hover,
.orilom-wheel-shop:hover{
background:#dfb913 !important;
color:#090909 !important;
border-color:#dfb913 !important;
box-shadow:0 0 26px rgba(223,185,19,.24) !important;
transform:translateY(-1px) !important;
}
.orilom-wheel-spin:hover::before,
.orilom-wheel-shop:hover::before{
left:115% !important;
}
.orilom-wheel-spin:disabled{
cursor:wait !important;
opacity:.72 !important;
}
.orilom-wheel-result{
margin-top:12px !important;
padding:15px 14px 0 !important;
border-top:1px solid rgba(255,255,255,.07) !important;
}
.orilom-wheel-result[hidden]{
display:none !important;
}
.orilom-wheel-result > span{
display:block !important;
margin-bottom:4px !important;
color:#bba974 !important;
font-size:8px !important;
font-weight:900 !important;
letter-spacing:.20em !important;
}
.orilom-wheel-result > strong{
display:block !important;
color:#f0cf4d !important;
font:700 44px/1 Georgia,serif !important;
text-shadow:0 0 18px rgba(223,185,19,.20) !important;
}
.orilom-wheel-result > p{
margin:7px 0 13px !important;
color:#a9a9aa !important;
font-size:10px !important;
}
.orilom-wheel-code{
display:grid !important;
grid-template-columns:1fr auto !important;
overflow:hidden !important;
margin-bottom:9px !important;
border:1px solid rgba(223,185,19,.38) !important;
border-radius:10px !important;
background:rgba(255,255,255,.035) !important;
}
.orilom-wheel-code code{
display:flex !important;
align-items:center !important;
padding:0 14px !important;
color:#f2df95 !important;
font-size:12px !important;
font-weight:900 !important;
letter-spacing:.12em !important;
}
.orilom-wheel-copy-code{
min-height:42px !important;
margin:0 !important;
padding:0 15px !important;
border:0 !important;
border-left:1px solid rgba(223,185,19,.25) !important;
border-radius:0 !important;
background:rgba(223,185,19,.08) !important;
color:#dfc45c !important;
font-size:8px !important;
font-weight:900 !important;
cursor:pointer !important;
}
.orilom-wheel-copy-code:hover{
color:#111 !important;
background:#dfb913 !important;
}
.orilom-wheel-shop{
margin-top:8px !important;
}
.orilom-wheel-result small,
.orilom-wheel-legal{
display:block !important;
color:#777 !important;
font-size:8px !important;
line-height:1.5 !important;
}
.orilom-wheel-result small{
margin-top:9px !important;
}
.orilom-wheel-legal{
margin:13px 0 0 !important;
}
body.orilom-wheel-open{
overflow:hidden !important;
}
@keyframes orilomWheelPulse{
0%,100%{
opacity:.58;
transform:scale(1);
box-shadow:0 0 20px rgba(223,185,19,.08);
}
50%{
opacity:1;
transform:scale(1.015);
box-shadow:0 0 34px rgba(223,185,19,.18);
}
}
@keyframes orilomWheelOrbit{
from{transform:rotate(0deg)}
to{transform:rotate(360deg)}
}
/* ---------- Mobile ---------- */
@media(max-width:520px){
.orilom-wheel-overlay{
align-items:start !important;
padding:10px !important;
}
.orilom-wheel-modal{
width:100% !important;
max-height:calc(100dvh - 20px) !important;
margin:auto !important;
padding:25px 17px 20px !important;
border-radius:20px !important;
}
.orilom-wheel-copy h2{
max-width:330px !important;
font-size:29px !important;
}
.orilom-wheel-stage{
width:238px !important;
height:238px !important;
margin-top:18px !important;
margin-bottom:17px !important;
}
.orilom-wheel-label{
width:62px !important;
font-size:7px !important;
}
.orilom-wheel-label.label-1{top:23px !important;left:85px !important}
.orilom-wheel-label.label-2{top:59px !important;right:11px !important}
.orilom-wheel-label.label-3{bottom:45px !important;right:15px !important}
.orilom-wheel-label.label-4{bottom:20px !important;left:86px !important}
.orilom-wheel-label.label-5{bottom:49px !important;left:8px !important}
.orilom-wheel-label.label-6{top:56px !important;left:9px !important}
.orilom-wheel-result > strong{
font-size:38px !important;
}
}
@media(max-height:760px) and (min-width:521px){
.orilom-wheel-modal{
padding-top:24px !important;
padding-bottom:19px !important;
}
.orilom-wheel-stage{
width:236px !important;
height:236px !important;
margin-top:16px !important;
margin-bottom:14px !important;
}
.orilom-wheel-copy h2{
font-size:30px !important;
}
.orilom-wheel-label{
width:62px !important;
font-size:7px !important;
}
.orilom-wheel-label.label-1{top:23px !important;left:85px !important}
.orilom-wheel-label.label-2{top:59px !important;right:11px !important}
.orilom-wheel-label.label-3{bottom:45px !important;right:15px !important}
.orilom-wheel-label.label-4{bottom:20px !important;left:86px !important}
.orilom-wheel-label.label-5{bottom:49px !important;left:8px !important}
.orilom-wheel-label.label-6{top:56px !important;left:9px !important}
}
@media(prefers-reduced-motion:reduce){
.orilom-wheel-disc,
.orilom-wheel-stage::before,
.orilom-wheel-stage::after{
animation:none !important;
transition-duration:.01ms !important;
}
}
/* ORILOM — TOMBOLA TRIGGER ESPACE CLIENT V3 — ICÔNE SEULE */
body.woocommerce-account .orilom-dashboard-hero{
position:relative !important;
overflow:visible !important;
padding-right:86px !important;
}
body.woocommerce-account .orilom-dashboard-hero::after{
display:none !important;
content:none !important;
}
body.woocommerce-account .orilom-tombola-trigger{
position:absolute !important;
top:18px !important;
right:18px !important;
bottom:auto !important;
left:auto !important;
z-index:50 !important;
width:56px !important;
min-width:56px !important;
max-width:56px !important;
height:56px !important;
min-height:56px !important;
max-height:56px !important;
display:grid !important;
place-items:center !important;
margin:0 !important;
padding:0 !important;
border:1px solid rgba(184,143,0,.52) !important;
border-radius:50% !important;
background:
radial-gradient(circle at 34% 28%,#f9e483 0 14%,#e0b82b 42%,#a77e00 100%) !important;
color:#111 !important;
box-shadow:
0 10px 24px rgba(0,0,0,.12),
0 0 0 4px rgba(223,185,19,.08),
0 0 22px rgba(223,185,19,.12),
inset 0 1px 0 rgba(255,255,255,.72) !important;
cursor:pointer !important;
transform:none !important;
transition:
transform .20s ease,
box-shadow .20s ease,
border-color .20s ease !important;
}
body.woocommerce-account .orilom-tombola-trigger:hover,
body.woocommerce-account .orilom-tombola-trigger:focus-visible{
transform:translateY(-2px) scale(1.05) !important;
border-color:#b88f00 !important;
box-shadow:
0 14px 30px rgba(0,0,0,.15),
0 0 0 6px rgba(223,185,19,.10),
0 0 26px rgba(223,185,19,.20),
inset 0 1px 0 rgba(255,255,255,.72) !important;
}
body.woocommerce-account .orilom-tombola-trigger:focus-visible{
outline:2px solid #111 !important;
outline-offset:4px !important;
}
body.woocommerce-account .orilom-tombola-trigger-ring{
position:relative !important;
width:42px !important;
min-width:42px !important;
max-width:42px !important;
height:42px !important;
min-height:42px !important;
max-height:42px !important;
display:grid !important;
place-items:center !important;
border:1px solid rgba(17,17,17,.38) !important;
border-radius:50% !important;
background:
radial-gradient(circle at 40% 35%,rgba(255,255,255,.20),rgba(255,255,255,.06)) !important;
}
body.woocommerce-account .orilom-tombola-trigger-ring::after{
content:"" !important;
position:absolute !important;
inset:-5px !important;
border:1px dashed rgba(110,82,0,.62) !important;
border-radius:50% !important;
animation:orilomTombolaTriggerOrbit 9s linear infinite !important;
pointer-events:none !important;
}
body.woocommerce-account .orilom-tombola-trigger-ring svg{
width:27px !important;
height:27px !important;
fill:none !important;
stroke:#111 !important;
stroke-width:1.75 !important;
stroke-linecap:round !important;
stroke-linejoin:round !important;
}
/* Sécurité : aucun ancien texte/tooltip visuel ne doit rester. */
body.woocommerce-account .orilom-tombola-trigger-copy{
display:none !important;
visibility:hidden !important;
opacity:0 !important;
pointer-events:none !important;
}
body.woocommerce-account .orilom-tombola-trigger.is-played{
background:#111 !important;
border-color:#dfb913 !important;
}
body.woocommerce-account .orilom-tombola-trigger.is-played
.orilom-tombola-trigger-ring{
background:#171717 !important;
border-color:#dfb913 !important;
}
body.woocommerce-account .orilom-tombola-trigger.is-played
.orilom-tombola-trigger-ring svg{
stroke:#dfb913 !important;
}
body.woocommerce-account .orilom-tombola-trigger.is-played
.orilom-tombola-trigger-ring::after{
border-color:rgba(223,185,19,.58) !important;
}
@keyframes orilomTombolaTriggerOrbit{
from{transform:rotate(0deg)}
to{transform:rotate(360deg)}
}
@media(max-width:700px){
body.woocommerce-account .orilom-dashboard-hero{
padding-right:66px !important;
}
body.woocommerce-account .orilom-tombola-trigger{
top:12px !important;
right:12px !important;
width:46px !important;
min-width:46px !important;
max-width:46px !important;
height:46px !important;
min-height:46px !important;
max-height:46px !important;
}
body.woocommerce-account .orilom-tombola-trigger-ring{
width:34px !important;
min-width:34px !important;
max-width:34px !important;
height:34px !important;
min-height:34px !important;
max-height:34px !important;
}
body.woocommerce-account .orilom-tombola-trigger-ring svg{
width:22px !important;
height:22px !important;
}
}
@media(prefers-reduced-motion:reduce){
body.woocommerce-account
.orilom-tombola-trigger-ring::after{
animation:none !important;
}
}
/* =========================================================
ORILOM — TOMBOLA DYNAMIQUE 4 / 6 SECTIONS
========================================================= */
.orilom-wheel-disc{
position:relative !important;
}
.orilom-wheel-dynamic-label{
--angle:0deg;
position:absolute !important;
inset:0 !important;
z-index:6 !important;
display:block !important;
border-radius:50% !important;
transform:rotate(var(--angle)) !important;
pointer-events:none !important;
}
.orilom-wheel-dynamic-label > span{
position:absolute !important;
top:23px !important;
left:50% !important;
width:82px !important;
transform:
translateX(-50%)
rotate(90deg) !important;
color:#fff !important;
font-size:9px !important;
line-height:1 !important;
font-weight:900 !important;
letter-spacing:.05em !important;
text-align:center !important;
text-shadow:0 1px 3px rgba(0,0,0,.55) !important;
}
.orilom-wheel-stage[data-count="4"]
.orilom-wheel-dynamic-label > span{
top:28px !important;
font-size:10px !important;
}
.orilom-wheel-disc{
transition:
transform 3.6s cubic-bezier(.12,.74,.13,1) !important;
}
@media(max-width:520px){
.orilom-wheel-dynamic-label > span{
top:19px !important;
width:68px !important;
font-size:8px !important;
}
.orilom-wheel-stage[data-count="4"]
.orilom-wheel-dynamic-label > span{
top:24px !important;
font-size:9px !important;
}
}
/* =========================================================
ORILOM — TOMBOLA V3 — LIBELLÉS PARFAITEMENT CENTRÉS
Le conteneur tourne autour du centre de la roue,
puis le texte est placé au milieu radial de chaque segment.
========================================================= */
.orilom-wheel-dynamic-label{
--angle:0deg;
position:absolute !important;
inset:0 !important;
z-index:6 !important;
width:100% !important;
height:100% !important;
display:block !important;
border-radius:50% !important;
transform:rotate(var(--angle)) !important;
transform-origin:50% 50% !important;
pointer-events:none !important;
}
.orilom-wheel-dynamic-label > span{
position:absolute !important;
/* milieu de la tranche entre le centre et le bord */
top:17% !important;
left:50% !important;
width:72px !important;
height:24px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
margin:0 !important;
padding:0 !important;
/*
* Annule la rotation du parent pour que chaque remise
* reste horizontale et parfaitement lisible.
*/
transform:
translate(-50%,-50%)
rotate(calc(-1 * var(--angle))) !important;
transform-origin:50% 50% !important;
color:#fff !important;
font-size:10px !important;
line-height:1 !important;
font-weight:900 !important;
letter-spacing:0 !important;
text-align:center !important;
white-space:nowrap !important;
text-shadow:
0 1px 3px rgba(0,0,0,.72),
0 0 4px rgba(0,0,0,.35) !important;
}
/* Sur les zones dorées, le contour noir garde le texte lisible. */
.orilom-wheel-stage[data-count="4"]
.orilom-wheel-dynamic-label > span{
top:18% !important;
width:78px !important;
font-size:11px !important;
}
@media(max-width:520px){
.orilom-wheel-dynamic-label > span{
top:17% !important;
width:62px !important;
height:20px !important;
font-size:9px !important;
}
.orilom-wheel-stage[data-count="4"]
.orilom-wheel-dynamic-label > span{
top:18% !important;
width:66px !important;
font-size:10px !important;
}
}
/* =========================================================
ORILOM — TOMBOLA V4 — CENTRAGE ANGULAIRE CORRIGÉ
IMPORTANT :
la roue CSS commence à -90deg (conic-gradient from -90deg),
donc les labels doivent eux aussi être décalés de -90deg.
========================================================= */
.orilom-wheel-dynamic-label{
--angle:0deg;
position:absolute !important;
inset:0 !important;
z-index:6 !important;
width:100% !important;
height:100% !important;
display:block !important;
border-radius:50% !important;
/*
* CORRECTION :
* le segment 1 commence à -90°, donc on enlève 90°
* à la position calculée par le JS.
*/
transform:
rotate(calc(var(--angle) - 90deg)) !important;
transform-origin:50% 50% !important;
pointer-events:none !important;
}
.orilom-wheel-dynamic-label > span{
position:absolute !important;
/*
* Position radiale :
* environ au milieu entre le moyeu et le bord.
*/
top:22% !important;
left:50% !important;
width:78px !important;
height:26px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
margin:0 !important;
padding:0 !important;
/*
* Annule la rotation du parent pour garder
* les pourcentages horizontaux.
*
* Parent = angle - 90°
* Inverse = 90° - angle
*/
transform:
translate(-50%,-50%)
rotate(calc(90deg - var(--angle))) !important;
transform-origin:50% 50% !important;
color:#fff !important;
font-size:11px !important;
line-height:1 !important;
font-weight:900 !important;
letter-spacing:0 !important;
text-align:center !important;
white-space:nowrap !important;
text-shadow:
0 2px 4px rgba(0,0,0,.80),
0 0 5px rgba(0,0,0,.38) !important;
}
/* 4 secteurs : un peu plus proche du centre visuel du quartier */
.orilom-wheel-stage[data-count="4"]
.orilom-wheel-dynamic-label > span{
top:23% !important;
width:84px !important;
font-size:12px !important;
}
/* 6 secteurs : position idéale dans chaque tranche */
.orilom-wheel-stage[data-count="6"]
.orilom-wheel-dynamic-label > span{
top:22% !important;
width:76px !important;
font-size:11px !important;
}
@media(max-width:520px){
.orilom-wheel-dynamic-label > span{
top:21% !important;
width:64px !important;
height:22px !important;
font-size:9px !important;
}
.orilom-wheel-stage[data-count="4"]
.orilom-wheel-dynamic-label > span{
top:22% !important;
width:70px !important;
font-size:10px !important;
}
.orilom-wheel-stage[data-count="6"]
.orilom-wheel-dynamic-label > span{
top:21% !important;
width:62px !important;
font-size:9px !important;
}
}
/* =========================================================
ORILOM — TOMBOLA V5 — ÉTATS HIDDEN FIABLES
Empêche les styles display:flex !important de réafficher
le bouton une fois la participation terminée.
========================================================= */
.orilom-wheel-spin[hidden],
.orilom-wheel-shop[hidden],
.orilom-wheel-overlay[hidden],
.orilom-wheel-result[hidden]{
display:none !important;
}
/* =========================================================
ORILOM — FOOTER PREMIUM GLOBAL V1
Scope : Mon compte / Favoris / Panier / Blog
Ne modifie PAS le footer de la Home.
========================================================= */
body.woocommerce-account,
body.woocommerce-cart,
body.blog{
--orilom-inner-footer-max:1180px;
--orilom-inner-footer-gutter:28px;
--orilom-inner-footer-edge:max(
var(--orilom-inner-footer-gutter),
calc((100vw - var(--orilom-inner-footer-max))/2)
);
}
/* ---------------------------------------------------------
1) FOOTER : pleine largeur, propre, compact et premium
--------------------------------------------------------- */
body.woocommerce-account .site-footer:not(.orilom-footer-v34),
body.woocommerce-cart .site-footer:not(.orilom-footer-v34),
body.blog .site-footer:not(.orilom-footer-v34){
position:relative !important;
isolation:isolate !important;
width:100% !important;
max-width:none !important;
min-height:0 !important;
margin:70px 0 0 !important;
padding:
40px
var(--orilom-inner-footer-edge)
20px !important;
display:grid !important;
grid-template-columns:
minmax(250px,1.35fr)
repeat(3,minmax(135px,1fr)) !important;
column-gap:52px !important;
row-gap:20px !important;
overflow:hidden !important;
background:
radial-gradient(
circle at 12% 115%,
rgba(216,179,0,.055),
transparent 28%
),
linear-gradient(
180deg,
#090909 0%,
#060606 100%
) !important;
color:#d6d6d6 !important;
border:0 !important;
border-top:1px solid rgba(255,255,255,.055) !important;
box-shadow:none !important;
}
/* Fine signature dorée en haut */
body.woocommerce-account .site-footer:not(.orilom-footer-v34)::before,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34)::before,
body.blog .site-footer:not(.orilom-footer-v34)::before{
content:"" !important;
position:absolute !important;
z-index:0 !important;
top:0 !important;
left:var(--orilom-inner-footer-edge) !important;
right:var(--orilom-inner-footer-edge) !important;
height:1px !important;
background:
linear-gradient(
90deg,
transparent,
rgba(216,179,0,.42),
transparent
) !important;
pointer-events:none !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) > div,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) > div,
body.blog .site-footer:not(.orilom-footer-v34) > div{
position:relative !important;
z-index:1 !important;
min-width:0 !important;
margin:0 !important;
padding:0 !important;
}
/* ---------------------------------------------------------
2) IDENTITÉ ORILOM
--------------------------------------------------------- */
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .brand,
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .lux-brand,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .brand,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .lux-brand,
body.blog .site-footer:not(.orilom-footer-v34) .brand,
body.blog .site-footer:not(.orilom-footer-v34) .lux-brand{
color:#e0bc19 !important;
font-size:25px !important;
line-height:1 !important;
letter-spacing:.15em !important;
text-shadow:
0 0 24px rgba(216,179,0,.08) !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .brand span,
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .lux-brand span,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .brand span,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .lux-brand span,
body.blog .site-footer:not(.orilom-footer-v34) .brand span,
body.blog .site-footer:not(.orilom-footer-v34) .lux-brand span{
color:#e0bc19 !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .brand small,
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .lux-brand small,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .brand small,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .lux-brand small,
body.blog .site-footer:not(.orilom-footer-v34) .brand small,
body.blog .site-footer:not(.orilom-footer-v34) .lux-brand small{
display:block !important;
margin-top:7px !important;
color:#e8e8e8 !important;
font-size:7.5px !important;
line-height:1.2 !important;
letter-spacing:.36em !important;
}
/* ---------------------------------------------------------
3) TITRES / LIENS / TEXTE
--------------------------------------------------------- */
body.woocommerce-account .site-footer:not(.orilom-footer-v34) h4,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) h4,
body.blog .site-footer:not(.orilom-footer-v34) h4{
margin:0 0 12px !important;
color:#f4f1e9 !important;
font:600 13px/1.2 Georgia,serif !important;
letter-spacing:-.01em !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) > div:not(:first-child),
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) > div:not(:first-child),
body.blog .site-footer:not(.orilom-footer-v34) > div:not(:first-child){
display:flex !important;
flex-direction:column !important;
gap:8px !important;
font-size:11px !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) a,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) a,
body.blog .site-footer:not(.orilom-footer-v34) a{
position:relative !important;
width:max-content !important;
max-width:100% !important;
display:inline-flex !important;
align-items:center !important;
margin:0 !important;
padding:0 !important;
color:#d6d6d6 !important;
font-size:11px !important;
line-height:1.4 !important;
font-weight:500 !important;
text-decoration:none !important;
transition:
color .18s ease,
opacity .18s ease !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) a:hover,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) a:hover,
body.blog .site-footer:not(.orilom-footer-v34) a:hover{
color:#dfb913 !important;
}
/* petit underline premium */
body.woocommerce-account .site-footer:not(.orilom-footer-v34) a::after,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) a::after,
body.blog .site-footer:not(.orilom-footer-v34) a::after{
content:"" !important;
position:absolute !important;
left:0 !important;
right:100% !important;
bottom:-3px !important;
height:1px !important;
background:#d8b300 !important;
transition:right .18s ease !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) a:hover::after,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) a:hover::after,
body.blog .site-footer:not(.orilom-footer-v34) a:hover::after{
right:0 !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) p,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) p,
body.blog .site-footer:not(.orilom-footer-v34) p{
max-width:290px !important;
margin:9px 0 0 !important;
color:#858585 !important;
font-size:9.5px !important;
line-height:1.55 !important;
}
/* ---------------------------------------------------------
4) COPYRIGHT
--------------------------------------------------------- */
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .copyright,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .copyright,
body.blog .site-footer:not(.orilom-footer-v34) .copyright{
grid-column:1 / -1 !important;
width:100% !important;
margin:4px 0 0 !important;
padding:14px 0 0 !important;
border-top:1px solid rgba(255,255,255,.09) !important;
color:#707070 !important;
font-size:9.5px !important;
line-height:1.45 !important;
}
/* Empêche les anciens pseudo-éléments footer de polluer */
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .copyright::before,
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .copyright::after,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .copyright::before,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .copyright::after,
body.blog .site-footer:not(.orilom-footer-v34) .copyright::before,
body.blog .site-footer:not(.orilom-footer-v34) .copyright::after{
content:none !important;
display:none !important;
}
/* ---------------------------------------------------------
5) ESPACEMENT PAGE -> FOOTER
Évite footer collé au contenu sur Panier / Compte / Blog
--------------------------------------------------------- */
body.woocommerce-account main,
body.woocommerce-account .site-main,
body.woocommerce-account .woocommerce,
body.woocommerce-cart main,
body.woocommerce-cart .site-main,
body.woocommerce-cart .woocommerce,
body.blog main,
body.blog .site-main{
min-height:0 !important;
}
/* ---------------------------------------------------------
6) TABLETTE
--------------------------------------------------------- */
@media(max-width:980px){
body.woocommerce-account,
body.woocommerce-cart,
body.blog{
--orilom-inner-footer-gutter:28px;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34),
body.woocommerce-cart .site-footer:not(.orilom-footer-v34),
body.blog .site-footer:not(.orilom-footer-v34){
grid-template-columns:
minmax(230px,1.25fr)
repeat(2,minmax(140px,1fr)) !important;
column-gap:36px !important;
row-gap:28px !important;
padding-top:38px !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) > div:nth-child(4),
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) > div:nth-child(4),
body.blog .site-footer:not(.orilom-footer-v34) > div:nth-child(4){
grid-column:2 / -1 !important;
}
}
/* ---------------------------------------------------------
7) MOBILE
--------------------------------------------------------- */
@media(max-width:700px){
body.woocommerce-account,
body.woocommerce-cart,
body.blog{
--orilom-inner-footer-gutter:22px;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34),
body.woocommerce-cart .site-footer:not(.orilom-footer-v34),
body.blog .site-footer:not(.orilom-footer-v34){
margin-top:48px !important;
grid-template-columns:1fr 1fr !important;
gap:28px 22px !important;
padding:
34px
var(--orilom-inner-footer-gutter)
18px !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) > div:first-child,
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .copyright,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) > div:first-child,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .copyright,
body.blog .site-footer:not(.orilom-footer-v34) > div:first-child,
body.blog .site-footer:not(.orilom-footer-v34) .copyright{
grid-column:1 / -1 !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) > div:nth-child(4),
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) > div:nth-child(4),
body.blog .site-footer:not(.orilom-footer-v34) > div:nth-child(4){
grid-column:auto !important;
}
}
/* ---------------------------------------------------------
8) PETIT MOBILE
--------------------------------------------------------- */
@media(max-width:460px){
body.woocommerce-account .site-footer:not(.orilom-footer-v34),
body.woocommerce-cart .site-footer:not(.orilom-footer-v34),
body.blog .site-footer:not(.orilom-footer-v34){
grid-template-columns:1fr !important;
gap:24px !important;
padding-left:20px !important;
padding-right:20px !important;
}
body.woocommerce-account .site-footer:not(.orilom-footer-v34) > div,
body.woocommerce-account .site-footer:not(.orilom-footer-v34) > div:first-child,
body.woocommerce-account .site-footer:not(.orilom-footer-v34) .copyright,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) > div,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) > div:first-child,
body.woocommerce-cart .site-footer:not(.orilom-footer-v34) .copyright,
body.blog .site-footer:not(.orilom-footer-v34) > div,
body.blog .site-footer:not(.orilom-footer-v34) > div:first-child,
body.blog .site-footer:not(.orilom-footer-v34) .copyright{
grid-column:1 !important;
}
}
/* =========================================================
ORILOM — FOOTER GLOBAL PREMIUM V2
Une seule apparence sur TOUTES les pages.
========================================================= */
/* ---------- Pré-footer premium global ---------- */
.orilom-global-footer,
body.home .lux-home-v5{
position:relative;
}
.orilom-global-footer .lux-auth-premium,
body.home .lux-home-v5 .lux-auth-premium{
position:relative !important;
overflow:hidden !important;
margin:0 !important;
padding:0 !important;
background:
radial-gradient(circle at 50% -10%, rgba(216,179,0,.08), transparent 34%),
linear-gradient(180deg,#111 0%,#0b0b0b 100%) !important;
color:#fff !important;
border:0 !important;
}
.orilom-global-footer .lux-auth-premium .lux-auth-inner,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:min(1180px,calc(100% - 48px)) !important;
margin:0 auto !important;
padding:52px 0 38px !important;
text-align:center !important;
}
.orilom-global-footer .lux-auth-premium .lux-auth-inner > span,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > span{
display:block !important;
margin-bottom:12px !important;
color:#d8b300 !important;
font-size:9px !important;
font-weight:900 !important;
letter-spacing:.18em !important;
}
.orilom-global-footer .lux-auth-premium h2,
body.home .lux-home-v5 .lux-auth-premium h2{
max-width:760px !important;
margin:0 auto 16px !important;
color:#fff !important;
font:700 clamp(34px,4vw,54px)/1.02 Georgia,serif !important;
letter-spacing:-.025em !important;
}
.orilom-global-footer .lux-auth-premium p,
body.home .lux-home-v5 .lux-auth-premium p{
max-width:680px !important;
margin:0 auto !important;
color:#aaa !important;
font-size:12px !important;
line-height:1.65 !important;
}
.orilom-global-footer .lux-auth-premium .lux-auth-inner > a,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a{
display:inline-flex !important;
align-items:center !important;
gap:7px !important;
margin-top:17px !important;
color:#dfb913 !important;
font-size:10px !important;
font-weight:900 !important;
letter-spacing:.08em !important;
text-decoration:none !important;
}
.orilom-global-footer .lux-auth-premium .lux-auth-inner > a:hover,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a:hover{
color:#f0cf4d !important;
}
/* ---------- Newsletter ---------- */
.orilom-global-footer .orilom-guide-newsletter,
body.home .orilom-guide-newsletter{
width:min(760px,100%) !important;
margin:28px auto 0 !important;
padding-top:24px !important;
display:grid !important;
grid-template-columns:minmax(220px,1fr) minmax(300px,1.15fr) !important;
gap:24px !important;
align-items:center !important;
border-top:1px solid rgba(255,255,255,.09) !important;
text-align:left !important;
}
.orilom-global-footer .orilom-guide-newsletter-copy,
body.home .orilom-guide-newsletter-copy{
display:flex !important;
flex-direction:column !important;
gap:4px !important;
}
.orilom-global-footer .orilom-guide-newsletter-copy strong,
body.home .orilom-guide-newsletter-copy strong{
color:#fff !important;
font-size:12px !important;
font-weight:800 !important;
}
.orilom-global-footer .orilom-guide-newsletter-copy small,
body.home .orilom-guide-newsletter-copy small{
color:#777 !important;
font-size:9px !important;
line-height:1.5 !important;
}
.orilom-global-footer .orilom-guide-newsletter-form,
body.home .orilom-guide-newsletter-form{
display:grid !important;
grid-template-columns:1fr auto !important;
gap:0 !important;
width:100% !important;
margin:0 !important;
}
.orilom-global-footer .orilom-guide-newsletter-form input[type="email"],
body.home .orilom-guide-newsletter-form input[type="email"]{
width:100% !important;
min-height:44px !important;
margin:0 !important;
padding:0 14px !important;
border:1px solid #3b3b3b !important;
border-right:0 !important;
border-radius:0 !important;
background:#151515 !important;
color:#fff !important;
font-size:11px !important;
box-shadow:none !important;
}
.orilom-global-footer .orilom-guide-newsletter-form input::placeholder,
body.home .orilom-guide-newsletter-form input::placeholder{
color:#727272 !important;
}
.orilom-global-footer .orilom-guide-newsletter-form button,
body.home .orilom-guide-newsletter-form button{
min-height:44px !important;
margin:0 !important;
padding:0 22px !important;
border:1px solid #dfb913 !important;
border-radius:0 !important;
background:#dfb913 !important;
color:#111 !important;
font-size:9px !important;
font-weight:900 !important;
letter-spacing:.10em !important;
cursor:pointer !important;
}
/* ---------- Trustbar global ---------- */
.orilom-global-footer .orilom-footer-trust,
body.home .orilom-footer-trust{
width:100% !important;
margin:0 !important;
padding:
14px
max(24px,calc((100vw - 1180px)/2))
!important;
display:grid !important;
grid-template-columns:repeat(3,1fr) !important;
gap:0 !important;
background:#0d0d0d !important;
border-top:1px solid rgba(216,179,0,.20) !important;
border-bottom:1px solid rgba(255,255,255,.06) !important;
}
.orilom-global-footer .orilom-footer-trust article,
body.home .orilom-footer-trust article{
position:relative !important;
min-height:72px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:12px !important;
margin:0 !important;
padding:10px 28px !important;
background:transparent !important;
border:0 !important;
}
.orilom-global-footer .orilom-footer-trust article:not(:last-child)::after,
body.home .orilom-footer-trust article:not(:last-child)::after{
content:"" !important;
position:absolute !important;
top:16px !important;
right:0 !important;
bottom:16px !important;
width:1px !important;
background:linear-gradient(to bottom,transparent,rgba(255,255,255,.13),transparent) !important;
}
.orilom-global-footer .orilom-footer-trust-icon,
body.home .orilom-footer-trust-icon{
width:32px !important;
min-width:32px !important;
height:32px !important;
display:grid !important;
place-items:center !important;
border:1px solid rgba(216,179,0,.58) !important;
border-radius:50% !important;
background:rgba(216,179,0,.035) !important;
color:#dfb913 !important;
font-size:12px !important;
}
.orilom-global-footer .orilom-footer-trust h3,
body.home .orilom-footer-trust h3{
margin:0 0 3px !important;
color:#f1eee6 !important;
font-size:12px !important;
line-height:1.2 !important;
font-weight:700 !important;
}
.orilom-global-footer .orilom-footer-trust p,
body.home .orilom-footer-trust p{
margin:0 !important;
color:#777 !important;
font-size:9px !important;
line-height:1.4 !important;
}
/* ---------- Footer principal GLOBAL ---------- */
.site-footer{
position:relative !important;
isolation:isolate !important;
width:100% !important;
max-width:none !important;
margin:0 !important;
padding:
36px
max(24px,calc((100vw - 1180px)/2))
18px !important;
display:grid !important;
grid-template-columns:minmax(250px,1.35fr) repeat(3,minmax(135px,1fr)) !important;
column-gap:54px !important;
row-gap:18px !important;
overflow:hidden !important;
background:
radial-gradient(circle at 12% 115%,rgba(216,179,0,.05),transparent 28%),
linear-gradient(180deg,#080808 0%,#060606 100%) !important;
color:#d7d7d7 !important;
border:0 !important;
border-top:1px solid rgba(255,255,255,.055) !important;
}
.site-footer::before{
content:"" !important;
position:absolute !important;
top:0 !important;
left:max(24px,calc((100vw - 1180px)/2)) !important;
right:max(24px,calc((100vw - 1180px)/2)) !important;
height:1px !important;
background:linear-gradient(90deg,transparent,rgba(216,179,0,.42),transparent) !important;
pointer-events:none !important;
}
.site-footer > div{
position:relative !important;
z-index:1 !important;
min-width:0 !important;
margin:0 !important;
padding:0 !important;
}
.site-footer .brand,
.site-footer .lux-brand{
color:#e0bc19 !important;
font-size:25px !important;
line-height:1 !important;
letter-spacing:.15em !important;
text-decoration:none !important;
}
.site-footer .brand span,
.site-footer .lux-brand span{
color:#e0bc19 !important;
}
.site-footer .brand small,
.site-footer .lux-brand small{
display:block !important;
margin-top:7px !important;
color:#e8e8e8 !important;
font-size:7.5px !important;
line-height:1.2 !important;
letter-spacing:.36em !important;
}
.site-footer h4{
margin:0 0 12px !important;
color:#f4f1e9 !important;
font:600 13px/1.2 Georgia,serif !important;
}
.site-footer > div:not(:first-child){
display:flex !important;
flex-direction:column !important;
gap:8px !important;
}
.site-footer a:not(.brand):not(.lux-brand){
position:relative !important;
width:max-content !important;
max-width:100% !important;
margin:0 !important;
padding:0 !important;
color:#d6d6d6 !important;
font-size:11px !important;
line-height:1.4 !important;
text-decoration:none !important;
}
.site-footer a:not(.brand):not(.lux-brand):hover{
color:#dfb913 !important;
}
.site-footer p{
max-width:290px !important;
margin:9px 0 0 !important;
color:#858585 !important;
font-size:9.5px !important;
line-height:1.55 !important;
}
.site-footer .copyright{
grid-column:1 / -1 !important;
width:100% !important;
max-width:none !important;
margin:4px 0 0 !important;
padding:14px 0 0 !important;
border-top:1px solid rgba(255,255,255,.09) !important;
color:#707070 !important;
font-size:9.5px !important;
line-height:1.45 !important;
}
/* ---------- Responsive ---------- */
@media(max-width:980px){
.orilom-global-footer .orilom-guide-newsletter,
body.home .orilom-guide-newsletter{
grid-template-columns:1fr !important;
text-align:center !important;
}
.orilom-global-footer .orilom-guide-newsletter-copy,
body.home .orilom-guide-newsletter-copy{
align-items:center !important;
}
.orilom-global-footer .orilom-footer-trust,
body.home .orilom-footer-trust{
grid-template-columns:1fr !important;
padding-left:28px !important;
padding-right:28px !important;
}
.orilom-global-footer .orilom-footer-trust article,
body.home .orilom-footer-trust article{
justify-content:flex-start !important;
padding:13px 0 !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
}
.orilom-global-footer .orilom-footer-trust article::after,
body.home .orilom-footer-trust article::after{
display:none !important;
}
.orilom-global-footer .orilom-footer-trust article:last-child,
body.home .orilom-footer-trust article:last-child{
border-bottom:0 !important;
}
.site-footer{
grid-template-columns:minmax(230px,1.25fr) repeat(2,minmax(140px,1fr)) !important;
column-gap:36px !important;
row-gap:28px !important;
}
.site-footer > div:nth-child(4){
grid-column:2 / -1 !important;
}
}
@media(max-width:700px){
.orilom-global-footer .lux-auth-premium .lux-auth-inner,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:calc(100% - 36px) !important;
padding:42px 0 34px !important;
}
.orilom-global-footer .lux-auth-premium h2,
body.home .lux-home-v5 .lux-auth-premium h2{
font-size:34px !important;
}
.orilom-global-footer .orilom-guide-newsletter-form,
body.home .orilom-guide-newsletter-form{
grid-template-columns:1fr !important;
gap:8px !important;
}
.orilom-global-footer .orilom-guide-newsletter-form input[type="email"],
body.home .orilom-guide-newsletter-form input[type="email"]{
border-right:1px solid #3b3b3b !important;
}
.site-footer{
grid-template-columns:1fr 1fr !important;
gap:28px 22px !important;
padding:34px 22px 18px !important;
}
.site-footer > div:first-child,
.site-footer .copyright{
grid-column:1 / -1 !important;
}
.site-footer > div:nth-child(4){
grid-column:auto !important;
}
}
@media(max-width:460px){
.site-footer{
grid-template-columns:1fr !important;
gap:24px !important;
padding-left:20px !important;
padding-right:20px !important;
}
.site-footer > div,
.site-footer > div:first-child,
.site-footer .copyright{
grid-column:1 !important;
}
}
/* =========================================================
ORILOM — FOOTER GLOBAL V2.1 — SUPPRESSION BANDE BLANCHE
Neutralise les anciens margin-top des pages internes.
========================================================= */
body.woocommerce-account .site-footer,
body.woocommerce-cart .site-footer,
body.blog .site-footer,
body.archive .site-footer,
body.single-product .site-footer,
body.post-type-archive-product .site-footer,
body.tax-product_cat .site-footer,
body.tax-product_brand .site-footer,
body.page .site-footer{
margin-top:0 !important;
margin-bottom:0 !important;
}
/* Supprime aussi tout espace externe résiduel entre trustbar et footer */
.orilom-global-footer{
margin-bottom:0 !important;
padding-bottom:0 !important;
}
.orilom-global-footer + .site-footer{
margin-top:0 !important;
}
/* Évite une ligne/bande blanche produite par un bloc vide intermédiaire */
.orilom-global-footer + br,
.orilom-global-footer + p:empty{
display:none !important;
}
/* =========================================================
ORILOM — PREFOOTER CTA GUIDE V2.2
Corrige le gros bloc jaune : CTA premium compact
========================================================= */
.orilom-global-footer .lux-auth-premium .lux-auth-inner > a,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a{
width:auto !important;
min-width:0 !important;
max-width:max-content !important;
min-height:0 !important;
height:auto !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
gap:8px !important;
margin:18px auto 0 !important;
padding:10px 15px !important;
border:1px solid rgba(216,179,0,.48) !important;
border-radius:999px !important;
background:
rgba(216,179,0,.045) !important;
color:#dfb913 !important;
box-shadow:none !important;
font-size:9px !important;
line-height:1 !important;
font-weight:900 !important;
letter-spacing:.10em !important;
text-decoration:none !important;
transition:
background .18s ease,
color .18s ease,
border-color .18s ease,
transform .18s ease !important;
}
.orilom-global-footer .lux-auth-premium .lux-auth-inner > a i,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a i{
display:inline-block !important;
margin:0 !important;
padding:0 !important;
color:inherit !important;
font-style:normal !important;
font-size:12px !important;
line-height:1 !important;
}
.orilom-global-footer .lux-auth-premium .lux-auth-inner > a:hover,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a:hover{
background:#dfb913 !important;
border-color:#dfb913 !important;
color:#111 !important;
transform:translateY(-1px) !important;
}
/* neutralise d'anciens pseudo-éléments / fonds de bouton */
.orilom-global-footer .lux-auth-premium .lux-auth-inner > a::before,
.orilom-global-footer .lux-auth-premium .lux-auth-inner > a::after,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a::before,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a::after{
content:none !important;
display:none !important;
}
@media(max-width:700px){
.orilom-global-footer .lux-auth-premium .lux-auth-inner > a,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a{
padding:10px 14px !important;
font-size:8.5px !important;
}
}
/* =========================================================
ORILOM — FOOTER GLOBAL V3 COMPACT PREMIUM
Réduit la hauteur globale d'environ 30–35 %
sans changer l'identité noir / or.
========================================================= */
/* ---------- Pré-footer : plus dense ---------- */
.orilom-global-footer .lux-auth-premium .lux-auth-inner,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:min(1120px,calc(100% - 48px)) !important;
padding:34px 0 24px !important;
}
.orilom-global-footer .lux-auth-premium .lux-auth-inner > span,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > span{
margin-bottom:8px !important;
font-size:8px !important;
}
.orilom-global-footer .lux-auth-premium h2,
body.home .lux-home-v5 .lux-auth-premium h2{
max-width:720px !important;
margin:0 auto 10px !important;
font-size:clamp(30px,3.2vw,42px) !important;
line-height:1.01 !important;
}
.orilom-global-footer .lux-auth-premium p,
body.home .lux-home-v5 .lux-auth-premium p{
max-width:620px !important;
font-size:10px !important;
line-height:1.5 !important;
}
/* CTA guide plus proche */
.orilom-global-footer .lux-auth-premium .lux-auth-inner > a,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner > a{
margin-top:12px !important;
padding:8px 13px !important;
font-size:8px !important;
}
/* ---------- Newsletter : compacte ---------- */
.orilom-global-footer .orilom-guide-newsletter,
body.home .orilom-guide-newsletter{
width:min(720px,100%) !important;
margin-top:18px !important;
padding-top:16px !important;
gap:18px !important;
}
.orilom-global-footer .orilom-guide-newsletter-copy strong,
body.home .orilom-guide-newsletter-copy strong{
font-size:10.5px !important;
}
.orilom-global-footer .orilom-guide-newsletter-copy small,
body.home .orilom-guide-newsletter-copy small{
font-size:8px !important;
}
.orilom-global-footer .orilom-guide-newsletter-form input[type="email"],
body.home .orilom-guide-newsletter-form input[type="email"],
.orilom-global-footer .orilom-guide-newsletter-form button,
body.home .orilom-guide-newsletter-form button{
min-height:38px !important;
}
.orilom-global-footer .orilom-guide-newsletter-form button,
body.home .orilom-guide-newsletter-form button{
padding:0 18px !important;
font-size:8px !important;
}
/* ---------- Trustbar : beaucoup plus basse ---------- */
.orilom-global-footer .orilom-footer-trust,
body.home .orilom-footer-trust{
padding:
8px
max(24px,calc((100vw - 1120px)/2))
!important;
}
.orilom-global-footer .orilom-footer-trust article,
body.home .orilom-footer-trust article{
min-height:54px !important;
padding:6px 22px !important;
gap:10px !important;
}
.orilom-global-footer .orilom-footer-trust article:not(:last-child)::after,
body.home .orilom-footer-trust article:not(:last-child)::after{
top:10px !important;
bottom:10px !important;
}
.orilom-global-footer .orilom-footer-trust-icon,
body.home .orilom-footer-trust-icon{
width:27px !important;
min-width:27px !important;
height:27px !important;
font-size:10px !important;
}
.orilom-global-footer .orilom-footer-trust h3,
body.home .orilom-footer-trust h3{
margin-bottom:2px !important;
font-size:10.5px !important;
}
.orilom-global-footer .orilom-footer-trust p,
body.home .orilom-footer-trust p{
font-size:7.5px !important;
line-height:1.3 !important;
}
/* ---------- Footer principal : plus compact ---------- */
.site-footer{
padding:
24px
max(24px,calc((100vw - 1120px)/2))
12px !important;
grid-template-columns:
minmax(230px,1.3fr)
repeat(3,minmax(120px,1fr))
!important;
column-gap:44px !important;
row-gap:12px !important;
}
.site-footer::before{
left:max(24px,calc((100vw - 1120px)/2)) !important;
right:max(24px,calc((100vw - 1120px)/2)) !important;
}
.site-footer .brand,
.site-footer .lux-brand{
font-size:22px !important;
}
.site-footer .brand small,
.site-footer .lux-brand small{
margin-top:5px !important;
font-size:6.5px !important;
}
.site-footer h4{
margin-bottom:8px !important;
font-size:11.5px !important;
}
.site-footer > div:not(:first-child){
gap:6px !important;
}
.site-footer a:not(.brand):not(.lux-brand){
font-size:9.5px !important;
line-height:1.35 !important;
}
.site-footer p{
max-width:270px !important;
margin-top:6px !important;
font-size:8px !important;
line-height:1.4 !important;
}
.site-footer .copyright{
margin-top:2px !important;
padding-top:10px !important;
font-size:8px !important;
line-height:1.35 !important;
}
/* ---------- Tablette ---------- */
@media(max-width:980px){
.orilom-global-footer .lux-auth-premium .lux-auth-inner,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
padding:30px 0 22px !important;
}
.orilom-global-footer .orilom-footer-trust article,
body.home .orilom-footer-trust article{
min-height:48px !important;
}
.site-footer{
padding-top:22px !important;
row-gap:20px !important;
}
}
/* ---------- Mobile ---------- */
@media(max-width:700px){
.orilom-global-footer .lux-auth-premium .lux-auth-inner,
body.home .lux-home-v5 .lux-auth-premium .lux-auth-inner{
width:calc(100% - 32px) !important;
padding:30px 0 22px !important;
}
.orilom-global-footer .lux-auth-premium h2,
body.home .lux-home-v5 .lux-auth-premium h2{
font-size:30px !important;
}
.orilom-global-footer .orilom-guide-newsletter,
body.home .orilom-guide-newsletter{
margin-top:15px !important;
padding-top:14px !important;
}
.orilom-global-footer .orilom-footer-trust,
body.home .orilom-footer-trust{
padding:6px 20px !important;
}
.orilom-global-footer .orilom-footer-trust article,
body.home .orilom-footer-trust article{
min-height:48px !important;
padding:8px 0 !important;
}
.site-footer{
gap:22px 18px !important;
padding:26px 20px 14px !important;
}
}
/* =========================================================
ORILOM — ACCOUNT DROPDOWN V16
Desktop large : s'ouvre vers la DROITE
Desktop moyen : sécurité anti-débordement
Mobile : bottom sheet 100% visible
========================================================= */
/* Le wrapper devient la vraie ancre du dropdown */
body .lux-header .header-tools .orilom-account-menu,
body.logged-in .lux-header .header-tools .orilom-account-menu{
position:relative !important;
overflow:visible !important;
}
/* ---------------------------------------------------------
GRAND DESKTOP
Le bord GAUCHE du panneau part du bord gauche du bouton.
Il se développe donc visuellement vers la droite.
--------------------------------------------------------- */
@media(min-width:1400px){
body .lux-header .header-tools
.orilom-account-menu
.orilom-account-dropdown,
body.logged-in .lux-header .header-tools
.orilom-account-menu
.orilom-account-dropdown{
top:calc(100% + 10px) !important;
left:0 !important;
right:auto !important;
width:238px !important;
max-width:min(238px,calc(100vw - 24px)) !important;
transform:none !important;
}
/* Triangle aligné au trigger, côté gauche du panneau */
body .lux-header .header-tools
.orilom-account-dropdown::before,
body.logged-in .lux-header .header-tools
.orilom-account-dropdown::before{
left:24px !important;
right:auto !important;
}
}
/* ---------------------------------------------------------
DESKTOP MOYEN 1101–1399
À ces largeurs le compte peut être trop proche du bord droit :
on inverse automatiquement pour garantir zéro débordement.
--------------------------------------------------------- */
@media(min-width:1101px) and (max-width:1399px){
body .lux-header .header-tools
.orilom-account-menu
.orilom-account-dropdown,
body.logged-in .lux-header .header-tools
.orilom-account-menu
.orilom-account-dropdown{
left:auto !important;
right:0 !important;
width:238px !important;
max-width:min(238px,calc(100vw - 24px)) !important;
}
body .lux-header .header-tools
.orilom-account-dropdown::before,
body.logged-in .lux-header .header-tools
.orilom-account-dropdown::before{
left:auto !important;
right:24px !important;
}
}
/* ---------------------------------------------------------
TABLETTE 721–1100
Dropdown ancré au compte mais toujours à l'intérieur écran.
--------------------------------------------------------- */
@media(min-width:721px) and (max-width:1100px){
body .lux-header .header-tools
.orilom-account-menu
.orilom-account-dropdown,
body.logged-in .lux-header .header-tools
.orilom-account-menu
.orilom-account-dropdown{
left:auto !important;
right:-4px !important;
width:230px !important;
max-width:calc(100vw - 24px) !important;
}
body .lux-header .header-tools
.orilom-account-dropdown::before,
body.logged-in .lux-header .header-tools
.orilom-account-dropdown::before{
left:auto !important;
right:18px !important;
}
}
/* ---------------------------------------------------------
MOBILE <=720
Bottom sheet : toujours visible, jamais hors écran.
--------------------------------------------------------- */
@media(max-width:720px){
body .lux-header .header-tools
.orilom-account-menu
.orilom-account-dropdown,
body.logged-in .lux-header .header-tools
.orilom-account-menu
.orilom-account-dropdown{
position:fixed !important;
top:auto !important;
left:12px !important;
right:12px !important;
bottom:
max(
12px,
env(safe-area-inset-bottom)
) !important;
width:auto !important;
max-width:none !important;
max-height:min(72vh,560px) !important;
overflow-x:hidden !important;
overflow-y:auto !important;
margin:0 !important;
border-radius:18px !important;
box-shadow:
0 24px 70px rgba(0,0,0,.28) !important;
}
body .lux-header .header-tools
.orilom-account-dropdown::before,
body.logged-in .lux-header .header-tools
.orilom-account-dropdown::before{
display:none !important;
content:none !important;
}
/* Touch targets confortables */
body .lux-header .header-tools
.orilom-account-dropdown a{
min-height:46px !important;
padding-left:14px !important;
padding-right:14px !important;
font-size:11px !important;
}
body .lux-header .header-tools
.orilom-account-dropdown
.orilom-account-dropdown-head{
padding:14px !important;
}
body .lux-header .header-tools
.orilom-account-dropdown
.orilom-account-dropdown-head strong{
font-size:13px !important;
}
}
/* =========================================================
ORILOM — HEADER MOBILE V17
Favoris + Panier + Compte toujours visibles
========================================================= */
@media(max-width:1100px){
/* 3 actions au lieu de 2 */
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:128px !important;
min-width:128px !important;
max-width:128px !important;
display:grid !important;
grid-template-columns:repeat(3,42px) !important;
gap:1px !important;
align-items:center !important;
justify-content:end !important;
overflow:visible !important;
}
/* Favoris + panier */
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link{
display:flex !important;
width:42px !important;
min-width:42px !important;
max-width:42px !important;
height:42px !important;
min-height:42px !important;
max-height:42px !important;
align-items:center !important;
justify-content:center !important;
}
/*
* IMPORTANT :
* neutralise l'ancien display:none du compte mobile.
*/
body .lux-header .header-tools > a.orilom-account-action{
display:flex !important;
width:42px !important;
min-width:42px !important;
max-width:42px !important;
height:42px !important;
min-height:42px !important;
max-height:42px !important;
align-items:center !important;
justify-content:center !important;
margin:0 !important;
padding:0 !important;
}
body .lux-header .header-tools .orilom-account-menu,
body.logged-in .lux-header .header-tools .orilom-account-menu,
body:not(.logged-in) .lux-header .header-tools .orilom-account-menu{
display:block !important;
position:relative !important;
width:42px !important;
min-width:42px !important;
max-width:42px !important;
height:42px !important;
min-height:42px !important;
max-height:42px !important;
margin:0 !important;
padding:0 !important;
overflow:visible !important;
}
body .lux-header .header-tools
.orilom-account-menu > a.orilom-account-link,
body.logged-in .lux-header .header-tools
.orilom-account-menu > a.orilom-account-link{
display:flex !important;
width:42px !important;
min-width:42px !important;
max-width:42px !important;
height:42px !important;
min-height:42px !important;
max-height:42px !important;
margin:0 !important;
padding:0 !important;
align-items:center !important;
justify-content:center !important;
border:1px solid transparent !important;
border-radius:9px !important;
background:transparent !important;
box-shadow:none !important;
font-size:0 !important;
line-height:0 !important;
}
body .lux-header .header-tools
.orilom-account-menu > a.orilom-account-link:hover{
background:#f6f6f3 !important;
border-color:#e8e8e3 !important;
}
/* L'icône Compte doit être aussi lisible que Favoris/Panier */
body .lux-header .header-tools
.orilom-account-menu .orilom-header-action-icon,
body .lux-header .header-tools
> a.orilom-account-action .orilom-header-action-icon{
display:flex !important;
width:19px !important;
min-width:19px !important;
height:19px !important;
align-items:center !important;
justify-content:center !important;
}
body .lux-header .header-tools
.orilom-account-menu .orilom-header-action-icon svg,
body .lux-header .header-tools
> a.orilom-account-action .orilom-header-action-icon svg{
display:block !important;
width:19px !important;
height:19px !important;
}
/* jamais de texte dans la barre mobile */
body .lux-header .header-tools
.orilom-account-menu .orilom-header-action-label,
body .lux-header .header-tools
> a.orilom-account-action .orilom-header-action-label{
display:none !important;
}
}
/* =========================================================
MOBILE <=720 : Compte ouvre le bottom-sheet V16
========================================================= */
@media(max-width:720px){
/*
* Le trigger reste dans la barre.
* Seul le dropdown devient fixed en bottom-sheet.
*/
body .lux-header .header-tools .orilom-account-menu{
position:relative !important;
display:block !important;
}
body .lux-header .header-tools
.orilom-account-menu .orilom-account-dropdown,
body.logged-in .lux-header .header-tools
.orilom-account-menu .orilom-account-dropdown{
position:fixed !important;
top:auto !important;
left:12px !important;
right:12px !important;
bottom:max(12px,env(safe-area-inset-bottom)) !important;
width:auto !important;
max-width:none !important;
max-height:min(72vh,560px) !important;
overflow-y:auto !important;
overflow-x:hidden !important;
margin:0 !important;
border-radius:18px !important;
z-index:1000000 !important;
box-shadow:
0 24px 70px rgba(0,0,0,.28) !important;
}
}
/* =========================================================
TRÈS PETIT MOBILE <=390
Garde les 3 actions sans écraser le logo.
========================================================= */
@media(max-width:390px){
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:108px !important;
min-width:108px !important;
max-width:108px !important;
grid-template-columns:repeat(3,35px) !important;
gap:1px !important;
}
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link,
body .lux-header .header-tools > a.orilom-account-action,
body .lux-header .header-tools .orilom-account-menu,
body .lux-header .header-tools
.orilom-account-menu > a.orilom-account-link{
width:35px !important;
min-width:35px !important;
max-width:35px !important;
height:40px !important;
min-height:40px !important;
max-height:40px !important;
}
body .lux-header .orilom-header-action-icon,
body .lux-header .header-tools
.orilom-account-menu .orilom-header-action-icon{
width:18px !important;
min-width:18px !important;
height:18px !important;
}
body .lux-header .orilom-header-action-icon svg,
body .lux-header .header-tools
.orilom-account-menu .orilom-header-action-icon svg{
width:18px !important;
height:18px !important;
}
}
/* =========================================================
ORILOM — HEADER MOBILE V18
Compte : vrai bottom-sheet mobile + spacing propre
========================================================= */
@media(max-width:720px){
/* Barre d'actions mobile : respiration à droite */
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:124px !important;
min-width:124px !important;
max-width:124px !important;
grid-template-columns:repeat(3,38px) !important;
gap:3px !important;
padding-right:4px !important;
overflow:visible !important;
}
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link,
body .lux-header .header-tools > a.orilom-account-action,
body .lux-header .header-tools .orilom-account-menu,
body .lux-header .header-tools
.orilom-account-menu > a.orilom-account-link{
width:38px !important;
min-width:38px !important;
max-width:38px !important;
height:40px !important;
min-height:40px !important;
max-height:40px !important;
}
/* Le wrapper reste dans le header */
body .lux-header .header-tools .orilom-account-menu,
body.logged-in .lux-header .header-tools .orilom-account-menu{
position:relative !important;
inset:auto !important;
transform:none !important;
display:block !important;
overflow:visible !important;
}
/*
* LE POINT IMPORTANT :
* force le dropdown en bottom-sheet,
* même si d'anciens styles top/right gagnent ailleurs.
*/
body .lux-header .header-tools
.orilom-account-menu > .orilom-account-dropdown,
body.logged-in .lux-header .header-tools
.orilom-account-menu > .orilom-account-dropdown,
body:not(.logged-in) .lux-header .header-tools
.orilom-account-menu > .orilom-account-dropdown{
position:fixed !important;
top:auto !important;
bottom:max(12px,env(safe-area-inset-bottom)) !important;
left:12px !important;
right:12px !important;
width:calc(100vw - 24px) !important;
min-width:0 !important;
max-width:calc(100vw - 24px) !important;
height:auto !important;
max-height:min(68vh,520px) !important;
margin:0 !important;
padding:10px !important;
overflow-x:hidden !important;
overflow-y:auto !important;
transform:none !important;
border:1px solid rgba(0,0,0,.08) !important;
border-radius:18px !important;
background:#fff !important;
box-shadow:
0 22px 70px rgba(0,0,0,.28),
0 0 0 1px rgba(255,255,255,.65) inset !important;
z-index:2147483000 !important;
}
/* Supprime toute flèche desktop */
body .lux-header .header-tools
.orilom-account-menu > .orilom-account-dropdown::before,
body .lux-header .header-tools
.orilom-account-menu > .orilom-account-dropdown::after{
content:none !important;
display:none !important;
}
/* Header du panneau */
body .lux-header .orilom-account-dropdown-head{
padding:12px 12px 10px !important;
margin:0 0 4px !important;
border-bottom:1px solid #eee !important;
}
body .lux-header .orilom-account-dropdown-head strong{
font-size:13px !important;
line-height:1.2 !important;
}
body .lux-header .orilom-account-dropdown-head small{
font-size:9px !important;
line-height:1.35 !important;
}
/* Items du menu : confort tactile */
body .lux-header .orilom-account-dropdown a{
width:100% !important;
min-height:44px !important;
display:flex !important;
align-items:center !important;
margin:0 !important;
padding:0 12px !important;
border-radius:10px !important;
font-size:10px !important;
line-height:1.2 !important;
white-space:nowrap !important;
}
body .lux-header .orilom-account-dropdown a:hover,
body .lux-header .orilom-account-dropdown a:active{
background:#f5f5f3 !important;
}
/* séparation déconnexion */
body .lux-header .orilom-account-dropdown
.orilom-account-logout{
margin-top:5px !important;
padding-top:0 !important;
border-top:1px solid #eee !important;
color:#9b2d2d !important;
}
/* icônes header bien centrées */
body .lux-header .header-tools
.orilom-header-action-icon,
body .lux-header .header-tools
.orilom-account-menu .orilom-header-action-icon{
width:18px !important;
min-width:18px !important;
height:18px !important;
}
body .lux-header .header-tools
.orilom-header-action-icon svg,
body .lux-header .header-tools
.orilom-account-menu .orilom-header-action-icon svg{
width:18px !important;
height:18px !important;
}
}
/* Très petit mobile */
@media(max-width:390px){
body .lux-header .header-tools,
body.logged-in .lux-header .header-tools,
body:not(.logged-in) .lux-header .header-tools{
width:108px !important;
min-width:108px !important;
max-width:108px !important;
grid-template-columns:repeat(3,34px) !important;
gap:2px !important;
padding-right:2px !important;
}
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link,
body .lux-header .header-tools > a.orilom-account-action,
body .lux-header .header-tools .orilom-account-menu,
body .lux-header .header-tools
.orilom-account-menu > a.orilom-account-link{
width:34px !important;
min-width:34px !important;
max-width:34px !important;
}
body .lux-header .header-tools
.orilom-account-menu > .orilom-account-dropdown{
left:8px !important;
right:8px !important;
width:calc(100vw - 16px) !important;
max-width:calc(100vw - 16px) !important;
bottom:max(8px,env(safe-area-inset-bottom)) !important;
border-radius:16px !important;
}
}
/* =========================================================
ORILOM — ACCOUNT MOBILE V19 FINAL UX
Mobile <=720 : icône Compte = navigation directe.
Aucun dropdown / bottom-sheet.
Desktop : comportement dropdown conservé.
========================================================= */
@media(max-width:720px){
/*
* L'icône Compte reste affichée dans la barre mobile.
*/
body .lux-header .header-tools .orilom-account-menu,
body.logged-in .lux-header .header-tools .orilom-account-menu,
body:not(.logged-in) .lux-header .header-tools .orilom-account-menu{
display:block !important;
position:relative !important;
overflow:visible !important;
}
body .lux-header .header-tools
.orilom-account-menu > a.orilom-account-link,
body.logged-in .lux-header .header-tools
.orilom-account-menu > a.orilom-account-link{
display:flex !important;
align-items:center !important;
justify-content:center !important;
}
/*
* Mais le dropdown n'existe VISUELLEMENT plus en mobile.
* Neutralise V16/V17/V18 et tous les anciens styles.
*/
body .lux-header .header-tools
.orilom-account-menu > .orilom-account-dropdown,
body.logged-in .lux-header .header-tools
.orilom-account-menu > .orilom-account-dropdown,
body:not(.logged-in) .lux-header .header-tools
.orilom-account-menu > .orilom-account-dropdown,
body .lux-header .header-tools
.orilom-account-menu.is-open > .orilom-account-dropdown,
body.logged-in .lux-header .header-tools
.orilom-account-menu.is-open > .orilom-account-dropdown{
display:none !important;
visibility:hidden !important;
opacity:0 !important;
pointer-events:none !important;
position:absolute !important;
inset:auto !important;
width:0 !important;
height:0 !important;
max-width:0 !important;
max-height:0 !important;
overflow:hidden !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
box-shadow:none !important;
transform:none !important;
}
/*
* Le trigger n'annonce plus visuellement un menu.
* Le JS laisse simplement suivre son href /mon-compte/.
*/
body .lux-header .header-tools
.orilom-account-menu > a.orilom-account-link{
cursor:pointer !important;
}
}
/* =========================================================
ORILOM — MON COMPTE V21 COMPACT BREADCRUMB
Supprime le grand vide + gros H1.
========================================================= */
/* Le contenu commence beaucoup plus près du header */
body.woocommerce-account .content-wrap.page-content{
padding-top:22px !important;
padding-bottom:64px !important;
}
/* Le gros titre devient un breadcrumb discret */
body.woocommerce-account
.content-wrap.page-content
> h1.orilom-account-breadcrumb-title,
body.woocommerce-account
.content-wrap.page-content
.entry-title.orilom-account-breadcrumb-title{
display:flex !important;
align-items:center !important;
flex-wrap:wrap !important;
gap:7px !important;
width:100% !important;
margin:0 0 17px !important;
padding:0 !important;
color:#777 !important;
font-family:Arial,sans-serif !important;
font-size:11px !important;
line-height:1.3 !important;
font-weight:600 !important;
letter-spacing:.01em !important;
}
/* neutralise d'anciens gros pseudo-titres */
body.woocommerce-account
.content-wrap.page-content
> h1.orilom-account-breadcrumb-title::before,
body.woocommerce-account
.content-wrap.page-content
> h1.orilom-account-breadcrumb-title::after,
body.woocommerce-account
.content-wrap.page-content
.entry-title.orilom-account-breadcrumb-title::before,
body.woocommerce-account
.content-wrap.page-content
.entry-title.orilom-account-breadcrumb-title::after{
content:none !important;
display:none !important;
}
body.woocommerce-account
.orilom-account-breadcrumb-home{
color:#777 !important;
font-size:11px !important;
font-weight:600 !important;
text-decoration:none !important;
transition:color .16s ease !important;
}
body.woocommerce-account
.orilom-account-breadcrumb-home:hover{
color:#b88f00 !important;
}
body.woocommerce-account
.orilom-account-breadcrumb-separator{
color:#c3a21a !important;
font-size:13px !important;
font-weight:700 !important;
}
body.woocommerce-account
.orilom-account-breadcrumb-current{
color:#111 !important;
font-size:11px !important;
font-weight:800 !important;
}
/*
* La grille commence directement après le breadcrumb.
* Pas de marge fantôme supplémentaire.
*/
body.woocommerce-account
.content-wrap.page-content
> .woocommerce{
margin-top:0 !important;
}
/* Desktop large : un peu plus serré sans toucher aux cartes */
@media(min-width:1101px){
body.woocommerce-account .content-wrap.page-content{
padding-top:20px !important;
}
body.woocommerce-account
.content-wrap.page-content
> h1.orilom-account-breadcrumb-title,
body.woocommerce-account
.content-wrap.page-content
.entry-title.orilom-account-breadcrumb-title{
margin-bottom:15px !important;
}
}
/* Mobile : breadcrumb compact sur une ligne si possible */
@media(max-width:780px){
body.woocommerce-account .content-wrap.page-content{
padding-top:14px !important;
padding-bottom:42px !important;
}
body.woocommerce-account
.content-wrap.page-content
> h1.orilom-account-breadcrumb-title,
body.woocommerce-account
.content-wrap.page-content
.entry-title.orilom-account-breadcrumb-title{
gap:5px !important;
margin-bottom:12px !important;
font-size:10px !important;
}
body.woocommerce-account
.orilom-account-breadcrumb-home,
body.woocommerce-account
.orilom-account-breadcrumb-current{
font-size:10px !important;
}
}
/* =========================================================
ORILOM — ACCOUNT V23 FINAL
GROS "MON COMPTE" SUPPRIMÉ
Petit fil d'Ariane dynamique juste sous le header
========================================================= */
/*
* IMPORTANT :
* Ce bloc doit rester TOUT EN BAS de theme.css.
* Il écrase les anciens blocs MY ACCOUNT HIERARCHY V6/V21.
*/
/* --- 1. Réduit la zone supérieure de la page compte --- */
html body.woocommerce-account div.content-wrap.page-content{
max-width:1480px !important;
width:calc(100% - 48px) !important;
margin:0 auto !important;
padding:14px 0 64px !important;
}
/* --- 2. Le H1 "Mon compte" ne doit PLUS être un grand titre --- */
html body.woocommerce-account
div.content-wrap.page-content > h1,
html body.woocommerce-account
div.content-wrap.page-content > .entry-title{
display:block !important;
width:100% !important;
min-height:0 !important;
margin:0 0 12px !important;
padding:0 !important;
color:transparent !important;
background:none !important;
font-family:Arial,Helvetica,sans-serif !important;
font-size:0 !important;
line-height:0 !important;
font-weight:400 !important;
letter-spacing:0 !important;
}
/* Enlève tout ancien contenu artificiel du H1 */
html body.woocommerce-account
div.content-wrap.page-content > h1::before,
html body.woocommerce-account
div.content-wrap.page-content > .entry-title::before{
content:none !important;
display:none !important;
}
/* --- 3. Breadcrumb par défaut : dashboard --- */
html body.woocommerce-account
div.content-wrap.page-content > h1::after,
html body.woocommerce-account
div.content-wrap.page-content > .entry-title::after{
content:"Mon compte › Vue d’ensemble" !important;
display:block !important;
width:max-content !important;
max-width:100% !important;
margin:0 !important;
padding:0 !important;
color:#707070 !important;
font-family:Arial,Helvetica,sans-serif !important;
font-size:11px !important;
line-height:1.35 !important;
font-weight:600 !important;
letter-spacing:.01em !important;
text-transform:none !important;
}
/* --- 4. Endpoints WooCommerce : texte dynamique --- */
/* Commandes */
html body.woocommerce-orders
div.content-wrap.page-content > h1::after,
html body.woocommerce-orders
div.content-wrap.page-content > .entry-title::after,
html body.woocommerce-account:has(.woocommerce-MyAccount-navigation-link--orders.is-active)
div.content-wrap.page-content > h1::after,
html body.woocommerce-account:has(.woocommerce-MyAccount-navigation-link--orders.is-active)
div.content-wrap.page-content > .entry-title::after{
content:"Mon compte › Mes commandes" !important;
}
/* Favoris */
html body.woocommerce-account:has(
[class*="woocommerce-MyAccount-navigation-link"][class*="favor"].is-active
)
div.content-wrap.page-content > h1::after,
html body.woocommerce-account:has(
[class*="woocommerce-MyAccount-navigation-link"][class*="favor"].is-active
)
div.content-wrap.page-content > .entry-title::after{
content:"Mon compte › Mes favoris" !important;
}
/* Factures / downloads */
html body.woocommerce-downloads
div.content-wrap.page-content > h1::after,
html body.woocommerce-downloads
div.content-wrap.page-content > .entry-title::after,
html body.woocommerce-account:has(.woocommerce-MyAccount-navigation-link--downloads.is-active)
div.content-wrap.page-content > h1::after,
html body.woocommerce-account:has(.woocommerce-MyAccount-navigation-link--downloads.is-active)
div.content-wrap.page-content > .entry-title::after{
content:"Mon compte › Mes factures" !important;
}
/* Adresses */
html body.woocommerce-edit-address
div.content-wrap.page-content > h1::after,
html body.woocommerce-edit-address
div.content-wrap.page-content > .entry-title::after,
html body.woocommerce-account:has(.woocommerce-MyAccount-navigation-link--edit-address.is-active)
div.content-wrap.page-content > h1::after,
html body.woocommerce-account:has(.woocommerce-MyAccount-navigation-link--edit-address.is-active)
div.content-wrap.page-content > .entry-title::after{
content:"Mon compte › Mes adresses" !important;
}
/* Informations */
html body.woocommerce-edit-account
div.content-wrap.page-content > h1::after,
html body.woocommerce-edit-account
div.content-wrap.page-content > .entry-title::after,
html body.woocommerce-account:has(.woocommerce-MyAccount-navigation-link--edit-account.is-active)
div.content-wrap.page-content > h1::after,
html body.woocommerce-account:has(.woocommerce-MyAccount-navigation-link--edit-account.is-active)
div.content-wrap.page-content > .entry-title::after{
content:"Mon compte › Mes informations" !important;
}
/* --- 5. SUPPRIME LE DEUXIÈME TITRE de l'ancien système V6 --- */
html body.woocommerce-account
div.woocommerce-MyAccount-content::before{
content:none !important;
display:none !important;
width:0 !important;
height:0 !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
background:none !important;
}
/* --- 6. Le dashboard monte immédiatement sous le breadcrumb --- */
html body.woocommerce-account
div.content-wrap.page-content > .woocommerce{
margin-top:0 !important;
padding-top:0 !important;
}
html body.woocommerce-account
.woocommerce-MyAccount-navigation,
html body.woocommerce-account
.woocommerce-MyAccount-content{
margin-top:0 !important;
}
/*
* Corrige aussi la grande respiration provoquée par les anciens blocs
* qui réservaient de la place au H1.
*/
html body.woocommerce-account
.content-wrap.page-content > h1 + .woocommerce,
html body.woocommerce-account
.content-wrap.page-content > .entry-title + .woocommerce{
margin-top:0 !important;
}
/* --- 7. Desktop : résultat très compact --- */
@media(min-width:1101px){
html body.woocommerce-account
div.content-wrap.page-content{
padding-top:12px !important;
}
html body.woocommerce-account
div.content-wrap.page-content > h1,
html body.woocommerce-account
div.content-wrap.page-content > .entry-title{
margin-bottom:10px !important;
}
}
/* --- 8. Mobile --- */
@media(max-width:780px){
html body.woocommerce-account
div.content-wrap.page-content{
width:calc(100% - 28px) !important;
padding:10px 0 40px !important;
}
html body.woocommerce-account
div.content-wrap.page-content > h1,
html body.woocommerce-account
div.content-wrap.page-content > .entry-title{
margin-bottom:9px !important;
}
html body.woocommerce-account
div.content-wrap.page-content > h1::after,
html body.woocommerce-account
div.content-wrap.page-content > .entry-title::after{
font-size:10px !important;
}
}
/* =========================================================
ORILOM — ACCOUNT V24 TRUE BREADCRUMB
- H1 "Mon compte" réellement supprimé
- breadcrumb créé sur le conteneur, pas sur le H1
- espace vertical fortement réduit
========================================================= */
/* 1) ZÉRO gros titre */
html body.woocommerce-account
.content-wrap.page-content > h1,
html body.woocommerce-account
.content-wrap.page-content > .entry-title{
display:none !important;
visibility:hidden !important;
width:0 !important;
height:0 !important;
min-height:0 !important;
max-height:0 !important;
margin:0 !important;
padding:0 !important;
overflow:hidden !important;
}
/* aucun ancien pseudo-titre ne peut revenir */
html body.woocommerce-account
.content-wrap.page-content > h1::before,
html body.woocommerce-account
.content-wrap.page-content > h1::after,
html body.woocommerce-account
.content-wrap.page-content > .entry-title::before,
html body.woocommerce-account
.content-wrap.page-content > .entry-title::after{
content:none !important;
display:none !important;
}
/* 2) CONTENEUR : rapproche réellement le dashboard du header */
html body.woocommerce-account
.content-wrap.page-content{
position:relative !important;
max-width:1480px !important;
width:calc(100% - 48px) !important;
margin:0 auto !important;
padding:12px 0 60px !important;
}
/* 3) LE PETIT BREADCRUMB EST CRÉÉ ICI */
html body.woocommerce-account
.content-wrap.page-content::before{
content:"Mon compte › Vue d’ensemble" !important;
display:block !important;
width:max-content !important;
max-width:100% !important;
margin:0 0 10px !important;
padding:0 !important;
color:#707070 !important;
font-family:Arial,Helvetica,sans-serif !important;
font-size:11px !important;
line-height:1.35 !important;
font-weight:600 !important;
letter-spacing:.01em !important;
background:none !important;
border:0 !important;
}
/* 4) BREADCRUMB DYNAMIQUE PAR ENDPOINT */
/* commandes */
html body.woocommerce-account:has(
.woocommerce-MyAccount-navigation-link--orders.is-active
)
.content-wrap.page-content::before{
content:"Mon compte › Mes commandes" !important;
}
/* favoris */
html body.woocommerce-account:has(
[class*="woocommerce-MyAccount-navigation-link"][class*="favor"].is-active
)
.content-wrap.page-content::before{
content:"Mon compte › Mes favoris" !important;
}
/* factures */
html body.woocommerce-account:has(
.woocommerce-MyAccount-navigation-link--downloads.is-active
)
.content-wrap.page-content::before{
content:"Mon compte › Mes factures" !important;
}
/* adresses */
html body.woocommerce-account:has(
.woocommerce-MyAccount-navigation-link--edit-address.is-active
)
.content-wrap.page-content::before{
content:"Mon compte › Mes adresses" !important;
}
/* informations */
html body.woocommerce-account:has(
.woocommerce-MyAccount-navigation-link--edit-account.is-active
)
.content-wrap.page-content::before{
content:"Mon compte › Mes informations" !important;
}
/* 5) supprime l'ancien titre de section V6 */
html body.woocommerce-account
.woocommerce-MyAccount-content::before{
content:none !important;
display:none !important;
width:0 !important;
height:0 !important;
margin:0 !important;
padding:0 !important;
background:none !important;
border:0 !important;
}
/* 6) la grille colle au breadcrumb */
html body.woocommerce-account
.content-wrap.page-content > .woocommerce{
margin:0 !important;
padding:0 !important;
}
html body.woocommerce-account
.woocommerce-MyAccount-navigation,
html body.woocommerce-account
.woocommerce-MyAccount-content{
margin-top:0 !important;
}
/* 7) Desktop : très compact */
@media(min-width:1101px){
html body.woocommerce-account
.content-wrap.page-content{
padding-top:10px !important;
}
html body.woocommerce-account
.content-wrap.page-content::before{
margin-bottom:9px !important;
}
}
/* 8) Mobile */
@media(max-width:780px){
html body.woocommerce-account
.content-wrap.page-content{
width:calc(100% - 28px) !important;
padding:8px 0 40px !important;
}
html body.woocommerce-account
.content-wrap.page-content::before{
margin-bottom:8px !important;
font-size:10px !important;
}
}
/* =========================================================
ORILOM — ACCOUNT V25.1 BREADCRUMB CLEAN FINAL
IMPORTANT :
- garde le vrai breadcrumb HTML créé par page.php
- neutralise tous les anciens breadcrumbs CSS V23/V24
========================================================= */
/* ---------------------------------------------------------
1) SUPPRIME DÉFINITIVEMENT LE FAUX BREADCRUMB V24
--------------------------------------------------------- */
html body.woocommerce-account
.content-wrap.page-content::before,
html body.woocommerce-account:has(
.woocommerce-MyAccount-navigation-link--orders.is-active
)
.content-wrap.page-content::before,
html body.woocommerce-account:has(
[class*="woocommerce-MyAccount-navigation-link"][class*="favor"].is-active
)
.content-wrap.page-content::before,
html body.woocommerce-account:has(
.woocommerce-MyAccount-navigation-link--downloads.is-active
)
.content-wrap.page-content::before,
html body.woocommerce-account:has(
.woocommerce-MyAccount-navigation-link--edit-address.is-active
)
.content-wrap.page-content::before,
html body.woocommerce-account:has(
.woocommerce-MyAccount-navigation-link--edit-account.is-active
)
.content-wrap.page-content::before{
content:none !important;
display:none !important;
width:0 !important;
height:0 !important;
margin:0 !important;
padding:0 !important;
}
/* ---------------------------------------------------------
2) BARRE NOIRE DU VRAI BREADCRUMB HTML
--------------------------------------------------------- */
html body.woocommerce-account
.orilom-account-breadcrumb-bar{
position:relative !important;
width:100% !important;
max-width:none !important;
min-height:34px !important;
margin:0 !important;
padding:0 !important;
display:block !important;
background:#0a0a0a !important;
border-top:1px solid #161616 !important;
border-bottom:1px solid #202020 !important;
box-shadow:none !important;
overflow:hidden !important;
}
/* contenu aligné avec le dashboard */
html body.woocommerce-account
.orilom-account-breadcrumb-inner{
width:calc(100% - 48px) !important;
max-width:1480px !important;
min-height:34px !important;
margin:0 auto !important;
padding:0 !important;
display:flex !important;
align-items:center !important;
justify-content:flex-start !important;
gap:7px !important;
}
/* ---------------------------------------------------------
3) LIENS
--------------------------------------------------------- */
html body.woocommerce-account
.orilom-account-breadcrumb-link{
display:inline-flex !important;
align-items:center !important;
width:auto !important;
min-height:34px !important;
margin:0 !important;
padding:0 !important;
color:#c8c8c8 !important;
background:transparent !important;
border:0 !important;
font-family:Arial,Helvetica,sans-serif !important;
font-size:10px !important;
line-height:1 !important;
font-weight:600 !important;
letter-spacing:.01em !important;
text-decoration:none !important;
white-space:nowrap !important;
transition:color .16s ease !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-link:hover{
color:#dfb913 !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-link.is-current{
color:#fff !important;
font-weight:800 !important;
}
/* Chevron */
html body.woocommerce-account
.orilom-account-breadcrumb-chevron{
display:inline-flex !important;
align-items:center !important;
color:#dfb913 !important;
font-size:13px !important;
line-height:1 !important;
font-weight:800 !important;
}
/* ---------------------------------------------------------
4) DASHBOARD JUSTE SOUS LA BARRE
--------------------------------------------------------- */
html body.woocommerce-account
.content-wrap.page-content{
width:calc(100% - 48px) !important;
max-width:1480px !important;
margin:0 auto !important;
padding-top:14px !important;
padding-bottom:60px !important;
}
/* aucun gros titre résiduel */
html body.woocommerce-account
.content-wrap.page-content > h1,
html body.woocommerce-account
.content-wrap.page-content > .entry-title{
display:none !important;
}
/* aucun ancien titre de section artificiel */
html body.woocommerce-account
.woocommerce-MyAccount-content::before{
content:none !important;
display:none !important;
}
/* ---------------------------------------------------------
5) MOBILE
--------------------------------------------------------- */
@media(max-width:780px){
html body.woocommerce-account
.orilom-account-breadcrumb-bar{
min-height:32px !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-inner{
width:calc(100% - 28px) !important;
min-height:32px !important;
gap:6px !important;
overflow-x:auto !important;
scrollbar-width:none !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-inner::-webkit-scrollbar{
display:none !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-link{
min-height:32px !important;
font-size:9px !important;
}
html body.woocommerce-account
.content-wrap.page-content{
width:calc(100% - 28px) !important;
padding-top:10px !important;
padding-bottom:40px !important;
}
}
/* =========================================================
ORILOM — ACCOUNT V27 — EXACT PRODUCT BAR MATCH
Reprend la structure et les proportions de .lux-product-bar
========================================================= */
/* Neutralise tous les anciens faux breadcrumbs */
html body.woocommerce-account
.content-wrap.page-content::before{
content:none !important;
display:none !important;
}
/* BARRE : mêmes proportions que la fiche produit */
html body.woocommerce-account
.orilom-account-breadcrumb-bar{
width:100% !important;
max-width:none !important;
min-height:0 !important;
margin:0 !important;
padding:
21px
max(3vw,calc((100vw - 1320px)/2))
!important;
display:flex !important;
align-items:center !important;
gap:12px !important;
background:var(--lux-gold,#dfb913) !important;
color:#4a3a00 !important;
border:0 !important;
border-radius:0 !important;
box-shadow:none !important;
font-family:Arial,Helvetica,sans-serif !important;
font-size:12px !important;
line-height:1 !important;
}
/* Partie gauche */
html body.woocommerce-account
.orilom-account-breadcrumb-left{
display:flex !important;
align-items:center !important;
gap:12px !important;
min-width:0 !important;
}
/* Partie droite : comme "Produit ORILOM · Paiement à la livraison" */
html body.woocommerce-account
.orilom-account-bar-meta{
margin-left:auto !important;
color:#4a3a00 !important;
font-size:12px !important;
line-height:1 !important;
font-weight:400 !important;
white-space:nowrap !important;
}
/* Liens breadcrumb : même discrétion que la barre produit */
html body.woocommerce-account
.orilom-account-breadcrumb-link{
display:inline-flex !important;
align-items:center !important;
min-height:0 !important;
margin:0 !important;
padding:0 !important;
color:#4a3a00 !important;
background:transparent !important;
border:0 !important;
font-family:Arial,Helvetica,sans-serif !important;
font-size:12px !important;
line-height:1 !important;
font-weight:400 !important;
text-decoration:none !important;
white-space:nowrap !important;
transition:color .15s ease !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-link:hover{
color:#111 !important;
}
/* Section active légèrement plus forte, sans gros contraste */
html body.woocommerce-account
.orilom-account-breadcrumb-link.is-current{
color:#3f3100 !important;
font-weight:600 !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-chevron{
display:inline-flex !important;
align-items:center !important;
color:#6d5700 !important;
font-size:12px !important;
line-height:1 !important;
font-weight:400 !important;
}
/* Le dashboard commence proprement après la barre */
html body.woocommerce-account
.content-wrap.page-content{
width:calc(100% - 48px) !important;
max-width:1480px !important;
margin:0 auto !important;
padding-top:24px !important;
padding-bottom:60px !important;
}
/* Aucun ancien gros titre */
html body.woocommerce-account
.content-wrap.page-content > h1,
html body.woocommerce-account
.content-wrap.page-content > .entry-title,
html body.woocommerce-account
.woocommerce-MyAccount-content::before{
content:none !important;
display:none !important;
}
/* ---------------------------------------------------------
TABLETTE
--------------------------------------------------------- */
@media(max-width:900px){
html body.woocommerce-account
.orilom-account-breadcrumb-bar{
padding:
16px
22px
!important;
font-size:11px !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-link,
html body.woocommerce-account
.orilom-account-bar-meta{
font-size:11px !important;
}
}
/* ---------------------------------------------------------
MOBILE
Identique au principe produit : breadcrumb reste lisible,
texte secondaire disparaît pour éviter le débordement.
--------------------------------------------------------- */
@media(max-width:650px){
html body.woocommerce-account
.orilom-account-breadcrumb-bar{
padding:
14px
18px
!important;
gap:8px !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-left{
gap:8px !important;
overflow-x:auto !important;
scrollbar-width:none !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-left::-webkit-scrollbar{
display:none !important;
}
html body.woocommerce-account
.orilom-account-bar-meta{
display:none !important;
}
html body.woocommerce-account
.orilom-account-breadcrumb-link{
font-size:10px !important;
}
html body.woocommerce-account
.content-wrap.page-content{
width:calc(100% - 28px) !important;
padding-top:16px !important;
padding-bottom:40px !important;
}
}
/* =========================================================
ORILOM — HOME V29 EDITORIAL RHYTHM
Rééquilibrage UI/UX du milieu/bas de Home.
Scope strict : body.home uniquement.
========================================================= */
/* ---------------------------------------------------------
1) RYTHME DES SECTIONS PRODUITS
Réduit le vide après la dernière collection.
--------------------------------------------------------- */
body.home .lux-home-v5 .lux-product-section-home{
padding-top:76px !important;
padding-bottom:72px !important;
}
body.home .lux-home-v5 .lux-niche-section{
padding-bottom:38px !important;
}
body.home .lux-home-v5 .lux-product-section-home > header{
margin-bottom:34px !important;
}
/* ---------------------------------------------------------
2) DOUBLE BANNIÈRE → CARTES ÉDITORIALES
Plus compactes, plus structurées, moins "blocs posés".
--------------------------------------------------------- */
body.home .lux-home-v5 .lux-split-banner-premium{
max-width:1320px !important;
margin:0 auto !important;
padding:26px 20px 26px !important;
display:grid !important;
grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr) !important;
gap:14px !important;
background:#fff !important;
}
body.home .lux-home-v5 .lux-split-banner-premium > .lux-split-card{
position:relative !important;
isolation:isolate !important;
min-height:280px !important;
display:flex !important;
flex-direction:column !important;
justify-content:space-between !important;
padding:32px 34px !important;
overflow:hidden !important;
border:1px solid rgba(0,0,0,.055) !important;
transition:
transform .22s ease,
box-shadow .22s ease,
border-color .22s ease !important;
}
body.home .lux-home-v5 .lux-split-banner-premium > .lux-split-card:hover{
transform:translateY(-3px) !important;
box-shadow:0 18px 42px rgba(0,0,0,.07) !important;
border-color:rgba(0,0,0,.10) !important;
}
body.home .lux-home-v5 .lux-split-card-niche{
background:
radial-gradient(circle at 90% 12%,rgba(255,255,255,.28),transparent 28%),
linear-gradient(135deg,#efe3c9 0%,#d2b878 100%) !important;
}
body.home .lux-home-v5 .lux-split-card-service{
background:
radial-gradient(circle at 88% 12%,rgba(255,255,255,.65),transparent 30%),
linear-gradient(135deg,#f3f3f3 0%,#dddddd 100%) !important;
}
body.home .lux-home-v5 .lux-split-card::after{
content:"O" !important;
position:absolute !important;
z-index:-1 !important;
right:24px !important;
bottom:-34px !important;
color:rgba(255,255,255,.20) !important;
font:700 150px/1 Georgia,serif !important;
letter-spacing:-.05em !important;
pointer-events:none !important;
}
body.home .lux-home-v5 .lux-split-card-top{
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:18px !important;
}
body.home .lux-home-v5 .lux-split-card-top > span{
color:#9b7800 !important;
font:800 9px/1 Arial,sans-serif !important;
letter-spacing:.18em !important;
}
body.home .lux-home-v5 .lux-split-card-top > small{
color:rgba(17,17,17,.38) !important;
font:700 10px/1 Arial,sans-serif !important;
letter-spacing:.12em !important;
}
body.home .lux-home-v5 .lux-split-card-body{
position:relative !important;
z-index:2 !important;
max-width:520px !important;
}
body.home .lux-home-v5 .lux-split-banner-premium h2{
margin:0 0 14px !important;
color:#111 !important;
font:500 clamp(31px,3vw,42px)/1.02 Georgia,serif !important;
letter-spacing:-.025em !important;
}
body.home .lux-home-v5 .lux-split-banner-premium p{
max-width:500px !important;
margin:0 !important;
color:#555 !important;
font:500 12px/1.65 Arial,sans-serif !important;
}
body.home .lux-home-v5 .lux-split-banner-premium a{
min-height:0 !important;
margin-top:22px !important;
padding:0 !important;
display:inline-flex !important;
align-items:center !important;
gap:8px !important;
border:0 !important;
border-bottom:1px solid #111 !important;
background:transparent !important;
color:#111 !important;
font:800 9px/1 Arial,sans-serif !important;
letter-spacing:.11em !important;
transition:
color .18s ease,
border-color .18s ease !important;
}
body.home .lux-home-v5 .lux-split-banner-premium a i{
font-style:normal !important;
transition:transform .18s ease !important;
}
body.home .lux-home-v5 .lux-split-banner-premium a:hover{
background:transparent !important;
color:#8d6d00 !important;
border-color:#8d6d00 !important;
}
body.home .lux-home-v5 .lux-split-banner-premium a:hover i{
transform:translateX(4px) !important;
}
/* ---------------------------------------------------------
3) JOURNAL : vraie transition éditoriale
--------------------------------------------------------- */
body.home .lux-home-v5 .lux-blog-premium{
margin:0 !important;
padding:
76px
max(24px,calc((100vw - 1280px)/2))
82px
!important;
background:#f7f7f6 !important;
border-top:1px solid #eeeeea !important;
}
body.home .lux-home-v5 .lux-blog-premium > .lux-blog-premium-head{
width:100% !important;
margin:0 0 38px !important;
padding:0 0 24px !important;
display:grid !important;
grid-template-columns:minmax(0,1fr) auto !important;
gap:36px !important;
align-items:end !important;
text-align:left !important;
border-bottom:1px solid #deded8 !important;
}
body.home .lux-home-v5 .lux-blog-premium-head > div{
max-width:720px !important;
}
body.home .lux-home-v5 .lux-blog-premium-head > div > span{
display:block !important;
margin-bottom:10px !important;
color:var(--lux-gold-dark,#b88f00) !important;
font:800 9px/1 Arial,sans-serif !important;
letter-spacing:.20em !important;
}
body.home .lux-home-v5 .lux-blog-premium h2{
margin:0 !important;
color:#111 !important;
font:600 clamp(34px,3.8vw,48px)/1.02 Georgia,serif !important;
letter-spacing:-.025em !important;
}
body.home .lux-home-v5 .lux-blog-premium-head p{
max-width:650px !important;
margin:14px 0 0 !important;
color:#6f6f6b !important;
font:500 11px/1.65 Arial,sans-serif !important;
}
body.home .lux-home-v5 .lux-blog-premium .lux-blog-all{
align-self:end !important;
display:inline-flex !important;
align-items:center !important;
gap:8px !important;
margin:0 0 4px !important;
padding:0 0 7px !important;
border:0 !important;
border-bottom:1px solid #111 !important;
color:#111 !important;
font:800 9px/1 Arial,sans-serif !important;
letter-spacing:.10em !important;
white-space:nowrap !important;
}
body.home .lux-home-v5 .lux-blog-premium .lux-blog-all i{
font-style:normal !important;
transition:transform .18s ease !important;
}
body.home .lux-home-v5 .lux-blog-premium .lux-blog-all:hover{
color:#9d7900 !important;
border-color:#9d7900 !important;
}
body.home .lux-home-v5 .lux-blog-premium .lux-blog-all:hover i{
transform:translateX(4px) !important;
}
/* Cartes blog : homogénéise leur densité */
body.home .lux-home-v5
.lux-blog-premium .orilom-blog-grid{
gap:18px !important;
}
body.home .lux-home-v5
.lux-blog-premium .orilom-blog-grid article{
min-height:210px !important;
padding:26px !important;
background:#fff !important;
border:0 !important;
border-top:2px solid var(--lux-gold,#dfb913) !important;
box-shadow:0 8px 26px rgba(0,0,0,.035) !important;
}
/* ---------------------------------------------------------
4) TRANSITION VERS LES GRANDES COLLECTIONS
Le Journal ne doit pas être suivi d'un autre énorme vide.
--------------------------------------------------------- */
body.home .lux-home-v5
.lux-blog-premium + .lux-categories-premium{
padding-top:58px !important;
}
/* ---------------------------------------------------------
5) TABLETTE
--------------------------------------------------------- */
@media(max-width:900px){
body.home .lux-home-v5 .lux-niche-section{
padding-bottom:28px !important;
}
body.home .lux-home-v5 .lux-split-banner-premium{
grid-template-columns:1fr !important;
padding:20px !important;
}
body.home .lux-home-v5
.lux-split-banner-premium > .lux-split-card{
min-height:250px !important;
}
body.home .lux-home-v5 .lux-blog-premium{
padding:64px 24px 68px !important;
}
body.home .lux-home-v5
.lux-blog-premium > .lux-blog-premium-head{
grid-template-columns:1fr !important;
gap:20px !important;
}
body.home .lux-home-v5
.lux-blog-premium .lux-blog-all{
justify-self:start !important;
}
}
/* ---------------------------------------------------------
6) MOBILE
--------------------------------------------------------- */
@media(max-width:650px){
body.home .lux-home-v5 .lux-product-section-home{
padding-top:54px !important;
padding-bottom:50px !important;
}
body.home .lux-home-v5 .lux-niche-section{
padding-bottom:18px !important;
}
body.home .lux-home-v5 .lux-split-banner-premium{
padding:14px !important;
gap:10px !important;
}
body.home .lux-home-v5
.lux-split-banner-premium > .lux-split-card{
min-height:225px !important;
padding:25px 22px !important;
}
body.home .lux-home-v5
.lux-split-banner-premium h2{
font-size:32px !important;
}
body.home .lux-home-v5 .lux-blog-premium{
padding:56px 18px 60px !important;
}
body.home .lux-home-v5
.lux-blog-premium > .lux-blog-premium-head{
margin-bottom:28px !important;
padding-bottom:20px !important;
}
body.home .lux-home-v5
.lux-blog-premium h2{
font-size:34px !important;
}
body.home .lux-home-v5
.lux-blog-premium-head p{
font-size:10px !important;
}
body.home .lux-home-v5
.lux-blog-premium + .lux-categories-premium{
padding-top:44px !important;
}
}
/* =========================================================
ORILOM — PRODUCT PAGE NORMALIZATION 2026-09
Scope strict : fiche produit uniquement.
Objectif : hiérarchie e-commerce claire, galerie contenue,
CTA + favoris au même niveau, responsive sans casser le catalogue.
========================================================= */
body.single-product .shop-content{
padding-bottom:72px;
}
body.single-product div.product{
max-width:1180px;
grid-template-columns:minmax(0,.92fr) minmax(430px,1.08fr);
gap:54px;
padding:42px 24px 0;
align-items:start;
}
body.single-product div.product div.images{
max-width:535px;
width:100%!important;
margin-inline:auto!important;
}
body.single-product .woocommerce-product-gallery__wrapper{
background:#fff;
}
body.single-product .woocommerce-product-gallery__image img{
width:100%;
aspect-ratio:1/1;
object-fit:contain;
max-height:535px;
}
body.single-product div.product div.images .flex-control-thumbs{
grid-template-columns:repeat(4,minmax(0,1fr));
gap:10px;
margin-top:12px!important;
}
body.single-product div.product div.images .flex-control-thumbs li img{
aspect-ratio:1/1;
object-fit:contain;
background:#fff;
border:1px solid #e7e7e7;
padding:5px;
}
body.single-product div.product div.summary{
max-width:560px;
width:100%!important;
padding-top:2px;
}
body.single-product div.product p.price{
font-size:17px!important;
line-height:1.25;
margin:0 0 16px;
}
body.single-product .product_title{
font:800 clamp(24px,2.2vw,30px)/1.16 Arial,sans-serif!important;
letter-spacing:-.015em;
margin:0 0 14px;
max-width:22ch;
}
body.single-product .woocommerce-product-details__short-description{
font-size:13px;
line-height:1.65;
max-width:62ch;
}
body.single-product .woocommerce-product-details__short-description p{
margin:0 0 11px;
}
body.single-product .orilom-notes{
padding:15px 0;
margin:16px 0;
}
body.single-product .orilom-notes>span{
margin-bottom:9px;
}
body.single-product .orilom-notes b{
padding:7px 11px;
font-size:10px;
}
body.single-product .orilom-cod-box{
margin:15px 0 14px;
padding:10px 13px;
}
body.single-product .orilom-cod-box strong{
font-size:12px;
line-height:1.35;
}
body.single-product .orilom-cod-box span{
font-size:9px;
line-height:1.45;
}
/* 1re ligne : quantité | Ajouter au panier | Favoris */
body.single-product div.product form.cart{
display:grid!important;
grid-template-columns:76px minmax(0,1fr) 154px!important;
gap:9px!important;
align-items:stretch;
padding:12px;
margin:16px 0 0!important;
background:#f7f7f7;
}
body.single-product div.product form.cart .quantity,
body.single-product div.product form.cart .qty,
body.single-product div.product form.cart .single_add_to_cart_button,
body.single-product div.product form.cart .orilom-wishlist-button{
min-height:50px;
height:50px;
}
body.single-product div.product form.cart .qty{
padding:0 8px;
text-align:center;
border:1px solid #d8d8d8;
}
body.single-product div.product form.cart .single_add_to_cart_button{
margin:0!important;
padding:0 18px!important;
display:inline-flex!important;
align-items:center;
justify-content:center;
font-size:10px!important;
letter-spacing:.12em!important;
white-space:nowrap;
}
body.single-product div.product form.cart .orilom-wishlist-button{
width:100%;
margin:0!important;
padding:0 12px;
display:inline-flex;
align-items:center;
justify-content:center;
box-sizing:border-box;
background:#fff;
border:1px solid #cfcfcf;
color:#222;
font-size:9px;
line-height:1.15;
font-weight:800;
letter-spacing:.035em;
text-transform:uppercase;
text-decoration:none;
white-space:nowrap;
}
body.single-product div.product form.cart .orilom-wishlist-button:hover,
body.single-product div.product form.cart .orilom-wishlist-button.is-active{
border-color:var(--lux-gold-dark);
background:#fff9dc;
color:#5f4b00;
}
/* Achat immédiat = accélérateur secondaire, sous le CTA principal. */
body.single-product div.product form.cart .lux-buy-now{
grid-column:2 / 4;
min-height:44px;
margin:0!important;
padding:0 16px!important;
display:inline-flex;
align-items:center;
justify-content:center;
font-size:9px!important;
letter-spacing:.11em!important;
}
body.single-product .orilom-product-trust{
margin-top:14px;
gap:7px;
}
body.single-product .orilom-product-trust span{
min-height:58px;
padding:10px 9px;
grid-template-columns:26px 1fr;
}
body.single-product .orilom-product-trust b{
font-size:17px;
}
body.single-product .orilom-product-trust strong{
font-size:9px;
}
body.single-product .orilom-product-trust small{
font-size:7px;
}
@media(max-width:900px){
body.single-product div.product{
max-width:720px;
grid-template-columns:1fr;
gap:28px;
padding-top:28px;
}
body.single-product div.product div.summary{
max-width:none;
}
body.single-product div.product div.images{
max-width:560px;
}
body.single-product .product_title{
max-width:none;
}
}
@media(max-width:560px){
body.single-product div.product{
padding:22px 14px 0;
}
body.single-product .product_title{
font-size:23px!important;
line-height:1.18!important;
}
body.single-product div.product p.price{
font-size:16px!important;
}
body.single-product div.product form.cart{
grid-template-columns:68px minmax(0,1fr) 50px!important;
gap:7px!important;
padding:9px;
}
body.single-product div.product form.cart .orilom-wishlist-button{
font-size:0;
padding:0;
}
body.single-product div.product form.cart .orilom-wishlist-button::before{
content:'♡';
font-size:24px;
line-height:1;
font-weight:400;
}
body.single-product div.product form.cart .orilom-wishlist-button.is-active::before{
content:'♥';
font-size:21px;
}
body.single-product div.product form.cart .lux-buy-now{
grid-column:1 / -1;
}
body.single-product .orilom-product-trust{
grid-template-columns:1fr 1fr;
}
body.single-product .orilom-product-trust span:last-child{
grid-column:1 / -1;
}
}
/* ORILOM FIX — WordPress body.search must never inherit legacy .search component layout */
body.search { display:block !important; width:auto !important; max-width:none !important; padding:0 !important; margin:0 !important; border:0 !important; gap:0 !important; align-items:initial !important; }
/* ======================================================================
ORILOM — PRODUCT PAGE 2026 / PARFUMERIE LUX HERITAGE, MODERNIZED
Scope strict: single-product only. Keeps catalogue/search untouched.
====================================================================== */
body.single-product .lux-product-bar{display:none!important}
body.single-product .shop-content{max-width:1180px!important;margin:0 auto!important;padding:34px 24px 76px!important}
body.single-product div.product{
max-width:1180px!important;margin:0 auto!important;padding:0!important;
display:grid!important;grid-template-columns:minmax(0,1.02fr) minmax(430px,.98fr)!important;
column-gap:54px!important;row-gap:48px!important;align-items:start!important
}
body.single-product div.product div.images,
body.single-product div.product div.summary{float:none!important;width:auto!important;margin:0!important}
/* Gallery: old-site vertical thumbnails + cleaner modern stage */
body.single-product div.product div.images{
display:grid!important;grid-template-columns:66px minmax(0,1fr)!important;
grid-template-rows:auto!important;gap:14px!important;align-items:start!important;position:relative!important
}
body.single-product div.product div.images .woocommerce-product-gallery__trigger{
top:12px!important;right:12px!important;left:auto!important;width:34px!important;height:34px!important;
border:1px solid #e5e5e5!important;background:#fff!important;box-shadow:0 6px 18px rgba(17,17,17,.07)!important
}
body.single-product div.product div.images .woocommerce-product-gallery__wrapper{
grid-column:2!important;grid-row:1!important;background:#fbfbfb!important;border:1px solid #f0f0f0!important;
min-height:470px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important
}
body.single-product div.product div.images .woocommerce-product-gallery__image,
body.single-product div.product div.images .woocommerce-product-gallery__image a{width:100%!important;display:block!important}
body.single-product div.product div.images .woocommerce-product-gallery__image img{
display:block!important;width:100%!important;height:470px!important;max-height:470px!important;
aspect-ratio:auto!important;object-fit:contain!important;padding:22px!important;background:#fbfbfb!important
}
body.single-product div.product div.images .flex-control-thumbs{
grid-column:1!important;grid-row:1!important;display:flex!important;flex-direction:column!important;
gap:10px!important;margin:0!important;padding:0!important
}
body.single-product div.product div.images .flex-control-thumbs li{float:none!important;width:58px!important;margin:0!important}
body.single-product div.product div.images .flex-control-thumbs li img{
width:58px!important;height:58px!important;object-fit:contain!important;background:#fff!important;
border:1px solid #e4e4e4!important;border-radius:0!important;padding:3px!important;opacity:.74!important
}
body.single-product div.product div.images .flex-control-thumbs li img.flex-active{
opacity:1!important;border-color:#d3a800!important;box-shadow:0 0 0 1px #d3a800 inset!important
}
body.single-product .onsale{
top:10px!important;left:80px!important;right:auto!important;min-width:auto!important;min-height:auto!important;
padding:6px 9px!important;border-radius:0!important;background:#111827!important;color:#fff!important;
font-size:10px!important;line-height:1!important;font-weight:800!important
}
/* Summary: old site's information density, updated spacing */
body.single-product div.product div.summary{padding:3px 0 0!important;position:static!important;background:transparent!important;border:0!important;box-shadow:none!important}
body.single-product div.product p.price{
margin:0 0 12px!important;color:#111!important;font-size:17px!important;line-height:1.2!important;font-weight:800!important
}
body.single-product div.product p.price del{font-size:14px!important;color:#9ca3af!important;margin-right:7px!important;opacity:1!important}
body.single-product div.product p.price ins{color:#111!important;text-decoration:none!important}
body.single-product .product_title{
margin:0 0 12px!important;color:#111827!important;font-family:Arial,Helvetica,sans-serif!important;
font-size:24px!important;line-height:1.16!important;font-weight:850!important;letter-spacing:-.015em!important;text-transform:uppercase!important
}
body.single-product .woocommerce-product-rating{margin:0 0 14px!important;font-size:11px!important}
body.single-product .woocommerce-product-details__short-description{
margin:0 0 14px!important;color:#666!important;font-size:12.5px!important;line-height:1.72!important;max-width:560px!important
}
body.single-product .orilom-notes{margin:14px 0!important;padding:13px 0!important;border-color:#ececec!important}
body.single-product .orilom-notes>span{margin-bottom:8px!important;font-size:9px!important;letter-spacing:.12em!important}
body.single-product .orilom-notes b{padding:6px 10px!important;font-size:9.5px!important;background:#fffaf0!important;border-color:#e9c95b!important}
/* COD note becomes a subtle one-line assurance, not a big block */
body.single-product .orilom-cod-box{
margin:13px 0 10px!important;padding:9px 11px!important;background:#fff!important;border:0!important;
border-left:2px solid #d9ad00!important;color:#444!important
}
body.single-product .orilom-cod-box strong{display:block!important;font-size:10px!important;line-height:1.25!important}
body.single-product .orilom-cod-box span{display:block!important;margin-top:3px!important;font-size:8px!important;color:#7b7b7b!important}
/* Three reassurance cards BEFORE the conversion controls, like old shop */
body.single-product .orilom-product-trust{
display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin:10px 0 11px!important
}
body.single-product .orilom-product-trust span{
min-height:54px!important;padding:8px 9px!important;border:1px solid #e7e0cc!important;border-radius:7px!important;background:#fff!important;
display:grid!important;grid-template-columns:24px 1fr!important;grid-template-rows:auto auto!important;align-items:center!important;text-align:left!important
}
body.single-product .orilom-product-trust b{grid-row:1/3!important;font-size:15px!important;color:#d2a500!important}
body.single-product .orilom-product-trust strong{font-size:8.5px!important;line-height:1.2!important;color:#333!important}
body.single-product .orilom-product-trust small{font-size:7.5px!important;line-height:1.2!important;color:#888!important}
/* Purchase zone: Qty / Add cart / Buy now in one line */
body.single-product div.product form.cart{
margin:0 0 8px!important;padding:11px!important;background:#f7f7f7!important;border:1px solid #ececec!important;
display:grid!important;grid-template-columns:86px minmax(155px,1fr) minmax(155px,.92fr)!important;gap:7px!important;align-items:stretch!important
}
body.single-product div.product form.cart .quantity{width:86px!important;height:44px!important;margin:0!important}
body.single-product div.product form.cart .qty{
width:86px!important;height:44px!important;min-height:44px!important;border:1px solid #d9d9d9!important;border-radius:0!important;
background:#fff!important;font-size:12px!important;text-align:center!important
}
body.single-product div.product form.cart .single_add_to_cart_button,
body.single-product div.product form.cart .lux-buy-now{
min-height:44px!important;height:44px!important;margin:0!important;padding:0 14px!important;border-radius:0!important;
display:flex!important;align-items:center!important;justify-content:center!important;font-size:9px!important;line-height:1.1!important;
font-weight:850!important;letter-spacing:.035em!important;text-transform:uppercase!important;box-shadow:none!important
}
body.single-product div.product form.cart .single_add_to_cart_button{background:#111!important;color:#fff!important}
body.single-product div.product form.cart .single_add_to_cart_button:hover{background:#242424!important;transform:none!important}
body.single-product div.product form.cart .lux-buy-now{grid-column:auto!important;background:#e2b600!important;color:#111!important}
body.single-product div.product form.cart .lux-buy-now:hover{background:#cfa600!important;color:#111!important}
/* Wishlist below controls = same hierarchy as old site, cleaner */
body.single-product .summary .orilom-wishlist-button{
width:auto!important;min-width:0!important;height:auto!important;min-height:0!important;margin:5px 0 9px!important;padding:4px 0!important;
border:0!important;background:transparent!important;color:#4b4b4b!important;border-radius:0!important;
display:inline-flex!important;align-items:center!important;gap:7px!important;font-size:9.5px!important;line-height:1.2!important;
font-weight:500!important;letter-spacing:0!important;text-transform:none!important;box-shadow:none!important
}
body.single-product .summary .orilom-wishlist-button::before{content:'♡'!important;font-size:17px!important;line-height:1!important}
body.single-product .summary .orilom-wishlist-button.is-active::before{content:'♥'!important;color:#d2a500!important}
body.single-product .summary .orilom-wishlist-button:hover{color:#111!important;background:transparent!important}
body.single-product .product_meta{margin-top:8px!important;padding-top:11px!important;border-top:1px solid #e9e9e9!important;color:#777!important;font-size:9px!important;line-height:1.8!important}
body.single-product .product_meta a{color:#555!important}
/* Tabs: old-site low profile, modern spacing */
body.single-product .woocommerce-tabs{grid-column:1/-1!important;margin:8px 0 0!important;padding:0!important;border:0!important;border-top:1px solid #e5e5e5!important;background:#fff!important}
body.single-product .woocommerce-tabs ul.tabs{
margin:0!important;padding:0!important;display:flex!important;justify-content:flex-start!important;gap:24px!important;border-bottom:1px solid #e5e5e5!important
}
body.single-product .woocommerce-tabs ul.tabs li{margin:0!important;padding:0!important;border:0!important;background:transparent!important}
body.single-product .woocommerce-tabs ul.tabs li a{padding:14px 0 12px!important;color:#444!important;font-size:11px!important;font-weight:500!important}
body.single-product .woocommerce-tabs ul.tabs li.active{border-bottom:2px solid #111!important}
body.single-product .woocommerce-tabs .panel{max-width:none!important;margin:24px 0 0!important;color:#555!important;font-size:12px!important;line-height:1.75!important}
body.single-product .woocommerce-tabs .panel h2{font-size:20px!important;line-height:1.25!important;color:#111!important}
body.single-product .related{grid-column:1/-1!important;max-width:none!important;margin-top:46px!important}
body.single-product .related>h2{font:700 28px/1.2 Arial,Helvetica,sans-serif!important;text-align:left!important;text-transform:uppercase!important}
@media(max-width:980px){
body.single-product .shop-content{padding:26px 20px 60px!important}
body.single-product div.product{grid-template-columns:1fr 1fr!important;gap:30px!important}
body.single-product div.product div.images{grid-template-columns:54px minmax(0,1fr)!important;gap:10px!important}
body.single-product div.product div.images .flex-control-thumbs li,
body.single-product div.product div.images .flex-control-thumbs li img{width:48px!important;height:48px!important}
body.single-product div.product div.images .woocommerce-product-gallery__wrapper{min-height:390px!important}
body.single-product div.product div.images .woocommerce-product-gallery__image img{height:390px!important;max-height:390px!important;padding:16px!important}
body.single-product div.product form.cart{grid-template-columns:76px 1fr!important}
body.single-product div.product form.cart .lux-buy-now{grid-column:1/-1!important}
body.single-product .orilom-product-trust{grid-template-columns:1fr!important}
}
@media(max-width:760px){
body.single-product .shop-content{padding:18px 15px 48px!important}
body.single-product div.product{grid-template-columns:1fr!important;gap:22px!important}
body.single-product div.product div.images{grid-template-columns:1fr!important;display:block!important}
body.single-product div.product div.images .woocommerce-product-gallery__wrapper{min-height:360px!important}
body.single-product div.product div.images .woocommerce-product-gallery__image img{height:360px!important;max-height:360px!important;padding:14px!important}
body.single-product div.product div.images .flex-control-thumbs{margin-top:9px!important;display:grid!important;grid-template-columns:repeat(4,58px)!important;gap:8px!important}
body.single-product div.product div.images .flex-control-thumbs li,
body.single-product div.product div.images .flex-control-thumbs li img{width:58px!important;height:58px!important}
body.single-product .product_title{font-size:22px!important}
body.single-product div.product form.cart{grid-template-columns:78px 1fr!important;padding:9px!important}
body.single-product div.product form.cart .lux-buy-now{grid-column:1/-1!important}
body.single-product .orilom-product-trust{grid-template-columns:repeat(3,minmax(0,1fr))!important;overflow-x:auto!important}
body.single-product .orilom-product-trust span{min-width:150px!important}
body.single-product .woocommerce-tabs ul.tabs{overflow-x:auto!important;gap:20px!important;white-space:nowrap!important}
}
@media(max-width:430px){
body.single-product div.product div.images .woocommerce-product-gallery__wrapper{min-height:315px!important}
body.single-product div.product div.images .woocommerce-product-gallery__image img{height:315px!important;max-height:315px!important}
body.single-product div.product form.cart{grid-template-columns:68px 1fr!important}
body.single-product div.product form.cart .quantity,
body.single-product div.product form.cart .qty{width:68px!important}
body.single-product .orilom-product-trust{display:flex!important;gap:7px!important}
}
/* ======================================================================
ORILOM PRODUCT V2 — desktop conversion row + gallery visibility fixes
====================================================================== */
@media (min-width:761px){
body.single-product div.product form.cart{
grid-template-columns:76px minmax(150px,1fr) minmax(150px,1fr)!important;
grid-template-rows:44px auto!important;
gap:8px!important;
}
body.single-product div.product form.cart .quantity{
grid-column:1!important;grid-row:1!important;
width:76px!important;
}
body.single-product div.product form.cart .qty{width:76px!important}
body.single-product div.product form.cart .single_add_to_cart_button{
grid-column:2!important;grid-row:1!important;
}
body.single-product div.product form.cart .lux-buy-now{
grid-column:3!important;grid-row:1!important;
}
body.single-product div.product form.cart .orilom-wishlist-button{
grid-column:1 / -1!important;grid-row:2!important;
justify-self:start!important;align-self:center!important;
margin:3px 0 0!important;
}
}
/* Keep the image stage clean and let product imagery use more of it. */
body.single-product div.product div.images .woocommerce-product-gallery__wrapper,
body.single-product div.product div.images .woocommerce-product-gallery__image,
body.single-product div.product div.images .woocommerce-product-gallery__image a{
overflow:hidden!important;
}
body.single-product div.product div.images .woocommerce-product-gallery__image img{
padding:10px!important;
}
/* Velours Oud source image contains unusually large white margins.
Product-specific visual correction without affecting the rest of the catalogue. */
body.single-product.postid-0 div.product div.images .woocommerce-product-gallery__image img{transform:none!important}
/* ======================================================================
ORILOM PRODUCT GALLERY V10 — NATIVE WOOCOMMERCE
Stable with WooCommerce 11.x / WordPress 7.x.
One source of truth: WooCommerce FlexSlider / Zoom / PhotoSwipe.
No duplicate custom stage, no hidden viewport, no competing gallery versions.
====================================================================== */
body.single-product div.product div.images.woocommerce-product-gallery{
display:block!important;
width:100%!important;
max-width:none!important;
min-width:0!important;
position:relative!important;
margin-bottom:0!important;
}
body.single-product div.product div.images .woocommerce-product-gallery__trigger{
top:14px!important;
right:14px!important;
left:auto!important;
z-index:20!important;
}
/* Multi-image products: WooCommerce/FlexSlider owns the moving strip. */
body.single-product div.product div.images .flex-viewport{
display:block!important;
width:100%!important;
max-width:none!important;
min-width:0!important;
height:500px!important;
min-height:500px!important;
max-height:500px!important;
margin:0!important;
overflow:hidden!important;
position:relative!important;
background:#fbfbfb!important;
border:1px solid #ededed!important;
}
body.single-product div.product div.images .flex-viewport .woocommerce-product-gallery__wrapper{
display:block!important;
height:100%!important;
min-height:100%!important;
margin:0!important;
padding:0!important;
background:transparent!important;
border:0!important;
overflow:visible!important;
/* Never override FlexSlider's inline width/transform. */
}
body.single-product div.product div.images .flex-viewport .woocommerce-product-gallery__image{
display:block!important;
float:left!important;
height:500px!important;
min-height:500px!important;
margin:0!important;
position:relative!important;
inset:auto!important;
opacity:1!important;
visibility:visible!important;
overflow:hidden!important;
}
body.single-product div.product div.images .flex-viewport .woocommerce-product-gallery__image > a{
display:flex!important;
width:100%!important;
height:100%!important;
align-items:center!important;
justify-content:center!important;
overflow:hidden!important;
}
body.single-product div.product div.images .flex-viewport .woocommerce-product-gallery__image img:not(.zoomImg){
display:block!important;
width:100%!important;
height:100%!important;
max-width:100%!important;
max-height:100%!important;
margin:0 auto!important;
padding:16px!important;
object-fit:contain!important;
object-position:center center!important;
background:#fbfbfb!important;
}
/* Single-image products: WooCommerce intentionally does not initialize FlexSlider. */
body.single-product div.product div.images:not(.flexslider) > .woocommerce-product-gallery__wrapper{
display:block!important;
width:100%!important;
max-width:none!important;
min-width:0!important;
height:500px!important;
min-height:500px!important;
max-height:500px!important;
margin:0!important;
padding:0!important;
overflow:hidden!important;
position:relative!important;
background:#fbfbfb!important;
border:1px solid #ededed!important;
}
body.single-product div.product div.images:not(.flexslider) > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image{
display:none!important;
float:none!important;
width:100%!important;
height:100%!important;
min-height:100%!important;
margin:0!important;
position:relative!important;
inset:auto!important;
opacity:1!important;
visibility:visible!important;
overflow:hidden!important;
}
body.single-product div.product div.images:not(.flexslider) > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-child{
display:block!important;
}
body.single-product div.product div.images:not(.flexslider) > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-child > a{
display:flex!important;
width:100%!important;
height:100%!important;
align-items:center!important;
justify-content:center!important;
overflow:hidden!important;
}
body.single-product div.product div.images:not(.flexslider) > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-child img:not(.zoomImg){
display:block!important;
width:100%!important;
height:100%!important;
max-width:100%!important;
max-height:100%!important;
margin:0 auto!important;
padding:16px!important;
object-fit:contain!important;
object-position:center center!important;
background:#fbfbfb!important;
}
/* Native thumbnails: centered below the main stage. */
body.single-product div.product div.images .flex-control-thumbs{
width:100%!important;
margin:9px 0 0!important;
padding:0!important;
display:flex!important;
flex-direction:row!important;
align-items:center!important;
justify-content:center!important;
gap:8px!important;
overflow-x:auto!important;
overflow-y:hidden!important;
list-style:none!important;
scrollbar-width:none!important;
}
body.single-product div.product div.images .flex-control-thumbs::-webkit-scrollbar{display:none!important}
body.single-product div.product div.images .flex-control-thumbs li{
flex:0 0 66px!important;
width:66px!important;
height:66px!important;
margin:0!important;
float:none!important;
}
body.single-product div.product div.images .flex-control-thumbs li img{
display:block!important;
width:66px!important;
height:66px!important;
padding:4px!important;
object-fit:contain!important;
border:1px solid #ddd!important;
border-radius:4px!important;
background:#fff!important;
opacity:.74!important;
cursor:pointer!important;
box-shadow:none!important;
transition:opacity .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease!important;
}
body.single-product div.product div.images .flex-control-thumbs li img:hover{
opacity:1!important;
transform:translateY(-1px)!important;
}
body.single-product div.product div.images .flex-control-thumbs li img.flex-active{
opacity:1!important;
border-color:var(--lux-gold,#dfb913)!important;
box-shadow:0 0 0 1px var(--lux-gold,#dfb913),0 5px 13px rgba(223,185,19,.08)!important;
}
@media(max-width:760px){
body.single-product div.product div.images .flex-viewport,
body.single-product div.product div.images:not(.flexslider) > .woocommerce-product-gallery__wrapper{
height:420px!important;min-height:420px!important;max-height:420px!important
}
body.single-product div.product div.images .flex-viewport .woocommerce-product-gallery__image{
height:420px!important;min-height:420px!important
}
body.single-product div.product div.images .flex-control-thumbs{
justify-content:flex-start!important;
gap:8px!important;
}
body.single-product div.product div.images .flex-control-thumbs li,
body.single-product div.product div.images .flex-control-thumbs li img{
width:60px!important;height:60px!important;flex-basis:60px!important
}
}
@media(max-width:430px){
body.single-product div.product div.images .flex-viewport,
body.single-product div.product div.images:not(.flexslider) > .woocommerce-product-gallery__wrapper{
height:355px!important;min-height:355px!important;max-height:355px!important
}
body.single-product div.product div.images .flex-viewport .woocommerce-product-gallery__image{
height:355px!important;min-height:355px!important
}
}
/* =========================================================
ORILOM — ONGLET PRODUIT ACTIF / UI UX
Met clairement en évidence la section actuellement ouverte.
========================================================= */
body.single-product .woocommerce-tabs ul.tabs li {
background: transparent !important;
border: 0 !important;
margin: 0 4px 0 0 !important;
transition: background .2s ease, color .2s ease, border-color .2s ease !important;
}
body.single-product .woocommerce-tabs ul.tabs li a {
display: block !important;
padding: 12px 16px !important;
color: #666 !important;
font-weight: 500 !important;
border-radius: 5px 5px 0 0 !important;
transition: background .2s ease, color .2s ease !important;
}
body.single-product .woocommerce-tabs ul.tabs li.active {
background: #fff8d8 !important;
border-bottom: 3px solid #d3a800 !important;
}
body.single-product .woocommerce-tabs ul.tabs li.active a {
color: #111 !important;
font-weight: 700 !important;
}
body.single-product .woocommerce-tabs ul.tabs li:not(.active):hover {
background: #f7f7f7 !important;
}
body.single-product .woocommerce-tabs ul.tabs li:not(.active):hover a {
color: #111 !important;
}
@media (max-width: 760px) {
body.single-product .woocommerce-tabs ul.tabs li {
flex: 0 0 auto !important;
}
body.single-product .woocommerce-tabs ul.tabs li a {
padding: 10px 12px !important;
white-space: nowrap !important;
}
}
/* =========================================================
ORILOM — PRODUCT TABS PREMIUM UI
========================================================= */
body.single-product .woocommerce-tabs{
margin-top:48px!important;
padding:0!important;
border:0!important;
border-top:1px solid #ececec!important;
background:#fff!important;
}
body.single-product .woocommerce-tabs ul.tabs{
display:flex!important;
align-items:center!important;
justify-content:flex-start!important;
gap:8px!important;
margin:0!important;
padding:12px 0 0!important;
border:0!important;
border-bottom:1px solid #ececec!important;
background:transparent!important;
overflow-x:auto!important;
scrollbar-width:none;
}
body.single-product .woocommerce-tabs ul.tabs::-webkit-scrollbar{
display:none;
}
body.single-product .woocommerce-tabs ul.tabs::before,
body.single-product .woocommerce-tabs ul.tabs::after{
display:none!important;
}
body.single-product .woocommerce-tabs ul.tabs li{
position:relative!important;
margin:0!important;
padding:0!important;
border:0!important;
border-radius:8px 8px 0 0!important;
background:transparent!important;
box-shadow:none!important;
transition:
background-color .2s ease,
color .2s ease,
transform .2s ease!important;
}
body.single-product .woocommerce-tabs ul.tabs li::before,
body.single-product .woocommerce-tabs ul.tabs li::after{
display:none!important;
}
body.single-product .woocommerce-tabs ul.tabs li a{
display:flex!important;
align-items:center!important;
justify-content:center!important;
min-height:46px!important;
padding:0 20px!important;
color:#666!important;
font-size:11px!important;
line-height:1!important;
font-weight:600!important;
letter-spacing:.01em!important;
text-decoration:none!important;
white-space:nowrap!important;
border:0!important;
border-radius:8px 8px 0 0!important;
transition:
color .2s ease,
background-color .2s ease!important;
}
body.single-product .woocommerce-tabs ul.tabs li:not(.active):hover{
background:#f7f7f7!important;
}
body.single-product .woocommerce-tabs ul.tabs li:not(.active):hover a{
color:#111!important;
}
body.single-product .woocommerce-tabs ul.tabs li.active{
background:#fff8dc!important;
}
body.single-product .woocommerce-tabs ul.tabs li.active a{
color:#111!important;
font-weight:800!important;
}
body.single-product .woocommerce-tabs ul.tabs li.active::after{
content:""!important;
display:block!important;
position:absolute!important;
left:14px!important;
right:14px!important;
bottom:-1px!important;
height:3px!important;
background:#d3a800!important;
border-radius:3px 3px 0 0!important;
}
body.single-product .woocommerce-tabs .panel{
max-width:none!important;
margin:0!important;
padding:28px 0 10px!important;
color:#555!important;
line-height:1.75!important;
}
body.single-product .woocommerce-tabs .panel h2{
margin-top:0!important;
color:#111!important;
font-size:22px!important;
line-height:1.25!important;
}
@media(max-width:760px){
body.single-product .woocommerce-tabs{
margin-top:36px!important;
}
body.single-product .woocommerce-tabs ul.tabs{
gap:5px!important;
padding-top:9px!important;
}
body.single-product .woocommerce-tabs ul.tabs li a{
min-height:42px!important;
padding:0 15px!important;
font-size:10px!important;
}
body.single-product .woocommerce-tabs .panel{
padding-top:22px!important;
}
}
/* =========================================================
ORILOM — PRODUCT TABS ACTIVE CLEAN FIX
Supprime le bloc arrondi/grisé de l'onglet actif.
L'état actif est indiqué uniquement par texte + trait doré.
========================================================= */
body.single-product .woocommerce-tabs ul.tabs li,
body.single-product .woocommerce-tabs ul.tabs li.active,
body.single-product .woocommerce-tabs ul.tabs li:hover{
background:transparent!important;
border-radius:0!important;
box-shadow:none!important;
}
body.single-product .woocommerce-tabs ul.tabs li a,
body.single-product .woocommerce-tabs ul.tabs li.active a{
background:transparent!important;
border-radius:0!important;
box-shadow:none!important;
}
body.single-product .woocommerce-tabs ul.tabs li.active a{
color:#111!important;
font-weight:800!important;
}
body.single-product .woocommerce-tabs ul.tabs li.active::after{
left:12px!important;
right:12px!important;
bottom:-1px!important;
height:2px!important;
background:#d3a800!important;
border-radius:0!important;
}
body.single-product .woocommerce-tabs ul.tabs li:not(.active):hover{
background:#fafafa!important;
}
body.single-product .woocommerce-tabs ul.tabs li:not(.active):hover a{
color:#111!important;
}
/* =========================================================
ORILOM — PRODUCT TABS FINAL CLEAN
Remove WooCommerce legacy tab corner pseudo-elements.
Active state uses an inset gold line, not ::before/::after.
========================================================= */
/* WooCommerce injects decorative bottom-corner pseudo-elements on tabs.
Disable them completely with a stronger selector. */
body.single-product.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
body.single-product.woocommerce div.product .woocommerce-tabs ul.tabs li::after,
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li::before,
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li::after,
body.single-product div.product .woocommerce-tabs ul.tabs li::before,
body.single-product div.product .woocommerce-tabs ul.tabs li::after{
content:none!important;
display:none!important;
width:0!important;
height:0!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
background:none!important;
}
/* Remove every legacy visual effect on the tab itself. */
body.single-product div.product .woocommerce-tabs ul.tabs li,
body.single-product div.product .woocommerce-tabs ul.tabs li.active,
body.single-product div.product .woocommerce-tabs ul.tabs li:hover{
background:transparent!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
overflow:visible!important;
}
/* The anchor owns the active indicator. No pseudo-element is used. */
body.single-product div.product .woocommerce-tabs ul.tabs li a{
background:transparent!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
outline:0!important;
}
body.single-product div.product .woocommerce-tabs ul.tabs li.active a{
color:#111!important;
font-weight:800!important;
box-shadow:inset 0 -3px 0 #d3a800!important;
}
/* Clean hover without rounded grey blocks. */
body.single-product div.product .woocommerce-tabs ul.tabs li:not(.active):hover,
body.single-product div.product .woocommerce-tabs ul.tabs li:not(.active):hover a{
background:transparent!important;
border-radius:0!important;
box-shadow:none!important;
}
body.single-product div.product .woocommerce-tabs ul.tabs li:not(.active):hover a{
color:#111!important;
}
/* Remove WooCommerce tab-list generated borders/shadows that can look like
a grey rounded artefact beneath the active underline. */
body.single-product div.product .woocommerce-tabs ul.tabs::before,
body.single-product div.product .woocommerce-tabs ul.tabs::after{
content:none!important;
display:none!important;
border:0!important;
box-shadow:none!important;
}
body.single-product div.product .woocommerce-tabs ul.tabs{
border-radius:0!important;
box-shadow:none!important;
}
/* =========================================================
ORILOM — BARRE JAUNE FICHE PRODUIT
Même langage UI que Mon compte + Boutique.
========================================================= */
/* Annule l'ancien masquage de la barre produit. */
body.single-product .lux-product-bar,
body.single-product .orilom-product-breadcrumb-bar{
display:flex!important;
}
/* Barre pleine largeur sous le header */
body.single-product .orilom-product-breadcrumb-bar{
width:100%!important;
max-width:none!important;
min-height:0!important;
margin:0!important;
padding:21px max(3vw,calc((100vw - 1320px)/2))!important;
align-items:center!important;
gap:12px!important;
background:var(--lux-gold,#dfb913)!important;
color:#4a3a00!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:12px!important;
line-height:1!important;
}
body.single-product .orilom-product-breadcrumb-left{
display:flex!important;
align-items:center!important;
gap:12px!important;
min-width:0!important;
}
body.single-product .orilom-product-breadcrumb-bar a{
display:inline-flex!important;
align-items:center!important;
margin:0!important;
padding:0!important;
color:#4a3a00!important;
background:transparent!important;
border:0!important;
font-size:12px!important;
line-height:1!important;
font-weight:400!important;
text-decoration:none!important;
white-space:nowrap!important;
}
body.single-product .orilom-product-breadcrumb-bar a:hover{
color:#111!important;
}
body.single-product .orilom-product-breadcrumb-bar .orilom-product-current{
display:block!important;
max-width:min(38vw,430px)!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
color:#3f3100!important;
font-weight:600!important;
}
body.single-product .orilom-product-breadcrumb-bar .lux-product-nav{
margin-left:auto!important;
color:#4a3a00!important;
font-size:12px!important;
line-height:1!important;
font-weight:400!important;
white-space:nowrap!important;
}
/* La fiche démarre juste sous la barre, avec une respiration cohérente. */
body.single-product .orilom-product-breadcrumb-bar + div.product{
padding-top:42px!important;
}
@media(max-width:900px){
body.single-product .orilom-product-breadcrumb-bar{
padding:16px 22px!important;
}
body.single-product .orilom-product-breadcrumb-bar a,
body.single-product .orilom-product-breadcrumb-bar .lux-product-nav{
font-size:11px!important;
}
body.single-product .orilom-product-breadcrumb-bar + div.product{
padding-top:30px!important;
}
}
@media(max-width:650px){
body.single-product .orilom-product-breadcrumb-bar{
padding:14px 18px!important;
gap:8px!important;
}
body.single-product .orilom-product-breadcrumb-left{
gap:8px!important;
overflow-x:auto!important;
scrollbar-width:none!important;
}
body.single-product .orilom-product-breadcrumb-left::-webkit-scrollbar{
display:none!important;
}
body.single-product .orilom-product-breadcrumb-bar .lux-product-nav{
display:none!important;
}
body.single-product .orilom-product-breadcrumb-bar a,
body.single-product .orilom-product-breadcrumb-bar .orilom-product-current{
font-size:10px!important;
}
body.single-product .orilom-product-breadcrumb-bar .orilom-product-current{
max-width:none!important;
overflow:visible!important;
text-overflow:clip!important;
}
}
/* =========================================================
ORILOM — PRODUCT YELLOW BAR FULL BLEED
La bande jaune sort du conteneur produit et prend 100% viewport.
========================================================= */
body.single-product .orilom-product-breadcrumb-bar{
position:relative!important;
left:50%!important;
right:50%!important;
width:100vw!important;
max-width:100vw!important;
margin-left:-50vw!important;
margin-right:-50vw!important;
box-sizing:border-box!important;
}
/* Empêche un éventuel scroll horizontal dû au full-bleed */
html, body{
max-width:100%!important;
overflow-x:hidden!important;
}
/* =========================================================
ORILOM — ESPACE SOUS LA BANDE JAUNE PRODUIT
Ajoute une respiration visuelle avant la fiche produit.
========================================================= */
body.single-product .orilom-product-breadcrumb-bar{
margin-bottom:24px!important;
}
@media(max-width:900px){
body.single-product .orilom-product-breadcrumb-bar{
margin-bottom:18px!important;
}
}
@media(max-width:650px){
body.single-product .orilom-product-breadcrumb-bar{
margin-bottom:14px!important;
}
}
/* =========================================================
ORILOM — HOME WISHLIST = SHOP WISHLIST
Force exactement le même coeur rond que dans la boutique.
========================================================= */
body.home .woocommerce ul.products li.product{
position:relative!important;
}
body.home .woocommerce ul.products li.product .orilom-wishlist-button{
position:absolute!important;
z-index:50!important;
top:11px!important;
right:11px!important;
left:auto!important;
bottom:auto!important;
display:grid!important;
place-items:center!important;
width:34px!important;
min-width:34px!important;
max-width:34px!important;
height:34px!important;
min-height:34px!important;
max-height:34px!important;
margin:0!important;
padding:0!important;
overflow:hidden!important;
border:1px solid #eee!important;
border-radius:50%!important;
background:#fff!important;
color:transparent!important;
font-size:0!important;
line-height:0!important;
text-indent:-9999px!important;
white-space:nowrap!important;
box-shadow:0 5px 16px rgba(0,0,0,.12)!important;
transform:none!important;
}
body.home .woocommerce ul.products li.product .orilom-wishlist-button::before{
content:"♥"!important;
position:static!important;
display:block!important;
width:auto!important;
height:auto!important;
margin:0!important;
padding:0!important;
color:#d2ad25!important;
background:none!important;
border:0!important;
font-family:Arial,sans-serif!important;
font-size:17px!important;
font-weight:400!important;
line-height:1!important;
text-indent:0!important;
transform:none!important;
}
body.home .woocommerce ul.products li.product .orilom-wishlist-button::after{
content:none!important;
display:none!important;
}
body.home .woocommerce ul.products li.product .orilom-wishlist-button:hover,
body.home .woocommerce ul.products li.product .orilom-wishlist-button:focus-visible{
transform:scale(1.08)!important;
border-color:#ddc36a!important;
box-shadow:0 7px 20px rgba(0,0,0,.16)!important;
outline:none!important;
}
body.home .woocommerce ul.products li.product .orilom-wishlist-button.is-active{
background:#fffaf0!important;
border-color:#d5b33d!important;
}
body.home .woocommerce ul.products li.product .orilom-wishlist-button.is-active::before{
content:"♥"!important;
color:#d2ad25!important;
}
/* Mobile : même taille, zone tactile propre */
@media(max-width:760px){
body.home .woocommerce ul.products li.product .orilom-wishlist-button{
width:34px!important;
min-width:34px!important;
max-width:34px!important;
height:34px!important;
min-height:34px!important;
max-height:34px!important;
top:9px!important;
right:9px!important;
}
}
/* =========================================================
ORILOM — HOME HEART VISUAL SIZE MATCH SHOP
Le coeur Home paraissait plus petit visuellement.
On compense la mise en page Home pour obtenir le même rendu perçu.
========================================================= */
body.home .lux-product-section .woocommerce ul.products li.product .orilom-wishlist-button,
body.home .woocommerce ul.products li.product .orilom-wishlist-button{
width:40px!important;
min-width:40px!important;
max-width:40px!important;
height:40px!important;
min-height:40px!important;
max-height:40px!important;
top:10px!important;
right:10px!important;
}
body.home .lux-product-section .woocommerce ul.products li.product .orilom-wishlist-button::before,
body.home .woocommerce ul.products li.product .orilom-wishlist-button::before{
font-size:19px!important;
line-height:1!important;
}
@media(max-width:760px){
body.home .lux-product-section .woocommerce ul.products li.product .orilom-wishlist-button,
body.home .woocommerce ul.products li.product .orilom-wishlist-button{
width:36px!important;
min-width:36px!important;
max-width:36px!important;
height:36px!important;
min-height:36px!important;
max-height:36px!important;
}
body.home .lux-product-section .woocommerce ul.products li.product .orilom-wishlist-button::before,
body.home .woocommerce ul.products li.product .orilom-wishlist-button::before{
font-size:18px!important;
}
}
/* ======================================================================
ORILOM — HOME HEART = SHOP HEART EXACT
Deep fix:
Shop grid 2/3/4 effective geometry = 38x38 + 18x18 SVG.
We use the exact same rendering on the Home.
====================================================================== */
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .orilom-wishlist-button,
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > a.orilom-wishlist-button{
position:absolute!important;
z-index:80!important;
top:12px!important;
right:12px!important;
left:auto!important;
bottom:auto!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
width:38px!important;
min-width:38px!important;
max-width:38px!important;
height:38px!important;
min-height:38px!important;
max-height:38px!important;
margin:0!important;
padding:0!important;
overflow:hidden!important;
border:1px solid rgba(17,17,17,.10)!important;
border-radius:50%!important;
background:rgba(255,255,255,.97)!important;
color:transparent!important;
font-size:0!important;
line-height:0!important;
text-indent:-9999px!important;
white-space:nowrap!important;
text-decoration:none!important;
opacity:1!important;
visibility:visible!important;
transform:none!important;
box-shadow:
0 3px 10px rgba(0,0,0,.07),
0 7px 20px rgba(0,0,0,.08)!important;
backdrop-filter:blur(5px)!important;
-webkit-backdrop-filter:blur(5px)!important;
transition:
transform .18s ease,
background .18s ease,
border-color .18s ease,
box-shadow .18s ease!important;
}
/* Inactive = exact outline SVG used by the Shop */
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .orilom-wishlist-button:not(.is-active)::before,
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > a.orilom-wishlist-button:not(.is-active)::before{
content:""!important;
display:block!important;
flex:0 0 18px!important;
width:18px!important;
min-width:18px!important;
max-width:18px!important;
height:18px!important;
min-height:18px!important;
max-height:18px!important;
margin:0!important;
padding:0!important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23202020' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E")!important;
background-repeat:no-repeat!important;
background-position:center!important;
background-size:contain!important;
color:transparent!important;
font-size:0!important;
line-height:0!important;
text-indent:0!important;
filter:none!important;
transform:none!important;
}
/* Active = exact filled gold SVG used by the Shop */
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .orilom-wishlist-button.is-active::before,
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > a.orilom-wishlist-button.is-active::before{
content:""!important;
display:block!important;
flex:0 0 18px!important;
width:18px!important;
min-width:18px!important;
max-width:18px!important;
height:18px!important;
min-height:18px!important;
max-height:18px!important;
margin:0!important;
padding:0!important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23c9a227' stroke='%23c9a227' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E")!important;
background-repeat:no-repeat!important;
background-position:center!important;
background-size:contain!important;
color:transparent!important;
font-size:0!important;
line-height:0!important;
text-indent:0!important;
filter:none!important;
transform:none!important;
}
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .orilom-wishlist-button::after,
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > a.orilom-wishlist-button::after{
content:none!important;
display:none!important;
}
/* Active button remains white, same as current Shop premium behaviour */
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .orilom-wishlist-button.is-active,
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > a.orilom-wishlist-button.is-active{
background:rgba(255,255,255,.97)!important;
border-color:rgba(17,17,17,.10)!important;
}
/* Same Shop hover */
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .orilom-wishlist-button:hover,
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > a.orilom-wishlist-button:hover{
background:#fffaf0!important;
border-color:rgba(201,162,39,.65)!important;
box-shadow:
0 0 0 3px rgba(201,162,39,.08),
0 8px 22px rgba(0,0,0,.13)!important;
transform:scale(1.07)!important;
}
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .orilom-wishlist-button:not(.is-active):hover::before,
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > a.orilom-wishlist-button:not(.is-active):hover::before{
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a227' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E")!important;
}
/* Touch/mobile: keep the exact same visual size as Shop */
@media(max-width:760px){
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > .orilom-wishlist-button,
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product > a.orilom-wishlist-button{
width:38px!important;
min-width:38px!important;
max-width:38px!important;
height:38px!important;
min-height:38px!important;
max-height:38px!important;
top:10px!important;
right:10px!important;
}
}
/* ======================================================================
ORILOM — CART FUTURE UI V1
Panier premium / futuriste : blanc, noir, or, cartes nettes.
====================================================================== */
body.woocommerce-cart{
--cart-gold:#e5b900;
--cart-gold-dark:#b88f00;
--cart-ink:#111;
--cart-muted:#777;
--cart-line:#e9e7e1;
--cart-soft:#faf9f6;
--cart-soft-2:#f5f3ed;
background:#fff!important;
}
/* Page width + reset old centered narrow cart */
body.woocommerce-cart .content-wrap,
body.woocommerce-cart main,
body.woocommerce-cart .site-main{
max-width:1240px!important;
width:100%!important;
margin:0 auto!important;
padding:58px 24px 90px!important;
}
body.woocommerce-cart .page-content{
max-width:none!important;
width:100%!important;
}
/* Hide legacy "Panier" title: replaced by premium header below */
body.woocommerce-cart .page-content > h1,
body.woocommerce-cart .entry-title,
body.woocommerce-cart .woocommerce > h1{
display:none!important;
}
/* ---------- Hero ---------- */
body.woocommerce-cart .orilom-cart-future-head{
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
gap:36px!important;
align-items:end!important;
padding:0 0 26px!important;
margin:0 0 12px!important;
border-bottom:1px solid var(--cart-line)!important;
}
body.woocommerce-cart .orilom-cart-kicker{
display:block!important;
margin:0 0 8px!important;
color:var(--cart-gold-dark)!important;
font:800 9px/1 Arial,sans-serif!important;
letter-spacing:.18em!important;
}
body.woocommerce-cart .orilom-cart-title-row{
display:flex!important;
align-items:center!important;
gap:13px!important;
flex-wrap:wrap!important;
}
body.woocommerce-cart .orilom-cart-future-head h1{
margin:0!important;
color:#111!important;
font:700 clamp(34px,4vw,52px)/1 Georgia,serif!important;
letter-spacing:-.025em!important;
}
body.woocommerce-cart .orilom-cart-count-pill{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:28px!important;
padding:0 11px!important;
border:1px solid #e4d590!important;
border-radius:999px!important;
background:#fffbea!important;
color:#6e5700!important;
font-size:9px!important;
font-weight:800!important;
}
body.woocommerce-cart .orilom-cart-future-copy p{
max-width:580px!important;
margin:13px 0 0!important;
color:#6d6d6d!important;
font-size:12px!important;
line-height:1.65!important;
}
/* ---------- Checkout progress ---------- */
body.woocommerce-cart .orilom-checkout-progress{
display:flex!important;
align-items:center!important;
gap:0!important;
list-style:none!important;
margin:0!important;
padding:0!important;
}
body.woocommerce-cart .orilom-checkout-progress li{
position:relative!important;
display:grid!important;
grid-template-columns:26px auto!important;
align-items:center!important;
gap:7px!important;
min-width:112px!important;
padding-right:30px!important;
color:#aaa!important;
}
body.woocommerce-cart .orilom-checkout-progress li:not(:last-child)::after{
content:""!important;
position:absolute!important;
right:7px!important;
top:50%!important;
width:18px!important;
height:1px!important;
background:#d8d8d3!important;
}
body.woocommerce-cart .orilom-checkout-progress li span{
display:grid!important;
place-items:center!important;
width:26px!important;
height:26px!important;
border:1px solid #d9d8d3!important;
border-radius:50%!important;
background:#fff!important;
font-size:8px!important;
font-weight:900!important;
}
body.woocommerce-cart .orilom-checkout-progress li strong{
font-size:9px!important;
line-height:1.1!important;
font-weight:800!important;
text-transform:uppercase!important;
letter-spacing:.04em!important;
}
body.woocommerce-cart .orilom-checkout-progress li.is-active{
color:#111!important;
}
body.woocommerce-cart .orilom-checkout-progress li.is-active span{
border-color:var(--cart-gold)!important;
background:var(--cart-gold)!important;
color:#111!important;
box-shadow:0 0 0 4px rgba(229,185,0,.10)!important;
}
/* ---------- Benefit strip ---------- */
body.woocommerce-cart .orilom-cart-benefits{
display:grid!important;
grid-template-columns:repeat(3,1fr)!important;
gap:8px!important;
margin:0 0 24px!important;
}
body.woocommerce-cart .orilom-cart-benefits span{
display:flex!important;
align-items:center!important;
gap:8px!important;
min-height:42px!important;
padding:0 13px!important;
border:1px solid #eee9d7!important;
border-radius:9px!important;
background:#fffdf6!important;
color:#575757!important;
font-size:9px!important;
font-weight:700!important;
}
body.woocommerce-cart .orilom-cart-benefits b{
display:grid!important;
place-items:center!important;
width:20px!important;
height:20px!important;
border-radius:50%!important;
background:#111!important;
color:var(--cart-gold)!important;
font-size:10px!important;
}
/* ---------- Main cart: two-column structure ---------- */
body.woocommerce-cart .woocommerce{
width:100%!important;
}
body.woocommerce-cart .woocommerce:not(.widget_shopping_cart){
position:relative!important;
}
body.woocommerce-cart .woocommerce-cart-form{
width:calc(100% - 370px)!important;
float:left!important;
margin:0!important;
}
body.woocommerce-cart .cart-collaterals{
width:338px!important;
float:right!important;
margin:0!important;
}
body.woocommerce-cart .woocommerce::after{
content:""!important;
display:block!important;
clear:both!important;
}
/* ---------- Product table card ---------- */
body.woocommerce-cart table.shop_table.cart{
width:100%!important;
margin:0!important;
overflow:hidden!important;
border:1px solid var(--cart-line)!important;
border-radius:14px!important;
border-collapse:separate!important;
border-spacing:0!important;
background:#fff!important;
box-shadow:0 14px 40px rgba(17,17,17,.04)!important;
}
body.woocommerce-cart table.shop_table.cart thead{
background:#111!important;
}
body.woocommerce-cart table.shop_table.cart thead th{
height:46px!important;
padding:0 13px!important;
border:0!important;
color:#fff!important;
font-size:9px!important;
line-height:1!important;
font-weight:800!important;
letter-spacing:.055em!important;
text-transform:uppercase!important;
vertical-align:middle!important;
}
body.woocommerce-cart table.shop_table.cart tbody td{
padding:16px 13px!important;
border-top:1px solid #efede7!important;
color:#222!important;
font-size:11px!important;
vertical-align:middle!important;
}
body.woocommerce-cart table.shop_table.cart tbody tr:first-child td{
border-top:0!important;
}
/* Product image */
body.woocommerce-cart table.cart img{
width:72px!important;
height:72px!important;
object-fit:contain!important;
padding:4px!important;
background:#fafafa!important;
border:1px solid #efefec!important;
border-radius:8px!important;
}
/* Product name */
body.woocommerce-cart .product-name a{
color:#111!important;
font-size:11px!important;
line-height:1.45!important;
font-weight:750!important;
}
body.woocommerce-cart .product-name a:hover{
color:var(--cart-gold-dark)!important;
}
/* Remove = compact icon */
body.woocommerce-cart a.remove{
display:grid!important;
place-items:center!important;
width:28px!important;
height:28px!important;
border:1px solid #ece8df!important;
border-radius:50%!important;
background:#fff!important;
color:#aaa!important;
font-size:18px!important;
font-weight:400!important;
line-height:1!important;
transition:.18s ease!important;
}
body.woocommerce-cart a.remove:hover{
border-color:#111!important;
background:#111!important;
color:#fff!important;
transform:scale(1.04)!important;
}
/* Prices */
body.woocommerce-cart .product-price,
body.woocommerce-cart .product-subtotal{
white-space:nowrap!important;
color:#111!important;
font-weight:800!important;
}
/* Quantity */
body.woocommerce-cart .quantity{
display:inline-flex!important;
align-items:center!important;
}
body.woocommerce-cart .quantity .qty{
width:62px!important;
height:42px!important;
padding:0 6px!important;
border:1px solid #dcdad4!important;
border-radius:7px!important;
background:#fff!important;
color:#111!important;
text-align:center!important;
font-size:11px!important;
font-weight:750!important;
outline:none!important;
}
body.woocommerce-cart .quantity .qty:focus{
border-color:#111!important;
box-shadow:0 0 0 3px rgba(17,17,17,.05)!important;
}
/* ---------- Coupon/action row ---------- */
body.woocommerce-cart table.cart td.actions{
padding:13px!important;
background:#faf9f6!important;
}
body.woocommerce-cart table.cart td.actions .coupon{
display:flex!important;
gap:7px!important;
}
body.woocommerce-cart #coupon_code{
width:180px!important;
min-width:180px!important;
height:42px!important;
margin:0!important;
padding:0 13px!important;
border:1px solid #d8d6d0!important;
border-radius:7px!important;
background:#fff!important;
color:#111!important;
font-size:10px!important;
outline:none!important;
}
body.woocommerce-cart #coupon_code:focus{
border-color:#111!important;
box-shadow:0 0 0 3px rgba(17,17,17,.05)!important;
}
/* Buttons */
body.woocommerce-cart .woocommerce button.button,
body.woocommerce-cart .woocommerce a.button,
body.woocommerce-cart .woocommerce input.button{
min-height:42px!important;
padding:0 17px!important;
border:1px solid #111!important;
border-radius:7px!important;
background:#111!important;
color:#fff!important;
box-shadow:none!important;
font-size:9px!important;
line-height:40px!important;
font-weight:850!important;
letter-spacing:.045em!important;
text-transform:uppercase!important;
transition:.18s ease!important;
}
body.woocommerce-cart .woocommerce button.button:hover,
body.woocommerce-cart .woocommerce a.button:hover,
body.woocommerce-cart .woocommerce input.button:hover{
background:#272727!important;
border-color:#272727!important;
transform:translateY(-1px)!important;
}
body.woocommerce-cart button[name="update_cart"]{
background:#fff!important;
color:#111!important;
}
body.woocommerce-cart button[name="update_cart"]:not(:disabled):hover{
background:#111!important;
color:#fff!important;
}
body.woocommerce-cart button[name="update_cart"]:disabled{
opacity:.42!important;
cursor:not-allowed!important;
}
/* ---------- Totals ---------- */
body.woocommerce-cart .cart_totals{
position:sticky!important;
top:28px!important;
width:100%!important;
float:none!important;
margin:0!important;
padding:22px!important;
border:1px solid #e7e4dc!important;
border-radius:14px!important;
background:
radial-gradient(circle at 100% 0,rgba(229,185,0,.10),transparent 31%),
#fff!important;
box-shadow:0 16px 45px rgba(17,17,17,.06)!important;
}
body.woocommerce-cart .cart_totals h2{
margin:0 0 18px!important;
color:#111!important;
font:700 24px/1.1 Georgia,serif!important;
}
body.woocommerce-cart .cart_totals table{
margin:0!important;
border:0!important;
border-collapse:collapse!important;
}
body.woocommerce-cart .cart_totals table th,
body.woocommerce-cart .cart_totals table td{
padding:12px 0!important;
border-top:1px solid #ece9e1!important;
background:transparent!important;
color:#444!important;
font-size:10.5px!important;
vertical-align:top!important;
}
body.woocommerce-cart .cart_totals table th{
width:42%!important;
font-weight:700!important;
}
body.woocommerce-cart .cart_totals .order-total th,
body.woocommerce-cart .cart_totals .order-total td{
padding-top:17px!important;
color:#111!important;
font-size:13px!important;
font-weight:900!important;
}
body.woocommerce-cart .cart_totals .order-total strong{
font-size:16px!important;
}
/* Remove coupon link cleaner */
body.woocommerce-cart .cart_totals .woocommerce-remove-coupon{
color:#888!important;
font-size:9px!important;
text-decoration:underline!important;
text-underline-offset:2px!important;
}
/* Checkout CTA = gold focal action */
body.woocommerce-cart .wc-proceed-to-checkout{
margin:18px 0 0!important;
padding:0!important;
}
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button{
display:flex!important;
align-items:center!important;
justify-content:center!important;
width:100%!important;
min-height:52px!important;
margin:0!important;
padding:0 16px!important;
border:1px solid var(--cart-gold)!important;
border-radius:8px!important;
background:var(--cart-gold)!important;
color:#111!important;
font-size:10px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:.055em!important;
text-transform:uppercase!important;
box-shadow:0 10px 24px rgba(229,185,0,.18)!important;
}
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover{
background:#d7ad00!important;
border-color:#d7ad00!important;
color:#111!important;
transform:translateY(-1px)!important;
box-shadow:0 13px 28px rgba(229,185,0,.24)!important;
}
/* ---------- Empty cart ---------- */
body.woocommerce-cart .cart-empty{
padding:28px!important;
border:1px solid #ece9e1!important;
border-radius:12px!important;
background:#faf9f6!important;
color:#555!important;
}
/* ---------- Responsive ---------- */
@media(max-width:1000px){
body.woocommerce-cart .content-wrap,
body.woocommerce-cart main,
body.woocommerce-cart .site-main{
padding:42px 20px 72px!important;
}
body.woocommerce-cart .orilom-cart-future-head{
grid-template-columns:1fr!important;
align-items:start!important;
}
body.woocommerce-cart .orilom-checkout-progress{
width:100%!important;
}
body.woocommerce-cart .woocommerce-cart-form,
body.woocommerce-cart .cart-collaterals{
float:none!important;
width:100%!important;
}
body.woocommerce-cart .cart-collaterals{
margin-top:22px!important;
}
body.woocommerce-cart .cart_totals{
position:static!important;
}
}
@media(max-width:720px){
body.woocommerce-cart .content-wrap,
body.woocommerce-cart main,
body.woocommerce-cart .site-main{
padding:30px 14px 58px!important;
}
body.woocommerce-cart .orilom-cart-benefits{
grid-template-columns:1fr!important;
}
body.woocommerce-cart .orilom-checkout-progress{
justify-content:space-between!important;
}
body.woocommerce-cart .orilom-checkout-progress li{
min-width:0!important;
padding-right:20px!important;
}
body.woocommerce-cart .orilom-checkout-progress li strong{
display:none!important;
}
body.woocommerce-cart .orilom-checkout-progress li:not(:last-child)::after{
width:25px!important;
right:-5px!important;
}
/* WooCommerce mobile cart cards */
body.woocommerce-cart table.shop_table.cart{
border-radius:12px!important;
box-shadow:none!important;
}
body.woocommerce-cart table.shop_table.cart thead{
display:none!important;
}
body.woocommerce-cart table.shop_table.cart tr.cart_item{
display:block!important;
position:relative!important;
margin:0!important;
padding:14px!important;
border-bottom:1px solid #ece9e1!important;
}
body.woocommerce-cart table.shop_table.cart tr.cart_item td{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:14px!important;
width:100%!important;
padding:8px 0!important;
border:0!important;
text-align:right!important;
}
body.woocommerce-cart table.shop_table.cart td.product-thumbnail{
justify-content:center!important;
}
body.woocommerce-cart table.shop_table.cart td.product-remove{
position:absolute!important;
top:10px!important;
right:10px!important;
z-index:3!important;
width:auto!important;
padding:0!important;
}
body.woocommerce-cart table.shop_table.cart td::before{
color:#888!important;
font-size:9px!important;
font-weight:700!important;
text-transform:uppercase!important;
letter-spacing:.04em!important;
}
body.woocommerce-cart table.cart td.actions{
display:block!important;
padding:13px!important;
}
body.woocommerce-cart table.cart td.actions .coupon{
display:grid!important;
grid-template-columns:1fr auto!important;
width:100%!important;
}
body.woocommerce-cart #coupon_code{
width:100%!important;
min-width:0!important;
}
body.woocommerce-cart button[name="update_cart"]{
width:100%!important;
margin-top:9px!important;
}
}
@media(max-width:430px){
body.woocommerce-cart .orilom-cart-future-head h1{
font-size:35px!important;
}
body.woocommerce-cart .cart_totals{
padding:18px!important;
}
body.woocommerce-cart table.cart td.actions .coupon{
grid-template-columns:1fr!important;
}
body.woocommerce-cart table.cart td.actions .coupon button{
width:100%!important;
}
}
/* ======================================================================
ORILOM — CART UI V2 CENTERED
Barre jaune pleine largeur + contenu panier plus compact et centré.
====================================================================== */
/* Supprimer tous les anciens titres/hero panier */
body.woocommerce-cart .page-content > h1,
body.woocommerce-cart .entry-title,
body.woocommerce-cart .woocommerce > h1,
body.woocommerce-cart .orilom-cart-future-head,
body.woocommerce-cart .orilom-cart-kicker,
body.woocommerce-cart .orilom-cart-title-row,
body.woocommerce-cart .orilom-checkout-progress{
display:none!important;
}
/* Le contenu global reste centré et plus étroit */
body.woocommerce-cart .content-wrap,
body.woocommerce-cart main,
body.woocommerce-cart .site-main{
max-width:none!important;
width:100%!important;
margin:0!important;
padding:0 0 80px!important;
}
body.woocommerce-cart .page-content,
body.woocommerce-cart .woocommerce{
max-width:none!important;
width:100%!important;
margin:0!important;
}
/* Barre jaune pleine largeur, même logique que boutique/produit */
body.woocommerce-cart .orilom-cart-breadcrumb-bar{
position:relative!important;
left:50%!important;
width:100vw!important;
max-width:100vw!important;
margin-left:-50vw!important;
margin-right:0!important;
display:flex!important;
align-items:center!important;
gap:12px!important;
min-height:43px!important;
padding:0 max(3vw,calc((100vw - 1040px)/2))!important;
background:var(--lux-gold,#dfb913)!important;
color:#4a3a00!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:11px!important;
line-height:1!important;
}
body.woocommerce-cart .orilom-cart-breadcrumb-left{
display:flex!important;
align-items:center!important;
gap:11px!important;
min-width:0!important;
}
body.woocommerce-cart .orilom-cart-breadcrumb-bar a,
body.woocommerce-cart .orilom-cart-breadcrumb-bar .is-current{
color:#4a3a00!important;
font-size:11px!important;
line-height:1!important;
text-decoration:none!important;
white-space:nowrap!important;
}
body.woocommerce-cart .orilom-cart-breadcrumb-bar .is-current{
color:#2f2500!important;
font-weight:700!important;
}
body.woocommerce-cart .orilom-cart-breadcrumb-meta{
margin-left:auto!important;
color:#4a3a00!important;
font-size:11px!important;
white-space:nowrap!important;
}
/* Tout ce qui suit la barre tient dans un vrai conteneur central */
body.woocommerce-cart .orilom-cart-benefits,
body.woocommerce-cart .woocommerce-cart-form,
body.woocommerce-cart .cart-collaterals{
box-sizing:border-box!important;
}
/* Réassurance centrée et compacte */
body.woocommerce-cart .orilom-cart-benefits{
max-width:1040px!important;
margin:28px auto 18px!important;
padding:0!important;
grid-template-columns:repeat(3,1fr)!important;
gap:8px!important;
}
body.woocommerce-cart .orilom-cart-benefits span{
min-height:40px!important;
border-radius:7px!important;
background:#fffdf7!important;
}
/* Grille panier + résumé centrée */
body.woocommerce-cart .woocommerce-cart-form{
width:calc(1040px - 330px - 22px)!important;
max-width:calc(100% - 352px)!important;
float:none!important;
display:inline-block!important;
vertical-align:top!important;
margin-left:max(20px,calc((100vw - 1040px)/2))!important;
margin-right:18px!important;
}
body.woocommerce-cart .cart-collaterals{
width:330px!important;
max-width:330px!important;
float:none!important;
display:inline-block!important;
vertical-align:top!important;
margin:0!important;
}
/* Carte panier plus dense */
body.woocommerce-cart table.shop_table.cart{
border-radius:11px!important;
box-shadow:0 12px 32px rgba(17,17,17,.035)!important;
}
body.woocommerce-cart table.shop_table.cart thead th{
height:42px!important;
font-size:8.5px!important;
}
body.woocommerce-cart table.shop_table.cart tbody td{
padding:13px 11px!important;
}
body.woocommerce-cart table.cart img{
width:64px!important;
height:64px!important;
}
/* Totaux plus compacts */
body.woocommerce-cart .cart_totals{
top:22px!important;
padding:20px!important;
border-radius:11px!important;
box-shadow:0 12px 34px rgba(17,17,17,.05)!important;
}
body.woocommerce-cart .cart_totals h2{
font-size:22px!important;
margin-bottom:14px!important;
}
/* Bouton checkout */
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button{
min-height:48px!important;
border-radius:7px!important;
}
/* Desktop moyen */
@media(max-width:1120px){
body.woocommerce-cart .orilom-cart-benefits{
max-width:920px!important;
}
body.woocommerce-cart .woocommerce-cart-form{
width:calc(100% - 350px)!important;
max-width:none!important;
margin-left:20px!important;
margin-right:16px!important;
}
body.woocommerce-cart .cart-collaterals{
width:310px!important;
max-width:310px!important;
}
}
/* Tablette : une seule colonne */
@media(max-width:900px){
body.woocommerce-cart .orilom-cart-breadcrumb-bar{
padding:0 20px!important;
}
body.woocommerce-cart .orilom-cart-benefits{
max-width:none!important;
margin:20px 18px 16px!important;
}
body.woocommerce-cart .woocommerce-cart-form,
body.woocommerce-cart .cart-collaterals{
display:block!important;
width:auto!important;
max-width:none!important;
margin-left:18px!important;
margin-right:18px!important;
}
body.woocommerce-cart .cart-collaterals{
margin-top:18px!important;
}
}
/* Mobile */
@media(max-width:650px){
body.woocommerce-cart .orilom-cart-breadcrumb-bar{
min-height:41px!important;
padding:0 16px!important;
}
body.woocommerce-cart .orilom-cart-breadcrumb-meta{
display:none!important;
}
body.woocommerce-cart .orilom-cart-benefits{
grid-template-columns:1fr!important;
margin:16px 14px 14px!important;
}
body.woocommerce-cart .woocommerce-cart-form,
body.woocommerce-cart .cart-collaterals{
margin-left:14px!important;
margin-right:14px!important;
}
}
/* ======================================================================
ORILOM — CHECKOUT COMPACT PREMIUM V1
Réduit la longueur du formulaire et accélère la lecture / décision.
====================================================================== */
body.woocommerce-checkout{
--checkout-gold:#e3b900;
--checkout-gold-dark:#b88f00;
--checkout-ink:#111;
--checkout-muted:#737373;
--checkout-line:#e8e6df;
--checkout-soft:#faf9f6;
background:#fff!important;
}
/* Retirer le gros titre WooCommerce "Commander". */
body.woocommerce-checkout .page-content > h1,
body.woocommerce-checkout .entry-title,
body.woocommerce-checkout .woocommerce > h1{
display:none!important;
}
/* Le checkout ne doit plus être un long bloc étroit. */
body.woocommerce-checkout .content-wrap,
body.woocommerce-checkout main,
body.woocommerce-checkout .site-main{
width:100%!important;
max-width:none!important;
margin:0!important;
padding:0 0 76px!important;
}
body.woocommerce-checkout .page-content,
body.woocommerce-checkout .woocommerce{
width:100%!important;
max-width:none!important;
margin:0!important;
}
/* ---------- Barre jaune ---------- */
body.woocommerce-checkout .orilom-checkout-breadcrumb-bar{
position:relative!important;
left:50%!important;
width:100vw!important;
max-width:100vw!important;
margin-left:-50vw!important;
display:flex!important;
align-items:center!important;
gap:12px!important;
min-height:43px!important;
padding:0 max(3vw,calc((100vw - 1100px)/2))!important;
background:var(--lux-gold,#dfb913)!important;
color:#4a3a00!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:11px!important;
line-height:1!important;
}
body.woocommerce-checkout .orilom-checkout-breadcrumb-left{
display:flex!important;
align-items:center!important;
gap:10px!important;
min-width:0!important;
}
body.woocommerce-checkout .orilom-checkout-breadcrumb-bar a,
body.woocommerce-checkout .orilom-checkout-breadcrumb-bar .is-current{
color:#4a3a00!important;
font-size:11px!important;
text-decoration:none!important;
white-space:nowrap!important;
}
body.woocommerce-checkout .orilom-checkout-breadcrumb-bar .is-current{
color:#302500!important;
font-weight:800!important;
}
body.woocommerce-checkout .orilom-checkout-breadcrumb-meta{
margin-left:auto!important;
color:#4a3a00!important;
font-size:11px!important;
white-space:nowrap!important;
}
/* ---------- Réassurance ---------- */
body.woocommerce-checkout .orilom-checkout-benefits{
display:grid!important;
grid-template-columns:repeat(3,1fr)!important;
gap:8px!important;
width:calc(100% - 36px)!important;
max-width:1100px!important;
margin:26px auto 18px!important;
}
body.woocommerce-checkout .orilom-checkout-benefits span{
display:flex!important;
align-items:center!important;
gap:8px!important;
min-height:40px!important;
padding:0 12px!important;
border:1px solid #eee9d7!important;
border-radius:8px!important;
background:#fffdf7!important;
color:#555!important;
font-size:9px!important;
font-weight:700!important;
}
body.woocommerce-checkout .orilom-checkout-benefits b{
display:grid!important;
place-items:center!important;
width:20px!important;
height:20px!important;
flex:0 0 20px!important;
border-radius:50%!important;
background:#111!important;
color:var(--checkout-gold)!important;
font-size:10px!important;
}
/* Coupon : compact et centré */
body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout form.checkout_coupon{
width:calc(100% - 36px)!important;
max-width:1100px!important;
margin-left:auto!important;
margin-right:auto!important;
}
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info{
min-height:42px!important;
margin:0 0 14px!important;
padding:12px 14px 12px 42px!important;
border:1px solid var(--checkout-line)!important;
border-top:1px solid var(--checkout-line)!important;
border-radius:8px!important;
background:#fafafa!important;
color:#666!important;
font-size:10px!important;
}
body.woocommerce-checkout form.checkout_coupon{
padding:14px!important;
border:1px solid var(--checkout-line)!important;
border-radius:8px!important;
background:#fff!important;
}
/* ---------- Checkout grid ---------- */
body.woocommerce-checkout form.checkout{
display:grid!important;
grid-template-columns:minmax(0,1fr) 390px!important;
grid-template-areas:
"customer order";
gap:26px!important;
align-items:start!important;
width:calc(100% - 36px)!important;
max-width:1100px!important;
margin:0 auto!important;
}
body.woocommerce-checkout #customer_details{
grid-area:customer!important;
display:block!important;
width:auto!important;
margin:0!important;
}
body.woocommerce-checkout #order_review_heading,
body.woocommerce-checkout #order_review{
grid-area:order!important;
}
/* Heading order inside sticky card */
body.woocommerce-checkout #order_review_heading{
margin:0!important;
padding:0!important;
height:0!important;
overflow:hidden!important;
font-size:0!important;
}
/* ---------- Billing card ---------- */
body.woocommerce-checkout .woocommerce-billing-fields,
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout .woocommerce-additional-fields{
margin:0 0 14px!important;
padding:22px!important;
border:1px solid var(--checkout-line)!important;
border-radius:12px!important;
background:#fff!important;
box-shadow:0 12px 32px rgba(17,17,17,.035)!important;
}
body.woocommerce-checkout .woocommerce-billing-fields > h3,
body.woocommerce-checkout .woocommerce-shipping-fields > h3,
body.woocommerce-checkout .woocommerce-additional-fields > h3{
margin:0 0 18px!important;
color:#111!important;
font:700 21px/1.15 Georgia,serif!important;
}
/* WooCommerce inner columns reset */
body.woocommerce-checkout #customer_details .col-1,
body.woocommerce-checkout #customer_details .col-2{
float:none!important;
width:100%!important;
margin:0!important;
}
/* Compact 2-column field grid. */
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:12px 14px!important;
}
body.woocommerce-checkout .form-row{
float:none!important;
width:100%!important;
margin:0!important;
padding:0!important;
}
/* Full-width fields */
body.woocommerce-checkout #billing_country_field,
body.woocommerce-checkout #billing_address_1_field,
body.woocommerce-checkout #billing_address_2_field,
body.woocommerce-checkout #shipping_country_field,
body.woocommerce-checkout #shipping_address_1_field,
body.woocommerce-checkout #shipping_address_2_field{
grid-column:1/-1!important;
}
/* Country is visually compact; ORILOM is Morocco-first. */
body.woocommerce-checkout #billing_country_field{
margin-bottom:0!important;
}
/* labels */
body.woocommerce-checkout .form-row label{
display:block!important;
margin:0 0 6px!important;
color:#333!important;
font-size:9.5px!important;
line-height:1.2!important;
font-weight:750!important;
}
body.woocommerce-checkout .required{
color:#c5392f!important;
}
/* Inputs */
body.woocommerce-checkout .input-text,
body.woocommerce-checkout select,
body.woocommerce-checkout .select2-container .select2-selection--single{
width:100%!important;
height:43px!important;
min-height:43px!important;
margin:0!important;
padding:0 12px!important;
border:1px solid #d8d6d0!important;
border-radius:7px!important;
background:#fff!important;
color:#111!important;
font-size:10.5px!important;
line-height:41px!important;
outline:none!important;
transition:border-color .16s ease,box-shadow .16s ease!important;
}
body.woocommerce-checkout textarea.input-text{
height:78px!important;
min-height:78px!important;
padding:10px 12px!important;
line-height:1.45!important;
resize:vertical!important;
}
body.woocommerce-checkout .input-text:focus,
body.woocommerce-checkout select:focus,
body.woocommerce-checkout .select2-container--focus .select2-selection--single{
border-color:#111!important;
box-shadow:0 0 0 3px rgba(17,17,17,.045)!important;
}
/* Select2 vertical alignment */
body.woocommerce-checkout .select2-selection__rendered{
line-height:41px!important;
padding-left:0!important;
color:#111!important;
font-size:10.5px!important;
}
body.woocommerce-checkout .select2-selection__arrow{
height:41px!important;
}
/* Ship to different address: small toggle, not a giant title */
body.woocommerce-checkout #ship-to-different-address{
margin:0 0 14px!important;
font:700 11px/1.3 Arial,sans-serif!important;
}
body.woocommerce-checkout #ship-to-different-address label{
display:flex!important;
align-items:center!important;
gap:8px!important;
margin:0!important;
}
/* Notes card smaller */
body.woocommerce-checkout .woocommerce-additional-fields{
padding-top:17px!important;
padding-bottom:17px!important;
}
/* ---------- Sticky order summary ---------- */
body.woocommerce-checkout #order_review{
position:sticky!important;
top:22px!important;
width:100%!important;
margin:0!important;
padding:20px!important;
border:1px solid var(--checkout-line)!important;
border-radius:12px!important;
background:
radial-gradient(circle at 100% 0,rgba(227,185,0,.10),transparent 30%),
#fff!important;
box-shadow:0 14px 40px rgba(17,17,17,.05)!important;
}
body.woocommerce-checkout #order_review::before{
content:"Votre commande"!important;
display:block!important;
margin:0 0 15px!important;
color:#111!important;
font:700 23px/1.1 Georgia,serif!important;
}
/* Order table */
body.woocommerce-checkout #order_review table.shop_table{
margin:0 0 16px!important;
border:0!important;
border-collapse:collapse!important;
background:transparent!important;
}
body.woocommerce-checkout #order_review table.shop_table th,
body.woocommerce-checkout #order_review table.shop_table td{
padding:10px 0!important;
border:0!important;
border-top:1px solid #ece9e1!important;
background:transparent!important;
color:#444!important;
font-size:9.5px!important;
line-height:1.4!important;
vertical-align:top!important;
}
body.woocommerce-checkout #order_review table.shop_table thead th{
border-top:0!important;
color:#888!important;
font-size:8.5px!important;
text-transform:uppercase!important;
letter-spacing:.05em!important;
}
body.woocommerce-checkout #order_review table.shop_table td.product-total,
body.woocommerce-checkout #order_review table.shop_table tfoot td{
text-align:right!important;
white-space:nowrap!important;
font-weight:750!important;
}
body.woocommerce-checkout #order_review .order-total th,
body.woocommerce-checkout #order_review .order-total td{
padding-top:14px!important;
color:#111!important;
font-size:12px!important;
font-weight:900!important;
}
body.woocommerce-checkout #order_review .order-total strong{
font-size:15px!important;
}
/* ---------- COD panel ---------- */
body.woocommerce-checkout #payment{
margin-top:4px!important;
padding:0!important;
border:1px solid #e9e4d3!important;
border-radius:9px!important;
background:#fffdf7!important;
overflow:hidden!important;
}
body.woocommerce-checkout #payment ul.payment_methods{
margin:0!important;
padding:13px!important;
border:0!important;
}
body.woocommerce-checkout #payment ul.payment_methods li{
margin:0!important;
color:#222!important;
font-size:10px!important;
font-weight:700!important;
}
body.woocommerce-checkout #payment div.payment_box{
margin:8px 0 0!important;
padding:11px!important;
border:0!important;
border-radius:6px!important;
background:#fff!important;
color:#666!important;
font-size:9.5px!important;
line-height:1.55!important;
}
body.woocommerce-checkout #payment div.payment_box::before{
display:none!important;
}
body.woocommerce-checkout #payment .place-order{
margin:0!important;
padding:13px!important;
background:#fff!important;
}
body.woocommerce-checkout #payment .woocommerce-privacy-policy-text{
margin:0 0 10px!important;
color:#888!important;
font-size:8.5px!important;
line-height:1.5!important;
}
/* Focal CTA */
body.woocommerce-checkout #place_order{
display:flex!important;
align-items:center!important;
justify-content:center!important;
width:100%!important;
min-height:50px!important;
margin:0!important;
padding:0 14px!important;
border:1px solid var(--checkout-gold)!important;
border-radius:7px!important;
background:var(--checkout-gold)!important;
color:#111!important;
font-size:10px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:.055em!important;
text-transform:uppercase!important;
box-shadow:0 10px 24px rgba(227,185,0,.18)!important;
transition:.18s ease!important;
}
body.woocommerce-checkout #place_order:hover{
background:#d5ad00!important;
border-color:#d5ad00!important;
transform:translateY(-1px)!important;
box-shadow:0 13px 29px rgba(227,185,0,.25)!important;
}
/* Validation errors cleaner */
body.woocommerce-checkout .woocommerce-error{
width:calc(100% - 36px)!important;
max-width:1100px!important;
margin:0 auto 16px!important;
padding:13px 15px 13px 42px!important;
border-radius:8px!important;
font-size:10px!important;
}
/* ---------- Tablet ---------- */
@media(max-width:950px){
body.woocommerce-checkout form.checkout{
grid-template-columns:1fr!important;
grid-template-areas:
"customer"
"order"!important;
max-width:760px!important;
}
body.woocommerce-checkout #order_review{
position:static!important;
}
body.woocommerce-checkout .orilom-checkout-benefits{
max-width:760px!important;
}
body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout form.checkout_coupon{
max-width:760px!important;
}
}
/* ---------- Mobile ---------- */
@media(max-width:650px){
body.woocommerce-checkout .orilom-checkout-breadcrumb-bar{
min-height:41px!important;
padding:0 16px!important;
}
body.woocommerce-checkout .orilom-checkout-breadcrumb-meta{
display:none!important;
}
body.woocommerce-checkout .orilom-checkout-benefits{
grid-template-columns:1fr!important;
width:auto!important;
margin:16px 14px 14px!important;
}
body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout form.checkout_coupon,
body.woocommerce-checkout form.checkout{
width:auto!important;
margin-left:14px!important;
margin-right:14px!important;
}
body.woocommerce-checkout .woocommerce-billing-fields,
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout .woocommerce-additional-fields,
body.woocommerce-checkout #order_review{
padding:16px!important;
border-radius:10px!important;
}
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper{
grid-template-columns:1fr!important;
gap:11px!important;
}
body.woocommerce-checkout #billing_country_field,
body.woocommerce-checkout #billing_address_1_field,
body.woocommerce-checkout #billing_address_2_field,
body.woocommerce-checkout #shipping_country_field,
body.woocommerce-checkout #shipping_address_1_field,
body.woocommerce-checkout #shipping_address_2_field{
grid-column:auto!important;
}
}
/* ======================================================================
ORILOM — CHECKOUT CLEAN TITLE + COUPON V2
- Supprime définitivement le gros titre "Commander"
- Le coupon devient une action secondaire noir/blanc, jamais orange
====================================================================== */
/* WooCommerce / WordPress peuvent générer le titre à plusieurs niveaux.
On neutralise toutes les variantes uniquement sur la page checkout. */
body.woocommerce-checkout h1.entry-title,
body.woocommerce-checkout .entry-header,
body.woocommerce-checkout .entry-header h1,
body.woocommerce-checkout .page-header,
body.woocommerce-checkout .page-header h1,
body.woocommerce-checkout main > h1,
body.woocommerce-checkout .site-main > h1,
body.woocommerce-checkout .content-wrap > h1,
body.woocommerce-checkout .page-content > h1,
body.woocommerce-checkout .woocommerce > h1{
display:none!important;
}
/* Supprime aussi l'espace vertical laissé par certains templates autour du titre. */
body.woocommerce-checkout .entry-header,
body.woocommerce-checkout .page-header{
margin:0!important;
padding:0!important;
min-height:0!important;
height:0!important;
border:0!important;
}
/* Coupon toggle : plus discret */
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info{
background:#fafafa!important;
border:1px solid #e7e5df!important;
color:#666!important;
}
/* Formulaire coupon compact */
body.woocommerce-checkout form.checkout_coupon{
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
gap:8px!important;
align-items:center!important;
padding:10px!important;
background:#fff!important;
border:1px solid #e7e5df!important;
border-radius:8px!important;
}
body.woocommerce-checkout form.checkout_coupon p{
float:none!important;
width:auto!important;
margin:0!important;
padding:0!important;
}
body.woocommerce-checkout form.checkout_coupon .form-row-first{
width:auto!important;
}
body.woocommerce-checkout form.checkout_coupon .form-row-last{
width:auto!important;
}
/* Input coupon */
body.woocommerce-checkout form.checkout_coupon input.input-text,
body.woocommerce-checkout form.checkout_coupon #coupon_code{
width:100%!important;
height:42px!important;
min-height:42px!important;
margin:0!important;
padding:0 12px!important;
border:1px solid #d8d6d0!important;
border-radius:7px!important;
background:#fff!important;
color:#111!important;
box-shadow:none!important;
}
/* APPLY COUPON : action secondaire ORILOM, plus d'orange */
body.woocommerce-checkout form.checkout_coupon button.button,
body.woocommerce-checkout form.checkout_coupon input.button,
body.woocommerce-checkout form.checkout_coupon .button{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-width:138px!important;
min-height:42px!important;
height:42px!important;
margin:0!important;
padding:0 16px!important;
border:1px solid #111!important;
border-radius:7px!important;
background:#fff!important;
color:#111!important;
box-shadow:none!important;
font-size:9px!important;
line-height:1!important;
font-weight:850!important;
letter-spacing:.045em!important;
text-transform:uppercase!important;
transition:
background .18s ease,
color .18s ease,
transform .18s ease!important;
}
body.woocommerce-checkout form.checkout_coupon button.button:hover,
body.woocommerce-checkout form.checkout_coupon input.button:hover,
body.woocommerce-checkout form.checkout_coupon .button:hover{
background:#111!important;
color:#fff!important;
border-color:#111!important;
transform:translateY(-1px)!important;
}
/* Le vrai CTA de commande reste doré : hiérarchie claire */
body.woocommerce-checkout #place_order{
background:var(--checkout-gold,#e3b900)!important;
color:#111!important;
}
/* Mobile */
@media(max-width:650px){
body.woocommerce-checkout form.checkout_coupon{
grid-template-columns:1fr!important;
}
body.woocommerce-checkout form.checkout_coupon button.button,
body.woocommerce-checkout form.checkout_coupon input.button,
body.woocommerce-checkout form.checkout_coupon .button{
width:100%!important;
}
}
/* ======================================================================
ORILOM — CHECKOUT REMOVE COMMANDER TITLE FINAL
Le template affiche le H1 hors des wrappers WooCommerce habituels.
On le supprime au niveau de toute la page checkout.
====================================================================== */
body.woocommerce-checkout h1{
display:none!important;
}
/* Supprime l'espace que le template réserve au titre. */
body.woocommerce-checkout .entry-header,
body.woocommerce-checkout .page-header,
body.woocommerce-checkout header.entry-header,
body.woocommerce-checkout .wp-block-post-title,
body.woocommerce-checkout .page-title,
body.woocommerce-checkout .woocommerce-products-header{
display:none!important;
height:0!important;
min-height:0!important;
margin:0!important;
padding:0!important;
border:0!important;
}
/* La barre jaune remonte directement sous la navigation. */
body.woocommerce-checkout .orilom-checkout-breadcrumb-bar{
margin-top:0!important;
}
/* ======================================================================
ORILOM — CHECKOUT COMMANDER CLEAN FINAL
- Supprime le gros titre Commander
- Le mot Commander dans la barre jaune reste en poids normal
====================================================================== */
body.woocommerce-checkout h1{
display:none!important;
}
body.woocommerce-checkout .orilom-checkout-breadcrumb-bar .is-current{
font-weight:400!important;
color:#4a3a00!important;
}
/* ======================================================================
ORILOM — CHECKOUT PROGRESS UI V2
====================================================================== */
/* Masque le coupon WooCommerce natif en haut : on l'intègre au récapitulatif. */
body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout form.checkout_coupon{
display:none!important;
}
/* Progress steps */
body.woocommerce-checkout .orilom-checkout-steps{
position:relative!important;
display:grid!important;
grid-template-columns:repeat(3,1fr)!important;
gap:0!important;
width:calc(100% - 36px)!important;
max-width:760px!important;
margin:24px auto 18px!important;
padding:0!important;
list-style:none!important;
}
body.woocommerce-checkout .orilom-checkout-steps::before{
content:""!important;
position:absolute!important;
left:16.6%!important;
right:16.6%!important;
top:18px!important;
height:2px!important;
background:#e5e3dc!important;
z-index:0!important;
}
body.woocommerce-checkout .orilom-checkout-steps li{
position:relative!important;
z-index:1!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
text-align:center!important;
color:#aaa!important;
}
body.woocommerce-checkout .orilom-step-dot{
display:grid!important;
place-items:center!important;
width:36px!important;
height:36px!important;
border:2px solid #dedcd5!important;
border-radius:50%!important;
background:#fff!important;
color:#aaa!important;
font-size:11px!important;
font-weight:900!important;
box-shadow:0 0 0 6px #fff!important;
}
body.woocommerce-checkout .orilom-step-copy{
display:flex!important;
flex-direction:column!important;
gap:2px!important;
margin-top:8px!important;
}
body.woocommerce-checkout .orilom-step-copy small{
font-size:8px!important;
font-weight:800!important;
letter-spacing:.08em!important;
}
body.woocommerce-checkout .orilom-step-copy strong{
font-size:10px!important;
font-weight:800!important;
letter-spacing:.04em!important;
text-transform:uppercase!important;
}
body.woocommerce-checkout .orilom-checkout-steps li.is-done{
color:#111!important;
}
body.woocommerce-checkout .orilom-checkout-steps li.is-done .orilom-step-dot{
border-color:#111!important;
background:#111!important;
color:#e2b600!important;
}
body.woocommerce-checkout .orilom-checkout-steps li.is-active{
color:#111!important;
}
body.woocommerce-checkout .orilom-checkout-steps li.is-active .orilom-step-dot{
border-color:#e2b600!important;
background:#e2b600!important;
color:#111!important;
box-shadow:0 0 0 6px rgba(226,182,0,.10)!important;
}
/* Make visual journey directional */
body.woocommerce-checkout .orilom-checkout-steps li:nth-child(1)::after,
body.woocommerce-checkout .orilom-checkout-steps li:nth-child(2)::after{
content:"›"!important;
position:absolute!important;
top:10px!important;
right:-4px!important;
color:#bdbbb5!important;
font-size:18px!important;
font-weight:300!important;
}
/* Benefits a bit closer after steps */
body.woocommerce-checkout .orilom-checkout-benefits{
margin-top:8px!important;
}
/* Rename billing section visually */
body.woocommerce-checkout .woocommerce-billing-fields > h3{
font-size:0!important;
}
body.woocommerce-checkout .woocommerce-billing-fields > h3::after{
content:"Informations de livraison"!important;
font:700 21px/1.15 Georgia,serif!important;
color:#111!important;
}
/* Order summary title */
body.woocommerce-checkout #order_review::before{
content:"Votre commande"!important;
}
/* Promo integrated inside order table */
body.woocommerce-checkout .orilom-review-coupon-row td{
padding-top:13px!important;
border-top:1px solid #ece9e1!important;
}
body.woocommerce-checkout .orilom-review-coupon{
margin:0!important;
padding:0!important;
}
body.woocommerce-checkout .orilom-review-coupon summary{
position:relative!important;
cursor:pointer!important;
list-style:none!important;
padding:2px 18px 2px 0!important;
color:#555!important;
font-size:9.5px!important;
font-weight:700!important;
}
body.woocommerce-checkout .orilom-review-coupon summary::-webkit-details-marker{
display:none!important;
}
body.woocommerce-checkout .orilom-review-coupon summary::after{
content:"+"!important;
position:absolute!important;
right:0!important;
top:50%!important;
transform:translateY(-50%)!important;
color:#111!important;
font-size:14px!important;
font-weight:400!important;
}
body.woocommerce-checkout .orilom-review-coupon[open] summary::after{
content:"−"!important;
}
body.woocommerce-checkout .orilom-review-coupon-inner{
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
gap:7px!important;
margin-top:10px!important;
}
body.woocommerce-checkout .orilom-review-coupon input{
width:100%!important;
height:38px!important;
padding:0 10px!important;
border:1px solid #d8d6d0!important;
border-radius:6px!important;
background:#fff!important;
color:#111!important;
font-size:9.5px!important;
outline:none!important;
}
body.woocommerce-checkout .orilom-review-coupon input:focus{
border-color:#111!important;
box-shadow:0 0 0 3px rgba(17,17,17,.045)!important;
}
body.woocommerce-checkout .orilom-review-coupon button{
min-width:88px!important;
height:38px!important;
padding:0 12px!important;
border:1px solid #111!important;
border-radius:6px!important;
background:#fff!important;
color:#111!important;
font-size:8.5px!important;
font-weight:850!important;
text-transform:uppercase!important;
letter-spacing:.04em!important;
cursor:pointer!important;
}
body.woocommerce-checkout .orilom-review-coupon button:hover{
background:#111!important;
color:#fff!important;
}
body.woocommerce-checkout .orilom-review-coupon button:disabled{
opacity:.5!important;
cursor:wait!important;
}
body.woocommerce-checkout #orilom_review_coupon_message{
display:block!important;
margin-top:7px!important;
color:#777!important;
font-size:8.5px!important;
line-height:1.4!important;
}
/* Breadcrumb current should not be bold */
body.woocommerce-checkout .orilom-checkout-breadcrumb-bar .is-current{
font-weight:400!important;
}
/* Mobile steps */
@media(max-width:650px){
body.woocommerce-checkout .orilom-checkout-steps{
width:auto!important;
margin:18px 14px 14px!important;
max-width:none!important;
}
body.woocommerce-checkout .orilom-step-dot{
width:32px!important;
height:32px!important;
box-shadow:0 0 0 4px #fff!important;
}
body.woocommerce-checkout .orilom-checkout-steps::before{
top:16px!important;
}
body.woocommerce-checkout .orilom-step-copy strong{
font-size:9px!important;
}
body.woocommerce-checkout .orilom-review-coupon-inner{
grid-template-columns:1fr!important;
}
body.woocommerce-checkout .orilom-review-coupon button{
width:100%!important;
}
}
/* ======================================================================
ORILOM — CHECKOUT STEPPER V3 MINIMAL
Plus léger: aucun bandeau de réassurance, une seule navigation d'étapes.
====================================================================== */
/* Supprime définitivement l'ancien bloc de 3 avantages sur le checkout. */
body.woocommerce-checkout .orilom-checkout-benefits{
display:none!important;
}
/* Stepper compact, centré, premium */
body.woocommerce-checkout .orilom-checkout-steps{
position:relative!important;
display:grid!important;
grid-template-columns:repeat(3,1fr)!important;
width:calc(100% - 36px)!important;
max-width:620px!important;
margin:24px auto 28px!important;
padding:0!important;
list-style:none!important;
gap:0!important;
}
/* Une seule ligne très fine derrière les étapes */
body.woocommerce-checkout .orilom-checkout-steps::before{
content:""!important;
position:absolute!important;
z-index:0!important;
top:17px!important;
left:16.66%!important;
right:16.66%!important;
height:1px!important;
background:#dedcd5!important;
}
/* Chaque étape */
body.woocommerce-checkout .orilom-checkout-steps li{
position:relative!important;
z-index:1!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:flex-start!important;
color:#9a9a96!important;
text-align:center!important;
}
/* Plus de chevrons parasites */
body.woocommerce-checkout .orilom-checkout-steps li::after{
content:none!important;
display:none!important;
}
/* Cercle */
body.woocommerce-checkout .orilom-step-dot{
display:grid!important;
place-items:center!important;
width:34px!important;
height:34px!important;
margin:0!important;
border:1px solid #d8d6cf!important;
border-radius:50%!important;
background:#fff!important;
color:#999!important;
box-shadow:0 0 0 6px #fff!important;
font:800 10px/1 Arial,sans-serif!important;
}
/* Libellé seulement, sans doublon 01/02/03 */
body.woocommerce-checkout .orilom-step-copy{
display:block!important;
margin-top:9px!important;
}
body.woocommerce-checkout .orilom-step-copy small{
display:none!important;
}
body.woocommerce-checkout .orilom-step-copy strong{
display:block!important;
color:inherit!important;
font:800 9.5px/1.2 Arial,sans-serif!important;
letter-spacing:.045em!important;
text-transform:uppercase!important;
}
/* Étape terminée */
body.woocommerce-checkout .orilom-checkout-steps li.is-done{
color:#373737!important;
}
body.woocommerce-checkout .orilom-checkout-steps li.is-done .orilom-step-dot{
border-color:#111!important;
background:#111!important;
color:#e2b600!important;
}
/* Étape active */
body.woocommerce-checkout .orilom-checkout-steps li.is-active{
color:#111!important;
}
body.woocommerce-checkout .orilom-checkout-steps li.is-active .orilom-step-dot{
border-color:#d9ad00!important;
background:#e2b600!important;
color:#111!important;
box-shadow:
0 0 0 6px #fff,
0 0 0 9px rgba(226,182,0,.10)!important;
}
/* Future */
body.woocommerce-checkout .orilom-checkout-steps li:not(.is-done):not(.is-active) .orilom-step-dot{
background:#fff!important;
color:#a5a5a1!important;
}
/* Rapproche le contenu du checkout après le stepper */
body.woocommerce-checkout form.checkout{
margin-top:0!important;
}
/* Mobile */
@media(max-width:650px){
body.woocommerce-checkout .orilom-checkout-steps{
width:auto!important;
max-width:none!important;
margin:18px 14px 22px!important;
}
body.woocommerce-checkout .orilom-step-dot{
width:31px!important;
height:31px!important;
box-shadow:0 0 0 4px #fff!important;
}
body.woocommerce-checkout .orilom-checkout-steps::before{
top:15px!important;
}
body.woocommerce-checkout .orilom-checkout-steps li.is-active .orilom-step-dot{
box-shadow:
0 0 0 4px #fff,
0 0 0 7px rgba(226,182,0,.10)!important;
}
body.woocommerce-checkout .orilom-step-copy strong{
font-size:8.5px!important;
}
}
/* ======================================================================
ORILOM — FUNNEL UI V4 UNIFIED
Panier et Livraison partagent désormais le même langage visuel.
====================================================================== */
/* L'ancien bloc de réassurance panier disparaît définitivement. */
body.woocommerce-cart .orilom-cart-benefits{
display:none!important;
}
/* ---------- Stepper partagé : Panier + Checkout ---------- */
body.woocommerce-cart .orilom-order-steps,
body.woocommerce-checkout .orilom-order-steps{
position:relative!important;
display:grid!important;
grid-template-columns:repeat(3,1fr)!important;
gap:0!important;
width:calc(100% - 36px)!important;
max-width:620px!important;
margin:24px auto 28px!important;
padding:0!important;
list-style:none!important;
}
body.woocommerce-cart .orilom-order-steps::before,
body.woocommerce-checkout .orilom-order-steps::before{
content:""!important;
position:absolute!important;
z-index:0!important;
top:17px!important;
left:16.66%!important;
right:16.66%!important;
height:1px!important;
background:#dedcd5!important;
}
body.woocommerce-cart .orilom-order-steps li,
body.woocommerce-checkout .orilom-order-steps li{
position:relative!important;
z-index:1!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
color:#9c9c98!important;
text-align:center!important;
}
body.woocommerce-cart .orilom-order-steps li::after,
body.woocommerce-checkout .orilom-order-steps li::after{
content:none!important;
display:none!important;
}
body.woocommerce-cart .orilom-order-steps .orilom-step-dot,
body.woocommerce-checkout .orilom-order-steps .orilom-step-dot{
display:grid!important;
place-items:center!important;
width:34px!important;
height:34px!important;
margin:0!important;
border:1px solid #d8d6cf!important;
border-radius:50%!important;
background:#fff!important;
color:#999!important;
box-shadow:0 0 0 6px #fff!important;
font:800 10px/1 Arial,sans-serif!important;
}
body.woocommerce-cart .orilom-order-steps .orilom-step-copy,
body.woocommerce-checkout .orilom-order-steps .orilom-step-copy{
display:block!important;
margin-top:9px!important;
}
body.woocommerce-cart .orilom-order-steps .orilom-step-copy strong,
body.woocommerce-checkout .orilom-order-steps .orilom-step-copy strong{
display:block!important;
color:inherit!important;
font:800 9.5px/1.2 Arial,sans-serif!important;
letter-spacing:.045em!important;
text-transform:uppercase!important;
}
/* Étape terminée */
body.woocommerce-cart .orilom-order-steps li.is-done,
body.woocommerce-checkout .orilom-order-steps li.is-done{
color:#333!important;
}
body.woocommerce-cart .orilom-order-steps li.is-done .orilom-step-dot,
body.woocommerce-checkout .orilom-order-steps li.is-done .orilom-step-dot{
border-color:#111!important;
background:#111!important;
color:#e2b600!important;
}
/* Étape active */
body.woocommerce-cart .orilom-order-steps li.is-active,
body.woocommerce-checkout .orilom-order-steps li.is-active{
color:#111!important;
}
body.woocommerce-cart .orilom-order-steps li.is-active .orilom-step-dot,
body.woocommerce-checkout .orilom-order-steps li.is-active .orilom-step-dot{
border-color:#d9ad00!important;
background:#e2b600!important;
color:#111!important;
box-shadow:
0 0 0 6px #fff,
0 0 0 9px rgba(226,182,0,.10)!important;
}
/* ---------- Panier : même résumé que le checkout ---------- */
body.woocommerce-cart .cart_totals{
padding:20px!important;
border:1px solid #e8e6df!important;
border-radius:12px!important;
background:
radial-gradient(circle at 100% 0,rgba(226,182,0,.09),transparent 29%),
#fff!important;
box-shadow:0 14px 40px rgba(17,17,17,.05)!important;
}
body.woocommerce-cart .cart_totals h2{
margin:0 0 15px!important;
padding:0!important;
color:#111!important;
font:700 23px/1.1 Georgia,serif!important;
text-transform:none!important;
}
body.woocommerce-cart .cart_totals table.shop_table{
width:100%!important;
margin:0!important;
border:0!important;
border-collapse:collapse!important;
background:transparent!important;
}
body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td{
padding:10px 0!important;
border:0!important;
border-top:1px solid #ece9e1!important;
background:transparent!important;
color:#444!important;
font-size:9.5px!important;
line-height:1.45!important;
vertical-align:top!important;
}
body.woocommerce-cart .cart_totals table.shop_table tr:first-child th,
body.woocommerce-cart .cart_totals table.shop_table tr:first-child td{
border-top:0!important;
}
body.woocommerce-cart .cart_totals table.shop_table th{
width:42%!important;
color:#555!important;
font-weight:750!important;
}
body.woocommerce-cart .cart_totals table.shop_table td{
text-align:right!important;
}
body.woocommerce-cart .cart_totals .order-total th,
body.woocommerce-cart .cart_totals .order-total td{
padding-top:14px!important;
color:#111!important;
font-size:12px!important;
font-weight:900!important;
}
body.woocommerce-cart .cart_totals .order-total strong{
font-size:15px!important;
}
/* Réduction coupon plus propre */
body.woocommerce-cart .cart_totals .cart-discount td{
color:#6b5a10!important;
font-weight:750!important;
}
body.woocommerce-cart .cart_totals .woocommerce-remove-coupon{
display:inline-block!important;
margin-left:5px!important;
color:#888!important;
font-size:8px!important;
font-weight:500!important;
text-decoration:underline!important;
text-underline-offset:2px!important;
}
/* Ne pas afficher l'adresse entière dans le résumé du panier:
l'adresse finale appartient à l'étape Livraison. */
body.woocommerce-cart .woocommerce-shipping-destination{
display:none!important;
}
body.woocommerce-cart .shipping-calculator-button{
display:inline-flex!important;
margin-top:5px!important;
color:#777!important;
font-size:8.5px!important;
font-weight:650!important;
text-decoration:underline!important;
text-underline-offset:2px!important;
}
/* CTA = même hiérarchie que le bouton final checkout */
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button{
min-height:50px!important;
border-radius:7px!important;
background:#e2b600!important;
border-color:#e2b600!important;
color:#111!important;
font-size:9.5px!important;
font-weight:900!important;
letter-spacing:.05em!important;
text-transform:uppercase!important;
box-shadow:0 10px 24px rgba(226,182,0,.18)!important;
}
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover{
background:#d3aa00!important;
border-color:#d3aa00!important;
color:#111!important;
box-shadow:0 13px 28px rgba(226,182,0,.24)!important;
}
/* Coupon panier = action secondaire, même logique que checkout */
body.woocommerce-cart table.cart td.actions .coupon{
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
gap:7px!important;
max-width:310px!important;
}
body.woocommerce-cart #coupon_code{
height:40px!important;
min-height:40px!important;
border:1px solid #d8d6d0!important;
border-radius:6px!important;
background:#fff!important;
color:#111!important;
font-size:9.5px!important;
}
body.woocommerce-cart table.cart td.actions .coupon .button{
min-width:92px!important;
height:40px!important;
min-height:40px!important;
padding:0 12px!important;
border:1px solid #111!important;
border-radius:6px!important;
background:#fff!important;
color:#111!important;
font-size:8.5px!important;
line-height:38px!important;
}
body.woocommerce-cart table.cart td.actions .coupon .button:hover{
background:#111!important;
color:#fff!important;
}
/* Barre jaune : état courant non gras sur tout le tunnel */
body.woocommerce-cart .orilom-cart-breadcrumb-bar .is-current,
body.woocommerce-checkout .orilom-checkout-breadcrumb-bar .is-current{
font-weight:400!important;
}
/* Mobile */
@media(max-width:650px){
body.woocommerce-cart .orilom-order-steps,
body.woocommerce-checkout .orilom-order-steps{
width:auto!important;
max-width:none!important;
margin:18px 14px 22px!important;
}
body.woocommerce-cart .orilom-order-steps .orilom-step-dot,
body.woocommerce-checkout .orilom-order-steps .orilom-step-dot{
width:31px!important;
height:31px!important;
box-shadow:0 0 0 4px #fff!important;
}
body.woocommerce-cart .orilom-order-steps::before,
body.woocommerce-checkout .orilom-order-steps::before{
top:15px!important;
}
body.woocommerce-cart .orilom-order-steps li.is-active .orilom-step-dot,
body.woocommerce-checkout .orilom-order-steps li.is-active .orilom-step-dot{
box-shadow:
0 0 0 4px #fff,
0 0 0 7px rgba(226,182,0,.10)!important;
}
body.woocommerce-cart table.cart td.actions .coupon{
grid-template-columns:1fr!important;
max-width:none!important;
}
}
/* ORILOM — CART TITLE HARD HIDE */
body.woocommerce-cart h1,
body.woocommerce-cart .entry-title,
body.woocommerce-cart .page-title,
body.woocommerce-cart .entry-header,
body.woocommerce-cart .page-header{
display:none!important;
height:0!important;
min-height:0!important;
margin:0!important;
padding:0!important;
}
/* ======================================================================
ORILOM — ORDER RECEIVED / CONFIRMATION V5
Dernière étape : claire, rassurante, premium et cohérente avec le tunnel.
====================================================================== */
body.woocommerce-order-received{
--confirm-gold:#e2b600;
--confirm-gold-dark:#b88f00;
--confirm-ink:#111;
--confirm-muted:#717171;
--confirm-line:#e8e6df;
--confirm-soft:#faf9f6;
background:#fff!important;
}
/* Supprime les titres/template natifs redondants */
body.woocommerce-order-received h1.entry-title,
body.woocommerce-order-received .entry-title,
body.woocommerce-order-received .page-title,
body.woocommerce-order-received .entry-header,
body.woocommerce-order-received .page-header{
display:none!important;
height:0!important;
min-height:0!important;
margin:0!important;
padding:0!important;
}
/* Page full width, contenu interne centré */
body.woocommerce-order-received .content-wrap,
body.woocommerce-order-received main,
body.woocommerce-order-received .site-main{
width:100%!important;
max-width:none!important;
margin:0!important;
padding:0 0 78px!important;
}
body.woocommerce-order-received .page-content,
body.woocommerce-order-received .woocommerce,
body.woocommerce-order-received .woocommerce-order{
width:100%!important;
max-width:none!important;
margin:0!important;
}
/* Masque le vieux résumé horizontal et les messages gateway bruts */
body.woocommerce-order-received .woocommerce-thankyou-order-received,
body.woocommerce-order-received .woocommerce-order-overview,
body.woocommerce-order-received .woocommerce-order > p:not(.woocommerce-notice){
display:none!important;
}
/* ---------- Barre jaune ---------- */
body.woocommerce-order-received .orilom-confirm-breadcrumb-bar{
position:relative!important;
left:50%!important;
width:100vw!important;
max-width:100vw!important;
margin-left:-50vw!important;
display:flex!important;
align-items:center!important;
gap:12px!important;
min-height:43px!important;
padding:0 max(3vw,calc((100vw - 1040px)/2))!important;
background:var(--lux-gold,#dfb913)!important;
color:#4a3a00!important;
border:0!important;
border-radius:0!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:11px!important;
line-height:1!important;
}
body.woocommerce-order-received .orilom-confirm-breadcrumb-left{
display:flex!important;
align-items:center!important;
gap:10px!important;
min-width:0!important;
}
body.woocommerce-order-received .orilom-confirm-breadcrumb-bar a,
body.woocommerce-order-received .orilom-confirm-breadcrumb-bar span{
color:#4a3a00!important;
font-size:11px!important;
font-weight:400!important;
text-decoration:none!important;
white-space:nowrap!important;
}
body.woocommerce-order-received .orilom-confirm-breadcrumb-meta{
margin-left:auto!important;
}
/* ---------- Shared final stepper ---------- */
body.woocommerce-order-received .orilom-order-steps{
position:relative!important;
display:grid!important;
grid-template-columns:repeat(3,1fr)!important;
width:calc(100% - 36px)!important;
max-width:620px!important;
margin:24px auto 28px!important;
padding:0!important;
list-style:none!important;
}
body.woocommerce-order-received .orilom-order-steps::before{
content:""!important;
position:absolute!important;
z-index:0!important;
top:17px!important;
left:16.66%!important;
right:16.66%!important;
height:1px!important;
background:#d9d7d0!important;
}
body.woocommerce-order-received .orilom-order-steps li{
position:relative!important;
z-index:1!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
color:#333!important;
text-align:center!important;
}
body.woocommerce-order-received .orilom-step-dot{
display:grid!important;
place-items:center!important;
width:34px!important;
height:34px!important;
border:1px solid #111!important;
border-radius:50%!important;
background:#111!important;
color:var(--confirm-gold)!important;
box-shadow:0 0 0 6px #fff!important;
font:900 10px/1 Arial,sans-serif!important;
}
body.woocommerce-order-received .orilom-confirm-steps li.is-active .orilom-step-dot{
border-color:var(--confirm-gold)!important;
background:var(--confirm-gold)!important;
color:#111!important;
box-shadow:
0 0 0 6px #fff,
0 0 0 9px rgba(226,182,0,.10)!important;
}
body.woocommerce-order-received .orilom-step-copy{
margin-top:9px!important;
}
body.woocommerce-order-received .orilom-step-copy strong{
color:inherit!important;
font:800 9.5px/1.2 Arial,sans-serif!important;
letter-spacing:.045em!important;
text-transform:uppercase!important;
}
/* ---------- Success hero ---------- */
body.woocommerce-order-received .orilom-order-success{
display:grid!important;
grid-template-columns:64px minmax(0,1fr) auto!important;
gap:20px!important;
align-items:center!important;
width:calc(100% - 36px)!important;
max-width:1040px!important;
margin:0 auto 26px!important;
padding:24px!important;
border:1px solid #e9e5d8!important;
border-radius:14px!important;
background:
radial-gradient(circle at 100% 0,rgba(226,182,0,.11),transparent 28%),
#fff!important;
box-shadow:0 14px 42px rgba(17,17,17,.05)!important;
}
body.woocommerce-order-received .orilom-order-success-icon{
display:grid!important;
place-items:center!important;
width:54px!important;
height:54px!important;
border-radius:50%!important;
background:#111!important;
color:var(--confirm-gold)!important;
font-size:23px!important;
font-weight:900!important;
box-shadow:0 0 0 7px rgba(226,182,0,.09)!important;
}
body.woocommerce-order-received .orilom-order-success-kicker{
display:block!important;
margin-bottom:6px!important;
color:var(--confirm-gold-dark)!important;
font:800 8px/1 Arial,sans-serif!important;
letter-spacing:.17em!important;
}
body.woocommerce-order-received .orilom-order-success h1{
display:block!important;
height:auto!important;
margin:0!important;
padding:0!important;
color:#111!important;
font:700 28px/1.1 Georgia,serif!important;
}
body.woocommerce-order-received .orilom-order-success p{
max-width:560px!important;
margin:8px 0 0!important;
color:#6f6f6f!important;
font-size:10.5px!important;
line-height:1.6!important;
}
body.woocommerce-order-received .orilom-order-success-summary{
display:grid!important;
grid-template-columns:repeat(3,auto)!important;
gap:0!important;
border:1px solid #ece9e1!important;
border-radius:10px!important;
background:#fff!important;
overflow:hidden!important;
}
body.woocommerce-order-received .orilom-order-success-summary > div{
min-width:112px!important;
padding:12px 14px!important;
border-left:1px solid #ece9e1!important;
}
body.woocommerce-order-received .orilom-order-success-summary > div:first-child{
border-left:0!important;
}
body.woocommerce-order-received .orilom-order-success-summary small{
display:block!important;
margin-bottom:5px!important;
color:#999!important;
font-size:7.5px!important;
font-weight:700!important;
text-transform:uppercase!important;
letter-spacing:.05em!important;
}
body.woocommerce-order-received .orilom-order-success-summary strong{
display:block!important;
color:#111!important;
font-size:10px!important;
line-height:1.35!important;
font-weight:850!important;
}
/* ---------- Order details ---------- */
body.woocommerce-order-received .woocommerce-order-details,
body.woocommerce-order-received .woocommerce-customer-details{
width:calc(100% - 36px)!important;
max-width:1040px!important;
margin-left:auto!important;
margin-right:auto!important;
}
body.woocommerce-order-received .woocommerce-order-details{
margin-top:0!important;
margin-bottom:22px!important;
padding:22px!important;
border:1px solid var(--confirm-line)!important;
border-radius:12px!important;
background:#fff!important;
box-shadow:0 12px 34px rgba(17,17,17,.035)!important;
}
body.woocommerce-order-received .woocommerce-order-details__title,
body.woocommerce-order-received .woocommerce-column__title{
margin:0 0 15px!important;
color:#111!important;
font:700 21px/1.15 Georgia,serif!important;
}
body.woocommerce-order-received .woocommerce-order-details table.shop_table{
width:100%!important;
margin:0!important;
border:0!important;
border-collapse:collapse!important;
}
body.woocommerce-order-received .woocommerce-order-details table th,
body.woocommerce-order-received .woocommerce-order-details table td{
padding:11px 0!important;
border:0!important;
border-top:1px solid #ece9e1!important;
background:transparent!important;
color:#444!important;
font-size:10px!important;
line-height:1.45!important;
}
body.woocommerce-order-received .woocommerce-order-details table thead th{
border-top:0!important;
color:#888!important;
font-size:8px!important;
font-weight:800!important;
text-transform:uppercase!important;
letter-spacing:.05em!important;
}
body.woocommerce-order-received .woocommerce-order-details table td:last-child,
body.woocommerce-order-received .woocommerce-order-details table th:last-child{
text-align:right!important;
}
body.woocommerce-order-received .woocommerce-order-details tfoot tr:last-child th,
body.woocommerce-order-received .woocommerce-order-details tfoot tr:last-child td{
color:#111!important;
font-size:12px!important;
font-weight:900!important;
}
/* ---------- Addresses ---------- */
body.woocommerce-order-received .woocommerce-customer-details{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:18px!important;
margin-top:0!important;
}
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column{
float:none!important;
width:100%!important;
margin:0!important;
padding:20px!important;
border:1px solid var(--confirm-line)!important;
border-radius:12px!important;
background:#fff!important;
}
body.woocommerce-order-received .woocommerce-customer-details address{
margin:0!important;
padding:0!important;
border:0!important;
color:#555!important;
font-size:10px!important;
line-height:1.65!important;
}
/* ---------- Responsive ---------- */
@media(max-width:900px){
body.woocommerce-order-received .orilom-order-success{
grid-template-columns:54px 1fr!important;
}
body.woocommerce-order-received .orilom-order-success-summary{
grid-column:1/-1!important;
width:100%!important;
grid-template-columns:repeat(3,1fr)!important;
}
body.woocommerce-order-received .orilom-order-success-summary > div{
min-width:0!important;
}
}
@media(max-width:650px){
body.woocommerce-order-received .orilom-confirm-breadcrumb-bar{
min-height:41px!important;
padding:0 16px!important;
}
body.woocommerce-order-received .orilom-confirm-breadcrumb-meta{
display:none!important;
}
body.woocommerce-order-received .orilom-order-steps{
width:auto!important;
margin:18px 14px 22px!important;
}
body.woocommerce-order-received .orilom-step-dot{
width:31px!important;
height:31px!important;
box-shadow:0 0 0 4px #fff!important;
}
body.woocommerce-order-received .orilom-order-steps::before{
top:15px!important;
}
body.woocommerce-order-received .orilom-order-success,
body.woocommerce-order-received .woocommerce-order-details,
body.woocommerce-order-received .woocommerce-customer-details{
width:auto!important;
margin-left:14px!important;
margin-right:14px!important;
}
body.woocommerce-order-received .orilom-order-success{
grid-template-columns:1fr!important;
padding:19px!important;
text-align:center!important;
}
body.woocommerce-order-received .orilom-order-success-icon{
margin:0 auto!important;
}
body.woocommerce-order-received .orilom-order-success-summary{
grid-template-columns:1fr!important;
}
body.woocommerce-order-received .orilom-order-success-summary > div{
border-left:0!important;
border-top:1px solid #ece9e1!important;
}
body.woocommerce-order-received .orilom-order-success-summary > div:first-child{
border-top:0!important;
}
body.woocommerce-order-received .woocommerce-customer-details{
grid-template-columns:1fr!important;
}
}
/* ======================================================================
ORILOM — CONFIRMATION V6 ADDRESS POLISH
- Facturation + livraison côte à côte sur desktop
- Cartes plus compactes
- Camion visuel sur l'adresse de livraison
====================================================================== */
/* WooCommerce wraps both address columns inside .woocommerce-columns.
The previous V5 targeted the parent directly, so some themes still stacked them. */
body.woocommerce-order-received .woocommerce-customer-details{
width:calc(100% - 36px)!important;
max-width:1040px!important;
margin:0 auto!important;
display:block!important;
}
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-columns,
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-columns--addresses{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:18px!important;
width:100%!important;
margin:0!important;
padding:0!important;
}
/* Force WooCommerce's col2-set / col-1 / col-2 floats off */
body.woocommerce-order-received .woocommerce-customer-details .col2-set,
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column,
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column--billing-address,
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column--shipping-address{
float:none!important;
width:100%!important;
max-width:none!important;
margin:0!important;
}
/* Premium compact cards */
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column{
position:relative!important;
min-height:0!important;
padding:20px 22px!important;
overflow:hidden!important;
border:1px solid #e8e6df!important;
border-radius:12px!important;
background:
linear-gradient(180deg,rgba(255,255,255,.98),rgba(252,251,248,.98))!important;
box-shadow:0 10px 28px rgba(17,17,17,.035)!important;
}
/* Small gold accent */
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column::before{
content:""!important;
position:absolute!important;
left:0!important;
top:18px!important;
width:3px!important;
height:34px!important;
border-radius:0 4px 4px 0!important;
background:#e2b600!important;
}
/* Titles */
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column__title{
position:relative!important;
margin:0 0 14px!important;
padding-right:52px!important;
color:#111!important;
font:700 19px/1.15 Georgia,serif!important;
letter-spacing:-.01em!important;
}
/* Address typography */
body.woocommerce-order-received .woocommerce-customer-details address{
margin:0!important;
padding:0!important;
border:0!important;
color:#666!important;
font-size:9.5px!important;
line-height:1.65!important;
}
body.woocommerce-order-received .woocommerce-customer-details address p{
margin:7px 0 0!important;
}
/* Contact rows */
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-customer-details--phone,
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-customer-details--email{
margin-top:9px!important;
color:#444!important;
font-size:9px!important;
line-height:1.45!important;
}
/* Delivery truck badge on shipping card */
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column--shipping-address::after{
content:""!important;
position:absolute!important;
top:16px!important;
right:18px!important;
width:38px!important;
height:38px!important;
border:1px solid #eadb9a!important;
border-radius:50%!important;
background-color:#fffaf0!important;
background-repeat:no-repeat!important;
background-position:center!important;
background-size:20px 20px!important;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b88f00' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v9H3z'/%3E%3Cpath d='M14 9h4l3 3v3h-7z'/%3E%3Ccircle cx='7' cy='17' r='2'/%3E%3Ccircle cx='18' cy='17' r='2'/%3E%3Cpath d='M5 17H3v-2M16 17h-2'/%3E%3C/svg%3E")!important;
box-shadow:0 6px 16px rgba(184,143,0,.10)!important;
}
/* Billing card gets a smaller document badge for balance */
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column--billing-address::after{
content:""!important;
position:absolute!important;
top:16px!important;
right:18px!important;
width:38px!important;
height:38px!important;
border:1px solid #ece9e1!important;
border-radius:50%!important;
background-color:#fff!important;
background-repeat:no-repeat!important;
background-position:center!important;
background-size:18px 18px!important;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l3 3v15H6z'/%3E%3Cpath d='M15 3v4h4'/%3E%3Cpath d='M9 12h6M9 16h6'/%3E%3C/svg%3E")!important;
}
/* Keep the section visually attached to order details */
body.woocommerce-order-received .woocommerce-order-details{
margin-bottom:18px!important;
}
/* Mobile: stack cleanly */
@media(max-width:760px){
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-columns,
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-columns--addresses{
grid-template-columns:1fr!important;
gap:12px!important;
}
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column{
padding:18px!important;
}
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column__title{
font-size:18px!important;
}
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column--shipping-address::after,
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column--billing-address::after{
top:14px!important;
right:14px!important;
width:34px!important;
height:34px!important;
background-size:18px 18px!important;
}
}
/* ======================================================================
ORILOM — CONFIRMATION V7 ADDRESS GRID FIX
Root cause: WooCommerce .col2-set::before / ::after deviennent des items
CSS Grid et poussent Facturation à droite + Livraison sur la ligne suivante.
====================================================================== */
/* Neutralise les pseudo-elements clearfix WooCommerce qui cassent le grid */
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-columns::before,
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-columns::after,
body.woocommerce-order-received
.woocommerce-customer-details
.col2-set::before,
body.woocommerce-order-received
.woocommerce-customer-details
.col2-set::after{
content:none!important;
display:none!important;
}
/* Force le vrai wrapper WooCommerce en grid */
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-columns.woocommerce-columns--addresses,
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-columns.col2-set{
display:grid!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
gap:18px!important;
align-items:stretch!important;
width:100%!important;
margin:0!important;
padding:0!important;
}
/* Position explicite des deux cartes */
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-column--billing-address{
grid-column:1!important;
grid-row:1!important;
}
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-column--shipping-address{
grid-column:2!important;
grid-row:1!important;
}
/* Annule totalement les anciennes règles float WooCommerce */
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-column,
body.woocommerce-order-received
.woocommerce-customer-details
.col-1,
body.woocommerce-order-received
.woocommerce-customer-details
.col-2{
float:none!important;
clear:none!important;
width:auto!important;
max-width:none!important;
min-width:0!important;
margin:0!important;
}
/* Hauteur visuelle homogène */
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-column{
height:100%!important;
}
/* Mobile : retour en une seule colonne */
@media(max-width:760px){
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-columns.woocommerce-columns--addresses,
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-columns.col2-set{
grid-template-columns:1fr!important;
gap:12px!important;
}
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-column--billing-address,
body.woocommerce-order-received
.woocommerce-customer-details
.woocommerce-column--shipping-address{
grid-column:1!important;
grid-row:auto!important;
}
}
/* ======================================================================
ORILOM — EMPTY CART PREMIUM V9
====================================================================== */
/* Masquer complètement le rendu WooCommerce brut */
body.woocommerce-cart .cart-empty.woocommerce-info,
body.woocommerce-cart .return-to-shop{
display:none!important;
}
/* Aucun vieux titre Panier */
body.woocommerce-cart h1,
body.woocommerce-cart .entry-title,
body.woocommerce-cart .page-title,
body.woocommerce-cart .entry-header,
body.woocommerce-cart .page-header{
display:none!important;
height:0!important;
min-height:0!important;
margin:0!important;
padding:0!important;
}
/* Page full width */
body.woocommerce-cart .content-wrap,
body.woocommerce-cart main,
body.woocommerce-cart .site-main{
width:100%!important;
max-width:none!important;
margin:0!important;
padding:0 0 74px!important;
}
body.woocommerce-cart .page-content,
body.woocommerce-cart .woocommerce{
width:100%!important;
max-width:none!important;
margin:0!important;
}
/* ---------- Barre jaune ---------- */
body.woocommerce-cart .orilom-empty-cart-bar{
position:relative!important;
left:50%!important;
width:100vw!important;
max-width:100vw!important;
min-height:43px!important;
margin-left:-50vw!important;
display:flex!important;
align-items:center!important;
gap:12px!important;
padding:0 max(3vw,calc((100vw - 1040px)/2))!important;
background:var(--lux-gold,#dfb913)!important;
color:#4a3a00!important;
border:0!important;
border-radius:0!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:11px!important;
line-height:1!important;
}
body.woocommerce-cart .orilom-empty-cart-bar-left{
display:flex!important;
align-items:center!important;
gap:10px!important;
}
body.woocommerce-cart .orilom-empty-cart-bar a,
body.woocommerce-cart .orilom-empty-cart-bar span{
color:#4a3a00!important;
font-size:11px!important;
font-weight:400!important;
text-decoration:none!important;
white-space:nowrap!important;
}
body.woocommerce-cart .orilom-empty-cart-bar-meta{
margin-left:auto!important;
}
/* ---------- Hero ---------- */
body.woocommerce-cart .orilom-empty-cart-hero{
width:calc(100% - 36px)!important;
max-width:760px!important;
margin:52px auto 58px!important;
padding:0!important;
text-align:center!important;
}
body.woocommerce-cart .orilom-empty-cart-icon{
display:grid!important;
place-items:center!important;
width:68px!important;
height:68px!important;
margin:0 auto 18px!important;
border:1px solid #eadb96!important;
border-radius:50%!important;
background:
radial-gradient(circle at 50% 30%,#fffdf2,#fff8db)!important;
color:#b78f00!important;
box-shadow:
0 0 0 8px rgba(226,182,0,.07),
0 12px 30px rgba(17,17,17,.05)!important;
}
body.woocommerce-cart .orilom-empty-cart-icon svg{
width:28px!important;
height:28px!important;
}
body.woocommerce-cart .orilom-empty-cart-kicker{
display:block!important;
margin-bottom:8px!important;
color:#b48c00!important;
font:800 8px/1 Arial,sans-serif!important;
letter-spacing:.18em!important;
}
body.woocommerce-cart .orilom-empty-cart-hero h1{
display:block!important;
height:auto!important;
min-height:0!important;
margin:0!important;
padding:0!important;
color:#111!important;
font:700 clamp(34px,4vw,48px)/1.05 Georgia,serif!important;
letter-spacing:-.025em!important;
}
body.woocommerce-cart .orilom-empty-cart-hero p{
max-width:560px!important;
margin:14px auto 0!important;
color:#6e6e6e!important;
font-size:11px!important;
line-height:1.7!important;
}
body.woocommerce-cart .orilom-empty-cart-actions{
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:9px!important;
margin-top:23px!important;
}
body.woocommerce-cart .orilom-empty-cart-actions a{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:45px!important;
padding:0 18px!important;
border-radius:7px!important;
font-size:9px!important;
line-height:1!important;
font-weight:850!important;
letter-spacing:.045em!important;
text-transform:uppercase!important;
text-decoration:none!important;
transition:
background .18s ease,
color .18s ease,
transform .18s ease,
box-shadow .18s ease!important;
}
body.woocommerce-cart .orilom-empty-cart-primary{
border:1px solid #111!important;
background:#111!important;
color:#fff!important;
box-shadow:0 8px 22px rgba(17,17,17,.10)!important;
}
body.woocommerce-cart .orilom-empty-cart-primary:hover{
background:#262626!important;
color:#fff!important;
transform:translateY(-1px)!important;
}
body.woocommerce-cart .orilom-empty-cart-secondary{
border:1px solid #d8d6cf!important;
background:#fff!important;
color:#111!important;
}
body.woocommerce-cart .orilom-empty-cart-secondary:hover{
border-color:#111!important;
transform:translateY(-1px)!important;
}
/* ---------- Suggestions ---------- */
body.woocommerce-cart .orilom-empty-cart-products{
width:calc(100% - 36px)!important;
max-width:1040px!important;
margin:0 auto!important;
padding-top:28px!important;
border-top:1px solid #ece9e1!important;
}
body.woocommerce-cart .orilom-empty-cart-products-head{
display:flex!important;
align-items:flex-end!important;
justify-content:space-between!important;
gap:20px!important;
margin-bottom:22px!important;
}
body.woocommerce-cart .orilom-empty-cart-products-head span{
display:block!important;
margin-bottom:5px!important;
color:#b48c00!important;
font-size:7.5px!important;
font-weight:850!important;
letter-spacing:.16em!important;
}
body.woocommerce-cart .orilom-empty-cart-products-head h2{
margin:0!important;
color:#111!important;
font:700 27px/1.05 Georgia,serif!important;
letter-spacing:-.015em!important;
}
body.woocommerce-cart .orilom-empty-cart-products-head > a{
color:#555!important;
font-size:8.5px!important;
font-weight:700!important;
text-decoration:none!important;
}
body.woocommerce-cart .orilom-empty-cart-products-head > a:hover{
color:#111!important;
}
body.woocommerce-cart .orilom-empty-cart-grid{
display:grid!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:22px!important;
}
body.woocommerce-cart .orilom-empty-cart-product{
min-width:0!important;
}
body.woocommerce-cart .orilom-empty-cart-product-image{
display:block!important;
overflow:hidden!important;
aspect-ratio:1/1!important;
background:#fafafa!important;
border:1px solid #efefec!important;
border-radius:8px!important;
}
body.woocommerce-cart .orilom-empty-cart-product-image img{
display:block!important;
width:100%!important;
height:100%!important;
object-fit:contain!important;
transition:transform .22s ease!important;
}
body.woocommerce-cart .orilom-empty-cart-product:hover img{
transform:scale(1.025)!important;
}
body.woocommerce-cart .orilom-empty-cart-product-title{
display:block!important;
margin-top:11px!important;
color:#111!important;
font-size:9px!important;
line-height:1.45!important;
font-weight:750!important;
text-decoration:none!important;
text-transform:uppercase!important;
}
body.woocommerce-cart .orilom-empty-cart-product-price{
margin-top:5px!important;
color:#111!important;
font-size:9px!important;
font-weight:850!important;
}
body.woocommerce-cart .orilom-empty-cart-product-price del{
color:#999!important;
font-weight:500!important;
}
body.woocommerce-cart .orilom-empty-cart-product-price ins{
color:#111!important;
text-decoration:none!important;
font-weight:850!important;
}
/* Keep footer from feeling detached */
body.woocommerce-cart .site-footer{
margin-top:64px!important;
}
/* ---------- Responsive ---------- */
@media(max-width:820px){
body.woocommerce-cart .orilom-empty-cart-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:24px 14px!important;
}
}
@media(max-width:650px){
body.woocommerce-cart .orilom-empty-cart-bar{
min-height:41px!important;
padding:0 16px!important;
}
body.woocommerce-cart .orilom-empty-cart-bar-meta{
display:none!important;
}
body.woocommerce-cart .orilom-empty-cart-hero{
width:auto!important;
margin:38px 14px 44px!important;
}
body.woocommerce-cart .orilom-empty-cart-actions{
flex-direction:column!important;
}
body.woocommerce-cart .orilom-empty-cart-actions a{
width:100%!important;
}
body.woocommerce-cart .orilom-empty-cart-products{
width:auto!important;
margin:0 14px!important;
}
body.woocommerce-cart .orilom-empty-cart-products-head{
align-items:flex-start!important;
flex-direction:column!important;
}
}
/* ======================================================================
ORILOM — PRODUCT CONVERSION UI V10
Implémenté sur le theme.css historique fourni par le client.
Objectif : fiche produit plus premium, plus lisible et plus orientée achat.
====================================================================== */
/* ---------- Hiérarchie du résumé ---------- */
body.single-product div.product .summary{
padding-top:2px!important;
}
body.single-product div.product .summary > .price{
margin:0 0 10px!important;
color:#111!important;
font-size:15px!important;
line-height:1!important;
font-weight:900!important;
}
body.single-product div.product .summary .product_title{
max-width:520px!important;
margin:0 0 10px!important;
color:#121826!important;
font-size:27px!important;
line-height:1.08!important;
letter-spacing:-.025em!important;
}
body.single-product div.product .summary .woocommerce-product-details__short-description{
max-width:540px!important;
margin:0 0 14px!important;
color:#666!important;
font-size:11px!important;
line-height:1.72!important;
}
body.single-product div.product .summary .woocommerce-product-details__short-description p{
margin:0!important;
}
/* ---------- Notes principales ---------- */
body.single-product .orilom-notes{
margin:14px 0 0!important;
padding:14px 0 13px!important;
border-top:1px solid #ecebe7!important;
border-bottom:1px solid #ecebe7!important;
}
body.single-product .orilom-notes > span{
display:block!important;
margin-bottom:9px!important;
color:#8b8b87!important;
font-size:8px!important;
line-height:1!important;
font-weight:850!important;
letter-spacing:.15em!important;
text-transform:uppercase!important;
}
body.single-product .orilom-notes > div{
display:flex!important;
flex-wrap:wrap!important;
gap:7px!important;
}
body.single-product .orilom-notes b{
display:inline-flex!important;
align-items:center!important;
min-height:28px!important;
margin:0!important;
padding:0 11px!important;
border:1px solid #e0bd43!important;
border-radius:999px!important;
background:#fffaf0!important;
color:#5d4900!important;
font-size:9px!important;
line-height:1!important;
font-weight:750!important;
}
/* ---------- Informations compactes ---------- */
body.single-product .orilom-product-facts{
display:flex!important;
align-items:center!important;
flex-wrap:wrap!important;
gap:8px!important;
margin:11px 0 0!important;
color:#777!important;
font-size:9px!important;
line-height:1.2!important;
font-weight:650!important;
}
body.single-product .orilom-product-facts b{
color:#c9c7c0!important;
font-weight:400!important;
}
body.single-product .orilom-product-facts .is-stock{
color:#315e3b!important;
}
body.single-product .orilom-product-facts .is-stock i{
display:inline-block!important;
width:6px!important;
height:6px!important;
margin-right:5px!important;
border-radius:50%!important;
background:#4f8d59!important;
}
/* ---------- Réassurance compacte ---------- */
body.single-product .orilom-purchase-assurance{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:0!important;
margin:15px 0 10px!important;
overflow:hidden!important;
border:1px solid #e9e4d4!important;
border-radius:9px!important;
background:#fffdf7!important;
}
body.single-product .orilom-purchase-assurance span{
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:7px!important;
min-height:42px!important;
padding:0 9px!important;
border-left:1px solid #ece7d7!important;
color:#555!important;
text-align:center!important;
}
body.single-product .orilom-purchase-assurance span:first-child{
border-left:0!important;
}
body.single-product .orilom-purchase-assurance strong{
font-size:8.5px!important;
line-height:1.25!important;
font-weight:750!important;
}
body.single-product .orilom-purchase-assurance i{
display:block!important;
flex:0 0 17px!important;
width:17px!important;
height:17px!important;
background-position:center!important;
background-repeat:no-repeat!important;
background-size:15px 15px!important;
}
body.single-product .orilom-assurance-cash{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b58e00' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.4'/%3E%3Cpath d='M7 9h.01M17 15h.01'/%3E%3C/svg%3E")!important;
}
body.single-product .orilom-assurance-phone{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b58e00' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.18 2 19.8 19.8 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.62 2.63a2 2 0 0 1-.45 2.11L8 9.73a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.85.29 1.73.5 2.63.62A2 2 0 0 1 22 16.9z'/%3E%3C/svg%3E")!important;
}
body.single-product .orilom-assurance-truck{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b58e00' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v9H3zM14 9h4l3 3v3h-7z'/%3E%3Ccircle cx='7' cy='17' r='2'/%3E%3Ccircle cx='18' cy='17' r='2'/%3E%3C/svg%3E")!important;
}
/* Les anciens blocs n'existent plus dans le nouveau rendu.
Cette règle protège aussi contre un cache HTML ancien. */
body.single-product .orilom-cod-box,
body.single-product .orilom-product-trust{
display:none!important;
}
/* ---------- Zone d'achat ---------- */
body.single-product div.product form.cart{
margin-top:10px!important;
padding:10px!important;
border:1px solid #ecebe7!important;
border-radius:9px!important;
background:#fafafa!important;
box-shadow:none!important;
}
body.single-product div.product form.cart .quantity,
body.single-product div.product form.cart .qty,
body.single-product div.product form.cart .single_add_to_cart_button,
body.single-product div.product form.cart .lux-buy-now{
min-height:46px!important;
height:46px!important;
}
body.single-product div.product form.cart .single_add_to_cart_button{
border-radius:6px!important;
background:#111!important;
font-size:9px!important;
letter-spacing:.035em!important;
}
body.single-product div.product form.cart .lux-buy-now{
border-radius:6px!important;
background:#e1b600!important;
color:#111!important;
font-size:9px!important;
letter-spacing:.035em!important;
}
body.single-product div.product form.cart .lux-buy-now:hover{
background:#d1a900!important;
}
body.single-product div.product form.cart .orilom-wishlist-button{
margin-top:8px!important;
color:#666!important;
font-size:8.5px!important;
font-weight:650!important;
}
/* ---------- Pourquoi vous allez l'aimer ---------- */
body.single-product .orilom-love-it{
margin:16px 0 0!important;
padding:15px 0 0!important;
border-top:1px solid #ecebe7!important;
}
body.single-product .orilom-love-it-head{
display:flex!important;
align-items:end!important;
justify-content:space-between!important;
gap:16px!important;
margin-bottom:10px!important;
}
body.single-product .orilom-love-it-head > span{
color:#b48b00!important;
font-size:7.5px!important;
font-weight:850!important;
letter-spacing:.16em!important;
}
body.single-product .orilom-love-it-head h3{
margin:0!important;
color:#111!important;
font:700 16px/1.15 Georgia,serif!important;
}
body.single-product .orilom-love-it-grid{
display:grid!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:7px!important;
}
body.single-product .orilom-love-it-grid > span{
display:grid!important;
grid-template-columns:22px minmax(0,1fr)!important;
grid-template-rows:auto auto!important;
column-gap:7px!important;
align-items:center!important;
min-width:0!important;
padding:9px!important;
border:1px solid #ece9e0!important;
border-radius:8px!important;
background:#fff!important;
}
body.single-product .orilom-love-it-grid i{
grid-row:1/3!important;
display:grid!important;
place-items:center!important;
width:22px!important;
height:22px!important;
border-radius:50%!important;
background:#fff8dc!important;
}
body.single-product .orilom-love-it-grid i::before{
content:"✦"!important;
color:#b58e00!important;
font-size:10px!important;
}
body.single-product .orilom-love-it-grid i.is-service::before{
content:"✓"!important;
}
body.single-product .orilom-love-it-grid strong{
overflow:hidden!important;
color:#222!important;
font-size:8.5px!important;
line-height:1.2!important;
font-weight:800!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
body.single-product .orilom-love-it-grid small{
overflow:hidden!important;
color:#999!important;
font-size:7px!important;
line-height:1.2!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
/* ---------- Onglets parfum ---------- */
body.single-product .woocommerce-tabs{
margin-top:54px!important;
}
body.single-product .woocommerce-tabs ul.tabs{
gap:6px!important;
}
body.single-product .woocommerce-tabs ul.tabs li a{
padding:0 15px!important;
min-height:44px!important;
font-size:9.5px!important;
}
body.single-product .woocommerce-tabs .panel{
padding-top:24px!important;
}
body.single-product .orilom-notes-tab-content{
max-width:760px!important;
}
body.single-product .orilom-notes-tab-content > h2{
margin:0 0 8px!important;
}
body.single-product .orilom-notes-tab-content > p{
margin:0 0 16px!important;
color:#777!important;
font-size:10.5px!important;
}
body.single-product .orilom-notes-tab-grid{
display:flex!important;
flex-wrap:wrap!important;
gap:8px!important;
}
body.single-product .orilom-notes-tab-grid span{
display:inline-flex!important;
align-items:center!important;
min-height:34px!important;
padding:0 14px!important;
border:1px solid #e0bd43!important;
border-radius:999px!important;
background:#fffaf0!important;
color:#5d4900!important;
font-size:9.5px!important;
font-weight:750!important;
}
/* ---------- Équilibre desktop ---------- */
@media(min-width:1100px){
body.single-product div.product{
grid-template-columns:minmax(0,1.04fr) minmax(390px,.96fr)!important;
gap:48px!important;
}
body.single-product div.product .summary{
max-width:560px!important;
}
}
/* ---------- Tablette ---------- */
@media(max-width:900px){
body.single-product .orilom-love-it-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
body.single-product .orilom-purchase-assurance{
grid-template-columns:1fr!important;
}
body.single-product .orilom-purchase-assurance span{
justify-content:flex-start!important;
min-height:38px!important;
border-left:0!important;
border-top:1px solid #ece7d7!important;
padding:0 12px!important;
}
body.single-product .orilom-purchase-assurance span:first-child{
border-top:0!important;
}
}
/* ---------- Mobile ---------- */
@media(max-width:650px){
body.single-product div.product .summary .product_title{
font-size:23px!important;
}
body.single-product .orilom-love-it-head{
display:block!important;
}
body.single-product .orilom-love-it-head h3{
margin-top:5px!important;
font-size:17px!important;
}
body.single-product .orilom-love-it-grid{
grid-template-columns:1fr 1fr!important;
}
body.single-product .woocommerce-tabs ul.tabs{
gap:2px!important;
}
body.single-product .woocommerce-tabs ul.tabs li a{
padding:0 12px!important;
font-size:9px!important;
}
}
/* ======================================================================
ORILOM — PRODUCT PURCHASE FOCUS V11
Deep UI/UX polish:
- trust strip vert doux (calme / sécurité visuelle)
- un seul CTA principal
- CTA rouge profond, premium, avec micro-animation UNIQUE
====================================================================== */
/* ----------------------------------------------------------------------
1. Réassurance : vert doux, pas vert agressif
---------------------------------------------------------------------- */
body.single-product .orilom-purchase-assurance{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:0!important;
margin:10px 0 10px!important;
overflow:hidden!important;
border:1px solid #cfe7d6!important;
border-radius:9px!important;
background:
linear-gradient(180deg,#f5fcf7 0%,#eef9f2 100%)!important;
box-shadow:
0 6px 18px rgba(38,117,72,.045)!important;
}
body.single-product .orilom-purchase-assurance span{
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:8px!important;
min-height:44px!important;
padding:8px 10px!important;
border-left:1px solid #d9ecdf!important;
color:#245437!important;
background:transparent!important;
text-align:center!important;
}
body.single-product .orilom-purchase-assurance span:first-child{
border-left:0!important;
}
body.single-product .orilom-purchase-assurance strong{
color:#245437!important;
font-size:8.5px!important;
line-height:1.25!important;
font-weight:750!important;
}
body.single-product .orilom-purchase-assurance i{
flex:0 0 19px!important;
width:19px!important;
height:19px!important;
border-radius:50%!important;
background-color:#dff3e5!important;
background-position:center!important;
background-repeat:no-repeat!important;
background-size:13px 13px!important;
}
/* Same icons, now in reassuring green. */
body.single-product .orilom-assurance-cash{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232e7d4f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.4'/%3E%3Cpath d='M7 9h.01M17 15h.01'/%3E%3C/svg%3E")!important;
}
body.single-product .orilom-assurance-phone{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232e7d4f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.18 2 19.8 19.8 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.62 2.63a2 2 0 0 1-.45 2.11L8 9.73a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.85.29 1.73.5 2.63.62A2 2 0 0 1 22 16.9z'/%3E%3C/svg%3E")!important;
}
body.single-product .orilom-assurance-truck{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232e7d4f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v9H3zM14 9h4l3 3v3h-7z'/%3E%3Ccircle cx='7' cy='17' r='2'/%3E%3Ccircle cx='18' cy='17' r='2'/%3E%3C/svg%3E")!important;
}
/* ----------------------------------------------------------------------
2. Zone d'achat : quantité + UN CTA
---------------------------------------------------------------------- */
body.single-product div.product form.cart{
display:grid!important;
grid-template-columns:76px minmax(0,1fr)!important;
gap:8px!important;
align-items:stretch!important;
margin:8px 0 8px!important;
padding:10px!important;
border:1px solid #e8e7e3!important;
border-radius:9px!important;
background:#fafafa!important;
box-shadow:none!important;
}
body.single-product div.product form.cart .quantity{
grid-column:1!important;
width:76px!important;
height:46px!important;
margin:0!important;
}
body.single-product div.product form.cart .qty{
width:76px!important;
height:46px!important;
min-height:46px!important;
margin:0!important;
padding:0 8px!important;
border:1px solid #d9d7d1!important;
border-radius:6px!important;
background:#fff!important;
color:#111!important;
text-align:center!important;
font-size:11px!important;
font-weight:750!important;
}
body.single-product div.product form.cart .qty:focus{
border-color:#8f1d1d!important;
outline:0!important;
box-shadow:0 0 0 3px rgba(143,29,29,.06)!important;
}
/* Cache HTML ancien: jamais afficher l'ancien second CTA. */
body.single-product div.product form.cart .lux-buy-now{
display:none!important;
}
/* ----------------------------------------------------------------------
3. CTA rouge profond : focal, pas "rouge erreur"
---------------------------------------------------------------------- */
body.single-product div.product form.cart .single_add_to_cart_button{
position:relative!important;
grid-column:2!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
width:100%!important;
min-width:0!important;
height:46px!important;
min-height:46px!important;
margin:0!important;
padding:0 48px 0 18px!important;
overflow:hidden!important;
border:1px solid #9f1f1f!important;
border-radius:6px!important;
background:
linear-gradient(180deg,#bd2a2a 0%,#a91f1f 100%)!important;
color:#fff!important;
font-size:9.5px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:.075em!important;
text-transform:uppercase!important;
box-shadow:
0 8px 18px rgba(169,31,31,.16),
inset 0 1px 0 rgba(255,255,255,.08)!important;
transition:
transform .18s ease,
background .18s ease,
box-shadow .18s ease!important;
/* Une seule sollicitation visuelle après lecture de la fiche. */
animation:orilomPurchaseNudge .84s cubic-bezier(.22,.8,.28,1) 3.2s 1 both!important;
}
/* Arrow = forward action */
body.single-product div.product form.cart .single_add_to_cart_button::after{
content:"→"!important;
position:absolute!important;
top:50%!important;
right:18px!important;
color:#fff!important;
font-size:16px!important;
line-height:1!important;
font-weight:400!important;
transform:translateY(-50%)!important;
transition:transform .18s ease!important;
}
/* Subtle highlight passes once with the nudge. */
body.single-product div.product form.cart .single_add_to_cart_button::before{
content:""!important;
position:absolute!important;
top:-45%!important;
left:-30%!important;
width:17%!important;
height:190%!important;
pointer-events:none!important;
background:
linear-gradient(
90deg,
transparent,
rgba(255,255,255,.22),
transparent
)!important;
transform:skewX(-18deg)!important;
animation:orilomPurchaseShine .72s ease 3.27s 1 both!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:hover{
background:
linear-gradient(180deg,#c73131 0%,#a61b1b 100%)!important;
border-color:#8e1818!important;
transform:translateY(-2px)!important;
box-shadow:
0 12px 25px rgba(169,31,31,.22),
0 0 0 4px rgba(169,31,31,.055)!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:hover::after{
transform:translate(4px,-50%)!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:active{
transform:translateY(0) scale(.995)!important;
}
/* Favori garde une priorité secondaire. */
body.single-product div.product form.cart .orilom-wishlist-button{
grid-column:1 / -1!important;
justify-self:start!important;
margin:4px 0 0!important;
min-height:auto!important;
height:auto!important;
}
/* Le mouvement demandé, limité à 2px et exécuté une seule fois. */
@keyframes orilomPurchaseNudge{
0%,100%{
transform:translate(0,0);
}
22%{
transform:translate(-2px,-2px);
}
51%{
transform:translate(2px,2px);
}
75%{
transform:translate(-1px,1px);
}
}
@keyframes orilomPurchaseShine{
0%{
left:-30%;
opacity:0;
}
18%{
opacity:1;
}
100%{
left:118%;
opacity:0;
}
}
/* Pas d'animation pour les utilisateurs qui demandent moins de mouvement. */
@media(prefers-reduced-motion:reduce){
body.single-product div.product form.cart .single_add_to_cart_button,
body.single-product div.product form.cart .single_add_to_cart_button::before{
animation:none!important;
}
}
/* ----------------------------------------------------------------------
4. Responsive
---------------------------------------------------------------------- */
@media(max-width:760px){
body.single-product .orilom-purchase-assurance{
grid-template-columns:repeat(3,minmax(145px,1fr))!important;
overflow-x:auto!important;
scrollbar-width:none!important;
}
body.single-product .orilom-purchase-assurance::-webkit-scrollbar{
display:none!important;
}
body.single-product div.product form.cart{
grid-template-columns:68px minmax(0,1fr)!important;
padding:8px!important;
gap:7px!important;
}
body.single-product div.product form.cart .quantity,
body.single-product div.product form.cart .qty{
width:68px!important;
}
body.single-product div.product form.cart .single_add_to_cart_button{
padding-left:12px!important;
padding-right:39px!important;
font-size:8.5px!important;
letter-spacing:.05em!important;
}
}
@media(max-width:430px){
body.single-product .orilom-purchase-assurance{
grid-template-columns:repeat(3,minmax(132px,1fr))!important;
}
body.single-product .orilom-purchase-assurance span{
min-height:42px!important;
padding:7px 8px!important;
}
body.single-product .orilom-purchase-assurance strong{
font-size:8px!important;
}
}
/* ======================================================================
ORILOM — PRODUCT CTA V12 THEME GOLD + CART ICON
- CTA reprend la couleur ORILOM (or/noir)
- occupe tout l'espace disponible à droite de la quantité
- icône chariot intégrée
- conserve une micro-animation discrète
====================================================================== */
body.single-product div.product form.cart{
grid-template-columns:68px minmax(0,1fr)!important;
gap:8px!important;
}
body.single-product div.product form.cart .quantity,
body.single-product div.product form.cart .qty{
width:68px!important;
}
/* CTA ORILOM = or de la marque, texte noir */
body.single-product div.product form.cart .single_add_to_cart_button{
grid-column:2!important;
width:100%!important;
min-width:0!important;
max-width:none!important;
padding-left:48px!important;
padding-right:44px!important;
border:1px solid var(--lux-gold-dark,#b88f00)!important;
border-radius:6px!important;
background:
linear-gradient(
180deg,
var(--lux-gold,#dfb913) 0%,
#d4ad08 100%
)!important;
color:#111!important;
box-shadow:
0 9px 20px rgba(223,185,19,.20),
inset 0 1px 0 rgba(255,255,255,.28)!important;
}
/* Chariot à gauche */
body.single-product div.product form.cart .single_add_to_cart_button{
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2l2.2 9.2a2 2 0 0 0 1.95 1.55h7.7a2 2 0 0 0 1.95-1.55L20.2 8H6.2'/%3E%3Ccircle cx='10' cy='19' r='1.3'/%3E%3Ccircle cx='17' cy='19' r='1.3'/%3E%3C/svg%3E"),
linear-gradient(
180deg,
var(--lux-gold,#dfb913) 0%,
#d4ad08 100%
)!important;
background-repeat:no-repeat,no-repeat!important;
background-position:18px center,center!important;
background-size:18px 18px,100% 100%!important;
}
/* Flèche = noir, cohérente avec le chariot */
body.single-product div.product form.cart .single_add_to_cart_button::after{
color:#111!important;
}
/* Hover premium, sans changer de langage visuel */
body.single-product div.product form.cart .single_add_to_cart_button:hover{
border-color:#a98300!important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2l2.2 9.2a2 2 0 0 0 1.95 1.55h7.7a2 2 0 0 0 1.95-1.55L20.2 8H6.2'/%3E%3Ccircle cx='10' cy='19' r='1.3'/%3E%3Ccircle cx='17' cy='19' r='1.3'/%3E%3C/svg%3E"),
linear-gradient(180deg,#e7c425 0%,#d7af06 100%)!important;
color:#111!important;
box-shadow:
0 12px 26px rgba(223,185,19,.27),
0 0 0 4px rgba(223,185,19,.07)!important;
}
/* La lueur reste subtile, le chariot reste visible */
body.single-product div.product form.cart .single_add_to_cart_button::before{
background:
linear-gradient(
90deg,
transparent,
rgba(255,255,255,.32),
transparent
)!important;
}
/* Mobile : conserve chariot + CTA large */
@media(max-width:650px){
body.single-product div.product form.cart{
grid-template-columns:62px minmax(0,1fr)!important;
}
body.single-product div.product form.cart .quantity,
body.single-product div.product form.cart .qty{
width:62px!important;
}
body.single-product div.product form.cart .single_add_to_cart_button{
padding-left:42px!important;
padding-right:34px!important;
background-position:14px center,center!important;
background-size:17px 17px,100% 100%!important;
}
}
/* ======================================================================
ORILOM — PRODUCT CTA V13 MOTION
- Corrige le chariot répété
- Danse automatique 1 fois après 3 secondes
- Hover : CTA s'agrandit légèrement + danse
- Chariot traverse le bouton vers la flèche
====================================================================== */
/* IMPORTANT : pas de background-image chariot sur le bouton.
Le chariot devient un pseudo-élément unique. */
body.single-product div.product form.cart .single_add_to_cart_button{
position:relative!important;
overflow:hidden!important;
background-image:
linear-gradient(
180deg,
var(--lux-gold,#dfb913) 0%,
#d4ad08 100%
)!important;
background-repeat:no-repeat!important;
background-position:center!important;
background-size:100% 100%!important;
transform-origin:center!important;
animation:
orilomCtaEntranceDance .82s cubic-bezier(.22,.8,.28,1) 3s 1 both!important;
}
/* Chariot unique à gauche */
body.single-product div.product form.cart .single_add_to_cart_button::before{
content:""!important;
position:absolute!important;
z-index:2!important;
top:50%!important;
left:17px!important;
width:20px!important;
height:20px!important;
margin:0!important;
background-color:transparent!important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2l2.2 9.2a2 2 0 0 0 1.95 1.55h7.7a2 2 0 0 0 1.95-1.55L20.2 8H6.2'/%3E%3Ccircle cx='10' cy='19' r='1.3'/%3E%3Ccircle cx='17' cy='19' r='1.3'/%3E%3C/svg%3E")!important;
background-repeat:no-repeat!important;
background-position:center!important;
background-size:20px 20px!important;
opacity:1!important;
transform:translateY(-50%)!important;
animation:
orilomCartIntro .72s cubic-bezier(.22,.8,.28,1) 3.08s 1 both!important;
pointer-events:none!important;
}
/* Flèche toujours visible à droite */
body.single-product div.product form.cart .single_add_to_cart_button::after{
content:"→"!important;
position:absolute!important;
z-index:3!important;
top:50%!important;
right:17px!important;
color:#111!important;
font-size:16px!important;
line-height:1!important;
font-weight:500!important;
transform:translateY(-50%)!important;
transition:
transform .22s ease,
right .22s ease!important;
}
/* Hover : agrandissement + petite danse */
body.single-product div.product form.cart .single_add_to_cart_button:hover{
background-image:
linear-gradient(
180deg,
#e8c72a 0%,
#d8b107 100%
)!important;
transform:scale(1.028)!important;
box-shadow:
0 14px 30px rgba(223,185,19,.30),
0 0 0 4px rgba(223,185,19,.075)!important;
animation:
orilomCtaHoverDance .62s cubic-bezier(.22,.8,.28,1) 1 both!important;
}
/* Au hover, le chariot "roule" vers la flèche puis revient.
Une seule animation par entrée de souris. */
body.single-product div.product form.cart .single_add_to_cart_button:hover::before{
animation:
orilomCartTravel .78s cubic-bezier(.25,.8,.25,1) 1 both!important;
}
/* La flèche s'écarte légèrement pour accueillir le chariot */
body.single-product div.product form.cart .single_add_to_cart_button:hover::after{
right:13px!important;
transform:translate(3px,-50%)!important;
}
/* Danse automatique après 3 secondes */
@keyframes orilomCtaEntranceDance{
0%,100%{
transform:translate(0,0) scale(1);
}
18%{
transform:translate(-2px,-2px) scale(1.008);
}
42%{
transform:translate(2px,1px) scale(1.014);
}
66%{
transform:translate(-1px,2px) scale(1.008);
}
84%{
transform:translate(1px,-1px) scale(1.004);
}
}
/* Petit mouvement initial du chariot */
@keyframes orilomCartIntro{
0%,100%{
left:17px;
transform:translateY(-50%) rotate(0deg);
}
35%{
left:22px;
transform:translateY(-50%) rotate(-5deg);
}
68%{
left:15px;
transform:translateY(-50%) rotate(4deg);
}
}
/* Danse au hover */
@keyframes orilomCtaHoverDance{
0%,100%{
transform:scale(1.028) translate(0,0);
}
22%{
transform:scale(1.035) translate(-2px,-1px);
}
48%{
transform:scale(1.038) translate(2px,1px);
}
72%{
transform:scale(1.032) translate(-1px,1px);
}
}
/* Chariot traverse visuellement le CTA vers la flèche */
@keyframes orilomCartTravel{
0%{
left:17px;
transform:translateY(-50%) rotate(0deg);
opacity:1;
}
18%{
transform:translateY(-53%) rotate(-8deg);
}
70%{
left:calc(100% - 58px);
transform:translateY(-50%) rotate(5deg);
opacity:1;
}
82%{
left:calc(100% - 58px);
transform:translateY(-50%) rotate(0deg);
opacity:.9;
}
100%{
left:17px;
transform:translateY(-50%) rotate(0deg);
opacity:1;
}
}
/* Accessibilité */
@media(prefers-reduced-motion:reduce){
body.single-product div.product form.cart .single_add_to_cart_button,
body.single-product div.product form.cart .single_add_to_cart_button::before{
animation:none!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:hover{
transform:none!important;
}
}
/* Mobile : mouvement plus discret */
@media(max-width:650px){
body.single-product div.product form.cart .single_add_to_cart_button::before{
left:13px!important;
width:18px!important;
height:18px!important;
background-size:18px 18px!important;
}
@keyframes orilomCartTravel{
0%{
left:13px;
transform:translateY(-50%) rotate(0deg);
}
70%{
left:calc(100% - 52px);
transform:translateY(-50%) rotate(4deg);
}
100%{
left:13px;
transform:translateY(-50%) rotate(0deg);
}
}
}
/* ======================================================================
ORILOM — PRODUCT CTA V14 CART HOVER FIX
Corrige définitivement le chariot répété au hover.
Le bouton n'utilise PLUS aucune image de fond pour le chariot.
Un seul chariot existe via ::before.
====================================================================== */
/* Nettoyage TOTAL des anciens background-image chariot V12/V13 */
body.single-product div.product form.cart .single_add_to_cart_button,
body.single-product div.product form.cart .single_add_to_cart_button:hover,
body.single-product div.product form.cart .single_add_to_cart_button:focus,
body.single-product div.product form.cart .single_add_to_cart_button:active{
background-image:none!important;
background-repeat:no-repeat!important;
background-position:center!important;
background-size:auto!important;
}
/* Fond ORILOM séparé du pictogramme */
body.single-product div.product form.cart .single_add_to_cart_button{
background-color:var(--lux-gold,#dfb913)!important;
background:
linear-gradient(180deg,#e2bd19 0%,#d6ae07 100%)!important;
}
/* Un seul chariot */
body.single-product div.product form.cart .single_add_to_cart_button::before{
content:""!important;
position:absolute!important;
z-index:3!important;
top:50%!important;
left:18px!important;
width:18px!important;
height:18px!important;
opacity:1!important;
background-color:transparent!important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 4.5h2l2.05 8.15a2 2 0 0 0 1.94 1.51h7.06a2 2 0 0 0 1.94-1.51L19.7 8H6.35'/%3E%3Ccircle cx='10' cy='18.5' r='1.2'/%3E%3Ccircle cx='16.8' cy='18.5' r='1.2'/%3E%3C/svg%3E")!important;
background-repeat:no-repeat!important;
background-position:center!important;
background-size:18px 18px!important;
transform:translateY(-50%)!important;
transform-origin:center!important;
pointer-events:none!important;
}
/* La flèche reste indépendante à droite */
body.single-product div.product form.cart .single_add_to_cart_button::after{
content:"→"!important;
z-index:4!important;
right:17px!important;
color:#111!important;
}
/* Hover : le bouton s'agrandit légèrement mais le fond ne tuile jamais */
body.single-product div.product form.cart .single_add_to_cart_button:hover{
background:
linear-gradient(180deg,#e9c92d 0%,#dab208 100%)!important;
transform:scale(1.026)!important;
box-shadow:
0 13px 28px rgba(223,185,19,.28),
0 0 0 4px rgba(223,185,19,.07)!important;
animation:orilomCtaHoverDanceV14 .56s cubic-bezier(.22,.8,.28,1) 1 both!important;
}
/* Chariot : petit trajet propre vers la flèche, jamais dupliqué */
body.single-product div.product form.cart .single_add_to_cart_button:hover::before{
animation:orilomCartTravelV14 .72s cubic-bezier(.22,.8,.28,1) 1 both!important;
}
/* Flèche avance doucement */
body.single-product div.product form.cart .single_add_to_cart_button:hover::after{
transform:translate(3px,-50%)!important;
}
/* Danse automatique après 3 sec, une seule fois */
body.single-product div.product form.cart .single_add_to_cart_button{
animation:orilomCtaEntranceDanceV14 .78s cubic-bezier(.22,.8,.28,1) 3s 1 both!important;
}
body.single-product div.product form.cart .single_add_to_cart_button::before{
animation:orilomCartIntroV14 .66s cubic-bezier(.22,.8,.28,1) 3.08s 1 both!important;
}
@keyframes orilomCtaEntranceDanceV14{
0%,100%{ transform:translate(0,0) scale(1); }
20%{ transform:translate(-2px,-1px) scale(1.008); }
46%{ transform:translate(2px,1px) scale(1.012); }
72%{ transform:translate(-1px,1px) scale(1.006); }
}
@keyframes orilomCartIntroV14{
0%,100%{
left:18px;
transform:translateY(-50%) rotate(0deg);
}
42%{
left:23px;
transform:translateY(-52%) rotate(-5deg);
}
72%{
left:16px;
transform:translateY(-48%) rotate(4deg);
}
}
@keyframes orilomCtaHoverDanceV14{
0%,100%{ transform:scale(1.026) translate(0,0); }
28%{ transform:scale(1.034) translate(-1px,-1px); }
56%{ transform:scale(1.036) translate(2px,1px); }
78%{ transform:scale(1.03) translate(-1px,1px); }
}
@keyframes orilomCartTravelV14{
0%{
left:18px;
transform:translateY(-50%) rotate(0deg);
opacity:1;
}
18%{
transform:translateY(-54%) rotate(-7deg);
}
68%{
left:calc(100% - 56px);
transform:translateY(-50%) rotate(5deg);
opacity:1;
}
82%{
left:calc(100% - 56px);
transform:translateY(-50%) rotate(0deg);
opacity:.92;
}
100%{
left:18px;
transform:translateY(-50%) rotate(0deg);
opacity:1;
}
}
@media(max-width:650px){
body.single-product div.product form.cart .single_add_to_cart_button::before{
left:14px!important;
width:17px!important;
height:17px!important;
background-size:17px 17px!important;
}
@keyframes orilomCartTravelV14{
0%{
left:14px;
transform:translateY(-50%) rotate(0deg);
}
68%{
left:calc(100% - 50px);
transform:translateY(-50%) rotate(4deg);
}
100%{
left:14px;
transform:translateY(-50%) rotate(0deg);
}
}
}
@media(prefers-reduced-motion:reduce){
body.single-product div.product form.cart .single_add_to_cart_button,
body.single-product div.product form.cart .single_add_to_cart_button::before{
animation:none!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:hover{
transform:none!important;
}
}
/* ======================================================================
ORILOM — PRODUCT CTA V15 DRIVE + ATTENTION
UX:
- Après 3 s : micro-danse UNIQUE pour attirer l'oeil sans agresser.
- Hover : le chariot roule réellement de gauche à droite et RESTE garé
près de la flèche tant que la souris reste sur le bouton.
- Sortie hover : retour fluide du chariot à gauche.
====================================================================== */
/* Base CTA : stable et premium */
body.single-product div.product form.cart .single_add_to_cart_button{
position:relative!important;
overflow:hidden!important;
transform-origin:center!important;
/* Animation d'entrée unique après 3 secondes */
animation:orilomCtaAttentionV15 .92s cubic-bezier(.22,.8,.28,1) 3s 1 both!important;
transition:
transform .22s cubic-bezier(.2,.8,.2,1),
box-shadow .22s ease,
filter .22s ease!important;
}
/* Chariot : un seul élément, avec vraie translation façon voiture */
body.single-product div.product form.cart .single_add_to_cart_button::before{
left:18px!important;
top:50%!important;
transform:translateY(-50%) rotate(0deg)!important;
/* Mouvement propre et continu au hover / mouseout */
transition:
left .72s cubic-bezier(.18,.82,.24,1),
transform .72s cubic-bezier(.18,.82,.24,1),
opacity .18s ease!important;
/* Petit réveil visuel après 3 s */
animation:orilomCartWakeV15 .82s cubic-bezier(.22,.8,.28,1) 3.08s 1 both!important;
}
/* HOVER : léger agrandissement du bouton + micro-danse */
body.single-product div.product form.cart .single_add_to_cart_button:hover{
transform:scale(1.026)!important;
filter:saturate(1.04) brightness(1.015)!important;
box-shadow:
0 14px 30px rgba(223,185,19,.28),
0 0 0 4px rgba(223,185,19,.075)!important;
animation:orilomCtaHoverPulseV15 .54s cubic-bezier(.22,.8,.28,1) 1 both!important;
}
/* Le chariot traverse le bouton et reste à droite pendant tout le hover */
body.single-product div.product form.cart .single_add_to_cart_button:hover::before{
left:calc(100% - 60px)!important;
/* Légère inclinaison vers l'avant = effet véhicule, sans cartoon */
transform:translateY(-50%) rotate(5deg)!important;
animation:none!important;
}
/* La flèche s'avance un peu pour donner une destination au chariot */
body.single-product div.product form.cart .single_add_to_cart_button:hover::after{
right:12px!important;
transform:translate(3px,-50%)!important;
}
/* La sortie du hover réutilise la transition et ramène naturellement
le chariot à sa position initiale. */
body.single-product div.product form.cart .single_add_to_cart_button:not(:hover)::before{
left:18px!important;
transform:translateY(-50%) rotate(0deg)!important;
}
/* Danse de page-load :
amplitude max 2px, une seule fois, pour conserver le premium. */
@keyframes orilomCtaAttentionV15{
0%,100%{
transform:translate(0,0) scale(1);
}
18%{
transform:translate(-2px,-1px) scale(1.006);
}
40%{
transform:translate(2px,1px) scale(1.013);
}
61%{
transform:translate(-1px,2px) scale(1.008);
}
80%{
transform:translate(1px,-1px) scale(1.004);
}
}
/* Petit mouvement des "roues" visuel au chargement */
@keyframes orilomCartWakeV15{
0%,100%{
left:18px;
transform:translateY(-50%) rotate(0deg);
}
28%{
left:23px;
transform:translateY(-53%) rotate(-6deg);
}
56%{
left:16px;
transform:translateY(-48%) rotate(5deg);
}
78%{
left:21px;
transform:translateY(-51%) rotate(-3deg);
}
}
/* Hover pulse : plus subtil que secouer continuellement */
@keyframes orilomCtaHoverPulseV15{
0%,100%{
transform:scale(1.026) translate(0,0);
}
30%{
transform:scale(1.034) translate(-1px,-1px);
}
58%{
transform:scale(1.036) translate(1px,1px);
}
80%{
transform:scale(1.03) translate(-.5px,.5px);
}
}
/* Mobile : trajet plus court */
@media(max-width:650px){
body.single-product div.product form.cart .single_add_to_cart_button::before{
left:14px!important;
transition:
left .62s cubic-bezier(.18,.82,.24,1),
transform .62s cubic-bezier(.18,.82,.24,1)!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:hover::before{
left:calc(100% - 52px)!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:not(:hover)::before{
left:14px!important;
}
}
/* Accessibilité : aucun mouvement forcé si l'utilisateur le demande */
@media(prefers-reduced-motion:reduce){
body.single-product div.product form.cart .single_add_to_cart_button,
body.single-product div.product form.cart .single_add_to_cart_button::before{
animation:none!important;
transition:none!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:hover{
transform:none!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:hover::before{
left:18px!important;
transform:translateY(-50%)!important;
}
}
/* ======================================================================
ORILOM — PRODUCT CTA V16 BOLD CART + DANCE
- Chariot plus épais / plus lisible
- Il traverse toujours de gauche à droite
- Arrivé à droite, il danse légèrement tant que le hover reste actif
====================================================================== */
/* Chariot plus bold dès l'état normal */
body.single-product div.product form.cart .single_add_to_cart_button::before{
width:20px!important;
height:20px!important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23070707' stroke-width='2.45' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.3 4.2h2.15l2.15 8.45a2 2 0 0 0 1.94 1.51h7.12a2 2 0 0 0 1.95-1.51L19.9 7.8H6.25'/%3E%3Ccircle cx='10' cy='18.55' r='1.35'/%3E%3Ccircle cx='17' cy='18.55' r='1.35'/%3E%3C/svg%3E")!important;
background-size:20px 20px!important;
filter:drop-shadow(0 1px 0 rgba(0,0,0,.12))!important;
}
/* Au hover: encore plus présent, sans devenir grossier */
body.single-product div.product form.cart .single_add_to_cart_button:hover::before{
width:21px!important;
height:21px!important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.25 4.1h2.2l2.18 8.55a2 2 0 0 0 1.94 1.51h7.14a2 2 0 0 0 1.95-1.51L19.95 7.7H6.2'/%3E%3Ccircle cx='10' cy='18.6' r='1.4'/%3E%3Ccircle cx='17' cy='18.6' r='1.4'/%3E%3C/svg%3E")!important;
background-size:21px 21px!important;
left:calc(100% - 60px)!important;
/* Le trajet se fait via left; la danse via transform */
animation:orilomCartDanceV16 .42s ease-in-out .5s infinite alternate!important;
filter:
drop-shadow(0 1px 0 rgba(0,0,0,.18))
drop-shadow(0 2px 3px rgba(0,0,0,.10))!important;
}
/* Petite danse "voiture" une fois arrivé de l'autre côté */
@keyframes orilomCartDanceV16{
0%{
transform:translateY(-50%) rotate(-5deg) scale(1.02);
}
45%{
transform:translateY(-56%) rotate(4deg) scale(1.08);
}
100%{
transform:translateY(-48%) rotate(-2deg) scale(1.04);
}
}
/* Quand on sort du bouton, retour gauche propre */
body.single-product div.product form.cart .single_add_to_cart_button:not(:hover)::before{
width:20px!important;
height:20px!important;
left:18px!important;
transform:translateY(-50%) rotate(0deg) scale(1)!important;
}
/* Mobile: garde un chariot lisible sans prendre trop de place */
@media(max-width:650px){
body.single-product div.product form.cart .single_add_to_cart_button::before{
width:18px!important;
height:18px!important;
background-size:18px 18px!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:hover::before{
width:19px!important;
height:19px!important;
background-size:19px 19px!important;
left:calc(100% - 52px)!important;
}
body.single-product div.product form.cart .single_add_to_cart_button:not(:hover)::before{
left:14px!important;
}
}
/* Accessibilité */
@media(prefers-reduced-motion:reduce){
body.single-product div.product form.cart .single_add_to_cart_button:hover::before{
animation:none!important;
}
}
/* ======================================================================
ORILOM — LEGACY GALLERY V17/V18/V19 REMOVED IN 5.1.1
Native WooCommerce gallery V10 above is now the single source of truth.
====================================================================== */
/* ======================================================================
ORILOM — PRODUCT LOVE SECTION V20
Conversion-oriented, no duplicate note chips:
- 2 x 2 cards on desktop
- one emotional/product-specific benefit
- stock confidence
- human confirmation
- cash on delivery
====================================================================== */
body.single-product .orilom-love-it-v20{
margin:18px 0 0!important;
padding:18px 0 0!important;
border-top:1px solid #ecebe7!important;
}
body.single-product .orilom-love-it-v20 .orilom-love-it-head{
display:block!important;
margin:0 0 12px!important;
}
body.single-product .orilom-love-it-v20 .orilom-love-it-head > span{
display:block!important;
margin:0 0 6px!important;
color:var(--lux-gold-dark,#b88f00)!important;
font-size:7.5px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:.17em!important;
text-transform:uppercase!important;
}
body.single-product .orilom-love-it-v20 .orilom-love-it-head h3{
max-width:520px!important;
margin:0!important;
color:#111!important;
font:700 20px/1.18 Georgia,serif!important;
letter-spacing:-.01em!important;
}
/* 2 x 2 = more readable than four compressed chips */
body.single-product .orilom-love-it-v20 .orilom-love-it-grid{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:8px!important;
}
/* Reset old span-card styling */
body.single-product .orilom-love-it-v20 .orilom-love-it-grid > span{
display:none!important;
}
body.single-product .orilom-love-card{
position:relative!important;
display:grid!important;
grid-template-columns:34px minmax(0,1fr)!important;
gap:10px!important;
align-items:center!important;
min-width:0!important;
min-height:70px!important;
padding:12px!important;
border:1px solid #e9e6dc!important;
border-radius:9px!important;
background:
linear-gradient(180deg,#fff 0%,#fdfcf9 100%)!important;
box-shadow:0 5px 16px rgba(17,17,17,.025)!important;
transition:
transform .18s ease,
border-color .18s ease,
box-shadow .18s ease!important;
}
body.single-product .orilom-love-card:hover{
transform:translateY(-2px)!important;
border-color:#ddd5b7!important;
box-shadow:0 9px 22px rgba(17,17,17,.05)!important;
}
body.single-product .orilom-love-card > i{
display:grid!important;
place-items:center!important;
width:34px!important;
height:34px!important;
border-radius:50%!important;
background:#fff8dc!important;
border:1px solid #f0df96!important;
color:#9d7900!important;
}
body.single-product .orilom-love-card > i::before{
display:block!important;
color:#9d7900!important;
font-size:14px!important;
line-height:1!important;
}
/* Meaningful icons */
body.single-product .orilom-love-card.is-profile > i::before{
content:"✦"!important;
}
body.single-product .orilom-love-card.is-stock > i::before{
content:"✓"!important;
}
body.single-product .orilom-love-card.is-phone > i::before{
content:"☎"!important;
font-size:13px!important;
}
body.single-product .orilom-love-card.is-payment > i::before{
content:"₣"!important;
font-family:Georgia,serif!important;
font-weight:700!important;
}
/* Copy */
body.single-product .orilom-love-card > div{
min-width:0!important;
}
body.single-product .orilom-love-card strong{
display:block!important;
margin:0 0 3px!important;
color:#171717!important;
font-size:9.5px!important;
line-height:1.25!important;
font-weight:850!important;
}
body.single-product .orilom-love-card small{
display:block!important;
color:#888!important;
font-size:7.7px!important;
line-height:1.35!important;
font-weight:500!important;
}
/* Payment gets a subtle brand emphasis, without competing with CTA */
body.single-product .orilom-love-card.is-payment{
border-color:#e8dca7!important;
background:
linear-gradient(180deg,#fffdf4 0%,#fffaf0 100%)!important;
}
/* Stock card gets a calm green cue */
body.single-product .orilom-love-card.is-stock > i{
background:#eef9f2!important;
border-color:#cfe7d6!important;
}
body.single-product .orilom-love-card.is-stock > i::before{
color:#2f7c4d!important;
}
/* Tablet */
@media(max-width:1100px){
body.single-product .orilom-love-it-v20 .orilom-love-it-head h3{
font-size:18px!important;
}
body.single-product .orilom-love-card{
grid-template-columns:30px minmax(0,1fr)!important;
gap:8px!important;
min-height:66px!important;
padding:10px!important;
}
body.single-product .orilom-love-card > i{
width:30px!important;
height:30px!important;
}
}
/* Mobile: stack for fast scanning */
@media(max-width:600px){
body.single-product .orilom-love-it-v20 .orilom-love-it-grid{
grid-template-columns:1fr!important;
gap:7px!important;
}
body.single-product .orilom-love-it-v20 .orilom-love-it-head h3{
font-size:18px!important;
}
body.single-product .orilom-love-card{
min-height:62px!important;
}
}
/* ======================================================================
ORILOM — LOVE SECTION V21 HARD OVERRIDE
Force la nouvelle composition même si l'ancien CSS reste en cache/cascade.
====================================================================== */
body.single-product .summary .orilom-love-it-v20,
body.single-product .summary .orilom-love-it-v21{
display:block!important;
margin:18px 0 0!important;
padding:18px 0 0!important;
border-top:1px solid #ecebe7!important;
}
body.single-product .summary .orilom-love-it-v20 > h3,
body.single-product .summary .orilom-love-it-v21 > h3{
display:none!important;
}
body.single-product .summary .orilom-love-it-v20 .orilom-love-it-head,
body.single-product .summary .orilom-love-it-v21 .orilom-love-it-head{
display:block!important;
width:100%!important;
margin:0 0 12px!important;
}
body.single-product .summary .orilom-love-it-v20 .orilom-love-it-head span,
body.single-product .summary .orilom-love-it-v21 .orilom-love-it-head span{
display:block!important;
margin-bottom:6px!important;
color:#b88f00!important;
font-size:7.5px!important;
font-weight:900!important;
letter-spacing:.17em!important;
}
body.single-product .summary .orilom-love-it-v20 .orilom-love-it-head h3,
body.single-product .summary .orilom-love-it-v21 .orilom-love-it-head h3{
display:block!important;
margin:0!important;
max-width:520px!important;
color:#111!important;
font:700 20px/1.18 Georgia,serif!important;
text-align:left!important;
}
body.single-product .summary .orilom-love-it-v20 .orilom-love-it-grid,
body.single-product .summary .orilom-love-it-v21 .orilom-love-it-grid{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:8px!important;
width:100%!important;
}
body.single-product .summary .orilom-love-it-v20 .orilom-love-card,
body.single-product .summary .orilom-love-it-v21 .orilom-love-card{
display:grid!important;
grid-template-columns:34px minmax(0,1fr)!important;
gap:10px!important;
align-items:center!important;
min-height:70px!important;
padding:12px!important;
border:1px solid #e9e6dc!important;
border-radius:9px!important;
background:linear-gradient(180deg,#fff 0%,#fdfcf9 100%)!important;
}
@media(max-width:600px){
body.single-product .summary .orilom-love-it-v20 .orilom-love-it-grid,
body.single-product .summary .orilom-love-it-v21 .orilom-love-it-grid{
grid-template-columns:1fr!important;
}
}
/* ======================================================================
ORILOM — SINGLE PRODUCT WISHLIST V22
Supprime le coeur ajouté en doublon par CSS.
Le coeur déjà présent dans le bouton reste affiché.
====================================================================== */
body.single-product div.product form.cart .orilom-wishlist-button::before,
body.single-product .summary .orilom-wishlist-button::before{
content:none!important;
display:none!important;
}
/* Garde un espacement propre avec l'unique coeur natif. */
body.single-product div.product form.cart .orilom-wishlist-button,
body.single-product .summary .orilom-wishlist-button{
gap:5px!important;
}
/* ======================================================================
ORILOM — PRODUCT CONVERSION POLISH V23
Objectif : découverte -> confiance -> action, sans bruit visuel.
====================================================================== */
/* 1. Galerie légèrement moins haute : grande, mais équilibrée avec la décision d'achat */
@media(min-width:1160px){
body.single-product div.product div.images .flex-viewport,
body.single-product div.product div.images .woocommerce-product-gallery__wrapper,
body.single-product div.product div.images .woocommerce-product-gallery__image,
body.single-product div.product div.images .woocommerce-product-gallery__image.flex-active-slide{
min-height:540px!important;
height:540px!important;
}
body.single-product div.product div.images .woocommerce-product-gallery__image img{
max-height:540px!important;
}
}
/* 2. Achat : CTA reste le héros, favoris devient un vrai secondaire */
body.single-product div.product form.cart{
margin-bottom:0!important;
}
body.single-product div.product form.cart .orilom-wishlist-button,
body.single-product .summary .orilom-wishlist-button{
grid-column:1 / -1!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:6px!important;
width:auto!important;
min-width:0!important;
min-height:30px!important;
margin:6px 0 0!important;
padding:5px 10px!important;
border:1px solid transparent!important;
border-radius:6px!important;
background:transparent!important;
color:#666!important;
font-size:8.5px!important;
font-weight:650!important;
line-height:1!important;
transition:
color .18s ease,
background .18s ease,
border-color .18s ease!important;
}
body.single-product div.product form.cart .orilom-wishlist-button:hover,
body.single-product .summary .orilom-wishlist-button:hover{
color:#111!important;
background:#fff!important;
border-color:#e2dfd7!important;
}
/* Un seul cœur, bien lisible */
body.single-product div.product form.cart .orilom-wishlist-button::before,
body.single-product .summary .orilom-wishlist-button::before{
content:none!important;
display:none!important;
}
/* 3. Réassurance sous CTA : compacte, une seule ligne visuelle */
body.single-product .orilom-purchase-assurance{
display:flex!important;
align-items:center!important;
justify-content:center!important;
flex-wrap:wrap!important;
gap:0!important;
margin:8px 0 0!important;
padding:7px 10px!important;
border:1px solid #d7ebdc!important;
border-radius:7px!important;
background:#f4fbf6!important;
box-shadow:none!important;
}
body.single-product .orilom-purchase-assurance span{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:5px!important;
min-height:0!important;
padding:0 12px!important;
border:0!important;
border-left:1px solid #dcecdf!important;
background:transparent!important;
color:#2f6543!important;
}
body.single-product .orilom-purchase-assurance span:first-child{
border-left:0!important;
}
body.single-product .orilom-purchase-assurance strong{
font-size:7.8px!important;
font-weight:750!important;
line-height:1.2!important;
white-space:nowrap!important;
}
body.single-product .orilom-purchase-assurance i{
width:17px!important;
height:17px!important;
flex:0 0 17px!important;
background-size:11px 11px!important;
}
/* 4. Nouveau bloc bénéfices : 2 x 2, lisible, non redondant */
body.single-product .summary .orilom-love-it-v20,
body.single-product .summary .orilom-love-it-v21,
body.single-product .summary .orilom-love-it-v23{
display:block!important;
margin:16px 0 0!important;
padding:16px 0 0!important;
border-top:1px solid #eceae4!important;
}
body.single-product .summary .orilom-love-it-head{
display:block!important;
width:100%!important;
margin:0 0 11px!important;
}
body.single-product .summary .orilom-love-it-head > span{
display:block!important;
margin:0 0 5px!important;
color:#b88f00!important;
font-size:7.2px!important;
font-weight:900!important;
letter-spacing:.16em!important;
text-transform:uppercase!important;
}
body.single-product .summary .orilom-love-it-head h3{
display:block!important;
max-width:520px!important;
margin:0!important;
color:#111!important;
font:700 19px/1.18 Georgia,serif!important;
letter-spacing:-.01em!important;
text-align:left!important;
}
body.single-product .summary .orilom-love-it-grid{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:8px!important;
width:100%!important;
}
body.single-product .summary .orilom-love-card{
display:grid!important;
grid-template-columns:32px minmax(0,1fr)!important;
gap:9px!important;
align-items:center!important;
min-height:66px!important;
padding:10px!important;
border:1px solid #e8e5dc!important;
border-radius:8px!important;
background:linear-gradient(180deg,#fff,#fdfcf9)!important;
transition:
transform .18s ease,
border-color .18s ease,
box-shadow .18s ease!important;
}
body.single-product .summary .orilom-love-card:hover{
transform:translateY(-2px)!important;
border-color:#dcd5ba!important;
box-shadow:0 8px 20px rgba(17,17,17,.045)!important;
}
body.single-product .summary .orilom-love-card > i{
display:grid!important;
place-items:center!important;
width:32px!important;
height:32px!important;
border-radius:50%!important;
background:#fff8dc!important;
border:1px solid #f0df96!important;
}
body.single-product .summary .orilom-love-card > i::before{
color:#9c7900!important;
font-size:13px!important;
line-height:1!important;
}
body.single-product .summary .orilom-love-card.is-profile > i::before{ content:"✦"!important; }
body.single-product .summary .orilom-love-card.is-stock > i::before{ content:"✓"!important; color:#2f7c4d!important; }
body.single-product .summary .orilom-love-card.is-phone > i::before{ content:"☎"!important; font-size:12px!important; }
body.single-product .summary .orilom-love-card.is-payment > i::before{ content:"✓"!important; }
body.single-product .summary .orilom-love-card.is-stock > i{
background:#eef9f2!important;
border-color:#cfe7d6!important;
}
body.single-product .summary .orilom-love-card.is-payment{
background:linear-gradient(180deg,#fffdf5,#fffaf0)!important;
border-color:#e8dca7!important;
}
body.single-product .summary .orilom-love-card strong{
display:block!important;
margin:0 0 3px!important;
color:#171717!important;
font-size:9px!important;
font-weight:850!important;
line-height:1.22!important;
}
body.single-product .summary .orilom-love-card small{
display:block!important;
color:#858585!important;
font-size:7.3px!important;
font-weight:500!important;
line-height:1.35!important;
}
/* 5. Onglets : remonter le contenu utile */
body.single-product .woocommerce-tabs{
margin-top:28px!important;
padding-top:0!important;
}
body.single-product .woocommerce-tabs ul.tabs{
margin-top:0!important;
}
/* Anciennes marges de layout qui créaient le grand vide */
body.single-product div.product + .woocommerce-tabs,
body.single-product .product .woocommerce-tabs{
clear:both!important;
}
/* Responsive */
@media(max-width:760px){
body.single-product .orilom-purchase-assurance{
justify-content:flex-start!important;
overflow-x:auto!important;
flex-wrap:nowrap!important;
scrollbar-width:none!important;
}
body.single-product .orilom-purchase-assurance::-webkit-scrollbar{
display:none!important;
}
body.single-product .orilom-purchase-assurance span{
flex:0 0 auto!important;
}
body.single-product .summary .orilom-love-it-grid{
grid-template-columns:1fr!important;
gap:7px!important;
}
body.single-product .summary .orilom-love-it-head h3{
font-size:18px!important;
}
body.single-product .woocommerce-tabs{
margin-top:22px!important;
}
}
/* ======================================================================
ORILOM — HESITANT USER TRUST V24
====================================================================== */
/* Réassurance post-CTA: 2 messages forts, pas 3 mini-blocs faibles */
body.single-product .orilom-purchase-assurance-v24{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:0!important;
margin:8px 0 0!important;
padding:0!important;
overflow:hidden!important;
border:1px solid #d5eadb!important;
border-radius:8px!important;
background:#f3fbf5!important;
}
body.single-product .orilom-purchase-assurance-v24 span{
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:7px!important;
min-height:38px!important;
padding:8px 12px!important;
border:0!important;
border-left:1px solid #dcecdf!important;
background:transparent!important;
color:#2f6543!important;
}
body.single-product .orilom-purchase-assurance-v24 span:first-child{
border-left:0!important;
}
body.single-product .orilom-purchase-assurance-v24 strong{
font-size:8px!important;
line-height:1.25!important;
font-weight:800!important;
text-align:center!important;
}
body.single-product .orilom-purchase-assurance-v24 i{
width:18px!important;
height:18px!important;
flex:0 0 18px!important;
background-size:12px 12px!important;
}
/* Bloc confiance */
body.single-product .orilom-love-it-v24{
margin:16px 0 0!important;
padding:16px 0 0!important;
border-top:1px solid #eceae4!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-it-head{
margin:0 0 11px!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-it-head > span{
display:block!important;
margin-bottom:5px!important;
color:#b88f00!important;
font-size:7.2px!important;
font-weight:900!important;
letter-spacing:.16em!important;
text-transform:uppercase!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-it-head h3{
margin:0!important;
max-width:520px!important;
color:#111!important;
font:700 19px/1.18 Georgia,serif!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-it-grid{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:8px!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-card{
display:grid!important;
grid-template-columns:32px minmax(0,1fr)!important;
gap:9px!important;
align-items:center!important;
min-height:66px!important;
padding:10px!important;
border:1px solid #e8e5dc!important;
border-radius:8px!important;
background:linear-gradient(180deg,#fff,#fdfcf9)!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-card > i{
display:grid!important;
place-items:center!important;
width:32px!important;
height:32px!important;
border-radius:50%!important;
background:#fff8dc!important;
border:1px solid #f0df96!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-card > i::before{
font-size:13px!important;
line-height:1!important;
color:#9c7900!important;
}
body.single-product .orilom-love-it-v24 .is-profile > i::before{ content:"✦"!important; }
body.single-product .orilom-love-it-v24 .is-payment > i::before{ content:"✓"!important; }
body.single-product .orilom-love-it-v24 .is-phone > i::before{ content:"☎"!important; font-size:12px!important; }
body.single-product .orilom-love-it-v24 .is-delivery > i::before{ content:"→"!important; }
body.single-product .orilom-love-it-v24 .is-payment,
body.single-product .orilom-love-it-v24 .is-phone{
background:linear-gradient(180deg,#fffdf6,#fffaf1)!important;
border-color:#e8dca7!important;
}
body.single-product .orilom-love-it-v24 .is-delivery > i{
background:#eef9f2!important;
border-color:#cfe7d6!important;
}
body.single-product .orilom-love-it-v24 .is-delivery > i::before{
color:#2f7c4d!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-card strong{
display:block!important;
margin-bottom:3px!important;
color:#171717!important;
font-size:9px!important;
font-weight:850!important;
line-height:1.22!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-card small{
display:block!important;
color:#858585!important;
font-size:7.3px!important;
line-height:1.35!important;
}
/* Zone "Besoin d'être rassuré ?" */
body.single-product .orilom-reassure-help{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:18px!important;
max-width:1380px!important;
width:calc(100% - 48px)!important;
margin:24px auto 0!important;
padding:16px 18px!important;
border:1px solid #e7e3d7!important;
border-radius:10px!important;
background:
linear-gradient(90deg,#fffdf7 0%,#fff 55%,#f7fbf8 100%)!important;
}
body.single-product .orilom-reassure-help-copy{
min-width:0!important;
}
body.single-product .orilom-reassure-help-copy > span{
display:block!important;
margin-bottom:4px!important;
color:#b88f00!important;
font-size:7px!important;
font-weight:900!important;
letter-spacing:.15em!important;
}
body.single-product .orilom-reassure-help-copy > strong{
display:block!important;
color:#111!important;
font:700 16px/1.2 Georgia,serif!important;
}
body.single-product .orilom-reassure-help-copy > small{
display:block!important;
margin-top:4px!important;
color:#777!important;
font-size:8px!important;
line-height:1.4!important;
}
body.single-product .orilom-reassure-help-actions{
display:flex!important;
align-items:center!important;
gap:8px!important;
flex:0 0 auto!important;
}
body.single-product .orilom-reassure-help-actions a{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:34px!important;
padding:0 12px!important;
border-radius:6px!important;
font-size:8px!important;
font-weight:850!important;
text-transform:uppercase!important;
letter-spacing:.04em!important;
text-decoration:none!important;
}
body.single-product .orilom-help-whatsapp{
border:1px solid #228b4e!important;
background:#228b4e!important;
color:#fff!important;
}
body.single-product .orilom-help-faq{
border:1px solid #111!important;
background:#fff!important;
color:#111!important;
}
body.single-product .orilom-reassure-help-actions a:hover{
transform:translateY(-1px)!important;
}
/* Rapproche encore les tabs du contenu utile */
body.single-product .woocommerce-tabs{
margin-top:18px!important;
}
/* Mobile */
@media(max-width:760px){
body.single-product .orilom-purchase-assurance-v24{
grid-template-columns:1fr!important;
}
body.single-product .orilom-purchase-assurance-v24 span{
border-left:0!important;
border-top:1px solid #dcecdf!important;
}
body.single-product .orilom-purchase-assurance-v24 span:first-child{
border-top:0!important;
}
body.single-product .orilom-love-it-v24 .orilom-love-it-grid{
grid-template-columns:1fr!important;
}
body.single-product .orilom-reassure-help{
width:calc(100% - 28px)!important;
flex-direction:column!important;
align-items:flex-start!important;
}
body.single-product .orilom-reassure-help-actions{
width:100%!important;
}
body.single-product .orilom-reassure-help-actions a{
flex:1 1 0!important;
}
}
/* ======================================================================
ORILOM — HESITANT USER TRUST V25 PLACEMENT FIX
La zone d'aide reste dans la colonne produit, juste après les points forts.
Supprime le grand vide visuel créé par le placement avant les onglets.
====================================================================== */
body.single-product .summary .orilom-reassure-help-v25{
width:100%!important;
max-width:none!important;
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
align-items:center!important;
gap:14px!important;
margin:10px 0 0!important;
padding:12px 14px!important;
border:1px solid #e7e3d7!important;
border-radius:8px!important;
background:
linear-gradient(90deg,#fffdf7 0%,#fff 58%,#f7fbf8 100%)!important;
box-shadow:0 5px 16px rgba(17,17,17,.025)!important;
}
body.single-product .summary .orilom-reassure-help-v25 .orilom-reassure-help-copy > span{
display:block!important;
margin:0 0 3px!important;
color:#b88f00!important;
font-size:6.8px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:.14em!important;
text-transform:uppercase!important;
}
body.single-product .summary .orilom-reassure-help-v25 .orilom-reassure-help-copy > strong{
display:block!important;
color:#111!important;
font:700 14px/1.18 Georgia,serif!important;
}
body.single-product .summary .orilom-reassure-help-v25 .orilom-reassure-help-copy > small{
display:block!important;
margin-top:3px!important;
color:#818181!important;
font-size:7.5px!important;
line-height:1.35!important;
}
body.single-product .summary .orilom-reassure-help-v25 .orilom-reassure-help-actions{
display:flex!important;
align-items:center!important;
gap:6px!important;
flex:0 0 auto!important;
}
body.single-product .summary .orilom-reassure-help-v25 .orilom-reassure-help-actions a{
min-height:30px!important;
padding:0 10px!important;
border-radius:5px!important;
font-size:7px!important;
font-weight:850!important;
}
/* Prevent old global V24 layout from pulling the box outside summary */
body.single-product .summary .orilom-reassure-help{
max-width:none!important;
width:100%!important;
margin-left:0!important;
margin-right:0!important;
}
/* Tabs can now sit naturally after the whole product block */
body.single-product .woocommerce-tabs{
margin-top:24px!important;
}
@media(max-width:760px){
body.single-product .summary .orilom-reassure-help-v25{
grid-template-columns:1fr!important;
gap:10px!important;
}
body.single-product .summary .orilom-reassure-help-v25 .orilom-reassure-help-actions{
width:100%!important;
}
body.single-product .summary .orilom-reassure-help-v25 .orilom-reassure-help-actions a{
flex:1 1 0!important;
}
}
/* ======================================================================
ORILOM — TRUST CONVERSION V26
Moins de blocs, plus de clarté et de crédibilité.
====================================================================== */
/* Deux preuves post-CTA, compactes */
body.single-product .orilom-purchase-assurance-v26{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:0!important;
margin:8px 0 0!important;
padding:0!important;
border:1px solid #d5eadb!important;
border-radius:7px!important;
overflow:hidden!important;
background:#f4fbf6!important;
box-shadow:none!important;
}
body.single-product .orilom-purchase-assurance-v26 span{
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:6px!important;
min-height:36px!important;
padding:7px 10px!important;
border:0!important;
border-left:1px solid #dcecdf!important;
background:transparent!important;
color:#2f6543!important;
}
body.single-product .orilom-purchase-assurance-v26 span:first-child{
border-left:0!important;
}
body.single-product .orilom-purchase-assurance-v26 strong{
font-size:7.8px!important;
line-height:1.2!important;
font-weight:800!important;
text-align:center!important;
}
/* Bloc confiance 3 cartes */
body.single-product .orilom-love-it-v26{
margin:14px 0 0!important;
padding:14px 0 0!important;
border-top:1px solid #eceae4!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-it-head{
margin:0 0 10px!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-it-head > span{
display:block!important;
margin-bottom:4px!important;
color:#b88f00!important;
font-size:7px!important;
font-weight:900!important;
letter-spacing:.15em!important;
text-transform:uppercase!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-it-head h3{
margin:0!important;
color:#111!important;
font:700 18px/1.18 Georgia,serif!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-it-grid{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:8px!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card{
display:grid!important;
grid-template-columns:30px minmax(0,1fr)!important;
gap:8px!important;
align-items:center!important;
min-height:64px!important;
padding:10px!important;
border:1px solid #e8e5dc!important;
border-radius:8px!important;
background:#fff!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card > i{
display:grid!important;
place-items:center!important;
width:30px!important;
height:30px!important;
border-radius:50%!important;
background:#fff8dc!important;
border:1px solid #f0df96!important;
}
body.single-product .orilom-love-it-v26 .is-payment > i::before{ content:"✓"!important; }
body.single-product .orilom-love-it-v26 .is-phone > i::before{ content:"☎"!important; }
body.single-product .orilom-love-it-v26 .is-delivery > i::before{ content:"→"!important; }
body.single-product .orilom-love-it-v26 .is-delivery > i{
background:#eef9f2!important;
border-color:#cfe7d6!important;
}
body.single-product .orilom-love-it-v26 .is-delivery > i::before{
color:#2f7c4d!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card strong{
display:block!important;
margin-bottom:3px!important;
color:#171717!important;
font-size:8.7px!important;
font-weight:850!important;
line-height:1.2!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card small{
display:block!important;
color:#858585!important;
font-size:7.1px!important;
line-height:1.35!important;
}
/* Aide compacte */
body.single-product .summary .orilom-reassure-help-v26{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:12px!important;
width:100%!important;
margin:9px 0 0!important;
padding:9px 10px!important;
border:1px solid #e7e3d7!important;
border-radius:7px!important;
background:#fffdf8!important;
}
body.single-product .summary .orilom-reassure-help-v26 .orilom-reassure-help-copy strong{
color:#111!important;
font:700 12px/1.2 Georgia,serif!important;
}
body.single-product .summary .orilom-reassure-help-v26 .orilom-reassure-help-actions{
display:flex!important;
gap:6px!important;
}
body.single-product .summary .orilom-reassure-help-v26 .orilom-reassure-help-actions a{
min-height:28px!important;
padding:0 9px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
border-radius:5px!important;
font-size:6.9px!important;
font-weight:850!important;
text-decoration:none!important;
}
body.single-product .summary .orilom-reassure-help-v26 .orilom-help-whatsapp{
background:#228b4e!important;
color:#fff!important;
border:1px solid #228b4e!important;
}
body.single-product .summary .orilom-reassure-help-v26 .orilom-help-faq{
background:#fff!important;
color:#111!important;
border:1px solid #111!important;
}
/* Slot preuve sociale neutre et discret */
body.single-product .summary .orilom-social-proof-slot{
margin:9px 0 0!important;
padding:10px 12px!important;
border:1px dashed #d9d5c8!important;
border-radius:7px!important;
background:#fbfaf7!important;
}
body.single-product .summary .orilom-social-proof-slot > span{
display:block!important;
margin-bottom:3px!important;
color:#9c7900!important;
font-size:6.5px!important;
font-weight:900!important;
letter-spacing:.14em!important;
}
body.single-product .summary .orilom-social-proof-slot > strong{
display:block!important;
color:#333!important;
font-size:8.2px!important;
line-height:1.25!important;
}
body.single-product .summary .orilom-social-proof-slot > small{
display:block!important;
margin-top:2px!important;
color:#999!important;
font-size:6.9px!important;
}
/* Responsive */
@media(max-width:900px){
body.single-product .orilom-love-it-v26 .orilom-love-it-grid{
grid-template-columns:1fr!important;
}
}
@media(max-width:600px){
body.single-product .orilom-purchase-assurance-v26{
grid-template-columns:1fr!important;
}
body.single-product .orilom-purchase-assurance-v26 span{
border-left:0!important;
border-top:1px solid #dcecdf!important;
}
body.single-product .orilom-purchase-assurance-v26 span:first-child{
border-top:0!important;
}
body.single-product .summary .orilom-reassure-help-v26{
align-items:flex-start!important;
flex-direction:column!important;
}
body.single-product .summary .orilom-reassure-help-v26 .orilom-reassure-help-actions{
width:100%!important;
}
body.single-product .summary .orilom-reassure-help-v26 .orilom-reassure-help-actions a{
flex:1 1 0!important;
}
}
/* ======================================================================
ORILOM — TRUST CONVERSION V27 INLINE
- Les 3 garanties sont inline sur une seule ligne desktop
- Suppression complète du bloc PREUVE SOCIALE
====================================================================== */
/* Supprime définitivement le slot preuve sociale s'il reste dans un cache */
body.single-product .summary .orilom-social-proof-slot{
display:none!important;
}
/* 3 garanties inline et compactes */
body.single-product .orilom-love-it-v26 .orilom-love-it-grid{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:7px!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card{
display:flex!important;
align-items:center!important;
gap:8px!important;
min-height:54px!important;
padding:8px 9px!important;
border:1px solid #e8e5dc!important;
border-radius:7px!important;
background:#fff!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card > i{
flex:0 0 28px!important;
width:28px!important;
height:28px!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card > div{
min-width:0!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card strong{
display:block!important;
margin:0 0 2px!important;
color:#171717!important;
font-size:8.5px!important;
font-weight:850!important;
line-height:1.15!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card small{
display:block!important;
color:#858585!important;
font-size:6.9px!important;
line-height:1.25!important;
}
/* Plus compact pour que la colonne droite respire */
body.single-product .orilom-love-it-v26{
margin-top:12px!important;
padding-top:12px!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-it-head{
margin-bottom:8px!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-it-head h3{
font-size:17px!important;
}
/* Tablette : toujours 3 inline si possible */
@media(max-width:1100px) and (min-width:761px){
body.single-product .orilom-love-it-v26 .orilom-love-card{
padding:7px!important;
gap:6px!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card > i{
flex-basis:26px!important;
width:26px!important;
height:26px!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card strong{
font-size:8px!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-card small{
font-size:6.5px!important;
}
}
/* Mobile : empilement pour rester lisible */
@media(max-width:760px){
body.single-product .orilom-love-it-v26 .orilom-love-it-grid{
grid-template-columns:1fr!important;
}
}
/* ======================================================================
ORILOM — TRUST POLISH V28
- "100% Original" à côté de En stock
- Confirmation par téléphone
- Suppression du gros titre "Pourquoi commander chez ORILOM ?"
====================================================================== */
/* Ligne stock + original */
body.single-product .summary .orilom-stock-badge,
body.single-product .summary .stock.in-stock{
display:inline-flex!important;
align-items:center!important;
vertical-align:middle!important;
margin-right:8px!important;
}
body.single-product .summary .orilom-original-badge{
display:inline-flex!important;
align-items:center!important;
gap:4px!important;
min-height:22px!important;
padding:3px 8px!important;
border:1px solid #e6d48d!important;
border-radius:999px!important;
background:#fffaf0!important;
color:#7d6400!important;
vertical-align:middle!important;
}
body.single-product .summary .orilom-original-badge i{
display:grid!important;
place-items:center!important;
width:14px!important;
height:14px!important;
border-radius:50%!important;
background:#e2b600!important;
color:#111!important;
font-size:8px!important;
font-style:normal!important;
font-weight:900!important;
}
body.single-product .summary .orilom-original-badge strong{
font-size:7.6px!important;
line-height:1!important;
font-weight:850!important;
white-space:nowrap!important;
}
/* Le label CONFIANCE ORILOM suffit. On retire le gros titre. */
body.single-product .orilom-love-it-v26 .orilom-love-it-head h3,
body.single-product .orilom-love-it-v27 .orilom-love-it-head h3{
display:none!important;
}
body.single-product .orilom-love-it-v26 .orilom-love-it-head,
body.single-product .orilom-love-it-v27 .orilom-love-it-head{
margin-bottom:7px!important;
}
/* Confirmation téléphone : iconographie plus propre */
body.single-product .orilom-love-it-v26 .is-phone > i::before,
body.single-product .orilom-love-it-v27 .is-phone > i::before{
content:"☎"!important;
font-size:12px!important;
color:#9c7900!important;
}
/* Compacte légèrement le bloc confiance après retrait du titre */
body.single-product .orilom-love-it-v26,
body.single-product .orilom-love-it-v27{
margin-top:10px!important;
padding-top:10px!important;
}
@media(max-width:600px){
body.single-product .summary .orilom-original-badge{
margin-top:5px!important;
}
}
/* ======================================================================
ORILOM — TRUST CLEANUP V29
====================================================================== */
/* Cache définitivement les anciens blocs redondants */
body.single-product .summary .orilom-love-it,
body.single-product .summary .orilom-social-proof-slot{
display:none!important;
}
/* En stock + 100% Original : même ligne, propre et compacte */
body.single-product .summary .orilom-stock-badge,
body.single-product .summary .stock.in-stock{
display:inline-flex!important;
align-items:center!important;
vertical-align:middle!important;
margin-right:7px!important;
}
body.single-product .summary .orilom-original-badge{
display:inline-flex!important;
align-items:center!important;
gap:4px!important;
min-height:20px!important;
padding:2px 7px!important;
border:1px solid #e5d185!important;
border-radius:999px!important;
background:#fffaf0!important;
color:#705900!important;
vertical-align:middle!important;
}
body.single-product .summary .orilom-original-badge i{
display:grid!important;
place-items:center!important;
width:13px!important;
height:13px!important;
border-radius:50%!important;
background:#e2b600!important;
color:#111!important;
font-size:7px!important;
font-style:normal!important;
font-weight:900!important;
}
body.single-product .summary .orilom-original-badge strong{
font-size:7.4px!important;
line-height:1!important;
font-weight:850!important;
white-space:nowrap!important;
}
/* Une seule bande de confiance : 3 infos, inline */
body.single-product .orilom-purchase-assurance-v29{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:0!important;
margin:8px 0 0!important;
padding:0!important;
overflow:hidden!important;
border:1px solid #d3e8d9!important;
border-radius:7px!important;
background:#f3fbf5!important;
box-shadow:none!important;
}
body.single-product .orilom-purchase-assurance-v29 span{
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:6px!important;
min-height:36px!important;
padding:7px 8px!important;
border:0!important;
border-left:1px solid #dcecdf!important;
background:transparent!important;
color:#2f6543!important;
}
body.single-product .orilom-purchase-assurance-v29 span:first-child{
border-left:0!important;
}
body.single-product .orilom-purchase-assurance-v29 strong{
font-size:7.4px!important;
line-height:1.2!important;
font-weight:800!important;
text-align:center!important;
white-space:nowrap!important;
}
body.single-product .orilom-purchase-assurance-v29 i{
width:17px!important;
height:17px!important;
flex:0 0 17px!important;
background-size:11px 11px!important;
}
/* Aide compacte, sans créer un nouveau gros bloc */
body.single-product .summary .orilom-reassure-help-v29{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:10px!important;
width:100%!important;
margin:8px 0 0!important;
padding:8px 10px!important;
border:1px solid #e6e2d8!important;
border-radius:7px!important;
background:#fffdf9!important;
}
body.single-product .summary .orilom-reassure-help-v29 .orilom-reassure-help-copy strong{
color:#111!important;
font:700 11.5px/1.2 Georgia,serif!important;
}
body.single-product .summary .orilom-reassure-help-v29 .orilom-reassure-help-actions{
display:flex!important;
gap:6px!important;
flex:0 0 auto!important;
}
body.single-product .summary .orilom-reassure-help-v29 .orilom-reassure-help-actions a{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:27px!important;
padding:0 9px!important;
border-radius:5px!important;
font-size:6.8px!important;
font-weight:850!important;
text-decoration:none!important;
}
body.single-product .summary .orilom-reassure-help-v29 .orilom-help-whatsapp{
background:#228b4e!important;
border:1px solid #228b4e!important;
color:#fff!important;
}
body.single-product .summary .orilom-reassure-help-v29 .orilom-help-faq{
background:#fff!important;
border:1px solid #111!important;
color:#111!important;
}
/* Mobile */
@media(max-width:760px){
body.single-product .orilom-purchase-assurance-v29{
grid-template-columns:1fr!important;
}
body.single-product .orilom-purchase-assurance-v29 span{
border-left:0!important;
border-top:1px solid #dcecdf!important;
}
body.single-product .orilom-purchase-assurance-v29 span:first-child{
border-top:0!important;
}
body.single-product .summary .orilom-reassure-help-v29{
flex-direction:column!important;
align-items:flex-start!important;
}
body.single-product .summary .orilom-reassure-help-v29 .orilom-reassure-help-actions{
width:100%!important;
}
body.single-product .summary .orilom-reassure-help-v29 .orilom-reassure-help-actions a{
flex:1 1 0!important;
}
}
/* ======================================================================
ORILOM — STOCK + ORIGINAL V30
100% Original est rendu directement par PHP dans .orilom-product-facts,
exactement à côté de En stock. Aucun JS nécessaire.
====================================================================== */
/* Masque l'ancien badge JS s'il subsiste dans un cache HTML */
body.single-product .summary .orilom-original-badge{
display:none!important;
}
/* La ligne de faits reste compacte */
body.single-product .summary .orilom-product-facts{
display:flex!important;
align-items:center!important;
flex-wrap:wrap!important;
gap:7px!important;
}
/* Les séparateurs anciens ne sont plus utiles entre stock et original */
body.single-product .summary .orilom-product-facts > b{
display:none!important;
}
/* En stock */
body.single-product .summary .orilom-product-facts .is-stock{
display:inline-flex!important;
align-items:center!important;
gap:5px!important;
color:#2e7046!important;
font-size:8px!important;
font-weight:800!important;
line-height:1!important;
}
body.single-product .summary .orilom-product-facts .is-stock i{
width:6px!important;
height:6px!important;
border-radius:50%!important;
background:#3b9a5f!important;
}
/* 100% Original : juste à droite de En stock, comme une garantie */
body.single-product .summary .orilom-product-facts .is-original{
display:inline-flex!important;
align-items:center!important;
gap:5px!important;
min-height:21px!important;
padding:3px 8px!important;
border:1px solid #ead78c!important;
border-radius:999px!important;
background:#fffaf0!important;
color:#705900!important;
font-size:7.8px!important;
font-weight:850!important;
line-height:1!important;
white-space:nowrap!important;
}
body.single-product .summary .orilom-product-facts .is-original i{
position:relative!important;
display:grid!important;
place-items:center!important;
width:14px!important;
height:14px!important;
border-radius:50%!important;
background:#e2b600!important;
}
body.single-product .summary .orilom-product-facts .is-original i::before{
content:"✓"!important;
color:#111!important;
font-size:8px!important;
font-style:normal!important;
font-weight:900!important;
line-height:1!important;
}
/* Les éventuels attributs produit restent lisibles après */
body.single-product .summary .orilom-product-facts > span:not(.is-stock):not(.is-original){
color:#666!important;
font-size:7.8px!important;
font-weight:650!important;
}
/* Mobile */
@media(max-width:600px){
body.single-product .summary .orilom-product-facts{
gap:6px!important;
}
body.single-product .summary .orilom-product-facts .is-original{
padding:3px 7px!important;
}
}
/* ======================================================================
ORILOM — PRODUCT CONVERSION V31
Objectif:
- Galerie légèrement moins dominante
- Prix plus fort visuellement
- WhatsApp / FAQ plus discrets
- Conserver la hiérarchie couleur: blanc / noir / or / vert pâle
====================================================================== */
/* 1) Galerie desktop: -10% environ pour laisser plus de poids à la décision */
@media(min-width:1160px){
body.single-product div.product{
grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr)!important;
column-gap:46px!important;
}
body.single-product div.product div.images .flex-viewport,
body.single-product div.product div.images .woocommerce-product-gallery__wrapper,
body.single-product div.product div.images .woocommerce-product-gallery__image,
body.single-product div.product div.images .woocommerce-product-gallery__image.flex-active-slide{
min-height:500px!important;
height:500px!important;
}
body.single-product div.product div.images .woocommerce-product-gallery__image img{
max-height:500px!important;
padding:16px!important;
}
}
/* 2) Prix plus lisible et hiérarchisé */
body.single-product .summary > .price,
body.single-product .summary p.price,
body.single-product .summary .price{
display:flex!important;
align-items:baseline!important;
gap:5px!important;
margin:0 0 7px!important;
color:#111!important;
font-size:15px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:-.015em!important;
}
/* Devise plus discrète si WooCommerce la rend dans un span séparé */
body.single-product .summary .price .woocommerce-Price-currencySymbol{
font-size:.72em!important;
font-weight:800!important;
}
/* 3) Titre garde son autorité, mais ne concurrence pas le prix */
body.single-product .summary .product_title{
margin-top:0!important;
margin-bottom:7px!important;
}
/* 4) Ligne stock/original : un peu plus respirante */
body.single-product .summary .orilom-product-facts{
margin:8px 0 8px!important;
}
/* 5) CTA reste le focus principal */
body.single-product div.product form.cart{
margin-top:8px!important;
}
/* 6) Bande verte = preuve secondaire, pas concurrence */
body.single-product .orilom-purchase-assurance-v29{
margin-top:7px!important;
}
body.single-product .orilom-purchase-assurance-v29 span{
min-height:34px!important;
}
body.single-product .orilom-purchase-assurance-v29 strong{
font-size:7.1px!important;
}
/* 7) WhatsApp / FAQ plus discrets */
body.single-product .summary .orilom-reassure-help-v29{
margin-top:7px!important;
padding:7px 9px!important;
border-color:#ebe7dc!important;
background:#fff!important;
}
body.single-product .summary .orilom-reassure-help-v29 .orilom-reassure-help-copy strong{
font-size:10.5px!important;
font-weight:700!important;
}
body.single-product .summary .orilom-reassure-help-v29 .orilom-reassure-help-actions a{
min-height:25px!important;
padding:0 8px!important;
font-size:6.5px!important;
letter-spacing:.02em!important;
}
/* WhatsApp: vert plus sobre */
body.single-product .summary .orilom-reassure-help-v29 .orilom-help-whatsapp{
background:#2f7c4d!important;
border-color:#2f7c4d!important;
}
/* FAQ très secondaire */
body.single-product .summary .orilom-reassure-help-v29 .orilom-help-faq{
border-color:#bdbdbd!important;
color:#444!important;
}
/* 8) Miniatures un peu plus petites / premium */
@media(min-width:1160px){
body.single-product div.product div.images .flex-control-thumbs li,
body.single-product div.product div.images .flex-control-thumbs li img{
width:66px!important;
height:66px!important;
flex-basis:66px!important;
}
body.single-product div.product div.images .flex-control-thumbs{
gap:8px!important;
margin-top:9px!important;
}
}
/* 9) Onglets plus proches de la fiche */
body.single-product .woocommerce-tabs{
margin-top:20px!important;
}
/* Mobile: pas de réduction excessive de la galerie */
@media(max-width:760px){
body.single-product div.product{
grid-template-columns:1fr!important;
}
body.single-product .summary > .price,
body.single-product .summary p.price,
body.single-product .summary .price{
font-size:14px!important;
}
}
/* ======================================================================
ORILOM — ORIGINAL BADGE V32 GREEN TRUST
100% Original devient un signal de confiance, pas un accent décoratif.
====================================================================== */
body.single-product .summary .orilom-product-facts .is-original{
border-color:#cfe7d6!important;
background:#f2fbf5!important;
color:#2f6543!important;
box-shadow:
inset 0 0 0 1px rgba(47,124,77,.015)!important;
}
body.single-product .summary .orilom-product-facts .is-original i{
background:#dff3e5!important;
color:#2f7c4d!important;
}
body.single-product .summary .orilom-product-facts .is-original i::before{
color:#2f7c4d!important;
}
body.single-product .summary .orilom-product-facts .is-original:hover{
border-color:#b9ddc5!important;
background:#edf8f1!important;
}
/* ======================================================================
ORILOM — TRUST STRIP V33 IVORY PREMIUM
- En stock + 100% Original restent verts
- Bande de réassurance passe en ivoire premium
- Icônes or/noir pour éviter l'effet "trop de vert"
====================================================================== */
body.single-product .orilom-purchase-assurance-v29{
border-color:#e7e1d2!important;
background:#fffdf7!important;
box-shadow:0 4px 14px rgba(17,17,17,.025)!important;
}
body.single-product .orilom-purchase-assurance-v29 span{
color:#1d1d1d!important;
border-left-color:#ece6d8!important;
background:transparent!important;
}
body.single-product .orilom-purchase-assurance-v29 strong{
color:#1d1d1d!important;
font-weight:800!important;
}
/* Icônes : fond ivoire/or doux */
body.single-product .orilom-purchase-assurance-v29 i{
background-color:#fff6d7!important;
border:1px solid #ecd88a!important;
border-radius:50%!important;
}
/* Paiement */
body.single-product .orilom-purchase-assurance-v29 .orilom-assurance-cash{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239c7900' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.4'/%3E%3Cpath d='M7 9h.01M17 15h.01'/%3E%3C/svg%3E")!important;
}
/* Téléphone */
body.single-product .orilom-purchase-assurance-v29 .orilom-assurance-phone{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239c7900' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.18 2 19.8 19.8 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.62 2.63a2 2 0 0 1-.45 2.11L8 9.73a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.85.29 1.73.5 2.63.62A2 2 0 0 1 22 16.9z'/%3E%3C/svg%3E")!important;
}
/* Livraison */
body.single-product .orilom-purchase-assurance-v29 .orilom-assurance-truck{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239c7900' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v9H3zM14 9h4l3 3v3h-7z'/%3E%3Ccircle cx='7' cy='17' r='2'/%3E%3Ccircle cx='18' cy='17' r='2'/%3E%3C/svg%3E")!important;
}
/* Hover très discret */
body.single-product .orilom-purchase-assurance-v29 span:hover{
background:#fffaf0!important;
}
/* Garde bien les badges stock/original en vert */
body.single-product .summary .orilom-product-facts .is-stock{
color:#2e7046!important;
}
body.single-product .summary .orilom-product-facts .is-original{
border-color:#cfe7d6!important;
background:#f2fbf5!important;
color:#2f6543!important;
}
body.single-product .summary .orilom-product-facts .is-original i{
background:#dff3e5!important;
}
body.single-product .summary .orilom-product-facts .is-original i::before{
color:#2f7c4d!important;
}
/* ======================================================================
ORILOM — FAQ NAVIGATION V34
Compense le header lors du scroll vers Questions fréquentes.
====================================================================== */
body.single-product #tab-title-orilom_faq,
body.single-product #tab-orilom_faq{
scroll-margin-top:120px!important;
}
/* ======================================================================
ORILOM — RELATED PRODUCTS / SOURCE UNIQUE AVEC LA BOUTIQUE
Les cartes NE SONT PAS redessinées ici.
Le wrapper PHP donne au loop Related les classes Boutique :
.orilom-shop-products + .orilom-grid-4.
Toutes les règles de card / image / prix / wishlist / hover viennent donc
directement du CSS Boutique situé plus bas dans CE MÊME theme.css.
Ici : uniquement le placement de la section Related et son titre.
====================================================================== */
body.single-product .related.products{
grid-column:1 / -1!important;
width:calc(100% - 64px)!important;
max-width:1172px!important; /* 1450 - sidebar 240 - gap 38 = zone produits Boutique */
margin:72px auto 64px!important;
padding:0!important;
}
body.single-product .related.products > h2{
margin:0 0 30px!important;
padding:0!important;
color:#111!important;
text-align:left!important;
font:700 28px/1.2 Arial,Helvetica,sans-serif!important;
letter-spacing:-.015em!important;
text-transform:uppercase!important;
}
/* Le conteneur Related n'ajoute aucune largeur ou style de carte. */
body.single-product .related.products .orilom-related-shop-grid{
width:100%!important;
max-width:none!important;
margin:0!important;
padding:0!important;
}
/* Le Shop desktop est en 4 colonnes : Related l'est aussi. */
body.single-product .related.products .orilom-shop-products.orilom-grid-4 ul.products{
grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
@media(max-width:1200px){
body.single-product .related.products{
width:calc(100% - 44px)!important;
max-width:none!important;
}
body.single-product .related.products .orilom-shop-products.orilom-grid-4 ul.products{
grid-template-columns:repeat(3,minmax(0,1fr))!important;
}
}
@media(max-width:800px){
body.single-product .related.products{
width:calc(100% - 30px)!important;
margin:52px auto 46px!important;
}
body.single-product .related.products > h2{
margin-bottom:22px!important;
font-size:22px!important;
}
body.single-product .related.products .orilom-shop-products.orilom-grid-4 ul.products{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:16px!important;
}
}
@media(max-width:520px){
body.single-product .related.products{
width:calc(100% - 24px)!important;
}
body.single-product .related.products .orilom-shop-products.orilom-grid-4 ul.products{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:10px!important;
}
}
/* =========================================================
ORILOM — PAGINATION CATALOGUE PREMIUM / UI UX
Compatible WooCommerce
========================================================= */
/* Bloc pagination : séparation nette avec la grille produits */
.woocommerce nav.woocommerce-pagination,
.woocommerce .woocommerce-pagination {
width: 100% !important;
clear: both !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
margin: 46px 0 22px !important;
padding: 28px 0 0 !important;
border-top: 1px solid #eeeeee !important;
text-align: center !important;
}
/* Conteneur des pages */
.woocommerce nav.woocommerce-pagination ul.page-numbers,
.woocommerce .woocommerce-pagination ul.page-numbers {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
flex-wrap: wrap !important;
gap: 8px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
list-style: none !important;
}
/* Suppression du style WooCommerce natif */
.woocommerce nav.woocommerce-pagination ul.page-numbers > li,
.woocommerce .woocommerce-pagination ul.page-numbers > li {
float: none !important;
display: block !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
overflow: visible !important;
}
/* Boutons numériques */
.woocommerce nav.woocommerce-pagination ul.page-numbers li a.page-numbers,
.woocommerce nav.woocommerce-pagination ul.page-numbers li span.page-numbers,
.woocommerce .woocommerce-pagination ul.page-numbers li a.page-numbers,
.woocommerce .woocommerce-pagination ul.page-numbers li span.page-numbers {
box-sizing: border-box !important;
min-width: 46px !important;
height: 46px !important;
padding: 0 13px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
background: #ffffff !important;
color: #161616 !important;
border: 1px solid #dedede !important;
border-radius: 8px !important;
font-family: Arial, Helvetica, sans-serif !important;
font-size: 13px !important;
line-height: 1 !important;
font-weight: 700 !important;
text-decoration: none !important;
box-shadow: 0 2px 8px rgba(0,0,0,.035) !important;
transition:
background-color .18s ease,
color .18s ease,
border-color .18s ease,
box-shadow .18s ease,
transform .18s ease !important;
}
/* Page active : jaune ORILOM */
.woocommerce nav.woocommerce-pagination ul.page-numbers li span.current,
.woocommerce .woocommerce-pagination ul.page-numbers li span.current {
background: var(--lux-gold, #dfb913) !important;
color: #111111 !important;
border-color: var(--lux-gold, #dfb913) !important;
box-shadow: 0 7px 18px rgba(223,185,19,.22) !important;
transform: translateY(-1px) !important;
}
/* Hover */
.woocommerce nav.woocommerce-pagination ul.page-numbers li a.page-numbers:hover,
.woocommerce .woocommerce-pagination ul.page-numbers li a.page-numbers:hover {
background: #111111 !important;
color: #ffffff !important;
border-color: #111111 !important;
box-shadow: 0 7px 18px rgba(0,0,0,.12) !important;
transform: translateY(-1px) !important;
}
/* Flèches précédent / suivant : plus confortables */
.woocommerce nav.woocommerce-pagination .page-numbers.prev,
.woocommerce nav.woocommerce-pagination .page-numbers.next,
.woocommerce .woocommerce-pagination .page-numbers.prev,
.woocommerce .woocommerce-pagination .page-numbers.next {
min-width: 46px !important;
padding-left: 15px !important;
padding-right: 15px !important;
font-size: 17px !important;
}
/* Points de suspension */
.woocommerce nav.woocommerce-pagination .page-numbers.dots,
.woocommerce .woocommerce-pagination .page-numbers.dots {
min-width: 30px !important;
border-color: transparent !important;
background: transparent !important;
box-shadow: none !important;
color: #777 !important;
}
/* Focus clavier / accessibilité */
.woocommerce nav.woocommerce-pagination a.page-numbers:focus-visible,
.woocommerce .woocommerce-pagination a.page-numbers:focus-visible {
outline: 2px solid #111 !important;
outline-offset: 3px !important;
}
/* Évite que la pagination soit collée aux cartes produits */
.woocommerce ul.products + nav.woocommerce-pagination,
.woocommerce ul.products + .woocommerce-pagination {
margin-top: 52px !important;
}
/* Tablette */
@media (max-width: 900px) {
.woocommerce nav.woocommerce-pagination,
.woocommerce .woocommerce-pagination {
margin-top: 38px !important;
padding-top: 24px !important;
}
.woocommerce nav.woocommerce-pagination ul.page-numbers,
.woocommerce .woocommerce-pagination ul.page-numbers {
gap: 7px !important;
}
.woocommerce nav.woocommerce-pagination ul.page-numbers li a.page-numbers,
.woocommerce nav.woocommerce-pagination ul.page-numbers li span.page-numbers,
.woocommerce .woocommerce-pagination ul.page-numbers li a.page-numbers,
.woocommerce .woocommerce-pagination ul.page-numbers li span.page-numbers {
min-width: 43px !important;
height: 43px !important;
font-size: 12px !important;
}
}
/* Mobile */
@media (max-width: 520px) {
.woocommerce nav.woocommerce-pagination,
.woocommerce .woocommerce-pagination {
margin: 32px 0 14px !important;
padding-top: 20px !important;
}
.woocommerce nav.woocommerce-pagination ul.page-numbers,
.woocommerce .woocommerce-pagination ul.page-numbers {
width: 100% !important;
gap: 6px !important;
}
.woocommerce nav.woocommerce-pagination ul.page-numbers li a.page-numbers,
.woocommerce nav.woocommerce-pagination ul.page-numbers li span.page-numbers,
.woocommerce .woocommerce-pagination ul.page-numbers li a.page-numbers,
.woocommerce .woocommerce-pagination ul.page-numbers li span.page-numbers {
min-width: 40px !important;
height: 40px !important;
padding: 0 10px !important;
border-radius: 7px !important;
font-size: 12px !important;
}
.woocommerce nav.woocommerce-pagination .page-numbers.prev,
.woocommerce nav.woocommerce-pagination .page-numbers.next,
.woocommerce .woocommerce-pagination .page-numbers.prev,
.woocommerce .woocommerce-pagination .page-numbers.next {
min-width: 40px !important;
padding-left: 11px !important;
padding-right: 11px !important;
font-size: 15px !important;
}
}
/* =========================================================
ORILOM — SHOP CSS CENTRALISÉ
Ancien contenu de assets/css/shop.css fusionné ici.
========================================================= */
/* =========================================================
ORILOM — SHOP.CSS COMPLET
Boutique / catégories / tags produits
Avec double slider prix moderne
========================================================= */
/* =========================================================
LAYOUT GLOBAL
========================================================= */
.orilom-shop-layout {
max-width: 1450px !important;
margin: 0 auto !important;
padding: 45px 4vw 80px !important;
display: grid !important;
grid-template-columns: 240px minmax(0, 1fr) !important;
gap: 38px !important;
align-items: start !important;
}
.orilom-shop-products {
min-width: 0 !important;
max-width: none !important;
padding: 0 !important;
}
/* =========================================================
SIDEBAR FILTRES
========================================================= */
.orilom-shop-sidebar {
width: 100%;
position: sticky;
top: 100px;
background: #fff;
border: 1px solid #e8e8e8;
border-radius: 18px;
padding: 22px;
box-shadow: 0 6px 25px rgba(0, 0, 0, .035);
}
.orilom-filter-heading {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 17px;
margin-bottom: 4px;
border-bottom: 1px solid #ececec;
color: #111;
font-size: 18px;
font-weight: 800;
}
.orilom-filter-reset {
color: #888 !important;
font-size: 10px;
font-weight: 600;
text-decoration: none !important;
text-transform: uppercase;
letter-spacing: .03em;
}
.orilom-filter-reset:hover {
color: #111 !important;
}
/* =========================================================
SECTIONS FILTRES
========================================================= */
.orilom-filter-section {
padding: 20px 0;
border-bottom: 1px solid #eee;
}
.orilom-filter-section h3 {
margin: 0 0 15px !important;
color: #111 !important;
font-size: 13px !important;
font-weight: 800 !important;
text-transform: uppercase;
letter-spacing: .05em;
}
/* =========================================================
FILTRE PRIX — DOUBLE SLIDER MODERNE
========================================================= */
.orilom-price-filter {
padding-bottom: 26px;
}
.orilom-filter-section-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
margin-bottom: 18px;
}
.orilom-filter-section-head h3 {
margin: 0 !important;
}
.orilom-price-live {
display: flex;
align-items: center;
gap: 3px;
white-space: nowrap;
color: #777;
font-size: 10px;
font-weight: 600;
}
.orilom-price-live strong {
color: #111;
font-size: 11px;
font-weight: 800;
}
.orilom-price-separator {
margin: 0 3px;
color: #aaa;
}
/* Conteneur slider */
.orilom-price-slider {
position: relative;
width: 100%;
height: 30px;
margin: 5px 0 2px;
}
/* Ligne de fond */
.orilom-slider-track {
position: absolute;
left: 0;
right: 0;
top: 13px;
height: 4px;
border-radius: 999px;
background: #e7e7e7;
pointer-events: none;
}
/* Partie active */
.orilom-slider-progress {
position: absolute;
top: 13px;
height: 4px;
border-radius: 999px;
background: #111;
pointer-events: none;
z-index: 2;
}
/* Deux ranges superposés */
.orilom-price-slider input[type="range"] {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 30px;
margin: 0;
padding: 0;
background: transparent !important;
appearance: none;
-webkit-appearance: none;
pointer-events: none;
outline: none;
z-index: 3;
}
/* Chrome / Edge / Safari */
.orilom-price-slider input[type="range"]::-webkit-slider-runnable-track {
width: 100%;
height: 4px;
background: transparent;
border: 0;
}
.orilom-price-slider input[type="range"]::-webkit-slider-thumb {
width: 18px;
height: 18px;
margin-top: -7px;
border: 3px solid #111;
border-radius: 50%;
background: #fff;
appearance: none;
-webkit-appearance: none;
pointer-events: auto;
cursor: grab;
box-shadow:
0 2px 6px rgba(0, 0, 0, .16),
0 0 0 3px rgba(255,255,255,.95);
transition:
transform .15s ease,
background .15s ease,
box-shadow .15s ease;
}
.orilom-price-slider input[type="range"]::-webkit-slider-thumb:hover {
transform: scale(1.12);
background: #111;
box-shadow:
0 3px 9px rgba(0, 0, 0, .20),
0 0 0 4px rgba(0,0,0,.05);
}
.orilom-price-slider input[type="range"]::-webkit-slider-thumb:active {
cursor: grabbing;
transform: scale(1.18);
}
/* Firefox */
.orilom-price-slider input[type="range"]::-moz-range-track {
width: 100%;
height: 4px;
border: 0;
background: transparent;
}
.orilom-price-slider input[type="range"]::-moz-range-progress {
background: transparent;
}
.orilom-price-slider input[type="range"]::-moz-range-thumb {
width: 14px;
height: 14px;
border: 3px solid #111;
border-radius: 50%;
background: #fff;
pointer-events: auto;
cursor: grab;
box-shadow:
0 2px 6px rgba(0, 0, 0, .16);
transition:
transform .15s ease,
background .15s ease;
}
.orilom-price-slider input[type="range"]::-moz-range-thumb:hover {
background: #111;
transform: scale(1.12);
}
.orilom-price-slider input[type="range"]::-moz-range-thumb:active {
cursor: grabbing;
}
/* Min / Max sous la barre */
.orilom-price-scale {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 3px;
color: #aaa;
font-size: 9px;
font-weight: 600;
}
/* =========================================================
CHECKBOX / CATEGORIES / STOCK
========================================================= */
.orilom-category-filter {
display: flex;
flex-direction: column;
gap: 3px;
}
.orilom-filter-checkbox {
display: flex;
align-items: center;
gap: 9px;
min-height: 31px;
color: #333;
font-size: 12px;
cursor: pointer;
user-select: none;
}
.orilom-filter-checkbox:hover span {
color: #000;
}
.orilom-filter-checkbox input {
appearance: none;
-webkit-appearance: none;
width: 16px;
height: 16px;
flex: 0 0 16px;
margin: 0;
border: 1px solid #bbb;
border-radius: 5px;
background: #fff;
cursor: pointer;
position: relative;
transition:
background .15s ease,
border-color .15s ease,
transform .15s ease;
}
.orilom-filter-checkbox input:hover {
border-color: #777;
}
.orilom-filter-checkbox input:checked {
background: #111;
border-color: #111;
}
.orilom-filter-checkbox input:checked::after {
content: "✓";
position: absolute;
left: 2px;
top: -1px;
color: #fff;
font-size: 11px;
font-weight: 800;
}
.orilom-filter-checkbox span {
flex: 1;
transition: color .15s ease;
}
.orilom-filter-checkbox small {
color: #999;
font-size: 10px;
}
/* =========================================================
BOUTON APPLIQUER
========================================================= */
.orilom-filter-submit {
width: 100%;
min-height: 44px;
margin-top: 20px;
padding: 11px 15px;
border: 1px solid #111;
border-radius: 10px;
background: #111;
color: #fff;
cursor: pointer;
font-size: 11px;
font-weight: 800;
letter-spacing: .04em;
text-transform: uppercase;
transition:
background .2s ease,
transform .2s ease,
box-shadow .2s ease;
}
.orilom-filter-submit:hover {
background: #292929;
transform: translateY(-1px);
box-shadow: 0 7px 18px rgba(0, 0, 0, .12);
}
.orilom-filter-submit:active {
transform: translateY(0);
}
/* =========================================================
RESULT COUNT + TRI
========================================================= */
body.woocommerce-shop .woocommerce-result-count,
body.post-type-archive-product .woocommerce-result-count,
body.tax-product_cat .woocommerce-result-count,
body.tax-product_tag .woocommerce-result-count {
margin-bottom: 22px !important;
color: #666 !important;
font-size: 14px !important;
}
body.woocommerce-shop .woocommerce-ordering select,
body.post-type-archive-product .woocommerce-ordering select,
body.tax-product_cat .woocommerce-ordering select,
body.tax-product_tag .woocommerce-ordering select {
min-width: 180px;
min-height: 42px;
padding: 0 42px 0 14px;
border: 1px solid #ddd !important;
border-radius: 10px !important;
background: #fff !important;
color: #111 !important;
font-size: 13px !important;
cursor: pointer !important;
}
/* =========================================================
GRILLE PRODUITS — 4 PAR LIGNE
========================================================= */
body.woocommerce-shop ul.products,
body.post-type-archive-product ul.products,
body.tax-product_cat ul.products,
body.tax-product_tag ul.products {
display: grid !important;
grid-template-columns:
repeat(4, minmax(0, 1fr)) !important;
gap: 22px !important;
margin: 0 !important;
}
/* Carte produit */
body.woocommerce-shop ul.products li.product,
body.post-type-archive-product ul.products li.product,
body.tax-product_cat ul.products li.product,
body.tax-product_tag ul.products li.product {
width: 100% !important;
float: none !important;
margin: 0 !important;
padding: 0 0 18px !important;
display: flex !important;
flex-direction: column !important;
background: #fff !important;
border: 1px solid #e7e7e7 !important;
border-radius: 18px !important;
overflow: hidden !important;
box-shadow:
0 8px 28px rgba(0, 0, 0, .05) !important;
transition:
transform .25s ease,
box-shadow .25s ease,
border-color .25s ease !important;
}
body.woocommerce-shop ul.products li.product:hover,
body.post-type-archive-product ul.products li.product:hover,
body.tax-product_cat ul.products li.product:hover,
body.tax-product_tag ul.products li.product:hover {
transform: translateY(-5px) !important;
box-shadow:
0 16px 40px rgba(0, 0, 0, .10) !important;
border-color: #d8d8d8 !important;
}
/* =========================================================
IMAGE PRODUIT
========================================================= */
body.woocommerce-shop ul.products li.product img.wp-post-image,
body.woocommerce-shop ul.products li.product img.attachment-woocommerce_thumbnail,
body.post-type-archive-product ul.products li.product img.wp-post-image,
body.post-type-archive-product ul.products li.product img.attachment-woocommerce_thumbnail,
body.tax-product_cat ul.products li.product img.wp-post-image,
body.tax-product_cat ul.products li.product img.attachment-woocommerce_thumbnail,
body.tax-product_tag ul.products li.product img.wp-post-image,
body.tax-product_tag ul.products li.product img.attachment-woocommerce_thumbnail {
width: 100% !important;
aspect-ratio: 1 / 1 !important;
object-fit: contain !important;
margin: 0 !important;
padding: 10px !important;
background: #f7f7f5 !important;
}
/* =========================================================
TITRE PRODUIT
========================================================= */
body.woocommerce-shop ul.products li.product .woocommerce-loop-product__title,
body.post-type-archive-product ul.products li.product .woocommerce-loop-product__title,
body.tax-product_cat ul.products li.product .woocommerce-loop-product__title,
body.tax-product_tag ul.products li.product .woocommerce-loop-product__title {
margin: 0 !important;
padding: 18px 18px 4px !important;
color: #111 !important;
font-size: 18px !important;
line-height: 1.25 !important;
font-weight: 600 !important;
}
/* =========================================================
PRIX PRODUIT
========================================================= */
body.woocommerce-shop ul.products li.product .price,
body.post-type-archive-product ul.products li.product .price,
body.tax-product_cat ul.products li.product .price,
body.tax-product_tag ul.products li.product .price {
margin: 0 !important;
padding: 4px 18px 12px !important;
color: #111 !important;
font-size: 15px !important;
font-weight: 700 !important;
}
body.woocommerce-shop ul.products li.product .price del,
body.post-type-archive-product ul.products li.product .price del,
body.tax-product_cat ul.products li.product .price del,
body.tax-product_tag ul.products li.product .price del {
margin-right: 5px !important;
color: #8d8d8d !important;
opacity: 1 !important;
font-weight: 400 !important;
}
body.woocommerce-shop ul.products li.product .price ins,
body.post-type-archive-product ul.products li.product .price ins,
body.tax-product_cat ul.products li.product .price ins,
body.tax-product_tag ul.products li.product .price ins {
color: #111 !important;
text-decoration: none !important;
font-weight: 800 !important;
}
/* =========================================================
BOUTON AJOUTER AU PANIER
========================================================= */
body.woocommerce-shop ul.products li.product .button,
body.post-type-archive-product ul.products li.product .button,
body.tax-product_cat ul.products li.product .button,
body.tax-product_tag ul.products li.product .button {
min-height: 44px;
margin: auto 18px 10px !important;
padding: 12px 18px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border: 1px solid #111 !important;
border-radius: 12px !important;
background: #111 !important;
color: #fff !important;
box-shadow: none !important;
font-size: 13px !important;
font-weight: 700 !important;
letter-spacing: .03em !important;
text-transform: uppercase !important;
transition:
background .2s ease,
color .2s ease,
transform .2s ease,
box-shadow .2s ease !important;
}
body.woocommerce-shop ul.products li.product .button:hover,
body.post-type-archive-product ul.products li.product .button:hover,
body.tax-product_cat ul.products li.product .button:hover,
body.tax-product_tag ul.products li.product .button:hover {
background: #252525 !important;
color: #fff !important;
transform: translateY(-2px) !important;
box-shadow:
0 8px 18px rgba(0, 0, 0, .16) !important;
}
/* =========================================================
WISHLIST
========================================================= */
body.woocommerce-shop ul.products li.product .yith-wcwl-add-to-wishlist,
body.post-type-archive-product ul.products li.product .yith-wcwl-add-to-wishlist,
body.tax-product_cat ul.products li.product .yith-wcwl-add-to-wishlist,
body.tax-product_tag ul.products li.product .yith-wcwl-add-to-wishlist {
margin: 0 18px !important;
}
body.woocommerce-shop ul.products li.product .yith-wcwl-add-button a,
body.woocommerce-shop ul.products li.product .yith-wcwl-wishlistaddedbrowse a,
body.woocommerce-shop ul.products li.product .yith-wcwl-wishlistexistsbrowse a,
body.post-type-archive-product ul.products li.product .yith-wcwl-add-button a,
body.post-type-archive-product ul.products li.product .yith-wcwl-wishlistaddedbrowse a,
body.post-type-archive-product ul.products li.product .yith-wcwl-wishlistexistsbrowse a,
body.tax-product_cat ul.products li.product .yith-wcwl-add-button a,
body.tax-product_cat ul.products li.product .yith-wcwl-wishlistaddedbrowse a,
body.tax-product_cat ul.products li.product .yith-wcwl-wishlistexistsbrowse a,
body.tax-product_tag ul.products li.product .yith-wcwl-add-button a,
body.tax-product_tag ul.products li.product .yith-wcwl-wishlistaddedbrowse a,
body.tax-product_tag ul.products li.product .yith-wcwl-wishlistexistsbrowse a {
min-height: 40px;
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 10px 12px !important;
border: 1px solid #dedede !important;
border-radius: 10px !important;
background: #fff !important;
color: #111 !important;
font-size: 11px !important;
font-weight: 700 !important;
text-decoration: none !important;
transition:
background .2s ease,
border-color .2s ease !important;
}
body.woocommerce-shop ul.products li.product .yith-wcwl-add-button a:hover,
body.post-type-archive-product ul.products li.product .yith-wcwl-add-button a:hover,
body.tax-product_cat ul.products li.product .yith-wcwl-add-button a:hover,
body.tax-product_tag ul.products li.product .yith-wcwl-add-button a:hover {
background: #f5f5f5 !important;
border-color: #bbb !important;
}
/* =========================================================
BADGE PROMO
========================================================= */
body.woocommerce-shop .onsale,
body.post-type-archive-product .onsale,
body.tax-product_cat .onsale,
body.tax-product_tag .onsale {
top: 12px !important;
left: 12px !important;
right: auto !important;
min-width: auto !important;
min-height: auto !important;
padding: 7px 12px !important;
border-radius: 999px !important;
background: #111 !important;
color: #fff !important;
font-size: 11px !important;
font-weight: 700 !important;
line-height: 1 !important;
z-index: 5 !important;
}
/* =========================================================
TABLET
========================================================= */
@media (max-width: 1200px) {
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout {
grid-template-columns:
210px minmax(0, 1fr) !important;
gap: 25px !important;
}
body.woocommerce-shop ul.products,
body.post-type-archive-product ul.products,
body.tax-product_cat ul.products,
body.tax-product_tag ul.products {
grid-template-columns:
repeat(3, minmax(0, 1fr)) !important;
}
}
/* =========================================================
MOBILE
========================================================= */
@media (max-width: 800px) {
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout {
display: block !important;
padding:
25px 15px 60px !important;
}
.orilom-shop-sidebar {
position: static;
top: auto;
margin-bottom: 25px;
}
body.woocommerce-shop ul.products,
body.post-type-archive-product ul.products,
body.tax-product_cat ul.products,
body.tax-product_tag ul.products {
grid-template-columns:
repeat(2, minmax(0, 1fr)) !important;
gap: 16px !important;
}
}
/* =========================================================
PETITS MOBILES
========================================================= */
@media (max-width: 520px) {
.orilom-shop-sidebar {
padding: 18px;
}
.orilom-filter-heading {
font-size: 17px;
}
.orilom-filter-section-head {
align-items: flex-start;
flex-direction: column;
gap: 5px;
}
body.woocommerce-shop ul.products,
body.post-type-archive-product ul.products,
body.tax-product_cat ul.products,
body.tax-product_tag ul.products {
grid-template-columns:
repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
}
body.woocommerce-shop ul.products li.product .woocommerce-loop-product__title,
body.post-type-archive-product ul.products li.product .woocommerce-loop-product__title,
body.tax-product_cat ul.products li.product .woocommerce-loop-product__title,
body.tax-product_tag ul.products li.product .woocommerce-loop-product__title {
padding:
14px 12px 4px !important;
font-size: 15px !important;
}
body.woocommerce-shop ul.products li.product .price,
body.post-type-archive-product ul.products li.product .price,
body.tax-product_cat ul.products li.product .price,
body.tax-product_tag ul.products li.product .price {
padding-left: 12px !important;
padding-right: 12px !important;
}
body.woocommerce-shop ul.products li.product .button,
body.post-type-archive-product ul.products li.product .button,
body.tax-product_cat ul.products li.product .button,
body.tax-product_tag ul.products li.product .button {
margin-left: 12px !important;
margin-right: 12px !important;
padding: 10px !important;
font-size: 11px !important;
}
body.woocommerce-shop ul.products li.product .yith-wcwl-add-to-wishlist,
body.post-type-archive-product ul.products li.product .yith-wcwl-add-to-wishlist,
body.tax-product_cat ul.products li.product .yith-wcwl-add-to-wishlist,
body.tax-product_tag ul.products li.product .yith-wcwl-add-to-wishlist {
margin-left: 12px !important;
margin-right: 12px !important;
}
}
/* =========================================================
ORILOM — SORTING + GRID SWITCHER — CORRIGÉ
========================================================= */
/* La zone WooCommerce avant la grille utilise des floats par défaut.
On les conserve visuellement mais on évite qu'ils cassent la grille. */
.orilom-shop-products::after {
content: "";
display: block;
clear: both;
}
/* Nombre de résultats */
.orilom-shop-products .woocommerce-result-count {
float: left !important;
margin: 15px 0 26px !important;
line-height: 44px !important;
color: #666 !important;
font-size: 13px !important;
}
/* Tri */
.orilom-shop-products .woocommerce-ordering {
position: relative;
float: right !important;
margin: 0 0 24px 10px !important;
}
.orilom-shop-products .woocommerce-ordering::before {
content: "Trier par";
position: absolute;
left: 4px;
top: -17px;
color: #999;
font-size: 9px;
font-weight: 700;
line-height: 1;
text-transform: uppercase;
letter-spacing: .08em;
}
.orilom-shop-products .woocommerce-ordering select {
appearance: none !important;
-webkit-appearance: none !important;
width: auto !important;
min-width: 220px !important;
height: 44px !important;
padding: 0 44px 0 15px !important;
border: 1px solid #e2e2e2 !important;
border-radius: 12px !important;
background-color: #fff !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: right 15px center !important;
color: #111 !important;
font-size: 12px !important;
font-weight: 600 !important;
cursor: pointer !important;
outline: none !important;
box-shadow: 0 3px 12px rgba(0,0,0,.03) !important;
transition:
border-color .2s ease,
box-shadow .2s ease !important;
}
.orilom-shop-products .woocommerce-ordering select:hover {
border-color: #bcbcbc !important;
}
.orilom-shop-products .woocommerce-ordering select:focus {
border-color: #111 !important;
box-shadow: 0 0 0 3px rgba(0,0,0,.05) !important;
}
/* =========================================================
GRID SWITCHER
========================================================= */
.orilom-grid-switcher {
float: right !important;
display: flex !important;
align-items: center !important;
gap: 2px !important;
height: 44px !important;
margin: 0 0 24px 0 !important;
padding: 4px !important;
border: 1px solid #e2e2e2 !important;
border-radius: 12px !important;
background: #fff !important;
box-shadow: 0 3px 12px rgba(0,0,0,.03) !important;
}
.orilom-grid-button {
width: 34px !important;
height: 34px !important;
padding: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border: 0 !important;
border-radius: 8px !important;
background: transparent !important;
color: #aaa !important;
cursor: pointer !important;
transition:
background .18s ease,
color .18s ease,
transform .18s ease !important;
}
.orilom-grid-button:hover {
background: #f3f3f3 !important;
color: #111 !important;
}
.orilom-grid-button.is-active {
background: #111 !important;
color: #fff !important;
}
.orilom-grid-button:focus-visible {
outline: 2px solid #111 !important;
outline-offset: 2px !important;
}
/* Icônes */
.orilom-grid-icon {
width: 18px !important;
display: grid !important;
gap: 2px !important;
}
.orilom-grid-icon i {
display: block !important;
height: 12px !important;
border: 1.5px solid currentColor !important;
border-radius: 2px !important;
}
.orilom-grid-icon-1 {
grid-template-columns: 1fr !important;
}
.orilom-grid-icon-2 {
grid-template-columns: repeat(2, 1fr) !important;
}
.orilom-grid-icon-3 {
grid-template-columns: repeat(3, 1fr) !important;
}
.orilom-grid-icon-4 {
grid-template-columns: repeat(4, 1fr) !important;
}
/* =========================================================
IMPORTANT — CHANGEMENT DYNAMIQUE DU NOMBRE DE COLONNES
Ces règles viennent après les règles WooCommerce de base.
========================================================= */
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products,
body.post-type-archive-product .orilom-shop-products.orilom-grid-1 ul.products,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products {
display: grid !important;
grid-template-columns: minmax(0, 1fr) !important;
}
body.woocommerce-shop .orilom-shop-products.orilom-grid-2 ul.products,
body.post-type-archive-product .orilom-shop-products.orilom-grid-2 ul.products,
body.tax-product_cat .orilom-shop-products.orilom-grid-2 ul.products,
body.tax-product_tag .orilom-shop-products.orilom-grid-2 ul.products {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
body.woocommerce-shop .orilom-shop-products.orilom-grid-3 ul.products,
body.post-type-archive-product .orilom-shop-products.orilom-grid-3 ul.products,
body.tax-product_cat .orilom-shop-products.orilom-grid-3 ul.products,
body.tax-product_tag .orilom-shop-products.orilom-grid-3 ul.products {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body.woocommerce-shop .orilom-shop-products.orilom-grid-4 ul.products,
body.post-type-archive-product .orilom-shop-products.orilom-grid-4 ul.products,
body.tax-product_cat .orilom-shop-products.orilom-grid-4 ul.products,
body.tax-product_tag .orilom-shop-products.orilom-grid-4 ul.products {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
/* =========================================================
MODE 1 COLONNE — LISTE PREMIUM PROPRE
========================================================= */
/*
* IMPORTANT :
* dans WooCommerce, l'image + le titre sont dans le lien produit,
* alors que prix / description / boutons sont à l'extérieur.
* display: contents permet de faire participer image + titre
* directement à la grille du
.
*/
.orilom-shop-products.orilom-grid-1 ul.products li.product {
display: grid !important;
grid-template-columns: 260px minmax(0, 1fr) !important;
grid-template-rows: auto auto auto auto auto !important;
column-gap: 34px !important;
row-gap: 0 !important;
align-items: start !important;
min-height: 280px !important;
padding: 10px !important;
}
/* Le lien produit ne crée plus une grille imbriquée */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link {
display: contents !important;
}
/* Image principale : colonne gauche uniquement */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link
> img.wp-post-image,
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link
> img.attachment-woocommerce_thumbnail {
grid-column: 1 !important;
grid-row: 1 / span 6 !important;
align-self: start !important;
width: 260px !important;
height: 260px !important;
max-width: 260px !important;
margin: 0 !important;
padding: 10px !important;
aspect-ratio: 1 / 1 !important;
object-fit: contain !important;
background: #f7f7f5 !important;
}
/* Titre à droite */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.woocommerce-loop-product__title {
grid-column: 2 !important;
grid-row: 1 !important;
align-self: end !important;
margin: 0 !important;
padding: 18px 0 8px !important;
color: #111 !important;
font-size: 25px !important;
line-height: 1.25 !important;
font-weight: 600 !important;
}
/* Note étoiles éventuelle */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.star-rating {
grid-column: 2 !important;
justify-self: start !important;
margin: 0 0 8px !important;
}
/* Prix à droite sous le titre */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.price {
grid-column: 2 !important;
justify-self: start !important;
margin: 0 !important;
padding: 0 0 12px !important;
font-size: 17px !important;
}
/* =========================================================
DESCRIPTION : CACHÉE EN 2 / 3 / 4
========================================================= */
.orilom-loop-description {
display: none !important;
}
.orilom-shop-products.orilom-grid-2 .orilom-loop-description,
.orilom-shop-products.orilom-grid-3 .orilom-loop-description,
.orilom-shop-products.orilom-grid-4 .orilom-loop-description {
display: none !important;
}
/* Visible UNIQUEMENT en mode 1 */
.orilom-shop-products.orilom-grid-1
.orilom-loop-description {
display: block !important;
grid-column: 2 !important;
justify-self: start !important;
width: 100% !important;
max-width: 760px !important;
margin: 0 !important;
padding: 0 0 18px !important;
color: #666 !important;
font-size: 14px !important;
line-height: 1.65 !important;
}
/* =========================================================
FIX EMOJI WORDPRESS
Une emoji peut devenir ![]()
.
Elle ne doit JAMAIS hériter du style image produit.
========================================================= */
body.woocommerce-shop
.orilom-shop-products.orilom-grid-1
.orilom-loop-description img,
body.post-type-archive-product
.orilom-shop-products.orilom-grid-1
.orilom-loop-description img,
body.tax-product_cat
.orilom-shop-products.orilom-grid-1
.orilom-loop-description img,
body.tax-product_tag
.orilom-shop-products.orilom-grid-1
.orilom-loop-description img,
body.woocommerce-shop
.orilom-shop-products.orilom-grid-1
.orilom-loop-description img.emoji,
body.post-type-archive-product
.orilom-shop-products.orilom-grid-1
.orilom-loop-description img.emoji,
body.tax-product_cat
.orilom-shop-products.orilom-grid-1
.orilom-loop-description img.emoji,
body.tax-product_tag
.orilom-shop-products.orilom-grid-1
.orilom-loop-description img.emoji {
display: inline-block !important;
width: 1em !important;
height: 1em !important;
max-width: 1em !important;
min-width: 0 !important;
aspect-ratio: auto !important;
margin: 0 .12em !important;
padding: 0 !important;
object-fit: contain !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
vertical-align: -0.12em !important;
}
/* Bouton panier à droite */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.button {
grid-column: 2 !important;
justify-self: start !important;
align-self: start !important;
width: auto !important;
min-width: 210px !important;
max-width: 280px !important;
min-height: 44px !important;
margin: 0 0 12px !important;
padding: 12px 28px !important;
}
/* Lien "voir panier" éventuel après AJAX */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.added_to_cart {
grid-column: 2 !important;
justify-self: start !important;
margin: 0 0 12px !important;
}
/* Favoris à droite sous le bouton */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.yith-wcwl-add-to-wishlist {
grid-column: 2 !important;
justify-self: start !important;
width: auto !important;
max-width: 280px !important;
margin: 0 !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.yith-wcwl-add-to-wishlist a {
min-width: 210px !important;
width: 100% !important;
}
/* =========================================================
MOBILE
========================================================= */
@media (max-width: 900px) {
/*
* Le switcher est déjà masqué sur mobile.
* Si une préférence "1 colonne" reste mémorisée,
* on revient quand même à la carte normale.
*/
.orilom-shop-products.orilom-grid-1
ul.products
li.product {
display: flex !important;
flex-direction: column !important;
min-height: 0 !important;
padding: 0 0 18px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link {
display: block !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link
> img.wp-post-image,
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link
> img.attachment-woocommerce_thumbnail {
width: 100% !important;
height: auto !important;
max-width: none !important;
aspect-ratio: 1 / 1 !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.woocommerce-loop-product__title {
padding: 14px 12px 4px !important;
font-size: 15px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.price {
padding: 4px 12px 12px !important;
font-size: 15px !important;
}
.orilom-loop-description {
display: none !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.button {
width: auto !important;
min-width: 0 !important;
max-width: none !important;
margin: auto 12px 10px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.yith-wcwl-add-to-wishlist {
width: auto !important;
max-width: none !important;
margin: 0 12px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.yith-wcwl-add-to-wishlist a {
min-width: 0 !important;
}
}
/* =========================================================
NETTOYAGE APRÈS BARRE OUTILS
========================================================= */
.orilom-shop-products ul.products {
clear: both !important;
}
/* =========================================================
RESPONSIVE DU SWITCHER
========================================================= */
@media (max-width: 1200px) {
/* Le mode choisi par JS garde la priorité sur la grille responsive. */
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products {
grid-template-columns: minmax(0, 1fr) !important;
}
body.woocommerce-shop .orilom-shop-products.orilom-grid-2 ul.products,
body.tax-product_cat .orilom-shop-products.orilom-grid-2 ul.products,
body.tax-product_tag .orilom-shop-products.orilom-grid-2 ul.products {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
body.woocommerce-shop .orilom-shop-products.orilom-grid-3 ul.products,
body.tax-product_cat .orilom-shop-products.orilom-grid-3 ul.products,
body.tax-product_tag .orilom-shop-products.orilom-grid-3 ul.products {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body.woocommerce-shop .orilom-shop-products.orilom-grid-4 ul.products,
body.tax-product_cat .orilom-shop-products.orilom-grid-4 ul.products,
body.tax-product_tag .orilom-shop-products.orilom-grid-4 ul.products {
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
}
@media (max-width: 900px) {
.orilom-grid-switcher {
display: none !important;
}
.orilom-shop-products .woocommerce-result-count {
float: none !important;
margin: 0 0 18px !important;
line-height: normal !important;
}
.orilom-shop-products .woocommerce-ordering {
float: none !important;
width: 100% !important;
margin: 22px 0 25px !important;
}
.orilom-shop-products .woocommerce-ordering select {
width: 100% !important;
min-width: 0 !important;
}
/* Sur mobile on force 2 colonnes, quelle que soit la préférence desktop. */
body.woocommerce-shop .orilom-shop-products ul.products,
body.post-type-archive-product .orilom-shop-products ul.products,
body.tax-product_cat .orilom-shop-products ul.products,
body.tax-product_tag .orilom-shop-products ul.products {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.orilom-shop-products.orilom-grid-1 ul.products li.product {
display: flex !important;
flex-direction: column !important;
min-height: 0 !important;
}
.orilom-shop-products.orilom-grid-1 ul.products li.product > a.woocommerce-LoopProduct-link {
display: block !important;
}
.orilom-shop-products.orilom-grid-1 ul.products li.product img {
height: auto !important;
aspect-ratio: 1 / 1 !important;
}
.orilom-shop-products.orilom-grid-1 ul.products li.product .woocommerce-loop-product__title {
padding: 14px 12px 4px !important;
font-size: 15px !important;
}
.orilom-shop-products.orilom-grid-1 ul.products li.product .price {
padding: 4px 12px 12px !important;
font-size: 15px !important;
}
.orilom-shop-products.orilom-grid-1 ul.products li.product .button {
width: auto !important;
min-width: 0 !important;
margin: auto 12px 10px !important;
}
}
/* =========================================================
ORILOM — FIX FINAL GRID SWITCHER
========================================================= */
/* Zone produits */
.orilom-shop-products {
position: relative !important;
z-index: 5 !important;
}
/* Switcher toujours au-dessus */
.orilom-grid-switcher {
position: relative !important;
z-index: 999 !important;
pointer-events: auto !important;
isolation: isolate;
}
/* Boutons réellement cliquables */
.orilom-grid-switcher .orilom-grid-button {
position: relative !important;
z-index: 1000 !important;
pointer-events: auto !important;
cursor: pointer !important;
touch-action: manipulation;
user-select: none;
-webkit-user-select: none;
}
/* Les éléments internes ne capturent pas le clic */
.orilom-grid-switcher .orilom-grid-button span,
.orilom-grid-switcher .orilom-grid-button i {
pointer-events: none !important;
}
/* Bouton actif */
.orilom-grid-switcher .orilom-grid-button.is-active {
background: #111 !important;
color: #fff !important;
}
/* Hover */
.orilom-grid-switcher .orilom-grid-button:not(.is-active):hover {
background: #f2f2f2 !important;
color: #111 !important;
}
/* Sidebar sous la zone de contrôle */
.orilom-shop-sidebar {
z-index: 2 !important;
}
/* Slider prix isolé dans la sidebar */
.orilom-price-slider {
position: relative !important;
z-index: 1 !important;
isolation: isolate;
}
.orilom-price-slider input[type="range"] {
z-index: 2 !important;
}
/* =========================================================
PRIORITÉ ABSOLUE DES MODES 1 / 2 / 3 / 4
========================================================= */
body .orilom-shop-products.orilom-grid-1 ul.products {
display: grid !important;
grid-template-columns: minmax(0, 1fr) !important;
}
body .orilom-shop-products.orilom-grid-2 ul.products {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
body .orilom-shop-products.orilom-grid-3 ul.products {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body .orilom-shop-products.orilom-grid-4 ul.products {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
/* =========================================================
MOBILE
========================================================= */
@media (max-width: 900px) {
.orilom-grid-switcher {
display: none !important;
}
body .orilom-shop-products ul.products {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
/* =========================================================
ORILOM — MODES 2 / 3 / 4 = CATALOGUE MINIMALISTE
Inspiré de l'ancien site : image -> prix -> titre
Le mode 1 reste détaillé.
========================================================= */
/* Le contenu détaillé reste caché hors mode 1 */
.orilom-shop-products.orilom-grid-2 .orilom-loop-description,
.orilom-shop-products.orilom-grid-3 .orilom-loop-description,
.orilom-shop-products.orilom-grid-4 .orilom-loop-description {
display: none !important;
}
/* =========================================================
CARTES : aucun cadre / aucune ombre en 2, 3, 4
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product,
.orilom-shop-products.orilom-grid-3 ul.products li.product,
.orilom-shop-products.orilom-grid-4 ul.products li.product {
position: relative !important;
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
width: 100% !important;
margin: 0 !important;
padding: 0 0 18px !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
overflow: visible !important;
transform: none !important;
}
/* Pas d'effet carte au survol */
.orilom-shop-products.orilom-grid-2 ul.products li.product:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product:hover {
transform: none !important;
border: 0 !important;
box-shadow: none !important;
}
/* =========================================================
STRUCTURE WOO : on "ouvre" le lien pour pouvoir ordonner
image -> prix -> titre
========================================================= */
.orilom-shop-products.orilom-grid-2
ul.products
li.product
> a.woocommerce-LoopProduct-link,
.orilom-shop-products.orilom-grid-3
ul.products
li.product
> a.woocommerce-LoopProduct-link,
.orilom-shop-products.orilom-grid-4
ul.products
li.product
> a.woocommerce-LoopProduct-link {
display: contents !important;
}
/* =========================================================
IMAGE PRODUIT
========================================================= */
.orilom-shop-products.orilom-grid-2
ul.products
li.product
img.wp-post-image,
.orilom-shop-products.orilom-grid-2
ul.products
li.product
img.attachment-woocommerce_thumbnail,
.orilom-shop-products.orilom-grid-3
ul.products
li.product
img.wp-post-image,
.orilom-shop-products.orilom-grid-3
ul.products
li.product
img.attachment-woocommerce_thumbnail,
.orilom-shop-products.orilom-grid-4
ul.products
li.product
img.wp-post-image,
.orilom-shop-products.orilom-grid-4
ul.products
li.product
img.attachment-woocommerce_thumbnail {
order: 1 !important;
display: block !important;
width: 100% !important;
height: auto !important;
aspect-ratio: 1 / 1 !important;
object-fit: contain !important;
margin: 0 0 9px !important;
padding: 0 !important;
background: #fff !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
}
/* =========================================================
PRIX — juste sous l'image
========================================================= */
.orilom-shop-products.orilom-grid-2
ul.products
li.product
.price,
.orilom-shop-products.orilom-grid-3
ul.products
li.product
.price,
.orilom-shop-products.orilom-grid-4
ul.products
li.product
.price {
order: 2 !important;
display: block !important;
margin: 0 0 7px !important;
padding: 0 !important;
color: #111 !important;
font-size: 12px !important;
line-height: 1.35 !important;
font-weight: 500 !important;
text-align: left !important;
}
/* Ancien prix barré */
.orilom-shop-products.orilom-grid-2 ul.products li.product .price del,
.orilom-shop-products.orilom-grid-3 ul.products li.product .price del,
.orilom-shop-products.orilom-grid-4 ul.products li.product .price del {
margin-right: 5px !important;
color: #999 !important;
font-size: 11px !important;
font-weight: 400 !important;
opacity: 1 !important;
}
/* Prix promo */
.orilom-shop-products.orilom-grid-2 ul.products li.product .price ins,
.orilom-shop-products.orilom-grid-3 ul.products li.product .price ins,
.orilom-shop-products.orilom-grid-4 ul.products li.product .price ins {
color: #111 !important;
font-weight: 600 !important;
text-decoration: none !important;
}
/* =========================================================
TITRE — sous le prix
========================================================= */
.orilom-shop-products.orilom-grid-2
ul.products
li.product
.woocommerce-loop-product__title,
.orilom-shop-products.orilom-grid-3
ul.products
li.product
.woocommerce-loop-product__title,
.orilom-shop-products.orilom-grid-4
ul.products
li.product
.woocommerce-loop-product__title {
order: 3 !important;
margin: 0 !important;
padding: 0 !important;
color: #111 !important;
font-size: 11.5px !important;
line-height: 1.45 !important;
font-weight: 500 !important;
text-transform: uppercase !important;
text-align: left !important;
}
/* =========================================================
ON CACHE TOUT LE RESTE EN MODES 2 / 3 / 4
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product .button,
.orilom-shop-products.orilom-grid-3 ul.products li.product .button,
.orilom-shop-products.orilom-grid-4 ul.products li.product .button,
.orilom-shop-products.orilom-grid-2 ul.products li.product .added_to_cart,
.orilom-shop-products.orilom-grid-3 ul.products li.product .added_to_cart,
.orilom-shop-products.orilom-grid-4 ul.products li.product .added_to_cart,
.orilom-shop-products.orilom-grid-2 ul.products li.product .yith-wcwl-add-to-wishlist,
.orilom-shop-products.orilom-grid-3 ul.products li.product .yith-wcwl-add-to-wishlist,
.orilom-shop-products.orilom-grid-4 ul.products li.product .yith-wcwl-add-to-wishlist,
.orilom-shop-products.orilom-grid-2 ul.products li.product .star-rating,
.orilom-shop-products.orilom-grid-3 ul.products li.product .star-rating,
.orilom-shop-products.orilom-grid-4 ul.products li.product .star-rating {
display: none !important;
}
/* Si tu veux strictement "image + prix + titre", pas de badge promo */
.orilom-shop-products.orilom-grid-2 .onsale,
.orilom-shop-products.orilom-grid-3 .onsale,
.orilom-shop-products.orilom-grid-4 .onsale {
display: none !important;
}
/* =========================================================
ESPACEMENT DES GRILLES
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products {
gap: 30px 28px !important;
}
.orilom-shop-products.orilom-grid-3 ul.products {
gap: 30px 24px !important;
}
.orilom-shop-products.orilom-grid-4 ul.products {
gap: 28px 22px !important;
}
/* =========================================================
MOBILE
On conserve le rendu catalogue simple
========================================================= */
@media (max-width: 900px) {
.orilom-shop-products.orilom-grid-2 ul.products li.product,
.orilom-shop-products.orilom-grid-3 ul.products li.product,
.orilom-shop-products.orilom-grid-4 ul.products li.product {
padding-bottom: 14px !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product .price,
.orilom-shop-products.orilom-grid-3 ul.products li.product .price,
.orilom-shop-products.orilom-grid-4 ul.products li.product .price {
font-size: 11px !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product .woocommerce-loop-product__title,
.orilom-shop-products.orilom-grid-3 ul.products li.product .woocommerce-loop-product__title,
.orilom-shop-products.orilom-grid-4 ul.products li.product .woocommerce-loop-product__title {
font-size: 10.5px !important;
line-height: 1.4 !important;
}
}
/* =========================================================
ORILOM — CORRECTIF WISHLIST RÉEL DU THÈME
Le HTML réel utilise .orilom-wishlist-button
et NON les classes YITH.
Modes 2 / 3 / 4 :
- coeur fixe en haut à droite
- panier au centre au hover
- image + prix + titre
========================================================= */
/* Référence de positionnement */
.orilom-shop-products.orilom-grid-2 ul.products li.product,
.orilom-shop-products.orilom-grid-3 ul.products li.product,
.orilom-shop-products.orilom-grid-4 ul.products li.product {
position: relative !important;
}
/* =========================================================
COEUR / FAVORIS — bouton rond en haut à droite
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button {
position: absolute !important;
top: 12px !important;
right: 12px !important;
left: auto !important;
z-index: 80 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 38px !important;
min-width: 38px !important;
max-width: 38px !important;
height: 38px !important;
min-height: 38px !important;
max-height: 38px !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
border: 1px solid rgba(17,17,17,.12) !important;
border-radius: 50% !important;
background: rgba(255,255,255,.96) !important;
color: transparent !important;
box-shadow: 0 5px 16px rgba(0,0,0,.10) !important;
font-size: 0 !important;
line-height: 0 !important;
text-indent: -9999px !important;
white-space: nowrap !important;
text-decoration: none !important;
opacity: 1 !important;
visibility: visible !important;
transform: none !important;
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
transition:
transform .18s ease,
background .18s ease,
border-color .18s ease,
box-shadow .18s ease !important;
}
/* Coeur SVG */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button::before {
content: "" !important;
display: block !important;
width: 18px !important;
height: 18px !important;
flex: 0 0 18px !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: contain !important;
text-indent: 0 !important;
}
/* Hover du coeur */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:hover {
background: #111 !important;
border-color: #111 !important;
transform: scale(1.08) !important;
box-shadow: 0 7px 20px rgba(0,0,0,.18) !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:hover::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:hover::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:hover::before {
filter: invert(1) !important;
}
/* Produit déjà dans les favoris :
coeur rempli / bouton noir */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button.is-active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button.is-active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button.is-active {
background: #111 !important;
border-color: #111 !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button.is-active::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button.is-active::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button.is-active::before {
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff' stroke='%23fff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
/* =========================================================
PANIER — rond au centre au survol
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button {
position: absolute !important;
top: 42% !important;
left: 50% !important;
right: auto !important;
z-index: 70 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 46px !important;
min-width: 46px !important;
max-width: 46px !important;
height: 46px !important;
min-height: 46px !important;
max-height: 46px !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
border: 1px solid #111 !important;
border-radius: 50% !important;
background: rgba(17,17,17,.94) !important;
color: transparent !important;
box-shadow: 0 8px 24px rgba(0,0,0,.20) !important;
font-size: 0 !important;
line-height: 0 !important;
text-indent: -9999px !important;
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
transform:
translate(-50%, -50%)
translateY(8px) !important;
transition:
opacity .20s ease,
visibility .20s ease,
transform .20s ease,
background .18s ease !important;
}
/* Panier SVG */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button::before {
content: "" !important;
display: block !important;
width: 19px !important;
height: 19px !important;
flex: 0 0 19px !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H7'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: contain !important;
text-indent: 0 !important;
}
/* Panier visible au hover de la carte */
.orilom-shop-products.orilom-grid-2 ul.products li.product:hover > .button,
.orilom-shop-products.orilom-grid-3 ul.products li.product:hover > .button,
.orilom-shop-products.orilom-grid-4 ul.products li.product:hover > .button {
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
transform:
translate(-50%, -50%)
translateY(0) !important;
}
/* Hover panier */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover {
background: #2b2b2b !important;
transform:
translate(-50%, -50%)
scale(1.08) !important;
}
/* Image : petite réaction au hover */
.orilom-shop-products.orilom-grid-2 ul.products li.product img.wp-post-image,
.orilom-shop-products.orilom-grid-2 ul.products li.product img.attachment-woocommerce_thumbnail,
.orilom-shop-products.orilom-grid-3 ul.products li.product img.wp-post-image,
.orilom-shop-products.orilom-grid-3 ul.products li.product img.attachment-woocommerce_thumbnail,
.orilom-shop-products.orilom-grid-4 ul.products li.product img.wp-post-image,
.orilom-shop-products.orilom-grid-4 ul.products li.product img.attachment-woocommerce_thumbnail {
transition:
transform .28s ease,
filter .28s ease !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product:hover img.wp-post-image,
.orilom-shop-products.orilom-grid-2 ul.products li.product:hover img.attachment-woocommerce_thumbnail,
.orilom-shop-products.orilom-grid-3 ul.products li.product:hover img.wp-post-image,
.orilom-shop-products.orilom-grid-3 ul.products li.product:hover img.attachment-woocommerce_thumbnail,
.orilom-shop-products.orilom-grid-4 ul.products li.product:hover img.wp-post-image,
.orilom-shop-products.orilom-grid-4 ul.products li.product:hover img.attachment-woocommerce_thumbnail {
transform: scale(.985) !important;
filter: brightness(.95) !important;
}
/* Lien "Voir panier" caché dans la grille minimaliste */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .added_to_cart,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .added_to_cart,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .added_to_cart {
display: none !important;
}
/* =========================================================
MOBILE / TOUCH
========================================================= */
@media (max-width: 900px) {
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button {
top: 9px !important;
right: 9px !important;
width: 35px !important;
min-width: 35px !important;
max-width: 35px !important;
height: 35px !important;
min-height: 35px !important;
max-height: 35px !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button {
top: 51px !important;
right: 9px !important;
left: auto !important;
width: 35px !important;
min-width: 35px !important;
max-width: 35px !important;
height: 35px !important;
min-height: 35px !important;
max-height: 35px !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
transform: none !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover {
transform: none !important;
}
}
/* =========================================================
ORILOM — PANIER CONTRASTE INTELLIGENT
Bouton blanc/glass lisible sur images claires ET sombres.
Au hover du bouton : noir + icône blanche.
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button {
width: 50px !important;
min-width: 50px !important;
max-width: 50px !important;
height: 50px !important;
min-height: 50px !important;
max-height: 50px !important;
background: rgba(255,255,255,.96) !important;
border: 1px solid rgba(0,0,0,.14) !important;
box-shadow:
0 0 0 3px rgba(255,255,255,.30),
0 8px 25px rgba(0,0,0,.24) !important;
backdrop-filter: blur(8px) !important;
-webkit-backdrop-filter: blur(8px) !important;
}
/* Icône panier noire par défaut */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button::before {
width: 20px !important;
height: 20px !important;
flex: 0 0 20px !important;
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H7'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: contain !important;
}
/* Hover du bouton : inversion noir/blanc */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover {
background: #111 !important;
border-color: #111 !important;
box-shadow:
0 0 0 3px rgba(255,255,255,.38),
0 10px 28px rgba(0,0,0,.28) !important;
transform:
translate(-50%, -50%)
scale(1.08) !important;
}
/* Icône blanche au hover */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover::before {
filter: invert(1) !important;
}
/* Mobile : taille légèrement réduite, toujours lisible */
@media (max-width: 900px) {
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button {
width: 38px !important;
min-width: 38px !important;
max-width: 38px !important;
height: 38px !important;
min-height: 38px !important;
max-height: 38px !important;
box-shadow:
0 0 0 2px rgba(255,255,255,.32),
0 5px 16px rgba(0,0,0,.20) !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button::before {
width: 17px !important;
height: 17px !important;
flex-basis: 17px !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover {
transform: none !important;
}
}
/* =========================================================
ORILOM — UI/UX FINAL
1) Coeur TOUJOURS blanc, jamais noir
2) Favori actif = coeur doré dans bouton blanc
3) Panier = glass blanc
4) Hover panier = champagne/doré, jamais noir
========================================================= */
/* =========================================================
COEUR — STYLE PREMIUM UNIFORME
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button.is-active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button.is-active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button.is-active {
background: rgba(255,255,255,.97) !important;
border: 1px solid rgba(17,17,17,.10) !important;
box-shadow:
0 3px 10px rgba(0,0,0,.07),
0 8px 22px rgba(0,0,0,.08) !important;
color: transparent !important;
opacity: 1 !important;
visibility: visible !important;
}
/* Coeur NORMAL : contour noir fin */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:not(.is-active)::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:not(.is-active)::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:not(.is-active)::before {
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23222222' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
/* Favori ACTIF :
même bouton blanc, coeur rempli doré */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button.is-active::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button.is-active::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button.is-active::before {
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23c9a227' stroke='%23c9a227' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
/* Hover du coeur : champagne léger, pas de noir */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button.is-active:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button.is-active:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button.is-active:hover {
background: #fffaf0 !important;
border-color: rgba(201,162,39,.65) !important;
box-shadow:
0 0 0 3px rgba(201,162,39,.08),
0 8px 22px rgba(0,0,0,.13) !important;
transform: scale(1.07) !important;
}
/* Coeur normal devient doré au hover */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:not(.is-active):hover::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:not(.is-active):hover::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:not(.is-active):hover::before {
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a227' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
/* Petit feedback de clic */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:active {
transform: scale(.94) !important;
}
/* =========================================================
PANIER — GLASS BLANC + HOVER CHAMPAGNE
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button {
background: rgba(255,255,255,.97) !important;
border: 1px solid rgba(17,17,17,.12) !important;
box-shadow:
0 0 0 3px rgba(255,255,255,.34),
0 8px 25px rgba(0,0,0,.22) !important;
backdrop-filter: blur(8px) !important;
-webkit-backdrop-filter: blur(8px) !important;
}
/* Icône panier noire au repos */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button::before {
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23181818' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H7'/%3E%3C/svg%3E") !important;
}
/* Hover panier : champagne/doré subtil, jamais noir */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover {
background: #fffaf0 !important;
border-color: rgba(201,162,39,.75) !important;
box-shadow:
0 0 0 3px rgba(201,162,39,.10),
0 10px 28px rgba(0,0,0,.20) !important;
transform:
translate(-50%, -50%)
scale(1.08) !important;
}
/* Panier doré au hover */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover::before {
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a227' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H7'/%3E%3C/svg%3E") !important;
}
/* Feedback clic panier */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:active {
transform:
translate(-50%, -50%)
scale(.96) !important;
}
/* Mobile : pas de mouvement qui décale les boutons */
@media (max-width: 900px) {
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:active {
transform: none !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:active {
transform: none !important;
}
}
/* =========================================================
ORILOM — CORRECTIF GLOBAL UI/UX
Hiérarchie claire :
- Coeur = action secondaire, discrète
- Panier = action principale, plus visible
========================================================= */
/* =========================================================
COEUR — ACTION SECONDAIRE
Blanc, discret, doré uniquement à l'interaction
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button.is-active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button.is-active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button.is-active {
background: rgba(255,255,255,.97) !important;
border: 1px solid rgba(17,17,17,.10) !important;
box-shadow:
0 3px 10px rgba(0,0,0,.07),
0 7px 20px rgba(0,0,0,.08) !important;
}
/* Coeur normal = contour noir */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:not(.is-active)::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:not(.is-active)::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:not(.is-active)::before {
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23202020' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
/* Favori actif = coeur rempli doré, cercle toujours blanc */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button.is-active::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button.is-active::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button.is-active::before {
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23c9a227' stroke='%23c9a227' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
/* Hover coeur = ivoire + contour doré */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:hover {
background: #fffaf0 !important;
border-color: rgba(201,162,39,.65) !important;
box-shadow:
0 0 0 3px rgba(201,162,39,.08),
0 8px 22px rgba(0,0,0,.13) !important;
transform: scale(1.07) !important;
}
/* Coeur devient doré au hover */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:not(.is-active):hover::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:not(.is-active):hover::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:not(.is-active):hover::before {
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a227' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
/* Clic coeur */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:active {
transform: scale(.94) !important;
}
/* =========================================================
PANIER — ACTION PRINCIPALE
Blanc lisible au repos, doré plein au hover
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button {
width: 52px !important;
min-width: 52px !important;
max-width: 52px !important;
height: 52px !important;
min-height: 52px !important;
max-height: 52px !important;
background: rgba(255,255,255,.97) !important;
border: 1px solid rgba(17,17,17,.14) !important;
box-shadow:
0 0 0 3px rgba(255,255,255,.38),
0 10px 28px rgba(0,0,0,.24) !important;
backdrop-filter: blur(9px) !important;
-webkit-backdrop-filter: blur(9px) !important;
}
/* Icône panier noire au repos */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button::before {
width: 21px !important;
height: 21px !important;
flex: 0 0 21px !important;
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23181818' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H7'/%3E%3C/svg%3E") !important;
}
/* Hover panier = doré plein + icône blanche */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover {
background: #c9a227 !important;
border-color: #c9a227 !important;
box-shadow:
0 0 0 4px rgba(201,162,39,.16),
0 12px 30px rgba(0,0,0,.22) !important;
transform:
translate(-50%, -50%)
scale(1.09) !important;
}
/* Icône panier blanche au hover */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover::before {
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H7'/%3E%3C/svg%3E") !important;
}
/* Click panier = doré plus profond + effet pression */
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:active {
background: #a98516 !important;
border-color: #a98516 !important;
transform:
translate(-50%, -50%)
scale(.96) !important;
}
/* =========================================================
IMAGE — améliore la lisibilité des actions au hover
========================================================= */
.orilom-shop-products.orilom-grid-2 ul.products li.product:hover img.wp-post-image,
.orilom-shop-products.orilom-grid-2 ul.products li.product:hover img.attachment-woocommerce_thumbnail,
.orilom-shop-products.orilom-grid-3 ul.products li.product:hover img.wp-post-image,
.orilom-shop-products.orilom-grid-3 ul.products li.product:hover img.attachment-woocommerce_thumbnail,
.orilom-shop-products.orilom-grid-4 ul.products li.product:hover img.wp-post-image,
.orilom-shop-products.orilom-grid-4 ul.products li.product:hover img.attachment-woocommerce_thumbnail {
transform: scale(.985) !important;
filter: brightness(.93) saturate(.98) !important;
}
/* =========================================================
MOBILE
Pas de hover : panier doré permanent pour CTA clair
========================================================= */
@media (max-width: 900px) {
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button {
width: 40px !important;
min-width: 40px !important;
max-width: 40px !important;
height: 40px !important;
min-height: 40px !important;
max-height: 40px !important;
background: #c9a227 !important;
border-color: #c9a227 !important;
box-shadow:
0 0 0 3px rgba(201,162,39,.12),
0 7px 18px rgba(0,0,0,.18) !important;
transform: none !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button::before,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button::before {
width: 18px !important;
height: 18px !important;
flex: 0 0 18px !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H7'/%3E%3C/svg%3E") !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:hover,
.orilom-shop-products.orilom-grid-2 ul.products li.product > .button:active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .button:active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .button:active {
transform: none !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:hover,
.orilom-shop-products.orilom-grid-2 ul.products li.product > .orilom-wishlist-button:active,
.orilom-shop-products.orilom-grid-3 ul.products li.product > .orilom-wishlist-button:active,
.orilom-shop-products.orilom-grid-4 ul.products li.product > .orilom-wishlist-button:active {
transform: none !important;
}
}
/* =========================================================
ORILOM — BOUTIQUE EXCELLENCE V2
Header catalogue compact + toolbar alignée + meilleure
hiérarchie visuelle, sans casser la grille produit.
========================================================= */
/* ---------- Layout général plus compact ---------- */
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout {
max-width: 1500px !important;
padding: 28px 3vw 76px !important;
grid-template-columns: 225px minmax(0, 1fr) !important;
gap: 32px !important;
align-items: start !important;
}
/* Sidebar plus légère et mieux alignée avec le contenu */
.orilom-shop-sidebar {
top: 112px !important;
border-radius: 16px !important;
padding: 20px !important;
box-shadow: 0 5px 22px rgba(0,0,0,.035) !important;
}
/* ---------- Main catalogue = vraie composition éditoriale ---------- */
.orilom-shop-products {
display: grid !important;
grid-template-columns: minmax(0, 1fr) auto auto !important;
grid-template-rows: auto auto auto auto auto !important;
column-gap: 12px !important;
row-gap: 0 !important;
align-items: end !important;
}
/* Titre */
.orilom-shop-products > .page-title {
grid-column: 1 / -1 !important;
grid-row: 1 !important;
margin: 0 !important;
padding: 0 !important;
color: #111 !important;
font-size: clamp(44px, 4vw, 64px) !important;
line-height: .98 !important;
font-weight: 500 !important;
letter-spacing: -.035em !important;
}
/* Intro boutique */
.orilom-shop-intro {
grid-column: 1 / -1 !important;
grid-row: 2 !important;
max-width: 820px !important;
margin: 14px 0 22px !important;
padding: 0 !important;
}
.orilom-shop-intro-kicker {
display: block !important;
margin-bottom: 7px !important;
color: #a98516 !important;
font-size: 10px !important;
line-height: 1.2 !important;
font-weight: 800 !important;
letter-spacing: .12em !important;
text-transform: uppercase !important;
}
.orilom-shop-intro p {
margin: 0 !important;
max-width: 760px !important;
color: #686868 !important;
font-size: 14px !important;
line-height: 1.65 !important;
font-weight: 400 !important;
}
/* Notices : pas d'espace fantôme */
.orilom-shop-products > .woocommerce-notices-wrapper {
grid-column: 1 / -1 !important;
grid-row: 3 !important;
margin: 0 0 16px !important;
}
.orilom-shop-products > .woocommerce-notices-wrapper:empty {
display: none !important;
}
/* ---------- Toolbar sur UNE ligne ---------- */
.orilom-shop-products > .woocommerce-result-count {
grid-column: 1 !important;
grid-row: 4 !important;
align-self: center !important;
margin: 0 !important;
padding: 0 !important;
color: #777 !important;
font-size: 12px !important;
line-height: 42px !important;
}
.orilom-shop-products > .orilom-grid-switcher {
grid-column: 2 !important;
grid-row: 4 !important;
float: none !important;
align-self: center !important;
height: 42px !important;
margin: 0 !important;
}
.orilom-shop-products > .woocommerce-ordering {
grid-column: 3 !important;
grid-row: 4 !important;
float: none !important;
align-self: center !important;
margin: 0 !important;
}
.orilom-shop-products > .woocommerce-ordering select {
height: 42px !important;
min-height: 42px !important;
min-width: 176px !important;
border-radius: 11px !important;
font-size: 12px !important;
}
/* ---------- Produits immédiatement sous la toolbar ---------- */
.orilom-shop-products > ul.products {
grid-column: 1 / -1 !important;
grid-row: 5 !important;
width: 100% !important;
margin-top: 18px !important;
padding-top: 20px !important;
border-top: 1px solid #ededed !important;
}
/* Un peu plus d'air vertical sans gonfler les cartes */
.orilom-shop-products.orilom-grid-4 ul.products {
gap: 34px 20px !important;
}
.orilom-shop-products.orilom-grid-3 ul.products {
gap: 36px 24px !important;
}
.orilom-shop-products.orilom-grid-2 ul.products {
gap: 38px 28px !important;
}
/* Texte produit plus propre */
.orilom-shop-products.orilom-grid-2 ul.products li.product .price,
.orilom-shop-products.orilom-grid-3 ul.products li.product .price,
.orilom-shop-products.orilom-grid-4 ul.products li.product .price {
margin-bottom: 6px !important;
font-size: 11.5px !important;
line-height: 1.3 !important;
}
.orilom-shop-products.orilom-grid-2 ul.products li.product .woocommerce-loop-product__title,
.orilom-shop-products.orilom-grid-3 ul.products li.product .woocommerce-loop-product__title,
.orilom-shop-products.orilom-grid-4 ul.products li.product .woocommerce-loop-product__title {
font-size: 11px !important;
line-height: 1.48 !important;
letter-spacing: .005em !important;
}
/* ---------- Très grands écrans ---------- */
@media (min-width: 1450px) {
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout {
grid-template-columns: 235px minmax(0, 1fr) !important;
gap: 38px !important;
}
}
/* ---------- Tablette ---------- */
@media (max-width: 1100px) and (min-width: 901px) {
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout {
grid-template-columns: 205px minmax(0, 1fr) !important;
gap: 24px !important;
padding-left: 24px !important;
padding-right: 24px !important;
}
.orilom-shop-products > .page-title {
font-size: 48px !important;
}
.orilom-shop-products > .woocommerce-ordering select {
min-width: 158px !important;
}
}
/* ---------- Mobile ---------- */
@media (max-width: 900px) {
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout {
display: block !important;
padding: 20px 18px 56px !important;
}
.orilom-shop-sidebar {
position: static !important;
margin-bottom: 28px !important;
}
.orilom-shop-products {
display: block !important;
}
.orilom-shop-products > .page-title {
margin-bottom: 10px !important;
font-size: clamp(38px, 12vw, 52px) !important;
}
.orilom-shop-intro {
margin: 0 0 18px !important;
}
.orilom-shop-intro p {
font-size: 13px !important;
line-height: 1.6 !important;
}
.orilom-shop-products > .woocommerce-result-count {
margin: 0 0 12px !important;
line-height: 1.4 !important;
}
.orilom-shop-products > .woocommerce-ordering {
width: 100% !important;
margin: 0 0 14px !important;
}
.orilom-shop-products > .woocommerce-ordering select {
width: 100% !important;
min-width: 0 !important;
}
.orilom-shop-products > ul.products {
margin-top: 0 !important;
padding-top: 18px !important;
}
}
/* =========================================================
ORILOM — BOUTIQUE COMPACT HEADER V3
Supprime le gros titre "Boutique" et réduit fortement
l'espace supérieur du catalogue.
========================================================= */
/* Sur la page Boutique uniquement, le H1 reste dans le DOM
sans consommer d'espace. Les catégories gardent un vrai H1 visible. */
body.woocommerce-shop .orilom-shop-products > .page-title {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
/* Le catalogue commence immédiatement */
.orilom-shop-products {
position: relative !important;
}
/* Intro ultra compacte avec icône boutique moderne */
.orilom-shop-intro {
grid-column: 1 / -1 !important;
grid-row: 1 !important;
display: flex !important;
align-items: center !important;
gap: 10px !important;
max-width: none !important;
margin: 0 0 14px !important;
padding: 0 0 13px !important;
border-bottom: 1px solid #ededed !important;
}
.orilom-shop-intro::before {
content: "" !important;
display: block !important;
flex: 0 0 32px !important;
width: 32px !important;
height: 32px !important;
border: 1px solid rgba(17,17,17,.10) !important;
border-radius: 10px !important;
background-color: #fff !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: 16px 16px !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b28a12' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l1.5-5h15L21 9'/%3E%3Cpath d='M5 13v7h14v-7'/%3E%3Cpath d='M9 20v-6h6v6'/%3E%3Cpath d='M3 9a3 3 0 0 0 6 0 3 3 0 0 0 6 0 3 3 0 0 0 6 0'/%3E%3C/svg%3E") !important;
box-shadow: 0 4px 13px rgba(0,0,0,.045) !important;
}
/* Kicker devient le titre visuel compact */
.orilom-shop-intro-kicker {
display: block !important;
margin: 0 0 2px !important;
color: #171717 !important;
font-size: 11px !important;
line-height: 1.2 !important;
font-weight: 800 !important;
letter-spacing: .08em !important;
text-transform: uppercase !important;
}
/* Description sur une seule zone compacte */
.orilom-shop-intro p {
margin: 0 !important;
max-width: 820px !important;
color: #747474 !important;
font-size: 11.5px !important;
line-height: 1.45 !important;
}
/* Notices passent juste sous l'intro */
.orilom-shop-products > .woocommerce-notices-wrapper {
grid-column: 1 / -1 !important;
grid-row: 2 !important;
margin: 0 0 10px !important;
}
/* Toolbar immédiatement sous l'intro */
.orilom-shop-products > .woocommerce-result-count {
grid-column: 1 !important;
grid-row: 3 !important;
}
.orilom-shop-products > .orilom-grid-switcher {
grid-column: 2 !important;
grid-row: 3 !important;
}
.orilom-shop-products > .woocommerce-ordering {
grid-column: 3 !important;
grid-row: 3 !important;
}
/* Produits remontés */
.orilom-shop-products > ul.products {
grid-column: 1 / -1 !important;
grid-row: 4 !important;
margin-top: 10px !important;
padding-top: 16px !important;
}
/* Réduction de la marge haute de toute la boutique */
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout {
padding-top: 18px !important;
}
/* Sidebar alignée avec le header compact */
.orilom-shop-sidebar {
margin-top: 0 !important;
}
/* ---------- Mobile ---------- */
@media (max-width: 900px) {
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout {
padding-top: 14px !important;
}
.orilom-shop-intro {
gap: 9px !important;
margin-bottom: 12px !important;
padding-bottom: 11px !important;
}
.orilom-shop-intro::before {
flex-basis: 30px !important;
width: 30px !important;
height: 30px !important;
border-radius: 9px !important;
}
.orilom-shop-intro p {
font-size: 11px !important;
line-height: 1.4 !important;
}
.orilom-shop-products > ul.products {
margin-top: 0 !important;
padding-top: 14px !important;
}
}
/* =========================================================
ORILOM — MODE 1 / LISTE PREMIUM V4
Correctif UI/UX :
- coeur parfaitement lisible en haut à droite
- panier compact, moderne et hiérarchisé
- aucun gros bouton noir lourd
========================================================= */
/* La carte sert de référence aux actions */
.orilom-shop-products.orilom-grid-1 ul.products li.product {
position: relative !important;
padding: 14px 18px 14px 14px !important;
border: 1px solid #e8e8e5 !important;
border-radius: 16px !important;
background: #fff !important;
box-shadow: 0 7px 24px rgba(0,0,0,.035) !important;
transition:
border-color .2s ease,
box-shadow .2s ease,
transform .2s ease !important;
}
.orilom-shop-products.orilom-grid-1 ul.products li.product:hover {
border-color: #ddd9cf !important;
box-shadow: 0 12px 30px rgba(0,0,0,.055) !important;
transform: translateY(-1px) !important;
}
/* =========================================================
COEUR — MODE 1
========================================================= */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button,
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button.is-active {
position: absolute !important;
top: 16px !important;
right: 16px !important;
left: auto !important;
z-index: 90 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 40px !important;
min-width: 40px !important;
max-width: 40px !important;
height: 40px !important;
min-height: 40px !important;
max-height: 40px !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
background: rgba(255,255,255,.98) !important;
border: 1px solid rgba(17,17,17,.10) !important;
border-radius: 50% !important;
box-shadow:
0 4px 12px rgba(0,0,0,.07),
0 8px 22px rgba(0,0,0,.07) !important;
color: transparent !important;
font-size: 0 !important;
line-height: 0 !important;
text-indent: -9999px !important;
white-space: nowrap !important;
opacity: 1 !important;
visibility: visible !important;
transform: none !important;
transition:
transform .18s ease,
background .18s ease,
border-color .18s ease,
box-shadow .18s ease !important;
}
/* Coeur normal */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button:not(.is-active)::before {
content: "" !important;
display: block !important;
width: 19px !important;
height: 19px !important;
flex: 0 0 19px !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23202020' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: contain !important;
text-indent: 0 !important;
}
/* Favori actif = coeur doré rempli */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button.is-active::before {
content: "" !important;
display: block !important;
width: 19px !important;
height: 19px !important;
flex: 0 0 19px !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23c9a227' stroke='%23c9a227' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: contain !important;
text-indent: 0 !important;
}
/* Hover coeur */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button:hover {
background: #fffaf0 !important;
border-color: rgba(201,162,39,.62) !important;
box-shadow:
0 0 0 3px rgba(201,162,39,.08),
0 8px 22px rgba(0,0,0,.11) !important;
transform: scale(1.07) !important;
}
/* Coeur normal devient doré au hover */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button:not(.is-active):hover::before {
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a227' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button:active {
transform: scale(.94) !important;
}
/* =========================================================
PANIER — MODE 1
CTA principal compact et premium
========================================================= */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button {
position: static !important;
grid-column: 2 !important;
grid-row: auto !important;
justify-self: start !important;
align-self: start !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 9px !important;
width: auto !important;
min-width: 172px !important;
max-width: none !important;
height: 44px !important;
min-height: 44px !important;
max-height: 44px !important;
margin: 2px 0 8px !important;
padding: 0 18px !important;
overflow: visible !important;
background: #fffaf0 !important;
border: 1px solid rgba(201,162,39,.72) !important;
border-radius: 11px !important;
color: #171717 !important;
box-shadow:
0 4px 14px rgba(0,0,0,.055) !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
transform: none !important;
font-size: 11px !important;
line-height: 1 !important;
font-weight: 800 !important;
letter-spacing: .045em !important;
text-transform: uppercase !important;
text-indent: 0 !important;
transition:
background .18s ease,
color .18s ease,
border-color .18s ease,
box-shadow .18s ease,
transform .18s ease !important;
}
/* Icône panier propre */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button::before {
content: "" !important;
display: block !important;
width: 17px !important;
height: 17px !important;
flex: 0 0 17px !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b28a12' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H7'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: contain !important;
}
/* Hover panier : CTA plus fort mais toujours luxe */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button:hover {
background: #c9a227 !important;
border-color: #c9a227 !important;
color: #fff !important;
box-shadow:
0 8px 20px rgba(169,133,22,.22) !important;
transform: translateY(-1px) !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button:hover::before {
filter: brightness(0) invert(1) !important;
}
/* Clic panier */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button:active {
background: #a98516 !important;
border-color: #a98516 !important;
transform: scale(.97) !important;
}
/* Lien Woo "Voir panier" éventuel */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .added_to_cart {
grid-column: 2 !important;
justify-self: start !important;
margin: 0 !important;
padding: 4px 0 !important;
color: #8b6c12 !important;
font-size: 11px !important;
font-weight: 700 !important;
text-decoration: none !important;
}
/* =========================================================
MODE 1 — RESPONSIVE
========================================================= */
@media (max-width: 900px) {
.orilom-shop-products.orilom-grid-1 ul.products li.product {
grid-template-columns: 150px minmax(0,1fr) !important;
min-height: 170px !important;
column-gap: 16px !important;
padding: 10px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link
> img.wp-post-image,
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link
> img.attachment-woocommerce_thumbnail {
width: 150px !important;
height: 150px !important;
max-width: 150px !important;
padding: 6px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.woocommerce-loop-product__title {
padding-top: 10px !important;
padding-right: 40px !important;
font-size: 17px !important;
}
.orilom-shop-products.orilom-grid-1
.orilom-loop-description {
display: none !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button {
top: 10px !important;
right: 10px !important;
width: 36px !important;
min-width: 36px !important;
max-width: 36px !important;
height: 36px !important;
min-height: 36px !important;
max-height: 36px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button {
min-width: 150px !important;
height: 40px !important;
min-height: 40px !important;
max-height: 40px !important;
padding: 0 13px !important;
font-size: 10px !important;
}
}
@media (max-width: 560px) {
.orilom-shop-products.orilom-grid-1 ul.products li.product {
display: grid !important;
grid-template-columns: 108px minmax(0,1fr) !important;
min-height: 128px !important;
column-gap: 12px !important;
border-radius: 13px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link
> img.wp-post-image,
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> a.woocommerce-LoopProduct-link
> img.attachment-woocommerce_thumbnail {
width: 108px !important;
height: 108px !important;
max-width: 108px !important;
padding: 4px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.woocommerce-loop-product__title {
padding-top: 7px !important;
padding-right: 34px !important;
font-size: 14px !important;
line-height: 1.3 !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
.price {
padding-bottom: 7px !important;
font-size: 13px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button {
width: 32px !important;
min-width: 32px !important;
max-width: 32px !important;
height: 32px !important;
min-height: 32px !important;
max-height: 32px !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button {
min-width: 0 !important;
height: 36px !important;
min-height: 36px !important;
max-height: 36px !important;
padding: 0 11px !important;
font-size: 9px !important;
}
}
/* =========================================================
ORILOM — MODE 1 / STABILITÉ HOVER V5
Empêche le bouton panier et la carte de "glisser"
quand la souris passe sur la fiche produit.
========================================================= */
/* La carte ne bouge plus au survol */
.orilom-shop-products.orilom-grid-1 ul.products li.product:hover {
transform: none !important;
}
/* Le bouton panier reste exactement à sa place au hover */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button:hover {
transform: none !important;
}
/* Le clic garde un feedback discret, sans translation */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button:active {
transform: scale(.98) !important;
}
/* Le coeur ne provoque aucun déplacement de la carte */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .orilom-wishlist-button:hover {
transform: scale(1.05) !important;
}
/* Sécurise la géométrie du bouton contre d'anciennes règles globales */
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button {
position: static !important;
top: auto !important;
right: auto !important;
bottom: auto !important;
left: auto !important;
transform: none !important;
transition:
background .18s ease,
color .18s ease,
border-color .18s ease,
box-shadow .18s ease !important;
}
/* Mobile : aucune translation non plus */
@media (max-width: 900px) {
.orilom-shop-products.orilom-grid-1
ul.products
li.product:hover {
transform: none !important;
}
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button,
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button:hover,
.orilom-shop-products.orilom-grid-1
ul.products
li.product
> .button:active {
transform: none !important;
}
}
/* =========================================================
ORILOM — MODE 1 / HARD RESET POSITION PANIER V6
Neutralise définitivement le positionnement "hover overlay"
réservé aux grilles 2/3/4.
========================================================= */
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > a.button,
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > .button,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > a.button,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > .button,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > a.button,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > .button {
position: static !important;
top: auto !important;
right: auto !important;
bottom: auto !important;
left: auto !important;
grid-column: 2 !important;
justify-self: start !important;
align-self: start !important;
margin: 2px 0 8px !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
transform: none !important;
}
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product:hover > a.button,
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product:hover > .button,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product:hover > a.button,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product:hover > .button,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product:hover > a.button,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product:hover > .button {
position: static !important;
top: auto !important;
right: auto !important;
bottom: auto !important;
left: auto !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
transform: none !important;
}
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > a.button:active,
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:active,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > a.button:active,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:active,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > a.button:active,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:active {
transform: scale(.98) !important;
}
/* =========================================================
ORILOM — MODE 1 / CTA PANIER PREMIUM V7
Objectif : rendre "Ajouter au panier" immédiatement visible
et clairement prioritaire, sans casser l'esthétique luxe.
========================================================= */
/* CTA principal */
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > a.button,
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > .button,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > a.button,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > .button,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > a.button,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > .button {
position: static !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 10px !important;
width: auto !important;
min-width: 205px !important;
max-width: none !important;
height: 46px !important;
min-height: 46px !important;
max-height: 46px !important;
margin: 6px 0 10px !important;
padding: 0 22px !important;
border: 1px solid #c9a227 !important;
border-radius: 12px !important;
background: #c9a227 !important;
color: #fff !important;
box-shadow:
0 7px 18px rgba(169,133,22,.20),
0 2px 6px rgba(0,0,0,.06) !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
transform: none !important;
font-size: 11px !important;
line-height: 1 !important;
font-weight: 800 !important;
letter-spacing: .055em !important;
text-transform: uppercase !important;
text-indent: 0 !important;
transition:
background .18s ease,
border-color .18s ease,
box-shadow .18s ease,
filter .18s ease !important;
}
/* Icône panier blanche */
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > .button::before,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > .button::before,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > .button::before {
content: "" !important;
display: block !important;
width: 18px !important;
height: 18px !important;
flex: 0 0 18px !important;
filter: none !important;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H7'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: contain !important;
}
/* Hover : plus profond, mais aucun déplacement */
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:hover,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:hover,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:hover {
background: #b68f18 !important;
border-color: #b68f18 !important;
box-shadow:
0 9px 22px rgba(169,133,22,.26),
0 3px 8px rgba(0,0,0,.07) !important;
filter: brightness(.99) !important;
transform: none !important;
}
/* Click : feedback de pression très léger */
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:active,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:active,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:active {
background: #a98516 !important;
border-color: #a98516 !important;
transform: scale(.985) !important;
}
/* Focus clavier visible et propre */
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:focus-visible,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:focus-visible,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > .button:focus-visible {
outline: 3px solid rgba(201,162,39,.22) !important;
outline-offset: 3px !important;
}
/* Mobile/tablette : CTA plus large et facile à toucher */
@media (max-width: 900px) {
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > .button,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > .button,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > .button {
min-width: 180px !important;
height: 44px !important;
min-height: 44px !important;
max-height: 44px !important;
padding: 0 18px !important;
font-size: 10px !important;
}
}
@media (max-width: 560px) {
body.woocommerce-shop .orilom-shop-products.orilom-grid-1 ul.products li.product > .button,
body.tax-product_cat .orilom-shop-products.orilom-grid-1 ul.products li.product > .button,
body.tax-product_tag .orilom-shop-products.orilom-grid-1 ul.products li.product > .button {
min-width: 0 !important;
width: 100% !important;
max-width: 220px !important;
height: 42px !important;
min-height: 42px !important;
max-height: 42px !important;
padding: 0 14px !important;
font-size: 9.5px !important;
}
}
/* =========================================================
ORILOM — FILTRES AVANCÉS V1
Inspiration UX : sidebar à accordéons, recherche,
compteurs, voir plus, drawer mobile.
========================================================= */
.orilom-shop-layout {
grid-template-columns: 250px minmax(0, 1fr) !important;
gap: 30px !important;
}
.orilom-shop-sidebar {
padding: 0 !important;
overflow: hidden !important;
border: 1px solid #e6e6e3 !important;
border-radius: 16px !important;
background: #fff !important;
}
.orilom-filter-heading {
min-height: 60px !important;
padding: 0 17px !important;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 10px !important;
border-bottom: 1px solid #ececea !important;
}
.orilom-filter-title-wrap {
display: flex !important;
align-items: center !important;
gap: 8px !important;
}
.orilom-filter-title-wrap > span {
font-size: 16px !important;
line-height: 1 !important;
font-weight: 800 !important;
color: #111 !important;
}
.orilom-filter-count {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 21px !important;
height: 21px !important;
padding: 0 6px !important;
border-radius: 999px !important;
background: #c9a227 !important;
color: #fff !important;
font-size: 10px !important;
font-weight: 800 !important;
}
.orilom-filter-reset,
.orilom-filter-reset-bottom {
color: #777 !important;
font-size: 9px !important;
font-weight: 700 !important;
letter-spacing: .02em !important;
text-decoration: underline !important;
text-underline-offset: 3px !important;
}
.orilom-filters-form {
display: block !important;
}
.orilom-filter-accordion {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-bottom: 1px solid #ececea !important;
background: #fff !important;
}
.orilom-filter-accordion > summary {
list-style: none !important;
cursor: pointer !important;
min-height: 54px !important;
padding: 0 17px !important;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 12px !important;
user-select: none !important;
}
.orilom-filter-accordion > summary::-webkit-details-marker {
display: none !important;
}
.orilom-filter-accordion > summary > span {
color: #181818 !important;
font-size: 11px !important;
line-height: 1.2 !important;
font-weight: 800 !important;
letter-spacing: .055em !important;
text-transform: uppercase !important;
}
.orilom-filter-accordion > summary > i {
width: 18px !important;
height: 18px !important;
position: relative !important;
flex: 0 0 18px !important;
}
.orilom-filter-accordion > summary > i::before,
.orilom-filter-accordion > summary > i::after {
content: "" !important;
position: absolute !important;
top: 50% !important;
left: 50% !important;
width: 10px !important;
height: 1px !important;
background: #222 !important;
transform: translate(-50%, -50%) !important;
transition: transform .18s ease !important;
}
.orilom-filter-accordion:not([open]) > summary > i::after {
transform: translate(-50%, -50%) rotate(90deg) !important;
}
.orilom-filter-accordion-body {
padding: 0 17px 17px !important;
}
.orilom-price-live {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 8px !important;
margin-bottom: 13px !important;
color: #555 !important;
font-size: 10px !important;
}
.orilom-price-live strong {
color: #111 !important;
font-size: 11px !important;
}
.orilom-filter-checkbox {
min-height: 34px !important;
margin: 0 !important;
display: grid !important;
grid-template-columns: 18px minmax(0, 1fr) auto !important;
align-items: center !important;
gap: 9px !important;
cursor: pointer !important;
}
.orilom-filter-checkbox input[type="checkbox"] {
appearance: none !important;
-webkit-appearance: none !important;
width: 16px !important;
height: 16px !important;
margin: 0 !important;
border: 1px solid #bdbdb8 !important;
border-radius: 4px !important;
background: #fff !important;
cursor: pointer !important;
position: relative !important;
}
.orilom-filter-checkbox input[type="checkbox"]:checked {
border-color: #111 !important;
background: #111 !important;
}
.orilom-filter-checkbox input[type="checkbox"]:checked::after {
content: "" !important;
position: absolute !important;
left: 4px !important;
top: 1px !important;
width: 5px !important;
height: 9px !important;
border: solid #fff !important;
border-width: 0 2px 2px 0 !important;
transform: rotate(45deg) !important;
}
.orilom-filter-checkbox > span {
color: #333 !important;
font-size: 11px !important;
line-height: 1.3 !important;
}
.orilom-filter-checkbox > small {
color: #999 !important;
font-size: 9px !important;
font-weight: 500 !important;
}
.orilom-filter-search-wrap {
height: 38px !important;
margin: 0 0 10px !important;
padding: 0 10px !important;
display: flex !important;
align-items: center !important;
gap: 8px !important;
border: 1px solid #dededb !important;
border-radius: 8px !important;
background: #fff !important;
}
.orilom-filter-search-wrap > span {
width: 14px !important;
height: 14px !important;
flex: 0 0 14px !important;
background:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E")
center / contain no-repeat !important;
}
.orilom-filter-search {
width: 100% !important;
min-width: 0 !important;
border: 0 !important;
outline: 0 !important;
padding: 0 !important;
background: transparent !important;
color: #222 !important;
font-size: 10px !important;
}
.orilom-filter-option:nth-child(n+8) {
display: none !important;
}
.orilom-filter-options.is-expanded .orilom-filter-option {
display: grid !important;
}
.orilom-filter-option[hidden] {
display: none !important;
}
.orilom-filter-more {
margin-top: 8px !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
color: #111 !important;
font-size: 10px !important;
font-weight: 800 !important;
text-decoration: underline !important;
text-underline-offset: 3px !important;
cursor: pointer !important;
}
.orilom-filter-actions {
position: sticky !important;
bottom: 0 !important;
z-index: 5 !important;
padding: 14px 16px 16px !important;
background: rgba(255,255,255,.97) !important;
border-top: 1px solid #ececea !important;
backdrop-filter: blur(8px) !important;
}
.orilom-filter-submit {
width: 100% !important;
min-height: 45px !important;
margin: 0 !important;
border: 1px solid #111 !important;
border-radius: 9px !important;
background: #111 !important;
color: #fff !important;
font-size: 10px !important;
font-weight: 800 !important;
letter-spacing: .04em !important;
text-transform: uppercase !important;
cursor: pointer !important;
transition: background .18s ease, transform .18s ease !important;
}
.orilom-filter-submit:hover {
background: #c9a227 !important;
border-color: #c9a227 !important;
}
.orilom-filter-submit:active {
transform: scale(.985) !important;
}
.orilom-filter-reset-bottom {
display: block !important;
margin-top: 10px !important;
text-align: center !important;
}
.orilom-mobile-filter-open,
.orilom-mobile-filter-close,
.orilom-filter-overlay {
display: none !important;
}
/* Mobile : drawer façon grand e-commerce */
@media (max-width: 900px) {
.orilom-mobile-filter-open {
position: sticky !important;
top: 0 !important;
z-index: 70 !important;
width: calc(100% - 36px) !important;
min-height: 44px !important;
margin: 12px 18px 8px !important;
padding: 0 14px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
border: 1px solid #d8d8d5 !important;
border-radius: 10px !important;
background: rgba(255,255,255,.97) !important;
color: #111 !important;
box-shadow: 0 4px 14px rgba(0,0,0,.05) !important;
font-size: 11px !important;
font-weight: 800 !important;
text-transform: uppercase !important;
}
.orilom-mobile-filter-open strong {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 20px !important;
height: 20px !important;
padding: 0 5px !important;
border-radius: 999px !important;
background: #c9a227 !important;
color: #fff !important;
font-size: 9px !important;
}
.orilom-filter-icon {
width: 16px !important;
height: 16px !important;
background:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M4 6h16M7 12h10M10 18h4'/%3E%3C/svg%3E")
center / contain no-repeat !important;
}
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout {
display: block !important;
}
.orilom-shop-sidebar {
position: fixed !important;
top: 0 !important;
left: 0 !important;
bottom: 0 !important;
z-index: 1002 !important;
width: min(88vw, 360px) !important;
height: 100dvh !important;
margin: 0 !important;
border-radius: 0 16px 16px 0 !important;
overflow-y: auto !important;
overscroll-behavior: contain !important;
transform: translateX(-105%) !important;
transition: transform .25s ease !important;
box-shadow: 18px 0 50px rgba(0,0,0,.18) !important;
}
body.orilom-filters-open {
overflow: hidden !important;
}
body.orilom-filters-open .orilom-shop-sidebar {
transform: translateX(0) !important;
}
.orilom-mobile-filter-close {
position: relative !important;
display: block !important;
width: 34px !important;
height: 34px !important;
flex: 0 0 34px !important;
border: 0 !important;
border-radius: 50% !important;
background: #f5f5f3 !important;
cursor: pointer !important;
}
.orilom-mobile-filter-close::before,
.orilom-mobile-filter-close::after {
content: "" !important;
position: absolute !important;
top: 50% !important;
left: 50% !important;
width: 13px !important;
height: 1.5px !important;
background: #111 !important;
}
.orilom-mobile-filter-close::before {
transform: translate(-50%, -50%) rotate(45deg) !important;
}
.orilom-mobile-filter-close::after {
transform: translate(-50%, -50%) rotate(-45deg) !important;
}
.orilom-filter-overlay {
position: fixed !important;
inset: 0 !important;
z-index: 1001 !important;
display: block !important;
border: 0 !important;
background: rgba(0,0,0,.38) !important;
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
transition: opacity .22s ease, visibility .22s ease !important;
}
body.orilom-filters-open .orilom-filter-overlay {
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
}
}
/* =========================================================
ORILOM — AJAX MICRO-INTERACTIONS V1
Aucun reload : loading, succès et toast sans layout shift.
========================================================= */
.orilom-shop-products .add_to_cart_button.is-ajax-loading,
.orilom-wishlist-button.is-ajax-loading {
cursor: wait !important;
pointer-events: none !important;
}
/* Panier : garde exactement la même géométrie pendant la requête. */
.orilom-shop-products .add_to_cart_button.is-ajax-loading {
opacity: .78 !important;
}
/* Petite rotation de l'icône panier, sans changer la taille du bouton. */
.orilom-shop-products .add_to_cart_button.is-ajax-loading::before {
animation: orilomAjaxSpin .75s linear infinite !important;
}
/* Wishlist : le coeur reste en place et pulse très légèrement. */
.orilom-wishlist-button.is-ajax-loading::before {
animation: orilomAjaxPulse .7s ease-in-out infinite alternate !important;
}
/* Confirmation brève sans déplacement. */
.orilom-shop-products .add_to_cart_button.is-ajax-success {
box-shadow:
0 0 0 4px rgba(201,162,39,.12),
0 10px 26px rgba(169,133,22,.18) !important;
}
.orilom-wishlist-button.is-ajax-success {
box-shadow:
0 0 0 4px rgba(201,162,39,.10),
0 7px 20px rgba(0,0,0,.10) !important;
}
/* Toast global */
.orilom-action-toast {
position: fixed !important;
right: 24px !important;
bottom: 24px !important;
z-index: 99999 !important;
max-width: min(360px, calc(100vw - 32px)) !important;
min-height: 48px !important;
display: flex !important;
align-items: center !important;
padding: 12px 16px 12px 42px !important;
border: 1px solid rgba(17,17,17,.10) !important;
border-radius: 13px !important;
background: rgba(255,255,255,.97) !important;
color: #161616 !important;
box-shadow:
0 16px 40px rgba(0,0,0,.14),
0 4px 12px rgba(0,0,0,.06) !important;
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important;
font-size: 12px !important;
line-height: 1.35 !important;
font-weight: 700 !important;
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
transform: translateY(10px) !important;
transition:
opacity .2s ease,
transform .2s ease,
visibility .2s ease !important;
}
.orilom-action-toast::before {
content: "✓" !important;
position: absolute !important;
left: 15px !important;
top: 50% !important;
width: 19px !important;
height: 19px !important;
display: grid !important;
place-items: center !important;
border-radius: 50% !important;
background: #c9a227 !important;
color: #fff !important;
font-size: 11px !important;
font-weight: 900 !important;
transform: translateY(-50%) !important;
}
.orilom-action-toast.is-error::before {
content: "!" !important;
background: #8f2f2f !important;
}
.orilom-action-toast.is-visible {
opacity: 1 !important;
visibility: visible !important;
transform: translateY(0) !important;
}
@keyframes orilomAjaxSpin {
to {
transform: rotate(360deg);
}
}
@keyframes orilomAjaxPulse {
from {
transform: scale(.86);
opacity: .55;
}
to {
transform: scale(1);
opacity: 1;
}
}
@media (max-width: 700px) {
.orilom-action-toast {
right: 16px !important;
bottom: 16px !important;
left: 16px !important;
max-width: none !important;
}
}
@media (prefers-reduced-motion: reduce) {
.orilom-shop-products .add_to_cart_button.is-ajax-loading::before,
.orilom-wishlist-button.is-ajax-loading::before {
animation: none !important;
}
.orilom-action-toast {
transition: opacity .1s ease !important;
transform: none !important;
}
}
/* =========================================================
ORILOM — SHOP CARDS HOME STYLE V3 SAFE
Scope strict: uniquement la grille produits du catalogue.
Aucun overflow global, aucun text-indent hors écran.
========================================================= */
.orilom-shop-products > ul.products,
.orilom-shop-products > ul.products.columns-2,
.orilom-shop-products > ul.products.columns-3,
.orilom-shop-products > ul.products.columns-4,
.orilom-shop-products > ul.products.columns-5,
.orilom-shop-products > ul.products.columns-6 {
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr)) !important;
gap:34px 20px !important;
width:100% !important;
max-width:100% !important;
margin-left:0 !important;
margin-right:0 !important;
padding-left:0 !important;
padding-right:0 !important;
}
.orilom-shop-products > ul.products::before,
.orilom-shop-products > ul.products::after {display:none !important;content:none !important;}
.orilom-shop-products > ul.products > li.product {
position:relative !important;
width:100% !important;
min-width:0 !important;
max-width:100% !important;
float:none !important;
margin:0 !important;
padding:0 0 6px !important;
overflow:visible !important;
background:#fff !important;
border:0 !important;
border-radius:0 !important;
box-shadow:none !important;
text-align:left !important;
}
.orilom-shop-products > ul.products > li.product a.woocommerce-LoopProduct-link,
.orilom-shop-products > ul.products > li.product a.woocommerce-loop-product__link {
display:block !important;
min-width:0 !important;
max-width:100% !important;
}
.orilom-shop-products > ul.products > li.product a img {
display:block !important;
width:100% !important;
max-width:100% !important;
height:auto !important;
aspect-ratio:1/1 !important;
object-fit:contain !important;
margin:0 0 13px !important;
background:#f8f8f7 !important;
transition:transform .24s ease,filter .24s ease !important;
}
.orilom-shop-products > ul.products > li.product:hover a img {
transform:scale(1.018) !important;
filter:brightness(.985) !important;
}
.orilom-shop-products > ul.products > li.product .woocommerce-loop-product__title {
min-height:0 !important;
margin:0 !important;
padding:0 !important;
color:#111 !important;
font:700 11px/1.45 Arial,sans-serif !important;
text-transform:uppercase !important;
text-align:left !important;
}
.orilom-shop-products > ul.products > li.product .price {
display:flex !important;
align-items:center !important;
justify-content:flex-start !important;
gap:5px !important;
margin:7px 0 5px !important;
color:#111 !important;
font:800 11px/1.2 Arial,sans-serif !important;
text-align:left !important;
}
.orilom-shop-products > ul.products > li.product .price del {color:#929292 !important;font-weight:500 !important;opacity:1 !important;}
.orilom-shop-products > ul.products > li.product .price ins {color:#111 !important;font-weight:800 !important;text-decoration:none !important;}
.orilom-shop-products > ul.products > li.product .orilom-loop-description {display:none !important;}
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button {
position:absolute !important;
z-index:12 !important;
top:11px !important;
right:11px !important;
left:auto !important;
bottom:auto !important;
display:grid !important;
place-items:center !important;
width:34px !important;min-width:34px !important;max-width:34px !important;
height:34px !important;min-height:34px !important;max-height:34px !important;
margin:0 !important;padding:0 !important;
border:1px solid #eee !important;
border-radius:50% !important;
background:#fff !important;
color:transparent !important;
font-size:0 !important;
line-height:0 !important;
overflow:hidden !important;
white-space:nowrap !important;
box-shadow:0 5px 16px rgba(0,0,0,.12) !important;
transform:none !important;
}
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button::before {
content:"♥" !important;
position:static !important;
display:block !important;
width:auto !important;height:auto !important;
color:#d2ad25 !important;
background:none !important;border:0 !important;
font-family:Arial,sans-serif !important;
font-size:17px !important;line-height:1 !important;
}
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button::after {display:none !important;content:none !important;}
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button:hover,
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button:focus-visible {
transform:scale(1.08) !important;
border-color:#ddc36a !important;
box-shadow:0 7px 20px rgba(0,0,0,.16) !important;
outline:none !important;
}
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button.is-active {background:#fffaf0 !important;border-color:#d5b33d !important;}
/* Le bouton WooCommerce devient uniquement l'icône panier ronde. */
.orilom-shop-products > ul.products > li.product > a.button,
.orilom-shop-products > ul.products > li.product > .button {
position:absolute !important;
z-index:11 !important;
top:42% !important;
left:50% !important;
right:auto !important;
bottom:auto !important;
display:block !important;
width:54px !important;min-width:54px !important;max-width:54px !important;
height:54px !important;min-height:54px !important;max-height:54px !important;
margin:0 !important;padding:0 !important;
border:1px solid rgba(181,138,42,.22) !important;
border-radius:50% !important;
background-color:#fffdf6 !important;
background-repeat:no-repeat !important;
background-position:center !important;
background-size:22px 22px !important;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.5 11h10.5l2-8H6'/%3E%3C/svg%3E") !important;
color:transparent !important;
font-size:0 !important;
line-height:0 !important;
overflow:hidden !important;
white-space:nowrap !important;
opacity:0 !important;
visibility:hidden !important;
transform:translate(-50%,-42%) scale(.88) !important;
box-shadow:0 8px 22px rgba(0,0,0,.13) !important;
transition:opacity .18s ease,visibility .18s ease,transform .18s ease,box-shadow .18s ease,background-color .18s ease !important;
}
.orilom-shop-products > ul.products > li.product:hover > a.button,
.orilom-shop-products > ul.products > li.product:hover > .button,
.orilom-shop-products > ul.products > li.product > a.button:focus-visible,
.orilom-shop-products > ul.products > li.product > .button:focus-visible {
opacity:1 !important;
visibility:visible !important;
transform:translate(-50%,-42%) scale(1) !important;
box-shadow:0 10px 26px rgba(0,0,0,.16),0 0 0 9px rgba(213,179,61,.10) !important;
}
.orilom-shop-products > ul.products > li.product > a.button:hover,
.orilom-shop-products > ul.products > li.product > .button:hover {
background-color:#fff6cf !important;
transform:translate(-50%,-42%) scale(1.08) !important;
}
.orilom-shop-products > ul.products > li.product .added_to_cart {display:none !important;}
.orilom-shop-products > ul.products > li.product .onsale {
position:absolute !important;
z-index:10 !important;
top:11px !important;
left:11px !important;
right:auto !important;
min-width:0 !important;min-height:0 !important;
width:auto !important;height:auto !important;
margin:0 !important;padding:6px 9px !important;
border:0 !important;border-radius:999px !important;
background:#d7b547 !important;
color:#111 !important;
font:800 9px/1 Arial,sans-serif !important;
text-transform:uppercase !important;
box-shadow:none !important;
}
@media (max-width:1100px){
.orilom-shop-products > ul.products,
.orilom-shop-products > ul.products.columns-2,
.orilom-shop-products > ul.products.columns-3,
.orilom-shop-products > ul.products.columns-4,
.orilom-shop-products > ul.products.columns-5,
.orilom-shop-products > ul.products.columns-6 {grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media (max-width:780px){
.orilom-shop-products > ul.products,
.orilom-shop-products > ul.products.columns-2,
.orilom-shop-products > ul.products.columns-3,
.orilom-shop-products > ul.products.columns-4,
.orilom-shop-products > ul.products.columns-5,
.orilom-shop-products > ul.products.columns-6 {grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:28px 12px !important;}
.orilom-shop-products > ul.products > li.product > a.button,
.orilom-shop-products > ul.products > li.product > .button {
width:46px !important;min-width:46px !important;max-width:46px !important;
height:46px !important;min-height:46px !important;max-height:46px !important;
opacity:1 !important;visibility:visible !important;
transform:translate(-50%,-42%) scale(1) !important;
background-size:19px 19px !important;
}
}
@media (max-width:480px){.orilom-shop-products > ul.products > li.product .woocommerce-loop-product__title{font-size:10px !important;}}
@media (hover:none){
.orilom-shop-products > ul.products > li.product > a.button,
.orilom-shop-products > ul.products > li.product > .button {opacity:1 !important;visibility:visible !important;}
}
/* =========================================================
ORILOM — BARRE JAUNE CATALOGUE
Même proportions / comportement que la barre Mon compte.
========================================================= */
body.woocommerce-shop .orilom-shop-breadcrumb-bar,
body.tax-product_cat .orilom-shop-breadcrumb-bar,
body.tax-product_tag .orilom-shop-breadcrumb-bar,
body.search.post-type-archive-product .orilom-shop-breadcrumb-bar,
body.search.woocommerce .orilom-shop-breadcrumb-bar{
width:100%!important;
max-width:none!important;
min-height:0!important;
margin:0!important;
padding:21px max(3vw,calc((100vw - 1320px)/2))!important;
display:flex!important;
align-items:center!important;
gap:12px!important;
background:var(--lux-gold,#dfb913)!important;
color:#4a3a00!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:12px!important;
line-height:1!important;
}
.orilom-shop-breadcrumb-left{
display:flex!important;
align-items:center!important;
gap:12px!important;
min-width:0!important;
}
.orilom-shop-breadcrumb-link{
display:inline-flex!important;
align-items:center!important;
min-height:0!important;
margin:0!important;
padding:0!important;
color:#4a3a00!important;
background:transparent!important;
border:0!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:12px!important;
line-height:1!important;
font-weight:400!important;
text-decoration:none!important;
white-space:nowrap!important;
transition:color .15s ease!important;
}
a.orilom-shop-breadcrumb-link:hover{
color:#111!important;
}
.orilom-shop-breadcrumb-link.is-current{
color:#3f3100!important;
font-weight:600!important;
max-width:min(38vw,420px)!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.orilom-shop-breadcrumb-chevron{
display:inline-flex!important;
align-items:center!important;
color:#6d5700!important;
font-size:12px!important;
line-height:1!important;
font-weight:400!important;
}
.orilom-shop-bar-meta{
margin-left:auto!important;
color:#4a3a00!important;
font-size:12px!important;
line-height:1!important;
font-weight:400!important;
white-space:nowrap!important;
}
/* La zone catalogue commence directement sous la barre. */
.orilom-shop-breadcrumb-bar + .orilom-mobile-filter-open{
margin-top:0!important;
}
@media(max-width:900px){
body.woocommerce-shop .orilom-shop-breadcrumb-bar,
body.tax-product_cat .orilom-shop-breadcrumb-bar,
body.tax-product_tag .orilom-shop-breadcrumb-bar,
body.search.post-type-archive-product .orilom-shop-breadcrumb-bar,
body.search.woocommerce .orilom-shop-breadcrumb-bar{
padding:16px 22px!important;
font-size:11px!important;
}
.orilom-shop-breadcrumb-link,
.orilom-shop-bar-meta{
font-size:11px!important;
}
}
@media(max-width:650px){
body.woocommerce-shop .orilom-shop-breadcrumb-bar,
body.tax-product_cat .orilom-shop-breadcrumb-bar,
body.tax-product_tag .orilom-shop-breadcrumb-bar,
body.search.post-type-archive-product .orilom-shop-breadcrumb-bar,
body.search.woocommerce .orilom-shop-breadcrumb-bar{
padding:14px 18px!important;
gap:8px!important;
}
.orilom-shop-breadcrumb-left{
gap:8px!important;
overflow-x:auto!important;
scrollbar-width:none!important;
}
.orilom-shop-breadcrumb-left::-webkit-scrollbar{
display:none!important;
}
.orilom-shop-bar-meta{
display:none!important;
}
.orilom-shop-breadcrumb-link{
font-size:10px!important;
}
.orilom-shop-breadcrumb-link.is-current{
max-width:none!important;
overflow:visible!important;
text-overflow:clip!important;
}
}
/* ======================================================================
ORILOM — SHOP FILTER & SORT UI V2 PREMIUM
Final override: clean sidebar, floating price values, explicit sort arrow.
====================================================================== */
/* ---------- Desktop layout / sidebar proportions ---------- */
@media (min-width: 901px) {
body.woocommerce-shop .orilom-shop-layout,
body.tax-product_cat .orilom-shop-layout,
body.tax-product_tag .orilom-shop-layout,
body.search.woocommerce .orilom-shop-layout {
grid-template-columns: 258px minmax(0,1fr) !important;
gap: 34px !important;
align-items: start !important;
}
.orilom-shop-sidebar {
position: sticky !important;
top: 26px !important;
}
}
/* ---------- Sidebar shell ---------- */
.orilom-shop-sidebar {
overflow: hidden !important;
padding: 0 !important;
background: #fff !important;
border: 1px solid #e8e6df !important;
border-radius: 12px !important;
box-shadow: 0 10px 30px rgba(17,17,17,.045) !important;
}
.orilom-filter-heading {
min-height: 66px !important;
padding: 0 18px !important;
background: #fff !important;
border-bottom: 1px solid #ece9e1 !important;
}
.orilom-filter-title-wrap > span {
font-size: 17px !important;
font-weight: 800 !important;
letter-spacing: -.015em !important;
}
.orilom-filter-reset,
.orilom-filter-reset-bottom {
color: #777 !important;
font-size: 8.5px !important;
font-weight: 700 !important;
letter-spacing: .03em !important;
text-transform: uppercase !important;
text-decoration: underline !important;
text-underline-offset: 3px !important;
}
/* ---------- Accordions ---------- */
.orilom-filter-accordion {
background: #fff !important;
border-bottom: 1px solid #ece9e1 !important;
}
.orilom-filter-accordion > summary {
min-height: 58px !important;
padding: 0 18px !important;
}
.orilom-filter-accordion > summary > span {
color: #191919 !important;
font-size: 10.5px !important;
font-weight: 850 !important;
letter-spacing: .075em !important;
}
.orilom-filter-accordion > summary > i {
width: 16px !important;
height: 16px !important;
}
.orilom-filter-accordion-body {
padding: 1px 18px 19px !important;
}
/* ---------- Price filter ---------- */
/* Old static text remains useful/accessibile but visually subtle. */
.orilom-price-live {
margin: 0 0 22px !important;
color: #777 !important;
font-size: 9px !important;
}
.orilom-price-live strong {
color: #222 !important;
font-size: 10px !important;
font-weight: 750 !important;
}
.orilom-price-slider {
position: relative !important;
height: 42px !important;
margin: 7px 5px 4px !important;
overflow: visible !important;
}
/* Base rail */
.orilom-slider-track,
.orilom-slider-progress {
position: absolute !important;
top: 25px !important;
height: 4px !important;
border-radius: 999px !important;
}
.orilom-slider-track {
left: 0 !important;
right: 0 !important;
background: #d8d8d4 !important;
}
.orilom-slider-progress {
background: #111 !important;
z-index: 2 !important;
}
/* Floating values above each handle, like a proper commerce range control */
.orilom-price-bubble {
position: absolute !important;
top: 0 !important;
z-index: 8 !important;
transform: translateX(-50%) !important;
min-width: max-content !important;
padding: 2px 4px !important;
background: #111 !important;
color: #fff !important;
border-radius: 2px !important;
font: 800 8px/1.15 Arial,Helvetica,sans-serif !important;
letter-spacing: 0 !important;
white-space: nowrap !important;
pointer-events: none !important;
}
.orilom-price-bubble::after {
content: "" !important;
position: absolute !important;
left: 50% !important;
bottom: -3px !important;
width: 6px !important;
height: 6px !important;
background: #111 !important;
transform: translateX(-50%) rotate(45deg) !important;
}
/* Keep edge bubbles inside the card */
.orilom-price-bubble-min {
transform: translateX(-10%) !important;
}
.orilom-price-bubble-max {
transform: translateX(-90%) !important;
}
/* Native range layers */
.orilom-price-slider input[type="range"] {
top: 14px !important;
height: 28px !important;
background: transparent !important;
}
/* Hide browser rail so the custom rail is always clean */
.orilom-price-slider input[type="range"]::-webkit-slider-runnable-track {
height: 4px !important;
background: transparent !important;
border: 0 !important;
}
.orilom-price-slider input[type="range"]::-moz-range-track {
height: 4px !important;
background: transparent !important;
border: 0 !important;
}
.orilom-price-slider input[type="range"]::-moz-range-progress {
background: transparent !important;
}
/* Handles */
.orilom-price-slider input[type="range"]::-webkit-slider-thumb {
appearance: none !important;
-webkit-appearance: none !important;
width: 17px !important;
height: 17px !important;
margin-top: -6.5px !important;
border: 2px solid #111 !important;
border-radius: 50% !important;
background: #fff !important;
box-shadow: 0 1px 4px rgba(0,0,0,.13) !important;
cursor: grab !important;
}
.orilom-price-slider input[type="range"]::-moz-range-thumb {
width: 17px !important;
height: 17px !important;
border: 2px solid #111 !important;
border-radius: 50% !important;
background: #fff !important;
box-shadow: 0 1px 4px rgba(0,0,0,.13) !important;
cursor: grab !important;
}
.orilom-price-slider input[type="range"]:active::-webkit-slider-thumb {
cursor: grabbing !important;
transform: scale(1.06) !important;
}
.orilom-price-slider input[type="range"]:active::-moz-range-thumb {
cursor: grabbing !important;
}
/* Min / max scale */
.orilom-price-scale {
margin-top: 3px !important;
color: #9a9a95 !important;
font-size: 8px !important;
font-weight: 500 !important;
}
/* ---------- Checkbox rows ---------- */
.orilom-filter-checkbox {
min-height: 38px !important;
gap: 10px !important;
}
.orilom-filter-checkbox input[type="checkbox"] {
width: 17px !important;
height: 17px !important;
border-radius: 4px !important;
border-color: #c9c8c2 !important;
}
.orilom-filter-checkbox > span {
color: #333 !important;
font-size: 10.5px !important;
}
.orilom-filter-checkbox > small {
color: #999 !important;
font-size: 8.5px !important;
}
/* ---------- Filter actions ---------- */
.orilom-filter-actions {
position: static !important;
padding: 15px 17px 16px !important;
background: #faf9f6 !important;
border-top: 1px solid #ece9e1 !important;
backdrop-filter: none !important;
}
/* Requested: white, standard, premium CTA */
.orilom-filter-submit {
min-height: 44px !important;
border: 1px solid #1a1a1a !important;
border-radius: 7px !important;
background: #fff !important;
color: #111 !important;
box-shadow: 0 2px 8px rgba(0,0,0,.025) !important;
font-size: 9.5px !important;
font-weight: 850 !important;
letter-spacing: .045em !important;
}
.orilom-filter-submit:hover {
background: #111 !important;
color: #fff !important;
border-color: #111 !important;
transform: translateY(-1px) !important;
}
.orilom-filter-submit:active {
transform: translateY(0) scale(.99) !important;
}
.orilom-filter-reset-bottom {
margin-top: 11px !important;
color: #888 !important;
text-transform: none !important;
}
/* ---------- Sorting dropdown ---------- */
.orilom-shop-products > .woocommerce-ordering,
.orilom-shop-products .woocommerce-ordering {
position: relative !important;
min-width: 196px !important;
}
/* Label */
.orilom-shop-products > .woocommerce-ordering::before,
.orilom-shop-products .woocommerce-ordering::before {
content: "Trier par" !important;
position: absolute !important;
left: 2px !important;
top: -16px !important;
z-index: 2 !important;
color: #8b8b87 !important;
font-size: 8px !important;
font-weight: 750 !important;
line-height: 1 !important;
letter-spacing: .09em !important;
text-transform: uppercase !important;
pointer-events: none !important;
}
/* Explicit chevron: does not depend on native browser select rendering */
.orilom-shop-products > .woocommerce-ordering::after,
.orilom-shop-products .woocommerce-ordering::after {
content: "" !important;
position: absolute !important;
right: 16px !important;
top: 50% !important;
z-index: 5 !important;
width: 7px !important;
height: 7px !important;
margin-top: -5px !important;
border-right: 1.7px solid #111 !important;
border-bottom: 1.7px solid #111 !important;
transform: rotate(45deg) !important;
pointer-events: none !important;
}
.orilom-shop-products > .woocommerce-ordering select,
.orilom-shop-products .woocommerce-ordering select {
appearance: none !important;
-webkit-appearance: none !important;
width: 100% !important;
min-width: 196px !important;
height: 44px !important;
padding: 0 43px 0 15px !important;
border: 1px solid #d8d8d3 !important;
border-radius: 9px !important;
background: #fff !important;
background-image: none !important;
color: #171717 !important;
font-size: 11px !important;
font-weight: 650 !important;
cursor: pointer !important;
outline: none !important;
box-shadow: 0 2px 9px rgba(0,0,0,.025) !important;
transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease !important;
}
.orilom-shop-products > .woocommerce-ordering select:hover,
.orilom-shop-products .woocommerce-ordering select:hover {
border-color: #aaa9a3 !important;
background-color: #fcfcfb !important;
}
.orilom-shop-products > .woocommerce-ordering select:focus,
.orilom-shop-products .woocommerce-ordering select:focus {
border-color: #111 !important;
box-shadow: 0 0 0 3px rgba(17,17,17,.055) !important;
}
/* ---------- Mobile cleanup ---------- */
@media (max-width: 900px) {
.orilom-shop-sidebar {
border-radius: 0 14px 14px 0 !important;
}
.orilom-filter-actions {
position: sticky !important;
bottom: 0 !important;
z-index: 5 !important;
background: rgba(250,249,246,.98) !important;
backdrop-filter: blur(8px) !important;
}
.orilom-shop-products > .woocommerce-ordering,
.orilom-shop-products .woocommerce-ordering {
min-width: 0 !important;
}
.orilom-price-bubble {
font-size: 7.5px !important;
}
}
/* =========================================================
ORILOM — PAGINATION CATALOGUE : POSITION FINALE
IMPORTANT : la pagination est déjà générée APRÈS ul.products
par WooCommerce. Le catalogue ORILOM étant une CSS Grid,
une pagination sans grid-row explicite était auto-placée
dans la première cellule libre (ancien grand vide en haut).
On la verrouille donc dans la ligne située APRÈS les produits.
========================================================= */
.orilom-shop-products > nav.woocommerce-pagination,
.orilom-shop-products > .woocommerce-pagination {
grid-column: 1 / -1 !important;
grid-row: 5 !important;
justify-self: stretch !important;
align-self: start !important;
position: static !important;
inset: auto !important;
transform: none !important;
width: 100% !important;
clear: both !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin: 52px 0 28px !important;
padding: 0 !important;
border: 0 !important;
}
.orilom-shop-products > nav.woocommerce-pagination ul.page-numbers,
.orilom-shop-products > .woocommerce-pagination ul.page-numbers {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
flex-wrap: wrap !important;
gap: 7px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
}
.orilom-shop-products > nav.woocommerce-pagination ul.page-numbers > li,
.orilom-shop-products > .woocommerce-pagination ul.page-numbers > li {
float: none !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
}
.orilom-shop-products > nav.woocommerce-pagination .page-numbers li > a,
.orilom-shop-products > nav.woocommerce-pagination .page-numbers li > span,
.orilom-shop-products > .woocommerce-pagination .page-numbers li > a,
.orilom-shop-products > .woocommerce-pagination .page-numbers li > span {
width: 44px !important;
min-width: 44px !important;
height: 44px !important;
padding: 0 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
border: 1px solid #dedede !important;
border-radius: 8px !important;
background: #fff !important;
color: #111 !important;
font-size: 12px !important;
line-height: 1 !important;
font-weight: 700 !important;
text-decoration: none !important;
box-shadow: 0 2px 8px rgba(0,0,0,.035) !important;
transition: background-color .18s ease,
color .18s ease,
border-color .18s ease,
box-shadow .18s ease,
transform .18s ease !important;
}
.orilom-shop-products > nav.woocommerce-pagination .page-numbers .current,
.orilom-shop-products > .woocommerce-pagination .page-numbers .current {
background: var(--lux-gold, #dfb913) !important;
border-color: var(--lux-gold, #dfb913) !important;
color: #111 !important;
box-shadow: 0 6px 16px rgba(223,185,19,.20) !important;
}
.orilom-shop-products > nav.woocommerce-pagination .page-numbers a:hover,
.orilom-shop-products > .woocommerce-pagination .page-numbers a:hover {
background: #111 !important;
border-color: #111 !important;
color: #fff !important;
transform: translateY(-1px) !important;
box-shadow: 0 7px 18px rgba(0,0,0,.11) !important;
}
/* Intro -> toolbar : aucune zone fantôme réservée à la pagination. */
.orilom-shop-products > .woocommerce-notices-wrapper:empty {
display: none !important;
margin: 0 !important;
padding: 0 !important;
}
/* Mobile : le catalogue repasse en block, la pagination reste naturellement après les produits. */
@media (max-width: 900px) {
.orilom-shop-products > nav.woocommerce-pagination,
.orilom-shop-products > .woocommerce-pagination {
grid-row: auto !important;
margin: 40px 0 22px !important;
}
}
@media (max-width: 520px) {
.orilom-shop-products > nav.woocommerce-pagination ul.page-numbers,
.orilom-shop-products > .woocommerce-pagination ul.page-numbers {
gap: 5px !important;
}
.orilom-shop-products > nav.woocommerce-pagination .page-numbers li > a,
.orilom-shop-products > nav.woocommerce-pagination .page-numbers li > span,
.orilom-shop-products > .woocommerce-pagination .page-numbers li > a,
.orilom-shop-products > .woocommerce-pagination .page-numbers li > span {
width: 40px !important;
min-width: 40px !important;
height: 40px !important;
font-size: 11px !important;
}
}
/* ======================================================================
ORILOM — WISHLIST HEART TRUE CENTER FIX V46
Le caractère texte "♥" dépend de la baseline de la police et paraît
légèrement décalé dans un cercle. On utilise un SVG 24x24 centré
géométriquement, sans métriques typographiques.
====================================================================== */
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button,
body.single-product .related .orilom-shop-products > ul.products > li.product .orilom-wishlist-button {
display:flex !important;
align-items:center !important;
justify-content:center !important;
padding:0 !important;
text-indent:0 !important;
line-height:0 !important;
}
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button::before,
body.single-product .related .orilom-shop-products > ul.products > li.product .orilom-wishlist-button::before {
content:"" !important;
position:static !important;
inset:auto !important;
display:block !important;
flex:0 0 18px !important;
width:18px !important;
min-width:18px !important;
max-width:18px !important;
height:18px !important;
min-height:18px !important;
max-height:18px !important;
margin:0 !important;
padding:0 !important;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23c9a227' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
background-repeat:no-repeat !important;
background-position:50% 50% !important;
background-size:18px 18px !important;
color:transparent !important;
border:0 !important;
font-size:0 !important;
line-height:0 !important;
text-indent:0 !important;
transform:none !important;
}
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button.is-active::before,
body.single-product .related .orilom-shop-products > ul.products > li.product .orilom-wishlist-button.is-active::before {
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23d2ad25' stroke='%23d2ad25' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
@media(max-width:600px){
.orilom-shop-products > ul.products > li.product .orilom-wishlist-button::before,
body.single-product .related .orilom-shop-products > ul.products > li.product .orilom-wishlist-button::before{
width:17px !important;
min-width:17px !important;
max-width:17px !important;
height:17px !important;
min-height:17px !important;
max-height:17px !important;
flex-basis:17px !important;
background-size:17px 17px !important;
}
}
/* ======================================================================
ORILOM — SHOP + RELATED WISHLIST STRICTLY IDENTICAL V47
Source visuelle unique :
- Boutique
- catégories/tags produit
- Related Products sur fiche produit
Important : le coeur est positionné ABSOLUMENT au centre du cercle.
Il ne dépend donc ni du texte caché du bouton, ni de la baseline,
ni de flex/grid, ni d'un ancien style single-product.
====================================================================== */
/* 1) Le même cercle EXACT dans Shop et Related */
body.woocommerce-shop .orilom-shop-products ul.products li.product .orilom-wishlist-button,
body.tax-product_cat .orilom-shop-products ul.products li.product .orilom-wishlist-button,
body.tax-product_tag .orilom-shop-products ul.products li.product .orilom-wishlist-button,
body.single-product .related.products ul.products li.product .orilom-wishlist-button,
body.single-product section.related.products ul.products li.product .orilom-wishlist-button {
position:absolute !important;
z-index:12 !important;
top:11px !important;
right:11px !important;
left:auto !important;
bottom:auto !important;
display:block !important;
width:34px !important;
min-width:34px !important;
max-width:34px !important;
height:34px !important;
min-height:34px !important;
max-height:34px !important;
margin:0 !important;
padding:0 !important;
overflow:hidden !important;
border:1px solid #eeeeee !important;
border-radius:50% !important;
background:#ffffff !important;
color:transparent !important;
font-size:0 !important;
line-height:0 !important;
text-indent:-9999px !important;
white-space:nowrap !important;
box-shadow:0 5px 16px rgba(0,0,0,.12) !important;
transform:none !important;
}
/* 2) Coeur vide : même SVG + centrage mathématique */
body.woocommerce-shop .orilom-shop-products ul.products li.product .orilom-wishlist-button::before,
body.tax-product_cat .orilom-shop-products ul.products li.product .orilom-wishlist-button::before,
body.tax-product_tag .orilom-shop-products ul.products li.product .orilom-wishlist-button::before,
body.single-product .related.products ul.products li.product .orilom-wishlist-button::before,
body.single-product section.related.products ul.products li.product .orilom-wishlist-button::before {
content:"" !important;
position:absolute !important;
top:50% !important;
left:50% !important;
right:auto !important;
bottom:auto !important;
display:block !important;
width:18px !important;
height:18px !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23c9a227' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
background-repeat:no-repeat !important;
background-position:center !important;
background-size:18px 18px !important;
color:transparent !important;
font-size:0 !important;
line-height:0 !important;
text-indent:0 !important;
transform:translate(-50%,-50%) !important;
}
/* 3) Coeur actif : même géométrie, uniquement fill/stroke changent */
body.woocommerce-shop .orilom-shop-products ul.products li.product .orilom-wishlist-button.is-active::before,
body.tax-product_cat .orilom-shop-products ul.products li.product .orilom-wishlist-button.is-active::before,
body.tax-product_tag .orilom-shop-products ul.products li.product .orilom-wishlist-button.is-active::before,
body.single-product .related.products ul.products li.product .orilom-wishlist-button.is-active::before,
body.single-product section.related.products ul.products li.product .orilom-wishlist-button.is-active::before {
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23d2ad25' stroke='%23d2ad25' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E") !important;
}
/* 4) Même état actif du cercle */
body.woocommerce-shop .orilom-shop-products ul.products li.product .orilom-wishlist-button.is-active,
body.tax-product_cat .orilom-shop-products ul.products li.product .orilom-wishlist-button.is-active,
body.tax-product_tag .orilom-shop-products ul.products li.product .orilom-wishlist-button.is-active,
body.single-product .related.products ul.products li.product .orilom-wishlist-button.is-active,
body.single-product section.related.products ul.products li.product .orilom-wishlist-button.is-active {
background:#ffffff !important;
border-color:#eeeeee !important;
}
/* 5) Même hover */
body.woocommerce-shop .orilom-shop-products ul.products li.product .orilom-wishlist-button:hover,
body.tax-product_cat .orilom-shop-products ul.products li.product .orilom-wishlist-button:hover,
body.tax-product_tag .orilom-shop-products ul.products li.product .orilom-wishlist-button:hover,
body.single-product .related.products ul.products li.product .orilom-wishlist-button:hover,
body.single-product section.related.products ul.products li.product .orilom-wishlist-button:hover,
body.woocommerce-shop .orilom-shop-products ul.products li.product .orilom-wishlist-button:focus-visible,
body.single-product .related.products ul.products li.product .orilom-wishlist-button:focus-visible {
border-color:#ddc36a !important;
box-shadow:0 7px 20px rgba(0,0,0,.16) !important;
transform:scale(1.08) !important;
outline:none !important;
}
/* 6) Neutralise définitivement les pseudo-éléments concurrents */
body.woocommerce-shop .orilom-shop-products ul.products li.product .orilom-wishlist-button::after,
body.tax-product_cat .orilom-shop-products ul.products li.product .orilom-wishlist-button::after,
body.tax-product_tag .orilom-shop-products ul.products li.product .orilom-wishlist-button::after,
body.single-product .related.products ul.products li.product .orilom-wishlist-button::after,
body.single-product section.related.products ul.products li.product .orilom-wishlist-button::after {
content:none !important;
display:none !important;
}
/* =========================================================
ORILOM — HERO HOME CLEAN FINAL
Retire le fond beige/gradient et tout voile superposé.
L'image choisie dans WordPress reste prioritaire si elle
est injectée en background-image par le thème/Customizer.
========================================================= */
body.home .lux-home-v5 .lux-hero{
background-color:#fff !important;
background-repeat:no-repeat !important;
background-size:cover !important;
background-position:center center !important;
filter:none !important;
}
body.home .lux-home-v5 .lux-hero.has-image{
background-color:transparent !important;
}
body.home .lux-home-v5 .lux-hero::before,
body.home .lux-home-v5 .lux-hero::after{
content:none !important;
display:none !important;
background:none !important;
opacity:0 !important;
}
/* =========================================================
ORILOM — AMBIANCE SONORE NOBLE V2
========================================================= */
#orilom-sound-toggle{
position:fixed !important;
left:22px !important;
bottom:22px !important;
z-index:99999 !important;
min-width:46px !important;
height:46px !important;
padding:0 15px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:8px !important;
border:1px solid rgba(17,17,17,.14) !important;
border-radius:999px !important;
background:rgba(255,255,255,.96) !important;
color:#111 !important;
font-family:inherit !important;
font-size:11px !important;
font-weight:700 !important;
letter-spacing:.08em !important;
text-transform:uppercase !important;
box-shadow:0 8px 28px rgba(0,0,0,.12) !important;
backdrop-filter:blur(10px);
-webkit-backdrop-filter:blur(10px);
cursor:pointer !important;
opacity:1 !important;
visibility:visible !important;
transition:
transform .2s ease,
background-color .2s ease,
border-color .2s ease,
box-shadow .2s ease !important;
}
#orilom-sound-toggle:hover{
transform:translateY(-2px) !important;
border-color:rgba(17,17,17,.28) !important;
box-shadow:0 12px 34px rgba(0,0,0,.16) !important;
}
#orilom-sound-toggle .orilom-sound-icon{
width:18px !important;
height:18px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
flex:0 0 18px !important;
font-family:Georgia, "Times New Roman", serif !important;
font-size:18px !important;
line-height:1 !important;
font-weight:400 !important;
letter-spacing:0 !important;
text-transform:none !important;
}
#orilom-sound-toggle.is-playing{
background:#111 !important;
color:#fff !important;
border-color:#111 !important;
}
#orilom-sound-toggle.has-audio-error{
opacity:.55 !important;
}
@media(max-width:767px){
#orilom-sound-toggle{
left:14px !important;
bottom:14px !important;
min-width:44px !important;
height:44px !important;
padding:0 12px !important;
}
#orilom-sound-toggle .orilom-sound-label{
display:none !important;
}
}
@media(prefers-reduced-motion:reduce){
#orilom-sound-toggle{
transition:none !important;
}
}
/* =========================================================
ORILOM — MASQUER LE BOUTON AMBIANCE
Le lecteur audio reste actif, seul le bouton est caché.
========================================================= */
#orilom-sound-toggle{
display:none !important;
}
/* =========================================================
ORILOM — NEWSLETTER FOOTER V1
CSS uniquement : aucun PHP / aucun JS ici.
========================================================= */
.orilom-guide-newsletter{
width:100%;
}
.orilom-guide-newsletter-form{
position:relative;
}
.orilom-guide-newsletter-form input[type="email"]{
transition:
border-color .18s ease,
box-shadow .18s ease,
background-color .18s ease;
}
.orilom-guide-newsletter-form input[type="email"]:focus{
outline:none !important;
border-color:#e5bd00 !important;
box-shadow:0 0 0 2px rgba(229,189,0,.12) !important;
}
.orilom-guide-newsletter-form button{
transition:
opacity .18s ease,
background-color .18s ease,
color .18s ease;
}
.orilom-guide-newsletter-form button:disabled,
.orilom-guide-newsletter-form button.is-loading{
opacity:.62 !important;
cursor:wait !important;
pointer-events:none !important;
}
.orilom-newsletter-message{
width:100%;
min-height:18px;
margin-top:9px;
font-size:10px;
line-height:1.45;
font-weight:700;
letter-spacing:.01em;
}
.orilom-newsletter-message.is-success{
color:#e5bd00;
}
.orilom-newsletter-message.is-error{
color:#ff7777;
}
@media(max-width:767px){
.orilom-newsletter-message{
margin-top:8px;
font-size:10px;
}
}
/* =========================================================
ORILOM — NEWSLETTER + PANIER CODE PROMO V4
CSS SITE UNIQUEMENT
========================================================= */
.orilom-guide-newsletter-form button:disabled,
.orilom-guide-newsletter-form button.is-loading{
opacity:.62 !important;
cursor:wait !important;
pointer-events:none !important;
}
.orilom-newsletter-message{
grid-column:1 / -1 !important;
width:100% !important;
min-height:18px;
margin-top:9px;
font-size:10px;
line-height:1.45;
font-weight:700;
}
.orilom-newsletter-message:empty{
min-height:0;
margin-top:0;
}
.orilom-newsletter-message.is-success{
color:#d8b300 !important;
}
.orilom-newsletter-message.is-error{
color:#ff7b7b !important;
}
/* ---------- Panier : bloc coupon premium ---------- */
body.woocommerce-cart
table.shop_table.cart
td.actions
.coupon.orilom-cart-coupon-box{
display:grid !important;
grid-template-columns:minmax(220px,1fr) auto !important;
gap:10px !important;
align-items:end !important;
width:min(560px,100%) !important;
padding:18px !important;
background:#fbfaf6 !important;
border:1px solid #e9e4d7 !important;
border-left:3px solid #d8b300 !important;
border-radius:8px !important;
}
body.woocommerce-cart
.orilom-cart-coupon-intro{
grid-column:1 / -1 !important;
display:flex !important;
flex-direction:column !important;
gap:4px !important;
margin-bottom:3px !important;
text-align:left !important;
}
body.woocommerce-cart
.orilom-cart-coupon-intro > span{
color:#a28612 !important;
font-size:9px !important;
line-height:1.2 !important;
font-weight:900 !important;
letter-spacing:.16em !important;
}
body.woocommerce-cart
.orilom-cart-coupon-intro > strong{
color:#111 !important;
font-family:Georgia,"Times New Roman",serif !important;
font-size:18px !important;
line-height:1.2 !important;
font-weight:700 !important;
}
body.woocommerce-cart
.orilom-cart-coupon-intro > small{
color:#777 !important;
font-size:10px !important;
line-height:1.45 !important;
}
body.woocommerce-cart
.orilom-cart-coupon-box #coupon_code{
width:100% !important;
min-width:0 !important;
height:44px !important;
margin:0 !important;
padding:0 13px !important;
background:#fff !important;
color:#111 !important;
border:1px solid #d8d3c7 !important;
border-radius:5px !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
body.woocommerce-cart
.orilom-cart-coupon-box #coupon_code:focus{
border-color:#d8b300 !important;
box-shadow:0 0 0 3px rgba(216,179,0,.10) !important;
outline:none !important;
}
body.woocommerce-cart
.orilom-cart-coupon-box button[name="apply_coupon"],
body.woocommerce-cart
.orilom-cart-coupon-box input[name="apply_coupon"]{
min-width:120px !important;
height:44px !important;
margin:0 !important;
padding:0 18px !important;
background:#111 !important;
color:#fff !important;
border:1px solid #111 !important;
border-radius:5px !important;
font-size:9px !important;
line-height:1 !important;
font-weight:900 !important;
letter-spacing:.12em !important;
}
body.woocommerce-cart
.orilom-cart-coupon-box button[name="apply_coupon"]:hover,
body.woocommerce-cart
.orilom-cart-coupon-box input[name="apply_coupon"]:hover{
background:#d8b300 !important;
color:#111 !important;
border-color:#d8b300 !important;
}
/* Remise appliquée dans le total : plus visible */
body.woocommerce-cart
.cart_totals
tr.cart-discount th,
body.woocommerce-cart
.cart_totals
tr.cart-discount td{
color:#8b7411 !important;
font-weight:800 !important;
}
@media(max-width:680px){
body.woocommerce-cart
table.shop_table.cart
td.actions
.coupon.orilom-cart-coupon-box{
grid-template-columns:1fr !important;
padding:15px !important;
}
body.woocommerce-cart
.orilom-cart-coupon-box button[name="apply_coupon"],
body.woocommerce-cart
.orilom-cart-coupon-box input[name="apply_coupon"]{
width:100% !important;
}
.orilom-newsletter-message{
text-align:center !important;
}
}
/* =========================================================
ORILOM — PANIER : SUPPRIMER UNIQUEMENT LE BLANC AVANT FOOTER
Corrige la bande blanche entre le pré-footer noir et le footer.
========================================================= */
body.woocommerce-cart .site-footer{
margin-top:0 !important;
}
body.woocommerce-cart .orilom-global-footer + .site-footer{
margin-top:0 !important;
}
/* ======================================================================
ORILOM PRODUCT MEDIA V11 — HOVER ZOOM + IMAGE COPY DETERRENCE
Version 5.1.2
- Native WooCommerce hover zoom remains the zoom engine.
- Cursor/transition improve the desktop affordance.
- Images cannot be dragged/selected through normal browser interactions.
IMPORTANT: client-side protection is a deterrent, not DRM. A browser that
can display an image necessarily receives the image file.
====================================================================== */
/* Product-gallery hover affordance. The actual magnification is handled by
WooCommerce's native jquery.zoom so FlexSlider/PhotoSwipe remain intact. */
@media (hover:hover) and (pointer:fine){
body.single-product div.product div.images .woocommerce-product-gallery__image > a{
cursor:zoom-in!important;
}
body.single-product div.product div.images .woocommerce-product-gallery__image img:not(.zoomImg){
transition:filter .18s ease!important;
will-change:auto!important;
}
body.single-product div.product div.images .woocommerce-product-gallery__image:hover img:not(.zoomImg){
filter:contrast(1.015)!important;
}
}
/* Normal-user copy/drag deterrence on ALL ORILOM site images. */
html img{
-webkit-user-drag:none!important;
-webkit-user-select:none!important;
-moz-user-select:none!important;
user-select:none!important;
-webkit-touch-callout:none!important;
}
/* Keep native product zoom image functional and invisible to drag/select. */
body.single-product img.zoomImg{
-webkit-user-drag:none!important;
-webkit-user-select:none!important;
user-select:none!important;
-webkit-touch-callout:none!important;
}
/* ======================================================================
ORILOM PRODUCT MEDIA V12 — STABLE CENTER HOVER + PREMIUM LIGHTBOX
2026-09-06
WHY:
- WooCommerce jquery.zoom injects img.zoomImg and pans it with the pointer.
On the current ORILOM layout that layer can appear as a moving/cropped strip.
- Keep WooCommerce gallery/PhotoSwipe, but visually replace the moving hover
zoom with a stable centered CSS zoom and restyle the lightbox.
====================================================================== */
/* ---------- 1) PRODUCT IMAGE: STABLE, CENTERED HOVER ZOOM ---------- */
@media (hover:hover) and (pointer:fine){
body.single-product div.product div.images .woocommerce-product-gallery__image > a{
cursor:zoom-in!important;
overflow:hidden!important;
}
/* Disable ONLY the moving jquery.zoom visual layer.
WooCommerce lightbox and slider remain untouched. */
body.single-product div.product div.images img.zoomImg{
display:none!important;
visibility:hidden!important;
opacity:0!important;
pointer-events:none!important;
}
/* Real product image stays centered and simply scales in place. */
body.single-product div.product div.images .woocommerce-product-gallery__image img:not(.zoomImg){
transform:scale(1)!important;
transform-origin:50% 50%!important;
object-position:center center!important;
transition:transform .36s cubic-bezier(.22,.61,.36,1), filter .20s ease!important;
will-change:transform!important;
filter:none!important;
}
body.single-product div.product div.images .woocommerce-product-gallery__image:hover img:not(.zoomImg){
transform:scale(1.085)!important;
filter:none!important;
}
}
/* Mobile/tablet: no hover transform, native touch interaction stays clean. */
@media (hover:none), (pointer:coarse){
body.single-product div.product div.images img.zoomImg{
display:none!important;
}
body.single-product div.product div.images .woocommerce-product-gallery__image img:not(.zoomImg){
transform:none!important;
}
}
/* Premium affordance for the gallery magnifier button. */
body.single-product div.product div.images .woocommerce-product-gallery__trigger{
width:44px!important;
height:44px!important;
top:14px!important;
right:14px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
background:rgba(255,255,255,.96)!important;
border:1px solid rgba(17,17,17,.09)!important;
border-radius:14px!important;
box-shadow:0 10px 30px rgba(17,17,17,.10)!important;
backdrop-filter:blur(10px)!important;
-webkit-backdrop-filter:blur(10px)!important;
transition:transform .20s ease, box-shadow .20s ease, border-color .20s ease!important;
}
body.single-product div.product div.images .woocommerce-product-gallery__trigger:hover{
transform:translateY(-2px)!important;
border-color:rgba(216,179,0,.55)!important;
box-shadow:0 14px 36px rgba(17,17,17,.14)!important;
}
/* ---------- 2) PHOTOSWIPE: PREMIUM ORILOM FULLSCREEN EXPERIENCE ---------- */
body.single-product .pswp{
z-index:2147483000!important;
font-family:Arial,Helvetica,sans-serif!important;
}
/* Warm frosted backdrop instead of the harsh black screen. */
body.single-product .pswp__bg{
background:rgba(247,244,237,.975)!important;
backdrop-filter:blur(16px) saturate(.92)!important;
-webkit-backdrop-filter:blur(16px) saturate(.92)!important;
}
body.single-product .pswp__scroll-wrap{
background:
radial-gradient(circle at 50% 46%, rgba(229,189,0,.08), transparent 34%),
linear-gradient(135deg, rgba(255,255,255,.28), rgba(239,235,226,.18))!important;
}
/* Small luxury brand signature. */
body.single-product .pswp__scroll-wrap::before{
content:"ORILOM • APERÇU PRODUIT";
position:absolute!important;
top:24px!important;
left:28px!important;
z-index:1700!important;
pointer-events:none!important;
color:#171717!important;
font-size:10px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:.18em!important;
text-transform:uppercase!important;
opacity:.72!important;
}
/* Product image becomes a floating premium card. PhotoSwipe still controls
position and dimensions, so pinch/zoom/slide continue to work. */
body.single-product .pswp__img{
background:#fff!important;
border-radius:20px!important;
box-shadow:
0 38px 100px rgba(32,27,18,.18),
0 10px 32px rgba(32,27,18,.10)!important;
}
body.single-product .pswp__img--placeholder,
body.single-product .pswp__img--placeholder--blank{
background:#f6f2e9!important;
border-radius:20px!important;
}
/* Clean floating top controls. */
body.single-product .pswp__top-bar,
body.single-product .pswp__ui--fit .pswp__top-bar{
top:12px!important;
right:14px!important;
left:auto!important;
width:auto!important;
height:58px!important;
padding:6px!important;
display:flex!important;
align-items:center!important;
gap:7px!important;
background:rgba(255,255,255,.88)!important;
border:1px solid rgba(17,17,17,.08)!important;
border-radius:18px!important;
box-shadow:0 14px 42px rgba(17,17,17,.12)!important;
backdrop-filter:blur(16px)!important;
-webkit-backdrop-filter:blur(16px)!important;
}
body.single-product .pswp__counter{
height:44px!important;
min-width:54px!important;
padding:0 13px!important;
margin:0 2px 0 0!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
color:#171717!important;
font-size:11px!important;
line-height:1!important;
font-weight:800!important;
opacity:.68!important;
border-right:1px solid rgba(17,17,17,.08)!important;
}
/* Remove low-value share/fullscreen controls from product preview. */
body.single-product .pswp__button--share,
body.single-product .pswp__button--fs{
display:none!important;
}
/* Zoom button as a simple premium + / − control. */
body.single-product .pswp__button--zoom{
width:44px!important;
height:44px!important;
margin:0!important;
border-radius:13px!important;
background:#fff!important;
background-image:none!important;
border:1px solid rgba(17,17,17,.08)!important;
opacity:1!important;
box-shadow:none!important;
}
body.single-product .pswp__button--zoom::before{
content:"+"!important;
position:absolute!important;
inset:0!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
color:#171717!important;
font:500 27px/1 Arial,sans-serif!important;
}
body.single-product .pswp--zoomed-in .pswp__button--zoom::before{
content:"−"!important;
}
body.single-product .pswp__button--zoom:hover{
border-color:rgba(216,179,0,.60)!important;
background:#fffdf6!important;
}
/* Close button: unmistakable, elegant and easy to hit. */
body.single-product .pswp__button--close{
width:44px!important;
height:44px!important;
margin:0!important;
border-radius:13px!important;
background:#171717!important;
background-image:none!important;
opacity:1!important;
box-shadow:none!important;
}
body.single-product .pswp__button--close::before{
content:"×"!important;
position:absolute!important;
inset:0!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
color:#fff!important;
font:300 29px/1 Arial,sans-serif!important;
transform:translateY(-1px)!important;
}
body.single-product .pswp__button--close:hover{
background:#d8b300!important;
}
body.single-product .pswp__button--close:hover::before{
color:#111!important;
}
/* Previous / next become floating circular controls. */
body.single-product .pswp__button--arrow--left,
body.single-product .pswp__button--arrow--right{
width:56px!important;
height:56px!important;
margin-top:-28px!important;
top:50%!important;
border-radius:50%!important;
background:rgba(255,255,255,.94)!important;
border:1px solid rgba(17,17,17,.08)!important;
box-shadow:0 14px 40px rgba(17,17,17,.13)!important;
opacity:1!important;
backdrop-filter:blur(12px)!important;
-webkit-backdrop-filter:blur(12px)!important;
}
body.single-product .pswp__button--arrow--left{left:22px!important}
body.single-product .pswp__button--arrow--right{right:22px!important}
body.single-product .pswp__button--arrow--left::before,
body.single-product .pswp__button--arrow--right::before{
top:0!important;
left:0!important;
right:0!important;
width:100%!important;
height:100%!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
background:none!important;
color:#171717!important;
font:300 38px/1 Georgia,"Times New Roman",serif!important;
}
body.single-product .pswp__button--arrow--left::before{content:"‹"!important}
body.single-product .pswp__button--arrow--right::before{content:"›"!important}
body.single-product .pswp__button--arrow--left:hover,
body.single-product .pswp__button--arrow--right:hover{
border-color:rgba(216,179,0,.60)!important;
transform:scale(1.04)!important;
}
/* Caption, when present, becomes a discreet floating label. */
body.single-product .pswp__caption,
body.single-product .pswp__ui--fit .pswp__caption{
bottom:18px!important;
background:transparent!important;
pointer-events:none!important;
}
body.single-product .pswp__caption__center{
width:max-content!important;
max-width:min(760px,78vw)!important;
margin:0 auto!important;
padding:9px 15px!important;
color:#26231e!important;
background:rgba(255,255,255,.88)!important;
border:1px solid rgba(17,17,17,.07)!important;
border-radius:999px!important;
box-shadow:0 10px 30px rgba(17,17,17,.08)!important;
text-align:center!important;
font-size:11px!important;
line-height:1.35!important;
backdrop-filter:blur(12px)!important;
-webkit-backdrop-filter:blur(12px)!important;
}
/* Avoid the UI disappearing so aggressively on desktop. */
body.single-product .pswp__ui--idle .pswp__top-bar{
opacity:.28!important;
}
body.single-product .pswp__ui--idle .pswp__button--arrow--left,
body.single-product .pswp__ui--idle .pswp__button--arrow--right{
opacity:.22!important;
}
/* Keyboard focus remains visible. */
body.single-product .pswp button:focus-visible{
outline:3px solid rgba(216,179,0,.55)!important;
outline-offset:3px!important;
}
/* ---------- 3) MOBILE LIGHTBOX ---------- */
@media(max-width:760px){
body.single-product .pswp__scroll-wrap::before{
top:18px!important;
left:18px!important;
font-size:8px!important;
letter-spacing:.14em!important;
}
body.single-product .pswp__top-bar,
body.single-product .pswp__ui--fit .pswp__top-bar{
top:10px!important;
right:10px!important;
height:52px!important;
padding:4px!important;
border-radius:16px!important;
}
body.single-product .pswp__counter{
display:none!important;
}
body.single-product .pswp__button--zoom,
body.single-product .pswp__button--close{
width:42px!important;
height:42px!important;
border-radius:12px!important;
}
body.single-product .pswp__button--arrow--left,
body.single-product .pswp__button--arrow--right{
width:46px!important;
height:46px!important;
margin-top:-23px!important;
}
body.single-product .pswp__button--arrow--left{left:10px!important}
body.single-product .pswp__button--arrow--right{right:10px!important}
body.single-product .pswp__img{
border-radius:14px!important;
box-shadow:0 24px 70px rgba(32,27,18,.18)!important;
}
}
/* Respect reduced-motion preferences. */
@media(prefers-reduced-motion:reduce){
body.single-product div.product div.images .woocommerce-product-gallery__image img:not(.zoomImg),
body.single-product div.product div.images .woocommerce-product-gallery__trigger,
body.single-product .pswp__button--arrow--left,
body.single-product .pswp__button--arrow--right{
transition:none!important;
}
}
/* =========================================================
ORILOM — CATÉGORIES SEO / LANDING V1
H1 visible + intro courte + catalogue + contenu éditorial.
========================================================= */
body.tax-product_cat .orilom-shop-products > .page-title {
grid-column: 1 / -1 !important;
grid-row: 1 !important;
position: static !important;
width: auto !important;
height: auto !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
margin: 0 0 12px !important;
padding: 0 !important;
color: #111 !important;
font-family: Georgia, "Times New Roman", serif !important;
font-size: clamp(34px, 3.8vw, 56px) !important;
line-height: 1.06 !important;
font-weight: 500 !important;
letter-spacing: -.025em !important;
}
body.tax-product_cat .orilom-category-intro {
grid-column: 1 / -1 !important;
grid-row: 2 !important;
max-width: 900px !important;
margin: 0 0 20px !important;
padding: 0 !important;
}
body.tax-product_cat .orilom-category-intro p {
margin: 0 !important;
color: #686868 !important;
font-size: 13.5px !important;
line-height: 1.7 !important;
}
body.tax-product_cat .orilom-shop-products > .woocommerce-notices-wrapper {
grid-column: 1 / -1 !important;
grid-row: 3 !important;
}
body.tax-product_cat .orilom-shop-products > .woocommerce-result-count {
grid-column: 1 !important;
grid-row: 4 !important;
}
body.tax-product_cat .orilom-shop-products > .orilom-grid-switcher {
grid-column: 2 !important;
grid-row: 4 !important;
}
body.tax-product_cat .orilom-shop-products > .woocommerce-ordering {
grid-column: 3 !important;
grid-row: 4 !important;
}
body.tax-product_cat .orilom-shop-products > ul.products {
grid-column: 1 / -1 !important;
grid-row: 5 !important;
margin-top: 14px !important;
}
body.tax-product_cat .orilom-shop-products > nav.woocommerce-pagination,
body.tax-product_cat .orilom-shop-products > .woocommerce-pagination {
grid-column: 1 / -1 !important;
grid-row: 6 !important;
}
body.tax-product_cat .orilom-category-seo {
grid-column: 1 / -1 !important;
grid-row: 7 !important;
width: 100% !important;
max-width: 980px !important;
justify-self: center !important;
margin: 58px auto 20px !important;
padding: 40px 0 0 !important;
border-top: 1px solid #e8e8e8 !important;
color: #444 !important;
}
body.tax-product_cat .orilom-category-seo > :first-child {
margin-top: 0 !important;
}
body.tax-product_cat .orilom-category-seo h2 {
margin: 36px 0 13px !important;
color: #111 !important;
font-family: Georgia, "Times New Roman", serif !important;
font-size: clamp(24px, 2.8vw, 33px) !important;
line-height: 1.2 !important;
font-weight: 500 !important;
letter-spacing: -.015em !important;
}
body.tax-product_cat .orilom-category-seo h3 {
margin: 26px 0 9px !important;
color: #171717 !important;
font-size: 18px !important;
line-height: 1.35 !important;
font-weight: 700 !important;
}
body.tax-product_cat .orilom-category-seo p {
margin: 0 0 16px !important;
color: #555 !important;
font-size: 14px !important;
line-height: 1.8 !important;
}
body.tax-product_cat .orilom-category-seo a {
color: #111 !important;
text-decoration: underline !important;
text-underline-offset: 3px !important;
}
@media (max-width: 900px) {
body.tax-product_cat .orilom-shop-products > .page-title {
margin-bottom: 9px !important;
font-size: clamp(32px, 9.5vw, 44px) !important;
line-height: 1.08 !important;
}
body.tax-product_cat .orilom-category-intro {
margin-bottom: 18px !important;
}
body.tax-product_cat .orilom-category-intro p {
font-size: 13px !important;
line-height: 1.65 !important;
}
body.tax-product_cat .orilom-category-seo {
margin-top: 40px !important;
padding-top: 28px !important;
}
body.tax-product_cat .orilom-category-seo h2 {
margin-top: 30px !important;
font-size: 26px !important;
}
body.tax-product_cat .orilom-category-seo h3 {
font-size: 17px !important;
}
body.tax-product_cat .orilom-category-seo p {
font-size: 13.5px !important;
line-height: 1.75 !important;
}
}
/* =========================================================
ORILOM — CATÉGORIE PRODUIT : TITRE + DESCRIPTION PREMIUM V2
Override final — conserve la description WooCommerce dynamique
========================================================= */
body.tax-product_cat .orilom-shop-products > .page-title {
grid-column: 1 / -1 !important;
grid-row: 1 !important;
position: static !important;
width: auto !important;
height: auto !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
max-width: 980px !important;
margin: 0 0 14px !important;
padding: 0 !important;
color: #111 !important;
font-family: Georgia, "Times New Roman", serif !important;
font-size: clamp(38px, 3.5vw, 52px) !important;
line-height: 1.04 !important;
font-weight: 500 !important;
letter-spacing: -.03em !important;
}
body.tax-product_cat .orilom-category-intro {
grid-column: 1 / -1 !important;
grid-row: 2 !important;
width: 100% !important;
max-width: 780px !important;
margin: 0 0 24px !important;
padding: 0 !important;
color: #555 !important;
}
body.tax-product_cat .orilom-category-intro p {
max-width: 780px !important;
margin: 0 !important;
padding: 0 !important;
color: #555 !important;
font-family: Arial, Helvetica, sans-serif !important;
font-size: 14px !important;
line-height: 1.65 !important;
font-weight: 400 !important;
letter-spacing: 0 !important;
}
/* Accent ORILOM discret sous l'introduction */
body.tax-product_cat .orilom-category-intro::after {
content: "";
display: block;
width: 42px;
height: 2px;
margin-top: 17px;
background: var(--lux-gold, #dfb913);
}
/* Mobile */
@media (max-width: 900px) {
body.tax-product_cat .orilom-shop-products > .page-title {
max-width: 100% !important;
margin-bottom: 10px !important;
font-size: clamp(32px, 9vw, 42px) !important;
line-height: 1.07 !important;
letter-spacing: -.025em !important;
}
body.tax-product_cat .orilom-category-intro {
max-width: 100% !important;
margin-bottom: 20px !important;
}
body.tax-product_cat .orilom-category-intro p {
max-width: 100% !important;
font-size: 13.5px !important;
line-height: 1.65 !important;
}
body.tax-product_cat .orilom-category-intro::after {
margin-top: 14px;
}
}
/* =========================================================
ORILOM — CATEGORY HERO PREMIUM V3
Titre + description uniquement
========================================================= */
body.tax-product_cat .orilom-shop-products > .page-title {
position: relative !important;
display: block !important;
width: fit-content !important;
max-width: 100% !important;
margin: 0 0 17px !important;
padding: 0 0 12px !important;
color: #111 !important;
font-family: Georgia, "Times New Roman", serif !important;
font-size: clamp(42px, 3.5vw, 54px) !important;
font-weight: 600 !important;
line-height: .98 !important;
letter-spacing: -.035em !important;
}
body.tax-product_cat .orilom-shop-products > .page-title::after {
content: "";
position: absolute;
left: 1px;
bottom: 0;
width: 46px;
height: 3px;
background: var(--lux-gold, #dfb913);
}
body.tax-product_cat .orilom-category-intro {
position: relative !important;
width: 100% !important;
max-width: 700px !important;
margin: 0 0 28px !important;
padding: 0 !important;
}
body.tax-product_cat .orilom-category-intro p {
margin: 0 !important;
padding: 0 !important;
color: #575757 !important;
font-family: Arial, Helvetica, sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
line-height: 1.65 !important;
letter-spacing: -.005em !important;
}
body.tax-product_cat .orilom-category-intro::after {
display: none !important;
content: none !important;
}
body.tax-product_cat .woocommerce-result-count {
margin-top: 0 !important;
}
@media (max-width: 900px) {
body.tax-product_cat .orilom-shop-products > .page-title {
font-size: clamp(38px, 8vw, 48px) !important;
margin-bottom: 14px !important;
padding-bottom: 11px !important;
}
body.tax-product_cat .orilom-category-intro {
max-width: 620px !important;
margin-bottom: 24px !important;
}
body.tax-product_cat .orilom-category-intro p {
font-size: 14px !important;
line-height: 1.65 !important;
}
}
@media (max-width: 600px) {
body.tax-product_cat .orilom-shop-products > .page-title {
width: 100% !important;
font-size: 36px !important;
line-height: 1.02 !important;
margin-bottom: 13px !important;
padding-bottom: 10px !important;
}
body.tax-product_cat .orilom-shop-products > .page-title::after {
width: 38px;
height: 2px;
}
body.tax-product_cat .orilom-category-intro {
max-width: 100% !important;
margin-bottom: 22px !important;
}
body.tax-product_cat .orilom-category-intro p {
font-size: 13.5px !important;
line-height: 1.6 !important;
}
}
/* =========================================================
ORILOM — PRODUCT BRAND ARCHIVES = CATEGORY ARCHIVES V1
Harmonise /brand/* avec /categorie-produit/*
========================================================= */
/* Barre breadcrumb dorée */
body.tax-product_brand .orilom-shop-breadcrumb-bar{
width:100%!important;
max-width:none!important;
min-height:0!important;
margin:0!important;
padding:21px max(3vw,calc((100vw - 1320px)/2))!important;
display:flex!important;
align-items:center!important;
background:var(--lux-gold,#dfb913)!important;
}
/* Même structure catalogue que Boutique / Catégories */
body.tax-product_brand .orilom-shop-layout{
max-width:1500px!important;
padding:18px 3vw 76px!important;
display:grid!important;
grid-template-columns:225px minmax(0,1fr)!important;
gap:32px!important;
align-items:start!important;
}
/* Le contenu produit garde exactement la même toolbar */
body.tax-product_brand .orilom-shop-products{
display:grid!important;
grid-template-columns:minmax(0,1fr) auto auto!important;
grid-template-rows:auto auto auto auto auto!important;
column-gap:12px!important;
row-gap:0!important;
align-items:end!important;
}
/* H1 marque = H1 catégorie */
body.tax-product_brand .orilom-shop-products > .page-title{
grid-column:1 / -1!important;
grid-row:1!important;
position:relative!important;
display:block!important;
width:fit-content!important;
max-width:100%!important;
height:auto!important;
overflow:visible!important;
clip:auto!important;
white-space:normal!important;
margin:0 0 17px!important;
padding:0 0 12px!important;
color:#111!important;
font-family:Georgia,"Times New Roman",serif!important;
font-size:clamp(42px,3.5vw,54px)!important;
font-weight:600!important;
line-height:.98!important;
letter-spacing:-.035em!important;
}
body.tax-product_brand .orilom-shop-products > .page-title::after{
content:"";
position:absolute;
left:1px;
bottom:0;
width:46px;
height:3px;
background:var(--lux-gold,#dfb913);
}
/* Notices */
body.tax-product_brand .orilom-shop-products > .woocommerce-notices-wrapper{
grid-column:1 / -1!important;
grid-row:2!important;
margin:0 0 10px!important;
}
body.tax-product_brand .orilom-shop-products > .woocommerce-notices-wrapper:empty{
display:none!important;
}
/* Compteur / switcher / tri */
body.tax-product_brand .orilom-shop-products > .woocommerce-result-count{
grid-column:1!important;
grid-row:3!important;
align-self:center!important;
margin:0!important;
padding:0!important;
color:#777!important;
font-size:12px!important;
line-height:42px!important;
}
body.tax-product_brand .orilom-shop-products > .orilom-grid-switcher{
grid-column:2!important;
grid-row:3!important;
float:none!important;
align-self:center!important;
height:42px!important;
margin:0!important;
}
body.tax-product_brand .orilom-shop-products > .woocommerce-ordering{
grid-column:3!important;
grid-row:3!important;
float:none!important;
align-self:center!important;
margin:0!important;
}
body.tax-product_brand .orilom-shop-products > .woocommerce-ordering select{
height:42px!important;
min-height:42px!important;
min-width:176px!important;
border-radius:11px!important;
font-size:12px!important;
}
/* Grille produits */
body.tax-product_brand .orilom-shop-products > ul.products{
grid-column:1 / -1!important;
grid-row:4!important;
width:100%!important;
margin-top:10px!important;
padding-top:16px!important;
border-top:1px solid #ededed!important;
}
body.tax-product_brand .orilom-shop-products.orilom-grid-4 ul.products{
display:grid!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:34px 20px!important;
}
body.tax-product_brand .orilom-shop-products.orilom-grid-3 ul.products{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:36px 24px!important;
}
body.tax-product_brand .orilom-shop-products.orilom-grid-2 ul.products{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:38px 28px!important;
}
/* Très grands écrans */
@media (min-width:1450px){
body.tax-product_brand .orilom-shop-layout{
grid-template-columns:235px minmax(0,1fr)!important;
gap:38px!important;
}
}
/* Tablette */
@media (max-width:1100px) and (min-width:901px){
body.tax-product_brand .orilom-shop-layout{
grid-template-columns:205px minmax(0,1fr)!important;
gap:24px!important;
padding-left:24px!important;
padding-right:24px!important;
}
}
/* Mobile */
@media (max-width:900px){
body.tax-product_brand .orilom-shop-layout{
display:block!important;
padding:14px 18px 56px!important;
}
body.tax-product_brand .orilom-shop-products{
display:block!important;
}
body.tax-product_brand .orilom-shop-products > .page-title{
width:100%!important;
font-size:clamp(38px,8vw,48px)!important;
margin-bottom:14px!important;
padding-bottom:11px!important;
}
body.tax-product_brand .orilom-shop-products > .woocommerce-result-count{
margin:0 0 12px!important;
line-height:1.4!important;
}
body.tax-product_brand .orilom-shop-products > .woocommerce-ordering{
width:100%!important;
margin:0 0 14px!important;
}
body.tax-product_brand .orilom-shop-products > .woocommerce-ordering select{
width:100%!important;
min-width:0!important;
}
body.tax-product_brand .orilom-shop-products > ul.products{
margin-top:0!important;
padding-top:14px!important;
}
body.tax-product_brand .orilom-shop-products.orilom-grid-4 ul.products,
body.tax-product_brand .orilom-shop-products.orilom-grid-3 ul.products{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
}
@media (max-width:520px){
body.tax-product_brand .orilom-shop-products.orilom-grid-4 ul.products,
body.tax-product_brand .orilom-shop-products.orilom-grid-3 ul.products,
body.tax-product_brand .orilom-shop-products.orilom-grid-2 ul.products{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:10px!important;
}
}
/* =========================================================
ORILOM — RESPONSIVE NAVBAR FINAL FIX V5
2026-09-11
Source of truth for header layout on all viewport widths.
========================================================= */
/* The legacy header had a fixed 84px height: this breaks any 2-row layout. */
body .site-header.lux-header{
height:auto !important;
min-height:0 !important;
overflow:visible !important;
}
body.admin-bar .site-header.lux-header{top:32px !important;}
/* Explicit placement prevents CSS-grid auto-flow from moving search/actions. */
body .lux-header .menu-toggle{grid-area:menu;}
body .lux-header .lux-brand{grid-area:brand; min-width:0 !important;}
body .lux-header .orilom-collections-menu{grid-area:collections;}
body .lux-header .lux-search{grid-area:search; min-width:0 !important;}
body .lux-header .header-tools{grid-area:tools;}
/* Large desktop: 4 aligned functional zones. */
@media(min-width:1101px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand collections search tools" !important;
grid-template-columns:190px 165px minmax(300px,1fr) 250px !important;
align-items:center !important;
}
body .lux-header .menu-toggle{display:none !important;}
body .lux-header .lux-brand{justify-self:start !important;}
body .lux-header .header-tools{justify-self:end !important;}
}
/* Compact desktop / landscape tablet: remove collections before compressing search. */
@media(min-width:1001px) and (max-width:1100px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand search tools" !important;
grid-template-columns:170px minmax(260px,1fr) auto !important;
min-height:76px !important;
padding:11px 18px !important;
gap:12px !important;
}
body .lux-header .menu-toggle{display:none !important;}
body .lux-header .orilom-collections-menu{display:none !important;}
body .lux-header .lux-brand{justify-self:start !important;}
body .lux-header .header-tools{justify-self:end !important;}
}
/* Tablet + mobile: predictable 2-row app bar. */
@media(max-width:1000px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
width:100% !important;
max-width:none !important;
min-height:0 !important;
padding:10px 16px 12px !important;
display:grid !important;
grid-template-areas:
"menu brand tools"
"search search search" !important;
grid-template-columns:44px minmax(0,1fr) auto !important;
grid-template-rows:auto auto !important;
column-gap:10px !important;
row-gap:10px !important;
align-items:center !important;
}
body .lux-header .orilom-collections-menu{display:none !important;}
body .lux-header .menu-toggle{
display:flex !important;
justify-self:start !important;
align-items:center !important;
justify-content:center !important;
width:42px !important;
min-width:42px !important;
height:42px !important;
padding:0 !important;
border:1px solid #e6e6e2 !important;
border-radius:10px !important;
background:#fff !important;
color:#151515 !important;
}
body .lux-header .menu-toggle svg{
width:20px !important;
height:20px !important;
fill:none !important;
stroke:currentColor !important;
stroke-width:1.8 !important;
stroke-linecap:round !important;
}
body .lux-header .lux-brand{
justify-self:center !important;
align-self:center !important;
text-align:center !important;
}
body .lux-header .lux-brand .custom-logo{
display:block !important;
width:auto !important;
max-width:145px !important;
max-height:48px !important;
margin:0 auto !important;
}
body .lux-header .header-tools{
width:auto !important;
min-width:0 !important;
max-width:none !important;
justify-self:end !important;
display:grid !important;
grid-template-columns:repeat(3,40px) !important;
gap:2px !important;
}
body .lux-header .header-tools > a.orilom-header-action,
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link,
body .lux-header .header-tools > .orilom-account-action{
width:40px !important;
min-width:40px !important;
max-width:40px !important;
height:40px !important;
min-height:40px !important;
padding:0 !important;
border-radius:9px !important;
}
body .lux-header .orilom-header-action-label{display:none !important;}
body .lux-header .lux-search{
width:100% !important;
height:46px !important;
min-height:46px !important;
grid-template-columns:130px minmax(0,1fr) 46px !important;
border-radius:10px !important;
}
body .lux-header .lux-search select.orilom-header-category,
body .lux-header .lux-search .orilom-live-search-wrap,
body .lux-header .lux-search .orilom-live-search-input,
body .lux-header .lux-search .orilom-search-submit{
height:44px !important;
min-height:44px !important;
}
body .lux-header .lux-search .orilom-search-submit{
width:46px !important;
min-width:46px !important;
}
/* Mobile navigation becomes a clean full-width dropdown below the app bar. */
body .site-header.lux-header .main-nav.lux-nav{
display:none !important;
position:absolute !important;
top:100% !important;
left:0 !important;
right:0 !important;
width:100% !important;
transform:none !important;
z-index:9999 !important;
max-height:calc(100vh - 150px) !important;
overflow-y:auto !important;
padding:10px 16px 16px !important;
border-top:1px solid #ecece8 !important;
border-bottom:1px solid #deded9 !important;
background:#fff !important;
box-shadow:0 18px 34px rgba(0,0,0,.12) !important;
}
body .site-header.lux-header .main-nav.lux-nav.open{
display:block !important;
}
body .site-header.lux-header .main-nav.lux-nav ul{
display:flex !important;
flex-direction:column !important;
align-items:stretch !important;
min-height:0 !important;
gap:0 !important;
margin:0 !important;
padding:0 !important;
}
body .site-header.lux-header .main-nav.lux-nav li{
width:100% !important;
margin:0 !important;
border-bottom:1px solid #f0f0ed !important;
}
body .site-header.lux-header .main-nav.lux-nav li:last-child{
border-bottom:0 !important;
}
body .site-header.lux-header .main-nav.lux-nav a{
display:flex !important;
align-items:center !important;
min-height:48px !important;
width:100% !important;
padding:12px 4px !important;
font-size:11px !important;
line-height:1.35 !important;
letter-spacing:.045em !important;
}
body .site-header.lux-header .main-nav.lux-nav a::after{display:none !important;}
}
@media(max-width:782px){
body.admin-bar .site-header.lux-header{top:46px !important;}
}
@media(max-width:600px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
padding-left:12px !important;
padding-right:12px !important;
column-gap:7px !important;
}
body .lux-header .lux-brand .custom-logo{
max-width:128px !important;
max-height:44px !important;
}
body .lux-header .lux-brand strong{font-size:22px !important;}
body .lux-header .lux-search{
grid-template-columns:minmax(0,1fr) 46px !important;
}
body .lux-header .lux-search select.orilom-header-category{display:none !important;}
}
@media(max-width:520px){
/* Keep cart + favourites, which are the highest-value shopping actions. */
body .lux-header .header-tools{
grid-template-columns:repeat(2,40px) !important;
}
body .lux-header .header-tools > .orilom-account-action{display:none !important;}
}
@media(max-width:380px){
body .site-header.lux-header .lux-header-main,
body.logged-in .site-header.lux-header .lux-header-main,
body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:40px minmax(0,1fr) auto !important;
padding-left:9px !important;
padding-right:9px !important;
column-gap:5px !important;
}
body .lux-header .menu-toggle{
width:38px !important;
min-width:38px !important;
height:38px !important;
}
body .lux-header .lux-brand .custom-logo{max-width:112px !important;}
body .lux-header .header-tools{
grid-template-columns:repeat(2,36px) !important;
gap:0 !important;
}
body .lux-header .header-tools > a.wishlist-link,
body .lux-header .header-tools > a.cart-link{
width:36px !important;
min-width:36px !important;
max-width:36px !important;
}
}
/* ==========================================================================
ORILOM — FIX FINAL IMAGES PRODUITS BOUTIQUE / ACCUEIL
Objectif : toujours afficher le flacon complet, sans coupe, avec respiration
Standard source conseillé : 1200x1200 WebP, produit ~82–86% du canvas
========================================================================== */
/* Accueil + Boutique + catégories + tags + blocs WooCommerce */
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product a img,
html body.home .woocommerce ul.products li.product a img,
html body.woocommerce-shop ul.products li.product a img.wp-post-image,
html body.woocommerce-shop ul.products li.product a img.attachment-woocommerce_thumbnail,
html body.post-type-archive-product ul.products li.product a img.wp-post-image,
html body.post-type-archive-product ul.products li.product a img.attachment-woocommerce_thumbnail,
html body.tax-product_cat ul.products li.product a img.wp-post-image,
html body.tax-product_cat ul.products li.product a img.attachment-woocommerce_thumbnail,
html body.tax-product_tag ul.products li.product a img.wp-post-image,
html body.tax-product_tag ul.products li.product a img.attachment-woocommerce_thumbnail,
html body .orilom-shop-products > ul.products > li.product a img {
display: block !important;
width: 100% !important;
max-width: 100% !important;
height: auto !important;
aspect-ratio: 1 / 1 !important;
object-fit: contain !important;
object-position: center center !important;
box-sizing: border-box !important;
padding: 16px !important;
margin: 0 0 13px !important;
background: #f8f8f7 !important;
}
/* Evite qu'un zoom hover donne l'impression de couper le bouchon ou la base */
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product:hover a img,
html body.home .woocommerce ul.products li.product:hover a img,
html body.woocommerce-shop ul.products li.product:hover a img,
html body.post-type-archive-product ul.products li.product:hover a img,
html body.tax-product_cat ul.products li.product:hover a img,
html body.tax-product_tag ul.products li.product:hover a img,
html body .orilom-shop-products > ul.products > li.product:hover a img {
transform: none !important;
}
/* Tablette : garde une marge visuelle suffisante */
@media (max-width: 1000px) {
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product a img,
html body.home .woocommerce ul.products li.product a img,
html body.woocommerce-shop ul.products li.product a img,
html body.post-type-archive-product ul.products li.product a img,
html body.tax-product_cat ul.products li.product a img,
html body.tax-product_tag ul.products li.product a img,
html body .orilom-shop-products > ul.products > li.product a img {
padding: 14px !important;
}
}
/* Mobile : un peu moins de padding pour conserver une bonne taille de produit */
@media (max-width: 600px) {
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product a img,
html body.home .woocommerce ul.products li.product a img,
html body.woocommerce-shop ul.products li.product a img,
html body.post-type-archive-product ul.products li.product a img,
html body.tax-product_cat ul.products li.product a img,
html body.tax-product_tag ul.products li.product a img,
html body .orilom-shop-products > ul.products > li.product a img {
padding: 10px !important;
}
}
/* Très petits écrans */
@media (max-width: 380px) {
html body.home .lux-home-v5 .lux-product-section .woocommerce ul.products li.product a img,
html body.home .woocommerce ul.products li.product a img,
html body.woocommerce-shop ul.products li.product a img,
html body.post-type-archive-product ul.products li.product a img,
html body.tax-product_cat ul.products li.product a img,
html body.tax-product_tag ul.products li.product a img,
html body .orilom-shop-products > ul.products > li.product a img {
padding: 8px !important;
}
}
/* =========================================================
ORILOM — PROGRAMME FIDÉLITÉ V2 SAFE
Compact UI : carte Gold + Sillage Coins + sections pliables.
Styles strictement scopés au programme fidélité.
========================================================= */
.orilom-dashboard-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.orilom-dashboard-stat-loyalty{background:linear-gradient(145deg,#fffdf7,#f7f0dc);border-color:#e7d8ab!important}
.orilom-dashboard-stat-loyalty .orilom-dashboard-stat-icon{background:#111;color:#d8b34f}
.orilom-dashboard-stat-loyalty .orilom-dashboard-stat-link{color:#806517}
.orilom-loyalty-page{--ol-black:#11110f;--ol-gold:#cda53a;--ol-gold2:#f0d47a;--ol-cream:#fbf8ef;--ol-line:#e7e0cf;--ol-muted:#756f64;display:grid;gap:14px;color:var(--ol-black)}
.orilom-loyalty-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding:6px 2px 4px}
.orilom-loyalty-heading>div>span,.orilom-reward-strip-head span{display:block;color:#8a6b17;font-size:9px;font-weight:900;letter-spacing:.16em;margin-bottom:5px}
.orilom-loyalty-heading h2{margin:0;font:700 28px/1.08 Georgia,serif;letter-spacing:-.02em}
.orilom-loyalty-heading p{margin:8px 0 0;max-width:680px;color:var(--ol-muted);font-size:11px;line-height:1.55}
.orilom-loyalty-heading-badge{flex:0 0 auto;border:1px solid #d9ca9d;border-radius:999px;padding:8px 11px;color:#69530f;background:#fffaf0;font-size:8px;font-weight:900;letter-spacing:.11em}
.orilom-loyalty-notice{display:flex;justify-content:space-between;gap:16px;padding:12px 14px;border:1px solid #eadfbf;background:#fff9e8;border-radius:12px;font-size:11px}.orilom-loyalty-notice.is-success{border-color:#c9dfcb;background:#f2fbf3}.orilom-loyalty-notice span{color:#6e685d}
.orilom-loyalty-topgrid{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(330px,1.25fr);gap:14px;align-items:stretch}
.orilom-member-card{position:relative;isolation:isolate;min-height:224px;aspect-ratio:1.72/1;overflow:hidden;border-radius:19px;padding:22px;color:#17130a;background:linear-gradient(135deg,#8f6b13 0%,#e7c35b 28%,#fff1a8 47%,#c49b2c 70%,#7b5b10 100%);box-shadow:0 16px 35px rgba(54,43,10,.18),inset 0 0 0 1px rgba(255,255,255,.55)}
.orilom-member-card:before{content:"";position:absolute;inset:-40%;z-index:-2;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 48%,transparent 58%);transform:rotate(-10deg)}
.orilom-member-card:after{content:"O";position:absolute;right:-8px;bottom:-48px;z-index:-1;font:700 180px/1 Georgia,serif;color:rgba(69,48,0,.10)}
.orilom-member-card-top,.orilom-member-card-bottom{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.orilom-member-card-top>span{border:1px solid rgba(17,17,15,.25);border-radius:999px;padding:6px 9px;font-size:8px;font-weight:900;letter-spacing:.1em;background:rgba(255,255,255,.27)}
.orilom-member-brand b{display:block;font:800 20px/1 Georgia,serif;letter-spacing:.07em}.orilom-member-brand small{display:block;margin-top:4px;font-size:7px;font-weight:900;letter-spacing:.24em}
.orilom-member-chip{width:39px;height:29px;margin:27px 0 12px;border-radius:6px;border:1px solid rgba(51,36,0,.35);background:linear-gradient(135deg,#f9e895,#bd8e1d);display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden}.orilom-member-chip i{border-right:1px solid rgba(72,52,7,.25)}
.orilom-member-code{font:700 14px/1.1 'Courier New',monospace;letter-spacing:.16em;margin-bottom:19px;text-shadow:0 1px rgba(255,255,255,.35)}
.orilom-member-card-bottom{margin-top:auto;align-items:end}.orilom-member-card-bottom>div{display:flex;flex-direction:column;gap:3px}.orilom-member-card-bottom small{font-size:6px;font-weight:900;letter-spacing:.13em;opacity:.7}.orilom-member-card-bottom strong{font-size:10px;text-transform:uppercase}
.orilom-coin-wallet{border:1px solid var(--ol-line);border-radius:17px;padding:20px;background:#fff;display:flex;flex-direction:column;justify-content:center;box-shadow:0 10px 28px rgba(17,17,15,.035)}
.orilom-coin-wallet-head{display:flex;gap:14px;align-items:center;padding-bottom:16px;border-bottom:1px solid #eee9dd}.orilom-coin-wallet-head>div{min-width:0}.orilom-coin-wallet-head small{display:block;color:#8b8579;font-size:8px;font-weight:900;letter-spacing:.13em}.orilom-coin-wallet-head strong{display:block;margin-top:3px;font:700 29px/1 Georgia,serif}.orilom-coin-wallet-head em{font:800 10px/1 Arial,sans-serif;color:#876b1b;letter-spacing:.05em;text-transform:uppercase}
.orilom-sillage-coin{position:relative;display:inline-grid;place-items:center;flex:0 0 auto;width:52px;height:52px;border-radius:50%;background:radial-gradient(circle at 34% 26%,#fff6b4 0 9%,#f1cf62 26%,#c39725 59%,#6b4d08 100%);box-shadow:inset 0 0 0 3px #8c6814,inset 0 0 0 6px #e2bd4a,0 7px 14px rgba(88,62,7,.20)}
.orilom-sillage-coin:after{content:"✦";position:absolute;right:6px;top:4px;color:#fff8bf;font-size:10px;text-shadow:0 1px 2px #76530a}.orilom-sillage-coin>i{font:900 23px/1 Georgia,serif;font-style:normal;color:#5d4207;text-shadow:0 1px rgba(255,255,255,.45)}
.orilom-sillage-coin.is-mini{width:21px;height:21px;box-shadow:inset 0 0 0 1px #8c6814,inset 0 0 0 3px #e2bd4a}.orilom-sillage-coin.is-mini:after{display:none}.orilom-sillage-coin.is-mini>i{font-size:10px}
.orilom-wallet-meta{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:13px 0}.orilom-wallet-meta>span{padding:10px 11px;background:var(--ol-cream);border-radius:10px}.orilom-wallet-meta small{display:block;color:#8b8579;font-size:7px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.orilom-wallet-meta b{display:block;margin-top:3px;font-size:11px}
.orilom-wallet-progress-head{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:9px;color:#736c60}.orilom-wallet-progress-head b{color:#111}.orilom-wallet-progress{height:6px;margin:8px 0 6px;background:#eeeae1;border-radius:999px;overflow:hidden}.orilom-wallet-progress i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#171713,#d0a63c)}.orilom-wallet-levels{color:#999184;font-size:7px;line-height:1.5}
.orilom-reward-strip{border:1px solid var(--ol-line);border-radius:15px;padding:17px;background:#fff}.orilom-reward-strip-head{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:12px}.orilom-reward-strip-head h3{margin:0;font:700 19px/1.15 Georgia,serif}.orilom-reward-strip-head>small{color:#777064;font-size:9px}
.orilom-reward-strip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.orilom-reward-mini{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;gap:3px 10px;align-items:center;border:1px solid #ece6d9;border-radius:11px;padding:11px;background:#fcfbf7}.orilom-reward-mini>span{grid-row:1/3;display:flex;align-items:center;gap:6px;color:#80651a;font-size:10px;font-weight:900}.orilom-reward-mini>strong{font:700 13px/1.2 Georgia,serif}.orilom-reward-mini button{grid-column:3;grid-row:1/3;min-width:78px;border:0;border-radius:8px;padding:8px 10px;background:#ece9e2;color:#9b968c;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.orilom-reward-mini.is-ready{border-color:#d8c27e;background:#fffaf0}.orilom-reward-mini.is-ready button{background:#111;color:#fff;cursor:pointer}.orilom-reward-mini.is-ready button:hover{background:#9a7618}
.orilom-loyalty-folds{display:grid;grid-template-columns:1fr;gap:8px}.orilom-loyalty-fold{border:1px solid var(--ol-line);border-radius:12px;background:#fff;overflow:hidden}.orilom-loyalty-fold summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:13px 15px;cursor:pointer}.orilom-loyalty-fold summary::-webkit-details-marker{display:none}.orilom-loyalty-fold summary>span{display:flex;flex-direction:column;gap:2px}.orilom-loyalty-fold summary b{font-size:11px}.orilom-loyalty-fold summary small{font-size:8px;color:#90897d}.orilom-loyalty-fold summary>i{font-style:normal;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#f3f0e9;color:#6d665b;font-size:15px;transition:.2s}.orilom-loyalty-fold[open] summary>i{transform:rotate(45deg);background:#111;color:#d8b34f}.orilom-loyalty-fold[open] summary{border-bottom:1px solid #eee8dc}
.orilom-loyalty-fold>.orilom-circle-passport,.orilom-loyalty-fold>.orilom-circle-history,.orilom-loyalty-fold>.orilom-loyalty-rules{margin:0;padding:14px}
.orilom-circle-passport{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.orilom-circle-passport>div{display:flex;align-items:center;gap:8px;border:1px solid #ebe6dc;border-radius:9px;padding:9px 10px;color:#9b978f;background:#fbfaf7}.orilom-circle-passport>div.is-unlocked{color:#111;border-color:#dac783;background:#fffaf0}.orilom-circle-passport>div>i{font-style:normal;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#efede8;font-size:10px}.orilom-circle-passport .is-unlocked>i{background:#111;color:#d8b34f}.orilom-circle-passport span{font-size:9px;font-weight:700}
.orilom-circle-history{display:grid}.orilom-circle-history>div{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:9px 0;border-top:1px solid #f0ede8}.orilom-circle-history>div:first-child{border-top:0}.orilom-circle-history>div>span{display:flex;flex-direction:column;gap:2px}.orilom-circle-history strong{font-size:10px}.orilom-circle-history small{font-size:8px;color:#99938b}.orilom-circle-history>b{font-size:10px}.orilom-circle-history>b.is-plus{color:#2f7635}.orilom-circle-history>b.is-minus{color:#a54b43}.orilom-circle-empty{color:#8c867c;font-size:10px}
.orilom-loyalty-rules{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.orilom-loyalty-rules>span{display:grid;grid-template-columns:27px 1fr;gap:2px 8px;align-items:center;padding:11px;background:#faf8f2;border-radius:10px}.orilom-loyalty-rules>span>b{grid-row:1/3;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#111;color:#d8b34f}.orilom-loyalty-rules strong{font-size:10px}.orilom-loyalty-rules small{font-size:8px;line-height:1.45;color:#827b70}
@media(max-width:1100px){.orilom-dashboard-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.orilom-loyalty-topgrid{grid-template-columns:1fr}.orilom-member-card{max-width:500px}.orilom-reward-strip-grid{grid-template-columns:1fr}}
@media(max-width:760px){.orilom-dashboard-stats{grid-template-columns:1fr}.orilom-loyalty-heading{display:block}.orilom-loyalty-heading-badge{display:inline-flex;margin-top:10px}.orilom-loyalty-heading h2{font-size:24px}.orilom-member-card{width:100%;min-height:190px;padding:18px}.orilom-member-code{font-size:12px}.orilom-coin-wallet{padding:16px}.orilom-coin-wallet-head strong{font-size:24px}.orilom-circle-passport{grid-template-columns:repeat(2,1fr)}.orilom-loyalty-rules{grid-template-columns:1fr}.orilom-reward-mini{grid-template-columns:auto 1fr}.orilom-reward-mini button{grid-column:1/-1;grid-row:auto;margin-top:5px}.orilom-reward-mini>span{grid-row:auto}.orilom-loyalty-notice{display:block}.orilom-loyalty-notice span{display:block;margin-top:4px}}
/* =========================================================
ORILOM — PROGRAMME FIDELITE V3 — PREMIUM COMPACT UX
Ajustements ciblés uniquement sur la page fidélité.
========================================================= */
.orilom-loyalty-v3{
--ol-black:#11110f;
--ol-gold:#b8902f;
--ol-gold-deep:#765716;
--ol-gold-soft:#e7d28a;
--ol-ivory:#faf8f2;
--ol-ivory-2:#f5f1e8;
--ol-line:#e7e0d2;
--ol-muted:#706a60;
--ol-green:#2f6c43;
gap:16px !important;
width:100%;
}
.orilom-loyalty-v3 .orilom-loyalty-heading{
align-items:center;
padding:2px 0 8px;
}
.orilom-loyalty-v3 .orilom-loyalty-heading>div:first-child>span{
margin-bottom:7px;
color:#8c6c1b;
font-size:9px;
letter-spacing:.18em;
}
.orilom-loyalty-v3 .orilom-loyalty-heading h2{
max-width:760px;
font-size:31px;
line-height:1.04;
}
.orilom-loyalty-v3 .orilom-loyalty-heading p{
max-width:720px;
margin-top:9px;
font-size:12px;
line-height:1.55;
}
.orilom-loyalty-heading-note{
flex:0 0 auto;
display:flex;
flex-direction:column;
align-items:flex-end;
gap:2px;
padding:9px 12px;
border:1px solid #ddcfaa;
border-radius:999px;
background:#fffaf0;
}
.orilom-loyalty-heading-note b{
color:#5f4915;
font-size:10px;
line-height:1;
}
.orilom-loyalty-heading-note small{
color:#8b8069;
font-size:7px;
text-transform:uppercase;
letter-spacing:.1em;
}
/* résumé : deux seules cartes fortes, sans boîtes inutiles */
.orilom-loyalty-summary{
display:grid;
grid-template-columns:minmax(310px,.92fr) minmax(390px,1.08fr);
gap:16px;
align-items:stretch;
}
/* carte membre : gold mat, moins flashy et plus luxe */
.orilom-loyalty-v3 .orilom-member-card{
min-height:222px;
aspect-ratio:auto;
padding:22px 24px;
border-radius:18px;
color:#16130d;
background:
radial-gradient(circle at 86% 16%,rgba(255,255,255,.30),transparent 22%),
linear-gradient(128deg,#a77f20 0%,#d5b653 28%,#ead98f 53%,#c5a23a 76%,#8f6918 100%);
border:1px solid rgba(88,62,5,.24);
box-shadow:0 14px 32px rgba(77,57,13,.14);
}
.orilom-loyalty-v3 .orilom-member-card:before{
inset:-60% -30%;
opacity:.35;
background:linear-gradient(116deg,transparent 42%,rgba(255,255,255,.52) 49%,transparent 56%);
}
.orilom-loyalty-v3 .orilom-member-card:after{
content:"";
right:-56px;
bottom:-72px;
width:190px;
height:190px;
border:28px solid rgba(50,35,4,.08);
border-radius:50%;
}
.orilom-member-emblem{
position:absolute;
right:22px;
top:62px;
width:44px;
height:44px;
display:grid;
place-items:center;
border-radius:50%;
background:#111;
color:#d8b64b;
border:1px solid rgba(255,255,255,.45);
box-shadow:0 6px 16px rgba(0,0,0,.14);
font:700 20px/1 Georgia,serif;
}
.orilom-loyalty-v3 .orilom-member-card-top>span{
background:rgba(255,250,227,.50);
border-color:rgba(45,33,5,.22);
padding:6px 10px;
}
.orilom-loyalty-v3 .orilom-member-brand b{
font-size:22px;
letter-spacing:.08em;
}
.orilom-loyalty-v3 .orilom-member-brand small{
margin-top:5px;
font-size:6.5px;
letter-spacing:.24em;
}
.orilom-loyalty-v3 .orilom-member-chip{
width:38px;
height:28px;
margin:28px 0 14px;
background:linear-gradient(135deg,#f5e39a,#a77d19);
border-color:rgba(62,44,5,.32);
box-shadow:inset 0 1px rgba(255,255,255,.45);
}
.orilom-loyalty-v3 .orilom-member-code{
margin-bottom:20px;
font:700 10px/1.2 Arial,sans-serif;
letter-spacing:.12em;
opacity:.82;
}
.orilom-loyalty-v3 .orilom-member-card-bottom small{
font-size:6.5px;
}
.orilom-loyalty-v3 .orilom-member-card-bottom strong{
font-size:10.5px;
}
/* wallet : meilleure hiérarchie, plus de mini-cases */
.orilom-loyalty-v3 .orilom-coin-wallet{
min-height:222px;
justify-content:flex-start;
padding:20px 22px;
border-radius:18px;
background:#fff;
box-shadow:0 10px 28px rgba(17,17,15,.035);
}
.orilom-loyalty-v3 .orilom-coin-wallet-head{
gap:15px;
padding-bottom:13px;
}
.orilom-loyalty-v3 .orilom-coin-wallet-head strong{
display:inline-block;
margin:2px 7px 0 0;
font-size:34px;
line-height:1;
}
.orilom-loyalty-v3 .orilom-coin-wallet-head em{
display:inline-block;
vertical-align:3px;
font-size:9px;
letter-spacing:.08em;
}
/* coin propre à ORILOM : relief inspiré des crédits, rendu adulte */
.orilom-loyalty-v3 .orilom-sillage-coin{
width:50px;
height:50px;
padding:5px;
background:
conic-gradient(from 15deg,#7d5a0d,#f2d774,#9d7418,#f7e18b,#88630f,#d8b94a,#7d5a0d);
box-shadow:0 7px 15px rgba(91,65,9,.17),inset 0 0 0 1px rgba(71,48,4,.45);
}
.orilom-loyalty-v3 .orilom-sillage-coin:before{
content:"";
position:absolute;
inset:5px;
border-radius:50%;
background:radial-gradient(circle at 35% 28%,#fff0a3,#d5ab38 50%,#8e6711 100%);
box-shadow:inset 0 0 0 2px rgba(255,244,170,.62),inset 0 0 0 4px rgba(87,61,5,.30);
}
.orilom-loyalty-v3 .orilom-sillage-coin:after{
content:"✦";
z-index:2;
right:7px;
top:5px;
font-size:8px;
}
.orilom-loyalty-v3 .orilom-sillage-coin>i{
position:relative;
z-index:3;
font:900 14px/1 Arial,sans-serif;
letter-spacing:-.04em;
color:#5c4107;
}
.orilom-loyalty-v3 .orilom-sillage-coin.is-mini{
width:22px;
height:22px;
padding:2px;
}
.orilom-loyalty-v3 .orilom-sillage-coin.is-mini:before{inset:2px;box-shadow:inset 0 0 0 1px rgba(87,61,5,.32)}
.orilom-loyalty-v3 .orilom-sillage-coin.is-mini>i{font-size:6px;letter-spacing:-.07em}
.orilom-wallet-statusline{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:0;
margin:13px 0 12px;
border:1px solid #eee9df;
border-radius:11px;
overflow:hidden;
background:#fbfaf7;
}
.orilom-wallet-statusline>span{
min-width:0;
padding:9px 11px;
border-left:1px solid #eee9df;
}
.orilom-wallet-statusline>span:first-child{border-left:0}
.orilom-wallet-statusline small{
display:block;
color:#8a8479;
font-size:6.5px;
font-weight:900;
letter-spacing:.1em;
text-transform:uppercase;
}
.orilom-wallet-statusline b{
display:block;
margin-top:3px;
font-size:10.5px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.orilom-loyalty-v3 .orilom-wallet-progress-head{
font-size:8.5px;
}
.orilom-loyalty-v3 .orilom-wallet-progress{
height:7px;
margin:7px 0 8px;
background:#ece8df;
}
.orilom-loyalty-v3 .orilom-wallet-progress i{
background:linear-gradient(90deg,#161613 0%,#9d7b22 72%,#d3b24c 100%);
}
.orilom-loyalty-v3 .orilom-wallet-levels{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:6px;
color:#948d80;
font-size:6.7px;
}
.orilom-loyalty-v3 .orilom-wallet-levels span{
display:flex;
justify-content:space-between;
gap:5px;
white-space:nowrap;
}
.orilom-loyalty-v3 .orilom-wallet-levels b{color:#6f685d}
/* récompenses : chaque carte explique maintenant ce qui manque */
.orilom-loyalty-v3 .orilom-reward-strip{
padding:16px 17px 17px;
border-radius:16px;
background:#fff;
}
.orilom-loyalty-v3 .orilom-reward-strip-head{
align-items:center;
margin-bottom:11px;
}
.orilom-loyalty-v3 .orilom-reward-strip-head h3{
font-size:20px;
}
.orilom-loyalty-v3 .orilom-reward-strip-head>small{
padding:6px 9px;
border-radius:999px;
background:#f6f2e9;
color:#726a5e;
}
.orilom-loyalty-v3 .orilom-reward-strip-head>small b{color:#111}
.orilom-loyalty-v3 .orilom-reward-mini{
position:relative;
display:block;
min-height:102px;
padding:12px 13px 11px;
border-radius:12px;
background:#fbfaf7;
}
.orilom-reward-mini-main{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
}
.orilom-reward-mini-main strong{
max-width:52%;
text-align:right;
font:700 12px/1.22 Georgia,serif;
}
.orilom-reward-cost{
display:flex;
align-items:center;
gap:6px;
color:#7b6016;
font-size:8.5px;
font-weight:900;
white-space:nowrap;
}
.orilom-reward-mini-progress{
height:4px;
margin:12px 0 8px;
overflow:hidden;
border-radius:999px;
background:#ebe7de;
}
.orilom-reward-mini-progress i{
display:block;
height:100%;
border-radius:999px;
background:#b28b2c;
}
.orilom-reward-remaining{
display:block;
color:#827b70;
font-size:8px;
font-weight:700;
}
.orilom-loyalty-v3 .orilom-reward-mini button{
width:100%;
min-width:0;
margin-top:1px;
padding:8px 10px;
border-radius:8px;
}
/* 3 modules sur une ligne au repos = page nettement moins longue */
.orilom-loyalty-v3 .orilom-loyalty-folds{
grid-template-columns:repeat(3,minmax(0,1fr));
gap:9px;
align-items:start;
}
.orilom-loyalty-v3 .orilom-loyalty-fold{
border-radius:12px;
}
.orilom-loyalty-v3 .orilom-loyalty-fold summary{
min-height:58px;
padding:11px 12px;
}
.orilom-loyalty-v3 .orilom-loyalty-fold summary b{font-size:10px}
.orilom-loyalty-v3 .orilom-loyalty-fold summary small{font-size:7.5px}
.orilom-loyalty-v3 .orilom-loyalty-fold summary>i{
width:22px;
height:22px;
flex:0 0 22px;
}
.orilom-loyalty-v3 .orilom-circle-passport{
grid-template-columns:repeat(2,1fr);
}
.orilom-loyalty-v3 .orilom-circle-passport>div{
padding:8px;
}
.orilom-loyalty-v3 .orilom-loyalty-rules{
grid-template-columns:1fr;
}
/* Le programme fidélité doit profiter pleinement de la colonne compte. */
html body.woocommerce-account:has(.orilom-loyalty-v3) .woocommerce{
grid-template-columns:220px minmax(0,1fr) !important;
gap:36px !important;
}
html body.woocommerce-account:has(.orilom-loyalty-v3) .content-wrap.page-content{
max-width:1360px !important;
}
@media(max-width:1100px){
.orilom-loyalty-summary{grid-template-columns:1fr}
.orilom-loyalty-v3 .orilom-member-card{max-width:none}
.orilom-loyalty-v3 .orilom-loyalty-folds{grid-template-columns:1fr 1fr}
.orilom-loyalty-v3 .orilom-loyalty-fold:last-child{grid-column:1/-1}
}
@media(max-width:760px){
.orilom-loyalty-v3{gap:12px !important}
.orilom-loyalty-v3 .orilom-loyalty-heading{display:block}
.orilom-loyalty-v3 .orilom-loyalty-heading h2{font-size:25px}
.orilom-loyalty-heading-note{display:inline-flex;align-items:flex-start;margin-top:10px}
.orilom-loyalty-v3 .orilom-member-card{min-height:205px;padding:18px}
.orilom-member-emblem{right:18px;top:58px;width:39px;height:39px;font-size:18px}
.orilom-loyalty-v3 .orilom-coin-wallet{min-height:0;padding:16px}
.orilom-wallet-statusline{grid-template-columns:1fr 1fr}
.orilom-wallet-statusline>span:nth-child(3){grid-column:1/-1;border-left:0;border-top:1px solid #eee9df}
.orilom-loyalty-v3 .orilom-wallet-levels{font-size:6.3px}
.orilom-loyalty-v3 .orilom-reward-strip-grid{grid-template-columns:1fr}
.orilom-loyalty-v3 .orilom-loyalty-folds{grid-template-columns:1fr}
.orilom-loyalty-v3 .orilom-loyalty-fold:last-child{grid-column:auto}
}
/* =========================================================
ORILOM — PROGRAMME FIDELITE V4
Wallet compact + carte membre dynamique + récompense focus
========================================================= */
.orilom-loyalty-v4{
--ol-gold:#d7b522;
--ol-gold-dark:#8a6a0d;
--ol-black:#11110f;
--ol-ivory:#faf8f2;
--ol-champagne:#f4edd9;
--ol-line:#e7dfcd;
--ol-muted:#777064;
display:grid;
gap:18px;
color:var(--ol-black);
}
.orilom-loyalty-v4 *{box-sizing:border-box}
.orilom-loyalty-heading-v4{
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:28px;
padding:2px 2px 0;
}
.orilom-loyalty-heading-v4>div{max-width:760px}
.orilom-loyalty-heading-v4>div>span,
.orilom-section-kicker-v4>span,
.orilom-next-reward-head-v4>span,
.orilom-other-rewards-v4>span{
display:block;
color:#8b6a11;
font-size:9px;
font-weight:900;
letter-spacing:.16em;
text-transform:uppercase;
}
.orilom-loyalty-heading-v4 h2{
margin:7px 0 6px;
font:700 clamp(30px,3.2vw,46px)/1.02 Georgia,serif;
letter-spacing:-.025em;
}
.orilom-loyalty-heading-v4 p{
margin:0;
color:#686158;
font-size:12px;
line-height:1.6;
}
.orilom-member-pill{
flex:0 0 auto;
display:inline-flex;
align-items:center;
min-height:32px;
padding:0 13px;
border:1px solid #d7c88f;
border-radius:999px;
background:#fffaf0;
color:#725712;
font-size:8px;
font-weight:900;
letter-spacing:.12em;
text-transform:uppercase;
}
/* WALLET HERO */
.orilom-loyalty-wallet-v4{
position:relative;
display:grid;
grid-template-columns:minmax(0,1.25fr) minmax(315px,.75fr);
gap:18px;
min-height:286px;
padding:24px;
overflow:hidden;
border:1px solid var(--ol-line);
border-radius:24px;
background:
radial-gradient(circle at 15% 10%,rgba(215,181,34,.08),transparent 28%),
linear-gradient(135deg,#fff 0%,#fdfbf6 100%);
box-shadow:0 18px 42px rgba(35,29,12,.05);
}
.orilom-loyalty-wallet-v4:after{
content:"";
position:absolute;
width:360px;
height:360px;
right:-180px;
top:-220px;
border-radius:50%;
border:70px solid rgba(215,181,34,.035);
pointer-events:none;
}
.orilom-wallet-main-v4{
position:relative;
z-index:2;
display:flex;
flex-direction:column;
justify-content:center;
min-width:0;
padding:8px 6px 8px 4px;
}
.orilom-wallet-balance-v4{
display:flex;
align-items:center;
gap:16px;
}
.orilom-wallet-balance-v4>div{min-width:0}
.orilom-wallet-balance-v4 small{
display:block;
margin-bottom:3px;
color:#857d70;
font-size:8px;
font-weight:900;
letter-spacing:.14em;
}
.orilom-wallet-balance-v4 strong{
display:inline-block;
font:700 clamp(46px,6vw,72px)/.9 Georgia,serif;
letter-spacing:-.045em;
}
.orilom-wallet-balance-v4 em{
display:inline-block;
margin-left:8px;
color:#8a6913;
font-style:normal;
font-size:10px;
font-weight:900;
letter-spacing:.08em;
text-transform:uppercase;
}
/* Sillage Coin V4 */
.orilom-sillage-coin-v4{
position:relative;
flex:0 0 auto;
display:grid;
place-items:center;
width:62px;
height:62px;
border-radius:50%;
background:conic-gradient(from 12deg,#7c5d0b,#f1dc76,#ac8120,#f9e990,#7f5c0a,#d2ad35,#7c5d0b);
box-shadow:0 9px 20px rgba(106,79,12,.16),inset 0 0 0 1px rgba(77,55,7,.5);
}
.orilom-sillage-coin-v4:before{
content:"";
position:absolute;
inset:7px;
border-radius:50%;
background:radial-gradient(circle at 34% 28%,#fff3ae 0%,#e2bd4d 48%,#956d13 100%);
box-shadow:inset 0 0 0 2px rgba(255,245,178,.64),inset 0 0 0 5px rgba(90,64,7,.22);
}
.orilom-sillage-coin-v4:after{
content:"ORILOM";
position:absolute;
bottom:11px;
z-index:2;
color:#664907;
font-size:4.5px;
font-weight:900;
letter-spacing:.12em;
}
.orilom-sillage-coin-v4>i{
position:relative;
z-index:3;
margin-top:-6px;
color:#5d4207;
font:900 17px/1 Arial,sans-serif;
font-style:normal;
letter-spacing:-.06em;
}
.orilom-sillage-coin-v4.is-mini{
width:25px;
height:25px;
}
.orilom-sillage-coin-v4.is-mini:before{inset:3px;box-shadow:inset 0 0 0 1px rgba(90,64,7,.25)}
.orilom-sillage-coin-v4.is-mini:after{display:none}
.orilom-sillage-coin-v4.is-mini>i{margin:0;font-size:7px}
.orilom-wallet-meta-v4{
display:flex;
flex-wrap:wrap;
gap:22px;
margin:22px 0 18px;
}
.orilom-wallet-meta-v4 span{
position:relative;
min-width:115px;
padding-left:14px;
}
.orilom-wallet-meta-v4 span:before{
content:"";
position:absolute;
left:0;
top:2px;
bottom:2px;
width:2px;
border-radius:999px;
background:#d4b447;
}
.orilom-wallet-meta-v4 small{
display:block;
color:#91897c;
font-size:6.5px;
font-weight:900;
letter-spacing:.1em;
text-transform:uppercase;
}
.orilom-wallet-meta-v4 b{
display:block;
margin-top:3px;
font-size:11px;
}
.orilom-status-progress-copy-v4{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
color:#71695e;
font-size:8.5px;
}
.orilom-status-progress-copy-v4 b{color:#111}
.orilom-status-track-v4{
height:7px;
margin:8px 0 7px;
overflow:hidden;
border-radius:999px;
background:#ebe7df;
}
.orilom-status-track-v4 i{
display:block;
height:100%;
border-radius:999px;
background:linear-gradient(90deg,#111 0%,#9b7920 72%,#d7b522 100%);
}
.orilom-status-steps-v4{
display:grid;
grid-template-columns:repeat(3,1fr);
color:#aaa294;
font-size:7px;
font-weight:800;
}
.orilom-status-steps-v4 span:nth-child(2){text-align:center}
.orilom-status-steps-v4 span:nth-child(3){text-align:right}
.orilom-status-steps-v4 .is-active{color:#111;font-weight:900}
.orilom-status-steps-v4 .is-done{color:#816311}
/* MEMBER CARD */
.orilom-member-card-v4{
position:relative;
z-index:2;
align-self:center;
min-height:220px;
padding:22px 24px;
overflow:hidden;
border-radius:20px;
border:1px solid rgba(62,47,10,.20);
box-shadow:0 20px 38px rgba(44,33,7,.14);
color:#15130e;
}
.orilom-member-card-v4.is-decouverte{
background:
radial-gradient(circle at 85% 14%,rgba(255,255,255,.72),transparent 22%),
linear-gradient(135deg,#efe6ce 0%,#fff7df 42%,#dac68c 100%);
}
.orilom-member-card-v4.is-sillage{
color:#f6e9b2;
border-color:#6e5d28;
background:
radial-gradient(circle at 84% 14%,rgba(215,181,34,.18),transparent 22%),
linear-gradient(135deg,#171714 0%,#28261e 55%,#0d0d0c 100%);
}
.orilom-member-card-v4.is-signature{
color:#fff2bd;
border-color:#b6962e;
background:
radial-gradient(circle at 78% 18%,rgba(215,181,34,.27),transparent 23%),
linear-gradient(128deg,#050505 0%,#18150d 55%,#30270d 100%);
}
.orilom-member-card-v4:before{
content:"";
position:absolute;
inset:-45% -50%;
transform:rotate(-12deg);
background:linear-gradient(110deg,transparent 44%,rgba(255,255,255,.24) 50%,transparent 56%);
pointer-events:none;
}
.orilom-member-card-v4:after{
content:"";
position:absolute;
right:-68px;
bottom:-74px;
width:190px;
height:190px;
border:28px solid currentColor;
border-radius:50%;
opacity:.055;
}
.orilom-member-card-v4-top,
.orilom-member-card-v4-bottom{
position:relative;
z-index:2;
display:flex;
justify-content:space-between;
gap:20px;
}
.orilom-member-card-v4-top>div b{
display:block;
font:700 21px/1 Georgia,serif;
letter-spacing:.08em;
}
.orilom-member-card-v4-top>div small{
display:block;
margin-top:5px;
font-size:6px;
font-weight:900;
letter-spacing:.22em;
}
.orilom-member-card-v4-top>span{
align-self:flex-start;
padding:6px 9px;
border:1px solid currentColor;
border-radius:999px;
font-size:6px;
font-weight:900;
letter-spacing:.14em;
opacity:.72;
}
.orilom-member-card-v4-seal{
position:absolute;
z-index:2;
top:70px;
right:24px;
width:48px;
height:48px;
display:grid;
place-items:center;
border-radius:50%;
background:#111;
color:#d8b522;
box-shadow:0 8px 20px rgba(0,0,0,.16);
font:700 20px/1 Georgia,serif;
}
.orilom-member-card-v4.is-sillage .orilom-member-card-v4-seal,
.orilom-member-card-v4.is-signature .orilom-member-card-v4-seal{
background:#d7b522;
color:#111;
}
.orilom-member-card-v4-name{
position:relative;
z-index:2;
margin-top:62px;
}
.orilom-member-card-v4-name small,
.orilom-member-card-v4-bottom small{
display:block;
font-size:6px;
font-weight:900;
letter-spacing:.12em;
opacity:.62;
}
.orilom-member-card-v4-name strong{
display:block;
margin-top:3px;
font-size:11px;
text-transform:uppercase;
}
.orilom-member-card-v4-bottom{
margin-top:22px;
align-items:end;
}
.orilom-member-card-v4-bottom span:last-child{text-align:right}
.orilom-member-card-v4-bottom b{
display:block;
margin-top:3px;
font-size:9px;
}
/* NEXT REWARD */
.orilom-next-reward-v4{
display:grid;
grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);
gap:14px;
}
.orilom-next-reward-primary-v4,
.orilom-other-rewards-v4,
.orilom-passport-preview-v4,
.orilom-history-preview-v4,
.orilom-how-v4{
border:1px solid var(--ol-line);
border-radius:18px;
background:#fff;
}
.orilom-next-reward-primary-v4{
padding:20px 22px;
}
.orilom-next-reward-head-v4{
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
}
.orilom-next-reward-head-v4>b{
color:#735812;
font-size:9px;
}
.orilom-next-reward-primary-v4 h3{
margin:7px 0 6px;
font:700 25px/1.08 Georgia,serif;
}
.orilom-next-reward-numbers-v4{
display:flex;
align-items:baseline;
gap:5px;
}
.orilom-next-reward-numbers-v4 strong{font-size:15px}
.orilom-next-reward-numbers-v4 span{color:#8d8578;font-size:9px}
.orilom-next-reward-track-v4{
height:6px;
margin:10px 0 8px;
overflow:hidden;
border-radius:999px;
background:#ebe7de;
}
.orilom-next-reward-track-v4 i{
display:block;
height:100%;
border-radius:999px;
background:#b28b2c;
}
.orilom-next-reward-primary-v4 p{
margin:0;
color:#756e63;
font-size:9px;
}
.orilom-next-reward-primary-v4 p b{color:#111}
.orilom-next-reward-action-v4 button{
margin-top:10px;
min-height:38px;
padding:0 16px;
border:0;
border-radius:9px;
background:#111;
color:#fff;
font-size:9px;
font-weight:900;
letter-spacing:.05em;
cursor:pointer;
}
.orilom-other-rewards-v4{
padding:18px 20px;
}
.orilom-other-rewards-v4>span{margin-bottom:7px}
.orilom-other-reward-row-v4{
display:grid;
grid-template-columns:26px minmax(0,1fr) auto;
align-items:center;
gap:9px;
padding:10px 0;
border-bottom:1px solid #eee9df;
}
.orilom-other-reward-row-v4:last-child{border-bottom:0}
.orilom-other-reward-row-v4>b{
min-width:0;
font:700 12px/1.2 Georgia,serif;
}
.orilom-other-reward-row-v4>strong{
color:#745914;
font-size:8px;
white-space:nowrap;
}
/* PASSPORT + HISTORY */
.orilom-loyalty-insights-v4{
display:grid;
grid-template-columns:1fr 1fr;
gap:14px;
}
.orilom-passport-preview-v4,
.orilom-history-preview-v4{
min-width:0;
padding:19px 20px;
}
.orilom-section-kicker-v4{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
}
.orilom-section-kicker-v4>b{
min-width:28px;
height:22px;
display:grid;
place-items:center;
border-radius:999px;
background:#f5f0e5;
color:#6d5514;
font-size:8px;
}
.orilom-passport-preview-v4 h3,
.orilom-history-preview-v4 h3{
margin:6px 0 12px;
font:700 20px/1.1 Georgia,serif;
}
.orilom-passport-pills-v4{
display:flex;
flex-wrap:wrap;
gap:7px;
}
.orilom-passport-pills-v4 span{
display:inline-flex;
align-items:center;
gap:6px;
min-height:30px;
padding:0 10px;
border:1px solid #e9e3d8;
border-radius:999px;
background:#fbfaf7;
color:#8b8479;
font-size:8px;
}
.orilom-passport-pills-v4 span i{
font-style:normal;
color:#aaa296;
}
.orilom-passport-pills-v4 span.is-unlocked{
border-color:#d7c684;
background:#fff9df;
color:#5e4a13;
font-weight:800;
}
.orilom-passport-pills-v4 span.is-unlocked i{color:#8d6c12}
.orilom-history-list-v4>div{
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
padding:8px 0;
border-bottom:1px solid #eee9df;
}
.orilom-history-list-v4>div:last-child{border-bottom:0}
.orilom-history-list-v4>div>span{
min-width:0;
}
.orilom-history-list-v4 b{
display:block;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
font-size:8.5px;
}
.orilom-history-list-v4 small{
display:block;
margin-top:2px;
color:#9a9285;
font-size:7px;
}
.orilom-history-list-v4 strong{
flex:0 0 auto;
font-size:8.5px;
}
.orilom-history-list-v4 .is-plus{color:#776018}
.orilom-history-list-v4 .is-minus{color:#9b3e36}
.orilom-history-empty-v4{
margin:2px 0 0;
color:#857e72;
font-size:9px;
line-height:1.6;
}
.orilom-inline-details-v4{
margin-top:11px;
border-top:1px solid #eee9df;
}
.orilom-inline-details-v4 summary{
display:flex;
align-items:center;
justify-content:space-between;
min-height:34px;
color:#5f584e;
font-size:8px;
font-weight:800;
cursor:pointer;
list-style:none;
}
.orilom-inline-details-v4 summary::-webkit-details-marker{display:none}
.orilom-inline-details-v4 summary i{
width:20px;
height:20px;
display:grid;
place-items:center;
border-radius:50%;
background:#f3f0e9;
font-style:normal;
}
.orilom-inline-details-v4[open] summary i{transform:rotate(45deg)}
.orilom-inline-details-v4 .orilom-circle-passport,
.orilom-inline-details-v4 .orilom-circle-history{
margin-top:6px;
}
/* HOW IT WORKS */
.orilom-how-v4{
overflow:hidden;
}
.orilom-how-v4 summary{
min-height:54px;
padding:0 18px;
display:flex;
align-items:center;
justify-content:space-between;
gap:18px;
cursor:pointer;
list-style:none;
}
.orilom-how-v4 summary::-webkit-details-marker{display:none}
.orilom-how-v4 summary b{display:block;font-size:10px}
.orilom-how-v4 summary small{display:block;margin-top:2px;color:#91897d;font-size:7px}
.orilom-how-v4 summary>i{
width:24px;
height:24px;
display:grid;
place-items:center;
border-radius:50%;
background:#f2efe8;
font-style:normal;
}
.orilom-how-v4[open] summary>i{transform:rotate(45deg)}
.orilom-how-v4 .orilom-loyalty-rules{
padding:0 18px 18px;
}
/* account page sizing only for V4 */
html body.woocommerce-account:has(.orilom-loyalty-v4) .woocommerce{
grid-template-columns:220px minmax(0,1fr) !important;
gap:38px !important;
}
html body.woocommerce-account:has(.orilom-loyalty-v4) .content-wrap.page-content{
max-width:1360px !important;
}
@media(max-width:1120px){
.orilom-loyalty-wallet-v4{grid-template-columns:1fr;min-height:0}
.orilom-member-card-v4{width:min(100%,470px);justify-self:start}
.orilom-next-reward-v4{grid-template-columns:1fr}
}
@media(max-width:820px){
.orilom-loyalty-heading-v4{align-items:flex-start}
.orilom-loyalty-insights-v4{grid-template-columns:1fr}
.orilom-loyalty-wallet-v4{padding:18px}
.orilom-wallet-meta-v4{gap:14px}
}
@media(max-width:620px){
.orilom-loyalty-v4{gap:12px}
.orilom-loyalty-heading-v4{display:block}
.orilom-loyalty-heading-v4 h2{font-size:30px}
.orilom-member-pill{margin-top:10px}
.orilom-loyalty-wallet-v4{padding:15px;border-radius:18px}
.orilom-wallet-balance-v4{gap:11px}
.orilom-wallet-balance-v4 strong{font-size:48px}
.orilom-sillage-coin-v4{width:50px;height:50px}
.orilom-wallet-meta-v4{display:grid;grid-template-columns:1fr 1fr;margin:17px 0 15px}
.orilom-wallet-meta-v4 span:last-child{grid-column:1/-1}
.orilom-member-card-v4{min-height:205px;padding:18px}
.orilom-member-card-v4-seal{top:62px;right:18px;width:42px;height:42px}
.orilom-member-card-v4-name{margin-top:54px}
.orilom-next-reward-primary-v4,
.orilom-other-rewards-v4,
.orilom-passport-preview-v4,
.orilom-history-preview-v4{padding:16px}
.orilom-other-reward-row-v4{grid-template-columns:24px minmax(0,1fr) auto}
}
/* =========================================================
ORILOM PROGRAMME FIDELITE V5 — GOLD / AIRY / COMPACT
========================================================= */
.orilom-loyalty-v5{max-width:940px;margin:0 auto;color:#15130f}.orilom-loyalty-heading-v5{margin:2px 0 22px}.orilom-loyalty-heading-v5>span,.orilom-section-title-v5>span{display:block;color:#9a7410;font-size:10px;font-weight:900;letter-spacing:.18em}.orilom-loyalty-heading-v5 h2{font:700 clamp(32px,3.2vw,46px)/1 Georgia,serif;margin:7px 0 8px;letter-spacing:-.025em}.orilom-loyalty-heading-v5 p{margin:0;color:#6f6a61;font-size:13px}.orilom-hero-v5{display:grid;grid-template-columns:390px 1fr;gap:36px;align-items:center;padding:24px 28px;background:#fffdf8;border:1px solid #eadfbe;border-radius:22px;box-shadow:0 18px 50px rgba(56,43,8,.05)}
.orilom-gold-card-v5{position:relative;min-height:230px;padding:26px 27px;border-radius:20px;overflow:hidden;color:#17130a;background:linear-gradient(125deg,#b98b16 0%,#f9e9a0 27%,#d4a92f 54%,#a77a0d 100%);border:1px solid #c49a28;box-shadow:0 20px 38px rgba(97,70,7,.22),inset 0 1px rgba(255,255,255,.7)}.orilom-gold-card-v5:before{content:"";position:absolute;inset:-35% -15%;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.35) 48%,transparent 60%);transform:rotate(-8deg);pointer-events:none}.orilom-gold-card-v5:after{content:"O";position:absolute;right:-12px;bottom:-56px;font:170px/.8 Georgia,serif;color:rgba(75,51,0,.09)}.orilom-gold-card-top-v5,.orilom-gold-card-bottom-v5{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start}.orilom-gold-card-top-v5 b{font:700 24px Georgia,serif;letter-spacing:.1em}.orilom-gold-card-top-v5 small{display:block;font-size:7px;font-weight:900;letter-spacing:.24em;margin-top:4px}.orilom-gold-card-top-v5>span{border:1px solid rgba(40,30,0,.35);background:rgba(255,250,220,.38);border-radius:999px;padding:6px 10px;font-size:7px;font-weight:900;letter-spacing:.12em}.orilom-gold-chip-v5{position:relative;z-index:2;width:40px;height:29px;margin-top:28px;border:1px solid rgba(71,50,0,.45);border-radius:5px;background:linear-gradient(135deg,#f9e68b,#bd8e16);display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden}.orilom-gold-chip-v5 i{border-right:1px solid rgba(73,52,0,.25)}.orilom-gold-card-name-v5{position:relative;z-index:2;margin-top:24px}.orilom-gold-card-name-v5 small,.orilom-gold-card-bottom-v5 small{display:block;font-size:7px;font-weight:800;letter-spacing:.12em;opacity:.65}.orilom-gold-card-name-v5 strong{display:block;margin-top:4px;font-size:12px;letter-spacing:.04em}.orilom-gold-card-bottom-v5{margin-top:18px}.orilom-gold-card-bottom-v5 b{display:block;margin-top:3px;font-size:9px}
.orilom-balance-v5{padding:4px 0}.orilom-balance-number-v5{display:flex;align-items:center;gap:16px}.orilom-sillage-coin-v5{width:52px;height:52px;flex:0 0 52px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 34% 28%,#fff5b8 0 9%,#e4b936 25%,#a87808 70%);border:2px solid #8f6707;box-shadow:inset 0 0 0 4px #e7c958,0 5px 12px rgba(83,61,8,.16)}.orilom-sillage-coin-v5 i{font-style:normal;font:800 13px Georgia,serif}.orilom-balance-number-v5 strong{display:block;font:700 58px/.8 Georgia,serif;letter-spacing:-.04em}.orilom-balance-number-v5 div>span{display:block;margin-top:11px;color:#8e6b0d;font-size:10px;font-weight:900;letter-spacing:.13em}.orilom-level-v5{margin-top:28px}.orilom-level-v5 span{display:block;color:#9b958a;font-size:8px;font-weight:900;letter-spacing:.15em}.orilom-level-v5 strong{display:block;font:700 21px Georgia,serif;margin-top:4px}.orilom-level-progress-v5{margin-top:17px}.orilom-level-progress-v5>div:first-child{display:flex;justify-content:space-between;color:#676158;font-size:10px}.orilom-level-track-v5{height:5px!important;background:#ebe7dd;border-radius:99px;margin-top:8px;overflow:hidden}.orilom-level-track-v5 i{display:block;height:100%;background:linear-gradient(90deg,#111,#d4ad35);border-radius:99px}.orilom-earn-v5{margin-top:16px;border-top:1px solid #ece7db;padding-top:12px}.orilom-earn-v5 summary{list-style:none;cursor:pointer;font-size:10px;font-weight:800;display:flex;justify-content:space-between}.orilom-earn-v5 summary::-webkit-details-marker{display:none}.orilom-earn-v5 p{font-size:10px;line-height:1.55;color:#777064;margin:10px 0 0}
.orilom-rewards-v5{margin-top:18px;padding:19px 22px;border:1px solid #eadfbe;border-radius:18px;background:#fff}.orilom-section-title-v5{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}.orilom-section-title-v5 small{color:#8c8578;font-size:9px}.orilom-reward-strip-v5{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.orilom-reward-v5{position:relative;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;min-height:70px;padding:12px 13px;border:1px solid #ece5d4;border-radius:13px;background:#fcfaf5}.orilom-reward-v5.is-next{background:#fffaf0;border-color:#d9bd6b}.orilom-sillage-coin-v5.is-mini{width:30px;height:30px;min-width:30px;flex-basis:30px;box-shadow:inset 0 0 0 2px #e7c958}.orilom-sillage-coin-v5.is-mini i{font-size:8px}.orilom-reward-v5 strong{display:block;font:700 13px/1.1 Georgia,serif}.orilom-reward-v5 small{display:block;color:#8a8172;font-size:8px;margin-top:4px}.orilom-reward-v5 em{grid-column:2/-1;font-style:normal;color:#8a6a13;font-size:8px}.orilom-reward-progress-v5{grid-column:2/-1;height:3px;background:#e8e3d8;border-radius:99px;overflow:hidden}.orilom-reward-progress-v5 i{display:block;height:100%;background:#b88c18}.orilom-reward-v5 button{border:0;border-radius:8px;background:#111;color:#fff;padding:8px 10px;font-size:8px;font-weight:800;cursor:pointer}
.orilom-compact-v5{margin-top:12px;border:1px solid #eadfbe;border-radius:16px;background:#fff;overflow:hidden}.orilom-compact-row-v5{border-bottom:1px solid #eee8db}.orilom-compact-row-v5:last-child{border-bottom:0}.orilom-compact-row-v5 summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr auto 24px;align-items:center;gap:16px;padding:13px 17px}.orilom-compact-row-v5 summary::-webkit-details-marker{display:none}.orilom-compact-row-v5 summary span small{display:block;color:#a17a15;font-size:7px;font-weight:900;letter-spacing:.14em}.orilom-compact-row-v5 summary span strong{display:block;font:700 14px Georgia,serif;margin-top:2px}.orilom-compact-row-v5 summary>b{font-size:9px;color:#756e62}.orilom-compact-row-v5 summary>i{width:23px;height:23px;border-radius:50%;background:#f2efe8;display:grid;place-items:center;font-style:normal}.orilom-compact-row-v5[open] summary>i{transform:rotate(45deg)}.orilom-compact-row-v5 .orilom-circle-passport,.orilom-compact-row-v5 .orilom-circle-history,.orilom-compact-row-v5 .orilom-loyalty-rules{margin:0 17px 16px}
@media(max-width:900px){.orilom-hero-v5{grid-template-columns:1fr;gap:24px}.orilom-gold-card-v5{max-width:420px}.orilom-reward-strip-v5{grid-template-columns:1fr}.orilom-loyalty-v5{max-width:100%}}
@media(max-width:600px){.orilom-loyalty-heading-v5 h2{font-size:34px}.orilom-hero-v5{padding:14px;border-radius:16px}.orilom-gold-card-v5{min-height:205px;padding:21px}.orilom-balance-number-v5 strong{font-size:48px}.orilom-rewards-v5{padding:14px}.orilom-section-title-v5{align-items:flex-start;gap:8px}.orilom-compact-row-v5 summary{grid-template-columns:1fr auto 22px;padding:12px}.orilom-compact-row-v5 summary>b{font-size:8px}}
/* =========================================================
ORILOM PROGRAMME FIDELITE V5.1 — SIMPLIFICATION UX
Conserve le design V5. Réduit uniquement la densité visuelle.
========================================================= */
.orilom-loyalty-v5 .orilom-hero-v5{padding:20px 24px;gap:30px}
.orilom-loyalty-v5 .orilom-gold-card-v5{min-height:218px}
.orilom-loyalty-v5 .orilom-rewards-v5{padding:14px 0 4px;border:0;border-radius:0;background:transparent;margin-top:20px}
.orilom-loyalty-v5 .orilom-section-title-v5{margin-bottom:10px}
.orilom-loyalty-v5 .orilom-reward-v5{min-height:66px;background:#fff;border-color:#e8e2d5}
.orilom-loyalty-v5 .orilom-reward-v5.is-next{background:#fffaf0;border-color:#d5b14a}
.orilom-loyalty-v5 .orilom-compact-v5{margin-top:18px;border-color:#e8e2d5;border-radius:14px}
.orilom-loyalty-v5 .orilom-compact-row-v5 summary{padding:12px 15px;min-height:58px}
.orilom-loyalty-v5 .orilom-compact-row-v5 summary>i,.orilom-loyalty-v5 .orilom-earn-v5 summary i{transition:transform .18s ease;font-size:16px;font-weight:500}
.orilom-loyalty-v5 .orilom-compact-row-v5[open] summary>i{transform:rotate(90deg)}
.orilom-loyalty-v5 .orilom-earn-v5[open] summary i{transform:rotate(90deg)}
.orilom-loyalty-v5 .orilom-compact-row-v5 summary span strong{font-size:13px}
.orilom-loyalty-v5 .orilom-compact-row-v5 summary span small{font-size:6.5px}
.orilom-loyalty-v5 .orilom-compact-row-v5 summary>b{font-size:8.5px;font-weight:700}
@media(max-width:600px){.orilom-loyalty-v5 .orilom-hero-v5{padding:13px;gap:20px}.orilom-loyalty-v5 .orilom-gold-card-v5{min-height:200px}.orilom-loyalty-v5 .orilom-rewards-v5{margin-top:15px}.orilom-loyalty-v5 .orilom-compact-v5{margin-top:14px}}
/* =========================================================
ORILOM — PARRAINAGE / CERCLE ORILOM
Correctif global V1.1
========================================================= */
.woocommerce-account .orilom-loyalty-page.orilom-loyalty-v5 .orilom-referral-v1{
box-sizing:border-box!important;
width:100%!important;
margin:28px 0 22px!important;
padding:22px 24px!important;
border:1px solid #e5c66d!important;
border-radius:16px!important;
background:linear-gradient(135deg,#fffdf7 0%,#fbf5e6 100%)!important;
display:grid!important;
grid-template-columns:minmax(0,1.18fr) minmax(270px,.82fr)!important;
gap:28px!important;
align-items:center!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-copy-v1{
min-width:0!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-copy-v1>span{
display:block!important;
margin:0 0 6px!important;
color:#9b7410!important;
font-size:8px!important;
line-height:1.2!important;
font-weight:900!important;
letter-spacing:.18em!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-copy-v1 h3{
margin:0 0 8px!important;
padding:0!important;
color:#15120d!important;
font-family:Georgia,"Times New Roman",serif!important;
font-size:19px!important;
line-height:1.18!important;
font-weight:700!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-copy-v1 p{
margin:0!important;
padding:0!important;
max-width:590px!important;
color:#625d55!important;
font-size:11px!important;
line-height:1.55!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-copy-v1 p strong{
color:#17130d!important;
font-weight:900!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-stats-v1{
display:flex!important;
align-items:center!important;
gap:18px!important;
margin:13px 0 0!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-stats-v1 span{
display:inline-flex!important;
align-items:baseline!important;
gap:4px!important;
color:#746d62!important;
font-size:9px!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-stats-v1 b{
color:#15120d!important;
font-size:13px!important;
font-weight:900!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-actions-v1{
min-width:0!important;
width:100%!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-code-v1{
box-sizing:border-box!important;
width:100%!important;
padding:11px 13px!important;
border:1px solid #e9dfc8!important;
border-radius:10px!important;
background:#fff!important;
overflow:hidden!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-code-v1 small{
display:block!important;
margin:0 0 5px!important;
color:#9b7410!important;
font-size:7px!important;
line-height:1.2!important;
font-weight:900!important;
letter-spacing:.14em!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-code-v1 code{
display:block!important;
width:100%!important;
margin:0!important;
padding:0!important;
border:0!important;
background:transparent!important;
color:#25211b!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:9px!important;
line-height:1.4!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-buttons-v1{
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:8px!important;
margin:9px 0 0!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-buttons-v1 button,
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-buttons-v1 a{
box-sizing:border-box!important;
width:100%!important;
min-height:38px!important;
margin:0!important;
padding:0 12px!important;
border-radius:9px!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:9px!important;
line-height:1!important;
font-weight:900!important;
text-transform:none!important;
letter-spacing:0!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
text-align:center!important;
text-decoration:none!important;
cursor:pointer!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-copy-ref-v1{
border:1px solid #15120d!important;
background:#15120d!important;
color:#fff!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-wa-ref-v1{
border:1px solid #d8c79b!important;
background:#fff!important;
color:#15120d!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-copy-ref-v1:hover{
background:#2b251c!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-wa-ref-v1:hover{
border-color:#b78a20!important;
background:#fffaf0!important;
}
@media (max-width:680px){
.woocommerce-account .orilom-loyalty-page.orilom-loyalty-v5 .orilom-referral-v1{
grid-template-columns:1fr!important;
gap:17px!important;
padding:18px!important;
margin:22px 0 18px!important;
}
.woocommerce-account .orilom-loyalty-v5 .orilom-referral-buttons-v1{
grid-template-columns:1fr!important;
}
}
/* =========================================================
ORILOM — MES INFORMATIONS / EDIT ACCOUNT V7
Mise en page nette 2 colonnes + bloc mot de passe premium.
========================================================= */
body.woocommerce-account .woocommerce-EditAccountForm{
display:grid!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
gap:18px 20px!important;
width:100%!important;
max-width:940px!important;
margin:0!important;
align-items:start!important;
}
/* Tous les champs principaux deviennent de vraies cellules de grille. */
body.woocommerce-account .woocommerce-EditAccountForm > .form-row{
float:none!important;
clear:none!important;
width:auto!important;
margin:0!important;
padding:0!important;
}
/* Prénom / nom + nom affiché / email : 2 rangées équilibrées. */
body.woocommerce-account .woocommerce-EditAccountForm > .form-row-first,
body.woocommerce-account .woocommerce-EditAccountForm > .form-row-last,
body.woocommerce-account .woocommerce-EditAccountForm > .form-row-wide{
width:auto!important;
float:none!important;
clear:none!important;
}
body.woocommerce-account .woocommerce-EditAccountForm label{
margin:0 0 8px!important;
color:#1f1f1f!important;
font-size:11px!important;
line-height:1.35!important;
font-weight:700!important;
letter-spacing:.005em!important;
}
body.woocommerce-account .woocommerce-EditAccountForm input[type="text"],
body.woocommerce-account .woocommerce-EditAccountForm input[type="email"],
body.woocommerce-account .woocommerce-EditAccountForm input[type="password"]{
width:100%!important;
height:50px!important;
padding:0 15px!important;
border:1px solid #d8d8d8!important;
border-radius:10px!important;
background:#fff!important;
color:#111!important;
font-size:13px!important;
font-weight:500!important;
line-height:50px!important;
box-shadow:none!important;
transition:border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}
body.woocommerce-account .woocommerce-EditAccountForm input:hover{
border-color:#bdbdbd!important;
}
body.woocommerce-account .woocommerce-EditAccountForm input:focus{
border-color:#111!important;
background:#fff!important;
box-shadow:0 0 0 3px rgba(17,17,17,.055)!important;
}
body.woocommerce-account .woocommerce-EditAccountForm em{
margin-top:7px!important;
color:#858585!important;
font-size:9px!important;
line-height:1.45!important;
}
/* Mot de passe : une vraie carte, pleine largeur. */
body.woocommerce-account .woocommerce-EditAccountForm fieldset{
grid-column:1 / -1!important;
display:grid!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
gap:17px 20px!important;
width:100%!important;
margin:10px 0 4px!important;
padding:24px!important;
border:1px solid #e4e1da!important;
border-radius:16px!important;
background:#fbfaf7!important;
box-sizing:border-box!important;
}
body.woocommerce-account .woocommerce-EditAccountForm fieldset legend{
padding:0 10px!important;
color:#191919!important;
background:#fff!important;
font-size:13px!important;
line-height:1!important;
font-weight:800!important;
}
body.woocommerce-account .woocommerce-EditAccountForm fieldset > .form-row{
float:none!important;
clear:none!important;
width:auto!important;
margin:0!important;
padding:0!important;
}
/* Mot de passe actuel sur toute la largeur ; nouveau + confirmation dessous. */
body.woocommerce-account .woocommerce-EditAccountForm fieldset > .form-row:first-of-type{
grid-column:1 / -1!important;
}
/* Corrige l'icône œil WooCommerce : elle ne doit plus tomber sous le champ. */
body.woocommerce-account .woocommerce-EditAccountForm .password-input{
position:relative!important;
display:block!important;
width:100%!important;
}
body.woocommerce-account .woocommerce-EditAccountForm .password-input input{
padding-right:46px!important;
}
body.woocommerce-account .woocommerce-EditAccountForm .show-password-input{
position:absolute!important;
top:50%!important;
right:14px!important;
left:auto!important;
bottom:auto!important;
margin:0!important;
transform:translateY(-50%)!important;
width:22px!important;
height:22px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
color:#555!important;
cursor:pointer!important;
line-height:1!important;
}
/* Ligne du bouton pleine largeur. */
body.woocommerce-account .woocommerce-EditAccountForm > p:last-child{
grid-column:1 / -1!important;
margin:4px 0 0!important;
padding:0!important;
}
body.woocommerce-account .woocommerce-EditAccountForm button[name="save_account_details"]{
min-width:168px!important;
min-height:48px!important;
padding:0 24px!important;
border-radius:10px!important;
font-size:10px!important;
letter-spacing:.055em!important;
}
/* Mobile : une seule colonne, sans flottants. */
@media (max-width:760px){
body.woocommerce-account .woocommerce-EditAccountForm{
grid-template-columns:1fr!important;
gap:16px!important;
}
body.woocommerce-account .woocommerce-EditAccountForm fieldset{
grid-column:1!important;
grid-template-columns:1fr!important;
gap:15px!important;
padding:19px!important;
}
body.woocommerce-account .woocommerce-EditAccountForm fieldset > .form-row:first-of-type{
grid-column:1!important;
}
body.woocommerce-account .woocommerce-EditAccountForm > p:last-child{
grid-column:1!important;
}
body.woocommerce-account .woocommerce-EditAccountForm button[name="save_account_details"]{
width:100%!important;
}
}
/* =========================================================
ORILOM — Mes informations V7.1
CTA "Save changes" : alignement droite + contraste corrigé
========================================================= */
body.woocommerce-account .woocommerce-EditAccountForm > p:last-child{
grid-column:1 / -1!important;
display:flex!important;
justify-content:flex-end!important;
align-items:center!important;
width:100%!important;
margin:14px 0 0!important;
padding:0!important;
}
body.woocommerce-account .woocommerce-EditAccountForm button[name="save_account_details"],
body.woocommerce-account .woocommerce-EditAccountForm .woocommerce-Button[name="save_account_details"]{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
width:auto!important;
min-width:170px!important;
min-height:48px!important;
margin:0!important;
padding:0 26px!important;
background:#111111!important;
background-image:none!important;
color:#ffffff!important;
-webkit-text-fill-color:#ffffff!important;
border:1px solid #111111!important;
border-radius:10px!important;
box-shadow:0 10px 24px rgba(0,0,0,.10)!important;
font-size:10px!important;
font-weight:800!important;
line-height:1!important;
letter-spacing:.06em!important;
text-transform:uppercase!important;
text-decoration:none!important;
opacity:1!important;
visibility:visible!important;
cursor:pointer!important;
}
body.woocommerce-account .woocommerce-EditAccountForm button[name="save_account_details"]:hover,
body.woocommerce-account .woocommerce-EditAccountForm button[name="save_account_details"]:focus-visible,
body.woocommerce-account .woocommerce-EditAccountForm .woocommerce-Button[name="save_account_details"]:hover,
body.woocommerce-account .woocommerce-EditAccountForm .woocommerce-Button[name="save_account_details"]:focus-visible{
background:#c99b1b!important;
color:#111111!important;
-webkit-text-fill-color:#111111!important;
border-color:#c99b1b!important;
box-shadow:0 12px 28px rgba(154,118,24,.18)!important;
outline:none!important;
}
body.woocommerce-account .woocommerce-EditAccountForm button[name="save_account_details"]:active{
transform:translateY(1px)!important;
}
@media (max-width:760px){
body.woocommerce-account .woocommerce-EditAccountForm > p:last-child{
justify-content:stretch!important;
}
body.woocommerce-account .woocommerce-EditAccountForm button[name="save_account_details"],
body.woocommerce-account .woocommerce-EditAccountForm .woocommerce-Button[name="save_account_details"]{
width:100%!important;
}
}
/* =========================================================
ORILOM — MON COMPTE BUTTON STATES V16.2 SAFE
Hover / focus / active uniquement pour :
- Mes commandes : VIEW
- Mes factures : Télécharger
- Programme fidélité : Débloquer
Scope strict Mon compte, aucun impact boutique/checkout.
========================================================= */
:root{
--orilom-account-cta-hover:#dfb913;
--orilom-account-cta-active:#c9a208;
--orilom-account-cta-black:#111111;
}
/* Base motion commune */
body.woocommerce-account .woocommerce-MyAccount-content
.woocommerce-orders-table .woocommerce-button,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-invoice-download,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-doc-download,
body.woocommerce-account .woocommerce-MyAccount-content
.orilom-loyalty-v5 .orilom-reward-v5 button{
transition:
background-color .18s ease,
border-color .18s ease,
color .18s ease,
transform .16s ease,
box-shadow .18s ease!important;
cursor:pointer!important;
}
/* ---------------------------------------------------------
MES COMMANDES — bouton VIEW
--------------------------------------------------------- */
body.woocommerce-account .woocommerce-MyAccount-content
.woocommerce-orders-table .woocommerce-button{
background:var(--orilom-account-cta-black)!important;
border:1px solid var(--orilom-account-cta-black)!important;
color:#fff!important;
box-shadow:none!important;
}
@media (hover:hover){
body.woocommerce-account .woocommerce-MyAccount-content
.woocommerce-orders-table .woocommerce-button:hover{
background:var(--orilom-account-cta-hover)!important;
border-color:var(--orilom-account-cta-hover)!important;
color:#111!important;
transform:translateY(-1px)!important;
box-shadow:0 7px 16px rgba(80,61,5,.10)!important;
}
}
body.woocommerce-account .woocommerce-MyAccount-content
.woocommerce-orders-table .woocommerce-button:active{
background:var(--orilom-account-cta-active)!important;
border-color:var(--orilom-account-cta-active)!important;
color:#111!important;
transform:translateY(0) scale(.985)!important;
box-shadow:none!important;
}
/* ---------------------------------------------------------
MES FACTURES — bouton TÉLÉCHARGER
Plugin ORILOM invoices/documents
--------------------------------------------------------- */
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-invoice-download,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-doc-download{
background:var(--orilom-account-cta-black)!important;
border:1px solid var(--orilom-account-cta-black)!important;
color:#fff!important;
box-shadow:none!important;
}
@media (hover:hover){
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-invoice-download:hover,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-doc-download:hover{
background:var(--orilom-account-cta-hover)!important;
border-color:var(--orilom-account-cta-hover)!important;
color:#111!important;
transform:translateY(-1px)!important;
box-shadow:0 7px 16px rgba(80,61,5,.10)!important;
}
}
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-invoice-download:active,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-doc-download:active{
background:var(--orilom-account-cta-active)!important;
border-color:var(--orilom-account-cta-active)!important;
color:#111!important;
transform:translateY(0) scale(.985)!important;
box-shadow:none!important;
}
/* ---------------------------------------------------------
PROGRAMME FIDÉLITÉ — bouton DÉBLOQUER
--------------------------------------------------------- */
body.woocommerce-account .woocommerce-MyAccount-content
.orilom-loyalty-v5 .orilom-reward-v5 button{
background:var(--orilom-account-cta-black)!important;
border:1px solid var(--orilom-account-cta-black)!important;
color:#fff!important;
box-shadow:none!important;
}
@media (hover:hover){
body.woocommerce-account .woocommerce-MyAccount-content
.orilom-loyalty-v5 .orilom-reward-v5 button:hover{
background:var(--orilom-account-cta-hover)!important;
border-color:var(--orilom-account-cta-hover)!important;
color:#111!important;
transform:translateY(-1px)!important;
box-shadow:0 7px 16px rgba(80,61,5,.10)!important;
}
}
body.woocommerce-account .woocommerce-MyAccount-content
.orilom-loyalty-v5 .orilom-reward-v5 button:active{
background:var(--orilom-account-cta-active)!important;
border-color:var(--orilom-account-cta-active)!important;
color:#111!important;
transform:translateY(0) scale(.985)!important;
box-shadow:none!important;
}
/* Focus clavier visible et cohérent */
body.woocommerce-account .woocommerce-MyAccount-content
.woocommerce-orders-table .woocommerce-button:focus-visible,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-invoice-download:focus-visible,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-doc-download:focus-visible,
body.woocommerce-account .woocommerce-MyAccount-content
.orilom-loyalty-v5 .orilom-reward-v5 button:focus-visible{
background:var(--orilom-account-cta-hover)!important;
border-color:var(--orilom-account-cta-hover)!important;
color:#111!important;
outline:2px solid #9b7410!important;
outline-offset:3px!important;
}
/* Touch : pas de faux hover collant */
@media (hover:none){
body.woocommerce-account .woocommerce-MyAccount-content
.woocommerce-orders-table .woocommerce-button:hover,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-invoice-download:hover,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-doc-download:hover,
body.woocommerce-account .woocommerce-MyAccount-content
.orilom-loyalty-v5 .orilom-reward-v5 button:hover{
background:var(--orilom-account-cta-black)!important;
border-color:var(--orilom-account-cta-black)!important;
color:#fff!important;
transform:none!important;
box-shadow:none!important;
}
}
/* =========================================================
ORILOM — ACCOUNT BUTTON STATES V16.3
Noir premium uniquement — aucun jaune au hover/click.
Reproduit le comportement du CTA "Voir la commande".
========================================================= */
body.woocommerce-account .woocommerce-MyAccount-content
.woocommerce-orders-table .woocommerce-button:hover,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-invoice-download:hover,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-doc-download:hover,
body.woocommerce-account .woocommerce-MyAccount-content
.orilom-loyalty-v5 .orilom-reward-v5 button:hover{
background:#252525!important;
border-color:#252525!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
transform:translateY(-1px)!important;
box-shadow:none!important;
}
body.woocommerce-account .woocommerce-MyAccount-content
.woocommerce-orders-table .woocommerce-button:active,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-invoice-download:active,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-doc-download:active,
body.woocommerce-account .woocommerce-MyAccount-content
.orilom-loyalty-v5 .orilom-reward-v5 button:active{
background:#111!important;
border-color:#111!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
transform:translateY(0) scale(.985)!important;
box-shadow:none!important;
}
body.woocommerce-account .woocommerce-MyAccount-content
.woocommerce-orders-table .woocommerce-button:focus-visible,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-invoice-download:focus-visible,
body.woocommerce-account .woocommerce-MyAccount-content
a.orilom-doc-download:focus-visible,
body.woocommerce-account .woocommerce-MyAccount-content
.orilom-loyalty-v5 .orilom-reward-v5 button:focus-visible{
background:#252525!important;
border-color:#252525!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
outline:2px solid #777!important;
outline-offset:3px!important;
}
/* =========================================================
ORILOM — SAVE CHANGES V16.4
Même langage visuel que les autres CTA Mon compte :
noir -> hover gris-noir -> click noir.
========================================================= */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-EditAccountForm
button[name="save_account_details"],
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-EditAccountForm
.woocommerce-Button[name="save_account_details"]{
background:#111!important;
background-image:none!important;
border:1px solid #111!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
box-shadow:none!important;
opacity:1!important;
transition:
background-color .18s ease,
border-color .18s ease,
color .18s ease,
transform .16s ease,
box-shadow .18s ease!important;
}
@media (hover:hover){
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-EditAccountForm
button[name="save_account_details"]:hover,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-EditAccountForm
.woocommerce-Button[name="save_account_details"]:hover{
background:#252525!important;
border-color:#252525!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
transform:translateY(-1px)!important;
box-shadow:none!important;
}
}
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-EditAccountForm
button[name="save_account_details"]:active,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-EditAccountForm
.woocommerce-Button[name="save_account_details"]:active{
background:#111!important;
border-color:#111!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
transform:translateY(0) scale(.985)!important;
box-shadow:none!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-EditAccountForm
button[name="save_account_details"]:focus-visible,
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-EditAccountForm
.woocommerce-Button[name="save_account_details"]:focus-visible{
background:#252525!important;
border-color:#252525!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
outline:2px solid #777!important;
outline-offset:3px!important;
}
/* =========================================================
ORILOM — EDIT ADDRESS BUTTONS V16.5
Billing + Shipping : même comportement noir premium.
========================================================= */
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit{
background:#111!important;
background-image:none!important;
border:1px solid #111!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
box-shadow:none!important;
transition:
background-color .18s ease,
border-color .18s ease,
color .18s ease,
transform .16s ease!important;
}
@media (hover:hover){
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit:hover{
background:#252525!important;
border-color:#252525!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
transform:translateY(-1px)!important;
box-shadow:none!important;
}
}
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit:active{
background:#111!important;
border-color:#111!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
transform:translateY(0) scale(.985)!important;
box-shadow:none!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit:focus-visible{
background:#252525!important;
border-color:#252525!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
outline:2px solid #777!important;
outline-offset:3px!important;
}
/* =========================================================
ORILOM — MES ADRESSES MAROC V16.7 SAFE
Formulaire court, propre, orienté livraison COD.
========================================================= */
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper{
display:grid!important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
gap:16px!important;
width:100%!important;
}
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper > p{
float:none!important;
width:auto!important;
margin:0!important;
padding:0!important;
}
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper > .form-row-wide,
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper > .orilom-address-line1,
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper > .orilom-address-hint{
grid-column:1 / -1!important;
}
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper label{
display:block!important;
margin:0 0 7px!important;
color:#1a1a1a!important;
font-size:11px!important;
font-weight:700!important;
line-height:1.3!important;
}
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper input:not([type="hidden"]),
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper select,
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper textarea{
width:100%!important;
min-height:48px!important;
padding:0 14px!important;
border:1px solid #dcdcdc!important;
border-radius:10px!important;
background:#fff!important;
color:#111!important;
box-shadow:none!important;
font-size:12px!important;
outline:none!important;
transition:border-color .18s ease,box-shadow .18s ease!important;
}
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper input:not([type="hidden"]):focus,
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper select:focus,
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper textarea:focus{
border-color:#777!important;
box-shadow:0 0 0 3px rgba(0,0,0,.045)!important;
}
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper input::placeholder{
color:#9b9b9b!important;
opacity:1!important;
}
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields > p:last-child{
display:flex!important;
justify-content:flex-end!important;
margin:22px 0 0!important;
}
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields button[name="save_address"]{
min-height:44px!important;
padding:0 22px!important;
border:1px solid #111!important;
border-radius:8px!important;
background:#111!important;
color:#fff!important;
-webkit-text-fill-color:#fff!important;
box-shadow:none!important;
font-size:10px!important;
font-weight:800!important;
letter-spacing:.055em!important;
text-transform:uppercase!important;
transition:background-color .18s ease,border-color .18s ease,transform .16s ease!important;
}
@media (hover:hover){
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields button[name="save_address"]:hover{
background:#252525!important;
border-color:#252525!important;
color:#fff!important;
transform:translateY(-1px)!important;
}
}
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields button[name="save_address"]:active{
background:#111!important;
border-color:#111!important;
transform:translateY(0) scale(.985)!important;
}
@media(max-width:760px){
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper{
grid-template-columns:1fr!important;
gap:13px!important;
}
body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper > *{
grid-column:1!important;
}
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields > p:last-child{
justify-content:stretch!important;
}
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields button[name="save_address"]{
width:100%!important;
min-height:46px!important;
}
}
/* =========================================================
ORILOM — CARTES ADRESSES V16.8
Hiérarchie plus premium :
- titre lisible sur une ligne
- adresse respirante
- action "Modifier l'adresse →" discrète en bas
- cartes de même hauteur
Scope strict : Mon compte > Adresses
========================================================= */
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Addresses{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:20px!important;
align-items:stretch!important;
margin-top:24px!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address{
position:relative!important;
min-height:300px!important;
height:100%!important;
padding:28px 30px 76px!important;
border:1px solid #e7e4de!important;
border-radius:18px!important;
background:#fff!important;
box-shadow:0 10px 28px rgba(0,0,0,.035)!important;
overflow:hidden!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title{
display:block!important;
width:100%!important;
margin:0 0 22px!important;
padding:0 0 18px!important;
border-bottom:1px solid #efede8!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title h2,
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title h3{
float:none!important;
display:block!important;
width:auto!important;
margin:0!important;
padding:0!important;
color:#111!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:20px!important;
font-weight:800!important;
line-height:1.2!important;
letter-spacing:-.02em!important;
white-space:nowrap!important;
}
/* Petit repère de type de carte */
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address:first-child .woocommerce-Address-title::before{
content:"FACTURATION";
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address:nth-child(2) .woocommerce-Address-title::before{
content:"LIVRAISON";
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title::before{
display:block!important;
margin:0 0 7px!important;
color:#9a7410!important;
font:800 8px/1 Arial,Helvetica,sans-serif!important;
letter-spacing:.16em!important;
}
/* Adresse : lecture plus naturelle */
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address address{
margin:0!important;
padding:0!important;
color:#5e5a54!important;
font-style:normal!important;
font-size:12px!important;
line-height:1.72!important;
}
/* Action secondaire en bas : pas de gros bouton noir dans le header */
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit{
position:absolute!important;
left:30px!important;
bottom:24px!important;
top:auto!important;
right:auto!important;
float:none!important;
min-height:0!important;
padding:0 0 3px!important;
background:transparent!important;
background-image:none!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
color:#111!important;
-webkit-text-fill-color:#111!important;
font-size:10px!important;
font-weight:800!important;
line-height:1.2!important;
letter-spacing:.015em!important;
text-transform:none!important;
text-decoration:none!important;
transition:color .18s ease!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit::after{
content:" →"!important;
display:inline!important;
margin-left:2px!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit::before{
content:""!important;
position:absolute!important;
left:0!important;
right:0!important;
bottom:0!important;
height:1px!important;
background:#111!important;
transform:scaleX(.28)!important;
transform-origin:left!important;
transition:transform .18s ease,background-color .18s ease!important;
}
@media (hover:hover){
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit:hover{
background:transparent!important;
border:0!important;
color:#8a681d!important;
-webkit-text-fill-color:#8a681d!important;
transform:none!important;
box-shadow:none!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit:hover::before{
transform:scaleX(1)!important;
background:#b58a2a!important;
}
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit:active{
background:transparent!important;
color:#111!important;
-webkit-text-fill-color:#111!important;
transform:none!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit:focus-visible{
background:transparent!important;
color:#111!important;
-webkit-text-fill-color:#111!important;
outline:2px solid #777!important;
outline-offset:5px!important;
}
/* Mobile */
@media(max-width:760px){
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Addresses{
grid-template-columns:1fr!important;
gap:14px!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address{
min-height:0!important;
padding:24px 22px 68px!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title h2,
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title h3{
white-space:normal!important;
font-size:18px!important;
}
body.woocommerce-account.woocommerce-edit-address
.woocommerce-MyAccount-content
.woocommerce-Address-title a.edit{
left:22px!important;
bottom:22px!important;
min-height:44px!important;
display:inline-flex!important;
align-items:center!important;
}
}
/* =========================================================
ORILOM — LOYALTY CARD NUDGE V16.9
Animation premium très discrète pour attirer l'attention
sur "Programme fidélité" sans clignotement agressif.
Scope strict : dashboard Mon compte uniquement.
========================================================= */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty{
position:relative!important;
will-change:transform,box-shadow,border-color!important;
animation:orilom-loyalty-nudge 12s ease-in-out infinite!important;
transform-origin:center!important;
}
/* Petit halo interne très léger, visible uniquement pendant le nudge */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty::after{
content:""!important;
position:absolute!important;
inset:-1px!important;
border-radius:inherit!important;
pointer-events:none!important;
opacity:0!important;
box-shadow:0 0 0 0 rgba(184,143,0,0)!important;
animation:orilom-loyalty-glow 12s ease-in-out infinite!important;
}
/* L'icône fidélité reçoit un micro-accent, pas de rotation complète */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty
.orilom-dashboard-stat-icon{
animation:orilom-loyalty-icon 12s ease-in-out infinite!important;
transform-origin:center!important;
}
/*
0-3% : petit réveil au chargement
3-90% : repos total
90-94% : rappel discret
94-100%: retour à l'état normal
*/
@keyframes orilom-loyalty-nudge{
0%,3%,88%,100%{
transform:translateY(0) scale(1)!important;
box-shadow:none!important;
}
1.2%,90.5%{
transform:translateY(-2px) scale(1.008)!important;
box-shadow:0 10px 24px rgba(139,103,14,.10)!important;
}
2.2%,92.5%{
transform:translateY(0) scale(1)!important;
box-shadow:0 4px 12px rgba(139,103,14,.045)!important;
}
}
@keyframes orilom-loyalty-glow{
0%,3%,88%,100%{
opacity:0!important;
box-shadow:0 0 0 0 rgba(184,143,0,0)!important;
}
1.2%,90.5%{
opacity:1!important;
box-shadow:0 0 0 2px rgba(184,143,0,.18),0 0 22px rgba(184,143,0,.08)!important;
}
2.2%,92.5%{
opacity:.35!important;
box-shadow:0 0 0 1px rgba(184,143,0,.10),0 0 10px rgba(184,143,0,.04)!important;
}
}
@keyframes orilom-loyalty-icon{
0%,3%,88%,100%{
transform:translateY(0) scale(1)!important;
}
1.2%,90.5%{
transform:translateY(-1px) scale(1.06)!important;
}
2.2%,92.5%{
transform:translateY(0) scale(1)!important;
}
}
/* Quand l'utilisateur interagit, on arrête le rappel automatique :
le hover/focus existant garde la main. */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty:hover,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty:focus-visible,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty:hover::after,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty:focus-visible::after,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty:hover
.orilom-dashboard-stat-icon,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty:focus-visible
.orilom-dashboard-stat-icon{
animation-play-state:paused!important;
}
/* Accessibilité : aucune animation pour les utilisateurs
qui demandent une réduction des mouvements. */
@media (prefers-reduced-motion:reduce){
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty::after,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty
.orilom-dashboard-stat-icon{
animation:none!important;
transform:none!important;
}
}
/* =========================================================
ORILOM — LOYALTY NUDGE V17.0
Version JS-triggered : effet garanti, plus visible mais premium.
========================================================= */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty{
animation:none!important;
transition:
transform .34s cubic-bezier(.2,.8,.2,1),
box-shadow .34s ease,
border-color .34s ease,
background-color .34s ease!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty::after{
animation:none!important;
content:""!important;
position:absolute!important;
inset:-3px!important;
border-radius:14px!important;
pointer-events:none!important;
opacity:0!important;
border:1px solid rgba(184,143,0,0)!important;
box-shadow:0 0 0 rgba(184,143,0,0)!important;
transition:
opacity .34s ease,
border-color .34s ease,
box-shadow .34s ease!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty
.orilom-dashboard-stat-icon{
animation:none!important;
transition:transform .34s cubic-bezier(.2,.8,.2,1)!important;
}
/* état court ajouté par JS */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty.is-loyalty-nudge{
transform:translateY(-3px) scale(1.018)!important;
border-color:#c7a13c!important;
background:#fffaf0!important;
box-shadow:0 12px 28px rgba(126,92,7,.13)!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty.is-loyalty-nudge::after{
opacity:1!important;
border-color:rgba(184,143,0,.28)!important;
box-shadow:0 0 0 3px rgba(184,143,0,.08),0 0 26px rgba(184,143,0,.10)!important;
}
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty.is-loyalty-nudge
.orilom-dashboard-stat-icon{
transform:scale(1.13) rotate(-4deg)!important;
}
/* Respect accessibilité */
@media (prefers-reduced-motion:reduce){
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty::after,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty
.orilom-dashboard-stat-icon{
transition:none!important;
transform:none!important;
}
}
/* =========================================================
ORILOM — LOYALTY ICON WHITE V17.1
Icône Programme fidélité : fond blanc, propre et léger.
Override final volontaire pour ne pas impacter le reste.
========================================================= */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty
.orilom-dashboard-stat-icon{
background:#fff !important;
color:#9a7410 !important;
border:1px solid rgba(17,17,17,.08) !important;
box-shadow:0 2px 7px rgba(17,17,17,.045) !important;
}
/* Le fond reste blanc au hover/focus */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty:hover
.orilom-dashboard-stat-icon,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty:focus-visible
.orilom-dashboard-stat-icon{
background:#fff !important;
color:#8a681d !important;
border-color:rgba(184,143,0,.22) !important;
}
/* Pendant le nudge : uniquement un léger mouvement, jamais de fond noir */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-stat-loyalty.is-loyalty-nudge
.orilom-dashboard-stat-icon{
background:#fff !important;
color:#8a681d !important;
border-color:rgba(184,143,0,.24) !important;
}
/* =========================================================
ORILOM — TOMBOLA / ROUE DASHBOARD WHITE V17.2
Médaillon en haut à droite : fond blanc, sans disque noir.
========================================================= */
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-hero
.orilom-dashboard-hero-badge,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-hero
.orilom-dashboard-wheel,
body.woocommerce-account
.woocommerce-MyAccount-content
.orilom-account-dashboard
.orilom-dashboard-hero
[class*="wheel"]{
background:#fff !important;
border-color:rgba(184,143,0,.24) !important;
box-shadow:0 5px 16px rgba(17,17,17,.08) !important;
}
/* =========================================================
ORILOM — TOMBOLA WHITE BG V17.3
Fond du trigger + anneau interne en blanc.
Le noir disparaît, l'or reste uniquement en accent.
========================================================= */
body.woocommerce-account .orilom-tombola-trigger,
body.woocommerce-account .orilom-tombola-trigger.is-played{
background:#fff !important;
border-color:rgba(184,143,0,.42) !important;
color:#111 !important;
box-shadow:
0 8px 20px rgba(0,0,0,.08),
0 0 0 3px rgba(223,185,19,.05) !important;
}
body.woocommerce-account .orilom-tombola-trigger:hover,
body.woocommerce-account .orilom-tombola-trigger:focus-visible,
body.woocommerce-account .orilom-tombola-trigger.is-played:hover,
body.woocommerce-account .orilom-tombola-trigger.is-played:focus-visible{
background:#fff !important;
border-color:#b88f00 !important;
color:#111 !important;
box-shadow:
0 10px 24px rgba(0,0,0,.10),
0 0 0 4px rgba(223,185,19,.07) !important;
}
body.woocommerce-account .orilom-tombola-trigger-ring,
body.woocommerce-account .orilom-tombola-trigger.is-played .orilom-tombola-trigger-ring{
background:#fff !important;
border-color:rgba(184,143,0,.34) !important;
}
body.woocommerce-account .orilom-tombola-trigger-ring svg{
stroke:#9a7410 !important;
}
body.woocommerce-account .orilom-tombola-trigger.is-played .orilom-tombola-trigger-ring svg{
stroke:#9a7410 !important;
}
body.woocommerce-account .orilom-tombola-trigger-ring::after,
body.woocommerce-account .orilom-tombola-trigger.is-played .orilom-tombola-trigger-ring::after{
border-color:rgba(184,143,0,.34) !important;
}
/* =========================================================
ORILOM — TOMBOLA POPUP LIGHT V17.5
Popup blanche premium : les éléments auparavant blancs
deviennent noirs pour conserver le contraste.
========================================================= */
.orilom-wheel-modal{
background:linear-gradient(180deg,#ffffff 0%,#fbfaf6 100%) !important;
color:#111 !important;
border-color:rgba(184,143,0,.42) !important;
box-shadow:0 28px 80px rgba(0,0,0,.22),0 0 45px rgba(223,185,19,.08) !important;
}
.orilom-wheel-modal::before{border-color:rgba(17,17,17,.06) !important}
.orilom-wheel-copy h2{color:#111 !important;text-shadow:none !important}
.orilom-wheel-intro{color:#6f6f6f !important}
.orilom-wheel-kicker{background:#fffaf0 !important;color:#8a681d !important}
.orilom-wheel-close{background:#fff !important;color:#111 !important;border-color:#ddd !important}
.orilom-wheel-close:hover{background:#111 !important;color:#fff !important;border-color:#111 !important}
.orilom-wheel-result{border-top-color:#e7e7e7 !important}
.orilom-wheel-result > p{color:#666 !important}
.orilom-wheel-result > span{color:#80671d !important}
.orilom-wheel-code{background:#fff !important}
.orilom-wheel-code code{color:#111 !important}
.orilom-wheel-legal,.orilom-wheel-result small{color:#777 !important}
/* Roue : remplace les secteurs noirs par blanc/crème,
et les textes qui étaient blancs deviennent noirs. */
.orilom-wheel-disc{
background:conic-gradient(
from -30deg,
#ffffff 0deg 60deg,
#d7b124 60deg 120deg,
#f7f4eb 120deg 180deg,
#f0d253 180deg 240deg,
#ffffff 240deg 300deg,
#b88f00 300deg 360deg
) !important;
box-shadow:inset 0 0 0 4px rgba(255,255,255,.65),inset 0 0 35px rgba(0,0,0,.08),0 0 0 6px #fff,0 0 0 7px rgba(223,185,19,.32),0 18px 38px rgba(0,0,0,.16),0 0 30px rgba(223,185,19,.12) !important;
}
.orilom-wheel-disc::after{
background:radial-gradient(circle at 35% 30%,#fff,#f3efe2 72%) !important;
box-shadow:0 0 0 5px rgba(255,255,255,.75),0 0 0 7px rgba(184,143,0,.35),0 0 18px rgba(223,185,19,.22) !important;
}
.orilom-wheel-center{color:#9a7410 !important;text-shadow:none !important}
.orilom-wheel-label,
.orilom-wheel-label.label-1,
.orilom-wheel-label.label-2,
.orilom-wheel-label.label-3,
.orilom-wheel-label.label-4,
.orilom-wheel-label.label-5,
.orilom-wheel-label.label-6,
.orilom-wheel-dynamic-label,
.orilom-wheel-dynamic-label > span{
color:#111 !important;
text-shadow:none !important;
}
.orilom-wheel-spin,.orilom-wheel-shop{
background:#111 !important;
color:#fff !important;
border-color:#111 !important;
box-shadow:0 8px 20px rgba(0,0,0,.10) !important;
}
.orilom-wheel-spin:hover,.orilom-wheel-shop:hover{
background:#262626 !important;
color:#fff !important;
border-color:#262626 !important;
box-shadow:0 8px 22px rgba(0,0,0,.14) !important;
}
/* =========================================================
ORILOM — BARRE OR BRONZE PROFOND V1
Noir + blanc + or bronze premium
Cible uniquement les barres structurelles.
========================================================= */
html body.woocommerce-account .orilom-account-breadcrumb-bar,
.single-product .lux-product-bar{
background:#C69A18 !important;
color:#17130A !important;
}
html body.woocommerce-account .orilom-account-bar-meta,
html body.woocommerce-account .orilom-account-breadcrumb-link,
html body.woocommerce-account .orilom-account-breadcrumb-current,
html body.woocommerce-account .orilom-account-breadcrumb-separator,
.single-product .lux-product-bar a,
.single-product .lux-product-bar .lux-product-nav{
color:#17130A !important;
}
html body.woocommerce-account .orilom-account-breadcrumb-link:hover,
.single-product .lux-product-bar a:hover{
color:#000 !important;
}
/* =========================================================
ORILOM — PALETTE FINALE + APPBAR PREMIUM V1
Noir profond + blanc + or bronze #C69A18
Header clair, topbar noire, accents bronze.
========================================================= */
:root{
--orilom-bronze:#C69A18;
--orilom-bronze-dark:#A77D0B;
--orilom-ink:#17130A;
--orilom-black:#0C0C0C;
--orilom-ivory:#FCFBF8;
--orilom-line:#E7E3DA;
}
/* ---------- TOPBAR : rappel direct du footer ---------- */
html body .lux-topline{
background:var(--orilom-black)!important;
color:#F5F2EA!important;
padding:8px 20px!important;
min-height:28px!important;
font-size:10px!important;
line-height:1.2!important;
font-weight:600!important;
letter-spacing:.03em!important;
border:0!important;
}
/* ---------- HEADER PRINCIPAL : clair, rassurant ---------- */
html body .site-header.lux-header{
background:#fff!important;
border:0!important;
box-shadow:none!important;
}
html body .lux-header-main{
background:#fff!important;
}
/* Signature ORILOM */
html body .lux-brand small{
color:var(--orilom-bronze)!important;
}
/* ---------- BOUTON COLLECTIONS : reste noir ---------- */
html body .lux-brands{
background:#111!important;
color:#fff!important;
border:1px solid #111!important;
box-shadow:0 4px 12px rgba(0,0,0,.05)!important;
}
html body .lux-brands:hover{
background:#1d1d1d!important;
}
/* ---------- RECHERCHE : fonctionnelle, pas dorée ---------- */
html body .lux-search{
background:#fff!important;
border:1px solid #DDD9D0!important;
border-radius:10px!important;
transition:border-color .16s ease,box-shadow .16s ease!important;
}
html body .lux-search:focus-within{
border-color:var(--orilom-bronze)!important;
box-shadow:0 0 0 2px rgba(198,154,24,.08)!important;
}
html body .lux-search select{
border-right:1px solid var(--orilom-line)!important;
}
/* ---------- FAVORIS / PANIER : compteur bronze ---------- */
html body .lux-header .wishlist-count,
html body .lux-header .cart-count{
background:var(--orilom-bronze)!important;
color:#111!important;
}
/* Le panier reste noir = CTA fort */
html body .lux-header .header-tools > .cart-link{
background:#111!important;
border-color:#111!important;
color:#fff!important;
}
html body .lux-header .header-tools > .cart-link:hover{
background:var(--orilom-bronze)!important;
border-color:var(--orilom-bronze)!important;
color:#111!important;
}
/* ---------- NAV PRINCIPALE ---------- */
html body .lux-nav{
background:#fff!important;
border-top:1px solid #EEECE7!important;
border-bottom:1px solid #EEECE7!important;
box-shadow:none!important;
}
html body .lux-nav a{
position:relative!important;
color:#111!important;
transition:color .16s ease!important;
}
html body .lux-nav a:hover,
html body .lux-nav .current-menu-item > a,
html body .lux-nav .current-menu-ancestor > a{
color:var(--orilom-bronze-dark)!important;
}
/* trait bronze discret au hover/actif */
html body .lux-nav a::after{
content:""!important;
position:absolute!important;
left:50%!important;
bottom:-7px!important;
width:0!important;
height:2px!important;
background:var(--orilom-bronze)!important;
transform:translateX(-50%)!important;
transition:width .16s ease!important;
}
html body .lux-nav a:hover::after,
html body .lux-nav .current-menu-item > a::after,
html body .lux-nav .current-menu-ancestor > a::after{
width:22px!important;
}
/* ---------- BARRES STRUCTURELLES OR BRONZE ---------- */
/* Mon compte */
html body.woocommerce-account .orilom-account-breadcrumb-bar{
background:var(--orilom-bronze)!important;
color:var(--orilom-ink)!important;
}
html body.woocommerce-account .orilom-account-bar-meta,
html body.woocommerce-account .orilom-account-breadcrumb-link,
html body.woocommerce-account .orilom-account-breadcrumb-current,
html body.woocommerce-account .orilom-account-breadcrumb-separator{
color:var(--orilom-ink)!important;
}
/* Boutique / catégories / tags / recherche */
body.woocommerce-shop .orilom-shop-breadcrumb-bar,
body.post-type-archive-product .orilom-shop-breadcrumb-bar,
body.tax-product_cat .orilom-shop-breadcrumb-bar,
body.tax-product_tag .orilom-shop-breadcrumb-bar,
body.search.post-type-archive-product .orilom-shop-breadcrumb-bar,
body.search.woocommerce .orilom-shop-breadcrumb-bar,
body.tax-product_brand .orilom-shop-breadcrumb-bar{
background:var(--orilom-bronze)!important;
color:var(--orilom-ink)!important;
}
.orilom-shop-breadcrumb-link,
.orilom-shop-breadcrumb-link.is-current,
.orilom-shop-breadcrumb-chevron,
.orilom-shop-bar-meta{
color:var(--orilom-ink)!important;
}
a.orilom-shop-breadcrumb-link:hover{
color:#000!important;
}
/* Fiche produit */
body.single-product .orilom-product-breadcrumb-bar,
body.single-product .lux-product-bar{
background:var(--orilom-bronze)!important;
color:var(--orilom-ink)!important;
}
body.single-product .orilom-product-breadcrumb-bar a,
body.single-product .orilom-product-breadcrumb-bar .orilom-product-current,
body.single-product .orilom-product-breadcrumb-bar .lux-product-nav,
body.single-product .lux-product-bar a,
body.single-product .lux-product-bar .lux-product-nav{
color:var(--orilom-ink)!important;
}
body.single-product .orilom-product-breadcrumb-bar a:hover,
body.single-product .lux-product-bar a:hover{
color:#000!important;
}
/* ---------- RESPONSIVE ---------- */
@media(max-width:780px){
html body .lux-topline{
padding:7px 14px!important;
min-height:26px!important;
font-size:9px!important;
}
html body .lux-nav a::after{
display:none!important;
}
html body .lux-search{
border-radius:8px!important;
}
}
/* =========================================================
ORILOM — ACCOUNT NAV + HEADER DROPDOWN PREMIUM V16
========================================================= */
.lux-header .header-tools .orilom-account-dropdown{
width:252px !important;
padding:10px !important;
border-color:#E7E3DA !important;
box-shadow:0 18px 45px rgba(0,0,0,.09) !important;
}
.lux-header .header-tools .orilom-account-dropdown a{
min-height:40px !important;
gap:11px !important;
padding:0 11px !important;
color:#17130A !important;
}
.lux-header .header-tools .orilom-account-dropdown a:hover{
background:#FCF8ED !important;
color:#17130A !important;
}
.lux-header .header-tools .orilom-account-dropdown .orilom-menu-icon,
.woocommerce-account .woocommerce-MyAccount-navigation .orilom-menu-icon{
width:16px !important;height:16px !important;min-width:16px !important;
display:inline-flex !important;align-items:center !important;justify-content:center !important;
color:#6F6A61 !important;flex:0 0 16px !important;
}
.lux-header .header-tools .orilom-account-dropdown .orilom-menu-icon svg,
.woocommerce-account .woocommerce-MyAccount-navigation .orilom-menu-icon svg{
width:16px !important;height:16px !important;stroke-width:1.7 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a{
display:flex !important;align-items:center !important;gap:11px !important;
min-height:42px !important;padding:0 12px !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover{
background:#FCF8ED !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{
background:#111 !important;color:#fff !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a .orilom-menu-icon{
color:#D8B44A !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout{
margin-top:8px !important;padding-top:8px !important;border-top:1px solid #E7E3DA !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a{color:#7B3030 !important;}
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a:hover{
background:#FFF7F6 !important;color:#9A2525 !important;
}
.lux-header .header-tools .orilom-account-menu > a.orilom-account-link:hover,
.lux-header .header-tools .orilom-account-menu.is-open > a.orilom-account-link{
background:#FCF8ED !important;border-color:#C69A18 !important;
}
@media(max-width:720px){
.lux-header .header-tools .orilom-account-dropdown{
max-height:min(620px,calc(100vh - 28px)) !important;overflow:auto !important;
}
}
/* =========================================================
ORILOM — NAVBAR / BOUTIQUE V18 SAFE
Ajout uniquement à la fin de l'ancien theme.css.
Palette demandée :
Meilleures ventes = mauve
Promotions = rouge
========================================================= */
:root{
--orilom-bronze:#C69A18;
--orilom-mauve:#7657A8;
--orilom-mauve-soft:#F5F0FA;
--orilom-mauve-line:#D8C9E8;
--orilom-red:#B42318;
--orilom-red-soft:#FFF1F0;
--orilom-red-line:#F2C4BF;
}
/* Gros bouton noir = BOUTIQUE */
body .orilom-collections-trigger,
body .lux-brands.orilom-collections-trigger{
background:#0C0C0C !important;
color:#fff !important;
}
/* -------------------------
Menu déroulant BOUTIQUE
------------------------- */
body .orilom-collections-shortcuts{
display:flex !important;
align-items:center !important;
flex-wrap:wrap !important;
gap:6px !important;
}
body .orilom-collections-shortcuts > a{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:30px !important;
padding:0 11px !important;
border:1px solid #E7E3DA !important;
border-radius:7px !important;
background:#FAFAF9 !important;
color:#17130A !important;
font-size:9px !important;
font-weight:800 !important;
line-height:1 !important;
letter-spacing:.02em !important;
white-space:nowrap !important;
transition:background-color .18s ease,border-color .18s ease,color .18s ease !important;
}
body .orilom-collections-shortcuts > a:hover{
border-color:#C69A18 !important;
background:#FCF8ED !important;
}
/* Meilleures ventes = MAUVE */
body .orilom-collections-shortcuts > a.orilom-link-bestsellers{
color:var(--orilom-mauve) !important;
background:var(--orilom-mauve-soft) !important;
border-color:var(--orilom-mauve-line) !important;
}
body .orilom-collections-shortcuts > a.orilom-link-bestsellers:hover{
color:#5D408D !important;
background:#EEE5F6 !important;
border-color:#BFA9D5 !important;
}
/* Promotions = ROUGE */
body .orilom-collections-shortcuts > a.orilom-link-promotions{
color:var(--orilom-red) !important;
background:var(--orilom-red-soft) !important;
border-color:var(--orilom-red-line) !important;
}
body .orilom-collections-shortcuts > a.orilom-link-promotions:hover{
color:#8F1B13 !important;
background:#FFE5E2 !important;
border-color:#E49B94 !important;
}
/* -------------------------
APP BAR / navbar horizontale
------------------------- */
body .lux-nav .orilom-primary-nav{
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:42px !important;
min-height:64px !important;
margin:0 !important;
padding:0 !important;
list-style:none !important;
}
body .lux-nav .orilom-primary-nav > li{
position:relative !important;
margin:0 !important;
padding:0 !important;
list-style:none !important;
}
body .lux-nav .orilom-primary-nav > li > a{
position:relative !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:64px !important;
padding:0 !important;
color:#17130A !important;
white-space:nowrap !important;
font-size:12px !important;
line-height:1 !important;
font-weight:700 !important;
letter-spacing:.01em !important;
text-transform:uppercase !important;
}
/* Underline bronze par défaut */
body .lux-nav .orilom-primary-nav > li > a::after{
content:"" !important;
position:absolute !important;
left:50% !important;
bottom:12px !important;
width:0 !important;
height:2px !important;
background:var(--orilom-bronze) !important;
transform:translateX(-50%) !important;
transition:width .18s ease !important;
}
body .lux-nav .orilom-primary-nav > li > a:hover::after,
body .lux-nav .orilom-primary-nav > li > a:focus-visible::after{
width:22px !important;
}
/* Meilleures ventes = MAUVE aussi dans l'app bar */
body .lux-nav .orilom-primary-nav > li > a.orilom-link-bestsellers{
color:var(--orilom-mauve) !important;
}
body .lux-nav .orilom-primary-nav > li > a.orilom-link-bestsellers::after{
background:var(--orilom-mauve) !important;
}
/* Promotions = ROUGE aussi dans l'app bar */
body .lux-nav .orilom-primary-nav > li > a.orilom-link-promotions{
color:var(--orilom-red) !important;
}
body .lux-nav .orilom-primary-nav > li > a.orilom-link-promotions::after{
background:var(--orilom-red) !important;
}
/* Responsive : ne change pas le comportement mobile historique */
@media(max-width:1100px){
body .lux-nav .orilom-primary-nav{
gap:22px !important;
}
}
@media(max-width:780px){
body .lux-nav .orilom-primary-nav{
min-height:auto !important;
align-items:stretch !important;
gap:0 !important;
}
body .lux-nav .orilom-primary-nav > li > a{
width:100% !important;
min-height:44px !important;
justify-content:flex-start !important;
}
body .lux-nav .orilom-primary-nav > li > a::after{
display:none !important;
}
}
/* =========================================================
ORILOM — CART DRAWER PREMIUM V20
Ajout isolé : n'altère pas la page panier WooCommerce.
========================================================= */
html.orilom-cart-drawer-open,
body.orilom-cart-drawer-open{
overflow:hidden !important;
}
.orilom-cart-drawer{
position:fixed !important;
inset:0 !important;
z-index:999999 !important;
pointer-events:none !important;
visibility:hidden !important;
}
.orilom-cart-drawer.is-open{
pointer-events:auto !important;
visibility:visible !important;
}
.orilom-cart-drawer-overlay{
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
border-radius:0 !important;
background:rgba(12,12,12,.44) !important;
opacity:0 !important;
cursor:pointer !important;
transition:opacity .26s ease !important;
backdrop-filter:blur(1.5px);
-webkit-backdrop-filter:blur(1.5px);
}
.orilom-cart-drawer.is-open .orilom-cart-drawer-overlay{
opacity:1 !important;
}
.orilom-cart-drawer-panel{
position:absolute !important;
top:0 !important;
right:0 !important;
bottom:0 !important;
width:min(460px,100vw) !important;
display:flex !important;
flex-direction:column !important;
margin:0 !important;
padding:0 !important;
overflow:hidden !important;
background:#fff !important;
color:#17130A !important;
box-shadow:-28px 0 70px rgba(0,0,0,.15) !important;
transform:translate3d(100%,0,0) !important;
transition:transform .28s cubic-bezier(.22,.61,.36,1) !important;
outline:0 !important;
}
.orilom-cart-drawer.is-open .orilom-cart-drawer-panel{
transform:translate3d(0,0,0) !important;
}
.orilom-cart-drawer.is-updating .orilom-cart-drawer-panel::after{
content:"" !important;
position:absolute !important;
inset:0 !important;
z-index:20 !important;
background:rgba(255,255,255,.58) !important;
cursor:progress !important;
}
.orilom-cart-drawer-head{
position:relative !important;
flex:0 0 auto !important;
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:18px !important;
min-height:98px !important;
padding:22px 24px 20px !important;
border-bottom:1px solid #E7E3DA !important;
background:#fff !important;
}
.orilom-cart-drawer-kicker{
display:block !important;
margin:0 0 6px !important;
color:#C69A18 !important;
font-size:9px !important;
line-height:1 !important;
font-weight:900 !important;
letter-spacing:.18em !important;
}
.orilom-cart-drawer-head h2{
margin:0 !important;
color:#17130A !important;
font:700 28px/1.05 Georgia,serif !important;
letter-spacing:-.02em !important;
}
.orilom-cart-drawer-close{
flex:0 0 42px !important;
width:42px !important;
height:42px !important;
display:grid !important;
place-items:center !important;
margin:0 !important;
padding:0 !important;
border:1px solid #E7E3DA !important;
border-radius:50% !important;
background:#fff !important;
color:#17130A !important;
cursor:pointer !important;
transition:border-color .18s ease,background .18s ease,transform .18s ease !important;
}
.orilom-cart-drawer-close:hover{
border-color:#C69A18 !important;
background:#FCF8ED !important;
transform:rotate(3deg) !important;
}
.orilom-cart-drawer-close svg{
width:18px !important;
height:18px !important;
fill:none !important;
stroke:currentColor !important;
stroke-width:1.7 !important;
stroke-linecap:round !important;
}
.orilom-cart-drawer-form{
min-height:0 !important;
flex:1 1 auto !important;
overflow:auto !important;
overscroll-behavior:contain !important;
scrollbar-width:thin !important;
scrollbar-color:#D8D1C4 transparent !important;
}
.orilom-cart-drawer-items{
padding:0 24px !important;
}
.orilom-cart-drawer-item{
display:grid !important;
grid-template-columns:92px minmax(0,1fr) !important;
gap:16px !important;
padding:22px 0 !important;
border-bottom:1px solid #EEEAE2 !important;
}
.orilom-cart-drawer-thumb{
display:block !important;
width:92px !important;
height:104px !important;
overflow:hidden !important;
border:1px solid #EEEAE2 !important;
border-radius:10px !important;
background:#FAFAF8 !important;
}
.orilom-cart-drawer-thumb img{
display:block !important;
width:100% !important;
height:100% !important;
margin:0 !important;
object-fit:contain !important;
background:#fff !important;
}
.orilom-cart-drawer-item-main{
min-width:0 !important;
display:flex !important;
flex-direction:column !important;
justify-content:space-between !important;
gap:14px !important;
}
.orilom-cart-drawer-item-top{
display:flex !important;
align-items:flex-start !important;
justify-content:space-between !important;
gap:12px !important;
}
.orilom-cart-drawer-product-copy{
min-width:0 !important;
}
.orilom-cart-drawer-product-name{
display:block !important;
margin:1px 0 6px !important;
color:#17130A !important;
font-size:11px !important;
line-height:1.45 !important;
font-weight:800 !important;
text-transform:uppercase !important;
letter-spacing:.015em !important;
}
.orilom-cart-drawer-product-copy .variation{
margin:0 !important;
color:#787066 !important;
font-size:9px !important;
line-height:1.4 !important;
}
.orilom-cart-drawer-product-copy .variation dt,
.orilom-cart-drawer-product-copy .variation dd,
.orilom-cart-drawer-product-copy .variation p{
display:inline !important;
float:none !important;
margin:0 !important;
padding:0 !important;
}
.orilom-cart-drawer-remove{
flex:0 0 30px !important;
width:30px !important;
height:30px !important;
display:grid !important;
place-items:center !important;
border-radius:50% !important;
color:#8A8177 !important;
background:transparent !important;
transition:color .18s ease,background .18s ease !important;
}
.orilom-cart-drawer-remove:hover{
color:#B42318 !important;
background:#FFF1F0 !important;
}
.orilom-cart-drawer-remove svg{
width:15px !important;
height:15px !important;
fill:none !important;
stroke:currentColor !important;
stroke-width:1.55 !important;
stroke-linecap:round !important;
stroke-linejoin:round !important;
}
.orilom-cart-drawer-item-bottom{
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:12px !important;
}
.orilom-cart-drawer-qty{
display:grid !important;
grid-template-columns:30px 34px 30px !important;
height:34px !important;
border:1px solid #DED8CE !important;
border-radius:8px !important;
overflow:hidden !important;
background:#fff !important;
}
.orilom-cart-drawer-qty-btn{
width:30px !important;
height:32px !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
border-radius:0 !important;
background:#fff !important;
color:#17130A !important;
font-size:16px !important;
line-height:1 !important;
cursor:pointer !important;
}
.orilom-cart-drawer-qty-btn:hover{
background:#FCF8ED !important;
}
.orilom-cart-drawer-qty-input{
width:34px !important;
height:32px !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
border-left:1px solid #EEEAE2 !important;
border-right:1px solid #EEEAE2 !important;
border-radius:0 !important;
outline:0 !important;
background:#fff !important;
color:#17130A !important;
text-align:center !important;
font-size:11px !important;
font-weight:800 !important;
appearance:textfield !important;
-moz-appearance:textfield !important;
}
.orilom-cart-drawer-qty-input::-webkit-outer-spin-button,
.orilom-cart-drawer-qty-input::-webkit-inner-spin-button{
margin:0 !important;
-webkit-appearance:none !important;
}
.orilom-cart-drawer-line-total{
color:#17130A !important;
font-size:12px !important;
font-weight:900 !important;
white-space:nowrap !important;
}
.orilom-cart-drawer-summary{
flex:0 0 auto !important;
padding:20px 24px 24px !important;
border-top:1px solid #E7E3DA !important;
background:#fff !important;
box-shadow:0 -10px 28px rgba(20,17,12,.035) !important;
}
.orilom-cart-drawer-subtotal{
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:20px !important;
margin-bottom:14px !important;
}
.orilom-cart-drawer-subtotal span{
color:#5E574F !important;
font-size:12px !important;
font-weight:700 !important;
}
.orilom-cart-drawer-subtotal strong{
color:#17130A !important;
font-size:18px !important;
font-weight:900 !important;
}
.orilom-cart-drawer-reassurance{
display:grid !important;
grid-template-columns:1fr 1fr !important;
gap:8px !important;
margin:0 0 16px !important;
}
.orilom-cart-drawer-reassurance span{
min-width:0 !important;
display:flex !important;
align-items:center !important;
gap:6px !important;
padding:9px 8px !important;
border:1px solid #EEE9DE !important;
border-radius:8px !important;
background:#FCFAF5 !important;
color:#6B6257 !important;
font-size:8px !important;
line-height:1.3 !important;
font-weight:700 !important;
}
.orilom-cart-drawer-reassurance svg{
flex:0 0 14px !important;
width:14px !important;
height:14px !important;
fill:none !important;
stroke:#C69A18 !important;
stroke-width:1.6 !important;
stroke-linecap:round !important;
stroke-linejoin:round !important;
}
.orilom-cart-drawer-checkout{
min-height:52px !important;
width:100% !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
margin:0 !important;
padding:0 18px !important;
border:1px solid #0C0C0C !important;
border-radius:6px !important;
background:#0C0C0C !important;
color:#fff !important;
font-size:10px !important;
line-height:1 !important;
font-weight:900 !important;
letter-spacing:.10em !important;
text-align:center !important;
transition:background .18s ease,border-color .18s ease,color .18s ease !important;
}
.orilom-cart-drawer-checkout:hover{
border-color:#C69A18 !important;
background:#C69A18 !important;
color:#17130A !important;
}
.orilom-cart-drawer-view{
min-height:42px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
margin:7px 0 0 !important;
padding:0 15px !important;
color:#6C6257 !important;
font-size:9px !important;
line-height:1 !important;
font-weight:800 !important;
letter-spacing:.06em !important;
text-decoration:underline !important;
text-underline-offset:3px !important;
}
.orilom-cart-drawer-view:hover{
color:#17130A !important;
}
/* Panier vide */
.orilom-cart-drawer-empty{
min-height:0 !important;
flex:1 1 auto !important;
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
padding:54px 32px !important;
text-align:center !important;
}
.orilom-cart-drawer-empty-icon{
width:68px !important;
height:68px !important;
display:grid !important;
place-items:center !important;
margin:0 0 22px !important;
border:1px solid #E9DDAE !important;
border-radius:50% !important;
background:#FFFBEF !important;
color:#C69A18 !important;
box-shadow:0 0 0 7px #FCF8ED !important;
}
.orilom-cart-drawer-empty-icon svg{
width:27px !important;
height:27px !important;
fill:none !important;
stroke:currentColor !important;
stroke-width:1.5 !important;
stroke-linejoin:round !important;
}
.orilom-cart-drawer-empty strong{
display:block !important;
margin:0 0 9px !important;
color:#17130A !important;
font:700 25px/1.1 Georgia,serif !important;
}
.orilom-cart-drawer-empty p{
max-width:300px !important;
margin:0 0 24px !important;
color:#746C63 !important;
font-size:11px !important;
line-height:1.7 !important;
}
.orilom-cart-drawer-shop{
min-height:48px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
padding:0 24px !important;
border-radius:6px !important;
background:#0C0C0C !important;
color:#fff !important;
font-size:9px !important;
font-weight:900 !important;
letter-spacing:.09em !important;
}
/* Mobile : presque plein écran */
@media(max-width:600px){
.orilom-cart-drawer-panel{
width:min(94vw,430px) !important;
}
.orilom-cart-drawer-head{
min-height:82px !important;
padding:18px 18px 16px !important;
}
.orilom-cart-drawer-head h2{
font-size:25px !important;
}
.orilom-cart-drawer-items{
padding:0 18px !important;
}
.orilom-cart-drawer-item{
grid-template-columns:82px minmax(0,1fr) !important;
gap:13px !important;
padding:18px 0 !important;
}
.orilom-cart-drawer-thumb{
width:82px !important;
height:94px !important;
}
.orilom-cart-drawer-summary{
padding:17px 18px 19px !important;
}
.orilom-cart-drawer-reassurance{
grid-template-columns:1fr !important;
}
}
@media(prefers-reduced-motion:reduce){
.orilom-cart-drawer-overlay,
.orilom-cart-drawer-panel{
transition:none !important;
}
}
/* =========================================================
ORILOM — CART DRAWER PREMIUM V21
Décision UX : ~50% écran desktop.
La page panier vide reste uniquement un fallback minimal.
========================================================= */
/* Drawer plus généreux : premium sans envahir 2/3 de l'écran */
@media(min-width:901px){
body .orilom-cart-drawer-panel{
width:clamp(560px,50vw,880px) !important;
}
/* Avec plus d'espace, on respire davantage autour des produits */
body .orilom-cart-drawer-head{
padding-left:30px !important;
padding-right:30px !important;
}
body .orilom-cart-drawer-items{
padding-left:30px !important;
padding-right:30px !important;
}
body .orilom-cart-drawer-item{
grid-template-columns:108px minmax(0,1fr) !important;
gap:20px !important;
padding-top:24px !important;
padding-bottom:24px !important;
}
body .orilom-cart-drawer-thumb{
width:108px !important;
height:122px !important;
}
body .orilom-cart-drawer-product-name{
max-width:520px !important;
font-size:12px !important;
line-height:1.5 !important;
}
body .orilom-cart-drawer-summary{
padding-left:30px !important;
padding-right:30px !important;
padding-bottom:28px !important;
}
body .orilom-cart-drawer-reassurance{
gap:10px !important;
}
body .orilom-cart-drawer-reassurance span{
min-height:42px !important;
padding:10px 12px !important;
font-size:9px !important;
}
}
/* Tablette : drawer large, mais garde une partie de la boutique visible */
@media(min-width:601px) and (max-width:900px){
body .orilom-cart-drawer-panel{
width:82vw !important;
max-width:720px !important;
}
}
/* ---------------------------------------------------------
PANIER VIDE = fallback seulement.
On enlève la redondance maintenant que le drawer est principal.
--------------------------------------------------------- */
body.woocommerce-cart .orilom-empty-cart-secondary{
display:none !important;
}
body.woocommerce-cart .orilom-empty-cart-products{
display:none !important;
}
body.woocommerce-cart .orilom-empty-cart-hero{
max-width:680px !important;
margin:64px auto 72px !important;
}
body.woocommerce-cart .orilom-empty-cart-hero p{
max-width:500px !important;
}
body.woocommerce-cart .orilom-empty-cart-actions{
margin-top:26px !important;
}
body.woocommerce-cart .orilom-empty-cart-primary{
min-width:190px !important;
min-height:48px !important;
}
body.woocommerce-cart .site-footer{
margin-top:0 !important;
}
/* Mobile fallback compact */
@media(max-width:650px){
body.woocommerce-cart .orilom-empty-cart-hero{
margin:42px 18px 54px !important;
}
body.woocommerce-cart .orilom-empty-cart-primary{
width:min(100%,320px) !important;
}
}
/* ======================================================================
ORILOM — CHECKOUT LIVRAISON MINIMALISTE V22
Même langage visuel que Mon compte > Adresse principale.
====================================================================== */
body.woocommerce-checkout{
--orilom-checkout-ink:#17130A;
--orilom-checkout-line:#E4E0D8;
--orilom-checkout-muted:#746C63;
--orilom-checkout-bronze:#C69A18;
}
/* Le bloc livraison n'est plus une grosse carte : il devient une section nette. */
body.woocommerce-checkout .woocommerce-billing-fields{
position:relative !important;
margin:0 0 18px !important;
padding:27px 0 0 !important;
border:0 !important;
border-top:1px solid var(--orilom-checkout-line) !important;
border-radius:0 !important;
background:#fff !important;
box-shadow:none !important;
}
body.woocommerce-checkout .woocommerce-billing-fields::before{
content:"" !important;
position:absolute !important;
top:-1px !important;
left:0 !important;
width:46px !important;
height:2px !important;
background:#111 !important;
}
/* Titre comme dans le compte client. */
body.woocommerce-checkout .woocommerce-billing-fields > h3{
margin:0 0 5px !important;
color:var(--orilom-checkout-ink) !important;
font:700 22px/1.15 Arial,Helvetica,sans-serif !important;
letter-spacing:-.02em !important;
}
/* Petite phrase utile, sans ajouter de bloc lourd. */
body.woocommerce-checkout .woocommerce-billing-fields > h3::after{
content:"Une adresse claire nous aide à livrer votre commande rapidement." !important;
display:block !important;
margin-top:4px !important;
color:var(--orilom-checkout-muted) !important;
font:400 9px/1.45 Arial,Helvetica,sans-serif !important;
letter-spacing:0 !important;
}
/* Grille exactement pensée pour le Maroc / COD :
Nom + téléphone
Ville + quartier
Adresse complète
Repère optionnel */
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:13px 14px !important;
margin-top:18px !important;
}
body.woocommerce-checkout #billing_full_name_field,
body.woocommerce-checkout #billing_phone_field,
body.woocommerce-checkout #billing_city_field,
body.woocommerce-checkout #billing_neighborhood_field{
grid-column:auto !important;
}
body.woocommerce-checkout #billing_address_1_field,
body.woocommerce-checkout #billing_delivery_hint_field{
grid-column:1/-1 !important;
}
/* Les champs techniques hidden ne doivent jamais perturber la grille. */
body.woocommerce-checkout #billing_first_name_field,
body.woocommerce-checkout #billing_last_name_field,
body.woocommerce-checkout #billing_address_2_field,
body.woocommerce-checkout #billing_country_field,
body.woocommerce-checkout #billing_email_field{
display:none !important;
}
/* Labels français nets. */
body.woocommerce-checkout .woocommerce-billing-fields .form-row label{
margin:0 0 7px !important;
color:#29251F !important;
font-size:9px !important;
line-height:1.2 !important;
font-weight:700 !important;
}
body.woocommerce-checkout .woocommerce-billing-fields .required{
color:#B42318 !important;
}
/* Inputs sobres, hauteur confortable, aucun look "formulaire administratif". */
body.woocommerce-checkout .woocommerce-billing-fields .input-text{
width:100% !important;
height:46px !important;
min-height:46px !important;
margin:0 !important;
padding:0 13px !important;
border:1px solid #D9D5CE !important;
border-radius:8px !important;
background:#fff !important;
color:var(--orilom-checkout-ink) !important;
font-size:10.5px !important;
line-height:44px !important;
box-shadow:none !important;
outline:0 !important;
transition:border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
}
body.woocommerce-checkout .woocommerce-billing-fields .input-text::placeholder{
color:#9A948C !important;
opacity:1 !important;
}
body.woocommerce-checkout .woocommerce-billing-fields .input-text:focus{
border-color:#111 !important;
background:#fff !important;
box-shadow:0 0 0 3px rgba(17,17,17,.045) !important;
}
/* Une seule adresse : on supprime la seconde adresse et les notes redondantes. */
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout .shipping_address,
body.woocommerce-checkout #ship-to-different-address,
body.woocommerce-checkout .woocommerce-additional-fields{
display:none !important;
}
/* Le deuxième wrapper WooCommerce ne doit plus créer de "carte" vide. */
body.woocommerce-checkout #customer_details .col-2{
display:none !important;
}
/* Le formulaire de gauche devient plus aéré sans agrandir la page. */
body.woocommerce-checkout #customer_details{
padding-top:2px !important;
}
/* Mobile : une colonne, identique au compte. */
@media(max-width:650px){
body.woocommerce-checkout .woocommerce-billing-fields{
padding:24px 0 0 !important;
}
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper{
grid-template-columns:1fr !important;
gap:12px !important;
}
body.woocommerce-checkout #billing_full_name_field,
body.woocommerce-checkout #billing_phone_field,
body.woocommerce-checkout #billing_city_field,
body.woocommerce-checkout #billing_neighborhood_field,
body.woocommerce-checkout #billing_address_1_field,
body.woocommerce-checkout #billing_delivery_hint_field{
grid-column:1 !important;
}
body.woocommerce-checkout .woocommerce-billing-fields > h3{
font-size:20px !important;
}
}
/* ======================================================================
ORILOM — CHECKOUT FR + COUPON V23
====================================================================== */
body.woocommerce-checkout .woocommerce-remove-coupon,
body.woocommerce-checkout .woocommerce-remove-coupon-link{
display:inline-flex !important;
align-items:center !important;
margin-left:6px !important;
padding:2px 5px !important;
border:0 !important;
border-radius:4px !important;
background:#FFF1F0 !important;
color:#B42318 !important;
font-size:8px !important;
line-height:1.4 !important;
font-weight:800 !important;
text-decoration:none !important;
cursor:pointer !important;
}
body.woocommerce-checkout .woocommerce-remove-coupon:hover,
body.woocommerce-checkout .woocommerce-remove-coupon-link:hover{
background:#FFE4E1 !important;
color:#8F1B13 !important;
}
body.woocommerce-checkout #place_order{
text-transform:uppercase !important;
letter-spacing:.06em !important;
}
/* Le texte de confidentialité reste discret mais lisible. */
body.woocommerce-checkout .woocommerce-privacy-policy-text{
color:#746C63 !important;
font-size:8.5px !important;
line-height:1.55 !important;
}
/* ======================================================================
ORILOM — CHECKOUT UX V26
Panier cliquable + notices premium compactes.
====================================================================== */
/* Étape PANIER : vraie navigation retour */
body.woocommerce-checkout .orilom-checkout-steps .is-clickable{
cursor:pointer !important;
}
body.woocommerce-checkout .orilom-checkout-steps .orilom-step-link{
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
gap:7px !important;
color:inherit !important;
text-decoration:none !important;
cursor:pointer !important;
}
body.woocommerce-checkout .orilom-checkout-steps .orilom-step-link .orilom-step-dot{
transition:transform .18s ease, background-color .18s ease !important;
}
body.woocommerce-checkout .orilom-checkout-steps .orilom-step-link:hover .orilom-step-dot,
body.woocommerce-checkout .orilom-checkout-steps .orilom-step-link:focus-visible .orilom-step-dot{
transform:translateY(-2px) !important;
background:#C69A18 !important;
color:#17130A !important;
}
body.woocommerce-checkout .orilom-checkout-steps .orilom-step-link:hover strong,
body.woocommerce-checkout .orilom-checkout-steps .orilom-step-link:focus-visible strong{
color:#17130A !important;
}
/* Notice WooCommerce : plus de grande barre pleine largeur */
body.woocommerce-checkout .woocommerce-notices-wrapper{
width:min(100% - 32px, 1180px) !important;
margin:18px auto 0 !important;
padding:0 !important;
}
body.woocommerce-checkout .woocommerce-message{
position:relative !important;
width:min(100%, 560px) !important;
min-height:52px !important;
display:flex !important;
align-items:center !important;
margin:0 0 14px auto !important;
padding:14px 44px 14px 46px !important;
border:1px solid #E7E3DA !important;
border-top:1px solid #E7E3DA !important;
border-radius:10px !important;
background:#FFFCF5 !important;
color:#29251F !important;
box-shadow:0 12px 34px rgba(20,17,12,.08) !important;
font-size:11px !important;
line-height:1.45 !important;
font-weight:700 !important;
opacity:1 !important;
transform:translateY(0) !important;
transition:opacity .24s ease, transform .24s ease !important;
}
body.woocommerce-checkout .woocommerce-message::before{
content:"✓" !important;
position:absolute !important;
top:50% !important;
left:16px !important;
width:20px !important;
height:20px !important;
display:grid !important;
place-items:center !important;
border-radius:50% !important;
background:#17130A !important;
color:#fff !important;
font-size:10px !important;
font-weight:900 !important;
transform:translateY(-50%) !important;
}
body.woocommerce-checkout .woocommerce-message::after{
content:"" !important;
position:absolute !important;
top:0 !important;
left:0 !important;
width:3px !important;
height:100% !important;
border-radius:10px 0 0 10px !important;
background:#C69A18 !important;
}
body.woocommerce-checkout .woocommerce-message.orilom-notice-leaving{
opacity:0 !important;
transform:translateY(-7px) !important;
}
/* Les erreurs restent visibles : pas d'auto-hide, style distinct. */
body.woocommerce-checkout .woocommerce-error{
width:min(100%, 760px) !important;
margin:0 auto 16px !important;
padding:14px 18px 14px 44px !important;
border:1px solid #F2C4BF !important;
border-radius:10px !important;
background:#FFF7F6 !important;
color:#8F1B13 !important;
box-shadow:none !important;
font-size:11px !important;
line-height:1.5 !important;
}
/* Mobile */
@media(max-width:650px){
body.woocommerce-checkout .woocommerce-notices-wrapper{
width:calc(100% - 24px) !important;
margin-top:12px !important;
}
body.woocommerce-checkout .woocommerce-message{
width:100% !important;
margin:0 0 12px !important;
padding-right:16px !important;
}
}
/* ======================================================================
ORILOM — ACCOUNT NAV + DROPDOWN V27
Icônes partout + fidélité mise en avant de manière premium.
====================================================================== */
:root{
--orilom-loyalty:#B18412;
--orilom-loyalty-dark:#7E5D08;
--orilom-loyalty-bg:#FCF7E8;
--orilom-loyalty-line:#E9D58F;
}
/* ---------------------------
Mon compte : sidebar
--------------------------- */
body.woocommerce-account .woocommerce-MyAccount-navigation li a{
display:flex !important;
align-items:center !important;
gap:11px !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation .orilom-account-nav-icon{
flex:0 0 17px !important;
width:17px !important;
height:17px !important;
display:grid !important;
place-items:center !important;
color:#6E675E !important;
transition:color .18s ease !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation .orilom-account-nav-icon svg{
display:block !important;
width:16px !important;
height:16px !important;
stroke-width:1.55 !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation .orilom-account-nav-label{
min-width:0 !important;
flex:1 1 auto !important;
}
/* Item actif : icône blanche comme le libellé. */
body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active:not(.orilom-account-loyalty-nav) .orilom-account-nav-icon{
color:#fff !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li:not(.is-active):not(.orilom-account-loyalty-nav) a:hover .orilom-account-nav-icon{
color:#17130A !important;
}
/* Fidélité = raccourci stratégique, visible même lorsqu'il n'est pas actif. */
body.woocommerce-account .woocommerce-MyAccount-navigation li.orilom-account-loyalty-nav a{
position:relative !important;
color:var(--orilom-loyalty-dark) !important;
background:var(--orilom-loyalty-bg) !important;
border:1px solid var(--orilom-loyalty-line) !important;
border-radius:9px !important;
font-weight:800 !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li.orilom-account-loyalty-nav .orilom-account-nav-icon{
color:var(--orilom-loyalty) !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li.orilom-account-loyalty-nav a::after{
content:"★" !important;
flex:0 0 auto !important;
margin-left:auto !important;
color:var(--orilom-loyalty) !important;
font-size:9px !important;
line-height:1 !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li.orilom-account-loyalty-nav a:hover{
color:#5F4605 !important;
background:#F8EECF !important;
border-color:#D9B84D !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li.orilom-account-loyalty-nav.is-active a{
color:#17130A !important;
background:#E5BE36 !important;
border-color:#C69A18 !important;
box-shadow:0 7px 18px rgba(198,154,24,.14) !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation li.orilom-account-loyalty-nav.is-active .orilom-account-nav-icon,
body.woocommerce-account .woocommerce-MyAccount-navigation li.orilom-account-loyalty-nav.is-active a::after{
color:#17130A !important;
}
/* Déconnexion garde un signal distinct mais sobre. */
body.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a,
body.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout .orilom-account-nav-icon{
color:#9F2F2B !important;
}
/* ---------------------------
Header : dropdown Mon compte
même ordre / mêmes repères
--------------------------- */
.lux-header .orilom-account-dropdown > a{
display:flex !important;
align-items:center !important;
gap:10px !important;
}
.lux-header .orilom-account-dropdown .orilom-menu-icon{
flex:0 0 17px !important;
width:17px !important;
height:17px !important;
display:grid !important;
place-items:center !important;
}
.lux-header .orilom-account-dropdown .orilom-menu-icon svg{
width:16px !important;
height:16px !important;
stroke-width:1.55 !important;
}
/* Fidélité ressort aussi dans le menu rapide du header. */
.lux-header .orilom-account-dropdown > a.orilom-account-item--loyalty{
margin:3px 8px !important;
padding-left:10px !important;
padding-right:10px !important;
border:1px solid var(--orilom-loyalty-line) !important;
border-radius:8px !important;
background:var(--orilom-loyalty-bg) !important;
color:var(--orilom-loyalty-dark) !important;
font-weight:800 !important;
}
.lux-header .orilom-account-dropdown > a.orilom-account-item--loyalty .orilom-menu-icon{
color:var(--orilom-loyalty) !important;
}
.lux-header .orilom-account-dropdown > a.orilom-account-item--loyalty::after{
content:"★" !important;
margin-left:auto !important;
color:var(--orilom-loyalty) !important;
font-size:9px !important;
}
.lux-header .orilom-account-dropdown > a.orilom-account-item--loyalty:hover{
background:#F8EECF !important;
border-color:#D9B84D !important;
color:#5F4605 !important;
}
/* Factures légèrement séparées conceptuellement, sans créer de nouvelle section. */
.lux-header .orilom-account-dropdown > a.orilom-account-item--invoices{
color:#3D3933 !important;
}
/* Logout reste en bas et rouge sombre. */
.lux-header .orilom-account-dropdown > a.orilom-account-logout{
color:#9F2F2B !important;
}
/* Mobile : ne surcharge pas les lignes. */
@media(max-width:650px){
body.woocommerce-account .woocommerce-MyAccount-navigation li a{
gap:9px !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation .orilom-account-nav-icon{
width:16px !important;
flex-basis:16px !important;
}
}
/* =========================================================
ORILOM — HOME ARCHITECTURE V29
Pour lui / Pour elle > Coffrets / Marques.
========================================================= */
body.home .orilom-gender-cards{
margin-top:18px !important;
margin-bottom:0 !important;
}
/* Conserve la DA noire/bronze actuelle, avec une nuance différente
pour Homme / Femme sans introduire de nouvelles couleurs criardes. */
body.home .orilom-gender-cards > .lux-category-him{
background:
linear-gradient(145deg,rgba(31,30,28,.96),rgba(5,5,5,.98)) !important;
}
body.home .orilom-gender-cards > .lux-category-her{
background:
linear-gradient(145deg,rgba(85,57,20,.94),rgba(24,14,4,.98)) !important;
}
body.home .orilom-gender-cards > .lux-category-card.has-category-image{
background-size:cover !important;
background-position:center !important;
}
body.home .orilom-gender-cards > .lux-category-card.has-category-image::before{
background:
linear-gradient(90deg,rgba(8,8,8,.88) 0%,rgba(8,8,8,.58) 48%,rgba(8,8,8,.20) 100%) !important;
}
/* Les deux cartes secondaires restent plus légères que Pour lui / Pour elle. */
body.home .orilom-home-secondary-links{
margin-top:18px !important;
}
/* Le journal doit respirer comme une vraie rupture éditoriale. */
body.home .orilom-home-secondary-links + .lux-blog-premium{
margin-top:22px !important;
}
@media(max-width:780px){
body.home .orilom-gender-cards,
body.home .orilom-home-secondary-links{
margin-top:10px !important;
}
}
/* =========================================================
ORILOM — HOME VISUAL CARDS / 4 IMAGES — 2026-09-12
À conserver en fin de fichier pour neutraliser les anciens
backgrounds des cartes sans affecter le reste du thème.
========================================================= */
body.home .orilom-home-visual-card,
body.home .orilom-home-image-links .orilom-image-card{
position:relative !important;
overflow:hidden !important;
isolation:isolate !important;
background-position:center !important;
background-size:cover !important;
background-repeat:no-repeat !important;
}
/* POUR LUI */
body.home .orilom-gender-cards > .lux-category-him.orilom-home-visual-card{
background:
linear-gradient(90deg,
rgba(4,8,14,.78) 0%,
rgba(4,8,14,.58) 38%,
rgba(4,8,14,.18) 67%,
rgba(4,8,14,.04) 100%),
var(--orilom-card-image) center / cover no-repeat !important;
}
/* POUR ELLE */
body.home .orilom-gender-cards > .lux-category-her.orilom-home-visual-card{
background:
linear-gradient(90deg,
rgba(58,16,36,.72) 0%,
rgba(58,16,36,.48) 40%,
rgba(58,16,36,.14) 68%,
rgba(58,16,36,.03) 100%),
var(--orilom-card-image) center / cover no-repeat !important;
}
body.home .orilom-gender-cards > .lux-category-card{
min-height:390px !important;
padding:46px !important;
}
/* COFFRETS CADEAUX */
body.home .orilom-home-image-links .orilom-image-card-gift{
background:
linear-gradient(90deg,
rgba(25,17,11,.72) 0%,
rgba(25,17,11,.48) 43%,
rgba(25,17,11,.12) 70%,
rgba(25,17,11,.02) 100%),
var(--orilom-card-image) center / cover no-repeat !important;
}
/* NOS MARQUES */
body.home .orilom-home-image-links .orilom-image-card-brands{
background:
linear-gradient(90deg,
rgba(9,7,5,.74) 0%,
rgba(9,7,5,.48) 43%,
rgba(9,7,5,.12) 70%,
rgba(9,7,5,.02) 100%),
var(--orilom-card-image) center / cover no-repeat !important;
}
body.home .orilom-home-image-links{
align-items:stretch !important;
}
body.home .orilom-home-image-links > .orilom-image-card{
min-height:360px !important;
height:100% !important;
padding:46px !important;
display:flex !important;
flex-direction:column !important;
justify-content:space-between !important;
color:#fff !important;
}
body.home .orilom-home-visual-card > *,
body.home .orilom-home-image-links .orilom-image-card > *{
position:relative !important;
z-index:2 !important;
}
body.home .orilom-home-image-links .lux-split-card-body h2,
body.home .orilom-home-image-links .lux-split-card-body p,
body.home .orilom-home-image-links .lux-split-card-body a{
color:#fff !important;
}
body.home .orilom-home-image-links .lux-split-card-body h2{
text-shadow:0 2px 16px rgba(0,0,0,.18) !important;
}
body.home .orilom-home-image-links .lux-split-card-body p{
max-width:430px !important;
color:rgba(255,255,255,.82) !important;
}
body.home .orilom-home-image-links .lux-split-card-top span,
body.home .orilom-gender-cards .lux-category-card > span{
color:#E0B83F !important;
}
body.home .orilom-home-image-links .lux-split-card-body a{
width:max-content !important;
min-height:auto !important;
margin-top:15px !important;
padding:0 0 5px !important;
border:0 !important;
border-bottom:1px solid rgba(255,255,255,.72) !important;
background:transparent !important;
}
body.home .orilom-home-visual-card,
body.home .orilom-home-image-links .orilom-image-card{
transition:transform .28s ease, box-shadow .28s ease !important;
}
body.home .orilom-home-visual-card:hover,
body.home .orilom-home-image-links .orilom-image-card:hover{
transform:translateY(-2px) !important;
box-shadow:0 18px 45px rgba(0,0,0,.12) !important;
}
@media(max-width:780px){
body.home .orilom-gender-cards > .lux-category-card,
body.home .orilom-home-image-links > .orilom-image-card{
min-height:330px !important;
padding:30px !important;
background-position:center !important;
}
}
/* =========================================================
ORILOM — 4 HOME CARDS CLEAN IMAGE + MODERN 3D — V31
Supprime les anciens voiles/watermarks qui dégradent les
visuels et transforme les 4 blocs en vraies cartes premium.
========================================================= */
/* Laisser respirer les ombres autour des 4 cartes */
body.home .lux-home-v5 .orilom-gender-cards,
body.home .lux-home-v5 .orilom-home-image-links{
overflow:visible !important;
gap:24px !important;
}
/* Base commune : image intacte, radius et relief premium */
body.home .lux-home-v5 .orilom-gender-cards > .orilom-home-visual-card,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card{
position:relative !important;
isolation:isolate !important;
overflow:hidden !important;
border:1px solid rgba(15,15,15,.08) !important;
border-radius:20px !important;
background-image:var(--orilom-card-image) !important;
background-position:center !important;
background-size:cover !important;
background-repeat:no-repeat !important;
box-shadow:
0 2px 3px rgba(0,0,0,.04),
0 10px 24px rgba(0,0,0,.09),
0 28px 54px rgba(0,0,0,.08) !important;
transform:translateZ(0) !important;
transition:
transform .32s cubic-bezier(.2,.75,.25,1),
box-shadow .32s ease,
border-color .32s ease !important;
}
/* IMPORTANT : suppression totale des anciens voiles, ORILOM/O,
dégradés et pseudo-elements placés au-dessus de l'image. */
body.home .lux-home-v5 .orilom-gender-cards > .orilom-home-visual-card::before,
body.home .lux-home-v5 .orilom-gender-cards > .orilom-home-visual-card::after,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card::before,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card::after{
content:none !important;
display:none !important;
background:none !important;
opacity:0 !important;
}
/* Neutralise aussi les gradients appliqués directement aux 4 cartes */
body.home .lux-home-v5 .orilom-gender-cards > .lux-category-him.orilom-home-visual-card,
body.home .lux-home-v5 .orilom-gender-cards > .lux-category-her.orilom-home-visual-card,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card-gift,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card-brands{
background:
var(--orilom-card-image)
center / cover no-repeat !important;
}
/* Même format visuel pour les 4 cartes */
body.home .lux-home-v5 .orilom-gender-cards > .orilom-home-visual-card,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card{
min-height:340px !important;
height:340px !important;
padding:34px !important;
}
/* Contenu au-dessus de l'image, sans voile global */
body.home .lux-home-v5 .orilom-gender-cards > .orilom-home-visual-card > *,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card > *{
position:relative !important;
z-index:2 !important;
}
/* Lisibilité par ombre locale uniquement : l'image reste nette */
body.home .lux-home-v5 .orilom-gender-cards .orilom-home-visual-card h2,
body.home .lux-home-v5 .orilom-gender-cards .orilom-home-visual-card p,
body.home .lux-home-v5 .orilom-gender-cards .orilom-home-visual-card b,
body.home .lux-home-v5 .orilom-home-image-links .orilom-image-card h2,
body.home .lux-home-v5 .orilom-home-image-links .orilom-image-card p,
body.home .lux-home-v5 .orilom-home-image-links .orilom-image-card a,
body.home .lux-home-v5 .orilom-home-image-links .orilom-image-card span{
text-shadow:
0 1px 2px rgba(0,0,0,.48),
0 4px 14px rgba(0,0,0,.32) !important;
}
/* Raffinement typographique */
body.home .lux-home-v5 .orilom-gender-cards .orilom-home-visual-card h2,
body.home .lux-home-v5 .orilom-home-image-links .orilom-image-card h2{
color:#fff !important;
}
body.home .lux-home-v5 .orilom-gender-cards .orilom-home-visual-card p,
body.home .lux-home-v5 .orilom-home-image-links .orilom-image-card p{
color:rgba(255,255,255,.92) !important;
}
body.home .lux-home-v5 .orilom-gender-cards .orilom-home-visual-card > span,
body.home .lux-home-v5 .orilom-home-image-links .orilom-image-card .lux-split-card-top > span{
color:#E7C24A !important;
}
/* Numéros 01 / 02 discrets */
body.home .lux-home-v5 .orilom-home-image-links .lux-split-card-top > small{
color:rgba(255,255,255,.70) !important;
text-shadow:0 2px 8px rgba(0,0,0,.30) !important;
}
/* Vrai effet card / 3D au survol */
body.home .lux-home-v5 .orilom-gender-cards > .orilom-home-visual-card:hover,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card:hover{
transform:translateY(-7px) scale(1.008) !important;
border-color:rgba(198,154,24,.30) !important;
box-shadow:
0 4px 8px rgba(0,0,0,.05),
0 18px 34px rgba(0,0,0,.12),
0 38px 74px rgba(0,0,0,.13) !important;
}
/* CTA plus propre, sans grosse boîte qui masque l'image */
body.home .lux-home-v5 .orilom-home-image-links .lux-split-card-body a{
background:transparent !important;
border:0 !important;
border-bottom:1px solid rgba(255,255,255,.78) !important;
border-radius:0 !important;
padding:0 0 5px !important;
color:#fff !important;
}
/* Mobile */
@media(max-width:780px){
body.home .lux-home-v5 .orilom-gender-cards,
body.home .lux-home-v5 .orilom-home-image-links{
gap:18px !important;
}
body.home .lux-home-v5 .orilom-gender-cards > .orilom-home-visual-card,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card{
min-height:300px !important;
height:300px !important;
padding:26px !important;
border-radius:16px !important;
background-position:center !important;
}
body.home .lux-home-v5 .orilom-gender-cards > .orilom-home-visual-card:hover,
body.home .lux-home-v5 .orilom-home-image-links > .orilom-image-card:hover{
transform:none !important;
}
}
/* =========================================================
ORILOM — FOOTER LUXURY REFINEMENT V34
Scope strict : .orilom-footer-v34
Raffinement uniquement du footer. Aucun impact hors footer.
========================================================= */
.orilom-footer-v34{display:block!important;position:relative!important;width:100%!important;margin:0!important;padding:0!important;background:#fff!important;color:#17130A!important;border-top:1px solid #EEEAE2!important;font-family:Arial,Helvetica,sans-serif!important}
.orilom-footer-v34 *{box-sizing:border-box}
.orilom-footer-v34 .orilom-footer-shell{width:min(calc(100% - 64px),1240px)!important;margin:0 auto!important;padding:64px 0 24px!important}
.orilom-footer-v34 .orilom-footer-intro{display:grid!important;grid-template-columns:minmax(300px,.78fr) minmax(480px,1.22fr)!important;gap:96px!important;align-items:end!important;padding-bottom:46px!important;border-bottom:1px solid #E7E3DA!important}
.orilom-footer-v34 .orilom-footer-brand-block,.orilom-footer-v34 .orilom-footer-newsletter{display:block!important}
.orilom-footer-v34 .orilom-footer-brand{display:inline-flex!important;flex-direction:column!important;align-items:flex-start!important;color:#17130A!important;text-decoration:none!important}
.orilom-footer-v34 .orilom-footer-brand strong{font:700 clamp(36px,3.2vw,48px)/.9 Georgia,serif!important;letter-spacing:.065em!important;color:#17130A!important}
.orilom-footer-v34 .orilom-footer-brand strong span{color:#C69A18!important}
.orilom-footer-v34 .orilom-footer-brand small{margin-top:12px!important;color:#8B6B10!important;font:800 8px/1 Arial,sans-serif!important;letter-spacing:.38em!important}
.orilom-footer-v34 .orilom-footer-brand-block>p{max-width:330px!important;margin:22px 0 17px!important;color:#625D55!important;font-size:12px!important;line-height:1.7!important}
.orilom-footer-v34 .orilom-footer-help{display:inline-flex!important;align-items:center!important;gap:8px!important;color:#514C45!important;font-size:11px!important;font-weight:700!important;text-decoration:none!important;transition:color .18s ease,transform .18s ease!important}
.orilom-footer-v34 .orilom-footer-help span{color:#C69A18!important;font-size:15px!important}.orilom-footer-v34 .orilom-footer-help:hover{color:#A77D0B!important;transform:translateX(2px)!important}
.orilom-footer-v34 .orilom-footer-kicker{display:block!important;margin-bottom:10px!important;color:#A77D0B!important;font-size:8px!important;font-weight:900!important;letter-spacing:.25em!important}
.orilom-footer-v34 .orilom-footer-newsletter h2{margin:0!important;color:#17130A!important;font:500 clamp(31px,2.8vw,42px)/1.08 Georgia,serif!important;letter-spacing:-.025em!important}
.orilom-footer-v34 .orilom-footer-newsletter>p{max-width:560px!important;margin:12px 0 18px!important;color:#625D55!important;font-size:12px!important;line-height:1.65!important}
.orilom-footer-v34 .orilom-footer-newsletter-form{display:grid!important;grid-template-columns:minmax(0,1fr) 48px!important;width:100%!important;max-width:590px!important;margin:0!important;border:0!important;border-bottom:1px solid #29251F!important;background:#fff!important;box-shadow:none!important}
.orilom-footer-v34 .orilom-footer-newsletter-form input[type=email]{width:100%!important;min-width:0!important;height:48px!important;padding:0 2px!important;border:0!important;outline:0!important;background:transparent!important;color:#17130A!important;font-size:12px!important;box-shadow:none!important}
.orilom-footer-v34 .orilom-footer-newsletter-form input::placeholder{color:#817B72!important;opacity:1!important}
.orilom-footer-v34 .orilom-footer-newsletter-form button{width:48px!important;height:48px!important;padding:0!important;border:0!important;background:transparent!important;color:#17130A!important;font-size:23px!important;cursor:pointer!important;transition:color .18s ease,transform .18s ease!important}.orilom-footer-v34 .orilom-footer-newsletter-form button:hover{color:#C69A18!important;transform:translateX(2px)!important}
.orilom-footer-v34 .orilom-newsletter-message{margin-top:8px!important;color:#625D55!important;font-size:10px!important}
.orilom-footer-v34 .orilom-footer-nav{display:grid!important;grid-template-columns:1.2fr 1fr 1fr .85fr!important;gap:64px!important;padding:40px 0 36px!important;border-bottom:1px solid #E7E3DA!important}
.orilom-footer-v34 .orilom-footer-column{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:0!important}.orilom-footer-v34 .orilom-footer-column h3{margin:0 0 18px!important;color:#17130A!important;font:900 9px/1 Arial,sans-serif!important;letter-spacing:.19em!important}
.orilom-footer-v34 .orilom-footer-column a{position:relative!important;display:inline-block!important;margin:0 0 10px!important;color:#4F4A43!important;font-size:12px!important;line-height:1.4!important;text-decoration:none!important;transition:color .18s ease,transform .18s ease!important}.orilom-footer-v34 .orilom-footer-column a:hover{color:#A77D0B!important;transform:translateX(2px)!important}.orilom-footer-v34 .orilom-footer-loyalty{color:#7B5C0D!important;font-weight:700!important}
.orilom-footer-v34 .orilom-footer-proof{display:grid!important;grid-template-columns:repeat(4,1fr)!important;padding:18px 0!important;border-bottom:1px solid #E7E3DA!important}.orilom-footer-v34 .orilom-footer-proof>div{display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;min-height:24px!important;padding:0 18px!important;border-right:1px solid #E7E3DA!important}.orilom-footer-v34 .orilom-footer-proof>div:first-child{justify-content:flex-start!important;padding-left:0!important}.orilom-footer-v34 .orilom-footer-proof>div:last-child{justify-content:flex-end!important;padding-right:0!important;border-right:0!important}
.orilom-footer-v34 .orilom-proof-icon{display:inline-flex!important;width:17px!important;height:17px!important;flex:0 0 17px!important;color:#B98B12!important}.orilom-footer-v34 .orilom-proof-icon svg{display:block!important;width:17px!important;height:17px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.45!important;stroke-linecap:round!important;stroke-linejoin:round!important}.orilom-footer-v34 .orilom-footer-proof strong{color:#3F3A34!important;font-size:10px!important;font-weight:700!important;letter-spacing:.005em!important}
.orilom-footer-v34 .orilom-footer-bottom{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:24px!important;padding:20px 0 8px!important}.orilom-footer-v34 .orilom-footer-bottom p,.orilom-footer-v34 .orilom-footer-disclaimer{margin:0!important;color:#777168!important;font-size:9.5px!important;line-height:1.6!important}.orilom-footer-v34 .orilom-footer-legal{display:flex!important;align-items:center!important;gap:20px!important}.orilom-footer-v34 .orilom-footer-legal a{color:#6D675F!important;font-size:9.5px!important;text-decoration:none!important;transition:color .18s ease!important}.orilom-footer-v34 .orilom-footer-legal a:hover{color:#A77D0B!important}.orilom-footer-v34 .orilom-footer-disclaimer{max-width:820px!important;color:#969087!important;font-size:8.5px!important}
@media(max-width:980px){.orilom-footer-v34 .orilom-footer-shell{width:min(calc(100% - 48px),1240px)!important}.orilom-footer-v34 .orilom-footer-intro{grid-template-columns:1fr!important;gap:36px!important}.orilom-footer-v34 .orilom-footer-nav{grid-template-columns:repeat(2,1fr)!important;gap:36px 48px!important}.orilom-footer-v34 .orilom-footer-proof{grid-template-columns:repeat(2,1fr)!important}.orilom-footer-v34 .orilom-footer-proof>div{justify-content:flex-start!important;padding:11px 16px!important;border-bottom:1px solid #E7E3DA!important}.orilom-footer-v34 .orilom-footer-proof>div:nth-child(2n){border-right:0!important}.orilom-footer-v34 .orilom-footer-proof>div:nth-last-child(-n+2){border-bottom:0!important}}
@media(max-width:620px){.orilom-footer-v34 .orilom-footer-shell{width:calc(100% - 36px)!important;padding-top:44px!important}.orilom-footer-v34 .orilom-footer-intro{padding-bottom:34px!important}.orilom-footer-v34 .orilom-footer-newsletter h2{font-size:30px!important}.orilom-footer-v34 .orilom-footer-nav{grid-template-columns:1fr 1fr!important;gap:32px 20px!important;padding:34px 0 30px!important}.orilom-footer-v34 .orilom-footer-column h3{margin-bottom:15px!important;font-size:8.5px!important}.orilom-footer-v34 .orilom-footer-column a{font-size:11px!important;margin-bottom:9px!important}.orilom-footer-v34 .orilom-footer-proof{grid-template-columns:1fr!important;padding:6px 0!important}.orilom-footer-v34 .orilom-footer-proof>div,.orilom-footer-v34 .orilom-footer-proof>div:first-child,.orilom-footer-v34 .orilom-footer-proof>div:last-child{justify-content:flex-start!important;padding:11px 0!important;border-right:0!important;border-bottom:1px solid #E7E3DA!important}.orilom-footer-v34 .orilom-footer-proof>div:last-child{border-bottom:0!important}.orilom-footer-v34 .orilom-footer-bottom{align-items:flex-start!important;flex-direction:column!important;gap:8px!important}.orilom-footer-v34 .orilom-footer-legal{gap:13px!important;flex-wrap:wrap!important}}
/* =========================================================
ORILOM — FOOTER V35 / LV READABILITY BENCHMARK
Scope strict : .orilom-footer-v34
Objectif : police, taille et contraste inspirés du benchmark luxe
========================================================= */
.orilom-footer-v34{
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
-webkit-font-smoothing:antialiased!important;
text-rendering:optimizeLegibility!important;
}
/* Navigation : niveau de lisibilité proche du benchmark luxe */
.orilom-footer-v34 .orilom-footer-column h3{
margin-bottom:22px!important;
color:#17130A!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:11px!important;
line-height:1.25!important;
font-weight:500!important;
letter-spacing:.085em!important;
}
.orilom-footer-v34 .orilom-footer-column a{
margin-bottom:12px!important;
color:#201D19!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:14px!important;
line-height:1.45!important;
font-weight:400!important;
letter-spacing:0!important;
opacity:1!important;
}
.orilom-footer-v34 .orilom-footer-column a:hover{
color:#A77D0B!important;
transform:translateX(2px)!important;
}
.orilom-footer-v34 .orilom-footer-loyalty{
color:#7B5C0D!important;
font-weight:500!important;
}
/* Textes d'accompagnement */
.orilom-footer-v34 .orilom-footer-brand-block>p,
.orilom-footer-v34 .orilom-footer-newsletter>p{
color:#34302B!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:13px!important;
line-height:1.55!important;
font-weight:400!important;
}
.orilom-footer-v34 .orilom-footer-help{
color:#2B2722!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:13px!important;
line-height:1.45!important;
font-weight:400!important;
opacity:1!important;
}
.orilom-footer-v34 .orilom-footer-kicker{
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:9px!important;
font-weight:600!important;
letter-spacing:.18em!important;
}
.orilom-footer-v34 .orilom-footer-newsletter-form input[type=email]{
color:#17130A!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:13px!important;
font-weight:400!important;
}
.orilom-footer-v34 .orilom-footer-newsletter-form input::placeholder{
color:#5E5952!important;
opacity:1!important;
}
/* Réassurance : même niveau de lisibilité, sans devenir lourd */
.orilom-footer-v34 .orilom-footer-proof strong{
color:#231F1B!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:12px!important;
line-height:1.4!important;
font-weight:500!important;
}
/* Bas de footer */
.orilom-footer-v34 .orilom-footer-bottom p,
.orilom-footer-v34 .orilom-footer-legal a{
color:#4F4A43!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:11px!important;
line-height:1.45!important;
font-weight:400!important;
}
.orilom-footer-v34 .orilom-footer-disclaimer{
color:#6F6961!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:10px!important;
line-height:1.5!important;
font-weight:400!important;
}
@media(max-width:620px){
.orilom-footer-v34 .orilom-footer-column h3{
font-size:10.5px!important;
margin-bottom:16px!important;
}
.orilom-footer-v34 .orilom-footer-column a{
font-size:13.5px!important;
margin-bottom:10px!important;
}
.orilom-footer-v34 .orilom-footer-brand-block>p,
.orilom-footer-v34 .orilom-footer-newsletter>p,
.orilom-footer-v34 .orilom-footer-help{
font-size:12.5px!important;
}
.orilom-footer-v34 .orilom-footer-proof strong{
font-size:11.5px!important;
}
}
/* =========================================================
ORILOM — FOOTER V36 / CASCADE FIX
But : neutraliser les anciennes règles .site-footer qui
écrasaient encore la lisibilité du footer blanc premium.
Scope strict : footer.site-footer.orilom-footer-v34
========================================================= */
/* 1) Navigation : gagne volontairement contre les anciennes règles
.site-footer a:not(.brand):not(.lux-brand) + body.home .site-footer:not(.orilom-footer-v34) a */
footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a,
body.woocommerce-account footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a,
body.woocommerce-cart footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a,
body.blog footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a{
display:inline-block!important;
width:auto!important;
max-width:100%!important;
margin:0 0 12px!important;
padding:0!important;
color:#201D19!important;
opacity:1!important;
visibility:visible!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:14px!important;
line-height:1.45!important;
font-weight:400!important;
letter-spacing:0!important;
text-decoration:none!important;
text-shadow:none!important;
filter:none!important;
-webkit-text-fill-color:#201D19!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a:visited,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a:visited{
color:#201D19!important;
-webkit-text-fill-color:#201D19!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a:hover,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a:hover{
color:#A77D0B!important;
-webkit-text-fill-color:#A77D0B!important;
transform:translateX(2px)!important;
}
/* Supprime les anciens underlines/ornements hérités du footer sombre. */
footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a::before,
footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a::after,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a::before,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a::after{
content:none!important;
display:none!important;
}
/* Fidélité : accent bronze maîtrisé. */
footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a.orilom-footer-loyalty,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a.orilom-footer-loyalty{
color:#7B5C0D!important;
-webkit-text-fill-color:#7B5C0D!important;
font-weight:500!important;
}
/* 2) Titres de colonnes : noirs, fins, lisibles comme benchmark luxe. */
footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > h3,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > h3{
margin:0 0 22px!important;
color:#17130A!important;
opacity:1!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:11px!important;
line-height:1.25!important;
font-weight:500!important;
letter-spacing:.085em!important;
text-shadow:none!important;
-webkit-text-fill-color:#17130A!important;
}
/* 3) Intro : empêche .site-footer p et .site-footer a historiques de repasser gris clair. */
footer.site-footer.orilom-footer-v34 .orilom-footer-brand-block > p,
footer.site-footer.orilom-footer-v34 .orilom-footer-newsletter > p,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-brand-block > p,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-newsletter > p{
color:#34302B!important;
opacity:1!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:13px!important;
line-height:1.55!important;
font-weight:400!important;
text-shadow:none!important;
}
footer.site-footer.orilom-footer-v34 a.orilom-footer-help,
body.home footer.site-footer.orilom-footer-v34 a.orilom-footer-help{
display:inline-flex!important;
width:auto!important;
margin:0!important;
padding:0!important;
color:#2B2722!important;
opacity:1!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:13px!important;
line-height:1.45!important;
font-weight:400!important;
text-decoration:none!important;
-webkit-text-fill-color:#2B2722!important;
}
footer.site-footer.orilom-footer-v34 a.orilom-footer-help::before,
footer.site-footer.orilom-footer-v34 a.orilom-footer-help::after{
content:none!important;
display:none!important;
}
footer.site-footer.orilom-footer-v34 a.orilom-footer-help:hover{
color:#A77D0B!important;
-webkit-text-fill-color:#A77D0B!important;
}
/* 4) Réassurance : noir lisible sans perdre le raffinement. */
footer.site-footer.orilom-footer-v34 .orilom-footer-proof strong,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-proof strong{
color:#231F1B!important;
opacity:1!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:12px!important;
line-height:1.4!important;
font-weight:500!important;
-webkit-text-fill-color:#231F1B!important;
}
/* 5) Bas de footer : discret mais réellement lisible. */
footer.site-footer.orilom-footer-v34 .orilom-footer-bottom > p,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-bottom > p{
color:#4F4A43!important;
opacity:1!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:11px!important;
line-height:1.45!important;
font-weight:400!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-legal > a,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-legal > a{
display:inline-block!important;
width:auto!important;
margin:0!important;
padding:0!important;
color:#4F4A43!important;
opacity:1!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:11px!important;
line-height:1.45!important;
font-weight:400!important;
text-decoration:none!important;
-webkit-text-fill-color:#4F4A43!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-legal > a::before,
footer.site-footer.orilom-footer-v34 .orilom-footer-legal > a::after{
content:none!important;
display:none!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-legal > a:hover{
color:#A77D0B!important;
-webkit-text-fill-color:#A77D0B!important;
}
footer.site-footer.orilom-footer-v34 > .orilom-footer-shell > .orilom-footer-disclaimer,
body.home footer.site-footer.orilom-footer-v34 > .orilom-footer-shell > .orilom-footer-disclaimer{
max-width:820px!important;
margin:0!important;
color:#6F6961!important;
opacity:1!important;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
font-size:10px!important;
line-height:1.5!important;
font-weight:400!important;
}
/* Mobile : conserve la même lisibilité, sans gonfler le footer. */
@media(max-width:620px){
footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > h3{
margin-bottom:16px!important;
font-size:10.5px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-nav .orilom-footer-column > a{
margin-bottom:10px!important;
font-size:13.5px!important;
line-height:1.45!important;
}
footer.site-footer.orilom-footer-v34 a.orilom-footer-help,
footer.site-footer.orilom-footer-v34 .orilom-footer-brand-block > p,
footer.site-footer.orilom-footer-v34 .orilom-footer-newsletter > p{
font-size:12.5px!important;
}
}
/* ==========================================================
ORILOM FOOTER V37 — FINAL LUXURY REFINEMENT
Micro-ajustements uniquement, strictement scopes au footer.
========================================================== */
footer.site-footer.orilom-footer-v34 .orilom-footer-brand-block > p,
body.home footer.site-footer.orilom-footer-v34 .orilom-footer-brand-block > p{
max-width:360px!important;
color:#34302B!important;
}
/* Réassurance : structure plus silencieuse, sans effet grille. */
footer.site-footer.orilom-footer-v34 .orilom-footer-proof > div{
border-left:0!important;
border-right:0!important;
box-shadow:none!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-proof{
column-gap:28px!important;
}
/* Ligne légale : finition plus nette et alignée. */
footer.site-footer.orilom-footer-v34 .orilom-footer-bottom{
align-items:center!important;
min-height:42px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-bottom > p{
color:#3F3A34!important;
font-size:11px!important;
letter-spacing:.015em!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-legal{
display:flex!important;
align-items:center!important;
justify-content:flex-end!important;
gap:24px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-legal > a{
color:#4B463F!important;
font-size:11px!important;
}
footer.site-footer.orilom-footer-v34 > .orilom-footer-shell > .orilom-footer-disclaimer{
color:#68625B!important;
font-size:10.5px!important;
line-height:1.5!important;
margin-top:0!important;
padding-bottom:2px!important;
}
@media(max-width:780px){
footer.site-footer.orilom-footer-v34 .orilom-footer-proof{
column-gap:0!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-bottom{
align-items:flex-start!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-legal{
justify-content:flex-start!important;
gap:18px!important;
flex-wrap:wrap!important;
}
}
/* ==========================================================
ORILOM FOOTER V38 — FINAL POLISH
Compactage desktop + aide WhatsApp + trust bar silencieuse.
Scope strict : footer.site-footer.orilom-footer-v34
========================================================== */
@media (min-width:981px){
footer.site-footer.orilom-footer-v34 .orilom-footer-shell{
padding-top:52px!important;
padding-bottom:18px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-intro{
padding-bottom:36px!important;
gap:88px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-brand-block>p{
margin-top:18px!important;
margin-bottom:14px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-nav{
padding-top:32px!important;
padding-bottom:28px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-proof{
padding:13px 0!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-bottom{
min-height:34px!important;
padding-top:13px!important;
padding-bottom:4px!important;
}
}
/* Aide : plus aucun glyphe décoratif disparate. */
footer.site-footer.orilom-footer-v34 a.orilom-footer-help{
gap:5px!important;
color:#302C27!important;
font-size:12px!important;
font-weight:400!important;
transform:none!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-help-link{
position:relative!important;
font-weight:500!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-help-link::after{
content:""!important;
position:absolute!important;
left:0!important;
right:0!important;
bottom:-2px!important;
height:1px!important;
background:#B98B12!important;
transform:scaleX(0)!important;
transform-origin:left center!important;
transition:transform .18s ease!important;
}
footer.site-footer.orilom-footer-v34 a.orilom-footer-help:hover{
color:#8A670C!important;
transform:none!important;
}
footer.site-footer.orilom-footer-v34 a.orilom-footer-help:hover .orilom-footer-help-link::after{
transform:scaleX(1)!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-help-arrow{
color:#A77D0B!important;
font-size:13px!important;
line-height:1!important;
transition:transform .18s ease!important;
}
footer.site-footer.orilom-footer-v34 a.orilom-footer-help:hover .orilom-footer-help-arrow{
transform:translateX(2px)!important;
}
/* Trust bar : présente mais volontairement secondaire. */
footer.site-footer.orilom-footer-v34 .orilom-footer-proof{
border-bottom:1px solid #EAE6DE!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-proof>div{
border:0!important;
box-shadow:none!important;
}
footer.site-footer.orilom-footer-v34 .orilom-proof-icon{
width:14px!important;
height:14px!important;
flex-basis:14px!important;
color:#B98B12!important;
}
footer.site-footer.orilom-footer-v34 .orilom-proof-icon svg{
width:14px!important;
height:14px!important;
stroke-width:1.25!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-proof strong{
color:#4A453E!important;
font-size:11px!important;
font-weight:500!important;
letter-spacing:0!important;
}
/* Légal : discret, jamais illisible. */
footer.site-footer.orilom-footer-v34 .orilom-footer-bottom>p,
footer.site-footer.orilom-footer-v34 .orilom-footer-legal>a{
font-size:11px!important;
color:#514C45!important;
}
footer.site-footer.orilom-footer-v34>.orilom-footer-shell>.orilom-footer-disclaimer{
font-size:11px!important;
line-height:1.45!important;
color:#746E66!important;
padding-bottom:0!important;
}
@media(max-width:620px){
footer.site-footer.orilom-footer-v34 a.orilom-footer-help{font-size:12.5px!important}
footer.site-footer.orilom-footer-v34 .orilom-footer-proof strong{font-size:11.5px!important}
footer.site-footer.orilom-footer-v34>.orilom-footer-shell>.orilom-footer-disclaimer{font-size:10.5px!important}
}
/* ==========================================================
ORILOM FOOTER V39 — PRECISION / QUIET LUXURY
Derniere passe : largeur, newsletter, trust, legal, widgets.
========================================================== */
@media (min-width:981px){
footer.site-footer.orilom-footer-v34 .orilom-footer-shell{
width:min(calc(100% - 96px),1360px)!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-intro{
grid-template-columns:minmax(330px,.78fr) minmax(520px,1.22fr)!important;
gap:96px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-newsletter{
max-width:660px!important;
width:100%!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-newsletter-form{
max-width:620px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-proof strong{
font-size:12px!important;
line-height:1.35!important;
color:#454039!important;
}
footer.site-footer.orilom-footer-v34 .orilom-proof-icon,
footer.site-footer.orilom-footer-v34 .orilom-proof-icon svg{
width:14px!important;
height:14px!important;
}
footer.site-footer.orilom-footer-v34 .orilom-footer-bottom{
padding-bottom:8px!important;
}
footer.site-footer.orilom-footer-v34>.orilom-footer-shell>.orilom-footer-disclaimer{
padding-bottom:14px!important;
}
}
/* Le footer contient deja un acces WhatsApp contextuel : pas de second bouton vert flottant. */
body > a.whatsapp{display:none!important;}
/* Ambiance sonore conservee, mais volontairement silencieuse visuellement. */
#orilom-sound-toggle{
opacity:.58!important;
transform:scale(.86)!important;
transform-origin:left bottom!important;
transition:opacity .18s ease,transform .18s ease!important;
}
#orilom-sound-toggle:hover,
#orilom-sound-toggle:focus-visible,
#orilom-sound-toggle.is-playing{
opacity:1!important;
transform:scale(.92)!important;
}
@media(max-width:620px){
#orilom-sound-toggle{opacity:.5!important;transform:scale(.82)!important;}
}
/* ==========================================================
ORILOM V40 — GLOBAL BRAND GRID / HEADER ↔ FOOTER ALIGNMENT
Objectif : meme axe gauche/droit 1360px pour appbar + nav + footer.
Topbar reste full width. Aucun changement visuel de composants.
========================================================== */
:root{
--orilom-brand-grid:1360px;
--orilom-brand-gutter:48px;
}
/* Desktop : le header principal utilise exactement la grille du footer V39. */
@media (min-width:1101px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
width:min(calc(100% - (var(--orilom-brand-gutter) * 2)),var(--orilom-brand-grid))!important;
max-width:var(--orilom-brand-grid)!important;
margin-left:auto!important;
margin-right:auto!important;
padding-left:0!important;
padding-right:0!important;
box-sizing:border-box!important;
}
/* Les extremites deviennent les axes de marque : logo à gauche, outils à droite. */
html body .lux-header .lux-brand{
justify-self:start!important;
align-self:center!important;
}
html body .lux-header .header-tools{
justify-self:end!important;
align-self:center!important;
}
/* La barre secondaire reste full width, son contenu seul partage la meme grille. */
html body .site-header.lux-header .main-nav.lux-nav{
width:100%!important;
max-width:none!important;
padding-left:0!important;
padding-right:0!important;
box-sizing:border-box!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
width:min(calc(100% - (var(--orilom-brand-gutter) * 2)),var(--orilom-brand-grid))!important;
max-width:var(--orilom-brand-grid)!important;
margin-left:auto!important;
margin-right:auto!important;
padding-left:0!important;
padding-right:0!important;
box-sizing:border-box!important;
justify-content:center!important;
}
/* Footer : verrouille explicitement la même mesure pour eviter toute divergence future. */
html body footer.site-footer.orilom-footer-v34 .orilom-footer-shell{
width:min(calc(100% - (var(--orilom-brand-gutter) * 2)),var(--orilom-brand-grid))!important;
max-width:var(--orilom-brand-grid)!important;
margin-left:auto!important;
margin-right:auto!important;
box-sizing:border-box!important;
}
}
/* Grand desktop : recherche volontairement contenue, outils colles a l'axe droit. */
@media (min-width:1500px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand collections search tools"!important;
grid-template-columns:190px 145px minmax(420px,500px) minmax(250px,1fr)!important;
column-gap:24px!important;
}
}
/* Desktop courant : garde toute la fonctionnalite sans compression excessive. */
@media (min-width:1101px) and (max-width:1499px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand collections search tools"!important;
grid-template-columns:160px 130px minmax(300px,1fr) 230px!important;
column-gap:18px!important;
}
}
/* Sous 1100px : on conserve integralement le responsive historique. */
/* ==========================================================
ORILOM V41 — APP BAR QUIET LUXURY / FOOTER LANGUAGE
Header et footer parlent la meme langue visuelle :
grille 1360px, blanc, traits fins, typographie nette,
bronze uniquement comme accent. Boutique descend dans la nav.
========================================================== */
/* Header principal : 3 zones seulement — marque / recherche / actions. */
@media (min-width:1101px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand search tools"!important;
grid-template-columns:240px minmax(440px,620px) minmax(280px,1fr)!important;
column-gap:44px!important;
min-height:82px!important;
align-items:center!important;
}
html body .site-header.lux-header .lux-brand{
grid-area:brand!important;
justify-self:start!important;
}
html body .site-header.lux-header .lux-search{
grid-area:search!important;
width:100%!important;
max-width:620px!important;
justify-self:center!important;
min-height:44px!important;
height:44px!important;
border:0!important;
border-bottom:1px solid #26231E!important;
border-radius:0!important;
background:#fff!important;
box-shadow:none!important;
overflow:visible!important;
}
html body .site-header.lux-header .lux-search:focus-within{
border-bottom-color:#C69A18!important;
box-shadow:none!important;
}
html body .site-header.lux-header .lux-search select.orilom-header-category{
min-width:170px!important;
height:43px!important;
border:0!important;
border-right:1px solid #E7E3DA!important;
border-radius:0!important;
background-color:#fff!important;
color:#302C27!important;
font-size:11px!important;
font-weight:500!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-wrap,
html body .site-header.lux-header .lux-search .orilom-live-search-input{
height:43px!important;
min-height:43px!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input{
border:0!important;
border-radius:0!important;
background:#fff!important;
box-shadow:none!important;
color:#17130A!important;
font-size:12px!important;
font-weight:400!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input::placeholder{
color:#8A857C!important;
opacity:1!important;
}
html body .site-header.lux-header .lux-search .orilom-search-submit{
width:46px!important;
min-width:46px!important;
height:43px!important;
border:0!important;
border-radius:0!important;
background:#fff!important;
color:#17130A!important;
box-shadow:none!important;
}
html body .site-header.lux-header .header-tools{
grid-area:tools!important;
justify-self:end!important;
gap:18px!important;
}
/* La nav partage l'axe exact du footer et commence par Boutique. */
html body .site-header.lux-header .main-nav.lux-nav{
border-top:1px solid #F0EDE7!important;
border-bottom:1px solid #E7E3DA!important;
background:#fff!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
justify-content:flex-start!important;
gap:34px!important;
min-height:52px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a{
min-height:52px!important;
font-size:11.5px!important;
font-weight:600!important;
letter-spacing:.018em!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a::after{
bottom:8px!important;
height:1.5px!important;
}
/* Boutique n'est plus un CTA noir : elle devient la porte d'entrée de la navigation. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.orilom-collections-menu{
display:list-item!important;
grid-area:auto!important;
position:relative!important;
margin:0!important;
padding:0!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger{
position:relative!important;
display:inline-flex!important;
align-items:center!important;
justify-content:flex-start!important;
gap:8px!important;
width:auto!important;
min-width:0!important;
min-height:52px!important;
height:52px!important;
padding:0!important;
margin:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
color:#17130A!important;
box-shadow:none!important;
font-size:11.5px!important;
font-weight:650!important;
line-height:1!important;
letter-spacing:.018em!important;
text-transform:uppercase!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger::after{
content:""!important;
position:absolute!important;
left:50%!important;
bottom:8px!important;
width:0!important;
height:1.5px!important;
background:#C69A18!important;
transform:translateX(-50%)!important;
transition:width .18s ease!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:hover .orilom-collections-trigger::after,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within .orilom-collections-trigger::after,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-trigger::after{
width:22px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon{
width:15px!important;
height:15px!important;
display:inline-flex!important;
color:#17130A!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon svg{
width:15px!important;
height:15px!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.5!important;
stroke-linecap:round!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-chevron{
width:12px!important;
height:12px!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.5!important;
opacity:.62!important;
}
/* Mega-menu : plus editorial, moins "card". */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-panel{
top:calc(100% + 1px)!important;
left:0!important;
width:min(760px,calc(100vw - 96px))!important;
border:1px solid #E7E3DA!important;
border-radius:0!important;
box-shadow:0 18px 44px rgba(23,19,10,.10)!important;
}
}
/* Grand desktop : un peu plus d'espace, sans casser l'axe du footer. */
@media (min-width:1500px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand search tools"!important;
grid-template-columns:260px minmax(520px,650px) minmax(300px,1fr)!important;
column-gap:54px!important;
}
html body .site-header.lux-header .lux-search{max-width:650px!important;}
}
/* 1101–1499 : garde la meme composition avec une recherche plus flexible. */
@media (min-width:1101px) and (max-width:1499px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand search tools"!important;
grid-template-columns:190px minmax(360px,1fr) 255px!important;
column-gap:28px!important;
}
html body .site-header.lux-header .lux-search{max-width:560px!important;}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{gap:27px!important;}
}
/* Mobile/tablette : Boutique reste le premier item du menu burger. */
@media (max-width:1100px){
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.orilom-collections-menu{
display:list-item!important;
grid-area:auto!important;
width:100%!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger{
display:flex!important;
width:100%!important;
min-height:44px!important;
justify-content:flex-start!important;
gap:9px!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
color:#17130A!important;
box-shadow:none!important;
font-size:12px!important;
font-weight:700!important;
text-transform:uppercase!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon svg{
width:16px!important;
height:16px!important;
}
}
/* ==========================================================
ORILOM V42 — MINIMAL PREMIUM APP BAR
Marque / recherche simple / actions + navigation commerciale.
Suppression du select categorie : Boutique porte deja la navigation.
========================================================== */
@media (min-width:1101px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand search tools"!important;
grid-template-columns:minmax(210px,260px) minmax(420px,520px) minmax(260px,1fr)!important;
column-gap:56px!important;
min-height:82px!important;
align-items:center!important;
}
html body .site-header.lux-header .lux-brand{
grid-area:brand!important;
justify-self:start!important;
}
html body .site-header.lux-header .lux-search{
grid-area:search!important;
justify-self:center!important;
width:100%!important;
max-width:520px!important;
min-height:42px!important;
height:42px!important;
display:grid!important;
grid-template-columns:minmax(0,1fr) 42px!important;
align-items:center!important;
border:0!important;
border-bottom:1px solid #26231E!important;
border-radius:0!important;
background:#fff!important;
box-shadow:none!important;
overflow:visible!important;
}
html body .site-header.lux-header .lux-search:focus-within{
border-bottom-color:#C69A18!important;
box-shadow:none!important;
}
/* Defensive: aucun ancien select de categorie ne doit reapparaitre visuellement. */
html body .site-header.lux-header .lux-search .orilom-header-category{
display:none!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-wrap,
html body .site-header.lux-header .lux-search .orilom-live-search-input{
width:100%!important;
height:41px!important;
min-height:41px!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input{
padding:0 14px 0 2px!important;
border:0!important;
border-radius:0!important;
background:#fff!important;
box-shadow:none!important;
color:#17130A!important;
font-size:12.5px!important;
font-weight:400!important;
line-height:1.2!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input::placeholder{
color:#7D786F!important;
opacity:1!important;
}
html body .site-header.lux-header .lux-search .orilom-search-submit{
width:42px!important;
min-width:42px!important;
height:41px!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:#fff!important;
color:#17130A!important;
box-shadow:none!important;
}
html body .site-header.lux-header .lux-search .orilom-search-submit svg{
width:16px!important;
height:16px!important;
stroke-width:1.5!important;
}
html body .site-header.lux-header .header-tools{
grid-area:tools!important;
justify-self:end!important;
gap:18px!important;
}
/* Navigation = une seule ligne commerciale, alignee sur la grille du footer. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
justify-content:flex-start!important;
align-items:center!important;
gap:35px!important;
min-height:52px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger{
font-size:11.5px!important;
font-weight:600!important;
letter-spacing:.018em!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon svg{
width:14px!important;
height:14px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-chevron{
width:10px!important;
height:10px!important;
opacity:.5!important;
}
}
@media (min-width:1500px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:260px 520px minmax(320px,1fr)!important;
column-gap:70px!important;
}
}
@media (min-width:1101px) and (max-width:1499px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:190px minmax(360px,500px) minmax(250px,1fr)!important;
column-gap:34px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{gap:28px!important;}
}
/* ==========================================================
ORILOM V43 — HEADER / FOOTER 100% BRAND GRID
Meme shell 1360px, memes axes gauche/droite et meme lockup ORILOM.
Le footer reste visuellement intact ; le header adopte son langage exact.
========================================================== */
@media (min-width:1101px){
/* 1) Une seule mesure de marque pour les deux extremites du site. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main,
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav,
html body footer.site-footer.orilom-footer-v34 .orilom-footer-shell{
width:min(calc(100% - 96px),1360px)!important;
max-width:1360px!important;
margin-left:auto!important;
margin-right:auto!important;
padding-left:0!important;
padding-right:0!important;
box-sizing:border-box!important;
}
/* 2) Header symetrique : logo et actions ont la meme largeur.
La recherche est donc centree sur l'axe reel de la page. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand search tools"!important;
grid-template-columns:260px minmax(0,1fr) 260px!important;
column-gap:40px!important;
min-height:86px!important;
align-items:center!important;
}
html body .site-header.lux-header .lux-brand{
grid-area:brand!important;
justify-self:start!important;
align-self:center!important;
margin:0!important;
padding:0!important;
}
/* 3) Meme signature ORILOM que le footer : ORI bronze / LOM noir. */
html body .site-header.lux-header .orilom-header-brand-lockup{
display:inline-flex!important;
flex-direction:column!important;
align-items:flex-start!important;
justify-content:center!important;
margin:0!important;
padding:0!important;
color:#17130A!important;
text-decoration:none!important;
background:none!important;
border:0!important;
box-shadow:none!important;
}
html body .site-header.lux-header .orilom-header-brand-lockup::before,
html body .site-header.lux-header .orilom-header-brand-lockup::after{
content:none!important;
display:none!important;
}
html body .site-header.lux-header .orilom-header-brand-lockup strong{
display:block!important;
margin:0!important;
font:700 33px/.9 Georgia,serif!important;
letter-spacing:.065em!important;
color:#17130A!important;
white-space:nowrap!important;
}
html body .site-header.lux-header .orilom-header-brand-lockup strong span{
color:#C69A18!important;
}
html body .site-header.lux-header .orilom-header-brand-lockup small{
display:block!important;
margin-top:9px!important;
color:#8B6B10!important;
font:800 7px/1 Arial,sans-serif!important;
letter-spacing:.38em!important;
white-space:nowrap!important;
}
/* 4) Recherche exactement centree entre les deux blocs lateraux. */
html body .site-header.lux-header .lux-search{
grid-area:search!important;
justify-self:center!important;
width:min(100%,540px)!important;
max-width:540px!important;
margin:0!important;
}
/* 5) Actions verrouillees sur le meme axe droit que le footer. */
html body .site-header.lux-header .header-tools{
grid-area:tools!important;
justify-self:end!important;
align-self:center!important;
margin:0!important;
padding:0!important;
}
/* 6) Navigation : BOUTIQUE part exactement du meme axe que BOUTIQUE footer. */
html body .site-header.lux-header .main-nav.lux-nav{
width:100%!important;
max-width:none!important;
padding-left:0!important;
padding-right:0!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
justify-content:flex-start!important;
align-items:center!important;
gap:38px!important;
min-height:54px!important;
}
}
/* Desktop intermediaire : meme logique, seulement des blocs lateraux plus compacts. */
@media (min-width:1101px) and (max-width:1499px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:210px minmax(0,1fr) 210px!important;
column-gap:28px!important;
}
html body .site-header.lux-header .lux-search{
width:min(100%,500px)!important;
max-width:500px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
gap:28px!important;
}
}
/* Le mobile garde le comportement historique ; seul le lockup reste coherent. */
@media (max-width:1100px){
html body .site-header.lux-header .orilom-header-brand-lockup{
display:inline-flex!important;
flex-direction:column!important;
align-items:flex-start!important;
color:#17130A!important;
text-decoration:none!important;
}
html body .site-header.lux-header .orilom-header-brand-lockup strong{
font:700 27px/.92 Georgia,serif!important;
letter-spacing:.06em!important;
color:#17130A!important;
}
html body .site-header.lux-header .orilom-header-brand-lockup strong span{color:#C69A18!important;}
html body .site-header.lux-header .orilom-header-brand-lockup small{
margin-top:7px!important;
color:#8B6B10!important;
font:800 6px/1 Arial,sans-serif!important;
letter-spacing:.34em!important;
}
}
/* ==========================================================
ORILOM V44 — PREMIUM SEARCH FILTER RESTORE
V43 brand grid preserved. Functional product-category filter
restored as a quiet-luxury part of the same search line.
========================================================== */
@media (min-width:1101px){
html body .site-header.lux-header .lux-search{
display:grid!important;
grid-template-columns:170px minmax(0,1fr) 42px!important;
align-items:center!important;
width:min(100%,620px)!important;
max-width:620px!important;
min-height:44px!important;
padding:0!important;
background:#fff!important;
border:0!important;
border-bottom:1px solid #17130A!important;
border-radius:0!important;
box-shadow:none!important;
overflow:visible!important;
}
html body .site-header.lux-header .lux-search .orilom-header-category{
display:block!important;
width:100%!important;
height:43px!important;
margin:0!important;
padding:0 30px 0 0!important;
border:0!important;
border-right:1px solid #E7E3DA!important;
border-radius:0!important;
outline:0!important;
background-color:#fff!important;
color:#2A261F!important;
font:400 12px/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif!important;
cursor:pointer!important;
box-shadow:none!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-wrap{
min-width:0!important;
width:100%!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input{
width:100%!important;
height:43px!important;
padding:0 18px!important;
border:0!important;
outline:0!important;
background:transparent!important;
box-shadow:none!important;
color:#17130A!important;
font:400 12px/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input::placeholder{
color:#8A857D!important;
opacity:1!important;
}
html body .site-header.lux-header .lux-search .orilom-search-submit{
width:42px!important;
height:43px!important;
padding:0!important;
margin:0!important;
display:grid!important;
place-items:center!important;
border:0!important;
background:transparent!important;
color:#17130A!important;
box-shadow:none!important;
}
html body .site-header.lux-header .lux-search:focus-within{
border-bottom-color:#C69A18!important;
}
html body .site-header.lux-header .lux-search .orilom-header-category:focus{
color:#17130A!important;
}
}
@media (min-width:1101px) and (max-width:1499px){
html body .site-header.lux-header .lux-search{
grid-template-columns:155px minmax(0,1fr) 40px!important;
width:min(100%,560px)!important;
max-width:560px!important;
}
html body .site-header.lux-header .lux-search .orilom-header-category{
font-size:11px!important;
}
}
/* ==========================================================
ORILOM V45 — MAISON DE PARFUM HEADER POLISH
V44 functionality preserved. Refines grid, breathing room,
search proportions and Boutique mega-menu only.
========================================================== */
:root{
--orilom-v45-grid:1360px;
--orilom-v45-gutter:clamp(28px,4.9vw,94px);
}
@media (min-width:1101px){
/* One visible brand axis shared with footer. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main,
html body .site-header.lux-header .main-nav.lux-nav{
width:min(calc(100% - (var(--orilom-v45-gutter) * 2)),var(--orilom-v45-grid))!important;
max-width:var(--orilom-v45-grid)!important;
margin-left:auto!important;
margin-right:auto!important;
}
/* Header: brand gets real editorial breathing room. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand search tools"!important;
grid-template-columns:250px minmax(0,1fr) 250px!important;
column-gap:44px!important;
}
/* Lockup: no generated decoration; preserve footer language. */
html body .site-header.lux-header .orilom-header-brand-lockup,
html body .site-header.lux-header .orilom-header-brand-lockup:focus,
html body .site-header.lux-header .orilom-header-brand-lockup:active{
outline:0!important;
border:0!important;
box-shadow:none!important;
text-decoration:none!important;
}
html body .site-header.lux-header .orilom-header-brand-lockup::before,
html body .site-header.lux-header .orilom-header-brand-lockup::after,
html body .site-header.lux-header .lux-brand::before,
html body .site-header.lux-header .lux-brand::after{
content:none!important;
display:none!important;
border:0!important;
}
/* Search remains functional but reads as one quiet-luxury instrument. */
html body .site-header.lux-header .lux-search{
justify-self:center!important;
grid-template-columns:148px minmax(0,1fr) 40px!important;
width:min(100%,570px)!important;
max-width:570px!important;
min-height:43px!important;
}
html body .site-header.lux-header .lux-search .orilom-header-category{
height:42px!important;
padding-right:24px!important;
font-size:11.5px!important;
color:#4F4A43!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input{
height:42px!important;
padding-left:17px!important;
padding-right:12px!important;
font-size:12px!important;
}
html body .site-header.lux-header .lux-search .orilom-search-submit{
width:40px!important;
height:42px!important;
}
/* Nav shares exact outer axes; Boutique is navigation, not a CTA. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
justify-content:flex-start!important;
gap:36px!important;
min-height:52px!important;
}
/* Boutique mega-menu: editorial list, not marketplace chips/cards. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-panel{
top:calc(100% + 1px)!important;
left:0!important;
width:min(720px,calc(100vw - (var(--orilom-v45-gutter) * 2)))!important;
padding:28px 30px 30px!important;
background:#fff!important;
border:1px solid #E7E3DA!important;
border-radius:0!important;
box-shadow:0 20px 48px rgba(23,19,10,.09)!important;
}
html body .site-header.lux-header .orilom-collections-shortcuts{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:0 28px!important;
padding:0 0 22px!important;
margin:0 0 22px!important;
border-bottom:1px solid #E7E3DA!important;
}
html body .site-header.lux-header .orilom-collections-shortcuts > a,
html body .site-header.lux-header .orilom-collections-shortcuts > a.orilom-link-bestsellers,
html body .site-header.lux-header .orilom-collections-shortcuts > a.orilom-link-promotions{
justify-content:flex-start!important;
min-height:36px!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
color:#17130A!important;
font-size:11px!important;
font-weight:600!important;
letter-spacing:.02em!important;
}
html body .site-header.lux-header .orilom-collections-shortcuts > a.orilom-link-bestsellers{color:#7657A8!important;}
html body .site-header.lux-header .orilom-collections-shortcuts > a.orilom-link-promotions{color:#B42318!important;}
html body .site-header.lux-header .orilom-collections-shortcuts > a:hover{
color:#A77D0B!important;
background:transparent!important;
border:0!important;
transform:translateX(2px)!important;
}
html body .site-header.lux-header .orilom-brands-heading{
margin:0 0 16px!important;
padding:0!important;
border:0!important;
}
html body .site-header.lux-header .orilom-brands-heading strong{
font-size:11px!important;
letter-spacing:.12em!important;
}
html body .site-header.lux-header .orilom-brands-heading span{
color:#77736B!important;
font-size:10.5px!important;
}
html body .site-header.lux-header .orilom-brands-grid{
display:grid!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:0 24px!important;
}
html body .site-header.lux-header .orilom-brands-grid .orilom-brand-card{
display:flex!important;
align-items:center!important;
justify-content:flex-start!important;
min-width:0!important;
min-height:34px!important;
height:auto!important;
padding:0!important;
margin:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
color:#4F4A43!important;
font-size:10.5px!important;
font-weight:500!important;
letter-spacing:.025em!important;
text-align:left!important;
}
html body .site-header.lux-header .orilom-brands-grid .orilom-brand-card:hover{
color:#A77D0B!important;
background:transparent!important;
transform:translateX(2px)!important;
}
}
@media (min-width:1101px) and (max-width:1499px){
:root{--orilom-v45-gutter:clamp(24px,3.2vw,48px);}
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:190px minmax(0,1fr) 230px!important;
column-gap:28px!important;
}
html body .site-header.lux-header .lux-search{
grid-template-columns:140px minmax(0,1fr) 40px!important;
width:min(100%,520px)!important;
max-width:520px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{gap:27px!important;}
}
/* ==========================================================
ORILOM V46 — UNIFIED BRAND SHELL
Final grid discipline: header + nav + mega-menu + footer
share one exact 1360px shell and identical desktop gutters.
V45 functionality/design preserved.
========================================================== */
:root{
--orilom-shell-max:1360px;
--orilom-shell-side:48px;
}
@media (min-width:1101px){
/* One physical shell from header to footer. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main,
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav,
html body footer.site-footer.orilom-footer-v34 .orilom-footer-shell{
width:min(calc(100% - (var(--orilom-shell-side) * 2)),var(--orilom-shell-max))!important;
max-width:var(--orilom-shell-max)!important;
margin-left:auto!important;
margin-right:auto!important;
padding-left:0!important;
padding-right:0!important;
box-sizing:border-box!important;
}
/* Main bar: mathematically centered search with equal side tracks. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand search tools"!important;
grid-template-columns:minmax(190px,1fr) minmax(460px,570px) minmax(190px,1fr)!important;
column-gap:32px!important;
align-items:center!important;
}
html body .site-header.lux-header .lux-brand,
html body .site-header.lux-header .orilom-header-brand-lockup{
justify-self:start!important;
margin-left:0!important;
}
html body .site-header.lux-header .header-tools{
justify-self:end!important;
margin-right:0!important;
}
html body .site-header.lux-header .lux-search{
justify-self:center!important;
width:100%!important;
max-width:570px!important;
}
/* Header lockup = same visual language as footer, compact for navigation. */
html body .site-header.lux-header .orilom-header-brand-lockup .orilom-logo-word,
html body .site-header.lux-header .orilom-header-brand-lockup .lux-brand-name{
line-height:.94!important;
letter-spacing:.035em!important;
}
html body .site-header.lux-header .orilom-header-brand-lockup::before,
html body .site-header.lux-header .orilom-header-brand-lockup::after,
html body .site-header.lux-header .lux-brand::before,
html body .site-header.lux-header .lux-brand::after{
content:none!important;
display:none!important;
}
/* Nav uses the same shell and starts exactly at the footer's left axis. */
html body .site-header.lux-header .main-nav.lux-nav{
width:100%!important;
max-width:none!important;
padding-left:0!important;
padding-right:0!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
justify-content:flex-start!important;
gap:34px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin-left:0!important;
padding-left:0!important;
}
/* Mega-menu is anchored to Boutique, therefore to the same brand axis. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-panel{
left:0!important;
width:min(720px,calc(100vw - (var(--orilom-shell-side) * 2)))!important;
}
}
/* Common laptop widths: keep exact outer axes; only compress internals. */
@media (min-width:1101px) and (max-width:1499px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:minmax(180px,1fr) minmax(430px,520px) minmax(180px,1fr)!important;
column-gap:24px!important;
}
html body .site-header.lux-header .lux-search{
max-width:520px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
gap:26px!important;
}
}
/* Slightly narrower desktop: preserve 48px brand gutter only while it remains comfortable. */
@media (min-width:1101px) and (max-width:1220px){
:root{--orilom-shell-side:32px;}
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:minmax(170px,1fr) minmax(400px,500px) minmax(170px,1fr)!important;
column-gap:20px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
gap:22px!important;
}
}
/* ==========================================================
ORILOM V47 — 10/10 BRAND SYSTEM
Final quiet-luxury alignment pass.
One physical shell, compact centered search, restrained nav,
bronze only as an accent. V46 functionality preserved.
========================================================== */
:root{
--orilom-v47-shell:1360px;
--orilom-v47-gutter:clamp(32px,3vw,48px);
--orilom-v47-line:#E7E3DA;
--orilom-v47-ink:#17130A;
--orilom-v47-bronze:#C69A18;
}
@media (min-width:1101px){
/* One exact brand shell for header, nav and footer. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main,
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav,
html body footer.site-footer.orilom-footer-v34 .orilom-footer-shell{
width:min(calc(100% - (var(--orilom-v47-gutter) * 2)),var(--orilom-v47-shell))!important;
max-width:var(--orilom-v47-shell)!important;
margin-left:auto!important;
margin-right:auto!important;
padding-left:0!important;
padding-right:0!important;
box-sizing:border-box!important;
}
/* Header composition: equal outer tracks, centered search instrument. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-areas:"brand search tools"!important;
grid-template-columns:minmax(210px,1fr) minmax(500px,540px) minmax(210px,1fr)!important;
column-gap:32px!important;
align-items:center!important;
}
html body .site-header.lux-header .lux-brand,
html body .site-header.lux-header .orilom-header-brand-lockup{
justify-self:start!important;
margin-left:0!important;
}
html body .site-header.lux-header .header-tools{
justify-self:end!important;
margin-right:0!important;
}
/* Search: useful filter retained, but visually secondary to the search field. */
html body .site-header.lux-header .lux-search{
justify-self:center!important;
width:100%!important;
max-width:540px!important;
grid-template-columns:145px minmax(0,1fr) 42px!important;
min-height:43px!important;
height:43px!important;
border:0!important;
border-bottom:1px solid #26231E!important;
border-radius:0!important;
background:#fff!important;
box-shadow:none!important;
}
html body .site-header.lux-header .lux-search .orilom-header-category{
display:block!important;
width:145px!important;
min-width:145px!important;
max-width:145px!important;
height:42px!important;
padding:0 24px 0 0!important;
border:0!important;
border-right:1px solid var(--orilom-v47-line)!important;
border-radius:0!important;
background-color:#fff!important;
color:#4F4A43!important;
font-size:11px!important;
font-weight:500!important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input{
height:42px!important;
min-height:42px!important;
padding-left:16px!important;
padding-right:10px!important;
font-size:12px!important;
}
html body .site-header.lux-header .lux-search .orilom-search-submit{
width:42px!important;
height:42px!important;
}
html body .site-header.lux-header .lux-search:focus-within{
border-bottom-color:var(--orilom-v47-bronze)!important;
}
/* Quiet-luxury navigation: neutral structure, bronze only for state. */
html body .site-header.lux-header .main-nav.lux-nav{
width:100%!important;
max-width:none!important;
padding:0!important;
border-top:1px solid var(--orilom-v47-line)!important;
border-bottom:1px solid var(--orilom-v47-line)!important;
background:#fff!important;
box-shadow:none!important;
}
html body .site-header.lux-header .main-nav.lux-nav::before,
html body .site-header.lux-header .main-nav.lux-nav::after{
content:none!important;
display:none!important;
background:none!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
justify-content:flex-start!important;
align-items:center!important;
min-height:52px!important;
gap:34px!important;
border:0!important;
box-shadow:none!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin:0 18px 0 0!important;
padding:0!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger{
min-height:52px!important;
}
/* Keep active/hover underline refined instead of any full-width bronze rule. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a::after,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger::after{
height:1px!important;
max-width:24px!important;
background:var(--orilom-v47-bronze)!important;
}
/* Mega-menu remains functional, aligned to the exact left brand axis. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-panel{
left:0!important;
width:min(720px,calc(100vw - (var(--orilom-v47-gutter) * 2)))!important;
padding:30px 32px 32px!important;
border:1px solid var(--orilom-v47-line)!important;
border-radius:0!important;
box-shadow:0 18px 44px rgba(23,19,10,.08)!important;
}
html body .site-header.lux-header .orilom-brands-grid .orilom-brand-card{
font-size:11px!important;
line-height:1.45!important;
}
}
/* Laptop: preserve the same outer shell; only compact the center instrument. */
@media (min-width:1101px) and (max-width:1280px){
:root{--orilom-v47-gutter:32px;}
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:minmax(185px,1fr) minmax(460px,500px) minmax(185px,1fr)!important;
column-gap:24px!important;
}
html body .site-header.lux-header .lux-search{
max-width:500px!important;
grid-template-columns:140px minmax(0,1fr) 40px!important;
}
html body .site-header.lux-header .lux-search .orilom-header-category{
width:140px!important;
min-width:140px!important;
max-width:140px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
gap:26px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin-right:12px!important;
}
}
/* ==========================================================
ORILOM V48 — FINAL APPBAR PRECISION
Surgical refinement on top of V47:
- true centered search instrument
- tighter editorial mega-menu
- Boutique open state distinct from page-active state
- balanced primary navigation rhythm
========================================================== */
@media (min-width:1101px){
/* Search remains mathematically centered in the common brand shell. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:minmax(210px,1fr) 540px minmax(210px,1fr)!important;
column-gap:30px!important;
}
html body .site-header.lux-header .lux-search{
justify-self:center!important;
width:540px!important;
max-width:540px!important;
grid-template-columns:145px minmax(0,1fr) 42px!important;
}
/* Navigation: Boutique remains the catalogue gateway without looking detached. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
gap:30px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin-right:6px!important;
}
/* Open Boutique = bronze text/chevron, NOT a second active underline. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-trigger,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within .orilom-collections-trigger{
color:#A77D0B!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-trigger::after,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within .orilom-collections-trigger::after{
width:0!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-chevron{
transform:rotate(180deg)!important;
opacity:.9!important;
}
/* Mega-menu: less empty white space, more editorial density. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-panel{
width:min(700px,calc(100vw - (var(--orilom-v47-gutter) * 2)))!important;
padding:24px 30px 26px!important;
box-shadow:0 16px 38px rgba(23,19,10,.075)!important;
}
html body .site-header.lux-header .orilom-collections-shortcuts{
row-gap:14px!important;
column-gap:24px!important;
margin-bottom:20px!important;
padding-bottom:20px!important;
}
html body .site-header.lux-header .orilom-collections-shortcuts a{
font-size:11.5px!important;
line-height:1.35!important;
}
html body .site-header.lux-header .orilom-brands-heading{
margin:0 0 14px!important;
}
html body .site-header.lux-header .orilom-brands-heading strong{
font-size:11px!important;
}
html body .site-header.lux-header .orilom-brands-heading span{
font-size:10px!important;
opacity:.62!important;
}
html body .site-header.lux-header .orilom-brands-grid{
row-gap:12px!important;
column-gap:22px!important;
}
html body .site-header.lux-header .orilom-brands-grid .orilom-brand-card{
font-size:11.25px!important;
line-height:1.35!important;
letter-spacing:.02em!important;
}
}
@media (min-width:1101px) and (max-width:1280px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:minmax(180px,1fr) 500px minmax(180px,1fr)!important;
column-gap:22px!important;
}
html body .site-header.lux-header .lux-search{
width:500px!important;
max-width:500px!important;
grid-template-columns:140px minmax(0,1fr) 40px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
gap:24px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin-right:4px!important;
}
}
/* ==========================================================
ORILOM V49 — FINAL UNIFIED BRAND FRAME
Header, navigation, catalogue context bar and footer share
the same 1360px centered shell and the same responsive gutter.
Compact internal header proportions from V48 are preserved.
========================================================== */
:root{
--orilom-v49-appbar:1360px;
--orilom-v49-appbar-gutter:clamp(32px,3vw,48px);
--orilom-v49-ivory:#FCF8ED;
--orilom-v49-line:#E7E3DA;
--orilom-v49-ink:#17130A;
--orilom-v49-bronze:#C69A18;
}
@media (min-width:1101px){
/* Dense utility frame: same left/right axis for both header rows. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main,
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav,
html body footer.site-footer.orilom-footer-v34 .orilom-footer-shell{
width:min(calc(100% - (var(--orilom-v49-appbar-gutter) * 2)),var(--orilom-v49-appbar))!important;
max-width:var(--orilom-v49-appbar)!important;
margin-left:auto!important;
margin-right:auto!important;
padding-left:0!important;
padding-right:0!important;
box-sizing:border-box!important;
}
/* Compact, balanced appbar: logo and tools stop touching screen edges. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:minmax(205px,1fr) 520px minmax(205px,1fr)!important;
column-gap:28px!important;
}
html body .site-header.lux-header .lux-brand,
html body .site-header.lux-header .orilom-header-brand-lockup{
justify-self:start!important;
margin-left:0!important;
}
html body .site-header.lux-header .header-tools{
justify-self:end!important;
margin-right:0!important;
}
/* Search remains complete, but visually compact. */
html body .site-header.lux-header .lux-search{
justify-self:center!important;
width:520px!important;
max-width:520px!important;
grid-template-columns:142px minmax(0,1fr) 40px!important;
}
html body .site-header.lux-header .lux-search .orilom-header-category{
width:142px!important;
min-width:142px!important;
max-width:142px!important;
}
/* Nav lives on the same exact utility frame. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
justify-content:flex-start!important;
gap:28px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin-right:6px!important;
}
/* Mega-menu remains anchored to Boutique inside the utility frame. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-panel{
left:0!important;
width:min(680px,calc(100vw - (var(--orilom-v49-appbar-gutter) * 2)))!important;
}
/* Product catalogue context bar: quiet, editorial, no full bronze slab. */
body.woocommerce-shop .orilom-shop-breadcrumb-bar,
body.post-type-archive-product .orilom-shop-breadcrumb-bar,
body.tax-product_cat .orilom-shop-breadcrumb-bar,
body.tax-product_tag .orilom-shop-breadcrumb-bar,
body.search.post-type-archive-product .orilom-shop-breadcrumb-bar,
body.search.woocommerce .orilom-shop-breadcrumb-bar,
body.tax-product_brand .orilom-shop-breadcrumb-bar{
background:var(--orilom-v49-ivory)!important;
color:#5A4A20!important;
border-top:1px solid #EFE5C9!important;
border-bottom:1px solid #E8D9AE!important;
box-shadow:none!important;
padding-left:max(var(--orilom-v49-appbar-gutter),calc((100vw - var(--orilom-v49-appbar))/2))!important;
padding-right:max(var(--orilom-v49-appbar-gutter),calc((100vw - var(--orilom-v49-appbar))/2))!important;
}
body.woocommerce-shop .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link,
body.post-type-archive-product .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link,
body.tax-product_cat .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link,
body.tax-product_tag .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link,
body.search.post-type-archive-product .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link,
body.search.woocommerce .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link,
body.tax-product_brand .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link,
body.woocommerce-shop .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-chevron,
body.post-type-archive-product .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-chevron,
body.tax-product_cat .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-chevron,
body.tax-product_tag .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-chevron,
body.search.post-type-archive-product .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-chevron,
body.search.woocommerce .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-chevron,
body.tax-product_brand .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-chevron,
body.woocommerce-shop .orilom-shop-breadcrumb-bar .orilom-shop-bar-meta,
body.post-type-archive-product .orilom-shop-breadcrumb-bar .orilom-shop-bar-meta,
body.tax-product_cat .orilom-shop-breadcrumb-bar .orilom-shop-bar-meta,
body.tax-product_tag .orilom-shop-breadcrumb-bar .orilom-shop-bar-meta,
body.search.post-type-archive-product .orilom-shop-breadcrumb-bar .orilom-shop-bar-meta,
body.search.woocommerce .orilom-shop-breadcrumb-bar .orilom-shop-bar-meta,
body.tax-product_brand .orilom-shop-breadcrumb-bar .orilom-shop-bar-meta{
color:#5A4A20!important;
}
body.tax-product_cat .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link.is-current,
body.woocommerce-shop .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link.is-current,
body.tax-product_brand .orilom-shop-breadcrumb-bar .orilom-shop-breadcrumb-link.is-current{
color:var(--orilom-v49-ink)!important;
}
}
/* Laptop: keep the frame dense without horizontal collisions. */
@media (min-width:1101px) and (max-width:1280px){
/* Keep the exact global shell/gutter; compress only internal header elements. */
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:minmax(185px,1fr) 490px minmax(185px,1fr)!important;
column-gap:22px!important;
}
html body .site-header.lux-header .lux-search{
width:490px!important;
max-width:490px!important;
grid-template-columns:136px minmax(0,1fr) 40px!important;
}
html body .site-header.lux-header .lux-search .orilom-header-category{
width:136px!important;
min-width:136px!important;
max-width:136px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
gap:23px!important;
}
}
/* =========================================================
ORILOM V51 — BOUTIQUE VISIBILITY / QUIET GOLD ACCENT
Scope: desktop primary navigation only.
No gold box: stronger label + signature underline + open-state rail.
========================================================= */
@media (min-width:1101px){
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
position:relative!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger{
position:relative!important;
font-weight:600!important;
letter-spacing:.015em!important;
color:#17130A!important;
}
/* Boutique gets a permanent, restrained ORILOM signature underline. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger::after,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger::after{
content:""!important;
position:absolute!important;
left:50%!important;
bottom:-10px!important;
width:32px!important;
height:2px!important;
border-radius:999px!important;
background:#C69A18!important;
opacity:.92!important;
transform:translateX(-50%)!important;
transition:width .22s ease,background-color .22s ease,opacity .22s ease!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:hover .orilom-collections-trigger::after{
width:40px!important;
background:#A77D0B!important;
opacity:1!important;
}
/* Open state: bronze typography + tiny vertical rail, never a gold rectangle. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-trigger,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within .orilom-collections-trigger{
color:#A77D0B!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-trigger::after,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within .orilom-collections-trigger::after{
width:40px!important;
height:2px!important;
background:#C69A18!important;
opacity:1!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open::before,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within::before{
content:""!important;
position:absolute!important;
left:-12px!important;
top:50%!important;
width:2px!important;
height:16px!important;
border-radius:999px!important;
background:#C69A18!important;
transform:translateY(-50%)!important;
opacity:.85!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon svg{
opacity:.82!important;
}
}
/* =========================================================
ORILOM V52 — BOUTIQUE MICRO-CAPSULE PREMIUM
Scope: desktop primary navigation only.
Goal: make BOUTIQUE immediately identifiable without a heavy CTA.
========================================================= */
@media (min-width:1101px){
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
position:relative!important;
margin-right:10px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:7px!important;
min-height:32px!important;
padding:6px 12px!important;
border:1px solid #DCC98E!important;
border-radius:6px!important;
background:#FCF8ED!important;
color:#17130A!important;
font-weight:600!important;
line-height:1!important;
letter-spacing:.01em!important;
box-shadow:none!important;
transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease!important;
}
/* Disable the previous underline/rail language: the capsule is now the signature. */
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger::after,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger::after,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open::before,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within::before{
content:none!important;
display:none!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:hover .orilom-collections-trigger,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within .orilom-collections-trigger,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-trigger{
background:#FFFDF7!important;
border-color:#C69A18!important;
color:#A77D0B!important;
transform:translateY(-1px)!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger-icon svg{
opacity:.76!important;
width:13px!important;
height:13px!important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:hover .orilom-collections-trigger-icon,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-trigger-icon,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within .orilom-collections-trigger-icon{
opacity:1!important;
}
}
/* =========================================================
ORILOM V53 — BOUTIQUE CONNECTED TAB
Scope: desktop catalogue contexts only.
Goal: visually connect the BOUTIQUE gateway to the catalogue
breadcrumb/context strip below, without a double border.
========================================================= */
@media (min-width:1101px){
/* Catalogue pages: nav and context strip become one continuous system. */
body.woocommerce-shop .site-header.lux-header .main-nav.lux-nav,
body.post-type-archive-product .site-header.lux-header .main-nav.lux-nav,
body.tax-product_cat .site-header.lux-header .main-nav.lux-nav,
body.tax-product_tag .site-header.lux-header .main-nav.lux-nav,
body.tax-product_brand .site-header.lux-header .main-nav.lux-nav,
body.search.woocommerce .site-header.lux-header .main-nav.lux-nav,
body.search.post-type-archive-product .site-header.lux-header .main-nav.lux-nav{
position:relative!important;
z-index:31!important;
border-bottom-color:#E8D9AE!important;
}
/* Connected tab: top + sides only. The bottom visually opens into the strip. */
body.woocommerce-shop .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger,
body.post-type-archive-product .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger,
body.tax-product_cat .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger,
body.tax-product_tag .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger,
body.tax-product_brand .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger,
body.search.woocommerce .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger,
body.search.post-type-archive-product .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger{
position:relative!important;
z-index:34!important;
min-height:34px!important;
padding:7px 13px 8px!important;
margin-bottom:-1px!important;
transform:translateY(1px)!important;
background:#FCF8ED!important;
border:1px solid #D8B557!important;
border-bottom:0!important;
border-radius:6px 6px 0 0!important;
box-shadow:none!important;
}
/* Small ivory bridge masks the nav divider exactly under the tab. */
body.woocommerce-shop .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger::before,
body.post-type-archive-product .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger::before,
body.tax-product_cat .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger::before,
body.tax-product_tag .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger::before,
body.tax-product_brand .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger::before,
body.search.woocommerce .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger::before,
body.search.post-type-archive-product .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger::before{
content:""!important;
position:absolute!important;
left:0!important;
right:0!important;
bottom:-3px!important;
height:4px!important;
background:#FCF8ED!important;
pointer-events:none!important;
}
/* The catalogue strip touches the navigation: no second top rule. */
body.woocommerce-shop .orilom-shop-breadcrumb-bar,
body.post-type-archive-product .orilom-shop-breadcrumb-bar,
body.tax-product_cat .orilom-shop-breadcrumb-bar,
body.tax-product_tag .orilom-shop-breadcrumb-bar,
body.tax-product_brand .orilom-shop-breadcrumb-bar,
body.search.woocommerce .orilom-shop-breadcrumb-bar,
body.search.post-type-archive-product .orilom-shop-breadcrumb-bar{
margin-top:0!important;
border-top:0!important;
background:#FCF8ED!important;
position:relative!important;
z-index:20!important;
}
/* Open/hover keeps the same connected geometry; only the accent changes. */
body.woocommerce-shop .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
body.woocommerce-shop .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger,
body.post-type-archive-product .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
body.post-type-archive-product .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger,
body.tax-product_cat .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
body.tax-product_cat .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger,
body.tax-product_tag .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
body.tax-product_tag .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger,
body.tax-product_brand .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
body.tax-product_brand .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger{
background:#FCF8ED!important;
border-color:#C69A18!important;
border-bottom:0!important;
color:#A77D0B!important;
transform:translateY(1px)!important;
}
}
/* =========================================================
ORILOM V53 — SINGLE PRODUCT HEADER CONTINUITY
Fiche produit = même appbar / onglet Boutique / barre contexte
que Boutique, catégories et recherche produit.
========================================================= */
@media (min-width:901px){
/* Même séparation de navigation que la Boutique. */
body.single-product .site-header.lux-header .main-nav.lux-nav{
position:relative!important;
z-index:31!important;
border-bottom-color:#E8D9AE!important;
}
/* Boutique devient l'onglet connecté à la barre de contexte produit. */
body.single-product .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger{
position:relative!important;
z-index:34!important;
min-height:34px!important;
padding:7px 13px 8px!important;
margin-bottom:-1px!important;
transform:translateY(1px)!important;
background:#FCF8ED!important;
border:1px solid #D8B557!important;
border-bottom:0!important;
border-radius:6px 6px 0 0!important;
box-shadow:none!important;
}
/* Pont ivoire : supprime visuellement le trait sous l'onglet Boutique. */
body.single-product .site-header.lux-header .orilom-nav-boutique .orilom-collections-trigger::before{
content:""!important;
position:absolute!important;
left:0!important;
right:0!important;
bottom:-3px!important;
height:4px!important;
background:#FCF8ED!important;
pointer-events:none!important;
}
body.single-product .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
body.single-product .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger{
background:#FCF8ED!important;
border-color:#C69A18!important;
border-bottom:0!important;
color:#A77D0B!important;
transform:translateY(1px)!important;
}
}
/* Barre fiche produit : exactement le langage visuel de la Boutique. */
body.single-product .orilom-product-breadcrumb-bar,
body.single-product .lux-product-bar{
position:relative!important;
left:auto!important;
right:auto!important;
width:100%!important;
max-width:none!important;
min-height:42px!important;
margin:0 0 24px!important;
margin-left:0!important;
margin-right:0!important;
box-sizing:border-box!important;
display:flex!important;
align-items:center!important;
gap:12px!important;
padding-top:14px!important;
padding-bottom:14px!important;
padding-left:max(var(--orilom-v49-appbar-gutter,32px),calc((100vw - var(--orilom-v49-appbar,1360px))/2))!important;
padding-right:max(var(--orilom-v49-appbar-gutter,32px),calc((100vw - var(--orilom-v49-appbar,1360px))/2))!important;
background:#FCF8ED!important;
color:#5A4A20!important;
border-top:0!important;
border-bottom:1px solid #E8D9AE!important;
border-radius:0!important;
box-shadow:none!important;
font-family:Arial,Helvetica,sans-serif!important;
font-size:11px!important;
line-height:1.2!important;
z-index:20!important;
}
body.single-product .orilom-product-breadcrumb-left{
display:flex!important;
align-items:center!important;
gap:10px!important;
min-width:0!important;
}
body.single-product .orilom-product-breadcrumb-bar a,
body.single-product .lux-product-bar a{
display:inline-flex!important;
align-items:center!important;
margin:0!important;
padding:0!important;
color:#5A4A20!important;
background:transparent!important;
border:0!important;
font-size:11px!important;
line-height:1.2!important;
font-weight:400!important;
text-decoration:none!important;
white-space:nowrap!important;
}
body.single-product .orilom-product-breadcrumb-bar a:hover,
body.single-product .lux-product-bar a:hover{
color:#111!important;
}
body.single-product .orilom-product-breadcrumb-bar .orilom-product-current{
display:block!important;
max-width:min(42vw,520px)!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
color:#111!important;
font-size:11px!important;
font-weight:600!important;
line-height:1.2!important;
}
body.single-product .orilom-product-breadcrumb-bar .lux-product-nav,
body.single-product .lux-product-bar .lux-product-nav{
margin-left:auto!important;
color:#5A4A20!important;
font-size:11px!important;
line-height:1.2!important;
font-weight:400!important;
white-space:nowrap!important;
}
/* Annule l'ancien grand espace prévu pour la bande bronze. */
body.single-product .orilom-product-breadcrumb-bar + div.product{
padding-top:18px!important;
}
@media(max-width:900px){
body.single-product .orilom-product-breadcrumb-bar,
body.single-product .lux-product-bar{
min-height:40px!important;
margin-bottom:16px!important;
padding:12px 18px!important;
gap:8px!important;
}
body.single-product .orilom-product-breadcrumb-left{
gap:8px!important;
overflow-x:auto!important;
scrollbar-width:none!important;
}
body.single-product .orilom-product-breadcrumb-left::-webkit-scrollbar{
display:none!important;
}
body.single-product .orilom-product-breadcrumb-bar .lux-product-nav,
body.single-product .lux-product-bar .lux-product-nav{
display:none!important;
}
body.single-product .orilom-product-breadcrumb-bar a,
body.single-product .orilom-product-breadcrumb-bar .orilom-product-current,
body.single-product .lux-product-bar a{
font-size:10px!important;
}
body.single-product .orilom-product-breadcrumb-bar .orilom-product-current{
max-width:220px!important;
}
body.single-product .orilom-product-breadcrumb-bar + div.product{
padding-top:14px!important;
}
}
/* =========================================================
ORILOM V54 — SINGLE PRODUCT CONTEXT BAR FULL-BLEED
Corrige la fiche produit : la barre contexte doit reprendre
exactement la largeur/continuité visuelle de la Boutique.
========================================================= */
body.single-product .orilom-product-breadcrumb-bar,
body.single-product .lux-product-bar{
/* Sort du conteneur produit centré et reprend toute la largeur écran. */
width:100vw!important;
max-width:100vw!important;
margin-left:calc(50% - 50vw)!important;
margin-right:calc(50% - 50vw)!important;
margin-top:0!important;
margin-bottom:24px!important;
/* Même bande ivoire que Boutique. */
min-height:42px!important;
padding-top:14px!important;
padding-bottom:14px!important;
padding-left:max(
var(--orilom-v49-appbar-gutter,32px),
calc((100vw - var(--orilom-v49-appbar,1360px))/2)
)!important;
padding-right:max(
var(--orilom-v49-appbar-gutter,32px),
calc((100vw - var(--orilom-v49-appbar,1360px))/2)
)!important;
background:#FCF8ED!important;
border-top:0!important;
border-bottom:1px solid #E8D9AE!important;
border-radius:0!important;
box-shadow:none!important;
box-sizing:border-box!important;
position:relative!important;
z-index:20!important;
}
/* Le wrapper WooCommerce ne doit pas recréer une marge blanche au-dessus
de la barre contexte lorsqu'elle est le premier élément de la zone produit. */
body.single-product .shop-content{
padding-top:0!important;
}
/* Conserve le contenu produit dans son shell normal après la barre. */
body.single-product .orilom-product-breadcrumb-bar + div.product,
body.single-product .lux-product-bar + div.product{
margin-left:auto!important;
margin-right:auto!important;
padding-top:18px!important;
}
@media(max-width:900px){
body.single-product .orilom-product-breadcrumb-bar,
body.single-product .lux-product-bar{
width:100vw!important;
max-width:100vw!important;
margin-left:calc(50% - 50vw)!important;
margin-right:calc(50% - 50vw)!important;
margin-bottom:16px!important;
padding:12px 18px!important;
}
}
/* =========================================================
ORILOM V55 — BLOG HEADER / CONTEXT STRIP UNIFICATION
Blog = same visual grammar as Boutique / Product.
========================================================= */
/* Active Blog tab: same attached-tab language as Boutique */
body.blog .main-nav.lux-nav .orilom-primary-nav > li > a[href$="/blog/"],
body.blog .main-nav.lux-nav .orilom-primary-nav > li.current_page_parent > a,
body.blog .main-nav.lux-nav .orilom-primary-nav > li.current-menu-item > a{
position:relative!important;
z-index:3!important;
background:#FCF8ED!important;
border:1px solid #D8B65C!important;
border-bottom-color:#FCF8ED!important;
border-radius:7px 7px 0 0!important;
color:#111!important;
box-shadow:none!important;
}
body.blog .main-nav.lux-nav{
border-bottom-color:#D8B65C!important;
}
/* Full-width context strip directly below nav */
body.blog .orilom-blog-breadcrumb-bar{
position:relative!important;
left:50%!important;
width:100vw!important;
max-width:none!important;
margin:0 0 0 -50vw!important;
min-height:42px!important;
padding:14px max(
var(--orilom-v49-appbar-gutter,32px),
calc((100vw - var(--orilom-v49-appbar,1360px))/2)
)!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:24px!important;
background:#FCF8ED!important;
color:#5A4A20!important;
border-top:0!important;
border-bottom:1px solid #E8D9AE!important;
box-sizing:border-box!important;
}
body.blog .orilom-blog-breadcrumb-left{
display:flex!important;
align-items:center!important;
gap:10px!important;
min-width:0!important;
}
body.blog .orilom-blog-breadcrumb-link,
body.blog .orilom-blog-breadcrumb-chevron,
body.blog .orilom-blog-bar-meta{
color:#5A4A20!important;
font-size:11px!important;
line-height:1.2!important;
}
body.blog .orilom-blog-breadcrumb-link{
text-decoration:none!important;
font-weight:400!important;
}
body.blog .orilom-blog-breadcrumb-link.is-current{
color:#111!important;
font-weight:600!important;
}
body.blog .orilom-blog-breadcrumb-link:hover{
color:#111!important;
}
body.blog .orilom-blog-bar-meta{
margin-left:auto!important;
white-space:nowrap!important;
font-weight:400!important;
}
/* Keep Journal spacing premium, but remove the oversized blank gap created by the missing strip */
body.blog .orilom-blog-breadcrumb-bar + .blog-page-v3{
margin-top:0!important;
padding-top:64px!important;
}
@media (max-width:650px){
body.blog .orilom-blog-breadcrumb-bar{
min-height:40px!important;
padding:12px 18px!important;
gap:12px!important;
}
body.blog .orilom-blog-breadcrumb-left{
overflow-x:auto!important;
white-space:nowrap!important;
scrollbar-width:none!important;
}
body.blog .orilom-blog-breadcrumb-left::-webkit-scrollbar{
display:none!important;
}
body.blog .orilom-blog-bar-meta{
display:none!important;
}
body.blog .orilom-blog-breadcrumb-link,
body.blog .orilom-blog-breadcrumb-chevron{
font-size:10px!important;
}
body.blog .orilom-blog-breadcrumb-bar + .blog-page-v3{
padding-top:36px!important;
}
}
/* =========================================================
ORILOM V56 — BLOG NAV ACTIVE STATE CLEANUP
Boutique reste le seul contrôle encadré.
Blog actif = accent éditorial discret, sans deuxième onglet encadré.
========================================================= */
body.blog .main-nav.lux-nav .orilom-primary-nav > li > a[href$="/blog/"],
body.blog .main-nav.lux-nav .orilom-primary-nav > li.current_page_parent > a,
body.blog .main-nav.lux-nav .orilom-primary-nav > li.current-menu-item > a{
background:transparent!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
color:#111!important;
z-index:auto!important;
}
/* Etat actif du journal : texte + petit soulignement or, pas de deuxième cadre. */
body.blog .main-nav.lux-nav .orilom-primary-nav > li > a[href$="/blog/"]::after,
body.blog .main-nav.lux-nav .orilom-primary-nav > li.current_page_parent > a::after,
body.blog .main-nav.lux-nav .orilom-primary-nav > li.current-menu-item > a::after{
width:22px!important;
height:2px!important;
background:#C9971A!important;
bottom:12px!important;
}
/* La ligne sous la navigation reste cohérente avec la barre contexte ivoire. */
body.blog .main-nav.lux-nav{
border-bottom-color:#E8D9AE!important;
}
/* =========================================================
ORILOM V57 — BLOG: ACTIVE TAB = BLOG PARFUM
Sur le Journal, BOUTIQUE redevient un lien normal.
BLOG PARFUM devient l'onglet connecté à la barre ivoire.
========================================================= */
@media (min-width:1101px){
/* 1) Blog page: remove the permanent Boutique capsule. */
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin-right:0!important;
}
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger{
min-height:auto!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
color:inherit!important;
font-weight:inherit!important;
letter-spacing:inherit!important;
box-shadow:none!important;
transform:none!important;
}
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:hover .orilom-collections-trigger,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within .orilom-collections-trigger,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-trigger{
background:transparent!important;
border:0!important;
color:#A77D0B!important;
transform:none!important;
}
/* 2) Blog page: BLOG PARFUM is the connected active tab. */
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a[href$="/blog/"],
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current_page_parent > a,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current-menu-item > a{
position:relative!important;
z-index:34!important;
min-height:34px!important;
padding:7px 13px 8px!important;
margin-bottom:-1px!important;
transform:translateY(1px)!important;
background:#FCF8ED!important;
border:1px solid #D8B557!important;
border-bottom:0!important;
border-radius:6px 6px 0 0!important;
color:#111!important;
box-shadow:none!important;
}
/* Remove V56 underline from the active Blog tab. */
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a[href$="/blog/"]::after,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current_page_parent > a::after,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current-menu-item > a::after{
content:none!important;
display:none!important;
}
body.blog .site-header.lux-header .main-nav.lux-nav{
position:relative!important;
z-index:31!important;
border-bottom-color:#E8D9AE!important;
}
}
/* =========================================================
ORILOM V58 — BLOG HEADER = CATALOGUE HEADER LANGUAGE
Le Journal garde BOUTIQUE comme onglet connecté, exactement
comme Boutique / Pour Lui. BLOG PARFUM reste un lien normal.
========================================================= */
@media (min-width:1101px){
/* Navigation + barre contexte = même continuité que le catalogue. */
body.blog .site-header.lux-header .main-nav.lux-nav{
position:relative!important;
z-index:31!important;
border-bottom-color:#E8D9AE!important;
}
/* BOUTIQUE reprend exactement l'onglet connecté du catalogue. */
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin-right:22px!important;
}
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger{
position:relative!important;
z-index:34!important;
min-height:34px!important;
padding:7px 13px 8px!important;
margin-bottom:-1px!important;
transform:translateY(1px)!important;
background:#FCF8ED!important;
border:1px solid #D8B557!important;
border-bottom:0!important;
border-radius:6px 6px 0 0!important;
color:#111!important;
font-weight:inherit!important;
letter-spacing:inherit!important;
box-shadow:none!important;
}
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger::before,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger::before{
content:""!important;
display:block!important;
position:absolute!important;
left:0!important;
right:0!important;
bottom:-3px!important;
width:auto!important;
height:4px!important;
background:#FCF8ED!important;
pointer-events:none!important;
}
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:hover .orilom-collections-trigger,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique:focus-within .orilom-collections-trigger,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique.is-open .orilom-collections-trigger{
background:#FCF8ED!important;
border:1px solid #C69A18!important;
border-bottom:0!important;
color:#A77D0B!important;
transform:translateY(1px)!important;
}
/* BLOG PARFUM n'est plus un second onglet actif : lien nav normal. */
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a[href$="/blog/"],
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current_page_parent > a,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current-menu-item > a{
position:relative!important;
z-index:auto!important;
min-height:auto!important;
padding:0!important;
margin-bottom:0!important;
transform:none!important;
background:transparent!important;
border:0!important;
border-radius:0!important;
color:#111!important;
box-shadow:none!important;
}
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a[href$="/blog/"]::after,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current_page_parent > a::after,
body.blog .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current-menu-item > a::after{
content:none!important;
display:none!important;
}
/* Barre ivoire collée sous la nav, comme Pour Lui / Boutique. */
body.blog .orilom-blog-breadcrumb-bar{
margin-top:0!important;
border-top:0!important;
background:#FCF8ED!important;
position:relative!important;
z-index:20!important;
}
}
/* =========================================================
ORILOM V59 — BLOG CONTEXT STRIP = CATALOGUE STRIP SIZE
Blog: même largeur plein écran, même hauteur et mêmes
paddings que Boutique / Pour Lui / Pour Elle.
========================================================= */
body.blog .orilom-blog-breadcrumb-bar{
position:relative!important;
left:50%!important;
width:100vw!important;
max-width:100vw!important;
min-height:0!important;
margin:0 0 0 -50vw!important;
padding:21px max(
var(--orilom-v49-appbar-gutter,32px),
calc((100vw - var(--orilom-v49-appbar,1360px))/2)
)!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:12px!important;
box-sizing:border-box!important;
background:#FCF8ED!important;
border-top:0!important;
border-bottom:1px solid #E8D9AE!important;
}
@media(max-width:650px){
body.blog .orilom-blog-breadcrumb-bar{
width:100vw!important;
max-width:100vw!important;
margin-left:-50vw!important;
padding:14px 18px!important;
}
}
/* =========================================================
ORILOM V60 — SINGLE BLOG ARTICLE CONTEXT STRIP
Articles du Journal : même header / bande ivoire que Blog
et catégories. BOUTIQUE reste l'onglet connecté.
========================================================= */
/* Bande contexte article = dimensions exactes Blog/Catalogue. */
body.single-post .orilom-article-breadcrumb-bar{
position:relative!important;
left:50%!important;
width:100vw!important;
max-width:100vw!important;
min-height:0!important;
margin:0 0 0 -50vw!important;
padding:21px max(
var(--orilom-v49-appbar-gutter,32px),
calc((100vw - var(--orilom-v49-appbar,1360px))/2)
)!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:12px!important;
box-sizing:border-box!important;
background:#FCF8ED!important;
color:#5A4A20!important;
border-top:0!important;
border-bottom:1px solid #E8D9AE!important;
border-radius:0!important;
box-shadow:none!important;
z-index:20!important;
}
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-breadcrumb-left{
display:flex!important;
align-items:center!important;
gap:10px!important;
min-width:0!important;
}
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-breadcrumb-link,
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-breadcrumb-chevron,
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-bar-meta{
color:#5A4A20!important;
font-size:11px!important;
line-height:1.2!important;
}
body.single-post .orilom-article-breadcrumb-bar a.orilom-blog-breadcrumb-link:hover{
color:#111!important;
}
body.single-post .orilom-article-breadcrumb-bar .is-current{
max-width:min(34vw,420px)!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
color:#111!important;
font-weight:600!important;
}
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-bar-meta{
margin-left:auto!important;
white-space:nowrap!important;
}
/* L'article commence avec le même rythme vertical après la bande. */
body.single-post .orilom-article-breadcrumb-bar + .article-page-v3{
padding-top:52px!important;
}
@media (min-width:1101px){
body.single-post .site-header.lux-header .main-nav.lux-nav{
position:relative!important;
z-index:31!important;
border-bottom-color:#E8D9AE!important;
}
/* Comme les catégories : BOUTIQUE reste l'onglet connecté. */
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin-right:22px!important;
}
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger{
position:relative!important;
z-index:34!important;
min-height:34px!important;
padding:7px 13px 8px!important;
margin-bottom:-1px!important;
transform:translateY(1px)!important;
background:#FCF8ED!important;
border:1px solid #D8B557!important;
border-bottom:0!important;
border-radius:6px 6px 0 0!important;
color:#111!important;
box-shadow:none!important;
}
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger::before,
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .lux-brands.orilom-collections-trigger::before{
content:""!important;
display:block!important;
position:absolute!important;
left:0!important;
right:0!important;
bottom:-3px!important;
width:auto!important;
height:4px!important;
background:#FCF8ED!important;
pointer-events:none!important;
}
/* WordPress peut marquer BLOG PARFUM comme parent courant sur un article.
On neutralise cet état pour garder exactement le langage des catégories. */
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a[href$="/blog/"],
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current_page_parent > a,
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current-menu-item > a{
position:relative!important;
z-index:auto!important;
min-height:auto!important;
padding:0!important;
margin-bottom:0!important;
transform:none!important;
background:transparent!important;
border:0!important;
border-radius:0!important;
color:#111!important;
box-shadow:none!important;
}
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a[href$="/blog/"]::after,
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current_page_parent > a::after,
body.single-post .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li.current-menu-item > a::after{
content:none!important;
display:none!important;
}
}
@media(max-width:650px){
body.single-post .orilom-article-breadcrumb-bar{
width:100vw!important;
max-width:100vw!important;
margin-left:-50vw!important;
padding:14px 18px!important;
gap:12px!important;
}
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-breadcrumb-left{
overflow-x:auto!important;
white-space:nowrap!important;
scrollbar-width:none!important;
}
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-breadcrumb-left::-webkit-scrollbar{
display:none!important;
}
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-bar-meta{
display:none!important;
}
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-breadcrumb-link,
body.single-post .orilom-article-breadcrumb-bar .orilom-blog-breadcrumb-chevron{
font-size:10px!important;
}
body.single-post .orilom-article-breadcrumb-bar .is-current{
max-width:220px!important;
}
body.single-post .orilom-article-breadcrumb-bar + .article-page-v3{
padding-top:36px!important;
}
}
/* =========================================================
ORILOM V61 — JOURNAL EDITORIAL SYSTEM 10/10
Blog listing + single article. Premium, lisible, e-commerce.
========================================================= */
:root{
--orilom-editorial-ink:#121212;
--orilom-editorial-muted:#667085;
--orilom-editorial-line:#E8E5DE;
--orilom-editorial-paper:#FCFBF8;
--orilom-editorial-accent:#08A88A;
--orilom-editorial-gold:#B98A10;
--orilom-editorial-navy:#10202C;
}
/* ---------- Journal index ---------- */
body.blog .orilom-journal{
width:min(calc(100% - 64px),1120px)!important;
margin:0 auto!important;
padding:72px 0 96px!important;
}
body.blog .orilom-journal-hero{
max-width:900px!important;
margin:0 0 36px!important;
}
.orilom-editorial-kicker,
body.blog .orilom-journal-hero .orilom-editorial-kicker{
display:block!important;
margin:0 0 12px!important;
color:var(--orilom-editorial-accent)!important;
font-family:Arial,sans-serif!important;
font-size:11px!important;
font-weight:800!important;
line-height:1.2!important;
letter-spacing:.16em!important;
text-transform:uppercase!important;
}
body.blog .orilom-journal-hero h1{
margin:0!important;
max-width:900px!important;
color:var(--orilom-editorial-ink)!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:clamp(48px,5.2vw,74px)!important;
font-weight:700!important;
line-height:.96!important;
letter-spacing:-.045em!important;
text-wrap:balance!important;
}
body.blog .orilom-journal-hero p{
max-width:690px!important;
margin:22px 0 0!important;
color:var(--orilom-editorial-muted)!important;
font-size:16px!important;
line-height:1.65!important;
}
body.blog .orilom-journal-topics{
display:flex!important;
flex-wrap:wrap!important;
align-items:center!important;
gap:8px 24px!important;
margin:0 0 34px!important;
padding:18px 0!important;
border-top:1px solid var(--orilom-editorial-line)!important;
border-bottom:1px solid var(--orilom-editorial-line)!important;
}
body.blog .orilom-journal-topics a{
position:relative!important;
color:#585858!important;
font-size:11px!important;
font-weight:700!important;
letter-spacing:.06em!important;
text-transform:uppercase!important;
text-decoration:none!important;
}
body.blog .orilom-journal-topics a:hover,
body.blog .orilom-journal-topics a.is-active{color:#111!important;}
body.blog .orilom-journal-topics a.is-active::after{
content:""!important;
position:absolute!important;
left:0!important;
right:0!important;
bottom:-19px!important;
height:2px!important;
background:var(--orilom-editorial-gold)!important;
}
body.blog .orilom-journal-grid{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:28px 20px!important;
}
body.blog .orilom-journal-card{
min-width:0!important;
overflow:hidden!important;
border:1px solid #E5E7EB!important;
border-radius:12px!important;
background:#fff!important;
box-shadow:none!important;
transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease!important;
}
body.blog .orilom-journal-card:hover{
transform:translateY(-3px)!important;
border-color:#D8D3C7!important;
box-shadow:0 16px 36px rgba(17,17,17,.07)!important;
}
body.blog .orilom-journal-cover{
position:relative!important;
display:block!important;
aspect-ratio:16/9!important;
overflow:hidden!important;
background:linear-gradient(135deg,#0E1D29,#173B3F)!important;
text-decoration:none!important;
}
body.blog .orilom-journal-cover img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
transition:transform .45s ease!important;
}
body.blog .orilom-journal-card:hover .orilom-journal-cover img{transform:scale(1.025)!important;}
body.blog .orilom-journal-cover-index{
position:absolute!important;
left:50%!important;
top:50%!important;
transform:translate(-50%,-50%)!important;
color:rgba(255,255,255,.09)!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:62px!important;
font-weight:700!important;
}
body.blog .orilom-journal-cover-brand{
position:absolute!important;
left:18px!important;
bottom:16px!important;
color:rgba(255,255,255,.68)!important;
font-size:9px!important;
font-weight:800!important;
letter-spacing:.18em!important;
}
body.blog .orilom-journal-card-body{padding:24px 24px 26px!important;}
body.blog .orilom-journal-card-meta{
display:flex!important;
gap:7px!important;
margin:0 0 13px!important;
color:var(--orilom-editorial-accent)!important;
font-size:10px!important;
font-weight:800!important;
letter-spacing:.1em!important;
text-transform:uppercase!important;
}
body.blog .orilom-journal-card h2{
margin:0!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:26px!important;
font-weight:500!important;
line-height:1.05!important;
letter-spacing:-.025em!important;
}
body.blog .orilom-journal-card h2 a{color:#171717!important;text-decoration:none!important;}
body.blog .orilom-journal-card-body > p{
margin:17px 0 19px!important;
color:#677085!important;
font-size:13px!important;
line-height:1.65!important;
}
.orilom-editorial-link{
color:#111!important;
font-size:11px!important;
font-weight:800!important;
text-decoration:none!important;
}
.orilom-editorial-link span{display:inline-block!important;transition:transform .2s ease!important;}
.orilom-editorial-link:hover span{transform:translateX(3px)!important;}
body.blog .orilom-journal-pagination{margin-top:48px!important;}
body.blog .orilom-journal-pagination .nav-links{display:flex!important;align-items:center!important;gap:8px!important;}
body.blog .orilom-journal-pagination .page-numbers{
display:inline-flex!important;align-items:center!important;justify-content:center!important;
min-width:38px!important;height:38px!important;padding:0 12px!important;
border:1px solid #E5E7EB!important;border-radius:999px!important;
color:#222!important;text-decoration:none!important;font-size:11px!important;font-weight:700!important;
}
body.blog .orilom-journal-pagination .page-numbers.current{background:#111!important;color:#fff!important;border-color:#111!important;}
/* ---------- Article ---------- */
body.single-post .orilom-article{
width:min(calc(100% - 64px),1120px)!important;
margin:0 auto!important;
padding:70px 0 92px!important;
}
body.single-post .orilom-article-breadcrumb-bar + .orilom-article{padding-top:70px!important;}
body.single-post .orilom-article-hero{
width:min(100%,920px)!important;
margin:0 auto!important;
text-align:left!important;
}
body.single-post .orilom-article-meta{
display:flex!important;
gap:8px!important;
margin:0 0 16px!important;
color:var(--orilom-editorial-accent)!important;
font-size:10px!important;
font-weight:800!important;
letter-spacing:.14em!important;
text-transform:uppercase!important;
}
body.single-post .orilom-article-hero h1{
margin:0!important;
color:#111!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:clamp(50px,5.5vw,74px)!important;
font-weight:700!important;
line-height:.94!important;
letter-spacing:-.045em!important;
text-wrap:balance!important;
}
body.single-post .orilom-article-deck{
max-width:780px!important;
margin:26px 0 0!important;
color:#596273!important;
font-size:18px!important;
line-height:1.65!important;
}
body.single-post .orilom-article-byline{
display:flex!important;
flex-wrap:wrap!important;
gap:8px!important;
margin-top:22px!important;
padding-top:18px!important;
border-top:1px solid var(--orilom-editorial-line)!important;
color:#777!important;
font-size:11px!important;
}
body.single-post .orilom-article-featured{
width:min(100%,1000px)!important;
margin:48px auto 0!important;
border-radius:14px!important;
overflow:hidden!important;
background:#F5F5F3!important;
}
body.single-post .orilom-article-featured img{display:block!important;width:100%!important;height:auto!important;}
body.single-post .orilom-article-layout{width:min(100%,760px)!important;margin:54px auto 0!important;}
body.single-post .orilom-article-content{color:#262626!important;font-size:17px!important;line-height:1.8!important;}
body.single-post .orilom-article-content > p{margin:0 0 24px!important;}
body.single-post .orilom-article-content h2{
margin:64px 0 20px!important;
color:#111!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:36px!important;
font-weight:600!important;
line-height:1.05!important;
letter-spacing:-.03em!important;
}
body.single-post .orilom-article-content h3{
margin:40px 0 14px!important;
color:#171717!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:25px!important;
font-weight:600!important;
line-height:1.15!important;
}
body.single-post .orilom-article-content h2:first-child{margin-top:0!important;}
body.single-post .orilom-article-content ul,
body.single-post .orilom-article-content ol{margin:0 0 28px!important;padding-left:24px!important;}
body.single-post .orilom-article-content li{margin:8px 0!important;}
body.single-post .orilom-article-content a{color:#7E5E00!important;text-decoration-thickness:1px!important;text-underline-offset:3px!important;}
body.single-post .orilom-article-content blockquote{
margin:42px 0!important;
padding:24px 28px!important;
border-left:3px solid var(--orilom-editorial-gold)!important;
background:var(--orilom-editorial-paper)!important;
color:#262626!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:22px!important;
line-height:1.45!important;
}
body.single-post .orilom-article-content table{
width:100%!important;
margin:36px 0!important;
border-collapse:collapse!important;
border:1px solid #E3E0D8!important;
background:#fff!important;
font-size:14px!important;
line-height:1.5!important;
}
body.single-post .orilom-article-content th,
body.single-post .orilom-article-content td{padding:14px 16px!important;border-bottom:1px solid #EAE7E0!important;text-align:left!important;vertical-align:top!important;}
body.single-post .orilom-article-content th{background:#FAF7EF!important;color:#111!important;font-weight:800!important;}
body.single-post .orilom-article-content img{max-width:100%!important;height:auto!important;border-radius:10px!important;}
body.single-post .orilom-article-shop-cta{
margin:72px 0 0!important;
padding:38px!important;
border:1px solid #E4DDC9!important;
border-radius:14px!important;
background:#FBF8F0!important;
}
body.single-post .orilom-article-shop-cta h2{
margin:0!important;
font-size:34px!important;
}
body.single-post .orilom-article-shop-cta p{margin:14px 0 22px!important;color:#656565!important;font-size:14px!important;line-height:1.6!important;}
body.single-post .orilom-article-shop-actions{display:flex!important;flex-wrap:wrap!important;gap:10px!important;}
body.single-post .orilom-article-primary,
body.single-post .orilom-article-secondary{
display:inline-flex!important;align-items:center!important;justify-content:center!important;
min-height:44px!important;padding:0 18px!important;border-radius:6px!important;
font-size:11px!important;font-weight:800!important;text-decoration:none!important;
}
body.single-post .orilom-article-primary{background:#111!important;color:#fff!important;border:1px solid #111!important;}
body.single-post .orilom-article-secondary{background:transparent!important;color:#111!important;border:1px solid #CFC8B5!important;}
body.single-post .orilom-related{
width:min(100%,1120px)!important;
margin:90px auto 0!important;
padding-top:48px!important;
border-top:1px solid var(--orilom-editorial-line)!important;
}
body.single-post .orilom-related-head{margin-bottom:26px!important;}
body.single-post .orilom-related-head h2{
margin:0!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:42px!important;
line-height:1!important;
letter-spacing:-.035em!important;
}
body.single-post .orilom-related-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:20px!important;}
body.single-post .orilom-related-card{border:1px solid #E5E7EB!important;border-radius:12px!important;overflow:hidden!important;background:#fff!important;}
body.single-post .orilom-related-cover{display:block!important;aspect-ratio:16/9!important;overflow:hidden!important;background:#112833!important;color:rgba(255,255,255,.25)!important;text-decoration:none!important;}
body.single-post .orilom-related-cover img{width:100%!important;height:100%!important;object-fit:cover!important;}
body.single-post .orilom-related-cover > span{display:flex!important;width:100%!important;height:100%!important;align-items:center!important;justify-content:center!important;font-family:Georgia,serif!important;font-size:32px!important;letter-spacing:.16em!important;}
body.single-post .orilom-related-card > div{padding:20px!important;}
body.single-post .orilom-related-meta{color:var(--orilom-editorial-accent)!important;font-size:9px!important;font-weight:800!important;letter-spacing:.09em!important;text-transform:uppercase!important;}
body.single-post .orilom-related-card h3{margin:10px 0 16px!important;font-family:Georgia,'Times New Roman',serif!important;font-size:23px!important;line-height:1.08!important;}
body.single-post .orilom-related-card h3 a{color:#111!important;text-decoration:none!important;}
body.single-post .orilom-article-return{width:min(100%,1120px)!important;margin:42px auto 0!important;}
body.single-post .orilom-article-return a{color:#333!important;font-size:11px!important;font-weight:700!important;text-decoration:none!important;}
/* Désactive les anciens styles de templates v3 qui entraient en concurrence. */
body.blog .blog-page-v3,
body.single-post .article-page-v3{display:none!important;}
@media(max-width:900px){
body.blog .orilom-journal-grid,
body.single-post .orilom-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
body.single-post .orilom-article{padding-top:54px!important;}
}
@media(max-width:650px){
body.blog .orilom-journal,
body.single-post .orilom-article{width:calc(100% - 36px)!important;padding:44px 0 64px!important;}
body.blog .orilom-journal-hero{margin-bottom:26px!important;}
body.blog .orilom-journal-hero h1{font-size:42px!important;line-height:.98!important;}
body.blog .orilom-journal-hero p{font-size:14px!important;}
body.blog .orilom-journal-topics{gap:10px 18px!important;overflow-x:auto!important;flex-wrap:nowrap!important;scrollbar-width:none!important;}
body.blog .orilom-journal-topics::-webkit-scrollbar{display:none!important;}
body.blog .orilom-journal-topics a{white-space:nowrap!important;}
body.blog .orilom-journal-grid,
body.single-post .orilom-related-grid{grid-template-columns:1fr!important;}
body.blog .orilom-journal-card h2{font-size:25px!important;}
body.single-post .orilom-article-breadcrumb-bar + .orilom-article{padding-top:44px!important;}
body.single-post .orilom-article-hero h1{font-size:42px!important;line-height:.98!important;}
body.single-post .orilom-article-deck{margin-top:18px!important;font-size:16px!important;}
body.single-post .orilom-article-featured{margin-top:34px!important;border-radius:10px!important;}
body.single-post .orilom-article-layout{margin-top:38px!important;}
body.single-post .orilom-article-content{font-size:16px!important;line-height:1.75!important;}
body.single-post .orilom-article-content h2{margin-top:48px!important;font-size:31px!important;}
body.single-post .orilom-article-content h3{font-size:23px!important;}
body.single-post .orilom-article-content table{display:block!important;overflow-x:auto!important;white-space:nowrap!important;}
body.single-post .orilom-article-shop-cta{margin-top:54px!important;padding:26px 22px!important;}
body.single-post .orilom-article-shop-cta h2{font-size:29px!important;}
body.single-post .orilom-article-shop-actions{flex-direction:column!important;align-items:stretch!important;}
body.single-post .orilom-related{margin-top:64px!important;padding-top:38px!important;}
body.single-post .orilom-related-head h2{font-size:34px!important;}
}
/* =========================================================
ORILOM V62 — JOURNAL FINAL EDITORIAL POLISH
Featured story + article rhythm + TOC + contextual commerce.
========================================================= */
/* ---------- Blog hierarchy ---------- */
body.blog .orilom-journal{
width:min(calc(100% - 64px),1180px)!important;
padding-top:78px!important;
}
body.blog .orilom-journal-hero{
max-width:980px!important;
margin-bottom:42px!important;
}
body.blog .orilom-journal-hero h1{
max-width:940px!important;
font-size:clamp(52px,5.4vw,78px)!important;
line-height:.95!important;
}
body.blog .orilom-journal-hero p{
max-width:720px!important;
margin-top:24px!important;
font-size:17px!important;
}
body.blog .orilom-journal-topics{
margin-bottom:50px!important;
}
body.blog .orilom-journal-section-head{
display:flex!important;
align-items:flex-end!important;
justify-content:space-between!important;
gap:24px!important;
margin:0 0 22px!important;
}
body.blog .orilom-journal-section-head .orilom-editorial-kicker{margin:0 0 7px!important;}
body.blog .orilom-journal-section-head h2{
margin:0!important;
color:#111!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:36px!important;
font-weight:600!important;
line-height:1!important;
letter-spacing:-.035em!important;
}
body.blog .orilom-journal-grid{
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:24px!important;
}
body.blog .orilom-journal-card.is-featured{
grid-column:1 / -1!important;
display:grid!important;
grid-template-columns:minmax(0,1.42fr) minmax(320px,.78fr)!important;
min-height:430px!important;
border-radius:16px!important;
}
body.blog .orilom-journal-card.is-featured .orilom-journal-cover{
aspect-ratio:auto!important;
min-height:430px!important;
height:100%!important;
}
body.blog .orilom-journal-card.is-featured .orilom-journal-card-body{
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
padding:46px 42px!important;
}
body.blog .orilom-featured-label{
display:inline-flex!important;
align-self:flex-start!important;
margin:0 0 20px!important;
padding:7px 10px!important;
border:1px solid #D8C99F!important;
border-radius:999px!important;
color:#7B5A00!important;
background:#FBF8EF!important;
font-size:9px!important;
font-weight:800!important;
line-height:1!important;
letter-spacing:.12em!important;
text-transform:uppercase!important;
}
body.blog .orilom-journal-card.is-featured .orilom-journal-card-meta{margin-bottom:16px!important;}
body.blog .orilom-journal-card.is-featured h2{
max-width:470px!important;
font-size:clamp(34px,3.3vw,50px)!important;
line-height:1!important;
}
body.blog .orilom-journal-card.is-featured .orilom-journal-card-body > p{
max-width:470px!important;
margin:20px 0 24px!important;
font-size:14px!important;
line-height:1.7!important;
}
body.blog .orilom-journal-card:not(.is-featured){border-radius:12px!important;}
/* ---------- Single article rhythm ---------- */
body.single-post .orilom-article{
width:min(calc(100% - 64px),1180px)!important;
padding:64px 0 96px!important;
}
body.single-post .orilom-article-breadcrumb-bar + .orilom-article{padding-top:64px!important;}
body.single-post .orilom-article-hero{
width:min(100%,900px)!important;
}
body.single-post .orilom-article-hero h1{
max-width:900px!important;
font-size:clamp(48px,5vw,70px)!important;
line-height:.95!important;
letter-spacing:-.042em!important;
}
body.single-post .orilom-article-deck{
max-width:760px!important;
margin-top:24px!important;
font-size:18px!important;
line-height:1.62!important;
}
body.single-post .orilom-article-byline{
max-width:760px!important;
margin-top:24px!important;
}
body.single-post .orilom-article-featured{
width:min(100%,1040px)!important;
margin-top:46px!important;
}
body.single-post .orilom-article-layout{
width:min(100%,740px)!important;
margin-top:50px!important;
}
body.single-post .orilom-article-content{
font-size:17px!important;
line-height:1.82!important;
}
body.single-post .orilom-article-content > p{margin-bottom:26px!important;}
body.single-post .orilom-article-content h2{
scroll-margin-top:130px!important;
margin:70px 0 18px!important;
font-size:37px!important;
line-height:1.04!important;
}
body.single-post .orilom-article-content h3{
margin:42px 0 14px!important;
}
/* ---------- TOC ---------- */
body.single-post .orilom-article-toc{
width:min(100%,740px)!important;
margin:46px auto 0!important;
padding:26px 28px 24px!important;
border:1px solid #E6E0D1!important;
border-radius:12px!important;
background:#FCFAF5!important;
}
body.single-post .orilom-article-toc .orilom-editorial-kicker{margin-bottom:12px!important;}
body.single-post .orilom-article-toc ol{
display:grid!important;
gap:9px!important;
margin:0!important;
padding:0!important;
list-style:none!important;
counter-reset:orilom-toc!important;
}
body.single-post .orilom-article-toc li{
counter-increment:orilom-toc!important;
display:grid!important;
grid-template-columns:28px 1fr!important;
align-items:start!important;
gap:8px!important;
}
body.single-post .orilom-article-toc li::before{
content:counter(orilom-toc, decimal-leading-zero)!important;
color:#A78626!important;
font-size:10px!important;
font-weight:800!important;
line-height:1.7!important;
}
body.single-post .orilom-article-toc a{
color:#242424!important;
font-size:13px!important;
font-weight:700!important;
line-height:1.45!important;
text-decoration:none!important;
}
body.single-post .orilom-article-toc a:hover{color:#7A5B00!important;}
/* ---------- Contextual commerce ---------- */
body.single-post .orilom-inline-shop-note{
margin:40px 0!important;
padding:22px 24px!important;
border-top:1px solid #DDD4BF!important;
border-bottom:1px solid #DDD4BF!important;
background:#FFFDF8!important;
}
body.single-post .orilom-inline-shop-note .orilom-editorial-kicker{margin-bottom:8px!important;}
body.single-post .orilom-inline-shop-note strong{
display:block!important;
margin:0 0 12px!important;
color:#151515!important;
font-family:Georgia,'Times New Roman',serif!important;
font-size:22px!important;
font-weight:600!important;
line-height:1.25!important;
}
body.single-post .orilom-inline-shop-note a{
color:#111!important;
font-size:11px!important;
font-weight:800!important;
text-decoration:none!important;
}
body.single-post .orilom-inline-shop-note a span{display:inline-block!important;transition:transform .2s ease!important;}
body.single-post .orilom-inline-shop-note a:hover span{transform:translateX(3px)!important;}
body.single-post .orilom-article-shop-cta{
margin-top:76px!important;
padding:40px!important;
border-radius:16px!important;
}
body.single-post .orilom-related{margin-top:96px!important;}
@media(max-width:900px){
body.blog .orilom-journal-card.is-featured{
grid-template-columns:1.1fr .9fr!important;
min-height:380px!important;
}
body.blog .orilom-journal-card.is-featured .orilom-journal-cover{min-height:380px!important;}
body.blog .orilom-journal-card.is-featured .orilom-journal-card-body{padding:34px 30px!important;}
}
@media(max-width:650px){
body.blog .orilom-journal{width:calc(100% - 36px)!important;padding-top:48px!important;}
body.blog .orilom-journal-hero h1{font-size:43px!important;}
body.blog .orilom-journal-section-head{margin-bottom:18px!important;}
body.blog .orilom-journal-section-head h2{font-size:31px!important;}
body.blog .orilom-journal-card.is-featured{
display:block!important;
min-height:0!important;
}
body.blog .orilom-journal-card.is-featured .orilom-journal-cover{
min-height:0!important;
height:auto!important;
aspect-ratio:16/10!important;
}
body.blog .orilom-journal-card.is-featured .orilom-journal-card-body{padding:26px 24px 28px!important;}
body.blog .orilom-journal-card.is-featured h2{font-size:31px!important;}
body.blog .orilom-featured-label{margin-bottom:16px!important;}
body.single-post .orilom-article{width:calc(100% - 36px)!important;padding-top:42px!important;}
body.single-post .orilom-article-breadcrumb-bar + .orilom-article{padding-top:42px!important;}
body.single-post .orilom-article-hero h1{font-size:42px!important;line-height:.98!important;}
body.single-post .orilom-article-deck{font-size:16px!important;}
body.single-post .orilom-article-toc{margin-top:34px!important;padding:22px 20px!important;}
body.single-post .orilom-article-layout{margin-top:36px!important;}
body.single-post .orilom-article-content h2{margin-top:52px!important;font-size:31px!important;}
body.single-post .orilom-inline-shop-note{margin:34px 0!important;padding:20px 0!important;background:transparent!important;}
body.single-post .orilom-inline-shop-note strong{font-size:20px!important;}
body.single-post .orilom-article-shop-cta{margin-top:58px!important;padding:28px 22px!important;}
}
/* =========================================================
ORILOM V63 — JOURNAL INTENTION-FIRST / DECISION GUIDE
========================================================= */
body.blog .orilom-journal-v63{max-width:1360px!important;margin:0 auto!important;padding:72px clamp(24px,3vw,48px) 100px!important;}
body.blog .orilom-journal-v63 .orilom-journal-hero{max-width:920px!important;margin:0 auto!important;text-align:center!important;padding:0!important;}
body.blog .orilom-journal-v63 .orilom-journal-hero h1{max-width:900px!important;margin:12px auto 20px!important;font-size:clamp(52px,5.4vw,78px)!important;line-height:.94!important;letter-spacing:-.045em!important;}
body.blog .orilom-journal-v63 .orilom-journal-hero p{max-width:720px!important;margin:0 auto!important;font-size:18px!important;line-height:1.65!important;color:#615d56!important;}
body.blog .orilom-intent-nav{max-width:1040px!important;margin:42px auto 0!important;padding:14px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;flex-wrap:wrap!important;background:#FCF8ED!important;border:1px solid #E8D9AE!important;border-radius:999px!important;}
body.blog .orilom-intent-nav>span{font-size:11px!important;font-weight:800!important;letter-spacing:.13em!important;text-transform:uppercase!important;color:#7a6a3d!important;margin:0 5px!important;}
body.blog .orilom-intent-nav a{padding:9px 14px!important;border-radius:999px!important;color:#24211d!important;font-size:13px!important;font-weight:650!important;text-decoration:none!important;transition:.2s ease!important;}
body.blog .orilom-intent-nav a:hover{background:#fff!important;box-shadow:0 1px 0 rgba(0,0,0,.04)!important;}
body.blog .orilom-v63-section-title{margin:0 0 24px!important;display:flex!important;align-items:end!important;justify-content:space-between!important;}
body.blog .orilom-v63-section-title>span,body.blog .orilom-v63-section-title h2{margin:0!important;color:#191713!important;}
body.blog .orilom-v63-section-title>span{font-size:12px!important;font-weight:800!important;letter-spacing:.14em!important;text-transform:uppercase!important;}
body.blog .orilom-v63-section-title h2{font-size:clamp(30px,3vw,42px)!important;line-height:1!important;letter-spacing:-.025em!important;}
body.blog .orilom-v63-featured{margin-top:88px!important;}
body.blog .orilom-v63-featured-card{display:grid!important;grid-template-columns:minmax(0,1.28fr) minmax(360px,.72fr)!important;min-height:500px!important;background:#F8F5EE!important;border:1px solid #E9E1D0!important;overflow:hidden!important;}
body.blog .orilom-v63-featured-media{position:relative!important;display:block!important;min-height:500px!important;background:#F0ECE3!important;overflow:hidden!important;}
body.blog .orilom-v63-featured-media img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;transition:transform .55s ease!important;}
body.blog .orilom-v63-featured-card:hover .orilom-v63-featured-media img{transform:scale(1.018)!important;}
body.blog .orilom-v63-cover-mark{position:absolute!important;inset:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;font-family:Georgia,serif!important;font-size:46px!important;letter-spacing:.16em!important;color:#171512!important;}
body.blog .orilom-v63-cover-mark small{margin-top:9px!important;font-family:inherit!important;font-size:10px!important;letter-spacing:.35em!important;}
body.blog .orilom-v63-featured-copy{padding:clamp(42px,5vw,76px)!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;}
body.blog .orilom-v63-featured-copy h2{margin:15px 0 20px!important;font-size:clamp(38px,4vw,58px)!important;line-height:.98!important;letter-spacing:-.04em!important;}
body.blog .orilom-v63-featured-copy h2 a{color:#171512!important;text-decoration:none!important;}
body.blog .orilom-v63-featured-copy p{margin:0 0 26px!important;font-size:16px!important;line-height:1.7!important;color:#625e56!important;}
body.blog .orilom-v63-moods{margin-top:96px!important;}
body.blog .orilom-v63-mood-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;border-top:1px solid #DDD5C5!important;border-left:1px solid #DDD5C5!important;}
body.blog .orilom-v63-mood-grid a{min-height:104px!important;padding:24px 26px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;border-right:1px solid #DDD5C5!important;border-bottom:1px solid #DDD5C5!important;color:#1D1A16!important;text-decoration:none!important;font-family:Georgia,serif!important;font-size:25px!important;background:#fff!important;transition:.2s ease!important;}
body.blog .orilom-v63-mood-grid a span:last-child{font-family:Arial,sans-serif!important;font-size:15px!important;color:#9B7D2F!important;}
body.blog .orilom-v63-mood-grid a:hover{background:#FCF8ED!important;}
body.blog .orilom-v63-latest{margin-top:96px!important;}
body.blog .orilom-v63-latest .orilom-journal-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:28px!important;}
body.blog .orilom-v63-latest .orilom-journal-card{display:block!important;min-height:0!important;}
body.blog .orilom-v63-latest .orilom-journal-cover{aspect-ratio:4/3!important;min-height:0!important;height:auto!important;}
body.blog .orilom-v63-latest .orilom-journal-card-body{padding:25px 0 0!important;}
body.blog .orilom-v63-latest .orilom-journal-card{border:0!important;background:transparent!important;}
body.blog .orilom-v63-latest .orilom-journal-card h2{font-size:29px!important;line-height:1.05!important;}
body.single-post .orilom-quick-answer{max-width:900px!important;margin:52px auto 0!important;padding:34px!important;background:#FCF8ED!important;border:1px solid #E8D9AE!important;}
body.single-post .orilom-quick-answer h2{margin:9px 0 24px!important;font-size:clamp(28px,3vw,38px)!important;line-height:1.05!important;letter-spacing:-.025em!important;color:#171512!important;}
body.single-post .orilom-quick-answer-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:0!important;border-top:1px solid rgba(151,123,47,.22)!important;}
body.single-post .orilom-quick-answer-grid>div{padding:22px 24px 0 0!important;}
body.single-post .orilom-quick-answer-grid>div+div{padding-left:24px!important;border-left:1px solid rgba(151,123,47,.22)!important;}
body.single-post .orilom-quick-answer-grid strong{display:block!important;margin-bottom:8px!important;font-family:Georgia,serif!important;font-size:22px!important;color:#1C1915!important;}
body.single-post .orilom-quick-answer-grid p{margin:0!important;font-size:14px!important;line-height:1.6!important;color:#625D54!important;}
body.single-post .orilom-article-toc{max-width:760px!important;margin:54px auto 0!important;padding:0 0 30px!important;background:transparent!important;border:0!important;border-bottom:1px solid #E5DED0!important;}
body.single-post .orilom-article-toc ol{columns:2!important;column-gap:42px!important;}
body.single-post .orilom-article-content{max-width:740px!important;margin:0 auto!important;}
body.single-post .orilom-article-layout{max-width:740px!important;margin:62px auto 0!important;}
body.single-post .orilom-article-content>p{font-size:18px!important;line-height:1.82!important;color:#302D28!important;}
body.single-post .orilom-article-content h2{margin-top:76px!important;margin-bottom:22px!important;font-size:clamp(32px,3.2vw,43px)!important;line-height:1.06!important;letter-spacing:-.03em!important;}
body.single-post .orilom-inline-shop-note{display:none!important;}
body.single-post .orilom-related-head .orilom-editorial-kicker{display:none!important;}
body.single-post .orilom-related-head h2{font-size:clamp(32px,3.2vw,44px)!important;}
@media(max-width:900px){
body.blog .orilom-v63-featured-card{grid-template-columns:1fr!important;}
body.blog .orilom-v63-featured-media{min-height:0!important;aspect-ratio:16/10!important;}
body.blog .orilom-v63-mood-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
body.blog .orilom-v63-latest .orilom-journal-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:640px){
body.blog .orilom-journal-v63{padding:48px 18px 72px!important;}
body.blog .orilom-journal-v63 .orilom-journal-hero h1{font-size:43px!important;}
body.blog .orilom-intent-nav{border-radius:18px!important;justify-content:flex-start!important;padding:12px!important;}
body.blog .orilom-intent-nav>span{width:100%!important;margin:2px 8px 4px!important;}
body.blog .orilom-v63-featured{margin-top:62px!important;}
body.blog .orilom-v63-featured-copy{padding:30px 24px 34px!important;}
body.blog .orilom-v63-featured-copy h2{font-size:36px!important;}
body.blog .orilom-v63-moods,body.blog .orilom-v63-latest{margin-top:68px!important;}
body.blog .orilom-v63-mood-grid{grid-template-columns:1fr!important;}
body.blog .orilom-v63-mood-grid a{min-height:78px!important;font-size:22px!important;}
body.blog .orilom-v63-latest .orilom-journal-grid{grid-template-columns:1fr!important;}
body.single-post .orilom-quick-answer{margin-top:38px!important;padding:25px 20px!important;}
body.single-post .orilom-quick-answer-grid{grid-template-columns:1fr!important;}
body.single-post .orilom-quick-answer-grid>div{padding:18px 0!important;}
body.single-post .orilom-quick-answer-grid>div+div{padding-left:0!important;border-left:0!important;border-top:1px solid rgba(151,123,47,.22)!important;}
body.single-post .orilom-article-toc ol{columns:1!important;}
body.single-post .orilom-article-layout{margin-top:46px!important;}
body.single-post .orilom-article-content>p{font-size:17px!important;line-height:1.76!important;}
}
/* ==========================================================
ORILOM V64 — SCENT UNIVERSES + CONTEXTUAL ARTICLE GUIDES
========================================================== */
body.blog .orilom-v63-mood-grid{gap:0!important;}
body.blog .orilom-v64-scent-card{min-height:142px!important;padding:25px 26px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;border-right:1px solid #DDD5C5!important;border-bottom:1px solid #DDD5C5!important;background:#fff!important;box-sizing:border-box!important;}
body.blog .orilom-v64-scent-name{font-family:Georgia,serif!important;font-size:24px!important;line-height:1.15!important;color:#1D1A16!important;}
body.blog .orilom-v64-scent-notes{margin-top:9px!important;font-family:Arial,sans-serif!important;font-size:13px!important;line-height:1.5!important;color:#6F695F!important;}
body.blog .orilom-v64-scent-status{margin-top:16px!important;font-family:Arial,sans-serif!important;font-size:10px!important;line-height:1!important;letter-spacing:.12em!important;text-transform:uppercase!important;color:#9B7D2F!important;}
body.single-post .orilom-v64-steps{max-width:980px!important;}
body.single-post .orilom-v64-step-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;margin-top:26px!important;border-top:1px solid rgba(151,123,47,.22)!important;}
body.single-post .orilom-v64-step-grid>div{padding:22px 18px 4px!important;min-width:0!important;}
body.single-post .orilom-v64-step-grid>div+div{border-left:1px solid rgba(151,123,47,.22)!important;}
body.single-post .orilom-v64-step-grid b{display:block!important;margin-bottom:18px!important;font:600 11px/1 Arial,sans-serif!important;letter-spacing:.12em!important;color:#9B7D2F!important;}
body.single-post .orilom-v64-step-grid strong{display:block!important;margin-bottom:8px!important;font:600 17px/1.2 Georgia,serif!important;color:#1C1915!important;}
body.single-post .orilom-v64-step-grid p{margin:0!important;font-size:13px!important;line-height:1.55!important;color:#625D54!important;}
body.single-post .orilom-v64-faq{max-width:760px!important;margin:88px auto 0!important;padding-top:44px!important;border-top:1px solid #E5DED0!important;}
body.single-post .orilom-v64-faq>h2{margin:10px 0 30px!important;font-size:clamp(30px,3vw,42px)!important;line-height:1.08!important;letter-spacing:-.025em!important;color:#171512!important;}
body.single-post .orilom-v64-faq details{border-top:1px solid #E5DED0!important;}
body.single-post .orilom-v64-faq details:last-child{border-bottom:1px solid #E5DED0!important;}
body.single-post .orilom-v64-faq summary{position:relative!important;padding:20px 42px 20px 0!important;cursor:pointer!important;list-style:none!important;font:600 16px/1.4 Arial,sans-serif!important;color:#201D18!important;}
body.single-post .orilom-v64-faq summary::-webkit-details-marker{display:none!important;}
body.single-post .orilom-v64-faq summary:after{content:'+'!important;position:absolute!important;right:2px!important;top:18px!important;font:400 22px/1 Georgia,serif!important;color:#9B7D2F!important;}
body.single-post .orilom-v64-faq details[open] summary:after{content:'−'!important;}
body.single-post .orilom-v64-faq details p{margin:0!important;padding:0 42px 22px 0!important;font-size:15px!important;line-height:1.7!important;color:#5C574F!important;}
@media(max-width:900px){body.single-post .orilom-v64-step-grid{grid-template-columns:1fr 1fr!important;}body.single-post .orilom-v64-step-grid>div+div{border-left:0!important;}body.single-post .orilom-v64-step-grid>div:nth-child(even){border-left:1px solid rgba(151,123,47,.22)!important;}body.single-post .orilom-v64-step-grid>div:nth-child(n+3){border-top:1px solid rgba(151,123,47,.22)!important;}}
@media(max-width:640px){body.blog .orilom-v64-scent-card{min-height:118px!important;padding:21px 20px!important;}body.blog .orilom-v64-scent-name{font-size:21px!important;}body.single-post .orilom-v64-step-grid{grid-template-columns:1fr!important;}body.single-post .orilom-v64-step-grid>div,body.single-post .orilom-v64-step-grid>div:nth-child(even){border-left:0!important;border-top:1px solid rgba(151,123,47,.22)!important;padding:18px 0!important;}body.single-post .orilom-v64-step-grid>div:first-child{border-top:0!important;}body.single-post .orilom-v64-faq{margin-top:64px!important;}}
/* ==========================================================
ORILOM V65 — INTERACTIVE SCENT UNIVERSES + MOROCCO HEAT GUIDE
========================================================== */
body.blog .orilom-v65-moods .orilom-v63-section-title{
align-items:flex-end!important;
gap:28px!important;
}
body.blog .orilom-v65-moods .orilom-v63-section-title>div{min-width:0!important;}
body.blog .orilom-v65-eyebrow{
display:block!important;
margin-bottom:10px!important;
font:800 10px/1 Arial,sans-serif!important;
letter-spacing:.16em!important;
text-transform:uppercase!important;
color:#9B7D2F!important;
}
body.blog .orilom-v65-section-note{
max-width:420px!important;
margin:0!important;
color:#716A60!important;
font-size:13px!important;
line-height:1.6!important;
text-align:right!important;
}
body.blog .orilom-v63-mood-grid{
overflow:hidden!important;
border-color:#DDD5C5!important;
}
body.blog .orilom-v65-scent-card{
position:relative!important;
min-height:178px!important;
padding:26px 52px 26px 26px!important;
display:grid!important;
grid-template-columns:42px minmax(0,1fr)!important;
grid-template-rows:auto!important;
align-items:start!important;
column-gap:18px!important;
justify-content:stretch!important;
color:#1D1A16!important;
text-decoration:none!important;
background:#fff!important;
transition:background .22s ease,transform .22s ease,box-shadow .22s ease!important;
}
body.blog .orilom-v65-scent-card:hover,
body.blog .orilom-v65-scent-card:focus-visible,
body.blog .orilom-v65-scent-card.is-active{
background:#FCF8ED!important;
}
body.blog .orilom-v65-scent-card:focus-visible{
outline:2px solid #B38D2C!important;
outline-offset:-3px!important;
}
body.blog .orilom-v65-scent-icon{
width:42px!important;
height:42px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
color:#29251E!important;
}
body.blog .orilom-v65-scent-icon svg{
width:30px!important;
height:30px!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.35!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
transition:color .22s ease,transform .22s ease!important;
}
body.blog .orilom-v65-scent-card:hover .orilom-v65-scent-icon svg,
body.blog .orilom-v65-scent-card.is-active .orilom-v65-scent-icon svg{
color:#9B7D2F!important;
transform:translateY(-1px)!important;
}
body.blog .orilom-v65-scent-copy{
display:flex!important;
flex-direction:column!important;
align-items:flex-start!important;
min-width:0!important;
}
body.blog .orilom-v65-scent-card .orilom-v64-scent-name{
font-size:23px!important;
}
body.blog .orilom-v65-scent-card .orilom-v64-scent-notes{
margin-top:7px!important;
font-size:12px!important;
}
body.blog .orilom-v65-scent-micro{
margin-top:10px!important;
color:#827B70!important;
font:500 12px/1.45 Arial,sans-serif!important;
}
body.blog .orilom-v65-scent-arrow{
position:absolute!important;
right:24px!important;
top:28px!important;
color:#9B7D2F!important;
font:400 19px/1 Arial,sans-serif!important;
transition:transform .2s ease!important;
}
body.blog .orilom-v65-scent-card:hover .orilom-v65-scent-arrow{transform:translateX(4px)!important;}
body.blog .orilom-v65-universe-panel{
margin-top:42px!important;
padding:38px 40px!important;
border:1px solid #E2D8C3!important;
background:#FCFAF5!important;
scroll-margin-top:150px!important;
}
body.blog .orilom-v65-universe-intro{
display:grid!important;
grid-template-columns:64px minmax(0,1fr)!important;
gap:22px!important;
align-items:start!important;
}
body.blog .orilom-v65-universe-icon-large{
width:64px!important;
height:64px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
color:#9B7D2F!important;
}
body.blog .orilom-v65-universe-icon-large svg{
width:46px!important;
height:46px!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.2!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
}
body.blog .orilom-v65-universe-intro h2{
margin:8px 0 10px!important;
color:#171512!important;
font:600 clamp(32px,3vw,44px)/1 Georgia,'Times New Roman',serif!important;
letter-spacing:-.025em!important;
}
body.blog .orilom-v65-universe-intro p{
max-width:720px!important;
margin:0!important;
color:#625D54!important;
font-size:15px!important;
line-height:1.7!important;
}
body.blog .orilom-v65-universe-guides{
margin-top:30px!important;
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
border-top:1px solid #DDD5C5!important;
}
body.blog .orilom-v65-universe-guides article{
padding:26px 24px 4px 0!important;
}
body.blog .orilom-v65-universe-guides article+article{
padding-left:24px!important;
border-left:1px solid #DDD5C5!important;
}
body.blog .orilom-v65-universe-guides h3{
margin:9px 0 16px!important;
font:600 24px/1.1 Georgia,'Times New Roman',serif!important;
}
body.blog .orilom-v65-universe-guides h3 a{color:#1D1A16!important;text-decoration:none!important;}
body.blog .orilom-v65-universe-empty{
margin-top:28px!important;
padding-top:24px!important;
border-top:1px solid #DDD5C5!important;
}
body.blog .orilom-v65-universe-empty p{
max-width:680px!important;
margin:0 0 14px!important;
color:#6B655B!important;
font-size:14px!important;
line-height:1.65!important;
}
/* Morocco heat guide */
body.single-post .orilom-v65-heat-answer{max-width:940px!important;}
body.single-post .orilom-v65-heat-answer h2{max-width:760px!important;}
body.single-post .orilom-v65-heat-columns{
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:0!important;
margin-top:26px!important;
border-top:1px solid rgba(151,123,47,.24)!important;
}
body.single-post .orilom-v65-heat-columns>div{
padding:24px 28px 0 0!important;
}
body.single-post .orilom-v65-heat-columns>div+div{
padding-left:28px!important;
border-left:1px solid rgba(151,123,47,.24)!important;
}
body.single-post .orilom-v65-heat-label{
display:block!important;
margin-bottom:14px!important;
color:#8F7227!important;
font:800 10px/1 Arial,sans-serif!important;
letter-spacing:.14em!important;
text-transform:uppercase!important;
}
body.single-post .orilom-v65-heat-columns ul{
margin:0!important;
padding:0!important;
list-style:none!important;
}
body.single-post .orilom-v65-heat-columns li{
position:relative!important;
margin:0!important;
padding:9px 0 9px 20px!important;
border-top:1px solid rgba(151,123,47,.12)!important;
color:#3B362E!important;
font-size:14px!important;
line-height:1.45!important;
}
body.single-post .orilom-v65-heat-columns li:first-child{border-top:0!important;}
body.single-post .orilom-v65-heat-columns li:before{
content:'·'!important;
position:absolute!important;
left:2px!important;
top:7px!important;
color:#9B7D2F!important;
font-size:22px!important;
}
body.single-post .orilom-v65-morocco-context{
max-width:980px!important;
margin:86px auto 0!important;
padding-top:46px!important;
border-top:1px solid #E5DED0!important;
}
body.single-post .orilom-v65-morocco-context>h2{
max-width:760px!important;
margin:10px 0 32px!important;
color:#171512!important;
font:600 clamp(32px,3.2vw,44px)/1.05 Georgia,'Times New Roman',serif!important;
letter-spacing:-.03em!important;
}
body.single-post .orilom-v65-context-grid{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
border-top:1px solid #DDD5C5!important;
border-left:1px solid #DDD5C5!important;
}
body.single-post .orilom-v65-context-grid article{
min-height:220px!important;
padding:28px!important;
border-right:1px solid #DDD5C5!important;
border-bottom:1px solid #DDD5C5!important;
background:#FFFDF8!important;
}
body.single-post .orilom-v65-context-grid article>span{
color:#9B7D2F!important;
font:800 10px/1 Arial,sans-serif!important;
letter-spacing:.12em!important;
}
body.single-post .orilom-v65-context-grid h3{
margin:20px 0 12px!important;
color:#1C1915!important;
font:600 24px/1.12 Georgia,'Times New Roman',serif!important;
}
body.single-post .orilom-v65-context-grid p{
margin:0!important;
color:#655F56!important;
font-size:14px!important;
line-height:1.68!important;
}
@media(max-width:900px){
body.blog .orilom-v65-moods .orilom-v63-section-title{align-items:flex-start!important;flex-direction:column!important;}
body.blog .orilom-v65-section-note{text-align:left!important;}
body.blog .orilom-v65-universe-guides{grid-template-columns:1fr!important;}
body.blog .orilom-v65-universe-guides article+article{padding-left:0!important;border-left:0!important;border-top:1px solid #DDD5C5!important;}
body.single-post .orilom-v65-context-grid{grid-template-columns:1fr!important;}
body.single-post .orilom-v65-context-grid article{min-height:0!important;}
}
@media(max-width:640px){
body.blog .orilom-v65-scent-card{min-height:144px!important;padding:22px 48px 22px 20px!important;grid-template-columns:34px minmax(0,1fr)!important;column-gap:14px!important;}
body.blog .orilom-v65-scent-icon{width:34px!important;height:34px!important;}
body.blog .orilom-v65-scent-icon svg{width:26px!important;height:26px!important;}
body.blog .orilom-v65-scent-card .orilom-v64-scent-name{font-size:21px!important;}
body.blog .orilom-v65-scent-arrow{right:18px!important;top:23px!important;}
body.blog .orilom-v65-universe-panel{margin-top:28px!important;padding:28px 22px!important;}
body.blog .orilom-v65-universe-intro{grid-template-columns:46px minmax(0,1fr)!important;gap:14px!important;}
body.blog .orilom-v65-universe-icon-large{width:46px!important;height:46px!important;}
body.blog .orilom-v65-universe-icon-large svg{width:36px!important;height:36px!important;}
body.single-post .orilom-v65-heat-columns{grid-template-columns:1fr!important;}
body.single-post .orilom-v65-heat-columns>div{padding:20px 0!important;}
body.single-post .orilom-v65-heat-columns>div+div{padding-left:0!important;border-left:0!important;border-top:1px solid rgba(151,123,47,.24)!important;}
body.single-post .orilom-v65-morocco-context{margin-top:64px!important;padding-top:38px!important;}
body.single-post .orilom-v65-context-grid h3{font-size:22px!important;}
}
/* =========================================================
ORILOM V66 — ENVIE FRONTEND / FAMILLE BACKEND
========================================================= */
body.blog .orilom-v66-card-action{
display:inline-flex!important;align-items:center!important;gap:8px!important;
margin-top:15px!important;color:#171713!important;font-family:inherit!important;
font-size:11px!important;font-weight:750!important;letter-spacing:.08em!important;
text-transform:uppercase!important;transition:color .22s ease,transform .22s ease!important;
}
body.blog .orilom-v65-scent-card:hover .orilom-v66-card-action{color:#9A7420!important;transform:translateX(3px)!important;}
body.blog .orilom-v65-scent-card:focus-visible{outline:2px solid #B68A2B!important;outline-offset:3px!important;}
body.blog .orilom-v65-scent-card{cursor:pointer!important;}
body.blog .orilom-v65-scent-card .orilom-v65-scent-micro{max-width:245px!important;}
body.blog .orilom-v65-universe-panel{display:none!important;}
@media(max-width:767px){body.blog .orilom-v66-card-action{margin-top:11px!important;font-size:10px!important;}}
/* =========================================================
ORILOM JOURNAL V67 — GUIDE BOISÉ SIGNATURE
========================================================= */
body.single-post .orilom-v67-woody-answer{max-width:940px;margin:0 auto 54px;padding:34px 38px;background:#fbf8f1;border:1px solid #e8dcc2}
body.single-post .orilom-v67-woody-answer h2{max-width:720px;margin:8px 0 25px;font-size:clamp(25px,2.4vw,38px);line-height:1.08}
.orilom-v67-woody-signatures{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #e5d8bc;background:#fff}
.orilom-v67-woody-signatures article{padding:26px 24px;text-align:center;border-right:1px solid #e5d8bc}
.orilom-v67-woody-signatures article:last-child{border-right:0}
.orilom-v67-woody-icon{display:block;margin-bottom:12px;font-family:Georgia,serif;font-size:27px;line-height:1;color:#a97812}
.orilom-v67-woody-signatures strong{display:block;font-family:Georgia,'Times New Roman',serif;font-size:22px;font-weight:500;color:#171512}
.orilom-v67-woody-signatures p{margin:7px 0 0!important;font-size:13px!important;color:#665f54!important}
.orilom-v67-family-link{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#15130f;text-decoration:none;border-bottom:1px solid #b58a2c;padding-bottom:4px}
.orilom-v67-family-link span{color:#a97812;transition:transform .2s ease}.orilom-v67-family-link:hover span{transform:translateX(4px)}
.orilom-v67-products{width:min(1100px,calc(100vw - 48px));margin:70px 50% 10px;transform:translateX(-50%);padding:42px;background:#fbf8f1;border:1px solid #e7dcc5}
.orilom-v67-products h2{margin:7px 0 7px!important;font-size:clamp(30px,3vw,44px)!important;line-height:1.05!important}
.orilom-v67-products-intro{margin:0 0 27px!important;max-width:650px;color:#625d54!important}
.orilom-v67-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.orilom-v67-product-card{background:#fff;border:1px solid #e6ddcc;min-width:0}
.orilom-v67-product-image{display:block;aspect-ratio:1/1;background:#fff;overflow:hidden}
.orilom-v67-product-image img{width:100%;height:100%;object-fit:contain;padding:14px;box-sizing:border-box;transition:transform .3s ease}.orilom-v67-product-card:hover img{transform:scale(1.025)}
.orilom-v67-product-body{padding:17px}.orilom-v67-product-body>span{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#a97812}
.orilom-v67-product-body h3{margin:7px 0 10px!important;font-family:Georgia,'Times New Roman',serif!important;font-size:18px!important;line-height:1.18!important}.orilom-v67-product-body h3 a{color:#171512;text-decoration:none}
.orilom-v67-price{margin-bottom:13px;font-size:14px;font-weight:700;color:#171512}.orilom-v67-all-products{display:inline-flex;margin-top:24px;color:#171512;text-decoration:none;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid #b58a2c;padding-bottom:4px}
@media(max-width:780px){body.single-post .orilom-v67-woody-answer{margin:0 18px 38px;padding:26px 20px}.orilom-v67-woody-signatures{grid-template-columns:1fr}.orilom-v67-woody-signatures article{border-right:0;border-bottom:1px solid #e5d8bc}.orilom-v67-woody-signatures article:last-child{border-bottom:0}.orilom-v67-products{width:calc(100vw - 36px);padding:24px 18px;margin-top:48px}.orilom-v67-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.orilom-v67-product-grid{grid-template-columns:1fr 1fr}.orilom-v67-product-body{padding:12px}.orilom-v67-product-body h3{font-size:15px!important}}
/* ==========================================================
ORILOM HOME — EDITORIAL CRO REFINEMENT 2026-09-15
Homepage only. Keeps existing visual system and shortens
catalogue repetition while adding olfactory discovery.
========================================================== */
body.home .lux-home-v5 .orilom-home-section-cta{
width:min(1120px,calc(100% - 48px));margin:28px auto 0;text-align:center;
}
body.home .lux-home-v5 .orilom-home-section-cta a{
display:inline-flex;align-items:center;gap:9px;padding:10px 0 7px;
color:#111;text-decoration:none;border-bottom:1px solid #c79a32;
font:700 10px/1 Arial,sans-serif;letter-spacing:.11em;text-transform:uppercase;
}
body.home .lux-home-v5 .orilom-home-section-cta i{font-style:normal;transition:transform .18s ease}
body.home .lux-home-v5 .orilom-home-section-cta a:hover i{transform:translateX(4px)}
body.home .lux-home-v5 .orilom-scent-worlds{
padding:86px max(24px,calc((100vw - 1120px)/2));background:#fff;
}
body.home .lux-home-v5 .orilom-scent-worlds > header{text-align:center;margin:0 auto 38px;max-width:720px}
body.home .lux-home-v5 .orilom-scent-worlds > header > span{
display:block;margin-bottom:10px;color:#b1841f;font:800 9px/1 Arial,sans-serif;
letter-spacing:.24em;text-transform:uppercase;
}
body.home .lux-home-v5 .orilom-scent-worlds h2{
margin:0;color:#111;font:500 clamp(34px,3vw,48px)/1.05 Georgia,"Times New Roman",serif;
}
body.home .lux-home-v5 .orilom-scent-worlds header p{
margin:13px auto 0;color:#696969;font:400 12px/1.65 Arial,sans-serif;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid{
display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a{
min-height:190px;padding:26px 24px;border:1px solid #e8e3da;background:#faf9f7;
color:#111;text-decoration:none;display:flex;flex-direction:column;justify-content:flex-end;
transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a::before{
content:"";width:24px;height:1px;background:#b1841f;margin-bottom:auto;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a:hover{
transform:translateY(-3px);border-color:#c8aa69;background:#fffaf1;box-shadow:0 14px 30px rgba(0,0,0,.055);
}
body.home .lux-home-v5 .orilom-scent-worlds-grid strong{
font:500 30px/1 Georgia,"Times New Roman",serif;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid span{
margin-top:8px;color:#707070;font:400 11px/1.45 Arial,sans-serif;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid b{
margin-top:22px;font:800 9px/1 Arial,sans-serif;letter-spacing:.09em;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid i{font-style:normal}
/* Improve hero text legibility without changing the artwork. */
body.home .lux-home-v5 .lux-hero.has-image::after{
content:"";position:absolute;inset:0 0 0 auto;width:43%;pointer-events:none;
background:linear-gradient(90deg,rgba(17,17,17,0),rgba(17,17,17,.18));z-index:0;
}
body.home .lux-home-v5 .lux-hero-copy{z-index:2}
@media(max-width:900px){
body.home .lux-home-v5 .orilom-scent-worlds-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
body.home .lux-home-v5 .orilom-scent-worlds{padding:58px 15px}
body.home .lux-home-v5 .orilom-scent-worlds-grid{grid-template-columns:1fr 1fr;gap:10px}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a{min-height:155px;padding:20px 16px}
body.home .lux-home-v5 .orilom-scent-worlds-grid strong{font-size:25px}
body.home .lux-home-v5 .lux-hero.has-image::after{width:65%}
}
/* =========================================================
ORILOM V56 — ACCOUNT DROPDOWN FINAL POSITION FIX
Desktop: dropdown anchored to account trigger, opens LEFT.
Mobile <=720px: existing direct account navigation preserved.
========================================================= */
@media (min-width:721px){
body .lux-header .header-tools .orilom-account-menu{
position:relative !important;
overflow:visible !important;
}
body .lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown{
position:absolute !important;
top:calc(100% + 8px) !important;
right:0 !important;
left:auto !important;
bottom:auto !important;
inset:auto 0 auto auto !important;
width:286px !important;
min-width:286px !important;
max-width:min(286px, calc(100vw - 24px)) !important;
height:auto !important;
max-height:min(620px, calc(100vh - 110px)) !important;
margin:0 !important;
transform:none !important;
translate:none !important;
box-sizing:border-box !important;
overflow-x:hidden !important;
overflow-y:auto !important;
z-index:999999 !important;
}
body .lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown::before{
right:24px !important;
left:auto !important;
}
body .lux-header .header-tools .orilom-account-dropdown > a{
width:100% !important;
max-width:100% !important;
box-sizing:border-box !important;
white-space:nowrap !important;
}
body .lux-header .header-tools .orilom-account-dropdown > a.orilom-account-item--loyalty{
width:calc(100% - 16px) !important;
max-width:calc(100% - 16px) !important;
box-sizing:border-box !important;
}
}
/* =========================================================
ORILOM — V57 RESPONSIVE LAPTOP / TABLET / MOBILE
Keeps validated desktop account dropdown behavior intact.
========================================================= */
@media (max-width: 1280px) {
.lux-hero-copy {
right: 32px !important;
width: 320px !important;
max-width: 28vw !important;
}
.lux-hero-copy h1 {
font-size: clamp(34px, 3.4vw, 48px) !important;
line-height: .95 !important;
}
.lux-hero-copy p {
font-size: 12px !important;
line-height: 1.45 !important;
}
.account-dropdown {
width: 270px !important;
max-width: calc(100vw - 24px) !important;
right: 0 !important;
left: auto !important;
}
}
@media (max-width: 900px) {
.account-dropdown {
position: fixed !important;
top: 78px !important;
right: 12px !important;
left: auto !important;
width: min(330px, calc(100vw - 24px)) !important;
max-width: calc(100vw - 24px) !important;
max-height: calc(100vh - 96px) !important;
overflow-y: auto !important;
overscroll-behavior: contain;
border-radius: 14px !important;
z-index: 99999 !important;
}
.lux-hero-copy {
right: 24px !important;
width: 300px !important;
max-width: 42vw !important;
}
.lux-hero-copy h1 {
font-size: clamp(30px, 5vw, 42px) !important;
}
}
@media (max-width: 600px) {
.account-dropdown {
top: 68px !important;
right: 10px !important;
left: auto !important;
width: calc(100vw - 20px) !important;
max-width: none !important;
max-height: calc(100vh - 84px) !important;
border-radius: 14px !important;
}
.lux-hero-copy {
right: 18px !important;
left: 18px !important;
width: auto !important;
max-width: none !important;
text-align: center !important;
}
.lux-hero-copy h1 {
font-size: clamp(30px, 9vw, 40px) !important;
line-height: 1 !important;
}
.lux-hero-copy p {
max-width: 340px !important;
margin-left: auto !important;
margin-right: auto !important;
}
}
/* =========================================================
ORILOM V58 — LAPTOP ACCOUNT SAFE-ZONE
Keep large desktop unchanged. On 1101–1280px only, move the
whole action cluster inward so Account + dropdown have room.
========================================================= */
@media (min-width:1101px) and (max-width:1280px){
html body .site-header.lux-header .header-tools{
position:relative!important;
right:28px!important;
transform:none!important;
justify-self:end!important;
gap:14px!important;
overflow:visible!important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu{
position:relative!important;
overflow:visible!important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown{
position:absolute!important;
top:calc(100% + 8px)!important;
right:0!important;
left:auto!important;
inset:auto 0 auto auto!important;
width:270px!important;
min-width:270px!important;
max-width:calc(100vw - 48px)!important;
margin:0!important;
transform:none!important;
translate:none!important;
box-sizing:border-box!important;
overflow-x:hidden!important;
z-index:999999!important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown::before{
right:22px!important;
left:auto!important;
}
/* Give the center instrument a little less visual weight on laptops. */
html body .site-header.lux-header .lux-search{
width:470px!important;
max-width:470px!important;
grid-template-columns:132px minmax(0,1fr) 40px!important;
}
}
/* Narrow laptop / landscape tablet: increase the right safety zone. */
@media (min-width:901px) and (max-width:1100px){
html body .site-header.lux-header .header-tools{
padding-right:18px!important;
box-sizing:border-box!important;
overflow:visible!important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown{
right:12px!important;
left:auto!important;
width:260px!important;
max-width:calc(100vw - 36px)!important;
}
}
/* =========================================================
ORILOM V59 — RESPONSIVE APP BAR FIX
Root cause fix: compact the HEADER itself on laptop widths.
Do not move the account dropdown independently.
========================================================= */
/* Laptop / small desktop */
@media (min-width:1101px) and (max-width:1365px){
html body .site-header.lux-header .lux-header-main{
width:calc(100% - 40px) !important;
max-width:1320px !important;
margin:0 auto !important;
padding:14px 0 !important;
grid-template-columns:180px 130px minmax(260px,1fr) auto !important;
column-gap:14px !important;
box-sizing:border-box !important;
overflow:visible !important;
}
/* Search must shrink with its grid cell — never force 470px. */
html body .site-header.lux-header .lux-search{
width:100% !important;
min-width:0 !important;
max-width:none !important;
grid-template-columns:125px minmax(0,1fr) 42px !important;
box-sizing:border-box !important;
}
html body .site-header.lux-header .lux-search input{
min-width:0 !important;
}
/* Actions belong to the app bar; no manual right offset. */
html body .site-header.lux-header .header-tools{
position:relative !important;
right:auto !important;
left:auto !important;
width:auto !important;
min-width:0 !important;
max-width:none !important;
transform:none !important;
justify-self:end !important;
justify-content:flex-end !important;
gap:6px !important;
padding:0 !important;
overflow:visible !important;
}
/* Keep Favoris/Panier compact on laptops. */
html body .site-header.lux-header .header-tools > .wishlist-link,
html body .site-header.lux-header .header-tools > .cart-link{
width:44px !important;
min-width:44px !important;
height:44px !important;
min-height:44px !important;
padding:0 !important;
border-radius:10px !important;
background:#fff !important;
color:#111 !important;
border-color:transparent !important;
box-shadow:none !important;
}
html body .site-header.lux-header .header-tools > .wishlist-link::after,
html body .site-header.lux-header .header-tools > .cart-link::after{
display:none !important;
content:none !important;
}
/* Account remains readable and is the dropdown anchor. */
html body .site-header.lux-header .header-tools .orilom-account-menu{
position:relative !important;
flex:0 0 auto !important;
overflow:visible !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
min-width:112px !important;
min-height:44px !important;
padding:0 14px !important;
white-space:nowrap !important;
}
/* Dropdown stays attached to Account and opens inward (left). */
html body .site-header.lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown{
position:absolute !important;
top:calc(100% + 8px) !important;
right:0 !important;
left:auto !important;
inset:auto 0 auto auto !important;
width:276px !important;
min-width:276px !important;
max-width:calc(100vw - 32px) !important;
margin:0 !important;
transform:none !important;
translate:none !important;
}
}
/* Narrow laptop: remove the secondary category selector from the top row.
Main navigation below already provides catalogue access. */
@media (min-width:901px) and (max-width:1100px){
html body .site-header.lux-header .lux-header-main{
width:calc(100% - 32px) !important;
max-width:none !important;
margin:0 auto !important;
padding:12px 0 !important;
grid-template-columns:170px minmax(260px,1fr) auto !important;
gap:12px !important;
box-sizing:border-box !important;
overflow:visible !important;
}
html body .site-header.lux-header .lux-brands{
display:none !important;
}
html body .site-header.lux-header .lux-search{
width:100% !important;
min-width:0 !important;
max-width:none !important;
grid-template-columns:minmax(0,1fr) 42px !important;
}
html body .site-header.lux-header .lux-search select{
display:none !important;
}
html body .site-header.lux-header .header-tools{
position:relative !important;
right:auto !important;
left:auto !important;
width:auto !important;
min-width:0 !important;
padding:0 !important;
gap:5px !important;
transform:none !important;
justify-self:end !important;
overflow:visible !important;
}
html body .site-header.lux-header .header-tools > .wishlist-link,
html body .site-header.lux-header .header-tools > .cart-link{
width:40px !important;
min-width:40px !important;
min-height:40px !important;
padding:0 !important;
background:#fff !important;
color:#111 !important;
border-color:transparent !important;
box-shadow:none !important;
}
html body .site-header.lux-header .header-tools > .wishlist-link::after,
html body .site-header.lux-header .header-tools > .cart-link::after{
display:none !important;
content:none !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
min-width:104px !important;
min-height:42px !important;
padding:0 12px !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown{
position:absolute !important;
top:calc(100% + 8px) !important;
right:0 !important;
left:auto !important;
inset:auto 0 auto auto !important;
width:264px !important;
min-width:264px !important;
max-width:calc(100vw - 24px) !important;
margin:0 !important;
transform:none !important;
translate:none !important;
}
}
/* =========================================================
ORILOM V60 — APP BAR RESPONSIVE DEEP FIX
Fixes the breakpoint cliff around 1100–1280px.
Header structure is actually: brand | search | tools.
No phantom fourth column. Dropdown remains anchored to account.
========================================================= */
/* Laptop / small desktop: one coherent 3-column app bar */
@media (min-width:901px) and (max-width:1280px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
width:100% !important;
max-width:1280px !important;
min-height:76px !important;
margin:0 auto !important;
padding:10px clamp(18px,2.4vw,30px) !important;
display:grid !important;
grid-template-areas:"brand search tools" !important;
grid-template-columns:minmax(150px,190px) minmax(280px,1fr) max-content !important;
column-gap:clamp(16px,2vw,28px) !important;
align-items:center !important;
box-sizing:border-box !important;
overflow:visible !important;
}
html body .site-header.lux-header .lux-brand{
grid-area:brand !important;
min-width:0 !important;
justify-self:start !important;
}
html body .site-header.lux-header .orilom-header-brand-lockup strong{
font-size:clamp(24px,2.25vw,30px) !important;
}
/* Search becomes a single, elastic instrument on laptops. */
html body .site-header.lux-header .lux-search{
grid-area:search !important;
justify-self:stretch !important;
width:100% !important;
min-width:0 !important;
max-width:none !important;
height:43px !important;
min-height:43px !important;
grid-template-columns:minmax(0,1fr) 42px !important;
border:0 !important;
border-bottom:1px solid #26231e !important;
border-radius:0 !important;
background:#fff !important;
box-shadow:none !important;
overflow:visible !important;
}
html body .site-header.lux-header .lux-search .orilom-header-category{
display:none !important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-wrap{
min-width:0 !important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input{
width:100% !important;
min-width:0 !important;
height:42px !important;
padding:0 12px !important;
font-size:11px !important;
}
html body .site-header.lux-header .lux-search .orilom-search-submit{
width:42px !important;
height:42px !important;
border:0 !important;
background:#fff !important;
}
/* Tools own only the width they really need. */
html body .site-header.lux-header .header-tools,
html body.logged-in .site-header.lux-header .header-tools,
html body:not(.logged-in) .site-header.lux-header .header-tools{
grid-area:tools !important;
justify-self:end !important;
width:auto !important;
min-width:0 !important;
max-width:none !important;
display:flex !important;
align-items:center !important;
justify-content:flex-end !important;
gap:4px !important;
margin:0 !important;
padding:0 !important;
overflow:visible !important;
}
html body .site-header.lux-header .header-tools > a.wishlist-link,
html body .site-header.lux-header .header-tools > a.cart-link{
width:42px !important;
min-width:42px !important;
max-width:42px !important;
height:46px !important;
min-height:46px !important;
padding:4px !important;
flex:0 0 42px !important;
}
html body .site-header.lux-header .header-tools > a.wishlist-link .orilom-header-action-label,
html body .site-header.lux-header .header-tools > a.cart-link .orilom-header-action-label{
display:none !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu,
html body.logged-in .site-header.lux-header .header-tools .orilom-account-menu,
html body:not(.logged-in) .site-header.lux-header .header-tools .orilom-account-menu{
position:relative !important;
display:block !important;
width:auto !important;
min-width:0 !important;
max-width:none !important;
height:auto !important;
min-height:0 !important;
margin:0 !important;
padding:0 !important;
overflow:visible !important;
flex:0 0 auto !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > a.orilom-account-link,
html body.logged-in .site-header.lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
width:auto !important;
min-width:104px !important;
max-width:none !important;
height:46px !important;
min-height:46px !important;
padding:0 12px !important;
display:flex !important;
flex-direction:row !important;
align-items:center !important;
justify-content:center !important;
gap:7px !important;
border:1px solid #e6e2d9 !important;
border-radius:9px !important;
background:#fff !important;
font-size:11px !important;
line-height:1 !important;
white-space:nowrap !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu .orilom-header-action-label{
display:block !important;
font-size:10px !important;
line-height:1 !important;
color:#111 !important;
font-weight:700 !important;
}
/* Account panel: always inside viewport and attached to its trigger. */
html body .site-header.lux-header .header-tools .orilom-account-menu .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .header-tools .orilom-account-menu .orilom-account-dropdown{
position:absolute !important;
top:calc(100% + 8px) !important;
left:auto !important;
right:0 !important;
width:250px !important;
max-width:calc(100vw - 24px) !important;
margin:0 !important;
transform:none !important;
z-index:100000 !important;
}
html body .site-header.lux-header .header-tools .orilom-account-dropdown::before,
html body.logged-in .site-header.lux-header .header-tools .orilom-account-dropdown::before{
left:auto !important;
right:22px !important;
}
/* Navigation also compacts progressively instead of hitting a cliff. */
html body .site-header.lux-header .main-nav.lux-nav{
padding:0 clamp(18px,2.4vw,30px) !important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
width:100% !important;
max-width:1280px !important;
min-height:48px !important;
margin:0 auto !important;
padding:0 !important;
gap:clamp(16px,2vw,26px) !important;
flex-wrap:nowrap !important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger{
min-height:48px !important;
font-size:clamp(9px,.82vw,11px) !important;
white-space:nowrap !important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique{
margin-right:clamp(4px,1vw,12px) !important;
}
}
/* Narrow laptop/tablet landscape: account becomes icon-only before search is sacrificed. */
@media (min-width:901px) and (max-width:1040px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:minmax(140px,165px) minmax(240px,1fr) max-content !important;
column-gap:14px !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > a.orilom-account-link,
html body.logged-in .site-header.lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
width:46px !important;
min-width:46px !important;
max-width:46px !important;
padding:0 !important;
font-size:0 !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu .orilom-header-action-label{
display:none !important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
gap:14px !important;
}
}
/* Mobile/tablet portrait: switch decisively to mobile app-bar, no half-desktop state. */
@media (max-width:900px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
width:100% !important;
max-width:none !important;
min-height:68px !important;
padding:9px 12px !important;
display:grid !important;
grid-template-areas:"menu brand tools" !important;
grid-template-columns:42px minmax(0,1fr) max-content !important;
gap:8px !important;
align-items:center !important;
overflow:visible !important;
}
html body .site-header.lux-header .menu-toggle{
grid-area:menu !important;
display:flex !important;
}
html body .site-header.lux-header .lux-brand{
grid-area:brand !important;
justify-self:start !important;
min-width:0 !important;
}
html body .site-header.lux-header .orilom-header-brand-lockup strong{
font-size:23px !important;
}
html body .site-header.lux-header .lux-search{
display:none !important;
}
html body .site-header.lux-header .header-tools,
html body.logged-in .site-header.lux-header .header-tools,
html body:not(.logged-in) .site-header.lux-header .header-tools{
grid-area:tools !important;
justify-self:end !important;
width:auto !important;
min-width:0 !important;
max-width:none !important;
display:flex !important;
gap:2px !important;
padding:0 !important;
}
html body .site-header.lux-header .main-nav.lux-nav{
display:none !important;
}
}
/* ==========================================================
ORILOM V61 — HEADER RIGHT SAFE AREA
Laptop/Desktop compact: move the complete right actions
group inward while keeping account dropdown anchored.
========================================================== */
@media (min-width: 901px) and (max-width: 1400px) {
.header-tools,
.orilom-header-tools,
.header-actions {
position: relative !important;
right: clamp(28px, 3vw, 46px) !important;
}
.account-wrapper {
position: relative !important;
}
.account-dropdown {
right: 0 !important;
left: auto !important;
max-width: calc(100vw - 32px) !important;
}
}
/* ==========================================================
ORILOM V62 — VERIFIED APP BAR TOOLS SHIFT
Exact live header selector: .site-header.lux-header .header-tools
Move the entire Favoris/Panier/Compte cluster inward without
changing grid sizing or the hero. Transform is intentional:
it cannot be neutralized by grid justify-self calculations.
========================================================== */
@media (min-width: 901px) and (max-width: 1400px) {
html body .site-header.lux-header .lux-header-main > .header-tools,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools,
html body:not(.logged-in) .site-header.lux-header .lux-header-main > .header-tools {
position: relative !important;
left: auto !important;
right: auto !important;
margin-left: 0 !important;
margin-right: 0 !important;
transform: translateX(clamp(-88px, -6vw, -56px)) !important;
will-change: transform;
}
/* Keep injected account wrapper/dropdown tied to its trigger. */
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu {
position: relative !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu .orilom-account-dropdown {
position: absolute !important;
top: calc(100% + 8px) !important;
right: 0 !important;
left: auto !important;
transform: none !important;
width: 250px !important;
max-width: calc(100vw - 32px) !important;
}
}
/* Less movement once the header is already in its narrow layout. */
@media (min-width: 901px) and (max-width: 1040px) {
html body .site-header.lux-header .lux-header-main > .header-tools,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools,
html body:not(.logged-in) .site-header.lux-header .lux-header-main > .header-tools {
transform: translateX(-42px) !important;
}
}
/* Mobile layout owns its own spacing: cancel desktop shift. */
@media (max-width: 900px) {
html body .site-header.lux-header .lux-header-main > .header-tools,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools,
html body:not(.logged-in) .site-header.lux-header .lux-header-main > .header-tools {
transform: none !important;
}
}
/* ==========================================================
ORILOM V63 — SMALL-LAPTOP ACCOUNT PANEL / LEFT OPENING
Keep the app-bar tools in their natural grid position.
On small laptops, shift ONLY the dropdown inward/left.
========================================================== */
@media (min-width: 901px) and (max-width: 1250px) {
/* Undo V61/V62 movement of the whole Favoris/Panier/Compte cluster. */
html body .site-header.lux-header .lux-header-main > .header-tools,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools,
html body:not(.logged-in) .site-header.lux-header .lux-header-main > .header-tools {
position: relative !important;
left: auto !important;
right: auto !important;
margin-left: 0 !important;
margin-right: 0 !important;
transform: none !important;
translate: none !important;
overflow: visible !important;
}
/* Account trigger remains where the header layout places it. */
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu {
position: relative !important;
overflow: visible !important;
}
/* Panel opens inward: its right edge sits 18px left of the trigger's right edge. */
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown {
position: absolute !important;
top: calc(100% + 8px) !important;
right: 18px !important;
left: auto !important;
inset: auto 18px auto auto !important;
width: 270px !important;
min-width: 270px !important;
max-width: calc(100vw - 32px) !important;
margin: 0 !important;
transform: none !important;
translate: none !important;
box-sizing: border-box !important;
overflow-x: hidden !important;
z-index: 999999 !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before {
left: auto !important;
right: 8px !important;
}
}
/* Very narrow laptop: pull the panel farther inward while keeping the trigger stable. */
@media (min-width: 901px) and (max-width: 1050px) {
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown {
right: 28px !important;
inset: auto 28px auto auto !important;
width: 260px !important;
min-width: 260px !important;
}
}
/* ==========================================================
ORILOM V64 — 14-INCH / MID-DESKTOP ACCOUNT PANEL FIX
Deep inspection: the failing screenshot is ~1582px wide, so
V60/V63 (max 1280/1250) never ran. Keep the app-bar untouched
and pull ONLY the account dropdown inward on 1251–1700px.
========================================================== */
@media (min-width: 1251px) and (max-width: 1700px) {
html body .site-header.lux-header .lux-header-main > .header-tools,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools,
html body:not(.logged-in) .site-header.lux-header .lux-header-main > .header-tools {
transform: none !important;
translate: none !important;
right: auto !important;
left: auto !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu {
position: relative !important;
overflow: visible !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown {
position: absolute !important;
top: calc(100% + 8px) !important;
left: auto !important;
right: 72px !important;
inset: auto 72px auto auto !important;
width: 270px !important;
min-width: 270px !important;
max-width: calc(100vw - 40px) !important;
margin: 0 !important;
transform: none !important;
translate: none !important;
box-sizing: border-box !important;
overflow-x: hidden !important;
z-index: 999999 !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before {
left: auto !important;
right: 0 !important;
transform: translateX(72px) rotate(45deg) !important;
}
}
/* Exact band around the supplied 1582px screenshot: a little more breathing room. */
@media (min-width: 1450px) and (max-width: 1620px) {
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown {
right: 88px !important;
inset: auto 88px auto auto !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before {
transform: translateX(88px) rotate(45deg) !important;
}
}
/* ==========================================================
ORILOM V65 — FIX VERTICAL ANCHOR REGRESSION
V64 used `inset: auto ...`, which reset `top` to auto and
detached the dropdown vertically. Reset inset first, then
explicitly restore top/right so the panel opens BELOW trigger.
========================================================== */
@media (min-width: 1251px) and (max-width: 1700px) {
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown {
inset: auto !important;
top: calc(100% + 8px) !important;
bottom: auto !important;
left: auto !important;
right: 72px !important;
margin: 0 !important;
transform: none !important;
translate: none !important;
}
}
@media (min-width: 1450px) and (max-width: 1620px) {
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown {
inset: auto !important;
top: calc(100% + 8px) !important;
bottom: auto !important;
left: auto !important;
right: 88px !important;
}
}
/* ==========================================================
ORILOM V66 — ACCOUNT DROPDOWN EDGE ALIGNMENT
Target: mid-desktop / 14-inch viewport.
Keep the appbar fixed. Align dropdown RIGHT edge with
the Mon compte trigger RIGHT edge; panel naturally opens left.
Overrides V64/V65 artificial 72/88px offsets.
========================================================== */
@media (min-width: 1251px) and (max-width: 1700px) {
html body .site-header.lux-header .lux-header-main > .header-tools,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools,
html body:not(.logged-in) .site-header.lux-header .lux-header-main > .header-tools {
transform: none !important;
translate: none !important;
left: auto !important;
right: auto !important;
overflow: visible !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu {
position: relative !important;
overflow: visible !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown {
position: absolute !important;
inset: auto !important;
top: calc(100% + 8px) !important;
right: 0 !important;
bottom: auto !important;
left: auto !important;
width: 270px !important;
min-width: 270px !important;
max-width: calc(100vw - 32px) !important;
margin: 0 !important;
transform: none !important;
translate: none !important;
box-sizing: border-box !important;
overflow-x: hidden !important;
z-index: 999999 !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before {
left: auto !important;
right: 22px !important;
transform: rotate(45deg) !important;
}
}
/* ==========================================================
ORILOM V67 — 90% BROWSER ZOOM / WIDE CSS VIEWPORT FIX
At 90% zoom a ~1580 physical-pixel window exposes roughly
~1750 CSS px, so V66 (max-width:1700px) no longer matched.
Extend the exact same stable edge-aligned behavior to 1920px.
App bar remains untouched; only account dropdown anchoring.
========================================================== */
@media (min-width: 1701px) and (max-width: 1920px) {
html body .site-header.lux-header .lux-header-main > .header-tools,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools,
html body:not(.logged-in) .site-header.lux-header .lux-header-main > .header-tools {
transform: none !important;
translate: none !important;
left: auto !important;
right: auto !important;
overflow: visible !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu {
position: relative !important;
overflow: visible !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown {
position: absolute !important;
inset: auto !important;
top: calc(100% + 8px) !important;
right: 0 !important;
bottom: auto !important;
left: auto !important;
width: 270px !important;
min-width: 270px !important;
max-width: calc(100vw - 32px) !important;
margin: 0 !important;
transform: none !important;
translate: none !important;
box-sizing: border-box !important;
overflow-x: hidden !important;
z-index: 999999 !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools .orilom-account-menu > .orilom-account-dropdown::before {
left: auto !important;
right: 22px !important;
transform: rotate(45deg) !important;
}
}
/* ==========================================================
ORILOM V68 — RESPONSIVE APPBAR BRIDGE (1281–1500 CSS PX)
Fixes the 110% zoom / ~1430 CSS-px dead zone.
V60 compact layout stopped at 1280px, while the full desktop
layout needs more room. This extends the SAME compact logic
into the missing band without changing the stable wide desktop.
========================================================== */
@media (min-width:1281px) and (max-width:1500px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
width:100% !important;
max-width:1500px !important;
min-height:76px !important;
margin:0 auto !important;
padding:10px clamp(28px,3vw,46px) !important;
display:grid !important;
grid-template-areas:"brand search tools" !important;
grid-template-columns:minmax(180px,220px) minmax(360px,1fr) max-content !important;
column-gap:clamp(24px,3vw,44px) !important;
align-items:center !important;
box-sizing:border-box !important;
overflow:visible !important;
}
html body .site-header.lux-header .lux-brand{
grid-area:brand !important;
min-width:0 !important;
justify-self:start !important;
}
/* Remove the redundant top-row category selector in the squeeze band. */
html body .site-header.lux-header .lux-search{
grid-area:search !important;
justify-self:stretch !important;
width:100% !important;
min-width:0 !important;
max-width:none !important;
height:43px !important;
min-height:43px !important;
display:grid !important;
grid-template-columns:minmax(0,1fr) 42px !important;
border:0 !important;
border-bottom:1px solid #26231e !important;
border-radius:0 !important;
background:#fff !important;
box-shadow:none !important;
overflow:visible !important;
}
html body .site-header.lux-header .lux-search .orilom-header-category,
html body .site-header.lux-header .lux-search select,
html body .site-header.lux-header .lux-brands{
display:none !important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-wrap{
min-width:0 !important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-input{
width:100% !important;
min-width:0 !important;
height:42px !important;
padding:0 12px !important;
}
html body .site-header.lux-header .lux-search .orilom-search-submit{
width:42px !important;
height:42px !important;
border:0 !important;
background:#fff !important;
}
/* Reserve a real column for the actions instead of letting them overflow. */
html body .site-header.lux-header .lux-header-main > .header-tools,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools,
html body:not(.logged-in) .site-header.lux-header .lux-header-main > .header-tools{
grid-area:tools !important;
position:relative !important;
justify-self:end !important;
width:auto !important;
min-width:0 !important;
max-width:none !important;
display:flex !important;
align-items:center !important;
justify-content:flex-end !important;
gap:6px !important;
margin:0 !important;
padding:0 !important;
left:auto !important;
right:auto !important;
transform:none !important;
translate:none !important;
overflow:visible !important;
}
html body .site-header.lux-header .header-tools > a.wishlist-link,
html body .site-header.lux-header .header-tools > a.cart-link{
width:44px !important;
min-width:44px !important;
max-width:44px !important;
height:46px !important;
min-height:46px !important;
padding:4px !important;
flex:0 0 44px !important;
}
html body .site-header.lux-header .header-tools > a.wishlist-link .orilom-header-action-label,
html body .site-header.lux-header .header-tools > a.cart-link .orilom-header-action-label{
display:none !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu{
position:relative !important;
width:auto !important;
min-width:0 !important;
margin:0 !important;
padding:0 !important;
flex:0 0 auto !important;
overflow:visible !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
width:auto !important;
min-width:112px !important;
height:46px !important;
min-height:46px !important;
padding:0 13px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:7px !important;
white-space:nowrap !important;
}
/* Keep the already validated dropdown geometry. */
html body .site-header.lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown{
position:absolute !important;
inset:auto !important;
top:calc(100% + 8px) !important;
right:0 !important;
bottom:auto !important;
left:auto !important;
width:270px !important;
min-width:270px !important;
max-width:calc(100vw - 32px) !important;
margin:0 !important;
transform:none !important;
translate:none !important;
z-index:999999 !important;
}
/* Compact the second row progressively as well. */
html body .site-header.lux-header .main-nav.lux-nav{
padding:0 clamp(28px,3vw,46px) !important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav{
width:100% !important;
max-width:1500px !important;
margin:0 auto !important;
gap:clamp(18px,2vw,30px) !important;
flex-wrap:nowrap !important;
}
html body .site-header.lux-header .main-nav.lux-nav .orilom-primary-nav > li > a,
html body .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger{
font-size:clamp(9px,.75vw,11px) !important;
white-space:nowrap !important;
}
}
/* ==========================================================
ORILOM V69 — FLUID APP BAR / HARD NO-OVERFLOW
901–1500 CSS px: remove breakpoint-dependent width math.
The center column is allowed to shrink to ZERO (minmax(0,1fr));
the tools column always owns its intrinsic width and therefore
cannot be pushed outside the viewport by the search field.
========================================================== */
@media (min-width:901px) and (max-width:1500px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
width:100% !important;
max-width:none !important;
margin:0 !important;
padding-left:clamp(18px,3vw,44px) !important;
padding-right:clamp(24px,3.4vw,52px) !important;
box-sizing:border-box !important;
display:grid !important;
grid-template-areas:"brand search tools" !important;
grid-template-columns:minmax(145px,190px) minmax(0,1fr) max-content !important;
column-gap:clamp(14px,2.2vw,32px) !important;
align-items:center !important;
overflow:visible !important;
}
html body .site-header.lux-header .lux-brand{
grid-area:brand !important;
min-width:0 !important;
max-width:190px !important;
}
html body .site-header.lux-header .lux-search{
grid-area:search !important;
width:100% !important;
min-width:0 !important;
max-width:none !important;
box-sizing:border-box !important;
overflow:visible !important;
}
html body .site-header.lux-header .lux-search .orilom-header-category,
html body .site-header.lux-header .lux-search select,
html body .site-header.lux-header .lux-brands{
display:none !important;
}
html body .site-header.lux-header .lux-search .orilom-live-search-wrap,
html body .site-header.lux-header .lux-search form,
html body .site-header.lux-header .lux-search input{
min-width:0 !important;
max-width:100% !important;
box-sizing:border-box !important;
}
html body .site-header.lux-header .lux-header-main > .header-tools,
html body.logged-in .site-header.lux-header .lux-header-main > .header-tools,
html body:not(.logged-in) .site-header.lux-header .lux-header-main > .header-tools{
grid-area:tools !important;
position:relative !important;
justify-self:end !important;
align-self:center !important;
width:max-content !important;
min-width:max-content !important;
max-width:none !important;
margin:0 !important;
padding:0 !important;
display:flex !important;
flex-wrap:nowrap !important;
align-items:center !important;
justify-content:flex-end !important;
gap:4px !important;
left:auto !important;
right:auto !important;
transform:none !important;
translate:none !important;
overflow:visible !important;
}
html body .site-header.lux-header .header-tools > a.wishlist-link,
html body .site-header.lux-header .header-tools > a.cart-link{
flex:0 0 42px !important;
width:42px !important;
min-width:42px !important;
max-width:42px !important;
}
html body .site-header.lux-header .header-tools > a.wishlist-link .orilom-header-action-label,
html body .site-header.lux-header .header-tools > a.cart-link .orilom-header-action-label{
display:none !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu{
position:relative !important;
flex:0 0 auto !important;
width:auto !important;
min-width:0 !important;
max-width:none !important;
overflow:visible !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
width:auto !important;
min-width:104px !important;
max-width:118px !important;
padding-left:10px !important;
padding-right:10px !important;
box-sizing:border-box !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:clip !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown,
html body.logged-in .site-header.lux-header .header-tools .orilom-account-menu > .orilom-account-dropdown{
position:absolute !important;
inset:auto !important;
top:calc(100% + 8px) !important;
right:0 !important;
bottom:auto !important;
left:auto !important;
width:270px !important;
min-width:270px !important;
max-width:calc(100vw - 32px) !important;
margin:0 !important;
transform:none !important;
translate:none !important;
z-index:999999 !important;
}
}
/* Extra squeeze only when the viewport genuinely becomes narrow. */
@media (min-width:901px) and (max-width:1100px){
html body .site-header.lux-header .lux-header-main,
html body.logged-in .site-header.lux-header .lux-header-main,
html body:not(.logged-in) .site-header.lux-header .lux-header-main{
grid-template-columns:minmax(135px,165px) minmax(0,1fr) max-content !important;
column-gap:12px !important;
padding-left:16px !important;
padding-right:20px !important;
}
html body .site-header.lux-header .header-tools .orilom-account-menu > a.orilom-account-link{
min-width:96px !important;
max-width:104px !important;
padding-left:8px !important;
padding-right:8px !important;
}
}
/* ==========================================================
ORILOM V70 — BOUTIQUE CONTEXT STATE
HOME / non-store pages: white gateway.
WooCommerce catalogue + product contexts: ivory/gold connected tab.
========================================================== */
@media (min-width:901px){
/* Default / HOME: neutral white Boutique gateway. */
html body:not(.woocommerce-shop):not(.post-type-archive-product):not(.tax-product_cat):not(.tax-product_tag):not(.tax-product_brand):not(.single-product):not(.search) .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger{
background:#FFFFFF !important;
border-color:#D8B557 !important;
color:#111111 !important;
}
/* Store contexts: explicit ivory state, including the 901–1100 range. */
html body.woocommerce-shop .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body.post-type-archive-product .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body.tax-product_cat .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body.tax-product_tag .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body.tax-product_brand .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body.single-product .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body.search.woocommerce .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger,
html body.search.post-type-archive-product .site-header.lux-header .main-nav.lux-nav .orilom-nav-boutique .orilom-collections-trigger{
background:#FCF8ED !important;
border-color:#D8B557 !important;
color:#111111 !important;
}
/* Store hover/open: keep context fill, only strengthen gold accent. */
html body.woocommerce-shop .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
html body.woocommerce-shop .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger,
html body.post-type-archive-product .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
html body.post-type-archive-product .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger,
html body.tax-product_cat .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
html body.tax-product_cat .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger,
html body.tax-product_tag .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
html body.tax-product_tag .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger,
html body.tax-product_brand .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
html body.tax-product_brand .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger,
html body.single-product .site-header.lux-header .orilom-nav-boutique:hover .orilom-collections-trigger,
html body.single-product .site-header.lux-header .orilom-nav-boutique.is-open .orilom-collections-trigger{
background:#FCF8ED !important;
border-color:#C69A18 !important;
}
}
/* ==========================================================================
ORILOM V77 — UNIVERS OLFACTIFS / LUXURY STORE VISIBILITY
Clean single authority block: stronger discoverability without visual noise.
========================================================================== */
body.home .lux-home-v5 .orilom-scent-worlds{
--ou-gold:#a87312;
--ou-gold-soft:#d9b76f;
--ou-ink:#11100d;
--ou-muted:#68635b;
--ou-line:#e3ddd1;
--ou-card:#fbf8f2;
--ou-card-hover:#fffaf0;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:1px!important;
max-width:1205px!important;
margin-inline:auto!important;
background:var(--ou-line)!important;
border:1px solid var(--ou-line)!important;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world{
position:relative!important;
isolation:isolate!important;
min-width:0!important;
min-height:252px!important;
padding:34px 36px 30px!important;
display:flex!important;
flex-direction:column!important;
align-items:flex-start!important;
justify-content:flex-end!important;
overflow:hidden!important;
background:
radial-gradient(circle at calc(100% - 51px) 50px,rgba(194,143,38,.075) 0,rgba(194,143,38,.035) 38px,transparent 78px),
var(--ou-card)!important;
color:var(--ou-ink)!important;
border:0!important;
box-shadow:none!important;
text-decoration:none!important;
cursor:pointer!important;
transform:translateZ(0)!important;
transition:background-color .28s ease,transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s ease!important;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world::before{
content:""!important;
position:absolute!important;
inset:0!important;
display:block!important;
border:1px solid transparent!important;
pointer-events:none!important;
z-index:5!important;
transition:border-color .28s ease!important;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world::after{
content:""!important;
display:block!important;
position:absolute!important;
top:65px!important;
left:36px!important;
width:32px!important;
height:1px!important;
background:var(--ou-gold)!important;
opacity:.92!important;
transition:width .28s ease!important;
}
/* Index */
body.home .lux-home-v5 .orilom-scent-index{
position:absolute!important;
top:33px!important;
left:36px!important;
right:auto!important;
bottom:auto!important;
display:block!important;
margin:0!important;
padding:0!important;
color:#817766!important;
font:700 10px/1 Arial,sans-serif!important;
letter-spacing:.20em!important;
opacity:.82!important;
z-index:3!important;
}
/* Icon + restrained luxury halo */
body.home .lux-home-v5 .orilom-scent-icon{
position:absolute!important;
top:27px!important;
right:29px!important;
left:auto!important;
bottom:auto!important;
display:grid!important;
place-items:center!important;
width:52px!important;
height:52px!important;
margin:0!important;
padding:0!important;
color:var(--ou-gold)!important;
opacity:.84!important;
pointer-events:none!important;
z-index:3!important;
transform:none!important;
transition:color .28s ease,opacity .28s ease,transform .28s cubic-bezier(.2,.7,.2,1)!important;
}
body.home .lux-home-v5 .orilom-scent-icon svg{
display:block!important;
width:48px!important;
height:48px!important;
margin:0!important;
padding:0!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.25!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
overflow:visible!important;
}
/* Typography */
body.home .lux-home-v5 .orilom-scent-world > strong{
position:static!important;
display:block!important;
width:100%!important;
max-width:calc(100% - 6px)!important;
margin:0 0 8px!important;
padding:0!important;
color:var(--ou-ink)!important;
font-size:clamp(33px,2.25vw,41px)!important;
line-height:1!important;
font-weight:500!important;
letter-spacing:-.03em!important;
z-index:2!important;
}
body.home .lux-home-v5 .orilom-scent-world > .orilom-scent-copy{
position:static!important;
display:block!important;
margin:0 0 28px!important;
padding:0!important;
color:var(--ou-muted)!important;
font-size:12px!important;
line-height:1.45!important;
z-index:2!important;
}
/* Clear store CTA */
body.home .lux-home-v5 .orilom-scent-world > b{
position:relative!important;
display:inline-flex!important;
align-items:center!important;
gap:12px!important;
margin:0!important;
padding:0 0 7px!important;
border:0!important;
color:#17130c!important;
font:800 10px/1 Arial,sans-serif!important;
letter-spacing:.13em!important;
white-space:nowrap!important;
text-decoration:none!important;
z-index:2!important;
}
body.home .lux-home-v5 .orilom-scent-world > b::before{
content:""!important;
position:absolute!important;
left:0!important;
right:auto!important;
bottom:0!important;
width:34px!important;
height:1px!important;
display:block!important;
background:var(--ou-gold)!important;
transition:width .3s ease!important;
}
body.home .lux-home-v5 .orilom-scent-world > b::after{
content:none!important;
display:none!important;
}
body.home .lux-home-v5 .orilom-scent-world > b i{
display:inline-block!important;
margin:0!important;
padding:0!important;
border:0!important;
font-style:normal!important;
font-size:14px!important;
line-height:1!important;
transition:transform .28s ease!important;
}
/* Store-oriented interaction */
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world:hover{
background:
radial-gradient(circle at calc(100% - 51px) 50px,rgba(190,132,24,.12) 0,rgba(190,132,24,.05) 42px,transparent 84px),
var(--ou-card-hover)!important;
transform:translateY(-2px)!important;
box-shadow:0 16px 36px rgba(34,25,10,.07)!important;
z-index:4!important;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world:hover::before{
border-color:rgba(168,115,18,.52)!important;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world:hover::after{
width:58px!important;
}
body.home .lux-home-v5 .orilom-scent-world:hover .orilom-scent-icon{
color:#8d5e08!important;
opacity:1!important;
transform:translateY(-2px) scale(1.045)!important;
}
body.home .lux-home-v5 .orilom-scent-world:hover > b::before{
width:100%!important;
}
body.home .lux-home-v5 .orilom-scent-world:hover > b i{
transform:translateX(5px)!important;
}
body.home .lux-home-v5 .orilom-scent-world:focus-visible{
outline:2px solid var(--ou-gold)!important;
outline-offset:-4px!important;
background:var(--ou-card-hover)!important;
}
/* Tablet */
@media (max-width:900px){
body.home .lux-home-v5 .orilom-scent-worlds-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world{
min-height:228px!important;
padding:30px 28px 26px!important;
}
body.home .lux-home-v5 .orilom-scent-index{top:28px!important;left:28px!important;}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world::after{top:59px!important;left:28px!important;}
body.home .lux-home-v5 .orilom-scent-icon{top:23px!important;right:24px!important;width:47px!important;height:47px!important;}
body.home .lux-home-v5 .orilom-scent-icon svg{width:43px!important;height:43px!important;}
}
/* Mobile */
@media (max-width:560px){
body.home .lux-home-v5 .orilom-scent-worlds-grid{
grid-template-columns:1fr!important;
}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world{
min-height:205px!important;
padding:27px 24px 24px!important;
}
body.home .lux-home-v5 .orilom-scent-index{top:25px!important;left:24px!important;}
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world::after{top:55px!important;left:24px!important;}
body.home .lux-home-v5 .orilom-scent-icon{top:20px!important;right:21px!important;width:44px!important;height:44px!important;}
body.home .lux-home-v5 .orilom-scent-icon svg{width:40px!important;height:40px!important;}
body.home .lux-home-v5 .orilom-scent-world > strong{font-size:31px!important;}
body.home .lux-home-v5 .orilom-scent-world > b{font-size:9px!important;letter-spacing:.11em!important;}
}
@media (prefers-reduced-motion:reduce){
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world,
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world::before,
body.home .lux-home-v5 .orilom-scent-worlds-grid > a.orilom-scent-world::after,
body.home .lux-home-v5 .orilom-scent-icon,
body.home .lux-home-v5 .orilom-scent-world > b::before,
body.home .lux-home-v5 .orilom-scent-world > b i{
transition:none!important;
}
}