/**
 * MS Drive Logistic skin — main stylesheet entry point.
 *
 * This skin deliberately owns NO copy of elastic. It pulls elastic's own sources in and
 * lets elastic's two documented extension hooks do the work:
 *
 *     elastic/styles/variables.less  ends with  @import (reference, optional) "_variables"
 *     elastic/styles/styles.less     ends with  @import (optional) "_styles"
 *
 * Neither file exists inside skins/elastic, so LESS falls through to the compiler's
 * include-path — which roundcube/Dockerfile points at THIS directory. Result: our
 * _variables.less and _styles.less are compiled directly into elastic's own cascade,
 * with no upstream line forked and nothing to re-merge on a Roundcube upgrade.
 *
 * Compiled to styles.min.css at image build time. Roundcube resolves the template's
 * `/styles/styles.css` reference through the skin chain and falls back to the .min
 * variant, exactly as it already does for elastic itself.
 */
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
p.image-attachment .attachment-links a:before,
.quota-widget:before,
.table-widget table.options-table td:not(:first-child) span:before,
table.table th.checkbox-cell:before,
a.button.icon:before,
button.btn:before,
.floating-action-buttons a.button:before,
.ui-dialog .ui-dialog-titlebar-close:before,
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link.options:before,
.ui-datepicker .ui-datepicker-prev:before,
.ui-datepicker .ui-datepicker-next:before,
.pgpkeyimport div.key label.keyid + a:before,
.pgpkeyimport li.uid:before,
.menu a:before,
.popover .menu li a[aria-haspopup]:after,
.searchbar form:before,
.searchbar a:before,
.ui.alert > i.icon:before,
.listing td.action a:before,
.listing.iconized li a:before,
.listing.iconized li > i:before,
.listing.iconized tr td:before,
.listing.iconized.selectable li a:before,
ul.treelist li div.treetoggle:before,
.folderlist li a:before,
.messagelist tr.thread td.threads div:before,
.messagelist td.subject span.msgicon.status:before,
.messagelist td.subject span.msgicon.status.replied.forwarded:after,
.messagelist span.attachment span,
.messagelist span.flagged:before,
.messagelist tr.flaggedroot:not(:hover) span.unflagged:before,
.contactlist td.contact:before,
.contactlist td.contactgroup:before,
.contactlist li a:before,
.attachmentslist li:before,
.attachmentslist li a.cancelupload:before,
.attachmentslist li a.delete:before,
.keylist li:before,
#identities-table td.mail:before,
#responses-table td.name:before,
#filterslist td.name:before,
#filtersetslist td.name:before,
.propform td.rowbuttons a:before,
fieldset.advanced > legend:after,
.input-group .icon:before,
.multi-input a.icon.reset:before,
.tagedit-list li.tagedit-listelement-old a:before,
div.tox .tox-dialog__header .tox-button:before,
div.tox .tox-dialog__footer .tox-button:before,
.html-editor .editor-toolbar .mce-i-html:before,
.googie_list li .googie_list_revert:before,
.googie_list li .googie_add_to_dict:before,
body.status-flagged #message-header > .subject:before,
#message-header > .subject a.extwin:before,
#message-header .header-links a:before,
.message-part blockquote span.blockquote-link:after,
.message-htmlpart blockquote span.blockquote-link:after {
  font-size: 1.25em;display: block;float: left;margin: 0 0.25rem 0 0;width: 1.18em;height: 1em;font-family: 'Icons';font-style: normal;font-weight: 900;text-decoration: inherit;text-align: center;speak: none;font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-webkit-font-smoothing: antialiased;
}
/*** Fonts ***/
@font-face {
  font-family: 'Icons';
  font-style: normal;
  font-weight: 900;
  src: url("../fonts/fa-solid-900.woff2") format('woff2'), url("../fonts/fa-solid-900.woff") format('woff');
}
@font-face {
  font-family: 'Icons';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/fa-regular-400.woff2") format('woff2'), url("../fonts/fa-regular-400.woff") format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url('../fonts/roboto-v29-regular.woff2') format('woff2'), url('../fonts/roboto-v29-regular.woff') format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: local('Roboto Italic'), local('Roboto-Italic'), url('../fonts/roboto-v29-italic.woff2') format('woff2'), url('../fonts/roboto-v29-italic.woff') format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url('../fonts/roboto-v29-regular-700.woff2') format('woff2'), url('../fonts/roboto-v29-regular-700.woff') format('woff');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'), url('../fonts/roboto-v29-italic-700.woff2') format('woff2'), url('../fonts/roboto-v29-italic-700.woff') format('woff');
}
/* Reset some Bootstrap style */
body,
button,
input,
optgroup,
select,
textarea,
.popover {
  font-family: Roboto, sans-serif;
}
button,
input,
select,
textarea {
  line-height: initial;
}
input {
  vertical-align: middle;
}
a {
  color: #0a0a0b;
}
a:hover {
  color: #52525b;
}
a.disabled {
  pointer-events: none;
}
a.disabled:not(.btn) {
  opacity: 0.5;
}
/* Scrollbar styles */
html:not(.touch) ::-webkit-scrollbar {
  width: 6px;
}
html {
  scrollbar-color: #d4d4d8 #f4f4f5;
}
html:not(.touch) ::-webkit-scrollbar-track {
  background-color: #f4f4f5;
}
html:not(.touch) ::-webkit-scrollbar-thumb {
  background-color: #d4d4d8;
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** Responsive design - Layout ***/
/*
- Large screen (width > 1200px)
   -----------------------------------------------------------------------------------------------------
   |  menu  |        sidebar        |         list          |                 content                  |
   -----------------------------------------------------------------------------------------------------
- Normal screen (1200px => width => 768px) - typical: 768x1024 (iPad Mini/Air)
   -------------------------------------------------------------------
   |menu|    sidebar/list     |               content                |
   -------------------------------------------------------------------
- Small (480px < width < 768px)
   ------------------------------------------
   |menu|     sidebar/list/content          |
   ------------------------------------------
- Phone (width <= 480px) - typical: 320x480 (iPhone 5), 375x667 (iPhone 6-7), 360x564 (Galaxy S6)
   ------------------------
   | sidebar/list/content |
   ------------------------
*/
html {
  height: 100%;
  font-size: 14px;
}
body {
  min-width: 240px;
  height: 100%;
  color: #0a0a0b;
  overflow: hidden;
}
html.iframe body {
  overflow: auto;
}
#layout {
  overflow: hidden;
  display: flex;
  height: 100%;
  width: 100%;
}
#layout > div > .scroller {
  flex: 1;
  position: relative;
}
#layout > div > .header,
#layout > div > .footer {
  font-size: 1rem;
  font-weight: bold;
  line-height: 58px;
  height: 58px;
  min-height: 58px;
  padding: 0 0.25em;
  margin: 0;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  display: flex;
  justify-content: center;
}
#layout > div > .header {
  border-bottom: 1px solid #e4e4e7;
  color: #0a0a0b;
  background-color: #f4f4f5;
}
#layout > div > .header .header-title {
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  text-align: center;
  margin: 0 -20rem;
}
#layout > div > .header a.button {
  color: #0a0a0b;
}
#layout > div > .header a.toolbar-list-button,
#layout > div > .header a.toolbar-menu-button {
  order: 99;
}
#layout > div > .footer {
  border-top: 1px solid #e4e4e7;
  background-color: #ffffff;
}
#layout > div > .footer.small {
  height: 35px;
  min-height: 35px;
  line-height: 35px;
}
#layout > div > .footer:empty {
  display: none;
}
#layout-sidebar {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 2;
  max-width: 30%;
  min-width: 220px;
  border-right: 1px solid #e4e4e7;
  background-color: #ffffff;
}
#layout-sidebar.sidebar-right {
  order: 2;
  border-right: 0;
  border-left: 1px solid #e4e4e7;
  flex: 3;
}
#layout-list {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 3;
  max-width: 30%;
  min-width: 300px;
  border-right: 1px solid #e4e4e7;
  background-color: #ffffff;
}
#layout-content {
  display: flex;
  flex: 6;
  flex-direction: column;
  background-color: #ffffff;
  width: 100%;
}
html.iframe #layout-content {
  height: 100%;
}
#layout-content > .formcontent,
#layout-content > .content {
  height: 100%;
  width: 100%;
  overflow: auto;
  flex: 1;
}
#layout-content .iframe-wrapper {
  width: 100%;
  flex: 1;
}
#layout-content .iframe-wrapper iframe {
  width: 100%;
  height: 100%;
  border: 0;
}
#layout-content.only > .scroller {
  overflow: auto;
}
#layout-menu.popover {
  left: 0 !important;
}
#layout-menu .popover-header {
  height: 58px;
  line-height: 58px;
  border: 0;
  border-radius: 0;
  text-align: center;
}
#layout-menu .popover-header img {
  max-height: 58px;
  max-width: 78px;
  padding: 0.25rem;
}
@media screen and (min-width: 481px) and (max-width: 1024px) {
  #layout-menu .popover-header img {
    max-width: 35.1px;
  }
}
@media screen and (min-width: 481px) {
  #layout-menu .popover-header {
    padding: 0 !important;
    background-color: #0a0a0b !important;
  }
  #layout-menu .popover-header a {
    display: none !important;
  }
}
html.layout-phone #layout-menu .popover-header {
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 0.5rem;
}
html.layout-phone #layout-menu .popover-header img {
  max-width: 222px;
}
html.layout-phone #layout-menu .popover-header a {
  width: auto;
  flex: 1;
}
html.layout-phone #layout-menu .popover-header a:before {
  height: 58px;
  float: right;
}
html.layout-phone #layout-menu .popover-header a .inner {
  display: none;
}
.column-resizer {
  cursor: col-resize;
  z-index: 1;
  position: absolute;
  top: 0;
  right: -3px;
  width: 6px;
  height: 100%;
}
.column-resizer.inverted {
  right: auto;
  left: -3px;
}
.column-resizer.active {
  width: 10000px;
  right: -5000px;
}
.column-resizer.active.inverted {
  right: auto;
  left: -5000px;
}
@media screen and (max-width: 1200px) {
  #layout-sidebar,
  #layout-list {
    min-width: 260px;
    flex: 3;
  }
  #layout-list > .header > a.button {
    padding: 0 0.25rem;
    margin: 0 0.25rem;
  }
}
@media screen and (max-width: 1024px) {
  .column-resizer {
    display: none;
  }
  #layout-sidebar,
  #layout-list {
    width: auto !important;
    flex: 3 !important;
  }
}
@media screen and (max-width: 768px) {
  #layout-sidebar,
  #layout-list {
    max-width: none;
    border: 0 !important;
  }
  #layout > div > .header {
    background-color: #f4f4f5;
  }
  #layout > div > .header a.button {
    margin: 0 0.3rem !important;
    padding: 0 !important;
  }
  #layout > div > .header a.button:before {
    font-size: 1.75rem;
    height: 58px;
    margin: 0;
  }
  #layout > div > .header a.button.filter:before {
    font-size: 1.6rem;
  }
  #layout > div > .header a.button .inner {
    display: none;
  }
  #layout > div > .footer {
    background-color: #f4f4f5;
  }
  a.toolbar-list-button {
    display: none;
  }
}
@media screen and (max-width: 320px) {
  #layout-sidebar,
  #layout-list {
    min-width: 240px;
  }
}
@media screen and (min-width: 481px) {
  a.task-menu-button {
    display: none;
  }
  #layout-menu {
    background-color: #0a0a0b;
    width: 42px;
  }
}
@media screen and (min-width: 769px) {
  .floating-action-buttons,
  #layout-content > .header > .header-title,
  #layout > div > .header > .buttons,
  a.toolbar-menu-button {
    display: none;
  }
}
@media screen and (min-width: 1025px) {
  #layout-menu {
    width: 78px;
  }
}
@media screen and (min-width: 1201px) {
  #layout-list > .header > .header-title:not(.all-sizes),
  a.toolbar-list-button,
  a.back-list-button,
  a.back-sidebar-button {
    display: none;
  }
}
html.layout-phone .hidden-phone {
  display: none !important;
}
html.layout-phone .hidden-small,
html.layout-small .hidden-small {
  display: none !important;
}
html.layout-small .hidden-lbs {
  display: none !important;
}
html.layout-large .hidden-lbs,
html.layout-normal .hidden-lbs,
html.layout-large .hidden-big,
html.layout-normal .hidden-big {
  display: none !important;
}
html.layout-large .hidden-large {
  display: none !important;
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** Common UI elements ***/
.rcmaddcontact,
.hidden,
.voice {
  display: none !important;
}
font.bold {
  font-weight: bold;
}
#rcmdraglayer {
  min-width: 260px;
  width: 260px;
  background-color: #0a0a0b;
  color: #ffffff;
  box-shadow: 3px 3px 5px #e4e4e7;
  border-radius: 0.3rem;
  z-index: 250;
  opacity: 0.92;
  padding: 0.5rem;
  white-space: nowrap;
}
#rcmdraglayer div {
  line-height: 1.6em;
  overflow: hidden;
  text-overflow: ellipsis;
}
.frame-content {
  padding: 1rem;
}
.frame-content h2 {
  font-weight: bold;
  font-size: 1.5em;
}
.frame-content h3 {
  font-weight: bold;
  font-size: 1.25em;
}
.listbox .scroller {
  width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}
