/* Neutral dark theme. Zinc scale, same range as shadcn dark mode. */

html,
body,
body.xelastic,
#layout,
#layout-content,
#layout-list,
#layout-sidebar,
#layout-menu,
.scroller,
.content:not(.message-htmlpart .content):not(.message-part .content),
.formcontent,
.menu,
.popover,
.popupmenu,
.ui-dialog,
.ui-widget-content,
.listing,
.folderlist,
#mailboxlist,
#settings-menu,
#layout > div > .footer {
	background-color: #09090b !important;
	color: #fafafa !important;
	border-color: #27272a !important;
}

#layout-menu {
	border-right: 1px solid #27272a !important;
}

#layout-list,
#layout-sidebar,
#layout > div > .header,
#layout > div > .footer {
	border-color: #27272a !important;
}

body.xcolor-0075c8 div.header:not(.calendar-list-header),
body.xcolor-0075c8 div.header:not(.calendar-list-header) a,
body.xcolor-0075c8 #layout-menu .popover-header,
#layout > div > .header,
#layout-menu .popover-header,
.popover .popover-header,
html.layout-phone .popover-header,
html.layout-small .popover-header {
	background-color: #18181b !important;
	color: #fafafa !important;
	border-color: #27272a !important;
}

#layout > div > .header a.button,
.menu.toolbar a,
#taskmenu a,
.folderlist a,
.listing a,
.listing td,
.listing li,
.contactlist td,
.contactlist a {
	color: #fafafa !important;
}

#taskmenu a.selected,
#taskmenu a.selected:hover,
#taskmenu a:hover,
html.dark-mode #taskmenu a.selected {
	background: #27272a !important;
	color: #fafafa !important;
}

.listing:not(.toolbar) li,
.listing:not(.toolbar) tr,
.listing:not(.toolbar) tr td {
	background-color: #09090b !important;
	color: #fafafa !important;
}

.listing:not(.toolbar) li:hover,
.listing:not(.toolbar) tr:hover td,
.listing:not(.toolbar) li > a:hover,
.popupmenu .listing li > a:not(.disabled):hover {
	background-color: #27272a !important;
	color: #fafafa !important;
}

#layout > div > .header,
#layout > div > .header .menu.toolbar,
#layout > div > .header .menu.toolbar li,
#layout > div > .header .menu.toolbar a,
#layout > div > .header .menu.toolbar .dropbutton,
#layout > div > .header .menu.toolbar a.active,
#layout > div > .header .menu.toolbar a.selected,
#layout > div > .header a.button {
	background-color: #18181b !important;
	background: #18181b !important;
	color: #fafafa !important;
}

#layout > div > .header .menu.toolbar li:hover,
#layout > div > .header .menu.toolbar a:hover,
#layout > div > .header .menu.toolbar .dropbutton:hover,
#layout > div > .header a.button:hover {
	background-color: #27272a !important;
	background: #27272a !important;
	color: #fafafa !important;
}

.popupmenu,
.popupmenu .menu.listing,
.popupmenu .menu.listing li,
.popupmenu .menu.listing a {
	background-color: #18181b !important;
	color: #fafafa !important;
}

.popupmenu .menu.listing li:hover,
.popupmenu .menu.listing a:hover {
	background-color: #27272a !important;
	color: #fafafa !important;
}

.listing li.selected,
.listing li.selected > a,
.listing li.selected > div > a,
.listing tr.selected td,
ul.treelist li.selected > a,
ul.treelist li.selected > div > a,
.table-widget table.options-table tr.selected td,
html.dark-mode .listing li.selected,
html.dark-mode .listing tr.selected td,
body.xcolor-0075c8 #settings-menu li.selected {
	background-color: #27272a !important;
	color: #fafafa !important;
}

body.xcolor-0075c8 a:not(.message-htmlpart a):not(.message-part a),
html.dark-mode body.xcolor-0075c8 a:not(.message-htmlpart a):not(.message-part a) {
	color: #fafafa !important;
}

body.xcolor-0075c8 .btn.btn-primary:not(.message-htmlpart .btn):not(.message-part .btn),
body.xcolor-0075c8 .btn.btn-success:not(.message-htmlpart .btn):not(.message-part .btn),
body.xcolor-0075c8 .btn.btn-secondary:not(.message-htmlpart .btn):not(.message-part .btn),
body.xcolor-0075c8 .floating-action-buttons a.button,
body.xcolor-0075c8 div.tox .tox-dialog__footer .tox-button,
#rcmloginsubmit {
	background-color: #27272a !important;
	border-color: #3f3f46 !important;
	color: #fafafa !important;
}

