/* Stoplight Elements with the burodecredito.com.mx tokens from /theme.css. */
#app elements-api {
  display: block;
  height: calc(100vh - var(--bdc-header-height));
}

.sl-elements {
  --font-ui: 'Open Sans', system-ui, sans-serif;
  --font-prose: 'Open Sans', system-ui, sans-serif;
  --color-primary: var(--bdc-blue);
  --color-primary-dark: var(--bdc-navy);
  --color-primary-darker: var(--bdc-navy);
  --color-primary-light: var(--bdc-tint);
  --color-primary-tint: var(--bdc-tint);
  --color-danger: var(--bdc-red);
}

/* Pill CTA like the site: bold white on --blue-1, hover --blue-8. */
.sl-elements button.sl-bg-primary,
.sl-elements .sl-button.sl-bg-primary {
  border-radius: 105px !important;
  background: var(--bdc-blue) !important;
  color: #fff !important;
  font-weight: 700 !important;
  padding-inline: 18px !important;
}

.sl-elements button.sl-bg-primary:hover {
  background: var(--bdc-blue-hover) !important;
}

/* Active sidebar item: navy text on the light-blue tint, as on the lender pages. */
.sl-elements .ElementsTableOfContentsItem .sl-bg-primary-tint,
.sl-elements [class*='sl-bg-primary-tint'] {
  background: var(--bdc-tint) !important;
  color: var(--bdc-navy) !important;
}

.sl-elements h1,
.sl-elements h2 {
  font-weight: 700;
  color: var(--bdc-text);
}

.sl-elements .sl-text-danger,
.sl-elements [class*='sl-text-warning'] {
  color: var(--bdc-red) !important;
}
