/* ============================================================
   MWS LABS — custom.css V4 FINAL
   Basé sur les vrais fichiers .tpl Warehouse :
   - header-1.tpl
   - mobile-header-1.tpl
   - header.tpl (principal)
   
   À coller dans : themes/warehouse/assets/css/custom.css
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,400;0,700;0,800;0,900;1,900&family=Barlow:wght@400;500;600&family=Share+Tech+Mono&display=swap');

/* ─── VARIABLES ─── */
:root {
  --mws-black:   #0a0a0a;
  --mws-black2:  #111111;
  --mws-black3:  #1a1a1a;
  --mws-card:    #141414;
  --mws-orange:  #2563eb;
  --mws-orange2: #3b7af0;
  --mws-oglow:   rgba(37,99,235,0.3);
  --mws-ofaint:  rgba(37,99,235,0.08);
  --mws-white:   #f0f0f0;
  --mws-grey:    #777777;
  --mws-grey2:   #333333;
  --mws-border:  rgba(255,255,255,0.07);
  --mws-bord-o:  rgba(37,99,235,0.3);
}


/* ============================================================
   01. BASE GLOBALE
   ============================================================ */

html { background: var(--mws-black) !important; }

body,
#main-page-content,
#wrapper,
#inner-wrapper,
#content-wrapper,
#main, #content,
.page-home {
  background-color: var(--mws-black) !important;
  color: var(--mws-white) !important;
  font-family: 'Barlow', sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
}

h1,h2,h3,h4,h5,h6 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  color: var(--mws-white) !important;
}

a { color: var(--mws-white) !important; text-decoration: none !important; transition: color 0.2s !important; }
a:hover { color: var(--mws-orange) !important; }
p, span, li { color: var(--mws-white) !important; }

::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: var(--mws-black); }
::-webkit-scrollbar-thumb { background: var(--mws-orange); }


/* ============================================================
   02. TOPBAR — nav.header-nav
   (Livraison / Mentions légales / Wishlist)
   ============================================================ */

nav.header-nav {
  background: var(--mws-black2) !important;
  border-bottom: 1px solid var(--mws-border) !important;
  padding: 5px 0 !important;
}

/* Liens gauche (displayNav1 / iqitlinksmanager) */
nav.header-nav .left-nav a,
nav.header-nav .left-nav .block-iqitlinksmanager ul li a {
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--mws-grey) !important;
  padding: 4px 12px !important;
  border-right: 1px solid var(--mws-border) !important;
  transition: color 0.2s !important;
  display: inline-block !important;
}
nav.header-nav .left-nav a:hover,
nav.header-nav .left-nav .block-iqitlinksmanager ul li a:hover {
  color: var(--mws-orange) !important;
}

/* Wishlist droite (displayNav2) */
nav.header-nav .right-nav a {
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--mws-grey) !important;
  transition: color 0.2s !important;
}
nav.header-nav .right-nav a:hover { color: var(--mws-orange) !important; }
nav.header-nav .right-nav .fa { color: var(--mws-orange) !important; margin-right: 4px !important; }


/* ============================================================
   03. HEADER DESKTOP — #desktop-header / div.header-top
   Structure réelle :
   .col-header-left → #desktop_logo
   .col-header-center → #search_widget (iqitsearch)
   .col-header-right → #ps-shoppingcart-wrapper + #user_info
   ============================================================ */



div.header-top {
  background: transparent !important;
  padding: 10px 0 !important;
}

#desktop-header-container { /* .container dans header-top */
  background: transparent !important;
}

/* ── Logo ── */
#desktop_logo { display: flex !important; align-items: center !important; }

#desktop_logo img.logo {
  max-height: 46px !important;
  width: auto !important;
}

/* ── Search widget (iqitsearch) ── */
/* Généré par {widget name="iqitsearch"} → #search_widget */
#search_widget {
  background: var(--mws-black3) !important;
  border: 1px solid var(--mws-border) !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}

#search_widget:focus-within {
  border-color: var(--mws-orange) !important;
  box-shadow: 0 0 0 2px var(--mws-ofaint) !important;
}

#search_widget form { margin: 0 !important; }

#search_widget .input-group {
  border: none !important;
  flex-wrap: nowrap !important;
}

#search_widget input[type="text"],
#search_widget input.form-control,
#search_widget input.form-search-control {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  color: var(--mws-white) !important;
  font-family: 'Barlow', sans-serif !important;
  font-size: 14px !important;
  padding: 0 16px !important;
  height: 44px !important;
  border-radius: 0 !important;
  min-height: unset !important; /* override global input */
}

#search_widget input::placeholder { color: var(--mws-grey) !important; }

#search_widget button.search-btn,
#search_widget button[type="submit"] {
  background: var(--mws-orange) !important;
  border: none !important;
  border-radius: 0 !important;
  color: #000 !important;
  padding: 0 20px !important;
  height: 44px !important;
  cursor: pointer !important;
  font-size: 15px !important;
  transition: background 0.2s !important;
  flex-shrink: 0 !important;
}

