/* Dark theme for the public pages (load after styles.css). The admin back end keeps the light theme.
   Buttons keep their dark blue; text, panels, inputs and lines flip for a black background. */

:root {
  --bg: #000000;
  --surface: #0d0d0f;
  --surface-alt: #141417;
  --text: #ecebe6;
  --muted: rgba(236, 235, 230, 0.66);
  --accent: #8cb8ea;            /* links and accent text: light blue so they read on black */
  --border: rgba(255, 255, 255, 0.14);
  --shadow: 0 20px 48px rgba(0, 0, 0, 0.55);
  --panel: #0e0e10;             /* cards, dialogs */
  --field: #141417;             /* inputs */
  --field-border: rgba(255, 255, 255, 0.16);
  color-scheme: dark;
}

html,
body {
  background: #000000 !important;
  color: var(--text);
}

h1, h2, h3, h4, h5, h6,
.site-footer h2 {
  color: var(--text);
}

.logo,
.logo-empty {
  border-color: rgba(255, 255, 255, 0.3);
  background: transparent;
}

.main-nav a {
  color: rgba(236, 235, 230, 0.86);
}
.main-nav a:hover {
  color: #ffffff;
}

.activity-link {
  color: #ffffff;
}

/* Panels and cards */
.dialog-shell,
.contribute-card,
.pool-item,
.process-step,
.card,
.entry-panel,
.cta-row {
  background: var(--panel);
  border-color: var(--border);
  box-shadow: none;
  color: var(--text);
}

/* Form fields */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select,
textarea,
.dialog-shell input,
.dialog-shell textarea,
.entry-panel textarea,
.search-bar input,
.reply-container textarea,
.feedback-form input,
.feedback-form textarea {
  background-color: var(--field);   /* colour only, so search icons in background-image stay */
  border-color: var(--field-border);
  color: var(--text);
}
input::placeholder,
textarea::placeholder,
.search-bar input::placeholder,
.reply-container textarea::placeholder,
.dialog-shell input::placeholder,
.dialog-shell textarea::placeholder {
  color: rgba(236, 235, 230, 0.4);
}
input:focus,
select:focus,
textarea:focus {
  border-color: rgba(140, 184, 234, 0.6);
  box-shadow: 0 0 0 3px rgba(140, 184, 234, 0.15);
  outline: none;
}
label {
  color: var(--text);
}

.error {
  color: #ff8a7a;
}
.success {
  color: #7fd59b;
}

.site-footer {
  border-top-color: rgba(255, 255, 255, 0.1);
}

/* ---- Page components ---- */

/* Cards and list items (activities, pool, my messages, research, seminar notes) */
.activity-card,
.public-post,
.my-message-item,
.research-item,
.note-item,
.modal-box {
  background: var(--panel);
  border-color: var(--border);
  box-shadow: none;
  color: var(--text);
}
.public-post .echo-box,
.echo-box,
.already-replied {
  background: var(--surface-alt);
  border-color: var(--border);
  color: var(--text);
}
.history-round {
  border-bottom-color: var(--border);
}
.activity-cover,
.detail-cover {
  background: linear-gradient(135deg, #12202e, #0d1824);
}
.modal-overlay {
  background: rgba(0, 0, 0, 0.7);
}
/* Every text button on the user side: dark blue with white text (outline / red / light-blue variants included) */
.answer-btn,
.reply-container .action-btn,
.reply-container .action-btn.secondary,
.modal-btn,
.modal-cancel,
.modal-confirm,
.visibility-btn,
.visibility-btn.is-public,
.confirm-in-btn,
.rp-send {
  background: #17406d;
  color: #ffffff !important;
  border: 1px solid #17406d;
}
.answer-btn:hover,
.reply-container .action-btn:hover,
.reply-container .action-btn.secondary:hover,
.modal-btn:hover,
.modal-cancel:hover,
.modal-confirm:hover,
.visibility-btn:hover,
.visibility-btn.is-public:hover,
.confirm-in-btn:hover,
.rp-send:hover {
  background: #0f2d4d;
  border-color: #0f2d4d;
  box-shadow: 0 6px 16px rgba(23, 64, 109, 0.35);
}

/* Small light badges / notes become dark-tinted versions */
.sticky-note,
.reply-container .toast-message {
  background: rgba(46, 125, 50, 0.16);
  border-color: rgba(127, 213, 155, 0.35);
  color: var(--text);
}
.reply-container .toast-message .toast-text {
  color: #a8e6b8;
}
.seal-sticker {
  background: transparent;
}
.seal-green {
  color: #7fd59b;
  border-color: #7fd59b;
}
.seal-blue {
  color: #7cc0ff;
  border-color: #7cc0ff;
}
.seal-red {
  color: #ff8a7a;
  border-color: #ff8a7a;
}
.like-btn {
  background: transparent;
  border-color: var(--border);
}
.like-btn svg {
  stroke: rgba(236, 235, 230, 0.6);
}
.like-btn.liked {
  background: rgba(255, 152, 0, 0.14);
}

/* Reply threads (pool-replies.css) */
.rp-stats,
.rp-item {
  border-color: var(--border);
}
.rp-quoting {
  background: rgba(255, 255, 255, 0.05);
}
.rp-quote {
  border-left-color: var(--border);
}
.rp-author {
  background: #17406d;
}
.rp-error {
  color: #ff8a7a;
}

/* Search dropdown (search-dropdown.js) */
.sd-menu {
  background: #0d0d0d;
  border-color: rgba(255, 255, 255, 0.22);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.5);
}
.sd-count {
  color: rgba(255, 255, 255, 0.6);
}
.sd-item {
  border-top-color: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.85);
}
.sd-item:hover,
.sd-item:focus-visible {
  background: rgba(255, 255, 255, 0.08);
}
.sd-type {
  color: #8cb8ea;
}
.sd-title {
  color: #ffffff;
}
.sd-snippet {
  color: rgba(255, 255, 255, 0.65);
}
.sd-item mark {
  background: rgba(140, 184, 234, 0.32);
  color: #ffffff;
}
@keyframes sd-flash {
  0%, 35% { box-shadow: 0 0 0 3px rgba(140, 184, 234, 0.7); }
  100% { box-shadow: 0 0 0 3px rgba(140, 184, 234, 0); }
}

/* Text links that were black or dark blue */
.back-link,
.msg-toggle,
.echo-toggle,
.text-toggle {
  color: #ffffff;
}
.research-item-link,
.note-name:focus-visible {
  color: var(--accent);
}