/* =============================================================
 * COH Events Skin — card-grid layout for The Events Calendar v2
 * v1.8 — components/before action hook for reliable H1 injection
 * ============================================================= */

:root {
	--coh-purple-900: #2a0a44;
	--coh-purple-800: #34004f;
	--coh-purple-700: #4a0867;
	--coh-purple-100: #f4f1f8;
	--coh-lilac:      #d4cce0;
	--coh-gold:       #fec156;
	--coh-gold-dark:  #e3b45d;
	--coh-lime:       #c6e668;
	--coh-ink:        #2a0a44;
	--coh-muted:      #5a5a5a;
	--coh-line:       #ece6f3;
	--coh-bg:         #ffffff;

	--coh-radius:     0;
	--coh-radius-sm:  0;
	--coh-shadow:     0 8px 24px rgba(0, 0, 0, 0.18);
	--coh-shadow-h:   0 18px 40px rgba(0, 0, 0, 0.28);
	--coh-transition: 200ms ease;

	--coh-card-pad:        36px;
	--coh-card-pad-mob:    24px;
	--coh-grid-gap:        36px;
	--coh-page-pad-x:      40px;
	--coh-page-pad-x-mob:  20px;
}

/* =============================================================
 * Page-level: full width + purple background on event pages
 * (and any page using the "Full Width — Purple" template)
 * ============================================================= */

/* Gradient background: deep purple at the top, transitioning to the COH
 * gold near the bottom. `fixed` so it stays put on long event lists. */
body.post-type-archive-tribe_events,
body.tax-tribe_events_cat,
body.single-tribe_events,
body.coh-fwp-template {
	background: linear-gradient(180deg,
			#2a0a44 0%,
			#4a0867 35%,
			#7a3470 60%,
			#d39653 85%,
			#fec156 100%) !important;
	background-attachment: fixed !important;
	background-repeat: no-repeat !important;
}

/* Make Divi's nested wrappers transparent so the gradient bleeds through */
body.post-type-archive-tribe_events #page-container,
body.post-type-archive-tribe_events #et-main-area,
body.post-type-archive-tribe_events #main-content,
body.post-type-archive-tribe_events #left-area,
body.post-type-archive-tribe_events #content-area,
body.post-type-archive-tribe_events #main-content .container,
body.tax-tribe_events_cat #page-container,
body.tax-tribe_events_cat #et-main-area,
body.tax-tribe_events_cat #main-content,
body.tax-tribe_events_cat #left-area,
body.tax-tribe_events_cat #content-area,
body.tax-tribe_events_cat #main-content .container,
body.single-tribe_events #page-container,
body.single-tribe_events #et-main-area,
body.single-tribe_events #main-content,
body.single-tribe_events #left-area,
body.single-tribe_events #content-area,
body.single-tribe_events #main-content .container,
body.coh-fwp-template #page-container,
body.coh-fwp-template #et-main-area,
body.coh-fwp-template #main-content,
body.coh-fwp-template #left-area,
body.coh-fwp-template #content-area,
body.coh-fwp-template #main-content .container {
	background: transparent !important;
}

/* Kill Divi's right-sidebar vertical divider line (rendered as .container::before) */
body.post-type-archive-tribe_events #main-content .container::before,
body.post-type-archive-tribe_events #main-content .container::after,
body.tax-tribe_events_cat #main-content .container::before,
body.tax-tribe_events_cat #main-content .container::after,
body.single-tribe_events #main-content .container::before,
body.single-tribe_events #main-content .container::after,
body.coh-fwp-template #main-content .container::before,
body.coh-fwp-template #main-content .container::after {
	display: none !important;
	content: none !important;
	background: transparent !important;
}

/* "Full Width — Purple" page template — strip Divi's centered container
 * and sidebar, force purple background everywhere it might bleed through. */
body.coh-fwp-template #main-content .container {
	width: 100% !important;
	max-width: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	background-color: var(--coh-purple-900) !important;
}

