/*
 * Events Calendar block. Inherits the theme: text colour, fonts and link
 * styles come from the theme; lines and tints are mixed from currentColor so
 * the calendar fits light and dark themes without configuration.
 */
.ew-calendar {
	--ew-line: color-mix(in srgb, currentColor 16%, transparent);
	--ew-soft: color-mix(in srgb, currentColor 6%, transparent);
	--ew-tint: color-mix(in srgb, currentColor 12%, transparent);
	--ew-muted: color-mix(in srgb, currentColor 68%, transparent);
	--ew-bad: #d92d20;
	--ew-radius: 8px;
	container-type: inline-size;
}
.ew-calendar .ew-region { transition: opacity .15s ease; }
.ew-calendar.is-loading .ew-region { opacity: .55; }
.ew-calendar a { text-underline-offset: .15em; }

.ew-sr,
.ew-calendar .ew-day-long {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* Toolbar -------------------------------------------------------------- */
.ew-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-bottom: 1.25rem; }
.ew-nav { display: flex; align-items: center; gap: .375rem; }
.ew-nav-btn {
	display: inline-flex; align-items: center; justify-content: center;
	width: 2.25rem; height: 2.25rem; border: 1px solid var(--ew-line); border-radius: var(--ew-radius);
	color: inherit; text-decoration: none; font-size: 1.35em; line-height: 1;
}
.ew-nav-btn:hover { background: var(--ew-soft); }
.ew-nav-btn.is-disabled { opacity: .35; }
.ew-nav-today {
	display: inline-flex; align-items: center; height: 2.25rem; padding: 0 .85rem;
	border: 1px solid var(--ew-line); border-radius: var(--ew-radius);
	color: inherit; text-decoration: none; font-size: .875em; font-weight: 600;
}
.ew-nav-today:hover { background: var(--ew-soft); }
.ew-calendar .ew-title { margin: 0; font-size: 1.35em; line-height: 1.2; flex: 1 1 auto; }
.ew-calendar .ew-title:focus { outline: none; }
.ew-calendar .ew-title:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.ew-views ul { display: flex; margin: 0; padding: 3px; list-style: none; border: 1px solid var(--ew-line); border-radius: calc(var(--ew-radius) + 3px); }
.ew-views a { display: block; padding: .3rem .8rem; border-radius: var(--ew-radius); color: inherit; text-decoration: none; font-size: .875em; font-weight: 600; }
.ew-views a:hover { background: var(--ew-soft); }
.ew-views a[aria-current] { background: var(--ew-tint); }