body.xcolor-0075c8 .btn.btn-primary:not(.message-htmlpart .btn):not(.message-part .btn):hover,
body.xcolor-0075c8 .btn.btn-success:not(.message-htmlpart .btn):not(.message-part .btn):hover,
body.xcolor-0075c8 .btn.btn-secondary:not(.message-htmlpart .btn):not(.message-part .btn):hover,
body.xcolor-0075c8 .floating-action-buttons a.button:hover,
#rcmloginsubmit:hover {
	background-color: #3f3f46 !important;
	border-color: #52525b !important;
	color: #fafafa !important;
}

body.xcolor-0075c8 .custom-switch .custom-control-input:checked ~ .custom-control-label:before,
body.xcolor-0075c8 .ui-datepicker a.ui-state-active {
	background-color: #fafafa !important;
	border-color: #fafafa !important;
	color: #18181b !important;
}

.custom-switch .custom-control-label::after,
.custom-switch .custom-control-input:checked ~ .custom-control-label::after,
.custom-switch .custom-control-input:not(:checked) ~ .custom-control-label::after {
	background-color: #18181b !important;
}

body.xcolor-0075c8 .folderlist li.mailbox .unreadcount,
body.xcolor-0075c8 .folderlist li.mailbox.recent > a > .unreadcount,
.folderlist li.mailbox .unreadcount {
	background-color: #3f3f46 !important;
	color: #fafafa !important;
}

.form-control,
input.form-control,
textarea.form-control,
select.form-control,
select,
.custom-select,
.custom-file-label,
.token-input-list,
.token-input-list input,
.recipient-input,
.recipient-input input,
.input-group-text,
input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="file"]):not([type="hidden"]):not([type="image"]):not(.message-htmlpart input):not(.message-part input) {
	background-color: #27272a !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
}

select option {
	background-color: #27272a;
	color: #fafafa;
}

.form-control:focus,
input.form-control:focus,
textarea.form-control:focus,
select.form-control:focus {
	border-color: #a1a1aa !important;
	box-shadow: 0 0 0 1px #a1a1aa !important;
}

.form-control::placeholder {
	color: #a1a1aa !important;
}

.btn:not(.btn-primary):not(.btn-danger):not(.btn-success),
button.btn-secondary {
	background-color: #27272a !important;
	border-color: #3f3f46 !important;
	color: #fafafa !important;
}

.ui-widget-content a,
.menu a,
.popover a {
	color: #fafafa !important;
}

html.dark-mode body,
html.dark-mode #layout-content,
html.dark-mode #layout-list,
html.dark-mode #layout-sidebar {
	background-color: #09090b !important;
	color: #fafafa !important;
}

body.xelastic.login-page #layout-content,
html.dark-mode body.xelastic.login-page #layout-content {
	background: #18181b !important;
	background-color: #18181b !important;
	color: #fafafa !important;
	border: 1px solid #27272a !important;
	box-shadow: none !important;
}

body.xinverted-menu #layout > #layout-menu,
html.dark-mode body.xinverted-menu #layout > #layout-menu,
body.xinverted-menu #layout > #layout-menu #taskmenu .action-buttons a,
html.dark-mode body.xinverted-menu #layout > #layout-menu #taskmenu .action-buttons a {
	background-color: #09090b !important;
	color: #e4e4e7 !important;
	border-right: 1px solid #3f3f46 !important;
}

body.xinverted-menu #layout > #layout-menu #taskmenu a,
body.xinverted-menu #layout > #layout-menu #taskmenu a:before,
body.xinverted-menu #layout > #layout-menu .special-buttons a,
body.xinverted-menu #layout > #layout-menu .special-buttons a:before,
html.dark-mode body.xinverted-menu #layout > #layout-menu #taskmenu a {
	color: #e4e4e7 !important;
	background-color: transparent !important;
}

body.xinverted-menu #layout > #layout-menu #taskmenu a.selected,
body.xinverted-menu #layout > #layout-menu #taskmenu a.selected:before,
body.xinverted-menu #layout > #layout-menu #taskmenu a.selected:hover,
body.xinverted-menu #layout > #layout-menu #taskmenu a:hover,
body.xinverted-menu #layout > #layout-menu #taskmenu a:hover:before,
html.dark-mode body.xinverted-menu #layout > #layout-menu #taskmenu a.selected,
html.dark-mode body.xinverted-menu #layout > #layout-menu #taskmenu a:hover {
	background-color: #27272a !important;
	color: #fafafa !important;
}

body.xinverted-menu #layout > div > .header {
	background: #18181b !important;
	background-color: #18181b !important;
	border-color: #3f3f46 !important;
}

