/* CSS variables */
:root {
	--bb-rl-primary-color: #4946fe;
	--bb-rl-secondary-color: #dde4ff;

	--bb-rl-background-color: #fff;
	--bb-rl-background-hover-color: #f8f8f8;
	--bb-rl-background-secondary-color: #f6f6f6;
	--bb-rl-background-secondary-hover-color: #f3f3f3;
	--bb-rl-background-tertiary-color: #dbdbdb;
	--bb-rl-background-tertiary-hover-color: #cececf;
	--bb-rl-background-black-color: #0c0c0d;
	--bb-rl-background-disabled-color: #dbdbdb;

	--bb-rl-background-brand-primary-color: var(--bb-rl-primary-color);
	--bb-rl-background-brand-primary-hover-color: #4937f4;
	--bb-rl-background-brand-secondary-color: #dde4ff;
	--bb-rl-background-brand-secondary-hover-color: #c2cdff;
	--bb-rl-background-brand-disabled-color: #767eff;

	--bb-rl-background-positive-primary-color: #14ae5c;
	--bb-rl-background-positive-primary-hover-color: #009951;
	--bb-rl-background-positive-secondary-color: #ebffee;
	--bb-rl-background-positive-secondary-hover-color: #cff7d3;

	--bb-rl-background-warning-primary-color: #e5a000;
	--bb-rl-background-warning-primary-hover-color: #bf6a02;
	--bb-rl-background-warning-secondary-color: #fffbeb;
	--bb-rl-background-warning-secondary-hover-color: #fff1c2;

	--bb-rl-background-danger-primary-color: #ec221f;
	--bb-rl-background-danger-primary-hover-color: #c00f0c;
	--bb-rl-background-danger-secondary-color: #fee9e7;
	--bb-rl-background-danger-secondary-hover-color: #fdd3d0;

	--bb-rl-border-color: #f3f3f3;
	--bb-rl-border-secondary-color: #e7e7e7;
	--bb-rl-border-tertiary-color: #cececf;
	--bb-rl-border-disabled-color: #f3f3f3;
	--bb-rl-border-quinery-color: #6d6d6e;
	--bb-rl-border-quaternary-color: #9e9e9e;

	--bb-rl-border-brand-primary-color: #3325ae;
	--bb-rl-border-brand-secondary-color: var(--bb-rl-primary-color);

	--bb-rl-border-positive-primary-color: #02542d;
	--bb-rl-border-positive-secondary-color: #14ae5c;

	--bb-rl-border-warning-primary-color: #682d03;
	--bb-rl-border-warning-secondary-color: #e5a000;

	--bb-rl-border-danger-primary-color: #690807;
	--bb-rl-border-danger-secondary-color: #ec221f;

	--bb-rl-text-color: #242425;
	--bb-rl-text-white-color: #fff;
	--bb-rl-text-secondary-color: #555556;
	--bb-rl-text-tertiary-color: #858586;
	--bb-rl-text-disabled-color: #9e9e9e;
	--bb-rl-text-brand-primary-color: var(--bb-rl-primary-color);
	--bb-rl-text-brand-secondary-color: #3325ae;

	--bb-rl-text-positive-primary-color: #02542d;
	--bb-rl-text-positive-secondary-color: #14ae5c;

	--bb-rl-text-warning-primary-color: #682d03;
	--bb-rl-text-warning-secondary-color: #e5a000;

	--bb-rl-text-danger-primary-color: #690807;
	--bb-rl-text-danger-secondary-color: #ec221f;

	--bb-rl-icon-color: #0c0c0d;
	--bb-rl-icon-primary-color: #3d3d3d;
	--bb-rl-icon-secondary-color: #6d6d6e;
	--bb-rl-icon-tertiary-color: #9e9e9e;
	--bb-rl-icon-disabled-color: #cececf;
	--bb-rl-icon-brand-primary-color: #3325ae;
	--bb-rl-icon-brand-secondary-color: var(--bb-rl-primary-color);
	--bb-rl-icon-brand-disabled-color: #767eff;
	--bb-rl-icon-positive-primary-color: #02542d;
	--bb-rl-icon-positive-secondary-color: #14ae5c;
	--bb-rl-icon-warning-primary-color: #682d03;
	--bb-rl-icon-warning-secondary-color: #e5a000;
	--bb-rl-icon-danger-primary-color: #690807;
	--bb-rl-icon-danger-secondary-color: #ec221f;

	--bb-rl-radius-xs: 2px;
	--bb-rl-radius-sm: 4px;
	--bb-rl-radius-md: 6px;
	--bb-rl-radius-base: 8px;
	--bb-rl-radius-lg: 12px;
	--bb-rl-radius-full: 99px;

	--bb-rl-space-0: 0;
	--bb-rl-space-50: 4px;
	--bb-rl-space-100: 8px;
	--bb-rl-space-200: 16px;
	--bb-rl-space-300: 24px;
	--bb-rl-space-400: 32px;
	--bb-rl-space-500: 40px;
	--bb-rl-space-600: 48px;
	--bb-rl-space-700: 56px;

	--bb-rl-z-index-dropdown: 1000;
	--bb-rl-z-index-sticky: 1020;
	--bb-rl-z-index-fixed: 1030;
	--bb-rl-z-index-adminbar: 1035;
	--bb-rl-z-index-modal-backdrop: 1040;
	--bb-rl-z-index-modal: 1050;
	--bb-rl-z-index-popover: 1060;
	--bb-rl-z-index-tooltip: 1070;

	// stylelint-disable-next-line
	--bb-rl-font-family-base: InterText, serif;
	--bb-rl-font-size-2xl: 20px;
	--bb-rl-font-size-base: 16px;
	--bb-rl-font-size-xs: 11px;
	--bb-rl-font-size-sm: 13px;

	--bb-rl-base-line-xs: 16px;
	--bb-rl-base-line-small: 20px;
	--bb-rl-base-line: 24px;
	--bb-rl-base-line-2xl: 30px;
}

