.theme-betsmith {
  font-family: var(--cbt-primary-font-family);
}

:root,
:host,
cbt-modal {
  /* variables generated from figma output json file */
  --header: #ff004a;
  --header-interaction-medium: #ff2e6a;
  --header-interaction-hi: #d6003e;
  --on-header: #ffffff;
  --primary: #ff004a;
  --primary-interaction-low: #ffe5ed;
  --primary-interaction-medium: #ff004a;
  --on-primary: #ffffff;
  --secondary: #ffc107;
  --secondary-interaction-low: #fff9e6;
  --secondary-interaction-medium: #ffcc34;
  --on-secondary: #ffffff;
  --tertiary: #2e3541;
  --tertiary-interaction-low: #fffefb;
  --tertiary-interaction-medium: #434954;
  --on-tertiary: #ffffff;
  --background: #ffffff;
  --surface: #f7f7f7;
  --section-surface: undefined;
  --on-surface-hi: #171113de;
  --on-surface-m: #17111399;
  --on-surface-low: #17111326;
  --on-surface-ulow: #1711131a;
  --alternate-section-surface: undefined;
  --on-alternate-section-hi: #ffffff;
  --on-alternate-section-m: #ffffff99;
  --on-alternate-section-low: #ffffff61;
  --color-block: #ad0032;
  --on-color-block: #ffffff;
  --alternate-surface: #171113;
  --alternate-surface-variant1: #171113;
  --alternate-surface-variant2: #5c5d67;
  --on-alternate-surface-hi: #ffffff;
  --on-alternate-surface-m: #ffffffde;
  --on-alternate-surface-low: #ffffff99;

  /* fds button */
  --fds-btn-accent: #ffc107;
  --fds-btn-accent-hover: #d6a100;
  --fds-btn-accent-active: #ffcc34;
  --fds-on-btn-accent: #171113de;
  --fds-btn-default: #ad0032;
  --fds-btn-default-hover: #d6003e;
  --fds-btn-default-active: #ff004a;
  --fds-on-btn-default: #ffffffde;
  --fds-btn-alternate-accent: #ad0032;
  --fds-btn-alternate-accent-hover: #d6003e;
  --fds-btn-alternate-accent-active: #ff004a;
  --fds-on-btn-alternate-accent: #ffffff;
  --fds-btn-on-surface-hover: #17111303;
  --fds-btn-on-surface-active: #1711131a;
  --fds-btn-on-alternate-surface-hover: rgba(255, 255, 255, 0.15);
  --fds-btn-on-alternate-surface-active: rgba(255, 255, 255, 0.3);
  --fds-btn-on-alternate-surface-default: #ffffff;
  --fds-btn-on-header-default: #ffffff;
  --fds-btn-on-surface-default: #ff004a;

  /* cbt-header component */
  --cbt-header-logo-max-height-mobile: 32px;

  /* cbt-button component */
  --cbt-button-border-radius: 2px;
  --cbt-button-primary-color-hover-outline: rgba(255 0 74 / 8%);
  --cbt-button-secondary-color-hover-outline: rgba(255 193 7 / 8%);
  --cbt-button-disable-colour-custom: var(--fds-on-btn-default);

  /* cbt-accordion component */
  --cbt-accordion-transparent-box-border-top: 1px solid var(--on-surface-ulow);
  --cbt-accordion-border-radius: 2px;
  --cbt-accordion-last-item-border-color-custom: var(--on-surface-ulow);

  /* cbt-card component */
  --cbt-card-item-border-radius: 2px;

  /* cbt-countdown component */
  --cbt-countdown-item-border-radius: 2px;
  --cbt-countdown-primary-border-color: var(--primary-interaction-medium);
  --cbt-countdown-secondary-border-color: var(--secondary-interaction-medium);
  --cbt-countdown-tertiary-border-color: var(--tertiary-interaction-medium);
  --cbt-countdown-transparent-text-color: var(--on-surface-hi);

  /* cbt-footer component */
  --cbt-footer-background-color: #373944;

  /* <input> field */
  --cbt-border-radius-input-default: 2px;
  --cbt-border-radius-input-alternate: 100px;

  /* cbt-table-pagination component */
  --cbt-pagination-hover-color: var(--on-primary);
  --cbt-pagination-btn-border-radius: var(--cbt-button-border-radius);

  /* cbt-dynamic-table component */
  --cbt-dynamic-table-top-border-radius: 2px;
  --cbt-dynamic-table-row-border-color: var(--on-surface-low);
  --cbt-dynamic-table-row-font-weight-custom: bold;
  --cbt-dynamic-table-entries-font-weight-custom: bold;
  --cbt-table-bottom-border-custom: none;
  --cbt-table-top-bg-color-custom: var(--primary);
  --cbt-table-top-color-custom: var(--on-primary);
  --cbt-alternate-surface-variant1: var(--alternate-surface-variant1);
  --cbt-alternate-surface-variant2: var(--alternate-surface-variant2);
  --cbt-search-bar-color: var(--on-surface-m);
  --cbt-search-bar-bg-color: var(--background);
  --cbt-select-border-radius: 2px;
  --cbt-entries-bg-color: var(--background);
  --cbt-entries-border-color: var(--on-surface-low);
  --cbt-entries-txt-color: var(--on-surface-hi);
  --cbt-scollbar-background: var(--background);
  --cbt-scrollbar-on-background: var(--on-surface-low);

  /* cbt-stepper component */
  --cbt-stepper-info-background-color: var(--primary);
  --cbt-stepper-info-txt-color: var(--on-primary);

  /* fonts */
  --cbt-primary-font-family: 'Barlow', system-ui, sans-serif;
  --cbt-secondary-font-family: 'Barlow', system-ui, sans-serif;
}
