/* ═══════════════════════════════════════════════════════════
   UNIVERSRESTAU — warehousechild/assets/css/custom.css
   Thème Warehouse / IQIT · PrestaShop 9
   Charte : navy #002136 · vert #4D6A63 · orange #FAA633
   Discipline de ciblage : !important + contrôle flex colonnes
   (même approche que les builds Warehouse précédents)
═══════════════════════════════════════════════════════════ */

:root{
  --ur-navy:      #002136;
  --ur-navy-dark: #001828;
  --ur-navy-h:    #003050;
  --ur-green:     #4D6A63;
  --ur-green-l:   #edf2f1;
  --ur-orange:    #FAA633;
  --ur-orange-h:  #e8920f;
  --ur-orange-l:  #fff8ec;
  --ur-bg:        #F4F6F8;
  --ur-bg2:       #ECEEF1;
  --ur-border:    #DDE1E7;
  --ur-text:      #0F1E2B;
  --ur-text2:     #4A5568;
  --ur-muted:     #8A95A3;
}


/* ════════════════════════════════════════════════════════════
   TOP BAR  — classes 100% custom (.ur-topbar*), AUCUNE classe Warehouse
   → masquer le .header-nav d'origine n'impacte plus cette barre.
   HTML à coller dans iqitlinksmanager / bloc HTML custom :
     <div class="ur-topbar"><div class="ur-topbar__inner">
       <div class="ur-topbar__left"> … </div>
       <div class="ur-topbar__right"> … </div>
     </div></div>
════════════════════════════════════════════════════════════ */
.ur-topbar{
  background: var(--ur-navy-dark);
  font-size: 12px;
  line-height: 1;
  color: rgba(255,255,255,.72);
}
.ur-topbar__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  max-width: none;
  margin: 0;
  padding: 8px 28px;
}
.ur-topbar__left,
.ur-topbar__right{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.ur-topbar__item{
  display:inline-flex; align-items:center; gap:6px;
  color: rgba(255,255,255,.72); text-decoration:none; white-space:nowrap;
}
.ur-topbar__item:hover{ color:#fff; }
.ur-topbar__item .fa{ opacity:.7; }
.ur-topbar__sep{ opacity:.2; }
/* Réseaux sociaux (groupe à droite) */
.ur-topbar__socials{ display:inline-flex; align-items:center; gap:6px; }
.ur-topbar__social{
  display:inline-flex; align-items:center; justify-content:center;
  width:24px; height:24px; border-radius:50%;
  color:rgba(255,255,255,.7) !important; text-decoration:none;
  font-size:12px; transition:background .15s, color .15s;
}
.ur-topbar__social:hover{ background:var(--ur-orange); color:var(--ur-navy) !important; }
.ur-topbar__social i{ line-height:1; }
.ur-topbar__badge{
  background: var(--ur-orange); color: var(--ur-navy);
  font-weight:700; font-size:11px; padding:3px 9px; border-radius:3px;
}
.ur-topbar__pro{ color: rgba(255,255,255,.55); white-space:nowrap; }

@media (max-width:991.98px){ .ur-topbar{ display:none; } }


/* ════════════════════════════════════════════════════════════
   HEADER PRINCIPAL  (.header-top + layout des colonnes)
════════════════════════════════════════════════════════════ */
#header .header-top{
  background:#fff !important;
  border-bottom:1px solid var(--ur-border) !important;
  box-shadow:0 1px 12px rgba(0,33,54,.05) !important;
  padding:0 !important;
}
#desktop-header-container{ min-height:88px; }
#desktop-header-container > .row{ min-height:88px; }

/* Logo : gauche */
#desktop-header-container .col-header-left{
  flex:0 0 auto !important; width:auto !important;
}
/* Search : centre, prend l'espace */
#desktop-header-container .col-header-center{
  flex:1 1 0 !important; min-width:0;
  display:flex !important; align-items:center !important;
}
/* Actions : droite */
#desktop-header-container .col-header-right{
  flex:0 0 auto !important; width:auto !important;
}
#desktop-header-container .col-header-right > .row{ align-items:center; }


/* ── LOGO ──
   DOM : #desktop_logo > a > img.logo.img-fluid (width="2752" height="502")
   On plafonne en HAUTEUR (le ratio fait le reste). */
#desktop_logo{ display:inline-flex; align-items:center; padding:14px 0; }
#desktop_logo img.logo{
  height:auto !important;
  width:auto !important;
  max-height:52px !important;
  max-width:190px !important;
}
#mobile-header .logo{ max-height:40px !important; width:auto !important; height:auto !important; }


/* ════════════════════════════════════════════════════════════
   RECHERCHE  (iqitsearch — #search_widget)
   DOM : #search_widget > form > .input-group > input.form-search-control + button.search-btn
════════════════════════════════════════════════════════════ */
#search_widget{ width:100%; max-width:680px; }
#search_widget .input-group{
  flex-wrap:nowrap !important;
  border-radius:6px !important;
  overflow:hidden !important;
}
#search_widget input.form-search-control{
  border:1.5px solid var(--ur-border) !important;
  border-right:0 !important;
  border-radius:6px 0 0 6px !important;
  height:44px !important; min-height:0 !important;
  padding:0 16px !important; font-size:13.5px !important;
  color:var(--ur-text) !important; background:#fff !important;
  box-shadow:none !important; flex:1 1 auto !important;
}
#search_widget input.form-search-control:focus{ border-color:var(--ur-navy) !important; box-shadow:none !important; }
#search_widget input.form-search-control::placeholder{ color:var(--ur-muted) !important; }
#search_widget button.search-btn{
  background:var(--ur-navy) !important; color:#fff !important; border:0 !important;
  border-radius:0 6px 6px 0 !important;
  height:44px !important; min-width:56px !important; padding:0 18px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  flex-shrink:0; transition:background .2s;
}
#search_widget button.search-btn:hover{ background:var(--ur-navy-h) !important; }
#search_widget button.search-btn i.fa-search{ color:#fff !important; font-size:14px !important; }
#search_widget .autocomplete-suggestions{
  border:1px solid var(--ur-border) !important; border-top:3px solid var(--ur-orange) !important;
  box-shadow:0 12px 32px rgba(0,33,54,.15) !important;
}


/* ════════════════════════════════════════════════════════════
   BADGE "ENTREPRISE FRANÇAISE"  (.ur-frenchbiz)
   Petit repère tricolore posé JUSTE AU-DESSUS de la barre de recherche.
   ⚠ Markup ajouté dans warehousechild header-2.tpl :
     la recherche est enveloppée dans .ur-search-col (empilement vertical)
     → badge en haut, champ de recherche en dessous.
════════════════════════════════════════════════════════════ */
/* Colonne verticale : badge au-dessus, recherche en dessous */
.col-header-center .ur-search-col{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  flex:1 1 auto; min-width:0; width:100%;
}
.col-header-center .ur-search-col #search_widget{ width:100%; }

/* Le badge lui-même : barre bleue · label · barre rouge */
.ur-frenchbiz{
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  line-height:1;
}
.ur-frenchbiz__bar{
  height:4px; width:56px; border-radius:2px; flex:0 0 auto;
}
.ur-frenchbiz__bar--blue{ background:#002395; }
.ur-frenchbiz__bar--red{  background:#ED2939; }
.ur-frenchbiz__label{
  font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ur-text); white-space:nowrap;
}

@media (max-width:575.98px){
  .ur-frenchbiz{ gap:8px; }
  .ur-frenchbiz__bar{ width:34px; }
  .ur-frenchbiz__label{ font-size:11px; letter-spacing:.10em; }
}


/* ════════════════════════════════════════════════════════════
   CONNEXION  (ps_customersignin-btn)
   DOM : #header-user-btn > a.header-btn.header-user-btn > i.icon + span.title
════════════════════════════════════════════════════════════ */
#header-user-btn .header-user-btn{
  display:inline-flex !important; flex-direction:column; align-items:center; gap:3px !important;
  padding:6px 12px !important; height:auto !important;
  color:var(--ur-text2) !important; border-radius:6px; transition:background .15s,color .15s;
}
#header-user-btn .header-user-btn:hover{ background:var(--ur-bg) !important; color:var(--ur-navy) !important; }
#header-user-btn .header-user-btn .icon{ color:var(--ur-navy) !important; font-size:19px !important; margin:0 !important; }
#header-user-btn .header-user-btn .title{ font-size:10.5px !important; font-weight:500; line-height:1; color:var(--ur-muted) !important; }
/* Dropdown compte connecté */
.header-user-btn-w .dropdown-menu{
  border:1px solid var(--ur-border) !important; border-top:3px solid var(--ur-orange) !important;
  border-radius:0 0 6px 6px !important; box-shadow:0 12px 32px rgba(0,33,54,.15) !important;
}
.header-user-btn-w .dropdown-item:hover{ background:var(--ur-bg) !important; color:var(--ur-navy) !important; }


/* ════════════════════════════════════════════════════════════
   WISHLIST  — dans le header, à côté de Connexion / Panier
   ⚠ REQUIERT le markup dans header-2.tpl (.col-header-right, avant
   #header-user-btn) :
     <div id="header-wishlist-btn" class="col col-auto header-btn-w header-wishlist-btn-w">
       <a href="{$urls.base_url}module/iqitwishlist/view" class="header-btn header-wishlist-btn">
         <i class="fa fa-heart-o fa-fw icon"></i>
         <span class="title">Favoris (<span id="iqitwishlist-nb">0</span>)</span>
       </a>
     </div>
════════════════════════════════════════════════════════════ */
#header-wishlist-btn .header-wishlist-btn{
  display:inline-flex !important; flex-direction:column; align-items:center; gap:3px !important;
  padding:6px 12px !important; height:auto !important;
  color:var(--ur-text2) !important; border-radius:6px; text-decoration:none;
  transition:background .15s,color .15s;
}
#header-wishlist-btn .header-wishlist-btn:hover{ background:var(--ur-bg) !important; color:var(--ur-navy) !important; }
#header-wishlist-btn .header-wishlist-btn .icon{ color:var(--ur-navy) !important; font-size:19px !important; margin:0 !important; }
#header-wishlist-btn .header-wishlist-btn .title{ font-size:10.5px !important; font-weight:500; line-height:1; color:var(--ur-muted) !important; }
#header-wishlist-btn .header-wishlist-btn #iqitwishlist-nb{ color:inherit !important; font-weight:600; }


/* ════════════════════════════════════════════════════════════
   PANIER  (ps_shoppingcart) — bouton orange "Mon panier [n]"
   DOM : a#cart-toogle.header-cart-btn
           > i.fa-shopping-bag.icon ( > span.cart-products-count-btn )
           > span.info-wrapper ( > span.title + span.cart-toggle-details )
════════════════════════════════════════════════════════════ */
#cart-toogle.header-cart-btn{
  display:inline-flex !important; align-items:center; gap:9px !important;
  background:var(--ur-orange) !important; color:var(--ur-navy) !important;
  height:44px !important; padding:0 18px !important; border-radius:6px !important;
  font-weight:700 !important; transition:background .15s; margin-left:6px;
}
#cart-toogle.header-cart-btn:hover{ background:var(--ur-orange-h) !important; }
#cart-toogle .icon,
#cart-toogle .info-wrapper,
#cart-toogle .title,
#cart-toogle .cart-toggle-details,
#cart-toogle .cart-separator{ color:var(--ur-navy) !important; }
#cart-toogle .icon{ font-size:19px !important; position:relative !important; margin:0 !important; }
#cart-toogle .info-wrapper{ display:inline-flex !important; align-items:center; }
#cart-toogle .title{ font-size:13.5px !important; font-weight:700 !important; }
/* On masque "/ Empty" pour coller à la maquette (Mon panier + pastille seule) */
#cart-toogle .cart-toggle-details{ display:none !important; }
/* Pastille compteur — imbriquée DANS le <i>, positionnée sur le bouton */
#cart-toogle .icon .cart-products-count-btn{
  position:absolute !important; top:-11px !important; right:-12px !important;
  background:var(--ur-navy) !important; color:#fff !important;
  font-size:10px !important; font-weight:700 !important;
  min-width:18px; height:18px; line-height:18px;
  border-radius:9px; text-align:center; padding:0 4px;
}
#cart-toogle .icon .cart-products-count-btn.d-none{ display:none !important; }
/* Dropdown panier */
#_desktop_blockcart-content.dropdown-menu,
#blockcart .dropdown-menu{
  border:1px solid var(--ur-border) !important; border-top:3px solid var(--ur-orange) !important;
  border-radius:0 0 6px 6px !important; box-shadow:0 12px 32px rgba(0,33,54,.15) !important;
}
/* (style du titre du drawer : voir section TUNNEL plus bas) */


/* ════════════════════════════════════════════════════════════
   MÉGA-MENU  (iqitmegamenu — #cbp-hrmenu)
   DOM : #cbp-hrmenu > ul > li.cbp-hrmenu-tab > a.nav-link > span.cbp-tab-title
════════════════════════════════════════════════════════════ */
#iqitmegamenu-wrapper.iqitmegamenu-wrapper,
#iqitmegamenu-horizontal.iqitmegamenu,
#cbp-hrmenu.cbp-hrmenu{ background:var(--ur-navy) !important; }

/* — Menu sur UNE seule ligne, défilement horizontal + flèches —
   Trop d'entrées (13) → on passe le <ul> en bande scrollable nowrap. */
#iqitmegamenu-horizontal.iqitmegamenu{ position:relative; }
#cbp-hrmenu > ul{
  display:flex !important; flex-wrap:nowrap !important;
  overflow-x:auto; scroll-behavior:smooth;
  -ms-overflow-style:none; scrollbar-width:none;
  margin:0 !important; padding:0 38px !important; /* place pour les flèches */
}
#cbp-hrmenu > ul::-webkit-scrollbar{ display:none; }
#cbp-hrmenu > ul > li.cbp-hrmenu-tab{ flex:0 0 auto !important; white-space:nowrap; }
/* Flèches de défilement (injectées par JS : .ur-menu-arrow) */
.ur-menu-arrow{
  position:absolute; top:0; bottom:0; width:38px; z-index:20;
  display:flex; align-items:center; justify-content:center;
  background:var(--ur-navy); color:#fff; border:0; cursor:pointer;
  font-size:18px; transition:background .15s;
}
.ur-menu-arrow:hover{ background:var(--ur-navy-h); }
.ur-menu-arrow--prev{ left:0; box-shadow:8px 0 12px -4px rgba(0,33,54,.5); }
.ur-menu-arrow--next{ right:0; box-shadow:-8px 0 12px -4px rgba(0,33,54,.5); }
.ur-menu-arrow[hidden]{ display:none; }

#cbp-hrmenu > ul > li.cbp-hrmenu-tab > a.nav-link{
  color:rgba(255,255,255,.82) !important; font-size:13px; font-weight:500;
  border-bottom:3px solid transparent !important; transition:background .15s,color .15s;
}
#cbp-hrmenu > ul > li.cbp-hrmenu-tab:hover > a.nav-link,
#cbp-hrmenu > ul > li.cbp-hrmenu-tab.cbp-hover > a.nav-link,
#cbp-hrmenu > ul > li.cbp-hrmenu-tab.cbp-hropen > a.nav-link{
  background:rgba(255,255,255,.10) !important; color:#fff !important;
  border-bottom-color:var(--ur-orange) !important;
}
#cbp-hrmenu .cbp-tab-title{ color:inherit !important; }
/* Onglet "Offres & Nouveautés" mis en avant en orange */
#cbp-hrmenu > ul > li.cbp-hrmenu-tab.ur-promo > a.nav-link .cbp-tab-title{ color:var(--ur-orange) !important; font-weight:600; }
/* Panneau déroulant */
#cbp-hrmenu .cbp-hrsub{
  border-top:3px solid var(--ur-orange) !important;
  box-shadow:0 20px 60px rgba(0,33,54,.22) !important;
}
#cbp-hrmenu .cbp-hrsub a{ color:var(--ur-text2) !important; }
#cbp-hrmenu .cbp-hrsub a:hover{ color:var(--ur-navy) !important; }
#cbp-hrmenu .cbp-hrsub .cbp-column-title,
#cbp-hrmenu .cbp-hrsub h3{
  color:var(--ur-green) !important; font-size:11px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase;
  border-bottom:1px solid var(--ur-border); padding-bottom:6px;
}

/* — HEADER STICKY (mode "menu") : au scroll desktop, le thème réinjecte
     #ps-shoppingcart dans #sticky-cart-wrapper posé sur la barre du méga-menu
     → il chevauchait les liens. On masque ce panier collant.
     (Le panier reste accessible en haut de page, non collant, et le retour
      en haut le replace dans #ps-shoppingcart-wrapper.) — */
@media (min-width:992px){
  #sticky-cart-wrapper,
  #iqitmegamenu-wrapper.stuck #sticky-cart-wrapper,
  #iqitmegamenu-wrapper.stuck #ps-shoppingcart{ display:none !important; }
}


/* ════════════════════════════════════════════════════════════
   MÉGA-MENU FROID EN CERCLES  (.ur-circles — à câbler en BO iqitmegamenu)
════════════════════════════════════════════════════════════ */
#cbp-hrmenu .cbp-hrsub .ur-circles{ display:grid; grid-template-columns:repeat(5,1fr); gap:8px; padding:6px; }
.ur-circle-item{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  padding:14px 8px; border:1.5px solid transparent; border-radius:8px;
  text-align:center; transition:all .15s;
}
.ur-circle-item:hover{ background:var(--ur-bg); border-color:var(--ur-border); }
.ur-circle{
  width:66px; height:66px; border-radius:50%;
  background:var(--ur-bg); border:1.5px solid var(--ur-border);
  display:flex; align-items:center; justify-content:center;
  font-size:26px; color:var(--ur-navy); transition:border-color .15s;
}
.ur-circle-item:hover .ur-circle{ border-color:var(--ur-navy); }
.ur-circle-label{ font-size:11.5px; font-weight:500; color:var(--ur-text); line-height:1.35; }
.ur-circle-item.ur-featured .ur-circle{ border-color:var(--ur-orange); background:var(--ur-orange-l); }
.ur-circle-item.ur-featured .ur-circle-label{ color:var(--ur-orange-h); font-weight:600; }


/* ════════════════════════════════════════════════════════════
   BOUTONS GLOBAUX
════════════════════════════════════════════════════════════ */
.btn-primary, .btn.btn-primary{
  background:var(--ur-orange) !important; border-color:var(--ur-orange) !important;
  color:var(--ur-navy) !important; font-weight:600;
}
.btn-primary:hover, .btn.btn-primary:hover{
  background:var(--ur-orange-h) !important; border-color:var(--ur-orange-h) !important; color:var(--ur-navy) !important;
}


/* ════════════════════════════════════════════════════════════
   MOBILE
════════════════════════════════════════════════════════════ */
#mobile-header-sticky{ border-bottom:1px solid var(--ur-border) !important; }
#mobile-header .mobile-bag-icon .cart-products-count-btn,
#mobile-header #mobile-cart-products-count{ background:var(--ur-orange) !important; color:var(--ur-navy) !important; font-weight:700; }
#mobile-header .m-nav-btn .fa{ color:var(--ur-navy) !important; }


/* ════════════════════════════════════════════════════════════
   RÉASSURANCES SOUS LE SLIDER  (widget HTML Elementor)
   = trust strip de la maquette validée : 5 colonnes, fond clair,
   icône + titre + sous-ligne, séparateurs verticaux.
   Classes 100% custom .ur-trust* — aucune dépendance thème.
════════════════════════════════════════════════════════════ */
.ur-trust{
  display:flex;
  align-items:stretch;
  max-width:1320px;
  margin:0 auto;
  padding:0 15px;
  background:#fff;
  border-bottom:1px solid var(--ur-border);
}
.ur-trust__item{
  flex:1;
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 22px;
  border-right:1px solid var(--ur-border);
}
.ur-trust__item:first-child{ padding-left:0; }
.ur-trust__item:last-child{ border-right:0; padding-right:0; }
.ur-trust__icon{
  flex-shrink:0;
  color:var(--ur-navy);
  width:22px; height:22px;
  display:flex; align-items:center; justify-content:center;
}
.ur-trust__icon .fa{ font-size:20px; }
.ur-trust__txt{ min-width:0; }
.ur-trust__title{
  display:block;
  font-size:12.5px; font-weight:700; color:var(--ur-navy); line-height:1.25;
}
.ur-trust__sub{
  display:block;
  font-size:11px; color:var(--ur-muted); line-height:1.3; margin-top:1px;
}

@media (max-width:1199.98px){
  .ur-trust{ flex-wrap:wrap; }
  .ur-trust__item{ flex:1 1 33.333%; border-bottom:1px solid var(--ur-border); }
}
@media (max-width:767.98px){
  .ur-trust__item{ flex:1 1 50%; padding:14px; }
  .ur-trust__item:first-child{ padding-left:14px; }
}
@media (max-width:479.98px){
  .ur-trust__item{ flex:1 1 100%; border-right:0; }
}


/* ════════════════════════════════════════════════════════════
   3 BLOCS PROMO  (widget Elementor "Icon Box" × 3, éditable client)
   Classe par colonne : .ur-promo + .ur-promo--navy / --green / --orange
   Rendu maquette : icône en CARRÉ ARRONDI à GAUCHE + contenu à droite
   (sur-titre orange / titre blanc / texte) + flèche › à l'extrême droite.
   Position d'icône Elementor = "Gauche".
   Saisie client :
     • Champ TITRE       = sur-titre   ex. "Nouveautés"
     • Champ DESCRIPTION = <strong>Titre</strong> puis texte
════════════════════════════════════════════════════════════ */
.ur-promo .elementor-icon-box-wrapper{
  background:var(--ur-navy) !important;
  border-radius:10px;
  padding:24px !important;
  position:relative;
  height:100%;
  display:flex !important; align-items:center !important;
  text-align:left !important;
  transition:transform .15s, box-shadow .15s;
}
.ur-promo:hover .elementor-icon-box-wrapper{ transform:translateY(-2px); box-shadow:0 10px 28px rgba(0,33,54,.18); }

/* Icône : carré arrondi translucide à gauche */
.ur-promo .elementor-icon-box-icon{
  margin:0 16px 0 0 !important; flex-shrink:0; width:auto !important;
}
.ur-promo .elementor-icon-box-icon .elementor-icon{
  width:54px !important; height:54px !important;
  background:rgba(255,255,255,.10) !important; border:0 !important;
  border-radius:10px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}
.ur-promo .elementor-icon-box-icon i{ color:var(--ur-orange) !important; font-size:24px !important; }

/* Contenu à droite (avec marge pour la flèche) */
.ur-promo .elementor-icon-box-content{ flex:1 1 auto !important; padding-right:28px; }

/* Champ TITRE = sur-titre (orange, petites majuscules) */
.ur-promo .elementor-icon-box-title{
  color:var(--ur-orange) !important;
  font-size:11px !important; font-weight:700 !important;
  letter-spacing:.08em; text-transform:uppercase;
  line-height:1.2 !important; margin:0 0 5px !important;
}
.ur-promo .elementor-icon-box-title span,
.ur-promo .elementor-icon-box-title a{ color:inherit !important; }

/* Champ DESCRIPTION : 1er <strong> = titre blanc, reste = texte clair */
.ur-promo .elementor-icon-box-description{ color:rgba(255,255,255,.72) !important; }
.ur-promo .elementor-icon-box-description p{ margin:0 0 2px !important; font-size:13px !important; line-height:1.5 !important; }
.ur-promo .elementor-icon-box-description strong{
  display:block; color:#fff !important;
  font-size:18px !important; font-weight:700 !important; line-height:1.25 !important; margin-bottom:4px;
}

