/*
 * theme.css — everything about the site that is this church's rather than the book's.
 *
 * WHY IT IS ITS OWN FILE: book.css is the book — pages, tabs, turning, layout —
 * and reads every colour, face and mark from the custom properties below. A
 * church's theme is its own 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. They name a ROLE (accent, action),
 * never a colour, so a value can change without a name starting to lie.
 *
 * LOADED BY: index.html, before book.css.
 */

:root {
  /* --- the palette: brick red, the colour of the plains' red dirt ------------
     Measured against the paper (#fbf9f3): --accent 7.3:1 and --accent-deep
     10.8:1, both past WCAG AA for body text. The light and pale values are for
     rules and tab faces only, never for words. */
  --accent:       #9a2b22;   /* the church's colour at full strength */
  --accent-deep:  #6e1d17;   /* darker: tab labels, headings, links */
  --accent-light: #d8a39a;   /* soft: rules, tab faces */
  --accent-mid:   #bd7368;
  --accent-pale:  #f3e1dc;

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

  /* --- a primary action button ---------------------------------------------
     One gradient shared by the header's Give and the Help assistant's Send;
     named for the job, because changing one should change both. White text on
     the lighter end measures 5.2:1. */
  --action-from:  #c0412f;
  --action-to:    #9a2b22;
  --action-focus: #5c1611;

  /* --- 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 --------------------------
     The church's red turned into bookcloth: hue 5, at the saturation and
     lightness a cloth board reads as — 45% / 23% for the face, 50% / 13% for the
     shaded edge.
     ⛔ Change these by moving the HUE and leaving S and L alone; S and L are
     what makes cloth look like cloth rather than like paint. */
  --cover-cloth:       #552520;
  --cover-cloth-deep:  #321311;
  --gilt:              #c9b26b;
  --gilt-bright:       #ead9a0;

  /* --- theme.mark: the church's mark, gilt on the covers -------------------
     A mask, not a picture: the covers paint whatever is opaque here in gilt.
     ⛔ ONLY THE ALPHA IS USED, so this must be the one-colour version of the
     mark, with its details cut out as holes — the full-colour logo would
     render as a solid gold blob. */
  --theme-mark: url('/images/logo-mark.svg');

  /* --- theme.link.icon: the mark that grows in front of a link on hover ----
     A seedling — a stem and its first two leaves. 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 d='M11.2 23.2V11.6h1.6v11.6z M12 13.2C7.9 13.4 3.6 10.7 3 4.6c5 .1 8.6 3.2 9 8.6z M12 11.6c.1-5.1 3.6-9.4 9.4-9.8.1 6-4.1 9.7-9.4 9.8z'/%3E%3C/svg%3E");
}