/*! ICS Calendar Pro front end styles https://icscalendar.com */


/* Variables */

.ics-calendar, .r34ics_lightbox {
	--r34ics--image--max-width: 360px;
	--r34ics--widget--max-width: 360px;
}

/* FullCalendar.io variable overrides */
.ics-calendar .fc {
	/* ICS Calendar Pro-specific FC variables */
	--r34ics--fc--font--size: 13px;
	--r34ics--fc--fc-timegrid-slot--height-ratio: 0.6;
	--r34ics--fc--fc-timegrid-slot--hour-weight: bold;

	/* FullCalendar.io core variables */
	--fc-bg-event-color: var(--r34ics--color--gray);
	--fc-bg-event-opacity: 0.3;
	--fc-border-color: var(--r34ics--element--month--th-td--border-color);
	--fc-button-active-bg-color: var(--r34ics--color--dimgray);
	--fc-button-active-border-color: var(--r34ics--color--dimgray);
	--fc-button-bg-color: var(--r34ics--element--button--background);
	--fc-button-border-color: var(--r34ics--element--button--border-color);
	--fc-button-hover-bg-color: var(--r34ics--element--button--background-hover);
	--fc-button-hover-border-color: var(--r34ics--element--button--border-color-hover);
	--fc-button-text-color: var(--r34ics--element--button--color);
	--fc-event-bg-color: var(--r34ics--element--events--accent--background);
	--fc-event-border-color: var(--r34ics--element--events--accent--border-color);
	--fc-event-resizer-dot-border-width: 1px;
	--fc-event-resizer-dot-total-width: 8px;
	--fc-event-resizer-thickness: 8px;
	--fc-event-selected-overlay-color: var(--r34ics--color--trans30);
	--fc-event-text-color: var(--r34ics--element--events--accent--color);
	--fc-highlight-color: rgba(188,232,241,.3);
	--fc-list-event-hover-bg-color: var(--r34ics--color--trans30); /* Directly adjustable on Appearance page */
	--fc-more-link-bg-color: var(--r34ics--element--events--accent--background);
	--fc-more-link-text-color: var(--r34ics--element--events--accent--color);
	--fc-neutral-bg-color: var(--r34ics--element--month--off--background);
	--fc-neutral-text-color: var(--r34ics--element--month--off--color);
	--fc-non-business-color: var(--r34ics--element--month--off--background);
	--fc-now-indicator-color: var(--r34ics--color--ics-red); /* Directly adjustable on Appearance page */
	--fc-page-bg-color: var(--r34ics--element--month--background);
	--fc-small-font-size: var(--r34ics--fc--font--size);
	--fc-today-bg-color: var(--r34ics--element--month--background);
}


/* General elements */

.ics-calendar .desclog_toggle { }
.ics-calendar .descloc_toggle_excerpt { display: block; }
.ics-calendar .descloc_toggle_full { display: none; }

.ics-calendar .hidden { display: none !important; }

.ics-calendar .icon-list, .ics-calendar .icon-month {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	display: inline-block;
	height: 20px;
	margin: -5px 5px auto 5px;
	vertical-align: middle;
	width: 20px;
}

.ics-calendar .icon-list {
	/* Don't convert to UTF-8; these only display when they're base 64 encoded */
	background-image: url('data:image/svg+xml;base64,PHN2ZyBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEuNSIgdmlld0JveD0iMCAwIDE3NiAxNzYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjYTlhOWE5IiBzdHJva2Utd2lkdGg9IjE2LjY3Ij48cGF0aCBkPSJtMCA4aDE3NiIvPjxwYXRoIGQ9Im0zNi4wMSA0OGgxMzgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIpIi8+PHBhdGggZD0ibTM2LjAxIDg4aDEzOCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMikiLz48cGF0aCBkPSJtMCAxMjhoMTc2Ii8+PHBhdGggZD0ibTM2LjAxIDE2OGgxMzgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIpIi8+PC9nPjwvc3ZnPg==');
}

.ics-calendar .icon-month {
	/* Don't convert to UTF-8; these only display when they're base 64 encoded */
	background-image: url('data:image/svg+xml;base64,PHN2ZyBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEuNSIgdmlld0JveD0iMCAwIDE3NiAxNzYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjYTlhOWE5Ij48cGF0aCBkPSJtMCA4OGgxNzZtLTE3NiA0MGgxNzZtLTYyLTcydjEyMG0tNTMtMTIwdjEyMCIgZmlsbD0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxNi42NyIvPjxnIGZpbGw9IiNhOWE5YTkiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIyIj48cGF0aCBkPSJtMTc2IDIuOTY5aC0xNzMuNTE5djE3My4wMzFoMTczLjUxOXptLTE2LjQzMiAxNi4zODZ2MTQwLjI1OWMwIC4wMDEtMTQwLjY1NS4wMDEtMTQwLjY1NS4wMDF2LTE0MC4yNnoiIHN0cm9rZS13aWR0aD0iLjk4IiB0cmFuc2Zvcm09Im1hdHJpeCgxLjAxNDMgMCAwIDEuMDE3MTYgLTIuNTE2OTEgLTMuMDIwMTcpIi8+PHBhdGggZD0ibTAgMGgxNzZ2NDcuOTI5aC0xNzZ6IiBzdHJva2Utd2lkdGg9Ii45MiIgdHJhbnNmb3JtPSJzY2FsZSgxIDEuMTY4NCkiLz48L2c+PC9nPjwvc3ZnPg==');
}

.ics-calendar .subscribe.button {
	background: var(--r34ics--element--button--background);
	border-radius: 4px;
	color: var(--r34ics--element--button--color);
	display: inline-block;
	margin: 0.5em 0 0.25em 0;
	padding: 0.2em 0.5em;
	text-decoration: none;
}
.ics-calendar .subscribe.button:is(:hover, :focus) {
	background: var(--r34ics--element--button--background-hover);
	color: var(--r34ics--element--button--color-hover);
	text-decoration: none;
}

	.ics-calendar .subscribe.button svg {
		display: inline-block;
		height: 1.2em;
		vertical-align: middle;
		width: 1.2em;
	}

