/*
 * Event dates panel and card badge.
 *
 * The theme does not define colour presets, so each value falls back to a
 * site colour. Change the fallbacks in one place with the custom properties
 * below, or override them from GeneratePress.
 */
.fmbc-event-dates,
.fmbc-event-badge {
	--fmbc-band: var(--wp--preset--color--base-2, #eaf6f8);
	--fmbc-text: var(--wp--preset--color--contrast, #073e52);
	--fmbc-muted: var(--wp--preset--color--contrast-2, #237e90);
	--fmbc-mark: var(--wp--preset--color--highlight, #e01a4f);
	--fmbc-on-dark: var(--wp--preset--color--base, #ffffff);
	--fmbc-small: var(--wp--preset--font-size--small, 0.875rem);
}

/* Event dates panel on single posts in the Events category. */
.fmbc-event-dates {
	background-color: var(--fmbc-band);
	border-left: 3px solid var(--fmbc-mark);
	border-radius: 2px;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	margin-bottom: 1.5rem;
	padding: 1rem;
}

.fmbc-event-dates.is-past {
	border-left-color: var(--fmbc-muted);
}

.fmbc-event-dates__row {
	align-items: baseline;
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.75rem;
}

.fmbc-event-dates__label {
	color: var(--fmbc-muted);
	font-size: var(--fmbc-small);
	letter-spacing: 0.08em;
	min-width: 4rem;
	text-transform: uppercase;
}

.fmbc-event-dates__value {
	color: var(--fmbc-text);
	font-weight: 600;
}

.fmbc-event-dates__flag {
	background-color: var(--fmbc-muted);
	border-radius: 2px;
	color: var(--fmbc-on-dark);
	font-size: var(--fmbc-small);
	padding: 0.1rem 0.5rem;
}

.fmbc-event-dates__ics {
	align-self: flex-start;
	font-size: var(--fmbc-small);
	font-weight: 600;
}

/* Event date on a post card in a query loop. */
.fmbc-event-badge {
	background-color: var(--fmbc-band);
	border-radius: 2px;
	color: var(--fmbc-text);
	display: inline-block;
	font-size: var(--fmbc-small);
	font-weight: 600;
	padding: 0.1rem 0.5rem;
}

.fmbc-event-badge.is-past {
	color: var(--fmbc-muted);
	font-weight: 400;
}