#search_widget button.search-btn:hover { background: var(--mws-orange2) !important; }
#search_widget button .fa { color: #000 !important; }

/* Autocomplete dropdown */
#search_widget .autocomplete-suggestions {
  background: var(--mws-black2) !important;
  border: 1px solid var(--mws-border) !important;
  border-top: 2px solid var(--mws-orange) !important;
  border-radius: 0 !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.85) !important;
  z-index: 9999 !important;
}

.autocomplete-suggestion {
  color: var(--mws-grey) !important;
  padding: 10px 16px !important;
  border-bottom: 1px solid var(--mws-border) !important;
  font-family: 'Barlow', sans-serif !important;
  font-size: 14px !important;
  transition: all 0.15s !important;
}

.autocomplete-suggestion:hover,
.autocomplete-selected {
  background: var(--mws-ofaint) !important;
  color: var(--mws-orange) !important;
}

.autocomplete-suggestion .price { color: var(--mws-orange) !important; font-weight: 700 !important; }

/* ── Panier desktop ──
   Généré par {widget_block name="ps_shoppingcart"}
   Wrapper réel : #ps-shoppingcart-wrapper > #ps-shoppingcart
   Bouton réel : a#cart-toogle.cart-toogle.header-cart-btn
   ── */
#ps-shoppingcart-wrapper {
  display: inline-flex !important;
  align-items: center !important;
}

#ps-shoppingcart.header-cart-default {
  background: var(--mws-black3) !important;
  border: 1px solid var(--mws-border) !important;
  transition: border-color 0.2s, background 0.2s !important;
}

#ps-shoppingcart.header-cart-default:hover {
  border-color: var(--mws-orange) !important;
  background: var(--mws-black2) !important;
}

/* Bouton toggle panier */
a#cart-toogle,
a.cart-toogle.header-cart-btn {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 16px !important;
  color: var(--mws-white) !important;
  text-decoration: none !important;
}

/* Icône sac */
a#cart-toogle .fa.fa-shopping-bag,
a.cart-toogle .icon {
  font-size: 20px !important;
  color: var(--mws-white) !important;
  position: relative !important;
}

/* Badge nombre articles sur l'icône */
a#cart-toogle .cart-products-count-btn,
.cart-products-count-btn {
  position: absolute !important;
  top: -5px !important;
  right: -5px !important;
  background: var(--mws-orange) !important;
  color: #000 !important;
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 9px !important;
  font-weight: bold !important;
  border-radius: 0 !important;
  min-width: 15px !important;
  height: 15px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 2px !important;
}

/* Texte "Panier" et total */
a#cart-toogle .info-wrapper { display: flex !important; flex-direction: column !important; line-height: 1.1 !important; }

a#cart-toogle .title {
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 9px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--mws-grey) !important;
}

a#cart-toogle .cart-toggle-details {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: 15px !important;
  color: var(--mws-orange) !important;
}

a#cart-toogle .cart-separator { color: var(--mws-grey2) !important; }

/* Dropdown contenu panier */
#_desktop_blockcart-content.dropdown-menu,
#blockcart-content {
  background: var(--mws-black2) !important;
  border: 1px solid var(--mws-border) !important;
  border-top: 2px solid var(--mws-orange) !important;
  border-radius: 0 !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.85) !important;
  min-width: 300px !important;
}

#blockcart-content .cart-title {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: 18px !important;
  letter-spacing: 2px !important;
  color: var(--mws-orange) !important;
}

#blockcart-content .no-items {
  color: var(--mws-grey) !important;
  font-size: 14px !important;
  padding: 12px 0 !important;
  font-family: 'Barlow', sans-serif !important;
}

#blockcart-content hr { border-color: var(--mws-border) !important; }

/* Bouton fermer dropdown panier */
#js-cart-close {
  color: var(--mws-grey) !important;
  background: none !important;
  border: none !important;
  font-size: 18px !important;
  cursor: pointer !important;
  transition: color 0.2s !important;
}
#js-cart-close:hover { color: var(--mws-orange) !important; }

/* ── Compte client desktop ──
   Généré par {widget name="ps_customersignin"}
   Wrapper réel : #user_info
   ── */
#user_info {
  display: inline-flex !important;
  align-items: center !important;
  margin-left: 8px !important;
}

#user_info a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 14px !important;
  color: var(--mws-grey) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  transition: color 0.2s !important;
  white-space: nowrap !important;
}

#user_info a:hover { color: var(--mws-white) !important; }

#user_info .fa.fa-user {
  font-size: 18px !important;
  color: var(--mws-orange) !important;
}

/* Dropdown compte */
#user_info .dropdown-menu {
  background: var(--mws-black2) !important;
  border: 1px solid var(--mws-border) !important;
  border-top: 2px solid var(--mws-orange) !important;
  border-radius: 0 !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.85) !important;
}

#user_info .dropdown-menu a {
  font-size: 13px !important;
  color: var(--mws-grey) !important;
  padding: 10px 16px !important;
  border-bottom: 1px solid var(--mws-border) !important;
  transition: all 0.15s !important;
}

