/* Event Manager storefront styles. Everything is scoped so nothing leaks into the theme. */
.event_manager { color: #333; }
.event_manager .page_title { font-size: 34px; font-weight: 300; margin: 0 0 20px; }
.event_manager .event_list { list-style: none; margin: 0 0 30px; padding: 0; display: grid; gap: 24px; }
.event_manager .event_list--grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.event_manager .event_list--list { grid-template-columns: 1fr; }
.event_manager .event_block { margin: 0; background: #fff; border: 1px solid #e3e3e3; border-radius: 4px; overflow: hidden; display: flex; flex-direction: column; }
.event_manager .event_list--list .event_block { flex-direction: row; }
.event_manager .event_list--list .event_thumbnail { flex: 0 0 300px; }
.event_manager .event_thumbnail img { display: block; width: 100%; height: 170px; object-fit: cover; }
.event_manager .event_list--list .event_thumbnail img { height: 100%; min-height: 200px; }
.event_manager .event_detail { padding: 16px; flex: 1; display: flex; flex-direction: column; }
.event_manager .event_title { font-size: 18px; font-weight: 600; line-height: 1.3; margin: 0 0 12px; }
.event_manager .event_detail dl { margin: 0 0 10px; display: grid; grid-template-columns: auto 1fr; gap: 3px 8px; font-size: 13px; }
.event_manager .event_detail dt { font-weight: 600; margin: 0; }
.event_manager .event_detail dd { margin: 0; }
.event_manager .event_recurrence { display: inline-block; align-self: flex-start; background: #eaf3fb; color: #1979c3; border-radius: 3px; padding: 2px 8px; font-size: 12px; margin: 0 0 10px; }
.event_manager .event_summary { font-size: 14px; margin: 0 0 12px; }
.event_manager .learn_more { margin-top: auto; font-weight: 600; }
.event_manager .modes-mode { margin-right: 12px; }

.event_manager .back_link { display: inline-block; margin-bottom: 10px; }
.event_manager .detail_hero img { display: block; width: 100%; max-height: 420px; object-fit: cover; border-radius: 4px; margin-bottom: 24px; }
.event_manager .detail_columns { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); gap: 32px; align-items: start; margin-bottom: 32px; }
.event_manager .event_info { background: #f7f7f7; border-radius: 4px; padding: 20px; }
.event_manager .event_info h2 { font-size: 18px; margin: 0 0 12px; }
.event_manager .event_info dl { margin: 0 0 16px; }
.event_manager .event_info dt { font-weight: 600; margin: 8px 0 0; }
.event_manager .event_info dd { margin: 0; overflow-wrap: anywhere; }
.event_manager .buy_tickets { width: 100%; }
.event_manager h2.section_title { font-size: 22px; font-weight: 300; margin: 32px 0 14px; }
.event_manager .event_gallery { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.event_manager .event_gallery li { margin: 0; }
.event_manager .event_gallery img { display: block; width: 100%; height: 130px; object-fit: cover; border-radius: 3px; }
.event_manager .event_media { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; }
.event_manager .event_video iframe, .event_manager .event_video video { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; background: #000; object-fit: cover; }
.event_manager #map_canvas { height: 300px; }
.event_manager .share_links { margin: 28px 0 0; display: flex; gap: 8px; align-items: center; }
.event_manager .share_links img { display: block; width: 32px; height: 32px; }

.events_popup ul { list-style: none; margin: 0; padding: 0; }
.events_popup li.ticket { display: grid; grid-template-columns: 110px 1fr; gap: 16px; padding: 16px 0; margin: 0; border-bottom: 1px solid #e3e3e3; }
.events_popup .ticket img { width: 110px; height: 110px; object-fit: cover; }
.events_popup .ticket h3 { margin: 0 0 4px; font-size: 16px; }
.events_popup .ticket .price { font-weight: 600; display: block; margin-bottom: 10px; }
.events_popup .ticket .field { margin-bottom: 10px; }
.events_popup .ticket label { display: block; font-weight: 600; margin-bottom: 3px; }
.events_popup .ticket input[type=number] { width: 70px; }
.events_popup .ticket_message { margin-top: 8px; font-weight: 600; }
.events_popup .ticket_message.error { color: #e02b27; }
.events_popup .ticket_message.success { color: #006400; }

.event_manager .fc-event { cursor: pointer; }
.event_manager #calendar { margin-bottom: 30px; }
.event_popover { position: fixed; z-index: 1000; width: 280px; background: #fff; border: 1px solid #ccc; border-radius: 4px; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); padding: 12px 14px; font-size: 13px; display: none; }
.event_popover strong { display: block; font-size: 14px; margin-bottom: 6px; }
.event_popover p { margin: 0 0 4px; }

.product-events { margin: 0 0 20px; padding: 10px 14px; background: #f7f7f7; border-radius: 4px; }
.product-events ul { list-style: none; margin: 6px 0 0; padding: 0; }
.product-events li { margin: 0 0 4px; }

@media (max-width: 767px) {
    .event_manager .detail_columns { grid-template-columns: 1fr; }
    .event_manager .event_list--list .event_block { flex-direction: column; }
    .event_manager .event_list--list .event_thumbnail { flex: none; }
    .event_manager .event_list--list .event_thumbnail img { height: 170px; min-height: 0; }
    .events_popup li.ticket { grid-template-columns: 1fr; }
}
