.my-calendar-design {
	container: mcadmin / inline-size;
}

#my-calendar legend {
	font-weight: 700;
	font-size: 1em
}

#my-calendar #wp-content-editor-tools {
	background: #fff;
}

#cat_icon option {
	padding: 5px 0 5px 24px
}

.mc-template-tag-preview {
	position: relative;
	padding-bottom: 75%;
	height: 0;
	overflow: hidden;
}

.mc-template-tag-preview iframe {
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
}

.mc-template-preview iframe {
	width: 100%;
}

#my-calendar .delete_occurrence,
#my-calendar-admin-table .delete {
	color: #b32d2e;
}

#my-calendar-admin-table th .active {
	font-weight: 700;
}

#mc-importer form {
	padding-bottom: .5rem;
}

.n4 {
	width: 42px
}

#my-calendar .wp-picker-container {
	line-height: 2;
}

.category-color {
	width: 1em;
	height: auto;
	min-height: 1em;
	display: inline-flex;
	padding: 3px;
	border-radius: 3px;
	border: 1px solid #a6a6a6;
}

.mc-category-list {
	display: grid;
	gap: 4px;
}

.mc-category-list .mc-category-item {
	display: flex;
	align-items: center;
	gap: 4px;
}

.mc-category {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.mc-category .mc-category-color {
	padding: 3px;
	display: inline-flex;
	justify-content: center;
}

.category-color.no-border {
	border: none;
}

.my-calendar-admin a[aria-current=true] {
	font-weight: 700;
}

ul.links li {
	float: left;
	margin: 0 5px 10px;
}

.my-calendar-admin .metabox-holder .mc-postbox > h2,
.my-calendar-admin .metabox-holder .postbox > h2 {
	font-size: 14px;
	padding: 8px 12px;
	margin: 0;
	line-height: 1.4;
}

.my-calendar-admin .metabox-holder .mc-postbox > h2:not(.mc-heading-inline),
.my-calendar-admin .metabox-holder .postbox > h2:not(.mc-heading-inline) {
	display: flex;
}

.my-calendar-admin .metabox-holder .mc-postbox > h2 {
	padding: 8px 0;
	margin-top: 24px;
	font-weight: 700;
}

#core-templates h2,
#mc-edit-template h2 {
	margin-top: 0;
}

.my-calendar-admin .CodeMirror {
	height: 600px;
}

.my-calendar-admin #mc-edit-template .CodeMirror {
	height: 400px;
}

#my-calendar-admin-table {
	margin-bottom: 1em;
}

#my-calendar-admin-table input[type=checkbox] {
	margin: 0;
	vertical-align: middle;
}

#my-calendar-admin-table tr > th:nth-of-type(1) {
	width: 5em;
	vertical-align: top;
}

#toggle {
	height: 2em
}

#toggle li {
	float: left;
	margin-right: 5px
}

.mc-input-description {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .25rem;
}

.mc-input-description span.mc-notice {
	margin: 0;
}

.my-calendar-admin .spam {
	background: #f5e6ab;
}

#mceditor {
	border: 1px solid #dcdcde;
	margin: 0 0 5px;
}

.mc-template-cards {
	display: grid;
	grid-template-columns: repeat(3, 33.333333%);
	column-gap: 1px;
}

.mc-template-card div:first-of-type {
	font-weight: 700;
}

.mc-template-card {
	padding: 10px;
}

.mc-template-card pre {
	white-space:pre-wrap;
	line-break:anywhere
}

.mc-template-card code {
	display: block;
	margin: -10px -10px 0;
}

.mc-template-card:nth-of-type(even) {
	background: #f6f7f7;
}

.mc_template_tags {
	clear: right
}

.mc_permissions .mc-settings,
.my-calendar-admin .columns,
.recurring .columns {
	display: grid;
	column-gap: 8px
}

#e_schedule .columns,
.my-calendar-admin .columns-flex {
	display: flex;
}

#e_schedule .new-field {
	position: relative;
}

#e_schedule .new-field .mc-buttons {
	position: absolute;
	top: -1.5em;
	right: 0;
}

#e_schedule .new-field .button-delete {
	border-color: #b32d2e;
	color: #b32d23;
}

#e_schedule .new-field .mc-buttons.multiple button:nth-of-type(1) {
	border-radius: 3px 0 0 3px;
	padding-right: 6px;
}

#e_schedule .new-field .mc-buttons.multiple button:nth-of-type(2) {
	border-radius: 0 3px 3px 0;
	border-left: none;
	padding-left: 6px;
}

li.datetime-template:not( #event1 ) {
	padding: 1em;
}

li.datetime-template.disabled {
	opacity: .5;
}

li.datetime-template:nth-of-type(even) {
	background: rgba( 0, 0, 0, .02 );
}

.my-calendar-admin li {
	margin-bottom: 12px;
}

.mc-view-options .inside > div {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 20px;
}

@media ( width < 1500px ) {
	.mc-view-options .inside > div {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( width < 782px ) {
	.mc-view-options .inside > div {
		grid-template-columns: repeat( 1, 1fr );
	}
}

.mc_permissions .mc-settings,
.my-calendar-admin .columns {
	grid-template-columns: repeat(2, 1fr );
}

#e_schedule .columns {
	align-items: start;
	flex-wrap: wrap;
}

.my-calendar-admin .recurring .columns {
	display: flex;
	flex-wrap: wrap;
}

#event_date_error.visible {
	opacity: 1;
}

#event_date_error .dashicons {
	color: #a00;
}

#event_date_error {
	opacity: 0;
}


#e_schedule .columns label:not(.duet-date__mobile-heading),
.recurrences .columns label:not(.duet-date__mobile-heading),
.recurring .columns label:not(.duet-date__mobile-heading) {
	display: block;
	max-width: fit-content;
}