#user_info .dropdown-menu a:hover {
  color: var(--mws-orange) !important;
  background: var(--mws-ofaint) !important;
}

/* col-header-right layout */
.col-header-right {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
}


/* ============================================================
   05. HEADER MOBILE
   Structure réelle : 

#mobile-header-sticky {
  background: transparent !important;
}

.mobile-main-bar { padding: 4px 0 !important; }

.row-mobile-header { min-height: 56px !important; }

/* ── Boutons mobile génériques : a.m-nav-btn ── */
a.m-nav-btn,
.m-nav-btn {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  padding: 6px 10px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  color: var(--mws-grey) !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: color 0.2s !important;
  background: none !important;
  border: none !important;
}

a.m-nav-btn:hover,
.m-nav-btn:hover { color: var(--mws-white) !important; }

/* Icônes dans les boutons mobile */
a.m-nav-btn .fa,
.m-nav-btn .fa {
  font-size: 20px !important;
  color: currentColor !important;
  line-height: 1 !important;
}

/* Labels sous les icônes */
a.m-nav-btn span:not(.cart-products-count-btn),
.m-nav-btn span:not(.cart-products-count-btn) {
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 8px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  color: currentColor !important;
}

/* ── Logo mobile ── */
#mobile-header .col-mobile-logo a { display: flex !important; justify-content: center !important; align-items: center !important; }
#mobile-header .col-mobile-logo img.logo { max-height: 36px !important; width: auto !important; }

/* ── Bouton panier mobile ──
   Réel : a#mobile-cart-toogle.m-nav-btn
   Badge : #mobile-cart-products-count.cart-products-count-btn
   ── */
a#mobile-cart-toogle { position: relative !important; }

#mobile-cart-products-count.cart-products-count,
#mobile-cart-products-count.cart-products-count-btn {
  position: absolute !important;
  top: 4px !important;
  right: 4px !important;
  background: var(--mws-orange) !important;
  color: #000 !important;
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 9px !important;
  font-weight: bold !important;
  border-radius: 0 !important;
  min-width: 16px !important;
  height: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 3px !important;
  line-height: 1 !important;
}

/* Icône sac mobile */
.fa.fa-shopping-bag.mobile-bag-icon {
  color: var(--mws-white) !important;
  font-size: 20px !important;
  position: relative !important;
}

/* ── Menu mobile (drawer IQIT) ──
   Réel : #_mobile_iqitmegamenu-mobile.dropdown-menu-custom.dropdown-menu
   Contenu injecté depuis : #iqitmegamenu-mobile.mobile-menu
   ── */

/* Menu mobile panel */
#iqitmegamenu-mobile.mobile-menu {
  background: var(--mws-black2) !important;
  height: 100% !important;
}

/* Header du panel mobile */
.mm-panel__header,
.mobile-menu__header-wrapper {
  background: var(--mws-black3) !important;
  border-bottom: 1px solid var(--mws-border) !important;
  padding: 8px 16px !important;
}

/* Bouton fermer */
.mobile-menu__close,
.js-mobile-menu__close {
  color: var(--mws-grey) !important;
  background: var(--mws-black3) !important;
  border: 1px solid var(--mws-border) !important;
  border-radius: 0 !important;
  width: 36px !important; height: 36px !important;
  transition: all 0.2s !important;
}
.mobile-menu__close:hover { color: var(--mws-white) !important; border-color: var(--mws-orange) !important; }

/* Items du menu mobile */
li.mobile-menu__tab a.mobile-menu__link,
.mobile-menu__scroller .mobile-menu__link {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: 17px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--mws-grey) !important;
  padding: 14px 20px !important;
  border-bottom: 1px solid var(--mws-border) !important;
  transition: all 0.15s !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  position: relative !important;
}

li.mobile-menu__tab a.mobile-menu__link::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important; top: 0 !important; bottom: 0 !important;
  width: 2px !important;
  background: var(--mws-orange) !important;
  transform: scaleY(0) !important;
  transition: transform 0.2s !important;
}

li.mobile-menu__tab a.mobile-menu__link:hover {
  color: var(--mws-white) !important;
  background: rgba(255,255,255,0.02) !important;
}
li.mobile-menu__tab a.mobile-menu__link:hover::before { transform: scaleY(1) !important; }

/* Icône home dans menu mobile */
.mobile-menu__tab-icon.fa.fa-home { color: var(--mws-orange) !important; font-size: 18px !important; }

/* Footer du menu mobile (langue, compte) */
.js-top-menu-bottom.mobile-menu__footer {
  background: var(--mws-black3) !important;
  border-top: 1px solid var(--mws-border) !important;
}

.mobile-menu__user a {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  color: var(--mws-white) !important;
}
.mobile-menu__user a .fa { color: var(--mws-orange) !important; }

.mobile-menu__language-selector,
.mobile-menu__currency-selector {
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: 2px !important;
  color: var(--mws-grey) !important;
}

