:root {
  --bs-body-font-family: "Inter", system-ui, sans-serif;
  --bs-primary-base: #8a6d00;
  --bs-primary-bg: #ffd60a;
  --bs-primary-contrast: #1a1500;
  --bs-primary-fg: light-dark(#8a6d00, #ffd60a);
  --bs-primary-fg-emphasis: light-dark(#5c4a00, #fff3b0);
  --bs-primary-bg-subtle: light-dark(#fff7cc, #3d3200);
  --bs-primary-bg-muted: light-dark(#ffe97a, #6b5900);
  --bs-primary-border: light-dark(#e6b800, #8a6d00);
  --bs-primary-focus-ring: light-dark(
    color-mix(in oklch, #ffd60a 50%, var(--bs-bg-body)),
    color-mix(in oklch, #ffd60a 75%, var(--bs-bg-body))
  );

  /* Keep three chromatic families: gold primary, green success, red danger. */
  --bs-accent-base: var(--bs-primary-base);
  --bs-accent-bg: var(--bs-primary-bg);
  --bs-accent-contrast: var(--bs-primary-contrast);
  --bs-accent-fg: var(--bs-primary-fg);
  --bs-accent-fg-emphasis: var(--bs-primary-fg-emphasis);
  --bs-accent-bg-subtle: var(--bs-primary-bg-subtle);
  --bs-accent-bg-muted: var(--bs-primary-bg-muted);
  --bs-accent-border: var(--bs-primary-border);
  --bs-accent-focus-ring: var(--bs-primary-focus-ring);

  --bs-warning-base: var(--bs-primary-base);
  --bs-warning-bg: var(--bs-primary-bg);
  --bs-warning-contrast: var(--bs-primary-contrast);
  --bs-warning-fg: var(--bs-primary-fg);
  --bs-warning-fg-emphasis: var(--bs-primary-fg-emphasis);
  --bs-warning-bg-subtle: var(--bs-primary-bg-subtle);
  --bs-warning-bg-muted: var(--bs-primary-bg-muted);
  --bs-warning-border: var(--bs-primary-border);
  --bs-warning-focus-ring: var(--bs-primary-focus-ring);

  --bs-info-base: var(--bs-secondary-base);
  --bs-info-bg: var(--bs-secondary-bg);
  --bs-info-contrast: var(--bs-secondary-contrast);
  --bs-info-fg: var(--bs-secondary-fg);
  --bs-info-fg-emphasis: var(--bs-secondary-fg-emphasis);
  --bs-info-bg-subtle: var(--bs-secondary-bg-subtle);
  --bs-info-bg-muted: var(--bs-secondary-bg-muted);
  --bs-info-border: var(--bs-secondary-border);
  --bs-info-focus-ring: var(--bs-secondary-focus-ring);

  /* Darken success text so subtle green badges meet AA in light mode. */
  --bs-success-fg: light-dark(var(--bs-green-700), var(--bs-green-400));
}

/* B6's theme-* class fills the whole check/radio, so an unchecked box would be
   a solid blob too. Keep the unchecked state neutral so only the checked state
   carries the theme color — the behavior the B6 docs describe. */
.check:not(:checked, :disabled),
.radio:not(:checked, :disabled) {
  background-color: var(--bs-bg-body);
  border-color: var(--bs-border-color);
}

/* B6 only ships modern (width >= ...) media syntax; mirror the settings-page
   two-column split with classic min-width rules so it also holds wherever
   that syntax is not applied. */
@media (min-width: 768px) {
  .md\:col-7 {
    flex: none;
    width: 58.3333%;
  }

  .md\:col-5 {
    flex: none;
    width: 41.6667%;
  }
}