body.coh-fwp-template #left-area {
	width: 100% !important;
	float: none !important;
	padding: 64px var(--coh-page-pad-x) !important;
	margin: 0 auto !important;
	max-width: 1400px;
	background: transparent !important;
}

body.coh-fwp-template #sidebar {
	display: none !important;
}

body.coh-fwp-template #content-area {
	padding: 0 !important;
	background: transparent !important;
}

/* Make page content readable on purple */
body.coh-fwp-template .entry-title,
body.coh-fwp-template #left-area h1,
body.coh-fwp-template #left-area h2,
body.coh-fwp-template #left-area h3,
body.coh-fwp-template #left-area h4 {
	color: #fff !important;
}

body.coh-fwp-template #left-area,
body.coh-fwp-template #left-area p,
body.coh-fwp-template #left-area li,
body.coh-fwp-template #left-area .entry-content {
	color: #efe9f4 !important;
	font-size: 16px;
	line-height: 1.7;
}

body.coh-fwp-template #left-area a:not(.tribe-events-calendar-list__event-title-link):not(.tribe-common-c-btn) {
	color: var(--coh-gold) !important;
}

body.coh-fwp-template #left-area a:not(.tribe-events-calendar-list__event-title-link):not(.tribe-common-c-btn):hover {
	color: #fff !important;
}

/* Cards on the page template stay white inside */
body.coh-fwp-template .tribe-events-calendar-list__event-row * {
	color: inherit;
}

@media (max-width: 980px) {
	body.coh-fwp-template #left-area {
		padding: 40px var(--coh-page-pad-x-mob) !important;
	}
}

/* Divi full-width: kill the centred container + sidebar */
.post-type-archive-tribe_events #main-content .container,
.tax-tribe_events_cat #main-content .container,
.single-tribe_events #main-content .container {
	width: 100% !important;
	max-width: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.post-type-archive-tribe_events #left-area,
.tax-tribe_events_cat #left-area,
.single-tribe_events #left-area {
	width: 100% !important;
	float: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.post-type-archive-tribe_events #sidebar,
.tax-tribe_events_cat #sidebar,
.single-tribe_events #sidebar {
	display: none !important;
}

.post-type-archive-tribe_events #content-area,
.tax-tribe_events_cat #content-area,
.single-tribe_events #content-area {
	padding: 0 !important;
}

/* TEC's own container — give it generous side padding so cards
 * never touch the screen edge */
.post-type-archive-tribe_events .tribe-events,
.tax-tribe_events_cat .tribe-events,
.single-tribe_events .tribe-events {
	padding: 8px var(--coh-page-pad-x) 48px !important;
	max-width: 1400px;
	margin: 0 auto;
}

/* Kill Divi's default content-area top padding that pushes the title down */
body.post-type-archive-tribe_events #content-area,
body.tax-tribe_events_cat #content-area,
body.single-tribe_events #content-area,
body.post-type-archive-tribe_events #left-area,
body.tax-tribe_events_cat #left-area,
body.single-tribe_events #left-area {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

/* =============================================================
 * Page header — "Our Courses" + category filters
 * ============================================================= */

/* Header is injected just inside <div class="tribe-events-view"> via the
 * view_html filter, so it inherits the events module's max-width and padding.
 * Falls back to a sibling-of-container position if the regex misses; the
 * matching constraints below cover that case. */
.coh-events-page-header {
	margin: 0 0 40px;
	padding: 0;
	color: #fff;
	width: 100%;
	box-sizing: border-box;
}

/* Fallback positioning — when the header ends up as a sibling of .tribe-events
 * rather than inside it, constrain it to match the module's width/padding. */
body.post-type-archive-tribe_events #left-area > .coh-events-page-header,
body.post-type-archive-tribe_events article > .coh-events-page-header,
body.post-type-archive-tribe_events .entry-content > .coh-events-page-header,
body.tax-tribe_events_cat #left-area > .coh-events-page-header,
body.tax-tribe_events_cat article > .coh-events-page-header,
body.tax-tribe_events_cat .entry-content > .coh-events-page-header,
body.coh-fwp-template #left-area > .coh-events-page-header {
	max-width: 1400px;
	margin: 48px auto 0;
	padding: 0 var(--coh-page-pad-x);
}