/* ── Search mobile ──
   Réel : #search-widget-mobile.dropdown-menu
   ── */
#search-widget-mobile {
  background: var(--mws-black2) !important;
  border: 1px solid var(--mws-border) !important;
  border-top: 2px solid var(--mws-orange) !important;
  border-radius: 0 !important;
  padding: 14px !important;
  min-width: 300px !important;
}

/* Search bar dans le dropdown mobile */
#search-widget-mobile .input-group { flex-wrap: nowrap !important; }

#search-widget-mobile input[type="text"],
#search-widget-mobile input.form-control {
  background: var(--mws-black3) !important;
  border: 1px solid var(--mws-border) !important;
  border-radius: 0 !important;
  color: var(--mws-white) !important;
  font-family: 'Barlow', sans-serif !important;
  font-size: 16px !important; /* anti-zoom iOS */
  padding: 10px 14px !important;
  min-height: 48px !important;
  -webkit-appearance: none !important;
}

#search-widget-mobile input::placeholder { color: var(--mws-grey2) !important; }

#search-widget-mobile input:focus {
  border-color: var(--mws-orange) !important;
  outline: none !important;
  box-shadow: 0 0 0 2px var(--mws-ofaint) !important;
}

#search-widget-mobile button.search-btn {
  background: var(--mws-orange) !important;
  border: none !important;
  border-radius: 0 !important;
  color: #000 !important;
  padding: 0 18px !important;
  min-height: 48px !important;
  font-size: 16px !important;
  cursor: pointer !important;
  transition: background 0.2s !important;
}
#search-widget-mobile button.search-btn:hover { background: var(--mws-orange2) !important; }
#search-widget-mobile button .fa { color: #000 !important; }

/* Overlay derrière le menu mobile */
#mobile_menu_click_overlay {
  background: rgba(0,0,0,0.75) !important;
}


/* ============================================================
   06. BOUTONS GLOBAUX
   ============================================================ */

.btn-primary,
button.btn-primary,
input[type="submit"].btn-primary,
a.btn-primary,
.add-to-cart,
.btn-subscribe,
.elementor-button.btn-primary,
.elementor-button-link.btn-primary {
  background-color: var(--mws-orange) !important;
  border-color: var(--mws-orange) !important;
  color: #000 !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 12px 24px !important;
  min-height: 46px !important;
  transition: background 0.2s, box-shadow 0.2s !important;
}

.btn-primary:hover,
button.btn-primary:hover,
a.btn-primary:hover,
.add-to-cart:hover,
.btn-subscribe:hover,
.elementor-button.btn-primary:hover {
  background-color: var(--mws-orange2) !important;
  border-color: var(--mws-orange2) !important;
  box-shadow: 0 0 24px var(--mws-oglow) !important;
  color: #000 !important;
}

.btn-secondary,
.btn-outline-secondary,
.btn-default {
  background: transparent !important;
  border: 1px solid var(--mws-grey2) !important;
  color: var(--mws-white) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  min-height: 46px !important;
  transition: all 0.2s !important;
}

.btn-secondary:hover {
  border-color: var(--mws-orange) !important;
  color: var(--mws-orange) !important;
  background: var(--mws-ofaint) !important;
}


/* ============================================================
   07. INPUTS GLOBAUX
   ============================================================ */

.form-control,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
select, textarea {
  background: var(--mws-black3) !important;
  border: 1px solid var(--mws-grey2) !important;
  border-radius: 0 !important;
  color: var(--mws-white) !important;
  font-family: 'Barlow', sans-serif !important;
  font-size: 15px !important;
  padding: 10px 14px !important;
  min-height: 46px !important;
  transition: border-color 0.2s !important;
  -webkit-appearance: none !important;
}

/* Exception : search inputs déjà stylés */
#search_widget .form-control,
#search-widget-mobile .form-control { min-height: unset !important; }

.form-control:focus,
input:focus, select:focus, textarea:focus {
  border-color: var(--mws-orange) !important;
  outline: none !important;
  box-shadow: 0 0 0 2px var(--mws-ofaint) !important;
  background: var(--mws-black3) !important;
  color: var(--mws-white) !important;
}

.form-control::placeholder,
input::placeholder { color: var(--mws-grey2) !important; }

label, .form-group label, .label {
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--mws-grey) !important;
  margin-bottom: 6px !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--mws-orange) !important;
  border-color: var(--mws-orange) !important;
}


/* ============================================================
   08. PRODUITS
   ============================================================ */

.product-miniature,
.js-product-miniature,
article.product-miniature {
  background: var(--mws-card) !important;
  border: 1px solid var(--mws-border) !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  position: relative !important;
  transition: background 0.3s, border-color 0.3s !important;
}

