/* Painel Onfaz — tema do webmail: o skin "elastic" do Roundcube com a identidade
   do painel (índigo #4F46E5 + cinzas slate). Instalado por install-webmail.sh em
   /var/lib/roundcube/skins/onfaz. O skin precisa de templates/ -> ../elastic/templates
   (link): o Roundcube busca o CSS primeiro no skin em que achou o template.

   Parte 1 (gerada por gen-colors.py a partir do CSS do elastic 1.6): toda regra do
   elastic que usa as cores dele, só com as cores trocadas.
   Parte 2 (à mão, skin/manual.css): menu lateral, logo e tela de login. */
@import url("../../elastic/styles/styles.min.css");

/* ===== Parte 1: cores do elastic -> Onfaz (gerado) ===== */
body{color:#1e293b}
#layout>div>.header{border-bottom:1px solid #e2e8f0;color:#1e293b}
#layout>div>.header a.button{color:#1e293b}
#layout>div>.footer{border-top:1px solid #e2e8f0}
#layout-sidebar{border-right:1px solid #e2e8f0}
#layout-sidebar.sidebar-right{border-left:1px solid #e2e8f0}
#layout-list{border-right:1px solid #e2e8f0}
@media screen and (min-width:481px){
  #layout-menu .popover-header{background-color:#1e293b!important}
}
@media screen and (min-width:481px){
  #layout-menu{background-color:#1e293b}
}
#rcmdraglayer{background-color:#1e293b;box-shadow:3px 3px 5px #f1f5f9}
.popup .listbox .footer{border-top:1px solid #e2e8f0}
p.image-attachment span{color:#64748b}
fieldset.image-attachment legend{color:#64748b}
.iframe-loader .spinner-border{color:#f1f5f9;border-color:currentColor #64748b currentColor currentColor}
.quota-widget{color:#64748b}
.quota-widget .bar{border:1px solid #e2e8f0}
.quota-widget .value{background-color:#4f46e5}
.image-tools a:focus,.image-tools a:hover{background-color:rgba(79,70,229,.45)!important}
.quota-info .root{color:#64748b;background-color:#f1f5f9}
.table-widget{border:1px solid #e2e8f0}
.table-widget>.footer{border-top:1px solid #e2e8f0}
.table-widget table.options-table tr:last-child td{border-bottom:1px solid #e2e8f0}
.table-widget table.options-table tr.selected td{background-color:#eef2ff;color:#1e293b}
table.table tr.deleted td{color:rgba(30,41,59,.5)!important}
.floating-action-buttons a.button{background:#4f46e5}
.btn-secondary{background:#94a3b8;border-color:#94a3b8}
.btn-secondary:focus{background:#94a3b8;border-color:#64748b;box-shadow:0 0 0 .2rem rgba(148,163,184,.5)}
.btn-secondary:hover{background:#94a3b8;border-color:#64748b}
.btn-secondary.disabled,.btn-secondary:disabled{background:#94a3b8;border-color:#94a3b8}
.btn-secondary:not(:disabled):not(.disabled).active:focus,.btn-secondary:not(:disabled):not(.disabled):active:focus{box-shadow:0 0 0 .2rem rgba(148,163,184,.53)}
.btn-primary{background:#4f46e5;border-color:#4f46e5}
.btn-primary:focus{background:#4338ca;border-color:#4338ca;box-shadow:0 0 0 .2rem rgba(79,70,229,.45)}
.btn-primary:hover{background:#4338ca;border-color:#4338ca}
.btn-primary.disabled,.btn-primary:disabled{background:#4f46e5;border-color:#4f46e5}
.ui-widget-overlay{background-color:rgba(30,41,59,.5)}
.ui-widget{border:1px solid #e2e8f0;box-shadow:3px 3px 5px #f1f5f9}
.ui-menu .ui-state-active{background-color:#4f46e5!important}
.ui-dialog .ui-dialog-title{color:#1e293b}
.ui-dialog .ui-dialog-titlebar-close{color:#1e293b}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link{color:#1e293b}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link:focus{background-color:rgba(79,70,229,.45)}
@media screen and (max-width:480px){
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-primary,.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-secondary{color:#1e293b}
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link{color:#1e293b}
}
.ui-slider .ui-slider-handle.ui-state-active{background:#4f46e5}
.ui-datepicker .ui-datepicker-next,.ui-datepicker .ui-datepicker-prev{color:#1e293b}
.ui-datepicker .ui-state-default,.ui-datepicker.ui-widget-content .ui-state-default{color:#1e293b}
.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{color:#4f46e5}
.ui-datepicker a.ui-state-active{background:#4f46e5!important}
.minicolors-panel{border:1px solid #e2e8f0;box-shadow:3px 3px 5px #f1f5f9}
.popover{box-shadow:3px 3px 5px #f1f5f9;border-color:#e2e8f0}
html.layout-phone .popover:not(.select-menu) .listing li:last-child,html.layout-small .popover:not(.select-menu) .listing li:last-child{border-bottom:1px solid #f1f5f9}
html.layout-phone .popover-overlay,html.layout-small .popover-overlay{background-color:rgba(30,41,59,.5)}
.pgpkeyimport div.key.disabled,.pgpkeyimport div.key.revoked{color:#64748b}
.menu.toolbar a{color:#1e293b}
.menu.pagenav a{color:#1e293b}
.menu.pagenav .pagenav-text{color:#64748b}
.menu.pagenav.pagenav-list{border-bottom:1px solid #f1f5f9}
.menu.pagenav.pagenav-list.expanded+.navlist{border-bottom:1px solid #e2e8f0}
.menu .buttons button{color:#1e293b}
.popover .menu li.separator{color:#64748b;background-color:#f1f5f9}
.popover .menu li a:not(.disabled):hover{background-color:#4f46e5}
.popover .menu li a[aria-haspopup]:after{color:#64748b}
.popover .menu li a[aria-haspopup].dropdown:after{color:#1e293b}
.popover .menu .dropbutton a.dropdown:hover{background-color:#4f46e5}
@media screen and (max-width:768px){
  .menu.listing a{color:#1e293b}
}
.searchbar{border-bottom:1px solid #f1f5f9}
.searchbar form:before{color:#64748b}
.searchbar a{color:#1e293b}
@media screen and (max-width:480px){
  #taskmenu a{border-bottom:1px solid #f1f5f9!important;color:#1e293b}
}
@media screen and (min-width:481px){
  #taskmenu a.selected{background:#475569}
  #taskmenu a.selected:hover{background:#475569}
  #taskmenu a:hover{background:#475569}
  #taskmenu .special-buttons{background-color:#1e293b}
  #taskmenu .action-buttons a{color:#4f46e5}
  #taskmenu .action-buttons a:hover{color:#4f46e5;background:#475569}
}
@media screen and (min-width:1025px){
  #taskmenu a:focus{background-color:#475569}
}
.ui.alert{color:#1e293b}
.ui.alert a:not(.btn){color:#4f46e5}
#messagestack div{background-color:#1e293b}
#messagestack .alert-info.information{background-color:#4f46e5}
#messagestack .alert-warning{color:#1e293b}
#messagestack .alert-warning>i.icon:before{color:#1e293b}
.listing li,.listing tbody td{border-bottom:1px solid #f1f5f9}
.listing li a,.listing tbody td{color:#1e293b}
.listing tbody td a{color:#1e293b}
.listing li.selected,.listing tr.selected td{color:#1e293b;background-color:#eef2ff}
.listing li.disabled,.listing tr.disabled td{color:rgba(30,41,59,.5)}
.listing span.secondary{color:#64748b}
ul.listing li ul{border-top:1px solid #f1f5f9}
.listing-info{color:#64748b}
@media screen and (max-width:1200px){
  .listing.selection-large-only li.selected{color:#1e293b}
}
.popupmenu .listing li>a:not(.disabled):hover{background-color:#4f46e5}
.popupmenu .listing li.selected{background-color:#4f46e5}
ul.treelist li.selected>a,ul.treelist li.selected>div>a{color:#1e293b;background-color:#eef2ff}
.folderlist li.mailbox .unreadcount{background:#4f46e5}
.folderlist li.mailbox.recent>a>.unreadcount{background:#4f46e5}
.messagelist td.subject span.date,.messagelist td.subject span.size{color:#64748b}
.messagelist td.subject span.fromto{color:#64748b}
.messagelist tr.deleted td,.messagelist tr.deleted td.subject span.date,.messagelist tr.deleted td.subject span.fromto,.messagelist tr.deleted td.subject span.subject a{color:rgba(30,41,59,.5)}
.contactlist span.email{color:#64748b}
.attachmentslist li .attachment-name{color:#1e293b}
.attachmentslist li .attachment-size{color:#64748b}
.propform .form-text{color:#64748b}
.formcontent .hint{color:#64748b}
.formcontent.raweditor .CodeMirror{color:#1e293b}
.formcontent.raweditor .CodeMirror-focused{border-color:#4f46e5;box-shadow:0 0 0 .2rem rgba(79,70,229,.2)}
.input-group a:focus{background-color:rgba(79,70,229,.2)}
.proplist li.with-sublist>a.dropdown{color:#1e293b}
.multi-input>.content.focused{border-color:#4f46e5;box-shadow:0 0 0 .2rem rgba(79,70,229,.2)}
.file-upload{border:.2rem dashed #e2e8f0}
.file-upload .hint{color:#64748b}
.recipient-input.focus{border-color:#4f46e5;box-shadow:0 0 0 .2rem rgba(79,70,229,.2)}
.recipient-input li.recipient,body>li.recipient.ui-sortable-helper{background-color:#f1f5f9}
.recipient-input li.recipient a.button.icon,body>li.recipient.ui-sortable-helper a.button.icon{color:#1e293b}
.tagedit-list[tabindex="-1"]{border-color:#4f46e5;box-shadow:0 0 0 .2rem rgba(79,70,229,.2)}
.tagedit-list li.tagedit-listelement-old{background-color:#f1f5f9}
.form-control{color:#1e293b}
.form-control:focus{color:#1e293b;border-color:#4f46e5;box-shadow:0 0 0 .2rem rgba(79,70,229,.2)}
.input-group-text{color:#1e293b;background-color:#f1f5f9}
.input-group-text input:focus{border-color:#4f46e5!important}
.custom-switch .custom-control-input:focus~.custom-control-label:before{box-shadow:0 0 0 .2rem rgba(79,70,229,.2)}
.custom-switch .custom-control-input:focus:not(:checked)~.custom-control-label::before{border-color:#4f46e5}
.custom-switch .custom-control-input:checked~.custom-control-label::before{border-color:#4f46e5;background-color:#4f46e5}
.custom-file-input:focus~.custom-file-label{border-color:#4f46e5;box-shadow:0 0 0 .2rem rgba(79,70,229,.2)}
div.tox.focused{border-color:#4f46e5!important;box-shadow:0 0 0 .2rem rgba(79,70,229,.2)!important}
div.tox .tox-toolbar-overlord>div{background-color:#f1f5f9}
div.tox .tox-toolbar{background-color:#f1f5f9}
div.tox .tox-dialog{border-color:#e2e8f0}
div.tox .tox-dialog-wrap__backdrop{background-color:rgba(30,41,59,.5)}
div.tox .tox-dialog__header .tox-button{color:#1e293b}
div.tox .tox-dialog__footer .tox-button{background:#4f46e5;border-color:#4f46e5}
div.tox .tox-dialog__footer .tox-button:focus{background:#4338ca;border-color:#4338ca;box-shadow:0 0 0 .2rem rgba(79,70,229,.45)}
div.tox .tox-dialog__footer .tox-button:hover{background:#4338ca;border-color:#4338ca}
div.tox .tox-dialog__footer .tox-button.disabled,div.tox .tox-dialog__footer .tox-button:disabled{background:#4f46e5;border-color:#4f46e5}
div.tox .tox-dialog__footer .tox-button:focus:not(:disabled){background:#4f46e5;border-color:#4f46e5}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary{background:#94a3b8;border-color:#94a3b8}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:focus{background:#94a3b8;border-color:#64748b;box-shadow:0 0 0 .2rem rgba(148,163,184,.5)}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:hover{background:#94a3b8;border-color:#64748b}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary.disabled,div.tox .tox-dialog__footer .tox-button.tox-button--secondary:disabled{background:#94a3b8;border-color:#94a3b8}
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 .2rem rgba(148,163,184,.53)}
div.tox .tox-dialog__footer .tox-button.tox-button--secondary:focus:not(:disabled){background:#94a3b8;border-color:#94a3b8}
div.tox .tox-dialog__title{color:#1e293b}
div.tox .tox-label{color:#1e293b}
div.tox .tox-color-input>input,div.tox .tox-listboxfield .tox-listbox--select,div.tox .tox-textarea,div.tox .tox-textfield{color:#1e293b}
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:#4f46e5;box-shadow:0 0 0 .2rem rgba(79,70,229,.2)}
div.tox .image-selector button{background:#94a3b8;border-color:#94a3b8}
div.tox .image-selector button:focus{background:#94a3b8;border-color:#64748b;box-shadow:0 0 0 .2rem rgba(148,163,184,.5)}
div.tox .image-selector button:hover{background:#94a3b8;border-color:#64748b}
div.tox .image-selector button.disabled,div.tox .image-selector button:disabled{background:#94a3b8;border-color:#94a3b8}
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 .2rem rgba(148,163,184,.53)}
@media screen and (max-width:480px){
  div.tox .tox-dialog__footer .tox-button{color:#1e293b!important}
  div.tox .tox-dialog__footer .tox-button:active,div.tox .tox-dialog__footer .tox-button:focus,div.tox .tox-dialog__footer .tox-button:hover{color:#1e293b}
}
.image-selector.droptarget{border:.2rem dashed #e2e8f0}
.image-selector .attachmentslist li:focus,.image-selector .attachmentslist li:hover{background:#eef2ff}
.image-selector .attachmentslist li span.img{border:1px solid #f1f5f9}
.html-editor .editor-toolbar{background-color:#f1f5f9}
.googie_list li.googie_list_onhover{background-color:#4f46e5}
#login-footer{color:#64748b}
#login-footer>div{background:#f1f5f9}
#contacthead.readonly .source.row{color:#64748b}
#message-header .header-headers .header-title{color:#64748b}
.message-partheaders table.headers-table{color:#64748b}
.message-htmlpart blockquote,.message-part blockquote{color:#4338ca;border-left:2px solid #4338ca;border-right:2px solid #4338ca}
.message-htmlpart blockquote span.blockquote-link,.message-part blockquote span.blockquote-link{color:#64748b;background:#f1f5f9;border:1px solid #e2e8f0}
.message-part span.sig{color:#64748b}
html.dark-mode{scrollbar-color:#4338ca #475569}
html.dark-mode:not(.touch) ::-webkit-scrollbar-track{background-color:#475569}
html.dark-mode:not(.touch) ::-webkit-scrollbar-thumb{background-color:#4338ca}
html.dark-mode body{color:#cbd5e1;background-color:#0f172a}
html.dark-mode #layout-content,html.dark-mode #layout-list,html.dark-mode #layout-sidebar,html.dark-mode #layout>div>.footer,html.dark-mode #layout>div>.header,html.dark-mode .menu.pagenav.pagenav-list,html.dark-mode .menu.pagenav.pagenav-list+.navlist,html.dark-mode .menu.pagenav.pagenav-list.expanded+.navlist,html.dark-mode .popup .listbox .footer{border-color:#475569}
html.dark-mode #layout>div>.footer a.button,html.dark-mode #layout>div>.header a.button{color:#cbd5e1}
html.dark-mode #layout-menu{border-right:1px solid #475569}
@media screen and (max-width:480px){
  html.dark-mode #layout-menu .popover-header{border-bottom:1px solid #475569}
}
html.dark-mode #layout-menu .special-buttons a:not(:focus){background:#0f172a}
html.dark-mode.layout-phone #layout-menu{background:#0b1120}
html.dark-mode .searchbar{border-color:#475569}
html.dark-mode #messagestack div{color:#cbd5e1}
html.dark-mode #messagestack div i.icon:before{color:#cbd5e1}
html.dark-mode .ui.alert.boxconfirmation,html.dark-mode .ui.alert.boxerror,html.dark-mode .ui.alert.boxinformation,html.dark-mode .ui.alert.boxwarning{color:#cbd5e1}
html.dark-mode .ui.alert.boxconfirmation i.icon:before,html.dark-mode .ui.alert.boxerror i.icon:before,html.dark-mode .ui.alert.boxinformation i.icon:before,html.dark-mode .ui.alert.boxwarning i.icon:before{color:#cbd5e1}
html.dark-mode .ui.alert a:not(.btn){color:#cbd5e1}
html.dark-mode #taskmenu a,html.dark-mode .menu.toolbar a{color:#cbd5e1}
html.dark-mode #taskmenu a.selected,html.dark-mode .menu.toolbar a.selected{background-color:#334155}
html.dark-mode #taskmenu .action-buttons a{color:#4f46e5}
@media screen and (max-width:480px){
  html.dark-mode #taskmenu a{border-color:#1e293b!important}
}
html.dark-mode.layout-phone .popover,html.dark-mode.layout-small .popover{border-left:1px solid #475569}
html.dark-mode.layout-phone .popover:not(.select-menu) .listing li:last-child,html.dark-mode.layout-small .popover:not(.select-menu) .listing li:last-child{border-color:#1e293b}
html.dark-mode.layout-phone .popover-header,html.dark-mode.layout-small .popover-header{background:#0b1120;border-bottom:1px solid #475569}
html.dark-mode #taskmenu a: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 a:not(.disabled):focus,html.dark-mode .menu a:not(.disabled):hover,html.dark-mode .menu.toolbar .dropbutton:not(.disabled):hover,html.dark-mode .popupmenu .listing li>a:not(.disabled):hover{background-color:#334155}
html.dark-mode .listing li a,html.dark-mode .listing tbody td,html.dark-mode .listing tbody td a,html.dark-mode .proplist li.with-sublist>a.dropdown{color:#cbd5e1}
html.dark-mode .listing li,html.dark-mode .listing li ul,html.dark-mode .listing tbody td{border-color:#1e293b}
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:#4f46e5;background-color:#334155}
html.dark-mode .listing li.selected ul{background-color:#0f172a}
html.dark-mode .listing li.selected ul div.treetoggle{color:#cbd5e1}
html.dark-mode .messagelist{color:#cbd5e1}
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,html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.size{color:#94a3b8}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) td.subject span.msgicon.status{color:#cbd5e1}
html.dark-mode .messagelist tr:not(.flagged):not(.deleted) span.flag{color:#cbd5e1}
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:#4f46e5}
html.dark-mode .messagelist span.attachment span{color:#94a3b8}
html.dark-mode .folderlist li.mailbox .unreadcount{background-color:#475569;color:#e2e8f0}
html.dark-mode .attachmentslist{background-color:#334155}
html.dark-mode .attachmentslist a{color:#cbd5e1}
html.dark-mode .attachmentslist li .attachment-name{color:#cbd5e1}
html.dark-mode .attachmentslist li .attachment-size{color:#94a3b8}
html.dark-mode .btn{color:#cbd5e1}
html.dark-mode .btn:focus,html.dark-mode .btn:hover{color:#e2e8f0}
html.dark-mode .btn-primary{background-color:#4338ca;color:#e2e8f0}
html.dark-mode .btn-primary:hover:not(:disabled){background-color:#4338ca}
html.dark-mode .btn-secondary{background-color:#475569;color:#e2e8f0}
html.dark-mode .btn-secondary:hover:not(:disabled){background-color:#64748b}
html.dark-mode .btn-danger{color:#e2e8f0}
html.dark-mode .floating-action-buttons a.button{background:#4338ca}
html.dark-mode .custom-file-label,html.dark-mode .form-control{background-color:#0f172a;color:#cbd5e1}
html.dark-mode .custom-file-label:not(.is-invalid),html.dark-mode .form-control:not(.is-invalid){border-color:#94a3b8}
html.dark-mode .custom-file-label:focus:not(.is-invalid),html.dark-mode .form-control:focus:not(.is-invalid){border-color:#4f46e5}
html.dark-mode .custom-file-label::after{color:#cbd5e1;background-color:#334155}
html.dark-mode .custom-switch .custom-control-label::before{background-color:#475569}
html.dark-mode .custom-switch .custom-control-label::after{background-color:#cbd5e1}
html.dark-mode .custom-switch .custom-control-input:checked~.custom-control-label::before{background-color:#4338ca}
html.dark-mode .custom-switch .custom-control-input:checked~.custom-control-label::after{background-color:#cbd5e1}
html.dark-mode .multi-input:not(.is-invalid)>.content{border-color:#94a3b8}
html.dark-mode .multi-input:not(.is-invalid)>.content.focused{border-color:#4f46e5}
html.dark-mode .input-group-text{color:#cbd5e1;background-color:#334155;border-color:#94a3b8}
html.dark-mode .input-group a:focus{border-color:#4f46e5;box-shadow:0 0 0 .2rem rgba(79,70,229,.2)}
html.dark-mode .recipient-input.focus{border-color:#4f46e5}
html.dark-mode .recipient-input a.button.icon,html.dark-mode .recipient-input input{color:#cbd5e1}
html.dark-mode .recipient-input .recipient{background-color:#334155;border-color:#94a3b8}
html.dark-mode .file-upload{border-color:#475569}
html.dark-mode .file-upload.droptarget.active{border-color:#cbd5e1}
html.dark-mode .file-upload.droptarget.hover{border-color:#cbd5e1;background-color:#334155}
html.dark-mode .image-upload{background-color:#334155}
html.dark-mode .formcontent.raweditor .CodeMirror{color:#cbd5e1;background-color:#0f172a;border-color:#94a3b8}
html.dark-mode .formcontent.raweditor .CodeMirror-focused{border-color:#4f46e5}
html.dark-mode .CodeMirror-line::selection,html.dark-mode .CodeMirror-line>span::selection,html.dark-mode .CodeMirror-line>span>span::selection,html.dark-mode .CodeMirror-selected{background:#334155}
html.dark-mode .CodeMirror-activeline-background{background:#334155}
html.dark-mode .skinselection .skinthumbnail{border-color:#94a3b8}
html.dark-mode .html-editor .editor-toolbar{background-color:#334155;border-color:#94a3b8}
html.dark-mode .html-editor .editor-toolbar .mce-i-html:focus,html.dark-mode .html-editor .editor-toolbar .mce-i-html:hover{background-color:#64748b}
html.dark-mode .tox.tox-tinymce{border-color:#94a3b8}
html.dark-mode .tox .tox-toolbar{background-color:#334155;border-color:#94a3b8}
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='%237c949c'/%3E%3C/svg%3E") #334155}
html.dark-mode .tox .tox-pop.tox-pop--top:after,html.dark-mode .tox .tox-pop.tox-pop--top:before{border-bottom-color:#94a3b8}
html.dark-mode .tox .tox-pop__dialog{border-color:#94a3b8}
html.dark-mode .tox .tox-split-button,html.dark-mode .tox .tox-swatches__picker-btn,html.dark-mode .tox .tox-tbtn{color:#cbd5e1}
html.dark-mode .tox .tox-split-button svg,html.dark-mode .tox .tox-swatches__picker-btn svg,html.dark-mode .tox .tox-tbtn svg{fill:#cbd5e1!important}
html.dark-mode .tox .tox-split-button:focus,html.dark-mode .tox .tox-split-button:hover,html.dark-mode .tox .tox-swatches__picker-btn:focus,html.dark-mode .tox .tox-swatches__picker-btn:hover,html.dark-mode .tox .tox-tbtn:focus,html.dark-mode .tox .tox-tbtn:hover{color:#cbd5e1;background:#64748b}
html.dark-mode .tox .tox-tbtn--enabled{background:#64748b}
html.dark-mode .tox .tox-button--naked.tox-button--icon:hover:not(:disabled),html.dark-mode .tox .tox-button--naked:focus:not(:disabled){background-color:#64748b}
html.dark-mode .tox .tox-selectfield select{color:#cbd5e1}
html.dark-mode .tox .tox-selectfield svg{fill:#cbd5e1}
html.dark-mode .tox .tox-color-input span::before{background-color:#cbd5e1}
html.dark-mode .tox .tox-toolbar__group:not(:last-of-type){border-color:#94a3b8}
html.dark-mode .tox .tox-dialog,html.dark-mode .tox .tox-dialog__body,html.dark-mode .tox .tox-dialog__footer,html.dark-mode .tox .tox-dialog__header,html.dark-mode .tox .tox-dialog__title{color:#cbd5e1;border-color:#475569;background-color:#0f172a}
html.dark-mode .tox .tox-button--naked,html.dark-mode .tox .tox-color-input>input,html.dark-mode .tox .tox-dialog__body-nav-item,html.dark-mode .tox .tox-dialog__header .tox-button,html.dark-mode .tox .tox-insert-table-picker__label,html.dark-mode .tox .tox-label,html.dark-mode .tox .tox-textfield{color:#cbd5e1}
html.dark-mode .tox .tox-dialog__footer .tox-button{background-color:#4338ca;color:#e2e8f0}
@media screen and (max-width:480px){
  html.dark-mode .tox .tox-dialog__footer .tox-button{color:#cbd5e1!important}
}
html.dark-mode .tox .tox-dialog__footer .tox-button:focus:not(:disabled){background-color:#4338ca}
html.dark-mode .tox .tox-dialog__footer .tox-button:hover:not(:disabled){background-color:#4338ca}
html.dark-mode .tox .tox-dialog__footer .tox-button.tox-button--secondary{background-color:#475569;color:#e2e8f0}
html.dark-mode .tox .tox-dialog__footer .tox-button.tox-button--secondary:focus:not(:disabled){background-color:#475569}
html.dark-mode .tox .tox-dialog__footer .tox-button.tox-button--secondary:hover:not(:disabled){background-color:#64748b}
html.dark-mode .tox .tox-dialog__body-nav-item--active{color:#4f46e5}
html.dark-mode .tox .tox-menu{background-color:#0b1120;border-color:#94a3b8}
html.dark-mode .tox .tox-collection__item-caret svg{fill:#cbd5e1}
html.dark-mode .tox .tox-collection__item{color:#cbd5e1}
html.dark-mode .tox .tox-collection__item:not(:last-child){border-bottom:1px solid #1e293b}
html.dark-mode .tox .tox-collection__item--active,html.dark-mode .tox .tox-collection__item--active:not(.tox-collection__item--state-disabled){color:#cbd5e1;background-color:#334155}
html.dark-mode .tox .tox-collection__item--enabled{color:#4f46e5;background-color:#334155}
html.dark-mode .message-htmlpart,html.dark-mode .message-part{border-color:#475569}
html.dark-mode .message-htmlpart blockquote,html.dark-mode .message-part blockquote{background-color:#0f172a}
html.dark-mode .message-htmlpart blockquote span.blockquote-link,html.dark-mode .message-part blockquote span.blockquote-link{background:#0f172a}
html.dark-mode .message-part span.sig{color:#94a3b8}
html.dark-mode .message-htmlpart{color:#1e293b}
html.dark-mode #message-header .header-headers .header-title{color:#cbd5e1}
html.dark-mode .message-partheaders{background-color:#334155}
html.dark-mode .message-partheaders table.headers-table{color:#cbd5e1}
html.dark-mode p.image-attachment{border-color:#475569;background-color:#334155}
html.dark-mode p.image-attachment span{color:#94a3b8}
html.dark-mode fieldset.image-attachment legend{color:#94a3b8;border-color:#475569}
html.dark-mode .ui-widget{border-color:#475569}
html.dark-mode .ui-widget-content,html.dark-mode .ui-widget-header{background-color:#0f172a}
html.dark-mode .ui-dialog .ui-dialog-titlebar{border-color:#475569}
html.dark-mode .ui-dialog .ui-dialog-title,html.dark-mode .ui-dialog .ui-dialog-titlebar-close{color:#cbd5e1}
html.dark-mode .ui-dialog .ui-dialog-buttonpane{border-color:#475569}
html.dark-mode .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link{color:#cbd5e1}
@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:#cbd5e1}
}
html.dark-mode .ui-datepicker .ui-datepicker-header{border-color:#475569}
html.dark-mode .ui-datepicker th{color:#94a3b8}
html.dark-mode .ui-datepicker .ui-datepicker-next,html.dark-mode .ui-datepicker .ui-datepicker-prev,html.dark-mode .ui-datepicker .ui-state-default,html.dark-mode .ui-datepicker.ui-widget-content .ui-state-default{color:#cbd5e1}
html.dark-mode .ui-datepicker .ui-state-highlight,html.dark-mode .ui-datepicker.ui-widget-content .ui-state-highlight{color:#4f46e5;background-color:#334155}
html.dark-mode .ui-datepicker .ui-datepicker-days-cell-over a{background-color:#475569}
html.dark-mode .ui-menu{background-color:#0b1120;border-color:#94a3b8}
html.dark-mode .ui-menu .ui-menu-item{border-bottom:1px solid #1e293b}
html.dark-mode .ui-menu .ui-state-active{background-color:#334155!important}
html.dark-mode .minicolors-panel{border-color:#475569;background:#0b1120}
html.dark-mode #contacthead.readonly .source.row,html.dark-mode #login-footer,html.dark-mode .contactlist span.email,html.dark-mode .file-upload .hint,html.dark-mode .formcontent .hint,html.dark-mode .listing span.secondary,html.dark-mode .listing-info,html.dark-mode ::-webkit-input-placeholder,html.dark-mode ::placeholder{color:#94a3b8}
html.dark-mode .popover{background-color:#0b1120;border-color:#94a3b8}
html.dark-mode .popover .menu li.separator{color:#94a3b8}
html.dark-mode .popover .menu ul+li.separator{border-top:1px solid #1e293b}
html.dark-mode .popover-body{color:#cbd5e1}
html.dark-mode .bs-popover-auto[x-placement^=right]>.arrow::after,html.dark-mode .bs-popover-right>.arrow::after{border-right-color:#94a3b8}
html.dark-mode .bs-popover-auto[x-placement^=left]>.arrow::after,html.dark-mode .bs-popover-left>.arrow::after{border-left-color:#94a3b8}
html.dark-mode .bs-popover-auto[x-placement^=top]>.arrow::after,html.dark-mode .bs-popover-top>.arrow::after{border-top-color:#94a3b8}
html.dark-mode .bs-popover-auto[x-placement^=bottom]>.arrow::after,html.dark-mode .bs-popover-bottom>.arrow::after{border-bottom-color:#94a3b8}
html.dark-mode .nav-tabs{border-color:#475569}
html.dark-mode .nav-tabs .nav-link{color:#cbd5e1;border-bottom-color:#475569}
html.dark-mode .nav-tabs .nav-link:hover{background:#0f172a;border-color:#475569;color:#cbd5e1}
html.dark-mode .nav-tabs .nav-link.active{background:#0f172a;border-color:#475569}
html.dark-mode .table{color:#cbd5e1}
html.dark-mode .table td,html.dark-mode .table th,html.dark-mode .table thead th{border-color:#475569}
html.dark-mode .table-widget{border-color:#475569}
html.dark-mode .table-widget>.footer{border-color:#475569}
html.dark-mode .table-widget table.options-table tr:last-child td{border-color:#475569}
html.dark-mode .table-widget table.options-table tr.selected td{background-color:#334155;color:#cbd5e1}
html.dark-mode #rcmdraglayer{background-color:#0b1120;border:1px solid #94a3b8;color:#cbd5e1}
html.dark-mode .quota-widget .bar{border-color:#475569;background-color:#475569}
html.dark-mode .quota-info .root{color:#94a3b8}
html.dark-mode #contactpic,html.dark-mode img.contactphoto{background-color:#334155!important}

/* ===== Parte 2: à mão ===== */
:root {
    --onfaz: #4f46e5;
    --onfaz-dark: #4338ca;
    --onfaz-soft: #eef2ff;
    --menu-bg: #0f172a;
    --menu-hover: rgba(255, 255, 255, 0.07);
}

/* botões principais */
.btn-primary,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active,
#login-form .btn-primary {
    background-color: var(--onfaz);
    border-color: var(--onfaz);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled):hover {
    background-color: var(--onfaz-dark);
    border-color: var(--onfaz-dark);
}

/* contadores de não lidas: índigo, não azul-claro */
.listing li .unreadcount,
.listing li.selected .unreadcount,
.badge-primary {
    background-color: var(--onfaz);
    color: #fff;
}

/* ----- menu lateral: slate escuro, item ativo em índigo com texto branco ----- */
#layout-menu,
#layout-menu .popover-header,
#taskmenu .special-buttons {
    background-color: var(--menu-bg) !important;
}

#layout-menu {
    border-right: 0;
}

#layout-menu .popover-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

#taskmenu a {
    color: #cbd5e1;
    border-color: transparent !important;
}

#taskmenu a:hover:not(.disabled),
#taskmenu a:focus {
    color: #fff;
    background: var(--menu-hover);
}

#taskmenu a.selected,
#taskmenu a.selected:hover,
#taskmenu a.selected:focus {
    color: #fff;
    background: var(--onfaz);
}

#taskmenu a.selected:before,
#taskmenu a:hover:not(.disabled):before {
    color: #fff;
}

/* "Criar email" com destaque suave */
#taskmenu .action-buttons a,
#taskmenu .action-buttons a:hover {
    color: #a5b4fc;
}

#taskmenu .action-buttons a:hover {
    background: var(--menu-hover);
}

/* logo do menu: só o ícone (o "V"), em branco */
#layout-menu #logo {
    content: url("/onfaz/icon.png");
    width: 48px;
    height: 48px;
    max-width: 48px !important;
    max-height: 48px;
    padding: 0;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 1;
}

/* ----- tela de login ----- */
/* o elastic empurra logo e formulário para baixo (top: 16vh / 20vh); aqui não */
body.task-login #logo,
body.task-login #login-form {
    top: 0;
}

body.task-login #layout,
body.task-login #layout-content {
    background: #f8fafc;
}

body.task-login #layout-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 2rem 1rem;
    text-align: left;
}

body.task-login #logo {
    display: block;
    height: 28px;
    width: auto;
    max-width: 150px;
    margin: 0 0 1.5rem;
    padding: 0;
}

body.task-login #login-form {
    width: 100%;
    max-width: 400px;
    margin: 0;
    padding: 2.25rem 2rem 1.75rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 32px rgba(15, 23, 42, 0.08);
}

body.task-login #login-form::before {
    content: "Entrar no webmail";
    display: block;
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    margin-bottom: 0.35rem;
}

body.task-login #login-form table {
    display: block;
    width: 100%;
    margin: 0;
    border: 0;
}

body.task-login #login-form table::before {
    content: "Use o endereço de e-mail completo e a senha da caixa.";
    display: block;
    font-size: 0.9rem;
    color: #64748b;
    margin-bottom: 1.75rem;
}

body.task-login #login-form tbody,
body.task-login #login-form tr,
body.task-login #login-form td {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
}

body.task-login #login-form tr {
    margin-bottom: 1.1rem;
}

/* o ui.js do elastic embrulha cada campo num .input-group com ícone e esconde o
   rótulo; aqui o ícone sai e o rótulo volta como texto acima do campo */
body.task-login #login-form td.title {
    display: none;
}

body.task-login #login-form tr::before {
    display: block;
    margin: 0 0 0.4rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #334155;
    line-height: 1.3;
}

body.task-login #login-form tr:nth-child(1)::before {
    content: "E-mail";
}

body.task-login #login-form tr:nth-child(2)::before {
    content: "Senha";
}

body.task-login #login-form td.input,
body.task-login #login-form .input-group {
    display: block;
    width: 100%;
}

body.task-login #login-form .input-group-prepend,
body.task-login #login-form .input-group-append {
    display: none;
}

body.task-login #login-form .form-control,
body.task-login #login-form .input-group-lg > .form-control {
    width: 100%;
    flex: none;
    height: 48px;
    padding: 0 0.95rem;
    font-size: 0.95rem;
    color: #0f172a;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    box-shadow: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

body.task-login #login-form .form-control::placeholder {
    color: #94a3b8;
}

body.task-login #login-form .form-control:focus {
    border-color: var(--onfaz);
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.18);
    outline: 0;
}

body.task-login #login-form .formbuttons {
    margin: 0.75rem 0 0;
}

body.task-login #login-form button.mainaction {
    width: 100%;
    height: 48px;
    font-size: 0.975rem;
    font-weight: 600;
    text-transform: none !important;
    letter-spacing: 0;
    color: #fff;
    background: var(--onfaz);
    border: 0;
    border-radius: 10px;
    box-shadow: 0 8px 18px rgba(79, 70, 229, 0.28);
    transition: background 0.15s, transform 0.05s;
}

body.task-login #login-form button.mainaction:hover {
    background: var(--onfaz-dark);
}

body.task-login #login-form button.mainaction:active {
    transform: translateY(1px);
}

body.task-login #login-footer {
    margin: 1.5rem 0 0;
    padding: 0;
    font-size: 0.75rem;
    color: #94a3b8;
    text-align: center;
}

body.task-login #login-footer a {
    color: #64748b;
}

body.task-login #messagestack {
    z-index: 100;
}

/* telas largas: faixa da marca à esquerda (índigo, logo em branco), formulário à direita */
@media screen and (min-width: 960px) {
    body.task-login #layout-content {
        padding-left: 42%;
        position: relative;
    }

    body.task-login #layout-content::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 42%;
        background:
            radial-gradient(circle at 20% 15%, rgba(255, 255, 255, 0.16), transparent 45%),
            radial-gradient(circle at 85% 90%, rgba(165, 180, 252, 0.35), transparent 50%),
            linear-gradient(160deg, #4f46e5 0%, #3730a3 100%);
    }

    body.task-login #layout-content::after {
        content: "Seu e-mail da Onfaz, em qualquer lugar.";
        position: absolute;
        left: 4.5rem;
        bottom: 4.5rem;
        width: calc(42% - 9rem);
        font-size: 2rem;
        font-weight: 700;
        line-height: 1.2;
        letter-spacing: -0.02em;
        color: #fff;
    }

    body.task-login #logo {
        position: absolute;
        top: 3.5rem;
        left: 4.5rem;
        margin: 0;
        height: 32px;
        max-width: 170px;
        filter: brightness(0) invert(1);
        z-index: 1;
    }
}

/* modo escuro do Roundcube (classe no <html>) */
html.dark-mode #layout-menu,
html.dark-mode #layout-menu .popover-header,
html.dark-mode #taskmenu .special-buttons {
    background-color: #020617 !important;
}

html.dark-mode body.task-login #layout,
html.dark-mode body.task-login #layout-content {
    background: #0f172a;
}

html.dark-mode body.task-login #login-form {
    background: #1e293b;
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
}

html.dark-mode body.task-login #login-form::before {
    color: #f1f5f9;
}

html.dark-mode body.task-login #login-form table::before,
html.dark-mode body.task-login #login-form tr::before {
    color: #cbd5e1;
}

html.dark-mode body.task-login #login-form .form-control {
    background: #0f172a;
    color: #f1f5f9;
    border-color: #334155;
}