#e_schedule .columns .checkboxes label {
	display: inline;
}

.recurrences .columns.instance-list,
#e_schedule .columns.instance-list {
	display: flex;
	flex-wrap: wrap;
}

.recurrences .columns.instance-list li,
#e_schedule .columns.instance-list li {
	background: rgba( 0,0,0,.05 );
	padding: 0 8px;
	flex-grow: 1;
}

.instance-list button[aria-pressed="true"] {
	outline: 2px solid;
	outline-offset: 2px;
}

.recurrences input[type=time],
#e_schedule input[type=time],
.my-calendar-admin input[type=date],
.recurring select {
	padding: 8px 24px 8px 8px;
}

.recurring input[type=number] {
	padding: 8px;
	width: 5em;
}

#event1 .new-field {
	display: none;
}

p.event_span {
	display: flex;
	gap: 4px;
}

p.event_span.checkboxes {
	border: 1px solid #c3c4c7;
	border-radius: 3px;
	padding: 1em 1em .5em;
	background: #f0f0f1;
	margin-bottom: 1em;
}

ol.mc-repeat-events {
	display: grid;
	margin: 0;
	list-style-type: none;
}

ol.mc-repeat-events .buttons {
	display: none;
}

ol.mc-repeat-events li:last-of-type .buttons {
	display: flex;
	align-items: center;
	gap: 4px;
}

.mc-template-layout:not(.legacy-templates) {
	display: flex;
	gap: 32px;
}

@media screen and ( width < 782px ) {
	.mc-template-layout {
		flex-wrap: wrap;
	}
}

.list-template-settings {
	max-width: 640px;
}

.list-templates {
	padding: 1rem;
	margin: 1rem 0;
	box-shadow: 0 3px 4px #ccc;
	border: 1px solid #e6e6e6;
	max-width: 720px;
}

.list-templates h4 {
	margin: 0;
	font-size: 1.2rem;
}

ul.mc-file-list ul {
	margin-left: 1rem;
	margin-top: .5rem;
}

ul.mc-file-list > li > code {
	font-weight: 700;
}

ul.mc-file-list ul li {
	margin-left: 1rem;
	display: flex;
	align-items: center;
	gap: 8px;
}

#my-calendar .apply {
	padding: 1px 5px 0;
	border-radius: 3px;
	background: #fcf9e8;
	border: 1px solid #8c8f94;
	display: block;
}

#my-calendar .apply legend {
	padding: 2px 0
}

#my-calendar .apply .warning, #my-calendar .apply .matched {
	background: #fcf9e8;
	color: #2c3338;
	padding: 10px;
	border-bottom: 2px solid transparent;
	margin: 0 -5px 10px;
}

#my-calendar .apply .warning {
	border-bottom: 2px solid #b32d2e;
}

#my-calendar .apply .matched {
	border-bottom: 2px solid #007017;
}

#my-calendar .break ul {
	padding: 10px 10px 0;
	margin-right: 180px
}

.mc-help-links .help:nth-of-type(1) {
	display: flex;
	gap: 12px;
	justify-content: center;
	margin-bottom: 1.5rem;
	flex-wrap: wrap;
}

.mc-help-links .help:nth-of-type(1) a {
	padding: 10px;
	border: 1px solid;
	box-shadow: 4px 4px 0 #787c82;
}

.mc-help-links .help:nth-of-type(1) a:hover,
.mc-help-links .help:nth-of-type(1) a:focus {
	box-shadow: 4px 4px 0 #007eb3;
	background-color: #f0f0f1;
}

.my-calendar-admin .event_description {
	margin-bottom: 1em;
}

.my-calendar-admin .mc-image-upload {
	background: rgba( 0,0,0,.03 );
	padding: .5rem;
	margin-bottom: .5rem;
	min-height: 3rem;
}

.my-calendar-admin .mc-image-upload .image_fields {
	display: flex;
	gap: 10px;
	padding: 10px;
	z-index: 10;
}

.my-calendar-admin .mc-image-upload.has-image .image_fields {
	position: absolute;
}

.my-calendar-admin .event_image {
	position: relative;
}

.my-calendar-admin #event_image {
	max-width: 50%;
	height: auto;
}

@media screen and ( width < 481px ) {
	.my-calendar-admin #event_image {
		max-width: 100%;
	}
}

.event_image:has(img[alt="Current image: "]):after {
	content: 'alt text missing';
	position: absolute;
	left: 10px;
	top: 10px;
	background: rgba( 0,0,0,.65 );
	color: #fff;
	padding: 3px 5px;
	border-radius: 5px;
	border: 1px solid #b32d2e;
	font-size: .875rem;
	font-weight: 700;
}

#mc-clipboard.help {
	font-family: 'Courier New';
	background: #fff;
	padding: 5px;
	height: 60em;
}

.mc-copy-button {
	display: flex;
	align-items: center;
	column-gap: 10px;
}

.mc-notice-copied {
	display: none;
	background: #f5e6ab;
	color: #000;
	padding: 6px;
	border-radius: 3px;
}

.mc-notice-copied.visible {
	display: block;
}

.template-editor, .style-editor {
	width: 98%
}

.mc-google-marker {
	padding-right: 1rem;
	padding-bottom: 1rem;
	line-height: 1.5;
}

#my-calendar-templates h2:not(.mc-flex),
#my-calendar-templates h2:not(.mc-flex) + p {
	display: inline-block;
}

.templates.inside li a {
	text-decoration: none;
}

.templates.inside li a:hover,
.templates.inside li a:focus {
	border-bottom: 1px solid;
}

.my-calendar-admin .CodeMirror-wrap {
	border: 1px solid #c3c4c7;
}

.my-calendar-admin .CodeMirror-wrap.CodeMirror-focused {
	border: 1px solid #8c8f94;
}

.my-calendar-admin .postbox {
	margin: 10px 10px 0 0
}