.product-miniature:hover { background: #1a1a1a !important; border-color: var(--mws-bord-o) !important; }

.product-miniature::after {
  content: '' !important; position: absolute !important;
  bottom: 0 !important; left: 0 !important; right: 0 !important;
  height: 2px !important; background: var(--mws-orange) !important;
  transform: scaleX(0) !important; transform-origin: left !important;
  transition: transform 0.35s !important;
}
.product-miniature:hover::after { transform: scaleX(1) !important; }

.product-miniature .thumbnail-container,
.product-miniature .product-thumbnail { background: var(--mws-black3) !important; }

.product-miniature .product-title a {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important; font-size: 17px !important;
  letter-spacing: 1px !important; text-transform: uppercase !important;
  color: var(--mws-white) !important;
}

.product-miniature .price,
.product-miniature .product-price-and-shipping .price {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important; font-size: 22px !important;
  color: var(--mws-orange) !important;
}

.product-miniature .regular-price { color: var(--mws-grey) !important; text-decoration: line-through !important; font-size: 14px !important; }

.product-flag, .sale-label, .new-label, .discount-percentage {
  background: var(--mws-orange) !important; color: #000 !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important; font-size: 11px !important;
  letter-spacing: 2px !important; border-radius: 0 !important;
}

.product-miniature .product-description { background: var(--mws-card) !important; padding: 14px !important; }


/* ============================================================
   09. PAGE PRODUIT
   ============================================================ */

#product { background: var(--mws-black) !important; }

.page-product h1 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important; font-size: clamp(28px, 4vw, 52px) !important;
  letter-spacing: -1px !important; line-height: 0.95 !important;
}

.current-price .price, .product-prices .price {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important; font-size: 36px !important;
  color: var(--mws-orange) !important;
}

#product-description-short {
  color: var(--mws-grey) !important; font-size: 15px !important; line-height: 1.7 !important;
  border-left: 2px solid var(--mws-orange) !important; padding-left: 16px !important;
}

.tabs .nav-tabs { border-bottom: 1px solid var(--mws-border) !important; background: var(--mws-black2) !important; }
.tabs .nav-tabs .nav-link {
  font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important;
  font-size: 13px !important; letter-spacing: 2px !important; text-transform: uppercase !important;
  color: var(--mws-grey) !important; border: none !important;
  border-bottom: 2px solid transparent !important; padding: 12px 20px !important;
  background: none !important; border-radius: 0 !important; transition: all 0.2s !important;
}
.tabs .nav-tabs .nav-link.active { color: var(--mws-orange) !important; border-bottom-color: var(--mws-orange) !important; }
.tabs .tab-content { background: var(--mws-black2) !important; border: 1px solid var(--mws-border) !important; border-top: none !important; padding: 24px !important; color: var(--mws-grey) !important; }

.bootstrap-touchspin input { background: var(--mws-black3) !important; border: 1px solid var(--mws-border) !important; color: var(--mws-white) !important; border-radius: 0 !important; text-align: center !important; min-height: 48px !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; font-size: 18px !important; }
.bootstrap-touchspin .btn { background: var(--mws-black3) !important; border: 1px solid var(--mws-border) !important; color: var(--mws-white) !important; border-radius: 0 !important; min-width: 44px !important; min-height: 48px !important; }
.bootstrap-touchspin .btn:hover { background: var(--mws-orange) !important; color: #000 !important; }

/* Sticky add to cart sur mobile */
@media (max-width: 991px) {
  #add-to-cart-or-refresh {
    position: sticky !important; bottom: 0 !important; z-index: 100 !important;
    background: var(--mws-black2) !important; border-top: 1px solid var(--mws-border) !important;
    padding: 12px 16px !important; box-shadow: 0 -8px 24px rgba(0,0,0,0.6) !important;
  }
  #add-to-cart-or-refresh .add-to-cart,
  #add-to-cart-or-refresh .btn-primary { width: 100% !important; min-height: 52px !important; font-size: 16px !important; }
}


/* ============================================================
   10. PANIER & CHECKOUT
   ============================================================ */

#cart, .page-cart, #checkout { background: var(--mws-black) !important; }

.cart-item, .cart-summary, .block-promo { background: var(--mws-card) !important; border: 1px solid var(--mws-border) !important; border-radius: 0 !important; }
.cart-item .price, .cart-total .value { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 900 !important; color: var(--mws-orange) !important; }
.cart-summary-line .label { font-family: 'Share Tech Mono', monospace !important; font-size: 11px !important; letter-spacing: 2px !important; text-transform: uppercase !important; color: var(--mws-grey) !important; }
.cart-item .remove-from-cart { color: var(--mws-grey2) !important; padding: 8px !important; transition: color 0.2s !important; }
.cart-item .remove-from-cart:hover { color: var(--mws-orange) !important; }

.checkout-step { background: var(--mws-card) !important; border: 1px solid var(--mws-border) !important; border-radius: 0 !important; margin-bottom: 8px !important; }
.checkout-step.-current { border-color: var(--mws-orange) !important; }
.step-title { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 900 !important; font-size: 18px !important; letter-spacing: 2px !important; text-transform: uppercase !important; }
.checkout-step.-current .step-title { color: var(--mws-orange) !important; }
.delivery-option { background: var(--mws-black3) !important; border: 1px solid var(--mws-border) !important; padding: 14px !important; margin-bottom: 8px !important; border-radius: 0 !important; transition: border-color 0.2s !important; }
.delivery-option:hover, .delivery-option.selected { border-color: var(--mws-orange) !important; }


