/* ============================================
   Castel Armes - CSS Personnalise v2
   Mega menu navigation
   ============================================ */

/* ===========================================
   MEGA MENU - Positionnement pleine largeur
   =========================================== */

.header-top {
  position: relative !important;
  overflow: visible !important;
}
.header-top > .container {
  position: static !important;
}

#_desktop_top_menu li.category {
  position: static !important;
}

#_desktop_top_menu li.category > .popover.sub-menu {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 100% !important;
  width: 100% !important;
  transform: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  border: none !important;
  border-top: 3px solid #B12704 !important;
  background-color: #202225 !important;
  padding: 28px 80px !important;
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.6) !important;
  z-index: 9999 !important;
  overflow: hidden !important;
  min-height: 280px !important;
}

/* Filigrane viseur - discret, a droite */
#_desktop_top_menu li.category > .popover.sub-menu::before {
  content: '' !important;
  position: absolute !important;
  right: 80px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 200px !important;
  height: 200px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Ccircle cx='100' cy='100' r='85' fill='none' stroke='white' stroke-width='5'/%3E%3Ccircle cx='100' cy='100' r='42' fill='none' stroke='white' stroke-width='3'/%3E%3Ccircle cx='100' cy='100' r='7' fill='white'/%3E%3Cline x1='0' y1='100' x2='58' y2='100' stroke='white' stroke-width='4'/%3E%3Cline x1='142' y1='100' x2='195' y2='100' stroke='white' stroke-width='4'/%3E%3Cline x1='100' y1='0' x2='100' y2='58' stroke='white' stroke-width='4'/%3E%3Cline x1='100' y1='142' x2='100' y2='200' stroke='white' stroke-width='4'/%3E%3C/svg%3E") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  opacity: 0.07 !important;
  pointer-events: none !important;
}

/* ===========================================
   SOUS-CATEGORIES - Colonnes automatiques
   =========================================== */

#_desktop_top_menu li.category > .popover.sub-menu > ul.top-menu {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: wrap !important;
  max-height: 220px !important;
  align-content: flex-start !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  width: auto !important;
}

#_desktop_top_menu li.category > .popover.sub-menu > ul.top-menu > li {
  padding: 0 !important;
  border: none !important;
  background: none !important;
  width: auto !important;
  max-width: 300px !important;
}

#_desktop_top_menu li.category > .popover.sub-menu > ul.top-menu > li > a {
  color: #b0b8c1 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase !important;
  padding: 9px 50px 9px 0 !important;
  display: block !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: color 0.2s ease, padding-left 0.15s ease !important;
  border: none !important;
  background: none !important;
}

#_desktop_top_menu li.category > .popover.sub-menu > ul.top-menu > li > a:hover {
  color: #B12704 !important;
  padding-left: 12px !important;
  text-decoration: none !important;
}

#_desktop_top_menu li.category > .popover.sub-menu .navbar-toggler {
  display: none !important;
}
/* CASTEL ARMES - Charte Graphique */
/* Inspire de armurerie-lavaux.com */
/* #202225 nav | #B12704 rouge | #333333 footer */

/* --- HEADER --- */
#header,#header .header-top,.header-top{background-color:#202225!important}
#header .header-nav,.header-nav{background-color:#202225!important;border-bottom:none!important}

/* --- LIENS MENU --- */
#header .top-menu a.dropdown-item,.top-menu a.dropdown-item{color:#fff!important}
#header .top-menu>li>a:hover,#header .top-menu>li.current>a{color:#B12704!important}

