/* PSC Events Manager 2.9.4 mobile card authority.
 *
 * Card layout is based on the width actually available to the card, rather
 * than the viewport alone. The responsive controller adds is-mobile-list and
 * is-mobile-card at 720px or below. These rules load after legacy and dynamic
 * styles so older container queries cannot reconstruct narrow columns. */

.psc-events .psc-events-list.is-mobile-list {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  container-type: normal !important;
  container-name: none !important;
}

.psc-events .psc-event-list-card.is-mobile-card,
.psc-events .psc-event-list-card.is-mobile-card.is-date-range,
.psc-events .psc-event-list-card.is-mobile-card.is-ongoing-pinned {
  display: block !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  container-type: normal !important;
  container-name: none !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary,
.psc-events .psc-event-list-card.is-mobile-card.is-date-range > .psc-event-list-summary,
.psc-events .psc-event-list-card.is-mobile-card.is-ongoing-pinned > .psc-event-list-summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 44px !important;
  grid-template-rows: auto !important;
  grid-template-areas:
    "date toggle"
    "main main"
    "image image" !important;
  grid-auto-flow: row !important;
  gap: .8rem !important;
  align-items: start !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  padding: 1rem !important;
  position: relative !important;
  box-sizing: border-box !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-date-tile,
.psc-events .psc-event-list-card.is-mobile-card.is-date-range > .psc-event-list-summary > .psc-event-date-tile,
.psc-events .psc-event-list-card.is-mobile-card.is-ongoing-pinned > .psc-event-list-summary > .psc-event-date-tile {
  grid-area: date !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: flex !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  justify-self: stretch !important;
  gap: .28rem .36rem !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: .48rem .65rem !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: color-mix(in srgb, var(--psc-events-list-accent, #036636) 8%, #fff) !important;
  text-align: left !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-date-tile > span,
.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-date-tile > strong,
.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-date-tile > small {
  display: inline-block !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  line-height: 1.12 !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-date-tile > strong {
  font-size: 1.22rem !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-date-tile > .psc-event-date-year {
  width: auto !important;
  margin: 0 0 0 .08rem !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: .72rem !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-date-tile > .psc-event-date-range-arrow.is-vertical {
  transform: rotate(-90deg) !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-list-main,
.psc-events .psc-event-list-card.is-mobile-card.is-date-range > .psc-event-list-summary > .psc-event-list-main,
.psc-events .psc-event-list-card.is-mobile-card.is-ongoing-pinned > .psc-event-list-summary > .psc-event-list-main {
  grid-area: main !important;
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  display: block !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-list-image,
.psc-events .psc-event-list-card.is-mobile-card.is-date-range > .psc-event-list-summary > .psc-event-list-image {
  grid-area: image !important;
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  display: block !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-list-image img,
.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-list-image .psc-event-featured-image {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 210px !important;
  object-fit: contain !important;
  object-position: center !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-summary > .psc-event-chevron,
.psc-events .psc-event-list-card.is-mobile-card.is-date-range > .psc-event-list-summary > .psc-event-chevron,
.psc-events .psc-event-list-card.is-mobile-card.is-ongoing-pinned > .psc-event-list-summary > .psc-event-chevron {
  grid-area: toggle !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: static !important;
  align-self: center !important;
  justify-self: end !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  margin: 0 !important;
}

.psc-events .psc-event-list-card.is-mobile-card .psc-event-type-badge {
  display: inline-flex !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 .35rem !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  text-align: left !important;
  line-height: 1.2 !important;
}

.psc-events .psc-event-list-card.is-mobile-card .psc-event-list-title {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: .15rem 0 .5rem !important;
  font-size: 1.3rem !important;
  line-height: 1.2 !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  hyphens: none !important;
}

.psc-events .psc-event-list-card.is-mobile-card .psc-event-list-subheading,
.psc-events .psc-event-list-card.is-mobile-card .psc-event-list-excerpt {
  width: 100% !important;
  max-width: none !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

.psc-events .psc-event-list-card.is-mobile-card .psc-event-list-meta {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: .45rem !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  font-size: .93rem !important;
}

.psc-events .psc-event-list-card.is-mobile-card .psc-event-list-meta > span,
.psc-events .psc-event-list-card.is-mobile-card .psc-event-list-location-row,
.psc-events .psc-event-list-card.is-mobile-card .psc-event-builder-meta-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: .45rem !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

.psc-events .psc-event-list-card.is-mobile-card .psc-event-location-text,
.psc-events .psc-event-list-card.is-mobile-card .psc-event-location-name,
.psc-events .psc-event-list-card.is-mobile-card .psc-event-location-details {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

.psc-events .psc-event-list-card.is-mobile-card > .psc-event-list-details {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 1rem !important;
}

.psc-events .psc-event-list-card.is-mobile-card .psc-event-details-grid {
  grid-template-columns: minmax(0, 1fr) !important;
}

.psc-events details.psc-event-list-card.is-mobile-card > .psc-event-admin-edit-row {
  width: 100% !important;
  margin: 0 !important;
  padding: .65rem 1rem .9rem !important;
}

/* Saved Card Builder layouts use the same readable mobile hierarchy. */
.psc-events .psc-event-list-card.is-mobile-card.psc-event-builder-card > .psc-event-builder-summary {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 1rem !important;
  position: relative !important;
}

.psc-events .psc-event-list-card.is-mobile-card.psc-event-builder-card .psc-event-builder-row {
  display: none !important;
}

.psc-events .psc-event-list-card.is-mobile-card.psc-event-builder-card .psc-event-builder-safe-summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas: "safe-date" "safe-main" "safe-image" !important;
  gap: .8rem !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  padding-right: 50px !important;
}

.psc-events .psc-event-list-card.is-mobile-card.psc-event-builder-card .psc-event-builder-safe-date {
  grid-area: safe-date !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
}

.psc-events .psc-event-list-card.is-mobile-card.psc-event-builder-card .psc-event-builder-safe-main {
  grid-area: safe-main !important;
  grid-column: 1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.psc-events .psc-event-list-card.is-mobile-card.psc-event-builder-card .psc-event-builder-safe-image {
  grid-area: safe-image !important;
  grid-column: 1 !important;
  grid-row: 3 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.psc-events .psc-event-list-card.is-mobile-card.psc-event-builder-card > .psc-event-builder-summary > .psc-event-chevron {
  position: absolute !important;
  top: 1rem !important;
  right: 1rem !important;
  width: 42px !important;
  height: 42px !important;
}

/* CSS-only fallback for narrow viewports when JavaScript is unavailable. */
@media (max-width: 782px) {
  .psc-events .psc-events-list {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
  }
}