.my-calendar-admin .jcd-narrow .postbox {
	margin-right: 0;
	min-width: auto;
}

.my-calendar-admin .postbox .inside {
	overflow: visible !important;
	margin: 0;
}

/* some plugins change this, but I need it at WP default. */
.my-calendar-admin .meta-box-sortables {
	min-height: 0
}

.my-calendar-admin textarea {
	width: 100%
}

.my-calendar-admin .message pre, .my-calendar-admin pre:not(.CodeMirror pre) {
	background: #fff;
	padding: 5px;
	border: 1px solid #dcdcde;
	box-shadow: 1px 1px 2px #dcdcde
}

#mc-shortcodes textarea {
	background: rgba( 0,0,0,.05 );
	box-shadow: none;
	border: none;
	font-size: 1.2em;
}

.my-calendar-admin label span.required {
	color: #b32d2e;
}

.my-calendar-admin label .nomatch {
	font-style: italic;
	color: #b32d2e;
	font-weight: 700;
}

.my-calendar-admin .default {
	background: #fff
}

.default-location a .dashicons {
	text-decoration: none;
}

.my-calendar-admin .button-adjust {
	top: 10px;
	right: 0
}

.my-calendar-admin hr {
	width: 20%;
	margin: 0 auto;
	border: none;
	border-top: 1px solid #c3c4c7
}

#mc-shortcodes li code {
	display: inline-block
}

.my-calendar-admin .tablenav {
	display: inline;
	margin-top: -4em;
}

label[for=l_preset] {
	display: block;
	max-width: fit-content;
}

input[id=e_label], input[id=e_title], input[id=location_label], textarea[id=mc_twitter] {
	font-size: 1.4em;
	padding: 9px;
	width: 100%;
	margin-bottom: .5em;
}

input[id=e_link], input[id=e_image] {
	max-width: 100%;
	margin-bottom: .5em;
}

strong.label {
	font-weight: 400;
}

.my-calendar-text label,
#my-calendar-text label {
	display: inline-block;
	width: 12em;
}

.my-calendar-admin .counter {
	padding-right: 6px;
	border-right: 16px solid green;
	border-radius: 20px;
}

.my-calendar-admin .counter.warning {
	border-color: #bd8600;
}

.my-calendar-admin .counter.exceeded {
	border-color: #b32d2e;
}

.my-calendar-admin .button-primary:active {
	vertical-align: baseline;
}

#mc-icons-autocomplete .autocomplete-result-list svg {
	max-width: 40px;
	vertical-align: middle;
}

.my-calendar-admin ul {
	line-height: 1.6;
}

.autocomplete.mc-autocomplete {
	max-width: 600px;
}

label[for=mc_uri_query]::before {
	content: '\f179';
	font-family: dashicons;
	font-size: 20px;
	vertical-align: middle;
	color: #696969;
}

#mc_uri_query {
	padding: 6px 32px 6px 6px;
}

.jcd-wide .style-selector form > div {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
}

.mc-categories td img,
.mc-categories td svg {
	max-width: 40px;
	vertical-align: middle;
}

.mc-categories th.mc-icon {
	width: 90px;
}

.mc-categories th.mc-color {
	width: 6em;
}

.jcd-wide {
	width: 75%;
}

.my-calendar-admin .jcd-narrow {
	width: 25%;
	max-width: 25rem;
}

#my-calendar-admin-table .row-actions {
	color: #646970;
}

.mc-sidebar-footer .jcd-wide {
	width: 100%;
}

.mc-sidebar-footer .jcd-narrow {
	clear: both;
	width: 100%;
}

.wp-admin.no-js .wptab {
	display: none;
}

.mc-tabs .tabs, .mc-tablinks {
	position: relative;
	border-bottom: 1px solid #c3c4c7;
	margin-bottom: 0;
	margin-top: 20px;
}

.mc-tabs.vertical .tabs {
	border-bottom: none;
}

.mc-tabs .tabs button, .mc-tablinks a {
	display: inline-block;
	padding: 6px 12px;
	font-size: 14px;
	border-radius: 4px 4px 0 0;
	border: 1px solid #c3c4c7;
	background: #f6f7f7;
	position: relative;
	border-bottom: 2px solid transparent;
}

.mc-tabs .tabs button[aria-selected=true]:after,
.mc-tablinks a[aria-current=page]:after {
	content: '';
	position: absolute;
	left: calc( 50% - 10px );
	top: calc( 100% + 1px );
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #fff;
	clear: both;
}

.mc-tabs .tabs button[aria-selected=true]:before,
.mc-tablinks a[aria-current=page]:before {
	content: '';
	position: absolute;
	left: calc( 50% - 10px );
	top: calc( 100% + 2px );
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #c3c4c7;
	clear: both;
}

@media screen and ( width >= 481px ) {
	.mc-tabs.vertical .tabs button[aria-selected=true]:after,
	.mc-tabs.vertical .tabs button[aria-selected=true]:before {
		left: 100%;
		top: 50%;
		border-left: 10px solid #fff;
		border-top: 10px solid transparent;
		border-bottom: 10px solid transparent;
		margin-top: -10px;
	}

	.mc-tabs.vertical .tabs button[aria-selected=true]:before {
		left: calc( 100% + 1px );
		top: 50%;
		border-left: 10px solid #a2a4a7;
		border-top: 10px solid transparent;
		border-bottom: 10px solid transparent;
	}
}


.mc-tabs .tabs button:hover,
.mc-tabs .tabs button:focus,
.mc-tablinks a:hover,
.mc-tablinks a:focus {
	border-bottom: 2px solid #000;
}

.mc-tabs .tabs button[aria-selected=true],
.mc-tablinks a[aria-current=page] {
	background: #fff;
}

