/* Carte principale */
.cf-card2{
  max-width:100%;
  background:#fff;
  padding:16px;
  border-radius:12px;
}

.js-cf-total, .js-cf-count {
    color: #9c182f;     /* Moise : couleur du compteur des contributeurs */
font-size: 20px;
 font-weight: 900;
line-height:1.3;
}

.js-cf-count {
    display: block;
}

.cf2-line:first-child {
    margin-right: 30px;
}

/* Dégradé derrière la loco */
.cf2-bg{
  position:absolute;
  inset:0;
  z-index:0;
  background:#fff; /* ou #f7f7f7 */
}

/* Dégradé global (optionnel, tu peux le retirer si tu ne veux que la version “calée”) */
.cf2-gradient{
  position:absolute;
  inset:0;
  z-index:0;
  //background: linear-gradient(to bottom, #b5b5b5 0%, #ffffff 70%);
  opacity:0.25; /* léger, pour garder un rendu doux */
}

/* Dégradé “coloré” révélé (dans la fenêtre) */
.cf2-gradient-reveal{
  position:absolute;
  inset:0;
  background: linear-gradient(to bottom, #b5b5b5 0%, #ffffff 70%);
}

/* Images loco */
.cf2-loco{
  display:block;
  width:100%;
  height:auto;
  position:relative;
  z-index:1;
  pointer-events:none;



}

/* Conteneur parent : centrer le module */
.cf2-media {
    display: flex;
    justify-content: center; /* centre horizontalement */
    background: #fff;        /* couleur de fond du conteneur */
    position: relative;
}

/* Wrapper pour bordure et padding */
.cf2-gauge-wrapper {
    /* border: 2px solid #888;   bordure gris uniforme */
    /* padding: 8px;             espace entre bordure et jauge */
    display: inline-block;     /* largeur s’adapte au contenu */
    box-sizing: border-box;    /* inclut bordure dans la largeur */
    max-width: 100%;           /* ne dépasse jamais la largeur du conteneur */
}

/* Jauge interne */
.cf2-gauge {
    position: relative;
    width: 370px;             /* largeur de base pour desktop */
    max-width: 100%;          /* ne dépasse jamais le conteneur parent */
}

/* ---------------- */
/* Responsive       */
/* ---------------- */

/* Tablettes et petits écrans */
@media (max-width: 768px) {
    .cf2-gauge {
        width: 80%;           /* occupe 80% de l’écran */
    }
}

/* Téléphones */
@media (max-width: 480px) {
    .cf2-gauge {
        width: 95%;           /* presque toute la largeur de l’écran */
    }

    .cf2-gauge-wrapper {
          /* padding: 5px;        réduire padding sur mobile */
    }
}


/* fenêtre qui révèle la couleur */
.cf2-color-reveal{
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:0%;
  overflow:hidden;
  z-index:2;
  pointer-events:none;
}

/* l'image couleur doit garder la taille du conteneur gauge */
.cf2-loco-color{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:auto;
  max-width:none;     /* important: ne pas limiter */
  pointer-events:none;
}

/* Badge pourcentage au dessus de la jauge - MOISE */
.cf2-badge{
  position:absolute;
  top:5px;
  left:5px;
  background:#888888;
  color:#fff;
  font-size:16px;
  padding:1px 5px;
  pointer-events:none;
  z-index:3;
}

/* Badge OK (>=100%) */
.cf2-badge.is-complete{
  background:#5ad53b;
  color:#fff;
}

/* Bloc des montants en euros - MOISE */
.cf2-amount{
  text-align:center;
  margin:10px 10px 50px;
  line-height:1.10;
}

.cf2-amount-main {
    display: inline-block;
    font-size: 34px;
    font-weight: 1000;
    letter-spacing: .2px;
}

.cf2-amount-sub {
    display: inline-block;
    margin-left: 6px;
    font-size: 24px;
    font-weight: 400;
    opacity: .75;
    color: #212529;
}

/* Lignes infos */
.cf2-lines {
    display: flex;
    flex-direction: row;
    gap: 5px;
    align-items: center;
    justify-content: center;
}

.cf2-line{
  display:flex;
  align-items:center;
  gap:5px;
}

.cf2-ico {
    width: 35px;
    height: 35px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cf2-text,
.cf2-ico .fa{
  font-size:16px;
  
}

/* Placeholder si pas d’image */
.cf2-img--placeholder{
  aspect-ratio:2 / 1;
  background:#f2f5fa;
}

/* --- Neutralise les styles génériques Elementor dans le bloc crowdfunding --- */
.cf-card2 .cf2-gauge img{
  max-width: none !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: block !important;
}

/* fenêtre reveal */
.cf-card2 .cf2-color-reveal{
  position:absolute;
  top:0;
  bottom:0;
  overflow:hidden;
  z-index:2;
}

/* image couleur : reste à la taille de la jauge */
.cf-card2 .cf2-loco-color{
  position:absolute;
  top:0;
  left:0;
  max-width:none !important;
  height:auto !important;
}

.cf2-icon{
  width:50px;
  height: 50px !important;
  display:block;
  object-fit:contain;
}

.cf2-remaining{
  display:flex;
  flex-direction:column;
  line-height:1.1;
}

/* Compteur des jours restants - MOISE */
.cf2-remaining-value{
  color:#9c182f; 
font-size: 20px;
 font-weight: 900;
}

.cf2-tooltip{
  position:relative;
  display:inline-flex;
  flex-direction:column;
}

.cf2-tooltip-box{
  position:absolute;
  left:50%;
  top:100%;
  transform:translateX(-50%);
  margin-top:8px;

  background:rgba(0,0,0,.85);
  color:#fff;
  padding:10px 12px;
  border-radius:8px;
  font-size:13px;
  line-height:1.3;
  white-space:nowrap;

  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:50;
}

.cf2-tooltip:hover .cf2-tooltip-box{
  opacity:1;
  visibility:visible;
}