.ics-calendar textarea.subscribe {
	display: inline-block;
	font-size: 90%;
	height: 3rem;
	margin: 0.25em 0 0.5em 0;
	min-width: 200px;
	vertical-align: middle;
	width: 50%;
}

.ics-calendar .subscribe-link-copied {
	color: var(--r34ics--element--events--color);
	display: inline-block;
	font-size: 150%;
	margin: 0 0.25em;
	vertical-align: middle;
}

.ics-calendar .ics-calendar-sidebar { }

	.ics-calendar .ics-calendar-sidebar .ics-calendar-current-events ul, .ics-calendar .ics-calendar-widget .ics-calendar-current-events ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
	.ics-calendar .ics-calendar-sidebar .ics-calendar-current-events li, .ics-calendar .ics-calendar-widget .ics-calendar-current-events li {
		display: block;
		margin: 0 0 0.5em 0;
	}
	
	/* @todo Add a way to use the site's configured background color instead of white */
	.ics-calendar.multi-feed :is(.ics-calendar-sidebar, .ics-calendar-widget) .ics-calendar-current-events li
	{ padding: 0.5em; }
	.ics-calendar.multi-feed :is(.ics-calendar-sidebar, .ics-calendar-widget) .ics-calendar-current-events li[data-feed-color*="255,255,255"]
	{ padding: 0; }
	
	.ics-calendar :is(.ics-calendar-sidebar, .ics-calendar-widget) .ics-calendar-current-events li > span
	{ display: block; }
	
	.ics-calendar :is(.ics-calendar-sidebar, .ics-calendar-widget) .ics-calendar-current-events li :is(.time, .all-day-indicator)
	{
		font-size: 85%;
		font-weight: bold;
	}
	
	.ics-calendar :is(.ics-calendar-sidebar, .ics-calendar-widget) .ics-calendar-current-events li .time span {
		display: inline;
		font-size: 90%;
		font-weight: normal;
	}
	
	.ics-calendar :is(.ics-calendar-sidebar, .ics-calendar-widget) .ics-calendar-current-events li .title.has_desc
	{ cursor: initial; }

	.ics-calendar.r34ics_toggle :is(.ics-calendar-sidebar, .ics-calendar-widget) .ics-calendar-current-events li .title.has_desc
	{ cursor: pointer; }
		
	.ics-calendar :is(.ics-calendar-sidebar, .ics-calendar-widget) .ics-calendar-current-events li .descloc
	{ font-size: 75%; }

.ics-calendar-event-image { overflow: hidden !important; }

	.ics-calendar-event-image img {
		display: block !important;
		height: auto !important;
		margin: 0.2rem 0 !important;
		max-width: var(--r34ics--image--max-width) !important;
		overflow: clip;
		width: 100% !important;
	}
	
	.ics-calendar-event-image.r34icspro-illus img {
		aspect-ratio: 8 / 5;
		object-fit: cover;
		object-position: right;
	}

.ics-calendar-tz-label {
	font-size: 11px;
}


/* Search filter */

.ics-calendar .hidden_in_main { display: none !important; }


/* View-specific classes */


/* Basic view */

.ics-calendar.layout-basic.basic_style_flexbox .r34ics-basic-events li {
	border-bottom: 1px solid var(--r34ics--color--trans20);
	display: flex;
	gap: 1.5rem;
	justify-content: flex-end;
	margin: 0;
	padding: 0.75rem 0;
	width: 100%;
}

.ics-calendar.layout-basic.basic_style_flexbox .r34ics-basic-events li .ics-calendar-date {
	flex: 1;
	font-weight: bold;
}

.ics-calendar.layout-basic.basic_style_flexbox .r34ics-basic-events li .ics-calendar-date:not(.multiday),
.ics-calendar.layout-basic.basic_style_flexbox .r34ics-basic-events li .ics-calendar-date :is(.multiday-start, .multiday-end) {
	white-space: nowrap;
}

.ics-calendar.layout-basic.basic_style_flexbox .r34ics-basic-events li .event-info {
	column-gap: 1.5rem;
	display: grid;
	flex: 3;
	grid-template-columns: 2;
	grid-template-rows: 2;
	row-gap: 0;
}

.ics-calendar.layout-basic.basic_style_flexbox .r34ics-basic-events li .event-info .time {
	text-align: right;
	grid-column-start: 2;
	grid-column-end: 2;
	grid-row-start: 1;
	grid-row-end: 2;
}

.ics-calendar.layout-basic.basic_style_flexbox .r34ics-basic-events li .event-info .title {
	font-weight: bold;
	grid-column-start: 1;
	grid-column-end: 1;
	grid-row-start: 1;
	grid-row-end: 1;
}

.ics-calendar.layout-basic.basic_style_flexbox .r34ics-basic-events li .event-info .descloc {
	grid-column-start: 1;
	grid-column-end: 1;
	grid-row-start: 2;
	grid-row-end: 2;
}

/* Full view */

.ics-calendar .fc * { flex-wrap: wrap; }

.ics-calendar .fc :is(table, td) {
	background: var(--fc-page-bg-color);
	color: var(--r34ics--element--month--day--color);
}

.ics-calendar .fc th {
	background: var(--r34ics--element--month--th--background);
	color: var(--r34ics--element--month--th--color);
	line-height: 2;
}

.ics-calendar .fc td.fc-day-other {
	background: var(--r34ics--element--month--off--background);
	color: var(--r34ics--element--month--off--color);
}

