/*
 * Promtek Mail — stock Elastic polish v1
 *
 * The main Roundcube document receives colour declarations only. Elastic
 * continues to own geometry, spacing, typography, and all interaction logic.
 */

html:not(.iframe) body:not(.task-login) {
  --promtek-accent: #ec8a1a;
  --promtek-accent-hover: #d2761d;
  --promtek-accent-ink: #1f160d;
  --promtek-focus-ring: rgba(236, 138, 26, 0.22);
  --promtek-rail: #221e1a;
  --promtek-rail-hover: #39332d;
  --promtek-rail-selected: #302820;
  --promtek-rail-text: #f6f2ec;
  --promtek-rail-muted: #b0a69b;
  --promtek-sidebar: #fbfaf8;
  --promtek-list: #ffffff;
  --promtek-content: #ffffff;
  --promtek-header: #ffffff;
  --promtek-control: #f7f4f0;
  --promtek-border: #e7e1da;
  --promtek-text: #2b241f;
  --promtek-muted: #746b62;
  --promtek-faint: #aaa198;
  --promtek-selection: #fbf3e8;
  --promtek-selection-hover: #f7eee3;
  --promtek-selection-ink: #2b241f;
  accent-color: var(--promtek-accent);
}

html.dark-mode:not(.iframe) body:not(.task-login) {
  --promtek-accent-hover: #f09a37;
  --promtek-rail: #0e0c09;
  --promtek-rail-hover: #211d18;
  --promtek-rail-selected: #2a231c;
  --promtek-sidebar: #17140f;
  --promtek-list: #17140f;
  --promtek-content: #17140f;
  --promtek-header: #17140f;
  --promtek-control: #211c17;
  --promtek-border: #2d2721;
  --promtek-text: #f6f2ec;
  --promtek-muted: #9a9188;
  --promtek-faint: #746b62;
  --promtek-selection: #2a231b;
  --promtek-selection-hover: #211c17;
  --promtek-selection-ink: #f6f2ec;
}

html:not(.iframe) body:not(.task-login) #layout-menu,
html:not(.iframe) body:not(.task-login) #layout-menu .popover-header,
html:not(.iframe) body:not(.task-login) #taskmenu,
html:not(.iframe) body:not(.task-login) #taskmenu .special-buttons {
  color: var(--promtek-rail-muted) !important;
  background-color: var(--promtek-rail) !important;
  border-color: rgba(246, 242, 236, 0.10) !important;
}

html:not(.iframe) body:not(.task-login) #taskmenu a,
html:not(.iframe) body:not(.task-login) #taskmenu a.button {
  color: var(--promtek-rail-muted) !important;
  background-color: transparent !important;
  border-color: transparent !important;
}

html:not(.iframe) body:not(.task-login) #taskmenu a::before {
  color: inherit !important;
}

html:not(.iframe) body:not(.task-login) #taskmenu a:hover,
html:not(.iframe) body:not(.task-login) #taskmenu a:focus-visible {
  color: var(--promtek-rail-text) !important;
  background-color: var(--promtek-rail-hover) !important;
}

html:not(.iframe) body:not(.task-login) #taskmenu a.selected:not(.compose) {
  color: var(--promtek-rail-text) !important;
  background-color: var(--promtek-rail-selected) !important;
}

html:not(.iframe) body:not(.task-login) #taskmenu a.selected:not(.compose)::before,
html:not(.iframe) body:not(.task-login) #taskmenu a:hover::before {
  color: var(--promtek-accent) !important;
}

html:not(.iframe) body:not(.task-login) #taskmenu a.compose,
html:not(.iframe) body:not(.task-login) #taskmenu a.compose:hover,
html:not(.iframe) body:not(.task-login) #taskmenu a.compose:focus-visible {
  color: var(--promtek-accent-ink) !important;
  background-color: var(--promtek-accent) !important;
  border-color: var(--promtek-accent) !important;
}

html:not(.iframe) body:not(.task-login) #taskmenu a.compose:hover {
  background-color: var(--promtek-accent-hover) !important;
  border-color: var(--promtek-accent-hover) !important;
}

html:not(.iframe) body:not(.task-login) #layout-sidebar,
html:not(.iframe) body:not(.task-login) #layout-sidebar > .header,
html:not(.iframe) body:not(.task-login) #layout-sidebar > .footer,
html:not(.iframe) body:not(.task-login) #folderlist-content,
html:not(.iframe) body:not(.task-login) .folderlist {
  color: var(--promtek-text) !important;
  background-color: var(--promtek-sidebar) !important;
  border-color: var(--promtek-border) !important;
}

