/* okapipy brand palette — sampled from the logo:
 *   --okapi-brown : the okapi body
 *   --okapi-cocoa : a slightly darker cocoa for hover/active states
 *   --okapi-blue  : the python (snake) body
 *   --okapi-gold  : the warm yellow underbelly accent
 */

:root {
  --okapi-brown: #5b3621;
  --okapi-cocoa: #41281a;
  --okapi-cream: #f6efe6;
  --okapi-blue:  #2a5a8a;
  --okapi-gold:  #d9a441;
}

/* Light scheme — cocoa primary, gold accent */
[data-md-color-scheme="default"] {
  --md-primary-fg-color:        var(--okapi-brown);
  --md-primary-fg-color--light: #7a4d31;
  --md-primary-fg-color--dark:  var(--okapi-cocoa);
  --md-accent-fg-color:         var(--okapi-gold);
  --md-accent-fg-color--transparent: rgba(217, 164, 65, 0.10);
}

/* Dark scheme — flip to a cream primary so the header / hero text reads
 * cleanly against the slate page. Foreground (text on primary surfaces
 * like the header and the primary button) is darkened to keep contrast. */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:        #f4eee7;
  --md-primary-fg-color--light: #fbf7f1;
  --md-primary-fg-color--dark:  #d9cfc1;
  --md-primary-bg-color:        var(--okapi-cocoa);
  --md-primary-bg-color--light: rgba(65, 40, 26, 0.7);
  --md-accent-fg-color:         var(--okapi-gold);
  --md-accent-fg-color--transparent: rgba(217, 164, 65, 0.15);
}

/* Hero block on the homepage */
.okapi-hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 2rem 1rem 1rem;
}

.okapi-hero img {
  width: 180px;
  height: auto;
  margin-bottom: 1rem;
}

.okapi-hero h1 {
  margin: 0;
  font-weight: 700;
  font-size: 2.4rem;
  color: var(--md-primary-fg-color);
}

.okapi-hero .okapi-tagline {
  margin: 0.25rem 0 1rem;
  font-size: 1.05rem;
  color: var(--md-default-fg-color--light);
  max-width: 36rem;
}

/* Badges row: keep each shield at its intrinsic SVG width and prevent
 * the surrounding markdown <p> wrapper from forcing them onto separate
 * lines or stretching them across the row. */
.okapi-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.45rem;
  margin: 0.6rem 0 0.2rem;
  padding: 0;
  line-height: 1;
}

.okapi-badges a {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

.okapi-badges img {
  height: 22px;
  width: auto;
  display: block;
  max-width: none;
}

/* Pill-style call-to-action buttons under the hero */
.okapi-cta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
  margin: 1.2rem 0 0.4rem;
}

.okapi-cta a.md-button--primary {
  background-color: var(--md-primary-fg-color);
  border-color: var(--md-primary-fg-color);
  color: var(--md-primary-bg-color);
}

.okapi-cta a.md-button--primary:hover {
  background-color: var(--md-accent-fg-color);
  border-color: var(--md-accent-fg-color);
  color: var(--okapi-cocoa);
}

/* Slightly nicer admonition tint for the cocoa palette */
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: var(--okapi-blue);
}

/* mkdocstrings: tighten the auto-generated API headings a touch */
.md-typeset h2.doc-heading,
.md-typeset h3.doc-heading {
  font-weight: 600;
}