/* Daylit Mail: the Daylit look on SnappyMail (13-11 Joan: "daylit uiterlijk"). Loaded after the theme; only its
   variables and a few login details are changed, so SnappyMail updates keep working. */
:root {
  --dl-bg: #fbf6ec; --dl-panel: #ffffff; --dl-ink: #1d2433; --dl-soft: #5d6576; --dl-line: #e6dfd0;
  --dl-sun: #f2a516; --dl-sun-deep: #c97a00; --dl-sun-ink: #1d2433; --dl-hover: #f5eedf; --dl-sel: #fde7b8;
  --font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --main-bg-image: none; --main-bg-color: var(--dl-bg); --main-color: var(--dl-ink);
  --login-bg-color: var(--dl-panel); --login-color: var(--dl-ink); --login-border: 1px solid var(--dl-line);
  --login-border-radius: 14px; --login-box-shadow: 0 10px 30px rgba(29, 36, 51, .08);
  --loading-color: var(--dl-ink); --loading-text-shadow: none; --spinner-color: var(--dl-sun);
  --link-color: var(--dl-sun-deep); --border-color: var(--dl-line); --hr-color: var(--dl-line);
  --btn-bg-clr: var(--dl-panel); --btn-clr: var(--dl-ink); --btn-border-clr: var(--dl-line); --btn-border-radius: 8px;
  --btn-success-bg-clr: var(--dl-sun);
  --input-bg-clr: #fff; --input-clr: var(--dl-ink); --input-border-clr: var(--dl-line);
  --input-focus-border-clr: var(--dl-sun); --input-border-radius: 8px;
  --panel-bg-clr: var(--dl-panel); --dialog-bg-clr: var(--dl-panel); --dialog-clr: var(--dl-ink);
  --dialog-border-clr: var(--dl-line); --dialog-border-radius: 14px;
  --folders-color: var(--dl-ink); --folders-hover-bg-color: var(--dl-hover); --folders-hover-color: var(--dl-ink);
  --folders-selected-bg-color: var(--dl-sel); --folders-selected-color: var(--dl-ink);
  --folders-focused-bg-color: var(--dl-hover); --folders-focused-color: var(--dl-ink);
  --unread-count-bg-color: var(--dl-sun); --unread-count-color: var(--dl-sun-ink);
  --message-list-toolbar-bg-color: var(--dl-bg); --message-header-bg-clr: var(--dl-panel);
  --tr-hover-bg-clr: var(--dl-hover); --tr-odd-bg-clr: #fffdf8;
  --dropdown-menu-bg-color: var(--dl-panel); --dropdown-menu-color: var(--dl-ink);
  --dropdown-menu-hover-bg-color: var(--dl-hover); --dropdown-menu-hover-color: var(--dl-ink);
  --settings-menu-color: var(--dl-ink); --settings-menu-hover-bg-color: var(--dl-hover);
  --settings-menu-selected-bg-color: var(--dl-sel); --settings-menu-selected-color: var(--dl-ink);
  --tab-active-bg-clr: var(--dl-panel); --tab-hover-border-clr: var(--dl-sun);
}
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --dl-bg: #0f1420; --dl-panel: #171e2d; --dl-ink: #eef0f5; --dl-soft: #a4abbb; --dl-line: #2a3346;
    --dl-sun: #f7b437; --dl-sun-deep: #ffc95c; --dl-sun-ink: #0f1420; --dl-hover: #1f2738; --dl-sel: #3a2f14;
    --input-bg-clr: #0f1420; --tr-odd-bg-clr: #141b29;
  }
}
html, body, #rl-app { background: var(--dl-bg) !important; }
/* login: the Daylit sun and name instead of the SnappyMail title */
#V-Login .descWrapper { font-size: 0 !important; }
#V-Login .descWrapper::before {
  content: ""; display: block; width: 52px; height: 52px; margin: 0 auto 12px;
  background: url("/daylit/logo.svg") center / contain no-repeat;
}
#V-Login .descWrapper::after {
  content: "Daylit Mail"; font-size: 26px; font-weight: 650; letter-spacing: -.01em; color: var(--dl-ink);
}
#V-Login .btn, .LoginView .btn, #Login button[type=submit], #Login .btn {
  background: var(--dl-sun) !important; color: var(--dl-sun-ink) !important; border-color: var(--dl-sun) !important;
  font-weight: 600; text-shadow: none !important; background-image: none !important;
}
#V-Login .btn:hover, .LoginView .btn:hover, #Login .btn:hover { background: var(--dl-sun-deep) !important; }
.btn-success, .buttonCompose { background: var(--dl-sun) !important; color: var(--dl-sun-ink) !important;
  border-color: var(--dl-sun) !important; text-shadow: none !important; background-image: none !important; }

#V-Login input[type=email], #V-Login input[type=text], #V-Login input[type=password] {
  border: 1px solid var(--input-border-clr) !important; border-radius: 8px !important; background: var(--input-bg-clr) !important;
}
#V-Login input:focus { border-color: var(--dl-sun) !important; box-shadow: 0 0 0 3px rgba(242, 165, 22, .18) !important; }
@media (max-width: 520px) { #V-Login form, #V-Login .wrapper, #V-Login > form { margin-left: 16px !important; margin-right: 16px !important; } }
