/* Clubhouse palette — matches src/theme/colors.ts in the app.
   Material "custom" primary/accent pull from these CSS variables. */

:root {
  --md-primary-fg-color:              #8B2323; /* Brick Red */
  --md-primary-fg-color--light:       #A94442;
  --md-primary-fg-color--dark:        #6E1B1B;
  --md-primary-bg-color:              #FDF5E6; /* Antique Cream on brick */
  --md-primary-bg-color--light:       #FDF5E6;

  --md-accent-fg-color:               #8C6010; /* deep amber-gold */
  --md-accent-fg-color--transparent:  rgba(140, 96, 16, 0.10);
}

[data-md-color-scheme="default"] {
  --md-typeset-a-color: #8B2323;
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #8B2323;
  --md-primary-bg-color: #FDF5E6;
  --md-typeset-a-color:  #D98C6A;
}

/* Header a touch warmer than pure brick */
.md-header,
.md-tabs {
  background-color: #7E2020;
}

/* Drop the bottom footer bar (copyright / "Made with" / social) — keep the
   prev/next nav above it, which lives in a separate element. */
.md-footer-meta {
  display: none;
}

/* Home hero — the brick-red shield mark */
.md-typeset img.hero-logo {
  display: block;
  margin: 0.25rem auto 1.75rem;
  width: 132px;
  height: auto;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.18));
}
[data-md-color-scheme="slate"] .md-typeset img.hero-logo {
  filter: brightness(1.4) saturate(1.05) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.4));
}

/* Screenshots: phone-shaped, centred, small so they don't dominate the column */
.md-typeset img.shot {
  display: block;
  margin: 1.3em auto;
  max-width: 232px;
  width: 100%;
  border-radius: 13px;
  border: 1px solid var(--md-default-fg-color--lightest);
  box-shadow: 0 5px 18px rgba(0, 0, 0, 0.14);
}
.md-typeset img.shot-wide {
  max-width: 520px;
}

/* Release history (hooks/releases.py) ------------------------------------- */

/* Platform label in front of a release-note line. Brick and amber come from
   the palette above; text on both fills is the cream used on the header. */
.md-typeset .rel-tag {
  display: inline-block;
  padding: 0 0.45em;
  border-radius: 0.3em;
  font-size: 0.72em;
  font-weight: 700;
  line-height: 1.6;
  vertical-align: 0.1em;
  color: #FDF5E6;
}
.md-typeset .rel-tag--ios {
  background-color: #8B2323;
}
.md-typeset .rel-tag--android {
  background-color: #6B4A0C;
}

/* Category label ("Nieuw", "Opgelost", …) — a label, not a heading, so the
   table of contents keeps one entry per version. */
.md-typeset p.rel-cat {
  margin: 1.2em 0 0.3em;
  font-size: 0.8em;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--light);
}
.md-typeset p.rel-meta {
  margin-top: -0.6em;
  font-size: 0.85em;
  color: var(--md-default-fg-color--light);
}