/* --- ICONES HEADER --- */
.header-top .blockcart a,.header-top .user-info a,.header-top a,#_desktop_cart .header a{color:#fff!important}
.header-top .material-icons{color:#fff!important}

/* --- RECHERCHE --- */
.search-widget form input[type=text]{border:1px solid #404448!important;background-color:#2c2f33!important;color:#fff!important}
.search-widget form input[type=text]::placeholder{color:#aaa!important}
.search-widget form button{background-color:#B12704!important;border-color:#B12704!important;color:#fff!important}

/* --- FOOTER --- */
#footer{background-color:#333333!important;color:#fff!important}
#footer a{color:#ccc!important}
#footer a:hover{color:#fff!important;text-decoration:underline}
#footer h3,#footer .h3,#footer .block-title,#footer .block-title span{color:#fff!important;border-bottom:1px solid #555;padding-bottom:8px}

/* --- BOUTONS CTA --- */
.btn-primary,.add-to-cart,.cart-overview .btn{background-color:#B12704!important;border-color:#B12704!important;color:#fff!important}
.btn-primary:hover,.btn-primary:focus,.add-to-cart:hover{background-color:#8e1e00!important;border-color:#8e1e00!important}

/* --- PRIX --- */
.regular-price{text-decoration:line-through!important;color:#999!important;font-size:.9em}
.discount-percentage,.discount-amount,.badge-danger,.product-flag.discount{background-color:#B12704!important;color:#fff!important}
.has-discount .current-price,.has-discount .price{color:#B12704!important}

/* --- TITRES SECTIONS --- */
.products-section-title,h2.products-section-title{font-size:1.4em;font-weight:700;border-left:4px solid #B12704!important;padding-left:12px!important;margin-bottom:20px}

/* --- PAGINATION --- */
.pagination .page-item.active .page-link{background-color:#B12704!important;border-color:#B12704!important}
.pagination .page-link{color:#202225}
.pagination .page-link:hover{color:#B12704}

/* --- BREADCRUMB --- */
.breadcrumb-item a{color:#202225}
.breadcrumb-item.active{color:#B12704}

/* --- HOVER LIENS --- */
a:hover{color:#B12704}
.product-title a:hover{color:#B12704!important}

/* CASTEL ARMES - Design Apple */
/* Coins arrondis, ombres subtiles, minimaliste */

/* --- SLIDER PRINCIPAL --- */
#home-slider,
.carousel,
#_home-slider_widget_home-slider {
  border-radius: 16px !important;
  overflow: hidden !important;
}

.slick-slider,
.js-qv-mask,
#blockpack-carousel-0 {
  border-radius: 16px !important;
  overflow: hidden !important;
}

/* --- BANNIERE "20% OFF" ET CUSTOM BLOCS --- */
.banner,
.banner-img,
.custom-text,
.blockreassurance,
[id*="custom-text"],
.cms-block,
.banner-link img {
  border-radius: 16px !important;
  overflow: hidden !important;
}

/* Bloc texte personnalisé */
#custom-text,
.block-custom-text,
.displayHome .block {
  border-radius: 16px !important;
  overflow: hidden !important;
}

/* --- FICHES PRODUITS --- */
.product-miniature article,
.product-miniature .thumbnail-container,
.product-miniature {
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.07) !important;
  transition: box-shadow 0.25s ease, transform 0.25s ease !important;
  border: none !important;
}

.product-miniature:hover,
.product-miniature article:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,0.13) !important;
  transform: translateY(-3px) !important;
}

/* --- BOUTONS --- */
.btn-primary,
.add-to-cart,
.btn {
  border-radius: 10px !important;
}

.search-widget form input[type=text] {
  border-radius: 10px !important;
}

/* --- BARRE DE RECHERCHE --- */
.search-widget form {
  border-radius: 10px !important;
  overflow: hidden;
}

/* --- MEGA MENU --- */
.popover.mf-sub,
.popover.sub-menu {
  border-radius: 0 0 16px 16px !important;
}

/* --- IMAGES PRODUITS --- */
.product-thumbnail img,
.product-cover img {
  border-radius: 10px !important;
}

/* --- CHAMPS FORMULAIRES --- */
input[type=text],
input[type=email],
input[type=password],
select,
textarea {
  border-radius: 8px !important;
}

/* --- NOTIFICATIONS / ALERTES --- */
.alert {
  border-radius: 12px !important;
  border: none !important;
}

/* --- PANIER / DROPDOWN --- */
.cart-preview .cart-dropdown,
.user-info .dropdown-menu {
  border-radius: 14px !important;
  border: none !important;
  box-shadow: 0 8px 30px rgba(0,0,0,0.12) !important;
}

/* --- STYLE EPURE GENERAL --- */
.card,
.block {
  border-radius: 14px !important;
  border: none !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
}

/* Supprimer les bordures superflues */
.product-miniature .highlighted-informations {
  border-radius: 0 0 14px 14px !important;
}



/* --- MENU LATERAL CATEGORIES - Option A Apple --- */
.block-categories {
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 14px rgba(0,0,0,0.08) !important;
  border: 1px solid rgba(0,0,0,0.07) !important;
  background: #fff !important;
}

/* Titre "ACCUEIL" - style label discret */
.block-categories .block-title {
  background: transparent !important;
  color: #aaa !important;
  font-size: 0.68em !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  padding: 16px 18px 6px !important;
  font-weight: 700 !important;
  border-bottom: none !important;
  margin: 0 !important;
}

.block-categories .block-title span,
.block-categories .block-title button {
  color: #aaa !important;
  font-size: inherit !important;
  background: none !important;
  border: none !important;
}

/* Supprimer les séparateurs entre items */
.block-categories .category-sub-menu,
.block-categories ul {
  border: none !important;
  margin: 0 !important;
  padding: 6px 0 10px !important;
}

.block-categories .category-sub-menu li,
.block-categories ul li {
  border: none !important;
  list-style: none !important;
}

/* Liens principaux */
.block-categories .category-sub-menu > li > a,
.block-categories ul > li > a {
  padding: 8px 18px !important;
  font-size: 0.9em !important;
  color: #333 !important;
  font-weight: 400 !important;
  border-left: 3px solid transparent !important;
  border-bottom: none !important;
  display: flex !important;
  align-items: center !important;
  transition: all 0.15s ease !important;
  text-decoration: none !important;
}

/* Hover */
.block-categories .category-sub-menu > li > a:hover,
.block-categories ul > li > a:hover {
  color: #B12704 !important;
  border-left-color: #B12704 !important;
  background: rgba(177,39,4,0.05) !important;
  padding-left: 22px !important;
}

/* Item actif - bord rouge gauche */
.block-categories .category-sub-menu li.current > a,
.block-categories ul li.current > a {
  color: #B12704 !important;
  border-left: 3px solid #B12704 !important;
  font-weight: 600 !important;
  background: rgba(177,39,4,0.06) !important;
}

/* Bouton expand + -> chevron */
.block-categories .collapse-icons {
  color: #ccc !important;
  font-size: 0.8em !important;
  margin-left: auto !important;
}

.block-categories .collapse-icons .add::before { content: '›' !important; font-size: 1.3em !important; font-style: normal !important; }
.block-categories .collapse-icons .add { font-size: 0 !important; }
.block-categories .collapse-icons .remove::before { content: '⌄' !important; font-size: 1.1em !important; }
.block-categories .collapse-icons .remove { font-size: 0 !important; }

/* Sous-items indentés */
.block-categories .category-sub-menu li ul li a {
  padding-left: 28px !important;
  font-size: 0.85em !important;
  color: #666 !important;
}

.block-categories .category-sub-menu li ul li a:hover {
  color: #B12704 !important;
  padding-left: 32px !important;
}
/* --- HEADER GRADIENT - Option D Premium --- */
#header,
#header .header-top,
.header-top {
  background: linear-gradient(135deg, #1a1c1f 0%, #2d3035 60%, #252830 100%) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,0.35) !important;
  border-bottom: 3px solid #B12704 !important;
}

#header .header-nav,
.header-nav {
  background: linear-gradient(135deg, #1a1c1f 0%, #2d3035 100%) !important;
  border-bottom: none !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.05) !important;
}

/* Panier - Rouge */
#_desktop_cart .blockcart a,
.blockcart a.btn,
.blockcart .cart-products-count,
#_desktop_cart .header,
.blockcart {
  background-color: transparent !important;
}

.blockcart a {
  background: #B12704 !important;
  color: #fff !important;
  border-radius: 10px !important;
  padding: 8px 14px !important;
  font-weight: 600 !important;
  transition: background 0.2s ease !important;
}

.blockcart a:hover {
  background: #8e1e00 !important;
  color: #fff !important;
}
/* --- HEADER GRADIENT - Option D Premium --- */
#header,
#header .header-top,
.header-top {
  background: linear-gradient(135deg, #1a1c1f 0%, #2d3035 60%, #252830 100%) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,0.35) !important;
}

#header .header-nav,
.header-nav {
  background: linear-gradient(135deg, #1a1c1f 0%, #2d3035 100%) !important;
  border-bottom: none !important;
}

/* --- BOUTON PANIER ROUGE --- */
#_desktop_cart a,
.right-nav #_desktop_cart a {
  background: #B12704 !important;
  color: #fff !important;
  border-radius: 10px !important;
  padding: 7px 14px !important;
  font-weight: 600 !important;
  transition: background 0.2s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

#_desktop_cart a:hover {
  background: #8e1e00 !important;
  color: #fff !important;
}

#_desktop_cart a i,
#_desktop_cart a .material-icons {
  color: #fff !important;
}



/* --- LOGO HAUTEUR --- */
/* Colonne logo stretch */
#header .col-md-2.hidden-sm-down,
#header .header-top .col-md-2 {
  align-self: stretch !important;
  display: flex !important;
  align-items: center !important;
  overflow: visible !important;
}
#header .col-md-2 h1,
#header .col-md-2 a {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  overflow: visible !important;
}
/* Forcer la hauteur du logo - contourne img-fluid */
img.logo,
img.logo.img-fluid {
  height: 150px !important;
  margin-top: -10px !important;
  margin-left: -30px !important;
  width: auto !important;
  max-width: none !important;
  max-height: none !important;
}
/* --- LIENS HEADER NOIR --- */
/* Contactez-nous, Déconnexion, Florian Champagne */
.header-nav,
#header .header-nav {
  background: linear-gradient(135deg, #1a1c1f 0%, #2d3035 100%) !important;
}

.header-nav a,
.header-nav span,
#header .header-nav a,
#header .header-nav .user-info a,
#header .header-nav .contact-link a,
.header-top .contact-link,
.header-top .contact-link a,
#_desktop_contact_link a,
.header-top .user-info a,
.header-top .user-info span,
#_desktop_user_info a,
#_desktop_user_info span {
  color: #ffffff !important;
}

#_desktop_user_info a:hover,
#_desktop_contact_link a:hover {
  color: #B12704 !important;
}
/* --- IMAGE CATEGORY COVER --- */
/* Afficher SVG carabine dans la zone cover des pages categorie */
.category-cover {
  min-height: 180px !important;
  position: relative !important;
  overflow: hidden !important;
}

.category-cover picture {
  display: block !important;
  width: 100% !important;
}

/* SVG en background via pseudo-element pour toutes les catégories sans image */
.category-cover:not(:has(img[src*="default"])) {
  background: none;
}

/* Page carabines spécifiquement - background SVG dans le header */
.page-category .category-cover {
  background-image: url('/img/carabine-cover.svg') !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-color: #fff !important;
}
/* --- CATEGORY COVER IMAGE --- */
.page-category .category-cover {
  width: 100% !important;
  border-radius: 14px 14px 0 0 !important;
  overflow: hidden !important;
  display: block !important;
  max-width: 100% !important;
}
.page-category .category-cover picture {
  display: block !important;
  width: 100% !important;
}
.page-category .category-cover img {
  width: 100% !important;
  height: 260px !important;
  object-fit: cover !important;
  object-position: center center !important;
  max-width: none !important;
  border-radius: 14px 14px 0 0 !important;
}
/* --- MOBILE FIXES (max-width: 991.98px) --- */
/* Ne touche pas la version PC */

@media (max-width: 991.98px) {

  /* Logo : reset des marges négatives desktop */
  img.logo, img.logo.img-fluid {
    height: 48px !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
  }

  /* Colonne logo mobile : centrage normal */
  #header .col-md-2.hidden-sm-down,
  #header .header-top .col-md-2 {
    align-items: center !important;
    padding-left: 15px !important;
  }

  /* === HAMBURGER === */
  /* Forcer la visibilité du conteneur hamburger */
  .hidden-md-up.text-sm-center.mobile {
    display: block !important;
  }

  #menu-icon {
    display: block !important;
    cursor: pointer;
    padding: 10px 15px;
    z-index: 1000;
    position: relative;
  }

  /* Créer les 3 barres en CSS pur (indépendant de Material Icons) */
  #menu-icon i.material-icons {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    background-color: #ffffff !important;
    font-size: 0 !important;
    color: transparent !important;
    position: relative !important;
    margin-top: 5px !important;
  }

  #menu-icon i.material-icons::before,
  #menu-icon i.material-icons::after {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    width: 22px !important;
    height: 2px !important;
    background-color: #ffffff !important;
  }

  #menu-icon i.material-icons::before { top: -7px !important; }
  #menu-icon i.material-icons::after  { top:  7px !important; }

  /* Menu mobile ouvert */
  #_mobile_top_menu {
    background-color: #202225 !important;
  }
  #_mobile_top_menu a {
    color: #ffffff !important;
  }

  /* Menu mobile : fond sombre cohérent */
  #mobile_top_menu_wrapper {
    background-color: #202225 !important;
  }

  /* Hamburger sub-catégories */
  .navbar-toggler {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* Image catégorie moins haute sur mobile */
  .page-category .category-cover img {
    height: 160px !important;
  }

  /* Barre contactez-nous : cacher les liens texte uniquement */
  #_desktop_contact_link,
  #_desktop_user_info {
    display: none !important;
  }

  .header-nav {
    background: linear-gradient(135deg, #1a1c1f 0%, #2d3035 100%) !important;
  }

}
/* Cacher la sidebar catégorie PC sur mobile (on a le menu hamburger) */
@media (max-width: 991.98px) {
  .block-categories,
  #left-column,
  #right-column {
    display: none !important;
  }
  /* Forcer le contenu principal à pleine largeur */
  #content-wrapper,
  .col-md-9.col-xs-12 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
}

/* HIDE BLOCK-CATEGORIES PARTOUT (faceted search est en place) */
.block-categories { display: none !important; }

/* ═══════════════════════════════════════════
   PAGE PRODUIT — TTC inline après le prix
   ═══════════════════════════════════════════ */
/* Masquer le bloc TTC standalone (affiché en dessous du prix) */
.tax-shipping-delivery-label {
  display: none !important;
}
/* Afficher TTC directement après la valeur du prix courant */
.current-price-value::after {
  content: " TTC";
  font-size: 0.76em;
  font-weight: 400;
  color: #666;
  vertical-align: middle;
  margin-left: 2px;
}

/* ═══════════════════════════════════════════
   PAGE PRODUIT — Description pleine largeur
   ═══════════════════════════════════════════ */
/* Le bloc tabs est coincé dans col-md-6 (droite) — on le sort visuellement */
.page-product .tabs {
  position: relative;
  width: calc(100% + 570px) !important;
  margin-left: -570px;
  margin-top: 2rem;
  box-sizing: border-box;
}
@media (max-width: 991.98px) {
  .page-product .tabs {
    width: 100% !important;
    margin-left: 0;
  }
}

/* ═══════════════════════════════════════════
   CARROUSEL HOMEPAGE — Standard ratio 3:1
   ═══════════════════════════════════════════
   Les 3 bannières sont au format 2172×724 (ratio 3.00).
   Le CSS Classic parent force .carousel-inner à 340px → crope.
   On bascule sur aspect-ratio pour respecter le ratio natif. */
@media (min-width: 992px) {
  .carousel .carousel-inner {
    height: auto !important;
    aspect-ratio: 3 / 1 !important;
  }
  .carousel .carousel-item,
  .carousel figure,
  .carousel figure img {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover !important;
  }
}

/* ═══════════════════════════════════════════
   MEGA MENU & PAGE CATÉGORIE — Niveau 3 masqué
   ═══════════════════════════════════════════
   Décision session 20 quater (24/04/2026) :
   PS2 passe à 3 niveaux de catégories.
   - Niveau 1 & 2 visibles dans le mega menu
   - Niveau 3 accessible uniquement via sidebar filtre
   On masque donc :
   1. Les ul imbriqués dans les sub-menus (niveau 3 du mega menu)
   2. Le bloc #subcategories sur les pages catégorie
      (redondant avec le filtre sidebar) */
#_desktop_top_menu .popover.sub-menu ul ul {
  display: none !important;
}
#subcategories {
  display: none !important;
}

