﻿/**
 * BeaMii Places & Associations List Layout
 * Shared list/card system for /steder/ and /foreninger/
 */

.beamii-places .beamii-places-page__context,
#placesBrowseContext,
.beamii-places .beamii-places-toolbar__hint,
#placesHint,
.beamii-places .beamii-places-toolbar__total,
#placesTotalWrap,
#placesTotal,
.beamii-places .beamii-places-toolbar,
.beamii-places .beamii-places-page__hero,
.beamii-places .beamii-places-page__hero-main,
.beamii-places .beamii-places-page__lead,
.beamii-places .beamii-places-results__sub,
.beamii-places .beamii-places-quick__sub{
  display:none !important;
}

.beamii-places{
  --places-max:1080px;
  --places-gap:12px;
  --places-surface:#ffffff;
  --places-border:rgba(15,23,42,.08);
  --places-shadow:0 5px 14px rgba(15,23,42,.055);
  --places-shadow-hover:0 9px 20px rgba(15,23,42,.085);
  --places-muted:#637083;
  --places-title:#102033;
  --places-side-padding:8px;
  overflow-x:clip;
}

.beamii-places .topbar{
  z-index:140;
  box-shadow:0 10px 22px rgba(15,23,42,.08);
  border-bottom-left-radius:18px;
  border-bottom-right-radius:18px;
  background:linear-gradient(180deg, rgba(234,242,248,.985) 0%, rgba(234,242,248,.96) 100%);
}

.beamii-places .chips--sub{
  margin-top:8px;
  padding-bottom:8px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  flex-wrap:nowrap;
}

.beamii-places .chips--sub::-webkit-scrollbar{
  display:none;
}

.beamii-places .chips--sub .chip{
  flex:0 0 auto;
}

.beamii-places .beamii-places-page{
  width:min(100%, var(--places-max));
  margin:0 auto;
  padding:calc(var(--beamii-places-topbar-h, var(--topbar-total-h, 168px)) + 18px) var(--places-side-padding) calc(var(--bottom-nav-h, 72px) + env(safe-area-inset-bottom, 0px) + 26px);
  overflow-x:clip;
}

.beamii-places-quick,
.beamii-places-results{
  display:block;
  margin:0 0 16px;
}

.beamii-places-quick__head,
.beamii-places-results__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  margin:0 0 10px;
  padding:0 2px;
}

.beamii-places-quick__title,
.beamii-places-results__title{
  margin:0;
  color:var(--places-title);
  font-size:clamp(1.38rem, 3.8vw, 1.75rem);
  line-height:1.12;
  letter-spacing:-.02em;
  font-weight:900;
}

.beamii-places-quick__rail{
  display:flex;
  gap:12px;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
  padding:2px 2px 8px;
}

.beamii-places-quick__rail::-webkit-scrollbar{
  display:none;
}

.beamii-places-quick__card{
  flex:0 0 min(84vw, 338px);
  display:flex;
  flex-direction:column;
  min-width:0;
  border-radius:22px;
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,255,.96));
  border:1px solid var(--places-border);
  box-shadow:var(--places-shadow);
  scroll-snap-align:start;
}

.beamii-places-quick__thumb{
  position:relative;
  min-height:168px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  overflow:hidden;
}

.beamii-places-quick__thumb.has-fallback{
  background-image:linear-gradient(135deg, #1f3c5c 0%, #245d87 42%, #1fa3d6 100%);
}

.beamii-places-quick__thumb.has-logo-only{
  background-image:linear-gradient(135deg, rgba(31,60,92,.18), rgba(31,163,214,.12));
}

.beamii-places-quick__thumb::before,
.beamii-places .place-row__media::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(9,18,28,.04), rgba(9,18,28,.30));
}

.beamii-places-quick__logo-badge,
.beamii-places .place-row__logo-badge{
  position:absolute;
  left:10px;
  bottom:10px;
  z-index:2;
  width:48px;
  height:48px;
  border-radius:14px;
  background:rgba(255,255,255,.96);
  box-shadow:0 10px 20px rgba(15,23,42,.18);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:7px;
  overflow:hidden;
}