/* Flèche › à l'extrême droite, centrée verticalement */
.ur-promo .elementor-icon-box-wrapper::after{
  content:"\203A"; position:absolute; right:22px; top:50%; transform:translateY(-50%);
  color:rgba(255,255,255,.45); font-size:22px; font-weight:700; line-height:1;
  transition:color .15s, right .15s;
}
.ur-promo:hover .elementor-icon-box-wrapper::after{ color:#fff; right:18px; }

/* Variantes couleur */
.ur-promo--navy   .elementor-icon-box-wrapper{ background:var(--ur-navy) !important; }
.ur-promo--green  .elementor-icon-box-wrapper{ background:var(--ur-green) !important; }
.ur-promo--orange .elementor-icon-box-wrapper{ background:var(--ur-orange) !important; }
.ur-promo--green .elementor-icon-box-description{ color:rgba(255,255,255,.82) !important; }
/* Fond orange : contrastes inversés */
.ur-promo--orange .elementor-icon-box-icon .elementor-icon{ background:rgba(0,33,54,.12) !important; }
.ur-promo--orange .elementor-icon-box-icon i{ color:var(--ur-navy) !important; }
.ur-promo--orange .elementor-icon-box-title{ color:#fff !important; }
.ur-promo--orange .elementor-icon-box-description{ color:rgba(0,33,54,.78) !important; }
.ur-promo--orange .elementor-icon-box-description strong{ color:var(--ur-navy) !important; }
.ur-promo--orange .elementor-icon-box-wrapper::after{ color:rgba(0,33,54,.45); }
.ur-promo--orange:hover .elementor-icon-box-wrapper::after{ color:var(--ur-navy); }

@media (max-width:767.98px){
  .ur-promo .elementor-icon-box-wrapper{ padding:20px !important; }
}


/* ════════════════════════════════════════════════════════════
   BLOC ÉDITORIAL / SEO  (1 seul widget HTML Elementor — autonome)
   2 colonnes : texte (gauche) + panneau navy à arguments (droite).
   Hiérarchie HN : h1 (titre) > h2 (accroche).
════════════════════════════════════════════════════════════ */
.ur-edito{
  display:grid; grid-template-columns:1fr 1fr;
  background:#fff; border:1px solid var(--ur-border); border-radius:12px;
  overflow:hidden; margin:36px 0;
}
.ur-edito__left{ padding:34px 32px; }
.ur-edito__tag{
  display:inline-flex; align-items:center; gap:7px;
  background:var(--ur-orange-l); border:1px solid var(--ur-orange); color:var(--ur-orange-h);
  font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  padding:4px 11px; border-radius:20px; margin-bottom:16px;
}
.ur-edito__h1{
  color:var(--ur-navy); font-size:26px; font-weight:800;
  line-height:1.2; letter-spacing:-.01em; margin:0 0 8px;
}
.ur-edito__h2{
  color:var(--ur-green); font-size:16px; font-weight:600;
  line-height:1.35; margin:0 0 16px;
}
.ur-edito__text{
  color:var(--ur-text2); font-size:14px; line-height:1.8; margin:0 0 22px;
}
.ur-edito__btn{
  display:inline-block; background:var(--ur-orange); color:var(--ur-navy);
  font-size:13.5px; font-weight:700; text-decoration:none;
  padding:12px 26px; border-radius:6px; transition:background .15s;
}
.ur-edito__btn:hover{ background:var(--ur-orange-h); color:var(--ur-navy); }
/* Colonne droite : panneau navy */
.ur-edito__right{
  background:var(--ur-navy); padding:34px 32px;
  display:flex; flex-direction:column; justify-content:center; gap:16px;
  position:relative; overflow:hidden;
}
.ur-edito__right::after{
  content:""; position:absolute; right:-40px; bottom:-50px;
  width:180px; height:180px; border-radius:50%; background:rgba(255,255,255,.03); pointer-events:none;
}
.ur-edito__feat{ display:flex; align-items:center; gap:13px; position:relative; }
.ur-edito__feat-ico{
  width:42px; height:42px; border-radius:8px; flex-shrink:0;
  background:rgba(250,166,51,.15); display:flex; align-items:center; justify-content:center;
  line-height:0;
}
.ur-edito__feat-ico i{
  color:var(--ur-orange); font-size:19px; line-height:1;
  display:flex; align-items:center; justify-content:center; width:100%; height:100%;
}
.ur-edito__feat strong{ display:block; color:#fff; font-size:14px; font-weight:600; line-height:1.3; }
.ur-edito__feat span{ display:block; color:rgba(255,255,255,.55); font-size:12px; line-height:1.3; }

@media (max-width:767.98px){
  .ur-edito{ grid-template-columns:1fr; }
  .ur-edito__left{ padding:26px 22px; }
  .ur-edito__right{ padding:26px 22px; }
  .ur-edito__h1{ font-size:22px; }
}


/* ════════════════════════════════════════════════════════════
   EN-TÊTE DE SECTION  (widget 1 — classe .ur-sechead sur le widget)
   Titre + sous-titre + lien "Toutes les nouveautés"
════════════════════════════════════════════════════════════ */
.ur-sechead{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin:0 0 20px; flex-wrap:wrap; }
.ur-sechead .elementor-heading-title{ color:var(--ur-navy) !important; font-size:18px !important; font-weight:800 !important; margin:0 !important; line-height:1.1; }
.ur-sechead .elementor-widget-text-editor,
.ur-sechead .ur-sechead__sub{ color:var(--ur-muted) !important; font-size:12.5px !important; margin-top:3px; }
.ur-sechead .elementor-button{
  background:var(--ur-bg) !important; color:var(--ur-navy) !important; border:0 !important;
  font-size:12.5px !important; font-weight:600 !important; padding:7px 14px !important; border-radius:6px !important;
}
.ur-sechead .elementor-button:hover{ background:var(--ur-border) !important; }

/* ── En-tête bloc MARQUES : titre à gauche + bouton "Voir toutes les marques" à droite ──
   Pose la classe .ur-brands-head sur la SECTION (ou inner-section) Elementor
   qui contient le Heading et le Button. Marche même avec colonnes imbriquées. */
.ur-brands-head > .elementor-container,
.ur-brands-head .elementor-container{
  display:flex !important; align-items:center !important; justify-content:space-between !important;
  flex-wrap:wrap; gap:14px;
}
/* Titre à gauche */
.ur-brands-head .elementor-heading-title,
.ur-brands-head .elementor-heading-title span{
  color:var(--ur-navy) !important; font-size:20px !important; font-weight:800 !important;
  margin:0 !important; line-height:1.1; text-align:left !important;
}
/* La colonne du titre pousse, celle du bouton reste à droite */
.ur-brands-head .elementor-column:first-child{ flex:1 1 auto; }
.ur-brands-head .elementor-column:last-child{ flex:0 0 auto; text-align:right; }
/* Bouton "Voir toutes les marques" */
.ur-brands-head .elementor-button{
  display:inline-flex !important; align-items:center; gap:7px;
  background:#fff !important; color:var(--ur-navy) !important;
  border:1.5px solid var(--ur-border) !important; border-radius:7px !important;
  font-size:13px !important; font-weight:700 !important; padding:9px 16px !important;
  transition:all .15s;
}
.ur-brands-head .elementor-button:hover{ border-color:var(--ur-navy) !important; background:var(--ur-bg) !important; }


/* ════════════════════════════════════════════════════════════
   PRODUCT MINIATURE — GLOBAL (carrousel home + listing catégorie
   + listing marque + recherche). AUCUNE classe : cible .product-miniature
   partout. Dimensions calées sur la maquette validée :
   image 162px · carte radius 8px bordure 1.5px · gap 14px.
════════════════════════════════════════════════════════════ */

/* — Carte — */
.product-miniature{
  background:#fff; border:1.5px solid var(--ur-border); border-radius:8px;
  overflow:hidden; height:100%;
  display:flex !important; flex-direction:column !important;
  transition:border-color .15s, box-shadow .15s;
}
/* Le thème peut sortir une variante .product-miniature-layout-1 en flex-row
   (image à gauche / infos à droite) : on force la disposition VERTICALE. */
.product-miniature.product-miniature-layout-1,
.product-miniature-grid{ flex-direction:column !important; }
.product-miniature .thumbnail-container{ width:100% !important; }
.product-miniature:hover{ border-color:var(--ur-navy); box-shadow:0 6px 20px rgba(0,33,54,.10); }

/* — Image : hauteur fixe 162px, produit centré, JAMAIS de débordement — */
.product-miniature .thumbnail-container{
  position:relative; background:var(--ur-bg);
  height:200px !important; min-height:200px; max-height:200px;
  flex-shrink:0; overflow:hidden !important;
}
/* Le lien occupe tout le conteneur (indépendant d'un éventuel flex strippé) */
.product-miniature .product-thumbnail{
  display:block !important;
  position:absolute !important; inset:0 !important;
  width:100% !important; height:100% !important;
  padding:10px; overflow:hidden;
}
.product-miniature .product-thumbnail picture{
  display:block; width:100%; height:100%;
}
/* Image centrée par positionnement absolu : ne peut PAS dépasser le conteneur,
   quel que soit l'état des règles flex parentes. */
.product-miniature .product-thumbnail img,
.product-miniature .product-thumbnail-first,
.product-miniature .product-thumbnail-second{
  position:absolute !important; top:50% !important; left:50% !important;
  transform:translate(-50%,-50%) !important;
  max-width:calc(100% - 20px) !important; max-height:180px !important;
  width:auto !important; height:auto !important;
  object-fit:contain !important; mix-blend-mode:multiply;
}
/* Rollover 2e image (même centrage absolu) */
.product-miniature .product-thumbnail-second{
  opacity:0; transition:opacity .2s;
}
.product-miniature:hover .product-thumbnail-second{ opacity:1; }

/* — Flags (valeurs {$flag.type} : new · discount · on-sale · pack · online-only) — */
.product-miniature .product-flags{
  position:absolute; top:8px; left:8px; margin:0; padding:0; z-index:2;
  display:flex; flex-direction:column; gap:4px;
}
.product-miniature .product-flag{
  background:var(--ur-green); color:#fff; font-size:9.5px; font-weight:700;
  letter-spacing:.04em; padding:3px 8px; border-radius:3px; list-style:none; line-height:1.4;
}
.product-miniature .product-flag.new{ background:var(--ur-green); color:#fff; }
.product-miniature .product-flag.discount,
.product-miniature .product-flag.on-sale{ background:var(--ur-orange); color:var(--ur-navy); }
.product-miniature .product-flag.pack,
.product-miniature .product-flag.online-only{ background:var(--ur-navy); color:#fff; }

/* — Boutons fonctionnels (wishlist / quickview) au survol —
   Dans ce thème, .product-functional-buttons est FRÈRE de .thumbnail-container
   (pas dedans). On l'ancre en absolu sur la carte, en haut à droite. */
.product-miniature{ position:relative; }
.product-miniature .product-functional-buttons,
.product-miniature .product-functional-buttons-bottom{
  position:absolute !important; top:10px !important; right:10px !important;
  left:auto !important; bottom:auto !important; width:auto !important;
  margin:0 !important; padding:0 !important; z-index:5;
  opacity:0; transform:translateX(6px); transition:opacity .15s, transform .15s;
}
.product-miniature:hover .product-functional-buttons,
.product-miniature:hover .product-functional-buttons-bottom{ opacity:1; transform:none; }
.product-miniature .product-functional-buttons-links{
  display:flex !important; flex-direction:column; align-items:flex-end; gap:6px; margin:0; padding:0;
}
.product-miniature .product-functional-buttons-links > a{
  width:34px; height:34px; border-radius:50%; flex:none;
  background:#fff; border:1px solid var(--ur-border); color:var(--ur-navy);
  display:flex; align-items:center; justify-content:center; font-size:13px;
  box-shadow:0 2px 8px rgba(0,33,54,.12);
  transition:background .15s, color .15s, border-color .15s;
}
.product-miniature .product-functional-buttons-links > a:hover{ background:var(--ur-navy); color:#fff; border-color:var(--ur-navy); }
.product-miniature .btn-iqitwishlist-add .added{ display:none; }
.product-miniature .btn-iqitwishlist-add.active .added{ display:inline; }
.product-miniature .btn-iqitwishlist-add.active .not-added{ display:none; }

/* — Disponibilité (badge stock) — */
.product-miniature .product-availability{ padding:0 14px; }
.product-miniature .product-availability .badge{
  display:inline-flex !important; align-items:center !important; gap:5px;
  font-size:10.5px !important; font-weight:700 !important; padding:4px 9px !important;
  border-radius:5px !important; margin-top:8px !important; line-height:1 !important;
}
.product-miniature .product-availability .badge i{ font-size:10px !important; line-height:1 !important; margin:0 !important; }
.product-miniature .product-availability .badge-success{ background:#edf7ef !important; color:var(--ur-green) !important; }
.product-miniature .product-availability .badge-warning{ background:var(--ur-orange-l) !important; color:var(--ur-orange-h) !important; }
.product-miniature .product-availability .badge-danger{ background:#fdecec !important; color:#c0392b !important; }
/* Le thème masque le badge "en stock" en grille (.products-grid …product-available{display:none}).
   On le ré-affiche pour avoir un label de dispo systématique. */
.products-grid .product-miniature-default .product-available,
.product-miniature .product-availability .product-available,
.product-miniature .product-availability .badge-success{ display:inline-flex !important; }

/* — Corps — */
.product-miniature .product-description{ padding:12px 14px 14px; flex:1 1 auto; display:flex; flex-direction:column; text-align:left !important; }
.product-miniature .product-category-name{
  font-size:10px !important; font-weight:600; color:var(--ur-green) !important;
  letter-spacing:.05em; text-transform:uppercase; margin-bottom:4px;
}
.product-miniature .product-title{ margin:0 0 4px !important; }
.product-miniature .product-title a{
  font-size:13px !important; font-weight:600 !important; color:var(--ur-text) !important;
  line-height:1.4;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.product-miniature .product-title a:hover{ color:var(--ur-navy) !important; }
.product-miniature .product-brand{ font-size:10.5px !important; color:var(--ur-muted) !important; margin-bottom:2px; }
.product-miniature .product-brand a{ color:var(--ur-muted) !important; }
.product-miniature .product-reference{ font-size:10px !important; color:var(--ur-muted) !important; margin-bottom:10px; }
.product-miniature .product-description-short{ display:none; }

/* — Prix — */
.product-miniature .product-price-and-shipping{ margin:auto 0 10px; }
.product-miniature .product-price{
  font-size:18px !important; font-weight:800 !important; color:var(--ur-navy) !important; line-height:1;
}
.product-miniature .regular-price{
  font-size:12px !important; color:var(--ur-muted) !important; text-decoration:line-through; margin-left:6px;
}

/* — Quantité + Ajouter — */
.product-miniature .input-group-add-cart{ display:flex; gap:6px; align-items:stretch; }
.product-miniature .input-qty{
  width:46px !important; height:38px; flex-shrink:0;
  border:1.5px solid var(--ur-border) !important; border-radius:5px;
  text-align:center; font-size:13px; font-weight:600; color:var(--ur-navy); padding:0;
  -moz-appearance:textfield;
}
.product-miniature .input-qty::-webkit-outer-spin-button,
.product-miniature .input-qty::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.product-miniature .add-to-cart{
  flex:1 1 auto; height:38px;
  background:var(--ur-navy) !important; color:#fff !important; border:0 !important;
  border-radius:5px !important; font-size:12px !important; font-weight:600 !important;
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  transition:background .15s;
}
/* Le thème met les coins gauche à 0 (comportement input-group) : on force les 4 coins
   en longhand + sélecteur plus spécifique pour battre sa règle. */
.product-miniature .input-group-add-cart .add-to-cart,
.product-miniature .input-group-add-cart .btn.add-to-cart{
  border-top-left-radius:5px !important; border-bottom-left-radius:5px !important;
  border-top-right-radius:5px !important; border-bottom-right-radius:5px !important;
}
.product-miniature .input-group-add-cart .input-qty{
  border-top-right-radius:5px !important; border-bottom-right-radius:5px !important;
}
.product-miniature .add-to-cart:hover{ background:var(--ur-navy-h) !important; }
.product-miniature .add-to-cart .spinner-icon{ display:none; }
.product-miniature .btn-product-list{
  display:inline-flex; align-items:center; justify-content:center; gap:6px; width:100%; height:38px;
  background:var(--ur-navy) !important; color:#fff !important; border:0 !important;
  border-radius:5px !important; font-size:12px !important; font-weight:600 !important;
}

/* ── ÉCARTS ENTRE CARTES ──
   Carrousel Swiper (home/marque) : marge sur les slides. */
.elementor-products-carousel .swiper-slide{ height:auto; padding:0 7px; box-sizing:border-box; }
.swiper-products-carousel{ margin:0 -7px; }
/* Listing en grille (catégorie/marque/recherche) : gap colonnes/lignes */
.products.product_list,
.products.products-grid:not(.swiper){ gap:14px; }
#js-product-list .products .product,
.products:not(.swiper) .js-product{ margin-bottom:0; }

/* Blocs produits de la FICHE PRODUIT (autres produits, accessoires, cross-selling)
   en colonnes Bootstrap (col-*) → on ajoute l'écart via padding des wrappers
   (même principe que les slides Swiper), sans casser les largeurs de colonnes. */
.featured-products .products,
.product-accessories .products,
.crossselling-products .products,
.productscategory .products,
.products.wk-sale{ margin-left:-7px !important; margin-right:-7px !important; }
.featured-products .js-product-miniature-wrapper,
.product-accessories .js-product-miniature-wrapper,
.crossselling-products .js-product-miniature-wrapper,
.productscategory .js-product-miniature-wrapper,
.products.wk-sale .js-product-miniature-wrapper{ padding:0 7px !important; margin-bottom:14px; }

/* Flèches du carrousel Swiper — icône centrée DANS le rond */
.elementor-swiper-button{
  display:flex !important; align-items:center !important; justify-content:center !important;
  background:#fff; border:1px solid var(--ur-border); color:var(--ur-navy);
  width:40px; height:40px; border-radius:50%; box-shadow:0 2px 10px rgba(0,33,54,.10);
  overflow:hidden; transition:background .15s, color .15s, border-color .15s;
}
/* L'icône/chevron Elementor : taille contrainte et centrée */
.elementor-swiper-button i,
.elementor-swiper-button svg,
.elementor-swiper-button::before,
.elementor-swiper-button::after{
  font-size:15px !important; line-height:1 !important; width:auto !important; height:auto !important;
  margin:0 !important; position:static !important;
  display:flex; align-items:center; justify-content:center;
}
.elementor-swiper-button svg{ width:14px !important; height:14px !important; }
.elementor-swiper-button:hover{ background:var(--ur-navy); color:#fff; border-color:var(--ur-navy); }
.elementor-swiper-button.swiper-button-disabled{ opacity:.35; }
/* Swiper verrouille les flèches quand tout tient sans défiler → on les masque vraiment
   (sinon mon display:flex !important les forçait à s'afficher sur les cards) */
.elementor-swiper-button.swiper-button-lock{ display:none !important; }
/* Cas où Elementor pose la flèche en background-image (SVG) plutôt qu'en glyphe */
.elementor-swiper-button-next,
.elementor-swiper-button-prev{
  background-size:14px 14px !important; background-position:center !important; background-repeat:no-repeat !important;
}

@media (max-width:767.98px){
  .product-miniature .thumbnail-container{ height:140px; }
  .product-miniature .product-title a{ font-size:12.5px !important; }
  .product-miniature .product-price{ font-size:16px !important; }
}


/* ════════════════════════════════════════════════════════════
   EN-TÊTE DE SECTION  (widget HTML — coller le markup .ur-sechead)
     <div class="ur-sechead">
       <div class="ur-sechead__left">
         <h2 class="ur-sechead__title">Nouveautés</h2>
         <span class="ur-sechead__badge">Arrivages récents</span>
       </div>
       <a href="#" class="ur-sechead__link">Toutes les nouveautés <i class="fa fa-arrow-right"></i></a>
     </div>
════════════════════════════════════════════════════════════ */
.ur-sechead{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; margin:0 0 20px; flex-wrap:wrap;
}
.ur-sechead__left{ display:flex; align-items:center; gap:12px; min-width:0; flex-wrap:wrap; }
.ur-sechead__title{
  color:var(--ur-navy) !important; font-size:18px !important; font-weight:800 !important;
  letter-spacing:-.01em; line-height:1.1 !important; margin:0 !important;
}
/* Sous-titre en badge orange pill */
.ur-sechead__badge{
  display:inline-flex; align-items:center;
  background:var(--ur-orange-l); color:var(--ur-orange-h) !important;
  border:0;
  font-size:11px !important; font-weight:600; letter-spacing:0;
  padding:3px 10px; border-radius:6px; line-height:1.4; white-space:nowrap;
  text-transform:none;
}
/* Lien en bouton à droite */
.ur-sechead__link{
  flex-shrink:0;
  display:inline-flex; align-items:center; gap:7px;
  background:var(--ur-navy) !important; color:#fff !important;
  font-size:12.5px !important; font-weight:600 !important; text-decoration:none !important;
  padding:9px 18px; border-radius:6px; transition:background .15s;
}
.ur-sechead__link:hover{ background:var(--ur-navy-h) !important; }
.ur-sechead__link .fa{ font-size:11px; }


/* ════════════════════════════════════════════════════════════
   BLOC ÉDITORIAL — VARIANTE PHOTO  (.ur-edito--photo)
   Réutilise le composant .ur-edito. Photo à gauche, contenu à droite.
   Variante de fond droite : .ur-edito__right--green (ou navy par défaut).
   1 widget HTML :
     <div class="ur-edito ur-edito--photo">
       <div class="ur-edito__photo"><img src="..." alt="..."></div>
       <div class="ur-edito__right ur-edito__right--green">
         <h2 class="ur-edito__h1">…</h2>
         <p class="ur-edito__text">Chez <strong>UNIVERSRESTAU</strong>…</p>
         <a href="#" class="ur-edito__btn">En savoir +</a>
       </div>
     </div>
════════════════════════════════════════════════════════════ */
.ur-edito--photo{ grid-template-columns:42% 58%; border:0; }
.ur-edito__photo{ position:relative; min-height:300px; background:var(--ur-navy-dark); }
.ur-edito__photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
/* La colonne droite réutilise .ur-edito__right ; variante verte : */
.ur-edito__right--green{ background:var(--ur-green); }
/* Dans la variante photo, le titre h1 passe en blanc (sur fond coloré) */
.ur-edito--photo .ur-edito__h1{ color:#fff; font-size:25px; }
.ur-edito--photo .ur-edito__text{ color:rgba(255,255,255,.85); }
.ur-edito--photo .ur-edito__text strong{ color:var(--ur-orange); font-weight:700; }
.ur-edito--photo .ur-edito__btn{ align-self:flex-start; }

@media (max-width:767.98px){
  .ur-edito--photo{ grid-template-columns:1fr; }
  .ur-edito__photo{ min-height:200px; }
  .ur-edito--photo .ur-edito__h1{ font-size:21px; }
}


/* ════════════════════════════════════════════════════════════
   NOS UNIVERS PRODUITS — 8 BLOCS CATÉGORIE  (widget Icon Box × 8)
   En-tête = composant .ur-sechead (déjà fait, voir plus haut).
   Cartes = Icon Box, classe .ur-cat sur chaque widget.
   Format maquette : carte blanche, icône en haut, nom catégorie (SANS nb réf).
   Saisie client : champ TITRE = nom catégorie · Icône + Lien via l'UI.
   Disposition : section à 8 colonnes (ou 4×2) dans Elementor.
════════════════════════════════════════════════════════════ */
.ur-cat .elementor-icon-box-wrapper{
  background:#fff !important;
  border:1.5px solid var(--ur-border);
  border-radius:8px;
  padding:18px 12px !important;
  height:100%;
  display:flex !important; flex-direction:column !important; align-items:center !important;
  text-align:center !important;
  transition:border-color .15s, box-shadow .15s, transform .15s;
}
.ur-cat:hover .elementor-icon-box-wrapper{
  border-color:var(--ur-navy); box-shadow:0 6px 20px rgba(0,33,54,.10); transform:translateY(-2px);
}
/* Icône */
.ur-cat .elementor-icon-box-icon{ margin:0 0 10px !important; }
.ur-cat .elementor-icon-box-icon .elementor-icon{
  width:52px !important; height:52px !important;
  background:var(--ur-bg) !important; border:0 !important; border-radius:50% !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  transition:background .15s;
}
.ur-cat:hover .elementor-icon-box-icon .elementor-icon{ background:var(--ur-orange-l) !important; }
.ur-cat .elementor-icon-box-icon i{ color:var(--ur-navy) !important; font-size:22px !important; transition:color .15s; }
.ur-cat:hover .elementor-icon-box-icon i{ color:var(--ur-orange-h) !important; }
/* Nom catégorie (champ Titre) */
.ur-cat .elementor-icon-box-title{
  color:var(--ur-text) !important; font-size:12.5px !important; font-weight:600 !important;
  line-height:1.3 !important; margin:0 !important;
}
.ur-cat:hover .elementor-icon-box-title{ color:var(--ur-navy) !important; }
.ur-cat .elementor-icon-box-title a{ color:inherit !important; }
/* Pas de description (format sans nb réf) — masquée si présente */
.ur-cat .elementor-icon-box-description{ display:none !important; }


/* ════════════════════════════════════════════════════════════
   FICHE PRODUIT  (product.tpl — DOM réel Warehouse/PS9)
   Aucune classe à ajouter : cible le markup natif.
   Layout : .product-info-row > .col-product-image + .col-product-info
   Dimensions calées sur la maquette (image ~390px, prix navy 36px,
   qty 42px, bouton orange 50px, onglet actif souligné orange).
════════════════════════════════════════════════════════════ */

/* — Fil d'ariane : séparé du contenu par une bordure horizontale basse,
   en PLEINE LARGEUR (le nav.breadcrumb est full-width, le .container-fluid
   à l'intérieur garde son padding mais ne limite pas la bordure). — */
nav.breadcrumb{ border-bottom:1px solid var(--ur-border); margin-bottom:0; padding:12px 0; font-size:12px; }
.breadcrumb{ border-radius:0; }
#wrapper .breadcrumb ol{ margin:0; padding:0; }
#wrapper .breadcrumb li{ display:inline; color:var(--ur-muted); }
#wrapper .breadcrumb li a span{ color:var(--ur-text2); }
#wrapper .breadcrumb li a:hover span{ color:var(--ur-navy); }
#wrapper .breadcrumb li::after{ content:"›"; margin:0 8px; color:var(--ur-border); }
#wrapper .breadcrumb li:last-child::after{ content:""; }

/* — Conteneur produit : PAS de cadre (cf. maquette).
   La seule séparation est la bordure verticale entre les 2 colonnes,
   portée par .col-product-image (border-right) ci-dessous. — */
#main-product-wrapper{
  background:transparent; border:0; border-radius:0;
  overflow:visible; padding:0;
}
.product-info-row{ margin:0; }

/* ── GALERIE (gauche) ── */
.col-product-image{ padding:24px 24px 24px 28px; border-right:1px solid var(--ur-border); }
.product-images-large{
  background:var(--ur-bg); border:1.5px solid var(--ur-border); border-radius:8px;
  overflow:hidden; margin-bottom:12px;
}
.product-lmage-large{ display:flex; align-items:center; justify-content:center; height:390px; }
.product-lmage-large picture,
.product-lmage-large img{ max-height:370px !important; width:auto !important; height:auto !important; max-width:100%; object-fit:contain; mix-blend-mode:multiply; }
.product-lmage-large .expander{
  position:absolute; top:12px; right:12px; z-index:3;
  width:36px; height:36px; border-radius:50%; background:#fff; border:1px solid var(--ur-border);
  display:flex; align-items:center; justify-content:center; color:var(--ur-navy);
}
.product-cover .product-flags{ position:absolute; top:12px; left:12px; z-index:3; margin:0; padding:0; }
.product-cover .product-flag{ background:var(--ur-orange); color:var(--ur-navy); font-size:11px; font-weight:700; padding:4px 11px; border-radius:4px; list-style:none; }
/* Miniatures */
#product-images-thumbs .thumb{
  border:2px solid var(--ur-border); border-radius:6px; cursor:pointer; transition:border-color .15s;
  background:var(--ur-bg);
}
#product-images-thumbs .thumb.selected,
#product-images-thumbs .thumb:hover{ border-color:var(--ur-navy); }
/* Flèches de navigation images produit — cercle blanc + chevron SVG (déterministe) */
.product-images-large .swiper-button-arrow,
#product-images-thumbs .swiper-button-arrow{
  width:40px; height:40px; margin-top:-20px; border-radius:50%;
  border:1px solid var(--ur-border); box-shadow:0 4px 14px rgba(0,33,54,.14);
  background-color:#fff !important; background-repeat:no-repeat !important;
  background-position:center !important; background-size:14px !important;
  outline:none !important; transition:background-color .15s, border-color .15s; z-index:6;
}
/* on supprime totalement le glyphe natif (pseudo-éléments) → plus de doublon */
.product-images-large .swiper-button-arrow::after,
.product-images-large .swiper-button-arrow::before,
#product-images-thumbs .swiper-button-arrow::after,
#product-images-thumbs .swiper-button-arrow::before{ content:none !important; display:none !important; }
/* chevrons SVG */
.product-images-large .swiper-button-next,
#product-images-thumbs .swiper-button-next{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23002136' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") !important; }
.product-images-large .swiper-button-prev,
#product-images-thumbs .swiper-button-prev{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23002136' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 6l-6 6 6 6'/%3E%3C/svg%3E") !important; }
/* survol : navy + chevron blanc */
.product-images-large .swiper-button-arrow:hover,
#product-images-thumbs .swiper-button-arrow:hover{ background-color:var(--ur-navy) !important; border-color:var(--ur-navy); }
.product-images-large .swiper-button-next:hover,
#product-images-thumbs .swiper-button-next:hover{ 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='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") !important; }
.product-images-large .swiper-button-prev:hover,
#product-images-thumbs .swiper-button-prev:hover{ 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='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 6l-6 6 6 6'/%3E%3C/svg%3E") !important; }
.product-images-large .swiper-button-disabled,
#product-images-thumbs .swiper-button-disabled{ opacity:.35; pointer-events:none; }
/* vignettes : boutons un peu plus petits */
#product-images-thumbs .swiper-button-arrow{ width:32px; height:32px; margin-top:-16px; background-size:12px !important; }

/* ── INFOS PRODUIT (droite) ── */
.col-product-info{ padding:24px 28px 24px 24px; }
/* Marque */
.product-manufacturer{ margin-bottom:8px; }
.product-manufacturer img.manufacturer-logo{ max-height:38px; width:auto; }
/* Titre */
h1.page-title, .page-title{
  font-size:21px !important; font-weight:800 !important; color:var(--ur-navy) !important;
  line-height:1.3; letter-spacing:-.01em; margin-bottom:12px;
}
/* Prix — le thème pose des style="color:#d25111" INLINE sur les spans :
   on force HT et TTC en navy via !important sur les spans internes.
   Maquette : libellé "Prix unitaire HT", HT 34px navy + sub HT, TTC dessous discret. */
.product-prices{ margin:14px 0; }
.product-prices .current-price{ display:block; }
/* Écrase les couleurs inline (#d25111 sur HT, #232323 sur TTC) */
.col-product-info .product-prices .current-price span[style],
.col-product-info .product-prices .current-price-value span[style]{ color:var(--ur-navy) !important; }
/* 1re ligne (HT) = grande, navy */
.col-product-info .product-prices .current-price .mb-1:first-child{ display:flex; align-items:baseline; gap:6px; }
.col-product-info .product-prices .current-price .mb-1:first-child span{
  font-size:32px !important; font-weight:800 !important; color:var(--ur-navy) !important;
  letter-spacing:-.02em; line-height:1.05;
}
.col-product-info .product-prices .current-price .mb-1:first-child span:last-child{
  font-size:14px !important; font-weight:600 !important; color:var(--ur-muted) !important;
}
/* 2e ligne (TTC) = plus petite, discrète */
.col-product-info .product-prices .current-price .mb-1:last-child{ display:flex; align-items:baseline; gap:6px; }
.col-product-info .product-prices .current-price .mb-1:last-child span{
  font-size:15px !important; font-weight:600 !important; color:var(--ur-text2) !important;
}
.product-prices .current-price-value,
.product-prices .product-price{
  font-size:32px !important; font-weight:800 !important; color:var(--ur-navy) !important; line-height:1.1;
}
.product-prices .regular-price{ font-size:15px; color:var(--ur-muted); text-decoration:line-through; }
.product-prices .tax-shipping-delivery-label{ font-size:12px; color:var(--ur-muted); margin-top:6px; }

/* ── Marque native du thème : on masque tout (logo image + bloc) ──
   La marque est désormais rendue en texte via .ur-pdp-brand dans le header. */
.product-manufacturer{ display:none !important; }
.product-manufacturer img.manufacturer-logo{ display:none !important; }

/* ════════════════════════════════════════════════════════════════
   EN-TÊTE FICHE PRODUIT — calé sur la maquette v4_1
   Ordre : [marque + badge stock] → titre → réf·EAN → étoiles → prix
   ════════════════════════════════════════════════════════════════ */

/* 1) Ligne marque (texte cliquable, vert) + badge stock, même ligne */
.ur-pdp-brandrow{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px;
}
.ur-pdp-brand{
  font-size:11px; font-weight:700; color:var(--ur-green) !important;
  letter-spacing:.1em; text-transform:uppercase; text-decoration:none;
}
.ur-pdp-brand:hover{ text-decoration:underline; }
.ur-pdp-stock{
  display:inline-flex; align-items:center; gap:5px;
  font-size:11px; font-weight:600; padding:3px 9px; border-radius:4px;
}
.ur-pdp-stock--ok{ background:#edf7ef; color:#2E7D4F; }
.ur-pdp-stock--soon{ background:var(--ur-orange-l); color:var(--ur-orange-h); }
.ur-pdp-stock--ko{ background:var(--ur-bg2); color:var(--ur-text2); }

/* 2) Ligne réf · EAN · (Fiche PDF) — sous le titre */
.ur-pdp-refline{
  font-size:12px; color:var(--ur-muted); margin:8px 0 12px;
}
.ur-pdp-refline strong{ color:var(--ur-text2); font-weight:700; }
.ur-pdp-refline a{ color:var(--ur-navy); text-decoration:underline; }

/* Description courte */
.product-information .product-description{ font-size:13.5px; color:var(--ur-text2); line-height:1.7; margin-bottom:18px; }

/* ── QUANTITÉ + ACTIONS ── */
.product-quantity{ align-items:center; }
.product-quantity .qty .bootstrap-touchspin{
  border:1.5px solid var(--ur-border); border-radius:5px; overflow:hidden; height:42px; width:auto;
  display:inline-flex; box-shadow:none;
}
.product-quantity #quantity_wanted{
  width:54px !important; height:42px; border:0 !important; text-align:center;
  font-size:15px; font-weight:700; color:var(--ur-navy); box-shadow:none;
}
.product-quantity .input-group-btn-vertical{ display:flex; flex-direction:column; border-left:1.5px solid var(--ur-border); }
.product-quantity .btn-touchspin{
  width:34px; flex:1; background:var(--ur-bg); border:0; color:var(--ur-text2);
  display:flex; align-items:center; justify-content:center; padding:0; transition:background .15s;
}
.product-quantity .btn-touchspin:hover{ background:var(--ur-bg2); }
.product-quantity .bootstrap-touchspin-down{ border-top:1.5px solid var(--ur-border); }
/* Ligne qty + bouton : le bouton prend tout l'espace restant */
.product-add-to-cart .product-quantity{ align-items:stretch; }
/* basis:0 + min-width:0 → le bouton rétrécit au lieu de passer à la ligne */
.product-quantity .col-add-btn{ flex:1 1 0 !important; min-width:0 !important; max-width:none !important; }
.product-quantity .col-add-btn .add{ height:100%; }
/* Mobile : garder qté + bouton côte à côte (le thème les passe en col-12) */
.product-quantity .col-add-qty{ flex:0 0 auto !important; width:auto !important; max-width:none !important; }
/* Mobile — le thème empile qté/bouton (col-12 / direction column) : on force la même ligne */
@media (max-width:767.98px){
  .js-product-add-to-cart .product-quantity{
    display:flex !important; flex-direction:row !important; flex-wrap:wrap !important; align-items:stretch !important;
  }
  .js-product-add-to-cart .product-quantity .col-add-qty{
    flex:0 0 auto !important; width:auto !important; max-width:none !important;
  }
  .js-product-add-to-cart .product-quantity .col-add-btn{
    flex:1 1 0 !important; min-width:0 !important; width:auto !important; max-width:none !important;
  }
  .js-product-add-to-cart .product-quantity .col-add-btn .add,
  .js-product-add-to-cart .product-quantity .col-add-btn .add-to-cart{ width:100% !important; }
  .js-product-add-to-cart .product-quantity .col-add-wishlist{
    flex:0 0 100% !important; width:100% !important; max-width:100% !important;
  }
}
/* Bouton Ajouter au panier — orange, pleine largeur de sa colonne */
.col-product-info .add-to-cart.btn-primary{
  width:100%;
  background:var(--ur-orange) !important; border-color:var(--ur-orange) !important; color:var(--ur-navy) !important;
  height:50px; border-radius:5px; font-size:15px !important; font-weight:800 !important;
  display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:0 24px;
}
.col-product-info .add-to-cart.btn-primary:hover{ background:var(--ur-orange-h) !important; border-color:var(--ur-orange-h) !important; }
.col-product-info .add-to-cart .spinner-icon{ display:none; }
/* Wishlist / Compare — boutons carrés bordés */
.col-product-info .btn-iqitwishlist-add,
.col-product-info .btn-iqitcompare-add{
  width:50px; height:50px; background:#fff !important; border:1.5px solid var(--ur-border) !important;
  color:var(--ur-navy) !important; border-radius:5px; display:inline-flex; align-items:center; justify-content:center;
  transition:border-color .15s, background .15s;
}
.col-product-info .btn-iqitwishlist-add:hover,
.col-product-info .btn-iqitcompare-add:hover{ border-color:var(--ur-navy) !important; background:var(--ur-bg) !important; }
.col-product-info .btn-iqitwishlist-add .added,
.col-product-info .btn-iqitcompare-add .added{ display:none; }
.col-product-info .btn-iqitwishlist-add.active .added{ display:inline; }
.col-product-info .btn-iqitwishlist-add.active .not-added{ display:none; }

/* ── 2e LIGNE pleine largeur "Ajouter à ma liste d'achat" (maquette) ──
   Le wishlist du thème est un carré ; pour la 2e ligne pleine largeur,
   on passe la colonne wishlist en pleine largeur sous le bouton panier
   et on lui ajoute un libellé via ::after. */
.product-quantity .col-add-wishlist{ flex:0 0 100% !important; max-width:100% !important; margin-top:10px; }
.product-quantity .col-add-wishlist .btn-iqitwishlist-add{
  width:100% !important; height:42px; gap:8px; font-size:13px; font-weight:600;
}
.product-quantity .col-add-wishlist .btn-iqitwishlist-add::after{
  content:"Ajouter à ma liste d'achat"; font-size:13px; font-weight:600;
}
/* Compare reste en petit carré sur sa propre ligne, à droite */
.product-quantity .col-add-compare{ flex:0 0 auto !important; margin-top:10px; }
/* Partage social */
.product-additional-info .social-sharing ul{ display:flex; gap:8px; margin:16px 0 0; padding:0; list-style:none; }
.product-additional-info .social-sharing li a{
  width:34px; height:34px; border-radius:50%; background:var(--ur-bg); color:var(--ur-text2);
  display:flex; align-items:center; justify-content:center; font-size:14px; transition:background .15s, color .15s;
}
.product-additional-info .social-sharing li a:hover{ background:var(--ur-navy); color:#fff; }

/* ── ONGLETS (Description / Détails / Reviews) ── */
.product-tabs{ border-top:1px solid var(--ur-border); margin-top:0; }
.product-tabs .nav-tabs{ border-bottom:2px solid var(--ur-border); padding:0 28px; gap:0; }
.product-tabs .nav-tabs .nav-item{ margin-bottom:-2px; }
.product-tabs .nav-tabs .nav-link{
  padding:14px 20px; font-size:13.5px; font-weight:500; color:var(--ur-muted);
  border:0; border-bottom:3px solid transparent; background:transparent; transition:color .15s, border-color .15s;
}
.product-tabs .nav-tabs .nav-link:hover{ color:var(--ur-navy); }
.product-tabs .nav-tabs .nav-link.active{ color:var(--ur-navy); border-bottom-color:var(--ur-orange); font-weight:700; background:transparent; }
.product-tabs .tab-content{ padding:24px 28px; }
.product-tabs .tab-content .rte-content{ font-size:13.5px; color:var(--ur-text2); line-height:1.8; }

/* ── TABLEAU CARACTÉRISTIQUES (.data-sheet) — fiche technique épurée ──
   Intitulé gris discret à gauche · valeur navy à droite · simples filets.
   Aucun accent coloré (rendu "fiche technique" sobre). */
.product-features{ margin:0 0 20px; }
.product-features .data-sheet{
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr));
  column-gap:52px; row-gap:0; margin:0; padding:0;
}
.product-features .data-sheet dt,
.product-features .data-sheet dd{
  margin:0; padding:12px 2px; font-size:13px; line-height:1.45;
  border-bottom:1px solid var(--ur-border);
  display:flex; align-items:center; min-width:0;
}
.product-features .data-sheet dt.name{ color:var(--ur-muted); font-weight:500; }
.product-features .data-sheet dd.value{
  color:var(--ur-navy); font-weight:600; justify-content:flex-end; text-align:right;
}
/* survol de ligne : léger fond pour le repérage (subtil, pas d'accent) */
.product-features .data-sheet dt.name:hover,
.product-features .data-sheet dt.name:hover + dd.value{ background:var(--ur-bg); }
@media (max-width:767.98px){
  .product-features .data-sheet{ grid-template-columns:1fr; }
  .product-features .data-sheet dt.name{ border-bottom:0; padding-bottom:1px; color:var(--ur-muted); }
  .product-features .data-sheet dd.value{ justify-content:flex-start; text-align:left; padding-top:1px; }
}
/* Référence / EAN / Date de dispo sous les caractéristiques — chips assortis aux tuiles */
#product-details .specific-references{ display:contents; }
#product-details .product-reference,
#product-details .specific-references > div,
#product-details .product-quantities,
#product-details .product-condition,
#product-details .product-availability-date{
  display:inline-flex !important; width:auto !important; max-width:max-content;
  align-items:center; justify-content:flex-start !important; gap:8px; float:none !important;
  background:#F8F9FB; border:1px solid #eef0f3; border-radius:8px;
  padding:8px 16px !important; margin:14px 10px 0 0 !important; font-size:13px; vertical-align:top;
}
/* reset d'un éventuel décalage interne du label/valeur (thème) */
#product-details .product-reference .label,
#product-details .product-reference span,
#product-details .specific-references > div .label,
#product-details .specific-references > div span,
#product-details .product-quantities .label,
#product-details .product-quantities span,
#product-details .product-condition .label,
#product-details .product-condition span,
#product-details .product-availability-date label,
#product-details .product-availability-date span{
  margin-left:0 !important; padding-left:0 !important; float:none !important;
}
/* stock (quantité) en pastille verte */
#product-details .product-quantities{ background:#edf7ef !important; border-color:transparent !important; }
#product-details .product-quantities .label,
#product-details .product-quantities span{ color:var(--ur-green) !important; font-weight:700; }
#product-details .product-reference .label,
#product-details .specific-references > div .label,
#product-details .product-availability-date label{
  margin:0; padding:0; font-size:10.5px; font-weight:600; letter-spacing:.04em;
  text-transform:uppercase; color:var(--ur-muted);
}
#product-details .product-reference span,
#product-details .specific-references > div span,
#product-details .product-availability-date span{
  font-weight:700; color:var(--ur-navy);
}
/* la date de dispo (réappro) en accent orange */
#product-details .product-availability-date{ background:var(--ur-orange-l); border-color:transparent; }
#product-details .product-availability-date label,
#product-details .product-availability-date span{ color:var(--ur-orange-h); }

/* ── INFO STOCK près du prix (fiche produit) — .ur-pdp-stockinfo ── */
.ur-pdp-stockinfo{ margin:8px 0 2px; font-size:13.5px; font-weight:600; }
.ur-pdp-stockinfo i{ margin-right:5px; }
.ur-pdp-stockinfo__ok{
  display:inline-flex; align-items:center; gap:6px;
  background:#edf7ef; color:var(--ur-green);
  padding:6px 12px; border-radius:6px; font-weight:600;
}
.ur-pdp-stockinfo__ok strong{ color:var(--ur-green); }
.ur-pdp-stockinfo__soon{
  display:inline-flex; align-items:center; gap:6px;
  background:var(--ur-orange-l); color:var(--ur-orange-h);
  padding:6px 12px; border-radius:6px; font-weight:600;
}
.ur-pdp-stockinfo__ko{
  display:inline-flex; align-items:center; gap:6px;
  background:#fdecec; color:#c0392b;
  padding:6px 12px; border-radius:6px; font-weight:600;
}
/* Sur commande (commandes hors stock autorisées) — remplace la rupture */
.ur-pdp-stockinfo__order{
  display:inline-flex; align-items:center; gap:6px;
  background:var(--ur-green-l); color:var(--ur-green);
  padding:6px 12px; border-radius:6px; font-weight:600;
}

/* Produits liés — titre de section (les miniatures sont déjà stylées globalement) */
.category-products .section-title{ font-size:18px; font-weight:800; color:var(--ur-navy); margin:32px 0 18px; }

/* ── APERÇU RAPIDE (quickview iqit) — espacement + habillage charte ──
   Corrige : image collée au popin + reprise du style produit du site. */
#quickview-modal-product-content{ padding:24px 28px; }
#quickview-modal-product-content > .col-md-6:first-of-type{ padding-right:22px; }
#quickview-modal-product-content > .col-md-6.align-self-center{ padding-left:22px; }
#quickview-modal-product-content .images-container{ padding:0; }
#quickview-modal-product-content .product-images-large{
  background:var(--ur-bg); border:1px solid var(--ur-border); border-radius:10px; overflow:hidden;
}
#quickview-modal-product-content .product-lmage-large{ display:flex; align-items:center; justify-content:center; padding:14px; }
#quickview-modal-product-content .product-lmage-large img{ mix-blend-mode:multiply; max-height:360px; width:auto; }
#quickview-modal-product-content .js-qv-mask{ margin-top:10px; }
#quickview-modal-product-content #product-images-thumbs .thumb{
  border:2px solid var(--ur-border); border-radius:6px; background:var(--ur-bg); cursor:pointer;
}
#quickview-modal-product-content #product-images-thumbs .thumb.selected,
#quickview-modal-product-content #product-images-thumbs .thumb:hover{ border-color:var(--ur-navy); }
#quickview-modal-product-content .page-title,
#quickview-modal-product-content .page-title a{
  font-size:20px; font-weight:800; color:var(--ur-navy); line-height:1.22;
}
#quickview-modal-product-content .product-prices{ margin:8px 0 12px; }
#quickview-modal-product-content .product-description-short{
  color:var(--ur-text2); font-size:13.5px; line-height:1.6; margin:10px 0 4px;
}
#quickview-modal-product-content .add-to-cart{
  background:var(--ur-orange) !important; border-color:var(--ur-orange) !important;
  color:var(--ur-navy) !important; font-weight:700; height:50px; border-radius:7px;
}
#quickview-modal-product-content .add-to-cart:hover{ background:var(--ur-orange-h) !important; border-color:var(--ur-orange-h) !important; }
#quickview-modal-product-content .btn-iqitwishlist-add{
  border:1.5px solid var(--ur-border) !important; color:var(--ur-navy) !important; border-radius:7px; background:#fff !important;
}
#quickview-modal-product-content .input-group.bootstrap-touchspin .form-control{ border:1.5px solid var(--ur-border) !important; border-radius:5px; }
/* flèches précédent/suivant du quickview */
.js-quickview-np-btn{ color:var(--ur-navy); }

