/* Homileto theme: Midnight & Sky, with warm charcoal dark mode (Plus Jakarta Sans).
   Every color and font in the app comes from these tokens.
   Light is the default; dark applies when chosen in the app, or when the device is in dark mode and "System" is selected. */

@font-face { font-family: "Plus Jakarta Sans"; src: url("/fonts/jakarta.woff?v=2.3.1") format("woff"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Plus Jakarta Sans"; src: url("/fonts/jakarta-italic.woff?v=2.3.1") format("woff"); font-weight: 100 900; font-style: italic; font-display: swap; }

:root {
  --font-ui: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-read: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --hl: #fde68a;
  --r: 12px;
}

/* Light */
:root, :root[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f7fb; --paper: #ffffff; --ink: #0f172a; --muted: #64748b;
  --line: #dfe5ee; --hover: #edf2f8; --accent: #0284c7; --accent-ink: #ffffff;
  --danger: #dc2626; --shadow: 0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);
  --c-scripture: #0284c7; --c-point: #4f46e5; --c-subpoint: #818cf8;
  --c-illustration: #db2777; --c-application: #16a34a; --c-text: #94a3b8;
}

/* Dark: chosen explicitly… */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #262624; --paper: #30302e; --ink: #f5f4ef; --muted: #a6a39a;
  --line: #3e3e3a; --hover: #393935; --accent: #38bdf8; --accent-ink: #0b1a24;
  --danger: #f87171; --shadow: 0 1px 2px rgba(0,0,0,.45);
  --c-scripture: #38bdf8; --c-point: #818cf8; --c-subpoint: #a5b4fc;
  --c-illustration: #f472b6; --c-application: #4ade80; --c-text: #8a877f;
}
/* …or following the device when set to System */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  color-scheme: dark;
  --bg: #262624; --paper: #30302e; --ink: #f5f4ef; --muted: #a6a39a;
  --line: #3e3e3a; --hover: #393935; --accent: #38bdf8; --accent-ink: #0b1a24;
  --danger: #f87171; --shadow: 0 1px 2px rgba(0,0,0,.45);
  --c-scripture: #38bdf8; --c-point: #818cf8; --c-subpoint: #a5b4fc;
  --c-illustration: #f472b6; --c-application: #4ade80; --c-text: #8a877f;
  }
}

/* Podium Mode has its own Dark / Light switch */
.preach {
  color-scheme: dark;
  --bg: #262624; --paper: #30302e; --ink: #f5f4ef; --muted: #a6a39a;
  --line: #3e3e3a; --hover: #393935; --accent: #38bdf8; --accent-ink: #0b1a24;
  --danger: #f87171; --shadow: 0 1px 2px rgba(0,0,0,.45);
  --c-scripture: #38bdf8; --c-point: #818cf8; --c-subpoint: #a5b4fc;
  --c-illustration: #f472b6; --c-application: #4ade80; --c-text: #8a877f;
}
.preach.theme-light {
  color-scheme: light;
  --bg: #f4f7fb; --paper: #ffffff; --ink: #0f172a; --muted: #64748b;
  --line: #dfe5ee; --hover: #edf2f8; --accent: #0284c7; --accent-ink: #ffffff;
  --danger: #dc2626; --shadow: 0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);
  --c-scripture: #0284c7; --c-point: #4f46e5; --c-subpoint: #818cf8;
  --c-illustration: #db2777; --c-application: #16a34a; --c-text: #94a3b8;
}

/* Printing always uses the light colors */
@media print {
  :root, :root[data-theme], .preach, .preach.theme-light {
  color-scheme: light;
  --bg: #f4f7fb; --paper: #ffffff; --ink: #0f172a; --muted: #64748b;
  --line: #dfe5ee; --hover: #edf2f8; --accent: #0284c7; --accent-ink: #ffffff;
  --danger: #dc2626; --shadow: 0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);
  --c-scripture: #0284c7; --c-point: #4f46e5; --c-subpoint: #818cf8;
  --c-illustration: #db2777; --c-application: #16a34a; --c-text: #94a3b8;
  }
}