/* hoome.ai help site — brand palette (kalk)
   kalkwit #FAF8F4 · roet #1C1A19 · steen #D8D2C8 · terracotta #C8643B · font Inter */

[data-md-color-scheme="hoome"] {
  --hoome-kalkwit: #FAF8F4;
  --hoome-roet: #1C1A19;
  --hoome-steen: #D8D2C8;
  --hoome-terracotta: #C8643B;
  --hoome-zand: #EFEAE2;

  --md-default-bg-color: var(--hoome-kalkwit);
  --md-default-fg-color: var(--hoome-roet);
  --md-default-fg-color--light: #4a4541;
  --md-default-fg-color--lighter: #8a827a;
  --md-default-fg-color--lightest: #e9e4dc;

  --md-primary-fg-color: var(--hoome-zand);
  --md-primary-fg-color--light: var(--hoome-zand);
  --md-primary-fg-color--dark: var(--hoome-steen);
  --md-primary-bg-color: var(--hoome-roet);
  --md-primary-bg-color--light: #4a4541;

  --md-accent-fg-color: var(--hoome-terracotta);
  --md-accent-fg-color--transparent: rgba(200, 100, 59, 0.1);
  --md-accent-bg-color: #fff;

  --md-typeset-a-color: #a84f2c;
  --md-code-bg-color: #f1ede6;
  --md-code-fg-color: var(--hoome-roet);
  --md-footer-bg-color: var(--hoome-roet);
  --md-footer-bg-color--dark: #121010;
  --md-footer-fg-color: var(--hoome-kalkwit);
  --md-footer-fg-color--light: var(--hoome-steen);
  --md-footer-fg-color--lighter: #a39a90;

  --md-admonition-fg-color: var(--hoome-roet);
  --md-typeset-table-color: rgba(28, 26, 25, 0.12);
}

.md-header { box-shadow: 0 1px 0 var(--hoome-steen); }
.md-tabs { border-bottom: 1px solid var(--hoome-steen); }
.md-header__button.md-logo img { height: 1.8rem; width: auto; }
.md-search__form { background-color: #fff; border: 1px solid var(--hoome-steen); }
.md-search__input::placeholder { color: #6b645d; }
.md-search__input { color: var(--hoome-roet); }
.md-search__icon { color: #6b645d; }

.md-typeset h1 { font-weight: 700; letter-spacing: -0.01em; }
.md-typeset h2 { font-weight: 650; }
.md-typeset img.screenshot,
.md-typeset figure.screenshot img {
  border: 1px solid var(--hoome-steen);
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(28, 26, 25, 0.08);
  background: #fff;
}
.md-typeset figure.screenshot { margin: 1.2em 0; }
.md-typeset figure.screenshot figcaption { font-size: 0.72rem; color: #6b645d; margin-top: 0.4em; }

/* UI element names are typeset as keys-style labels */
.md-typeset .ui {
  display: inline-block; padding: 0 0.35em; border: 1px solid var(--hoome-steen);
  border-radius: 6px; background: #fff; font-size: 0.85em; white-space: nowrap;
}

/* permission / role badge */
.md-typeset .perm {
  display: inline-block; padding: 0.1em 0.55em; border-radius: 999px;
  background: var(--hoome-zand); border: 1px solid var(--hoome-steen);
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.02em;
}
.md-typeset .perm.owner { background: #fbe7dd; border-color: #e9b9a3; }

/* admonition accent in terracotta for "stap"/"tip" */
.md-typeset .admonition.tip, .md-typeset details.tip { border-color: var(--hoome-terracotta); }
.md-typeset .tip > .admonition-title, .md-typeset .tip > summary {
  background-color: rgba(200, 100, 59, 0.1);
}
.md-typeset .tip > .admonition-title::before, .md-typeset .tip > summary::before {
  background-color: var(--hoome-terracotta);
}

/* role-journey step cards on hub pages */
.md-typeset .hub-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 0.8rem; margin: 1rem 0; }
.md-typeset .hub-card { border: 1px solid var(--hoome-steen); border-radius: 12px; padding: 0.9rem 1rem; background: #fff; }
.md-typeset .hub-card h3 { margin: 0 0 0.3rem 0; font-size: 0.95rem; }
.md-typeset .hub-card p { margin: 0 0 0.4rem 0; font-size: 0.8rem; color: #4a4541; }
.md-typeset .hub-card ul { margin: 0; font-size: 0.8rem; }
