/* ============================================
   ACCESBYD — CSS COMPLET FINAL
   Version nettoyee, sans doublons
   EFFACEZ TOUT et collez uniquement ceci
   ============================================ */


/* --- LOGO --- */
#header .header-logo img, .header-top .logo img,
#_desktop_logo img, .header-logo img {
  max-width: 250px !important;
  max-height: 60px !important;
  height: auto !important;
  width: auto !important;
  object-fit: contain;
}


/* ========================================================
   HERO — HOMEPAGE UNIQUEMENT (body.index / body.page-index)
   ======================================================== */

/* Fond sombre */
body.index .container-filter,
body.page-index .container-filter {
  background: linear-gradient(135deg, #0f1724 0%, #1a2740 50%, #0d1520 100%) !important;
  padding: 45px 20px 40px !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

body.index .container-filter > .wrapper,
body.page-index .container-filter > .wrapper {
  max-width: 900px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

/* Titre */
body.index .container-filter .filter-head-title,
body.page-index .container-filter .filter-head-title {
  font-size: 0px !important;
  line-height: 0 !important;
  color: transparent !important;
  text-align: center !important;
  margin: 0 0 4px 0 !important;
  width: 100% !important;
  display: block !important;
  float: none !important;
}

body.index .container-filter .filter-head-title::after,
body.page-index .container-filter .filter-head-title::after {
  content: "Trouvez vos pièces BYD en 3 clics" !important;
  font-size: 28px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  display: block !important;
  text-align: center !important;
  width: 100% !important;
}

body.index .container-filter .filter-head-title img,
body.index .container-filter .filter-head-title i,
body.index .container-filter .filter-head-title svg,
body.page-index .container-filter .filter-head-title img,
body.page-index .container-filter .filter-head-title i,
body.page-index .container-filter .filter-head-title svg {
  display: none !important;
}

/* Sous-titre */
body.index .container-filter .filter-type,
body.page-index .container-filter .filter-type {
  text-align: center !important;
  margin-bottom: 24px !important;
  width: 100% !important;
  float: none !important;
  display: block !important;
}

body.index .container-filter .filter-type::after,
body.page-index .container-filter .filter-type::after {
  content: "Plus de 10 000 références compatibles BYD" !important;
  display: block !important;
  font-size: 14px !important;
  color: rgba(255, 255, 255, 0.55) !important;
  margin: 4px 0 20px 0 !important;
}

/* Onglets */
body.index .container-filter .filter-type ul,
body.page-index .container-filter .filter-type ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 auto !important;
  display: inline-flex !important;
  gap: 8px !important;
  background: transparent !important;
  float: none !important;
}

body.index .container-filter .filter-type ul li,
body.page-index .container-filter .filter-type ul li {
  list-style: none !important;
  background: transparent !important;
  float: none !important;
}

body.index .container-filter .filter-type ul li a,
body.page-index .container-filter .filter-type ul li a {
  display: inline-block !important;
  padding: 9px 24px !important;
  border-radius: 25px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.6) !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  cursor: pointer !important;
  text-decoration: none !important;
}

body.index .container-filter .filter-type ul li a:hover,
body.page-index .container-filter .filter-type ul li a:hover {
  background: rgba(255, 255, 255, 0.18) !important;
  color: #fff !important;
}

body.index .container-filter .filter-type ul li a.active,
body.page-index .container-filter .filter-type ul li a.active {
  background: rgba(59, 125, 221, 0.3) !important;
  color: #fff !important;
  border-color: rgba(59, 125, 221, 0.5) !important;
}

/* Masquer mode inactif */
body.index .container-filter #filter-type-1:not(.active),
body.index .container-filter .filter-type-1-content:not(.active),
body.index .container-filter #filter-type-2:not(.active),
body.index .container-filter .filter-type-2-content:not(.active),
body.page-index .container-filter #filter-type-1:not(.active),
body.page-index .container-filter .filter-type-1-content:not(.active),
body.page-index .container-filter #filter-type-2:not(.active),
body.page-index .container-filter .filter-type-2-content:not(.active) {
  display: none !important;
}

/* Masquer H4 redondant */
body.index .container-filter .block.leo-partsfilter h4.title_block,
body.page-index .container-filter .block.leo-partsfilter h4.title_block {
  display: none !important;
}

/* Masquer erreur */
body.index .container-filter .leo-filter-display,
body.index .container-filter .leo-filter-content,
body.page-index .container-filter .leo-filter-display,
body.page-index .container-filter .leo-filter-content {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
}


/* --- MODE 1 : SELECTS --- */
body.index .container-filter #filter-type-1,
body.page-index .container-filter #filter-type-1 {
  max-width: 850px !important;
  margin: 0 auto !important;
}