.listing li,
.listing:not(.messagelist) tbody td,
.listing li ul,
.popupmenu:not(#listoptions-menu),
.popupmenu:not(#listoptions-menu) ul li,
body.xinverted-menu #layout-list .searchbar,
body.xinverted-menu #layout-list .footer,
body.xinverted-menu #layout-list .scroller,
body.xinverted-menu #layout-content .iframe-wrapper,
body.xinverted-menu #layout-content .searchbar,
body.xinverted-menu #layout-content .footer,
body.xinverted-menu #layout-content .scroller,
body.xinverted-menu #layout > div.sidebar .pagenav,
body.xinverted-menu #layout > div.sidebar .scroller,
body.xinverted-menu #layout > div.sidebar .footer,
#layout > div > .header,
#layout > div > .footer,
.menu.toolbar a,
.header .buttons a.button {
	border-color: #3f3f46 !important;
}

html,
html:not(.touch) {
	scrollbar-color: #52525b #18181b !important;
}

html:not(.touch) ::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

html:not(.touch) ::-webkit-scrollbar-track,
.webkit-scroller::-webkit-scrollbar-track {
	background-color: #18181b !important;
}

html:not(.touch) ::-webkit-scrollbar-thumb,
.webkit-scroller::-webkit-scrollbar-thumb {
	background-color: #52525b !important;
	border: 2px solid #18181b !important;
	border-radius: 999px;
}

html:not(.touch) ::-webkit-scrollbar-thumb:hover,
.webkit-scroller::-webkit-scrollbar-thumb:hover {
	background-color: #71717a !important;
}

body.xelastic #layout-content *:not(.message-htmlpart):not(.message-htmlpart *):not(#messagebody):not(#messagebody *),
body.xelastic #layout-list,
body.xelastic #layout-list *,
body.xelastic #layout-sidebar,
body.xelastic #layout-sidebar *,
body.xelastic #layout-menu,
body.xelastic #layout-menu *,
body.xelastic #message-header,
body.xelastic #message-header *,
body.xelastic #message-objects,
body.xelastic #message-objects *,
body.xelastic .ui.alert,
body.xelastic .ui.alert *,
body.xelastic .popover,
body.xelastic .popover *,
body.xelastic .ui-dialog,
body.xelastic .ui-dialog *,
body.xelastic .menu,
body.xelastic .menu *,
body.xelastic .formcontent label,
body.xelastic .formcontent .title,
body.xelastic .hint,
body.xelastic .footer,
body.xelastic .quota-widget,
body.xelastic .searchbar,
body.xelastic .searchbar * {
	color: #f4f4f5 !important;
}

body.xelastic .ui.alert,
body.xelastic .ui.alert.boxwarning,
body.xelastic .ui.alert.boxinformation,
body.xelastic .ui.alert.boxerror,
body.xelastic .ui.alert.boxconfirmation,
body.xelastic #remote-objects-message {
	background-color: #27272a !important;
	border-color: #3f3f46 !important;
	color: #f4f4f5 !important;
}

body.xelastic .message-htmlpart,
body.xelastic .message-part {
	background-color: #fff !important;
	color: #000;
}

body.xelastic .message-htmlpart a,
body.xelastic .message-part a {
	color: revert;
}

#layout #xsidebar,
#xsidebar,
#xsidebar-inner,
#xsidebar .box-wrap,
#xsidebar .box-content,
#xsidebar .content-container,
#xsidebar h2.boxtitle,
#xsidebar .listbox {
	background-color: #09090b !important;
	color: #f4f4f5 !important;
	border-color: #3f3f46 !important;
}

#xsidebar h2.boxtitle,
#xsidebar h2.boxtitle .sidebar-title-text,
#xsidebar h2.boxtitle .sidebar-title-button,
#xsidebar .content-container,
#xsidebar .box-content,
#xsidebar .box-content * {
	color: #f4f4f5 !important;
}

.ui-dialog .ui-dialog-titlebar,
.ui-dialog .ui-widget-header,
.popover-header,
div.tox .tox-dialog__header {
	background-color: #18181b !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
}

.ui-dialog .ui-dialog-title,
.ui-dialog .ui-dialog-titlebar-close,
.ui-dialog .ui-dialog-titlebar-close:before,
div.tox .tox-dialog__header .tox-button,
div.tox .tox-dialog__header .tox-button:before,
.ui-dialog .ui-dialog-titlebar button:before {
	color: #fafafa !important;
	background-color: transparent !important;
}

