/*
 * Linux360-Farben fuer Roundcube (Elastic-Skin).
 * Teil 1 ist erzeugt (build-css.js): nur die Deklarationen, die sich durch die
 * Linux360-Variablen aendern. Teil 2 ist von Hand: Anmeldeseite, Cloud-Knopf.
 * Elastic steht unter CC BY-SA 3.0, dieses Overlay ebenfalls.
 */

/* ---- Teil 1: erzeugt ---- */
a {
  color: #2563eb
}
a:hover {
  color: #134cca
}
@media screen and (min-width: 481px) {
  #layout-menu .popover-header {
    background-color: #0e1c2e !important
  }
}
@media screen and (min-width: 481px) {
  #layout-menu {
    background-color: #0e1c2e
  }
}
#rcmdraglayer {
  background-color: #0e1c2e
}
p.image-attachment {
  background-color: rgba(59, 130, 246, 0.05)
}
.quota-widget .value {
  background-color: #3b82f6
}
.image-tools {
  background-color: rgba(59, 130, 246, 0.4)
}
.image-tools a:focus,
.image-tools a:hover {
  background-color: rgba(59, 130, 246, 0.5) !important
}
.table-widget table.options-table tr.selected td {
  background-color: #ebf3fe
}
.floating-action-buttons a.button {
  background: #3b82f6;
  box-shadow: 0 0 5px 5px #e6effe
}
.btn:focus {
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.3)
}
.btn-link {
  color: #2563eb
}
.btn-primary {
  background: #3b82f6;
  border-color: #3b82f6
}
.btn-primary:focus {
  background: #2372f5;
  border-color: #196cf4;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.5)
}
.btn-primary:hover {
  background: #2372f5;
  border-color: #196cf4
}
.btn-primary.disabled,
.btn-primary:disabled {
  background: #3b82f6;
  border-color: #3b82f6
}
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
  background: #0b63f3;
  border-color: #0b5fe9
}
.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus {
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.53)
}
.ui-menu .ui-state-active {
  background-color: #3b82f6 !important
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link:focus {
  background-color: rgba(59, 130, 246, 0.5)
}
.ui-slider .ui-slider-range {
  background: #cddffd
}
.ui-slider .ui-slider-handle.ui-state-active {
  background: #3b82f6;
  border-color: #132238
}
.ui-datepicker .ui-datepicker-days-cell-over a,
.ui-datepicker .ui-datepicker-days-cell-over a.ui-state-default,
.ui-datepicker .ui-state-highlight,
.ui-datepicker.ui-widget-content .ui-state-highlight {
  background: #cddffd;
  color: #3b82f6
}
.ui-datepicker a.ui-state-active {
  background: #3b82f6 !important
}
html.layout-small .popover-header,
html.layout-phone .popover-header {
  background-color: #132238
}
.popover .menu li a:not(.disabled):hover {
  background-color: #3b82f6
}
.popover .menu .dropbutton a.dropdown:hover {
  background-color: #3b82f6
}
@media screen and (min-width: 481px) {
  #taskmenu a.selected {
    background: #1a2d48
  }
  #taskmenu a.selected:hover {
    background: #1a2d48
  }
  #taskmenu a:hover {
    background: #1a2d48
  }
  #taskmenu .special-buttons {
    background-color: #0e1c2e
  }
  #taskmenu .action-buttons a {
    color: #7fb0ff
  }
  #taskmenu .action-buttons a:hover {
    color: #a5c8ff;
    background: #1a2d48
  }
}
@media screen and (min-width: 1025px) {
  #taskmenu a:focus {
    background-color: #1a2d48
  }
}
.ui.alert {
  background-color: rgba(59, 130, 246, 0.05)
}
.ui.alert a:not(.btn) {
  color: #3b82f6
}
.ui.alert.boxinformation {
  background-color: rgba(59, 130, 246, 0.2)
}
#messagestack .alert-info.information {
  background-color: #3b82f6
}
.listing li.selected,
.listing tr.selected td {
  background-color: #ebf3fe
}
html:not(.touch) .listing li > a:focus,
html:not(.touch) .listing.focus tbody tr.focused > td:first-child,
html:not(.touch) .listing.focus:not(.withselection) tbody tr.focused > td.selection + td {
  border-left: 2px solid #9dc0fa
}
.popupmenu .listing li > a:not(.disabled):hover {
  background-color: #3b82f6
}
.popupmenu .listing li.selected {
  background-color: #3b82f6
}
ul.treelist li.selected > div > a,
ul.treelist li.selected > a {
  background-color: #ebf3fe
}
.folderlist li.mailbox .unreadcount {
  background: #3b82f6
}
.folderlist li.mailbox.recent > a {
  color: #094fc2
}
.folderlist li.mailbox.recent > a > .unreadcount {
  background: #3b82f6
}
.formcontent.raweditor .CodeMirror-focused {
  border-color: #3b82f6;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25)
}
.input-group a:focus {
  background-color: rgba(59, 130, 246, 0.25)
}
.multi-input > .content.focused {
  border-color: #3b82f6;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25)
}
.recipient-input.focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25)
}
.tagedit-list[tabindex="-1"] {
  border-color: #3b82f6;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25)
}
.form-control:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25)
}
.input-group-text input:focus {
  border-color: #3b82f6 !important
}
.custom-switch .custom-control-input:focus ~ .custom-control-label:before {
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25)
}
.custom-switch .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
  border-color: #3b82f6
}
.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
  border-color: #3b82f6;
  background-color: #3b82f6
}
.custom-switch .custom-control-input:checked:disabled ~ .custom-control-label::before {
  border-color: #84b1f9;
  background-color: #84b1f9
}
.custom-file-input:focus ~ .custom-file-label {
  border-color: #3b82f6;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25)
}
div.tox.focused {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25) !important
}
div.tox .tox-dialog .tox-dialog__body-nav-item--active {
  color: #2563eb
}
div.tox .tox-dialog .tox-dialog__body-nav-item--active:hover {
  color: #134cca
}
div.tox .tox-dialog__footer .tox-button {
  background: #3b82f6;
  border-color: #3b82f6
}
div.tox .tox-dialog__footer .tox-button:focus {
  background: #2372f5;
  border-color: #196cf4;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.5)
}
div.tox .tox-dialog__footer .tox-button:hover {
  background: #2372f5;
  border-color: #196cf4
}
div.tox .tox-dialog__footer .tox-button.disabled,
div.tox .tox-dialog__footer .tox-button:disabled {
  background: #3b82f6;
  border-color: #3b82f6
}
div.tox .tox-dialog__footer .tox-button:not(:disabled):not(.disabled):active,
div.tox .tox-dialog__footer .tox-button:not(:disabled):not(.disabled).active {
  background: #0b63f3;
  border-color: #0b5fe9
}
div.tox .tox-dialog__footer .tox-button:not(:disabled):not(.disabled):active:focus,
div.tox .tox-dialog__footer .tox-button:not(:disabled):not(.disabled).active:focus {
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.53)
}
div.tox .tox-dialog__footer .tox-button:focus:not(:disabled) {
  background: #3b82f6;
  border-color: #3b82f6
}
div.tox .tox-color-input > input:focus,
div.tox .tox-listboxfield .tox-listbox--select:focus,
div.tox .tox-textarea:focus,
div.tox .tox-textfield:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25)
}
.image-selector .attachmentslist li:hover,
.image-selector .attachmentslist li:focus {
  background: #ebf3fe
}
.googie_list li.googie_list_onhover {
  background-color: #3b82f6
}
.message-part blockquote,
.message-htmlpart blockquote {
  color: #073b91;
  border-left: 2px solid #073b91;
  border-right: 2px solid #073b91
}
html.dark-mode {
  scrollbar-color: #45597a #132238
}
html.dark-mode:not(.touch) ::-webkit-scrollbar-track {
  background-color: #132238
}
html.dark-mode:not(.touch) ::-webkit-scrollbar-thumb {
  background-color: #45597a
}
html.dark-mode body {
  color: #d4dbe4;
  background-color: #0e1c2e
}
html.dark-mode #layout-list,
html.dark-mode #layout-content,
html.dark-mode #layout-sidebar,
html.dark-mode #layout > div > .header,
html.dark-mode #layout > div > .footer,
html.dark-mode .popup .listbox .footer,
html.dark-mode .menu.pagenav.pagenav-list,
html.dark-mode .menu.pagenav.pagenav-list + .navlist,
html.dark-mode .menu.pagenav.pagenav-list.expanded + .navlist {
  border-color: #2a3f5c
}
html.dark-mode #layout > div > .header a.button,
html.dark-mode #layout > div > .footer a.button {
  color: #d4dbe4
}
html.dark-mode #layout-menu {
  border-right: 1px solid #2a3f5c
}
@media screen and (max-width: 480px) {
  html.dark-mode #layout-menu .popover-header {
    border-bottom: 1px solid #2a3f5c
  }
}
html.dark-mode #layout-menu .special-buttons a:not(:focus) {
  background: #0e1c2e
}
html.dark-mode.layout-phone #layout-menu {
  background: #132238
}
html.dark-mode .searchbar {
  border-color: #2a3f5c
}
html.dark-mode #messagestack div {
  color: #d4dbe4
}
html.dark-mode #messagestack div i.icon:before {
  color: #d4dbe4
}
html.dark-mode .ui.alert.boxinformation,
html.dark-mode #messagestack .alert-info {
  background-color: #234e94
}
html.dark-mode #messagestack .loading {
  background-color: #1a2d48
}
html.dark-mode .ui.alert.boxinformation,
html.dark-mode .ui.alert.boxerror,
html.dark-mode .ui.alert.boxwarning,
html.dark-mode .ui.alert.boxconfirmation {
  color: #d4dbe4
}
html.dark-mode .ui.alert.boxinformation i.icon:before,
html.dark-mode .ui.alert.boxerror i.icon:before,
html.dark-mode .ui.alert.boxwarning i.icon:before,
html.dark-mode .ui.alert.boxconfirmation i.icon:before {
  color: #d4dbe4
}
html.dark-mode .ui.alert a:not(.btn) {
  color: #d4dbe4
}
html.dark-mode .iframe-loader {
  background-color: rgba(14, 28, 46, 0.9)
}
html.dark-mode .iframe-loader .spinner-border {
  color: #8699b3;
  border-color: currentColor #475a72 currentColor currentColor
}
html.dark-mode #taskmenu a,
html.dark-mode .menu.toolbar a {
  color: #d4dbe4
}
html.dark-mode #taskmenu a.selected,
html.dark-mode .menu.toolbar a.selected {
  background-color: #1a2d48
}
html.dark-mode #taskmenu .action-buttons a {
  color: #3b82f6
}
@media screen and (max-width: 480px) {
  html.dark-mode #taskmenu a {
    border-color: #18283f !important
  }
}
html.dark-mode.layout-small .popover,
html.dark-mode.layout-phone .popover {
  border-left: 1px solid #2a3f5c
}
html.dark-mode.layout-small .popover:not(.select-menu) .listing li:last-child,
html.dark-mode.layout-phone .popover:not(.select-menu) .listing li:last-child {
  border-color: #18283f
}
html.dark-mode.layout-small .popover-header,
html.dark-mode.layout-phone .popover-header {
  background: #132238;
  border-bottom: 1px solid #2a3f5c
}
html.dark-mode #taskmenu a:hover,
html.dark-mode .popupmenu .listing li > a:not(.disabled):hover,
html.dark-mode .header a.button.icon:not(.disabled):focus,
html.dark-mode .header a.button.icon:not(.disabled):hover,
html.dark-mode .menu.toolbar .dropbutton:not(.disabled):hover,
html.dark-mode .menu a:not(.disabled):focus,
html.dark-mode .menu a:not(.disabled):hover {
  background-color: #1a2d48
}
html.dark-mode .menu.toolbar .dropbutton a.dropdown:hover {
  background-color: #21395b
}
html.dark-mode .proplist li.with-sublist > a.dropdown,
html.dark-mode .listing tbody td,
html.dark-mode .listing tbody td a,
html.dark-mode .listing li a {
  color: #d4dbe4
}
html.dark-mode .listing li ul,
html.dark-mode .listing tbody td,
html.dark-mode .listing li {
  border-color: #18283f
}
html.dark-mode .listing li.selected,
html.dark-mode .listing li.selected > a,
html.dark-mode .listing li.selected > div > a,
html.dark-mode .listing tr.selected td {
  color: #a5c8ff;
  background-color: #1a2d48
}
html.dark-mode .listing li.selected ul {
  background-color: #0e1c2e
}
html.dark-mode .listing li.selected ul div.treetoggle {
  color: #d4dbe4
}
html.dark-mode .listing li.disabled,
html.dark-mode .listing tr.disabled td {
  color: #66758f
}
html.dark-mode .messagelist {
  color: #d4dbe4
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.size,
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.date,
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.fromto {
  color: #8f9db5
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.msgicon.status {
  color: #d4dbe4
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) span.flag {
  color: #d4dbe4
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted).selected td.subject a,
html.dark-mode .messagelist tr:not(.flagged):not(.deleted).selected td.subject span.msgicon.status {
  color: #a5c8ff
}
html.dark-mode .messagelist tr.deleted td span.flag,
html.dark-mode .messagelist tr.deleted td span.attachment span,
html.dark-mode .messagelist tr.deleted td.subject span.msgicon.status,
html.dark-mode .messagelist tr.deleted td.subject span.msgicon.status.unread:before,
html.dark-mode .messagelist tr.deleted td.subject span.subject a,
html.dark-mode .messagelist tr.deleted td.subject span.date,
html.dark-mode .messagelist tr.deleted td.subject span.fromto {
  color: #66758f
}
html.dark-mode .messagelist span.attachment span {
  color: #8f9db5
}
html.dark-mode .folderlist li.mailbox .unreadcount {
  background-color: #2a3f5c;
  color: #f3f5f8
}
html.dark-mode .attachmentslist {
  background-color: #1a2d48
}
html.dark-mode .attachmentslist a {
  color: #d4dbe4
}
html.dark-mode .attachmentslist li .attachment-name {
  color: #d4dbe4
}
html.dark-mode .attachmentslist li .attachment-size {
  color: #8f9db5
}
html.dark-mode .btn {
  color: #d4dbe4
}
html.dark-mode .btn:focus,
html.dark-mode .btn:hover {
  color: #f3f5f8
}
html.dark-mode .btn-primary {
  background-color: #2f6fe0;
  color: #f3f5f8
}
html.dark-mode .btn-primary:hover:not(:disabled) {
  background-color: #457ee3
}
html.dark-mode .btn-secondary {
  background-color: #2a3f5c;
  color: #f3f5f8
}
html.dark-mode .btn-secondary:hover:not(:disabled) {
  background-color: #324b6e
}
html.dark-mode .btn-danger {
  color: #f3f5f8
}
html.dark-mode .floating-action-buttons a.button {
  background: #2f6fe0
}
html.dark-mode .custom-file-label,
html.dark-mode .form-control {
  background-color: #0c1727;
  color: #d4dbe4
}
html.dark-mode .custom-file-label:not(.is-invalid),
html.dark-mode .form-control:not(.is-invalid) {
  border-color: #45597a
}
html.dark-mode .custom-file-label:focus,
html.dark-mode .form-control:focus {
  background-color: #0c1727
}
html.dark-mode .custom-file-label:focus:not(.is-invalid),
html.dark-mode .form-control:focus:not(.is-invalid) {
  color: #f2f5f9 !important;
  border-color: #3b82f6
}
html.dark-mode .custom-file-label::after {
  color: #d4dbe4;
  background-color: #1a2d48
}
html.dark-mode .custom-select {
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23d4dbe4' viewBox='0 0 4 5'%3e%3cpath d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center / 8px 10px
}
html.dark-mode .custom-switch .custom-control-label::before {
  background-color: #45597a
}
html.dark-mode .custom-switch .custom-control-label::after {
  background-color: #d4dbe4
}
html.dark-mode .custom-switch .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #2f6fe0
}
html.dark-mode .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  background-color: #d4dbe4
}
html.dark-mode .multi-input:not(.is-invalid) > .content {
  border-color: #45597a
}
html.dark-mode .multi-input:not(.is-invalid) > .content.focused {
  border-color: #3b82f6
}
html.dark-mode .input-group-text {
  color: #d4dbe4;
  background-color: #1a2d48;
  border-color: #45597a
}
html.dark-mode .input-group a:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25)
}
html.dark-mode .recipient-input.focus {
  color: #f2f5f9;
  background-color: #0c1727;
  border-color: #3b82f6
}
html.dark-mode .recipient-input a.button.icon,
html.dark-mode .recipient-input input {
  color: #d4dbe4
}
html.dark-mode .recipient-input .recipient {
  background-color: #1a2d48;
  border-color: #45597a
}
html.dark-mode .file-upload {
  border-color: #2a3f5c
}
html.dark-mode .file-upload.droptarget.active {
  border-color: #d4dbe4
}
html.dark-mode .file-upload.droptarget.hover {
  border-color: #d4dbe4;
  background-color: #1a2d48
}
html.dark-mode .image-upload {
  background-color: #1a2d48
}
html.dark-mode .image-upload a.button {
  background-color: rgba(14, 28, 46, 0.25)
}
html.dark-mode .formcontent.raweditor .CodeMirror {
  color: #d4dbe4;
  background-color: #0c1727;
  border-color: #45597a
}
html.dark-mode .formcontent.raweditor .CodeMirror-focused {
  background-color: #0c1727;
  border-color: #3b82f6
}
html.dark-mode .CodeMirror-selected,
html.dark-mode .CodeMirror-line::selection,
html.dark-mode .CodeMirror-line > span::selection,
html.dark-mode .CodeMirror-line > span > span::selection {
  background: #1a2d48
}
html.dark-mode .CodeMirror-gutters {
  background-color: #0c1623
}
html.dark-mode .CodeMirror-activeline-background {
  background: #1a2d48
}
html.dark-mode .skinselection .skinthumbnail {
  border-color: #45597a
}
html.dark-mode .html-editor .editor-toolbar {
  background-color: #1a2d48;
  border-color: #45597a
}
html.dark-mode .html-editor .editor-toolbar .mce-i-html:hover,
html.dark-mode .html-editor .editor-toolbar .mce-i-html:focus {
  background-color: #223a5c
}
html.dark-mode .tox.tox-tinymce {
  border-color: #45597a
}
html.dark-mode .tox .tox-toolbar {
  background-color: #1a2d48;
  border-color: #45597a
}
html.dark-mode .tox .tox-toolbar-overlord > div {
  background: url("data:image/svg+xml,%3Csvg height='33px' viewBox='0 0 40 33px' width='40' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0' y='32px' width='100' height='1' fill='%2345597a'/%3E%3C/svg%3E") #1a2d48
}
html.dark-mode .tox .tox-pop.tox-pop--top:before,
html.dark-mode .tox .tox-pop.tox-pop--top:after {
  border-bottom-color: #45597a
}
html.dark-mode .tox .tox-pop__dialog {
  border-color: #45597a
}
html.dark-mode .tox .tox-tbtn,
html.dark-mode .tox .tox-split-button,
html.dark-mode .tox .tox-swatches__picker-btn {
  color: #d4dbe4
}
html.dark-mode .tox .tox-tbtn svg,
html.dark-mode .tox .tox-split-button svg,
html.dark-mode .tox .tox-swatches__picker-btn svg {
  fill: #d4dbe4 !important
}
html.dark-mode .tox .tox-tbtn:hover,
html.dark-mode .tox .tox-split-button:hover,
html.dark-mode .tox .tox-swatches__picker-btn:hover,
html.dark-mode .tox .tox-tbtn:focus,
html.dark-mode .tox .tox-split-button:focus,
html.dark-mode .tox .tox-swatches__picker-btn:focus {
  color: #d4dbe4;
  background: #223a5c
}
html.dark-mode .tox .tox-tbtn--enabled {
  background: #223a5c
}
html.dark-mode .tox .tox-button--naked:focus:not(:disabled),
html.dark-mode .tox .tox-button--naked.tox-button--icon:hover:not(:disabled) {
  color: #e4e8ee;
  background-color: #223a5c
}
html.dark-mode .tox .tox-selectfield select {
  color: #d4dbe4
}
html.dark-mode .tox .tox-selectfield svg {
  fill: #d4dbe4
}
html.dark-mode .tox .tox-color-input span::before {
  background-color: #d4dbe4
}
html.dark-mode .tox .tox-toolbar__group:not(:last-of-type) {
  border-color: #45597a
}
html.dark-mode .tox .tox-dialog,
html.dark-mode .tox .tox-dialog__header,
html.dark-mode .tox .tox-dialog__body,
html.dark-mode .tox .tox-dialog__footer,
html.dark-mode .tox .tox-dialog__title {
  color: #d4dbe4;
  border-color: #2a3f5c;
  background-color: #0e1c2e
}
html.dark-mode .tox .tox-textfield,
html.dark-mode .tox .tox-color-input > input,
html.dark-mode .tox .tox-label,
html.dark-mode .tox .tox-dialog__body-nav-item,
html.dark-mode .tox .tox-button--naked,
html.dark-mode .tox .tox-dialog__header .tox-button,
html.dark-mode .tox .tox-insert-table-picker__label {
  color: #d4dbe4
}
html.dark-mode .tox .tox-dialog__footer .tox-button {
  background-color: #2f6fe0;
  color: #f3f5f8
}
@media screen and (max-width: 480px) {
  html.dark-mode .tox .tox-dialog__footer .tox-button {
    color: #d4dbe4 !important
  }
}
html.dark-mode .tox .tox-dialog__footer .tox-button:focus:not(:disabled) {
  background-color: #2f6fe0
}
html.dark-mode .tox .tox-dialog__footer .tox-button:hover:not(:disabled) {
  background-color: #457ee3
}
html.dark-mode .tox .tox-dialog__footer .tox-button.tox-button--secondary {
  background-color: #2a3f5c;
  color: #f3f5f8
}
html.dark-mode .tox .tox-dialog__footer .tox-button.tox-button--secondary:focus:not(:disabled) {
  background-color: #2a3f5c
}
html.dark-mode .tox .tox-dialog__footer .tox-button.tox-button--secondary:hover:not(:disabled) {
  background-color: #324b6e
}
html.dark-mode .tox .tox-dialog__body-nav-item--active {
  color: #3b82f6
}
html.dark-mode .tox .tox-menu {
  background-color: #132238;
  border-color: #45597a
}
html.dark-mode .tox .tox-collection__item-caret svg {
  fill: #d4dbe4
}
html.dark-mode .tox .tox-collection__item {
  color: #d4dbe4
}
html.dark-mode .tox .tox-collection__item:not(:last-child) {
  border-bottom: 1px solid #18283f
}
html.dark-mode .tox .tox-collection__item--active,
html.dark-mode .tox .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
  color: #d4dbe4;
  background-color: #1a2d48
}
html.dark-mode .tox .tox-collection__item--enabled {
  color: #a5c8ff;
  background-color: #1a2d48
}
html.dark-mode .message-part {
  border-color: #2a3f5c
}
html.dark-mode .message-part blockquote {
  background-color: #0e1c2e;
  border-color: #7fb0ff;
  color: #7fb0ff
}
html.dark-mode .message-part blockquote span.blockquote-link {
  background: #0e1c2e
}
html.dark-mode .message-part span.sig {
  color: #8f9db5
}
html.dark-mode #message-header .header-headers .header-title {
  color: #d4dbe4
}
html.dark-mode .message-partheaders {
  background-color: #1a2d48
}
html.dark-mode .message-partheaders table.headers-table {
  color: #d4dbe4
}
html.dark-mode p.image-attachment {
  border-color: #2a3f5c;
  background-color: #1a2d48
}
html.dark-mode p.image-attachment span {
  color: #8f9db5
}
html.dark-mode fieldset.image-attachment legend {
  color: #8f9db5;
  border-color: #2a3f5c
}
html.dark-mode .ui-widget {
  border-color: #2a3f5c
}
html.dark-mode .ui-widget-header,
html.dark-mode .ui-widget-content {
  background-color: #0e1c2e
}
html.dark-mode .ui-dialog .ui-dialog-titlebar {
  border-color: #2a3f5c
}
html.dark-mode .ui-dialog .ui-dialog-title,
html.dark-mode .ui-dialog .ui-dialog-titlebar-close {
  color: #d4dbe4
}
html.dark-mode .ui-dialog .ui-dialog-buttonpane {
  border-color: #2a3f5c
}
html.dark-mode .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link {
  color: #d4dbe4
}
@media screen and (max-width: 480px) {
  html.dark-mode .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-primary:not(.btn-danger),
  html.dark-mode .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-secondary {
    color: #d4dbe4
  }
}
html.dark-mode .ui-datepicker .ui-datepicker-header {
  border-color: #2a3f5c
}
html.dark-mode .ui-datepicker th {
  color: #8f9db5
}
html.dark-mode .ui-datepicker .ui-datepicker-prev,
html.dark-mode .ui-datepicker .ui-datepicker-next,
html.dark-mode .ui-datepicker .ui-state-default,
html.dark-mode .ui-datepicker.ui-widget-content .ui-state-default {
  color: #d4dbe4
}
html.dark-mode .ui-datepicker .ui-state-highlight,
html.dark-mode .ui-datepicker.ui-widget-content .ui-state-highlight {
  color: #3b82f6;
  background-color: #1a2d48
}
html.dark-mode .ui-datepicker .ui-datepicker-days-cell-over a {
  background-color: #28446d
}
html.dark-mode .ui-menu {
  background-color: #132238;
  border-color: #45597a
}
html.dark-mode .ui-menu .ui-menu-item {
  border-bottom: 1px solid #18283f
}
html.dark-mode .ui-menu .ui-state-active {
  background-color: #1a2d48 !important
}
html.dark-mode .minicolors-panel {
  border-color: #2a3f5c;
  background: #132238
}
html.dark-mode ::placeholder,
html.dark-mode ::-webkit-input-placeholder,
html.dark-mode .listing-info,
html.dark-mode .listing span.secondary,
html.dark-mode .file-upload .hint,
html.dark-mode .contactlist span.email,
html.dark-mode #login-footer,
html.dark-mode #contacthead.readonly .source.row,
html.dark-mode .formcontent .hint {
  color: #8f9db5
}
html.dark-mode .popover {
  background-color: #132238;
  border-color: #45597a
}
html.dark-mode .popover .menu li.separator {
  color: #95a7bd
}
html.dark-mode .popover .menu ul + li.separator {
  border-top: 1px solid #18283f
}
html.dark-mode .popover-body {
  color: #d4dbe4
}
html.dark-mode .bs-popover-auto[x-placement^="right"] > .arrow::after,
html.dark-mode .bs-popover-right > .arrow::after {
  border-right-color: #45597a
}
html.dark-mode .bs-popover-auto[x-placement^="left"] > .arrow::after,
html.dark-mode .bs-popover-left > .arrow::after {
  border-left-color: #45597a
}
html.dark-mode .bs-popover-auto[x-placement^="top"] > .arrow::after,
html.dark-mode .bs-popover-top > .arrow::after {
  border-top-color: #45597a
}
html.dark-mode .bs-popover-auto[x-placement^="bottom"] > .arrow::after,
html.dark-mode .bs-popover-bottom > .arrow::after {
  border-bottom-color: #45597a
}
html.dark-mode .listing-hover-menu {
  background-color: #132238;
  border-color: #2a3f5c
}
html.dark-mode .listing-hover-menu a.button {
  color: #d4dbe4
}
html.dark-mode .listing-hover-menu span.txt {
  color: #8f9db5
}
html.dark-mode .nav-tabs {
  border-color: #2a3f5c
}
html.dark-mode .nav-tabs .nav-link {
  color: #d4dbe4;
  border-bottom-color: #2a3f5c
}
html.dark-mode .nav-tabs .nav-link:hover {
  background: #0e1c2e;
  border-color: #2a3f5c;
  color: #d4dbe4
}
html.dark-mode .nav-tabs .nav-link.active {
  background: #0e1c2e;
  border-color: #2a3f5c
}
html.dark-mode .table {
  color: #d4dbe4
}
html.dark-mode .table td,
html.dark-mode .table th,
html.dark-mode .table thead th {
  border-color: #2a3f5c
}
html.dark-mode .table-widget {
  border-color: #2a3f5c
}
html.dark-mode .table-widget > .footer {
  border-color: #2a3f5c
}
html.dark-mode .table-widget table.options-table tr:last-child td {
  border-color: #2a3f5c
}
html.dark-mode .table-widget table.options-table tr.selected td {
  background-color: #1a2d48;
  color: #d4dbe4
}
html.dark-mode #rcmdraglayer {
  background-color: #132238;
  border: 1px solid #45597a;
  color: #d4dbe4
}
html.dark-mode .quota-widget .bar {
  border-color: #2a3f5c;
  background-color: #2a3f5c
}
html.dark-mode .quota-info .root {
  color: #8f9db5
}
html.dark-mode img.contactphoto,
html.dark-mode #contactpic {
  background-color: #1a2d48 !important
}
html.dark-mode .pgpkeyimport div.key.revoked,
html.dark-mode .pgpkeyimport div.key.disabled {
  color: #66758f
}

