@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin-variable.woff2") format("woff2");
}
@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/geist-mono-latin-variable.woff2") format("woff2");
}

:root {
  --om-brand: #1288fb;
  --om-brand-light: #17befe;
  --om-brand-hover: #0a7efa;
  --om-bg: #fbfcfe;
  --om-surface: #fff;
  --om-muted: #f1f4f8;
  --om-accent: #edf1f6;
  --om-sidebar: #fff;
  --om-text: #1d1d1d;
  --om-secondary: #6a6a75;
  --om-border: #e5e9ef;
  --om-field: #dce2ea;
  --om-active: #f1f4f8;
  --om-link: #0864b9;
  --om-shadow: 0 12px 32px -10px rgb(0 0 0 / .35), 0 3px 10px -2px rgb(0 0 0 / .16);
}
html.dark-mode {
  color-scheme: dark;
  --om-bg: #202124;
  --om-surface: #2b2d31;
  --om-muted: #303238;
  --om-accent: #35373d;
  --om-sidebar: #25262a;
  --om-text: #e8eaed;
  --om-secondary: #b0b3ba;
  --om-border: rgb(232 234 237 / .10);
  --om-field: rgb(232 234 237 / .16);
  --om-active: #303238;
  --om-link: #63b3ff;
}
html:root body {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--om-text);
  background: var(--om-bg);
  -webkit-font-smoothing: antialiased;
}
html:root body a { color: var(--om-link); }
html:root body pre, html:root body code, html:root body textarea#composebody {
  font-family: "Geist Mono", monospace;
}
html:root body #layout { background: var(--om-bg); }
html:root body #layout-menu, html:root body #layout-sidebar {
  background: var(--om-sidebar);
  border-color: var(--om-border);
}
html:root body #layout-list, html:root body #layout-content, html:root body .listbox {
  background: var(--om-surface);
  color: var(--om-text);
  border-color: var(--om-border);
}
html:root body .header, html:root body .footer, html:root body .searchbar,
html:root body #layout > div > .header, html:root body #layout > div > .footer,
html:root body #layout-menu .popover-header {
  background: var(--om-surface);
  color: var(--om-text);
  border-color: var(--om-border);
}
html:root body #layout-menu .popover-header { background: var(--om-sidebar); }
html:root body #taskmenu a, html:root body .menu a, html:root body .toolbar a,
html:root body .listing li > a, html:root body .listing td {
  color: var(--om-secondary);
}
html:root body #taskmenu a { border-radius: 8px; margin: 3px 6px; }
html:root body #taskmenu a.selected,
html:root body #taskmenu a:hover, html:root body #taskmenu a:focus {
  background: var(--om-active);
  color: var(--om-link);
}
html:root body #taskmenu a.compose {
  background: var(--om-brand);
  color: #071c30;
  box-shadow: 0 2px 6px rgb(18 136 251 / .16);
}
html:root body #taskmenu a.compose:hover { background: var(--om-brand-hover); }
html:root body .listing li, html:root body .listing tr { background: transparent; }
html:root body .listing li a, html:root body .listing tbody td { border-color: var(--om-border); }
html:root body .listing li.selected > a, html:root body .listing tr.selected > td,
html:root body .listing tr.focused > td, html:root body .listing li > a:hover,
html:root body .listing li > a:focus {
  background: var(--om-active);
  color: var(--om-text);
}
html:root body #mailboxlist { padding: 10px 8px; }
html:root body #mailboxlist li > a {
  margin: 2px 0;
  padding-left: 12px;
  border-radius: 8px;
  font-weight: 450;
}
html:root body #mailboxlist li.selected > a { font-weight: 600; }
html:root body #mailboxlist .unreadcount {
  color: var(--om-link);
  background: var(--om-accent);
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
}
html:root body .messagelist td { border-color: var(--om-border); }
html:root body .messagelist td.subject { color: var(--om-text); }
html:root body .messagelist tr.unread td.subject { font-weight: 650; }
html:root body .messagelist td.subject span.fromto,
html:root body .messagelist td.date { color: var(--om-secondary); }
html:root body .messagelist tr.selected td { background: var(--om-accent); }
html:root body .messagelist tr:hover td { background: var(--om-muted); }
html:root body .menu a:not(.disabled):hover,
html:root body .menu a:not(.disabled):focus,
html:root body .menu .dropbutton:hover { background: var(--om-muted); color: var(--om-text); }
html:root body .form-control, html:root body .custom-select,
html:root body .input-group-text, html:root body .input-group button,
html:root body .searchbar input, html:root body textarea {
  background-color: var(--om-surface);
  border-color: var(--om-field);
  color: var(--om-text);
  border-radius: 8px;
}
html:root body input::placeholder, html:root body textarea::placeholder { color: var(--om-secondary); }
html:root body .form-control:focus, html:root body .custom-select:focus {
  border-color: var(--om-brand);
  box-shadow: 0 0 0 3px rgb(18 136 251 / .16);
}
html:root body .btn { border-radius: 8px; font-weight: 600; }
html:root body .btn-primary {
  color: #071c30;
  background: var(--om-brand);
  border-color: var(--om-brand);
}
html:root body .btn-primary:hover, html:root body .btn-primary:focus {
  background: var(--om-brand-hover);
  border-color: var(--om-brand-hover);
}
html:root body .btn-secondary, html:root body .btn-light {
  background: var(--om-muted);
  color: var(--om-text);
  border-color: var(--om-field);
}
html:root body .custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--om-brand);
  border-color: var(--om-brand);
}
html:root body .popover, html:root body .popupmenu, html:root body .ui-dialog,
html:root body .ui-dialog .ui-dialog-titlebar, html:root body .ui-dialog .ui-dialog-content,
html:root body .ui-dialog .ui-dialog-buttonpane {
  color: var(--om-text);
  background: var(--om-surface);
  border-color: var(--om-border);
}
html:root body .popover, html:root body .popupmenu, html:root body .ui-dialog {
  border-radius: 14px;
  box-shadow: var(--om-shadow);
}
html:root body .popupmenu a { color: var(--om-text); border-radius: 6px; }
html:root body .popupmenu a:hover { background: var(--om-muted); }
html:root body .formcontent, html:root body .formcontent fieldset,
html:root body .formcontent legend, html:root body .propform,
html:root body #message-header, html:root body #message-content,
html:root body #compose-content, html:root body .mce-panel {
  color: var(--om-text);
  background: var(--om-surface);
  border-color: var(--om-border);
}
html:root body .formcontent legend, html:root body .header-title {
  font-weight: 600;
  letter-spacing: -.02em;
}
html:root body .formcontent .hint, html:root body .formcontent .description,
html:root body #message-header .header-title { color: var(--om-secondary); }
html:root body .nav-tabs, html:root body .nav-tabs .nav-link { border-color: var(--om-border); }
html:root body .nav-tabs .nav-link.active {
  background: var(--om-surface);
  color: var(--om-link);
  border-bottom-color: var(--om-brand);
}
html:root body a:focus-visible, html:root body button:focus-visible {
  outline: 2px solid var(--om-brand);
  outline-offset: 2px;
}
html:root body #taskmenu .omnyn-panel-link {
  font-size: 10px;
  line-height: 1.2;
  white-space: normal;
  min-height: 48px;
}
html:root body #taskmenu .omnyn-panel-link .inner { font-size: inherit; }