.beamii-places-quick__logo-badge img,
.beamii-places .place-row__logo-badge img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.beamii-places-quick__thumb-fallback,
.beamii-places .place-row__media-fallback{
  position:absolute;
  inset:0;
  z-index:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:8px;
  padding:12px;
  color:#fff;
}

.beamii-places-quick__thumb-fallback-mark,
.beamii-places .place-row__media-fallback-mark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:14px;
  background:rgba(255,255,255,.18);
  font-size:.96rem;
  font-weight:900;
}

.beamii-places-quick__thumb-fallback-label,
.beamii-places .place-row__media-fallback-label{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  font-size:.82rem;
  line-height:1.24;
  font-weight:800;
}

.beamii-places-quick__body{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:12px;
  min-width:0;
}

.beamii-places-quick__top,
.beamii-places .place-row__top{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:start;
}

.beamii-places-quick__cats,
.beamii-places .place-row__cats,
.beamii-places .place-row__metrics,
.beamii-places .place-row__badges{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  flex-wrap:wrap;
}

.beamii-places .place-row__metrics{
  justify-content:flex-end;
}

.beamii-places .js-place-distance:empty,
.beamii-places .js-association-distance:empty{
  display:none;
}

.beamii-places .place-row__metrics .place-pill,
.beamii-places-quick__dist .place-pill{
  box-shadow:none;
  min-height:28px;
  padding:0 10px;
}