/* ── MODALE "Produit ajouté au panier" — habillage charte (ciblée via .cart-content) ── */
.modal-content:has(.cart-content){ border:0 !important; border-radius:12px; overflow:hidden; }
.modal-content:has(.cart-content) .modal-header{ background:var(--ur-navy); border:0; padding:15px 20px; }
.modal-content:has(.cart-content) .modal-title{ color:#fff !important; font-weight:700; font-size:15px; display:flex; align-items:center; gap:8px; margin:0; }
.modal-content:has(.cart-content) .modal-title i{ color:var(--ur-orange); }
.modal-content:has(.cart-content) .modal-header .close{ color:#fff !important; opacity:.85; text-shadow:none; font-size:24px; }
.modal-content:has(.cart-content) .modal-header .close:hover{ opacity:1; }
.modal-content:has(.cart-content) .modal-body{ padding:22px; }
.modal-content:has(.cart-content) .divide-right{ border-right:1px solid var(--ur-border); }
.modal-content:has(.cart-content) .product-image{ max-width:100%; height:auto; border:1px solid var(--ur-border); border-radius:8px; background:var(--ur-bg); }
.modal-content:has(.cart-content) .product-name{ color:var(--ur-navy) !important; font-weight:700; font-size:14px; line-height:1.3; }
.cart-content .cart-products-count{ color:var(--ur-green); font-weight:700; margin-bottom:10px; }
.cart-content p{ font-size:13.5px; color:var(--ur-text2); margin-bottom:6px; }
.cart-content p strong{ color:var(--ur-navy); }
.cart-content-btn{ display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; }
.cart-content-btn .btn-primary{ background:var(--ur-orange) !important; border-color:var(--ur-orange) !important; color:var(--ur-navy) !important; font-weight:700; }
.cart-content-btn .btn-primary:hover{ background:var(--ur-orange-h) !important; border-color:var(--ur-orange-h) !important; }
.cart-content-btn .btn-secondary{ background:#fff !important; border:1.5px solid var(--ur-border) !important; color:var(--ur-navy) !important; font-weight:600; }
.cart-content-btn .btn-secondary:hover{ background:var(--ur-bg) !important; }

/* ── CHECKOUT — choix du transporteur (.delivery-options) ── */
.delivery-options-list .delivery-option{
  align-items:center; margin:0 0 10px;
  border:1px solid var(--ur-border); border-radius:10px; padding:14px 16px;
  transition:border-color .15s, box-shadow .15s, background .15s;
}
.delivery-options-list .delivery-option:hover{ border-color:var(--ur-navy); }
.delivery-options-list .delivery-option:has(input:checked){
  border-color:var(--ur-orange); background:var(--ur-orange-l);
  box-shadow:0 0 0 1px var(--ur-orange) inset;
}
.delivery-options-list .carrier-hasLogo img{ max-width:100%; height:auto; border-radius:6px; }
.delivery-options-list .carrier-name{ font-weight:700; color:var(--ur-navy) !important; font-size:14px; }
.delivery-options-list .carrier-delay{ color:var(--ur-text2); font-size:13px; }
.delivery-options-list .carrier-price{ font-weight:800; color:var(--ur-navy); font-size:16px; white-space:nowrap; }
/* radio custom PS */
.delivery-options-list .custom-radio{ width:20px; height:20px; border:2px solid var(--ur-border); }
.delivery-options-list .delivery-option:has(input:checked) .custom-radio{ border-color:var(--ur-orange); }
.delivery-options-list .custom-radio input:checked + span{ background:var(--ur-orange); }
/* zone message + bouton continuer */
.delivery-options-list #delivery label{ font-size:12.5px; color:var(--ur-text2); }
.delivery-options-list #delivery textarea{ border:1.5px solid var(--ur-border); border-radius:6px; }
/* Bouton "Continuer" du checkout (toutes étapes, pas seulement la livraison) */
.continue.btn-primary,
button[name="controller"][value="order"].btn-primary,
button[name="confirmDeliveryOption"].btn-primary{
  background:var(--ur-orange) !important; border-color:var(--ur-orange) !important;
  color:var(--ur-navy) !important; font-weight:700; border-radius:8px;
}
.continue.btn-primary:hover,
button[name="controller"][value="order"].btn-primary:hover,
button[name="confirmDeliveryOption"].btn-primary:hover{ background:var(--ur-orange-h) !important; border-color:var(--ur-orange-h) !important; }

@media (max-width:767.98px){
  .col-product-image{ border-right:0; border-bottom:1px solid var(--ur-border); padding:18px; }
  .col-product-info{ padding:18px; }
  .product-lmage-large{ height:300px; }
  .product-prices .current-price-value, .product-prices .product-price{ font-size:30px !important; }
  h1.page-title{ font-size:18px !important; }
}


/* ════════════════════════════════════════════════════════════
   FOOTER BAS  (widget HTML — barre paiements + copyright)
   Classes custom .ur-foot* — fond navy foncé, autonome.
   2 lignes : (1) paiements sécurisés + logos + SSL
              (2) copyright + liens légaux
════════════════════════════════════════════════════════════ */
.ur-foot{
  background:var(--ur-navy-dark);
  padding:18px 0 22px;
}
/* Ligne 1 — paiements */
.ur-foot__pay{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap;
  max-width:1320px; margin:0 auto; padding:0 15px 18px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.ur-foot__lbl{
  font-size:10.5px; color:rgba(255,255,255,.35); letter-spacing:.05em;
  display:inline-flex; align-items:center; gap:6px; white-space:nowrap;
}
.ur-foot__lbl .fa{ font-size:11px; }
.ur-foot__icons{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
/* Pastille blanche : logo de paiement à hauteur identique */
.ur-foot__ico{
  height:34px; padding:5px 10px; display:inline-flex; align-items:center; justify-content:center;
  background:#fff; border-radius:6px;
}
.ur-foot__ico img{ height:22px; width:auto; display:block; }
/* Ligne 2 — copyright + liens */
.ur-foot__bottom{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  flex-wrap:wrap;
  max-width:1320px; margin:0 auto; padding:16px 15px 0;
}
.ur-foot__copy{ font-size:11px; color:rgba(255,255,255,.3); }
.ur-foot__links{ display:flex; gap:16px; flex-wrap:wrap; }
.ur-foot__links a{ font-size:11px; color:rgba(255,255,255,.3); text-decoration:none; transition:color .15s; }
.ur-foot__links a:hover{ color:rgba(255,255,255,.7); }

/* — Mobile : empilement propre, centré — */
@media (max-width:767.98px){
  .ur-foot__pay{ flex-direction:column; align-items:center; gap:12px; text-align:center; }
  .ur-foot__icons{ justify-content:center; }
  .ur-foot__bottom{ flex-direction:column; align-items:center; gap:10px; text-align:center; }
  .ur-foot__links{ justify-content:center; gap:14px; }
}


/* ════════════════════════════════════════════════════════════
   NEWSLETTER  (widget HTML — classes custom .ur-nl*)
   Repris sur l'ancien bloc validé client : bandeau navy arrondi,
   visuel enveloppe à gauche + titre XL au centre + formulaire à droite
   (input blanc + bouton orange "S'abonner") + case RGPD.
   Form câblé au module PrestaShop iqitemailsubscription (fonctionnel).
════════════════════════════════════════════════════════════ */
.ur-nl{
  background:var(--ur-navy);
  border-radius:16px;
  display:flex; align-items:center; gap:40px;
  flex-wrap:wrap;
  max-width:1320px; margin:36px auto;
  padding:26px 48px;
}

/* — Visuel enveloppe (gauche) — */
.ur-nl__visual{ flex:0 0 auto; line-height:0; }
.ur-nl__visual img{ width:148px; height:auto; display:block; }

/* — Titre XL (centre) — */
.ur-nl__txt{ flex:1 1 auto; min-width:220px; }
.ur-nl__txt h2{
  color:#fff; font-size:34px; font-weight:800;
  line-height:1.12; letter-spacing:-.01em; margin:0;
}

/* — Formulaire (droite) — */
.ur-nl__right{ flex:0 0 auto; width:100%; max-width:440px; }
.ur-nl__form{ width:100%; }
.ur-nl__field{ display:flex; width:100%; }
.ur-nl__input{
  flex:1 1 auto; min-width:0; height:52px;
  border:0; border-radius:4px 0 0 4px; padding:0 18px;
  background:#fff; color:var(--ur-text); font-size:14px;
  outline:none;
}
.ur-nl__input::placeholder{ color:var(--ur-muted); }
.ur-nl__btn{
  flex-shrink:0; height:52px;
  background:var(--ur-orange); color:var(--ur-navy); border:0;
  padding:0 26px; border-radius:0 4px 4px 0;
  font-size:14px; font-weight:700; cursor:pointer; transition:background .15s;
}
.ur-nl__btn:hover{ background:var(--ur-orange-h); }
.ur-nl__btn:disabled{ opacity:.45; cursor:not-allowed; }

/* — Case RGPD — */
.ur-nl__rgpd{
  display:flex; align-items:center; gap:9px;
  margin-top:12px; cursor:pointer;
  font-size:13px; color:rgba(255,255,255,.75); line-height:1.4;
}
.ur-nl__rgpd input{
  flex-shrink:0; width:18px; height:18px; margin:0; cursor:pointer;
  accent-color:var(--ur-orange);
}
.ur-nl__rgpd span{ user-select:none; }

/* — Responsive — */
@media (max-width:991.98px){
  .ur-nl{ gap:26px; padding:24px 28px; }
  .ur-nl__txt h2{ font-size:26px; }
  .ur-nl__visual img{ width:108px; }
}
@media (max-width:767.98px){
  .ur-nl{ flex-direction:column; align-items:stretch; text-align:center; gap:18px; padding:24px 20px; }
  .ur-nl__visual{ align-self:center; }
  .ur-nl__right{ max-width:none; }
  .ur-nl__rgpd{ justify-content:center; }
}


/* ════════════════════════════════════════════════════════════
   FOOTER — COLONNE MARQUE / IDENTITÉ  (widget HTML — .ur-fbrand*)
   Description société + raison sociale + contacts (tél / mail / horaires)
════════════════════════════════════════════════════════════ */
.ur-fbrand__desc{
  font-size:12.5px; line-height:1.7; color:rgba(255,255,255,.55); margin:0 0 16px; max-width:320px;
}
.ur-fbrand__company{
  font-size:12px; font-weight:700; color:#fff; letter-spacing:.03em;
  text-transform:uppercase; margin-bottom:10px;
}
.ur-fbrand__contact{ list-style:none; margin:0; padding:0; }
.ur-fbrand__contact li{
  font-size:12.5px; color:rgba(255,255,255,.55); line-height:1.5; margin-bottom:6px;
  display:flex; align-items:center; gap:8px;
}
.ur-fbrand__contact li .fa{ width:14px; text-align:center; color:var(--ur-orange); opacity:.9; flex-shrink:0; }
.ur-fbrand__contact a{ color:rgba(255,255,255,.55); text-decoration:none; transition:color .15s; }
.ur-fbrand__contact a:hover{ color:#fff; }


/* ════════════════════════════════════════════════════════════
   FOOTER — COLONNE MARQUE EN POSITION 1 + TITRE MASQUÉ
   Le bloc HTML marque = #iqithtmlandbanners-block-1 (titre "Footer -1").
════════════════════════════════════════════════════════════ */
/* 1. Masquer totalement le titre "Footer -1" (uniquement ce bloc) */
#iqithtmlandbanners-block-1 > .block-title{ display:none !important; }

/* 2. Placer cette colonne en première position du footer
   (la .row du footer passe en flex pour pouvoir réordonner) */
.footer-container .row,
#footer .row{ display:flex; flex-wrap:wrap; }
#iqithtmlandbanners-block-1{ order:-1; }

/* Logo du footer (image dans le bloc marque) */
#iqithtmlandbanners-block-1 .block-content > p:first-child{ margin-bottom:16px; }
#iqithtmlandbanners-block-1 .block-content img{ max-width:200px; height:auto; }


/* ════════════════════════════════════════════════════════════
   3 BLOCS SEO / INFOS PROS AVANT FOOTER  (widget HTML — .ur-seo*)
   HACCP / Livraison / Conseils — full HTML figé.
   Valeurs maquette : grille 3 col, cartes blanches bordées,
   icône carrée 44px, titre navy 14.5px, texte 12.5px.
════════════════════════════════════════════════════════════ */
.ur-seo{
  display:grid; grid-template-columns:1fr 1fr 1fr; gap:24px;
  padding:28px 32px;
  background:var(--ur-bg);
}
.ur-seo__item{
  background:#fff; border:1.5px solid var(--ur-border); border-radius:8px; padding:20px;
}
.ur-seo__ico{
  width:44px; height:44px; border-radius:8px;
  display:flex; align-items:center; justify-content:center; margin-bottom:14px;
}
.ur-seo__title{
  font-size:14.5px; font-weight:700; color:var(--ur-navy); margin:0 0 7px; line-height:1.3;
}
.ur-seo__text{
  font-size:12.5px; color:var(--ur-text2); line-height:1.7; margin:0;
}

/* — Tablette / mobile — */
@media (max-width:991.98px){
  .ur-seo{ grid-template-columns:1fr; gap:14px; padding:22px 16px; }
}


/* ════════════════════════════════════════════════════════════
   2 BANNIÈRES PROMO  (widget Elementor "Icon Box" × 2, éditable client)
   Pièces détachées / Tenues & EPI — SANS badge "réf".
   Classe par colonne : .ur-band + .ur-band--navy / --brown
   Saisie client :
     • Champ TITRE       = sur-titre   ex. "Pièces détachées"
     • Champ DESCRIPTION = <strong>Titre</strong> puis texte
     • Bouton/Lien de l'Icon Box = via l'UI
   Disposition : section 2 colonnes (50/50).
════════════════════════════════════════════════════════════ */
.ur-band .elementor-icon-box-wrapper{
  border-radius:8px; padding:24px !important; position:relative; overflow:hidden;
  height:100%; display:block !important; text-align:left !important;
  transition:transform .15s, box-shadow .15s;
}
.ur-band:hover .elementor-icon-box-wrapper{ transform:translateY(-2px); box-shadow:0 8px 28px rgba(0,33,54,.18); }
/* On masque l'icône native (ces bannières n'en ont pas dans la maquette) */
.ur-band .elementor-icon-box-icon{ display:none !important; }
.ur-band .elementor-icon-box-content{ width:100% !important; }
/* Badge "réf." (s'il est posé en absolu par-dessus) : réserver sa place
   pour qu'il ne chevauche pas le texte de description. */
.ur-band .elementor-icon-box-description p{ padding-right:96px; }
/* Sur-titre (champ Titre) */
.ur-band .elementor-icon-box-title{
  color:rgba(255,255,255,.6) !important;
  font-size:10px !important; font-weight:700 !important;
  letter-spacing:.1em; text-transform:uppercase;
  line-height:1.2 !important; margin:0 0 7px !important;
}
.ur-band .elementor-icon-box-title span,
.ur-band .elementor-icon-box-title a{ color:inherit !important; }
/* Description : <strong> = titre blanc, reste = texte clair */
.ur-band .elementor-icon-box-description{ color:rgba(255,255,255,.7) !important; }
.ur-band .elementor-icon-box-description p{ margin:0 0 16px !important; font-size:12.5px !important; line-height:1.5 !important; }
.ur-band .elementor-icon-box-description strong{
  display:block; color:#fff !important;
  font-size:19px !important; font-weight:800 !important; line-height:1.25 !important;
  letter-spacing:-.01em; margin-bottom:6px;
}
/* Bouton "ghost" de l'Icon Box */
.ur-band .elementor-button{
  background:rgba(255,255,255,.15) !important; color:#fff !important;
  border:1.5px solid rgba(255,255,255,.3) !important;
  padding:8px 18px !important; border-radius:4px !important;
  font-size:12.5px !important; font-weight:600 !important;
}
.ur-band .elementor-button:hover{ background:rgba(255,255,255,.25) !important; }

/* Bouton ajouté comme widget Button SÉPARÉ sous l'Icon Box (classe .ur-band__btn).
   À utiliser car l'Icon Box Elementor n'a pas de bouton natif. */
.ur-band__btn .elementor-button,
.elementor-widget-button.ur-band__btn .elementor-button{
  background:rgba(255,255,255,.15) !important; color:#fff !important;
  border:1.5px solid rgba(255,255,255,.3) !important;
  padding:11px 22px !important; border-radius:7px !important;
  font-size:13px !important; font-weight:700 !important;
  transition:background .15s;
}
.ur-band__btn .elementor-button:hover{ background:rgba(255,255,255,.25) !important; }
/* Quand le bouton est posé dans la même colonne que l'Icon Box, on remonte
   un peu pour le coller au texte plutôt que centré dans la colonne. */
.ur-band__btn{ margin-top:-8px; text-align:left; }

/* Variantes couleur (dégradés maquette) */
.ur-band--navy  .elementor-icon-box-wrapper{ background:linear-gradient(135deg,var(--ur-navy) 0%,#00365a 100%); }
.ur-band--brown .elementor-icon-box-wrapper{ background:linear-gradient(135deg,#5c1a00 0%,#a03200 100%); }
.ur-band--green .elementor-icon-box-wrapper{ background:linear-gradient(135deg,#3d544e 0%,var(--ur-green) 100%); }

@media (max-width:767.98px){
  .ur-band .elementor-icon-box-wrapper{ padding:20px !important; }
}


/* ════════════════════════════════════════════════════════════
   RÉASSURANCES FICHE PRODUIT  (sous le bloc panier — widget HTML)
   Classes custom .ur-reassur* — 4 lignes icône + texte (HTML fourni : _reassurances_pdp.html).
   Valeurs maquette : fond gris, texte 12px, <strong> navy.
════════════════════════════════════════════════════════════ */
.ur-reassur{
  background:var(--ur-bg); border-radius:7px; padding:14px 16px;
  display:flex; flex-direction:column; gap:10px; margin-top:18px;
}
.ur-reassur__row{ display:flex; align-items:flex-start; gap:10px; }
.ur-reassur__ico{ color:var(--ur-navy); flex-shrink:0; margin-top:1px; width:16px; text-align:center; }
.ur-reassur__ico .fa{ font-size:14px; }
.ur-reassur__txt{ font-size:12px; color:var(--ur-text2); line-height:1.45; }
.ur-reassur__txt strong{ color:var(--ur-navy); font-weight:600; }


/* ════════════════════════════════════════════════════════════
   RÉASSURANCES FICHE PRODUIT — VERSION ELEMENTOR (3 Icon Box)
   Le client crée 3 widgets Icon Box dans une section sous le bloc panier.
   Classe à poser sur CHAQUE Icon Box (onglet Avancé > CSS) : ur-reassur-el
   Disposition Icon Box : icône à GAUCHE.
════════════════════════════════════════════════════════════ */
.ur-reassur-el .elementor-icon-box-wrapper{
  display:flex !important; align-items:flex-start !important; text-align:left !important;
  gap:10px; padding:0 !important; margin-bottom:10px;
}
.ur-reassur-el .elementor-icon-box-icon{ margin:0 !important; flex-shrink:0; }
.ur-reassur-el .elementor-icon-box-icon i,
.ur-reassur-el .elementor-icon-box-icon svg{ color:var(--ur-navy) !important; fill:var(--ur-navy) !important; font-size:16px !important; width:16px; height:16px; }
.ur-reassur-el .elementor-icon-box-content{ width:auto !important; }
.ur-reassur-el .elementor-icon-box-title{
  font-size:12px !important; font-weight:600 !important; color:var(--ur-navy) !important;
  margin:0 0 1px !important; line-height:1.4 !important;
}
.ur-reassur-el .elementor-icon-box-description{
  font-size:12px !important; color:var(--ur-text2) !important; line-height:1.45 !important; margin:0 !important;
}
/* Si le client veut le fond gris groupé : poser la classe ur-reassur-box sur la SECTION */
.ur-reassur-box{ background:var(--ur-bg); border-radius:7px; padding:14px 16px; }


/* ════════════════════════════════════════════════════════════
   PAGE CATÉGORIE  (DOM réel Warehouse + module amazzing_filter)
   Colonnes : #left-column.col-md-3 (filtres) + #content-wrapper.col-md-9
   Miniatures déjà stylées globalement (.product-miniature).
════════════════════════════════════════════════════════════ */

/* — En-tête catégorie — */
#js-product-list-header{
  background:var(--ur-navy); border-radius:10px; padding:20px 24px; margin-bottom:16px;
}
#js-product-list-header h1.page-title,
#js-product-list-header .page-title{
  color:#fff !important; font-size:22px !important; font-weight:800 !important; margin:0; letter-spacing:-.01em;
}
#js-product-list-header .page-title span{ color:#fff !important; }

/* — Barre de tri / sélection — */
#js-product-list-top{
  background:#fff; border:1px solid var(--ur-border); border-radius:8px;
  padding:8px 14px; margin-bottom:14px;
}
#js-product-list-top .showing{ font-size:12.5px; color:var(--ur-text2); }
/* Sélecteur d'ordre + nb par page */
.products-sort-order .select-title,
.products-nb-per-page .select-title{
  border:1px solid var(--ur-border) !important; border-radius:6px; background:#fff;
  font-size:12.5px; font-weight:600; color:var(--ur-navy); padding:7px 12px; box-shadow:none;
}
.products-sort-order .dropdown-menu,
.products-nb-per-page .dropdown-menu{
  border:1px solid var(--ur-border); border-radius:8px; box-shadow:0 8px 24px rgba(0,33,54,.1); padding:6px;
}
.products-sort-order .dropdown-item,
.products-nb-per-page .dropdown-item{ font-size:12.5px; color:var(--ur-text2); border-radius:5px; padding:7px 10px; }
.products-sort-order .dropdown-item.current,
.products-sort-order .dropdown-item:hover,
.products-nb-per-page .dropdown-item:hover{ background:var(--ur-bg); color:var(--ur-navy); }
/* Bascule grille/liste */
.view-switcher a{ color:var(--ur-muted); font-size:15px; padding:6px 8px; }
.view-switcher a.current{ color:var(--ur-navy); }

/* — Colonne filtres (module amazzing_filter) — */
#amazzing_filter{
  background:#F7F8FA; border:1px solid var(--ur-border); border-radius:10px; padding:0; overflow:hidden;
}
/* En-tête du bloc « Filtrer » */
#amazzing_filter .title_block{
  background:var(--ur-navy); padding:13px 16px; font-size:13px; font-weight:700; color:#fff;
  border-bottom:0; display:flex; align-items:center; justify-content:space-between;
}
#amazzing_filter .title_block .compact-toggle{
  background:rgba(255,255,255,.14); border:0; color:#fff; font-size:11px; font-weight:600;
  padding:4px 10px; border-radius:6px; cursor:pointer;
}
#amazzing_filter .title_block .compact-toggle:hover{ background:rgba(255,255,255,.24); }
#amazzing_filter .block_content{ padding:4px 16px 16px; }

/* Un bloc de filtre (facette) */
#amazzing_filter .af_filter{ border-bottom:1px solid var(--ur-border); padding:14px 0; }
#amazzing_filter .af_filter:last-child{ border-bottom:0; }

/* Titre de facette (repliable) */
#amazzing_filter .af_subtitle{
  font-size:11px; font-weight:700; color:var(--ur-green); letter-spacing:.06em; text-transform:uppercase;
  margin-bottom:12px; display:flex; align-items:center; justify-content:space-between; cursor:pointer;
}
/* Le chevron d'ouverture/fermeture est dessiné par le thème (::before/::after) — on ne le double pas. */

/* Listes de cases à cocher */
#amazzing_filter .af_filter_content ul{ margin:0; padding:0; list-style:none; }
#amazzing_filter .af_filter_content li{ list-style:none; }
#amazzing_filter .af-checkbox-label{
  display:flex; align-items:center; cursor:pointer; padding:6px 8px; margin:1px 0;
  border-radius:6px; font-size:13px; color:var(--ur-text2); transition:background .12s, color .12s;
}
#amazzing_filter .af-checkbox-label:hover{ background:#fff; color:var(--ur-navy); }
#amazzing_filter .af-checkbox-label .name{ flex:1 1 auto; line-height:1.35; }
#amazzing_filter .af-checkbox-label .count{
  flex:0 0 auto; margin-left:8px; font-size:11px; font-weight:600; color:var(--ur-muted);
  background:#fff; border:1px solid var(--ur-border); border-radius:20px; padding:1px 8px; min-width:24px; text-align:center;
}
/* Neutralise un éventuel décor de case dessiné par le thème (label::before/::after) */
#amazzing_filter .af-checkbox-label::before,
#amazzing_filter .af-checkbox-label::after{ content:none !important; }

/* Coche personnalisée — MÊME sélecteur que le thème (custom.css chargé après => gagne) */
#amazzing_filter .af-checkbox-label input.af.checkbox,
#amazzing_filter .af_filter_content input[type="checkbox"]{
  -webkit-appearance:none !important; -moz-appearance:none !important; appearance:none !important;
  display:inline-block !important; visibility:visible !important; opacity:1 !important;
  position:relative !important; float:none !important; vertical-align:middle;
  width:17px !important; height:17px !important; min-width:17px !important; max-width:17px !important;
  flex:0 0 17px !important; margin:0 9px 0 0 !important; padding:0 !important;
  border:1.5px solid var(--ur-border) !important; border-radius:4px !important;
  background:#fff no-repeat center !important; background-size:11px 11px !important;
  box-shadow:none !important; cursor:pointer; transition:border-color .15s, background-color .15s;
}
#amazzing_filter .af-checkbox-label:hover input.af.checkbox{ border-color:var(--ur-navy) !important; }
#amazzing_filter .af-checkbox-label input.af.checkbox:checked{
  border-color:var(--ur-orange) !important; background-color:var(--ur-orange) !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") !important;
}
#amazzing_filter .af-checkbox-label input.af.checkbox:checked ~ .name{ color:var(--ur-navy); font-weight:600; }
/* Options indisponibles (0 résultat) */
#amazzing_filter .af-checkbox-label input.af.checkbox:disabled{ opacity:.35 !important; cursor:default; }
#amazzing_filter .af-checkbox-label input.af.checkbox:disabled ~ .name{ color:var(--ur-muted); }

/* Liens « plus… / moins » */
#amazzing_filter .toggle-cut-off{
  display:inline-block; margin-top:8px; font-size:12px; font-weight:600; color:var(--ur-green);
  text-decoration:none; cursor:pointer;
}
#amazzing_filter .toggle-cut-off:hover{ color:var(--ur-orange-h); }

