/* ====== Thème Ma-location – rafraîchi ====== */
:root{
  --ml-blue: #3A86FF;
  --ml-blue-2: #48CAE4;
  --ml-orange: #ff6c38;
  --ml-orange-2: #f7561b;
  --ml-peach: #FFD6A5;
  --ml-mint: #80ED99;
  --ml-bg: #F0F4F8;
  --ml-text: #1F2937;
  --ml-card: #FFFFFF;
  --ml-hr: #E6EEF7;
}

/* Fond & textes */
body { color: var(--ml-text); }
.bandeau { background: var(--ml-peach); }
.bandeau p { color: var(--ml-blue); font-weight: 700; letter-spacing: .3px; }

/* Section filtres (remplace #f3f4f0) */
[style*="background-color: #f3f4f0"] { background-color: var(--ml-bg) !important; }

/* Titres villes (remplace l’orange vif) */
.plan-title span { color: var(--ml-blue) !important; }
/* Titre localité */
.view-title{ color:var(--ml-blue) !important; }           /* si tu veux garder ce ton pêche */
.view-title hr{ border:0; height:1px; background:var(--ml-hr); }

/* Cartes résultat */
.results > div > div{
  background: var(--ml-card) !important;
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(22, 44, 78, .07);
  transition: transform .15s ease, box-shadow .15s ease;
}
.results > div > div:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(22, 44, 78, .12);
}
.results img.img-fluid{ border-radius: 5px; }

/* HRs bleus plus doux */
.blue-hr{
  border: 0;
  height: 1px;
  background: var(--ml-hr);
  margin: 10px 0 14px;
}

/* Bouton principal */
.btn-primary{
  background: var(--ml-blue) !important;
  border-color: var(--ml-blue) !important;
  border-radius: 10px;
  font-weight: 600;
}
.btn-primary:hover,
.btn-primary:focus{
  background: var(--ml-blue-2) !important;
  border-color: var(--ml-blue-2) !important;
}

/* Bouton visite */
.btn-visite{
  background: var(--ml-orange) !important;
  border-color: var(--ml-orange) !important;
  color: var(--ml-bg) !important;
  border-radius: 10px;
  font-weight: 600;
}
.btn-visite:hover,
.btn-visite:focus{
  background: var(--ml-orange-2) !important;
  border-color: var(--ml-orange-2) !important;
}

/* Badges “dispo / bientôt dispo” */
img[src*="banner/dispo"],
img[src*="banner/bientotdispo"],
img[src*="banner/plusdispo"]{
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.12));
  border-radius: 6px;
}
img[src*="banner/dispo"]{ background: var(--ml-mint); }
img[src*="banner/bientotdispo"]{ background: #FFE8B5; } /* doux, lisible */
img[src*="banner/plusdispo"]{ background: #EDEDED; }

/* “Je cherche :” */
p[style*="color: #1c4794"]{ color: var(--ml-blue) !important; }

/* Nice select (look moderne) */
.nice-select{
  border-radius: 10px;
  border-color: #D8E3F0;
  padding-left: 12px; padding-right: 36px;
  height: 44px; line-height: 42px;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
}
.nice-select.open, .nice-select:hover{ border-color: var(--ml-blue-2); }
.nice-select .list{ border-radius: 10px; }

/* Footer allégé */
.footerCopy{
  background: #fff;
  border-top: 1px solid var(--ml-hr);
}
.footerCopy a{ color: var(--ml-blue); }
.footerCopy a:hover{ color: var(--ml-blue-2); }

/* Grand visuel au format 16:9 */
.img-16x9{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 10px;            /* optionnel */
  background: #f0f0f0;            /* placeholder si image tarde */
}
.img-16x9 > img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;               /* recadre en paysage */
  object-position: center;
}

/* Petites vignettes 4:3 (ligne à 2 colonnes) */
.img-4x3{
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 10px;
  background: #f0f0f0;
}
.img-4x3 > img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Optionnel : supprime l’arrondi si tu préfères des angles droits */
/* .img-16x9, .img-4x3 { border-radius: 0; } */

/* Hero photo en 16:9 + vignettes auto-cover */
.hero-16x9{ position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; border-radius:12px; background:#f0f0f0; }
.hero-16x9 > img{ width:100%; height:100%; object-fit:cover; object-position:center; }

/* Bouton “voir X photos” flottant */
.hero-cta{ position:absolute; right:20px; bottom:12px; }
.hero-cta .btn{ border-radius:10px; font-weight:600; }

/* PEB & Badges */
.badge-banner{ top:0; position:absolute; margin:0; width:240px; max-width:40%; filter:drop-shadow(0 2px 6px rgba(0,0,0,.12)); border-radius:8px; }
.badge-peb{ bottom:10px; left:20px; position:absolute; margin:0; width:150px; max-width:30%; }
