/* ============================================================
   Archives prestataires (annuaire.html) : CSS autonome scopé
   #bm-archive (front servi par l'ancien thème). Les cartes
   réutilisent .bm-pcard de annuaire.css. Tokens redéfinis ici.
   ============================================================ */
#bm-archive {
  --bg-page: #fbf9f5; --bg-elevated: #ffffff; --bg-sand: #f3ede3;
  --border-subtle: #ece4d6; --border-default: #e0d6c6; --border-strong: #cdbfa9;
  --ardoise-900: #27395c; --ardoise-700: #3f5b8c; --ardoise-500: #5872a3; --ardoise-tint: #eaeef7;
  --framboise-700: #a23c61; --framboise-500: #c4527a; --framboise-tint: #f9e8ef;
  --text-primary: #1b2433; --text-secondary: #5b6573; --text-muted: #8b94a0; --text-body: #45505f;
  --font-display: 'Bricolage Grotesque', ui-sans-serif, system-ui, sans-serif;
  --font-text: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --r-md: 12px; --r-lg: 16px;
  font-family: var(--font-text); color: var(--text-primary);
}
.awrap { max-width: 1120px; margin: 0 auto; padding: 26px 24px 56px; }
#bm-archive * { box-sizing: border-box; }
#bm-archive h1 { font-family: var(--font-display) !important; color: var(--text-primary) !important; font-size: clamp(26px, 4.5vw, 32px); margin: 0 0 3px; letter-spacing: -.02em; }
#bm-archive .breadcrumb { font-size: 12.5px; color: var(--text-muted) !important; }
#bm-archive .breadcrumb a { color: inherit; text-decoration: none; }
#bm-archive .breadcrumb strong { color: var(--text-body) !important; font-weight: 500; }
#bm-archive .muted { color: var(--text-muted) !important; }