.ics-calendar .fc table:not(.fc-list-table) :is(th, td) {
	margin: 0 !important;
	padding: 0 !important;
}

.ics-calendar .fc td * {
	font-size: var(--r34ics--fc--font--size);
	word-break: break-word;
	hyphens: auto;
}

.ics-calendar .fc .fc-button {
	border-radius: 1.5rem;
	color: var(--fc-button-text-color) !important;
	font-size: calc(var(--r34ics--fc--font--size) * 1.5);
	padding: 0.167em 1em
}

.ics-calendar .fc .fc-button.fc-button-primary {
	background-color: var(--fc-button-bg-color) !important;
	border: none !important;
}

.ics-calendar .fc .fc-button:is(:focus, :hover) {
	background-color: var(--fc-button-hover-bg-color) !important;
	border: none !important;
}

.ics-calendar .fc .fc-button:is(.fc-button-active, .fc-button-primary:not(:disabled).fc-button-active, .fc-button-primary:not(:disabled):active) {
	background-color: var(--fc-button-active-bg-color) !important;
	border: none !important;
	color: var(--r34ics--element--events--accent--color) !important;
}

.ics-calendar .fc .fc-toolbar-ltr .fc-button-group > .fc-button:not(:last-child) {
	border-bottom-right-radius: 0;
	border-top-right-radius: 0;
	padding-right: 0.667em;
}

.ics-calendar .fc .fc-toolbar-ltr .fc-button-group > .fc-button:not(:first-child) {
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	padding-left: 0.667em;
}

.ics-calendar .fc .fc-col-header-cell {
	padding: 0.5em 0.8em 0.2em 0.8em !important;
	text-align: center;
	text-transform: uppercase;
}

.ics-calendar .fc :is(.fc-col-header-cell, .fc-multimonth-multicol) a:not(.fc-daygrid-more-link),
.ics-calendar .fc :is(.fc-list-day-cushion, .fc-list-event-title) > a {
	color: inherit !important;
	text-decoration: none;
}

.ics-calendar .fc .fc-daygrid-block-event { padding: 1px 2px; }

.ics-calendar .fc a.fc-daygrid-day-number {
	color: var(--r34ics--element--month--day--color) !important;
	text-decoration: none;
}

.ics-calendar .fc .fc-scrollgrid-sync-table .fc-daygrid-day-top {
	background: var(--r34ics--element--month--day--background);
	font-weight: bold;
}

.ics-calendar .fc .fc-day-today .fc-daygrid-day-top,
.ics-calendar .fc .fc-scrollgrid-section-header .fc-day-today,
.ics-calendar .fc .fc-list-day.fc-day-today .fc-list-day-cushion {
	background: var(--r34ics--element--month--today-day--background);
}

.ics-calendar .fc .fc-day-today .fc-daygrid-day-top a,
.ics-calendar .fc .fc-scrollgrid-section-header .fc-day-today a,
.ics-calendar .fc .fc-list-day.fc-day-today .fc-list-day-cushion a {
	color: var(--r34ics--element--month--today-day--color) !important;
}

.ics-calendar .fc .fc-daygrid-more-link {
	background-color: var(--fc-more-link-bg-color);
	border: 1px solid var(--fc-page-bg-color);
	border-radius: 2em;
	color: var(--fc-more-link-text-color) !important;
	display: block;
	float: none;
	font-size: 11px !important;
	font-weight: bold;
	height: calc(2em + 2px);
	line-height: 2em;
	margin: -4px auto 0 auto;
	text-align: center;
	text-decoration: none;
	width: calc(2em + 2px);
}

.ics-calendar .fc .descloc {
	background: var(--r34ics--element--hover-block--background);
	border: var(--r34ics--element--hover-block--border);
	box-shadow: 2px 2px 5px var(--r34ics--color--trans20);
	display: block;
	font-size: var(--r34ics--fc--font--size);
	max-height: 60vh !important;
	overflow-x: clip;
	overflow-y: auto;
	padding: 0.4em 0.6em;
	position: absolute; top: 1em !important; bottom: auto !important; right: auto !important; left: 3em !important;
	white-space: normal;
	width: clamp(10rem,20vw,20rem);
	z-index: 9;
}

/* Workaround for a layering bug that only seems to affect Safari */
.ics-calendar .fc .fc-event.fc-daygrid-block-event:has(.descloc) .fc-event-main { z-index: -1 !important; }

.ics-calendar .fc tr:nth-of-type(n+5) td .descloc { top: auto !important; bottom: 1em !important; }
.ics-calendar .fc td:nth-of-type(n+5) .descloc { right: 3em !important; left: auto !important; }
@media screen and (max-width: 782px) { .ics-calendar .fc .descloc { width: 33vw; } }

.ics-calendar .fc .descloc .eventdesc { margin-top: 0.5rem; }

/* Fix issue of events on weekend days not being hoverable/clickable */
.ics-calendar .fc .fc-daygrid-day-bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; }

.ics-calendar .fc .fc-daygrid-day-bottom { font-size: var(--r34ics--fc--font--size); }

.ics-calendar .fc .fc-dayGridMonth-view .fc-daygrid-day-frame {
	min-height: 9em;
	padding: 0;
}

.ics-calendar .fc .fc-daygrid-dot-event:not([href]):is(:focus, :focus-within, :hover),
.ics-calendar .fc .fc-list-table a:not([href]):is(:focus, :focus-within, :hover)
{ /*background: inherit;*/ }

.ics-calendar .fc .fc-daygrid-event:is(:focus, :focus-within, :hover)
{ z-index: 9; }

.ics-calendar .fc .fc-daygrid-event-dot, .ics-calendar .fc .fc-list-event-dot {
	border-color: var(--fc-event-border-color);
	/* @todo Figure out what changed in the 6.0 CSS that requires adding this! */
	border-width: 6px !important;
	border-radius: 6px !important;
	border-style: solid !important;
	box-sizing: border-box !important;
	margin-left: 0 !important;
	height: 12px !important;
	width: 12px !important;
}