.listbox .navlist {
  height: 0;
  flex: initial !important;
}
.listbox .navlist .listing tr:last-child td,
.listbox .navlist .listing li:last-child {
  border-bottom: 0;
}
.popup .listbox {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.popup .listbox .scroller {
  flex: 1;
}
.popup .listbox .footer {
  border-top: 1px solid #e4e4e7;
  background-color: #ffffff;
}
.contact-header {
  display: flex;
  margin-bottom: 1rem;
}
.contact-header .contact-photo {
  min-width: 112px;
}
.contact-header .contact-head {
  margin-left: 1rem;
  margin-top: 0 !important;
}
.contact-header .contact-head legend {
  display: none;
}
p.image-attachment {
  position: relative;
  border: 1px solid #e4e4e7;
  border-radius: 0.3rem;
  background-color: #f4f4f5;
  float: left;
  margin: 0.5rem;
  min-width: 47%;
  min-height: 250px;
  overflow: hidden;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 480px) {
  p.image-attachment {
    float: none;
    margin: 0.5rem 0 0.5rem 0;
  }
}
p.image-attachment .image-link {
  align-self: center;
  text-align: center;
  margin: 1.6rem 0.5rem;
}
p.image-attachment span {
  color: #71717a;
  padding: 0 0.5rem;
  font-size: 90%;
  white-space: nowrap;
  position: absolute;
  line-height: 1.5rem;
}
p.image-attachment .image-filename {
  overflow: hidden;
  text-overflow: ellipsis;
  left: 0;
  top: 0;
  right: 0;
  padding-right: 4rem;
}
p.image-attachment .image-filesize {
  right: 0;
  top: 0;
}
p.image-attachment .attachment-links {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
}
p.image-attachment .attachment-links a {
  text-decoration: none;
  display: inline-block;
  padding: 0 0.5rem;
  line-height: 1.5rem;
}
p.image-attachment .attachment-links a:before {
  display: inline-block;
}
p.image-attachment .attachment-links a.open:before {
  content: "\f360";
}
p.image-attachment .attachment-links a.download:before {
  content: "\f019";
}
fieldset.image-attachment {
  margin-top: 0.5rem;
}
fieldset.image-attachment legend {
  color: #71717a;
  font-size: 0.9rem;
  border-top: 1px solid #f5f5f5;
  margin: 0;
}
fieldset.image-attachment img {
  max-width: 100%;
}
#folder-selector {
  overflow-y: auto;
}
.noselect {
  user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
}
.iframe-loader {
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.95);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
}
.iframe-loader .spinner-border {
  width: 7rem;
  height: 7rem;
  color: #e4e4e7;
  border: 1rem solid;
  border-color: currentColor #0a0a0b currentColor currentColor;
}
.footer.toolbar + .iframe-loader {
  top: 58px;
  bottom: 58px;
}
.ios-scroll {
  padding: 0;
  -webkit-overflow-scrolling: touch !important;
  overflow: scroll !important;
}
.ios-scroll.iframe-wrapper {
  margin-top: 1px;
}
.webkit-scroller::-webkit-scrollbar {
  -webkit-appearance: none;
}
.webkit-scroller::-webkit-scrollbar:vertical {
  width: 0.5rem;
}
.webkit-scroller::-webkit-scrollbar:horizontal {
  height: 0.5rem;
}
.webkit-scroller::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 0.25rem;
  border: 2px solid #fff;
}
.quota-widget {
  width: 100%;
  max-width: 15em;
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  color: #71717a;
}
.quota-widget:before {
  content: "\f0a0";
  line-height: 1;
}
.quota-widget .count {
  font-size: 80%;
  order: 2;
}
.quota-widget .bar {
  flex: 1;
  height: 0.5rem;
  margin: 0 1rem;
  background-color: #f4f4f5;
  border: 1px solid #e4e4e7;
  border-radius: 0.25rem;
  overflow: hidden;
}
.quota-widget .value {
  display: block;
  background-color: #0a0a0b;
  height: 1rem;
  opacity: 0.75;
}
.quota-widget .value.warning {
  background-color: #e7000b;
}
.image-tools {
  position: absolute;
  top: 5rem;
  left: 0;
  height: 58px;
  overflow: hidden;
  transform: translateX(-87%);
  transition: transform 0.3s ease-in-out;
  background-color: rgba(10, 10, 11, 0.45);
  border-radius: 0 0.3rem 0.3rem 0;
}
.image-tools .menu {
  float: left;
}
.image-tools a.button.icon.tools {
  padding: 0 0.25rem;
  display: inline-block;
  height: 58px;
}
.image-tools a.button.icon.tools span.inner {
  display: none;
}
.image-tools a.button.icon.tools:before {
  line-height: 58px;
  margin: 0;
}
.image-tools.open {
  transform: translateX(0);
}
.image-tools.open a.button.icon.tools:before {
  content: "\f053";
}
.image-tools a {
  color: #ffffff !important;
}
.image-tools a:focus,
.image-tools a:hover {
  background-color: rgba(10, 10, 11, 0.65) !important;
  outline: 0;
}
.quota-info {
  width: 100%;
  display: table !important;
}
.quota-info td,
.quota-info th {
  text-align: center;
  white-space: nowrap;
}
.quota-info th {
  border-top: 0;
}
.quota-info .root {
  line-height: 1;
  font-style: italic;
  color: #71717a;
  background-color: #e4e4e7;
}
.quota-info th:first-child,
.quota-info .name {
  text-align: left;
}
.nav-tabs {
  flex-wrap: nowrap;
}
.nav-tabs .nav-item {
  white-space: nowrap;
  overflow: hidden;
}
.nav-tabs .nav-link {
  overflow: hidden;
  text-overflow: ellipsis;
}
.props-table td.title {
  width: 7em;
}
.table-widget {
  display: flex;
  flex-direction: column;
  margin-bottom: 0.5rem;
  border: 1px solid #e4e4e7;
}
.table-widget > .content {
  overflow-x: auto;
  flex-grow: 1;
  height: 18.5em;
}
.table-widget > .content table th {
  border-top: 0;
}
.table-widget > .footer {
  height: 3.5rem;
  border-top: 1px solid #e4e4e7;
  text-align: left;
}
.table-widget > .footer a {
  padding: 0.2rem 0.45rem !important;
  height: calc(3.5rem - 1px) !important;
}
.table-widget table {
  margin: 0;
  max-height: 18.5em;
}
.table-widget table.options-table td,
.table-widget table.options-table th {
  text-align: center;
  vertical-align: middle;
}
.table-widget table.options-table td:first-child,
.table-widget table.options-table th:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
}
.table-widget table.options-table tr:last-child td {
  border-bottom: 1px solid #e4e4e7;
}
.table-widget table.options-table tr.selected td {
  background-color: #e4e4e7;
  color: #0a0a0b;
  outline: 0;
}
.table-widget table.options-table td:not(:first-child) span {
  display: inline-block;
  line-height: 1.25;
}
.table-widget table.options-table td.enabled span:before {
  content: "\f00c";
}
.table-widget table.options-table td.partial span:before {
  opacity: 0.3;
  content: "\f00c";
}
table.compact-table {
  margin: 0;
  width: 100%;
}
table.compact-table *:not(.invalid-feedback) {
  font-size: inherit;
}
table.compact-table td {
  padding: 0.25rem;
  border: 0;
}
table.compact-table td:first-child {
  padding-left: 0;
}
table.compact-table td:last-child {
  padding-right: 0;
}
table.table .checkbox-cell {
  width: 3rem;
  white-space: nowrap;
  overflow: hidden;
  text-align: center;
  padding: 0.5rem;
}
html.touch table.table .checkbox-cell {
  padding: 0.5rem 0.3rem;
}
table.table th.checkbox-cell {
  padding: 0.75rem 0;
  max-width: 1rem;
}
table.table th.checkbox-cell:before {
  cursor: pointer;
  margin: 0 1rem;
  line-height: 1;
}
table.table th.checkbox-cell.subscription:before {
  content: "\f143";
}
table.table th.checkbox-cell.alarm:before {
  content: "\f0f3";
  font-weight: 400;
}
table.table th.checkbox-cell.read:before {
  content: "\f06e";
}
table.table th.checkbox-cell.write:before {
  content: "\f303";
}
table.table .buttons-cell {
  width: 1%;
  white-space: nowrap;
  text-align: center;
}
table.table .buttons-cell a.button:before {
  line-height: 1;
  float: none;
  display: inline-block;
}
@media screen and (min-width: 480px) {
  table.table .buttons-cell a.button .inner {
    display: inline;
  }
}
table.table label {
  margin: 0;
  display: inline;
}
fieldset.tab-pane table.table thead th {
  border: 0;
}
table.table tr.deleted td {
  color: #a1a1aa !important;
}
/* Bootstrap's .table style overwrites */
.table thead th {
  border-width: 1px;
  white-space: nowrap;
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** Buttons ***/
.button.disabled {
  opacity: 0.5;
}
a.button {
  text-decoration: none !important;
}
/* font-icons */
a.button.icon.sidebar-menu:before,
button.btn.sidebar-menu:before,
a.button.icon.toolbar-menu-button:before,
button.btn.toolbar-menu-button:before,
a.button.icon.toolbar-list-button:before,
button.btn.toolbar-list-button:before {
  content: "\f142";
  width: 1em;
}
a.button.icon.task-menu-button:before,
button.btn.task-menu-button:before {
  content: "\f0c9";
}
a.button.icon.back-sidebar-button:before,
button.btn.back-sidebar-button:before,
a.button.icon.back-content-button:before,
button.btn.back-content-button:before,
a.button.icon.back-list-button:before,
button.btn.back-list-button:before {
  content: "\f053";
}
a.button.icon.refresh:before,
button.btn.refresh:before {
  content: "\f021";
}
a.button.icon.generate:before,
button.btn.generate:before,
a.button.icon.yes:before,
button.btn.yes:before,
a.button.icon.submit:before,
button.btn.submit:before,
a.button.icon.continue:before,
button.btn.continue:before,
a.button.icon.save:before,
button.btn.save:before {
  content: "\f00c";
}
a.button.icon.create:before,
button.btn.create:before {
  content: "\f0fe";
}
a.button.icon.edit:before,
button.btn.edit:before {
  content: "\f303";
}
a.button.icon.qrcode:before,
button.btn.qrcode:before {
  content: "\f029";
}
a.button.icon.search:before,
button.btn.search:before {
  content: "\f002";
}
a.button.icon.filter:before,
button.btn.filter:before {
  content: "\f0b0";
  font-size: 1.2em;
}
a.button.icon.import:before,
button.btn.import:before {
  content: "\f093";
}
a.button.icon.export:before,
button.btn.export:before {
  content: "\f019";
}
a.button.icon.discard:before,
button.btn.discard:before,
a.button.icon.delete:before,
button.btn.delete:before {
  content: "\f2ed";
  font-weight: 400;
}
a.button.icon.next:before,
button.btn.next:before {
  content: "\f061";
}
a.button.icon.restore:before,
button.btn.restore:before {
  content: "\f0e2";
}
a.button.icon.send:before,
button.btn.send:before,
a.button.icon.bounce:before,
button.btn.bounce:before {
  content: "\f1d8";
}
a.button.icon.attach:before,
button.btn.attach:before {
  content: "\f0c6";
}
a.button.icon.attach.vcard:before,
button.btn.attach.vcard:before {
  content: "\f007";
}
a.button.icon.no:before,
button.btn.no:before,
a.button.icon.close:before,
button.btn.close:before,
a.button.icon.cancel:before,
button.btn.cancel:before {
  content: "\f00d";
}
a.button.icon.back:before,
button.btn.back:before {
  content: "\f053";
}
a.button.icon.remove:before,
button.btn.remove:before {
  content: "\f00d";
}
a.button.icon.unlock:before,
button.btn.unlock:before {
  content: "\f09c";
}
a.button.icon.help:before,
button.btn.help:before {
  content: "\f1cd";
  font-weight: 400;
}
a.button.icon.folders:before,
button.btn.folders:before {
  content: "\f07c";
}
a.button.icon.options:before,
button.btn.options:before {
  content: "\f1de";
}
a.button.icon.tools:before,
button.btn.tools:before,
a.button.icon.settings:before,
button.btn.settings:before {
  content: "\f013";
}
a.button.icon.properties:before,
button.btn.properties:before {
  content: "\f05a";
}
a.button.icon.selection:before,
button.btn.selection:before {
  content: "\f14a";
  font-weight: 400;
}
a.button.icon.insert.recipient:before,
button.btn.insert.recipient:before {
  content: "\f234";
}
a.button.icon.encrypt:before,
button.btn.encrypt:before {
  content: "\f023";
}
a.button.icon.sign:before,
button.btn.sign:before {
  content: "\f5b7";
}
a.button.icon.sso:before,
button.btn.sso:before {
  content: "\f2f6";
}
a.button.icon.extwin:before,
button.btn.extwin:before {
  content: "\f360";
}
a.btn:before,
button.btn:before {
  display: inline !important;
  float: none !important;
  vertical-align: middle;
  margin-right: 0.4rem !important;
}
a.btn.oauth.google:before,
button.btn.oauth.google:before,
a.btn.oauth.outlook:before,
button.btn.oauth.outlook:before {
  content: " ";
  display: inline-block !important;
  height: 1.5rem;
  width: 1.5rem;
  margin-right: 0.8rem !important;
  background-size: 100% auto;
}
a.btn.oauth.google:before,
button.btn.oauth.google:before {
  background: url('../images/google-icon.svg') top left no-repeat;
}
a.btn.oauth.outlook:before,
button.btn.oauth.outlook:before {
  background: url('../images/microsoft-icon.svg') top left no-repeat;
}
a.button.icon.dropdown:before {
  content: "\f0d7";
  font-size: 1em;
}
a.button.icon > span.inner {
  display: none;
}
html.touch .btn:focus {
  box-shadow: none !important;
}
.floating-action-buttons {
  position: absolute;
  right: 0;
  bottom: 0;
}
.footer:not(:empty) + .floating-action-buttons {
  bottom: 35px;
}
.floating-action-buttons a.button {
  display: block;
  float: left;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: #0a0a0b;
  color: white;
  opacity: 0.95;
  box-shadow: 0 0 5px 5px #5f5f69;
  margin: 0 1rem 1rem 0;
}
.floating-action-buttons a.button:before {
  content: "\f067";
  width: 4rem;
  height: 4rem;
  line-height: 4rem;
}
.floating-action-buttons a.button.compose:before {
  content: "\f304";
}
.floating-action-buttons a.button .inner {
  display: none;
}
/*** Bootstrap button style overrides ***/
.btn:focus {
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.3);
}
.btn-link {
  color: #0a0a0b;
}
.btn-secondary {
  color: #0a0a0b;
  background: #f4f4f5;
  border-color: #f4f4f5;
}
.btn-secondary:focus {
  background: #e7e7e9;
  border-color: #e1e1e4;
  box-shadow: 0 0 0 0.2rem rgba(244, 244, 245, 0.5);
}
.btn-secondary:hover {
  background: #e7e7e9;
  border-color: #e1e1e4;
}
.btn-secondary.disabled,
.btn-secondary:disabled {
  background: #f4f4f5;
  border-color: #f4f4f5;
}
.btn-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active {
  background: #d9d9dd;
  border-color: #d4d4d8;
}
.btn-secondary:not(:disabled):not(.disabled):active:focus,
.btn-secondary:not(:disabled):not(.disabled).active:focus {
  box-shadow: 0 0 0 0.2rem rgba(244, 244, 245, 0.53);
}
.btn-primary {
  color: #fafafa;
  background: #0a0a0b;
  border-color: #0a0a0b;
}
.btn-primary:focus {
  background: #000000;
  border-color: #000000;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.5);
}
.btn-primary:hover {
  background: #000000;
  border-color: #000000;
}
.btn-primary.disabled,
.btn-primary:disabled {
  background: #0a0a0b;
  border-color: #0a0a0b;
}
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
  background: #000000;
  border-color: #000000;
}
.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus {
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.53);
}
.btn-danger {
  color: #ffffff;
  background: #e7000b;
  border-color: #e7000b;
}
.btn-danger:focus {
  background: #ce000a;
  border-color: #c30009;
  box-shadow: 0 0 0 0.2rem rgba(231, 0, 11, 0.5);
}
.btn-danger:hover {
  background: #ce000a;
  border-color: #c30009;
}
.btn-danger.disabled,
.btn-danger:disabled {
  background: #e7000b;
  border-color: #e7000b;
}
.btn-danger:not(:disabled):not(.disabled):active,
.btn-danger:not(:disabled):not(.disabled).active {
  background: #b40009;
  border-color: #aa0008;
}
.btn-danger:not(:disabled):not(.disabled):active:focus,
.btn-danger:not(:disabled):not(.disabled).active:focus {
  box-shadow: 0 0 0 0.2rem rgba(231, 0, 11, 0.53);
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** jQuery-UI widgets' style overrides ***/
.ui-widget-overlay {
  background-color: rgba(9, 9, 11, 0.5);
  opacity: 1 !important;
}
.ui-widget-overlay.datepicker {
  z-index: 119;
}
.ui-widget {
  border: 1px solid #e4e4e7;
  box-shadow: 3px 3px 5px rgba(9, 9, 11, 0.12);
  border-radius: 0.3rem;
}
.ui-menu {
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 400px;
  border-radius: 0.3rem;
  z-index: 240;
  position: absolute;
}
.ui-menu .ui-state-active {
  border: 0 !important;
  background-color: #0a0a0b !important;
}
.ui-menu .ui-menu-item {
  white-space: nowrap;
  cursor: default;
}
.ui-menu .ui-menu-item-wrapper {
  margin: 0 !important;
}
.ui-dialog {
  border-radius: 0;
  box-shadow: none;
}
.ui-dialog.no-titlebar .ui-dialog-titlebar {
  display: none;
}
.ui-dialog .ui-dialog-titlebar {
  height: 58px;
  border-bottom: 1px solid #e4e4e7;
}
.ui-dialog .ui-dialog-titlebar button:before {
  margin: 0;
}
.ui-dialog .ui-dialog-title {
  line-height: 58px;
  font-size: 1.25rem;
  padding: 0 3rem 0 1rem;
  color: #0a0a0b;
}
.ui-dialog .ui-dialog-titlebar-close {
  border: 0;
  color: #0a0a0b;
  background: transparent;
  right: 0;
  top: 0;
  position: absolute;
  padding: 0.25rem 0.5rem;
  margin: 15px 0.5rem;
}
.ui-dialog .ui-dialog-titlebar-close:before {
  content: "\f00d";
  line-height: 1.5rem;
  margin: 0 !important;
}
.ui-dialog .ui-dialog-content > .popupmenu {
  display: block !important;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
  display: flex;
  justify-content: flex-end;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link,
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button {
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 5rem;
  margin: 9px 4px;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link:last-child,
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button:last-child {
  margin-right: 0;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link {
  padding-right: 0;
  padding-left: 0;
  text-decoration: none;
  color: #0a0a0b;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link:focus {
  background-color: rgba(10, 10, 11, 0.5);
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link.options {
  order: -1;
  padding: 0.375rem 0.25rem;
  margin-right: 0.3rem;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link.options:before {
  content: "\f013";
  width: 100%;
  height: 1.25em;
}
.ui-dialog iframe,
.ui-dialog .ui-dialog-content.iframe {
  padding: 0;
  width: 100% !important;
  height: 100%;
  border: 0;
  overflow: hidden;
}
.ui-dialog,
.ui-dialog-content {
  box-sizing: initial;
}
.ui-widget-content .ui-icon.ui-resizable-se {
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%20%20%3Cpath%20fill%3D%22%23888%22%20d%3D%22M6.7%2016L16%206.7V5.3L5.3%2016zM9.7%2016L16%209.7V8.3L8.3%2016zM12.7%2016l3.3-3.3v-1.4L11.3%2016zM15.7%2016l.3-.3v-1.4L14.3%2016z%22%2F%3E%0A%3C%2Fsvg%3E%0A");
}
/* FIXME: why do I need !important here? */
@media screen and (max-width: 480px) {
  .ui-dialog {
    width: 100% !important;
    height: 100% !important;
    display: flex;
    flex-direction: column;
    border: 0;
    top: 0 !important;
  }
  .ui-dialog .ui-resizable-handle,
  .ui-dialog .ui-dialog-titlebar-close {
    display: none !important;
  }
  .ui-dialog .ui-dialog-titlebar {
    height: 58px;
    text-align: center;
    background-color: #f4f4f5;
  }
  .ui-dialog .ui-dialog-title {
    line-height: 58px;
    font-size: 1rem;
    padding: 0 1rem;
  }
  .ui-dialog .ui-dialog-content {
    flex: 1;
  }
  .ui-dialog .ui-dialog-content:not(.iframe) {
    padding: 1rem;
  }
  .ui-dialog .ui-dialog-buttonpane {
    padding: 0 !important;
    text-align: center !important;
    border-top: 1px solid #e4e4e7;
    height: 58px !important;
    background-color: #f4f4f5;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    justify-content: space-around;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button {
    margin: 0 !important;
    padding: 0.45rem;
    border: 0 !important;
    height: 58px;
    box-shadow: none;
    font-size: 90%;
    line-height: 1.5;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button:before {
    display: block !important;
    float: none;
    width: auto;
    height: 1.75rem;
    line-height: 1.75;
    margin: 0 !important;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button:active {
    box-shadow: none;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-primary,
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-secondary {
    color: #0a0a0b;
    background: transparent;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-danger {
    color: #e7000b;
    background: transparent;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.disabled,
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button:disabled {
    opacity: 0.5;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.cancel {
    order: 100;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link {
    color: #0a0a0b;
    margin: 0;
    padding: 0.45rem;
    font-size: 90%;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link.options:before {
    display: block !important;
    height: 1.75rem;
    line-height: 1.75;
    margin: 0;
  }
}
/* Slider widget */
.ui-slider {
  box-shadow: none;
}
.ui-slider .ui-slider-range {
  border-radius: 0.3rem;
  background: #53535b;
}
.ui-slider .ui-slider-handle {
  border-radius: 0.3rem;
}
.ui-slider .ui-slider-handle.ui-state-active {
  background: #0a0a0b;
  border-color: #18181b;
}
/* Datepicker widget */
.ui-datepicker {
  margin: calc(50vh - 10em) calc(50vw - 10em) !important;
  top: 0 !important;
  left: 0 !important;
  box-shadow: none;
  user-select: none;
}
.ui-datepicker:not(.ui-datepicker-inline) {
  z-index: 120 !important;
}
.ui-datepicker .ui-datepicker-header,
.ui-datepicker .ui-datepicker-title {
  line-height: 4rem;
  height: 4rem;
  padding: 0;
}
.ui-datepicker .ui-datepicker-header {
  border-bottom: 1px solid #e4e4e7;
}
.ui-datepicker .ui-datepicker-header a {
  height: 4rem;
}
.ui-datepicker .ui-datepicker-header select {
  display: inline-block;
}
.ui-datepicker .ui-icon {
  background-image: none !important;
  background-position: none !important;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  cursor: pointer;
  width: auto;
  color: #0a0a0b;
  text-decoration: none;
}
.ui-datepicker .ui-datepicker-prev:before,
.ui-datepicker .ui-datepicker-next:before {
  content: "\f053";
  margin: 0 0.25em;
  height: auto;
  width: 1em;
}
.ui-datepicker .ui-datepicker-prev:before {
  content: "\f053";
}
.ui-datepicker .ui-datepicker-next:before {
  content: "\f054";
}
.ui-datepicker td a {
  padding: 0;
  line-height: 1.8em;
  border-radius: 0.3rem;
}
.ui-datepicker .ui-state-default,
.ui-datepicker.ui-widget-content .ui-state-default {
  border: 0;
  background: transparent;
  color: #0a0a0b;
}
.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: #f4f4f5;
  color: #0a0a0b;
}
.ui-datepicker a.ui-state-active {
  background: #0a0a0b !important;
  color: #ffffff !important;
  font-weight: bold;
}
.ui-datepicker html.touch td a {
  font-size: 1.2em;
  line-height: 2.2em;
}
.input-group > .form-control.hasDatepicker {
  position: initial;
}
.minicolors-panel {
  border: 1px solid #e4e4e7;
  box-shadow: 3px 3px 5px rgba(9, 9, 11, 0.12);
  border-radius: 0.3rem;
  height: 152px;
  padding: 1px;
}
.input-group .minicolors-input {
  width: 100%;
  min-width: 130px;
  border-left: 0;
  border-right: 0;
}
@media screen and (max-width: 320px) {
  .ui-widget-content {
    border-radius: 0;
  }
  .ui-menu {
    border-radius: 0.3rem;
    left: 15px !important;
    right: 15px;
    width: auto;
  }
  .ui-dialog .ui-dialog-content:not(.iframe) {
    padding: 0.65rem;
  }
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** Dialogs and popovers ***/
.popupmenu {
  display: none;
  padding: 0;
  min-width: 180px;
  height: 100%;
}
.popupmenu li > a {
  width: 100%;
}
.popupmenu.propform {
  overflow: hidden;
  padding: 0.25rem;
}
.popupmenu.simplelist {
  min-width: 80px;
}
.popup.justified {
  display: flex;
  justify-content: space-around;
}
.popover-body {
  padding: 0;
  overflow-x: hidden;
}
.popover-body > .popupmenu {
  display: block !important;
}
.popover {
  box-shadow: 3px 3px 5px rgba(9, 9, 11, 0.12);
  border-color: #e4e4e7;
  padding: 0;
  z-index: 1300;
}
.popover .popover-header {
  display: none;
}
@media screen and (min-width: 769px) {
  .popover .listing li:first-child {
    border-radius: 0.25rem 0.25rem 0 0;
  }
  .popover .listing li:last-child {
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
  }
  .popover .listing ul.rounded-0 > li {
    border-radius: 0;
  }
}
html.layout-small .popover:not(.select-menu),
html.layout-phone .popover:not(.select-menu) {
  margin: 0 !important;
  padding: 0;
  right: 0;
  left: initial !important;
  bottom: 0;
  top: 0;
  width: 272px;
  transform: none !important;
  border-radius: 0;
  border: 0;
  display: flex;
  flex-direction: column;
  box-shadow: none;
}
html.layout-small .popover:not(.select-menu) div.arrow,
html.layout-phone .popover:not(.select-menu) div.arrow {
  display: none;
}
html.layout-small .popover:not(.select-menu) .listing li:last-child,
html.layout-phone .popover:not(.select-menu) .listing li:last-child {
  border-bottom: 1px solid #e4e4e7;
}
html.layout-small .popover-overlay,
html.layout-phone .popover-overlay {
  z-index: 1299;
  background-color: rgba(9, 9, 11, 0.5);
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
}
html.layout-small .popover-header,
html.layout-phone .popover-header {
  display: block;
  border-radius: 0;
  border: 0;
  padding: 0 0.5em;
  height: 58px;
  min-height: 58px;
  line-height: 58px;
  font-size: 16px;
  color: #ffffff;
  background-color: #0a0a0b;
}
html.layout-small .popover-header:before,
html.layout-phone .popover-header:before {
  display: none;
}
html.layout-small .popover-header a,
html.layout-phone .popover-header a {
  display: inline-block;
  width: 100%;
  color: #ffffff;
}
html.layout-small .popover-body > *,
html.layout-phone .popover-body > * {
  max-height: 100% !important;
}
html.touch .popover .listing li a {
  line-height: 47px;
  font-size: 16px;
  padding: 0 0.5em;
}
html.touch .popover .listing li a:before {
  float: left;
}
.select-menu {
  max-width: initial;
  margin: 0;
  height: auto;
  z-index: 1301;
}
.select-menu .popover-header {
  border-radius: 0.25rem 0.25rem 0 0 !important;
}
.select-menu .listing li a {
  padding-left: 0.25rem;
  outline: 0;
}
.select-menu .listing li:last-child {
  border-bottom-right-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
}
.select-menu.inline .listing li {
  padding-right: 0.5rem;
}
.select-menu.inline .listing li:first-child {
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}
/** PGP Key search/import dialog **/
.pgpkeyimport div.key {
  position: relative;
  padding: 0.5rem 0;
}
.pgpkeyimport div.key.revoked,
.pgpkeyimport div.key.disabled {
  color: #71717a;
}
.pgpkeyimport div.key label {
  display: inline-block;
  margin-right: 0.5em;
  margin-bottom: 0;
}
.pgpkeyimport div.key label:after {
  content: ":";
}
.pgpkeyimport div.key label.keyid {
  display: none;
}
.pgpkeyimport div.key label + a,
.pgpkeyimport div.key label + span {
  line-height: 2.6rem;
  margin-right: 1em;
  white-space: nowrap;
  text-decoration: none;
}
.pgpkeyimport div.key label.keyid + a {
  font-weight: bold;
}
.pgpkeyimport div.key label.keyid + a:before {
  content: "\f084";
}
.pgpkeyimport ul.uids {
  margin: 0;
  padding: 0;
}
.pgpkeyimport li.uid {
  border: 0;
  padding: 0.25rem 0 0 1.5em;
  line-height: 1.5rem !important;
  list-style-type: none;
}
.pgpkeyimport li.uid:before {
  content: "\f007";
  opacity: 0.25;
  font-size: 1em;
  line-height: 1.25;
}
.pgpkeyimport button.importkey {
  position: absolute;
  top: 0.5rem;
  right: 0;
}
.pgpkeyimport button:disabled {
  display: none;
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** Toolbar widget ***/
.menu {
  margin: 0;
  text-align: center;
  white-space: nowrap;
}
.menu a {
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
}
.menu a:before {
  content: "\00a0";
}
.menu a:hover,
.menu a:focus {
  outline: 0;
}
.menu a:not(.disabled):focus,
.menu a:not(.disabled):hover {
  background-color: #e4e4e7;
}
.menu.toolbar li {
  display: inline-block;
  height: 58px;
}
.menu.toolbar a {
  color: #0a0a0b;
  display: block;
  float: left;
  border: 0 !important;
  height: 58px;
  min-width: 3.2rem;
  max-width: 6rem;
  width: auto;
  padding: 0.45rem;
  line-height: 1.5;
  cursor: pointer;
  font-size: 1rem;
  text-align: center;
}
.menu.toolbar a:before {
  height: 1.75rem !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}
.menu.toolbar a.selected {
  color: #00bc7d;
}
.menu.toolbar > .spacer {
  width: 1em;
}
.menu.toolbar .dropbutton:not(.disabled):hover {
  background-color: #e4e4e7;
}
.menu.toolbar .dropbutton a.dropdown {
  padding: 0 0.3rem;
}
.menu.toolbar .dropbutton a.dropdown:before {
  line-height: 58px;
}
.menu.toolbar .dropbutton a.dropdown:hover {
  background-color: #d7d7db;
}
.menu span.inner {
  font-size: 90%;
  font-weight: normal;
}
.menu .dropbutton {
  display: inline-block;
}
.menu .dropbutton a.dropdown {
  font-size: 75%;
  min-width: 0;
}
html.ie11 .menu .dropbutton a.dropdown:before {
  font-size: 80%;
}
.menu .dropbutton a.dropdown span.inner {
  display: none;
}
.menu .dropbutton a:first-child {
  padding-right: 0;
}
.menu.pagenav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 !important;
  font-size: 100%;
}
.menu.pagenav a {
  flex-grow: 1;
  display: inline-block;
  min-width: 2rem !important;
  height: 35px;
  color: #0a0a0b;
}
.menu.pagenav a:before {
  margin: 0;
  display: inline;
  float: none;
  line-height: 35px;
}
.menu.pagenav .pagenav-text {
  overflow: hidden;
  text-overflow: ellipsis;
  color: #71717a;
  flex-grow: 4;
  font-size: 80%;
}
.menu.pagenav input {
  width: 3rem;
  max-width: 5rem;
  font-size: 90%;
  text-align: center;
  max-height: 1.6rem;
  margin: 0 0.2rem;
}
html.layout-phone .menu.pagenav input {
  display: none;
}
.menu.pagenav span.inner {
  display: none;
}
.menu.pagenav.pagenav-list {
  cursor: pointer;
  background-color: #ffffff;
  border-bottom: 1px solid #e4e4e7;
}
.menu.pagenav.pagenav-list a {
  flex-grow: unset;
}
.menu.pagenav.pagenav-list .pagenav-text {
  text-align: left;
  font-size: 100%;
}
.menu.pagenav.pagenav-list + .navlist {
  background-color: #fbfbfb;
}
.menu.pagenav.pagenav-list.expanded + .navlist {
  border-bottom: 1px solid #e4e4e7;
}
.menu.content-frame-navigation.hide-nav-buttons a.next,
.menu.content-frame-navigation.hide-nav-buttons a.prev {
  display: none;
}
.menu .listselectors {
  max-width: 100%;
  display: flex;
  justify-content: space-around;
}
.menu .buttons {
  display: block;
}
.menu .buttons button {
  display: block;
  float: left;
  cursor: pointer;
  color: #0a0a0b;
  background-color: transparent;
  border: 0;
  padding: 0;
  height: 58px;
  line-height: 58px;
  width: 2.5em;
}
.menu .buttons button:before {
  font-size: 1.75rem;
}
.popover .menu li {
  display: block;
  height: auto;
  text-align: left;
}
.popover .menu li.spacer {
  display: none;
}
.popover .menu li:last-child {
  border: 0;
}
.popover .menu li.separator {
  line-height: 1.5rem !important;
  font-size: 0.75rem !important;
  padding: 0 0.5rem;
  color: #71717a;
  background-color: #e4e4e7;
}
.popover .menu li.separator label {
  margin: 0;
}
.popover .menu li a {
  height: unset;
  max-width: 100%;
  width: 100%;
  line-height: 35px;
  display: block;
  padding: 0 0.5rem;
  text-align: left;
}
.popover .menu li a:before {
  line-height: inherit;
  height: inherit !important;
  margin-right: 0.5rem !important;
  float: left !important;
  width: 1.18em !important;
  min-width: 1.18em;
}
.popover .menu li a:not(.disabled):hover {
  color: #ffffff;
  background-color: #0a0a0b;
}
.popover .menu li a[aria-haspopup] {
  display: flex;
}
.popover .menu li a[aria-haspopup]:after {
  color: #71717a;
  font-size: 0.9em;
  margin: 0 0 0 0.2em;
  min-width: 1.18em;
  content: "\f054";
}
html.layout-small .popover .menu li a[aria-haspopup]:after {
  margin: 0 0.2em;
}
.popover .menu li a[aria-haspopup].dropdown:after {
  color: #0a0a0b;
  margin: 0 0.6em !important;
}
.popover .menu li a[aria-haspopup]:hover:after {
  color: #ffffff;
}
.popover .menu li a[aria-haspopup] > span {
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}
.popover .menu li span.inner {
  font-size: 100%;
}
.popover .menu .dropbutton {
  display: flex;
}
.popover .menu .dropbutton a:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}
.popover .menu .dropbutton:not(.disabled):hover {
  background-color: #f4f4f5;
}
.popover .menu .dropbutton a.dropdown {
  width: 3.5rem;
  padding: 0 0.5em;
  background-color: #f4f4f5;
}
.popover .menu .dropbutton a.dropdown:hover {
  background-color: #0a0a0b;
}
.popover .menu .dropbutton a.dropdown:before,
.popover .menu .dropbutton a.dropdown span.inner {
  display: none;
}
.popover .menu.no-icon a:before {
  display: none;
}
@media screen and (min-width: 769px) {
  .content-frame-navigation {
    display: none !important;
  }
  .header a.button.icon:not(.disabled):focus,
  .header a.button.icon:not(.disabled):hover {
    background-color: #e4e4e7;
    outline: 0;
  }
  .header a.button.icon:before {
    margin: 0;
  }
}
@media screen and (max-width: 768px) {
  .menu.footer {
    justify-content: space-around !important;
  }
  .menu.footer > * {
    flex-grow: 1;
  }
  .menu.footer .buttons {
    display: flex;
    justify-content: space-evenly;
  }
  .menu.footer .listselectors > * {
    flex-grow: 1;
  }
  .menu.listing a {
    color: #0a0a0b;
  }
}
a.toolbar-button {
  cursor: pointer;
}
@media screen and (min-width: 1201px) {
  a.toolbar-button {
    line-height: 1.5;
    padding: 0.45rem;
  }
  a.toolbar-button:before {
    float: none !important;
    height: 1.75rem !important;
    line-height: 1.5;
    width: auto !important;
  }
  a.toolbar-button span.inner {
    display: inline !important;
    font-weight: normal;
    font-size: 90%;
  }
}
/*** Menu button icons ***/
.menu a.mail:before {
  content: "\f0e0";
}
.menu a.contacts:before {
  content: "\f0c0";
}
.menu a.options:before {
  content: "\f1de";
}
.menu a.settings:before {
  content: "\f013";
}
.menu a.theme.light:before {
  content: "\f185";
}
.menu a.theme.dark:before {
  content: "\f186";
}
.menu a.help:before {
  content: "\f1cd";
}
.menu a.logout:before {
  content: "\f011";
}
.menu a.about:before {
  content: "\f128";
}
.menu a.refresh:before {
  content: "\f021";
}
.menu a.compose:before {
  content: "\f044";
}
.menu a.calendar:before {
  content: "\f073";
}
.menu a.tasklist:before {
  content: "\f0ae";
}
.menu a.files:before {
  content: "\f07b";
}
.menu a.notes:before {
  content: "\f249";
}
.menu a.chat:before {
  content: "\f086";
}
.menu a.actions:before {
  content: "\f013";
}
.menu a.addressbook:before {
  content: "\f007";
}
.menu a.archive:before {
  content: "\f187";
}
.menu a.assigngroup:before {
  content: "\f234";
}
.menu a.attach:before,
.menu a.vcard:before {
  content: "\f0c6";
}
.menu a.next:before {
  content: "\f061";
}
.menu a.prev:before,
.menu a.back:before {
  content: "\f060";
}
.menu a.check:before {
  content: "\00a0";
}
.menu a.check.selected:before {
  content: "\f00c";
}
.menu a.closewin:before {
  content: "\f410";
}
.menu a.collapse:before {
  content: "\f107";
}
.menu a.copy:before {
  content: "\f0c5";
}
.menu a.create:before {
  content: "\f0fe";
}
.menu a.delete:before {
  content: "\f2ed";
}
.menu a.download:before,
.menu a.download.eml:before,
.menu a.download.maildir:before,
.menu a.download.mbox:before {
  content: "\f019";
}
.menu a.dropdown:before {
  content: "\f0d7";
}
.menu a.edit:before {
  content: "\f303";
}
.menu a.encrypt:before,
.menu a.enigma:before {
  content: "\f023";
}
.menu a.encrypt.sign:before {
  content: "\f023";
}
.menu a.expand:before {
  content: "\f105";
}
.menu a.expand.all:before {
  content: "\f103";
}
.menu a.expand.none:before {
  content: "\f102";
}
.menu a.export:before,
.menu a.export.all:before,
.menu a.export.selection:before {
  content: "\f019";
}
.menu a.expunge:before {
  content: "\f78c";
}
.menu a.extwin:before {
  content: "\f360";
}
.menu a.filterlink:before {
  content: "\f0b0";
}
.menu a.firstpage:before {
  content: "\f100";
}
.menu a.nextpage:before {
  content: "\f105";
}
.menu a.prevpage:before {
  content: "\f104";
}
.menu a.lastpage:before {
  content: "\f101";
}
.menu a.flag:before,
.menu a.select.flagged:before {
  content: "\f024";
  font-weight: 900;
}
.menu a.unflag:before {
  content: "\f024";
  font-weight: 400;
}
.menu a.undo:before {
  content: "\f01e";
}
.menu a.folders:before {
  content: "\f07b";
}
.menu a.forward:before,
.menu a.forward.attachment:before,
.menu a.forward.bounce:before,
.menu a.forward.inline:before {
  content: "\f064";
}
.menu a.import:before,
.menu a.upload:before {
  content: "\f093";
}
.menu a.insertresponse:before {
  content: "\f075";
}
.menu a.junk:before {
  content: "\f7e4";
}
.menu a.notjunk:before {
  content: "\f01c";
}
.menu a.markmessage:before {
  content: "\f02b";
}
.menu a.more:before {
  content: "\f141";
}
.menu a.move:before {
  content: "\f07c";
}
.menu a.print:before {
  content: "\f02f";
}
.menu a.properties:before {
  content: "\f15b";
}
.menu a.purge:before {
  content: "\f12d";
}
.menu a.qrcode:before {
  content: "\f029";
}
.menu a.read:before {
  content: "\f2b6";
  font-weight: 400;
}
.menu a.unread:before,
.menu a.expand.unread:before,
.menu a.select.unread:before {
  content: "\f0e0";
  font-weight: 900;
}
.menu a.recipient:before {
  content: "\f0e0";
  font-weight: 400;
}
.menu a.refresh:before {
  content: "\f021";
}
.menu a.remove:before {
  content: "\f12d";
}
.menu a.removegroup:before {
  content: "\f235";
}
.menu a.rename:before {
  content: "\f303";
}
.menu a.reply:before {
  content: "\f3e5";
}
.menu a.reply-all:before,
.menu a.reply.all:before,
.menu a.reply.list:before {
  content: "\f122";
}
.menu a.responses:before {
  content: "\f075";
}
.menu a.rotate:before {
  content: "\f2f9";
}
.menu a.save:before {
  content: "\f0c7";
  font-weight: 400;
}
.menu a.search:before {
  content: "\f002";
}
.menu a.search.delete:before {
  content: "\f2ed";
}
.menu a.select:before {
  content: "\f245";
}
.menu a.select.all:before {
  content: "\f069";
}
.menu a.select.invert:before {
  content: "\f14a";
}
.menu a.select.none:before {
  content: "\f00d";
  font-weight: 900;
}
.menu a.select.page:before {
  content: "\f0c9";
  font-weight: 900;
}
.menu a.selection:before {
  content: "\f14a" !important;
  font-weight: 400 !important;
}
.menu a.send:before {
  content: "\f1d8";
}
.menu a.showurl:before {
  content: "\f0c1";
}
.menu a.signature:before {
  content: "\f5b7";
}
.menu a.source:before {
  content: "\f1c9";
}
.menu a.spellcheck:before {
  content: "\f891";
}
.menu a.status:before {
  content: "\f0eb";
  font-weight: 400;
}
.menu a.submit:before {
  content: "\f00c";
}
.menu a.info:before {
  content: "\f05a";
}
.menu a.threads:before {
  content: "\f086";
}
.menu a.zoomin:before {
  content: "\f00e";
}
.menu a.zoomout:before {
  content: "\f010";
}
/*** Searchbar and searchoptions widgets ***/
.searchbar {
  height: 36px;
  min-height: 36px;
  line-height: 36px;
  background-color: #ffffff;
  border-bottom: 1px solid #e4e4e7;
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
}
.searchbar form {
  flex: 1;
  display: flex;
}
.searchbar form:before {
  content: "\f002";
  height: 36px;
  color: #71717a;
  margin: 0 0 0 0.75rem;
}
.searchbar input {
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0.5rem;
  line-height: normal;
  outline: 0;
}
.searchbar input::-ms-clear {
  display: none;
}
.searchbar a {
  color: #0a0a0b;
}
.searchbar a:before {
  width: 2rem;
  height: 36px;
  margin: 0;
}
.searchbar a.options:before {
  content: "\f107";
}
.searchbar a.reset:before {
  content: "\f00d";
  font-size: 1rem;
}
.searchbar a.unread:before {
  content: "\f0e0";
  font-weight: 900;
}
.searchbar a.reset,
.searchbar a.search {
  display: none;
}
.searchbar a.selected {
  color: #00bc7d;
}
.searchbar span.inner {
  display: none;
}
.searchbar.active a.reset {
  display: inline;
}
.searchbar.open a.options:before {
  content: "\f106";
}
.searchoptions button.search {
  width: 100%;
}
.searchoptions ul.proplist + div {
  margin-top: 1rem;
}
.searchoptions .input-group:not(:last-child) {
  margin-bottom: 0.5rem;
}
.searchoptions .input-group .input-group-prepend {
  width: 30%;
}
.searchoptions .input-group label {
  width: 100%;
}
.searchoptions .formbuttons {
  display: block !important;
}
/*** Taskmenu ***/
#taskmenu a {
  display: block;
  float: none;
}
@media screen and (max-width: 480px) {
  #taskmenu {
    z-index: 30001;
    overflow-x: hidden;
  }
  #taskmenu a {
    max-width: unset;
    padding: 0 0.5em;
    margin-top: 1px;
    text-align: left;
    line-height: 47px;
    height: 47px;
    border-bottom: 1px solid #e4e4e7 !important;
    color: #0a0a0b;
    font-size: 1.2rem;
  }
  #taskmenu a:before {
    float: left !important;
    width: 1.2em !important;
    margin-right: 0.5rem !important;
  }
  #taskmenu span.inner {
    font-size: 100%;
  }
}
@media screen and (min-width: 481px) {
  #taskmenu a {
    color: #a1a1aa;
    padding: 0.45rem 0;
    min-width: unset;
  }
  #taskmenu a.selected {
    color: #ffffff;
    background: #27272a;
  }
  #taskmenu a.selected:hover {
    color: #ffffff;
    background: #18181b;
  }
  #taskmenu a:hover {
    color: #ffffff;
    background: #18181b;
  }
  #taskmenu .special-buttons {
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #0a0a0b;
  }
  #taskmenu .action-buttons a {
    color: #ffffff;
    background: transparent;
  }
  #taskmenu .action-buttons a:hover {
    color: #ffffff;
    background: #18181b;
  }
  #taskmenu a.logout {
    color: #a1a1aa !important;
  }
  #taskmenu a.logout:hover {
    color: #ff6467 !important;
  }
}
@media screen and (min-width: 481px) and (max-width: 1024px) {
  #taskmenu a {
    width: 42px;
    height: 42px;
    font-size: 1.2rem;
    padding: 0;
  }
  #taskmenu a:before {
    line-height: 42px;
  }
  #taskmenu span.inner {
    display: none;
  }
}
@media screen and (min-width: 1025px) {
  #taskmenu a {
    width: 78px;
    font-size: 1rem;
  }
  #taskmenu a:before {
    float: none;
  }
  #taskmenu a:focus {
    background-color: #27272a;
  }
  #taskmenu span.inner {
    padding: 0 0.1em;
  }
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** UI Messages ***/
.ui.alert {
  margin: 0;
  margin-bottom: 0.2rem;
  opacity: 0.95;
  width: 100%;
  padding: 0.75em;
  color: #0a0a0b;
  border: 1px solid transparent;
  background-color: #f4f4f5;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 480px) {
  .ui.alert {
    border: 0;
  }
}
.ui.alert span {
  margin: auto 0;
}
.ui.alert > i.icon {
  line-height: 1;
  color: #47474e;
  margin: auto 0;
}
.ui.alert > i.icon:before {
  content: "\f05a";
  margin-right: 0.6rem;
}
.ui.alert .btn {
  margin-left: 0.5rem;
}
.ui.alert.loading {
  color: #71717a;
}
.ui.alert.loading > i.icon:before {
  content: "\f1ce";
  -webkit-animation: spinner-border 1.5s infinite linear;
  animation: spinner-border 1.5s infinite linear;
  width: 1em;
}
.ui.alert.alert-success > i.icon:before {
  content: "\f058";
  color: #00bc7d;
}
.ui.alert.alert-warning > i.icon:before {
  content: "\f071";
  color: #ffb900;
}
.ui.alert.alert-danger > i.icon:before {
  content: "\f06a";
  color: #e7000b;
}
.ui.alert.vcardattachment > i.icon:before {
  content: "\f2bb";
}
.ui.alert.enigmaattachment > i.icon:before {
  content: "\f084";
}
.ui.alert.signed > i.icon:before,
.ui.alert.encrypted > i.icon:before {
  content: "\f023";
}
.ui.alert.chat > i.icon:before {
  content: "\f075";
}
.ui.alert .boxbuttons {
  white-space: nowrap;
}
.ui.alert .boxbuttons .btn {
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 220px;
}
@media screen and (max-width: 480px) {
  .ui.alert .boxbuttons {
    display: flex;
    flex-direction: column;
  }
  .ui.alert .boxbuttons .btn {
    max-width: 160px;
  }
  .ui.alert .boxbuttons .btn:not(:first-child) {
    margin-top: 0.25rem;
  }
}
.ui.alert.aligned-buttons {
  display: flex;
}
.ui.alert.aligned-buttons span {
  flex: 1;
}
.ui.alert a:not(.btn) {
  color: #0a0a0b;
  font-weight: 500;
}
.ui.alert h3 {
  font-weight: bold;
  font-size: 1.2rem;
}
.ui.alert p {
  margin: 1rem 0;
}
.ui.alert.boxerror,
.ui.alert.boxconfirmation,
.ui.alert.boxinformation,
.ui.alert.boxwarning {
  padding: 0.5em;
  border-radius: 0;
}
.ui.alert.boxerror i.icon,
.ui.alert.boxconfirmation i.icon,
.ui.alert.boxinformation i.icon,
.ui.alert.boxwarning i.icon {
  font-size: 1.5em !important;
}
.ui.alert.boxerror {
  background-color: rgba(231, 0, 11, 0.2);
}
.ui.alert.boxinformation {
  background-color: rgba(10, 10, 11, 0.2);
}
.ui.alert.boxconfirmation {
  background-color: rgba(0, 188, 125, 0.2);
}
.ui.alert.boxwarning {
  background-color: rgba(255, 185, 0, 0.2);
}
.ui.alert + table {
  margin-top: 1em;
}
#messagestack {
  position: absolute;
  bottom: 0.5em;
  right: 0.7em;
  z-index: 105;
  width: 320px;
  height: auto;
  max-height: 85%;
}
@media screen and (max-width: 480px) {
  #messagestack {
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
  }
}
#messagestack div {
  background-color: #0a0a0b;
  color: #ffffff;
}
@media screen and (max-width: 480px) {
  #messagestack div {
    margin: 0;
    border-radius: 0;
    min-height: 4.2rem;
  }
}
#messagestack div.voice {
  position: absolute;
  top: -1000px;
}
#messagestack div i.icon {
  font-size: 1.5em !important;
}
#messagestack div > i.icon:before {
  color: #ffffff;
}
#messagestack div:last-child {
  margin-bottom: 0;
}
#messagestack .loading {
  background-color: #71717a;
}
#messagestack .alert-info.information {
  background-color: #0a0a0b;
}
#messagestack .alert-success {
  background-color: #00bc7d;
}
#messagestack .alert-warning {
  background-color: #ffb900;
  color: #0a0a0b;
}
#messagestack .alert-warning > i.icon:before {
  color: #0a0a0b;
}
#messagestack .alert-danger {
  background-color: #e7000b;
}
#messagestack a {
  color: inherit !important;
  text-decoration: underline;
  cursor: pointer;
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** List and treelist widgets ***/
.listing tbody td,
.listing li {
  border-bottom: 1px solid #e4e4e7;
  cursor: default;
  font-weight: normal;
  line-height: 35px;
}
.listing tbody td,
.listing li a {
  padding: 0 0.5rem;
  white-space: nowrap;
  vertical-align: middle;
  color: #0a0a0b;
}
.listing tbody td {
  overflow: hidden;
  text-overflow: ellipsis;
  outline: none;
}
.listing tbody td a {
  color: #0a0a0b;
}
.listing li a {
  display: block;
  text-decoration: none;
  cursor: default;
  width: 100%;
}
.listing li.selected,
.listing tr.selected td {
  color: #0a0a0b;
  background-color: #e4e4e7;
}
.listing td.selection {
  padding: 0 0 0 0.5em;
  width: 2em;
  text-align: center;
}
.listing td.selection > input {
  vertical-align: middle;
}
.listing:not(.withselection) td.selection {
  display: none;
}
.listing td.name {
  overflow: hidden;
  text-overflow: ellipsis;
}
.listing td.action {
  padding: 0 0.5em;
  width: 2em;
  text-align: center;
}
.listing td.action:empty {
  width: 0;
}
.listing td.action a {
  display: block;
  overflow: hidden;
  text-decoration: none;
}
.listing td.action a:before {
  margin: 0;
  font-size: 1rem;
}
.listing td.action a.pushgroup:before {
  content: "\f054";
}
.listing li.droptarget > a,
.listing tr.droptarget > td {
  background-color: #f4f4f5;
}
.listing li.disabled,
.listing tr.disabled td {
  color: #a1a1aa;
}
.listing li > a.virtual,
.listing li.virtual > a {
  opacity: 0.4;
}
.listing span.secondary {
  color: #71717a;
}
html:not(.touch) .listing li > a,
html:not(.touch) .listing tbody tr > td:first-child,
html:not(.touch) .listing:not(.withselection) tbody tr > td.selection + td {
  border-left: 2px solid transparent;
}
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 #0a0a0b;
  outline: 0;
}
table.listing {
  width: 100%;
  table-layout: fixed;
  border-spacing: 0;
  border-collapse: unset;
}
ul.listing {
  margin: 0;
  padding: 0;
}
ul.listing > ul {
  padding: 0;
}
ul.listing li {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
  list-style: none;
}
ul.listing li ul {
  border-top: 1px solid #e4e4e7;
  padding-left: 1.5em;
}
ul.listing li ul li:last-child {
  border-bottom: none;
}
ul.listing li .custom-switch {
  position: absolute;
  padding: 0;
  top: 0;
  right: 0;
  height: 35px;
  vertical-align: middle;
}
ul.listing li .custom-switch .custom-control-label:before,
ul.listing li .custom-switch .custom-control-label:after {
  margin-top: 0.4rem;
}
html.touch ul.listing li .custom-switch .custom-control-label:before,
html.touch ul.listing li .custom-switch .custom-control-label:after {
  margin-top: 0.75rem;
}
html.touch ul.listing li .custom-switch {
  height: 47px;
}
ul.listing.simplelist li {
  padding: 0 0.5rem;
}
.listing-info {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
  text-align: center;
  font-weight: bold;
  color: #71717a;
}
.listing-hover-menu {
  position: absolute;
  right: 5px;
  top: -1000px;
  height: 2.4em;
  background-color: white;
  border: 1px solid #ddd;
  padding: 0.25em;
  box-shadow: 0 0 5px lightgrey;
  border-radius: 0.25em;
}
.listing-hover-menu a.button {
  cursor: pointer;
  display: inline-block;
  width: 1.5em;
  line-height: 1;
  margin: 0.25em 0.25em;
  color: #0a0a0b;
}
.listing-hover-menu a.button:hover {
  background: transparent;
}
.listing-hover-menu span.txt {
  font-size: 90%;
  color: #71717a;
  display: inline-block;
  vertical-align: middle;
  margin: -1.25em 0.25em 0;
}
html.touch .listing:not(.toolbar) li,
html.touch .listing tbody td {
  line-height: 47px;
  font-size: 1.2rem;
}
html.touch li input[type=checkbox] {
  height: 47px;
}
html.touch td.selection {
  padding: 0;
  width: 3em;
}
@media screen and (max-width: 1200px) {
  .listing.selection-large-only li.selected {
    color: #0a0a0b;
    background-color: transparent;
  }
}
/* icons */
.listing.iconized li a:before {
  height: 2em;
  margin-right: 0.5rem;
}
.listing.iconized li.preferences > a:before {
  content: "\f1de";
}
.listing.iconized li.folders > a:before {
  content: "\f07b";
}
.listing.iconized li.responses > a:before {
  content: "\f075";
}
.listing.iconized li.identities > a:before {
  content: "\f2c2";
}
.listing.iconized li.password > a:before {
  content: "\f023";
}
.listing.iconized li.addressbook a:before {
  content: "\f2b9";
  font-weight: 400;
}
.listing.iconized li.contactgroup a:before {
  content: "\f0c0";
  font-weight: 900;
}
.listing.iconized li.contactsearch a:before {
  content: "\f002";
}
.listing.iconized li.filter > a:before {
  content: "\f0b0";
}
.listing.iconized li.vacation > a:before {
  content: "\f017";
  font-weight: 400;
}
.listing.iconized li.forward > a:before {
  content: "\f14d";
}
.listing.iconized li.enigma.keys > a:before {
  content: "\f084";
}
.listing.iconized li.info > a:before,
.listing.iconized li.userinfo > a:before {
  content: "\f05a";
}
.listing.iconized li.twofactorauth > a:before {
  content: "\f2f6";
}
.listing.iconized li a.help:before {
  content: "\f1cd";
}
.listing.iconized li a.about:before {
  content: "\f059";
  font-weight: 400;
}
.listing.iconized li a.license:before {
  content: "\f3ed";
}
.listing.iconized li > i:before {
  content: "\f007";
  margin-left: 0.5rem;
  line-height: normal;
}
.listing.iconized li.group > i:before {
  content: "\f0c0";
}
#rcmKSearchpane > ul > li {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  padding: 0.5em 0;
}
#rcmKSearchpane > ul > li > span.fields {
  display: flex;
  flex-flow: row wrap;
  width: auto;
  overflow: hidden;
  margin: 0 0.25em;
}
#rcmKSearchpane > ul > li > span.fields > span.field {
  flex: 0 0 100%;
  font-size: 1rem;
  line-height: normal;
  overflow: hidden;
  text-overflow: ellipsis;
}
html.ie11 .listing.iconized li a:before {
  font-size: 1.25rem;
}
.listing.iconized tr td:before {
  margin-right: 0.5rem;
}
.listing.iconized tr.contact.person td.name:before {
  content: "\f007";
}
.listing.iconized tr.contact.group td.name:before {
  content: "\f0c0";
}
.listing.iconized tr.general > td.section:before {
  content: "\f108";
}
.listing.iconized tr.mailbox > td.section:before {
  content: "\f0e0";
  font-weight: 400;
}
.listing.iconized tr.mailview > td.section:before {
  content: "\f01c";
}
.listing.iconized tr.compose > td.section:before {
  content: "\f1d8";
}
.listing.iconized tr.addressbook > td.section:before {
  content: "\f0c0";
}
.listing.iconized tr.folders > td.section:before {
  content: "\f07b";
  font-weight: 400;
}
.listing.iconized tr.server > td.section:before {
  content: "\f233";
}
.listing.iconized tr.encryption > td.section:before {
  content: "\f023";
}
.listing.iconized tr.calendar > td.section:before {
  content: "\f133";
}
.listing.iconized tr.chat > td.section:before {
  content: "\f086";
}
/* selectable list: e.g. spellcheck language selection */
.listing.iconized.selectable li a:before {
  content: "";
}
.listing.iconized.selectable li a.selected:before {
  content: "\f00c";
}
.popupmenu .listing li > a {
  border-left: 0;
}
.popupmenu .listing li > a:not(.disabled):hover {
  color: #ffffff;
  background-color: #0a0a0b;
}
.popupmenu .listing li.selected {
  color: #ffffff;
  background-color: #0a0a0b;
}
.popupmenu .listing td {
  overflow: hidden;
  text-overflow: ellipsis;
}
ul.treelist li div.treetoggle {
  position: absolute;
  top: 0;
  left: 0;
  width: 1.5em;
  cursor: pointer;
  background-color: transparent;
}
ul.treelist li div.treetoggle:before {
  content: "\f105";
  margin-left: 0.25em;
  font-size: 1em;
}
ul.treelist li div.treetoggle.expanded:before {
  content: "\f107";
}
ul.treelist li > a {
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: 1.5em;
}
ul.treelist li.selected {
  color: inherit;
  background-color: transparent;
}
ul.treelist li.selected > div > a,
ul.treelist li.selected > a {
  color: #0a0a0b;
  background-color: #e4e4e7;
}
ul.treelist li ul {
  padding: 0;
}
ul.treelist li ul li {
  padding-left: 0;
}
ul.treelist li ul li a {
  padding-left: 3em;
}
ul.treelist li ul li div.treetoggle {
  left: 1.5em;
}
ul.treelist li ul li li a {
  padding-left: 4.5em;
}
ul.treelist li ul li li div.treetoggle {
  left: 3em;
}
ul.treelist li ul li li li a {
  padding-left: 6em;
}
ul.treelist li ul li li li div.treetoggle {
  left: 4.5em;
}
ul.treelist li ul li li li li a {
  padding-left: 7.5em;
}
ul.treelist li ul li li li li div.treetoggle {
  left: 6em;
}
ul.treelist li ul li li li li li a {
  padding-left: 9em;
}
ul.treelist li ul li li li li li div.treetoggle {
  left: 7.5em;
}
ul.treelist.notree div.treetoggle {
  display: none;
}
ul.treelist.notree li > a {
  padding-left: 0.5em;
}
/*** Folders list widget ***/
.folderlist li.mailbox.unread > a {
  padding-right: 2.8em;
  font-weight: bold;
}
.folderlist li.mailbox .unreadcount {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 2em;
  line-height: 1.4rem;
  margin: 7.7px;
  padding: 0 0.3em;
  border-radius: 0.4em;
  background: #0a0a0b;
  color: #ffffff;
  text-align: center;
  font-weight: bold;
}
html.touch .folderlist li.mailbox .unreadcount {
  line-height: 2rem;
  margin: 9.5px;
}
.folderlist li.mailbox.recent > a {
  color: #0a0a0b;
}
.folderlist li.mailbox.recent > a > .unreadcount {
  background: #0a0a0b;
  color: #ffffff;
}
.folderlist li.mailbox.root {
  display: none !important;
}
.folderlist li a:before {
  content: "\f07b";
  font-weight: 400;
  margin-right: 0.5rem;
}
.folderlist li.inbox > a:before {
  content: "\f01c";
  font-weight: 900;
}
.folderlist li.trash a:before {
  content: "\f2ed";
  font-weight: 900;
}
.folderlist li.trash.empty > a:before {
  content: "\f2ed";
  font-weight: 400;
}
.folderlist li.drafts a:before {
  content: "\f303";
  font-weight: 900;
}
.folderlist li.sent a:before {
  content: "\f1d8";
  font-weight: 900;
}
.folderlist li.junk a:before {
  content: "\f7e4";
  font-weight: 900;
}
.folderlist li.archive > a:before {
  content: "\f187";
  font-weight: 900;
}
.folderlist li.ns-shared > a:before {
  content: "\f1e0";
  font-weight: 900;
}
.folderlist li.ns-other > a:before {
  content: "\f500";
  font-weight: 900;
}
.folderlist.menu a:before {
  margin-left: 0.5em;
}
/*** Messages list widget ***/
.messagelist > thead,
.messagelist .branch,
table.fixedcopy {
  display: none;
}
.messagelist td {
  border-left: 0;
  width: 2em;
  vertical-align: top;
  font-size: 1rem !important;
}
.messagelist td.subject {
  width: 100%;
  padding-right: 0;
  display: flex;
  flex-wrap: wrap;
}
.messagelist td.subject a {
  text-decoration: none;
  cursor: default;
}
.messagelist td.subject span {
  line-height: 2em;
}
.messagelist td.subject span.size,
.messagelist td.subject span.date {
  font-size: 90%;
  color: #71717a;
}
.messagelist td.subject span.fromto {
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  font-size: 90%;
  color: #71717a;
  padding-left: 1.5em;
  padding-right: 0.5rem;
}
.messagelist td.subject span.subject {
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  user-select: none;
}
.messagelist td.threads {
  padding: 0 0 0 0.25rem;
  width: 1.5em;
}
.messagelist td.flags {
  width: 2.5em;
}
.messagelist td.flags > span {
  height: 1.7em;
  line-height: 1.7em;
  display: block;
}
.messagelist td.flags > span.flag {
  cursor: pointer;
}
.messagelist tr.flagged td,
.messagelist tr.flagged span.size,
.messagelist tr.flagged td.subject span.subject a,
.messagelist tr.flagged td.subject span.date,
.messagelist tr.flagged td.subject span.fromto {
  color: #e7000b;
}
.messagelist tr.deleted td,
.messagelist tr.deleted td.subject span.subject a,
.messagelist tr.deleted td.subject span.date,
.messagelist tr.deleted td.subject span.fromto {
  color: #a1a1aa;
}
.messagelist tr.unread td.subject span.subject {
  font-weight: bold;
}
.messagelist tr.unroot td.subject a {
  text-decoration: underline;
}
.messagelist tr.thread td.threads div:before {
  content: "\f105";
  cursor: pointer;
  width: 1em;
}
.messagelist tr.thread.expanded td.threads div:before {
  content: "\f107";
}
.messagelist td.subject span.msgicon.status:before {
  content: "\f111";
  cursor: pointer;
  font-size: 0.4rem;
  width: 1.1rem;
  height: 2rem;
}
.messagelist td.subject span.msgicon.status.unread:before {
  content: "\f111";
  font-size: 0.5rem;
}
.messagelist td.subject span.msgicon.status.unreadchildren:before {
  content: "\f111";
  font-weight: 400;
  font-size: 0.5rem;
}
.messagelist td.subject span.msgicon.status.replied:before {
  content: "\f3e5";
  font-weight: 900;
  font-size: 1rem;
}
.messagelist td.subject span.msgicon.status.forwarded:before {
  content: "\f064";
  font-weight: 900;
  font-size: 1rem;
}
.messagelist td.subject span.msgicon.status.replied.forwarded:before {
  content: "\f3e5";
  font-weight: 900;
  font-size: 1rem;
}
.messagelist td.subject span.msgicon.status.replied.forwarded:after {
  content: "\f064";
  font-weight: 900;
  font-size: 1rem;
  opacity: 0.5;
  margin: 0 -0.1em 0 -1.25em;
}
.messagelist span.attachment span {
  color: #a1a1aa;
}
.messagelist span.attachment span:before {
  margin: 0;
  content: "\f0c6";
}
.messagelist span.attachment span.report:before {
  content: "\f15c";
  font-weight: 400;
}
.messagelist span.attachment span.encrypted:before {
  content: "\f023";
}
.messagelist span.attachment span.vcard:before {
  content: "\f007";
  font-weight: 400;
}
.messagelist span.flagged:before {
  content: "\f024";
}
.messagelist tr.flaggedroot:not(:hover) span.unflagged:before {
  content: "\f024";
  color: #a1a1aa;
}
.messagelist span.size {
  display: none;
}
.messagelist.sort-size span.date {
  display: none;
}
.messagelist.sort-size span.size {
  display: inline;
}
html.layout-phone .messagelist tr,
html.touch .messagelist tr {
  position: relative;
  display: flex;
}
html.layout-phone .messagelist td.selection,
html.touch .messagelist td.selection,
html.layout-phone .messagelist td.threads,
html.touch .messagelist td.threads {
  line-height: 3.8em;
}
html.layout-phone .messagelist td.flags,
html.touch .messagelist td.flags {
  position: absolute;
  top: 0.25rem;
  right: 0;
  bottom: 0;
  background-color: transparent;
}
html.layout-phone .messagelist td.flags .flag,
html.touch .messagelist td.flags .flag {
  visibility: hidden;
}
html.layout-phone .messagelist td.subject,
html.touch .messagelist td.subject {
  padding-right: 0.5em;
}
html.layout-phone .messagelist td.subject .subject,
html.touch .messagelist td.subject .subject {
  padding-right: 1.5rem;
}
/* Contacts list */
.contactlist .contact.readonly td {
  font-style: italic;
}
.contactlist td.contact:before {
  content: "\f007";
}
.contactlist td.contactgroup:before {
  content: "\f0c0";
}
.contactlist span.email {
  display: inline;
  color: #71717a;
  font-style: italic;
  margin-left: 0.5em;
}
.contactlist li a:before {
  margin-right: 0.5rem;
}
.contactlist li a.addressbook::before {
  content: "\f2b9";
  font-weight: 400;
}
.contactlist li a.contactgroup::before {
  content: "\f0c0";
  font-weight: 900;
}
/* Attachments list */
.attachmentslist {
  padding: 0;
  margin: 0;
  background-color: #fafafa;
  border: 1px solid #e4e4e7;
}
.attachmentslist:empty {
  padding: 0;
  border: 0;
}
.attachmentslist li {
  list-style: none;
  display: inline-flex;
  white-space: nowrap;
  line-height: 2rem;
  padding: 0 0.25em;
  max-width: 100%;
}
.attachmentslist li:before {
  content: "\f15b";
  font-weight: 400;
  height: 2rem;
  margin: 0;
}
.attachmentslist li.txt:before,
.attachmentslist li.text:before {
  content: "\f15c";
  font-weight: 400;
}
.attachmentslist li.pdf:before {
  content: "\f1c1";
  font-weight: 400;
}
.attachmentslist li.odt:before,
.attachmentslist li.doc:before,
.attachmentslist li.docx:before,
.attachmentslist li.msword:before {
  content: "\f1c2";
  font-weight: 400;
}
.attachmentslist li.ods:before,
.attachmentslist li.xls:before,
.attachmentslist li.xlsx:before,
.attachmentslist li.msexcel:before {
  content: "\f1c3";
  font-weight: 400;
}
.attachmentslist li.rar:before,
.attachmentslist li.zip:before,
.attachmentslist li.gz:before {
  content: "\f1c6";
  font-weight: 400;
}
.attachmentslist li.image:before,
.attachmentslist li.jpg:before,
.attachmentslist li.jpeg:before,
.attachmentslist li.png:before {
  content: "\f1c5";
  font-weight: 400;
}
.attachmentslist li.mp3:before,
.attachmentslist li.audio:before {
  content: "\f1c7";
  font-weight: 400;
}
.attachmentslist li.m4p:before,
.attachmentslist li.video:before {
  content: "\f1c8";
  font-weight: 400;
}
.attachmentslist li.vcard:before {
  content: "\f2bb";
  font-weight: 400;
}
.attachmentslist li.html:before {
  content: "\f1c9";
  font-weight: 400;
}
.attachmentslist li.odp:before,
.attachmentslist li.otp:before,
.attachmentslist li.ppt:before,
.attachmentslist li.pptx:before,
.attachmentslist li.ppsx:before,
.attachmentslist li.vnd.mspowerpoint:before {
  content: "\f1c4";
  font-weight: 400;
}
.attachmentslist li a {
  text-decoration: none;
  line-height: 2rem;
  height: 2rem;
}
.attachmentslist li a.cancelupload:before,
.attachmentslist li a.delete:before {
  content: "\f2ed";
  line-height: 2rem;
  height: 2rem;
  margin: 0;
}
.attachmentslist li a.dropdown:before {
  margin: 0;
}
.attachmentslist li.uploading:before {
  -webkit-animation: spinner-border 1.5s infinite linear;
  animation: spinner-border 1.5s infinite linear;
  content: "\f1ce";
  font-weight: 900;
}
.attachmentslist li a.filename {
  display: flex;
  overflow: hidden;
  padding: 0 0.2em;
}
.attachmentslist li .attachment-name {
  overflow: hidden;
  text-overflow: ellipsis;
  color: #0a0a0b;
}
.attachmentslist li .attachment-size {
  color: #71717a;
  padding-left: 0.25em;
}
.keylist {
  padding: 0;
  list-style: none;
}
.keylist li {
  line-height: 2;
}
.keylist li:before {
  content: "\f084";
  line-height: 1.5;
}
#identities-table td.mail:before {
  content: "\f2c2";
}
#responses-table td.name:before {
  content: "\f075";
}
#filterslist td.name:before {
  content: "\f0b0";
}
#filtersetslist td.name:before {
  content: "\f15c";
}
#subscription-table li.mailbox a {
  padding-right: 2.5rem;
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** Common form elements ***/
#uploadform {
  display: none;
}
form.smart-upload,
input.smart-upload {
  visibility: hidden;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.propform:not(.popupmenu) {
  width: 100%;
}
.propform .form-check td:not(.title) > label {
  display: block;
  margin: 0;
  line-height: 2rem;
}
.propform .form-check td:not(.title) > label label {
  margin-right: 0.5rem;
}
.propform td.datetime {
  display: flex;
}
.propform td.datetime input:first-child {
  margin-right: 0.5rem;
}
.propform td.datetime input:last-child {
  width: 75%;
}
.propform td.rowbuttons {
  width: 1%;
  white-space: nowrap;
  vertical-align: top;
}
.propform td.rowbuttons span {
  display: none;
}
.propform td.rowbuttons a {
  padding: 0;
  line-height: 2.3rem;
  height: 2.3rem;
  font-size: 1rem;
}
.propform td.rowbuttons a:before {
  content: "\f067";
  vertical-align: unset;
}
@media screen and (min-width: 577px) {
  .propform td.rowbuttons a:before {
    margin: 0 !important;
  }
}
.propform td.rowbuttons a.delete:before {
  content: "\f2ed";
}
.propform td.rowbuttons a.advanced:before {
  content: "\f013";
}
.propform td.rowbuttons a:not(:last-child) {
  margin-right: 0.25rem;
}
.propform td.rowactions {
  width: 1%;
  vertical-align: top;
}
.propform td.rowactions .form-control {
  width: auto;
}
.propform td.rowtargets {
  vertical-align: top;
}
.propform td.rowtargets .composite input,
.propform td.rowtargets .composite textarea,
.propform td.rowtargets .composite select,
.propform td.rowtargets .composite .multi-input,
.propform td.rowtargets .composite .input-group {
  margin-bottom: 0.5rem;
}
.propform td.rowtargets .composite .input-group input,
.propform td.rowtargets .composite .input-group textarea,
.propform td.rowtargets .composite .input-group select,
.propform td.rowtargets .composite .input-group .multi-input {
  margin-bottom: 0;
}
.propform td.rowtargets .composite br {
  display: block;
}
.propform td.rowtargets .input-group {
  margin-bottom: 0.25rem;
}
.propform td.rowtargets .input-group *:first-child.input-group-prepend {
  text-align: left;
  min-width: 7.5em;
}
.propform td.rowtargets .input-group *:first-child.input-group-prepend > * {
  width: 100%;
}
.propform td.rowtargets > .advanced {
  margin-top: 0.25rem;
}
.propform td.title {
  padding-top: 0;
  padding-bottom: 0;
}
.propform td > .flexbox {
  display: flex;
}
.propform td > .flexbox > .multi-input {
  width: 100%;
  margin-left: 0.25rem;
}
.propform.grouped.readonly legend {
  margin: 0;
}
.propform.grouped.readonly .row.input-group {
  margin-bottom: 0 !important;
}
.propform.grouped.readonly label {
  min-width: 7rem;
  background-color: transparent;
  border: 0;
  border-radius: 0;
}
.propform.grouped .row.input-group {
  margin-bottom: 0.5rem;
  flex-wrap: nowrap;
}
.propform.grouped .row.input-group > *:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 8rem;
}
.propform.grouped .row.input-group > *:first-child:not(select) {
  padding: 0;
}
@media screen and (max-width: 480px) {
  .propform.grouped .row.input-group > *:first-child {
    min-width: 6rem;
    width: 6rem;
    flex-grow: unset;
  }
}
.propform.grouped .row.input-group > *:first-child label {
  width: 100%;
}
.propform.grouped .row.input-group > *:nth-child(2) {
  flex-grow: 30;
}
.propform.grouped .row.input-group:last-child {
  margin-bottom: 1rem;
}
.propform.grouped .row.input-group select {
  text-align: left;
}
.propform.grouped .row.input-group.composite select {
  height: auto;
}
.propform.grouped .row.input-group .content {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  border-radius: 0;
  border-left-color: transparent;
}
.propform.grouped .row.input-group .content input {
  border-radius: 0;
  border-color: transparent;
}
.propform.grouped .row.input-group .content .ff_street {
  width: 100%;
}
.propform.grouped .row.input-group .content .ff_locality {
  width: 75%;
}
.propform.grouped .row.input-group .content .ff_zipcode {
  width: 25%;
}
.propform.grouped .row.input-group .content .ff_country,
.propform.grouped .row.input-group .content .ff_region {
  width: 50%;
}
.propform.grouped .form-control-plaintext {
  flex-grow: 1;
  border: 0;
}
.propform .addfield {
  margin: 0;
}
.propform .addfield select {
  width: fit-content;
  margin-top: 0.5rem;
}
.propform .form-text {
  font-size: 90%;
  color: #71717a;
}
.propform.row.form-group {
  margin-left: 0;
  margin-right: 0;
}
.propform.row.form-group label,
.propform.row.form-group div {
  padding-left: 0;
  padding-right: 0;
}
.propform select + select,
.propform select + .input-group {
  padding-top: 0.5rem;
}
.propform.text-only {
  margin-bottom: 0.25rem;
}
.propform.text-only tr {
  margin: 0;
}
.propform.text-only label {
  padding-bottom: 0 !important;
}
@media screen and (max-width: 576px) {
  .propform.text-only tr {
    display: table-row;
  }
  .propform.text-only td {
    width: auto;
  }
  .propform.text-only td:first-child {
    width: 33%;
  }
  .propform.text-only :not(tr).form-group.row .col-form-label {
    width: 33%;
  }
  .propform.text-only :not(tr).form-group.row > :last-child {
    width: 67%;
  }
}
@media screen and (max-width: 576px) {
  .propform table.compact-table .rowactions > select,
  .propform table.compact-table .flexbox > select {
    width: 100%;
  }
  .propform table.compact-table tr {
    display: flex;
    flex-direction: column;
  }
  .propform table.compact-table tr td {
    width: 100%;
    padding: 0.25rem 0 0 0;
  }
  .propform table.compact-table tr td.rowbuttons {
    text-align: right;
    padding-top: 0;
  }
  .propform table.compact-table tr td.rowbuttons a {
    margin-left: 0.5rem;
  }
  .propform table.compact-table tr td.rowbuttons a > span {
    display: inline;
  }
}
.propform fieldset:not(.tab-pane):nth-of-type(n+2),
.formcontent fieldset:not(.tab-pane):nth-of-type(n+2) {
  margin-top: 1em;
}
.propform legend,
.formcontent legend {
  font-weight: bold;
  font-size: 1.2em;
}
.propform label,
.formcontent label {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  overflow: hidden;
  margin-bottom: 0;
}
fieldset.advanced > legend {
  width: auto;
  cursor: pointer;
}
fieldset.advanced > legend:after {
  float: right;
  margin: 0 0 0 0.25rem;
  line-height: inherit;
  font-size: inherit;
  content: "\f106";
}
fieldset.advanced > legend.closed:after {
  content: "\f107";
}
@media screen and (max-width: 576px) {
  .formcontent .text-only .form-group:not(tr) {
    margin-bottom: 0.25rem;
  }
  .formcontent .text-only .form-group:not(tr) .col-form-label {
    width: 33%;
  }
  .formcontent .text-only .form-group:not(tr) .col-form-label + span {
    width: 67%;
  }
  html.iframe .formcontent > .propform {
    padding: 0.25rem;
  }
}
html.ms .propform .row:not(.form-check) > td {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (min-width: 576px) {
  html.ms .propform .row.form-check > td {
    display: flex;
  }
}
.formcontainer {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow-y: hidden !important;
}
.formcontainer .formcontent {
  overflow-x: hidden;
  overflow-y: auto;
}
.formcontainer .formbuttons {
  padding: 0.5rem 1rem;
}
.formcontainer .formbuttons button {
  margin-right: 0.5rem;
}
html.iframe.ipad .formcontainer .formbuttons,
html.iframe.webkit.tablet .formcontainer .formbuttons {
  min-height: 4rem;
}
html.layout-small .formcontainer,
html.layout-phone .formcontainer {
  display: initial;
  overflow-y: auto !important;
}
html.layout-small .formcontainer .formcontent,
html.layout-phone .formcontainer .formcontent {
  overflow: initial !important;
}
html.layout-small .formcontainer .formbuttons,
html.layout-phone .formcontainer .formbuttons {
  display: none;
}
.formcontent:not(.popupmenu) {
  padding: 1rem;
}
.formcontent .row {
  margin-right: 0;
  margin-left: 0;
}
.formcontent .row .col,
.formcontent .row .col-2,
.formcontent .row .col-4,
.formcontent .row .col-6,
.formcontent .row .col-8,
.formcontent .row .col-10,
.formcontent .row .col-12,
.formcontent .row .col-sm,
.formcontent .row .col-sm-2,
.formcontent .row .col-sm-4,
.formcontent .row .col-sm-6,
.formcontent .row .col-sm-8,
.formcontent .row .col-sm-10,
.formcontent .row .col-sm-12 {
  padding: 0;
}
.formcontent .row .form-control-plaintext,
.formcontent .row label.col-form-label {
  padding: 5px 5px 5px 0;
}
.formcontent .row .form-control-plaintext {
  padding-bottom: 0;
  border: 0;
}
@media screen and (max-width: 576px) {
  .formcontent .row.form-group > td label {
    padding-bottom: 0;
  }
}
.formcontent .row.form-check {
  padding: 0;
  display: flex;
  flex-wrap: nowrap;
}
@media screen and (max-width: 576px) {
  .formcontent .row.form-check .col-6 {
    max-width: 100%;
    flex: auto;
  }
  .formcontent .row.form-check > *:last-child {
    width: 1%;
    min-width: 2.6rem;
  }
  .formcontent .row.form-check.with-link > *:last-child {
    min-width: 8rem;
  }
}
.formcontent .row.form-check .form-check-input {
  margin: 0.5rem 0;
}
.formcontent .row.form-check .custom-switch + a {
  line-height: 2;
  vertical-align: bottom;
}
.formcontent .row.form-check td > label {
  padding-bottom: 0;
}
.formcontent .nav-tabs {
  margin-bottom: 1rem;
}
.formcontent .nav-tabs:empty {
  display: none;
}
.formcontent .hint {
  font-style: italic;
  color: #71717a;
}
.formcontent.raweditor {
  height: 100%;
}
.formcontent.raweditor form {
  height: 100%;
}
.formcontent.raweditor textarea {
  font-family: monospace;
  height: 100%;
}
.formcontent.raweditor .CodeMirror {
  border: 1px solid #e4e4e7;
  border-radius: 0.3rem;
  height: 100%;
  color: #0a0a0b;
}
.formcontent.raweditor .CodeMirror-focused {
  border-color: #0a0a0b;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12);
}
.formcontent.raweditor .CodeMirror-linebackground.line-error {
  background-color: #e7000b;
  opacity: 0.4;
}
.formcontent.raweditor .errorGutter {
  width: 0.8em;
}
@media screen and (max-width: 320px) {
  .formcontent .col-form-label {
    flex: auto;
    max-width: 100%;
  }
  .formcontent .col-6,
  .formcontent .col-8,
  .formcontent .col-10 {
    flex: auto;
    max-width: 100%;
  }
}
/* Some common icons for "iconized inputs" */
.input-group .icon {
  text-decoration: none;
  padding: 5px 0.5rem;
}
.input-group .icon.input-group-text {
  min-width: 2.4rem;
}
.input-group .icon:before {
  margin: 0 !important;
  line-height: 1;
  font-size: 1.1rem;
}
.input-group .icon.user:before {
  content: "\f007";
}
.input-group .icon.pass:before {
  content: "\f023";
}
.input-group .icon.host:before {
  content: "\f015";
}
.input-group .icon.language:before {
  content: "\f0ac";
}
.input-group .icon.cancel:before {
  content: "\f00d";
}
.input-group .icon.delete:before {
  content: "\f2ed";
}
.input-group .icon.edit:before {
  content: "\f303";
}
.input-group .icon.add:before {
  content: "\f067";
}
.input-group .icon.add.recipient:before {
  content: "\f0c0";
}
.input-group .icon.search:before {
  content: "\f002";
}
.input-group .icon.filter:before {
  content: "\f0b0";
}
.input-group .icon.key:before {
  content: "\f084";
}
.input-group .icon .inner {
  display: none;
}
.input-group a:focus {
  background-color: rgba(10, 10, 11, 0.12);
  outline: 0;
}
.proplist {
  margin-bottom: 0;
  padding: 0;
}
.proplist li {
  list-style-type: none;
  line-height: 2rem;
  margin-bottom: 0.25rem;
  display: flex;
  align-items: center;
}
.proplist li:last-child {
  margin-bottom: 0;
}
.proplist li input[type=radio] {
  margin-right: 0.5em;
}
.proplist li input[type=radio]:disabled + label {
  opacity: 0.5;
}
.proplist li label:not(.input-group-text) {
  margin: 0;
  line-height: 2rem;
}
.proplist li select {
  width: auto;
  display: inline;
}
.proplist li.with-sublist {
  flex-wrap: wrap;
  position: relative;
}
.proplist li.with-sublist > :first-child {
  width: 100%;
  margin-right: 2em;
}
.proplist li.with-sublist > .proplist {
  margin-left: 2.5rem;
}
.proplist li.with-sublist > a.dropdown {
  position: absolute;
  right: 0;
  top: 0;
  height: 2em;
  color: #0a0a0b;
}
.checklist > div {
  line-height: 2rem;
  display: block;
}
.checklist .custom-control-label:before,
.checklist .custom-control-label:after {
  margin: calc(2px * -1) 0 0 0;
}
.checklist > div + br {
  display: none;
}
/*** Forms in popups ***/
.popup form.propform {
  padding: 0.25rem;
  overflow-x: hidden;
}
.popupmenu.form.nolist {
  padding: 0 0.5rem;
}
.popupmenu.form ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}
.popupmenu.form li:not(.separator) {
  padding: 0 1rem;
}
.popupmenu.form li:not(.separator) label {
  margin: 0;
  line-height: 35px;
}
.popupmenu.form li:not(.separator) label input {
  margin-right: 0.5rem;
}
.popupmenu.form input {
  vertical-align: middle;
}
.popupmenu.form select {
  margin: 0.5rem 0;
}
.popupmenu.form .buttons {
  text-align: center;
  padding: 0.5rem;
}
/*** Smart list (multiple input) field ***/
.multi-input > .content {
  max-height: 11.65em;
  overflow: hidden;
  overflow-y: auto;
  border-radius: 0.25rem;
  border: 1px solid #e4e4e7;
}
.multi-input > .content.focused {
  border-color: #0a0a0b;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12);
}
.multi-input a.icon.reset:before {
  content: "\f2ed";
}
.multi-input input.form-control {
  padding-left: 0.75rem;
  height: auto;
}
.multi-input input,
.multi-input input:focus,
.multi-input .input-group-text {
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid #e4e4e7;
  box-shadow: none;
}
.multi-input .input-group-text {
  border-left: 1px solid #e4e4e7;
}
.multi-input .input-group-append {
  margin-left: 0;
}
.multi-input .input-group {
  margin: 0 !important;
  flex-wrap: nowrap;
}
.multi-input .input-group:last-child * {
  border-bottom: 0;
}
.multi-input + .btn {
  margin-top: 0.5rem;
}
.multi-input.is-invalid > .content {
  border: 1px solid #e7000b;
}
.multi-input.is-invalid > .content.focused {
  border-color: #e7000b;
  box-shadow: 0 0 0 0.2rem rgba(231, 0, 11, 0.18);
}
.multi-input.is-invalid > .invalid-feedback {
  display: inline-block;
  line-height: 1.5;
}
/*** Files upload widget with list of files, upload form and drop area ***/
.file-upload {
  padding: 1rem 1rem 12rem;
  margin: 0 1rem 0.25rem 1rem;
  border-radius: 0.5rem;
  border: 0.2rem dashed #e4e4e7;
}
fieldset .file-upload {
  margin: 0;
}
.file-upload .upload-form {
  text-align: center;
  padding-bottom: 1em;
}
.file-upload .upload-form a.btn,
.file-upload .upload-form button {
  margin-bottom: 0.25rem;
}
.file-upload .hint {
  margin-bottom: 0.5rem;
  color: #71717a;
  text-align: center;
}
.file-upload .attachmentslist {
  border: 0;
  background: transparent;
}
.file-upload .attachmentslist li {
  position: relative;
  display: flex;
  padding-right: 1.5em;
  margin: 0.15em 0;
}
.file-upload .attachmentslist li a.filename {
  flex: 1;
}
.file-upload .attachmentslist li a.delete,
.file-upload .attachmentslist li a.cancelupload {
  position: absolute;
  right: 0.25em;
  width: auto;
}
.file-upload .attachmentslist li a.dropdown {
  margin-right: 0.5em;
}
.file-upload .attachmentslist li .inner {
  display: none;
}
.file-upload.droptarget {
  padding-bottom: 0.5rem !important;
}
.file-upload.droptarget:after {
  content: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20960%20560%22%3E%0A%3Cpath%20fill%3D%22%23d4dbde%22%20d%3D%22M690%20245c0%209.2-3.5%2017.9-10.1%2024.9l-175%20175c-6.6%206.6-15.3%2010.1-24.9%2010.1-9.2%200-18.4-3.5-24.9-10.1l-175-175c-6.6-7-10.1-15.8-10.1-24.9%200-4.4.9-9.2%202.6-13.6C277.9%20218.3%20291%20210%20305%20210h87.5V35c0-19.2%2015.8-35%2035-35h105c19.2%200%2035%2015.8%2035%2035v175H655c14%200%2027.1%208.3%2032.4%2021.4%201.7%204.4%202.6%209.2%202.6%2013.6zm0%20245H270V350h-70v140c0%2038.5%2031.5%2070%2070%2070h420c38.5%200%2070-31.5%2070-70V350h-70v140z%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  width: 10rem;
  margin: 5rem auto 0 auto;
  display: block;
}
.file-upload.droptarget.active {
  border-color: #aeaeb7;
}
.file-upload.droptarget.hover {
  border-color: #aeaeb7;
  background-color: #e4e4e7;
}
/*** Smart recipient input field ***/
.recipient-input {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0.75rem 4px 0.75rem;
  list-style-type: none;
  cursor: text;
  height: auto;
}
.recipient-input.focus {
  border-color: #0a0a0b;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12);
}
.recipient-input li {
  max-width: 100%;
}
.recipient-input li:not(.recipient) {
  user-select: text;
}
.recipient-input li.input {
  flex: 1;
  min-width: 100px;
}
.recipient-input input {
  width: 100%;
  background: transparent !important;
  border: 0 !important;
  margin-top: 4px;
  outline: 0;
  line-height: 1.5;
}
.recipient-input input::-ms-clear {
  display: none;
}
.recipient-input li.recipient,
body > li.recipient.ui-sortable-helper {
  display: flex;
  position: relative;
  max-width: calc(50% - 3px);
  border: 1px solid #e4e4e7;
  background-color: #f4f4f5;
  border-radius: 0.25rem;
  padding: 0 0.25rem;
  margin-top: 4px;
  margin-right: 0.2em;
  white-space: nowrap;
  cursor: default;
}
@media screen and (max-width: 450px) {
  .recipient-input li.recipient,
  body > li.recipient.ui-sortable-helper {
    width: 100%;
    max-width: 100%;
  }
}
.recipient-input li.recipient .name,
body > li.recipient.ui-sortable-helper .name {
  overflow: hidden;
  text-overflow: ellipsis;
  flex-grow: 1;
  line-height: 1.1;
  padding: 3px;
  vertical-align: middle;
}
.recipient-input li.recipient .email,
body > li.recipient.ui-sortable-helper .email {
  text-indent: -5000rem;
  display: inline-block;
  width: 0;
}
.recipient-input li.recipient .quotes,
body > li.recipient.ui-sortable-helper .quotes {
  position: absolute;
  width: 0;
  opacity: 0;
}
.recipient-input li.recipient a.button.icon,
body > li.recipient.ui-sortable-helper a.button.icon {
  font-size: 0.75em;
  cursor: pointer;
  padding: 0;
  color: #0a0a0b;
}
.recipient-input li.recipient a.button.icon:before,
body > li.recipient.ui-sortable-helper a.button.icon:before {
  display: inline-block;
  width: 1em;
  line-height: 1.6;
}
.recipient-input li.recipient.ui-sortable-helper,
body > li.recipient.ui-sortable-helper.ui-sortable-helper {
  padding: 0 0 0 0.25rem !important;
}
/*** Tagedit widget (from jqueryui plugin) ***/
.tagedit-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0.75rem 4px 0.75rem;
  margin: 0;
  list-style-type: none;
  min-height: 2.3rem;
}
.tagedit-list + .placeholder {
  display: none;
}
.tagedit-list[tabindex="-1"] {
  border-color: #0a0a0b;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12);
}
.tagedit-list li.tagedit-listelement-new {
  margin-top: 4px;
}
.tagedit-list li.tagedit-listelement-new input {
  width: 15px;
  background: transparent !important;
  border: 0;
  outline: 0;
  margin: 0;
  padding: 0;
  line-height: 1.5;
}
.tagedit-list li.tagedit-listelement-new input.tagedit-input-disabled {
  visibility: hidden;
}
.tagedit-list li.tagedit-listelement-old {
  max-width: 50%;
  border: 1px solid #e4e4e7;
  background-color: #f4f4f5;
  border-radius: 0.25em;
  margin-top: 4px;
  margin-right: 0.2em;
  white-space: nowrap;
}
.tagedit-list li.tagedit-listelement-old a {
  font-size: 0.8em;
  cursor: pointer;
  display: inline-block;
  width: 1.1em;
  overflow: hidden;
  vertical-align: middle;
  margin-right: 0.2rem;
  color: inherit;
  text-decoration: none;
}
.tagedit-list li.tagedit-listelement-old a:before {
  content: "\f00d";
  width: 1em;
  line-height: 1.2;
}
.tagedit-list li.tagedit-listelement-old span {
  overflow: hidden;
  text-overflow: ellipsis;
  flex-grow: 1;
  display: inline-block;
  line-height: 1.4;
  padding: 0 0.25rem;
  vertical-align: middle;
}
/*** Skin selection widget ***/
.skinselection {
  white-space: nowrap;
  display: table-row;
}
.skinselection > span {
  display: table-cell;
  vertical-align: middle;
  padding: 0.1em 0.5em;
  white-space: normal;
}
.skinselection > span:last-child {
  padding-right: 0;
}
.skinselection .skinitem input {
  width: auto;
}
.skinselection .skinname {
  font-weight: bold;
}
.skinselection .skinlicense,
.skinselection .skinlicense a {
  font-style: italic;
  text-decoration: none;
}
.skinselection .skinlicense a:hover {
  text-decoration: underline;
}
.skinselection .skinlicense,
.skinselection .skinauthor {
  font-size: 90%;
}
.skinselection .skinthumbnail {
  width: 64px;
  height: 64px;
  border: 1px solid #e4e4e7;
  background: #fff;
  border-radius: 4px;
}
/*** Percent input with jQuery-UI slider ***/
.input-percent-slider {
  display: flex;
  align-items: center;
}
.input-percent-slider input {
  max-width: 4em;
}
.input-percent-slider span.label {
  line-height: 2.4;
  padding: 0 0.5rem 0 0.25rem;
}
.input-percent-slider div.ui-slider {
  flex: 1;
  margin: 0 0.5em;
}
/*** Image upload widget ***/
.image-upload {
  position: relative;
  overflow: hidden;
  cursor: pointer;
  background-color: #f4f4f5;
}
.image-upload a.button {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  background-color: rgba(255, 255, 255, 0.85);
  border-radius: 5px;
  width: 2.5em;
  padding: 0.5em;
  margin: 0.5em;
  line-height: 1;
}
.image-upload.changed a.button {
  display: inline;
}
.input-group-combo select:first-of-type.alone {
  border-radius: 0.25rem !important;
}
.input-group-combo select:first-of-type:not(.alone) {
  flex: unset;
  width: auto;
}
.input-group-combo .input-group {
  padding: 0 !important;
  flex: 2;
}
.input-group-combo select + select,
.input-group-combo .input-group :first-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
/*** General browser hacks ***/
@-moz-document url-prefix() {
  select:-moz-focusring {
    color: transparent !important;
    text-shadow: 0 0 0 #0a0a0b !important;
  }
}
/*** Bootstrap style overrides and improvements ***/
.form-control {
  color: #0a0a0b;
}
.form-control.custom-select {
  padding-right: 1.75rem;
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center / 8px 10px;
}
.form-control:focus {
  color: #0a0a0b;
  border-color: #0a0a0b;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12);
}
.form-control.is-invalid {
  border-color: #e7000b;
  box-shadow: none;
}
.form-control.is-invalid:focus {
  border-color: #e7000b;
  box-shadow: 0 0 0 0.2rem rgba(231, 0, 11, 0.18);
}
.form-control::placeholder {
  color: #a1a1aa;
}
.form-control::-ms-input-placeholder,
.form-control::-webkit-input-placeholder {
  color: #a1a1aa;
}
.invalid-feedback {
  color: #e7000b;
  font-size: 90%;
}
.form-group {
  margin-bottom: 0.5rem;
}
.input-group-append.input-group-prepend {
  display: inline;
}
.input-group-text {
  color: #0a0a0b;
  background-color: #f4f4f5;
}
.input-group-text input:focus {
  z-index: 1;
  border-color: #0a0a0b !important;
}
.custom-switch {
  padding-left: 0;
  display: inline-block;
}
.custom-switch .custom-control-input {
  left: 0;
  opacity: 0 !important;
}
.custom-switch .custom-control-input:focus ~ .custom-control-label:before {
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12);
}
.custom-switch .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
  border-color: #0a0a0b;
}
.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
  border-color: #d4d4d8;
  background-color: #d4d4d8;
}
.custom-switch .custom-control-input:checked:disabled ~ .custom-control-label::before {
  border-color: #a1a1aa;
  background-color: #a1a1aa;
}
.custom-switch .custom-control-label {
  padding-left: 2.5rem;
  min-height: 2rem;
  line-height: 2;
  display: inline-block;
}
html.touch .custom-switch .custom-control-label {
  padding-left: 3rem;
}
.custom-switch .custom-control-label:before,
.custom-switch .custom-control-label:after {
  border-radius: 0.6rem;
  margin: 2px 0;
}
html.touch .custom-switch .custom-control-label:before,
html.touch .custom-switch .custom-control-label:after {
  border-radius: 0.8rem;
  margin: 0;
}
.custom-switch .custom-control-label:before {
  left: 2px;
  top: 4px;
  width: 26px;
  height: 16px;
}
html.touch .custom-switch .custom-control-label:before {
  top: 2px;
  width: 35px;
  height: 22px;
}
.custom-switch .custom-control-label:after {
  left: 4px;
  top: 6px;
  width: 12px;
  height: 12px;
}
html.touch .custom-switch .custom-control-label:after {
  top: 4px;
  height: 18px;
  width: 18px;
}
.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  transform: translateX(10px);
}
html.touch .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  transform: translateX(13px);
}
.custom-switch .custom-control-input:not(:disabled) ~ .custom-control-label:after,
.custom-switch .custom-control-input:not(:disabled) ~ .custom-control-label:before {
  cursor: pointer;
}
.custom-file {
  display: block;
}
.custom-file .custom-file-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 100px;
}
.custom-file + .hint {
  margin-top: 3px;
}
.custom-file-input:focus ~ .custom-file-label {
  border-color: #0a0a0b;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12);
}
/**
 * Roundcube Webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
/*** Text Editor widget (and TinyMCE editor) ***/
div.tox {
  font-size: 1rem;
}
div.tox,
div.tox :not(.svg) {
  font-family: Roboto, sans-serif;
}
div.tox.tox-tinymce {
  border-radius: 0.25rem;
  border: 1px solid #e4e4e7;
}
div.tox.focused {
  border-color: #0a0a0b !important;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12) !important;
}
div.tox .tox-toolbar-overlord {
  z-index: 1;
}
div.tox .tox-toolbar-overlord > div {
  background: url("data:image/svg+xml;charset=utf8,%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='%23cccccc'/%3E%3C/svg%3E");
  background-color: #f4f4f5;
}
div.tox .tox-toolbar__primary {
  border-top: 0;
}
div.tox .tox-toolbar {
  background-color: #f4f4f5;
}
div.tox .tox-edit-area {
  border: 0;
}
div.tox .tox-dialog {
  border-radius: 0;
  border-color: #e4e4e7;
  box-shadow: none;
  align-self: unset !important;
}
div.tox .tox-dialog .tox-form__group {
  margin-top: 0;
  margin-bottom: 0.75rem;
}
div.tox .tox-dialog .tox-dialog__body-nav-item--active {
  color: #0a0a0b;
  border-color: transparent;
}
div.tox .tox-dialog .tox-dialog__body-nav-item--active:hover {
  color: #52525b;
}
div.tox .tox-dialog__body-content {
  overflow: unset;
}
div.tox .tox-dialog__content-js {
  overflow: auto;
}
div.tox .tox-dialog-wrap__backdrop {
  background-color: rgba(9, 9, 11, 0.5);
}
div.tox .tox-dialog__header {
  height: 57px;
  border-bottom: 1px solid #e4e4e7;
  justify-content: flex-end;
  padding: 0;
}
div.tox .tox-dialog__header .tox-button {
  color: #0a0a0b;
  right: 0;
  height: 57.3px;
  width: 2.25em;
  margin-right: 0.4rem;
}
div.tox .tox-dialog__header .tox-button:hover {
  background: transparent;
  border-color: transparent;
}
div.tox .tox-dialog__header .tox-button .tox-icon {
  display: none;
}
div.tox .tox-dialog__header .tox-button:before {
  content: "\f00d";
  line-height: 1.5rem;
  margin: 0 !important;
}
div.tox .tox-dialog__footer {
  height: 57px !important;
  border: 0;
  margin: 0;
  padding: 0 1rem;
}
@media screen and (max-width: 480px) {
  div.tox .tox-dialog__footer {
    border-top: 1px solid #e4e4e7;
  }
}
div.tox .tox-dialog__footer > div {
  white-space: nowrap;
  max-height: 57px;
}
div.tox .tox-dialog__footer > div button:first-child {
  margin: 0;
}
div.tox .tox-dialog__footer .tox-button {
  color: #fafafa;
  background: #0a0a0b;
  border-color: #0a0a0b;
  border: 1px solid transparent;
  font-weight: normal;
  padding: 0.5rem 0.75rem;
}
div.tox .tox-dialog__footer .tox-button:focus {
  background: #000000;
  border-color: #000000;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.5);
}
div.tox .tox-dialog__footer .tox-button:hover {
  background: #000000;
  border-color: #000000;
}
div.tox .tox-dialog__footer .tox-button.disabled,
div.tox .tox-dialog__footer .tox-button:disabled {
  background: #0a0a0b;
  border-color: #0a0a0b;
}
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: #000000;
  border-color: #000000;
}
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(10, 10, 11, 0.53);
}
div.tox .tox-dialog__footer .tox-button:before {
  width: 1em;
  content: "\f00c";
  line-height: 1;
}
div.tox .tox-dialog__footer .tox-button:focus:not(:disabled) {
  background: #0a0a0b;
  border-color: #0a0a0b;
}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary {
  background: #f4f4f5;
  border-color: #f4f4f5;
  border: 1px solid #e4e4e7;
  color: #0a0a0b;
}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:focus {
  background: #e7e7e9;
  border-color: #e1e1e4;
  box-shadow: 0 0 0 0.2rem rgba(244, 244, 245, 0.5);
}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:hover {
  background: #e7e7e9;
  border-color: #e1e1e4;
}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary.disabled,
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:disabled {
  background: #f4f4f5;
  border-color: #f4f4f5;
}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:not(:disabled):not(.disabled):active,
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:not(:disabled):not(.disabled).active {
  background: #d9d9dd;
  border-color: #d4d4d8;
}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:not(:disabled):not(.disabled):active:focus,
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:not(:disabled):not(.disabled).active:focus {
  box-shadow: 0 0 0 0.2rem rgba(244, 244, 245, 0.53);
}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:before {
  content: "\f00d";
}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:focus:not(:disabled) {
  background: #f4f4f5;
  border-color: #f4f4f5;
}
div.tox .tox-search-dialog .tox-form__group:not(:first-child) {
  flex: initial !important;
}
div.tox .tox-search-dialog .tox-dialog__footer-start button {
  padding: 0.25rem;
}
div.tox .tox-search-dialog .tox-dialog__footer-end button:before {
  content: "\f303" !important;
}
div.tox .tox-search-dialog .tox-dialog__footer-end button:nth-of-type(1):before {
  content: "\f002" !important;
}
div.tox .tox-dialog__title {
  line-height: calc(58px - 1px);
  font-size: 1.25rem;
  font-weight: bold;
  padding: 0 0 0 1rem;
  width: 100%;
  color: #0a0a0b;
}
div.tox .tox-tbtn {
  height: 28px;
}
div.tox .tox-tbtn:not(.tox-tbtn--select,.tox-split-button__chevron) {
  width: 32px;
}
div.tox .tox-button {
  line-height: 1.5;
}
div.tox .tox-label {
  color: #0a0a0b;
  padding-bottom: 0.25rem;
}
div.tox .tox-color-input > input,
div.tox .tox-listboxfield .tox-listbox--select,
div.tox .tox-textarea,
div.tox .tox-textfield {
  font-family: Roboto, sans-serif !important;
  font-size: 14px;
  line-height: 1.5;
  color: #0a0a0b;
  border-radius: 0.25rem;
  min-height: 0;
  padding: 0.375rem 0.75rem;
}
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: #0a0a0b;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12);
}
div.tox .tox-listbox__select-label {
  margin: 0;
}
div.tox .tox-color-input span {
  top: 5px;
}
div.tox .custom-switch {
  position: relative;
  font-size: 1rem;
  margin-top: 0.15rem;
}
div.tox .custom-switch .tox-checkbox__icons {
  display: none;
}
div.tox .custom-switch .tox-checkbox__label {
  margin: 0;
}
div.tox .image-selector {
  font-size: 1rem;
}
div.tox .image-selector button {
  color: #0a0a0b;
  background: #f4f4f5;
  border-color: #f4f4f5;
  border: 1px solid #e4e4e7;
  padding: 0.5rem 0.75rem;
  line-height: 1.5;
}
div.tox .image-selector button:focus {
  background: #e7e7e9;
  border-color: #e1e1e4;
  box-shadow: 0 0 0 0.2rem rgba(244, 244, 245, 0.5);
}
div.tox .image-selector button:hover {
  background: #e7e7e9;
  border-color: #e1e1e4;
}
div.tox .image-selector button.disabled,
div.tox .image-selector button:disabled {
  background: #f4f4f5;
  border-color: #f4f4f5;
}
div.tox .image-selector button:not(:disabled):not(.disabled):active,
div.tox .image-selector button:not(:disabled):not(.disabled).active {
  background: #d9d9dd;
  border-color: #d4d4d8;
}
div.tox .image-selector button:not(:disabled):not(.disabled):active:focus,
div.tox .image-selector button:not(:disabled):not(.disabled).active:focus {
  box-shadow: 0 0 0 0.2rem rgba(244, 244, 245, 0.53);
}
div.tox .tox-form__controls-h-stack div:not(:last-child) {
  flex: 1;
}
div.tox .tox-collection__item-label {
  white-space: nowrap;
}
@media screen and (max-width: 480px) {
  div.tox .tox-dialog {
    margin: 0 !important;
    width: 100% !important;
    height: 100%;
    left: 0 !important;
    top: 0 !important;
    border-width: 0 !important;
  }
  div.tox .tox-dialog__header {
    background-color: #f4f4f5;
  }
  div.tox .tox-dialog__header .tox-button {
    display: none;
  }
  div.tox .tox-dialog__title {
    font-size: 1rem;
    text-align: center;
    padding: 0 1rem;
  }
  div.tox .tox-dialog__footer {
    background-color: #f4f4f5;
  }
  div.tox .tox-dialog__footer .tox-button {
    color: #0a0a0b !important;
    background: transparent !important;
    padding: 0.45rem;
    margin: 0 !important;
    border: 0;
    font-size: 90%;
  }
  div.tox .tox-dialog__footer .tox-button:before {
    display: block;
    float: none;
    width: 100%;
    margin: 0;
    line-height: 1.75;
    height: 1.75rem;
  }
  div.tox .tox-dialog__footer .tox-button:active,
  div.tox .tox-dialog__footer .tox-button:focus,
  div.tox .tox-dialog__footer .tox-button:hover {
    background: transparent;
    border: 0;
    box-shadow: none;
    color: #0a0a0b;
  }
  div.tox .tox-dialog__footer > div {
    justify-content: space-evenly;
    display: flex;
    width: 100%;
  }
  div.tox .tox-dialog__footer > div:empty {
    display: none;
  }
}
/*** Media file selector for TinyMCE ***/
.image-selector {
  padding: 1rem 0.5rem 10rem 0.5rem !important;
}
.image-selector.droptarget {
  border: 0.2rem dashed #e4e4e7;
}
.image-selector.droptarget:after {
  margin-top: 2rem;
}
.image-selector form {
  position: absolute;
  top: 0;
}
.image-selector .attachmentslist {
  margin: 0;
  overflow-x: hidden;
  overflow-y: auto;
  height: 19.1em;
  padding: 0 !important;
}
.image-selector .attachmentslist li {
  padding: 0.25rem;
  cursor: pointer;
}
.image-selector .attachmentslist li:before {
  display: none;
}
.image-selector .attachmentslist li:hover,
.image-selector .attachmentslist li:focus {
  background: #e4e4e7;
}
.image-selector .attachmentslist li span.name {
  flex: 1;
  margin: auto;
  padding-left: 1rem;
  overflow: hidden;
  text-overflow: ellipsis;
}
.image-selector .attachmentslist li span.img {
  height: 80px;
  width: 80px;
  display: flex;
  border: 1px solid #e4e4e7;
  background: white;
  border-radius: 0.75rem;
  overflow: hidden;
}
.image-selector .attachmentslist li img {
  margin: auto;
}
html.layout-phone .image-selector .attachmentslist {
  height: auto;
}
/*** HTML editor widget ***/
.html-editor {
  position: relative;
  margin-bottom: 0.2rem;
}
.html-editor .editor-toolbar {
  position: absolute;
  left: 1px;
  top: 1px;
  right: 1px;
  border-radius: 0.25rem 0.25rem 0 0;
  border-bottom: 1px solid #e4e4e7;
  background-color: #f4f4f5;
}
.html-editor .editor-toolbar .mce-i-html {
  display: block;
  margin: 2px 2px 2px 4px;
  width: 34px;
  height: 28px;
  border-radius: 0.25rem;
  color: #222f3e;
}
.html-editor .editor-toolbar .mce-i-html:focus,
.html-editor .editor-toolbar .mce-i-html:hover {
  text-decoration: none;
  border-color: #e2e4e7;
  background-color: #dee0e2;
}
.html-editor .editor-toolbar .mce-i-html:before {
  content: "\f03e";
  margin: 0;
  width: 34px;
  line-height: 28px;
}
.html-editor .editor-toolbar .mce-i-html[disabled] {
  opacity: 0.7;
  cursor: not-allowed;
}
.html-editor.mailvelope .editor-toolbar,
.html-editor .tox-tinymce + .editor-toolbar {
  display: none;
}
.html-editor > .googie_edit_layer,
.html-editor > textarea {
  font-family: monospace;
  font-size: 13px;
  width: 100% !important;
  padding-top: 40px;
}
.html-editor > iframe {
  border-radius: 0.3rem;
  border: 1px solid #e4e4e7;
  min-height: 30em;
}
/*** GoogieSpell widget ***/
.googie_window {
  width: 16rem;
  height: auto;
}
.googie_edit_layer {
  font-family: monospace;
  padding: 0.5rem 0.75rem;
  border: 1px solid #e4e4e7;
  border-radius: 0.3rem;
  line-height: 1.5;
}
.googie_link {
  color: #e7000b;
  text-decoration: underline;
  cursor: pointer;
}
.googie_list li {
  min-width: 8rem;
  width: auto;
}
.googie_list li.googie_list_onhover {
  color: #ffffff;
  background-color: #0a0a0b;
}
.googie_list li .googie_list_revert:before {
  content: "\f0e2";
}
.googie_list li .googie_add_to_dict:before {
  content: "\f0fe";
}
.googie_list input {
  display: inline-block;
  margin: 0.25rem 0.5rem;
}
/*** Login form ***/
.task-login #layout-content {
  text-align: center;
  width: 100%;
  display: block;
}
.task-login #logo {
  display: inline-block;
  position: relative;
  top: 16vh;
  max-height: 100px;
}
#login-form {
  margin: 0 auto;
  top: 20vh;
  width: 95%;
  max-width: 320px;
  position: relative;
}
#login-form table,
#login-form tbody {
  display: block;
}
#login-form .row {
  margin-right: 0;
  margin-left: 0;
}
#login-form .oauthlogin {
  margin-top: 1em;
  padding-top: 1em;
}
#login-form .formbuttons + .oauthlogin {
  border-top: 1px solid #ccc;
}
#rcmloginsubmit:before {
  display: none !important;
}
#login-footer {
  flex: 1;
  color: #71717a;
}
#login-footer > div {
  margin-top: 1rem;
  padding: 1rem;
  background: #f4f4f5;
  border-radius: 0.3rem;
}
#login-addon {
  position: absolute;
  bottom: 0;
  max-height: 30%;
  margin: 1rem !important;
  width: auto !important;
  overflow: auto;
}
@media screen and (min-width: 769px) {
  #login-addon {
    max-width: 768px;
    margin: auto !important;
    bottom: 1rem;
    left: 0;
    right: 0;
  }
}
body.task-error-login #layout #layout-menu,
body.task-error-login #layout #layout-content > .header {
  display: none;
}
/*** Addressbook UI ***/
#contactpic {
  width: 112px;
  height: 135px;
  border-radius: 0.5rem;
  overflow: hidden;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  background-color: #f4f4f5;
}
#contactpic img {
  max-width: 112px;
  max-height: 135px;
}
#contacthead .names {
  margin-bottom: 0.5rem;
}
#contacthead .names span.namefield {
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 1.2;
}
#contacthead.readonly .source.row {
  color: #71717a;
  font-size: 90%;
  margin-bottom: 0.25rem;
}
/*** Mail UI ***/
#message-header {
  margin-bottom: 1rem;
}
#message-header > .subject {
  font-size: 1.5rem;
  font-weight: bold;
}
body.status-flagged #message-header > .subject:before {
  display: inline;
  float: none;
  content: "\f024";
  font-size: 1em;
  color: #e7000b;
}
#message-header > .subject a.extwin {
  text-decoration: none;
}
#message-header > .subject a.extwin:before {
  float: none;
  display: inline-block;
  font-size: 75%;
  line-height: 1.5;
  margin: 0;
  content: "\f360";
}
#message-header > .subject span.inner {
  display: none;
}
#message-header > .header {
  display: flex;
}
#message-header > .header img.contactphoto {
  margin: 0 1rem 0 0;
  border-radius: 50%;
  width: 4rem;
  height: 4rem;
  object-fit: cover;
  background: #f4f4f5;
}
#message-header .header-content {
  min-height: 4rem;
  flex: 1;
}
#message-header .header-content.details-view .header-summary {
  display: none;
}
#message-header .header-content.details-view .header-headers {
  display: initial;
}
#message-header .header-summary {
  margin-top: 0.25rem;
}
#message-header .header-summary > span {
  display: inline-block;
}
#message-header .header-headers {
  display: none;
}
#message-header .header-headers .header-title {
  white-space: nowrap;
  color: #71717a;
  font-weight: bold;
  padding-right: 1rem;
  vertical-align: top;
}
#message-header .header-links {
  margin-top: 0.25rem;
}
#message-header .header-links a {
  font-size: 90%;
  margin-right: 0.5rem;
  text-decoration: none;
  white-space: nowrap;
  display: inline-block;
}
#message-header .header-links a:before {
  height: 1.5rem;
  line-height: 1.3;
}
#message-header .header-links a.headers-details:before {
  content: "\f0e0";
}
#message-header .header-links a.headers-summary:before {
  content: "\f0e0";
  font-weight: 400;
}
#message-header .header-links a.headers-all:before {
  content: "\f05a";
}
#message-header .header-links a.html:before {
  content: "\f03e";
}
#message-header .header-links a.plain:before {
  content: "\f039";
}
#message-header .header-links a.zipdownload:before {
  content: "\f019";
}
.message-partheaders {
  padding: 0.25rem 0.5rem;
  margin: 0.5rem 0 -0.5rem 0;
  border-top: 1px solid #e4e4e7;
  background-color: #fafafa;
}
.message-partheaders table.headers-table {
  font-size: 90%;
  color: #71717a;
}
.message-partheaders table.headers-table .header-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 8em;
  font-weight: bold;
  padding-right: 1rem;
  vertical-align: top;
}
.message-partheaders table.headers-table .subject {
  font-weight: bold;
}
.message-partheaders table.headers-table + .message-part,
.message-partheaders table.headers-table + .message-htmlpart {
  border-top: 0;
  margin: 0;
}
#message-content .attachmentslist:not(:empty) {
  margin-bottom: 1rem;
}
#messagebody.mailvelope iframe {
  min-height: 75vh;
}
.message-part,
.message-htmlpart {
  padding-top: 0.5rem;
  position: relative;
}
.message-part:not(:first-child),
.message-htmlpart:not(:first-child) {
  border-top: 1px solid #e4e4e7;
  margin-top: 0.5rem;
}
.message-part:last-child,
.message-htmlpart:last-child {
  margin-bottom: 0.5rem;
}
.message-part div.rcmBody,
.message-htmlpart div.rcmBody {
  margin: 0 auto !important;
  overflow: auto hidden;
}
.message-part blockquote,
.message-htmlpart blockquote {
  overflow: hidden;
  text-overflow: ellipsis;
  color: #52525b;
  border-left: 2px solid #3f3f46;
  border-right: 2px solid #3f3f46;
  background-color: rgba(244, 244, 245, 0.6);
  margin: 2px 0;
  padding: 0 0.4em;
}
.message-part blockquote blockquote,
.message-htmlpart blockquote blockquote {
  color: #71717a;
  border-left: 2px solid #a1a1aa;
  border-right: 2px solid #a1a1aa;
}
.message-part blockquote blockquote blockquote,
.message-htmlpart blockquote blockquote blockquote {
  color: #a1a1aa;
  border-left: 2px solid #d4d4d8;
  border-right: 2px solid #d4d4d8;
}
.message-part blockquote span.blockquote-link,
.message-htmlpart blockquote span.blockquote-link {
  top: 0;
  cursor: pointer;
  right: 0.5rem;
  min-width: 4rem;
  padding: 0.2rem 0.25rem 0.2rem 0.5rem;
  font-size: 90%;
  text-align: center;
  color: #71717a;
  background: #f4f4f5;
  border: 1px solid #e4e4e7;
  border-radius: 0.3rem;
  line-height: 1;
  font-family: Roboto, sans-serif;
}
.message-part blockquote span.blockquote-link:after,
.message-htmlpart blockquote span.blockquote-link:after {
  content: "\f107";
  display: inline-block;
  float: none;
  margin: 0;
  font-size: 90%;
}
.message-part blockquote span.blockquote-link.collapsed:after,
.message-htmlpart blockquote span.blockquote-link.collapsed:after {
  content: "\f106";
}
.message-part blockquote.blockquote-header,
.message-htmlpart blockquote.blockquote-header {
  text-overflow: ellipsis !important;
  padding-right: 5rem !important;
}
.message-part span.sig {
  color: #71717a;
}
.message-part div.pre {
  font-family: monospace;
  font-size: 13px;
}
.message-part blockquote {
  display: inline-block;
  min-width: 100%;
}
.message-part blockquote + br {
  display: block;
  margin-top: 1em;
}
.message-htmlpart *,
.message-htmlpart ::after,
.message-htmlpart ::before {
  box-sizing: initial;
}
#compose-attachments {
  margin: 1rem 1rem 0 1rem;
}
.suspicious-address-warning:before {
  font-size: 1.25em;
  display: block;
  float: left;
  margin: 0 0.25rem 0 0;
  width: 1.18em;
  height: 1em;
  font-family: 'Icons';
  font-style: normal;
  font-weight: 900;
  text-decoration: inherit;
  text-align: center;
  speak: none;
  font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  float: none;
  display: inline-block;
  content: "\f071";
  color: #ffb900;
}
#composestatusbar {
  opacity: 0.3;
  right: 2.5rem;
}
@media screen and (min-width: 769px) {
  #composestatusbar {
    display: none;
  }
}
#composestatusbar a.button {
  display: inline-block;
}
#composestatusbar a.button:before {
  line-height: 58px;
  font-size: 1.25rem !important;
}
/*** Settings UI ***/
.settings-default-icon tr > td.section::before,
.settings-default-icon li > a:before {
  content: "\f013";
}
/**
 * Roundcube webmail styles for the Elastic skin
 *
 * Copyright (c) The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */
