/* DKRZ neutral theme for listmonk's public pages, layered on style.css.
   Colours follow the dkrz theme of freva-auth-template. */
:root {
  color-scheme: light dark;
  --dk-accent: #005092;
  --dk-accent-hover: #003d70;
  --dk-accent-soft: #e5eef5;
  --dk-page: #f0f2f4;
  --dk-surface: #ffffff;
  --dk-text: #333333;
  --dk-muted: #6b7580;
  --dk-border: #d9dee3;
  --dk-input: #ffffff;
}
@media (prefers-color-scheme: dark) {
  :root {
    --dk-accent: #3a8ad4;
    --dk-accent-hover: #4a96dc;
    --dk-accent-soft: rgba(58, 138, 212, 0.15);
    --dk-page: #121417;
    --dk-surface: #1b1d21;
    --dk-text: #e6e6e6;
    --dk-muted: #9aa0a6;
    --dk-border: #3a3d42;
    --dk-input: #15171a;
  }
}

body.dk-page {
  background: var(--dk-page);
  color: var(--dk-text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.dk-page .wrap {
  background: var(--dk-surface);
  border: 0;
  border-top: 4px solid var(--dk-accent);
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
.dk-page .header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--dk-border);
}
.dk-page .header .logo img { display: block; width: 140px; height: auto; max-width: 100%; }
.dk-page .dk-site { color: var(--dk-muted); font-size: 0.95em; }

.dk-page h1, .dk-page h2, .dk-page h3 { color: var(--dk-accent); }
.dk-page a { color: var(--dk-accent); }
.dk-page a:hover { color: var(--dk-accent-hover); }
.dk-page label, .dk-page .lists .description, .dk-page .small { color: var(--dk-muted); }

.dk-page input[type="text"],
.dk-page input[type="email"],
.dk-page input[type="password"],
.dk-page select {
  background: var(--dk-input);
  color: var(--dk-text);
  border: 1px solid var(--dk-border);
  border-radius: 4px;
  box-shadow: none;
}
.dk-page input:focus, .dk-page select:focus {
  border-color: var(--dk-accent);
  outline: 3px solid var(--dk-accent-soft);
  outline-offset: 0;
}
.dk-page input[type="checkbox"], .dk-page input[type="radio"] { accent-color: var(--dk-accent); }

.dk-page .button {
  background: var(--dk-accent);
  border-radius: 4px;
  color: #ffffff;
}
.dk-page .button:hover { background: var(--dk-accent-hover); color: #ffffff; }
.dk-page .button.button-outline {
  background: transparent;
  border: 1px solid var(--dk-accent);
  color: var(--dk-accent);
}
.dk-page .button.button-outline:hover { background: var(--dk-accent-soft); }
.dk-page :focus-visible { outline: 3px solid var(--dk-accent); outline-offset: 2px; }

footer.dk-footer { color: var(--dk-muted); font-size: 0.8em; text-align: center; }