/* ---- Teil 2: von Hand ---- */

/* Anmeldeseite: immer im Linux360-Navy, egal ob heller oder dunkler Modus */
html body.task-login,
html.dark-mode body.task-login {
    color: #d4dbe4;
    background-color: #0e1c2e;
    background-image:
        radial-gradient(ellipse at 50% 50%, transparent 45%, rgba(4, 10, 20, 0.42) 100%),
        linear-gradient(rgba(130, 160, 205, 0.075) 1px, transparent 1px),
        linear-gradient(90deg, rgba(130, 160, 205, 0.075) 1px, transparent 1px),
        radial-gradient(ellipse 62% 78% at 26% 37%, #1d3250 0%, #15253b 62%, #0e1c2e 100%);
    background-size: 100% 100%, 61px 61px, 61px 61px, 100% 100%;
    background-attachment: fixed;
}
.task-login #layout,
.task-login #layout-content,
html.dark-mode .task-login #layout-content {
    background: transparent;
}
.task-login #logo,
html.dark-mode .task-login #logo {
    top: 13vh;
    width: 300px;
    max-width: 78%;
    max-height: 64px;
    opacity: 1;
}
.task-login #login-form {
    top: 16vh;
    max-width: 360px;
    padding: 28px 28px 24px;
    background: rgba(19, 34, 56, 0.94);
    border: 1px solid rgba(130, 160, 205, 0.2);
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(3, 9, 18, 0.45);
}
.task-login #login-form .form-control,
html.dark-mode .task-login #login-form .form-control {
    color: #f2f5f9;
    background-color: #0c1727;
    border-color: #45597a;
}
.task-login #login-form .form-control::placeholder {
    color: #8f9db5;
}
.task-login #login-form .form-control:focus {
    border-color: #5b9bff;
    box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.3);
}
.task-login #login-form .input-group-text,
html.dark-mode .task-login #login-form .input-group-text {
    color: #d4dbe4;
    background-color: #1a2d48;
    border-color: #45597a;
}
.task-login #rcmloginsubmit,
html.dark-mode .task-login #rcmloginsubmit {
    color: #fff;
    background: #3b82f6;
    border-color: #3b82f6;
    font-weight: 600;
    /* Elastic setzt hier die Bootstrap-Klasse text-uppercase (mit !important) */
    text-transform: none !important;
}
.task-login #rcmloginsubmit:hover,
.task-login #rcmloginsubmit:focus {
    background: #2f6fe0;
    border-color: #2f6fe0;
}
/* Standardzeile (Produktname, "Support") ausblenden, eigene Hinweise zeigen */
.task-login #login-footer {
    font-size: 0;
    color: #8f9db5;
}
.task-login #login-footer > .support-link {
    display: none;
}
.task-login #login-footer > div.lx360-login,
html.dark-mode .task-login #login-footer > div.lx360-login {
    margin-top: 1.25rem;
    padding: 0;
    font-size: 0.95rem;
    line-height: 1.5;
    background: transparent;
    border-radius: 0;
}
.lx360-hint {
    margin: 0 0 1rem;
    color: #8f9db5;
}
.lx360-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.6rem;
}
a.lx360-link,
html.dark-mode a.lx360-link {
    padding: 0.4rem 0.85rem;
    color: #a5c8ff;
    border: 1px solid rgba(130, 160, 205, 0.35);
    border-radius: 8px;
    text-decoration: none;
}
a.lx360-link:hover,
a.lx360-link:focus {
    color: #fff;
    background: rgba(130, 160, 205, 0.12);
    text-decoration: none;
}

