/**
* This file would be included at the root of our app
*/

/* This will contain the global colors and values of our app */
:root {
	/* Theme colors */
	--batterii-blue-light: #3343ff;
	--batterii-green: #22c581;
	--batterii-navy: #181f42;
	--batterii-navy-light: #2c366a;
	--batterii-purple: #5f4dff;
	--batterii-red: #f43131;
	--batterii-yellow: #ffeb2e;
	--batterii-hot-pink: #e54190;
	--batterii-volt: #ebff00;
	/* faded colors */
	--batterii-green-faded: rgba(34, 197, 129, 0.15);
	--batterii-white-faded: rgba(255, 255, 255, 0.2);
	/* Colors from the newest wireframes (maybe won't be final?) */
	--batterii-blue: #0033ff;
	--batterii-green-two: #27ae60;
	--batterii-pale-yellow: #fff599;

	/* grayscale */
	--batterii-black: #000000;
	--batterii-black-lighter: #111111;
	--batterii-grey-extradark: #383838;
	--batterii-grey-dark: #686868;
	--batterii-grey-medium: #989898;
	--batterii-grey-light: #c8c8c8;
	--batterii-grey: #cccccc;
	--batterii-grey-extralight: #dddddd;
	--batterii-grey-white: #eeeeee;
	--batterii-white-smoke: #f3f3f3;
	--batterii-white: #ffffff;

	/* Static height or width values of global elements*/
	--top-nav-height: 60px;

	/* Spacings */
	--space-2: 2px;
	--space-4: 4px;
	--space-6: 6px;
	--space-8: 8px;
	--space-10: 10px;
	--space-12: 12px;
	--space-14: 14px;
	--space-16: 16px;
	--space-20: 20px;
	--space-22: 22px;
	--space-24: 24px;
	--space-32: 32px;
	--space-40: 40px;
	--space-46: 46px;
	--space-64: 64px;
	--space-74: 74px;
	--space-124: 124px;

	/* Border radius variables */
	--radius-xxs: var(--space-2);
	--radius-xs: var(--space-4);
	--radius-s: var(--space-8);
	--radius-m: var(--space-12);
	--radius-base: var(--space-16);
	--radius-l: var(--space-32);

	/* Gray */
	--gray-modern-25: #fcfcfd;
	--gray-modern-50: #f8fafc;
	--gray-modern-100: #eef2f6;
	--gray-modern-200: #e3e8ef;
	--gray-modern-300: #cdd5df;
	--gray-modern-400: #9aa4b2;
	--gray-modern-500: #697586;
	--gray-modern-600: #4b5565;
	--gray-modern-700: #364152;
	--gray-modern-800: #202939;
	--gray-modern-900: #121926;

	/* Charcoal */
	--charcoal-200: #525252;
	--charcoal-300: #3b3b3b;
	--charcoal-400: #323232;
	--charcoal-500: #292929;
	--charcoal-600: #1d1d1d;
	--charcoal-700: #141414;

	/* Charcoal elevation */
	--charcoal-elevation-25: #eaeaea;
	--charcoal-elevation-50: #bfbfbf;
	--charcoal-elevation-100: #8b8b8b;
	--charcoal-elevation-200: #767676;
	--charcoal-elevation-300: #696969;
	--charcoal-elevation-400: #545454;
	--charcoal-elevation-500: #3e3e3e;
	--charcoal-elevation-600: #363636;
	--charcoal-elevation-700: #2f2f2f;
	--charcoal-elevation-800: #2d2d2d;

	/* Purple Brand*/
	--purple-brand-25: #fafaff;
	--purple-brand-50: #f4f3fd;
	--purple-brand-100: #eceafd;
	--purple-brand-200: #dbd7fd;
	--purple-brand-300: #cdc7fe;
	--purple-brand-400: #a69cfe;
	--purple-brand-500: #5f4dff;
	--purple-brand-600: #5546dd;
	--purple-brand-700: #4b3fbb;
	--purple-brand-800: #373077;
	--purple-brand-900: #2a274a;
	--purple-brand-950: #22202d;

	/* Blue Vurvey */
	--blue-vurvey-25: #ededf5;
	--blue-vurvey-50: #c8c8de;
	--blue-vurvey-100: #b7b7cf;
	--blue-vurvey-200: #9494b1;
	--blue-vurvey-300: #717092;
	--blue-vurvey-400: #4e4d74;
	--blue-vurvey-500: #2b2a56;
	--blue-vurvey-600: #222245;
	--blue-vurvey-700: #1a1934;
	--blue-vurvey-800: #111122;
	--blue-vurvey-900: #090811;

	--yellow-25: #fefcf0;
	--yellow-50: #fefbe8;
	--yellow-100: #fef1c3;
	--yellow-200: #ffee95;
	--yellow-300: #fde273;
	--yellow-400: #ffc91a;
	--yellow-500: #ecbe09;
	--yellow-600: #e8a808;
	--yellow-700: #c18b03;
	--yellow-800: #85510e;
	--yellow-900: #714012;

	--volt-50: #fdffe5;
	--volt-100: #fbffcc;
	--volt-200: #f9ffb2;
	--volt-300: #f6ff99;
	--volt-400: #f3ff52;
	--volt-500: #eaff00;
	--volt-600: #d7ea00;
	--volt-700: #a6b500;

	/* Red */
	--red-25: #fffbfa;
	--red-50: #fef3f2;
	--red-100: #fee4e2;
	--red-200: #fecdca;
	--red-300: #fda29b;
	--red-400: #f97066;
	--red-500: #f04438;
	--red-600: #d92d20;
	--red-700: #b42318;
	--red-800: #912018;
	--red-900: #7a271a;

	/* Pink dirty */
	--pink-dirty-25: #f8eef0;
	--pink-dirty-50: #f2dde1;
	--pink-dirty-100: #ebccd3;
	--pink-dirty-200: #e5bbc4;
	--pink-dirty-300: #d79aa6;
	--pink-dirty-400: #ca7889;
	--pink-dirty-500: #bd566b;
	--pink-dirty-600: #9c4758;
	--pink-dirty-700: #7b3845;
	--pink-dirty-800: #5b2833;
	--pink-dirty-900: #3a1920;

	/* Teal */
	--teal-25: #ddfbf8;
	--teal-50: #c5f7f2;
	--teal-100: #adf3ec;
	--teal-200: #95efe6;
	--teal-300: #64e7da;
	--teal-400: #34dfce;
	--teal-500: #04d7c2;
	--teal-600: #03ac9b;
	--teal-700: #028174;
	--teal-800: #02564e;
	--teal-900: #012b27;

	/* Purple modern */
	--purple-modern-25: #fcfaff;
	--purple-modern-50: #f9f4ff;
	--purple-modern-100: #f4e9ff;
	--purple-modern-200: #e9d2ff;
	--purple-modern-300: #ddbcff;
	--purple-modern-400: #d2a5ff;
	--purple-modern-500: #c78fff;
	--purple-modern-600: #8756b8;
	--purple-modern-700: #562b82;
	--purple-modern-800: #360e5f;
	--purple-modern-900: #26004d;
	--purple: #5f4dff;

	/* Cyan */
	--cyan-25: #f5feff;
	--cyan-50: #ecfdff;
	--cyan-100: #cff9fe;
	--cyan-200: #a5f0fc;
	--cyan-300: #67e3f9;
	--cyan-400: #22ccee;
	--cyan-500: #06aed4;
	--cyan-600: #088ab2;
	--cyan-700: #0e7090;
	--cyan-800: #155b75;
	--cyan-900: #164c63;

	/* Lime */
	--lime-25: #f9fef3;
	--lime-50: #f2fee5;
	--lime-100: #e3fbcc;
	--lime-200: #d0f8ab;
	--lime-300: #a6ef67;
	--lime-400: #85e13a;
	--lime-500: #66c61c;
	--lime-600: #4ca30d;
	--lime-700: #3b7c0f;
	--lime-800: #326212;
	--lime-900: #2b5314;

	/* Blue Dark */

	--blue-dark-25: #f5f8ff;
	--blue-dark-50: #eff4ff;
	--blue-dark-100: #d1e0ff;
	--blue-dark-200: #b2ccff;
	--blue-dark-300: #84adff;
	--blue-dark-400: #528bff;
	--blue-dark-500: #2970ff;
	--blue-dark-600: #155eef;
	--blue-dark-700: #004eeb;
	--blue-dark-800: #0040c1;
	--blue-dark-900: #00359e;

	/* Yellow */

	--yellow-25: #fefcf0;
	--yellow-50: #fefbe8;
	--yellow-100: #fef1c3;
	--yellow-200: #ffee95;
	--yellow-300: #fde273;
	--yellow-400: #ffc91a;
	--yellow-500: #ecbe09;
	--yellow-600: #e8a808;
	--yellow-700: #c18b03;
	--yellow-800: #85510e;
	--yellow-900: #714012;

	--color-text-body: var(--gray-modern-900);
	--color-text-secondary: var(--gray-modern-700);
	--color-text-tertiary: var(--gray-modern-600);

	--color-modal-background: var(--gray-modern-50);

	--font-inter: "Inter";
}
/* global overrides */
html {
	box-sizing: border-box;
	line-height: 1.3;
	font-size: 10px;
	font-family: batterii-brand, sans-serif;
	height: 100%;
}
*,
*:before,
*:after {
	box-sizing: inherit;
}
body {
	margin: 0;
	padding: 0;
	min-width: 0;
	max-width: 100%;
	border: 0;
	height: 100%;
}

h2 {
	font-size: 2.1rem;
	font-weight: 600;
}

#root {
	height: 100%;
}