/* Slider prix */
#amazzing_filter .af-slider .slider-bar{ background:var(--ur-border); height:4px; border-radius:2px; margin:6px 0 14px; }
#amazzing_filter .af-slider .selected-bar{ background:var(--ur-orange); height:4px; }
#amazzing_filter .af-slider .pointer{
  width:15px; height:15px; background:#fff; border:2px solid var(--ur-navy); border-radius:50%;
  top:-6px; box-shadow:0 1px 3px rgba(0,0,0,.15);
}
#amazzing_filter .af-slider .slider-values{ display:flex; justify-content:space-between; gap:10px; }
#amazzing_filter .af-slider .slider_value{ font-size:12px; color:var(--ur-text2); }
#amazzing_filter .af-slider .slider_value .value{ font-weight:700; color:var(--ur-navy); }
#amazzing_filter .af-slider .slider_value .input-text{
  width:66px; border:1px solid var(--ur-border); border-radius:5px; padding:3px 6px;
  font-size:12px; color:var(--ur-navy); margin-top:4px;
}

/* Select (fabricants) */
#amazzing_filter .af-select.form-control-select{
  width:100%; border:1.5px solid var(--ur-border) !important; border-radius:6px; height:38px;
  font-size:13px; color:var(--ur-navy); box-shadow:none; padding:0 12px; background:#fff;
}
#amazzing_filter .af-select.form-control-select:focus{ border-color:var(--ur-navy) !important; }