html.dark-mode {
  scrollbar-color: #3f3f46 #18181b;
}
html.dark-mode:not(.touch) ::-webkit-scrollbar-track {
  background-color: #18181b;
}
html.dark-mode:not(.touch) ::-webkit-scrollbar-thumb {
  background-color: #3f3f46;
}
html.dark-mode body {
  color: #fafafa;
  background-color: #09090b;
}
html.dark-mode #logo {
  opacity: 0.8;
}
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 {
  background-color: transparent;
  border-color: #27272a;
}
html.dark-mode #layout > div > .footer {
  font-weight: normal;
}
html.dark-mode #layout > div > .header,
html.dark-mode #layout > div > .footer {
  color: unset;
}
html.dark-mode #layout > div > .header a.button,
html.dark-mode #layout > div > .footer a.button {
  color: #fafafa;
}
html.dark-mode #layout-menu {
  background: unset;
  border-right: 1px solid #27272a;
}
html.dark-mode #layout-menu .popover-header,
html.dark-mode #layout-menu .special-buttons {
  background: transparent !important;
}
@media screen and (max-width: 480px) {
  html.dark-mode #layout-menu {
    border-left: 0;
  }
  html.dark-mode #layout-menu .popover-header {
    border-bottom: 1px solid #27272a;
  }
}
html.dark-mode #layout-menu .special-buttons a:not(:focus) {
  background: #09090b;
}
html.dark-mode.layout-phone #layout-menu {
  background: #18181b;
}
html.dark-mode .searchbar {
  background-color: transparent;
  border-color: #27272a;
}
html.dark-mode .searchbar form:before,
html.dark-mode .searchbar a,
html.dark-mode .searchbar input {
  color: unset;
}
html.dark-mode .searchbar a.selected {
  color: #00bc7d;
}
html.dark-mode #messagestack div {
  color: #fafafa;
}
html.dark-mode #messagestack div i.icon:before {
  color: #fafafa;
}
html.dark-mode .ui.alert.boxinformation,
html.dark-mode #messagestack .alert-info {
  background-color: #27272a;
}
html.dark-mode .ui.alert.boxerror,
html.dark-mode #messagestack .alert-danger {
  background-color: #ff6467;
}
html.dark-mode .ui.alert.boxwarning,
html.dark-mode #messagestack .alert-warning {
  background-color: #ffb900;
}
html.dark-mode .ui.alert.boxconfirmation,
html.dark-mode #messagestack .alert-success {
  background-color: #00bc7d;
}
html.dark-mode #messagestack .loading {
  background-color: #27272a;
}
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: #fafafa;
}
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: #fafafa;
}
html.dark-mode .ui.alert a:not(.btn) {
  color: #fafafa;
  text-decoration: underline;
}
html.dark-mode .iframe-loader {
  background-color: rgba(9, 9, 11, 0.9);
}
html.dark-mode .iframe-loader .spinner-border {
  color: #bababa;
  border-color: currentColor #7a7a7a currentColor currentColor;
}
html.dark-mode #taskmenu a,
html.dark-mode .menu.toolbar a {
  color: #fafafa;
}
html.dark-mode #taskmenu a.selected,
html.dark-mode .menu.toolbar a.selected {
  background-color: #27272a;
}
html.dark-mode pre,
html.dark-mode .popover .menu li a[aria-haspopup]::after,
html.dark-mode .menu.pagenav .pagenav-text,
html.dark-mode .menu.pagenav a {
  color: unset;
}
html.dark-mode #taskmenu .action-buttons a {
  color: #0a0a0b;
}
@media screen and (max-width: 480px) {
  html.dark-mode #taskmenu a {
    border-color: #18181b !important;
  }
  html.dark-mode #taskmenu a.selected {
    background: transparent;
  }
}
@media screen and (min-width: 481px) and (max-width: 1024px) {
  html.dark-mode #taskmenu a {
    width: 41px;
  }
}
@media screen and (min-width: 1025px) {
  html.dark-mode #taskmenu a {
    width: 77px;
  }
}
html.dark-mode.layout-small .popover,
html.dark-mode.layout-phone .popover {
  border-left: 1px solid #27272a;
}
html.dark-mode.layout-small .popover .menu .dropbutton a.dropdown,
html.dark-mode.layout-phone .popover .menu .dropbutton a.dropdown {
  background: transparent;
}
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: #18181b;
}
html.dark-mode.layout-small .popover-header,
html.dark-mode.layout-phone .popover-header {
  background: #18181b;
  border-bottom: 1px solid #27272a;
  color: unset;
}
html.dark-mode.layout-small .popover-overlay,
html.dark-mode.layout-phone .popover-overlay {
  background: rgba(0, 0, 0, 0.7);
}
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: #27272a;
}
html.dark-mode .menu.toolbar a.selected {
  color: #00bc7d;
  background: transparent;
}
html.dark-mode .menu.toolbar .dropbutton a.dropdown:hover {
  background-color: #333337;
}
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: #fafafa;
}
html.dark-mode .listing li ul,
html.dark-mode .listing tbody td,
html.dark-mode .listing li {
  border-color: #18181b;
}
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: #ffffff;
  background-color: #27272a;
}
html.dark-mode .listing li.selected ul {
  background-color: #09090b;
}
html.dark-mode .listing li.selected ul div.treetoggle {
  color: #fafafa;
}
html.dark-mode .listing li.disabled,
html.dark-mode .listing tr.disabled td {
  color: #52525b;
}
html.dark-mode .listing li.droptarget > a,
html.dark-mode .listing tr.droptarget > td {
  background-color: #27272a;
}
html.dark-mode .messagelist {
  color: #fafafa;
}
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: #a1a1aa;
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.msgicon.status {
  color: #fafafa;
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) span.flag {
  color: #fafafa;
}
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: #ffffff;
}
html.dark-mode .messagelist tr.flagged:not(.deleted) td,
html.dark-mode .messagelist tr.flagged:not(.deleted) span.attachment span {
  color: #e7000b;
}
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: #52525b;
}
html.dark-mode .messagelist span.attachment span {
  color: #a1a1aa;
}
html.dark-mode .folderlist li.mailbox .unreadcount {
  background-color: #fafafa;
  color: #0a0a0b;
  font-weight: normal;
}
html.dark-mode .attachmentslist {
  background-color: #27272a;
  border: 0;
}
html.dark-mode .attachmentslist a {
  color: #fafafa;
}
html.dark-mode .attachmentslist li .attachment-name {
  color: #fafafa;
}
html.dark-mode .attachmentslist li .attachment-size {
  color: #a1a1aa;
}
html.dark-mode .btn {
  color: #fafafa;
}
html.dark-mode .btn:focus,
html.dark-mode .btn:hover {
  color: #0a0a0b;
}
html.dark-mode .btn:disabled {
  opacity: 0.5 !important;
}
html.dark-mode .btn-primary {
  background-color: #fafafa;
  color: #0a0a0b;
}
html.dark-mode .btn-primary:hover:not(:disabled) {
  background-color: #ffffff;
}
html.dark-mode .btn-secondary {
  background-color: #27272a;
  color: #0a0a0b;
}
html.dark-mode .btn-secondary:hover:not(:disabled) {
  background-color: #333337;
}
html.dark-mode .btn-danger {
  background-color: #ff6467;
  color: #0a0a0b;
}
html.dark-mode .btn-danger:hover:not(:disabled) {
  background-color: #ff7e80;
}
html.dark-mode .floating-action-buttons a.button {
  box-shadow: none;
  background: #fafafa;
}
html.dark-mode .custom-file-label,
html.dark-mode .form-control {
  background-color: #09090b;
  color: #fafafa;
}
html.dark-mode .custom-file-label:not(.is-invalid),
html.dark-mode .form-control:not(.is-invalid) {
  border-color: #27272a;
}
html.dark-mode .custom-file-label:focus,
html.dark-mode .form-control:focus {
  background-color: #18181b;
}
html.dark-mode .custom-file-label:focus:not(.is-invalid),
html.dark-mode .form-control:focus:not(.is-invalid) {
  color: #ffffff !important;
  border-color: #fafafa;
}
html.dark-mode .custom-file-label::after {
  color: #fafafa;
  background-color: #18181b;
}
html.dark-mode .custom-select {
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fafafa' 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: #3f3f46;
}
html.dark-mode .custom-switch .custom-control-label::after {
  background-color: #fafafa;
}
html.dark-mode .custom-switch .custom-control-input:disabled ~ .custom-control-label {
  opacity: 0.4;
}
html.dark-mode .custom-switch .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #fafafa;
}
html.dark-mode .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  background-color: #fafafa;
}
html.dark-mode input:disabled,
html.dark-mode select:disabled {
  opacity: 0.5;
}
html.dark-mode .multi-input:not(.is-invalid) > .content {
  border-color: #27272a;
}
html.dark-mode .multi-input:not(.is-invalid) > .content.focused {
  border-color: #fafafa;
}
html.dark-mode .input-group-text {
  color: #fafafa;
  background-color: #18181b;
  border-color: #27272a;
}
html.dark-mode .input-group a:focus {
  border-color: #fafafa;
  box-shadow: 0 0 0 0.2rem rgba(10, 10, 11, 0.12);
  z-index: 1;
}
html.dark-mode .form-control-plaintext {
  color: unset;
}
html.dark-mode .recipient-input.focus {
  color: #ffffff;
  background-color: #18181b;
  border-color: #fafafa;
}
html.dark-mode .recipient-input a.button.icon,
html.dark-mode .recipient-input input {
  color: #fafafa;
}
html.dark-mode .recipient-input .recipient {
  background-color: #18181b;
  border-color: #27272a;
}
html.dark-mode .file-upload {
  border-color: #27272a;
}
html.dark-mode .file-upload:after {
  mix-blend-mode: soft-light;
}
html.dark-mode .file-upload.droptarget.active {
  border-color: #fafafa;
}
html.dark-mode .file-upload.droptarget.hover {
  border-color: #fafafa;
  background-color: #27272a;
}
html.dark-mode .file-upload .attachmentslist {
  background: transparent;
}
html.dark-mode .image-upload {
  background-color: #27272a;
}
html.dark-mode .image-upload a.button {
  background-color: rgba(9, 9, 11, 0.25);
}
html.dark-mode .formcontent.raweditor .CodeMirror {
  color: #fafafa;
  background-color: #09090b;
  border-color: #27272a;
}
html.dark-mode .formcontent.raweditor .CodeMirror-focused {
  background-color: #18181b;
  border-color: #fafafa;
}
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: #27272a;
}
html.dark-mode .CodeMirror-gutters {
  background-color: #0e0e10;
  border: 0;
}
html.dark-mode .CodeMirror-activeline-background {
  background: #27272a;
}
html.dark-mode .skinselection .skinthumbnail {
  border-color: #27272a;
  background: transparent;
}
html.dark-mode .html-editor .editor-toolbar {
  background-color: #18181b;
  border-color: #27272a;
}
html.dark-mode .html-editor .editor-toolbar .mce-i-html {
  color: unset;
}
html.dark-mode .html-editor .editor-toolbar .mce-i-html:hover,
html.dark-mode .html-editor .editor-toolbar .mce-i-html:focus {
  background-color: #27272a;
  border-color: transparent;
}
html.dark-mode .tox.tox-tinymce {
  border-color: #27272a;
}
html.dark-mode .tox .tox-toolbar {
  background-color: #18181b;
  border-color: #27272a;
}
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='%2327272a'/%3E%3C/svg%3E") #18181b;
}
html.dark-mode .tox .tox-pop.tox-pop--top:before,
html.dark-mode .tox .tox-pop.tox-pop--top:after {
  border-bottom-color: #27272a;
}
html.dark-mode .tox .tox-pop__dialog {
  box-shadow: none;
  border-color: #27272a;
}
html.dark-mode .tox .tox-tbtn,
html.dark-mode .tox .tox-split-button,
html.dark-mode .tox .tox-swatches__picker-btn {
  color: #fafafa;
}
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: #fafafa !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: #fafafa;
  background: #27272a;
  box-shadow: none;
}
html.dark-mode .tox .tox-tbtn--enabled {
  background: #27272a;
}
html.dark-mode .tox .tox-button--naked:focus:not(:disabled),
html.dark-mode .tox .tox-button--naked.tox-button--icon:hover:not(:disabled) {
  color: #ffffff;
  background-color: #27272a;
  border-color: transparent;
}
html.dark-mode .tox .tox-button--naked:disabled {
  background: transparent;
  border: transparent;
}
html.dark-mode .tox .tox-dialog__header .tox-button--naked:hover {
  background: transparent !important;
}
html.dark-mode .tox .tox-selectfield select {
  background: transparent;
  color: #fafafa;
}
html.dark-mode .tox .tox-selectfield svg {
  fill: #fafafa;
}
html.dark-mode .tox .tox-color-input span::before {
  background-color: #fafafa;
}
html.dark-mode .tox .tox-toolbar__group:not(:last-of-type) {
  border-color: #27272a;
}
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: #fafafa;
  border-color: #27272a;
  background-color: #09090b;
}
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: #fafafa;
}
html.dark-mode .tox .tox-dialog__footer .tox-button {
  background-color: #fafafa;
  color: #0a0a0b;
}
html.dark-mode .tox .tox-dialog__footer .tox-button:disabled {
  opacity: 0.5;
}
@media screen and (max-width: 480px) {
  html.dark-mode .tox .tox-dialog__footer .tox-button {
    color: #fafafa !important;
  }
}
html.dark-mode .tox .tox-dialog__footer .tox-button:focus:not(:disabled) {
  background-color: #fafafa;
}
html.dark-mode .tox .tox-dialog__footer .tox-button:hover:not(:disabled) {
  background-color: #ffffff;
}
html.dark-mode .tox .tox-dialog__footer .tox-button.tox-button--secondary {
  background-color: #27272a;
  color: #0a0a0b;
}
html.dark-mode .tox .tox-dialog__footer .tox-button.tox-button--secondary:focus:not(:disabled) {
  background-color: #27272a;
}
html.dark-mode .tox .tox-dialog__footer .tox-button.tox-button--secondary:hover:not(:disabled) {
  background-color: #333337;
}
html.dark-mode .tox .tox-dialog__body-nav-item--active {
  color: #0a0a0b;
}
html.dark-mode .tox .tox-dialog-wrap__backdrop {
  background-color: rgba(0, 0, 0, 0.7);
}
html.dark-mode .tox .tox-menu {
  background-color: #18181b;
  border-color: #27272a;
  box-shadow: none;
}
html.dark-mode .tox .tox-collection__item-caret svg {
  fill: #fafafa;
}
html.dark-mode .tox .tox-collection__item {
  color: #fafafa;
}
html.dark-mode .tox .tox-collection__item:not(:last-child) {
  border-bottom: 1px solid #18181b;
}
html.dark-mode .tox .tox-collection--grid .tox-collection__item {
  border: 0;
}
html.dark-mode .tox .tox-collection__item--active,
html.dark-mode .tox .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
  color: #fafafa;
  background-color: #27272a;
}
html.dark-mode .tox .tox-collection__item--enabled {
  color: #ffffff;
  background-color: #27272a;
}
html.dark-mode .message-part {
  border-color: #27272a;
}
html.dark-mode .message-part blockquote {
  background-color: #09090b;
  border-color: #52525b;
  color: #d4d4d8;
}
html.dark-mode .message-part blockquote span.blockquote-link {
  color: currentColor;
  background: #09090b;
  border-color: currentColor;
}
html.dark-mode .message-part blockquote blockquote {
  color: #a1a1aa;
  border-color: #3f3f46;
}
html.dark-mode .message-part blockquote blockquote blockquote {
  color: #71717a;
  border-color: #27272a;
}
html.dark-mode .message-part span.sig {
  color: #a1a1aa;
}
html.dark-mode .message-htmlpart {
  background-color: white;
  color: #0a0a0b;
  padding: 0;
  margin-top: 0.5rem;
}
html.dark-mode #message-header .header-headers .header-title {
  color: #fafafa;
  font-weight: normal;
}
html.dark-mode .message-partheaders {
  background-color: #27272a;
  border: 0;
}
html.dark-mode .message-partheaders table.headers-table {
  color: #fafafa;
}
html.dark-mode .message-partheaders table.headers-table * {
  font-weight: normal;
}
html.dark-mode p.image-attachment {
  border-color: #27272a;
  background-color: #27272a;
}
html.dark-mode p.image-attachment span {
  color: #a1a1aa;
}
html.dark-mode fieldset.image-attachment legend {
  color: #a1a1aa;
  border-color: #27272a;
}
html.dark-mode #messagepartframe {
  background: #fff;
}
html.dark-mode .ui-widget {
  border-color: #27272a;
}
html.dark-mode .ui-widget-overlay {
  background-color: rgba(0, 0, 0, 0.7);
}
html.dark-mode .ui-widget-header,
html.dark-mode .ui-widget-content {
  background-color: #09090b;
}
html.dark-mode .ui-dialog .ui-dialog-titlebar {
  border-color: #27272a;
}
html.dark-mode .ui-dialog .ui-dialog-title,
html.dark-mode .ui-dialog .ui-dialog-titlebar-close {
  color: #fafafa;
  background: transparent;
}
html.dark-mode .ui-dialog .ui-dialog-buttonpane {
  border-color: #27272a;
}
html.dark-mode .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link {
  color: #fafafa;
}
html.dark-mode .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link:focus {
  background: transparent;
}
@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: #fafafa;
  }
}
html.dark-mode .ui-datepicker .ui-datepicker-header {
  border-color: #27272a;
}
html.dark-mode .ui-datepicker th {
  color: #a1a1aa;
  font-size: 80%;
  font-weight: normal;
}
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: #fafafa;
}
html.dark-mode .ui-datepicker .ui-state-highlight,
html.dark-mode .ui-datepicker.ui-widget-content .ui-state-highlight {
  color: #0a0a0b;
  background-color: #27272a;
}
html.dark-mode .ui-datepicker .ui-datepicker-days-cell-over a {
  background-color: #404044;
}
html.dark-mode .ui-menu {
  background-color: #18181b;
  border-color: #27272a;
  box-shadow: none;
}
html.dark-mode .ui-menu .ui-menu-item {
  border-bottom: 1px solid #18181b;
}
html.dark-mode .ui-menu .ui-state-active {
  background-color: #27272a !important;
}
html.dark-mode .minicolors-panel {
  box-shadow: none;
  border-color: #27272a;
  background: #18181b;
}
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 {
  font-weight: normal;
  color: #a1a1aa;
}
html.dark-mode .popover {
  background-color: #18181b;
  border-color: #27272a;
  box-shadow: none;
}
html.dark-mode .popover .menu li.separator {
  background-color: transparent;
  color: #c7c7c7;
}
html.dark-mode .popover .menu ul + li.separator {
  border-top: 1px solid #18181b;
}
html.dark-mode .popover-body {
  color: #fafafa;
}
html.dark-mode .bs-popover-auto[x-placement^="right"] > .arrow::after,
html.dark-mode .bs-popover-right > .arrow::after {
  border-right-color: #27272a;
}
html.dark-mode .bs-popover-auto[x-placement^="left"] > .arrow::after,
html.dark-mode .bs-popover-left > .arrow::after {
  border-left-color: #27272a;
}
html.dark-mode .bs-popover-auto[x-placement^="top"] > .arrow::after,
html.dark-mode .bs-popover-top > .arrow::after {
  border-top-color: #27272a;
}
html.dark-mode .bs-popover-auto[x-placement^="bottom"] > .arrow::after,
html.dark-mode .bs-popover-bottom > .arrow::after {
  border-bottom-color: #27272a;
}
html.dark-mode .listing-hover-menu {
  background-color: #18181b;
  border-color: #27272a;
  box-shadow: 0 0 5px black;
}
html.dark-mode .listing-hover-menu a.button {
  color: #fafafa;
}
html.dark-mode .listing-hover-menu a.button:hover {
  background: transparent;
}
html.dark-mode .listing-hover-menu span.txt {
  color: #a1a1aa;
}
html.dark-mode .nav-tabs {
  border-color: #27272a;
}
html.dark-mode .nav-tabs .nav-link {
  color: #fafafa;
  border-color: transparent;
  border-bottom-color: #27272a;
}
html.dark-mode .nav-tabs .nav-link:hover {
  background: #09090b;
  border-color: #27272a;
  color: #fafafa;
}
html.dark-mode .nav-tabs .nav-link.active {
  background: #09090b;
  border-color: #27272a;
  border-bottom-color: transparent;
  color: #fff;
}
html.dark-mode .table {
  color: #fafafa;
}
html.dark-mode .table td,
html.dark-mode .table th,
html.dark-mode .table thead th {
  border-color: #27272a;
}
html.dark-mode .table-widget {
  border-color: #27272a;
}
html.dark-mode .table-widget > .footer {
  border-color: #27272a;
}
html.dark-mode .table-widget table.options-table tr:last-child td {
  border-color: #27272a;
}
html.dark-mode .table-widget table.options-table tr.selected td {
  background-color: #27272a;
  color: #fafafa;
}
html.dark-mode #rcmdraglayer {
  background-color: #18181b;
  border: 1px solid #27272a;
  box-shadow: none;
  color: #fafafa;
}
html.dark-mode .quota-widget {
  color: unset;
}
html.dark-mode .quota-widget .bar {
  border-color: #27272a;
  background-color: #27272a;
}
html.dark-mode .quota-info .root {
  color: #a1a1aa;
  background-color: transparent;
}
html.dark-mode img.contactphoto,
html.dark-mode #contactpic {
  background-color: #27272a !important;
}
html.dark-mode .pgpkeyimport div.key.revoked,
html.dark-mode .pgpkeyimport div.key.disabled {
  color: #52525b;
}
html.dark-mode .pgpkeyimport li.uid::before {
  opacity: 1;
}
/**
 * MS Drive Logistic — Elastic rule overrides
 *
 * Elastic's styles.less ends with `@import (optional) "_styles"`, AFTER `@import "dark"`.
 * Everything here therefore lands last in the stylesheet and wins at equal specificity —
 * which is the whole trick: every selector below is written to match its upstream
 * counterpart exactly, so it overrides by source order rather than by !important.
 *
 * Only three kinds of rule belong in this file. Anything that is just a colour belongs
 * in _variables.less instead.
 *
 *   1. Things a variable cannot express — typography, radii, the login card.
 *   2. Places where upstream hard-codes a LIGHT-mode variable inside `html.dark-mode`.
 *      Harmless with elastic's blue @color-main; fatal with ours, which is black and
 *      would render invisible on a dark pane. Each one is called out below.
 *   3. Places where one upstream variable serves two conflicting roles.
 */
