/* ==========================================================================
   epstein.host Webmail — custom theme (overlays the Elastic skin)
   Accent: indigo/violet.  Keep overrides colour-only where possible so the
   Elastic layout/dark-mode keeps working.
   ========================================================================== */
:root {
  --eh-accent:      #6d5efc;
  --eh-accent-2:    #9b6dff;
  --eh-accent-dark: #5847e0;
  --eh-ink:         #2a2350;
}

/* ---------- Logo (login + top bar) -------------------------------------- */
#logo,
img#logo,
.menu .logo,
img.logo {
  content: url('/plugins/epstein_brand/assets/epstein-logo.svg');
  height: 52px !important;
  width: auto !important;
  max-width: 232px;
}

/* ---------- Login screen ------------------------------------------------- */
#layout-content.no-navbar,
body.task-login,
.task-login #layout-content {
  background:
    radial-gradient(1100px 540px at 18% -12%, rgba(123,107,255,.40) 0%, transparent 58%),
    radial-gradient(900px 520px at 100% 110%, rgba(54,224,160,.18) 0%, transparent 55%),
    linear-gradient(135deg, #181231 0%, #241b48 46%, #3a256f 100%) !important;
}

/* the login card */
#layout-content.no-navbar #login-form,
.task-login #login-form {
  background: #ffffff;
  max-width: 392px;
  margin: 6vh auto 0;
  padding: 38px 34px 28px;
  border-radius: 18px;
  box-shadow: 0 28px 70px rgba(16, 9, 40, .55), 0 2px 10px rgba(0,0,0,.22);
}
.task-login #logo,
#layout-content.no-navbar #logo {
  display: block;
  margin: 2px auto 22px;
}
.task-login #login-form .form-control,
#layout-content.no-navbar #login-form input.form-control {
  border-radius: 10px;
  border: 1.5px solid #e3e1f1;
  padding: 11px 13px;
  transition: border-color .15s, box-shadow .15s;
}
.task-login #login-form .form-control:focus,
#layout-content.no-navbar #login-form input.form-control:focus {
  border-color: var(--eh-accent);
  box-shadow: 0 0 0 3px rgba(109, 94, 252, .18);
  outline: none;
}
.task-login #login-form button.btn,
.task-login #login-form .btn-primary,
#layout-content.no-navbar #login-form button {
  width: 100%;
  margin-top: 8px;
  padding: 12px 16px;
  border: 0;
  border-radius: 11px;
  font-weight: 600;
  letter-spacing: .2px;
  color: #fff !important;
  background: linear-gradient(135deg, var(--eh-accent), var(--eh-accent-2)) !important;
  box-shadow: 0 8px 22px rgba(109, 94, 252, .42);
}
.task-login #login-form button.btn:hover { filter: brightness(1.05); }
#login-footer { color: rgba(255,255,255,.72) !important; }
#login-footer a { color: #fff !important; }

/* ---------- Accent across the app --------------------------------------- */
/* primary buttons */
.btn-primary,
button.btn-primary,
.button.mainaction,
.formbuttons .submit,
a.button.mainaction {
  background: linear-gradient(135deg, var(--eh-accent), var(--eh-accent-2)) !important;
  border-color: var(--eh-accent-dark) !important;
  color: #fff !important;
}
.btn-primary:hover { filter: brightness(1.05); }

/* links + selected list rows + unread badges */
a { color: var(--eh-accent); }
#layout-menu .selected,
.listing li.selected > a,
.listing tr.selected > td,
.listing tbody tr.selected td {
  border-left-color: var(--eh-accent) !important;
}
.unreadcount,
span.unreadcount,
.folder .unreadcount {
  background-color: var(--eh-accent) !important;
  color: #fff !important;
}
/* the task bar (left column) brand tint */
#taskmenu a.selected,
#layout-menu .selected a { color: var(--eh-accent) !important; }

/* primary "+" / compose floating action keeps accent */
.floating-action-buttons a.button.create,
a.compose { background: linear-gradient(135deg, var(--eh-accent), var(--eh-accent-2)) !important; }
