/* ============================================================
   Divider Configurator – Eurostat Group
   CSS injecté dans le thème. Uniquement le CTA des fiches produit :
   le configurateur lui-même est une page autonome avec son propre style.

   Toutes les classes sont préfixées .dvc- pour ne rien faire fuir
   dans le thème « fashionseo ohweb ».
   ============================================================ */

.dvc-cta-banner {
  display: flex;
  align-items: center;
  gap: 18px;
  background: #e8f6fc;
  border: 1px solid #b3dfee;
  border-left: 4px solid #1b9ac6;
  border-radius: 10px;
  padding: 20px 22px;
  margin: 32px 0;
  flex-wrap: wrap;
}

.dvc-cta-banner__icon {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  color: #1b9ac6;
}

.dvc-cta-banner__icon svg {
  width: 100%;
  height: 100%;
}

.dvc-cta-banner__body {
  flex: 1;
  min-width: 180px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.dvc-cta-banner__body strong {
  font-size: .95rem;
  color: #293647;
  font-weight: 700;
}

.dvc-cta-banner__body span {
  font-size: .85rem;
  color: #8f96a0;
  line-height: 1.45;
}

.dvc-cta-banner__btn {
  background: #1b9ac6;
  color: #fff;
  border-radius: 6px;
  padding: 10px 22px;
  font-size: .875rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition: background .18s;
  flex-shrink: 0;
}

.dvc-cta-banner__btn:hover,
.dvc-cta-banner__btn:focus {
  background: #157fa8;
  color: #fff;
  text-decoration: none;
}

/* Variante compacte, à côté des boutons de la fiche produit */
.dvc-product-btn {
  margin-top: 15px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

@media (max-width: 640px) {
  .dvc-cta-banner {
    flex-direction: column;
    align-items: flex-start;
  }
  .dvc-cta-banner__btn {
    width: 100%;
    text-align: center;
  }
}