/* ============================================================
   PLACE ON-SITE SURFACE
   PlaceCard-handlinger under den lokale Utforsk-seksjonen.
   Events og Møtes bruker canonicale runtime-eiere og ligger under samlingene.
   ============================================================ */

body.hg-app #placeCard .pc-events-quad{
  max-height:none;
  min-height:0;
  padding:8px;
  border:2px solid rgba(255,255,255,.28);
  background:rgba(12,12,10,.88);
  box-shadow:0 8px 24px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.04);
  display:block;
  width:100%;
  min-width:0;
  overflow:visible;
}

body.hg-app #placeCard .pc-events-quad[hidden]{
  display:none !important;
}

body.hg-app #placeCard .pc-events-head,
body.hg-app #placeCard .pc-events-add{
  display:none !important;
}

body.hg-app #placeCard .pc-onsite-surface{
  width:100%;
  min-width:0;
  padding:0;
}

body.hg-app #placeCard .pc-onsite-actions{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  align-items:stretch;
  gap:6px;
  width:100%;
  min-width:0;
}

body.hg-app #placeCard .pc-onsite-action{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:6px;
  min-width:0;
  min-height:42px;
  padding:7px 9px;
  border:2px solid rgba(255,255,255,.22);
  border-radius:11px;
  background:rgba(255,255,255,.075);
  color:#fff;
  font:inherit;
  font-size:13px;
  line-height:1.1;
  font-weight:850;
  text-align:left;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(0,0,0,.22);
  overflow:hidden;
}

body.hg-app #placeCard .pc-onsite-action:hover,
body.hg-app #placeCard .pc-onsite-action:focus-visible{
  border-color:rgba(247,226,163,.62);
  background:rgba(247,226,163,.13);
  outline:2px solid rgba(247,226,163,.22);
  outline-offset:1px;
}

body.hg-app #placeCard .pc-onsite-action-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  margin:0;
  font-size:18px;
  line-height:1;
}

body.hg-app #placeCard .pc-onsite-action-label{
  min-width:0;
  margin:0;
  color:#fff;
  font-size:13px;
  font-weight:850;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.hg-app #placeCard .pc-onsite-action-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:999px;
  background:rgba(255,255,255,.13);
  color:#fff;
  font-size:11px;
  font-weight:900;
}

body.hg-app #placeCard .pc-onsite-action-events{
  border-color:rgba(232,159,87,.42);
}

body.hg-app #placeCard .pc-onsite-action-meet{
  border-color:rgba(181,121,210,.46);
}

body.hg-app .pc-onsite-event-popup,
body.hg-app .pc-onsite-meet-hub{
  display:grid;
  gap:8px;
}

body.hg-app .pc-onsite-event{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  background:rgba(255,255,255,.045);
}

body.hg-app .pc-onsite-event strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.hg-app .pc-onsite-event span{
  color:rgba(255,255,255,.66);
  font-size:12px;
}

body.hg-app .pc-onsite-meet-choice{
  width:100%;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:10px;
  align-items:center;
  min-height:54px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:rgba(255,255,255,.07);
  color:#fff;
  text-align:left;
  font:inherit;
  cursor:pointer;
}

body.hg-app .pc-onsite-meet-choice > span:first-child{
  font-size:21px;
}

body.hg-app .pc-onsite-meet-choice > span:last-child{
  display:grid;
  gap:2px;
}

body.hg-app .pc-onsite-meet-choice strong{
  font-size:14px;
}

body.hg-app .pc-onsite-meet-choice small{
  color:rgba(255,255,255,.65);
  font-size:12px;
  line-height:1.25;
}

@media (max-width:700px){
  body.hg-app #placeCard .pc-events-quad{
    padding:6px;
  }

  body.hg-app #placeCard .pc-onsite-actions{
    gap:4px;
  }

  body.hg-app #placeCard .pc-onsite-action{
    min-height:38px;
    gap:4px;
    padding:5px 7px;
  }

  body.hg-app #placeCard .pc-onsite-action-icon{
    width:16px;
    height:16px;
    font-size:15px;
  }

  body.hg-app #placeCard .pc-onsite-action-label{
    font-size:11px;
  }

  body.hg-app #placeCard .pc-onsite-action-count{
    min-width:16px;
    height:16px;
    padding:0 3px;
    font-size:9px;
  }
}

/* Place Sheet: both media columns share a bottom baseline. The portrait
   establishes the height when collections are shorter; the right column
   flexes so Events/Møtes ends at the portrait's bottom without a pixel
   offset or absolute positioning. */
body.hg-app #placeCard.is-unified-place.is-place-sheet-phase1.is-place-sheet-direct .pc-sheet-hero-media{
  align-items:stretch;
}

body.hg-app #placeCard.is-unified-place.is-place-sheet-phase1.is-place-sheet-direct .pc-sheet-hero-media > .pc-sheet-explore-grid{
  display:flex;
  flex-direction:column;
  align-self:stretch;
  min-height:0;
}

body.hg-app #placeCard.is-unified-place.is-place-sheet-phase1.is-place-sheet-direct .pc-sheet-explore-grid > .pc-side-stack{
  flex:0 0 auto;
}

/* The legacy PlaceCard collection grid reserves a 3:4 aspect ratio AND
   four explicit rows. Place Sheet shows up to four collections in two
   columns, so the unused rows otherwise stretch the portrait itself.
   Keep the existing column/row gaps, but size only the occupied rows.
   Events/Møtes can then align with the natural 3:4 frontImage bottom. */
body.hg-app #placeCard.is-unified-place.is-place-sheet-phase1.is-place-sheet-direct .pc-sheet-hero-media > .pc-sheet-explore-grid .pc-icons-quad{
  aspect-ratio:auto;
  /* Override the legacy count-specific minmax(190px) rows loaded later. */
  grid-template-rows:none !important;
}

/* Place Sheet: Events and Møtes belong BELOW the collection tiles in the
   right-hand column alongside frontImage, not below the landscape header. */
body.hg-app #placeCard.is-place-sheet-direct .pc-sheet-explore-grid > #pcEventsBox{
  display:block;
  grid-column:auto;
  grid-row:auto;
  width:100%;
  min-width:0;
  max-width:100%;
  min-height:0;
  max-height:none;
  height:auto;
  margin:auto 0 0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  box-sizing:border-box;
  overflow:visible;
}

body.hg-app #placeCard.is-place-sheet-direct .pc-sheet-explore-grid > #pcEventsBox[hidden]{
  display:none !important;
}

body.hg-app #placeCard.is-place-sheet-direct .pc-sheet-explore-grid > #pcEventsBox .pc-onsite-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  align-items:stretch;
  width:100%;
  min-width:0;
}

body.hg-app #placeCard.is-place-sheet-direct .pc-sheet-explore-grid > #pcEventsBox .pc-onsite-action{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:100%;
  min-width:0;
  min-height:44px;
  padding:8px 9px;
  border-radius:12px;
  box-sizing:border-box;
}

@media(max-width:700px){
  /* In the narrow right column, stack full-width actions so both labels
     remain legible without overflowing into the frontImage. */

  body.hg-app #placeCard.is-place-sheet-direct .pc-sheet-explore-grid > #pcEventsBox .pc-onsite-actions{
    grid-template-columns:minmax(0,1fr);
    gap:7px;
  }
  body.hg-app #placeCard.is-place-sheet-direct .pc-sheet-explore-grid > #pcEventsBox .pc-onsite-action{
    min-height:40px;
    padding:7px 8px;
  }
}