.beamii-places-quick__name,
.beamii-places .place-row__title{
  color:var(--places-title);
  font-weight:900;
  letter-spacing:-.02em;
  line-height:1.14;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.beamii-places-quick__name{
  font-size:1.04rem;
  -webkit-line-clamp:2;
}

.beamii-places .place-row__title{
  font-size:clamp(1.08rem, 1.5vw, 1.28rem);
  -webkit-line-clamp:2;
}

.beamii-places-quick__excerpt,
.beamii-places .place-row__desc{
  color:var(--places-muted);
  display:-webkit-box;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.beamii-places-quick__excerpt{
  font-size:.86rem;
  line-height:1.45;
  -webkit-line-clamp:2;
}

.beamii-places .place-row__desc{
  font-size:.9rem;
  line-height:1.35;
  -webkit-line-clamp:2;
}

.beamii-places-quick__bottom,
.beamii-places .place-row__bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:0;
}

.beamii-places .place-row__bottom{
  margin-top:auto;
}

.beamii-places-quick__meta,
.beamii-places .place-row__meta{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:0;
  color:rgba(16,32,51,.74);
  font-size:.76rem;
  font-weight:800;
}

.beamii-places-quick__meta span:last-child,
.beamii-places .place-row__meta span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.beamii-places-quick__badges,
.beamii-places .place-row__badges,
.beamii-places .place-row__favorite,
.beamii-places .place-row__chev,
.beamii-places .place-pill--radius{
  display:none !important;
}

.beamii-places .places-grid,
.beamii-places .beamii-places-loader{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-items:stretch;
  gap:var(--places-gap);
}

.beamii-places .places-grid > .beamii-places-loader{
  grid-column:1 / -1;
}

.beamii-places .place-row,
.beamii-places .beamii-places-loader__card{
  box-sizing:border-box;
  position:relative;
  display:grid;
  grid-template-columns:104px minmax(0,1fr);
  align-items:stretch;
  gap:10px;
  width:100%;
  height:100%;
  min-width:0;
  min-height:132px;
  padding:8px;
  border-radius:18px;
  background:var(--places-surface);
  border:1px solid var(--places-border);
  box-shadow:var(--places-shadow);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.beamii-places .beamii-swipe-card{
  box-sizing:border-box;
  position:relative;
  align-self:stretch;
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
  border-radius:18px;
  isolation:isolate;
}

.beamii-places .beamii-swipe-card__actions{
  position:absolute;
  inset:0 0 0 auto;
  z-index:0;
  display:flex;
  justify-content:flex-end;
  width:auto;
  background:#f3f1ff;
  pointer-events:none;
}

.beamii-places .beamii-swipe-card.is-open > .beamii-swipe-card__actions{
  z-index:4;
  pointer-events:auto;
}

.beamii-places .beamii-swipe-card.is-open > .place-row .place-row__link{
  pointer-events:none;
}

.beamii-places .beamii-swipe-card__action{
  display:flex;
  flex:0 0 72px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:8px 4px;
  border:0;
  color:#fff;
  font:inherit;
  font-size:.72rem;
  font-weight:850;
  cursor:pointer;
  text-decoration:none;
}

.beamii-places .beamii-swipe-card__action i{font-size:1.16rem}
.beamii-places .beamii-swipe-card__action--route{background:#6253f5}
.beamii-places .beamii-swipe-card__action--favorite{background:#ff3f53}
.beamii-places .beamii-swipe-card__action[aria-pressed="true"]{background:#c92f44}

.beamii-places .beamii-swipe-card__action:focus-visible{
  outline:3px solid #fff;
  outline-offset:-5px;
}

.beamii-places .beamii-swipe-card > .place-row{
  z-index:1;
  width:100%;
  height:100%;
  min-height:100%;
  touch-action:pan-y;
  transform:translate3d(var(--beamii-swipe-x, 0),0,0);
  transition:transform .2s cubic-bezier(.2,.75,.25,1), box-shadow .16s ease, border-color .16s ease;
  will-change:transform;
}

.beamii-places .beamii-swipe-card.is-dragging > .place-row{transition:none}
.beamii-places .beamii-swipe-card > .place-row:hover,
.beamii-places .beamii-swipe-card > .place-row:focus-within{
  transform:translate3d(var(--beamii-swipe-x, 0),0,0);
}

@media (prefers-reduced-motion:reduce){
  .beamii-places .beamii-swipe-card > .place-row{transition:none}
}

.beamii-places .place-row:hover,
.beamii-places .place-row:focus-within{
  transform:translateY(-1px);
  box-shadow:var(--places-shadow-hover);
}

.beamii-places .place-row__media,
.beamii-places .beamii-places-loader__media{
  position:relative;
  overflow:hidden;
  border-radius:14px;
  min-height:114px;
  height:100%;
  background-size:cover;
  background-position:center;
}

.beamii-places .beamii-places-loader__media,
.beamii-places .beamii-places-loader__pill,
.beamii-places .beamii-places-loader__line,
.beamii-places-quick__loading span{
  background:linear-gradient(135deg, rgba(31,60,92,.09), rgba(31,163,214,.12));
}

.beamii-places-quick__loading{
  display:flex;
  gap:10px;
  padding:4px 2px 8px;
}

.beamii-places-quick__loading span{
  flex:0 0 min(52vw, 190px);
  height:132px;
  border-radius:20px;
  position:relative;
  overflow:hidden;
}

.beamii-route-progress{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:4px;
}

.beamii-route-progress__bar{
  width:100%;
  height:6px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(16,32,51,.10);
}

.beamii-route-progress__bar span{
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg, #1f5f88 0%, #1fa3d6 100%);
}

.beamii-route-progress__text{
  color:rgba(16,32,51,.70);
  font-size:.78rem;
  font-weight:700;
}

.beamii-places .beamii-places-loader__body{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding-top:2px;
  min-width:0;
}

.beamii-places .beamii-places-loader__pill,
.beamii-places .beamii-places-loader__line{
  position:relative;
  overflow:hidden;
  border-radius:999px;
}

.beamii-places .beamii-places-loader__pill{ width:72px; height:24px; }
.beamii-places .beamii-places-loader__line--title{ width:74%; height:18px; }
.beamii-places .beamii-places-loader__line--text{ width:100%; height:13px; }
.beamii-places .beamii-places-loader__line--meta{ width:42%; height:13px; }

.beamii-places .beamii-places-loader__media::after,
.beamii-places .beamii-places-loader__line::after,
.beamii-places-quick__loading span::after,
.beamii-pill-skeleton::after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
  animation:beamiiPlacesShimmer 1.25s infinite;
}

.beamii-pill-skeleton{
  position:relative;
  display:block;
  width:56px;
  height:10px;
  border-radius:999px;
  overflow:hidden;
  background:linear-gradient(135deg, rgba(31,60,92,.16), rgba(31,163,214,.16));
}

@keyframes beamiiPlacesShimmer{
  100%{ transform:translateX(100%); }
}

.beamii-places .place-row__main{
  display:flex;
  flex-direction:column;
  gap:5px;
  min-width:0;
  padding:2px 0;
}

.beamii-places .place-row__title-line,
.beamii-places .place-row__main > *{
  min-width:0;
}

.beamii-places .place-row__link{
  position:absolute;
  inset:0;
  z-index:3;
  border-radius:inherit;
  text-indent:-9999px;
  overflow:hidden;
}

.beamii-places .place-row__link:focus-visible{
  outline:2px solid #1f7db4;
  outline-offset:3px;
}

.beamii-places .place-pill,
.beamii-places .mini-pill,
.beamii-places .beamii-places-quick__badge{
  min-height:24px;
  padding:0 8px;
  border-radius:999px;
  font-size:.68rem;
  font-weight:800;
}

.beamii-places .place-pill--cat{
  max-width:min(70vw, 190px);
  overflow:hidden;
}

.beamii-places .place-pill--cat > span{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.beamii-places .place-pill--cat-more{
  min-height:26px;
  padding:0 9px;
  border-radius:999px;
  border:1px solid rgba(16,32,51,.12);
  background:rgba(16,32,51,.06);
  color:#1b314d;
  display:inline-flex;
  align-items:center;
  font-size:.72rem;
  font-weight:800;
}

.beamii-places .place-pill--dist.is-loading{
  min-width:78px;
  justify-content:center;
  background:rgba(16,32,51,.08);
  border-color:rgba(16,32,51,.12);
}

.beamii-places .place-pill--dist.is-loading i{
  display:none;
}

.beamii-list-load-state{
  min-height:22px;
  margin:8px 2px 2px;
  color:rgba(16,32,51,.66);
  font-size:.82rem;
  font-weight:700;
}

.beamii-list-sentinel{
  width:100%;
  height:2px;
}

.places-empty{
  display:none;
  padding:24px 18px;
  border-radius:20px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 8px 20px rgba(15,23,42,.06);
  color:rgba(16,32,51,.68);
  text-align:center;
  font-weight:800;
}

@media (min-width: 840px){
  .beamii-places .places-grid,
  .beamii-places .beamii-places-loader{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 640px){
  .beamii-places{
    --places-side-padding:6px;
  }

  .beamii-places .beamii-places-page{
    padding-top:calc(var(--beamii-places-topbar-h, var(--topbar-total-h, 168px)) + 14px);
  }

  .beamii-places .place-row,
  .beamii-places .beamii-places-loader__card{
    grid-template-columns:96px minmax(0,1fr);
  }

  .beamii-places .place-row__media,
  .beamii-places .beamii-places-loader__media{
    min-height:108px;
  }

  .beamii-places-quick__card{
    flex-basis:min(86vw, 324px);
  }
}

@media (max-width: 430px){
  .beamii-places .place-row,
  .beamii-places .beamii-places-loader__card{
    grid-template-columns:92px minmax(0,1fr);
  }

  .beamii-places .place-row__title{
    font-size:clamp(1.04rem, 4.6vw, 1.16rem);
  }

  .beamii-places .place-row__desc{
    font-size:.86rem;
    line-height:1.32;
  }

  .beamii-places .place-pill--cat{
    max-width:min(65vw, 172px);
  }
}