/* ── Typography ──────────────────────────────────────────────────────────────────────
   The app renders in Inter (frontend/app/layout.tsx, next/font/google). Elastic ships
   Roboto. Self-hosted here for the same reason Next self-hosts it: no third-party
   request, so the webmail keeps working with a strict CSP and leaks nothing to a CDN.
   Latin subset only — @fontsource/inter, matching the subset next/font emits.        */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/inter-300.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/inter-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/inter-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/inter-700.woff2') format('woff2');
}
body,
button,
input,
optgroup,
select,
textarea,
.popover {
  font-family: 'Inter', Roboto, system-ui, -apple-system, 'Segoe UI', sans-serif;
}
div.tox,
div.tox :not(.svg) {
  font-family: 'Inter', Roboto, system-ui, -apple-system, 'Segoe UI', sans-serif;
}
div.tox .tox-color-input > input,
div.tox .tox-listboxfield .tox-listbox--select,
div.tox .tox-textarea,
div.tox .tox-textfield {
  font-family: 'Inter', Roboto, system-ui, -apple-system, 'Segoe UI', sans-serif !important;
}
.message-part blockquote span.blockquote-link,
.message-htmlpart blockquote span.blockquote-link {
  font-family: 'Inter', Roboto, system-ui, -apple-system, 'Segoe UI', sans-serif;
}
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* ── Radius ──────────────────────────────────────────────────────────────────────────
   Elastic mixes 0/2/4px corners. The app has exactly one radius token and derives the
   rest from it, so the same three steps are applied here.                            */