/* Cloud-Knopf in der Seitenleiste */
#taskmenu a.lxcloud:before {
    content: "\f0c2";
}

/* Logo in der Seitenleiste: rundes Zeichen statt Wortmarke */
#layout-menu #logo,
html.dark-mode #layout-menu #logo {
    opacity: 1;
}

/* Cloud-Kontakte in den Einstellungen */
.listing li.lxcloud > a:before {
    content: "\f2b9";
}
#lx360-cloud-form .lx360-cloud-steps,
#lx360-cloud-form .lx360-cloud-books {
    padding-left: 1.4rem;
    margin-bottom: 1.25rem;
}
#lx360-cloud-form .lx360-cloud-steps li {
    margin-bottom: 0.35rem;
}
#lx360-cloud-form .propform {
    max-width: 44rem;
}
#lx360-cloud-form .lx360-cloud-buttons {
    margin: 1.25rem 0 0;
}

/* Zwei-Faktor-Anmeldung: Abfrage auf der Anmeldeseite */
.task-login .lx360-tfa-intro {
    margin: 0 0 1rem;
    color: #d4dbe4;
    text-align: center;
}
.task-login .lx360-tfa-error {
    margin: 0 0 1rem;
    padding: 0.5rem 0.75rem;
    color: #ffd0c9;
    background: rgba(220, 53, 69, 0.16);
    border: 1px solid rgba(220, 53, 69, 0.55);
    border-radius: 8px;
    text-align: center;
}