body.index .container-filter #mmy,
body.page-index .container-filter #mmy {
  display: block !important;
  width: 100% !important;
}

body.index .container-filter #mmy tbody,
body.page-index .container-filter #mmy tbody {
  display: block !important;
}

body.index .container-filter #mmy tr.field-search,
body.page-index .container-filter #mmy tr.field-search {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  align-items: stretch !important;
  justify-content: center !important;
}

body.index .container-filter #mmy td.value-search,
body.page-index .container-filter #mmy td.value-search {
  display: block !important;
  flex: 1 1 0 !important;
  padding: 0 !important;
  border: none !important;
}

body.index .container-filter .bootstrap-select,
body.page-index .container-filter .bootstrap-select {
  width: 100% !important;
}

body.index .container-filter .bootstrap-select > .btn,
body.page-index .container-filter .bootstrap-select > .btn {
  background: rgba(255, 255, 255, 0.97) !important;
  border: 2px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  font-size: 13px !important;
  height: auto !important;
  line-height: 1.4 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
  width: 100% !important;
}

body.index .container-filter .bootstrap-select > .btn:hover,
body.page-index .container-filter .bootstrap-select > .btn:hover {
  border-color: #3B7DDD !important;
}


/* --- MODE 2 : RECHERCHE LIBRE --- */
body.index #filter-type-2.active .block_content,
body.page-index #filter-type-2.active .block_content,
body.index .filter-type-2-content.active .block_content,
body.page-index .filter-type-2-content.active .block_content {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 16px !important;
  max-width: 600px !important;
  margin: 0 auto !important;
}

body.index #filter-type-2 .free-search-input,
body.page-index #filter-type-2 .free-search-input {
  width: 100% !important;
  max-width: 100% !important;
  background: rgba(255, 255, 255, 0.97) !important;
  border: 2px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 10px !important;
  padding: 14px 20px !important;
  font-size: 14px !important;
  color: #333 !important;
  display: block !important;
  box-sizing: border-box !important;
  position: static !important;
  float: none !important;
  margin: 0 !important;
  order: 1 !important;
}

body.index div.leo-partsfilter-submit-2,
body.page-index div.leo-partsfilter-submit-2 {
  position: static !important;
  display: flex !important;
  justify-content: center !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  transform: none !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  order: 2 !important;
  clear: both !important;
}


/* --- BOUTON RECHERCHER — GLOBAL (homepage + sidebar) ---
   Flat, sans hover, sans contour, sans fleche          */