button:not(.message-htmlpart button):not(.message-part button),
.btn:not(.message-htmlpart .btn):not(.message-part .btn),
a.btn:not(.message-htmlpart a):not(.message-part a),
input[type="button"]:not(.message-htmlpart input):not(.message-part input),
input[type="submit"]:not(.message-htmlpart input):not(.message-part input),
input[type="reset"]:not(.message-htmlpart input):not(.message-part input),
.ui-dialog .ui-dialog-buttonpane button,
.ui-dialog .ui-dialog-buttonpane a.btn,
.ui-dialog .ui-dialog-buttonpane .btn,
div.tox .tox-dialog__footer .tox-button,
#rcmloginsubmit,
body.xelastic .btn-primary:not(.message-htmlpart .btn):not(.message-part .btn),
body.xelastic .btn-secondary:not(.message-htmlpart .btn):not(.message-part .btn),
body.xelastic .btn-success:not(.message-htmlpart .btn):not(.message-part .btn),
body.xelastic .ui.alert a.btn {
	background-color: #27272a !important;
	border-color: #3f3f46 !important;
	color: #fafafa !important;
}

body.xelastic .btn-primary:not(.message-htmlpart .btn):not(.message-part .btn) *,
body.xelastic .btn-secondary:not(.message-htmlpart .btn):not(.message-part .btn) *,
body.xelastic .btn-success:not(.message-htmlpart .btn):not(.message-part .btn) *,
body.xelastic #rcmloginsubmit *,
body.xelastic .ui.alert a.btn * {
	color: #fafafa !important;
	background-color: transparent !important;
	border-color: transparent !important;
}

button:not(.message-htmlpart button):not(.message-part button):hover,
.btn:not(.message-htmlpart .btn):not(.message-part .btn):hover,
a.btn:not(.message-htmlpart a):not(.message-part a):hover,
input[type="submit"]:not(.message-htmlpart input):not(.message-part input):hover,
#rcmloginsubmit:hover,
.ui-dialog .ui-dialog-buttonpane button:hover,
div.tox .tox-dialog__footer .tox-button:hover {
	background-color: #3f3f46 !important;
	border-color: #52525b !important;
	color: #fafafa !important;
}

#layout-menu #taskmenu a,
html.layout-phone #layout-menu #taskmenu a,
html.layout-small #layout-menu #taskmenu a,
html.layout-phone #layout-menu.popover,
html.layout-small #layout-menu.popover,
html.layout-phone .popover:not(.select-menu) .listing li,
html.layout-small .popover:not(.select-menu) .listing li,
#layout-menu .popover-header,
html.layout-phone .popover-header,
html.layout-small .popover-header,
#layout-menu #taskmenu .special-buttons,
#layout-menu #taskmenu .action-buttons {
	border-color: #3f3f46 !important;
	box-shadow: none !important;
}

#layout-menu #taskmenu a {
	border-bottom: 1px solid #3f3f46 !important;
}

#layout-menu .popover-header {
	border-bottom: 1px solid #3f3f46 !important;
	background-color: #18181b !important;
}

#layout-menu #taskmenu .special-buttons {
	border-top: 1px solid #3f3f46 !important;
	background-color: #09090b !important;
}

#message-buttons,
#message-buttons.ui.alert,
#message-objects .ui.alert,
body.xelastic #message-buttons.ui.alert.boxinformation {
	background-color: #27272a !important;
	color: #f4f4f5 !important;
	border-color: #3f3f46 !important;
}

#message-buttons a.btn,
#message-buttons a.btn.btn-primary,
#message-objects .ui.alert a.btn,
#message-objects .ui.alert .btn,
body.xelastic .ui.alert a.btn.btn-primary,
body.xcolor-0075c8 .ui.alert a.btn.btn-primary.btn-sm {
	background: #27272a !important;
	background-color: #27272a !important;
	background-image: none !important;
	border: 1px solid #52525b !important;
	color: #fafafa !important;
	box-shadow: none !important;
}

#message-buttons a.btn:hover,
#message-objects .ui.alert a.btn:hover,
body.xelastic .ui.alert a.btn.btn-primary:hover {
	background: #3f3f46 !important;
	background-color: #3f3f46 !important;
	color: #fafafa !important;
}

.col-form-label,
.compose-headers label,
.input-group-text,
.input-group-text:before,
.input-group-text.icon:before {
	color: #fafafa !important;
}

.recipient-input li.recipient {
	background-color: #3f3f46 !important;
	border-color: #52525b !important;
	color: #fafafa !important;
}

.recipient-input li.recipient a,
.recipient-input li.recipient a.button {
	color: #fafafa !important;
}

div.tox.tox-tinymce,
div.tox .tox-editor-container,
div.tox .tox-editor-header,
div.tox .tox-toolbar,
div.tox .tox-toolbar__primary,
div.tox .tox-toolbar__overflow,
div.tox .tox-toolbar-overlord,
div.tox .tox-toolbar-overlord > div,
div.tox .tox-edit-area,
div.tox .tox-edit-area__iframe,
div.tox .tox-sidebar-wrap,
.html-editor,
.html-editor .editor-toolbar {
	background-color: #27272a !important;
	background-image: none !important;
	border-color: #3f3f46 !important;
	color: #fafafa !important;
}