.atoolbar { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.atoolbar .muted { font-size: 13.5px; }
.aintro { font-size: 14px; line-height: 1.6; color: var(--text-body) !important; margin: 0 0 18px; }
.aintro p { color: var(--text-body) !important; margin: 0 0 8px; }
.acap-note { font-size: 13px; line-height: 1.4; margin: -8px 0 16px; }
.amap-cta { display: inline-flex; align-items: center; gap: 7px; margin-top: 10px; padding: 8px 15px; border: 1.5px solid var(--framboise-500, #c4527a); border-radius: 999px; background: var(--bg-elevated, #fff); color: var(--framboise-700, #a23c61) !important; font-size: 13.5px; font-weight: 700; text-decoration: none; transition: background .15s, color .15s; }
.amap-cta:hover, .amap-cta:focus { background: var(--framboise-500, #c4527a); color: #fff !important; }
.amap-cta svg { flex: none; }

/* Filtres en pastilles inline (mockup annuaire.html). Le front est servi par
   l'ancien thème : il force width:100% sur input/select, ce qui empilait les
   filtres en pleine largeur. On force width:auto et un style pastille autonome. */
/* Barre de filtres sur sa propre ligne pleine largeur (sous le titre) : avec le
   champ de recherche ajouté, les 4 contrôles ne tenaient plus à droite du titre
   et le tri retombait seul sur une 2e ligne. */
.afilters { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; justify-content: flex-start; flex: 1 1 100%; max-width: 100%; margin: 6px 0 0; }
.afilter { width: auto !important; max-width: 220px; min-height: 44px; height: auto !important; margin: 0 !important; padding: 9px 34px 9px 13px !important; border: 1.5px solid var(--border-strong) !important; border-radius: 10px !important; background-color: var(--bg-elevated) !important; box-shadow: none !important; font-family: inherit; font-size: 13.5px; font-weight: 600; color: var(--text-body) !important; line-height: 1.2; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' stroke='%23c4527a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 11px 8px; }
.afilter:focus { outline: none; border-color: var(--ardoise-700) !important; }
.afilter--search { width: 100% !important; min-width: 150px; max-width: none; padding-right: 13px !important; background-image: none; font-weight: 500; cursor: text; }
/* Champ de recherche + liste d'autocomplétion (suggestions de prestataires). */
.asearch { position: relative; flex: 0 1 220px; min-width: 170px; }
.asuggest { position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 60; margin: 0; padding: 4px; list-style: none; background: #fff; border: 1.5px solid var(--border-default); border-radius: 12px; box-shadow: 0 10px 28px rgba(27, 36, 51, .14); max-height: 340px; overflow-y: auto; text-align: left; }
.asuggest-item { display: flex; flex-direction: column; gap: 1px; padding: 8px 11px; border-radius: 8px; cursor: pointer; }
.asuggest-item:hover, .asuggest-item.is-active { background: var(--ardoise-tint); }
.asuggest-n { font-weight: 600; font-size: 14px; color: var(--ardoise-900) !important; }
.asuggest-s { font-size: 12px; color: var(--text-muted) !important; }
.bm-btn-filtrer { min-height: 44px; padding: 10px 18px; border: none; border-radius: 10px; background: var(--framboise-500) !important; color: #fff !important; font-weight: 600; font-size: 14px; cursor: pointer; }

.alayout { display: grid; grid-template-columns: 1.35fr 1fr; gap: 18px; align-items: start; }
.acards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.amap { position: sticky; top: 16px; }
.amap-canvas { height: 460px; border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--border-subtle); }
.amap-vide { height: 200px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 20px; border: 1.5px dashed var(--border-strong); border-radius: var(--r-lg); font-size: 13.5px; }
.leaflet-popup-content { font-family: var(--font-text); font-size: 13px; margin: 10px 12px; }
.leaflet-popup-content a { color: var(--framboise-700); font-weight: 600; text-decoration: none; }
/* Popup d'un repère : miniature + infos */
.bm-map-pop { display: flex; gap: 10px; align-items: center; }
.bm-map-pop__img { flex: none; width: 54px; height: 54px; border-radius: 10px; object-fit: cover; }
.bm-map-pop__body { display: flex; flex-direction: column; gap: 2px; }
.bm-map-pop__prix { color: var(--text-body); }
.bm-map-pop__link { margin-top: 2px; }

.aempty { background: var(--bg-elevated); border: 1.5px dashed var(--border-strong); border-radius: var(--r-lg); padding: 28px 20px; text-align: center; color: var(--text-secondary); }
.aempty p { margin: 0 0 12px; }

.apagination { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 26px; }
.apagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; padding: 0 12px; border: 1.5px solid var(--border-default); border-radius: 10px; text-decoration: none; color: var(--ardoise-700) !important; font-weight: 600; font-size: 14px; background: var(--bg-elevated); }
.apagination .page-numbers.current { background: var(--framboise-500) !important; color: #fff !important; border-color: var(--framboise-500); }
.apagination .page-numbers:hover:not(.current) { border-color: var(--ardoise-700); }

@media (max-width: 880px) { .alayout { grid-template-columns: 1fr; } .amap { position: static; } .amap-canvas { height: 280px; } }
/* Filtres : empilés pleine largeur à gauche (fin du justify-content:flex-end). */
@media (max-width: 768px) {
  .atoolbar { flex-direction: column; align-items: stretch; }
  .afilters { flex-direction: column; align-items: stretch; justify-content: stretch; width: 100%; max-width: none; }
  .afilter, .afilter--tri, .afilter--search { width: 100% !important; max-width: none !important; }
}
@media (max-width: 560px) { .acards { grid-template-columns: 1fr; } .awrap { padding: 20px 16px 44px; } }

/* Recherche assistée par Margot (au-dessus des filtres) : codes lavande. */
.amargot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#f3effa;border:1px solid #ded4f0;border-left:4px solid #6f5aa6;border-radius:12px;padding:10px 14px;margin:0 0 14px}
.amargot__spark{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:#6f5aa6;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px}
/* Consigne + champ empilés : la phrase complète reste lisible même quand le champ est trop étroit pour l'afficher via son placeholder (qui, lui, ne revient jamais à la ligne). */
.amargot__champ{flex:1;min-width:240px;display:flex;flex-direction:column;gap:4px}
.amargot__intro{margin:0;font-size:.82rem;line-height:1.4;color:#4d3f78}
.amargot__input{width:100%;border:1px solid #ded4f0;border-radius:9px;padding:10px 12px;font:inherit;background:#fff;min-height:42px;box-sizing:border-box}
.amargot__input:focus{outline:2px solid #6f5aa6;outline-offset:1px;border-color:#6f5aa6}
.amargot__go{flex:0 0 auto;background:#6f5aa6;color:#fff;border:0;border-radius:999px;padding:10px 20px;font-weight:700;font-size:.88rem;cursor:pointer;min-height:42px}
.amargot__go:hover{background:#5c4a8f}
.amargot__go[disabled]{opacity:.6;cursor:progress}
.amargot__note{flex-basis:100%;margin:2px 0 0;font-size:.85rem;color:#4d3f78}

/* ---------- Maillage interne des archives (liens contextuels) ---------- */
.amaillage{margin:36px 0 8px;padding:24px;border:1px solid var(--border-subtle);border-radius:var(--r-lg,16px);background:var(--bg-elevated,#fff)}
.amaillage>h2{font-family:var(--font-display)!important;color:var(--text-primary)!important;font-size:19px;margin:0 0 16px;letter-spacing:-.01em}
.amaillage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px 28px}
.amaillage-groupe h3{font-size:12.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--framboise-700,#a23c61)!important;font-weight:700;margin:0 0 10px}
.amaillage-groupe ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px}
.amaillage-groupe li{margin:0}
.amaillage-groupe a{display:inline-block;padding:6px 12px;border:1px solid var(--border-default,#e0d6c6);border-radius:999px;background:var(--bg-page,#fbf9f5);color:var(--ardoise-700,#3f5b8c)!important;font-size:13px;font-weight:600;text-decoration:none;line-height:1.3;transition:background .15s,border-color .15s,color .15s}
.amaillage-groupe a:hover,.amaillage-groupe a:focus{background:var(--framboise-tint,#f9e8ef);border-color:var(--framboise-500,#c4527a);color:var(--framboise-700,#a23c61)!important}
@media(max-width:600px){.amaillage{padding:18px}.amaillage-grid{gap:16px}}
