/* ============================================================
   MFR Recherche – Feuille de style (v3.0)
   Palette : Or #CDAC5F | Vert foncé #1A2C17 | Blanc #ffffff
   ============================================================ */

:root {
  --mfr-gold:      #CDAC5F;
  --mfr-gold-dk:   #b8973e;
  --mfr-green:     #1A2C17;
  --mfr-black:     #1a1a1a;
  --mfr-white:     #ffffff;
  --mfr-grey-bg:   #f4f6f8;
  --mfr-grey-bd:   #dde2e8;
  --mfr-text:      #333333;
  --mfr-radius:    10px;
  --mfr-shadow:    0 4px 24px rgba(0,0,0,.10);
  --mfr-font:      'Segoe UI', Arial, sans-serif;
  /* Alias rétrocompatibilité */
  --mfr-yellow:    #CDAC5F;
  --mfr-yellow-dk: #b8973e;
}

/* ── Wrapper global ─────────────────────────────────────────────────────────── */
.mfr-wrapper {
  font-family: var(--mfr-font);
  color: var(--mfr-text);
  width: 100%;
  max-width: 100%;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   SECTION RECHERCHE (fond vert foncé)
   ═══════════════════════════════════════════════════════════════════════════════ */
.mfr-search-section {
  background: var(--mfr-green);
  padding: 54px 6vw;
  width: 100%;
  box-sizing: border-box;
  border-radius: 20px;
  /* PAS de overflow:hidden ici — couperait les dropdowns en position:absolute */
}
.mfr-search-inner {
  display: flex;
  gap: 60px;
  align-items: center;
  max-width: 1400px;
  margin: 0 auto;
}

/* ── Colonne gauche : icône + titre + texte ──────────────────────────────────── */
.mfr-search-text {
  flex: 0 0 360px;
  max-width: 360px;
  color: var(--mfr-white);
}
.mfr-search-header {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 18px;
}
.mfr-search-icon {
  flex-shrink: 0;
}
.mfr-search-icon svg { display: block; }
.mfr-search-title {
  font-size: 2.2rem;
  font-weight: 400;
  line-height: 1.15;
  margin: 0;
  color: var(--mfr-white);
  font-family: var(--mfr-font);
}
.mfr-search-title strong {
  font-weight: 900;
  display: block;
}
.mfr-search-text p {
  font-size: .9rem;
  line-height: 1.7;
  color: rgba(255,255,255,.78);
  margin: 0;
}

/* ── Colonne droite : formulaire ─────────────────────────────────────────────── */
.mfr-search-form-wrap { flex: 1; }

/* ── Champs ──────────────────────────────────────────────────────────────────── */
.mfr-field-group {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.mfr-field {
  position: relative;
  background: var(--mfr-white);
  border-radius: 8px;
  border: 2px solid transparent;
  flex: 1 1 180px;
  min-width: 160px;
  transition: border-color .2s, box-shadow .2s;
  box-shadow: 0 2px 10px rgba(0,0,0,.14);
}
.mfr-field.mfr-field-open,
.mfr-field:focus-within {
  border-color: var(--mfr-gold);
  box-shadow: 0 4px 14px rgba(205,172,95,.28);
}
.mfr-field-placeholder {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 18px;
  cursor: pointer;
  user-select: none;
  min-height: 52px;
}
.mfr-field-label {
  font-size: .92rem;
  color: #777;
  transition: color .2s;
}
.mfr-field.mfr-has-value .mfr-field-label {
  color: var(--mfr-black);
  font-weight: 600;
}
.mfr-field-arrow {
  font-size: .58rem;
  color: #999;
  transition: transform .2s;
}
.mfr-field.mfr-field-open .mfr-field-arrow { transform: rotate(180deg); }

/* ── Dropdown ────────────────────────────────────────────────────────────────── */
.mfr-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0; right: 0;
  background: var(--mfr-white);
  border: 2px solid var(--mfr-green);
  border-radius: 8px;
  box-shadow: var(--mfr-shadow);
  z-index: 9999;
  max-height: 320px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.mfr-dropdown-search {
  padding: 10px 12px;
  border-bottom: 1px solid var(--mfr-grey-bd);
}
.mfr-dropdown-search input {
  width: 100%;
  border: 1px solid var(--mfr-grey-bd);
  border-radius: 4px;
  padding: 8px 10px;
  font-size: .88rem;
  outline: none;
  box-sizing: border-box;
}
.mfr-dropdown-list {
  list-style: none;
  margin: 0;
  padding: 4px 0;
  overflow-y: auto;
  flex: 1;
}
.mfr-dropdown-item {
  padding: 11px 18px;
  cursor: pointer;
  font-size: .9rem;
  transition: background .15s;
  line-height: 1.4;
}
.mfr-dropdown-item:hover {
  background: rgba(205,172,95,.15);
  color: var(--mfr-black);
  font-weight: 600;
}
.mfr-dropdown-item.mfr-selected {
  background: rgba(205,172,95,.22);
  font-weight: 700;
}
.mfr-dropdown-item.hidden { display: none; }
.mfr-dropdown-hint {
  padding: 10px 16px;
  color: #aaa;
  font-size: .85rem;
}

/* ── Bouton principal : Rechercher ───────────────────────────────────────────── */
.mfr-form-footer {
  margin-top: 18px;
  text-align: right;
}
/* Force totale pour passer au-dessus du thème WordPress */
.mfr-wrapper .mfr-btn-submit,
.mfr-btn-submit {
  background: var(--mfr-gold) !important;
  color: var(--mfr-white) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  letter-spacing: .03em !important;
  border: none !important;
  outline: none !important;
  border-radius: 90px !important;
  padding: 16px 44px !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-decoration: none !important;
  transition: opacity .2s !important;
}
.mfr-wrapper .mfr-btn-submit:hover,
.mfr-wrapper .mfr-btn-submit:focus,
.mfr-wrapper .mfr-btn-submit:active,
.mfr-btn-submit:hover,
.mfr-btn-submit:focus,
.mfr-btn-submit:active {
  background: var(--mfr-gold) !important;
  color: var(--mfr-white) !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
  opacity: .88 !important;
  text-decoration: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   SPINNER
   ═══════════════════════════════════════════════════════════════════════════════ */
.mfr-loading {
  text-align: center;
  padding: 48px;
  font-size: 1rem;
  color: #666;
}
.mfr-spinner {
  display: inline-block;
  width: 22px; height: 22px;
  border: 3px solid var(--mfr-grey-bd);
  border-top-color: var(--mfr-gold-dk);
  border-radius: 50%;
  animation: mfr-spin .7s linear infinite;
  vertical-align: middle;
  margin-right: 8px;
}
@keyframes mfr-spin { to { transform: rotate(360deg); } }

/* ═══════════════════════════════════════════════════════════════════════════════
   SECTION RÉSULTATS
   ═══════════════════════════════════════════════════════════════════════════════ */
/* La section résultats est aussi large que le bloc vert :
   pas de padding horizontal, le contenu s'aligne sur les bords du wrapper */
.mfr-results-section {
  width: 100%;
  box-sizing: border-box;
  padding: 0 0 40px;
}
.mfr-results-outer {
  width: 100%;
  box-sizing: border-box;
}

/* ── Carte Leaflet ───────────────────────────────────────────────────────────── */
.mfr-map {
  width: 100%;
  height: 420px;
  border-radius: var(--mfr-radius);
  margin: 28px 0;
  z-index: 1;
  display: block;
  background: #e8eaed;
}

/* ── Titres résultats ────────────────────────────────────────────────────────── */
.mfr-results-header,
.mfr-closest-title,
.mfr-other-title {
  font-family: 'Impact', 'Arial Black', sans-serif;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--mfr-black);
}
.mfr-results-header  { font-size: 1.3rem; font-weight: 700; margin: 0 0 22px; }
.mfr-closest-title   { font-size: 1.4rem; margin: 28px 0 18px; }
.mfr-other-title     { font-size: 1.15rem; margin: 36px 0 18px; color: #444; }

/* ═══════════════════════════════════════════════════════════════════════════════
   CARTE MFR (résultat)
   ═══════════════════════════════════════════════════════════════════════════════ */
.mfr-card {
  display: flex;
  background: var(--mfr-grey-bg);
  border-radius: var(--mfr-radius);
  overflow: hidden;
  margin-bottom: 20px;
  box-shadow: 0 2px 10px rgba(0,0,0,.07);
  transition: transform .2s, box-shadow .2s;
  border-left: 4px solid transparent;
  min-height: 200px;
}
.mfr-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--mfr-shadow);
}
.mfr-card-highlight {
  border-left-color: var(--mfr-gold);
  background: #fff;
  box-shadow: 0 4px 20px rgba(205,172,95,.2);
}

/* ── Corps de la carte ───────────────────────────────────────────────────────── */
.mfr-card-body {
  padding: 26px 28px;
  flex: 1;
  display: flex;
  gap: 28px;
  min-width: 0;
}

/* ── Colonne info (coordonnées + bouton) ─────────────────────────────────────── */
.mfr-card-info {
  flex: 0 0 280px;
  min-width: 280px;
}
.mfr-card-name {
  font-size: 1.05rem;
  font-weight: 800;
  text-transform: uppercase;
  margin: 0 0 12px;
  letter-spacing: .02em;
  line-height: 1.3;
}
.mfr-card-distance {
  display: inline-block;
  background: var(--mfr-gold);
  color: var(--mfr-white);
  font-size: .8rem;
  font-weight: 700;
  border-radius: 20px;
  padding: 4px 14px;
  margin-bottom: 12px;
}
.mfr-card-address {
  font-size: .88rem;
  color: #555;
  line-height: 1.7;
  margin: 0 0 10px;
}

/* Contacts : chaque ligne = icône + texte sur UNE seule ligne */
.mfr-card-contacts {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: .85rem;
  margin-bottom: 4px;
}
.mfr-contact-line {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--mfr-text);
  text-decoration: none;
  line-height: 1.9;
}
a.mfr-contact-line:hover { text-decoration: underline; color: var(--mfr-gold-dk); }