.btn,
.form-control,
.custom-select,
.input-group-text,
.ui-dialog,
.popupmenu,
.popover,
.ui-widget-content.ui-dialog {
  border-radius: -1.375rem;
}
#messagestack div,
.ui.alert {
  border-radius: -1.375rem;
}
.input-group > .form-control:not(:last-child),
.input-group > .custom-select:not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.input-group > .form-control:not(:first-child),
.input-group > .custom-select:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
/* ── Buttons ─────────────────────────────────────────────────────────────────────────
   _variables.less flips the secondary button from elastic's white-on-grey to the app's
   light-fill-with-dark-ink. That only works with a border: a #f4f4f5 fill on a white
   pane has no visible edge of its own. Same shape as the app's outline button.       */
.btn-secondary {
  border: 1px solid #e4e4e7;
}
.btn-primary,
.btn-danger {
  border: 1px solid transparent;
}
.btn {
  font-weight: 500;
}
/* ── Focus ───────────────────────────────────────────────────────────────────────────
   website/app/globals.css defines one global focus indicator for keyboard navigation.
   Reproduced here so tabbing through the mailbox looks like tabbing through the app.
   Scoped to :focus-visible, so it never fires on mouse clicks.                       */
a:focus-visible,
.btn:focus-visible,
#taskmenu a:focus-visible,
.listing li > a:focus-visible {
  outline: 2px solid #0a0a0b;
  outline-offset: 2px;
}
/* ── Active-filter indicator ─────────────────────────────────────────────────────────
   Upstream marks the active search scope and the active toolbar item with
   @color-success — green. In an achromatic UI, colour is reserved for status, and
   "this filter is on" is not a status. Carried by ink weight instead, in both modes. */