div.tox .tox-tbtn,
div.tox .tox-tbtn__select-label,
div.tox .tox-tbtn svg,
.html-editor .editor-toolbar .mce-i-html {
	color: #fafafa !important;
	fill: #fafafa !important;
	background-color: transparent !important;
}

div.tox .tox-tbtn:hover,
div.tox .tox-tbtn--enabled,
.html-editor .editor-toolbar .mce-i-html:hover {
	background-color: #3f3f46 !important;
}

.popupmenu,
.popupmenu .listing,
.popupmenu .listing li,
.popupmenu .listing a,
.menu.popupmenu,
.dropdown-menu,
div.tox.tox-tinymce-aux,
div.tox .tox-menu,
div.tox .tox-collection,
div.tox .tox-collection__group,
div.tox .tox-pop__dialog,
div.tox.tox-tinymce-aux .tox-toolbar__overflow,
div.tox .tox-swatches,
div.tox .tox-dialog,
div.tox .tox-dialog__header,
div.tox .tox-dialog__body,
div.tox .tox-dialog__footer {
	background: #18181b !important;
	background-color: #18181b !important;
	background-image: none !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
	box-shadow: none !important;
}

.popupmenu .listing li > a,
.popupmenu .listing a,
div.tox .tox-collection__item,
div.tox .tox-collection__item-label,
div.tox .tox-collection__item-icon,
div.tox .tox-menu .tox-collection__item,
div.tox .tox-collection__item svg {
	background-color: transparent !important;
	color: #fafafa !important;
	fill: #fafafa !important;
}

.popupmenu .listing li:hover,
.popupmenu .listing li > a:hover,
.popupmenu .listing li.selected,
.popupmenu .listing li > a:not(.disabled):hover,
div.tox .tox-collection__item--active,
div.tox .tox-collection__item--enabled,
div.tox .tox-collection__item:hover {
	background-color: #27272a !important;
	color: #fafafa !important;
}

.popover,
.popupmenu,
div.tox .tox-menu,
div.tox .tox-pop__dialog,
div.tox .tox-collection,
div.tox.tox-tinymce-aux .tox-toolbar__overflow {
	box-shadow: none !important;
	border-color: #3f3f46 !important;
}

.popover,
.popover .popover-header,
.popover .popover-body {
	background-color: #18181b !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
}

.popover .arrow::before,
.popover .arrow::after,
.bs-popover-auto[x-placement^="bottom"] > .arrow::before,
.bs-popover-bottom > .arrow::before,
.bs-popover-auto[x-placement^="bottom"] > .arrow::after,
.bs-popover-bottom > .arrow::after {
	border-top-color: transparent !important;
	border-bottom-color: #18181b !important;
}

.bs-popover-auto[x-placement^="top"] > .arrow::before,
.bs-popover-top > .arrow::before,
.bs-popover-auto[x-placement^="top"] > .arrow::after,
.bs-popover-top > .arrow::after {
	border-bottom-color: transparent !important;
	border-top-color: #18181b !important;
}

.bs-popover-auto[x-placement^="left"] > .arrow::before,
.bs-popover-left > .arrow::before,
.bs-popover-auto[x-placement^="left"] > .arrow::after,
.bs-popover-left > .arrow::after {
	border-right-color: transparent !important;
	border-left-color: #18181b !important;
}

.bs-popover-auto[x-placement^="right"] > .arrow::before,
.bs-popover-right > .arrow::before,
.bs-popover-auto[x-placement^="right"] > .arrow::after,
.bs-popover-right > .arrow::after {
	border-left-color: transparent !important;
	border-right-color: #18181b !important;
}

.bs-popover-bottom .popover-header::before,
.bs-popover-auto[x-placement^="bottom"] .popover-header::before {
	border-bottom-color: #18181b !important;
}

body.xelastic .btn.btn-secondary:not(.message-htmlpart .btn):not(.message-part .btn),
body.xelastic button.btn.btn-secondary:not(.message-htmlpart button):not(.message-part button),
body.xelastic .btn.btn-secondary:not(.btn-danger):not(.xanchor):not(.message-htmlpart .btn):not(.message-part .btn),
body.xcolor-0075c8 .btn.btn-secondary:not(.btn-danger):not(.xanchor):not(.message-htmlpart .btn):not(.message-part .btn),
body.xelastic .ui-dialog-buttonpane .ui-dialog-buttonset .btn,
body.xelastic .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-secondary,
button.cancel.btn.btn-secondary {
	background: #27272a !important;
	background-color: #27272a !important;
	border: 1px solid #3f3f46 !important;
	border-color: #3f3f46 !important;
	color: #fafafa !important;
	box-shadow: none !important;
}