/* Zwei-Faktor-Anmeldung: Einstellungen */
.listing li.lxtfa > a:before {
    content: "\f3ed";
}
#lx360-tfa h3 {
    margin: 1.75rem 0 0.5rem;
    font-size: 1.1rem;
}
#lx360-tfa .lx360-tfa-state {
    font-weight: 600;
}
#lx360-tfa .propform {
    max-width: 44rem;
}
#lx360-tfa .lx360-tfa-buttons {
    margin: 1rem 0 0;
}
#lx360-tfa .lx360-tfa-steps {
    padding-left: 1.4rem;
}
#lx360-tfa .lx360-tfa-steps li {
    margin-bottom: 0.6rem;
}
#lx360-tfa .lx360-tfa-scan {
    margin: 0.75rem 0;
}
/* Der QR-Code bleibt auch im dunklen Modus schwarz auf weiss. */
#lx360-tfa img.lx360-tfa-qr {
    display: block;
    margin-bottom: 0.75rem;
    padding: 8px;
    background: #fff;
    border-radius: 8px;
}
#lx360-tfa .lx360-tfa-key code,
#lx360-tfa .lx360-tfa-codes code {
    font-size: 1.05rem;
    letter-spacing: 0.04em;
}
#lx360-tfa .lx360-tfa-codes {
    max-width: 44rem;
    margin-bottom: 1.5rem;
    padding: 1rem 1.25rem;
    background: rgba(59, 130, 246, 0.08);
    border: 1px solid rgba(59, 130, 246, 0.45);
    border-radius: 8px;
}
#lx360-tfa .lx360-tfa-codes h3 {
    margin-top: 0;
}
#lx360-tfa .lx360-tfa-codes ul {
    max-width: 26rem;
    margin: 0;
    padding: 0;
    columns: 2;
    list-style: none;
}
@media print {
    #layout-menu,
    #layout-sidebar,
    #lx360-tfa .lx360-tfa-form,
    #lx360-tfa .lx360-tfa-state {
        display: none !important;
    }
}