.searchbar a.selected,
.menu.toolbar a.selected {
  color: #0a0a0b;
  font-weight: 600;
}
/* ── Login ───────────────────────────────────────────────────────────────────────────
   Elastic's login is a bare form on an empty page. The app's is a card:
   `bg-card rounded-lg shadow-md border border-border` (frontend/app/login/page.tsx).
   Rebuilt here — this is the first and most-seen screen, and the one place the webmail
   most obviously either does or does not look like the rest of the product.

   The vertical offsets (#logo top: 16vh, #login-form top: 20vh) are deliberately left
   as upstream set them: both are `top` offsets on statically-positioned boxes, and
   retuning one without the other stacks them.                                        */
#login-form {
  max-width: 380px;
  padding: 2rem;
  border: 1px solid #e4e4e7;
  border-radius: 0.625rem;
  background-color: #ffffff;
  box-shadow: 0 1px 2px rgba(9, 9, 11, 0.06), 0 8px 24px rgba(9, 9, 11, 0.06);
  text-align: left;
}
#login-form .formbuttons .btn {
  width: 100%;
}
.task-login #layout-content {
  background-color: #ffffff;
}
/* ── Read vs unread ──────────────────────────────────────────────────────────────────
   Elastic separates the two with ONE cue: `tr.unread td.subject span.subject` gets
   font-weight: bold. Everything else — subject colour, sender, date, the status dot — is
   identical either way. That is legible enough as bold-black against normal-black on
   white, and close to invisible as bold-white against normal-white on near-black.

   Three cues here instead of one, so the distinction survives in both modes:
     weight     600 vs 400
     brightness unread at full contrast, read stepped back
     colour     the status dot alone carries @ms-accent (see _variables.less)

   Read messages are dimmed rather than unread being brightened past white: on a dark
   ground there is no headroom above #fff, so the contrast has to be made underneath.
   Kept at zinc-600/zinc-400 — clearly recessive, still comfortably past AA for body text
   (7.4:1 on white, 7.6:1 on the dark surface). A read message must stay easy to read.

   Scoped with :not(.flagged):not(.deleted) to match how elastic and dark.less scope their
   own list rules, so flagged (red) and deleted (struck-through, dim) keep their meaning. */