body.xelastic .btn.btn-secondary:not(.message-htmlpart .btn):not(.message-part .btn):hover,
body.xelastic button.cancel.btn.btn-secondary:hover,
body.xelastic .ui-dialog-buttonpane .ui-dialog-buttonset .btn:hover {
	background: #3f3f46 !important;
	background-color: #3f3f46 !important;
	border-color: #52525b !important;
	color: #fafafa !important;
}

.searchbar,
.searchbar.menu,
body.xinverted-menu .searchbar {
	background-color: #09090b !important;
	border-color: #27272a !important;
}

body.xelastic #layout .searchbar input,
body.xelastic #layout .searchbar input.no-bs,
#searchform,
#mailsearchform,
input.no-bs {
	background: #09090b !important;
	background-color: #09090b !important;
	color: #fafafa !important;
	border-color: #27272a !important;
}

.searchbar input::placeholder,
#searchform::placeholder {
	color: #a1a1aa !important;
}

.searchbar a,
.searchbar a .inner,
.searchbar form:before {
	color: #fafafa !important;
}

#layout-menu #taskmenu a span.inner,
#taskmenu a:hover span.inner,
#taskmenu a.logout span.inner {
	background: #27272a !important;
	background-color: #27272a !important;
	color: #fafafa !important;
	border: 1px solid #3f3f46 !important;
	box-shadow: none !important;
}

#layout-menu .popover-header img,
#layout-menu #logo {
	filter: brightness(0) invert(1) !important;
}

body.xcolor-0075c8 #xsidebar,
body.xcolor-0075c8 #xsidebar.uibox.listbox,
#xsidebar,
#xsidebar-inner,
#xsidebar .box-wrap,
#xsidebar .box-wrap.listbox,
#xsidebar .box-content,
#xsidebar .content-container,
#xcalendar-todays-agenda,
#xcalendar-todays-agenda .content-container {
	background: #09090b !important;
	background-color: #09090b !important;
	color: #e4e4e7 !important;
	border-color: #3f3f46 !important;
	box-shadow: none !important;
}

body.xcolor-0075c8 #xsidebar .header,
body.xcolor-0075c8 #xsidebar .header .menu.toolbar,
body.xcolor-0075c8 #xsidebar .header .menu.toolbar li,
body.xcolor-0075c8 #xsidebar .header .menu.toolbar a,
body.xcolor-0075c8 #xsidebar .header .menu.toolbar a .inner,
body.xcolor-0075c8 #xsidebar h2.boxtitle,
#xsidebar .header,
#xsidebar h2.boxtitle,
html.touch body.xsidebar-mobile-visible #xsidebar,
html.touch body.xsidebar-mobile-visible #xsidebar #xsidebar-mobile-header {
	background: #18181b !important;
	background-color: #18181b !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
	box-shadow: none !important;
}

#layout #xsidebar,
#xsidebar-inner,
#layout #xsidebar h2.boxtitle,
#xsidebar h2.boxtitle,
#xsidebar .header,
#xsidebar .listing li,
#xsidebar .listing li a {
	border-color: #3f3f46 !important;
	border-bottom-color: #3f3f46 !important;
	border-left-color: #3f3f46 !important;
	border-top-color: #3f3f46 !important;
}

#xsidebar .header .menu.toolbar li,
#xsidebar .header .menu.toolbar a,
#xsidebar .header .menu.toolbar a:before {
	height: auto !important;
	min-height: 0 !important;
	line-height: 1.2 !important;
	background-color: transparent !important;
	color: #fafafa !important;
}

#xsidebar .header .menu.toolbar a {
	min-width: 36px !important;
	max-width: none !important;
	padding: 8px !important;
}

#xsidebar-menu a .inner {
	display: none !important;
}

#xsidebar .header .menu.toolbar a:hover,
#xsidebar .header .menu.toolbar a:hover:before,
#xsidebar h2.boxtitle:hover {
	background-color: #27272a !important;
	color: #fafafa !important;
}

#xsidebar h2.boxtitle {
	font-size: 13px !important;
	font-weight: 500 !important;
	letter-spacing: 0.01em;
	padding: 10px 12px !important;
}

#xsidebar h2.boxtitle .sidebar-title-text,
#xsidebar h2.boxtitle .sidebar-title-button,
#xsidebar h2.boxtitle .sidebar-title-button:before,
#xsidebar .sidebar-toggle:before,
#xsidebar .sidebar-settings-url:before,
#xsidebar-menu a:before,
#xsidebar-mobile-header,
#xsidebar-mobile-header a,
#xsidebar-mobile-header a:before {
	color: #fafafa !important;
}