.ics-calendar .fc .fc-event,
.ics-calendar .fc .fc-event:is(:visited, :focus, :focus-within, :hover),
.ics-calendar .fc .fc-event td,
.ics-calendar .fc .fc-daygrid-event,
.ics-calendar .fc :is(.fc-list-day-cushion, .fc-list-event-title) > a {
	font-size: var(--r34ics--fc--font--size);
	font-weight: normal;
	height: 100%; /* Fills container in timegrid-style views */
	line-height: 1.3;
	padding: 0.4em 0.8em !important;
	white-space: normal;
}

/**
 * Make sure events in time grids are tall enough to show time and first line of text,
 * even if it distorts the time range!
 * @todo Make this an optional setting?
 */
.ics-calendar .fc .fc-timegrid-event {
	min-height: 4em;
}

/* Note: Combining these with :is() doesn't work! */
.ics-calendar .fc .fc-event::before, .ics-calendar .fc .fc-event::after {
	display: none !important; /* @todo Workaround for weird alignment issue on focus in list table; why do these even exist? */
}

.ics-calendar .fc :is(.fc-event td, .fc-daygrid-event) {
	position: relative;
}

.ics-calendar .fc .fc-event td.fc-list-event-time { white-space: nowrap; }

.ics-calendar .fc .fc-event:not([href]),
.ics-calendar .fc .fc-event:not([href]):is(:focus, :focus-within, :hover),
.ics-calendar .fc .fc-event a:not([href]),
.ics-calendar .fc .fc-event a:not([href]):is(:focus, :focus-within, :hover),
.ics-calendar .fc .fc-multimonth-multicol a.fc-more-link
{ text-decoration: none !important; }

.ics-calendar .fc :is(.fc-h-event, .fc-v-event)
{
	background-color: var(--r34ics--element--events--accent--background);
	border-color: var(--r34ics--element--events--accent--border-color);
}

.ics-calendar .fc .fc-v-event .fc-event-main-frame {
	display: block;
	overflow: clip;
}

/* @todo This is an 11th hour kludge for 6.0.0 -- improve it! */
.ics-calendar .fc a.fc-daygrid-dot-event {
	color: var(--r34ics--element--events--color) !important;
}

.ics-calendar .fc .fc-event-title {
	color: inherit !important;
	font-weight: bold;
	text-decoration: none;
}

.ics-calendar .fc .fc-header-toolbar > *:first-child { flex-grow: 1; }

.ics-calendar .fc .fc-icon-x::before { content: '\00d7'; }

.ics-calendar .fc .fc-list-day-cushion {
	background-color: var(--r34ics--element--month--day--background);
	padding-left: 0;
}

.ics-calendar .fc .fc-list-day-cushion a {
	font-weight: bold;
	text-decoration: none;
}

.ics-calendar .fc .fc-list-table .fc-event td {
	padding: 0.8em !important;
}

.ics-calendar .fc .fc-more-popover .fc-daygrid-event { position: static; }

.ics-calendar .fc .fc-multimonth-multicol {
	overflow-x: clip;
	overflow-y: auto;
}

.ics-calendar .fc .fc-multimonth-multicol .fc-daygrid-day-bottom {
	margin-top: -3px !important;
	text-align: center;
}

.ics-calendar .fc .fc-non-business { background-color: var(--fc-neutral-bg-color); }

.ics-calendar .fc .fc-popover-close:hover, .ics-calendar .fc .fc-popover-close:focus { opacity: 1; }

.ics-calendar .fc .fc-scroller-harness { overflow: visible }

.ics-calendar .fc .fc-timegrid-col-frame:is(:focus, :focus-within, :hover),
.ics-calendar .fc .fc-timegrid-event-harness:is(:focus, :focus-within, :hover)
{ z-index: 9 !important; }

.ics-calendar .fc .fc-timegrid-slot {
	height: calc(var(--r34ics--fc--fc-timegrid-slot--height-ratio) * 2.5em);
}

.ics-calendar .fc .fc-timegrid-slot-label[data-time*=':00:00'] {
	font-weight: var(--r34ics--fc--fc-timegrid-slot--hour-weight);
}

.ics-calendar .fc .fc-toolbar { gap: 12px; }

/* Fixes issue with some FullCalendar translations that do not capitalize the month name */
.ics-calendar .fc .fc-toolbar-title { text-transform: capitalize; }

/* Fixes issue with calendar view having zero width in certain themes */
.ics-calendar .fc .fc-view-harness { width: 100% }

.ics-calendar .fc .fc-view-harness * { font-size: var(--r34ics--fc--font--size); }

/* Fixes issue of hover boxes appearing behind the day name header row...
   ...but why, you ask? https://stackoverflow.com/a/11742116 */
.ics-calendar .fc thead { opacity: 0.9999; }

.ics-calendar .fc :is(.title_in_hover_block, .title_in_hover_block *)
{ font-size: calc(var(--r34ics--fc--font--size) * 1.2) !important; }


/* List view */

.ics-calendar-list-wrapper .hidden_in_list { display: none !important; }


/* Masonry view */

.ics-calendar.layout-masonry {
	--r34ics--masonry--width: 25%;
}
@media screen and (max-width: 1024px) {
	.ics-calendar.layout-masonry {
		--r34ics--masonry--width: 33.333%;
	}
}
@media screen and (max-width: 768px) {
	.ics-calendar.layout-masonry {
		--r34ics--masonry--width: 50%;
	}
}
@media screen and (max-width: 480px) {
	.ics-calendar.layout-masonry {
		--r34ics--masonry--width: 100%;
	}
}

.ics-calendar-masonry-grid {}

.ics-calendar-masonry-grid-sizer { width: var(--r34ics--masonry--width); }

