/* Agenda Google — public styles. Inherits the theme's fonts and text colour. */

.agg-calendar,
.agg-list,
.agg-single {
	--agg-accent: var(--agg-accent-global, #1f6f8b);
	--agg-line: color-mix(in srgb, currentColor 14%, transparent);
	--agg-soft: color-mix(in srgb, var(--agg-accent) 10%, transparent);
	--agg-muted: color-mix(in srgb, currentColor 55%, transparent);
	--agg-radius: 6px;
	box-sizing: border-box;
}

.agg-calendar *,
.agg-list * {
	box-sizing: border-box;
}

.agg-calendar .screen-reader-text,
.agg-list .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* Header */
.agg-calendar__header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .75rem 1rem;
	margin-bottom: 1rem;
}

.agg-calendar__title {
	margin: 0;
	font-size: 1.5em;
	line-height: 1.2;
}

.agg-calendar__nav {
	display: flex;
	gap: .375rem;
}

.agg-btn {
	display: inline-flex;
	align-items: center;
	gap: .25rem;
	padding: .4em .8em;
	border: 1px solid var(--agg-line);
	border-radius: var(--agg-radius);
	font-size: .875em;
	line-height: 1.2;
	text-decoration: none;
	color: inherit;
	background: transparent;
	transition: border-color .15s, background-color .15s;
}

.agg-btn:hover,
.agg-btn:focus-visible {
	border-color: var(--agg-accent);
	background: var(--agg-soft);
	color: inherit;
}

/* Month grid */
.agg-month {
	width: 100%;
	margin: 0;
	table-layout: fixed;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--agg-line);
	border-radius: var(--agg-radius);
	overflow: hidden;
	font-size: .9375em;
}

.agg-month th {
	padding: .5rem .25rem;
	border: 0;
	border-bottom: 1px solid var(--agg-line);
	font-size: .8em;
	font-weight: 600;
	letter-spacing: .04em;
	text-align: center;
	text-transform: uppercase;
	color: var(--agg-muted);
	background: transparent;
}

.agg-month th abbr {
	text-decoration: none;
	border: 0;
}

.agg-month td {
	height: 7rem;
	padding: .375rem;
	border: 0;
	border-right: 1px solid var(--agg-line);
	border-bottom: 1px solid var(--agg-line);
	vertical-align: top;
	background: transparent;
}

.agg-month td:last-child {
	border-right: 0;
}

.agg-month tbody tr:last-child td {
	border-bottom: 0;
}

.agg-day__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 1.75rem;
	margin-bottom: .25rem;
}

.agg-day__num {
	display: inline-grid;
	place-items: center;
	min-width: 1.75rem;
	height: 1.75rem;
	border-radius: 999px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.agg-day__full {
	display: none;
}

.agg-day--other .agg-day__num,
.agg-day--other .agg-day__events {
	opacity: .45;
}

.agg-day--today .agg-day__num {
	background: var(--agg-accent);
	color: #fff;
}

.agg-day__events {
	margin: 0;
	padding: 0;
	list-style: none;
}

.agg-event {
	margin: 0 0 .25rem;
	padding: 0;
}

.agg-event a {
	display: block;
	padding: .2rem .4rem;
	border-left: 3px solid var(--agg-accent);
	border-radius: 0 4px 4px 0;
	background: var(--agg-soft);
	color: inherit;
	font-size: .8125em;
	line-height: 1.3;
	text-decoration: none;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.agg-event a:hover,
.agg-event a:focus-visible {
	background: color-mix(in srgb, var(--agg-accent) 20%, transparent);
}

.agg-event--allday a {
	background: var(--agg-accent);
	color: #fff;
}

.agg-event__time {
	font-variant-numeric: tabular-nums;
	color: var(--agg-muted);
}

.agg-event--allday .agg-event__time {
	color: inherit;
	opacity: .85;
}

.agg-calendar__empty {
	margin: 1rem 0 0;
	color: var(--agg-muted);
}

/* Phones: the public calendar becomes a list of the days that have events. */
@media (max-width: 720px) {
	.agg-calendar--front .agg-month,
	.agg-calendar--front .agg-month tbody,
	.agg-calendar--front .agg-month tr,
	.agg-calendar--front .agg-month td {
		display: block;
		width: 100%;
	}

	.agg-calendar--front .agg-month {
		border: 0;
	}

	.agg-calendar--front .agg-month thead,
	.agg-calendar--front .agg-day--empty,
	.agg-calendar--front .agg-day--other {
		display: none !important;
	}

	.agg-calendar--front .agg-month td {
		height: auto;
		margin-bottom: .75rem;
		padding: .75rem;
		border: 1px solid var(--agg-line);
		border-radius: var(--agg-radius);
	}

	.agg-calendar--front .agg-day__num {
		display: none;
	}

	.agg-calendar--front .agg-day__full {
		display: block;
		font-weight: 600;
	}

	.agg-calendar--front .agg-day--today .agg-day__full {
		color: var(--agg-accent);
	}

	.agg-calendar--front .agg-event a {
		padding: .5rem .625rem;
		font-size: .9375em;
		white-space: normal;
	}
}

/* Upcoming events list */
.agg-list__day {
	margin: 1.5rem 0 .5rem;
	padding-bottom: .375rem;
	border-bottom: 2px solid var(--agg-accent);
	font-size: 1.05em;
}

.agg-list__day:first-child {
	margin-top: 0;
}

.agg-list__events {
	margin: 0;
	padding: 0;
	list-style: none;
}

.agg-list__item {
	display: grid;
	gap: .125rem;
	margin: 0;
	padding: .625rem 0;
	border-bottom: 1px solid var(--agg-line);
}

.agg-list__title {
	font-weight: 600;
	text-decoration: none;
	color: inherit;
}

.agg-list__title:hover,
.agg-list__title:focus-visible {
	color: var(--agg-accent);
	text-decoration: underline;
}

.agg-list__when,
.agg-list__where {
	font-size: .875em;
	color: var(--agg-muted);
}

/* Single event page */
.agg-single {
	margin: 0 0 1.5rem;
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--agg-accent);
	border-radius: 0 var(--agg-radius) var(--agg-radius) 0;
	background: var(--agg-soft);
}

.agg-single__row {
	margin: 0 0 .375rem;
}

.agg-single__row:last-child {
	margin-bottom: 0;
}

.agg-single__label {
	display: inline-block;
	min-width: 5.5rem;
	font-weight: 600;
}