/*
 * Dark-mode overrides for Trix / Action Text.
 *
 * The generated actiontext.css hardcodes light colors (white dialogs, black
 * toolbar icons, light borders). These rules repaint the editor chrome using
 * Bootstrap's theme variables whenever the app is in dark mode. They key off
 * `data-bs-theme="dark"` — the same signal the rest of the app uses (see the
 * admin/pilot layouts) — so Trix stays in sync with the active theme rather
 * than following the OS via prefers-color-scheme, which this app does not use.
 *
 * Link this AFTER actiontext.css. The attribute selector also raises specificity
 * above the base rules, so these win regardless.
 */

/* Editing surface + toolbar borders */
[data-bs-theme="dark"] trix-editor {
  border-color: var(--bs-border-color);
  color: var(--bs-body-color);
}

[data-bs-theme="dark"] trix-toolbar .trix-button {
  border-bottom-color: var(--bs-border-color);
}

[data-bs-theme="dark"] trix-toolbar .trix-button:not(:first-child) {
  border-left-color: var(--bs-border-color);
}

/* Active button: the light-blue highlight + black text are illegible on dark */
[data-bs-theme="dark"] trix-toolbar .trix-button.trix-active {
  background: var(--bs-primary-bg-subtle);
  color: var(--bs-body-color);
}

/* Toolbar icons are black-fill SVG data-URIs; invert them to read as light */
[data-bs-theme="dark"] trix-toolbar .trix-button--icon::before {
  filter: invert(1);
}

/* Link dialog + its input */
[data-bs-theme="dark"] trix-toolbar .trix-dialog {
  background: var(--bs-body-bg);
  box-shadow: 0 0.3em 1em rgba(0, 0, 0, 0.6);
  border-top-color: var(--bs-border-color);
}

[data-bs-theme="dark"] trix-toolbar .trix-input--dialog {
  border-color: var(--bs-border-color);
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
}

/* Rendered content: quote rule + code block backgrounds */
[data-bs-theme="dark"] .trix-content blockquote {
  border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .trix-content pre {
  background: var(--bs-secondary-bg);
  color: var(--bs-body-color);
}