/* ---------------------------------------------------------------------------
   Divine Love Messages Archive - Obsidian Publish styles

   Loaded automatically by Obsidian Publish from the vault root. Kept in the
   repository at .github/assets/publish.css and copied into the vault by
   generate_vault.py, so it survives the vault being rebuilt.

   The palette is built for long reading. Light mode is warm cream with a
   near-black that carries a little brown in it; dark mode is a warm charcoal
   rather than the usual blue-black, so switching between them does not feel
   like changing sites. Accents are a muted violet for links, a mid blue for
   hover and for the questions callout, and nothing else. Contrast is kept
   above the accessibility floor throughout, but stops short of pure black on
   pure white, which is what makes long passages tiring.
   --------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------
   1. Light palette
   --------------------------------------------------------------------------- */

body:not(.theme-dark) {
  /* Surfaces. Primary is the reading pane, secondary the sidebars, so the
     page still has a clear front surface rather than one flat field. */
  --background-primary: #f7f0e6;
  --background-primary-alt: #f1e9db;
  --background-secondary: #f1e9db;
  --background-secondary-alt: #e9decc;

  /* Text. Not black: #2e2a24 is a near-black with brown in it, which sits on
     cream without the harsh edge pure black produces. */
  --text-normal: #2e2a24;
  --text-muted: #6d6559;
  --text-faint: #9c9385;
  --text-title-h1: #2e2a24;
  --text-title-h2: #3a352d;

  /* Accents. Violet at rest, blue on hover: different enough in hue that the
     change registers, close enough in weight that it does not flash. */
  --link-color: #6d54a8;
  --link-external-color: #6d54a8;
  --link-unresolved-color: #a08f7a;
  --link-color-hover: #2e7fbe;
  --link-external-color-hover: #2e7fbe;
  --link-unresolved-color-hover: #2e7fbe;

  /* Structure. Cream's own darker relative rather than a grey laid over it. */
  --background-modifier-border: #ddd0ba;
  --background-modifier-border-hover: #cfc0a6;
  --hr-color: #ddd0ba;
  --blockquote-border-color: #cbb99b;

  /* Code and quiet panels, one step deeper than the page. */
  --code-background: #ece1cf;
  --code-normal: #5c4a2e;

  /* Selection and search highlight, warm rather than the default blue wash. */
  --text-selection: rgba(109, 84, 168, 0.18);
  --text-highlight-bg: rgba(214, 178, 96, 0.35);
}

/* ---------------------------------------------------------------------------
   2. Dark palette

   Warm charcoal, not blue-black, so the two modes feel like one site. Text
   is a soft parchment rather than white: full white on dark is as tiring as
   pure black on white, for the opposite reason.
   --------------------------------------------------------------------------- */

body.theme-dark {
  --background-primary: #191613;
  --background-primary-alt: #211d15;
  --background-secondary: #211d15;
  --background-secondary-alt: #2a251b;

  --text-normal: #e7dfd2;
  --text-muted: #a99f8f;
  --text-faint: #7a7264;
  --text-title-h1: #f0e8db;
  --text-title-h2: #e7dfd2;

  --link-color: #b39ae0;
  --link-external-color: #b39ae0;
  --link-unresolved-color: #857a66;
  --link-color-hover: #6fbcf0;
  --link-external-color-hover: #6fbcf0;
  --link-unresolved-color-hover: #6fbcf0;

  --background-modifier-border: #3b342a;
  --background-modifier-border-hover: #4a4235;
  --hr-color: #3b342a;
  --blockquote-border-color: #574c3b;

  --code-background: #2a251c;
  --code-normal: #d8c9a8;

  --text-selection: rgba(179, 154, 224, 0.22);
  --text-highlight-bg: rgba(214, 178, 96, 0.28);
}

/* ---------------------------------------------------------------------------
   3. "Questions this message answers" callout

   Obsidian colours callouts from a --callout-color variable holding an
   "R, G, B" triple, which drives the title, the icon and the tinted panel
   together. The question callout ships orange; this is the site's blue.
   --------------------------------------------------------------------------- */

body:not(.theme-dark) .callout[data-callout="question"] {
  --callout-color: 46, 127, 190;      /* #2e7fbe */
}

body.theme-dark .callout[data-callout="question"] {
  --callout-color: 111, 188, 240;     /* #6fbcf0 */
}

/* Full sentences rather than short list items, so a little more room. */
.callout[data-callout="question"] li {
  margin-block: 0.25em;
}

/* ---------------------------------------------------------------------------
   4. Chain hub member headings

   Each member on a chain page is an h3, "2016-05-02 - Message Title", which
   renders large enough to compete with the evidence beneath it. Chain hubs
   are the only generated pages using h3, so this is global in form but
   targeted in effect. Sized to the body text and kept semibold, so it still
   reads as a label; generous space above, closed up below, which attaches
   each heading to its own evidence.
   --------------------------------------------------------------------------- */

.markdown-preview-view h3,
.markdown-rendered h3 {
  font-size: var(--font-text-size, 1rem);
  line-height: var(--line-height-normal, 1.5);
  font-weight: 600;
  margin-block-start: 1.6em;
  margin-block-end: 0.25em;
}

/* Removing the blank line from the Markdown is not enough on its own: every
   paragraph carries a top margin, and adjacent margins collapse to whichever
   is larger, so both have to be small. */
.markdown-preview-view h3 + p,
.markdown-rendered h3 + p {
  margin-block-start: 0.2em;
}

/* ---------------------------------------------------------------------------
   5. Links
   --------------------------------------------------------------------------- */

/* A gentle underline on hover as well, so the cue is not colour alone.
   Readers who cannot easily distinguish violet from blue still get the
   signal. Delete this block for colour-only hover. */
.markdown-preview-view a:hover,
.markdown-rendered a:hover {
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

/* ---------------------------------------------------------------------------
   6. Graph view

   The graph is painted on a canvas, so its text cannot be styled, but
   Obsidian reads these variables when drawing it. Nodes take the link colour
   by reference rather than by copy, so the graph and the prose can never
   drift apart; the hex is only a fallback if the variable has not resolved
   when the canvas paints. Lines are faint so the nodes carry the eye.
   --------------------------------------------------------------------------- */

body:not(.theme-dark) {
  --graph-node: var(--link-color, #6d54a8);
  --graph-node-focused: #2e7fbe;
  --graph-node-unresolved: #c3b8a4;
  --graph-line: rgba(109, 84, 168, 0.22);

  /* Hover. --graph-node-fill-highlight is the body of the node, which is
     what turns blue when the cursor is on it; --graph-line-highlight is the
     connections leading to it, coloured to match so the whole neighbourhood
     lights up together rather than just the one dot. */
  --graph-node-fill-highlight: #2e7fbe;
  --graph-node-highlight: #2e7fbe;
  --graph-line-highlight: rgba(46, 127, 190, 0.55);
}

body.theme-dark {
  --graph-node: var(--link-color, #b39ae0);
  --graph-node-focused: #6fbcf0;
  --graph-node-unresolved: #4e463a;
  --graph-line: rgba(179, 154, 224, 0.26);

  --graph-node-fill-highlight: #6fbcf0;
  --graph-node-highlight: #6fbcf0;
  --graph-line-highlight: rgba(111, 188, 240, 0.55);
}