/* ============================================
   ORANGE THEME OVERRIDE - CZ Hi-Vis #F26522
   Ajoute le 2026-04-25
   ============================================ */

/* Boutons primaires */
.btn-primary,
.btn-primary:not(:disabled):not(.disabled),
button.btn-primary,
.add-to-cart,
#add-to-cart-or-refresh .btn-primary,
.btn-success {
  background-color: #F26522 !important;
  border-color: #F26522 !important;
  color: #FFFFFF !important;
}
.btn-primary:hover,
.btn-primary:focus,
button.btn-primary:hover,
.add-to-cart:hover,
.btn-success:hover {
  background-color: #D8521A !important;
  border-color: #D8521A !important;
  color: #FFFFFF !important;
}

/* Badges promotion / discount */
.product-flag.discount,
.product-flag.discount-percentage,
.product-flag.discount-amount,
.product-flag.on-sale {
  background-color: #F26522 !important;
  color: #FFFFFF !important;
}

/* Tag "CONOMISEZ" sur fiche produit (seul le span.discount, pas le parent .product-discount) */
.discount.discount-percentage,
.discount.discount-amount,
span.discount {
  background-color: #F26522 !important;
  color: #FFFFFF !important;
}

/* Prix actuel (en couleur) */
.current-price-value,
.product-price.current-price,
.product-price .current-price,
.product-prices .current-price {
  color: #F26522 !important;
}