/* Le bouton */
body .container-filter span.label.label-primary,
body .container-filter .leo-partsfilter-submit span.label,
body .container-filter .leo-partsfilter-submit span.label.label-primary {
  background: #3B7DDD !important;
  background-color: #3B7DDD !important;
  background-image: none !important;
  color: #ffffff !important;
  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;
  border-color: transparent !important;
  outline: 0 !important;
  outline-width: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  text-shadow: none !important;
  border-radius: 10px !important;
  padding: 14px 30px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  transition: none !important;
  min-height: 48px !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

/* Hover = identique, aucun changement */
body .container-filter span.label.label-primary:hover,
body .container-filter .leo-partsfilter-submit span.label:hover,
body .container-filter .leo-partsfilter-submit span.label.label-primary:hover {
  background: #3B7DDD !important;
  background-color: #3B7DDD !important;
  color: #ffffff !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Focus + Active = identique */
body .container-filter span.label.label-primary:focus,
body .container-filter span.label.label-primary:active {
  background: #3B7DDD !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Supprimer la fleche > et tout pseudo-element */
body .container-filter .leo-partsfilter-submit span.label::after,
body .container-filter .leo-partsfilter-submit span.label::before,
body .container-filter .leo-partsfilter-submit span.label-primary::after,
body .container-filter .leo-partsfilter-submit span.label-primary::before,
body .container-filter .leo-partsfilter-submit .button-text::after,
body .container-filter .leo-partsfilter-submit .button-text::before {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* Masquer le spinner */
body .container-filter .leo-partsfilter-submit .leo-process {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* Texte du bouton */
body .container-filter .leo-partsfilter-submit .button-text {
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  text-decoration: none !important;
  text-transform: none !important;
}

/* Container du bouton mode 1 */
body.index td.leo-partsfilter-submit-1,
body.page-index td.leo-partsfilter-submit-1 {
  display: flex !important;
  align-items: stretch !important;
  flex: 0 0 auto !important;
  padding: 0 !important;
  border: none !important;
}


/* ========================================================
   RESPONSIVE — HOMEPAGE
   ======================================================== */

@media (max-width: 991px) {
  body.index .container-filter #mmy tr.field-search,
  body.page-index .container-filter #mmy tr.field-search {
    flex-wrap: wrap !important;
  }
  body.index .container-filter #mmy td.value-search,
  body.page-index .container-filter #mmy td.value-search {
    flex: 1 1 45% !important;
    min-width: 200px !important;
  }
  body.index td.leo-partsfilter-submit-1,
  body.page-index td.leo-partsfilter-submit-1 {
    flex: 1 1 100% !important;
  }
  body.index td.leo-partsfilter-submit-1 span.label.label-primary,
  body.page-index td.leo-partsfilter-submit-1 span.label.label-primary {
    width: 100% !important;
    justify-content: center !important;
  }
}

@media (max-width: 768px) {
  body.index .container-filter,
  body.page-index .container-filter {
    padding: 30px 14px 25px !important;
  }
  body.index .container-filter .filter-head-title::after,
  body.page-index .container-filter .filter-head-title::after {
    font-size: 22px !important;
  }
  body.index .container-filter .filter-type::after,
  body.page-index .container-filter .filter-type::after {
    font-size: 12px !important;
  }
  body.index .container-filter #mmy tr.field-search,
  body.page-index .container-filter #mmy tr.field-search {
    flex-direction: column !important;
  }
  body.index .container-filter #mmy td.value-search,
  body.page-index .container-filter #mmy td.value-search {
    width: 100% !important;
    flex: 1 1 100% !important;
  }
  body.index td.leo-partsfilter-submit-1 span.label.label-primary,
  body.page-index td.leo-partsfilter-submit-1 span.label.label-primary,
  body.index div.leo-partsfilter-submit-2 span.label.label-primary,
  body.page-index div.leo-partsfilter-submit-2 span.label.label-primary {
    width: 100% !important;
    padding: 14px 20px !important;
    justify-content: center !important;
  }
}

@media (max-width: 480px) {
  body.index .container-filter .filter-type ul,
  body.page-index .container-filter .filter-type ul {
    flex-direction: column !important;
    align-items: center !important;
  }
}


/* ========================================================
   SIDEBAR — PAGES CATEGORIE / PRODUIT
   ======================================================== */

body:not(.index):not(.page-index) .container-filter {
  background: #f8f9fa !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 10px !important;
  padding: 18px 14px !important;
  margin-bottom: 16px !important;
}

body:not(.index):not(.page-index) .container-filter .filter-head-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #333 !important;
  text-align: left !important;
  margin-bottom: 12px !important;
}

body:not(.index):not(.page-index) .container-filter .filter-head-title::after {
  display: none !important;
}

body:not(.index):not(.page-index) .container-filter .filter-type::after {
  display: none !important;
}

body:not(.index):not(.page-index) .container-filter .filter-type ul li a {
  padding: 6px 14px !important;
  font-size: 12px !important;
  border-radius: 20px !important;
  color: #555 !important;
  background: #fff !important;
  border: 1px solid #ddd !important;
}

body:not(.index):not(.page-index) .container-filter .filter-type ul li a.active {
  background: #3B7DDD !important;
  color: #fff !important;
  border-color: #3B7DDD !important;
}