/* ── Bouton "Contacter la MFR" ───────────────────────────────────────────────── */
.mfr-wrapper .mfr-card-btn,
.mfr-card-btn {
  display: inline-block !important;
  margin-top: 16px !important;
  background: var(--mfr-gold) !important;
  color: #ffffff !important;   /* force blanc – thème ne peut pas l'écraser */
  font-weight: 700 !important;
  font-size: .88rem !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  padding: 13px 28px !important;
  border-radius: 90px !important;
  text-decoration: none !important;
  border: none !important;
  outline: none !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: opacity .2s !important;
}
.mfr-wrapper .mfr-card-btn:hover,
.mfr-wrapper .mfr-card-btn:focus,
.mfr-card-btn:hover,
.mfr-card-btn:focus {
  background: var(--mfr-gold) !important;
  color: #ffffff !important;
  text-decoration: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
  opacity: .88 !important;
}

/* ── Formations ──────────────────────────────────────────────────────────────── */
.mfr-card-formations { flex: 1; min-width: 0; }
.mfr-formations-title {
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  margin: 0 0 10px;
  color: #666;
}
.mfr-formations-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mfr-formations-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: .88rem;
  line-height: 1.5;
  margin-bottom: 6px;
}
.mfr-formations-list li::before {
  content: '🎓';
  flex-shrink: 0;
  font-size: .75rem;
  margin-top: 2px;
}
.mfr-formations-list li.mfr-non-diplomante::before { content: '📋'; }
.mfr-formation-link {
  color: var(--mfr-black);
  text-decoration: underline;
  text-decoration-color: var(--mfr-gold-dk);
  font-weight: 600;
  transition: color .15s;
}
.mfr-formation-link:hover { color: var(--mfr-gold-dk); }
.mfr-formation-niveau {
  color: #888;
  font-size: .82rem;
  font-style: italic;
  flex-shrink: 0;
}
.mfr-formations-nd-title {
  font-size: .8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #999;
  margin: 14px 0 8px;
}