#xsidebar .content-container,
#xsidebar .box-content,
#xsidebar .box-content a,
#xsidebar .box-content td {
	color: #a1a1aa !important;
	border-color: #3f3f46 !important;
}

#xsidebar .placeholder,
#xsidebar div.ui-sortable-helper {
	background: #27272a !important;
	background-color: #27272a !important;
	border-color: #3f3f46 !important;
}

body.xelastic #layout-content #attachment-list,
body.xelastic #layout-content #attachment-list.attachmentslist,
body.xelastic #layout-content .leftcol,
body.xelastic #layout-content #attachment-list li,
body.xelastic #layout-content #attachment-list li a,
body.xelastic #layout-content #attachment-list li a.filename,
body.xelastic #layout-content #attachment-list .attachment-name,
body.xelastic #layout-content #attachment-list li:before,
body.xelastic #layout-content #attachment-list a.button,
body.xelastic #layout-content #attachment-list a.dropdown {
	background-color: #18181b !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
}

body.xelastic #messagelist tbody td,
body.xelastic #messagelist-fixedcopy tbody td {
	border-left-width: 0 !important;
	border-left-color: transparent !important;
	border-bottom: 1px solid #3f3f46 !important;
}

body.xelastic #layout-content #attachment-list .attachment-size {
	background-color: transparent !important;
	color: #a1a1aa !important;
}

body.xelastic #messagelist-content > .relabs-list-loading {
	position: absolute;
	inset: 0;
	z-index: 2;
	background: #09090b;
	overflow: hidden;
	pointer-events: none;
}

body.xelastic #messagelist-content > .relabs-list-loading[hidden] {
	display: none !important;
}

body.xelastic .relabs-list-card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 4.5rem;
	grid-template-rows: 0.7rem 0.7rem;
	gap: 0.55rem 1rem;
	align-content: center;
	height: 4.25rem;
	padding: 0 1rem 0 1.25rem;
	border-bottom: 1px solid #3f3f46;
	box-sizing: border-box;
}

body.xelastic .relabs-list-bar {
	display: block;
	height: 0.55rem;
	border-radius: 999px;
	background: linear-gradient(90deg, #27272a 0%, #3f3f46 45%, #27272a 100%);
	background-size: 220% 100%;
	animation: relabs-list-shimmer 1.15s ease-in-out infinite;
}

body.xelastic .relabs-list-bar.sender {
	width: 38%;
}

body.xelastic .relabs-list-bar.meta {
	width: 100%;
	height: 0.45rem;
	justify-self: end;
}

body.xelastic .relabs-list-bar.subject {
	width: 62%;
	grid-column: 1 / -1;
}

body.xelastic .relabs-list-card:nth-child(2) .sender { width: 52%; }
body.xelastic .relabs-list-card:nth-child(3) .sender { width: 28%; }
body.xelastic .relabs-list-card:nth-child(4) .sender { width: 44%; }
body.xelastic .relabs-list-card:nth-child(5) .sender { width: 33%; }
body.xelastic .relabs-list-card:nth-child(2) .subject { width: 78%; }
body.xelastic .relabs-list-card:nth-child(3) .subject { width: 48%; }
body.xelastic .relabs-list-card:nth-child(4) .subject { width: 70%; }
body.xelastic .relabs-list-card:nth-child(6) .subject { width: 55%; }
body.xelastic .relabs-list-card:nth-child(8) .subject { width: 84%; }

@keyframes relabs-list-shimmer {
	0% { background-position: 100% 0; }
	100% { background-position: -100% 0; }
}

@media (prefers-reduced-motion: reduce) {
	body.xelastic .relabs-list-bar {
		animation: none;
	}
}

body.task-xcalendar #layout-content,
body.task-xcalendar #sidebar-calendar,
body.task-xcalendar #sidebar-calendar .ui-datepicker,
body.task-xcalendar #sidebar-calendar .ui-datepicker table,
body.task-xcalendar #sidebar-calendar .ui-datepicker td,
body.task-xcalendar #sidebar-calendar .ui-datepicker th,
body.task-xcalendar #calendar-list-container,
body.task-xcalendar #calendar-list-content,
body.task-xcalendar #calendar-list-container .calendar-item,
body.task-xcalendar #calendar-list-container .calendar-item a.title {
	background-color: #09090b !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
}

body.task-xcalendar #sidebar-calendar .ui-datepicker-header,
body.task-xcalendar #sidebar-calendar .ui-widget-header,
body.task-xcalendar #calendar-list-container > .header,
body.task-xcalendar #calendar-list-container .calendar-list-header {
	background-color: #18181b !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
	border-top: 1px solid #3f3f46 !important;
	border-bottom: 1px solid #3f3f46 !important;
	box-shadow: none !important;
}