/* Bouton « More filters / Less filters » */
#amazzing_filter .toggleMoreFilters{
  width:100%; margin-top:14px; background:#fff; border:1.5px solid var(--ur-border); color:var(--ur-navy);
  border-radius:8px; padding:9px 14px; font-size:12.5px; font-weight:600; cursor:pointer; transition:all .15s;
}
#amazzing_filter .toggleMoreFilters:hover{ border-color:var(--ur-navy); background:var(--ur-bg); }
#amazzing_filter .toggleMoreFilters i{ font-size:11px; margin-right:4px; }

/* Bouton « Voir les produits » (barre d'action) */
#amazzing_filter .btn-holder{ margin-top:14px; }
#amazzing_filter .viewFilteredProducts{
  display:flex; align-items:center; justify-content:center; gap:8px; width:100%;
  background:var(--ur-navy) !important; border:0 !important; color:#fff !important;
  border-radius:8px; font-size:13px; font-weight:700; padding:11px 16px; text-decoration:none; transition:background .15s;
}
#amazzing_filter .viewFilteredProducts:hover{ background:var(--ur-navy-h) !important; }
#amazzing_filter .viewFilteredProducts .af-total-count{
  background:var(--ur-orange); color:var(--ur-navy); font-weight:800; border-radius:20px; padding:1px 9px; font-size:12px;
}

/* Bouton compact (mobile) « Filter » — sticky */
#amazzing_filter .compact-toggle.type-1.sticky{
  background:var(--ur-orange) !important; border:0 !important; color:var(--ur-navy) !important;
  border-radius:8px; font-size:13px; font-weight:700; padding:11px 16px;
}
#amazzing_filter .compact-toggle.type-1.sticky:hover{ background:var(--ur-orange-h) !important; }
#amazzing_filter .compact-toggle .compact-toggle-icon{ margin-right:6px; }

/* — Pagination — */
.pagination .page-list{ display:flex; gap:6px; justify-content:center; padding:0; margin:24px 0; }
.pagination .page-list li{ list-style:none; }
.pagination .page-list a{
  display:inline-flex; align-items:center; justify-content:center; min-width:38px; height:38px;
  border:1px solid var(--ur-border); border-radius:6px; color:var(--ur-text2); font-size:13.5px; font-weight:600;
  text-decoration:none; padding:0 8px; transition:all .15s;
}
.pagination .page-list a:hover{ border-color:var(--ur-navy); color:var(--ur-navy); }
.pagination .page-list .current a{ background:var(--ur-navy); border-color:var(--ur-navy); color:#fff; }

/* — Grille produits : 4 par ligne en desktop —
   On abandonne le système flex/col-* de Bootstrap (largeurs % + gouttières
   qui se battent et repoussent la 4e carte). On passe le conteneur en
   CSS GRID : le conteneur impose le nombre de colonnes, les largeurs et
   marges des cartes n'ont plus aucun effet. Imparable.
   2 col mobile · 3 col tablette · 4 col desktop. */
#js-product-list .products.products-grid,
#js-product-list .products.product_list{
  display:grid !important;
  grid-template-columns:repeat(2,1fr);   /* mobile par défaut */
  gap:14px !important;
  --bs-gutter-x:0 !important; --bs-gutter-y:0 !important;
  margin:0 !important;
}
@media (min-width:768px){
  #js-product-list .products.products-grid,
  #js-product-list .products.product_list{ grid-template-columns:repeat(3,1fr); }
}
@media (min-width:992px){
  #js-product-list .products.products-grid,
  #js-product-list .products.product_list{ grid-template-columns:repeat(4,1fr); }
}
/* Les cartes : on annule largeurs/marges/paddings hérités de col-* et .row>* */
#js-product-list .products.products-grid > .js-product-miniature-wrapper,
#js-product-list .products.product_list > .js-product-miniature-wrapper{
  flex:initial !important; max-width:none !important; width:auto !important;
  margin:0 !important; padding:0 !important;
  min-width:0; /* indispensable en grid pour éviter le débordement de contenu */
  display:block;
}
/* La carte interne remplit toute la cellule de la grille */
#js-product-list .products.products-grid > .js-product-miniature-wrapper > .product-miniature,
#js-product-list .products.product_list > .js-product-miniature-wrapper > .product-miniature{
  width:100%; height:100%;
}

/* — Mobile — */
@media (max-width:767.98px){
  #js-product-list-header{ padding:16px; }
  #js-product-list-header h1.page-title{ font-size:18px !important; }
  #left-column{ margin-bottom:16px; }
}

/* ════════════════════════════════════════════════════════════
   PAGES CMS  (mentions légales, CGV, etc. — contenu Elementor/RTE)
   Fond légèrement arrondi, lecture confortable.
════════════════════════════════════════════════════════════ */
/* Un SEUL cadre : sur le conteneur externe #content. */
#content.page-content.page-cms{
  background:#fff; border:1px solid var(--ur-border); border-radius:10px;
  padding:28px 32px; margin-bottom:24px;
}
/* Les conteneurs Elementor internes restent transparents (pas de 2e cadre) */
.page-cms .elementor,
.page-cms .elementor-section,
.page-cms .elementor-column-wrap,
.page-cms .elementor-widget-container{
  background:transparent !important; border:0 !important; box-shadow:none !important;
  padding-left:0 !important; padding-right:0 !important;
}
.page-cms .page-header .page-title,
.page-cms h1.page-title{
  font-size:24px; font-weight:800; color:var(--ur-navy); margin-bottom:18px;
}
.page-cms .rte-content,
.page-cms .elementor-text-editor{ font-size:14px; color:var(--ur-text2); line-height:1.75; }
.page-cms .rte-content h2,
.page-cms .elementor-widget-text-editor h2{
  font-size:18px; font-weight:700; color:var(--ur-navy); margin:24px 0 10px;
}
.page-cms .rte-content h3{ font-size:15.5px; font-weight:700; color:var(--ur-navy); margin:18px 0 8px; }
.page-cms .rte-content h5{ font-size:14px; font-weight:700; color:var(--ur-navy); margin:16px 0 6px; }
.page-cms .rte-content a{ color:var(--ur-green); text-decoration:underline; }
.page-cms .rte-content a:hover{ color:var(--ur-navy); }
.page-cms .rte-content strong,
.page-cms .rte-content b{ color:var(--ur-navy); }

@media (max-width:767.98px){
  #content.page-content.page-cms{ padding:20px 16px; }
  .page-cms h1.page-title{ font-size:20px; }
}


/* ════════════════════════════════════════════════════════════
   TUNNEL : PANIER · COMPTE · CONNEXION · CHECKOUT · FORMULAIRES
   DOM réel Warehouse/PS9. Aucune classe à ajouter.
════════════════════════════════════════════════════════════ */

/* ── Titre de page (Panier, Checkout, Connexion, Mot de passe…) ── */
#main > .page-title,
.page-header .page-title{
  font-size:24px !important; font-weight:800 !important; color:var(--ur-navy) !important;
  letter-spacing:-.01em; margin:0 0 20px;
}

/* ════════════════════════════════════════════════════════════
   1) DRAWER PANIER  (#blockcart-content — aperçu au survol/clic)
════════════════════════════════════════════════════════════ */
#blockcart-content{ padding:14px 16px; }
#blockcart-content .cart-title{ margin-bottom:6px; }
#blockcart-content .cart-title .modal-title{ font-size:15px; font-weight:700; color:var(--ur-navy) !important; }
#blockcart-content #js-cart-close{ background:none; border:0; font-size:22px; line-height:1; color:var(--ur-muted); }
#blockcart-content #js-cart-close:hover{ color:var(--ur-navy); }
#blockcart-content hr{ border-color:var(--ur-border); margin:10px 0; opacity:1; }

/* Lignes produits du drawer */
#blockcart-content .cart-products{ list-style:none; margin:0; padding:0; max-height:340px; overflow:auto; }
#blockcart-content .cart-products > li{ padding:10px 0; border-bottom:1px solid var(--ur-border); }
#blockcart-content .cart-products > li:last-child{ border-bottom:0; }
#blockcart-content .product-image img{
  width:100%; border:1px solid var(--ur-border); border-radius:6px; background:var(--ur-bg);
}
#blockcart-content .col-info a{ font-size:13px; font-weight:600; color:var(--ur-text) !important; line-height:1.35; text-decoration:none; }
#blockcart-content .col-info a:hover{ color:var(--ur-navy) !important; }
#blockcart-content .remove-from-cart{ color:var(--ur-muted) !important; font-size:13px; }
#blockcart-content .remove-from-cart:hover{ color:#c0392b !important; }

/* Quantité (bootstrap-touchspin) dans le drawer */
#blockcart-content .block-cart-product-quantity{
  width:54px !important; height:34px; text-align:center; font-weight:600; color:var(--ur-navy);
  border:1.5px solid var(--ur-border) !important; border-radius:5px;
}

/* Sous-totaux / totaux du drawer */
#blockcart-content .cart-subtotals,
#blockcart-content .cart-totals{ font-size:13px; padding-top:8px; }
#blockcart-content .cart-subtotals .label,
#blockcart-content .cart-totals .label{ color:var(--ur-text2); }
#blockcart-content .cart-totals .clearfix:last-child .label,
#blockcart-content .cart-totals .clearfix:last-child .value{ color:var(--ur-navy); font-weight:700; font-size:14px; }

/* Boutons du drawer */
#blockcart-content .cart-buttons{ margin-top:12px; }
#blockcart-content .cart-buttons .btn-primary{ border-radius:6px; }
#blockcart-content .cart-buttons .btn-secondary{
  background:#fff !important; border:1.5px solid var(--ur-border) !important; color:var(--ur-navy) !important;
  border-radius:6px; font-weight:600; margin-top:6px;
}
#blockcart-content .cart-buttons .btn-secondary:hover{ border-color:var(--ur-navy) !important; background:var(--ur-bg) !important; }

/* ════════════════════════════════════════════════════════════
   2) PAGE PANIER  (.cart-grid · .product-line-grid · .cart-summary)
════════════════════════════════════════════════════════════ */
/* Carte produit (ligne) — UN SEUL cadre sur le conteneur externe.
   .cart-container CONTIENT .cart-overview → on ne cadre que l'externe. */
