@layer base {
  :root {
    --text-color-button-primary: #FFFFFF;
    --text-color-button-secondary: #8679D0;
    --text-color-button-tertiary: #7978FF;
    --text-color-button-tertiary-muted: #5B5965;

    --background-color-button-primary-from: #32303E;
    --background-color-button-primary-to: #A198D3;
    --background-color-button-secondary: #FFFFFF;
    --background-color-button-tertiary: transparent;
    --background-color-button-tertiary-muted: transparent;

    --border-color-button-secondary: #8679D0;

    --border-width-button-secondary: 2px;
    --border-radius-button-primary: 40px;
    --border-radius-button-secondary: 40px;
    --border-radius-button-tertiary: 6px;

    --text-color-button-tertiary-hover: #6E6DE8;
    --text-color-button-tertiary-muted-hover: #23222C;

    --background-color-button-primary-hover-from: #32303E;
    --background-color-button-primary-hover-via: #625D7E;
    --background-color-button-primary-hover-to: #A198D3;
    --background-color-button-secondary-hover: #EDEAFF;
    --background-color-button-tertiary-hover: #7978FF14;
    --background-color-button-tertiary-muted-hover: #5B596514;
    --background-color-button-highlight: #7978FF;
    --background-color-button-highlight-hover: #5555f4;

    --text-color-button-tertiary-disabled: #D6D6D8;

    --padding-x-button-primary: 24px;
    --padding-y-button-primary: 10px;
    --padding-x-button-secondary: 24px;
    --padding-y-button-secondary: 10px;
  }

  .theme-lawinsider {
    --text-color-button-primary: #FFFFFF;
    --text-color-button-secondary: #28538B;
    --text-color-button-tertiary: #28538B;
    --text-color-button-tertiary-muted: #5A5A5B;

    --background-color-button-primary-from: #28538B;
    --background-color-button-primary-to: #28538B;
    --background-color-button-secondary: #FFFFFF;
    --background-color-button-tertiary: transparent;
    --background-color-button-tertiary-muted: transparent;

    --border-color-button-secondary: #28538B;

    --border-width-button-secondary: 1px;
    --border-radius-button-primary: 4px;
    --border-radius-button-secondary: 4px;
    --border-radius-button-tertiary: 4px;

    --text-color-button-tertiary-hover: #28538B;
    --text-color-button-tertiary-muted-hover: #5A5A5B;

    --background-color-button-primary-hover-from: #5375A2;
    --background-color-button-primary-hover-via: #5375A2;
    --background-color-button-primary-hover-to: #5375A2;
    --background-color-button-secondary-hover: #FFFFFF;
    --background-color-button-tertiary-hover: #28538B0D;
    --background-color-button-tertiary-muted-hover: #F2F2F3;
    --background-color-button-highlight: #28538B;
    --background-color-button-highlight-hover: #16417b;

    --text-color-button-tertiary-disabled: #C3C3C5;

    --padding-x-button-primary: 24px;
    --padding-y-button-primary: 10px;
    --padding-x-button-secondary: 24px;
    --padding-y-button-secondary: 10px;
  }
}