.ics-calendar-masonry-grid-item {
	border: 1px solid var(--r34ics--color--gainsboro);
	border-radius: 4px;
	margin: 0 1rem 1rem 0;
	padding: 0.75rem 1rem !important; /* !important overrides feed color CSS */
	width: calc(var(--r34ics--masonry--width) - 1rem);
}

	.ics-calendar-masonry-grid-item .ics-calendar-date {
		color: inherit !important;
		font-size: 120%;
		font-weight: 600;
		line-height: 1.3;
		margin: 0;
	}
	
	.ics-calendar.masonry_grouping_date .ics-calendar-masonry-grid-item .ics-calendar-date {
		margin-bottom: 0.5em;
	}
	
	.ics-calendar-masonry-grid-item .time {
		font-size: 80%;
		line-height: 1.3;
		margin: 0;
	}
	
	.ics-calendar-masonry-grid-item .title {
		border-top: 1px solid var(--r34ics--color--gainsboro);
		display: block;
		font-weight: 600;
		line-height: 1.3;
		margin-top: 0.333rem;
		padding-top: 0.333rem;
	}

.ics-calendar.solidcolors :is(.ics-calendar-masonry-grid-item, .ics-calendar-masonry-grid-item *)
{
	background-color: var(--r34ics--element--events--accent--background);
	color: var(--r34ics--element--events--accent--color);
}


/* Month view/general */

.ics-calendar-controls-wrapper {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	margin: 1rem 0;
	justify-content: space-between;
}

	.ics-calendar-filter {
		align-items: center;
		display: flex;
		flex-wrap: wrap;
		margin: 0;
		padding: 0;
	}

		.ics-calendar-filter label {
			margin: 0;
		}
	
		.ics-calendar-filter input[type=text] {
			display: inline-block;
			max-width: 240px;
			vertical-align: baseline;
			width: auto;
		}
	
		.ics-calendar-filter input[type=reset] {
			background-color: var(--r34ics--element--button--background) !important;
			border: 1px solid var(--r34ics--element--button--border-color) !important;
			border-radius: 3px !important;
			color: var(--r34ics--element--button--color) !important;
			display: inline-block !important;
			margin: 0 0.5em !important;
			padding: 0.2em 0.5em !important;
			vertical-align: baseline !important;
		}
	
		.ics-calendar-filter input[type=reset]:is(:hover, :focus) {
			background: var(--r34ics--element--button--background-hover) !important;
			border-color: var(--r34ics--element--button--border-color-hover) !important;
			color: var(--r34ics--element--button--color-hover) !important;
		}
		
	.ics-calendar-month-table-list-toggle {
		margin: 0;
		padding: 0;
	}

	.ics-calendar-month-table-list-toggle > * {
		display: inline-block;
		margin-right: 0.5em;
	}

	.ics-calendar-month-table-list-toggle label {
		background: var(--r34ics--color--whitesmoke);
		border: 1px solid var(--r34ics--color--gainsboro);
		cursor: pointer;
		margin: 0;
		padding: 3px 5px;
	}
	.ics-calendar-month-table-list-toggle label:not(:first-of-type) {
		border-left: none;
	}
	.ics-calendar-month-table-list-toggle label:first-of-type {
		border-top-left-radius: 3px;
		border-bottom-left-radius: 3px;
	}
	.ics-calendar-month-table-list-toggle label:last-of-type {
		border-top-right-radius: 3px;
		border-bottom-right-radius: 3px;
	}
	.ics-calendar-month-table-list-toggle label.current {
		background: transparent;
	}
	.ics-calendar-month-table-list-toggle label:not(.current) > * {
		opacity: 0.4;
	}
	
		.ics-calendar-month-table-list-toggle label input[type=radio] { display: none; }

.ics-calendar[data-month-table-list-toggle=list] { }

	.ics-calendar[data-month-table-list-toggle=list] .hidden_in_list { display: none !important; }
	
	.ics-calendar.monthnav-compact[data-month-table-list-toggle=list] .ics-calendar-month-wrapper {
		 margin-top: 0;
	}


	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid { margin-bottom: 1.5em; }

	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid,
	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid :is(tbody, tr, th, td)
	{
		border: none;
		display: block;
		font-size: 100%;
		width: 100%;
	}
	
	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid tr:is(.previous-week, .next-week)
	{
		display: none;
	}
	
	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid :is(thead, .off),
	.ics-calendar[data-month-table-list-toggle=list]:not(.show-past-events) .ics-calendar-month-grid .past,
	.ics-calendar[data-month-table-list-toggle=list].layout-month.month_list_all:not(.show-past-events) .past,
	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid .empty
	{ display: none; }
	.ics-calendar[data-month-table-list-toggle=list]:not(.show-past-events):not(.month_list_all) .ics-calendar-month-wrapper.past .past.has_events
	{ display: block; }
	
	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid .day {
		padding: 0.5em 0.8em;
		text-align: left;
	}

	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid .day *.phone_only { display: inline-block !important; }
	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid .day *.no_phone { display: none; }
	
	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid td { height: auto; }
	
	.ics-calendar[data-month-table-list-toggle=list] .ics-calendar-month-grid .events .time .show_on_hover { visibility: visible; }
	
	.ics-calendar[data-month-table-list-toggle=list] .phone_only:not(.hidden) { display: inherit !important; }
	
	.ics-calendar[data-month-table-list-toggle=list] .event { position: relative; }
	
		.ics-calendar[data-month-table-list-toggle=list] .event .hover_block {
			background: transparent;
			border: none;
			box-shadow: none;
			padding: 0;
			position: relative; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important;
		}
	
			.ics-calendar[data-month-table-list-toggle=list] .event .hover_block :is(.title_in_hover_block, .time_in_hover_block) { display: none; }
	
	/* Month list all */
	.ics-calendar[data-month-table-list-toggle=list].month_list_all :is(.ics-calendar-select, .ics-calendar-arrow-nav)
	{ display: none !important; }
	
	.ics-calendar[data-month-table-list-toggle=list].month_list_all .ics-calendar-month-wrapper:not(.past),
	.ics-calendar[data-month-table-list-toggle=list].month_list_all.show-past-events .ics-calendar-month-wrapper.past
	{ display: block !important; }