/* ============================================================
   11. FOOTER
   Sélecteurs réels : #footer.js-footer
   #footer-container-main.footer-container.footer-style-1
   #footer-copyrights._footer-copyrights-1
   ============================================================ */

#footer.js-footer { background: var(--mws-black2) !important; border-top: 1px solid var(--mws-border) !important; }
#footer-container-main { background: var(--mws-black2) !important; padding: 40px 0 32px !important; }

#footer h5.block-title span {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important; font-size: 13px !important;
  letter-spacing: 3px !important; text-transform: uppercase !important;
  color: var(--mws-white) !important; display: block !important;
  padding-bottom: 8px !important; margin-bottom: 14px !important;
  border-bottom: 1px solid var(--mws-border) !important;
}

#footer .block-content a { font-size: 13px !important; color: var(--mws-grey) !important; padding: 4px 0 !important; display: block !important; transition: all 0.2s !important; }
#footer .block-content a:hover { color: var(--mws-orange) !important; padding-left: 6px !important; }

.contact-rich { color: var(--mws-grey) !important; }
.contact-rich strong { color: var(--mws-white) !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; letter-spacing: 1px !important; }
.contact-rich .fa { color: var(--mws-orange) !important; }

.social-links._footer { display: flex !important; gap: 6px !important; flex-wrap: wrap !important; list-style: none !important; padding: 0 !important; }
.social-links._footer li a { background: var(--mws-black3) !important; border: 1px solid var(--mws-border) !important; color: var(--mws-grey) !important; border-radius: 0 !important; width: 36px !important; height: 36px !important; display: flex !important; align-items: center !important; justify-content: center !important; transition: all 0.2s !important; font-size: 14px !important; }
.social-links._footer li a:hover { background: var(--mws-orange) !important; border-color: var(--mws-orange) !important; color: #000 !important; }

#footer-copyrights { background: var(--mws-black) !important; border-top: 1px solid var(--mws-border) !important; padding: 14px 0 !important; }

.newsletter-input-group .btn-subscribe { border-radius: 0 !important; }
.text-muted, .ps-emailsubscription-conditions { color: var(--mws-grey) !important; font-size: 12px !important; }


/* ============================================================
   12. ELEMENTOR HOMEPAGE
   ============================================================ */

.elementor-section,
.elementor-top-section { background-color: var(--mws-black) !important; }

.elementor-icon-box-title span { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 900 !important; font-size: 20px !important; letter-spacing: 1px !important; text-transform: uppercase !important; color: var(--mws-white) !important; }
.elementor-icon-box-description p { color: var(--mws-grey) !important; font-size: 14px !important; line-height: 1.65 !important; }
.elementor-icon .fa { color: var(--mws-orange) !important; font-size: 36px !important; }
.elementor-heading-title { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 900 !important; text-transform: uppercase !important; color: var(--mws-white) !important; }
.elementor-text-editor, .elementor-text-editor p { color: var(--mws-grey) !important; }
.elementor-divider-separator { border-top-color: var(--mws-orange) !important; }
.elementor-counter-number-wrapper { color: var(--mws-orange) !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 900 !important; }
.elementor-counter-title { color: var(--mws-grey) !important; font-family: 'Share Tech Mono', monospace !important; letter-spacing: 2px !important; font-size: 11px !important; text-transform: uppercase !important; }
.elementor-testimonial-content { color: var(--mws-grey) !important; }
.elementor-testimonial-name { color: var(--mws-white) !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; }
.elementor-testimonial-job { color: var(--mws-orange) !important; font-size: 12px !important; }
.elementor-accordion-title { color: var(--mws-white) !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; }
.elementor-accordion-content { color: var(--mws-grey) !important; background: var(--mws-card) !important; }
.elementor-accordion-item { border-color: var(--mws-border) !important; }


/* ============================================================
   13. MISC
   ============================================================ */

/* Breadcrumb */
.breadcrumb { background: transparent !important; }
.breadcrumb-item { font-family: 'Share Tech Mono', monospace !important; font-size: 10px !important; letter-spacing: 1px !important; text-transform: uppercase !important; color: var(--mws-grey) !important; }
.breadcrumb-item a { color: var(--mws-grey) !important; }
.breadcrumb-item a:hover { color: var(--mws-orange) !important; }
.breadcrumb-item.active { color: var(--mws-white) !important; }
.breadcrumb-item + .breadcrumb-item::before { content: '/' !important; color: var(--mws-grey2) !important; }

/* Pagination */
.pagination .page-link { background: var(--mws-card) !important; border: 1px solid var(--mws-border) !important; color: var(--mws-grey) !important; border-radius: 0 !important; min-width: 44px !important; min-height: 44px !important; display: flex !important; align-items: center !important; justify-content: center !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; transition: all 0.2s !important; }
.pagination .page-link:hover { background: var(--mws-ofaint) !important; border-color: var(--mws-orange) !important; color: var(--mws-orange) !important; }
.pagination .active .page-link { background: var(--mws-orange) !important; border-color: var(--mws-orange) !important; color: #000 !important; }

/* Alertes */
.alert { border-radius: 0 !important; border-left: 3px solid var(--mws-orange) !important; background: var(--mws-black2) !important; color: var(--mws-white) !important; }
.alert-success { border-left-color: #44cc66 !important; background: rgba(68,204,102,0.08) !important; }
.alert-danger { border-left-color: #ff4444 !important; background: rgba(255,68,68,0.08) !important; }

/* Modal blockcart */
#blockcart-modal .modal-content { background: var(--mws-black2) !important; border: 1px solid var(--mws-border) !important; border-top: 3px solid var(--mws-orange) !important; border-radius: 0 !important; }
#blockcart-modal .modal-header { background: var(--mws-black3) !important; border-bottom: 1px solid var(--mws-border) !important; }
#blockcart-modal .modal-title { color: var(--mws-orange) !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 900 !important; letter-spacing: 2px !important; }
#blockcart-modal .modal-body { background: var(--mws-black2) !important; color: var(--mws-grey) !important; }

/* Étoiles */
.star-content .star, .grade-stars .star { color: var(--mws-orange) !important; }

/* Back to top */
#back-to-top { background: var(--mws-orange) !important; border: none !important; border-radius: 0 !important; color: #000 !important; width: 40px !important; height: 40px !important; }


/* ============================================================
   14. RESPONSIVE MOBILE
   ============================================================ */

@media (max-width: 991px) {
  body { padding-bottom: 0 !important; }

  /* Produits 2 colonnes */
  .products .product-miniature { width: calc(50% - 4px) !important; }
  .product-miniature .product-title a { font-size: 14px !important; }
  .product-miniature .price { font-size: 18px !important; }

  /* Panier mobile empilé */
  .cart-grid-body, .cart-grid-right { width: 100% !important; padding: 0 16px !important; }

  /* Modal footer */
  #blockcart-modal .modal-footer { flex-direction: column !important; gap: 8px !important; }
  #blockcart-modal .modal-footer .btn { width: 100% !important; min-height: 50px !important; }

  h1 { font-size: clamp(28px, 8vw, 48px) !important; }
  h2 { font-size: clamp(22px, 6vw, 36px) !important; }
  h3 { font-size: clamp(18px, 5vw, 26px) !important; }
}

@media (max-width: 575px) {
  .products .product-miniature { width: 100% !important; }
  .btn-primary, .btn-secondary { font-size: 14px !important; }
}

/* ============================================================
   FIN — MWS LABS custom.css V4 FINAL
   Basé sur header-1.tpl + mobile-header-1.tpl réels
   ============================================================ */

/* ── FIX PANIER LARGEUR ── */
#blockcart.blockcart.cart-preview {
  width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  position: relative !important;
}

/* Forcer le dropdown panier à ne pas étirer le header */
#_desktop_blockcart-content.dropdown-menu {
  position: absolute !important;
  right: 0 !important;
  top: 100% !important;
  width: 320px !important;
  min-width: unset !important;
  left: auto !important;
}

/* Cacher le dropdown quand pas actif */
#_desktop_blockcart-content.dropdown-menu:not(.show) {
  display: none !important;
}

/* Panier compact */
#ps-shoppingcart.header-cart-default,
#ps-shoppingcart-wrapper {
  width: auto !important;
  flex-shrink: 0 !important;
}

