/* V50: scoped public-facing visual fixes. No admin, checkout or payment styling. */

/* Date ranges: render the day numbers and the en dash as separate flex items.
   Enough physical space is reserved for the dash so it never touches a digit. */
.hla-event-date--range .day,
.hla-list-event__date--range strong {
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  gap:4px!important;
  letter-spacing:0!important;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.hla-event-date--range .day {font-size:clamp(20px,2.05vw,29px)!important;}
.hla-list-event__date--range strong {font-size:clamp(20px,2.1vw,29px)!important;}
.hla-event-date--range .hla-date-number,
.hla-list-event__date--range .hla-date-number {display:inline-block;flex:0 0 auto;letter-spacing:0;}
.hla-event-date--range .hla-date-range-dash,
.hla-list-event__date--range .hla-date-range-dash {
  display:inline-block;flex:0 0 auto;
  font-size:.65em!important;line-height:1!important;
  margin:0!important;letter-spacing:0!important;align-self:center;
}
@media (min-width:941px) and (max-width:1330px){
  html.hla-layout-left .hla-event-date--range .day,
  html.hla-layout-left .hla-list-event__date--range strong{font-size:21px!important;gap:3px!important}
}

@media (min-width:941px) and (max-width:1120px){
  html.hla-layout-left .hla-event-date--range .day{font-size:18px!important;gap:2px!important}
}
@media (max-width:540px){
  .hla-event-date--range .day,
  .hla-list-event__date--range strong{font-size:21px!important;gap:3px!important}
}

/* Missing event photos match the card's main surface instead of stark white.
   The inset outline retains a distinct, visible image slot. */
html .hla-page-shell--home .hla-home-event-photo.hla-home-event-photo--fallback,
html .hla-events-list .hla-list-event__image.hla-list-event__image--fallback {
  background:transparent!important;
  border:1px solid rgba(126,63,152,.24)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);
  box-sizing:border-box;
}
html[data-theme="dark"] .hla-page-shell--home .hla-home-event-photo--fallback,
html[data-theme="dark"] .hla-events-list .hla-list-event__image--fallback {
  border-color:rgba(211,175,229,.37)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035);
}
/* Keep logo contrast on the dark surface without affecting actual event photos. */
html[data-theme="dark"] .hla-home-event-photo--fallback img.hla-event-logo-fallback,
html[data-theme="dark"] .hla-list-event__image--fallback img.hla-event-logo-fallback {
  filter:brightness(1.22);
}

/* Category thumbnails, including uploaded category logos, stay wholly inside
   the top rectangular thumbnail; the crop that occurred with object-fit:cover
   is removed. No card dimensions, category text or product photos are changed. */
.hla-shop-landing .hla-category-card__visual {
  box-sizing:border-box;
  overflow:hidden;
  padding:10px!important;
}
.hla-shop-landing .hla-category-card__visual img,
.hla-shop-landing .hla-category-card__visual .hla-category-card__shield {
  display:block;
  box-sizing:border-box;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
}

/* Light-mode homepage — Option 4: intentionally stronger contrast between
   a cool off-white page and lilac event cards. Keep original purple accents,
   image layout, and ALL dark-mode appearance untouched. */
html[data-theme="light"] .hla-page-shell--home {
  background:#f2f0fa!important;
}
html[data-theme="light"] .hla-page-shell--home .hla-home-event {
  background:#e2d6f4!important;
  border-color:#c7addb!important;
  box-shadow:0 6px 18px rgba(61,33,76,.12)!important;
}
html[data-theme="light"] .hla-page-shell--home .hla-event-main,
html[data-theme="light"] .hla-page-shell--home .hla-event-main__copy {
  background:#e2d6f4!important;
}
html[data-theme="light"] .hla-page-shell--home .hla-event-venue {
  background:#ddcbea!important;
  border-left-color:#bda2cf!important;
}
html[data-theme="light"] .hla-page-shell--home .hla-home-event-photo--fallback {
  background:#e2d6f4!important;
  border-color:#baa0cd!important;
}
html[data-theme="light"][data-public-design="current"] .hla-page-shell--home .hla-event-date,
html[data-theme="light"][data-public-design="v2"] .hla-page-shell--home .hla-event-date {
  background:#d4bee6!important;
}