/* Month ---------------------------------------------------------------- */
.ew-month { width: 100%; table-layout: fixed; border-collapse: collapse; margin: 0; }
.ew-month th {
	padding: .4rem .25rem; font-size: .75em; font-weight: 600; letter-spacing: .06em;
	text-transform: uppercase; text-align: start; color: var(--ew-muted); border: 0;
}
.ew-month abbr { text-decoration: none; }
.ew-month td { height: 7.25rem; padding: .35rem; vertical-align: top; border: 1px solid var(--ew-line); }
.ew-month td.is-outside { background: var(--ew-soft); }
.ew-month td.is-outside .ew-day-head { opacity: .5; }
.ew-day-head { margin-bottom: .25rem; font-size: .875em; line-height: 1.75rem; }
.ew-day-link { color: inherit; text-decoration: none; display: inline-block; }
.ew-day-num { display: inline-block; min-width: 1.75rem; height: 1.75rem; border-radius: 999px; text-align: center; font-weight: 600; }
.ew-day-link:hover .ew-day-num { background: var(--ew-tint); }
.ew-month .is-today .ew-day-num { background: currentColor; }
.ew-month .is-today .ew-day-num { color: var(--wp--preset--color--base, #fff); }
.ew-month .is-today .ew-day-link:hover .ew-day-num { background: currentColor; }
.ew-day-events { margin: 0; padding: 0; list-style: none; }
.ew-day-events li { margin: 0 0 3px; }
.ew-day-events .is-overflow { display: none; }
.ew-day-events a {
	display: block; padding: 2px 6px; border-radius: 4px; background: var(--ew-soft);
	color: inherit; text-decoration: none; font-size: .78em; line-height: 1.35;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ew-day-events a:hover { background: var(--ew-tint); }
.ew-day-events .is-all-day a,
.ew-day-events .is-multi-day a { background: var(--ew-tint); font-weight: 600; }
.ew-event-time { font-variant-numeric: tabular-nums; color: var(--ew-muted); }
.ew-day-events .is-past a { opacity: .6; }
.ew-more { display: inline-block; margin-top: 2px; font-size: .75em; font-weight: 600; color: inherit; }

/* List + day ----------------------------------------------------------- */
.ew-calendar .ew-group-label {
	margin: 1.75rem 0 .25rem; font-size: .8em; font-weight: 600;
	letter-spacing: .08em; text-transform: uppercase; color: var(--ew-muted);
}
.ew-calendar .ew-group:first-of-type .ew-group-label { margin-top: 0; }
.ew-list { margin: 0; padding: 0; list-style: none; }
.ew-item { margin: 0; }
.ew-item article { display: grid; grid-template-columns: 4.25rem 1fr auto; gap: 1rem; align-items: start; padding: 1rem 0; border-top: 1px solid var(--ew-line); }
.ew-badge {
	display: flex; flex-direction: column; align-items: center; padding: .35rem 0;
	border: 1px solid var(--ew-line); border-radius: calc(var(--ew-radius) + 2px); line-height: 1.15;
}
.ew-badge-dow,
.ew-badge-mon { font-size: .7em; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ew-muted); }
.ew-badge-day { font-size: 1.5em; font-weight: 700; }
.ew-item.is-featured .ew-badge { border-color: currentColor; box-shadow: inset 0 0 0 1px currentColor; }
.ew-calendar .ew-item-title { margin: 0 0 .2rem; font-size: 1.15em; line-height: 1.3; }
.ew-item-title a { color: inherit; text-decoration: none; }
.ew-item-title a:hover { text-decoration: underline; }
.ew-item-meta { margin: 0; font-size: .9em; color: var(--ew-muted); }
.ew-item-when { font-variant-numeric: tabular-nums; }
.ew-item-excerpt { margin: .4rem 0 0; font-size: .95em; }
.ew-item-image img { display: block; width: 9rem; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--ew-radius); }
.ew-item.is-past { opacity: .75; }

.ew-status {
	display: inline-block; margin-inline-start: .35em; padding: 0 .45em; border-radius: 4px;
	font-size: .72em; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; vertical-align: middle;
	color: var(--ew-bad); border: 1px solid currentColor;
}
.is-cancelled .ew-event-title,
.is-cancelled .ew-item-title a { text-decoration: line-through; }

.ew-empty { margin: 1rem 0; padding: 1.25rem; border: 1px dashed var(--ew-line); border-radius: var(--ew-radius); text-align: center; color: var(--ew-muted); }
.ew-pager { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--ew-line); font-weight: 600; }
.ew-pager a { color: inherit; }
.ew-past-link { margin: 1rem 0 0; font-size: .9em; }
.ew-past-link a { color: inherit; }

/* Narrow: the month becomes an agenda of days that have events. ---------- */
@container (max-width: 640px) {
	.ew-toolbar { gap: .6rem; }
	.ew-views { max-width: 100%; }
	.ew-views ul { flex-wrap: wrap; }
	.ew-calendar .ew-title { order: -1; flex-basis: 100%; }
	.ew-month,
	.ew-month tbody,
	.ew-month tr,
	.ew-month td { display: block; width: auto; }
	.ew-month thead { display: none; }
	.ew-month td { height: auto; padding: .75rem 0; border: 0; border-top: 1px solid var(--ew-line); }
	.ew-month td.is-empty,
	.ew-month td.is-outside { display: none; }
	.ew-month td.is-outside.has-events { display: block; background: none; }
	.ew-calendar .ew-month .ew-day-long {
		position: static !important; width: auto; height: auto; margin: 0; overflow: visible;
		clip: auto; white-space: normal; font-weight: 600;
	}
	.ew-month .ew-day-num { display: none; }
	.ew-month .is-today .ew-day-long::after { content: " •"; }
	.ew-day-events a { white-space: normal; font-size: 1em; padding: .35rem .5rem; }
	.ew-day-events .is-overflow { display: block; }
	.ew-month .ew-more { display: none; }
	.ew-item article { grid-template-columns: 3.5rem 1fr; gap: .85rem; }
	.ew-item-image { display: none; }
}