.cart-container{ background:#fff; border:1px solid var(--ur-border); border-radius:10px; padding:6px 18px; }
.cart-overview{ background:transparent; border:0; border-radius:0; padding:0; }
.cart-items{ list-style:none; margin:0; padding:0; }
.cart-item{ padding:18px 0; border-bottom:1px solid var(--ur-border); }
.cart-item:last-child{ border-bottom:0; }
/* Ligne produit en HORIZONTAL : image | infos | actions côte à côte */
.product-line-grid{
  display:flex !important; flex-wrap:nowrap; align-items:center; gap:16px;
}
.product-line-grid-left{ flex:0 0 90px; max-width:90px; padding:0; }
.product-line-grid-body{ flex:1 1 auto; max-width:none; padding:0; }
.product-line-grid-right{ flex:0 0 auto; max-width:none; padding:0; margin-left:auto; }
.product-line-grid-right .row{ align-items:center; }
.product-line-grid-left .product-image img,
.product-line-grid-left img{
  width:100%; border:1px solid var(--ur-border); border-radius:8px; background:var(--ur-bg); padding:4px;
}
.product-line-info .label{ font-size:14px; font-weight:600; color:var(--ur-text) !important; text-decoration:none; }
.product-line-info .label:hover{ color:var(--ur-navy) !important; }
/* Prix HT/TTC ligne panier — neutralise les styles inline orange du thème */
.product-line-info.product-price .current-price span[style]{ color:var(--ur-navy) !important; }
.product-line-info.product-price .current-price .mb-1:first-child span:first-child{ font-size:18px; font-weight:800; }
.product-line-info.product-price .current-price .mb-1:last-child{ font-size:12px; color:var(--ur-text2) !important; }
.product-line-info.product-price .current-price .mb-1:last-child span[style]{ color:var(--ur-text2) !important; }
/* Quantité + prix ligne */
/* Quantité touchspin sur la page panier — input + flèches verticales collés */
.product-line-grid-right .qty .input-group.bootstrap-touchspin{
  display:inline-flex !important; align-items:stretch; width:auto; flex-wrap:nowrap;
  border:1.5px solid var(--ur-border); border-radius:6px; overflow:hidden; height:38px;
}
.product-line-grid-right .qty .form-control,
.product-line-grid-right .qty .js-cart-line-product-quantity{
  width:46px !important; height:100% !important; min-height:0 !important;
  text-align:center; font-weight:600; color:var(--ur-navy);
  border:0 !important; border-radius:0 !important; box-shadow:none !important; padding:0;
  -moz-appearance:textfield;
}
.product-line-grid-right .qty .form-control::-webkit-outer-spin-button,
.product-line-grid-right .qty .form-control::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.product-line-grid-right .qty .input-group-btn-vertical{
  display:flex !important; flex-direction:column; flex-shrink:0;
  border-left:1.5px solid var(--ur-border);
}
.product-line-grid-right .qty .btn-touchspin{
  flex:1 1 50%; width:26px; padding:0; margin:0; border:0; background:#fff; color:var(--ur-navy);
  display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:10px;
}
.product-line-grid-right .qty .btn-touchspin:hover{ background:var(--ur-bg); }
.product-line-grid-right .qty .bootstrap-touchspin-down{ border-top:1.5px solid var(--ur-border); }
/* Masquer les addons prefix/postfix vides du touchspin */
.product-line-grid-right .qty .bootstrap-touchspin-prefix,
.product-line-grid-right .qty .bootstrap-touchspin-postfix{ display:none !important; }
.cart-line-product-actions .remove-from-cart{ display:inline-flex; align-items:center; }
/* L'icône Material "delete" affiche le mot si la police n'est pas chargée :
   on masque le texte et on pose une corbeille FontAwesome à la place. */
.cart-line-product-actions .remove-from-cart .material-icons{
  font-size:0 !important; color:transparent !important;
}
.cart-line-product-actions .remove-from-cart .material-icons::before{
  font-family:"Font Awesome 6 Free","FontAwesome" !important; font-weight:900;
  content:"\f1f8"; /* fa-trash */
  font-size:18px !important; color:var(--ur-muted) !important;
}
.cart-line-product-actions .remove-from-cart:hover .material-icons::before{ color:#c0392b !important; }
.cart-line-product-actions .remove-from-cart .material-icons{ color:var(--ur-muted); font-size:20px; }
.cart-line-product-actions .remove-from-cart:hover .material-icons{ color:#c0392b; }
.product-line-grid-right .product-price strong{ color:var(--ur-navy); font-weight:800; }

/* Bouton "Continuer mes achats" */
.cart-grid-body > .btn-secondary{
  background:#fff !important; border:1.5px solid var(--ur-border) !important; color:var(--ur-navy) !important;
  border-radius:7px; font-weight:600;
}
.cart-grid-body > .btn-secondary:hover{ border-color:var(--ur-navy) !important; background:var(--ur-bg) !important; }

/* Carte récap (colonne droite) */
.card.cart-summary{
  background:#fff; border:1px solid var(--ur-border) !important; border-radius:10px; box-shadow:none;
}
.cart-summary .card-body{ padding:16px 18px; }
.cart-summary hr{ border-color:var(--ur-border); opacity:1; margin:10px 0; }
.cart-summary-line .label{ font-size:13px; color:var(--ur-text2); }
.cart-summary-line .value{ font-size:13px; color:var(--ur-text); font-weight:600; }
.cart-summary-line.cart-total .label,
.cart-summary-line.cart-total .value,
.cart-total .label, .cart-total .value{ font-size:16px !important; font-weight:800 !important; color:var(--ur-navy) !important; }
.cart-detailed-actions .btn-primary,
.checkout.cart-detailed-actions .btn-primary{ border-radius:7px; font-size:15px; }
.cart-summary-products .text-muted{ color:var(--ur-green) !important; font-size:12.5px; }

/* ════════════════════════════════════════════════════════════
   3) PAGES COMPTE / CONNEXION / INSCRIPTION / MOT DE PASSE / CHECKOUT
      Conteneur .page-content + formulaires .form-group/.form-control
════════════════════════════════════════════════════════════ */
/* Conteneur des pages compte : NE PAS brider page-content de façon générique
   (ça cassait blog, etc.). Le centrage 640px est porté UNIQUEMENT par les
   sections d'authentification (.login-form / .form-fields), pas par le wrapper.
   .page-content reste donc pleine largeur par défaut. */
#content.page-content:not(.page-cms){
  background:transparent;
}
/* Centrage réservé aux pages connexion / mot de passe oublié */
#content.page-content > .login-form,
#content.page-content > .form-fields{
  margin-left:auto; margin-right:auto;
}

/* ── Menu latéral du compte (.my-account-side-links) ── */
.my-account-side-links{
  display:flex; flex-direction:column; gap:6px;
  background:#fff; border:1px solid var(--ur-border); border-radius:10px; padding:10px;
}
/* Les <a> portent des classes col-lg-4/col-md-6 (grille) : on les neutralise */
.my-account-side-links > a[class*="col-"]{
  flex:none !important; max-width:none !important; width:100% !important;
  padding:0 !important; margin:0;
}
.my-account-side-links > a{
  display:block; width:100%; max-width:none; flex:none; padding:0; margin:0;
  border-radius:7px; text-decoration:none; transition:background .15s;
}
.my-account-side-links > a .link-item{
  display:flex; align-items:center; gap:11px;
  padding:11px 13px; font-size:13.5px; font-weight:500; color:var(--ur-text) !important;
}
.my-account-side-links > a .link-item i{
  width:18px; text-align:center; color:var(--ur-green); font-size:15px;
}
.my-account-side-links > a:hover{ background:var(--ur-bg); }
.my-account-side-links > a:hover .link-item{ color:var(--ur-navy) !important; }
.my-account-side-links > a:hover .link-item i{ color:var(--ur-navy); }
/* Déconnexion : en bas, légèrement séparée et en rouge discret */
.my-account-side-links > a[href*="mylogout"]{ margin-top:6px; border-top:1px solid var(--ur-border); border-radius:0 0 7px 7px; }
.my-account-side-links > a[href*="mylogout"] .link-item,
.my-account-side-links > a[href*="mylogout"] .link-item i{ color:#c0392b !important; }
.my-account-side-links > a[href*="mylogout"]:hover{ background:#fdecec; }

/* ── Contenu du compte (.my-account-page-content) ── */
.my-account-page-content{
  background:#fff; border:1px solid var(--ur-border); border-radius:10px; padding:24px 26px;
}
.my-account-page-content > h2{
  font-size:18px; font-weight:700; color:var(--ur-navy); margin:0 0 18px;
  padding-bottom:12px; border-bottom:1px solid var(--ur-border);
}
/* Le formulaire d'identité garde les labels à gauche (2 colonnes), juste plus propre */
.my-account-page-content .form-group.row{ margin-bottom:14px; }
.my-account-page-content .form-footer{ text-align:left; margin-top:8px; }
.my-account-page-content .form-footer .btn-primary{ width:auto; padding:11px 28px; }

/* Espace entre le menu (col-sm-3) et le contenu (col-sm-9).
   On utilise gap + nowrap (PAS de marges : col-sm-3 + col-sm-9 = 100%,
   ajouter des marges faisait déborder et le contenu passait sous le menu). */
@media (min-width:576px){
  .my-account-page-content-wrapper > .row{
    flex-wrap:nowrap !important; align-items:flex-start; gap:16px;
  }
  .my-account-page-content-wrapper > .row > .my-account-side-links{
    flex:0 0 240px !important; max-width:240px !important; width:240px !important; margin:0 !important;
  }
  .my-account-page-content-wrapper > .row > .my-account-page-content{
    flex:1 1 auto !important; max-width:none !important; width:auto !important; min-width:0 !important; margin:0 !important;
  }
}

/* ── Blocs adresses ── (le .row qui suit le h2, pas les form-group.row) */
.my-account-page-content > .row{ display:flex; flex-wrap:wrap; gap:16px; }
.my-account-page-content > .row > [class*="col-"]{
  flex:0 1 320px; max-width:100%; padding:0;
}
article.address{
  background:#fff; border:1px solid var(--ur-border); border-radius:10px;
  overflow:hidden; height:100%; display:flex; flex-direction:column;
  transition:border-color .15s, box-shadow .15s;
}
article.address:hover{ border-color:var(--ur-navy); box-shadow:0 4px 16px rgba(0,33,54,.08); }
.address-body{ padding:18px 20px; flex:1 1 auto; }
.address-body h4{ font-size:14px; font-weight:700; color:var(--ur-navy); margin:0 0 10px; }
.address-body address{ font-style:normal; font-size:13.5px; line-height:1.7; color:var(--ur-text2); margin:0; }
.address-footer{
  display:flex; border-top:1px solid var(--ur-border);
}
.address-footer a{
  flex:1 1 50%; display:flex; align-items:center; justify-content:center; gap:7px;
  padding:11px 8px; font-size:13px; font-weight:600; color:var(--ur-green) !important;
  text-decoration:none; transition:background .15s, color .15s;
}
.address-footer a:first-child{ border-right:1px solid var(--ur-border); }
.address-footer a:hover{ background:var(--ur-bg); color:var(--ur-navy) !important; }
.address-footer a[data-link-action="delete-address"]{ color:var(--ur-muted) !important; }
.address-footer a[data-link-action="delete-address"]:hover{ background:#fdecec; color:#c0392b !important; }

/* Bouton "Créer une nouvelle adresse" */
.addresses-footer{ margin-top:16px; }
.addresses-footer a{
  display:inline-flex; align-items:center; gap:9px;
  padding:12px 22px; border:1.5px solid var(--ur-orange); border-radius:8px;
  background:var(--ur-orange); color:var(--ur-navy) !important;
  font-size:14px; font-weight:700; text-decoration:none; transition:background .15s;
}
.addresses-footer a:hover{ background:var(--ur-orange-h); border-color:var(--ur-orange-h); }
/* Pages compte SANS carte interne (mdp oublié, renew) : cadre sur la section */
.page-content .form-fields,
.page-content > header + .form-fields,
.send-renew-password-link{ }
.page-content .form-fields{
  background:#fff; border:1px solid var(--ur-border); border-radius:12px;
  padding:24px 28px; margin-top:8px;
}
/* ════════════════════════════════════════════════════════════
   FORMULAIRE DE CONNEXION — carte centrée, largeur fluide
════════════════════════════════════════════════════════════ */

/* La page compte ne porte plus le cadre : c'est la carte login qui l'a */
.login-form{
  width:100%; max-width:460px; margin:8px auto 0;
  background:#fff; border:1px solid var(--ur-border); border-radius:12px;
  padding:30px 32px; box-shadow:0 2px 14px rgba(0,33,54,.05);
}
.login-form #login-form,
.login-form > form{ width:100%; }
.login-form > section,
.login-form #login-form > section{ display:flex; flex-direction:column; gap:18px; }

/* Chaque champ : label au-dessus, input pleine largeur */
.login-form .form-group.row{
  display:flex !important; flex-direction:column; align-items:stretch;
  margin:0; gap:7px;
}
.login-form .form-group.row .col-form-label{
  flex:none !important; max-width:100% !important; width:100%;
  text-align:left; padding:0; margin:0; white-space:nowrap;
  font-size:13px; font-weight:600; color:var(--ur-navy);
}
.login-form .form-group.row .js-input-column{
  flex:none !important; max-width:100% !important; width:100%; padding:0;
}
.login-form .form-control{ width:100%; height:46px; }

/* Champ mot de passe : input + bouton œil collés, pleine largeur */
.login-form .input-group{ width:100%; flex-wrap:nowrap; }
.login-form .input-group .form-control{
  flex:1 1 auto; border-radius:7px 0 0 7px !important; border-right:0 !important;
}
.login-form .input-group .input-group-append .btn{
  height:46px; border-radius:0 7px 7px 0 !important; padding:0 14px;
}

/* Colonne commentaire vide masquée (sinon décale) */
.login-form .form-group.row .form-control-comment{ display:none !important; }

/* Mot de passe oublié — discret, à droite */
.login-form .forgot-password{ text-align:right; margin:0; }
.login-form .forgot-password a{ font-size:12.5px; }

/* Bouton Connexion — pleine largeur, bien visible */
.login-form .form-footer{ margin:6px 0 0; text-align:center; }
.login-form .form-footer .btn-primary,
.login-form #submit-login{
  display:block; width:100%; height:48px; font-size:15px; font-weight:700;
  border-radius:8px;
}

/* "Pas de compte ?" centré sous la carte */
#content.page-content .no-account{ text-align:center; margin-top:18px; font-size:13.5px; }
#content.page-content .login-form + hr{ display:none; }

/* Champs de formulaire — uniformisés sur la charte */
.form-control,
input[type="text"].form-control,
input[type="email"].form-control,
input[type="password"].form-control,
input[type="number"].form-control{
  border:1.5px solid var(--ur-border) !important; border-radius:7px !important;
  font-size:14px; color:var(--ur-text); padding:9px 12px; height:auto; box-shadow:none !important;
  transition:border-color .15s;
}
.form-control:focus{
  border-color:var(--ur-navy) !important; box-shadow:0 0 0 3px rgba(0,33,54,.08) !important; outline:0;
}
.form-control::placeholder{ color:var(--ur-muted); }
.col-form-label,
.form-group label,
.login-form label,
.form-fields label{ font-size:13px; font-weight:600; color:var(--ur-navy); }
.col-form-label.required::after,
label.required::after{ content:" *"; color:var(--ur-orange-h); }
.form-control-comment{ font-size:11.5px; color:var(--ur-muted); }

/* Bouton afficher/masquer mot de passe */
.input-group-append .btn-outline-secondary,
.input-group .btn-outline-secondary{
  border:1.5px solid var(--ur-border) !important; border-left:0 !important;
  border-radius:0 7px 7px 0 !important; color:var(--ur-muted); background:#fff;
}
.input-group-append .btn-outline-secondary:hover{ color:var(--ur-navy); }

/* Cases à cocher / radios custom — accent navy */
.custom-checkbox input:checked ~ span,
.custom-radio input:checked ~ span{ border-color:var(--ur-navy) !important; }
.custom-checkbox .checkbox-checked{ color:var(--ur-navy) !important; }
.custom-checkbox label,
.custom-radio + *{ font-size:13px; color:var(--ur-text2); }

/* Liens utilitaires (mot de passe oublié, créer un compte, retour) */
.forgot-password a,
.no-account a,
.account-link,
.send-renew-password-link + * a{ color:var(--ur-green) !important; text-decoration:none; font-weight:600; }
.forgot-password a:hover,
.no-account a:hover,
.account-link:hover{ color:var(--ur-navy) !important; text-decoration:underline; }
.send-renew-password-link{ font-size:13.5px; color:var(--ur-text2); line-height:1.6; }

/* Bouton de soumission pleine largeur (Connexion, Continuer, Envoyer le lien) */
.form-footer .btn-primary,
.form-control-submit.btn-primary,
#submit-login.btn-primary,
#send-reset-link.btn-primary{ border-radius:7px; font-size:15px; padding:10px 18px; }

/* ── Formulaire mot de passe oublié (form-inline : label + input + bouton) ── */
.form-fields .form-inline{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.form-fields .form-inline .form-control{ margin:0 !important; flex:1 1 260px; min-width:220px; }
.form-fields .form-inline label{ margin:0 !important; }
.form-fields .form-inline .btn{ margin:0 !important; flex:0 0 auto; }

/* Alerte erreur (ps-alert-error) */
.ps-alert-error li,
.ps-alert-error{ color:#c0392b; font-size:13px; }

/* ── Étapes du checkout (.checkout-step) ── */
.checkout-step{
  background:#fff; border:1px solid var(--ur-border); border-radius:10px;
  padding:0 22px; margin-bottom:14px; overflow:hidden;
}
.checkout-step .step-title{
  font-size:16px !important; font-weight:700; color:var(--ur-navy);
  padding:16px 0; margin:0; display:flex; align-items:center; gap:10px; cursor:pointer;
}
.checkout-step .step-number{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:28px !important; height:28px !important; min-width:28px; box-sizing:border-box;
  border-radius:50%; font-size:13px; font-weight:700; line-height:1 !important;
  text-align:center; padding:0 !important; margin:0 !important;
  background:var(--ur-bg); color:var(--ur-navy); border:1.5px solid var(--ur-border); flex-shrink:0;
}
.checkout-step.-current .step-number{ background:var(--ur-navy); color:#fff; border-color:var(--ur-navy); }
.checkout-step.-complete .step-number,
.checkout-step .done{ color:var(--ur-green) !important; }
.checkout-step.-unreachable .step-title{ color:var(--ur-muted); cursor:default; }
.checkout-step.-unreachable .step-number{ opacity:.55; }
.checkout-step .step-edit{ margin-left:auto; font-size:12.5px; color:var(--ur-green) !important; }
.checkout-step .content{ padding:6px 0 22px; }

/* ── Réassurances dans le tunnel (déjà stylées, on garde l'espacement) ── */
.cart-grid-right .ur-reassur,
.elementor-displayReassurance .ur-reassur{ margin-top:16px; }

/* ── Mobile tunnel ── */
@media (max-width:767.98px){
  #content.page-content:not(.page-cms){ padding:0 16px; }
  .checkout-step{ padding:0 16px; }
  .cart-container{ padding:4px 14px; }
}


/* ════════════════════════════════════════════════════════════
   BLOG  (module simpleblog — listing d'articles)
   DOM : .simpleblog__listing > .row > .simpleblog__listing__post (col-md-6)
════════════════════════════════════════════════════════════ */
.simpleblog__listing{ margin-top:8px; }
.simpleblog__listing > .row{
  display:flex; flex-wrap:wrap; gap:20px; margin:0;
}
/* Cartes : 2 par ligne desktop, 1 mobile. On neutralise les col-* + gouttières */
.simpleblog__listing__post{
  flex:1 1 calc(50% - 10px); max-width:calc(50% - 10px); min-width:0;
  padding:0 !important; margin:0;
}
@media (max-width:767.98px){
  .simpleblog__listing__post{ flex:1 1 100%; max-width:100%; }
}

/* Carte article */
.simpleblog__listing__post__wrapper{
  display:flex; flex-direction:column; height:100%;
  background:#fff; border:1px solid var(--ur-border); border-radius:12px;
  padding:0; overflow:hidden;
  transition:border-color .15s, box-shadow .2s, transform .15s;
}
.simpleblog__listing__post__wrapper:hover{
  border-color:var(--ur-navy); box-shadow:0 14px 34px rgba(0,33,54,.13); transform:translateY(-3px);
}
/* Image de l'article : pleine largeur, collée en haut, ratio constant */
.simpleblog__listing__post__wrapper a img,
.simpleblog__listing__post__wrapper picture,
.simpleblog__listing__post__wrapper .post-thumbnail img,
.simpleblog__listing__post__wrapper img{
  display:block; width:100%; height:220px; object-fit:cover;
  border-radius:0; transition:transform .4s ease;
}
.simpleblog__listing__post__wrapper:hover img{ transform:scale(1.04); }
/* Conteneur image pour clipper le zoom au survol */
.simpleblog__listing__post__wrapper > a:first-child,
.simpleblog__listing__post__wrapper .post-thumbnail{
  display:block; overflow:hidden; line-height:0;
}
/* Le contenu reçoit le padding (l'image est edge-to-edge) */
.simpleblog__listing__post__wrapper__content{ flex:1 1 auto; padding:22px 24px 0; }
.simpleblog__listing__post__wrapper__footer{ margin-left:24px !important; margin-right:24px !important; }

/* Titre */
.simpleblog__listing__post__wrapper__content__headline,
.post-title{ margin:0 0 12px; }
.simpleblog__listing__post__wrapper__content__headline a,
.post-title a{
  font-size:17px !important; font-weight:700 !important; color:var(--ur-navy) !important;
  line-height:1.35; text-decoration:none;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.simpleblog__listing__post__wrapper__content__headline a:hover,
.post-title a:hover{ color:var(--ur-green) !important; }

/* Extrait */
.simpleblog__listing__post__wrapper__content p[itemprop="description"]{
  display:block !important; font-size:13.5px; line-height:1.65; color:var(--ur-text2);
  margin:0 0 14px;
  display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;
}

/* Lien "Read more" */
.simpleblog__listing__post__wrapper__content__readmore{
  display:inline-flex; align-items:center; gap:6px; margin-bottom:18px;
  font-size:13px; font-weight:600; color:var(--ur-orange-h) !important; text-decoration:none;
}
.simpleblog__listing__post__wrapper__content__readmore .text-underline{ text-decoration:none; }
.simpleblog__listing__post__wrapper__content__readmore:hover{ color:var(--ur-navy) !important; }
.simpleblog__listing__post__wrapper__content__readmore:hover .text-underline{ text-decoration:underline; }

/* Footer carte : date + catégorie */
.simpleblog__listing__post__wrapper__footer{
  border-top:1px solid var(--ur-border); padding:14px 0 18px !important; margin-top:16px !important;
  display:flex; flex-wrap:wrap; gap:16px; font-size:12px;
}
.simpleblog__listing__post__wrapper__footer__block{ margin:0 !important; color:var(--ur-muted); }
.simpleblog__listing__post__wrapper__footer__block i{ color:var(--ur-green); margin-right:5px; }
.simpleblog__listing__post__wrapper__footer__block a{ color:var(--ur-green) !important; font-weight:600; text-decoration:none; }
.simpleblog__listing__post__wrapper__footer__block a:hover{ color:var(--ur-navy) !important; }

/* Pagination blog */
.simpleblog__listing__pagination{
  display:flex; align-items:center; flex-wrap:wrap; gap:14px;
  margin-top:26px; padding-top:18px; border-top:1px solid var(--ur-border);
}
.simpleblog__listing__pagination > div{ padding:0 !important; margin:0 !important; }
.simpleblog__listing__pagination > div:first-child{ font-size:13px; color:var(--ur-text2); flex:1 1 auto; }
.simpleblog__listing__pagination .page-list{
  display:flex; gap:6px; list-style:none; margin:0; padding:0; justify-content:flex-end; flex-wrap:wrap;
}
.simpleblog__listing__pagination .page-list li a{
  display:inline-flex; align-items:center; gap:5px;
  min-width:38px; height:38px; padding:0 12px; justify-content:center;
  border:1.5px solid var(--ur-border); border-radius:7px;
  font-size:13px; font-weight:600; color:var(--ur-navy) !important; text-decoration:none;
  transition:all .15s;
}
.simpleblog__listing__pagination .page-list li a:hover{ border-color:var(--ur-navy); background:var(--ur-bg); }
.simpleblog__listing__pagination .page-list li.current a{
  background:var(--ur-navy); border-color:var(--ur-navy); color:#fff !important;
}


/* ════════════════════════════════════════════════════════════
   HOME — BLOC "NOS MARQUES DISTRIBUÉES"  (widget Elementor Brands natif)
   DOM : .elementor-brands > ...swiper... > .swiper-slide > a > img
   On stylise le carrousel de logos : cadre, séparateurs, hover.
════════════════════════════════════════════════════════════ */
/* Bandeau global du bloc */
.elementor-brands{
  background:#fff; padding:8px 0;
}
/* Chaque slide = une cellule avec séparateur vertical */
.elementor-brands .swiper-slide{
  display:flex !important; align-items:center; justify-content:center;
  border-right:1px solid var(--ur-border); min-height:90px;
}
.elementor-brands .swiper-slide:last-child{ border-right:0; }
.elementor-brands .swiper-slide a{
  display:flex; align-items:center; justify-content:center;
  width:100%; height:100%; padding:14px 18px; text-decoration:none;
}
/* Logos : taille homogène, TOUJOURS en couleur, léger zoom au survol */
.elementor-brands .swiper-slide img{
  max-width:100%; max-height:72px; width:auto; height:auto; object-fit:contain;
  filter:none; opacity:1; transition:transform .2s;
}
.elementor-brands .swiper-slide a:hover img{
  transform:scale(1.04);
}

/* Titre de section "Nos marques distribuées" :
   pose la classe .ur-brands-head sur le widget Heading (Avancé > CSS classes) */
.ur-brands-head .elementor-heading-title,
.ur-brands-head .elementor-heading-title span{
  font-size:10px !important; font-weight:700 !important; color:var(--ur-muted) !important;
  letter-spacing:.15em !important; text-transform:uppercase; text-align:center;
}


/* ════════════════════════════════════════════════════════════
   HOME — BANDEAU CLIENTS "ILS NOUS FONT CONFIANCE"  (.ur-clients*)
   Widget HTML Elementor (markup + script de duplication fournis).
   Bande claire compacte : titre à gauche + défilement une ligne à droite.
   Logos posés en tuiles blanches pour neutraliser les fonds de couleur
   (McDo, Ibis, Leonidas, Pitaya…). Hébergement : /img/cms/clients/.
════════════════════════════════════════════════════════════ */
.ur-clients{
  background:#fff;
  border-top:1px solid var(--ur-border);
  border-bottom:1px solid var(--ur-border);
  display:flex; align-items:center; gap:24px;
  max-width:1320px; margin:0 auto;
  padding:20px 24px; overflow:hidden;
}
/* Titre (gauche) */
.ur-clients__title{ flex:0 0 auto; }
.ur-clients__title strong{
  display:block; font-size:15px; font-weight:800; color:var(--ur-navy); line-height:1.2;
}
.ur-clients__title span{
  display:block; font-size:12px; color:var(--ur-muted); margin-top:2px;
}
/* Piste défilante masquée par un dégradé aux extrémités */
.ur-clients__mask{ flex:1 1 auto; min-width:0; overflow:hidden; position:relative; }
.ur-clients__mask::before,
.ur-clients__mask::after{
  content:""; position:absolute; top:0; bottom:0; width:48px; z-index:2; pointer-events:none;
}
.ur-clients__mask::before{ left:0;  background:linear-gradient(90deg,#fff,rgba(255,255,255,0)); }
.ur-clients__mask::after{  right:0; background:linear-gradient(270deg,#fff,rgba(255,255,255,0)); }
.ur-clients__track{
  display:flex; gap:12px; width:max-content;
  animation:ur-clients-scroll 40s linear infinite;
}
.ur-clients:hover .ur-clients__track{ animation-play-state:paused; }
/* Tuile logo */
.ur-clients__tile{
  flex:0 0 auto;
  background:var(--ur-bg); border:1px solid var(--ur-border); border-radius:8px;
  height:66px; min-width:118px;
  display:flex; align-items:center; justify-content:center; padding:10px 14px;
}
.ur-clients__tile img{
  max-width:92px; max-height:44px; width:auto; height:auto; object-fit:contain; display:block;
}
/* La piste contient la liste DUPLIQUÉE 2× → -50% = un cycle complet sans saut */
@keyframes ur-clients-scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

@media (max-width:900px){
  .ur-clients{ flex-direction:column; align-items:stretch; gap:14px; padding:18px 16px; }
  .ur-clients__title{ text-align:center; }
}
/* Accessibilité : pas d'animation si l'utilisateur la refuse */
@media (prefers-reduced-motion:reduce){
  .ur-clients__track{ animation:none; }
  .ur-clients__mask{ overflow-x:auto; }
}


/* ════════════════════════════════════════════════════════════
   HOME — FAQ (widget Elementor Accordion)
   Pose la classe .ur-faq sur le widget Accordion (Avancé > CSS classes).
   Pour 2 colonnes : mets 2 widgets Accordion dans une section 2 colonnes,
   chacun avec la classe .ur-faq.
════════════════════════════════════════════════════════════ */
.ur-faq .elementor-accordion{ display:flex; flex-direction:column; gap:10px; }
.ur-faq .elementor-toggle{ display:flex; flex-direction:column; gap:10px; }

/* Item (Accordion ET Toggle) */
.ur-faq .elementor-accordion-item,
.ur-faq .elementor-toggle-item{
  border:1px solid var(--ur-border) !important; border-radius:10px !important;
  overflow:hidden; background:#fff;
  transition:border-color .15s, box-shadow .15s;
}
.ur-faq .elementor-accordion-item:hover,
.ur-faq .elementor-toggle-item:hover{ border-color:var(--ur-navy) !important; }

/* Question (titre cliquable) — Accordion + Toggle */
.ur-faq .elementor-tab-title{
  border:0 !important; margin:0 !important;
  padding:16px 18px !important; cursor:pointer;
  font-size:14.5px !important; font-weight:600 !important; color:var(--ur-navy) !important;
  display:flex; align-items:center; gap:0;
  transition:background .15s;
}
.ur-faq .elementor-tab-title:hover{ background:var(--ur-bg); }
.ur-faq .elementor-tab-title.elementor-active{ background:var(--ur-bg); }
/* Le libellé de la question prend tout l'espace, l'icône reste à sa place */
.ur-faq .elementor-toggle-title{ flex:1; }

/* Icône +/− en PASTILLE RONDE colorée (comme la maquette v5) —
   Elementor sort .elementor-accordion-icon contenant 1 ou 2 <i> (plus/minus).
   On transforme le conteneur en pastille et on centre le glyphe dedans. */
.ur-faq .elementor-accordion-icon,
.ur-faq .elementor-tab-title .elementor-accordion-icon{
  width:28px !important; height:28px !important; min-width:28px !important; flex:0 0 28px;
  border-radius:50% !important; padding:0 !important; margin:0 12px 0 0 !important;
  background:var(--ur-orange-l) !important; color:var(--ur-orange-h) !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  font-size:13px !important; line-height:1 !important; transition:background .15s, color .15s;
}
/* Le glyphe FA centré, sans marge propre */
.ur-faq .elementor-accordion-icon i,
.ur-faq .elementor-accordion-icon svg{
  margin:0 !important; padding:0 !important; line-height:1 !important;
  font-size:13px !important; width:auto !important; height:auto !important;
  display:flex !important; align-items:center; justify-content:center; color:inherit !important;
}
.ur-faq .elementor-accordion-icon svg{ width:12px !important; height:12px !important; fill:currentColor; }
/* État OUVERT : pastille orange pleine, glyphe blanc */
.ur-faq .elementor-tab-title.elementor-active .elementor-accordion-icon{
  background:var(--ur-orange) !important; color:#fff !important;
}
/* Icône à droite si Elementor la place ainsi */
.ur-faq .elementor-accordion-icon-right{ margin:0 0 0 auto !important; }
.ur-faq .elementor-accordion-icon-left{ margin:0 12px 0 0 !important; }

/* Réponse (panneau) — Accordion + Toggle */
.ur-faq .elementor-tab-content{
  border:0 !important; padding:0 18px 18px 58px !important;
  font-size:13.5px; line-height:1.65; color:var(--ur-text2);
}

/* Titre "Questions fréquentes" si tu poses .ur-faq-head sur le Heading */
.ur-faq-head .elementor-heading-title{
  text-align:center; color:var(--ur-navy) !important; font-size:24px !important; font-weight:800 !important;
}


/* ════════════════════════════════════════════════════════════
   HOME — BLOC VISUEL "NOTRE SÉLECTION" (Mobilier, Art de la table…)
   Pattern : visuel coloré à gauche + carrousel produits à droite.
   Le visuel = widget HTML .ur-selvisual (skin navy/green/orange).
   Le carrousel = widget Products natif à côté, dans une section 2 colonnes.
════════════════════════════════════════════════════════════ */
.ur-selvisual{
  border-radius:12px !important; padding:30px; min-height:300px; height:100%;
  display:flex; flex-direction:column; justify-content:space-between;
  color:#fff; position:relative; overflow:hidden;
  background:linear-gradient(150deg,var(--ur-navy),var(--ur-navy-h));
}
/* La colonne Elementor et ses wrappers doivent filer toute la hauteur
   pour que la carte (height:100%) remplisse la colonne au niveau du carrousel. */
.ur-split{ align-items:stretch; }
.ur-split > .elementor-container > .elementor-column,
.ur-split .elementor-column.ur-selvisual--green,
.ur-split .elementor-column.ur-selvisual--orange,
.ur-split .elementor-column.ur-selvisual--brown{ display:flex; }
.ur-split .elementor-column .elementor-column-wrap,
.ur-split .elementor-column .elementor-widget-wrap,
.ur-split .elementor-widget-html,
.ur-split .elementor-widget-html .elementor-widget-container{
  width:100%; height:100%; display:flex; flex-direction:column;
}
/* Si la classe skin est posée sur la COLONNE (cas de ton DOM : elementor-column
   ... ur-selvisual--green), la colonne hérite du dégradé en CARRÉ derrière la
   carte arrondie → coin foncé qui dépasse. On force la colonne transparente :
   le dégradé reste uniquement sur la carte interne .ur-selvisual (arrondie). */
.elementor-column.ur-selvisual--green,
.elementor-column.ur-selvisual--orange,
.elementor-column.ur-selvisual--brown,
.elementor-column.ur-selvisual--photo,
.elementor-column.ur-selvisual{
  background:transparent !important; background-image:none !important;
}
.ur-selvisual--green{ background:linear-gradient(150deg,var(--ur-green-d,#3d544e),var(--ur-green)); }
.ur-selvisual--orange{ background:linear-gradient(150deg,var(--ur-orange-h),var(--ur-orange)); color:var(--ur-navy); }
.ur-selvisual--brown{ background:linear-gradient(150deg,#5c1a00,#a03200); }

/* — Variante PHOTO : image de fond + voile navy pour lisibilité du texte.
     Usage : poser .ur-selvisual--photo sur la carte + l'image en inline :
     <div class="ur-selvisual ur-selvisual--photo"
          style="background-image:url('/img/cms/home/art_de_la_table.jpg')"> … </div>
     (voile réglable via --ur-selvisual-scrim ; teinte orange possible, voir plus bas) */
.ur-selvisual--photo{
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  color:#fff;
}
.ur-selvisual--photo::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:var(--ur-selvisual-scrim,
    linear-gradient(150deg, rgba(0,33,54,.80) 0%, rgba(0,33,54,.40) 55%, rgba(0,33,54,.15) 100%));
}
/* le contenu passe au-dessus du voile */
.ur-selvisual--photo > *{ position:relative; z-index:1; }
/* teinte orange optionnelle par-dessus la photo : ajouter aussi .ur-selvisual--tint-orange */
.ur-selvisual--photo.ur-selvisual--tint-orange::before{
  background:linear-gradient(150deg, rgba(232,146,15,.86) 0%, rgba(250,166,51,.55) 100%);
}
.ur-selvisual--photo.ur-selvisual--tint-orange{ color:var(--ur-navy); }
.ur-selvisual__eyebrow{
  font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  opacity:.7; margin-bottom:8px;
}
.ur-selvisual__title{
  display:block; font-size:27px; font-weight:800; line-height:1.1; letter-spacing:-.01em; margin:0;
}
.ur-selvisual__arrow{ font-size:46px; align-self:flex-end; opacity:.85; margin:18px 0; line-height:1; }
.ur-selvisual__btn{
  display:inline-flex; align-items:center; gap:8px; align-self:flex-start;
  background:var(--ur-orange); color:var(--ur-navy) !important;
  padding:11px 22px; border-radius:7px; font-size:13px; font-weight:700;
  text-decoration:none; transition:background .15s;
}
.ur-selvisual--orange .ur-selvisual__btn{ background:var(--ur-navy); color:#fff !important; }
.ur-selvisual__btn:hover{ filter:brightness(.95); }
/* Badge optionnel en haut du visuel (ex. "🔥 Ça cartonne") */
.ur-selvisual__badge{
  display:inline-flex; align-items:center; gap:6px; align-self:flex-start;
  background:rgba(250,166,51,.18); color:var(--ur-orange); 
  font-size:11px; font-weight:700; letter-spacing:.04em;
  padding:5px 12px; border-radius:20px; margin-bottom:12px;
}
.ur-selvisual--orange .ur-selvisual__badge{ background:rgba(0,33,54,.12); color:var(--ur-navy); }

/* Quand le visuel et le carrousel sont dans une section 2 colonnes Elementor :
   pose la classe .ur-split sur la SECTION pour coller les 2 colonnes proprement. */
.ur-split > .elementor-container{ align-items:stretch !important; gap:20px; }
.ur-split .elementor-column{ padding:0 !important; }


/* ════════════════════════════════════════════════════════════
   HOME — BANDEAU "DEPUIS PLUS DE 10 ANS" (image gauche + panneau vert droite)
   Widget HTML .ur-story à coller dans une section pleine largeur.
════════════════════════════════════════════════════════════ */
.ur-story{
  display:grid; grid-template-columns:minmax(280px,460px) 1fr;
  border-radius:14px; overflow:hidden; background:var(--ur-green);
}
.ur-story__img{
  background-size:cover; background-position:center; min-height:340px;
}
.ur-story__body{
  padding:44px 48px; color:#fff; display:flex; flex-direction:column; justify-content:center;
}
.ur-story__body h2{
  font-size:30px; font-weight:800; line-height:1.18; letter-spacing:-.01em; margin:0 0 18px;
  color:#fff;
}
.ur-story__body p{
  font-size:14.5px; line-height:1.65; color:rgba(255,255,255,.85); margin:0 0 24px; max-width:560px;
}
.ur-story__body p strong,
.ur-story__body p b{ color:var(--ur-orange); font-weight:700; }
.ur-story__btn{
  display:inline-flex; align-items:center; gap:8px; align-self:flex-start;
  background:var(--ur-orange); color:var(--ur-navy) !important;
  padding:12px 26px; border-radius:7px; font-size:14px; font-weight:700;
  text-decoration:none; transition:background .15s;
}
.ur-story__btn:hover{ background:var(--ur-orange-h); }

@media(max-width:860px){
  .ur-story{ grid-template-columns:1fr; }
  .ur-story__img{ min-height:220px; }
  .ur-story__body{ padding:30px 26px; }
  .ur-story__body h2{ font-size:23px; }
}


/* ════════════════════════════════════════════════════════════
   CARTES DE CARROUSEL HOME (widget Elementor ProductsList)
   Structure DOM différente des miniatures catégorie :
   .product-miniature-layout-1 > .thumbnail-container + .product-description
   (.product-category-name, .product-title h2.h3, .product-brand,
    .product-reference, .product-price-and-shipping > .product-price,
    .product-description-short, .product-add-cart)
════════════════════════════════════════════════════════════ */
.elementor-products .product-miniature{
  background:#fff; border:1.5px solid var(--ur-border); border-radius:10px;
  overflow:hidden; height:100%; display:flex !important; flex-direction:column !important;
  transition:border-color .15s, box-shadow .15s;
}
.elementor-products .product-miniature:hover{ border-color:var(--ur-navy); box-shadow:0 8px 22px rgba(0,33,54,.10); }

/* Image */
.elementor-products .thumbnail-container{
  position:relative; height:190px; background:var(--ur-bg); flex-shrink:0; overflow:hidden;
}
.elementor-products .thumbnail-container .product-thumbnail{ display:block; width:100%; height:100%; }
.elementor-products .thumbnail-container img{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  max-width:calc(100% - 24px); max-height:170px; width:auto; height:auto;
  object-fit:contain; mix-blend-mode:multiply;
}
.elementor-products .thumbnail-container .product-thumbnail-second{ opacity:0; transition:opacity .2s; }
.elementor-products .product-miniature:hover .product-thumbnail-second{ opacity:1; }

/* Corps de carte */
.elementor-products .product-description{
  padding:14px 15px; display:flex; flex-direction:column; flex:1 1 auto; text-align:left;
}
/* Catégorie (petit label gris au-dessus du titre) */
.elementor-products .product-category-name{
  font-size:11px !important; color:var(--ur-muted) !important; margin:0 0 4px;
  text-transform:uppercase; letter-spacing:.04em; font-weight:600;
}
/* Titre produit */
.elementor-products .product-title{ margin:0 0 6px !important; }
.elementor-products .product-title a{
  font-size:13.5px !important; font-weight:600 !important; color:var(--ur-text) !important;
  line-height:1.35; text-decoration:none;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.elementor-products .product-title a:hover{ color:var(--ur-navy) !important; }
/* Marque + référence */
.elementor-products .product-brand{ font-size:11.5px !important; color:var(--ur-muted) !important; margin:0 0 1px; }
.elementor-products .product-brand a{ color:var(--ur-green) !important; font-weight:600; text-decoration:none; }
.elementor-products .product-reference{ font-size:11px !important; color:var(--ur-muted) !important; margin:0 0 8px; }
.elementor-products .product-reference a{ color:var(--ur-muted) !important; text-decoration:none; }
/* Description courte : masquée dans la carte (trop longue) */
.elementor-products .product-description-short{ display:none !important; }
/* Prix en navy */
.elementor-products .product-price-and-shipping{ margin:auto 0 10px; }
.elementor-products .product-price{
  font-size:19px !important; font-weight:800 !important; color:var(--ur-navy) !important;
}
.elementor-products .product-price-and-shipping a{ text-decoration:none; }
/* Bouton ajouter au panier */
.elementor-products .product-add-cart{ margin-top:auto; }
.elementor-products .input-group-add-cart{ display:flex; gap:0; }
.elementor-products .input-group-add-cart .input-qty{
  width:46px !important; height:42px; text-align:center; border:1.5px solid var(--ur-border) !important;
  border-right:0 !important; border-radius:6px 0 0 6px !important; font-weight:600; color:var(--ur-navy);
}
.elementor-products .add-to-cart{
  flex:1; height:42px; background:var(--ur-navy) !important; color:#fff !important; border:0 !important;
  border-radius:0 6px 6px 0 !important; font-size:13px; font-weight:700;
  display:flex; align-items:center; justify-content:center; gap:7px; transition:background .15s;
}
.elementor-products .add-to-cart:hover{ background:var(--ur-navy-h) !important; }
.elementor-products .add-to-cart .spinner-icon{ display:none; }

/* Boutons fonctionnels (wishlist/aperçu) en haut à droite au survol */
.elementor-products .product-miniature{ position:relative; }
.elementor-products .product-functional-buttons{
  position:absolute !important; top:10px; right:10px; left:auto; bottom:auto;
  z-index:5; opacity:0; transform:translateX(6px); transition:opacity .15s, transform .15s;
}
.elementor-products .product-miniature:hover .product-functional-buttons{ opacity:1; transform:none; }
.elementor-products .product-functional-buttons-links{ display:flex; flex-direction:column; align-items:flex-end; gap:6px; }
.elementor-products .product-functional-buttons-links > a{
  width:34px; height:34px; border-radius:50%; background:#fff; border:1px solid var(--ur-border);
  color:var(--ur-navy); display:flex; align-items:center; justify-content:center; font-size:13px;
  box-shadow:0 2px 8px rgba(0,33,54,.12); transition:all .15s;
}
.elementor-products .product-functional-buttons-links > a:hover{ background:var(--ur-navy); color:#fff; border-color:var(--ur-navy); }


/* ════════════════════════════════════════════════════════════
   HOME — "UNE SÉLECTION DE PREMIER CHOIX" (vignettes gammes)
   Widget HTML .ur-gammes — 5 vignettes image + overlay + label.
════════════════════════════════════════════════════════════ */
.ur-gammes{
  display:grid; grid-template-columns:repeat(5,1fr); gap:16px;
}
.ur-gamme{
  position:relative; border-radius:12px; overflow:hidden; height:280px;
  display:flex; align-items:flex-start; padding:20px; text-decoration:none;
}
.ur-gamme__bg{
  position:absolute; inset:0; background-size:cover; background-position:center;
  z-index:0; transition:transform .4s ease;
}
.ur-gamme:hover .ur-gamme__bg{ transform:scale(1.06); }
.ur-gamme::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(0,33,54,.15) 0%,rgba(0,33,54,.78) 100%);
}
.ur-gamme__label{ position:relative; z-index:2; }
.ur-gamme__eyebrow{
  font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ur-orange); margin-bottom:2px;
}
.ur-gamme__title{ font-size:19px; font-weight:800; color:#fff; line-height:1.1; }

@media(max-width:992px){ .ur-gammes{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:600px){ .ur-gammes{ grid-template-columns:1fr 1fr; } .ur-gamme{ height:200px; } }

/* ── Version WIDGET IMAGE BOX (recommandée pour édition client) ──
   Section 5 colonnes, 1 widget Image Box par colonne.
   Pose la classe .ur-gammes-box sur la SECTION (Avancé > CSS classes).
   Dans chaque Image Box : choisis l'image, mets le Titre (= nom de la gamme),
   la Description (= "Gamme", facultatif) et le lien. */
.ur-gammes-box .elementor-widget-image-box{ height:100%; }
.ur-gammes-box .elementor-image-box-wrapper{
  position:relative; border-radius:12px; overflow:hidden; height:280px;
  display:flex; align-items:flex-end; margin:0;
}
/* L'image remplit la vignette (fond) */
.ur-gammes-box .elementor-image-box-img{
  position:absolute !important; inset:0; margin:0 !important; width:100% !important; z-index:0;
}
.ur-gammes-box .elementor-image-box-img img{
  width:100%; height:100%; object-fit:cover; border-radius:0;
  transition:transform .4s ease;
}
.ur-gammes-box .elementor-image-box-wrapper:hover .elementor-image-box-img img{ transform:scale(1.06); }
/* Overlay dégradé sombre pour lisibilité */
.ur-gammes-box .elementor-image-box-wrapper::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(0,33,54,.12) 0%,rgba(0,33,54,.78) 100%);
}
/* Le contenu (titre + description) en bas, par-dessus l'overlay */
.ur-gammes-box .elementor-image-box-content{
  position:relative; z-index:2; padding:20px; text-align:left; width:100%;
}
.ur-gammes-box .elementor-image-box-title{
  color:#fff !important; font-size:19px !important; font-weight:800 !important;
  margin:0 !important; line-height:1.1; order:2;
}
.ur-gammes-box .elementor-image-box-description{
  color:var(--ur-orange) !important; font-size:10px !important; font-weight:600 !important;
  letter-spacing:.08em; text-transform:uppercase; margin:0 0 2px !important; order:1;
}
/* Empile description (eyebrow) au-dessus du titre */
.ur-gammes-box .elementor-image-box-content{ display:flex; flex-direction:column; }
@media(max-width:600px){ .ur-gammes-box .elementor-image-box-wrapper{ height:200px; } }


/* ════════════════════════════════════════════════════════════
   HOME — SLIDE FULL MOBILIER (hero pleine largeur, image + carte orange)
   Widget HTML .ur-hero-slide (ou slide nkslide avec ce markup).
════════════════════════════════════════════════════════════ */
.ur-hero-slide{ position:relative; border-radius:14px; overflow:hidden; height:420px; display:flex; align-items:center; }
.ur-hero-slide__bg{ position:absolute; inset:0; background-size:cover; background-position:center; z-index:0; }
.ur-hero-slide__card{
  position:relative; z-index:2; margin-left:auto; margin-right:6%;
  background:var(--ur-orange); border-radius:12px; padding:34px 44px; max-width:440px;
  box-shadow:0 14px 40px rgba(0,33,54,.22); overflow:hidden;
}
.ur-hero-slide__card::after{ content:""; position:absolute; right:-30px; bottom:-40px; width:200px; height:200px; background:rgba(255,255,255,.12); border-radius:50%; }
.ur-hero-slide__eyebrow{ font-size:16px; color:#fff; font-weight:500; margin-bottom:10px; position:relative; z-index:1; }
.ur-hero-slide__eyebrow b{ font-weight:800; }
.ur-hero-slide__title{ font-size:42px; font-weight:800; color:var(--ur-navy); line-height:1.05; letter-spacing:-.01em; position:relative; z-index:1; }
.ur-hero-slide__btn{ position:absolute; left:34px; bottom:34px; z-index:2; background:var(--ur-orange); color:#fff !important; padding:13px 30px; border-radius:8px; font-size:15px; font-weight:600; text-decoration:none; transition:background .15s; }
.ur-hero-slide__btn:hover{ background:var(--ur-orange-h); }
@media(max-width:860px){
  .ur-hero-slide{ height:auto; min-height:340px; }
  .ur-hero-slide__card{ margin:0 16px; max-width:none; }
  .ur-hero-slide__title{ font-size:32px; }
}

/* ════════════════════════════════════════════════════════════
   HOME — 2 BLOCS PUB  (widget IMAGE BOX + widget BUTTON dans une colonne)
   Structure Elementor :
     Section 2 colonnes → chaque colonne porte la classe de skin :
       .ur-pub--orange  (matériel cuisson)
       .ur-pub--grey    (gamme froid Polar)
     Dans la colonne : 1 widget Image Box + 1 widget Button.
   Le FOND (couleur + image produit à droite) est sur la COLONNE.
════════════════════════════════════════════════════════════ */
/* La colonne = la carte pub */
.ur-pub--orange,
.ur-pub--grey{
  position:relative; border-radius:14px; overflow:hidden;
  padding:36px 40px !important; min-height:230px;
  display:flex !important; flex-direction:column; justify-content:center;
  background-repeat:no-repeat;
}
/* Espace entre les 2 colonnes (elles se touchaient).
   Comme ce sont des colonnes Elementor accolées, on ajoute une marge
   latérale interne à chaque carte. */
.ur-pub--orange{ margin-right:11px; }
.ur-pub--grey{ margin-left:11px; }
@media(max-width:860px){
  .ur-pub--orange,.ur-pub--grey{ margin:0 0 18px 0; }
}
/* Skin orange (matériel cuisson) — image produit à droite via background */
.ur-pub--orange{
  background-color:var(--ur-orange);
  background-position:right -20px center; background-size:auto 90%;
  /* mets l'image du piano via Style > Arrière-plan de la colonne dans Elementor,
     OU décommente et renseigne l'URL ici :
     background-image:url('URL_PIANO'); */
}
.ur-pub--grey{
  background-color:#dfe3e8;
  background:linear-gradient(135deg,#e8eaed,#d3d7dd);
  background-position:right -20px center; background-size:auto 90%;
  /* background-image:url('URL_FRIGO_POLAR'); */
}

/* Image Box : on neutralise sa mise en page native, texte à gauche */
.ur-pub--orange .elementor-image-box-wrapper,
.ur-pub--grey .elementor-image-box-wrapper{
  display:block; text-align:left; margin:0; max-width:70%;
}
/* On masque l'image DANS l'Image Box (l'image produit est en fond de colonne).
   Si tu préfères l'image dans l'Image Box plutôt qu'en fond, retire cette règle. */
.ur-pub--orange .elementor-image-box-img,
.ur-pub--grey .elementor-image-box-img{ display:none !important; }
.ur-pub--orange .elementor-image-box-content,
.ur-pub--grey .elementor-image-box-content{ width:100% !important; }

/* Sur-titre (Description de l'Image Box) + Titre */
.ur-pub--orange .elementor-image-box-description,
.ur-pub--grey .elementor-image-box-description{
  font-size:15px !important; font-weight:500 !important; margin:0 0 6px !important;
}
.ur-pub--orange .elementor-image-box-title,
.ur-pub--grey .elementor-image-box-title{
  font-size:25px !important; font-weight:800 !important; line-height:1.2 !important; margin:0 !important;
}
/* Couleurs de texte par skin */
.ur-pub--orange .elementor-image-box-description{ color:rgba(0,33,54,.65) !important; }
.ur-pub--orange .elementor-image-box-title{ color:var(--ur-navy) !important; }
.ur-pub--grey .elementor-image-box-description{ color:var(--ur-text2) !important; }
.ur-pub--grey .elementor-image-box-title{ color:var(--ur-navy) !important; }

/* Bouton (widget Button sous l'Image Box) */
.ur-pub--orange .elementor-button{
  background:var(--ur-navy) !important; color:#fff !important; border:0 !important;
  padding:12px 26px !important; border-radius:7px !important;
  font-size:13.5px !important; font-weight:700 !important; margin-top:18px;
}
.ur-pub--orange .elementor-button:hover{ background:var(--ur-navy-h) !important; }
.ur-pub--grey .elementor-button{
  background:var(--ur-orange) !important; color:var(--ur-navy) !important; border:0 !important;
  padding:12px 26px !important; border-radius:7px !important;
  font-size:13.5px !important; font-weight:700 !important; margin-top:18px;
}
.ur-pub--grey .elementor-button:hover{ background:var(--ur-orange-h) !important; }
/* Aligner le bouton à gauche dans la colonne */
.ur-pub--orange .elementor-widget-button,
.ur-pub--grey .elementor-widget-button{ text-align:left; }

@media(max-width:860px){
  .ur-pub--orange,.ur-pub--grey{ background-size:auto 60%; background-position:right bottom; }
  .ur-pub--orange .elementor-image-box-wrapper,
  .ur-pub--grey .elementor-image-box-wrapper{ max-width:100%; }
}
/* ============================================================
   Universrestau — Méga-menu style Metro (Custom CSS du thème)
   Scopé sous .urest-mm : n'affecte que les méga-menus.
   v2 : pleine largeur + libellés multi-lignes (plus de chevauchement).
   ============================================================ */

.urest-mm{
  --navy:#002136; --green:#4D6A63; --green2:#3d5550;
  --orange:#FAA633; --orange2:#e8920f; --orange-light:#fff8ec;
  --bg:#F4F6F8; --border:#DDE1E7; --text:#0F1E2B; --text2:#4A5568;
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:#fff; color:var(--text);
  padding:22px 28px; border-radius:8px; border-top:3px solid var(--orange);
  width:100%;                      /* pleine largeur */
  box-shadow:0 8px 30px rgba(0,0,0,.08);
  /* défilement interne quand le contenu dépasse l'écran (ajuste 180px = hauteur en-tête+nav) */
  max-height:calc(100vh - 180px);
  overflow-y:auto;
  overflow-x:hidden;
}
/* barre de défilement discrète */
.urest-mm::-webkit-scrollbar{width:10px}
.urest-mm::-webkit-scrollbar-thumb{background:var(--border); border-radius:6px; border:3px solid #fff}
.urest-mm::-webkit-scrollbar-thumb:hover{background:#c2c9d2}
.urest-mm{scrollbar-width:thin; scrollbar-color:var(--border) #fff}
.urest-mm *{box-sizing:border-box}
.urest-mm a{text-decoration:none; color:inherit}

/* En-tête de rubrique */
.urest-mm .mega-hd{display:flex; align-items:center; justify-content:space-between;
  margin-bottom:16px; padding-bottom:13px; border-bottom:1px solid var(--border)}
.urest-mm .mega-hd-title{display:flex; align-items:center; gap:10px;
  font-size:16px; font-weight:700; color:var(--navy)}
.urest-mm .mega-hd-title svg{width:22px; height:22px; color:var(--orange); flex:0 0 auto}
.urest-mm .mega-see-all{color:var(--navy); font-size:12px; font-weight:600;
  background:var(--bg); padding:6px 14px; border-radius:5px; transition:background .15s; white-space:nowrap}
.urest-mm .mega-see-all:hover{background:var(--orange-light); color:var(--orange2)}

/* Sections (sous-rubriques) */
.urest-mm .mega-sub{margin-top:16px}
.urest-mm .mega-sub:first-of-type{margin-top:0}
.urest-mm .mega-sub + .mega-sub{border-top:1px solid var(--border); padding-top:14px}
.urest-mm .mega-sub-title{display:flex; align-items:center; gap:8px;
  font-size:11.5px; font-weight:700; color:var(--green);
  letter-spacing:.06em; text-transform:uppercase; margin-bottom:12px}
.urest-mm .mega-sub-title svg{width:17px; height:17px; color:var(--green2); flex:0 0 auto}
.urest-mm .mega-sub-title a:hover{color:var(--orange2)}

/* Grille d'icônes rondes — remplit toute la largeur, colonnes régulières */
.urest-mm .mega-circles{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));
  gap:10px 6px;
}
.urest-mm .mega-ci{display:flex; flex-direction:column; align-items:center; gap:8px;
  width:100%; padding:12px 4px; border-radius:8px; border:1.5px solid transparent;
  transition:all .15s; text-align:center}
.urest-mm .mega-ci:hover{background:var(--bg); border-color:var(--border)}
.urest-mm .mega-ci.feat{border-color:var(--orange)}
.urest-mm .mega-ci.feat:hover{background:var(--orange-light)}
.urest-mm .mega-circle{width:60px; height:60px; border-radius:50%; flex:0 0 auto;
  background:var(--bg); border:1.5px solid var(--border);
  display:flex; align-items:center; justify-content:center; transition:all .15s; color:var(--orange)}
.urest-mm .mega-ci:hover .mega-circle{border-color:var(--navy)}
.urest-mm .mega-ci.feat .mega-circle{border-color:var(--orange); background:var(--orange-light)}
.urest-mm .mega-circle svg{width:31px; height:31px}

/* Libellés : bloc, largeur fixe, passage à la ligne propre (fin du chevauchement) */
.urest-mm .mega-ci-lbl{
  display:block;
  width:100%;
  max-width:140px;
  margin:0 auto;
  font-size:11px; line-height:1.3; font-weight:500; color:var(--text);
  white-space:normal;
  overflow-wrap:break-word;
  word-break:break-word;
  hyphens:auto;
}
.urest-mm .mega-ci:hover .mega-ci-lbl{color:var(--navy)}
.urest-mm .mega-ci.feat .mega-ci-lbl{color:var(--orange2); font-weight:600}

/* Icônes SVG (tracé ligne, couleur héritée) */
.urest-mm svg.ic{fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round}

/* Écrans étroits */
@media (max-width:600px){
  .urest-mm{padding:16px}
  .urest-mm .mega-circles{grid-template-columns:repeat(auto-fill, minmax(110px, 1fr))}
  .urest-mm .mega-ci-lbl{max-width:110px}
}

/* ────────────────────────────────────────────────────────────
   VARIANTE V1 — "photo produit par gamme + sous-catégories en TEXTE"
   Opt-in : ajouter la classe .mm-v2 sur le conteneur .urest-mm.
   Réutilise le markup .mega-* ; les bulles/icônes par item sont masquées.
   Markup attendu :
     <div class="urest-mm mm-v2"> <div class="mega-hd">…</div>
       <div class="mega-subs">
         <div class="mega-sub [mega-sub--wide]">
           <div class="mega-sub-title">
             <span class="mega-fam-img"><img src="/img/cms/menu/xxx.png" alt=""></span>
             <a href="/153-…">Nom de la gamme</a>
           </div>
           <div class="mega-circles">
             <a class="mega-ci [feat]" href="…"><span class="mega-ci-lbl">Sous-cat</span></a> …
           </div>
         </div> …
       </div>
     </div>
   ──────────────────────────────────────────────────────────── */
/* Bouton "Tout voir" : bleu nuit plein (au lieu du gris) */
.urest-mm.mm-v2 .mega-see-all{
  background:var(--navy); color:#fff; font-weight:700; padding:8px 16px; border-radius:6px;
}
.urest-mm.mm-v2 .mega-see-all:hover{background:#013a5e; color:#fff}

.urest-mm.mm-v2 .mega-subs{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
  gap:26px 34px;
}
.urest-mm.mm-v2 .mega-sub{margin:0; padding:0; border:0}
.urest-mm.mm-v2 .mega-sub + .mega-sub{border:0; padding:0}
/* En-tête de gamme : bulle photo + nom + filet orange sous le titre */
.urest-mm.mm-v2 .mega-sub-title{
  display:flex; align-items:center; gap:13px;
  text-transform:none; letter-spacing:0; margin-bottom:12px;
  padding-bottom:12px; position:relative; border-bottom:1px solid var(--border);
}
.urest-mm.mm-v2 .mega-sub-title::after{
  content:""; position:absolute; left:0; bottom:-1px; width:46px; height:3px;
  background:var(--orange); border-radius:2px;
}
.urest-mm.mm-v2 .mega-fam-img{
  width:56px; height:56px; flex:0 0 auto; border-radius:50%;
  border:1px solid var(--border); background:var(--bg); overflow:hidden;
  display:flex; align-items:center; justify-content:center; transition:border-color .15s, box-shadow .15s;
}
.urest-mm.mm-v2 .mega-sub-title:hover .mega-fam-img{border-color:var(--orange); box-shadow:0 4px 14px rgba(250,166,51,.25)}
.urest-mm.mm-v2 .mega-fam-img img{width:100%; height:100%; object-fit:contain; padding:6px; mix-blend-mode:multiply}
.urest-mm.mm-v2 .mega-fam-img.is-empty{background:var(--bg)}
.urest-mm.mm-v2 .mega-sub-title a{font-weight:800; font-size:14.5px; color:var(--navy)}
.urest-mm.mm-v2 .mega-sub-title a:hover{color:var(--orange2)}
/* Sous-catégories en texte : puce + surlignage au survol (fini le rendu plat) */
.urest-mm.mm-v2 .mega-circles{display:flex; flex-direction:column; gap:0}
.urest-mm.mm-v2 .mega-circle{display:none}
.urest-mm.mm-v2 .mega-ci{
  flex-direction:row; align-items:center; gap:9px;
  width:100%; padding:6px 10px; border:0; border-radius:6px; text-align:left;
  transition:background .12s;
}
.urest-mm.mm-v2 .mega-ci::before{
  content:""; flex:0 0 auto; width:5px; height:5px; border-radius:50%;
  background:var(--border); transition:background .12s, transform .12s;
}
.urest-mm.mm-v2 .mega-ci:hover{background:var(--bg)}
.urest-mm.mm-v2 .mega-ci:hover::before{background:var(--orange); transform:scale(1.4)}
.urest-mm.mm-v2 .mega-ci-lbl{
  max-width:none; margin:0; text-align:left;
  font-size:12.5px; line-height:1.3; font-weight:500; color:var(--text2);
}
.urest-mm.mm-v2 .mega-ci:hover .mega-ci-lbl{color:var(--navy)}
/* plus de mise en avant "feat" : tous les liens au même niveau */
.urest-mm.mm-v2 .mega-ci.feat{border:0}
.urest-mm.mm-v2 .mega-ci.feat .mega-ci-lbl{color:var(--text2); font-weight:500}
/* Gamme seule (ex. Froid) : liste multi-colonnes + filets verticaux */
.urest-mm.mm-v2 .mega-sub--wide{grid-column:1 / -1}
.urest-mm.mm-v2 .mega-sub--wide .mega-circles{display:block; columns:3; column-gap:40px; column-rule:1px solid var(--border)}
.urest-mm.mm-v2 .mega-sub--wide .mega-ci{break-inside:avoid}
@media (max-width:820px){.urest-mm.mm-v2 .mega-sub--wide .mega-circles{columns:2}}
@media (max-width:600px){.urest-mm.mm-v2 .mega-sub--wide .mega-circles{columns:1}}

/* ────────────────────────────────────────────────────────────
   VARIANTE PHOTOS — grille À PLAT, cercles-photo par entrée (.mm-photos)
   Opt-in : <div class="urest-mm mm-photos"> … </div>
   • pas de regroupement par gamme → 2-3 rangées, très aéré
   • cercle photo (produit détouré) + libellé navy dessous
   • plus de scroll interne
   ──────────────────────────────────────────────────────────── */
.urest-mm.mm-photos{
  max-height:calc(100vh - 170px); overflow-y:auto; overflow-x:hidden;
  overscroll-behavior:contain; scrollbar-gutter:stable; padding:22px 30px 28px;
}
.urest-mm.mm-photos .mm-hd{ padding-bottom:14px; margin-bottom:20px; border-bottom:1px solid var(--border); }
.urest-mm.mm-photos .mm-all{
  display:inline-flex; align-items:center; gap:9px;
  color:var(--navy); font-size:17px; font-weight:800; text-decoration:none;
}
.urest-mm.mm-photos .mm-all:hover{ color:var(--orange2); }
.urest-mm.mm-photos .mm-all svg{ width:18px; height:18px; }
.urest-mm.mm-photos .mm-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));
  gap:24px 8px;
}
.urest-mm.mm-photos .mega-ci{
  display:flex; flex-direction:column; align-items:center; gap:12px;
  padding:0; border:0; text-align:center;
}
.urest-mm.mm-photos .mega-ci:hover{ background:transparent; border:0; }
.urest-mm.mm-photos .mega-circle{
  width:100px; height:100px; border-radius:50%; border:1px solid var(--border); background:#fff;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
  transition:border-color .15s, box-shadow .15s;
}
.urest-mm.mm-photos .mega-ci:hover .mega-circle{ border-color:#c7cdd4; box-shadow:0 6px 18px rgba(0,33,54,.10); }
.urest-mm.mm-photos .mega-circle img{ width:74px; height:74px; object-fit:contain; }
.urest-mm.mm-photos .mega-ci-lbl{
  max-width:140px; margin:0; font-size:13.5px; line-height:1.25; font-weight:700; color:var(--navy);
}
.urest-mm.mm-photos .mega-ci:hover .mega-ci-lbl{ color:var(--orange2); }
@media (max-width:900px){
  .urest-mm.mm-photos .mm-grid{ grid-template-columns:repeat(auto-fill, minmax(120px, 1fr)); gap:18px 6px; }
  .urest-mm.mm-photos .mega-circle{ width:82px; height:82px; }
  .urest-mm.mm-photos .mega-circle img{ width:60px; height:60px; }
  .urest-mm.mm-photos .mega-ci-lbl{ font-size:12px; }
}
/* ════════════════════════════════════════════════════════════
   PAGE CATÉGORIE — DESCRIPTION (bandeau navy + repli "voir la suite")
   DOM : .category-description > .rte-content
   Le titre du bandeau = titre de la catégorie (injecté par JS depuis h1.page-title).
════════════════════════════════════════════════════════════ */
.category-description{
  background:#fff; border:1px solid var(--ur-border); border-radius:12px;
  overflow:hidden; margin:0 0 24px;
}
/* (Le titre de la catégorie est porté par #js-product-list-header, collé au-dessus.
   Pas de bandeau interne ici.) */
/* Corps + repli */
.category-description .rte-content{
  padding:24px 28px; color:var(--ur-text2); font-size:14px; line-height:1.7;
  position:relative; max-height:200px; overflow:hidden; transition:max-height .4s ease;
}
.category-description .rte-content.ur-open{ max-height:6000px; }
.category-description .rte-content:not(.ur-open)::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:90px;
  background:linear-gradient(180deg,rgba(255,255,255,0),#fff); pointer-events:none;
}
/* Typo du contenu */
.category-description .rte-content p{ margin:0 0 13px; }
.category-description .rte-content h2{ font-size:19px; font-weight:800; color:var(--ur-navy); margin:22px 0 10px; letter-spacing:-.01em; }
.category-description .rte-content h3{ font-size:15px; font-weight:700; color:var(--ur-navy); margin:18px 0 7px; }
.category-description .rte-content ul{ margin:0 0 13px; padding-left:0; list-style:none; }
.category-description .rte-content li{ position:relative; padding-left:26px; margin-bottom:7px; }
.category-description .rte-content li::before{
  content:"\2713"; position:absolute; left:0; top:0; color:var(--ur-green); font-weight:700;
}
.category-description .rte-content a{ color:var(--ur-green); text-decoration:underline; }
.category-description .rte-content a:hover{ color:var(--ur-navy); }
.category-description .rte-content strong,
.category-description .rte-content b{ color:var(--ur-navy); }
/* Bouton pill orange centré */
.category-description .ur-catdesc-toggle{
  display:block; margin:0 auto 22px; background:var(--ur-orange); color:var(--ur-navy);
  border:0; padding:10px 24px; border-radius:30px; font-weight:700; font-size:13px;
  cursor:pointer; transition:background .15s;
}
.category-description .ur-catdesc-toggle:hover{ background:var(--ur-orange-h); }
/* ════════════════════════════════════════════════════════════
   BLOC PROMO 2 CARTES (V.B "panneau latéral") — .ur-promo
   Bandeau couleur à gauche (logo/picto) + contenu blanc à droite.
   Carte secteur public : logo dans .ur-promo__logo
════════════════════════════════════════════════════════════ */
.ur-promo{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.ur-promo__card{
  display:flex; background:#fff; border:1px solid var(--ur-border); border-radius:16px;
  overflow:hidden; min-height:172px; text-decoration:none;
  transition:transform .16s, box-shadow .16s;
}
.ur-promo__card:hover{ transform:translateY(-3px); box-shadow:0 18px 40px rgba(0,33,54,.10); }
/* Bandeau latéral coloré */
.ur-promo__side{
  flex:0 0 104px; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:30px;
}
.ur-promo__card--pub .ur-promo__side{ background:linear-gradient(160deg, #003a5c, var(--ur-navy)); }
.ur-promo__card--haccp .ur-promo__side{ background:linear-gradient(160deg, var(--ur-orange), var(--ur-orange-h)); color:var(--ur-navy); }
.ur-promo__logo{ height:66px; width:auto; display:block; border-radius:5px; }
/* Contenu */
.ur-promo__body{ padding:22px 24px; display:flex; flex-direction:column; }
.ur-promo__kick{ font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--ur-text2); }
.ur-promo__title{ display:block; font-size:21px; font-weight:800; color:var(--ur-navy); margin:6px 0; letter-spacing:-.01em; }
.ur-promo__body p{ font-size:13.5px; color:var(--ur-text2); line-height:1.5; margin:0; }
/* Bouton pill plein (repris de la piste C), couleur selon la carte */
.ur-promo__pill{
  margin-top:auto; align-self:flex-start; display:inline-flex; align-items:center; gap:8px;
  font-size:12.5px; font-weight:800; color:#fff; padding:10px 18px; border-radius:24px;
  transition:background .16s, transform .16s;
}
.ur-promo__pill i{ transition:transform .16s; }
.ur-promo__card:hover .ur-promo__pill i{ transform:translateX(3px); }
.ur-promo__card--pub .ur-promo__pill{ background:var(--ur-navy); }
.ur-promo__card--pub:hover .ur-promo__pill{ background:#003a5c; }
.ur-promo__card--haccp .ur-promo__pill{ background:var(--ur-orange-h); }
.ur-promo__card--haccp:hover .ur-promo__pill{ background:#cf7d00; }
@media (max-width:720px){ .ur-promo{ grid-template-columns:1fr; } }

/* ════════════════════════════════════════════════════════════
   PAGE CMS — MANDAT ADMINISTRATIF (.ur-mandat)
   Logo secteur public : .ur-mandat__logo (remplacer le src)
════════════════════════════════════════════════════════════ */
.ur-mandat{ max-width:940px; margin:0 auto; color:var(--ur-text); font-size:15px; line-height:1.65; }
/* Hero */
.ur-mandat__hero{
  position:relative; background:linear-gradient(160deg,#003a5c,var(--ur-navy));
  border-radius:18px; padding:40px 40px 34px; color:#fff; overflow:hidden; margin-bottom:34px;
  display:flex; align-items:center; gap:30px;
}
.ur-mandat__hero::before{
  content:""; position:absolute; top:0; left:0; right:0; height:6px;
  background:linear-gradient(90deg,#000091 0 33.33%,#fff 33.33% 66.66%,#E1000F 66.66% 100%);
}
.ur-mandat__hero-txt{ flex:1 1 auto; min-width:0; }
/* Logo : hauteur réglée par la variable --ur-logo-h (défaut 84px).
   On cape TOUTE image du hero pour éviter qu'un gros fichier ne déborde. */
.ur-mandat__logo-slot{ flex:0 0 auto; display:flex; align-items:center; }
.ur-mandat__hero img,
.ur-mandat__logo{
  height:var(--ur-logo-h, 84px) !important;
  width:auto !important; max-width:260px;
  background:#fff; border-radius:8px; padding:6px; box-shadow:0 4px 14px rgba(0,0,0,.25);
}
.ur-mandat__eyebrow{ font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--ur-orange); }
.ur-mandat__hero h1{ font-size:30px; line-height:1.15; font-weight:800; margin:12px 0 0; max-width:640px; letter-spacing:-.01em; }
.ur-mandat__hero p{ font-size:15.5px; color:rgba(255,255,255,.82); margin:14px 0 0; max-width:660px; }
/* Sections */
.ur-mandat h2{
  display:flex; align-items:center; gap:12px; font-size:21px; font-weight:800;
  color:var(--ur-navy); margin:34px 0 14px; letter-spacing:-.01em;
}
.ur-mandat h2 .ur-mandat__ico{
  flex:0 0 40px; width:40px; height:40px; border-radius:11px; display:inline-flex;
  align-items:center; justify-content:center; font-size:17px; color:#fff; background:var(--ur-green);
}
.ur-mandat p{ margin:0 0 14px; color:var(--ur-text2); }
.ur-mandat strong{ color:var(--ur-navy); }
/* Encart "comment ça fonctionne" */
.ur-mandat__note{
  background:var(--ur-green-l); border:1px solid #d5e2df; border-left:4px solid var(--ur-green);
  border-radius:12px; padding:18px 22px; color:var(--ur-text); margin:0 0 8px;
}
.ur-mandat__note p{ margin:0; color:var(--ur-text2); }
/* Grille bénéficiaires */
.ur-mandat__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin:6px 0 8px; }
.ur-mandat__item{
  display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--ur-border);
  border-radius:12px; padding:14px 16px; font-size:14px; font-weight:600; color:var(--ur-navy);
}
.ur-mandat__item i{ color:var(--ur-green); font-size:16px; flex:0 0 auto; }
/* Étapes */
.ur-mandat__steps{ list-style:none !important; counter-reset:st; padding:0 !important; margin:6px 0 8px; display:grid; gap:12px; }
.ur-mandat__steps li{
  list-style:none !important; counter-increment:st; position:relative;
  padding:16px 18px 16px 62px; background:#fff;
  border:1px solid var(--ur-border); border-radius:12px; color:var(--ur-text2); font-size:14px;
}
.ur-mandat__steps li::marker{ content:""; }
.ur-mandat__steps li::before{
  content:counter(st); position:absolute; left:16px; top:14px; width:32px; height:32px;
  border-radius:50%; background:var(--ur-orange); color:var(--ur-navy); font-weight:800;
  display:flex; align-items:center; justify-content:center; font-size:15px;
}
.ur-mandat__steps li strong{ display:block; margin-bottom:2px; }
/* CTA contact */
.ur-mandat__cta{
  display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  background:var(--ur-navy); color:#fff; border-radius:14px; padding:22px 26px; margin-top:30px;
}
.ur-mandat__cta p,
.ur-mandat__cta p strong{ margin:0; color:#fff !important; font-size:14.5px; }
.ur-mandat__cta a{
  display:inline-flex; align-items:center; gap:9px; background:#fff; color:var(--ur-navy) !important;
  font-weight:800; font-size:14px; padding:12px 22px; border-radius:26px; text-decoration:none;
  white-space:nowrap; transition:background .15s, color .15s;
}
.ur-mandat__cta a i{ color:var(--ur-orange-h); }
.ur-mandat__cta a:hover{ background:var(--ur-orange); color:var(--ur-navy) !important; }
.ur-mandat__cta a:hover i{ color:var(--ur-navy); }
@media (max-width:680px){
  .ur-mandat__hero{ padding:34px 22px 26px; flex-direction:column-reverse; align-items:flex-start; gap:18px; }
  .ur-mandat__hero h1{ font-size:24px; }
  .ur-mandat__hero img, .ur-mandat__logo{ height:64px !important; }
  .ur-mandat__grid{ grid-template-columns:1fr; }
}

/* ════════════════════════════════════════════════════════════
   FICHE PRODUIT — PIÈCES JOINTES (.product-attachments)
   Cartes PDF avec badge + bouton de téléchargement
════════════════════════════════════════════════════════════ */
.product-attachments{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(260px,1fr));
  gap:14px; margin:8px 0 4px; padding:0;
}
.product-attachments .attachment{
  position:relative; background:#fff; border:1px solid var(--ur-border); border-radius:12px;
  padding:16px 18px 16px 70px; transition:border-color .15s, box-shadow .15s;
}
.product-attachments .attachment:hover{ border-color:#c7cdd4; box-shadow:0 8px 22px rgba(0,33,54,.08); }
/* badge PDF */
.product-attachments .attachment::before{
  content:"PDF"; position:absolute; left:16px; top:16px; width:40px; height:48px;
  background:#c0392b; color:#fff; border-radius:6px; font-size:11px; font-weight:800; letter-spacing:.04em;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 3px 8px rgba(192,57,43,.28);
}
/* titre du fichier */
.product-attachments .attachment > a:first-of-type{
  display:block; font-weight:700; font-size:14px; color:var(--ur-navy);
  text-decoration:none; margin-bottom:12px; line-height:1.3;
}
.product-attachments .attachment > a:first-of-type:hover{ color:var(--ur-orange-h); }
/* on masque la description vide + le lien vide + le séparateur */
.product-attachments .attachment p{ display:none; }
.product-attachments .attachment hr{ display:none; }
/* bouton téléchargement */
.product-attachments .attachment > a:last-of-type{
  display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700;
  color:#fff !important; background:var(--ur-navy); padding:8px 15px; border-radius:22px;
  text-decoration:none; transition:background .15s;
}
.product-attachments .attachment > a:last-of-type:hover{ background:var(--ur-navy-h); }
.product-attachments .attachment > a:last-of-type i{ font-size:12px; }

/* ════════════════════════════════════════════════════════════
   CARROUSEL DE GAMMES (Elementor Image Carousel) — MÊME rendu que .ur-gammes-box :
   photo en fond, dégradé sombre, « GAMME » orange + titre blanc en surimpression.
   Classe CSS « ur-gammes-carousel » sur le widget. Légende injectée depuis l'alt (custom.js).
════════════════════════════════════════════════════════════ */
/* espace entre les cartes (indépendant du réglage "espacement" du widget) */
.ur-gammes-carousel .swiper-slide{ height:auto; padding:0 8px; box-sizing:border-box; }
.ur-gammes-carousel .swiper-slide-inner{
  position:relative; border-radius:12px; overflow:hidden; height:280px; display:block;
}
.ur-gammes-carousel .swiper-slide-image{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; margin:0; border-radius:0;
  transition:transform .4s ease;
}
.ur-gammes-carousel .swiper-slide-inner:hover .swiper-slide-image{ transform:scale(1.06); }
/* dégradé sombre pour lisibilité */
.ur-gammes-carousel .swiper-slide-inner::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(0,33,54,.12) 0%,rgba(0,33,54,.78) 100%);
}
/* légende en bas, par-dessus le dégradé */
.ur-gammes-carousel .ur-gamme-cap{
  position:absolute; left:0; bottom:0; z-index:2; width:100%; padding:20px;
  display:flex; flex-direction:column; text-align:left;
}
.ur-gammes-carousel .ur-gamme-eyebrow{
  order:1; color:var(--ur-orange); font-size:10px; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; margin:0 0 2px;
}
.ur-gammes-carousel .ur-gamme-title{
  order:2; color:#fff; font-size:19px; font-weight:800; line-height:1.1; margin:0;
}
/* pagination + flèches à la charte */
.ur-gammes-carousel .swiper-pagination-bullet-active{ background:var(--ur-orange); }
.ur-gammes-carousel .elementor-swiper-button{ color:var(--ur-navy); }
@media(max-width:600px){ .ur-gammes-carousel .swiper-slide-inner{ height:200px; } }

/* ════════════════════════════════════════════════════════════
   LPS PRO ACCOUNT — bloc « Pas de compte ? » (particulier / pro)
════════════════════════════════════════════════════════════ */
#lpsproaccount{
  max-width:560px; margin:24px auto; background:#fff; border:1px solid var(--ur-border);
  border-radius:14px; padding:26px 28px; text-align:center;
}
.lpsproaccount-title{ font-size:18px; font-weight:800; color:var(--ur-navy); margin-bottom:18px; }
.lpsproaccount-button{ display:flex; gap:14px; flex-wrap:wrap; justify-content:center; }
#lpsproaccount #login-form-particular,
#lpsproaccount #login-form-professionnal{ flex:1 1 220px; }
#lpsproaccount .btn{
  display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%; height:54px; border-radius:10px; font-weight:800; font-size:14.5px;
  text-decoration:none; border:1.5px solid transparent; transition:background .15s, color .15s, border-color .15s;
}
#lpsproaccount .btn::before{ font-family:"Font Awesome 6 Free"; font-weight:900; font-size:16px; }
/* Particulier — navy contour */
#lpsproaccount #login-form-particular .btn{ background:#fff; color:var(--ur-navy) !important; border-color:var(--ur-navy); }
#lpsproaccount #login-form-particular .btn::before{ content:"\f007"; }         /* user */
#lpsproaccount #login-form-particular .btn:hover{ background:var(--ur-navy); color:#fff !important; }
/* Professionnel — orange plein (mis en avant) */
#lpsproaccount #login-form-professionnal .btn{ background:var(--ur-orange); color:var(--ur-navy) !important; border-color:var(--ur-orange); }
#lpsproaccount #login-form-professionnal .btn::before{ content:"\f0b1"; }        /* briefcase */
#lpsproaccount #login-form-professionnal .btn:hover{ background:var(--ur-orange-h); border-color:var(--ur-orange-h); }
@media(max-width:480px){ #lpsproaccount #login-form-particular, #lpsproaccount #login-form-professionnal{ flex:1 1 100%; } }

/* ════════════════════════════════════════════════════════════
   FICHE PRODUIT — désactiver le zoom au survol (easyZoom)
   Le survol réaffichait la même image agrandie dans le cadre.
   Le bouton plein écran (.expander) reste actif pour agrandir.
════════════════════════════════════════════════════════════ */
.easyzoom-product .easyzoom-flyout{ display:none !important; }
.easyzoom-product .js-easyzoom-trigger{ cursor:default; pointer-events:none; }