/* O login segue a marca horizontal e o formulário sem cartão do painel. */
html:root body.task-login { background: #121720; color: #fafafa; }
html:root body.task-login #layout,
html:root body.task-login #layout-content { background: transparent; color: #fafafa; }
html:root body.task-login #layout { padding: 0; gap: 0; }
html:root body.task-login::before {
  content: ""; position: fixed; inset: 0 0 auto; height: min(24rem, 48vh); pointer-events: none;
  background: radial-gradient(ellipse 65% 100% at 10% 0%, rgb(23 190 254 / .15), transparent 75%),
              radial-gradient(ellipse 65% 100% at 85% 0%, rgb(18 136 251 / .24), transparent 75%);
}
html:root body.task-login #layout-content {
  position: relative; display: flex; align-items: center; justify-content: center;
  overflow-y: auto; padding: 88px 24px; border: 0; border-radius: 0;
}
.omnyn-auth { width: 100%; max-width: 384px; margin: auto; text-align: center; }
.omnyn-brand { display: flex; justify-content: center; margin-bottom: 12px; }
html:root body.task-login #logo {
  position: static; width: 208px; height: auto; max-height: none; margin: 0; opacity: 1;
  filter: brightness(0) invert(1);
}
.omnyn-login-card { padding: 0; background: transparent; border: 0; box-shadow: none; }
.omnyn-login-card h1 { margin: 0 0 8px; color: #fafafa; font-size: 18px; font-weight: 600; letter-spacing: -.025em; }
.omnyn-login-card > p { font-size: 12px; line-height: 1.625; color: #aeb5c2; margin-bottom: 24px; }
html:root body.task-login #login-form { position: static; width: 100%; max-width: none; margin: 0; text-align: left; }
html:root body.task-login #login-form,
html:root body.task-login #login-form table,
html:root body.task-login #login-form tbody,
html:root body.task-login #login-form tr,
html:root body.task-login #login-form td { background: transparent; }
html:root body.task-login #login-form table,
html:root body.task-login #login-form tbody,
html:root body.task-login #login-form tr,
html:root body.task-login #login-form td { display: block; width: 100%; padding: 0; }
html:root body.task-login #login-form tr { margin: 0 0 16px; }
html:root body.task-login #login-form td.title { display: block !important; margin-bottom: 6px; }
html:root body.task-login #login-form label { font-size: 12px; line-height: 20px; font-weight: 500; margin: 0; color: #fafafa; }
html:root body.task-login #login-form .input-group-prepend { display: none; }
html:root body.task-login .form-control {
  background: transparent; color: #fafafa; border: 1px solid rgb(255 255 255 / .14);
  width: 100%; min-height: 40px; height: 40px; border-radius: 4px; padding: 0 14px; font-size: 13px;
}
html:root body.task-login .form-control::placeholder { color: transparent; }
html:root body.task-login #rcmloginsubmit {
  min-height: 40px; height: 40px; margin: 0; border-radius: 4px; background: #f2f2f2;
  border: 0; color: #0d121b; font-size: 13px; font-weight: 500; text-transform: none !important; box-shadow: none;
}
html:root body.task-login #rcmloginsubmit:hover { background: #e1e5e9; }
html:root body.task-login .formbuttons { margin: 0; }
html:root body.task-login #login-footer { color: #aeb5c2; }
html:root body.task-login .omnyn-panel-link { display: inline-block; color: #fafafa; margin-top: 24px; font-size: 12px; }
html:root body.task-login .omnyn-panel-link:hover { text-decoration: underline; }
html:root body #taskmenu, html:root body #taskmenu .special-buttons { background: var(--om-sidebar); }
html:root body #layout-menu #logo { filter: brightness(0); }
html:root.dark-mode body #layout-menu #logo { filter: brightness(0) invert(1); }
html:root body .messagelist td.subject span { line-height: 20px; }
html:root body .messagelist td.subject { height: auto; min-height: 54px; }
html:root body a.toolbar-button span.inner { display: none; }
html:root body #taskmenu .special-buttons a { color: var(--om-secondary); }
/* O menu usa linhas flexíveis; o pseudo-elemento não altera a altura nativa. */
html:root body #taskmenu a {
  display: flex;
  align-items: center;
  gap: 10px;
  width: auto;
  min-width: 0;
  max-width: none;
  min-height: 44px;
  height: 44px;
  margin: 3px 10px;
  padding: 0 12px;
  text-align: left;
  white-space: nowrap;
}
html:root body #taskmenu a::before {
  display: block !important;
  float: none !important;
  flex: 0 0 20px;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
}
html:root body #taskmenu a .inner {
  display: block;
  font-size: 12px;
  line-height: 20px;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}