/* Filter bar ------------------------------------------------------------ */
.ew-filters { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: -.25rem 0 1.25rem; }
.ew-filter { flex: 0 1 auto; }
.ew-filter-search { flex: 1 1 14rem; }
.ew-filters input[type="search"],
.ew-filters select {
	box-sizing: border-box; width: 100%; height: 2.5rem; padding: 0 .75rem; margin: 0;
	border: 1px solid var(--ew-line); border-radius: var(--ew-radius);
	background: transparent; color: inherit; font: inherit; font-size: .9em;
}
.ew-filters select { max-width: 14rem; padding-right: 2rem; }
.ew-filters select option { color: initial; }
.ew-filters input:focus-visible,
.ew-filters select:focus-visible,
.ew-filter-submit:focus-visible { outline: 2px solid currentColor; outline-offset: 1px; }
.ew-filter-submit {
	height: 2.5rem; padding: 0 1rem; border: 1px solid currentColor; border-radius: var(--ew-radius);
	background: transparent; color: inherit; font: inherit; font-size: .9em; font-weight: 600; cursor: pointer;
}
.ew-filter-submit:hover { background: var(--ew-soft); }
.ew-filter-clear { font-size: .875em; color: inherit; }

/* Week ------------------------------------------------------------------- */
.ew-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; border: 1px solid var(--ew-line); border-radius: var(--ew-radius); overflow: hidden; }
.ew-week-day { min-height: 12rem; padding: .5rem .4rem; border-inline-start: 1px solid var(--ew-line); }
.ew-week-day:first-child { border-inline-start: 0; }
.ew-week-day.is-past { background: var(--ew-soft); }
.ew-calendar .ew-week-head { display: flex; align-items: baseline; gap: .35rem; margin: 0 0 .5rem; font-size: .85em; font-weight: 600; }
.ew-week-dow { text-transform: uppercase; letter-spacing: .06em; color: var(--ew-muted); font-size: .9em; }
.ew-week-num { font-size: 1.35em; }
.ew-week-day.is-today .ew-week-num { display: inline-block; min-width: 1.9rem; padding: 0 .3rem; border-radius: 999px; text-align: center; background: currentColor; }
.ew-week-day.is-today .ew-week-num { color: var(--wp--preset--color--base, #fff); }
.ew-week .ew-day-events a { white-space: normal; }

/* Photo ------------------------------------------------------------------ */
.ew-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1.5rem; margin: 0; padding: 0; list-style: none; }
.ew-photo article { display: flex; flex-direction: column; height: 100%; }
.ew-photo-media { display: block; text-decoration: none; color: inherit; aspect-ratio: 4 / 3; border-radius: var(--ew-radius); overflow: hidden; background: var(--ew-soft); }
.ew-photo-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.ew-photo:hover .ew-photo-media img { transform: scale(1.03); }
.ew-photo-date { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; line-height: 1; }
.ew-photo-date span { font-size: .9em; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ew-muted); }
.ew-photo-date strong { font-size: 3.25em; }
.ew-photo-body { padding-top: .75rem; }
.ew-photo-when { margin: 0 0 .25rem; font-size: .85em; color: var(--ew-muted); }
.ew-calendar .ew-photo-title { margin: 0; font-size: 1.1em; line-height: 1.3; }
.ew-photo-title a { color: inherit; text-decoration: none; }
.ew-photo-title a:hover { text-decoration: underline; }
.ew-photo-place { margin: .25rem 0 0; font-size: .9em; color: var(--ew-muted); }
.ew-photo.is-featured .ew-photo-media { box-shadow: 0 0 0 2px currentColor; }

@container (max-width: 640px) {
	.ew-filters select { max-width: none; }
	.ew-filter { flex: 1 1 100%; }
	.ew-week { display: block; border: 0; border-radius: 0; }
	.ew-week-day { min-height: 0; padding: .75rem 0; border: 0; border-top: 1px solid var(--ew-line); }
	.ew-week-day.is-empty { display: none; }
	.ew-week-day.is-past { background: none; }
	.ew-week .ew-day-events a { font-size: 1em; padding: .35rem .5rem; }
}