html:not(.iframe) body:not(.task-login) #layout-list,
html:not(.iframe) body:not(.task-login) #layout-list > .header,
html:not(.iframe) body:not(.task-login) #layout-list > .footer,
html:not(.iframe) body:not(.task-login) #messagelist-header,
html:not(.iframe) body:not(.task-login) #messagelist-content,
html:not(.iframe) body:not(.task-login) #messagelist,
html:not(.iframe) body:not(.task-login) .messagelist {
  color: var(--promtek-text) !important;
  background-color: var(--promtek-list) !important;
  border-color: var(--promtek-border) !important;
}

html:not(.iframe) body:not(.task-login) #layout-content,
html:not(.iframe) body:not(.task-login) #layout-content > .header,
html:not(.iframe) body:not(.task-login) #layout-content > .footer,
html:not(.iframe) body:not(.task-login) #layout-content .iframe-wrapper {
  color: var(--promtek-text) !important;
  background-color: var(--promtek-content) !important;
  border-color: var(--promtek-border) !important;
}

html:not(.iframe) body:not(.task-login) #layout-sidebar > .header,
html:not(.iframe) body:not(.task-login) #layout-list > .header,
html:not(.iframe) body:not(.task-login) #layout-content > .header,
html:not(.iframe) body:not(.task-login) #messagelist-header,
html:not(.iframe) body:not(.task-login) #layout-list .searchbar {
  color: var(--promtek-text) !important;
  background-color: var(--promtek-header) !important;
  border-color: var(--promtek-border) !important;
}

html:not(.iframe) body:not(.task-login) #layout-sidebar > .header a,
html:not(.iframe) body:not(.task-login) #layout-list > .header a,
html:not(.iframe) body:not(.task-login) #layout-content > .header a,
html:not(.iframe) body:not(.task-login) #messagelist-header a {
  color: var(--promtek-text) !important;
  background-color: transparent !important;
  border-color: transparent !important;
}

html:not(.iframe) body:not(.task-login) #layout-sidebar > .header a::before,
html:not(.iframe) body:not(.task-login) #layout-list > .header a::before,
html:not(.iframe) body:not(.task-login) #layout-content > .header a::before,
html:not(.iframe) body:not(.task-login) #messagelist-header a::before {
  color: inherit !important;
}

html:not(.iframe) body:not(.task-login) #layout-sidebar > .header a:not(.disabled):hover,
html:not(.iframe) body:not(.task-login) #layout-list > .header a:not(.disabled):hover,
html:not(.iframe) body:not(.task-login) #layout-content > .header a:not(.disabled):hover,
html:not(.iframe) body:not(.task-login) #messagelist-header a:not(.disabled):hover {
  color: var(--promtek-text) !important;
  background-color: var(--promtek-selection-hover) !important;
}

html:not(.iframe) body:not(.task-login) #layout-sidebar > .header a.disabled,
html:not(.iframe) body:not(.task-login) #layout-list > .header a.disabled,
html:not(.iframe) body:not(.task-login) #layout-content > .header a.disabled,
html:not(.iframe) body:not(.task-login) #messagelist-header a.disabled {
  color: var(--promtek-faint) !important;
  background-color: transparent !important;
}

html:not(.iframe) body:not(.task-login) #layout-list .searchbar form,
html:not(.iframe) body:not(.task-login) #layout-list .searchbar input {
  color: var(--promtek-text) !important;
  background-color: var(--promtek-control) !important;
  border-color: var(--promtek-border) !important;
}

html:not(.iframe) body:not(.task-login) #layout-list .searchbar input::placeholder {
  color: var(--promtek-muted) !important;
}

html:not(.iframe) body:not(.task-login) .folderlist li > a {
  color: var(--promtek-text) !important;
  background-color: var(--promtek-sidebar) !important;
  border-color: var(--promtek-border) !important;
}

html:not(.iframe) body:not(.task-login) .folderlist li > a:hover {
  color: var(--promtek-text) !important;
  background-color: var(--promtek-selection-hover) !important;
}

html:not(.iframe) body:not(.task-login) .folderlist li.selected > a,
html:not(.iframe) body:not(.task-login) .folderlist li.selected > div > a {
  color: var(--promtek-selection-ink) !important;
  background-color: var(--promtek-selection) !important;
  border-color: var(--promtek-border) !important;
  box-shadow: inset -2px 0 0 var(--promtek-accent) !important;
}