/* Match the site's H1 hero style — Cormorant Garamond, weight 600, gold.
 * TEC v2's .tribe-common reset overrides typography inside the events
 * container, so Divi's vars are re-applied explicitly. */
.coh-events-page-title {
	color: var(--coh-gold) !important;
	font-family: var(--et_global_heading_font, "Cormorant Garamond"), Georgia, "Times New Roman", serif !important;
	font-weight: var(--et_global_heading_font_weight, 600) !important;
	font-style: normal !important;
	font-size: clamp(2.4rem, 5vw, 4.5rem) !important;
	line-height: 1.12 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	margin: 0 0 28px !important;
	padding: 0 !important;
}

.coh-events-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0 0 8px;
}

.coh-events-filter {
	display: inline-flex;
	align-items: center;
	background: var(--coh-lime);
	color: var(--coh-purple-900) !important;
	font-family: "Open Sans", Arial, sans-serif;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	padding: 12px 22px;
	border-radius: var(--coh-radius);
	text-decoration: none !important;
	border: 2px solid transparent;
	transition: all var(--coh-transition);
	line-height: 1;
}

.coh-events-filter:hover {
	background: var(--coh-gold) !important;
	color: var(--coh-purple-900) !important;
	transform: translateY(-1px);
}

.coh-events-filter.is-active {
	background: #fff !important;
	color: var(--coh-purple-900) !important;
}

@media (max-width: 640px) {
	.coh-events-page-title {
		margin: 0 0 20px !important;
	}

	.coh-events-filter {
		padding: 10px 16px;
		font-size: 12px;
	}
}

/* =============================================================
 * Header / events bar (search + view switcher)
 * ============================================================= */

/* Header wrapper stays transparent — DON'T paint a white background on it
 * or the top-bar (Today / arrows / Upcoming, which lives inside .tribe-events-header)
 * also sits on white. Mobile especially suffers because the search collapses
 * to an icon and the white wrapper becomes one giant blank block. */
.tribe-events-view .tribe-events-header {
	background: transparent !important;
	padding: 0 !important;
	margin-bottom: 0 !important;
	border: 0 !important;
}

/* The search bar gets its own white pill */
.tribe-events-view .tribe-events-c-events-bar,
.tribe-events-view .tribe-events-header__events-bar {
	background: var(--coh-bg) !important;
	border: 0 !important;
	border-radius: var(--coh-radius) !important;
	padding: 18px 24px !important;
	margin-bottom: 24px !important;
}

.tribe-events-c-events-bar__search-button,
.tribe-events-c-view-selector__button {
	border-radius: var(--coh-radius) !important;
	border-color: var(--coh-lilac) !important;
	color: var(--coh-purple-700) !important;
	transition: all var(--coh-transition);
	padding: 12px 18px !important;
}

/* Hover / focus / open-drawer states — lime, no blue focus ring */
.tribe-events-c-events-bar__search-button:hover,
.tribe-events-c-events-bar__search-button:focus,
.tribe-events-c-events-bar__search-button:focus-visible,
.tribe-events-c-events-bar__search-button[aria-expanded="true"],
.tribe-events-c-view-selector__button:hover,
.tribe-events-c-view-selector__button:focus,
.tribe-events-c-view-selector__button:focus-visible,
.tribe-events-c-view-selector__button[aria-expanded="true"] {
	background: var(--coh-lime) !important;
	color: var(--coh-purple-900) !important;
	border-color: var(--coh-lime) !important;
	outline: 0 !important;
	box-shadow: none !important;
}

