:root {
  color-scheme: light;
  --bc-accent: #00704a;
  --bc-accent-dark: #12a36f;
  --bc-accent-container: rgba(0, 112, 74, 0.18);
  --bc-on-accent: #ffffff;
  --bc-error: #ff2d38;
  --bc-surface: #f9f9f9;
  --bc-surface-lowest: #ffffff;
  --bc-surface-low: #f3f3f3;
  --bc-surface-container: #eeeeee;
  --bc-surface-high: #e8e8e8;
  --bc-surface-highest: #e2e2e2;
  --bc-dark-surface-lowest: #0e0e0e;
  --bc-dark-surface: #131313;
  --bc-dark-surface-high: #2a2a2a;
  --bc-on-surface: #1b1b1b;
  --bc-on-surface-variant: #474747;
  --bc-on-dark-surface: #e2e2e2;
  --bc-on-dark-muted: #c6c6c6;
  --bc-outline: #777777;
  --bc-outline-variant: #c6c6c6;
  --bc-outline-soft: rgba(0, 0, 0, 0.08);
  --bc-shadow: rgba(0, 0, 0, 0.22);

  --md-ref-typeface-brand: "SF Pro Text", Inter, ui-sans-serif, system-ui,
    -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --md-ref-typeface-plain: "SF Pro Text", Inter, ui-sans-serif, system-ui,
    -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --md-sys-color-primary: var(--bc-accent);
  --md-sys-color-on-primary: var(--bc-on-accent);
  --md-sys-color-primary-container: var(--bc-accent-container);
  --md-sys-color-on-primary-container: var(--bc-on-surface);
  --md-sys-color-secondary: var(--bc-on-surface);
  --md-sys-color-on-secondary: var(--bc-surface-lowest);
  --md-sys-color-secondary-container: var(--bc-surface-container);
  --md-sys-color-on-secondary-container: var(--bc-on-surface);
  --md-sys-color-tertiary: var(--bc-accent);
  --md-sys-color-on-tertiary: var(--bc-on-accent);
  --md-sys-color-tertiary-container: var(--bc-accent-container);
  --md-sys-color-on-tertiary-container: var(--bc-on-surface);
  --md-sys-color-error: var(--bc-error);
  --md-sys-color-on-error: #ffffff;
  --md-sys-color-surface: var(--bc-surface);
  --md-sys-color-on-surface: var(--bc-on-surface);
  --md-sys-color-surface-variant: var(--bc-surface-container);
  --md-sys-color-on-surface-variant: var(--bc-on-surface-variant);
  --md-sys-color-surface-container-lowest: var(--bc-surface-lowest);
  --md-sys-color-surface-container-low: var(--bc-surface-low);
  --md-sys-color-surface-container: var(--bc-surface-container);
  --md-sys-color-surface-container-high: var(--bc-surface-high);
  --md-sys-color-surface-container-highest: var(--bc-surface-highest);
  --md-sys-color-outline: var(--bc-outline);
  --md-sys-color-outline-variant: var(--bc-outline-variant);

  --md-sys-shape-corner-small: 8px;
  --md-sys-shape-corner-medium: 12px;
  --md-sys-shape-corner-large: 18px;
  --md-sys-shape-corner-full: 999px;

  --md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-label-large-size: 0.875rem;
  --md-sys-typescale-label-large-line-height: 1.25rem;
  --md-sys-typescale-label-large-weight: 700;
  --md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-body-large-size: 1rem;
  --md-sys-typescale-body-large-line-height: 1.5rem;
  --md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-body-medium-size: 0.875rem;
  --md-sys-typescale-body-medium-line-height: 1.25rem;
}

.bc-md-control {
  --bc-md-control-height: 40px;
  --bc-md-control-min-width: 64px;
  --bc-md-control-x: 20px;
  --bc-md-control-font-size: 0.875rem;
  --bc-md-control-font-weight: 700;
  --bc-md-control-radius: var(--md-sys-shape-corner-full);
}

.bc-md-control-sm {
  --bc-md-control-height: 34px;
  --bc-md-control-x: 14px;
  --bc-md-control-font-size: 0.8125rem;
}

.bc-md-control-lg {
  --bc-md-control-height: 48px;
  --bc-md-control-min-width: 96px;
  --bc-md-control-x: 24px;
  --bc-md-control-font-size: 0.9375rem;
  --bc-md-control-font-weight: 760;
}

.bc-md-control-full {
  width: 100%;
}

a.bc-md-control,
button.bc-md-control {
  display: inline-flex;
  min-width: var(--bc-md-control-min-width);
  min-height: var(--bc-md-control-height);
  align-items: center;
  justify-content: center;
  padding: 0 var(--bc-md-control-x);
  border-radius: var(--bc-md-control-radius);
  font-size: var(--bc-md-control-font-size);
  font-weight: var(--bc-md-control-font-weight);
  line-height: 1;
  white-space: nowrap;
}

md-filled-button.bc-md-control,
md-filled-tonal-button.bc-md-control,
md-outlined-button.bc-md-control,
md-text-button.bc-md-control {
  --md-filled-button-container-height: var(--bc-md-control-height);
  --md-filled-tonal-button-container-height: var(--bc-md-control-height);
  --md-outlined-button-container-height: var(--bc-md-control-height);
  --md-text-button-container-height: var(--bc-md-control-height);
  --md-filled-button-container-shape: var(--bc-md-control-radius);
  --md-filled-tonal-button-container-shape: var(--bc-md-control-radius);
  --md-outlined-button-container-shape: var(--bc-md-control-radius);
  --md-text-button-container-shape: var(--bc-md-control-radius);
  --md-filled-button-leading-space: var(--bc-md-control-x);
  --md-filled-button-trailing-space: var(--bc-md-control-x);
  --md-filled-tonal-button-leading-space: var(--bc-md-control-x);
  --md-filled-tonal-button-trailing-space: var(--bc-md-control-x);
  --md-outlined-button-leading-space: var(--bc-md-control-x);
  --md-outlined-button-trailing-space: var(--bc-md-control-x);
  --md-text-button-leading-space: var(--bc-md-control-x);
  --md-text-button-trailing-space: var(--bc-md-control-x);
  --md-filled-button-label-text-size: var(--bc-md-control-font-size);
  --md-filled-tonal-button-label-text-size: var(--bc-md-control-font-size);
  --md-outlined-button-label-text-size: var(--bc-md-control-font-size);
  --md-text-button-label-text-size: var(--bc-md-control-font-size);
  --md-filled-button-label-text-weight: var(--bc-md-control-font-weight);
  --md-filled-tonal-button-label-text-weight: var(--bc-md-control-font-weight);
  --md-outlined-button-label-text-weight: var(--bc-md-control-font-weight);
  --md-text-button-label-text-weight: var(--bc-md-control-font-weight);
  min-width: var(--bc-md-control-min-width);
}

.bc-md-cta {
  --md-sys-color-primary: var(--bc-accent);
  --md-sys-color-on-primary: var(--bc-on-accent);
}

.bc-md-surface-action {
  --md-outlined-button-container-color: var(--bc-surface-lowest);
  --md-outlined-button-label-text-color: var(--bc-on-surface);
  --md-outlined-button-outline-color: var(--bc-outline-variant);
  --md-outlined-button-hover-state-layer-color: var(--bc-on-surface);
}