html:not(.iframe) body:not(.task-login) .folderlist li.selected > a:hover,
html:not(.iframe) body:not(.task-login) .folderlist li.selected > div > a:hover {
  background-color: var(--promtek-selection) !important;
}

html:not(.iframe) body:not(.task-login) .folderlist li.mailbox .unreadcount,
html:not(.iframe) body:not(.task-login) .badge-primary {
  color: var(--promtek-accent-ink) !important;
  background-color: var(--promtek-accent) !important;
  border-color: var(--promtek-accent) !important;
}

html:not(.iframe) body:not(.task-login) .messagelist tbody tr,
html:not(.iframe) body:not(.task-login) .messagelist tbody tr > td {
  color: var(--promtek-text) !important;
  background-color: var(--promtek-list) !important;
  border-color: var(--promtek-border) !important;
}

html:not(.iframe) body:not(.task-login) .messagelist tbody tr:hover > td {
  background-color: var(--promtek-selection-hover) !important;
}

html:not(.iframe) body:not(.task-login) .messagelist tbody tr.selected > td,
html:not(.iframe) body:not(.task-login) .messagelist tbody tr.selected:hover > td {
  color: var(--promtek-selection-ink) !important;
  background-color: var(--promtek-selection) !important;
  border-color: var(--promtek-border) !important;
}

html:not(.iframe) body:not(.task-login) .messagelist tbody tr.selected > td:first-child {
  box-shadow: inset 2px 0 0 var(--promtek-accent) !important;
}

html:not(.iframe) body:not(.task-login) .messagelist td.subject span.fromto,
html:not(.iframe) body:not(.task-login) .messagelist td.subject span.subject,
html:not(.iframe) body:not(.task-login) .messagelist td.subject span.subject a {
  color: var(--promtek-text) !important;
}

html:not(.iframe) body:not(.task-login) .messagelist td.subject span.date,
html:not(.iframe) body:not(.task-login) .messagelist td.subject span.size {
  color: var(--promtek-muted) !important;
}

html:not(.iframe) body:not(.task-login) .messagelist td.subject span.msgicon.status::before,
html:not(.iframe) body:not(.task-login) .messagelist tr.unread td.subject span.msgicon.status::before {
  color: var(--promtek-accent) !important;
}

html:not(.iframe) body:not(.task-login) .btn-primary,
html:not(.iframe) body:not(.task-login) button.mainaction,
html:not(.iframe) body:not(.task-login) a.button.mainaction {
  color: var(--promtek-accent-ink) !important;
  background-color: var(--promtek-accent) !important;
  border-color: var(--promtek-accent) !important;
}

html:not(.iframe) body:not(.task-login) .btn-primary:hover,
html:not(.iframe) body:not(.task-login) button.mainaction:hover,
html:not(.iframe) body:not(.task-login) a.button.mainaction:hover {
  color: var(--promtek-accent-ink) !important;
  background-color: var(--promtek-accent-hover) !important;
  border-color: var(--promtek-accent-hover) !important;
}

html:not(.iframe) body.task-mail :is(#messagetoolbar, #mailtoolbar, .toolbar.menu) a.reply:not(.disabled) {
  color: var(--promtek-accent-ink) !important;
  background-color: var(--promtek-accent) !important;
  border-color: var(--promtek-accent) !important;
}

html:not(.iframe) body.task-mail :is(#messagetoolbar, #mailtoolbar, .toolbar.menu) a.reply:not(.disabled):hover {
  color: var(--promtek-accent-ink) !important;
  background-color: var(--promtek-accent-hover) !important;
  border-color: var(--promtek-accent-hover) !important;
}

html:not(.iframe) body:not(.task-login) .tabsbar a.tablink.selected {
  color: var(--promtek-accent) !important;
  border-color: var(--promtek-accent) !important;
}

html:not(.iframe) body:not(.task-login) input.form-control:focus,
html:not(.iframe) body:not(.task-login) textarea.form-control:focus,
html:not(.iframe) body:not(.task-login) select.custom-select:focus,
html:not(.iframe) body:not(.task-login) .input-group:focus-within {
  border-color: var(--promtek-accent) !important;
  box-shadow: 0 0 0 3px var(--promtek-focus-ring) !important;
  caret-color: var(--promtek-accent) !important;
}
