/* ==========================================================================
   JoliSearch (ambjolisearch) – suggestions de recherche, thème « modern »
   Aligne titres produit / catégorie / prix sur les listings produits,
   titres de section en rouge site et CTA « Montrer tous les résultats »
   sur la base des boutons du site.
   ========================================================================== */
.jolisearch-dropdown,
.jolisearch-dropdown.jolisearch-theme-modern {
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
}

.jolisearch-dropdown.jolisearch-theme-modern {
  padding: 0.75rem 0.75rem 0.25rem;
}

/* Titres de section : NOS PRODUITS / NOS CATÉGORIES / NOS MARQUES */
.jolisearch-dropdown .jolisearch-section .jolisearch-title,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.jolisearch-section .jolisearch-title {
  padding: 6px 14px;
  font-size: var(--size-14);
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: #fff;
  text-shadow: none;
  background: var(--primary-color);
  border-radius: 4px 4px 0 0;
  box-shadow: none;
}

.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.jolisearch-section .jolisearch-title {
  margin-top: -2.25rem;
  margin-left: 0;
}

.jolisearch-dropdown .jolisearch-section .jolisearch-title::after,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.jolisearch-section .jolisearch-title::after {
  display: none;
}

@media (max-width: 576px) {
  .jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.jolisearch-section .jolisearch-title {
    margin-left: 0;
  }
}

/* Vignettes de résultat */
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item a {
  gap: 4px;
  padding: 8px 6px;
  color: var(--secondary-color);
  border-radius: 6px;
}

.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item a:hover {
  border-color: #d9d9d9;
  border-radius: 6px;
}

.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item:not(.more-results) a:focus,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item:not(.more-results) a.jolisearch-item--focus,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item:not(.more-results) a.jolisearch-item--active {
  outline-color: var(--primary-color);
  background-color: rgba(229, 0, 12, 0.05) !important;
}

.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-description,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-description.category,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-description.manufacturer,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-description.supplier {
  gap: 2px;
  height: auto;
  padding: 0;
}

.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-description span {
  padding-left: 0;
  font-size: var(--size-14);
}

/* Vignette : texte alternatif discret quand l'image est absente */
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-image {
  max-width: 100%;
  font-size: var(--size-12);
  line-height: 1.2;
  color: #9b9b9b;
}

/* Marque au-dessus du nom : rouge site, comme .product-miniature__brand */
.jolisearch-dropdown .jolisearch-pre,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-pre {
  font-size: var(--size-14);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--primary-color);
}

/* Nom du produit / de la catégorie : noir, gras, comme .product-miniature__title */
.jolisearch-dropdown .jolisearch-name,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-name {
  display: -webkit-box;
  overflow: hidden;
  font-size: var(--size-16);
  font-weight: 700;
  line-height: 1.25;
  color: #000;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

/* Catégorie du produit : rouge site */
.jolisearch-dropdown .jolisearch-post,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-post {
  font-size: var(--size-14);
  font-weight: 400;
  line-height: 1.25;
  color: var(--primary-color);
}

/* Caractéristiques */
.jolisearch-dropdown .jolisearch-features,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-features {
  font-size: var(--size-12);
  color: #666;
}

/* Prix : rouge site, gras, comme .product-miniature__price */
.jolisearch-dropdown .jolisearch-price,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-price {
  margin-top: 4px;
  font-size: var(--size-18);
  font-weight: 700;
  line-height: 1.1;
  color: var(--primary-color);
}

/* Nombre de résultats (catégories, marques) */
.jolisearch-dropdown .jolisearch-results,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-results {
  font-size: var(--size-14);
  color: #6f6f6f;
}

/* CTA « Montrer tous les résultats » : base des boutons du site */
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.more-results {
  display: flex;
  justify-content: center;
  margin: 0.75rem 0 0.5rem;
}

.jolisearch-dropdown .jolisearch-item.more-results a,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.more-results a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  padding: 10px 24px;
  font-size: var(--size-16);
  font-weight: 700;
  color: #fff;
  text-align: center;
  background-color: var(--primary-color);
  border: 0;
  border-radius: var(--btn-border-radius);
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* !important nécessaire : le module force background:transparent au survol
   et un fond bleuté au focus sur tous les items du panneau. */
.jolisearch-dropdown .jolisearch-item.more-results a:hover,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.more-results a:hover,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.more-results a:focus,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.more-results a.jolisearch-item--focus,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item.more-results a.jolisearch-item--active {
  color: #fff;
  background-color: var(--secondary-color) !important;
  border-color: var(--secondary-color);
  box-shadow: none;
  outline-color: var(--secondary-color);
}

/* Aucun résultat */
.jolisearch-dropdown .jolisearch-item-no-results,
.jolisearch-dropdown.jolisearch-theme-modern .jolisearch-item-no-results {
  font-size: var(--size-16);
  color: var(--secondary-color);
}