/**
 * Shared Material card styles for carousel, list, grid, timeline, and coordinators.
 */

/* —— Events list / grid cards —— */
.eventplus-events-list.eventplus-style-cards,
.eventplus-events-list-gutenberg.eventplus-style-cards,
.eventplus-events-list.eventplus-style-material-cards,
.eventplus-events-list-gutenberg.eventplus-style-material-cards,
.eventplus-events-list.eventplus-style-material-overlay,
.eventplus-events-list-gutenberg.eventplus-style-material-overlay,
.eventplus-events-list.eventplus-style-material-minimal,
.eventplus-events-list-gutenberg.eventplus-style-material-minimal {
	display: grid;
	gap: var(--ep-list-gap, 1rem);
}

.eventplus-event-card {
	display: flex;
	flex-direction: column;
	background: var(--ep-list-card-bg, #fff);
	border: 1px solid var(--ep-list-card-border, #e5e7eb);
	border-radius: var(--ep-list-radius, 0.5rem);
	overflow: hidden;
	box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.eventplus-event-card__image {
	overflow: hidden;
}

.eventplus-event-card__image img {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: 180px !important;
	min-height: 120px !important;
	object-fit: cover !important;
	opacity: 1 !important;
	visibility: visible !important;
}

body .eventplus-element .eventplus-event-card__image,
body .eventplus-element .eventplus-modern-list__thumb {
	display: block !important;
	overflow: hidden !important;
	opacity: 1 !important;
	visibility: visible !important;
}

body .eventplus-element .eventplus-modern-list__thumb img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover !important;
	opacity: 1 !important;
	visibility: visible !important;
}

.eventplus-event-card__body {
	padding: 16px 20px 20px;
	color: var(--ep-list-meta-color, #64748b);
	font-size: 15px;
	line-height: 1.45;
}

.eventplus-event-card__date {
	display: block;
	font-size: 13px !important;
	font-weight: 600;
	color: var(--ep-list-date-color, #6e59a5);
	margin-bottom: 8px !important;
}

.eventplus-event-card__title {
	margin: 0 0 8px !important;
	font-size: 18px !important;
	line-height: 1.35 !important;
	color: var(--ep-list-title-color, #111827);
}

.eventplus-event-card__title a {
	color: inherit;
	text-decoration: none;
	font-size: 18px !important;
	line-height: 1.35 !important;
	font-weight: 600 !important;
}

.eventplus-event-card__title a:hover {
	color: var(--ep-list-link-color, #0073aa);
}

.eventplus-event-card__description,
.eventplus-event-card__categories,
.eventplus-event-card__location {
	margin: 0 0 8px;
	font-size: 15px;
	line-height: 1.45;
}

.eventplus-event-card__link {
	display: inline-block;
	margin-top: 8px;
	font-size: 15px;
	line-height: 1.4;
	font-weight: 600;
	color: var(--ep-list-link-color, #0073aa);
	text-decoration: none;
	padding: 0;
	background: transparent;
	border: 0;
	box-shadow: none;
	text-transform: none;
	letter-spacing: normal;
}

.eventplus-event-card__link:hover {
	text-decoration: underline;
}

.eventplus-style-material-cards .eventplus-event-card {
	border: none;
	box-shadow:
		0 2px 2px 0 rgba(0, 0, 0, 0.14),
		0 3px 1px -2px rgba(0, 0, 0, 0.2),
		0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

.eventplus-style-material-minimal .eventplus-event-card {
	border: none;
	box-shadow: none;
	background: transparent;
}

.eventplus-style-material-minimal .eventplus-event-card__image img {
	border-radius: var(--ep-list-radius, 0.5rem);
}

/* Grid wraps list — stack cards in columns */
.eventplus-events-grid .eventplus-events-list,
.eventplus-events-grid .eventplus-events-list-gutenberg {
	display: grid;
	gap: var(--ep-list-gap, 1rem);
}

.eventplus-events-grid .eventplus-event-card {
	height: 100%;
}

/* —— Material Overlay (shared: list; carousel/timeline use element-specific CSS) —— */
.eventplus-style-material-overlay .eventplus-event-card,
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__card {
	position: relative;
	border: none;
	box-shadow: 0 14px 36px rgba(15, 23, 42, 0.16);
	overflow: hidden;
}

.eventplus-style-material-overlay .eventplus-event-card__image,
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__media {
	overflow: hidden;
}

.eventplus-style-material-overlay .eventplus-event-card__image img,
.eventplus-event-card__image-placeholder {
	display: block;
	width: 100%;
	height: 220px;
	object-fit: cover;
}

/* No featured image: use the card background from Display Styling (not a fixed color). */
.eventplus-event-card__image-placeholder {
	background: var(
		--ep-list-card-bg,
		var(--ep-carousel-card-bg, var(--ep-timeline-card-bg, #ffffff))
	);
}

.eventplus-style-material-overlay .eventplus-event-card__body {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 1rem 1.125rem 1.125rem;
	background: linear-gradient(180deg, transparent, rgba(15, 23, 42, 0.88));
	color: #fff;
	z-index: 1;
}

/* Timeline overlay uses content-driven height; media covers the full card (see timeline CSS). */
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__content {
	position: relative;
	z-index: 1;
	color: #fff;
}

.eventplus-style-material-overlay .eventplus-event-card__date,
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__date {
	display: block;
	font-size: 0.8125rem;
	font-weight: 700;
	color: #fff;
	margin-bottom: 0.35rem;
}

.eventplus-style-material-overlay .eventplus-event-card__title,
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__title {
	margin: 0;
	font-size: 1.05rem;
	line-height: 1.35;
	color: #fff;
}

.eventplus-style-material-overlay .eventplus-event-card__title a,
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__title a {
	color: #fff;
	text-decoration: none;
}

.eventplus-style-material-overlay .eventplus-event-card__location,
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__location {
	margin: 0.35rem 0 0;
	font-size: 0.875rem;
	color: #fff;
}

/* Overlay shows date, title, and location only (same as carousel). */
.eventplus-style-material-overlay .eventplus-event-card__description,
.eventplus-style-material-overlay .eventplus-event-card__categories,
.eventplus-style-material-overlay .eventplus-event-card__actions,
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__excerpt,
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__categories,
.eventplus-timeline.eventplus-card-style--material-overlay .eventplus-timeline__time {
	display: none;
}

/* Overlay style without a visible image falls back to a standard card body. */
.eventplus-style-material-overlay .eventplus-event-card:not(:has(.eventplus-event-card__image)) .eventplus-event-card__body {
	position: static;
	background: transparent;
	color: var(--ep-list-meta-color, #64748b);
	padding: 1rem 1.25rem 1.25rem;
}

.eventplus-style-material-overlay .eventplus-event-card:not(:has(.eventplus-event-card__image)) .eventplus-event-card__title,
.eventplus-style-material-overlay .eventplus-event-card:not(:has(.eventplus-event-card__image)) .eventplus-event-card__title a,
.eventplus-style-material-overlay .eventplus-event-card:not(:has(.eventplus-event-card__image)) .eventplus-event-card__date,
.eventplus-style-material-overlay .eventplus-event-card:not(:has(.eventplus-event-card__image)) .eventplus-event-card__location {
	color: inherit;
}

.eventplus-style-material-overlay .eventplus-event-card:not(:has(.eventplus-event-card__image)) .eventplus-event-card__description,
.eventplus-style-material-overlay .eventplus-event-card:not(:has(.eventplus-event-card__image)) .eventplus-event-card__categories,
.eventplus-style-material-overlay .eventplus-event-card:not(:has(.eventplus-event-card__image)) .eventplus-event-card__actions {
	display: block;
}

/* —— Timeline cards (legacy shared hooks; full personalities live in timeline-public.css) —— */
.eventplus-timeline__card {
	transition: box-shadow 0.2s ease;
}

/* —— Coordinator cards ——
 * Full card personalities live in addons/coordinators/public/css/eventplus-coordinators-public.css
 */