/* Event Cards by Ginger Domain */

.evc-wrap {
	box-sizing: border-box;
	background: var(--evc-wrap-bg, transparent);
}

.evc-wrap *,
.evc-wrap *::before,
.evc-wrap *::after {
	box-sizing: border-box;
}

/* Filter row
   ------------------------------------------------------------------ */
.evc-filters {
	display: flex;
	flex-wrap: wrap;
	gap: var(--evc-fil-gap, 12px);
	justify-content: var(--evc-fil-align, flex-start);
	margin: 0 0 var(--evc-fil-margin, 44px);
}

.evc-wrap .evc-filter,
.evc-wrap .evc-filter:link,
.evc-wrap .evc-filter:visited {
	-webkit-appearance: none;
	appearance: none;
	display: inline-block;
	font-family: var(--evc-fil-family, inherit);
	font-size: var(--evc-fil-size, 15px);
	font-weight: var(--evc-fil-weight, 700);
	font-style: var(--evc-fil-style, normal);
	text-transform: var(--evc-fil-transform, uppercase);
	letter-spacing: var(--evc-fil-spacing, 1.6px);
	line-height: var(--evc-fil-lineheight, 15px);
	text-decoration: none;
	text-shadow: none;
	color: var(--evc-fil-color, #232B62);
	background: var(--evc-fil-bg, #ffffff);
	background-image: none;
	border: var(--evc-fil-border-width, 1px) solid var(--evc-fil-border, #D9D5CB);
	border-radius: var(--evc-fil-radius, 2px);
	padding: var(--evc-fil-padding, 15px 26px);
	box-shadow: none;
	filter: none;
	cursor: pointer;
	transition: color .18s ease, border-color .18s ease;
}

/* Hover changes the text and the border only. The background is restated on
   every state so a theme button:hover rule cannot repaint it. */
.evc-wrap .evc-filter:not(.is-active):hover,
.evc-wrap .evc-filter:not(.is-active):focus,
.evc-wrap .evc-filter:not(.is-active):focus-visible,
.evc-wrap .evc-filter:not(.is-active):active {
	color: var(--evc-fil-hover-color, #C05A2B);
	background: var(--evc-fil-bg, #ffffff);
	background-image: none;
	border-color: var(--evc-fil-hover-border, #C05A2B);
	box-shadow: none;
}

.evc-wrap .evc-filter.is-active,
.evc-wrap .evc-filter.is-active:hover,
.evc-wrap .evc-filter.is-active:focus,
.evc-wrap .evc-filter.is-active:focus-visible,
.evc-wrap .evc-filter.is-active:active {
	background: var(--evc-fil-active-bg, #232B62);
	background-image: none;
	color: var(--evc-fil-active-color, #ffffff);
	border-color: var(--evc-fil-active-border, #232B62);
	box-shadow: none;
}

.evc-wrap .evc-filter:focus-visible {
	outline: 2px solid var(--evc-fil-hover-border, #C05A2B);
	outline-offset: 2px;
}

/* Grid
   ------------------------------------------------------------------ */
.evc-grid {
	display: grid;
	grid-template-columns: repeat(var(--evc-cols, var(--evc-columns, 2)), minmax(0, 1fr));
	column-gap: var(--evc-grid-col-gap, 48px);
	row-gap: var(--evc-grid-row-gap, 40px);
	align-items: stretch;
}

/* Card
   ------------------------------------------------------------------ */
.evc-card {
	display: flex;
	min-width: 0;
}

.evc-card[hidden] {
	display: none;
}

.evc-card-inner {
	display: flex;
	align-items: var(--evc-img-align, flex-start);
	gap: var(--evc-img-gap, 28px);
	flex: 1 1 auto;
	width: 100%;
	min-height: var(--evc-card-min-height, 220px);
	padding: var(--evc-card-padding, 28px 32px 32px);
	background: var(--evc-card-bg, #FBF4F3);
	border-top: var(--evc-rule-width, 5px) solid var(--evc-rule-color, #B4832A);
	border-radius: var(--evc-card-radius, 0px);
	box-shadow: var(--evc-card-shadow, none);
	text-decoration: none;
	transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}

/* Upcoming cards get their own top rule colour */
.evc-card.evc-is-upcoming .evc-card-inner {
	border-top-color: var(--evc-rule-color-up, #232B62);
}

a.evc-card-inner:hover,
a.evc-card-inner:focus-visible {
	background: var(--evc-card-bg-hover, #F6EBE9);
	transform: translateY(calc(-1 * var(--evc-card-lift, 4px)));
	text-decoration: none;
}

/* Thumbnail keeps one fixed footprint so every card lines up */
.evc-thumb {
	flex: 0 0 var(--evc-img-width, 132px);
	width: var(--evc-img-width, 132px);
	height: var(--evc-img-height, 110px);
	overflow: hidden;
	border-radius: var(--evc-img-radius, 0px);
}

.evc-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: var(--evc-img-fit, cover);
	margin: 0;
}

.evc-body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.evc-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 var(--evc-date-margin, 10px);
}

.evc-date {
	font-family: var(--evc-date-family, inherit);
	font-size: var(--evc-date-size, 16px);
	font-weight: var(--evc-date-weight, 700);
	font-style: var(--evc-date-style, normal);
	text-transform: var(--evc-date-transform, uppercase);
	letter-spacing: var(--evc-date-spacing, 1.5px);
	line-height: var(--evc-date-lineheight, 21px);
	color: var(--evc-date-color, #B4832A);
}

.evc-badge {
	flex: 0 0 auto;
	margin-left: auto;
}

.evc-badge-upcoming {
	font-family: var(--evc-bup-family, inherit);
	font-size: var(--evc-bup-size, 13px);
	font-weight: var(--evc-bup-weight, 700);
	font-style: var(--evc-bup-style, normal);
	text-transform: var(--evc-bup-transform, uppercase);
	letter-spacing: var(--evc-bup-spacing, 1.5px);
	line-height: var(--evc-bup-lineheight, 13px);
	color: var(--evc-bup-color, #ffffff);
	background: var(--evc-bup-bg, #232B62);
	padding: var(--evc-bup-padding, 9px 14px);
	border-radius: var(--evc-bup-radius, 0px);
	border: var(--evc-bup-border-width, 0px) solid var(--evc-bup-border, #232B62);
	margin-bottom: var(--evc-bup-margin, 0px);
}

.evc-badge-past {
	font-family: var(--evc-bpast-family, inherit);
	font-size: var(--evc-bpast-size, 13px);
	font-weight: var(--evc-bpast-weight, 700);
	font-style: var(--evc-bpast-style, normal);
	text-transform: var(--evc-bpast-transform, uppercase);
	letter-spacing: var(--evc-bpast-spacing, 1.5px);
	line-height: var(--evc-bpast-lineheight, 13px);
	color: var(--evc-bpast-color, #3B3A34);
	background: var(--evc-bpast-bg, #E3DFCA);
	padding: var(--evc-bpast-padding, 9px 14px);
	border-radius: var(--evc-bpast-radius, 0px);
	border: var(--evc-bpast-border-width, 0px) solid var(--evc-bpast-border, #E3DFCA);
	margin-bottom: var(--evc-bpast-margin, 0px);
}

.evc-title {
	font-family: var(--evc-title-family, inherit);
	font-size: var(--evc-title-size, 25px);
	font-weight: var(--evc-title-weight, 700);
	font-style: var(--evc-title-style, normal);
	text-transform: var(--evc-title-transform, none);
	letter-spacing: var(--evc-title-spacing, 0px);
	line-height: var(--evc-title-lineheight, 31px);
	color: var(--evc-title-color, #232B62);
	margin: 0 0 var(--evc-title-margin, 8px);
	padding: 0;
}

.evc-desc {
	font-family: var(--evc-desc-family, inherit);
	font-size: var(--evc-desc-size, 18px);
	font-weight: var(--evc-desc-weight, 400);
	font-style: var(--evc-desc-style, normal);
	text-transform: var(--evc-desc-transform, none);
	letter-spacing: var(--evc-desc-spacing, 0px);
	line-height: var(--evc-desc-lineheight, 26px);
	color: var(--evc-desc-color, #4A4A55);
	margin: 0 0 var(--evc-desc-margin, 4px);
}

/* The description comes from the editor, so it can hold paragraphs, lists and
   emphasis. These rules keep the theme from restyling that content. */
.evc-wrap .evc-desc p,
.evc-wrap .evc-desc ul,
.evc-wrap .evc-desc ol {
	font: inherit;
	color: inherit;
	letter-spacing: inherit;
	margin: 0 0 var(--evc-desc-para-gap, 8px);
}

.evc-wrap .evc-desc ul,
.evc-wrap .evc-desc ol {
	padding-left: 1.2em;
}

.evc-wrap .evc-desc li {
	margin: 0 0 2px;
}

.evc-wrap .evc-desc > *:last-child {
	margin-bottom: 0;
}

.evc-wrap .evc-desc a {
	color: inherit;
	text-decoration: underline;
}

.evc-wrap .evc-desc strong,
.evc-wrap .evc-desc b {
	font-weight: 700;
}

.evc-wrap .evc-desc em,
.evc-wrap .evc-desc i {
	font-style: italic;
}

.evc-location {
	font-family: var(--evc-loc-family, inherit);
	font-size: var(--evc-loc-size, 18px);
	font-weight: var(--evc-loc-weight, 400);
	font-style: var(--evc-loc-style, normal);
	text-transform: var(--evc-loc-transform, none);
	letter-spacing: var(--evc-loc-spacing, 0px);
	line-height: var(--evc-loc-lineheight, 26px);
	color: var(--evc-loc-color, #4A4A55);
	margin: 0 0 var(--evc-loc-margin, 12px);
}

.evc-cat {
	font-family: var(--evc-cat-family, inherit);
	font-size: var(--evc-cat-size, 14px);
	font-weight: var(--evc-cat-weight, 700);
	font-style: var(--evc-cat-style, normal);
	text-transform: var(--evc-cat-transform, uppercase);
	letter-spacing: var(--evc-cat-spacing, 1.4px);
	line-height: var(--evc-cat-lineheight, 18px);
	color: var(--evc-cat-color, #C05A2B);
	margin: auto 0 var(--evc-cat-margin, 0px);
	padding-top: 6px;
}

.evc-empty {
	margin: 24px 0 0;
	font-style: italic;
	opacity: .75;
}

/* Pagination
   ------------------------------------------------------------------ */
.evc-pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--evc-pag-gap, 10px);
	justify-content: var(--evc-pag-align, center);
	margin: var(--evc-pag-margin-top, 48px) 0 var(--evc-pag-margin, 0px);
}

.evc-pagination[hidden] {
	display: none;
}

.evc-wrap .evc-page,
.evc-wrap .evc-page:link,
.evc-wrap .evc-page:visited {
	-webkit-appearance: none;
	appearance: none;
	display: inline-block;
	font-family: var(--evc-pag-family, inherit);
	font-size: var(--evc-pag-size, 15px);
	font-weight: var(--evc-pag-weight, 700);
	font-style: var(--evc-pag-style, normal);
	text-transform: var(--evc-pag-transform, uppercase);
	letter-spacing: var(--evc-pag-spacing, 1.6px);
	line-height: var(--evc-pag-lineheight, 15px);
	text-decoration: none;
	text-shadow: none;
	color: var(--evc-pag-color, #232B62);
	background: var(--evc-pag-bg, #ffffff);
	background-image: none;
	border: var(--evc-pag-border-width, 1px) solid var(--evc-pag-border, #D9D5CB);
	border-radius: var(--evc-pag-radius, 2px);
	padding: var(--evc-pag-padding, 13px 18px);
	box-shadow: none;
	filter: none;
	cursor: pointer;
	transition: color .18s ease, border-color .18s ease;
}

.evc-wrap .evc-page:not(.is-active):not(:disabled):hover,
.evc-wrap .evc-page:not(.is-active):not(:disabled):focus,
.evc-wrap .evc-page:not(.is-active):not(:disabled):focus-visible,
.evc-wrap .evc-page:not(.is-active):not(:disabled):active {
	color: var(--evc-pag-hover-color, #C05A2B);
	background: var(--evc-pag-bg, #ffffff);
	background-image: none;
	border-color: var(--evc-pag-hover-border, #C05A2B);
	box-shadow: none;
}

.evc-wrap .evc-page.is-active,
.evc-wrap .evc-page.is-active:hover,
.evc-wrap .evc-page.is-active:focus,
.evc-wrap .evc-page.is-active:focus-visible,
.evc-wrap .evc-page.is-active:active {
	background: var(--evc-pag-active-bg, #232B62);
	background-image: none;
	color: var(--evc-pag-active-color, #ffffff);
	border-color: var(--evc-pag-active-border, #232B62);
	box-shadow: none;
}

.evc-wrap .evc-page:disabled {
	opacity: .4;
	cursor: default;
}

.evc-wrap .evc-page:focus-visible {
	outline: 2px solid var(--evc-pag-hover-border, #C05A2B);
	outline-offset: 2px;
}

.evc-page-gap {
	color: var(--evc-pag-color, #232B62);
	font-family: var(--evc-pag-family, inherit);
	font-size: var(--evc-pag-size, 15px);
	padding: 0 2px;
	opacity: .6;
}

/* Responsive
   ------------------------------------------------------------------ */
@media (max-width: 1024px) {
	.evc-grid {
		grid-template-columns: repeat(var(--evc-columns-tablet, 1), minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.evc-grid {
		grid-template-columns: 1fr;
	}

	.evc-card-inner {
		flex-direction: column;
		min-height: 0;
	}

	/* The thumb has no fixed box on mobile. The image sizes itself: full card
	   width at its own proportions, but never taller than the height cap, and
	   never cropped unless a fixed shape is chosen in the settings. */
	.evc-thumb {
		flex: 0 0 auto;
		width: 100%;
		height: auto;
		aspect-ratio: auto;
	}

	.evc-thumb img {
		width: 100%;
		height: auto;
		max-height: var(--evc-img-mobile-max-height, 200px);
		aspect-ratio: var(--evc-img-mobile-ratio, auto);
		object-fit: var(--evc-img-mobile-fit, contain);
		object-position: var(--evc-img-mobile-position, center);
	}

	.evc-head {
		flex-wrap: wrap;
	}
}