/* One content edge for titles, location, reviews and opening state. */
#main .card-actions{align-items:flex-end}
/* Keep the caption in normal flow and both controls on the same baseline. */
#main .card-actions>.card-tools{display:grid;grid-template-columns:repeat(2,36px);column-gap:8px;row-gap:6px;align-items:end;justify-items:center;flex:0 0 auto;max-width:100%;margin-left:auto}
#main .card-tools>.card-map-group{display:contents}
#main .card-map-group>.card-map-distance{display:block;grid-column:1 / -1;grid-row:1;position:static;transform:none;width:100%;max-width:none;flex:none;margin:0;font-size:.7rem;line-height:1.35;font-weight:500;color:#647268;text-align:right;white-space:normal;overflow-wrap:anywhere;pointer-events:none}
#main .card-tools>.card-icon{grid-column:1;grid-row:2}
#main .card-tools .card-icon{position:relative;inset:auto;display:inline-flex;align-items:center;justify-content:center;align-self:end;flex:0 0 36px;width:36px;height:36px;min-width:36px;min-height:36px;max-width:36px;margin:0;padding:0;border-radius:50%;box-sizing:border-box;overflow:hidden}
#main .card-tools .card-icon>.icon{width:16px;height:16px;flex:none}
#main .card-map-group>.card-icon{grid-column:2;grid-row:2;align-self:end}
#main .card-tools .card-icon:before,#main .card-tools .card-icon:after{content:none}
#main .activity-card.compact-offer{--card-gutter:16px}
#main .activity-card.compact-offer .activity-body{padding:16px var(--card-gutter) 10px;gap:9px;flex:0 0 auto;min-height:0;text-align:left;align-items:stretch}
#main .activity-card.compact-offer .activity-body h3{margin:0;line-height:1.35;text-wrap:pretty}
#main .activity-card.compact-offer .travel-line{margin:0;align-items:flex-start;gap:6px;line-height:1.45;font-weight:500}
#main .activity-card.compact-offer .travel-line>.icon{width:16px;height:16px;flex:0 0 16px;margin-top:2px}
#main .activity-card.compact-offer .offer-distance{margin:0;font-weight:400;line-height:1.4}
#main .activity-card.compact-offer>.place-rating{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:0;padding:0 var(--card-gutter) 10px;min-height:0;height:auto;line-height:1.4}
#main .activity-card.compact-offer>.place-rating .rating-star{display:inline-flex;justify-content:center;align-items:center;width:16px;flex:0 0 16px}
#main .activity-card.compact-offer>.place-rating .rating-count{overflow:visible;text-overflow:clip}
#main .activity-card.compact-offer>.place-rating.rating-empty{display:none}
#main .activity-card.compact-offer>.activity-availability{padding:0 var(--card-gutter) 12px;margin:0;width:100%;height:auto;min-height:0}
#main .activity-card.compact-offer .activity-availability .offer-opening,#main .dining-card .dining-availability .offer-opening{padding:0;margin:0;height:auto;min-height:0;max-height:none}
#main .activity-card.compact-offer .activity-availability .offer-opening.unknown,#main .dining-card .dining-availability .offer-opening.unknown{display:none}
#main .activity-card.compact-offer .activity-availability .offer-opening strong,#main .dining-card .dining-availability .offer-opening strong{display:flex;align-items:center;justify-content:flex-start;gap:6px;line-height:1.4;text-align:left}
#main .activity-card.compact-offer .activity-availability .offer-opening i,#main .dining-card .dining-availability .offer-opening i{width:8px;height:8px;flex:0 0 8px;margin-inline:4px}
#main .activity-card.compact-offer .activity-availability .offer-opening small,#main .dining-card .dining-availability .offer-opening small{display:block;margin:4px 0 0 22px;line-height:1.45;height:auto;min-height:0;max-height:none;white-space:normal;overflow:visible;-webkit-line-clamp:unset}
#main .activity-card.compact-offer>.activity-actions.card-actions{padding:10px var(--card-gutter) 14px;margin-top:auto;gap:8px;min-height:0;border-top:1px solid #edf0e8}
@media(max-width:760px){#main .activity-card.compact-offer{--card-gutter:14px}#main .activity-card.compact-offer .activity-body{padding-top:14px;gap:8px}#main .activity-card.compact-offer>.activity-actions.card-actions{padding-bottom:12px}}
#main .activity-card.compact-offer>.activity-actions.card-actions:has(>.card-tools),#main .event-card>.event-bottom.card-actions:has(>.card-tools),#main .dining-card>.dining-actions.card-actions:has(>.card-tools){padding-top:12px;padding-inline:var(--card-gutter,16px);align-items:flex-end;justify-content:flex-end;gap:8px}

#main .place-sort{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin:16px 0 0;font-size:.8125rem;color:var(--muted)}
#main .place-sort select{font:inherit;font-weight:500;color:var(--dark);background:white;border:1px solid var(--line);border-radius:10px;min-height:42px;min-width:0;max-width:100%;padding:8px 32px 8px 12px}
@media(max-width:480px){#main .place-sort{display:grid;grid-template-columns:1fr;gap:6px}#main .place-sort select{width:100%}}

/* Neighbouring mobile cards share content rows instead of arbitrary fixed heights. */
@supports(grid-template-rows:subgrid){
 @media(max-width:760px){
  #main .activitygrid:not(.carousel)>.activity-card.compact-offer{display:grid;grid-template-rows:subgrid;grid-row:span 6;row-gap:0;align-items:stretch}
  #main .activitygrid:not(.carousel)>.activity-card.compact-offer>.activity-cover{grid-row:1;align-self:start}
  #main .activitygrid:not(.carousel)>.activity-card.compact-offer>.activity-body{grid-row:2 / span 2;display:grid;grid-template-rows:subgrid;row-gap:8px;align-content:stretch;align-items:start}
  #main .activitygrid:not(.carousel)>.activity-card.compact-offer>.activity-body>h3{grid-row:1;min-height:0}
  #main .activitygrid:not(.carousel)>.activity-card.compact-offer>.activity-body>.travel-line{grid-row:2;align-self:start}
  #main .activitygrid:not(.carousel)>.activity-card.compact-offer>.place-rating{grid-row:4;align-self:start}
  #main .activitygrid:not(.carousel)>.activity-card.compact-offer>.activity-availability{grid-row:5;align-self:start;margin:0}
  #main .activitygrid:not(.carousel)>.activity-card.compact-offer>.activity-actions{grid-row:6;margin-top:0;align-self:stretch}
 }
}
#main .dining-card>.dining-availability{padding:0 16px 12px;margin:0;min-height:0;text-align:left}
#main .dining-card .offer-opening strong{font-size:.76rem}
#main .dining-card .offer-opening small{font-size:.72rem}

/* Match the star and opening-state dot columns, as on attraction cards. */
#main .dining-card{--card-gutter:16px}
#main .dining-card>.dining-rating{margin:0;padding:0 var(--card-gutter) 10px;gap:6px;line-height:1.4}
#main .dining-card>.dining-rating .rating-star{display:inline-flex;align-items:center;justify-content:center;width:16px;flex:0 0 16px}
#main .dining-card>.dining-availability{padding-inline:var(--card-gutter)}
@media(max-width:760px){#main .dining-card{--card-gutter:14px}}

/* Align restaurant address, reviews and opening hours to one left edge. */
#main .dining-card>.dining-copy{padding-inline:var(--card-gutter)}
#main .dining-card .dining-location{justify-content:flex-start;text-align:left;gap:6px}
#main .dining-card .dining-location>.icon{width:16px;flex:0 0 16px}
#main .dining-card>.dining-rating{justify-content:flex-start;flex-wrap:wrap;text-align:left}

/* Keep every restaurant footer at the card bottom, including booking cards. */
#main .dining-card>.dining-actions.card-actions{margin-top:auto;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:flex-end;gap:10px;padding:12px var(--card-gutter) 14px;min-height:0}
#main .dining-card>.dining-actions.card-actions>.card-tools{margin-left:auto;align-self:flex-end;flex:0 0 auto}
#main .dining-card>.dining-actions.card-actions>.btn{flex:1 0 100%;width:100%;margin:0}

/* Shared rows keep a wrapped address from shifting neighbouring opening states. */
@supports (grid-template-rows:subgrid){
 #main .dining-grid>.dining-card{display:grid;grid-template-rows:subgrid;grid-row:span 7;row-gap:0;align-items:stretch}
 #main .dining-grid>.dining-card>.dining-photo{grid-row:1;align-self:start}
 #main .dining-grid>.dining-card>.dining-copy{grid-row:2 / span 3;display:grid;grid-template-rows:subgrid;row-gap:6px;align-content:stretch;align-items:start;padding-block:12px 10px}
 #main .dining-grid>.dining-card>.dining-copy>h3{grid-row:1;min-height:0}
 #main .dining-grid>.dining-card>.dining-copy>.dining-kind{grid-row:2}
 #main .dining-grid>.dining-card>.dining-copy>.dining-location{grid-row:3}
 #main .dining-grid>.dining-card>.dining-rating{grid-row:5;align-self:start}
 #main .dining-grid>.dining-card>.dining-availability{grid-row:6;align-self:start;margin:0}
 #main .dining-grid>.dining-card>.dining-actions{grid-row:7;align-self:end;margin:0}
}