/* Prix barre - bien visible en gris (pas de fond) */
.regular-price,
.product-discount .regular-price {
  background: transparent !important;
  color: #999999 !important;
  text-decoration: line-through !important;
}

/* Compteurs ventes flash */
.ps_specials .countdown,
.ps_specials .countdown-item,
.ps-specials__countdown .number,
.specials-clock-day,
.specials-clock-hour,
.specials-clock-min,
.specials-clock-sec {
  background-color: #F26522 !important;
  color: #FFFFFF !important;
}

/* Lien menu actif et hover */
#_desktop_top_menu .top-menu a:hover,
#_desktop_top_menu .top-menu a:focus,
#_desktop_top_menu .top-menu a.active,
#_desktop_top_menu li.category > a:hover {
  color: #F26522 !important;
}

/* Bordure top du sub-menu mega menu */
#_desktop_top_menu li.category > .popover.sub-menu {
  border-top-color: #F26522 !important;
}

/* Liens accent */
.product-list-active,
.text-primary,
.color-primary {
  color: #F26522 !important;
}

/* Sidebar bordure prix slider */
.ui-slider .ui-slider-range,
.ui-slider .ui-slider-handle {
  background-color: #F26522 !important;
  border-color: #F26522 !important;
}


/* Fix prix barre - .product-discount parent ne doit pas avoir de fond orange */
.product-discount {
  background: transparent !important;
  background-color: transparent !important;
}
.product-discount .regular-price {
  background: transparent !important;
  background-color: transparent !important;
  color: #999999 !important;
  text-decoration: line-through !important;
}