/* Views with sidebar */

.ics-calendar-main-with-sidebar {
	clear: both;
	display: flex;
	justify-content: space-between;
	/* Don't put an overflow here or position: sticky won't work! */
	position: relative;
	width: 100%;
}

	.ics-calendar-main {
		display: block;
		flex-direction: column;
		overflow: clip;
		width: 75%;
	}

		.ics-calendar-main-with-sidebar .ics-calendar-main .event_count {
			display: block;
			height: 3em;
			padding: 0.5em;
			text-align: center;
		}
		@media screen and (min-width: 783px) {
			.ics-calendar-main-with-sidebar .ics-calendar-main .event_count.phone_only { display: none; }
		}
		
			.ics-calendar-main-with-sidebar .ics-calendar-main .event_count .badge {
				background: var(--r34ics--element--events--accent--background);
				border-radius: 1.5rem;
				color: var(--r34ics--element--events--accent--color);
				display: inline-block;
				font-weight: bold;
				height: 2em;
				line-height: 2em;
				padding: 0;
				text-align: center;
				width: 2em;
			}
	
		.ics-calendar-main-with-sidebar .ics-calendar-main .sidebar_only { display: none !important; }
		
		.ics-calendar-main-with-sidebar .ics-calendar-main .hidden_in_main { display: none !important; }
		
		.ics-calendar-main-with-sidebar .ics-calendar-main .more_events {
			font-style: italic;
			font-size: 90%;
			line-height: 1.5em;
			padding: 0.4em 0.8em;
			text-align: right;
		}

	.ics-calendar-sidebar {
		align-self: flex-start;
		display: block;
		flex-direction: column;
		height: auto;
		overflow: clip;
		padding: 0 0 0 1.5rem;
		position: sticky; top: 0;
		width: 25%;
	}


/* Month with sidebar view */

.ics-calendar-month-with-sidebar { }

	.ics-calendar-month-with-sidebar .ics-calendar-month-grid td[data-formatted-date] { /*cursor: help;*/ }
	
	.ics-calendar-month-with-sidebar .ics-calendar-month-grid .day { cursor: pointer; }

	.ics-calendar-month-grid .current .day {
		background: var(--r34ics--element--events--accent--background);
		color: var(--r34ics--element--events--accent--color);
	}
	
	/* This is for the end times, which should only display in the sidebar, mainly to prevent a blank line at many window widths */
	.ics-calendar-month-with-sidebar .ics-calendar-month-grid .event .time .show_on_hover {
		display: none !important;
	}


/* Widget view */

.ics-calendar.layout-widget, .ics-calendar-widget { max-width: var(--r34ics--widget--max-width); }

	.ics-calendar-widget .ics-calendar-label {
		font-size: 22px;
		line-height: 28px;
		padding: 0 calc(28 + 0.5em);
		position: relative;
		text-align: center;
	}
	
	.ics-calendar-widget .ics-calendar-label * {
		-moz-user-select: none; -webkit-user-select: none; user-select: none;
	}

	.ics-calendar-widget .ics-calendar-pagination {
		background: var(--r34ics--element--button--background);
		border: 1px solid var(--r34ics--element--button--border);
		border-radius: 4px;
		color: var(--r34ics--element--button--color) !important;
		cursor: pointer;
		display: block;
		font-size: 14px;
		height: 28px;
		line-height: 28px;
		position: absolute; top: 0;
		text-align: center;
		vertical-align: middle;
		width: 28px;
	}
	.ics-calendar-widget .ics-calendar-pagination:is(:hover, :focus) {
		background: var(--r34ics--element--button--background-hover);
		border-color: var(--r34ics--element--button--border-color-hover);
		color: var(--r34ics--element--button--color-hover);
	}
	
	.ics-calendar-widget .ics-calendar-pagination[disabled] {
		background: transparent;
		cursor: not-allowed;
		opacity: 0.25;
	}

	.ics-calendar-widget .ics-calendar-pagination.prev { left: 0; }

	.ics-calendar-widget .ics-calendar-pagination.next { right: 0; }
	
	.ics-calendar-widget .ics-calendar-day-details { margin: 1.5em 0; }
	
	.ics-calendar-widget-grid, .ics-calendar-year-availability-grid {
		background: transparent;
		border: none;
		border-collapse: collapse;
		font-size: 12px;
		margin: 0.5em 0;
		width: 100%;
	}
	
	:is(.ics-calendar-widget-grid, .ics-calendar-year-availability-grid) *
	{
		font-size: 12px;
		-moz-user-select: none; -webkit-user-select: none; user-select: none;
	}
	
	:is(.ics-calendar-widget-grid, .ics-calendar-year-availability-grid) :is(th, td) {
		padding: 2px 0 !important;
		text-align: center;
	}

	:is(.ics-calendar-widget-grid, .ics-calendar-year-availability-grid) td.past {
		opacity: 0.5;
	}
	
	:is(.ics-calendar-widget-grid, .ics-calendar-year-availability-grid) .day {
		display: inline-block;
		height: 2.333em;
		line-height: 2.333em;
		padding: 0;
		text-align: center;
		width: 2.333em;
	}

	.ics-calendar-widget-grid td .day {
		border: 2px solid transparent;
		border-radius: 1.5rem;
		cursor: pointer;
		line-height: calc(2.333em - 2px);
	}

	.ics-calendar-widget-grid td.empty .day {
		cursor: not-allowed;
	}

	:is(.ics-calendar-widget-grid, .ics-calendar-year-availability-grid) td.has_events .day {
		background: var(--r34ics--element--events--accent--background);
		border-color: var(--r34ics--element--events--accent--border-color);
		color: var(--r34ics--element--events--accent--color);
		font-weight: bold;
	}

	.ics-calendar-year-availability-grid td {
		white-space: nowrap;
	}
	
	.ics-calendar-year-availability-grid td.past .day {
		background: transparent !important;
		border: none !important;
		color: var(--r34ics--element--events--accent--background) !important;
	}
	
	.ics-calendar:not(.no_angled_backgrounds) .ics-calendar-year-availability-grid td.has_events.multiday_first:not(.multiday_last):not(.past) .day {
		background: linear-gradient(-45deg, var(--r34ics--element--events--accent--background) 0%, var(--r34ics--element--events--accent--background) 45%, transparent 45%, transparent 100%);
		text-shadow: 1px 1px 2px var(--r34ics--element--events--accent--background);
	}

	.ics-calendar:not(.no_angled_backgrounds) .ics-calendar-year-availability-grid td.has_events.multiday_last:not(.multiday_first):not(.past) .day {
		background: linear-gradient(-45deg, transparent 0%, transparent 55%, var(--r34ics--element--events--accent--background) 55%, var(--r34ics--element--events--accent--background) 100%);
		text-shadow: 1px 1px 2px var(--r34ics--element--events--accent--background);
	}

	.ics-calendar:not(.no_angled_backgrounds) .ics-calendar-year-availability-grid td.has_events.multiday_first.multiday_last:not(.past) .day {
		background: linear-gradient(-45deg, var(--r34ics--element--events--accent--background) 0%, var(--r34ics--element--events--accent--background) 45%, transparent 45%, transparent 55%, var(--r34ics--element--events--accent--background) 55%, var(--r34ics--element--events--accent--background) 100%);
		text-shadow: 1px 1px 2px var(--r34ics--element--events--accent--background);
	}
	
	:is(.ics-calendar-widget-grid, .ics-calendar-year-availability-grid) .day {
		padding: 0 !important;
	}

	.ics-calendar-widget-grid :is(td.today:not(.has_events), td.current:not(.has_events):not(.past)) .day {
		border-color: var(--r34ics--element--events--accent--border-color);
	}
	
	:is(.ics-calendar-widget-grid, .ics-calendar-year-availability-grid) :is(td.today.has_events, td.current.has_events) .day {
		background: var(--r34ics--element--events--accent--background);
		border-color: var(--r34ics--element--events--accent--border-color);
		color: var(--r34ics--element--events--accent--color) !important;
	}
	
	.ics-calendar-widget .ics-calendar-current-events .event .time {
		display: block;
		font-size: 85%;
		font-weight: bold;
	}