body.task-xcalendar #sidebar-calendar .ui-datepicker td,
body.task-xcalendar #sidebar-calendar .ui-datepicker th {
	border-width: 0 !important;
}

body.task-xcalendar #sidebar-calendar .ui-datepicker th,
body.task-xcalendar #sidebar-calendar .ui-datepicker .ui-priority-secondary {
	color: #a1a1aa !important;
}

body.task-xcalendar #sidebar-calendar .ui-datepicker td a,
body.task-xcalendar #sidebar-calendar .ui-datepicker .ui-state-default {
	background: transparent !important;
	background-color: transparent !important;
	color: #fafafa !important;
	border-color: transparent !important;
}

body.task-xcalendar.xelastic #layout-content #sidebar-calendar a.ui-state-active,
body.task-xcalendar.xelastic #layout-content #sidebar-calendar a.ui-state-highlight,
body.task-xcalendar.xelastic #layout-content #sidebar-calendar .ui-state-active {
	background-color: #3f3f46 !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
}

body.task-xcalendar #calendar-list-container .calendar-item a.title .name,
body.task-xcalendar #calendar-list-container .calendar-item .edit {
	color: #fafafa !important;
	background-color: transparent !important;
}

body.task-xcalendar #calendar-grid {
	--fc-page-bg-color: #09090b;
	--fc-neutral-bg-color: #18181b;
	--fc-border-color: #3f3f46;
	--fc-today-bg-color: #18181b;
	--fc-now-indicator-color: #e4e4e7;
	--fc-list-event-hover-bg-color: #27272a;
	--fc-highlight-color: rgba(63, 63, 70, 0.55);
	background-color: #09090b !important;
	color: #fafafa !important;
}

body.task-xcalendar #calendar-grid .fc-scrollgrid,
body.task-xcalendar #calendar-grid .fc-scrollgrid table,
body.task-xcalendar #calendar-grid .fc-view,
body.task-xcalendar #calendar-grid .fc-scroller,
body.task-xcalendar #calendar-grid .fc-timegrid-body,
body.task-xcalendar #calendar-grid .fc-daygrid-body {
	background-color: #09090b !important;
	border-color: #3f3f46 !important;
}

body.task-xcalendar #calendar-grid .table-bordered td,
body.task-xcalendar #calendar-grid .table-bordered th,
body.task-xcalendar #calendar-grid .fc td,
body.task-xcalendar #calendar-grid .fc th {
	border-style: solid !important;
	border-color: #3f3f46 !important;
	border-width: 1px 0 0 1px !important;
	background-color: #09090b !important;
	color: #a1a1aa !important;
}

body.task-xcalendar #calendar-grid .fc-col-header-cell,
body.task-xcalendar #calendar-grid .fc-col-header-cell-cushion,
body.task-xcalendar #calendar-grid .fc-scrollgrid-section-header td,
body.task-xcalendar #calendar-grid .fc-scrollgrid-section-header th,
body.task-xcalendar #calendar-grid .fc-scrollgrid-section-sticky > *,
body.task-xcalendar #calendar-grid .fc-toolbar-title {
	background-color: #18181b !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
}

body.task-xcalendar #calendar-grid td.fc-day-today,
body.task-xcalendar #calendar-grid th.fc-day-today,
body.task-xcalendar #calendar-grid .fc-timegrid-col.fc-day-today,
body.task-xcalendar #calendar-grid .fc-daygrid-day.fc-day-today {
	background-color: #18181b !important;
}

body.task-xcalendar #calendar-grid .fc-timegrid-divider,
body.task-xcalendar #calendar-grid .fc-timegrid-divider.table-active {
	background-color: #27272a !important;
	border-color: #3f3f46 !important;
	padding: 0 !important;
	height: 1px !important;
}

body.task-xcalendar .editor,
body.task-xcalendar .editor .content-box,
body.task-xcalendar .editor .formcontent,
body.task-xcalendar .editor .formbuttons,
body.task-xcalendar .editor .tab-pane,
body.task-xcalendar .editor .ui-tabs,
body.task-xcalendar .editor .ui-widget-content,
body.task-xcalendar .editor .ui-widget-header,
body.task-xcalendar .editor .nav-tabs,
body.task-xcalendar .editor .nav-tabs .nav-link,
body.task-xcalendar #event-preview,
body.task-xcalendar .xdialog-box {
	background-color: #18181b !important;
	color: #fafafa !important;
	border-color: #3f3f46 !important;
	box-shadow: none !important;
}

body.task-xcalendar .editor th,
body.task-xcalendar .editor td,
body.task-xcalendar .editor .table,
body.task-xcalendar .editor .thead-default th {
	background-color: transparent !important;
	color: #f4f4f5 !important;
	border-color: #3f3f46 !important;
}