/* PHASE B - 2026-04-25 19h - Complements orange */

/* B1 - Prix flash module ventes flash */
.vf-product-card strong,
.vf-product-info strong,
.vf-section strong {
  color: #F26522 !important;
}
.vf-icon,
.vf-section .h2,
.vf-section h2 {
  color: #F26522 !important;
}

/* B2 - Voir tout */
.vf-see-all,
a.vf-see-all { color: #F26522 !important; }
.vf-see-all:hover { color: #D8521A !important; }

/* B3 - Trait gauche titre featured/promotions */
.featured-products .h2,
.featured-products .products-section-title,
.products-section-title {
  border-left-color: #F26522 !important;
}

/* B5 - Onglet actif */
.nav-tabs .nav-link.active,
.nav-tabs .nav-link.active:focus,
.nav-tabs .nav-link.active:hover,
.product-tabs .nav-link.active,
.tabs .nav-link.active {
  color: #F26522 !important;
  border-bottom-color: #F26522 !important;
}

/* B6 - Donnez votre avis */
.btn.btn-comment,
.btn-comment,
.post-product-comment {
  background-color: #F26522 !important;
  border-color: #F26522 !important;
  color: #FFFFFF !important;
}
.btn.btn-comment:hover,
.btn-comment:hover {
  background-color: #D8521A !important;
  border-color: #D8521A !important;
}

/* B7 - Encadre miniature image active */
img.thumb.selected,
img.thumb.js-thumb-selected,
.thumb.selected,
.js-thumb-selected,
.js-thumb.selected {
  border-color: #F26522 !important;
}

/* B8 ANNULE - retour blanc par defaut */

/* B9 ANNULE - voir Phase C pour panier */


/* PHASE B FIX SUPPRIME EN PHASE C */

/* Hover sur ces memes elements */
.header-top .blockcart a:hover,
.header-top .user-info a:hover,
.header-top a:hover,
.header-top .contact-link a:hover,
#_desktop_cart .header a:hover,
.header-nav a:hover,
#header .header-nav a:hover,
#header .header-nav .user-info a:hover,
#header .header-nav .contact-link a:hover,
#_desktop_contact_link a:hover,
#_desktop_user_info a:hover {
  color: #D8521A !important;
}


/* PHASE C - 2026-04-25 - Cadre panier orange + ventes flash badges/timer + retour B8/B9 blanc */

/* C1 - Cadre/fond du Panier en orange (texte reste blanc par defaut) */
#_desktop_cart a,
#_desktop_cart .blockcart a,
.header-top #_desktop_cart a {
  background-color: #F26522 !important;
}
#_desktop_cart a,
#_desktop_cart .blockcart a,
.header-top #_desktop_cart a,
#_desktop_cart .cart-products-count {
  color: #FFFFFF !important;
}
#_desktop_cart a:hover {
  background-color: #D8521A !important;
}