.mc-tabs.vertical {
	display: grid;
	grid-template-columns: 12em 1fr;
}

.mc-tabs.vertical .tabs {
	margin-top: 0;
}

.mc-tabs.vertical .tabs button {
	display: block;
	border: 1px solid #c3c4c7;
	border-right: none;
	border-bottom: none;
	border-radius: 0;
	width: 100%;
	text-align: left;
}

.mc-tabs.vertical .tabs button:last-of-type {
	border-bottom: 1px solid #c3c4c7;
}

.mc-tabs.vertical .wptab {
	border-left: 1px solid #c3c4c7;
	padding: 10px;
}

@media screen and ( width < 481px ) {
	.mc-tabs.vertical {
		display: flex;
		flex-wrap: wrap;
	}
	.mc-tabs.vertical .tabs {
		display: flex;
		flex-wrap: wrap;
	}
	.mc-tabs.vertical .tabs button {
		border: 1px solid #c3c4c7;
	}
	.mc-tabs.vertical .wptab {
		padding: 0;
		margin-top: 10px;
	}
	.mc-tabs.vertical .tabs button[aria-selected="true"]::before,
	.mc-tabs.vertical .tabs button[aria-selected="true"]::after {
		display: none;
	}
	.mc-tabs.vertical .tabs button[aria-selected="true"] {
		border-bottom: 2px solid black;
	}
}

.my-calendar-admin fieldset .wptab {
	border: 1px solid #c3c4c7;
	border-top: none;
	padding: 1em;
	margin-bottom: 1em;
}

#my-calendar-admin-table th[aria-sort] a:after {
	vertical-align: bottom;
	display: inline-block;
	margin-left: 10px;
	font-family: dashicons;
}

#my-calendar-admin-table th[aria-sort=descending] a:after {
	font-family: dashicons;
	content: "\f346";
}

#my-calendar-admin-table th[aria-sort=ascending] a:after {
	font-family: dashicons;
	content: "\f342";
}

#mc-calendar-view .mc-generator-data {
	display: none;
}

#mc-calendar-view .editor-save-notice p {
	text-align: right;
	font-style: italic;
	margin: 0;
}

#mc-generator .shortcode-preview {
	display: grid;
	grid-template-columns: 1fr auto auto;
	column-gap: 10px;
	align-items: center;
}

@media screen and ( width <= 481px ) {
	#mc-generator .shortcode-preview {
		grid-template-columns: 1fr;
	}
}

#mc-generator .mc-tabs .tabs button {
	padding: 8px 16px;
	background: #fff;
}

#mc-generator .mc-tabs .tabs button[aria-selected=true]:after {
	border-top: 10px solid #f0f0f1;
}

#mc-generator .mc-tabs .tabs button[aria-selected=true] {
	background: #f0f0f1;
}

#mc-generator .mc-tabs .wptab {
	padding: 12px;
}

@media screen and ( width < 481px ) {
	#mc-generator .mc-tabs .wptab {
		padding: 12px 0;
	}
}

.mc-generator-inputs {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	column-gap: 20px;
}

.mc-generator-inputs input[type=text],
.mc-generator-inputs select,
.mc-generator-inputs textarea {
	width: 100%;
}

.mc-generator-inputs li label {
	display: inline-block;
}

.mc-sortable li {
	border: 1px solid #dcdcde;
	background: rgba(0, 0, 0, .05);
	padding: .5em 1em;
	margin: 10px 0 0;
}

.mc-sortable li.mc-visible {
	background: rgba( 0, 0, 0, .02 );
}

.mc-sortable li {
	margin: 0;
	border-bottom: none;
}

.mc-sortable .ui-sortable-handle {
	cursor: move;
	border-left: 4px solid transparent;
}

.mc-sortable .ui-sortable-handle:hover {
	border-left: 4px solid rgba(0,0,0,.5);
}

#mc-current-location {
	padding: 6px;
	background: rgba( 0, 0, 0, .05 );
	border-radius: 6px;
	margin-bottom: 10px;
}

.mc-event-location-dropdown {
	display: flex;
	flex-wrap: wrap;
	column-gap: 10px;
	align-items: end;
	margin-bottom: 10px;
}

.location-input {
	max-width: 30em;
}

.location-input select {
	width: 100%;
}

.wp-core-ui .location-toggle .button {
	margin-bottom: 0;
	margin-top: 8px;
}

#my-calendar.disabled .ui-sortable .postbox .inside > *:not(#mc-scheduled-dates) {
	opacity: .3;
}

#my-calendar.disabled #mc-scheduled-dates {
	padding: 1em .5em;
	box-shadow: 3px 3px 3px #c3c4c7;
	border: 1px solid #a7aaad;
}

.add_field .dashicons,
.add-location .dashicons,
.toggle-dates .dashicons,
.add-occurrence .dashicons {
	vertical-align: middle;
	font-size: 1.1rem;
}

#my-calendar .button-link.toggle-inside .dashicons {
	text-decoration: none;
}

.mc-settings-page .mc-sortable .mc-updated,
.mc-generator .mc-sortable .mc-updated {
	background-color: #f0c33c;
	color: #000;
}

.mc-sortable li {
	display: flex;
	align-items: center;
	column-gap: 4px;
}

.mc-sortable .mc-buttons {
	display: inline-flex;
	column-gap: 4px;
	align-items: center;
}

.mc-sortable .mc-hidden > *:not(.mc-buttons) {
	opacity: .5;
}

.mc-sortable li:first-of-type .mc-buttons .up, .mc-sortable li:last-of-type .mc-buttons .down {
	background: none;
	border: 1px solid transparent;
	color: rgba( 0,0,0,.5 );
}

.my-calendar-admin .ui-accordion-header.ui-state-hover, .ui-accordion-header.ui-state-focus, .mc-settings-page .mc-sortable li:hover {
	background: #f6f7f7;
	box-shadow: 0 0 2px #dcdcde;
}

