/* The wiki in the game's colours: brown wooden chrome, parchment pages, orange accents
   (frontend/src/ui/styles.css), with Cinzel headings over Alegreya text. */
@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@500;700;900&display=swap");

:root,
[data-md-color-scheme="default"] {
  --akan-ink: #3b2a1a;
  --akan-ink-dim: #6e5538;
  --akan-parch: #fbf3df;
  --akan-parch-2: #f3e5c4;
  --akan-tan: #d9bf8c;
  --akan-wood: #5e3c22;
  --akan-wood-d: #2a1608;
  --akan-orange: #f08a1c;
  --akan-rust: #c0601a;

  --md-primary-fg-color: #6b4528;
  --md-primary-fg-color--light: #8a5a32;
  --md-primary-fg-color--dark: #4e3019;
  --md-primary-bg-color: #fff3d4;
  --md-primary-bg-color--light: #f0d9a8;
  --md-accent-fg-color: var(--akan-orange);
  --md-accent-fg-color--transparent: rgba(240, 138, 28, 0.12);

  --md-default-bg-color: var(--akan-parch);
  --md-default-fg-color: var(--akan-ink);
  --md-default-fg-color--light: var(--akan-ink-dim);
  --md-typeset-color: var(--akan-ink);
  --md-typeset-a-color: var(--akan-rust);
  --md-code-bg-color: var(--akan-parch-2);
  --md-code-fg-color: var(--akan-ink);
  --md-footer-bg-color: var(--akan-wood-d);
  --md-footer-bg-color--dark: #1d0f05;
  --md-typeset-table-color: rgba(94, 60, 34, 0.25);
}

[data-md-color-scheme="slate"] {
  --md-hue: 28;
  --md-primary-fg-color: #4e3019;
  --md-primary-fg-color--light: #6b4528;
  --md-primary-fg-color--dark: #2a1608;
  --md-primary-bg-color: #fff3d4;
  --md-accent-fg-color: #ffc05a;
  --md-accent-fg-color--transparent: rgba(255, 192, 90, 0.12);
  --md-default-bg-color: #21150c;
  --md-typeset-a-color: #ffb057;
  --md-code-bg-color: #2e1f13;
  --md-footer-bg-color: #160c05;
  --md-footer-bg-color--dark: #0e0703;
}

/* Alegreya when Google Fonts loads, otherwise a serif like the game's, rather than Material's sans. */
body {
  --md-text-font-family: var(--md-text-font, _), Georgia, "Times New Roman", serif;
}

/* Room for the wide level tables. */
.md-grid {
  max-width: 76rem;
}

.md-header,
.md-tabs {
  background: linear-gradient(180deg, #8a5a32, #5a3820);
}

.md-header {
  border-bottom: 3px solid #e9b064;
  box-shadow: 0 3px 0 #2a1608;
}

.md-header__title,
.md-tabs__link,
.md-nav__title,
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4 {
  font-family: "Cinzel", Georgia, "Times New Roman", serif;
  letter-spacing: 0.02em;
}

.md-header__button.md-logo img {
  height: 2rem;
}

.md-typeset h1 {
  font-weight: 900;
  color: var(--md-typeset-a-color);
}

.md-typeset h2 {
  font-weight: 700;
  border-bottom: 2px solid var(--md-typeset-table-color);
  padding-bottom: 0.2em;
}

.md-typeset h3 {
  font-weight: 700;
}

.md-typeset {
  font-size: 0.85rem;
}

/* Game icons inline with text and in tables. */
.md-typeset img.akan-icon {
  height: 1.6em;
  width: 1.6em;
  vertical-align: middle;
  object-fit: contain;
  margin-right: 0.15em;
}

.md-typeset h3 + p > img.akan-icon:first-child {
  height: 2.6em;
  width: 2.6em;
  margin-right: 0.4em;
}

.md-typeset table:not([class]) {
  font-size: 0.72rem;
}

.md-typeset table:not([class]) th,
.md-typeset table:not([class]) td {
  padding: 0.45em 0.75em;
}

/* Collapsible level tables in wood and orange instead of Material's cyan. */
.md-typeset details.abstract {
  border-color: var(--md-accent-fg-color);
}

.md-typeset details.abstract > summary {
  background-color: var(--md-accent-fg-color--transparent);
}

.md-typeset details.abstract > summary::before,
.md-typeset details.abstract > summary::after {
  background-color: var(--md-accent-fg-color);
}

.md-typeset table:not([class]) th {
  background: var(--md-primary-fg-color);
  color: var(--md-primary-bg-color);
  font-family: "Cinzel", Georgia, serif;
  font-weight: 700;
}

.md-typeset kbd {
  font-family: "Cinzel", Georgia, serif;
  font-weight: 700;
}

/* A row of screenshots on the home page (Markdown wraps them in one paragraph). */
.akan-shots > p {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: 0.8rem;
}

.akan-shots img {
  width: 100%;
  border: 3px solid #2a1608;
  border-radius: 10px;
  box-shadow: 0 4px 0 rgba(42, 22, 8, 0.35);
}

/* Cards linking to each part of the wiki on the home page. */
.akan-cards > p {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: 0.8rem;
  margin: 1em 0;
}

.akan-cards a {
  display: block;
  padding: 0.7rem 0.9rem;
  border: 2px solid var(--md-typeset-table-color);
  border-left: 5px solid var(--md-accent-fg-color);
  border-radius: 10px;
  background: var(--md-code-bg-color);
  color: var(--md-default-fg-color);
}

.akan-cards a:hover {
  border-color: var(--md-accent-fg-color);
}

.akan-cards strong {
  display: block;
  font-family: "Cinzel", Georgia, serif;
  color: var(--md-typeset-a-color);
}