/* C2 - Badges remise -34% / -42% des cards module Ventes Flash */
.vf-badge,
.vf-product-card .vf-badge,
.vf-discount-badge {
  background-color: #F26522 !important;
  color: #FFFFFF !important;
}

/* C3 - Timer countdown ventes flash (rectangles avec chiffres) */
.vf-time-unit,
.vf-section .vf-time-unit,
.vf-timer .vf-time-unit {
  background-color: #F26522 !important;
  color: #FFFFFF !important;
}


/* PHASE C FIX - Panier orange (specificite >= 211 pour battre les regles existantes) */
#header .right-nav #_desktop_cart a,
#header #_desktop_cart .blockcart a,
body #header #_desktop_cart a,
body .right-nav #_desktop_cart a {
  background-color: #F26522 !important;
  color: #FFFFFF !important;
}
#header .right-nav #_desktop_cart a:hover,
#header #_desktop_cart .blockcart a:hover,
body #header #_desktop_cart a:hover {
  background-color: #D8521A !important;
}


/* PHASE D - Header bottom bar orange */
#header,
header#header,
.header-top,
body #header {
  border-bottom-color: #F26522 !important;
}



/* PHASE E - Override hover des onglets nav-link (etait bleu turquoise) */
body .tabs .nav-tabs .nav-link:hover,
body .nav-tabs .nav-link:hover,
.product-tabs .nav-link:hover,
.tabs .nav-tabs .nav-link:hover {
  color: #F26522 !important;
  border-bottom-color: #F26522 !important;
}



