.elementor-2140 .elementor-element.elementor-element-87983a1{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-2140 .elementor-element.elementor-element-7fdbc67{width:var( --container-widget-width, 1400px );max-width:1400px;--container-widget-width:1400px;--container-widget-flex-grow:0;}.elementor-2140 .elementor-element.elementor-element-7fdbc67 > .elementor-widget-container{margin:17px 0px 34px 0px;}/* Start custom CSS for shortcode, class: .elementor-element-7fdbc67 *//* iOS-only : neutraliser le conteneur Elementor qui bloque le focus sur les inputs */
@supports (-webkit-touch-callout: none) {
  /* Remplace l’ID par celui exact vu dans tes logs si jamais il change */
  .elementor-element.elementor-element-b4b3d98 {
    transform: none !important;
    filter: none !important;
    -webkit-backdrop-filter: none !important;
    contain: initial !important;
    will-change: auto !important;

    /* évite les clips et piles bizarres */
    overflow: visible !important;
    -webkit-overflow-scrolling: auto !important;

    /* éviter des empilements non voulus */
    position: static !important;
    z-index: auto !important;
  }

  /* Défensif (souvent inutile, mais harmless) */
  #cfnd-app .unit-field .unit {
    pointer-events: none !important; /* la déco "€" ne capte pas les taps */
    user-select: none !important;
  }
}

@supports (-webkit-touch-callout: none) {
  .elementor-element.elementor-element-50be987 .e-con-inner,
  .elementor-element.elementor-element-b4b3d98,
  .elementor-widget-container {
    transform: none !important;
    filter: none !important;
    backface-visibility: visible !important;
    perspective: none !important;
    contain: initial !important;
    will-change: auto !important;
    overflow: visible !important;
    -webkit-overflow-scrolling: auto !important;
  }
}

:root{
  --blue:#344E79;
  --blue-600:#344E79;
  --blue-500:#5FA7D4;
  --green:#76B82A;
  --green-btn:#96C34F;
  --text:#344E79;
  --muted:#6E7B8F;
  --line:#CFD7E6;
  --card-border:#E5EEF8;
  --shadow:0 2px 8px rgba(0,0,0,.03);
}




/* =========================================================
   Base & conteneur
   ========================================================= */
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:'Albert Sans', Arial, Helvetica, sans-serif;
  font-size:16px; line-height:32px;
  color:var(--text); background:#fff;
}
.container{ width:100%; margin:0 auto; padding:0 16px; }

/* =========================================================
   Hero (titre + intro)
   ========================================================= */
.page--calculator .hero{ padding:40px 0 0px; }
.hero__title{
  margin:0 0 12px;
  font-family:'Kento', Arial, Helvetica, sans-serif;
  font-weight:300; font-size:45px; line-height:50px;
  color:var(--blue);
}
.hero__intro{
  margin:0; font-weight:400; font-size:19px; line-height:32px; color:var(--blue);
  margin-bottom: -50px
}

/* =========================================================
   Formulaire (layout 2 colonnes)
   ========================================================= */