.my-calendar-text li,
#my-calendar-text li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 6px;
}

.my-calendar-text span,
#my-calendar-text span {
	background: rgba( 0,0,0,.05 );
	padding: 5px;
	border-radius: 3px;
}

.notice.mc-promotion {
	border-left-color: #007eb3;
}

.notice.mc-promotion p {
	display: grid;
	grid-template-columns: 60px auto;
	align-items: center;
	column-gap: 20px;
	font-size: 1.2em;
}

.notice.mc-promotion img {
	width: 100%;
}

.label-select,
.label-text,
.label-url,
.label-email {
	display: block;
}

.mc-label-with-button {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 10px;
	margin-bottom: 6px;
}

.mc-general-style-options {
	display: grid;
	grid-template-columns: 1fr auto;
	margin: 1rem 0;
}

.mc-input-with-note {
	display: flex;
	flex-wrap: wrap;
	column-gap: 6px;
	align-items: end;
}

.mc-input-with-note input {
	width: 100%;
}

.mc-input-with-note p {
	margin: 0;
}

.mc-input-with-note span {
	padding: 4px;
}

.mc-sortable li {
	cursor: move;
}

input[name="mc_uri"] {
	width: 100%;
	padding: 5px;
	font-size: 1.4em;
}

#my-calendar-manage .inside {
	display: flex;
	flex-wrap: wrap;
	column-gap: 36px;
}

#mc-generator .custom {
	background: #f6f7f7;
	padding: 1em;
}

.my-calendar-admin .ui-accordion-header .dashicons {
	line-height: 1.5;
}

.my-calendar-admin .ui-accordion-header .dashicons:before {
	content: "\f139";
}

.my-calendar-admin .ui-accordion-header-active .dashicons:before {
	content: "\f140";
}

.my-calendar-admin .ui-accordion-content {
	padding: 0 1em;
	border: 1px solid #c3c4c7;
}

.my-calendar-admin .mc-locations-control summary {
	margin: 0;
	padding: .5rem;
	background: #0000000a;
	border: 1px solid #fff;
}

.my-calendar-admin .mc-locations-control summary:hover {
	border: 1px solid #000;
}

.my-calendar-admin .mc-locations-control details > div {
	padding: .5rem;
}

.my-calendar-admin .mc-category-settings {
	display: flex;
	flex-wrap: wrap;
	column-gap: 50px;
}

.category-icon-selector,
.mc-primary-category {
	display: flex;
	flex-wrap: wrap;
	column-gap: .5em;
	align-items: center;
}

.category-icon-selector {
	margin-bottom: 1em;
}

.my-calendar-admin .icon-list.checkboxes {
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
}

.my-calendar-admin .icon-list.checkboxes li {
	display: flex;
	align-items: center;
}

.icon-list .category-icon code {
	background: transparent;
}

.icon-list .category-icon img {
	max-width: 100%;
}

.mc-primary-category option {
	display: none;
}

.mc-sortable .mc-calendar {
	background-color: #fff !important;
	border: 2px solid #787c82 !important;
}

.mc-sortable li.mc-stop {
	border-radius: none;
	background-color: #2c3338;
	color: #f0f0f1;
}

.mc-sortable .mc-ui-state-highlight {
	background: #fcf9e8 !important;
	height: 1.6em;
}

.mc-sortable div.dashicons {
	vertical-align: middle;
	height: 1em;
}

.mc-sortable code {
	display: inline-block;
	min-width: 5em;
	text-align: center;
}

.my-calendar-admin .mass-replace-wrap {
	position: relative;
}

.my-calendar-admin .mass-replace-container {
	display: none;
	position: absolute;
	left: 1rem;
	top: 2rem;
	background: #fff;
	padding: 1rem;
	box-shadow: 3px 3px 3px #c3c4c7;
	border: 1px solid #c3c4c7;
	width: 13em;
}

.my-calendar-admin .mass-replace-container label {
	display: block;
}

.my-calendar-admin .mc-clear-filters {
	position: absolute;
	top: -3em;
	right: 1em;
}

.my-calendar-admin .mc-clear-filters .dashicons {
	text-decoration: none;
}

.my-calendar-admin .bullets {
	list-style: disc;
	margin-left: 1em;
}

#my-calendar-manage .mc-input-settings {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 10px;
}

#my-calendar-manage input[type=file] {
	padding: .5em;
	background: #f6f6f6;
	border: 1px solid #ddd;
	font-weight: 700;
	font-size: 1.1em;
}

.my-calendar-admin .checkboxes {
	margin: 0;
}

.my-calendar-admin .checkboxes:after {
	content: '';
	display: table;
	clear: both;
	margin-bottom: 1em;
}


.my-calendar-admin .checkboxes .event-new-category {
	background: transparent;
	padding: 0;
}

.checkboxes .event-new-category .button {
	margin-top: -3px;
}

.event-new-category .button .dashicons {
	vertical-align: middle;
}

label[for=e_link],
label[for=e_author],
label[for=e_host] {
	display: block;
	max-width: fit-content;
}

.my-calendar-admin .button .dashicons-minus {
	font-size: 16px;
}

.new-event-category {
	background: #0000000a;
	padding: .5em 1em;
	margin-top: -1em;
	display: flex;
	align-items: end;
	column-gap: 2px;
	flex-wrap: wrap;
}

.new-event-category label {
	display: block;
}

.wp-core-ui .new-event-category button {
	margin-bottom: 0;
	padding: 0 6px;
}

.my-calendar-admin .mc-heading-inline {
	display: inline-block;
	margin-right: 5px;
}

.mc-admin-mode li,
.mc-admin-mode {
	display: inline-block;
}

.mc-admin-mode li {
	margin-right: 5px;
}

.mc-admin-mode a {
	padding: 5px;
}

