/* DÜSEN Mail 1.0.0. Roundcube Elastic remains the responsive base. */
:root {
  --duesen-yellow: #eed500;
  --duesen-yellow-hover: #dac300;
  --duesen-ink: #252321;
  --duesen-paper: #f6f4ed;
  --duesen-panel: #fffefa;
  --duesen-line: #dedbd1;
  --duesen-muted: #69655d;
  --duesen-selected: #fff5b8;
}
html.dark-mode {
  --duesen-paper: #1d1c1a;
  --duesen-panel: #292724;
  --duesen-line: #49453d;
  --duesen-muted: #c0bab0;
  --duesen-selected: #514a20;
}
body:not(.action-print) { background-color: var(--duesen-paper); }
body a { color: #746400; }
html.dark-mode body a { color: #f0d943; }
body .btn.btn-primary, body .btn.btn-primary:disabled {
  color: var(--duesen-ink); background-color: var(--duesen-yellow); border-color: var(--duesen-yellow);
}
body .btn.btn-primary:hover, body .btn.btn-primary:focus, body .btn.btn-primary:active {
  color: var(--duesen-ink); background-color: var(--duesen-yellow-hover); border-color: var(--duesen-yellow-hover);
}
body a:focus-visible, body button:focus-visible, body input:focus-visible, body select:focus-visible, body textarea:focus-visible {
  outline: 3px solid #9d8500; outline-offset: 3px;
}
html.dark-mode body :focus-visible { outline-color: var(--duesen-yellow); }
body .form-control:focus { border-color: #a48b00; box-shadow: 0 0 0 .2rem rgb(238 213 0 / 20%); }
body #layout-menu { background: var(--duesen-ink); }
/* The mobile logo header is a separate popover surface in Elastic. */
html.layout-phone body #layout-menu .popover-header,
html.layout-small body #layout-menu .popover-header {
  background: var(--duesen-ink) !important;
}
body #taskmenu a { color: #ece7dc; }
body #taskmenu a:hover, body #taskmenu a.selected { color: var(--duesen-yellow); background-color: #37332b; }
body #taskmenu a.selected { box-shadow: inset 3px 0 0 var(--duesen-yellow); }
body #taskmenu a.button-compose { color: var(--duesen-ink); background: var(--duesen-yellow); }
body #taskmenu a.button-compose:hover { background: var(--duesen-yellow-hover); }
body #layout-menu #logo { object-fit: contain; padding: 5px; height: auto; max-height: 58px; }
body #layout-sidebar, body #layout-list { background-color: var(--duesen-paper); border-color: var(--duesen-line); }
body #layout-content { background-color: var(--duesen-panel); }
body #layout > div > .header, body #layout > div > .footer {
  background-color: var(--duesen-paper); border-color: var(--duesen-line);
}
body .listing li.selected, body .listing tr.selected > td { background-color: var(--duesen-selected); }
body .listing li.selected > a, body .listing tr.selected > td { color: var(--duesen-ink); }
html.dark-mode body .listing li.selected > a, html.dark-mode body .listing tr.selected > td { color: #fff9dc; }
body .folderlist li.selected > a { box-shadow: inset 3px 0 0 var(--duesen-yellow); }
body .popover, body .ui-dialog { border-radius: 10px; }
body .ui-dialog .ui-dialog-titlebar { border-radius: 10px 10px 0 0; }
body .btn { border-radius: 6px; }
.duesen-carddav-help { padding: 14px 16px; border-left: 3px solid var(--duesen-yellow); background: var(--duesen-paper); line-height: 1.6; }

/* Login: logo and native form, no promotional copy. */
body.task-login { overflow: auto; min-width: 280px; }
.task-login #layout { min-height: 100%; height: auto; overflow: visible; }
.task-login #layout #layout-content.duesen-login {
  display: flex; min-height: 100svh; text-align: left;
  background: radial-gradient(ellipse at 15% 10%, rgb(238 213 0 / 10%), transparent 45%),
    radial-gradient(ellipse at 85% 90%, rgb(238 213 0 / 8%), transparent 45%), var(--duesen-paper);
}
.task-login .duesen-auth { flex: 1; display: flex; align-items: center; justify-content: center; padding: 40px 24px; }
.task-login .duesen-auth-card {
  width: 100%; max-width: 420px; padding: 40px 34px 24px; border: 1px solid var(--duesen-line);
  border-top: 4px solid var(--duesen-yellow); border-radius: 20px; background: var(--duesen-panel);
  box-shadow: 0 20px 70px rgb(37 35 33 / 9%);
}
.task-login .duesen-auth-card #logo {
  display: block; top: auto; position: static; width: 150px; max-width: 65%; height: auto;
  max-height: none; object-fit: contain; margin: 0 auto 38px; opacity: 1;
}
.task-login #login-form { width: 100%; max-width: none; top: auto; position: static; margin: 0; }
.task-login #login-form .input-group { margin-bottom: 16px; }
.task-login #login-form .form-control { height: 52px; font-size: 1rem; background-color: var(--duesen-paper); border-color: var(--duesen-line); }
.task-login #login-form .input-group-text { width: 48px; justify-content: center; color: var(--duesen-muted); background: var(--duesen-paper); border-color: var(--duesen-line); }
.task-login #rcmloginsubmit { min-height: 52px; font-size: .9rem; font-weight: 700; letter-spacing: .055em; border-radius: 7px; margin-top: 8px; }
.task-login #login-footer { color: var(--duesen-muted); }
.task-login #taskmenu.duesen-theme { width: auto; margin-top: 14px; background: transparent; text-align: center; }
.task-login #taskmenu.duesen-theme a.theme {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
  padding: 8px; color: var(--duesen-muted); background: transparent; font-size: 1rem; line-height: 1.4;
}
.task-login #taskmenu.duesen-theme a.theme::before { margin: 0; font: 24px/1 system-ui, sans-serif; content: "\263e"; }
.task-login #taskmenu.duesen-theme a.theme.light::before { content: "\2600"; }
.task-login #taskmenu.duesen-theme a.theme span {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.task-login #taskmenu.duesen-theme a.theme:hover { color: #746400; }
html.dark-mode .task-login #taskmenu.duesen-theme a.theme:hover { color: var(--duesen-yellow); }
@media (max-width: 480px) {
  .task-login .duesen-auth { padding: 24px 18px; }
  .task-login .duesen-auth-card { padding: 32px 22px 18px; border-radius: 16px; }
}
@media (prefers-reduced-motion: reduce) { body .btn, body .form-control { transition: none; } }
@media print { body { background: white; } }