/* PHASE F - Page checkout : encadre adresse + radio + liens en orange */

/* F1 - Encadre adresse selectionnee (border bleu turquoise) */
.address-item.selected,
article.js-address-item.selected,
article.address-item.selected,
.address-selector .selected {
  border-color: #F26522 !important;
}

/* F2 - Radio button (rond bleu) - utiliser accent-color (CSS3 moderne) */
input[type=radio],
input[type=checkbox] {
  accent-color: #F26522 !important;
}

/* F3 - Lien "L'adresse de facturation est differente..." */
a[data-link-action="different-invoice-address"],
a[data-link-action="add-invoice-address"],
.js-address-form a {
  color: #F26522 !important;
}

/* F4 - "afficher les details" du recap commande */
.js-show-details,
a.js-show-details,
.cart-summary a.js-show-details {
  color: #F26522 !important;
}

/* F5 - "Vous avez un code promo ?" */
.collapse-button,
.promo-code-button,
a.collapse-button,
.cart-summary .collapse-button,
.promo-code .collapse-button {
  color: #F26522 !important;
}



/* === V20 Template category - image plein largeur + accroche en haut + SEO en bas === */
.category-cover-full { width: 100%; margin-top: 1rem; }
.category-cover-full picture, .category-cover-full picture img { display: block; width: 100% !important; height: auto !important; max-width: 100%; }
.category-short { font-size: 1.05rem; color: #555; margin: 0.5rem 0 1rem; line-height: 1.45; }
.block-category-footer { margin-top: 2rem; padding: 1.5rem; }
.block-category-footer .text-muted h2 { font-size: 1.4rem; margin-top: 1rem; color: #333; }
.block-category-footer .text-muted h3 { font-size: 1.2rem; margin-top: 1rem; color: #444; }
.block-category-footer .text-muted p { margin-bottom: 1rem; }

/* === Badges Nouveau & Rupture (12/05/2026) === */
.product-flag.new {
  background-color: #28A745 !important;
  color: #FFFFFF !important;
}
.product-flag.out_of_stock,
.product-flag.online-only {
  background-color: #DC3545 !important;
  color: #FFFFFF !important;
}

/* === Titre vignette produit : 2 lignes max avec ellipsis (12/05/2026) === */
.product-miniature .product-title a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 2.8em;
  line-height: 1.4;
}

/* === Fix menu mobile : afficher les sous-menus quand Bootstrap collapse les ouvre (12/05/2026) === */
@media (max-width: 991.98px) {
  .top-menu .sub-menu {
    position: static !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    box-shadow: none !important;
    transition: none !important;
    border-radius: 0 !important;
  }
  .top-menu .sub-menu.collapse,
  .top-menu .collapse {
    visibility: hidden;
    opacity: 0;
  }
  .top-menu .sub-menu.collapse.show,
  .top-menu .collapse.show,
  .top-menu .sub-menu.collapse.in,
  .top-menu .collapse.in {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .top-menu .collapse:not(.show):not(.in) {
    display: none !important;
  }
}

/* === Fix menu mobile : couleurs identiques au mega menu PC (13/05/2026) === */
@media (max-width: 991.98px) {
  /* Fond sombre + bordure orange identique au mega menu PC */
  .top-menu .sub-menu,
  .top-menu .popover.sub-menu {
    background-color: #202225 !important;
    border-top: 3px solid #F26522 !important;
    padding: 8px 0 !important;
  }
  /* Liens des sous-categories : gris clair lisible */
  .top-menu .sub-menu a.dropdown-item,
  .top-menu .sub-menu ul li a {
    color: #b0b8c1 !important;
    padding: 10px 24px !important;
    display: block !important;
    text-decoration: none !important;
  }
  /* Hover / focus / actif : orange */
  .top-menu .sub-menu a.dropdown-item:hover,
  .top-menu .sub-menu a.dropdown-item:focus,
  .top-menu .sub-menu a.dropdown-item:active,
  .top-menu .sub-menu ul li a:hover,
  .top-menu .sub-menu li.current > a {
    color: #F26522 !important;
    background-color: rgba(255,255,255,0.04) !important;
  }
  /* Icones +/- toggler : couleur visible sur fond sombre */
  .top-menu .sub-menu .collapse-icons i,
  .top-menu .sub-menu .navbar-toggler i {
    color: #b0b8c1 !important;
  }
}

/* === Fix menu mobile : override classic #mobile_top_menu_wrapper (13/05/2026) === */
@media (max-width: 991.98px) {
  /* Wrapper offcanvas mobile lui-meme : fond sombre */
  #mobile_top_menu_wrapper {
    background-color: #202225 !important;
  }
  /* Sub-menus dans le wrapper mobile : meme couleurs que le mega menu PC */
  #mobile_top_menu_wrapper .top-menu .sub-menu,
  #mobile_top_menu_wrapper .top-menu .sub-menu.collapse,
  #mobile_top_menu_wrapper .top-menu .popover.sub-menu,
  #mobile_top_menu_wrapper .top-menu .collapse {
    background-color: #202225 !important;
    background: #202225 !important;
  }
  /* Bordure orange en haut des sub-menus de premier niveau */
  #mobile_top_menu_wrapper .top-menu > li.category > .popover.sub-menu,
  #mobile_top_menu_wrapper .top-menu > li.category > .collapse {
    border-top: 3px solid #F26522 !important;
  }
  /* Liens : texte gris clair lisible */
  #mobile_top_menu_wrapper .top-menu a,
  #mobile_top_menu_wrapper .top-menu a.dropdown-item,
  #mobile_top_menu_wrapper .top-menu .sub-menu a,
  #mobile_top_menu_wrapper .top-menu .sub-menu ul li a {
    color: #b0b8c1 !important;
  }
  /* Items principaux (top-level) en blanc */
  #mobile_top_menu_wrapper > .row > .container > .top-menu > li > a,
  #mobile_top_menu_wrapper .top-menu[data-depth="0"] > li > a {
    color: #FFFFFF !important;
  }
  /* Hover orange */
  #mobile_top_menu_wrapper .top-menu a:hover,
  #mobile_top_menu_wrapper .top-menu a:focus,
  #mobile_top_menu_wrapper .top-menu a:active {
    color: #F26522 !important;
  }
  /* Icones +/- visibles sur fond sombre */
  #mobile_top_menu_wrapper .top-menu .collapse-icons i,
  #mobile_top_menu_wrapper .top-menu .navbar-toggler i {
    color: #b0b8c1 !important;
  }
}