.my-calendar-admin .mc_permissions .checkboxes li {
	display: block;
}

.mc_permissions fieldset {
	padding: 1em;
}

.mc-css-variables {
	margin-top: 1em;
}

.mc-css-variables h3 {
	font-size: 1.1em;
	border-bottom: 1px solid #a2a4a7;
}

ul.mc-variables li {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

ul.mc-variables li:has(.wp-picker-active) {
	display: block;
}

ul.mc-variables li:has(.wp-picker-active) label {
	font-weight: 700;
	margin-bottom: 6px;
}

.mc-css-variables .wp-picker-holder {
	box-shadow: 5px 5px 5px #aaa;
}

.my-calendar-admin .checkboxes li {
	padding: 6px;
	background: rgba(0, 0, 0, .05);
	margin: 2px;
	display: inline-flex;
	align-items: center;
}

.my-calendar-admin .checkboxes li:hover {
	background: #fff;
}

.mc-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 6px 0 4px;
	clear: both;
}

.group.mc-actions .checkboxes label {
	display: inline-block;
}

.my-calendar-admin fieldset legend {
	font-weight: 700;
	padding: 0;
	font-size: 1.1em;
}

.my-calendar-admin fieldset.categories {
	margin-top: 1em;
}

.my-calendar-admin .categories label span svg {
	width: 1em;
	height: 1em;
}

.locations-container .columns-flex {
	align-items: end;
	gap: 8px;
}

.locations-container .columns-flex .checkboxes {
	margin: 1em 0;
}

.generator fieldset {
	border: 1px solid #c3c4c7;
	margin: 10px 0;
	padding: 10px;
}

.mc-generator-inputs > fieldset {
	border: none;
	padding: 0;
}

.mc-generator-inputs fieldset:nth-of-type(1) {
	grid-row: 1/3;
}

.generator label {
	display: block;
}

.generator .checkboxes label {
	display: inline;
}

.my-calendar-contextual-help {
	margin-left: .25em;
}

.widget-content .my-calendar-contextual-help {
	display: inline-block;
}

.my-calendar-contextual-help .dashicons:not( h2 .dashicons ) {
	line-height: 1;
	height: auto;
	width: auto;
}

.wrap a.my-calendar-contextual-help {
	display: inline-flex;
	column-gap: 5px;
	align-items: center;
	text-decoration: none;
}

.wrap .notice a.my-calendar-contextual-help {
	display: inline;
}

.my-calendar-contextual-help .dashicons {
	text-decoration: none;
}

.wrap a.my-calendar-contextual-help .help-label-text {
	text-decoration: underline;
}

.generator td input[type=text] {
	width: 100%;
}

.generator td label {
	float: none;
	width: auto;
	display: inline;
}

.generator .help, .generator .clear {
	clear: left;
}

.generator input {
	line-height: normal;
}

select[name="event_recur"] {
	vertical-align: top;
}

.my-calendar-admin li.events_access_notes {
	padding: 0px 1px 1px 5px;
	gap: 5px;
}

.req {
	color: red;
}

.mc-controls ul {
	justify-content: end;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	margin: 0;
}

.mc-controls.footer {
	margin: 20px 0 0;
}

.mc-controls li:last-of-type {
	padding-right: 0;
}

.mc-controls .dashicons {
	margin-right: 2px;
}

.mc-locations label {
	display: block;
}

.mc-locations .checkboxes label, .checkbox label {
	display: inline;
}

.faux-p {
	padding: 2px;
	margin: .5em 0;
}

.inline-form {
	display: inline-block;
}

.mc-contrast-table {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
}

.mc-contrast-table caption {
	font-size: 1.2rem;
	line-height: 1.5;
}

.mc-contrast-table thead {
	border-bottom: 2px solid;
}

.mc-contrast-table th[scope=row] {
	border-right: 2px solid;
}

.mc-contrast-table th {
	padding: 4px 6px;
	font-weight: 400;
}

#my-calendar-style .inside {
	display: flex;
	gap: 20px;
}

#my-calendar-style .mc-new-variable p {
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 10px;
}

#my-calendar-style .my-calendar-style-preview {
	position: relative;
	width: 100%;
}

#my-calendar-style .my-calendar-style-preview .mc-main {
	position: absolute;
	top: 0;
	width: 100%;
}

#my-calendar-style .my-calendar-style-preview .mc-main.fix {
	position: fixed;
	top: 0;
	width: 100%;
}

#my-calendar-style .my-calendar-style-settings {
	max-width: 20rem;
}

@media (max-width:1200px) {
	#my-calendar-style .inside {
		display: block;
	}
	#my-calendar-style .my-calendar-style-settings {
		max-width: 100%;
	}
	#my-calendar-style .my-calendar-style-settings .checkboxes li {
		min-width: 1rem;
	}
}

.mc-contrast-table td {
	text-align: center;
	font-style: italic;
}

.mc-contrast-table div {
	padding: 2px;
	font-weight: 700;
	font-size: 1rem;
	border-radius: 3px;
	margin: 0;
	font-style: normal;
}

.mc-contrast-table .comparison {
	display: none;
}

.mc-contrast-table .invalid-contrast {
	opacity: .5;
}

.mc-contrast-table p {
	font-size: .75rem;
	font-weight: 400;
	padding: 4px 0 0;
	margin: 0;
}

.mc-admin-footer,
.mc-admin-header {
	display: grid;
	grid-template-columns: 1fr 22em;
	align-items: center;
	margin-bottom: 1em;
	clear: both;
}

@media ( width <= 782px) {
	.mc-admin-footer,
	.mc-admin-header {
		display: flex;
		flex-wrap: wrap;
	}
	.mc-admin-footer .button-secondary, .mc-admin-header .button-secondary {
		padding: 5px 10px;
	}
	ul.mc-file-list ul {
		margin-left: 0;
	}
	ul.mc-file-list ul li {
		margin-left: 0;
	}
}