.messagelist tr:not(.flagged):not(.deleted) td.subject span.subject a {
  color: #52525b;
  font-weight: 400;
}
.messagelist tr:not(.flagged):not(.deleted).unread td.subject span.subject a {
  color: #0a0a0b;
  font-weight: 600;
}
.messagelist tr:not(.flagged):not(.deleted) td.subject span.msgicon.status.unread:before,
.messagelist tr:not(.flagged):not(.deleted) td.subject span.msgicon.status.unreadchildren:before {
  color: #1447e6;
}
/* ── Checkboxes and switches ─────────────────────────────────────────────────────────
   Two upstream defects, both of which render a control that cannot be read in its ON
   state — which is the state that matters.

   1. The switch's checked track is painted @color-checkbox — the UNCHECKED colour
      (elastic forms.less: `&:checked ~ .custom-control-label::before { background-color:
      @color-checkbox }`). On and off therefore look the same. @color-checkbox-checked is
      declared in elastic's palette but never read by any rule.
   2. In dark mode dark.less paints the checked track @color-dark-checkbox-checked AND the
      knob @color-dark-font. Both resolve near-white here, so the knob vanishes into its
      own track — a blank white pill, which is exactly what a switch must never look like.

   Fixed the way the app draws a switch: filled track, knob in the opposite ink.          */