/* Up Next view */

.ics-calendar-up-next-wrapper .event {
	display: none;
}

.ics-calendar-up-next-wrapper .event.up-next {
	display: block;
}

.ics-calendar-up-next-wrapper .ics-calendar-label {
	margin: 1rem 0 0.5rem 0 !important;
}

.ics-calendar-up-next-wrapper .event .title {
	font-weight: bold;
}


/* Year views */

.ics-calendar-year-wrapper {
	width: calc(100% + 2em);
}

	.ics-calendar-year-wrapper > .ics-calendar-label {
		margin-bottom: 1em !important; /* Nicer layout than putting clear: both on .ics-calendar-year-wrapper */
	}

	.ics-calendar-year-wrapper .ics-calendar-year-month {
		display: inline-block;
		margin: 0 1.5em 1.5em 0;
		width: calc(33.333% - 2em);
	}
	@media screen and (max-width: 1024px) and (min-width: 783px) {
		.ics-calendar-year-wrapper .ics-calendar-year-month { width: calc(50% - 2em); }
	}
	
	.ics-calendar-year-wrapper .ics-calendar-year-month:first-of-type {
		clear: both;
	}


/* Year availability view */

.ics-calendar.layout-year-availability { }

	.ics-calendar.layout-year-availability .event.available .descloc.hover_block {
		padding: 0.2em 0.5em;
	}
	
	.ics-calendar.layout-year-availability .event.available:is(:hover, :focus, :focus-within) .descloc.hover_block
	{
		display: block;
		top: 90%; left: 0;
	}


/* ICS Event CPT */

body:is(.post-type-archive-r34icspro_event, .single-r34icspro_event) main.wp-block-group {
	margin: 0 auto;
	max-width: 1280px;
	width: 100%;
}

.r34icspro--details--toggle {
	background: var(--r34ics--color--whitesmoke);
	border: 1px solid var(--r34ics--color--gainsboro);
	border-radius: 4px;
	color: var(--r34ics--color--black);
	padding: 0;
}

.r34icspro--details--summary {
	font-weight: 700;
	padding: 0.5rem 1.5rem;
}

.r34icspro--details--content {
	padding: 1rem 1.5rem 1.5rem 1.5rem;
}

