/* Clarity Migrate palette, lifted from src/assets/styles.css so the two sites
   match. Material exposes its colours as CSS variables, so matching the brand
   is this file and nothing else - no theme fork, no template overrides. */

:root {
  --clarity-primary: #850bc6;
  --clarity-primary-dark: #6a099e;
  --clarity-accent: #a855f7;
  --clarity-accent-light: #c084fc;
  --clarity-highlight: #06b6d4;
}

/* Light scheme */
[data-md-color-scheme="default"] {
  --md-primary-fg-color:        #850bc6;
  --md-primary-fg-color--light: #a855f7;
  --md-primary-fg-color--dark:  #4f0776;
  --md-accent-fg-color:         #a855f7;
  --md-typeset-a-color:         #850bc6;
}

/* Dark scheme, tuned to the product's own dark sidebar rather than Material's
   default slate, which is bluer than Clarity. */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:        #850bc6;
  --md-primary-fg-color--light: #a855f7;
  --md-primary-fg-color--dark:  #4f0776;
  --md-accent-fg-color:         #c084fc;
  --md-typeset-a-color:         #c084fc;
  --md-default-bg-color:        #0f1419;
  --md-default-bg-color--light: #161b22;
  --md-code-bg-color:           #161b22;
}

/* The product's sidebar is near-black with purple selection. */
[data-md-color-scheme="slate"] .md-sidebar {
  background-color: #0a0f14;
}
[data-md-color-scheme="slate"] .md-nav__link--active,
[data-md-color-scheme="slate"] .md-nav__link:focus,
[data-md-color-scheme="slate"] .md-nav__link:hover {
  color: #c084fc;
}

/* Admonition tints matched to the product's callout colours. */
.md-typeset .admonition.tip, .md-typeset details.tip { border-color: #06b6d4; }
.md-typeset .tip > .admonition-title, .md-typeset .tip > summary {
  background-color: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}
.md-typeset .admonition.warning, .md-typeset details.warning { border-color: #f59e0b; }
.md-typeset .warning > .admonition-title, .md-typeset .warning > summary {
  background-color: rgba(245, 158, 11, 0.1);
  border-color: #f59e0b;
}

/* The INTEGRATION-style badge, as an inline class rather than a div in every page. */
.badge {
  display: inline-block;
  padding: 0.2rem 0.6rem;
  border-radius: 0.25rem;
  background: rgba(133, 11, 198, 0.12);
  color: var(--clarity-accent);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Field names in tables, matching span.field-name on the current site. */
.md-typeset table code { color: var(--clarity-accent); }