/* docs/stylesheets/theme.css: the site takes its colours from the banner.
 *
 * banner.svg draws parchment pages (#f3e6c8) on a dark brown plate (#2f2418)
 * with a gold seal (#e8b04a). The header uses the plate colour, the text on it
 * the parchment, and the accent is the seal's gold. zensical.toml sets primary
 * and accent to custom, so nothing is painted until these variables exist.
 */
:root {
  --md-primary-fg-color: #2f2418; /* banner plate, used as the header */
  --md-primary-fg-color--light: #3a2d1f;
  --md-primary-fg-color--dark: #1a130c;
  --md-primary-bg-color: #f3e6c8; /* parchment: text on the header, 12.2:1 */
  --md-primary-bg-color--light: #b89a64;

  --md-accent-fg-color: #e8b04a; /* the seal's gold */
  --md-accent-fg-color--transparent: #e8b04a1a;
}

/* Dark scheme: the page body uses the header colour too, so the header and
   the page read as one surface. The gold is 7.7:1 on #2f2418. */
[data-md-color-scheme="slate"] {
  --md-default-bg-color: #2f2418;
  --md-code-bg-color: #3a2d1f;
  --md-typeset-a-color: #e8b04a;
}

/* Light scheme: the gold is too faint on white; the banner's ink brown
   #7a4f1d is 7.1:1. */
[data-md-color-scheme="default"] {
  --md-typeset-a-color: #7a4f1d;
}

/* Fixed logo size so it does not crowd the site name. */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 1.6rem;
  width: 1.6rem;
}

/* Grid cards: the border picks up the accent on hover, matching the links. */
.md-typeset .grid.cards > ul > li {
  border-radius: 0.5rem;
}

.md-typeset .grid.cards > ul > li:focus-within,
.md-typeset .grid.cards > ul > li:hover {
  border-color: #e8b04a;
}

/* The home page keeps an H1 for search, screen readers and the browser tab.
   The banner under it already shows the name, so the H1 is hidden visually.
   Use it as: # gramps-web-toolkit { .gwt-visually-hidden } */
.md-typeset h1.gwt-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Flags and file names in tables must not wrap mid-word. */
.md-typeset table:not([class]) code {
  word-break: normal;
}