:root {
  /* Brave Leo overrides for variables that use Font-Family */
  --font-poppins: 'Poppins', -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --leo-font-primary-heading-display1: var(--leo-font-heading-display1);
  --leo-font-primary-heading-display2: var(--leo-font-heading-display2);
  --leo-font-primary-heading-h1: var(--leo-font-heading-h1);
  --leo-font-primary-heading-h2: var(--leo-font-heading-h2);
  --leo-font-primary-heading-h3: var(--leo-font-heading-h3);
  --leo-font-primary-heading-h4: var(--leo-font-heading-h4);
  --leo-font-primary-large-regular: var(--leo-font-large-regular);
  --leo-font-primary-large-semibold: var(--leo-font-large-semibold);
  --leo-font-primary-default-regular: var(--leo-font-default-regular);
  --leo-font-primary-default-semibold: var(--leo-font-default-semibold);
  --leo-font-primary-small-regular: var(--leo-font-small-regular);
  --leo-font-primary-small-semibold: var(--leo-font-small-semibold);
  --leo-font-primary-x-small-regular: var(--leo-font-x-small-regular);
  --leo-font-primary-x-small-semibold: var(--leo-font-x-small-semibold);
  --leo-font-x-small-link: 400 11px/18px 'Inter';
  --leo-font-x-small-semibold: 600 11px/18px 'Inter';
  --leo-font-x-small-regular: 400 11px/18px 'Inter';
  --leo-font-small-link: 400 12px/20px 'Inter';
  --leo-font-small-semibold: 600 12px/20px 'Inter';
  --leo-font-small-regular: 400 12px/20px 'Inter';
  --leo-font-default-link: 400 14px/22px 'Inter';
  --leo-font-default-semibold: 600 14px/22px 'Inter';
  --leo-font-default-regular: 400 14px/22px 'Inter';
  --leo-font-large-link: 400 16px/26px 'Inter';
  --leo-font-large-semibold: 600 16px/26px 'Inter';
  --leo-font-large-regular: 400 16px/26px 'Inter';
  --leo-font-components-button-default: 600 14px/20px 'Inter';
  --leo-font-components-button-jumbo: 600 18px/24px 'Inter';
  --leo-font-components-button-large: 600 16px/22px 'Inter';
  --leo-font-components-button-small: 600 12px/18px 'Inter';
  --leo-font-components-label: 700 10px/10px 'Inter';
  --leo-font-components-navbutton: 600 14px/22px 'Inter';
  --leo-font-components-tableheader: 600 13px/16px 'Inter';
  --leo-typography-components-label-font-weight: 700;
  --leo-font-components-numbers-large: 600 36px/46px 'Inter';
  --leo-font-heading-display1: 600 46px/54px 'Inter';
  --leo-font-heading-display2: 600 40px/48px 'Inter';
  --leo-font-heading-display3: 600 34px/40px 'Inter';
  --leo-font-heading-h1: 600 30px/38px 'Inter';
  --leo-font-heading-h2: 600 24px/30px 'Inter';
  --leo-font-heading-h3: 600 20px/26px 'Inter';
  --leo-font-heading-h4: 600 16px/24px 'Inter';

  /* this needs to be fixed in Leo */
  --leo-color-text-primary: rgb(13 15 20);
  --leo-button-radius: 12px;
  --leo-control-radius: 12px;
  --radius: 12px;
  --leo-dialog-width: 720px;
  --padding: var(--leo-control-padding, 10px 7px);
  --color: var(--leo-color-text-primary);
  --foreground: var(--leo-color-text-primary);
  --base: var(--leo-color-container-background);
  --primary: var(--leo-control-color, var(--base));
  --background: var(--primary);
  --border-color: color-mix(in srgb, var(--primary), var(--foreground) 25%);
  --border-color-hover: color-mix(in srgb, var(--primary), var(--foreground) 40%);
}

/* this needs to be fixed in Leo */
[data-theme="light"] {
  --leo-color-text-primary: rgb(13 15 20);
}

@media (prefers-color-scheme: light) {
  :root {
    --leo-color-text-primary: rgb(13 15 20);
  }
}

[data-theme="dark"] {
/*  --leo-color-text-primary: rgb(246 247 248); */
}

@media (prefers-color-scheme: dark) {
  :root {
/*    --leo-color-text-primary: rgb(246 247 248); */
  }
}
