/*
 * theme.css — everything about the site that is Oak Park's rather than the book's.
 *
 * WHY IT IS ITS OWN FILE: a second church may one day wear this same book.
 * book.css is the book — pages, tabs, turning, layout — and reads every colour,
 * face and mark from the custom properties below. A new church's theme is a new
 * copy of this file; book.css does not change.
 *
 * THE NAMES ARE THE CONTRACT. book.css uses them by name, so a theme may change
 * any value here but must keep every name. The palette keeps its descriptive
 * names (olive, sage, paper, ink) for now; a second theme is the moment to
 * decide whether they become role names.
 *
 * LOADED BY: index.html, before book.css.
 */

:root {
  /* --- the palette, off the church's 2024 stylesheet -------------------- */
  --olive:      #808000;
  --olive-deep: #5c5c00;
  --sage:       #b5c583;
  --sage-deep:  #9db06a;
  --sage-pale:  #e8edd8;

  --paper:      #fbf9f3;
  --paper-deep: #f2eee2;
  --paper-edge: #e3dfd0;
  --ink:        #2f2f2a;
  --ink-soft:   #5f5f55;
  --desk:       #e9e6dc;

  /* --- type --------------------------------------------------------------- */
  --font-ui:   'Roboto', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-body: Georgia, 'Iowan Old Style', 'Palatino Linotype', 'Book Antiqua', 'Times New Roman', serif;
  --font-cover: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-hand:  'Kalam', 'Segoe Print', 'Bradley Hand', cursive;   /* handwritten, unjoined letters */

  /* --- the binding: cloth boards and gilt tooling ------------------------- */
  --cover-cloth:       #4a5420;
  --cover-cloth-deep:  #2c3311;
  --gilt:              #c9b26b;
  --gilt-bright:       #ead9a0;

  /* --- theme.mark: the church's mark, gilt on the covers -------------------
     Oak Park's tree-in-a-ring, cut from the church logo with the paper made
     transparent. A mask like the link icon: the covers paint it
     gilt, and the lighter leaves keep a little transparency, so it still reads
     as two tones in one colour. */
  --theme-mark: url('/images/logo-mark.png');

  /* --- theme.link.icon: the mark that grows in front of a link on hover ----
     An oak leaf, for Oak Park: deep sinuses, lobes reaching up and
     out, widest near the tip, the midrib cut through. Redrawn the same day
     when the bench's first leaf read as a fir. A mask, not a picture: book.css
     paints it in the link's own colour, so any single-colour SVG works. */
  --theme-link-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 1C13.8 0.8 15.6 3 12.9 4.6C16.8 3.4 19.2 7.4 13.2 8.6C17.6 7.8 19.4 11.9 13.3 12.6C16.8 12.3 17.6 15.8 12.9 16.4C14.4 16.6 13.6 18.6 12.4 19L12.4 22.8L11.6 22.8L11.6 19C10.4 18.6 9.6 16.6 11.1 16.4C6.4 15.8 7.2 12.3 10.7 12.6C4.6 11.9 6.4 7.8 10.8 8.6C4.8 7.4 7.2 3.4 11.1 4.6C8.4 3 10.2 0.8 12 1Z M11.8 2.6L12.2 2.6L12.2 19L11.8 19Z'/%3E%3C/svg%3E");
}