a#cart-toogle.cart-toogle.header-cart-btn {
  padding: 0 14px !important;
  gap: 8px !important;
  height: 44px !important;
  width: auto !important;
}





#desktop-header.scrolled {
  box-shadow: 0 4px 32px rgba(0,0,0,0.6) !important;
}



/* ── Megamenu labels (Prochainement, Nouveau, etc.) ── */
.cbp-legend,
.cbp-hrmenu .cbp-legend,
span.cbp-legend {
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #fff !important;
  background: #2563eb !important;
  border-radius: 0 !important;
  padding: 3px 8px !important;
  margin-bottom: 0 !important;
  box-shadow: 0 0 12px rgba(37,99,235,0.4) !important;
}

.cbp-horizontal .cbp-legend {
  background: #2563eb !important;
  color: #fff !important;
}



/* ════════════════════════════════════
   STICKY + ESPACEMENT — FIX FINAL
════════════════════════════════════ */

/* ── Pastille megamenu ── */
.cbp-legend,
.cbp-hrmenu .cbp-legend,
span.cbp-legend {
  border-radius: 20px !important;
  padding: 3px 10px !important;
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #fff !important;
  background: #2563eb !important;
  margin-bottom: 0 !important;
}

.cbp-horizontal .cbp-legend { background: #2563eb !important; color: #fff !important; }

/* ── Espacement interne header ── */
#desktop-header-container > .row { gap: 16px !important; }
.col-header-right { gap: 12px !important; }

/* ── Header desktop sticky ── */
/* Warehouse gère déjà le sticky via JS .stuck
   On surcharge juste pour garantir le comportement */
#desktop-header,
#desktop-header.desktop-header-style-1 {
  position: sticky !important;
  top: 0 !important;
  z-index: 9000 !important;
  background: rgba(10,10,10,0.98) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}