.mc-admin-header.locations {
	display: block;
	float: right;
}

div.mc-search {
	text-align: right;
}

.recurrences-disabled button {
	float: right;
	margin-left: 12px;
	margin-bottom: 12px;
}

.enable-repetition .dashicons:before {
	vertical-align: middle;
}

.mc-submissions input[disabled] {
	background: rgba( 0,0,0,.05 ) !important;
	border: 1px solid #ccc !important;
}

.mc_add_new {
	position: relative;
	z-index: 200;
	padding: 1em;
	background: #fff;
	box-shadow: 0 0 2px #787c82;
	margin-bottom: 1em;
}

.mc_add_new .clonedInput {
	border-bottom: none;
	margin-bottom: 0;
}

.my-calendar-widget-wrapper p {
	font-size: 13px;
}

.my-calendar-admin .postbox .hndle {
	cursor: auto;
	user-select: auto;
}

.my-calendar-admin #wp-content-editor-tools {
	padding-top: 0;
}

.template-description {
	font-weight: 700;
	font-size: 1.1em;
}

.promotion h2 {
	text-align: left;
}

.mc-support-me h2 {
	color: #fff;
}

.promotion {
	font-weight: 600;
	text-align: center;
}

.promotion img {
	max-width: 130px;
	height: auto;
	margin: 0 auto;
	display: block;
}

.postbox.promotion p.coupon {
	padding: 1em;
	border: 2px dashed #ccc;
	text-align: center;
}

.postbox.promotion .coupon code {
	font-size: 1em;
}

.mc-support-me img {
	max-width: 60px;
}

.mc-support-me {
	background: #007eb3;
	text-shadow: 1px 1px rgb( 35, 60, 127 );
}

.mc-flex {
	display: flex;
	align-items: center;
	gap: 16px;
}

.mc-flex.mc-social {
	justify-content: center;
}

.mc-flex.mc-social {
	margin: 0;
	align-items: center;
}

.mc-flex.mc-social li {
	margin: 0;
}

.mc-flex.mc-social a {
	display: block;
	padding: 3px;
	border-radius: 3px;
}

.mc-flex.mc-social a:hover {
	outline: 2px solid;
}

fieldset.mc-flex {
	column-gap: 10px;
	flex-wrap: wrap;
}

.mc-support-me p {
	font-size: 1.6em;
	font-weight: 600;
	background: #007eb3;
	text-shadow: 1px 1px rgb( 35, 60, 127 );
	padding: 1em;
	text-align: center;
	margin: 0 0 1em;
}

.promotion.mc-support-me p {
	text-align: left;
	font-size: 1.5em;
}

.mc-support-me p, .mc-support-me a {
	color: #fff;
}

@media ( max-width: 1200px ) {
	.mc-flex {
		flex-wrap: wrap;
	}
	.promotion.mc-support-me p {
		font-size: 1.3em;
		padding: .5em 0;
	}
}

.my-calendar-admin .notice-error .button-secondary {
	vertical-align: baseline;
}

.mc_recur_string p {
	padding: 0;
	margin: 0;
	display: none;
}

.mc_recur_string.active p,
.mc_response {
	display: block;
	padding: .5em;
	background: #fcf9e8;
	color: #000;
	border: 1px solid #bd8600;
	margin-top: 1em;
}

.mc_recur_string p {
	margin-top: 0;
}

tr.problem,
tr.invalid {
	background-color: #fcf9e8;
}

tr.problem .error {
	color: #8a2424;
}

.problem-icon {
	font-size: 64px;
	float: left;
	margin-right: .25em;
	height: 64px;
	width: 64px;
	display: block;
}

.event_time_label {
	display: inline-block;
	margin-left: 1em;
}

.my-calendar-admin .hidden {
	display: none;
}

#my-calendar .inside div iframe {
	float: none;
}

.wrap ul.list {
	list-style-type: disc;
	margin-left: 1.5em;
}

.mc-support-me a:hover, .mc-support-me a:focus {
	text-decoration: none !important;
	color: #fff !important;
}

.my-calendar-admin .mc-none {
	clear: both;
}

.mc-locations .locations-container input:not([type=checkbox]) {
	width: 80%;
}

@media screen and ( width <= 481px ) {
	.mc-locations .locations-container input:not([type=checkbox]) {
		width: 100%;
	}
}

.follow-me {
	overflow: hidden;
}

.recurrences .columns p:nth-of-type(1),
.recurrences .columns p:nth-of-type(2) {
	display: grid;
}

.recurrences .columns p.instance-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}

input#mc_event_endtime:invalid+span,
input#mc_event_time:invalid+span {
	display: block;
}

input#mc_event_endtime:valid+span,
input#mc_event_time:valid+span {
	display: none;
}

/* Screen reader text class to avoid overrides from core focus.*/
.mc-srt {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
	color: inherit;
}

#privacy h3 {
	font-size: 1.2em;
	margin: 1em 0 0;
}

#privacy p {
	max-width: 40rem;
}

#privacy .inside {
	padding-bottom: 2em;
}

/**
 * Autocomplete CSS
 */