.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
  border-color: #0a0a0b;
  background-color: #0a0a0b;
}
/* Plain checkboxes never reach elastic at all — nothing scopes .custom-checkbox, so they
   fall through to Bootstrap's own #007bff, including the indeterminate state used for a
   partial list selection. That blue belongs to Bootstrap, not to this product. */
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before,
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
  border-color: #0a0a0b;
  background-color: #0a0a0b;
}
/* ── Account switcher (ident_switch plugin) ──────────────────────────────────────────
   The plugin's own stylesheet is included AFTER the skin's, so matching its class
   selectors here would lose on source order. Both elements carry an id, and an id
   (1,0,0) outranks its class rules (0,1,0) regardless of order — which is why these are
   written against #ident-switch-* rather than .ident-switch-*.

   The <select> itself is styled inline by the plugin's JS (transparent, inherit, bold),
   and inline styles win over any stylesheet, so it is left alone: it already inherits the
   header's colour and therefore already matches. Only the two decorations that ship
   hard-coded colours are restated below.                                              */
#ident-switch-wrapper select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2371717a'/%3E%3C/svg%3E");
}
#ident-switch-badge {
  color: #ffffff;
  background-color: #0a0a0b;
  border-radius: 999px;
  font-weight: 600;
}
/* ====================================================================================
   Dark mode
   ====================================================================================
   Each rule below repairs a place where elastic's dark.less reaches for a LIGHT-mode
   variable. With upstream's bright blue @color-main these all render fine; with ours,
   which is black, they would be invisible against a dark pane. Selectors are copied
   verbatim from the compiled output so they override on source order alone.
   ==================================================================================== */
html.dark-mode #logo {
  opacity: 1;
}
html.dark-mode #taskmenu .action-buttons a {
  color: #ffffff;
}
html.dark-mode .tox .tox-dialog__body-nav-item--active {
  color: #fafafa;
}
html.dark-mode .ui-datepicker .ui-state-highlight,
html.dark-mode .ui-datepicker.ui-widget-content .ui-state-highlight {
  color: #fafafa;
}
html.dark-mode .searchbar a.selected,
html.dark-mode .menu.toolbar a.selected {
  color: #fafafa;
  font-weight: 600;
}
html.dark-mode .btn-secondary {
  color: #fafafa;
  border-color: #27272a;
}
html.dark-mode .btn-danger {
  color: #0a0a0b;
}
html.dark-mode #login-form {
  background-color: #09090b;
  border-color: #27272a;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.4);
}
html.dark-mode .task-login #layout-content {
  background-color: #09090b;
}
html.dark-mode a:focus-visible,
html.dark-mode .btn:focus-visible,
html.dark-mode #taskmenu a:focus-visible,
html.dark-mode .listing li > a:focus-visible {
  outline-color: #fafafa;
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.subject a {
  color: #a1a1aa;
  font-weight: 400;
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted).unread td.subject span.subject a {
  color: #ffffff;
  font-weight: 600;
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.msgicon.status.unread:before,
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.msgicon.status.unreadchildren:before {
  color: #53a0ff;
}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted).selected td.subject span.msgicon.status.unread:before {
  color: #53a0ff;
}
html.dark-mode .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  background-color: #09090b;
}
html.dark-mode .custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%230a0a0b' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
}
html.dark-mode .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before,
html.dark-mode .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
  border-color: #fafafa;
  background-color: #fafafa;
}
html.dark-mode .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3e%3cpath stroke='%230a0a0b' d='M0 2h4'/%3e%3c/svg%3e");
}
html.dark-mode #ident-switch-wrapper select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23a1a1aa'/%3E%3C/svg%3E");
}
html.dark-mode #ident-switch-badge {
  color: #0a0a0b;
  background-color: #fafafa;
}