/* Dark Mode Variables */

.bb-rl-dark-mode {
	--bb-rl-primary-color: #4946fe;
	--bb-rl-background-color: #242425;
	--bb-rl-background-hover-color: #555556;
	--bb-rl-background-secondary-color: #2f2f2f;
	--bb-rl-background-secondary-hover-color: #3d3d3d;
	--bb-rl-background-tertiary-color: #6d6d6e;
	--bb-rl-background-tertiary-hover-color: #555556;
	--bb-rl-background-black-color: #0c0c0d;
	--bb-rl-background-disabled-color: #dbdbdb;

	--bb-rl-background-brand-primary-color: var(--bb-rl-primary-color);
	--bb-rl-background-brand-primary-hover-color: #4937f4;
	--bb-rl-background-brand-secondary-color: #3325ae;
	--bb-rl-background-brand-secondary-hover-color: #2e2689;
	--bb-rl-background-brand-disabled-color: #767eff;

	--bb-rl-background-positive-primary-color: #008043;
	--bb-rl-background-positive-primary-hover-color: #02542d;
	--bb-rl-background-positive-secondary-color: #02542d;
	--bb-rl-background-positive-secondary-hover-color: #024023;

	--bb-rl-background-warning-primary-color: #975102;
	--bb-rl-background-warning-primary-hover-color: #682d03;
	--bb-rl-background-warning-secondary-color: #682d03;
	--bb-rl-background-warning-secondary-hover-color: #522504;

	--bb-rl-background-danger-primary-color: #900b09;
	--bb-rl-background-danger-primary-hover-color: #690807;
	--bb-rl-background-danger-secondary-color: #690807;
	--bb-rl-background-danger-secondary-hover-color: #4d0b0a;

	--bb-rl-border-color: #2f2f2f;
	--bb-rl-border-secondary-color: #3d3d3d;
	--bb-rl-border-tertiary-color: #555556;
	--bb-rl-border-disabled-color: #f3f3f3;
	--bb-rl-border-quinery-color: #f6f6f6;
	--bb-rl-border-quaternary-color: #f3f3f3;

	--bb-rl-border-brand-primary-color: #c2cdff;
	--bb-rl-border-brand-secondary-color: var(--bb-rl-primary-color);

	--bb-rl-border-positive-primary-color: #cff7d3;
	--bb-rl-border-positive-secondary-color: #14ae5c;

	--bb-rl-border-warning-primary-color: #fff1c2;
	--bb-rl-border-warning-secondary-color: #e5a000;

	--bb-rl-border-danger-primary-color: #fdd3d0;
	--bb-rl-border-danger-secondary-color: #ec221f;

	--bb-rl-text-color: #fff;
	--bb-rl-text-white-color: #fff;
	--bb-rl-text-secondary-color: #cececf;
	--bb-rl-text-tertiary-color: #b6b6b6;
	--bb-rl-text-disabled-color: #e7e7e7;
	--bb-rl-text-brand-primary-color: var(--bb-rl-primary-color);
	--bb-rl-text-brand-secondary-color: #c2cdff;

	--bb-rl-text-positive-primary-color: #cff7d3;
	--bb-rl-text-positive-secondary-color: #14ae5c;

	--bb-rl-text-warning-primary-color: #fff1c2;
	--bb-rl-text-warning-secondary-color: #e5a000;

	--bb-rl-text-danger-primary-color: #fdd3d0;
	--bb-rl-text-danger-secondary-color: #ec221f;

	--bb-rl-icon-color: #cececf;
	--bb-rl-icon-primary-color: #cececf;
	--bb-rl-icon-secondary-color: #cececf;
	--bb-rl-icon-tertiary-color: #9e9e9e;
	--bb-rl-icon-disabled-color: #858586;
	--bb-rl-icon-brand-primary-color: #c2cdff;
	--bb-rl-icon-brand-secondary-color: var(--bb-rl-primary-color);
	--bb-rl-icon-brand-disabled-color: #767eff;
	--bb-rl-icon-positive-primary-color: #cff7d3;
	--bb-rl-icon-positive-secondary-color: #14ae5c;
	--bb-rl-icon-warning-primary-color: #fff1c2;
	--bb-rl-icon-warning-secondary-color: #e5a000;
	--bb-rl-icon-danger-primary-color: #fdd3d0;
	--bb-rl-icon-danger-secondary-color: #ec221f;

	scrollbar-color: #666 transparent;
	color-scheme: dark;
}

/* SCSS Variables */

// BREAKPOINTS
$sm: 544px !default;
$md: 800px !default;
$lg: 992px !default;
$xl: 1200px !default;