html:root body #taskmenu .omnyn-panel-link { font-size: 12px; line-height: 20px; }
html:root body #taskmenu .omnyn-panel-link::before { margin: 0 !important; }
html:root body .header > a.button.icon::before {
  height: 100% !important;
  float: none !important;
  margin: 0 !important;
}
html:root body .listing.iconized td.section,
html:root body #filterslist td.name,
html:root body #filtersetslist td.name {
  position: relative;
  padding-left: 38px;
}
html:root body .listing.iconized td.section::before,
html:root body #filterslist td.name::before,
html:root body #filtersetslist td.name::before {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  float: none !important;
  margin: 0 !important;
}
html:root body .listing.iconized li > a {
  display: flex;
  align-items: center;
  gap: 10px;
}
html:root body .listing.iconized li > a::before { float: none !important; margin: 0 !important; flex-shrink: 0; }
@media (min-width: 1025px) {
  /* Coluna compacta como a Elastic: ícone em cima, rótulo curto embaixo. */
  html:root body #layout-menu { position: relative; width: 92px; flex: 0 0 92px; border-right: 1px solid var(--om-border); }
  html:root body #layout-menu .popover-header img { max-width: 44px; }
  html:root body #taskmenu a {
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    height: 58px;
    min-height: 58px;
    margin: 2px 4px;
    padding: 0 2px;
    text-align: center;
  }
  html:root body #taskmenu .special-buttons { left: 0; right: 0; width: auto; }
  html:root body #taskmenu a.omnyn-panel-link { font-size: inherit; line-height: inherit; }
  html:root body #taskmenu a.omnyn-panel-link .inner { font-size: 10.5px; line-height: 14px; }
  html:root body #taskmenu a .inner {
    max-width: 100%;
    font-size: 10.5px;
    line-height: 14px;
    letter-spacing: -.01em;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  html:root body .messagelist > tbody > tr > td { height: 54px; padding-top: 5px; padding-bottom: 5px; }
  html:root body .messagelist td.subject span.subject { font-size: 13px; }
  html:root body #mailboxlist li > a { line-height: 34px; }
}
@media (max-width: 1024px) {
  html:root body #taskmenu .omnyn-panel-link { min-height: 44px; }
  html:root body #taskmenu .omnyn-panel-link .inner { display: inline; }
  html:root body .messagelist td.subject { padding-top: 9px; padding-bottom: 9px; }
}
@media (min-width: 481px) and (max-width: 1024px) {
  html:root body #taskmenu a { justify-content: center; margin: 3px 2px; padding: 0; }
  html:root body #taskmenu a .inner { display: none; }
}
@media (max-width: 480px) {
  .omnyn-login-card { padding: 0; }
  html:root body.task-login #layout-content { padding: 80px 20px; }
  html:root body.task-login .form-control { font-size: 16px; min-height: 44px; }
  html:root body.task-login #rcmloginsubmit { min-height: 44px; }
}
@media print {
  html:root body { background: #fff; color: #1d1d1d; }
  .omnyn-panel-link { display: none !important; }
}

/* Correções de geometria sobre os ícones herdados da Elastic. */
html:root body #layout-menu .popover-header { background-color: var(--om-sidebar) !important; }
html:root body #mailboxlist li > a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px 0 12px;
}
html:root body #mailboxlist li > a::before { float: none !important; margin: 0 !important; flex: none; }
html:root body #mailboxlist li > a .unreadcount {
  position: static;
  margin: 0 0 0 auto;
  padding: 1px 6px;
  line-height: 16px;
}
html:root body .messagelist span.flag span { color: var(--om-secondary); opacity: .45; }
html:root body .messagelist span.flag span.flagged { color: #e5484d; opacity: 1; }
html:root body .messagelist tr:not(:hover) span.flag span.unflagged { opacity: 0; }
html:root body .header a.button.icon.toolbar-button span.inner { display: none !important; }
html:root body .header a.button.icon.toolbar-button::before { display: block !important; margin: 0 auto !important; height: 100% !important; }
@media (min-width: 1025px) {
  html:root body #toolbar-menu a span.inner { display: none !important; }
}
html:root body .searchbar form::before {
  content: "" !important;
  float: none;
  align-self: center;
  flex: none;
  width: 16px;
  height: 16px;
  margin: 0 0 0 12px;
  background: var(--om-secondary);
  -webkit-mask: url('../images/icons/search.svg') center / 16px 16px no-repeat;
  mask: url('../images/icons/search.svg') center / 16px 16px no-repeat;
}
html:root body .searchbar { gap: 4px; padding-right: 8px; }
html:root body .searchbar a.button { align-self: center; }
html:root body .searchbar input { padding-left: 8px; }
html:root body .file-upload.droptarget::after {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  margin: 5rem auto 0;
  background: var(--om-field);
  -webkit-mask: url('../images/icons/upload.svg') center / 40px 40px no-repeat;
  mask: url('../images/icons/upload.svg') center / 40px 40px no-repeat;
}
html:root body .file-upload, html:root body .image-selector.droptarget { border-color: var(--om-field); border-radius: 12px; }
html:root body .html-editor .editor-toolbar {
  background: var(--om-muted);
  border-color: var(--om-border);
}
html:root body .html-editor .editor-toolbar .mce-i-html { color: var(--om-secondary); }
html:root body .html-editor .editor-toolbar .mce-i-html::before { display: block !important; margin: 0 auto !important; }
html:root body .messagelist td.subject span.msgicon.status::before { color: transparent; }
html:root body .messagelist tr.unread td.subject span.msgicon.status::before { color: var(--om-brand); }
html:root body .floating-action-buttons a.button,
html:root.dark-mode body .floating-action-buttons a.button {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--om-brand);
  color: #071c30;
  opacity: 1;
  box-shadow: var(--om-shadow);
}
html:root body .floating-action-buttons a.button::before {
  float: none !important;
  margin: 0 !important;
  width: 24px !important;
  height: 24px !important;
  -webkit-mask-size: 24px 24px !important;
  mask-size: 24px 24px !important;
}
html:root body #layout-menu,
html:root.dark-mode body #layout-menu { background-color: var(--om-sidebar); }
html:root body .messagelist tr.unread td.subject span.msgicon.status::before,
html:root.dark-mode body .messagelist tr.unread td.subject span.msgicon.status::before { color: var(--om-brand) !important; }
/* Lista de pastas sem divisórias: só o destaque arredondado marca a pasta ativa. */
html:root body #mailboxlist li,
html:root body #mailboxlist li > a { border: 0 !important; }
html:root body #mailboxlist li > a:hover { background: var(--om-muted); }
html:root body #mailboxlist li.selected > a { background: var(--om-accent); color: var(--om-text); }
html:root body #mailboxlist li > a:focus:not(:focus-visible) { outline: 0; box-shadow: none; }
html:root body #taskmenu .special-buttons a:not(:hover):not(:focus-visible) { background: transparent; }
html:root body #mailboxlist li, html:root.dark-mode body #mailboxlist li.selected { background: transparent !important; }

