/* Travel-guide detail card, clustering and mobile map controls. */
.guide-destinations__panel{position:relative}
.mapboxgl-popup,.leaflet-popup{display:none!important}

/* A detail card sizes itself to its content, but never takes more than half the viewport. */
.guide-destinations.has-detail{padding-bottom:0}
.guide-detail{position:absolute;z-index:8;left:0;right:0;bottom:0;width:100%;max-height:50dvh;margin:0;overflow-y:auto;overscroll-behavior:contain;border:1px solid var(--green-tint);border-left:0;border-right:0;border-bottom:0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;background:#fff;box-shadow:var(--shadow-elevated);pointer-events:auto;transform:translate3d(0,calc(100% + 16px),0);opacity:1;will-change:transform;transition:transform .22s var(--ease)}
.guide-detail[hidden]{display:none}
.guide-detail.is-visible{transform:translate3d(0,0,0)}
.guide-detail__top{position:sticky;z-index:2;top:0;display:flex;align-items:center;min-height:58px;padding:var(--space-2) var(--space-4) var(--space-2);background:linear-gradient(180deg,#fff 72%,rgba(255,255,255,0))}
.guide-detail__top--map{gap:var(--space-3);justify-content:space-between}
.guide-detail__title{flex:1;min-width:0;margin:0;font-family:var(--font-heading-family);font-size:var(--font-lg);font-weight:500;line-height:var(--line-tight);color:var(--ink)}
.guide-detail__back{min-height:var(--control-md);padding:0 var(--space-3);border:1px solid var(--green-tint);border-radius:var(--radius-pill);display:inline-flex;align-items:center;gap:var(--space-2);background:var(--surface-subtle);color:var(--ink);font-family:var(--font-ui-family);font-size:var(--font-xs);font-weight:var(--weight-bold);line-height:var(--line-tight)}
.guide-detail__back i{font-size:var(--font-xs)}
.guide-detail__close{flex:0 0 var(--control-md);width:var(--control-md);height:var(--control-md);padding:0;border:1px solid var(--green-tint);border-radius:var(--radius-round);display:grid;place-items:center;background:var(--surface-subtle);color:var(--ink);box-shadow:var(--shadow-soft);font-size:var(--font-md)}
.guide-detail__photo{width:100%;height:220px;margin:0 0 var(--space-3);overflow:hidden;border-radius:0;background:#eceae4}
.guide-detail__photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
.guide-detail__top--map:has(+ .guide-detail__photo){position:absolute;top:0;left:0;right:0;height:220px;min-height:0;padding:0 var(--space-4) var(--space-4);align-items:flex-end;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.08) 56%,rgba(0,0,0,.74) 100%);pointer-events:none}
.guide-detail__top--map:has(+ .guide-detail__photo) .guide-detail__title{padding-right:48px;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.42)}
.guide-detail__top--map:has(+ .guide-detail__photo) .guide-detail__close{position:absolute;top:14px;right:14px;pointer-events:auto;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.guide-detail__body{padding:0 var(--space-4) var(--space-4)}
.guide-detail__body h2{margin:2px 0 var(--space-2);font-family:var(--font-heading-family);font-size:var(--font-lg);font-weight:500;line-height:var(--line-tight);color:var(--ink)}
.guide-detail__body p{margin:0;color:var(--muted);font-size:var(--font-sm);line-height:var(--line-copy)}
.guide-detail__travel{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}
.guide-detail__travel-item{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border:1px solid var(--green-tint);border-radius:var(--radius-pill);background:var(--surface-subtle);color:var(--ink);font-family:var(--font-ui-family);font-size:var(--font-xs);font-weight:var(--weight-bold);line-height:var(--line-tight)}
.guide-detail__travel-item .app-icon{font-size:var(--font-xs);color:var(--green)}
.guide-detail__route-distance{display:inline-flex;align-items:center;gap:var(--space-2);margin-top:var(--space-3);padding:var(--space-2) var(--space-3);border:1px solid var(--green-tint);border-radius:var(--radius-pill);background:var(--surface-subtle);color:var(--ink);font-family:var(--font-ui-family);font-size:var(--font-xs);font-weight:var(--weight-bold);line-height:var(--line-tight)}
.guide-detail__route-distance .app-icon{font-size:var(--font-xs);color:var(--green)}
.guide-detail__route-photo{height:132px;margin:var(--space-3) 0 0;overflow:hidden;border-radius:var(--radius-md);background:#eceae4}
.guide-detail__route-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
.guide-detail__actions{display:grid;grid-template-columns:1fr;gap:var(--space-2);margin-top:var(--space-4)}
.guide-detail__action{width:100%;min-height:var(--control-md);padding:var(--space-2) var(--space-3);border:1px solid var(--green-tint);border-radius:var(--radius-md);display:grid;grid-template-columns:20px minmax(0,1fr) 12px;align-items:center;gap:var(--space-2);text-decoration:none;font-family:var(--font-ui-family);font-size:var(--font-xs);font-weight:var(--weight-bold);line-height:var(--line-tight)}
.guide-detail__action span{text-align:center}
.guide-detail__action i:first-child{font-size:var(--font-md)}
.guide-detail__action i:last-child{justify-self:end;font-size:var(--font-xs);opacity:.72}
.guide-detail__action--maps{background:var(--green);border-color:var(--green);color:#fff}
.guide-detail__action--website{background:var(--surface-subtle);color:var(--ink)}
.guide-destination__actions{display:none!important}
.guide-cluster{width:42px;height:42px;padding:0;border:0;border-radius:var(--radius-round);display:grid;place-items:center;background:#fff;color:var(--ink);font-family:var(--font-ui-family);font-size:var(--font-xs);font-weight:800;line-height:var(--line-tight);box-shadow:var(--shadow-soft);cursor:pointer}
.js-guide-map-style{left:14px!important}

@media(max-width:420px){
    .js-guide-map-style{left:10px!important}
    .guide-detail{width:100%;max-height:50dvh;margin:0;border-radius:var(--radius-lg) var(--radius-lg) 0 0}
    .guide-detail__top{min-height:54px;padding:var(--space-2) var(--space-3) var(--space-2)}
    .guide-detail__close{flex-basis:var(--control-md);width:var(--control-md);height:var(--control-md)}
    .guide-detail__title{font-size:var(--font-lg)}
    .guide-detail__photo{width:100%;height:175px;margin:0 0 var(--space-3);border-radius:0}
    .guide-detail__top--map:has(+ .guide-detail__photo){height:175px;min-height:0;padding:0 var(--space-3) var(--space-3)}
    .guide-detail__top--map:has(+ .guide-detail__photo) .guide-detail__close{top:10px;right:10px}
    .guide-detail__body{padding:0 var(--space-3) var(--space-4)}
    .guide-detail__body h2{font-size:var(--font-lg)}
    .guide-detail__body p{font-size:var(--font-sm);line-height:var(--line-copy)}
    .guide-detail__route-photo{height:118px;border-radius:var(--radius-md)}
    .guide-detail__actions{gap:var(--space-2);margin-top:var(--space-4)}
    .guide-detail__action{min-height:var(--control-md);padding:var(--space-2) var(--space-2);font-size:var(--font-xs)}
}