/* =====================================================================
   bk-lot-b.css — Lot B : fiches topo, sortie, sommet, autour de moi
   Complète css/bivouak-ui.css (ne redéfinit aucun token).
   ===================================================================== */

/* hauteur du graphe de dénivelé (css/map.css), autrefois posée par topo.css */
:root{ --graph_heigth:230px }

/* bande de chiffres clés sous l'en-tête : une ligne en desktop, 3 par ligne en mobile */
.bk-kpis--band{ margin:4px 0 24px; gap:12px 0 }
.bk-kpis--band .bk-kpi{ flex:1 1 0; min-width:110px; padding-inline:16px; border-left:1px solid var(--bk-line) }
.bk-kpis--band .bk-kpi:first-child{ border-left:0; padding-left:0 }
.bk-kpis--band .bk-kpi b a{ color:inherit }
.bk-kpis--band .bk-kpi b small{ font-size:14px; font-weight:500; color:var(--bk-ink-2) }
@media (max-width:700px){
  .bk-kpis--band .bk-kpi{ flex:1 0 31%; min-width:0; padding-inline:10px }
  .bk-kpis--band .bk-kpi:nth-child(3n+1){ border-left:0; padding-left:0 }
  .bk-kpis--lg.bk-kpis--band .bk-kpi b{ font-size:18px }
}

/* en-tête : boutons d'action hérités (bookmark, coup de cœur, like) */
.bk-pagehead__actions .bk-btn--icon{ font-size:17px }
.bk-pagehead__actions .flag-active{ border-color:currentColor }
.bk-pagehead__actions sub{ bottom:0; margin-left:-4px; font-size:13px; font-weight:600; color:var(--bk-ink-2); font-variant-numeric:tabular-nums }
.bk-pagehead__actions .label{ align-self:center }
.bk-pagehead__sub a{ color:var(--bk-ink-2); font-weight:600 } .bk-pagehead__sub a:hover{ color:var(--bk-accent-ink) }

/* colonne principale */
.bk-lotb-block{ margin-bottom:32px }
.bk-lotb-block:last-child{ margin-bottom:0 }
.bk-lotb-block > h2,.bk-lotb-h2{ font-size:22px; font-weight:600; margin:0 0 12px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap }
.bk-lotb-block > h3{ font-size:18px; font-weight:600; margin:20px 0 8px }
.bk-lotb-intro{ font-size:19px; line-height:1.5; color:var(--bk-ink-2); border-left:3px solid var(--bk-accent); padding-left:16px; margin:0 0 24px; max-width:68ch }
.bk-prose{ overflow-wrap:anywhere }
.bk-prose img{ max-width:100%; height:auto }
.bk-prose iframe{ max-width:100% }
.bk-lotb-cc{ display:flex; justify-content:flex-end; margin-top:8px }