/* ── Photo (couverture complète, sans fond gris) ─────────────────────────────── */
.mfr-card-photo {
  width: 240px;
  min-width: 240px;
  flex-shrink: 0;
  overflow: hidden;
  position: relative; /* nécessaire pour l'image absolue */
}
/* L'image remplit tout l'espace sans déformation */
.mfr-card-photo img {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
/* Placeholder uniquement si pas de photo (géré par JS) */
.mfr-card-photo-placeholder {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #e8e8e8, #d0d0d0);
  font-size: 3rem;
}

/* ── Aucun résultat ──────────────────────────────────────────────────────────── */
.mfr-no-results {
  text-align: center;
  padding: 60px 20px;
  color: #666;
}
.mfr-no-results strong {
  display: block;
  font-size: 1.4rem;
  margin-bottom: 10px;
  color: var(--mfr-black);
}

/* ── Popup Leaflet ───────────────────────────────────────────────────────────── */
.mfr-popup { font-family: var(--mfr-font); min-width: 180px; }
.mfr-popup strong { display: block; font-size: .95rem; margin-bottom: 6px; }
.mfr-popup-phone,
.mfr-popup-email { font-size: .82rem; color: #555; display: block; margin-bottom: 3px; }
.mfr-popup .mfr-card-btn { margin-top: 10px; font-size: .8rem; padding: 7px 18px; }

/* ── Bouton "Nouvelle recherche" ─────────────────────────────────────────────── */
.mfr-new-search-wrap { text-align: center; padding: 10px 0 20px; }
.mfr-wrapper .mfr-btn-secondary,
.mfr-btn-secondary {
  background: var(--mfr-gold) !important;
  color: #ffffff !important;
  border: none !important;
  outline: none !important;
  border-radius: 90px !important;
  padding: 15px 42px !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  margin: 20px auto !important;
  display: inline-block !important;
  box-shadow: none !important;
  text-decoration: none !important;
  transition: opacity .2s !important;
}
.mfr-wrapper .mfr-btn-secondary:hover,
.mfr-wrapper .mfr-btn-secondary:focus,
.mfr-wrapper .mfr-btn-secondary:active,
.mfr-btn-secondary:hover,
.mfr-btn-secondary:focus,
.mfr-btn-secondary:active {
  background: var(--mfr-gold) !important;
  color: #ffffff !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
  opacity: .88 !important;
  text-decoration: none !important;
}

/* ── Grille autres MFR ───────────────────────────────────────────────────────── */
.mfr-cards-grid .mfr-card { margin-bottom: 16px; }

/* ═══════════════════════════════════════════════════════════════════════════════
   RESPONSIVE – Tablette (≤ 1000px)
   ═══════════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1000px) {
  .mfr-search-inner      { flex-direction: column; gap: 28px; align-items: flex-start; }
  .mfr-search-text       { flex: none; max-width: 100%; }
  .mfr-search-form-wrap  { width: 100%; }
  .mfr-field-group       { flex-direction: column; width: 100%; }
  .mfr-field             { flex: none; width: 100%; box-sizing: border-box; }
  .mfr-card-info         { flex: 0 0 240px; min-width: 240px; }
}

/* ═══════════════════════════════════════════════════════════════════════════════
   RESPONSIVE – Mobile (≤ 760px)
   ═══════════════════════════════════════════════════════════════════════════════ */
@media (max-width: 760px) {
  .mfr-search-section  { padding: 36px 5vw; }
  .mfr-results-section { padding: 0 0 30px; }
  .mfr-search-title   { font-size: 1.8rem; }
  .mfr-map            { height: 280px; margin: 20px 0; }
  .mfr-form-footer    { text-align: center; }
  .mfr-btn-submit     { width: 100%; }

  /* Carte MFR : une seule colonne verticale */
  .mfr-card {
    flex-direction: column;
  }
  .mfr-card-body {
    flex-direction: column;
    gap: 16px;
    padding: 20px 18px;
  }
  .mfr-card-info {
    flex: none;
    min-width: unset;
  }

  /* Photo en bas, après les formations */
  .mfr-card-photo {
    width: 100%;
    min-width: unset;
    height: 220px;
    position: relative;
    order: 3;
  }
}

@media (max-width: 480px) {
  .mfr-search-title { font-size: 1.5rem; }
  .mfr-card-photo   { height: 180px; }
}