/* Le megamenu sticky doit coller SOUS le header — pas le chevaucher */


/* ── Header mobile sticky ── */
@media (max-width: 991px) {
  

  /* Offset body mobile */
  
}


/* ════════════════════════════════════
   FIX Z-INDEX — panier au dessus du menu
════════════════════════════════════ */

/* Panier et dropdowns header au dessus du megamenu */
#ps-shoppingcart-wrapper,
#_desktop_blockcart-content,
.mws-account-dropdown,
#mws-contact-dropdown,
#mws-account-dropdown { z-index: 9500 !important; }

/* Megamenu en dessous du header */
.iqit-megamenu-container,
#iqitmegamenu-wrapper,
.sticky-desktop-wrapper { z-index: 500 !important; }

/* Pastille megamenu */
.cbp-legend,
.cbp-hrmenu .cbp-legend,
span.cbp-legend {
  border-radius: 20px !important;
  padding: 3px 10px !important;
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #fff !important;
  background: #2563eb !important;
  margin-bottom: 0 !important;
  box-shadow: none !important;
}

.cbp-horizontal .cbp-legend { background: #2563eb !important; color: #fff !important; }

/* Espacement header */
#desktop-header-container > .row { gap: 16px !important; }
.col-header-right { gap: 12px !important; }

/* Mobile body offset — Warehouse gère le sticky, on gère juste l'offset */
@media (max-width: 991px) {
  
}

/* ════════════════════════════════════
   FIX FINAL — Sticky + Prochainement
════════════════════════════════════ */

/* ── Sticky Warehouse natif — on ne touche plus à position ── */
/* Warehouse gère sticky via .stuck sur .sticky-desktop-wrapper */
/* On se contente de styler le fond quand il est sticky */
.sticky-desktop-wrapper.stuck-header { 
  background: rgba(10,10,10,0.98) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.6) !important;
}

/* Mobile sticky via .sticky-mobile-wrapper */
.sticky-mobile-wrapper .stuck-up,
#mobile-header-sticky.stuck,
#mobile-header-sticky.stuck-up {
  background: rgba(10,10,10,0.98) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

/* ── Fix "Prochainement" qui déborde sur le panier ── */
/* Le li pull-right avec cbp-legend sort du flux normal */
.cbp-hrmenu-tab.pull-right,
.cbp-hrmenu-tab.cbp-pulled-right {
  position: relative !important;
  z-index: 1 !important; /* sous le header droite */
}

/* La pastille reste dans le flux du nav */
.cbp-hrmenu-tab.pull-right .cbp-legend,
.cbp-hrmenu-tab.cbp-pulled-right .cbp-legend {
  position: absolute !important;
  top: 4px !important;
  right: auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 2 !important;
  white-space: nowrap !important;
}

/* Z-index header droite au dessus du megamenu */
.col-header-right,
#ps-shoppingcart-wrapper,
.mws-account-btn,
.mws-wishlist-btn {
  z-index: 9500 !important;
  position: relative !important;
}

/* Megamenu sous le header */
.iqit-megamenu-container { z-index: 100 !important; }
#iqitmegamenu-wrapper { z-index: 100 !important; }


/* ── Suppression délai hover megamenu ── */
.cbp-hrmenu .cbp-hrsub,
.cbp-hrmenu li .cbp-hrsub,
.cbp-hrmenu > ul > li > .cbp-hrsub,
.cbp-hropen .cbp-hrsub,
#cbp-hrmenu .cbp-hrsub {
  transition-delay: 0s !important;
  transition: none !important;
  animation-delay: 0s !important;
}

.cbp-hrmenu > ul > li,
.cbp-hrmenu > ul > li > a {
  transition-delay: 0s !important;
}

/* Override JS delay si défini en inline */
.cbp-hrmenu .cbp-hrsub[style*="transition"] {
  transition-delay: 0s !important;
}

/* ── Sticky PC — classes réelles Warehouse ── */
#desktop-header.stuck,
#desktop-header.stuck-header,
#desktop-header.stuck-header-element {
  background: rgba(10,10,10,0.98) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.7) !important;
  border-bottom: 1px solid rgba(37,99,235,0.2) !important;
}

/* ── Suppression délai transition megamenu ── */
.cbp-hrmenu > ul > li > a,
.cbp-hrmenu > ul > li > span.cbp-main-link,
.cbp-horizontal > ul > li > a,
.cbp-horizontal > ul > li > .cbp-main-link {
  transition: none !important;
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
}

.cbp-hrmenu > ul > li > a .cbp-tab-title,
.cbp-horizontal > ul > li > a .cbp-tab-title {
  transition: none !important;
}