/* carte : les inclusions existantes (route_viewer, gps/route) gardent leur markup Bootstrap */
.bk-map{ min-height:0; background:var(--bk-surface) }
.bk-map > .row{ margin:0 }
.bk-map > .row > [class*="col-"]{ padding:0 }
.bk-map #track-viewer-container{ border-radius:0 !important }
.bk-map .bk-dl{ padding:10px 14px }
.bk-map .map{ min-height:320px }
.bk-map--sommet{ height:420px }
.bk-map--sommet .map{ height:100%; min-height:320px }
@media (max-width:600px){ .bk-map #track-viewer-container{ height:460px !important } .bk-map--sommet{ height:340px } }

/* galeries : photo_item.html et portfolio.html conservent leurs classes */
.bk-lotb-gallery{ display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:8px }
.bk-lotb-gallery > [class*="col-"]{ width:auto; float:none; padding:0 !important; min-width:0 }
.bk-lotb-gallery .photo,.bk-lotb-photo .photo{ aspect-ratio:1; border-radius:var(--bk-r-sm); overflow:hidden; background:linear-gradient(135deg,#b9c6d2,#4d6071) }
.bk-lotb-gallery .photo img,.bk-lotb-photo .photo img{ width:100%; height:100%; object-fit:cover; padding:0; border-radius:0; color:transparent }
.bk-lotb-photo .photo{ aspect-ratio:4/3; border-radius:var(--bk-r) }
.bk-lotb-photo .photo_icon,.bk-lotb-gallery .photo_icon{ margin:6px; border-radius:999px; padding:0 6px }

/* commentaires (forum/inc_post.html conservé) */
.bk-lotb-comments{ background:var(--bk-surface); border:1px solid var(--bk-line); border-radius:var(--bk-r); padding:8px 18px }
.bk-lotb-comments .panel{ border:0; box-shadow:none; margin:0 }
.bk-lotb-comments:empty{ display:none }

/* rail */
.bk-aside .bk-box .bk-facts{ border:0; padding:0; background:none; border-radius:0 }
.bk-facts dd a{ font-weight:600 }
.bk-facts--wide{ grid-template-columns:minmax(0,auto) 1fr }
.bk-lotb-tags{ display:flex; flex-wrap:wrap; gap:6px }
.bk-lotb-meteo{ height:40px; width:auto }
.bk-lotb-actions{ display:flex; flex-wrap:wrap; gap:8px }
.bk-lotb-refs li{ align-items:flex-start }
.bk-lotb-refs li > .fa{ color:var(--bk-ink-3); margin-top:4px; flex:none }
.bk-lotb-refs small{ display:block; color:var(--bk-ink-3); font-size:13px }
.bk-lotb-refs small img{ width:18px; height:18px; border-radius:50%; vertical-align:middle }
.bk-lotb-refs a{ overflow-wrap:anywhere }

/* participants */
.bk-lotb-parts{ display:flex; flex-wrap:wrap; gap:12px }
.bk-lotb-parts > a{ display:grid; justify-items:center; gap:4px; width:64px; text-align:center; color:var(--bk-ink-2); font-size:12px }
.bk-lotb-parts > a img{ width:48px; height:48px; border-radius:50%; object-fit:cover; background:var(--bk-line) }
.bk-lotb-parts > a span{ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }

/* topos potentiels dans le rail : une colonne */
.bk-aside .bk-lotb-potential{ display:grid; gap:16px }

/* autour de moi */
.bk-lotb-around{ position:relative }
.bk-lotb-around #map{ height:600px; width:100% }
.bk-lotb-around #pac-input{ position:absolute; top:12px; left:56px; z-index:500; width:min(320px,60%); min-height:40px; border-radius:999px; border:1px solid var(--bk-line); padding:6px 14px; background:var(--bk-surface); box-shadow:var(--bk-shadow) }
@media (max-width:600px){ .bk-lotb-around #map{ height:420px } }

/* bouton d'action répété en bas de fiche sur mobile (§8) */
.bk-lotb-mobile-cta{ display:none }
@media (max-width:600px){ .bk-lotb-mobile-cta{ display:flex; justify-content:center; padding:8px 0 24px } .bk-lotb-mobile-cta .bk-btn{ width:100% } }

@media print{ .bk-pagehead__actions,.bk-lotb-mobile-cta{ display:none !important } }
#participants-recherche{ margin-bottom:12px }

/* titres de bloc : badge collé au titre, action poussée à droite */
.bk-lotb-block > h2{ justify-content:flex-start }
.bk-lotb-block > h2 > .bk-btn,.bk-lotb-block > h2 > .bk-more{ margin-left:auto; font-size:14px }
.bk-lotb-block > h2 > .bk-more{ font-family:var(--bk-body) }

/* sorties liées : cartes plus étroites dans la colonne principale */
.bk-lotb-sorties{ grid-template-columns:repeat(auto-fill,minmax(260px,1fr)) }
@media (max-width:600px){ .bk-lotb-sorties{ grid-template-columns:1fr } }
.bk-kpis--band .bk-kpi b{ white-space:normal; overflow-wrap:anywhere }