body:not(.index):not(.page-index) .container-filter #mmy tr.field-search {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

body:not(.index):not(.page-index) .container-filter #mmy td.value-search {
  width: 100% !important;
  display: block !important;
  padding: 0 !important;
}

body:not(.index):not(.page-index) .container-filter .bootstrap-select > .btn {
  padding: 10px 12px !important;
  font-size: 13px !important;
  border-radius: 8px !important;
  border: 1px solid #ddd !important;
}

body:not(.index):not(.page-index) .container-filter td.leo-partsfilter-submit {
  width: 100% !important;
  display: block !important;
  padding: 0 !important;
  border: none !important;
}

body:not(.index):not(.page-index) div.leo-partsfilter-submit-2 {
  position: static !important;
  margin-top: 8px !important;
  float: none !important;
}

/* Masquer mode inactif en sidebar */
body:not(.index):not(.page-index) .container-filter #filter-type-1:not(.active),
body:not(.index):not(.page-index) .container-filter .filter-type-1-content:not(.active),
body:not(.index):not(.page-index) .container-filter #filter-type-2:not(.active),
body:not(.index):not(.page-index) .container-filter .filter-type-2-content:not(.active) {
  display: none !important;
}

/* Masquer erreur en sidebar */
body:not(.index):not(.page-index) .container-filter .leo-filter-display,
body:not(.index):not(.page-index) .container-filter .leo-filter-content {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
}


/* ===== FIX BOUTON RECHERCHER — MODE RECHERCHE GRATUITE ===== */

/* Le parent doit servir de référent au positionnement absolu */
body.index #filter-type-2 > .block_content,
body.page-index #filter-type-2 > .block_content {
    position: relative !important;
}

/* Repositionner le bouton DANS le champ */
body.index #filter-type-2 .leo-partsfilter-submit-2,
body.page-index #filter-type-2 .leo-partsfilter-submit-2 {
    position: absolute !important;
    right: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    left: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    z-index: 10 !important;
}

/* Style propre du bouton */
body.index #filter-type-2 .leo-partsfilter-submit-2 .label-primary,
body.page-index #filter-type-2 .leo-partsfilter-submit-2 .label-primary {
    background: #3B7DDD !important;
    color: #fff !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    border-radius: 20px !important;
    padding: 10px 24px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

body.index #filter-type-2 .leo-partsfilter-submit-2 .label-primary:hover,
body.page-index #filter-type-2 .leo-partsfilter-submit-2 .label-primary:hover {
    background: #2B5EA8 !important;
}

/* ================================================
   AJOUTS — CACHER RECHERCHE GRATUITE + TITRE
   Coller À LA FIN du CSS existant dans Custom CSS
   ================================================ */

/* --- Cacher le titre "Sélectionnez Votre Véhicule" au-dessus du hero --- */
body.index .block.leo-partsfilter > h2,
body.index .block.leo-partsfilter > .title_block,
body.index #leo-partsfilter-box > h2,
body.index #leo-partsfilter-box > .title_block,
body.page-index .block.leo-partsfilter > h2,
body.page-index .block.leo-partsfilter > .title_block,
body.page-index #leo-partsfilter-box > h2,
body.page-index #leo-partsfilter-box > .title_block {
    display: none !important;
}

/* --- Cacher les onglets "Marque et module / Recherche gratuite" --- */
body.index .container-filter .filter-type ul,
body.page-index .container-filter .filter-type ul {
    display: none !important;
}

/* --- Cacher le mode 2 "Recherche gratuite" entièrement --- */
body.index #filter-type-2,
body.index .filter-type-2-content,
body.page-index #filter-type-2,
body.page-index .filter-type-2-content {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

/* --- Forcer le mode 1 toujours visible --- */
body.index #filter-type-1,
body.index .filter-type-1-content,
body.page-index #filter-type-1,
body.page-index .filter-type-1-content {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* --- Ajuster le sous-titre (retirer la marge des onglets supprimés) --- */
body.index .container-filter .filter-type::after,
body.page-index .container-filter .filter-type::after {
    margin: 4px 0 10px 0 !important;
}