/* ERSAN.NET Premium — independent child skin of Elastic. */
:root {
  --ersan-blue: #316bea;
  --ersan-blue-hover: #235ad0;
  --ersan-bg: #f4f7fc;
  --ersan-border: #e7edf5;
  --ersan-ink: #253147;
  --ersan-muted: #66758d;
}
html, body, input, textarea, select, button { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important; }
body { color: var(--ersan-ink); }
body:not(.task-login) { background: var(--ersan-bg); }
#taskmenu { background: #121c2f !important; }
#taskmenu a { border-radius: 11px; transition: background-color .18s ease, color .18s ease; }
#taskmenu a:hover, #taskmenu a.selected { background: rgba(96,148,245,.19) !important; }
#layout-sidebar { background: #fff; border-right: 1px solid var(--ersan-border); }
#layout-list, #layout-content { border-color: var(--ersan-border) !important; }
#layout-list { background: #fff; }
.toolbar, .header { border-color: var(--ersan-border) !important; }
.listbox .listitem, .messagelist tr { border-color: #eef1f7 !important; }
.listbox .listitem:hover, .messagelist tr:hover { background: #f1f6ff !important; }
.listbox .selected, .messagelist tr.selected { background: #e9f1ff !important; }
.button, button, input[type="submit"], .btn { border-radius: 9px; }
.btn-primary, .button.primary { background-color: var(--ersan-blue) !important; border-color: var(--ersan-blue) !important; }
.btn-primary:hover, .button.primary:hover { background-color: var(--ersan-blue-hover) !important; }
input.form-control, select.form-control, textarea.form-control { border-radius: 10px; border-color: #dce4ef; }
input.form-control:focus, textarea.form-control:focus { border-color: #84a7f2; box-shadow: 0 0 0 3px rgba(49,107,234,.10); }

/* Login: calm background and a focused, accessible card. */
body.task-login { background: radial-gradient(circle at 12% 18%, #e7effe 0, transparent 38%), linear-gradient(135deg,#f8fafe,#ecf2fb) !important; }
body.task-login #layout-content { background: transparent; }
body.task-login #login-form {
  background: #fff;
  padding: 32px 34px 24px;
  border: 1px solid #e6ebf3;
  border-radius: 21px;
  box-shadow: 0 22px 75px rgba(37,57,104,.10), 0 3px 12px rgba(37,57,104,.04);
}
body.task-login #logo { width: min(325px, 82vw); height: auto; max-height: 110px; object-fit: contain; }
body.task-login input.form-control { background: #fbfcff; min-height: 43px; }
body.task-login #login-footer { color: #78869c; }

/* Dark mode stays supported by the stock Elastic theme. */
html.dark-mode body:not(.task-login) { background: #141c2b; color: #e7edf8; }
html.dark-mode #taskmenu { background: #0b1422 !important; }
html.dark-mode #layout-sidebar, html.dark-mode #layout-list { background: #1b273a; border-color: #334158 !important; }
html.dark-mode .listbox .listitem:hover, html.dark-mode .messagelist tr:hover { background: #293c5a !important; }
html.dark-mode .listbox .selected, html.dark-mode .messagelist tr.selected { background: #264571 !important; }
html.dark-mode body.task-login { background: radial-gradient(circle at 12% 20%, #1f3657 0, transparent 39%), #121c2a !important; }
html.dark-mode body.task-login #login-form { background: #1b283c; border-color: #334762; box-shadow: 0 25px 65px rgba(0,0,0,.25); }
html.dark-mode body.task-login input.form-control { background: #202e44; border-color: #40516e; color: #edf3fd; }
@media (max-width: 650px) {
  body.task-login #login-form { padding: 25px 22px 22px; border-radius: 16px; }
  body.task-login #logo { max-width: 250px; }
}
@media (prefers-reduced-motion: reduce) { * { transition-duration: .01ms !important; } }