/* === Fix menu mobile : MAX specificity override blanc residuel (13/05/2026) === */
@media (max-width: 991.98px) {
  html body #mobile_top_menu_wrapper .top-menu .popover.sub-menu,
  html body #mobile_top_menu_wrapper .top-menu li.category > .popover.sub-menu,
  html body #mobile_top_menu_wrapper .top-menu .sub-menu.collapse,
  html body #mobile_top_menu_wrapper .top-menu .sub-menu,
  html body #mobile_top_menu_wrapper ul.top-menu .sub-menu,
  html body #_mobile_top_menu .top-menu .sub-menu,
  html body #_mobile_top_menu .top-menu .popover.sub-menu,
  html body #_mobile_top_menu .top-menu .collapse,
  html body #_mobile_top_menu .popover.sub-menu {
    background: #202225 !important;
    background-color: #202225 !important;
    background-image: none !important;
    border-top: 3px solid #F26522 !important;
  }
  /* Tous les liens dans le wrapper mobile : gris clair lisible */
  html body #mobile_top_menu_wrapper .top-menu a,
  html body #mobile_top_menu_wrapper .top-menu .sub-menu a,
  html body #mobile_top_menu_wrapper .top-menu .sub-menu ul li a,
  html body #_mobile_top_menu .top-menu a,
  html body #_mobile_top_menu .top-menu .sub-menu a {
    color: #b0b8c1 !important;
    background: transparent !important;
  }
}