.section{ padding:40px 0; }
.section--form{ background:#fff; }

.calc-form{ display:block; }

/* rangée = label (gauche) + champ (droite) */
.form-row{
  display:flex; flex-direction:row; justify-content:space-between; align-items:flex-start;
  margin-top:0px; padding-top:18px;
}
.form-label{ width:555px; }
.form-field{ width:787px; }

/* Première rangée : bandeau bleu + radios en colonne (selon maquette) */
.calc-form > .form-row:first-child{
  border-top:7px solid #518CBA;
  margin-top:32px; padding-top:18px;
}
.calc-form > .form-row:first-child .radio-grid{
  display:flex; flex-direction:column; gap:3px; align-items:flex-start; margin-top:10px;
}

/* Bloc prix : bandeau bleu clair (utilise :has — ok sur navigateurs modernes) */
.form-row:has(#cfnd-prix){
  border-top:7px solid #82BCDA;
  margin-top:0px; padding-top:15px;
}

/* Colonne gauche : libellés Kento 15/60 */
.form-label .label,
.form-label span.label,
.form-label .field-group__legend{
  display:block; margin:0;
  font-family:'Kento', Arial, Helvetica, sans-serif;
  font-weight:300; font-size:15px; line-height:60px;
  color:var(--blue); text-transform:uppercase; letter-spacing:.04em;
}

/* Champs */
.input,.select{
  width:100%; padding:10px 14px; border:1px solid var(--line); border-radius:4px;
  background:#fff; color:var(--text);
  font:400 16px/32px 'Albert Sans', Arial, Helvetica, sans-serif; outline:none;
}
.input:focus,.select:focus{ border-color:var(--blue); box-shadow:0 0 0 2px rgba(52,78,121,.18); }

/* Sélect natif */
.select{ background-color:#fff; -webkit-appearance:menulist; appearance:menulist; }

/* Radios */
.radio-grid{ display:flex; flex-wrap:wrap; gap:18px 14px; align-items:center; margin-top:10px; }
.radio{ display:inline-flex; align-items:center; gap:8px; color:var(--text); }
.radio input{ width:16px; height:16px; }
.radio span{ font:400 16px/32px 'Albert Sans', Arial, Helvetica, sans-serif; color:var(--text); }

/* “€ à droite” */
.unit-field{ display:grid; grid-template-columns:1fr auto; align-items:center; column-gap:8px; width:100%; }
.unit-field .input{ margin:0; }
.unit-field .unit{
  display:inline-block; min-width:22px; text-align:center;
  font:400 16px/32px 'Albert Sans', Arial, Helvetica, sans-serif; color:var(--text);
}
/* input | € | (i) */
.unit-field.with-info{ grid-template-columns:1fr auto auto; column-gap:8px; width:100%; max-width:320px; }
.unit-field.with-mob{ width:100%; max-width:320px; }

/* Info (i) + tooltip */
.info{ display:inline-flex; align-items:center; justify-content:center; margin-left:6px; position:relative; cursor:help; }
.info img{ display:block; width:16px; height:16px; opacity:.85; }
.info:hover img{ opacity:1; }
.info .tooltip{
  position:absolute; left:50%; transform:translateX(-50%); bottom:calc(100% + 8px);
  min-width:220px; max-width:320px; padding:10px 12px;
  background:var(--blue); color:#fff; border-radius:4px; font-size:13px; line-height:18px;
  box-shadow:0 6px 20px rgba(0,0,0,.12); display:none; white-space:normal; z-index:20;
}
.info:hover .tooltip{ display:block; }
.info .tooltip::after{
  content:""; position:absolute; top:100%; left:50%; transform:translateX(-50%);
  width:0; height:0; border-left:7px solid transparent; border-right:7px solid transparent; border-top:7px solid var(--blue);
}
/* Style générique pour tous tes radio */
input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 14px;
  height: 14px;
  border: 1px solid #518CBA;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  cursor: pointer;
  margin: 0 2px 0 0;
  vertical-align: middle;
}

input[type="radio"]:checked {
  background-color: #518CBA;
  box-shadow: inset 0 0 0 3px #fff; /* petit rond blanc au centre */
}

/* Bouton Calculer */
.form-actions{ margin-top:14px; }
.btn{ display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:0px; cursor:pointer; }
.btn--primary{
  padding:9px 27px; background:#96C34F !important; color:#fff;
font-family: 'Albert Sans';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 28px;
/* identical to box height, or 175% */
text-align: center;

color: #FFFFFF;}
.btn--primary:hover{
  padding:9px 27px; background:#96C34F !important; color:#fff;
font-family: 'Albert Sans';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 28px;
/* identical to box height, or 175% */
text-align: center;

color: #FFFFFF;}


/* Message d’erreur inline (mobilier > prix) */
.cfnd-result .cfnd-error{
  margin-top:8px; background:#FEF2F2; color:#991B1B; border:1px solid #FECACA; border-radius:4px;
  padding:10px 12px; font-size:14px;
}

.results-actions {
    margin-top: 40px !important
}

/* =========================================================
   Popup d’erreur (overlay)
   ========================================================= */
.cfnd-modal{
  position:fixed; inset:0; display:none; align-items:center; justify-content:center; z-index:9999;
  background:rgba(52,78,121,.8); /* #344E79 à 80% */
}


.cfnd-modal__content{
  background:#fff; padding:2rem; border-radius:6px; width:min(92vw,550px);
  text-align:center; box-shadow:0 5px 20px rgba(0,0,0,.2);
}
.cfnd-modal__title{ color:#c0392b; font-size:1.4rem; margin:0 0 1rem; }
.cfnd-modal__btn{
  margin-top:1rem; background:#6ab04c; color:#fff; border:none; padding:.7rem 1.5rem; border-radius:4px; cursor:pointer;
}
.cfnd-modal__btn:hover{ background:#4e944f; }

/* =========================================================
   Résultats
   ========================================================= */
.section--results{ display:none; }
.section--results.is-visible{ display:block; }

/* Bandeaux titres + date */
/* Styles communs aux barres d'en-tête */
.container > .results-head,
.container > .results-subhead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 59px;
  padding-bottom: 24px;
  border-top: 7px solid transparent; /* base neutre, couleurs ci-dessous */
  flex-wrap:wrap;
}

/* Couleur spécifique pour la première barre (RÉPARTITION DES FRAIS) */
.container > .results-head {
  border-top-color: #96C34F; /* vert */
}

/* Couleur spécifique pour la seconde barre (ESTIMATION DE VOS FRAIS) */
.container > .results-subhead {
  border-top-color: #518CBA; /* bleu */
}

/* (Optionnel) un petit reset du h4 si besoin */
.results-title { margin: 0; }

.results-title{ 

font-family: 'Kento';
font-style: normal;
font-weight: 300;
font-size: 15px;
line-height: 60px;
color: #344E79;

 }
.results-date{ color:var(--muted); font-size:.85rem; }

/* Donut + légende */
.results-chart-wrap{
  display:grid; grid-template-columns:220px 1fr; gap:24px; align-items:center; margin-bottom:28px;
  width: 500px
}

.section--results .container {

    text-align: -webkit-center !important;
 
}
.results-legend{ display:grid; gap:10px; }
.legend-item{ display:flex; align-items:center; gap:10px; color:var(--blue); font-size:.95rem; }
.legend-dot{ width:10px; height:10px; border-radius:50%; }
.results-chart{ max-width:520px; margin-inline:auto; }
#cfnd-donut{ width:100% !important; height:auto !important; }

/* ===== Cartes résultats — fix alignements / couleurs ===== */
select#cfnd-lots {
    width: 265px;
}
/* grille 4 colonnes */
.results-grid {
    display: flex;
   
    gap: 30px;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}
/* carte */
.result-card {
    position: relative;
   background: rgba(222, 229, 237, 0.1);
    border: 1px solid #DEE5ED;
    border-radius: 0px;
    padding: 18px 18px 14px;
    display: flex;
    flex-direction: column;
    width: 560px;
}
/* onglet (puce titre) */
.card-tab {
    display: inline-block;
    margin-top: -30px;
    padding: 3px 16px;
    border-radius: 0px;
    margin-bottom: 20px;
    font-size: 19px;

font-family: 'Albert Sans';
font-style: normal;
font-weight: 400;

color: #FFFFFF;
    line-height: 32px;
    width: fit-content;
}
.card-tab--blue{ background:#344E79; color:#fff; }          /* Émoluments */
.card-tab--cyan{ background:#5FA7D4; color:#fff; }          /* Taxes */

.card-tab--green{ background:#76B82A; color:#fff; }         /* Total */

/* lignes libellé/valeur */
.kv{ margin:0; }
.kv__row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  padding:0px;
  

font-family: 'Albert Sans';
font-style: normal;
font-weight: 400;
font-size: 19px;
line-height: 32px;
/* identical to box height, or 168% */

color: #344E79;


}

.kv__row dd{

font-family: 'Albert Sans';
font-style: normal;
font-weight: 700;
font-size: 19px;
line-height: 32px;
/* or 168% */
text-align: right;

color: #96C34F;


  margin:0;
  font-variant-numeric:tabular-nums;  /* chiffres bien alignés */
  text-align:right;
  white-space:nowrap;
}

/* ligne Total un peu séparée/renforcée */
/* 1) Pas de trait dans la carte "Total" (ni quand il n'y a qu'une ligne) */
.kv__row--strong{ border:0; margin-top:0; padding-top:0; }            /* reset global */



.results-disclaimer {
  margin-top: 54px;
 
  text-align: left;


font-family: 'Albert Sans';
font-style: normal;
font-weight: 400;
font-size: 19px;
line-height: 32px;
/* or 168% */

color: #344E79;


}
.results-disclaimer p { margin: 0 0 8px; }
.u-underline { text-decoration: underline !important; 
    color: #344E79 !important;

}

.u-underline:hover { text-decoration: underline !important; 
    color: #344E79 !important;

}


.kv__row + .kv__row--strong{
  border-top:1px solid #EDF2F7;                        /* Sur la vente Formalité Total Total après réduction * */



font-family: 'Albert Sans';
font-style: normal;
font-weight: 700;
font-size: 19px;
line-height: 32px;
/* or 168% */

color: #344E79;

               /* trait seulement s'il y a une ligne avant */
  margin-top:6px; padding-top:10px;
}
.result-card--highlight .kv__row--strong{ border:0; margin:0; padding:0; } /* carte Total : jamais de trait */

/* 2) Onglet "Débours" : éviter l'effet "input" */
.card-tab--blue-outline{
  background: #009ADE;
  border:2px solid #009ADE;
  box-shadow:none;                                                 color: white    /* au cas où un thème ajoute un shadow */
}

/* 3) Valeurs bien alignées à droite, sans retour à la ligne foireux */
.kv__row dd{
  text-align:right;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}

/* montants verts */
.accent{ font-family: 'Albert Sans';
font-style: normal;
font-weight: 700;
font-size: 19px;
line-height: 32px;
/* or 168% */
text-align: right;

color: #96C34F; }

/* carte Total marquée mais propre */
.result-card--highlight{ border-color:#76B82A; }


/* Ajoute “€” aux valeurs (seulement dans les dd montants) */

/* Évite les retours à la ligne moches sur les gros nombres */
#fee-sale,#fee-formalities,#fee-notary-total,
#disbursements,#taxes-sale,#taxes-csi,#taxes-vat,
#taxes-total,#grand-total{ white-space:nowrap; }

.results-date {


font-family: 'Kento';
font-style: normal;
font-weight: 300;
font-size: 15px;
line-height: 60px;
/* identical to box height, or 400% */
text-align: right;

color: #344E79;


}

.oblig {
    display: block;
    margin-bottom: 15px;
  

font-family: 'Albert Sans';
font-style: normal;
font-weight: 300;
font-size: 16px;
line-height: 32px;
/* identical to box height, or 200% */

color: #D44118;


}
@media (max-width:900px){
    
    
    
    /*****test*****/
    /* Empêche le label du prix d'englober toute la zone */

   
/*****fin de test********/
  .form-row{ flex-direction:column; padding-top:12px; }
  .form-label,.form-field{ width:100%; }
  .form-label .label{ line-height:32px; margin-bottom:6px; }
  .results-title{ 

font-family: 'Kento';
font-style: normal;
font-weight: 300;
font-size: 15px;
line-height: 60px;
color: #344E79;

 }
  .hero__title{
  margin:0 0 12px;
  font-family:'Kento', Arial, Helvetica, sans-serif;
  font-weight:300; font-size:25px; line-height:35px;
  color:var(--blue);
}
.hero__intro{
  margin:0; font-weight:400; font-size:16px; line-height:30px; color:var(--blue);
}
  .form-label .label,
.form-label span.label,
.form-label .field-group__legend{
  display:block; margin:0;
  font-family:'Kento', Arial, Helvetica, sans-serif;
  font-weight:300; font-size:11px; line-height:30px;
  color:var(--blue); text-transform:uppercase; letter-spacing:.04em;
}

.form-label label {
    line-height: 28px !important}


.results-date {
    font-family: 'Kento';
    font-style: normal;
    font-weight: 300;
    font-size: 12px;
    line-height: 30px;
    text-align: left;
    color: #344E79;
    /* display: block; */
    width: 500px;
}
.results-chart-wrap {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    margin-bottom: 28px;
    width: auto;
    flex-direction: column;
}

.page--calculator .hero {
    padding: 0px;
    margin-bottom:-20px;
}
.results-disclaimer {
    margin-top: 54px;
    text-align: left;
    font-family: 'Albert Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    color: #344E79;
}

.results-actions {
    margin-top: 16px;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    flex-direction: column;
}

.form-field {
    margin-bottom: 20px !important;
}


.kv__row dt {
    text-align:left !important}
}/* End custom CSS */