/* Avisos no padrão do painel: cartão neutro no canto superior direito; a cor vem do ícone e da borda. */
html:root body {
  --om-success: #16a34a;
  --om-warning: #f59e0b;
  --om-danger: #dc2626;
}
html:root.dark-mode body { --om-danger: #f87171; }
html:root body #messagestack {
  top: 16px;
  right: 16px;
  bottom: auto;
  left: auto;
  width: 356px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
html:root body #messagestack > div,
html:root.dark-mode body #messagestack > div {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 12px 14px;
  min-height: 0;
  color: var(--om-text);
  background: var(--om-surface);
  border: 1px solid var(--om-border);
  border-radius: 10px;
  box-shadow: var(--om-shadow);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.6;
  opacity: 1;
}
html:root body #messagestack > div > i.icon {
  flex: none;
  width: 16px;
  height: 16px;
  margin-top: 3px;
  font-size: 0 !important;
  background: var(--om-secondary);
  -webkit-mask: url('../images/icons/info.svg') center / 16px 16px no-repeat;
  mask: url('../images/icons/info.svg') center / 16px 16px no-repeat;
}
html:root body #messagestack > div > i.icon::before { content: none !important; }
html:root body #messagestack > div.confirmation { border-color: rgb(22 163 74 / .3); }
html:root body #messagestack > div.confirmation > i.icon {
  background: var(--om-success);
  -webkit-mask-image: url('../images/icons/circle-check.svg');
  mask-image: url('../images/icons/circle-check.svg');
}
html:root body #messagestack > div.warning { border-color: rgb(245 158 11 / .4); }
html:root body #messagestack > div.warning > i.icon {
  background: var(--om-warning);
  -webkit-mask-image: url('../images/icons/triangle-alert.svg');
  mask-image: url('../images/icons/triangle-alert.svg');
}
html:root body #messagestack > div.error { border-color: rgb(220 38 38 / .3); }
html:root body #messagestack > div.error > i.icon {
  background: var(--om-danger);
  -webkit-mask-image: url('../images/icons/circle-alert.svg');
  mask-image: url('../images/icons/circle-alert.svg');
}
html:root body #messagestack > div.loading > i.icon {
  -webkit-mask-image: url('../images/icons/loader-circle.svg');
  mask-image: url('../images/icons/loader-circle.svg');
  animation: om-spin 1s linear infinite;
}
@keyframes om-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  html:root body #messagestack > div.loading > i.icon { animation: none; }
}
@media (max-width: 480px) {
  html:root body #messagestack { top: 12px; left: 12px; right: 12px; width: auto; }
}
html:root body.task-login #messagestack > div { color: #fafafa; background: #181d27; }
html:root body.task-login #messagestack > div.notice,
html:root body.task-login #messagestack > div.loading { border-color: rgb(255 255 255 / .12); }
