/* Dark mode: only active with <html class="dark"> (cookie "theme=dark", see templates/header.php and js/theme.js). */
html.dark {
	--d-text:#DBDBDB;
	--d-muted:#9A9A9A;
	--d-link:#8CA9DE;
	--d-accent:#3F5C9E;
	--d-line:#363D52;
	--d-field:#2A2A2A;
	--logo-text:var(--d-text);
	--logo-fb-top:#0E2F7E;
	--logo-fb-bottom:#14234E;
	--logo-fb-f:var(--d-text);
	--loading:#8CA9DE;
	color-scheme: dark;
	background:#1E1E1E url(../img/bg-dark.png);
}
html.dark body { color:var(--d-text); background:none; }
html.dark a, html.dark a:visited { color:var(--d-link); }
html.dark .menu, html.dark .menu:visited, html.dark .footer a, html.dark .footer a:visited, html.dark .st-nav a.on, html.dark .st-btn, html.dark .st-btn:visited { color:var(--d-text); }
html.dark .content { border-color:var(--d-accent); border-bottom:1px solid var(--d-accent); }
html.dark hr { background-color:var(--d-accent); color:var(--d-accent); border-color:var(--d-accent); }
html.dark h1, html.dark h2 { color:var(--d-text); }

html.dark input, html.dark textarea, html.dark select { background:var(--d-field); color:var(--d-text); border:1px solid var(--d-accent); }
html.dark #uploadField { border-color:var(--d-accent); }

html.dark .info { color:var(--d-link); background-color:#16233F; border-color:#3A6BD6; }
html.dark .success { color:#7CC592; background-color:#162A1E; border-color:#3C8A57; }
html.dark .error { color:#E49A9A; background-color:#2E1B1B; border-color:#A04848; }
html.dark .noscripterror { color:#E49A9A; background-color:#3C2323; border-color:#A04848; }
html.dark .warning { color:#D6CB86; background-color:#2B2917; border-color:#8A8142; }
html.dark .info a, html.dark .success a, html.dark .error a, html.dark .noscripterror a, html.dark .warning a,
html.dark .info a:hover, html.dark .success a:hover, html.dark .error a:hover, html.dark .noscripterror a:hover, html.dark .warning a:hover { color:var(--d-text); }
html.dark .fieldNotice { color:#E49A9A; }

html.dark .gallery .img { border-color:var(--d-accent); }
html.dark #news .post { border-bottom-color:var(--d-accent); }
html.dark #news .post .date { color:var(--d-muted); }
html.dark #news .post .entry { border-top-color:#3A3A3A; }
html.dark #news .post .title { color:var(--d-link); }
html.dark .uploadMissing { border-color:#777; color:#999; }
html.dark table[border], html.dark td, html.dark th { border-color:var(--d-accent); }

/* settings page */
html.dark .st-card, html.dark .st-panel { background:#262A33 url(../img/bg-dark.png); border-color:var(--d-accent); }
html.dark .st-name, html.dark .st-stats b, html.dark .st-link, html.dark .st-pw button { color:var(--d-link); }
html.dark .st-mail, html.dark .st-stats span, html.dark .st-intro, html.dark .st-help, html.dark .st-dev small { color:var(--d-muted); }
html.dark .st-mail b { color:var(--d-text); }
html.dark .st-mail, html.dark .st-stats div, html.dark .st-nav a, html.dark .st-dev, html.dark .st-all { border-color:var(--d-line); }
html.dark .st-nav a:hover { background:#2F3750; }
html.dark .st-nav a.on { background:#2A4C9A; }
html.dark .st-err { color:#E49A9A; }
html.dark .st-in { background:var(--d-field); color:var(--d-text); border-color:var(--d-accent); }
html.dark .st-in.bad { background:#3A1E1E; border-color:#C44; }
html.dark .st-pw button { background:#2F3750; border-color:var(--d-accent); }
html.dark .st-bar i { background:var(--d-line); }
html.dark .st-bar i.on { background:#5B80D0; }
html.dark .st-btn.alt { background:transparent; color:var(--d-link); border-color:var(--d-accent); }
html.dark .st-btn.alt:hover { background:#2F3750; }
html.dark .st-btn.red { background:transparent; color:#E49A9A; border-color:#A04848; }
html.dark .st-btn.red:hover { background:#3A2424; }
html.dark .st-pending { color:#D6CB86; background:#2B2917; border-color:#8A8142; }
html.dark .st-state { background:#162A1E; color:#7CC592; border-color:#3C8A57; }
html.dark .st-state.bad { background:#3A1E1E; color:#E49A9A; border-color:#A04848; }
html.dark .st-tag { background:#162A1E; color:#7CC592; border-color:#3C8A57; }

/* theme toggle (templates/header.php, acp/templates/header.php) */
#themeToggle { float:right; box-sizing:border-box; height:22px; margin:1px 2px 0 4px; position:relative; top:-1px; padding:0 12px; border:1px solid #0D2E7F; background:#E6EAF5; color:#0E2F80; font:bold 12px/20px Arial; cursor:pointer; }
#themeToggle[hidden] { display:none; }
html.dark #themeToggle { background:#2F3750; color:var(--d-text); border-color:var(--d-accent); }

/* top panel (panel.css): same text color as everywhere else */
html.dark #panel, html.dark #panel h1, html.dark #panel h2, html.dark #panel a, html.dark #panel a:hover, html.dark .tab .login a, html.dark .tab .login li a:hover { color:var(--d-text); }
html.dark .footer, html.dark form #uploadField #button, html.dark .st-btn { color:var(--d-text); }