.tribe-events-c-events-bar__search-button:hover svg,
.tribe-events-c-events-bar__search-button:hover svg path,
.tribe-events-c-events-bar__search-button:focus svg,
.tribe-events-c-events-bar__search-button:focus svg path,
.tribe-events-c-events-bar__search-button[aria-expanded="true"] svg,
.tribe-events-c-events-bar__search-button[aria-expanded="true"] svg path,
.tribe-events-c-view-selector__button:hover svg,
.tribe-events-c-view-selector__button:hover svg path,
.tribe-events-c-view-selector__button[aria-expanded="true"] svg,
.tribe-events-c-view-selector__button[aria-expanded="true"] svg path {
	color: var(--coh-purple-900) !important;
	fill: var(--coh-purple-900) !important;
}

.tribe-events-c-search__input,
.tribe-events-c-events-bar__search input[type="search"] {
	border-radius: var(--coh-radius) !important;
	border-color: var(--coh-lilac) !important;
	padding: 14px 16px 14px 48px !important;
	font-size: 15px !important;
	line-height: 1.4 !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

/* Position the search icon properly inside the input */
.tribe-events-c-search__input-control {
	position: relative;
	width: 100%;
}

.tribe-events-c-search__input-control-icon-svg,
.tribe-events-c-search__input-control svg {
	position: absolute !important;
	left: 16px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	width: 18px !important;
	height: 18px !important;
	color: var(--coh-purple-700) !important;
	fill: var(--coh-purple-700) !important;
	pointer-events: none;
}

/* The search container needs to flex properly */
.tribe-events-c-search,
.tribe-events-c-search__input-group {
	width: 100% !important;
	display: flex !important;
	gap: 12px !important;
	align-items: stretch !important;
}

.tribe-events-c-search__input-group > .tribe-events-c-search__input-control {
	flex: 1 1 auto !important;
}

/* "Find Events" submit + primary buttons → lime, square */
.tribe-events-c-search__button,
.tribe-events-c-events-bar__search-button-submit,
.tribe-common-c-btn,
button.tribe-common-c-btn {
	background: var(--coh-lime) !important;
	color: var(--coh-purple-900) !important;
	border: 0 !important;
	border-radius: var(--coh-radius) !important;
	font-weight: 700 !important;
	padding: 12px 22px !important;
	transition: all var(--coh-transition) !important;
}

.tribe-events-c-search__button:hover,
.tribe-common-c-btn:hover {
	background: var(--coh-gold) !important;
	color: var(--coh-purple-900) !important;
}

/* Top bar (Today / arrows / "Upcoming") sits on the gradient — keep transparent
 * with light text so it stays readable. */
.tribe-events-c-top-bar {
	background: transparent !important;
	border: 0 !important;
	padding: 8px 0 !important;
	margin-bottom: 28px !important;
}

.tribe-events-c-top-bar__datepicker-button {
	color: #fff !important;
	font-weight: 700 !important;
	font-size: 22px !important;
}

.tribe-events-c-top-bar__datepicker-button:hover {
	color: var(--coh-gold) !important;
}

.tribe-events-c-top-bar__nav,
.tribe-events-c-top-bar__nav-link,
.tribe-events-c-top-bar__nav-link svg,
.tribe-events-c-top-bar__nav-link svg *,
.tribe-events-c-top-bar__nav .tribe-common-c-btn-icon,
.tribe-events-c-top-bar__nav .tribe-common-c-svgicon,
.tribe-events-c-top-bar__nav .tribe-common-c-svgicon *,
.tribe-events-c-top-bar svg,
.tribe-events-c-top-bar svg path {
	color: #fff !important;
	fill: #fff !important;
}

.tribe-events-c-top-bar__nav-link:hover,
.tribe-events-c-top-bar__nav-link:hover svg,
.tribe-events-c-top-bar__nav-link:hover svg *,
.tribe-events-c-top-bar__nav-link:hover .tribe-common-c-svgicon,
.tribe-events-c-top-bar__nav-link:hover .tribe-common-c-svgicon * {
	color: var(--coh-gold) !important;
	fill: var(--coh-gold) !important;
}

.tribe-events-c-nav__prev,
.tribe-events-c-nav__next,
.tribe-events-c-nav__list-item--prev .tribe-events-c-nav__prev,
.tribe-events-c-nav__list-item--next .tribe-events-c-nav__next {
	background: var(--coh-lime) !important;
	color: var(--coh-purple-900) !important;
	border-radius: var(--coh-radius) !important;
	padding: 12px 22px !important;
	font-weight: 700 !important;
	border: 0 !important;
	transition: all var(--coh-transition);
}

.tribe-events-c-nav__prev:hover,
.tribe-events-c-nav__next:hover {
	background: var(--coh-gold) !important;
	color: var(--coh-purple-900) !important;
	transform: translateY(-1px);
}

/* "Today" button — square, outlined white on the gradient */
.tribe-events-c-top-bar__today-button {
	background: transparent !important;
	color: #fff !important;
	border: 2px solid #fff !important;
	border-radius: var(--coh-radius) !important;
	padding: 8px 16px !important;
	font-weight: 700 !important;
}

.tribe-events-c-top-bar__today-button:hover {
	background: #fff !important;
	color: var(--coh-purple-900) !important;
}

/* =============================================================
 * List view → card grid
 * ============================================================= */

/* Full-width list rows — one card per row, horizontal layout */
.tribe-events-view--list .tribe-events-calendar-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--coh-grid-gap);
	background: transparent;
}