.r34icspro-event--archive, .r34icspro-event--single {
	margin: 1.5rem auto;
	max-width: calc(100vw - 3rem);
	min-width: calc(100% - 3rem);
	width: 100%;
}

	.r34icspro-event--archive--header, .r34icspro-event--archive--content {
		margin-bottom: 1.5rem;
	}
	
	.r34icspro-event--single--breadcrumb {
		border-bottom: 1px solid var(--r34ics--color--gainsboro);
		font-size: 0.875rem;
		line-height: 1.5;
		margin: 1.5rem 0;
		padding: 0;
	}
	
	.r34icspro-event--single--date-time * {
		margin: 0;
	}
	
	.r34icspro-event--single--content img {
		aspect-ratio: auto;
		display: block;
		height: auto;
		margin: 1.5rem auto;
		max-width: 50vw;
		position: relative;
		width: auto;
	}
	
	.r34icspro-event--single--meta {
		background: var(--r34ics--color--whitesmoke);
		border: 1px solid var(--r34ics--color--gainsboro);
		color: var(--r34ics--color--dimgray);
		font-size: 90%;
		line-height: 1.5;
		margin: 1.5rem 0;
		padding: 1rem;
	}
	
	.r34icspro-event--single--meta > * {
		display: grid;
		gap: 1em;
		grid-template-columns: 12rem 100%;
		
	}
	
	.r34icspro-event--single--attach > * {
		color: var(--r34ics--color--dimgray);
		margin: 1.5rem 0;
	}
	
	.r34icspro-event--single--content .eventdesc {
		margin: 1.5rem 0;
	}
	
	.r34icspro-event--single--content .recurrence {
		color: var(--r34ics--color--dimgray);
		font-size: 0.875rem;
		line-height: 1.5;
		margin: 0.5rem 0;
	}

.r34icspro-subscribe-link-wrapper {
	display: inline-block;
	position: relative;
}

	.r34icspro-subscribe-button {
		display: inline-block;
		position: relative;
		z-index: 1;
	}
	
	.r34icspro-subscribe-floating-menu {
		background: var(--r34ics--color--whitesmoke);
		border: 1px solid var(--r34ics--color--gainsboro);
		box-shadow: 2px 2px 5px var(--r34ics--color--trans20);
		display: none;
		padding: 0.75rem;
		position: absolute; top: 100%; left: 0;
		z-index: 2;
	}
	
	.r34icspro-subscribe-floating-menu.open {
		display: block;
	}
	
		.r34icspro-subscribe-floating-menu :is(ul, li) {
			list-style: none;
			margin: 0;
			padding: 0;
			white-space: nowrap;
		}
		
		.r34icspro-subscribe-floating-menu-copy-url-hidden-input {
			opacity: 0;
			position: fixed;
			z-index: -9999;
		}

/* ICS Calendar Pro Shortcode Block color overrides */
/* @todo Refine this a bit more */
.wp-block-ics-calendar-pro-shortcode.has-text-color * { color: inherit !important; }
.wp-block-ics-calendar-pro-shortcode.has-background * { background: inherit !important; }

	
/* Phone breakpoint */

@media screen and (max-width: 782px) {

	body:not(#tinymce) .ics-calendar .no_phone.no_phone_important { display: none !important; }
	body:not(#tinymce) .ics-calendar .phone_only.phone_only_important { display: inline-block !important; }
	
	.ics-calendar:not(.nomobile):not(.show-past-events) .hidden_in_list { display: none !important; }
	
	.ics-calendar.layout-basic.basic_style_flexbox .r34ics-basic-events li { display: block; }
	
	.ics-calendar.layout-full .fc .fc-header-toolbar {
		align-items: flex-start;
		flex-direction: column;
	}

	/* Override minimum width and horizontal scrolling imposed on month tables in free version */
	.ics-calendar.nomobile :is(.ics-calendar-month-with-sidebar, .ics-calendar-widget-availability, .ics-calendar-year-availability) .ics-calendar-month-wrapper
	{ overflow-x: auto; }
	.ics-calendar.nomobile :is(.ics-calendar-month-with-sidebar, .ics-calendar-widget-availability, .ics-calendar-year-availability) .ics-calendar-month-wrapper .ics-calendar-month-grid
	{ min-width: 240px; overflow-x: auto; }

	.ics-calendar:not(.nomobile) .ics-calendar-month-table-list-toggle { display: none; }

	.ics-calendar.month_list_all :is(.ics-calendar-select, .ics-calendar-arrow-nav)
	{ display: none !important; }
	
	.ics-calendar:not(.nomobile).month_list_all .ics-calendar-month-wrapper:not(.past),
	.ics-calendar:not(.nomobile).month_list_all.show-past-events .ics-calendar-month-wrapper.past,
	.ics-calendar:not(.nomobile):not(.show-past-events):not(.month_list_all) .ics-calendar-month-wrapper.past .past.has_events
	{ display: block !important; }

	.ics-calendar-main-with-sidebar {
		display: block;
	}

		.ics-calendar-main {
			display: block;
			width: 100%;
		}
	
			.ics-calendar-main-with-sidebar .ics-calendar-main .sidebar_only { display: none !important; }
			
			/* This currently isn't usable so we're just hiding it until it can be redesigned */
			.ics-calendar:is(.layout-month-with-sidebar, .layout-year-with-sidebar) .ics-calendar-filter
			{ display: none !important; }
			
			body:not(#tinymce) .ics-calendar.nomobile .ics-calendar-main-with-sidebar .ics-calendar-main .events.no_phone, body:not(#tinymce) .ics-calendar.nomobile .ics-calendar-main-with-sidebar .ics-calendar-main .more_events.no_phone
			{ display: none !important; }
			body:not(#tinymce) .ics-calendar.nomobile .ics-calendar-main-with-sidebar .ics-calendar-main .event_count.phone_only { display: block !important; }

		.ics-calendar-sidebar {
			display: block;
			padding: 0;
			/* DON'T override position: sticky here because then top needs to be compensated for as well; the browser will handle this properly automatically. */
			width: 100%;
		}

	.ics-calendar-year-wrapper {
		width: 100%;
	}

	.ics-calendar-year-wrapper .ics-calendar-year-month {
		display: block;
		margin: 0 0 1.5em 0;
		width: 100%;
	}
	
}

/* Note: We're using body.r34ics-print-calendar instead of @media print so the preview is accurate! */
body.r34ics-print-calendar .fc-button { display: none !important; }

body.r34ics-print-calendar:has(.fc) { margin: 1cm auto !important; max-width: 18cm !important; }
