:root {
  color-scheme: light only;
  --accessible-text: #111111;
  --accessible-muted: #333333;
  --accessible-link: #004b87;
  --accessible-border: #555555;
  --accessible-focus: #ffbf47;
}

html {
  font-size: 18px !important;
  background: #ffffff !important;
}

body,
#layout,
#layout-content,
#layout-list,
#layout-sidebar,
.listbox,
.scroller,
.popupmenu,
.popover,
.modal-content {
  background-color: #ffffff !important;
  color: var(--accessible-text) !important;
}

body {
  font-family: Arial, Helvetica, sans-serif !important;
  line-height: 1.5 !important;
}

a,
.listing a,
.folderlist a {
  color: var(--accessible-link);
}

.header,
.footer,
.toolbar,
.searchbar,
.menu.toolbar {
  background-color: #f3f6f8 !important;
  color: var(--accessible-text) !important;
}

.header {
  min-height: 60px;
}

.header-title,
.boxtitle,
h1,
h2,
h3,
label,
.col-form-label {
  color: var(--accessible-text) !important;
  font-weight: 700 !important;
}

.listing li,
.listing tbody td,
.messagelist tbody td,
.folderlist li a,
.contactlist li a {
  color: var(--accessible-text) !important;
  font-size: 1rem !important;
  line-height: 1.45 !important;
}

.listing tbody td,
.messagelist tbody td {
  padding-top: 0.72rem !important;
  padding-bottom: 0.72rem !important;
  border-bottom: 1px solid #c5cbd0 !important;
}

.listing tr.unread td,
.listing li.unread a {
  color: #000000 !important;
  font-weight: 800 !important;
}

.listing tr.selected td,
.listing tr.focused td,
.listing li.selected > a,
.listing li.focused > a {
  background: #d6ebff !important;
  color: #000000 !important;
}

.form-control,
.custom-select,
input,
textarea,
select,
button,
.btn,
.input-group-text {
  color: #000000 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 1rem !important;
  min-height: 48px;
}

.form-control,
.custom-select,
input,
textarea,
select {
  background: #ffffff !important;
  border: 2px solid var(--accessible-border) !important;
}

.btn-primary,
button.mainaction,
input.mainaction {
  background: #005a9c !important;
  border-color: #003f70 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
}

.btn-secondary {
  background: #e7edf2 !important;
  border-color: #46545f !important;
  color: #111111 !important;
  font-weight: 700 !important;
}

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
[tabindex]:focus {
  outline: 4px solid var(--accessible-focus) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 2px #111111 !important;
}

#login-form {
  width: min(92vw, 560px) !important;
}

#login-form label,
#login-form .form-control,
#login-form button,
#login-form input {
  font-size: 1.15rem !important;
}

#login-form .form-control,
#login-form button,
#login-form input {
  min-height: 58px !important;
}

#login-footer {
  color: var(--accessible-muted) !important;
  font-size: 0.9rem !important;
}

#compose-headers .form-control,
#compose-headers input,
#compose-subject,
.recipient-input {
  font-size: 1.1rem !important;
  min-height: 52px !important;
}

.recipient-input .recipient,
.recipient-input input {
  color: #000000 !important;
  font-size: 1.05rem !important;
}

.message-part,
.message-htmlpart,
#messagebody,
.message-headers,
.header-title.subject {
  color: #000000 !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
}

.text-muted,
.listing .date,
.listing .size,
.listing .fromto {
  color: var(--accessible-muted) !important;
}

@media (prefers-color-scheme: dark) {
  html,
  body,
  #layout,
  #layout-content,
  #layout-list,
  #layout-sidebar {
    background: #ffffff !important;
    color: #111111 !important;
  }
}