/* Card becomes a horizontal row: date-tag | image | content */
.tribe-events-view--list .tribe-events-calendar-list__event-row {
	flex-direction: row !important;
	align-items: stretch !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-row-inner {
	flex-direction: row !important;
	flex: 1 1 auto !important;
	height: auto !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event {
	flex-direction: row !important;
	flex: 1 1 auto !important;
}

/* Date tag → fixed-width left column instead of a top-margin pill */
.tribe-events-view--list .tribe-events-calendar-list__event-row .tribe-events-calendar-list__event-date-tag {
	position: relative !important;
	order: -1 !important;
	flex: 0 0 110px !important;
	width: 110px !important;
	min-width: 110px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 0 !important;
	background: var(--coh-gold) !important;
}

/* Cancel the :has(image) overlay rule for horizontal layout — badge stays in flow as its own column */
.tribe-events-view--list .tribe-events-calendar-list__event-row:has(.tribe-events-calendar-list__event-featured-image-wrapper) .tribe-events-calendar-list__event-date-tag {
	position: relative !important;
	top: auto !important;
	left: auto !important;
	box-shadow: none !important;
}

/* Featured image → fixed-width middle column (auto-shows when present) */
.tribe-events-view--list .tribe-events-calendar-list__event-featured-image-wrapper {
	flex: 0 0 280px !important;
	width: 280px !important;
	aspect-ratio: auto !important;
	align-self: stretch !important;
}

/* Mobile (≤768px) — stack back to vertical */
@media (max-width: 768px) {
	.tribe-events-view--list .tribe-events-calendar-list__event-row,
	.tribe-events-view--list .tribe-events-calendar-list__event-row-inner,
	.tribe-events-view--list .tribe-events-calendar-list__event {
		flex-direction: column !important;
	}

	.tribe-events-view--list .tribe-events-calendar-list__event-row .tribe-events-calendar-list__event-date-tag {
		flex: 0 0 auto !important;
		width: auto !important;
		min-width: 72px !important;
		padding: 14px 20px !important;
		align-self: flex-start !important;
		margin: var(--coh-card-pad) var(--coh-card-pad) 0 !important;
	}

	.tribe-events-view--list .tribe-events-calendar-list__event-featured-image-wrapper {
		flex: 0 0 auto !important;
		width: 100% !important;
		aspect-ratio: 16 / 10 !important;
	}
}

/* Month separators span the full grid — white on purple page */
.tribe-events-view--list .tribe-events-calendar-list__month-separator {
	grid-column: 1 / -1;
	margin: 16px 0 4px;
	padding: 0;
	border: 0;
	background: transparent !important;
}

.tribe-events-view--list .tribe-events-calendar-list__month-separator-text {
	background: transparent !important;
	color: #fff !important;
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 0.5px;
	padding: 0 18px 0 0;
	text-transform: none;
}

.tribe-events-view--list .tribe-events-calendar-list__month-separator::before {
	border-top: 1px solid rgba(255, 255, 255, 0.25) !important;
}

/* Card shell */
.tribe-events-view--list .tribe-events-calendar-list__event-row {
	position: relative;
	margin: 0 !important;
	padding: 0 !important;
	background: var(--coh-bg);
	border: 0;
	border-radius: var(--coh-radius);
	box-shadow: var(--coh-shadow);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform var(--coh-transition), box-shadow var(--coh-transition);
}

/* Stretched link — entire card navigates to the event */
.tribe-events-view--list .tribe-events-calendar-list__event-title-link::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Keep nested links clickable (image, venue, organiser) */
.tribe-events-view--list .tribe-events-calendar-list__event-featured-image-link,
.tribe-events-view--list .tribe-events-calendar-list__event-venue a,
.tribe-events-view--list .tribe-events-calendar-list__event-venue-title-link,
.tribe-events-view--list .tribe-events-calendar-list__event-cost a {
	position: relative;
	z-index: 2;
}

.tribe-events-view--list .tribe-events-calendar-list__event-row:hover {
	transform: translateY(-4px);
	box-shadow: var(--coh-shadow-h);
}

.tribe-events-view--list .tribe-events-calendar-list__event-row + .tribe-events-calendar-list__event-row {
	border-top: 0 !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-row-inner {
	display: flex;
	flex-direction: column;
	padding: 0 !important;
	gap: 0;
	height: 100%;
}

.tribe-events-view--list .tribe-events-calendar-list__event {
	display: flex;
	flex-direction: column;
	padding: 0;
	flex: 1;
	margin: 0 !important;
}

/* Featured image (only when one exists) */
.tribe-events-view--list .tribe-events-calendar-list__event-featured-image-wrapper {
	position: relative;
	flex: 0 0 auto;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: linear-gradient(135deg, var(--coh-purple-700), var(--coh-purple-900));
}

.tribe-events-view--list .tribe-events-calendar-list__event-featured-image-link {
	display: block;
	width: 100%;
	height: 100%;
}

.tribe-events-view--list .tribe-events-calendar-list__event-featured-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0 !important;
	transition: transform 400ms ease;
}

.tribe-events-view--list .tribe-events-calendar-list__event-row:hover .tribe-events-calendar-list__event-featured-image {
	transform: scale(1.04);
}

/* =============================================================
 * Date badge — ALWAYS in card flow (works with or without image)
 * ============================================================= */

.tribe-events-view--list .tribe-events-calendar-list__event-date-tag {
	position: relative;
	z-index: 2;
	background: var(--coh-gold);
	color: var(--coh-purple-900);
	border-radius: var(--coh-radius);
	padding: 14px 20px;
	box-shadow: none;
	font-family: "Open Sans", Arial, sans-serif;
	width: auto;
	min-width: 72px;
	text-align: center;
	align-self: flex-start;
	margin: var(--coh-card-pad) var(--coh-card-pad) 0 var(--coh-card-pad);
	order: -1;
	pointer-events: none;
}

/* If there's an image, overlay the badge on it instead */
.tribe-events-view--list .tribe-events-calendar-list__event-row:has(.tribe-events-calendar-list__event-featured-image-wrapper) .tribe-events-calendar-list__event-date-tag {
	position: absolute;
	top: 20px;
	left: 20px;
	margin: 0;
	z-index: 2;
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.25);
}

.tribe-events-view--list .tribe-events-calendar-list__event-date-tag-datetime {
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1;
}

.tribe-events-view--list .tribe-events-calendar-list__event-date-tag-month {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1.2px;
	color: var(--coh-purple-700);
	margin-bottom: 4px;
}

.tribe-events-view--list .tribe-events-calendar-list__event-date-tag-daynum {
	font-size: 28px;
	font-weight: 800;
	color: var(--coh-purple-900);
}

.tribe-events-view--list .tribe-events-calendar-list__event-date-tag-weekday {
	display: none;
}

/* =============================================================
 * Card body — generous padding
 * ============================================================= */

.tribe-events-view--list .tribe-events-calendar-list__event-details {
	padding: 24px var(--coh-card-pad) var(--coh-card-pad) !important;
	margin: 0 !important;
	display: flex;
	flex-direction: column;
	gap: 14px;
	flex: 1;
}

.tribe-events-view--list .tribe-events-calendar-list__event-header {
	margin: 0;
}

.tribe-events-view--list .tribe-events-calendar-list__event-datetime-wrapper {
	color: var(--coh-purple-700);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.4px;
	margin: 0 0 8px;
}

.tribe-events-view--list .tribe-events-calendar-list__event-datetime {
	color: var(--coh-purple-700) !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-title {
	margin: 0 !important;
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 24px !important;
	line-height: 1.25 !important;
	font-weight: 700 !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-title-link {
	color: var(--coh-purple-900) !important;
	text-decoration: none !important;
	transition: color var(--coh-transition);
}

.tribe-events-view--list .tribe-events-calendar-list__event-title-link:hover {
	color: var(--coh-purple-700) !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-venue {
	color: var(--coh-muted);
	font-size: 14px;
	margin: 0;
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.tribe-events-view--list .tribe-events-calendar-list__event-venue::before {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-top: 2px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234a0867'><path d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/></svg>");
	background-size: contain;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.tribe-events-view--list .tribe-events-calendar-list__event-venue-title,
.tribe-events-view--list .tribe-events-calendar-list__event-venue-address {
	color: var(--coh-muted) !important;
	font-size: 14px !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-description {
	color: #444;
	font-size: 15px;
	line-height: 1.6;
	margin: 4px 0 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tribe-events-view--list .tribe-events-calendar-list__event-description p {
	margin: 0;
}

/* Cost chip */
.tribe-events-view--list .tribe-events-calendar-list__event-cost {
	display: inline-block;
	background: var(--coh-lime);
	color: var(--coh-purple-900);
	font-weight: 700;
	font-size: 13px;
	padding: 6px 14px;
	border-radius: var(--coh-radius);
	align-self: flex-start;
	margin-top: 4px;
	letter-spacing: 0.3px;
}

/* Read-more CTA at bottom of card (decorative — card itself is the link) */
.tribe-events-view--list .tribe-events-calendar-list__event-details::after {
	content: "View event →";
	display: inline-block;
	align-self: flex-start;
	margin-top: auto;
	padding: 12px 24px;
	background: var(--coh-lime);
	color: var(--coh-purple-900);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.5px;
	border-radius: var(--coh-radius);
	transition: all var(--coh-transition);
	pointer-events: none;
	text-transform: uppercase;
	position: relative;
	z-index: 2;
}

.tribe-events-view--list .tribe-events-calendar-list__event-row:hover .tribe-events-calendar-list__event-details::after {
	background: var(--coh-gold);
	color: var(--coh-purple-900);
}

/* =============================================================
 * Empty / past states
 * ============================================================= */

.tribe-events-c-messages__message {
	background: var(--coh-bg) !important;
	color: var(--coh-purple-900) !important;
	border-radius: var(--coh-radius) !important;
	border: 0 !important;
	padding: 24px 28px !important;
}

/* =============================================================
 * Month view tweaks
 * ============================================================= */

.tribe-events-view--month .tribe-events-calendar-month {
	background: #fff;
	border-radius: var(--coh-radius);
	box-shadow: var(--coh-shadow);
	border: 0;
	overflow: hidden;
}

.tribe-events-view--month .tribe-events-calendar-month__header,
.tribe-events-view--month .tribe-events-calendar-month__day {
	border-color: var(--coh-line) !important;
}

/* Active/today date — purple background + white text. Cover every child
 * variant TEC uses so the digit is readable. */
.tribe-events-view--month .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date,
.tribe-events-view--month .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date *,
.tribe-events-view--month .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-daynum,
.tribe-events-view--month .tribe-events-calendar-month__day--current a.tribe-events-calendar-month__day-date,
.tribe-events-view--month .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-link,
.tribe-events-view--month .tribe-events-calendar-month__day-cell--current .tribe-events-calendar-month__day-date,
.tribe-events-view--month .tribe-events-calendar-month__day--current time {
	background-color: var(--coh-purple-700) !important;
	color: #fff !important;
	border-radius: var(--coh-radius) !important;
}

.tribe-events-view--month .tribe-events-calendar-month__calendar-event {
	background: var(--coh-purple-100) !important;
	border-radius: var(--coh-radius) !important;
	padding: 8px 12px !important;
}

.tribe-events-view--month .tribe-events-calendar-month__calendar-event-title-link {
	color: var(--coh-purple-900) !important;
	font-weight: 600 !important;
}

/* =============================================================
 * Single event page
 * ============================================================= */

body.single-tribe_events .tribe-events-content,
body.single-tribe_events .tribe-events-single {
	background: var(--coh-bg);
	padding: 48px var(--coh-card-pad);
	margin: 48px auto;
	max-width: 980px;
	border-radius: var(--coh-radius);
	box-shadow: var(--coh-shadow);
}

.single-tribe_events .tribe-events-single-event-title {
	color: var(--coh-purple-900);
}

.single-tribe_events .tribe-events-c-subscribe-dropdown__button {
	background: var(--coh-purple-700) !important;
	color: #fff !important;
	border-radius: var(--coh-radius) !important;
	border: 0 !important;
	font-weight: 700 !important;
	padding: 12px 22px !important;
}

.single-tribe_events .tribe-events-c-subscribe-dropdown__button:hover {
	background: var(--coh-gold) !important;
	color: var(--coh-purple-900) !important;
}

/* =============================================================
 * Responsive
 * ============================================================= */

@media (max-width: 980px) {
	.post-type-archive-tribe_events .tribe-events,
	.tax-tribe_events_cat .tribe-events,
	.single-tribe_events .tribe-events {
		padding: 4px var(--coh-page-pad-x-mob) 32px !important;
	}

	.tribe-events-view .tribe-events-c-events-bar,
	.tribe-events-view .tribe-events-header__events-bar {
		padding: 12px 16px !important;
		margin-bottom: 20px !important;
	}

	/* Stack search input + Find Events button on tablet/mobile so the
	 * button isn't squeezed beside the field. */
	.tribe-events-view .tribe-events-c-search,
	.tribe-events-view .tribe-events-c-search__input-group {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 12px !important;
	}

	.tribe-events-view .tribe-events-c-search__button,
	.tribe-events-view .tribe-events-c-events-bar__search-button-submit {
		width: 100% !important;
		justify-content: center !important;
	}
}

@media (max-width: 640px) {
	:root {
		--coh-card-pad: var(--coh-card-pad-mob);
		--coh-grid-gap: 24px;
	}

	.tribe-events-view--list .tribe-events-calendar-list {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.tribe-events-view--list .tribe-events-calendar-list__event-title {
		font-size: 20px !important;
	}

	.tribe-events-view--list .tribe-events-calendar-list__event-date-tag {
		padding: 12px 16px;
		min-width: 64px;
	}

	.tribe-events-view--list .tribe-events-calendar-list__event-date-tag-daynum {
		font-size: 24px;
	}

	.tribe-events-view--list .tribe-events-calendar-list__event-details {
		padding: 18px var(--coh-card-pad-mob) var(--coh-card-pad-mob) !important;
	}

	.tribe-events-view--list .tribe-events-calendar-list__event-details::after {
		padding: 10px 20px;
		width: 100%;
		text-align: center;
		align-self: stretch;
	}
}