.autocomplete-input {
	background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNjY2IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PGNpcmNsZSBjeD0iMTEiIGN5PSIxMSIgcj0iOCIvPjxwYXRoIGQ9Im0yMSAyMS00LTQiLz48L3N2Zz4=");
	background-position:6px;
	background-repeat:no-repeat;
	box-sizing:border-box;
	flex:1;
	font-size:16px;
	line-height:1.5;
	padding:6px 6px 6px 36px !important;position:relative;width:100%
}
.autocomplete-input:focus,.autocomplete-input[aria-expanded=true]{
	background-color:#fff;
	border-color:rgba(0,0,0,.12);
	box-shadow:0 2px 2px rgba(0,0,0,.16);
	outline:none
}
[data-position=below] .autocomplete-input[aria-expanded=true]{
	border-bottom-color:transparent;
	border-radius:8px 8px 0 0
}
[data-position=above] .autocomplete-input[aria-expanded=true]{
	border-radius:0 0 8px 8px;border-top-color:transparent;z-index:2
}
.autocomplete[data-loading=true]:after{
	animation:rotate 1s linear infinite;border:3px solid rgba(0,0,0,.12);
	border-radius:100%;border-right-color:rgba(0,0,0,.48);
	content:"";height:20px;position:absolute;right:12px;top:75%;
	transform:translateY(-50%);width:20px
}
.autocomplete-result-list{
	background:#fff;border:1px solid rgba(0,0,0,.12);box-shadow:0 2px 2px rgba(0,0,0,.16);
	box-sizing:border-box;list-style:none;margin:0;max-height:296px;overflow-y:auto;padding:0
}
.autocomplete-result-list li {
	align-items: center;
	display: flex;
	gap: 6px;
}
[data-position=below] .autocomplete-result-list{
	border-radius:0 0 8px 8px;border-top-color:transparent;margin-top:-1px;padding-bottom:0
}
[data-position=above] .autocomplete-result-list{
	border-bottom-color:transparent;border-radius:8px 8px 0 0;margin-bottom:-1px;padding-top:0
}
.autocomplete-result{
	background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjY2NjIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PGNpcmNsZSBjeD0iMTEiIGN5PSIxMSIgcj0iOCIvPjxwYXRoIGQ9Im0yMSAyMS00LTQiLz48L3N2Zz4=");
	background-position:6px;background-repeat:no-repeat;cursor:default;padding:6px 6px 6px 36px
}
.autocomplete-result:hover,.autocomplete-result[aria-selected=true]{
	background-color:rgba(0,0,0,.06);
	border-right: 4px solid;
}
@keyframes rotate{
	0%{transform:translateY(-50%) rotate(0deg)}to{transform:translateY(-50%) rotate(359deg)}
}

@media (max-width: 1140px) {
	.mc-generator-inputs {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media (max-width: 782px) {
	.mc-generator-inputs,
	.mc_permissions .mc-settings {
		grid-template-columns: repeat( 1, 1fr );
	}

	.mc-permissions-wrapper {
		grid-template-columns: repeat( 2, 50% );
	}

	.my-calendar-admin .postbox {
		margin-right: 0 !important;
	}

	.my-calendar-admin .jcd-narrow {
		width: 100%;
	}

	.jcd-wide {
		width: 100%;
	}

	#l_preset {
		width: 100%;
	}

	.my-calendar-admin .columns {
		grid-template-columns: repeat( 1, 1fr );
	}

	.recurrences .columns,
	#e_schedule .columns,
	.recurring .columns {
		display: block;
	}

	.recurrences .columns p:first-of-type,
	.recurrences .columns p:nth-of-type(2),
	#e_schedule .columns p:first-of-type,
	#e_schedule .columns p:nth-of-type(2),
	.recurring .columns p:first-of-type,
	.recurring .columns p:nth-of-type(2) {
		display: inline-block;
		margin-right: 10px;
	}
}

@media screen and ( max-width: 720px ) {
	.mc-responsive-table,
	.mc-responsive-table tbody,
	.mc-responsive-table tr,
	.mc-responsive-table td,
	.mc-responsive-table th,
	.mc-responsive-table caption {
		display: block;
		height: auto;
		min-height: 0;
	}

	.mc-responsive-table .comparison {
		display: inline;
		font-style: normal;
	}

	.mc-responsive-table.mc-contrast-table th {
		border: 2px solid;
	}

	#my-calendar-admin-table.mc-responsive-table tr > th:nth-of-type(1) {
		width: auto;
	}

	.mc-responsive-table .row-actions {
		margin-left: 0;
		margin-right: 0;
		position: static;
		left: auto;
	}

	.mc-responsive-table,
	.mc-responsive-table thead,
	.mc-responsive-table tbody,
	.mc-responsive-table caption  {
		width: 100%;
		margin: 0 auto;
		padding: 0;
	}

	.mc-responsive-table.mc-contrast-table,
	.mc-responsive-table.mc-contrast-table thead,
	.mc-responsive-table.mc-contrast-table tbody,
	.mc-responsive-table.mc-contrast-table caption  {
		width: calc( 100% - 32px );
	}

	.mc-responsive-table.mc-contrast-table td {
		padding: .5rem;
		width: auto;
		text-align: left;
		display: grid;
		grid-template-columns: 12em 1fr;
		align-items: center;
		column-gap: .5rem;
	}

	.mc-responsive-table th {
		padding: 8px 4px;
		background: rgba( 0,0,0,.05 );
	}

	.mc-responsive-table tbody th {
		font-weight: 700;
		color: #000;
	}

	.mc-responsive-table tr:nth-of-type(odd) {
		background: #fff;
	}

	.mc-responsive-table thead tr {
		display: grid;
		width: auto;
	}

	.mc-responsive-table.mc-locations-table thead tr {
		grid-template-columns: repeat( 5, minmax( 0, 1fr ) );
	}

	.mc-responsive-table.mc-groups-table thead tr {
		grid-template-columns: repeat( 7, minmax( 0, 1fr ) );
	}

	.mc-responsive-table.mc-events-table thead tr,
	.mc-responsive-table.mc-categories thead tr {
		grid-template-columns: repeat( 6, minmax( 0, 1fr ) );
	}

	.mc-responsive-table.mc-contrast-table thead {
		display: none;
	}
}

@container mcadmin ( width < 1700px ) {
	.jcd-wide:has(#my-calendar-styles) {
		width: 100%;
	}
}