/*text*/
:root {
  --H1: 28px;
  --H2: 24px;
  --H3: 18px;
  --Paragraph-1: 14px;
  --Paragraph-2: 14px;
  --Caption: 12px;
}

@media (min-width: 1000px) {
  :root {
    --H1: 40px;
    --H3: 20px;
    --Paragraph-1: 16px;
  }
}

/*light theme colors*/
body {
  --background: rgba(245, 247, 250, 1);
  --base-main: rgba(255, 255, 255, 1);
  --base-secondary: rgba(251, 252, 254, 1);
  --base-tertiary: rgba(241, 244, 248, 1);
  --base-quaternary: rgba(255, 255, 255, 1);
  --hover-noise: rgba(247, 247, 247, 1);
  --expanded: rgba(255, 255, 255, 1);
  --icon: rgba(164, 142, 150, 1);
  --border: rgba(221, 228, 238, 1);
  --disabled: rgba(117, 117, 122, 1);
  --gray-3: rgba(135, 135, 145, 1);
  --gray-2: rgba(93, 93, 111, 1);
  --gray-1: rgba(45, 45, 52, 1);
  --gray-0: rgba(211, 218, 228, 1);
  --hover-text: rgba(127, 54, 236, 1);
  --hover-base: rgba(210, 187, 226, 1);
  --paragraph: rgba(35, 33, 38, 1);
  --off-white: rgba(23, 23, 25, 1);
  --highlight: rgba(4, 129, 23, 1);
  --green: rgba(4, 129, 23, 1);
  --btn: rgba(94, 67, 224, 1);
  --badge-transp: rgba(223, 223, 226, 0.72);
  --off-white-64: rgba(23, 23, 25, 0.64);
  --selected-base: rgba(116, 94, 228, 0.12);
  --selected-fill: rgba(113, 49, 242, 1);
  --selected-text: rgba(99, 13, 227, 1);
  --text-on-color: rgba(37, 37, 44, 1);
  --dropdown-shadow: rgba(15, 15, 16, 0.08);
  --border-active: rgba(147, 131, 158, 1);
  --success-base: rgba(185, 221, 172, 1);
  --failure-base: rgba(232, 186, 187, 1);
  --warning-base: rgba(212, 162, 140, 1);
  --failure: rgba(234, 83, 83, 1);
  --warning: rgba(248, 146, 99, 1);
  --logo: rgba(94, 67, 224, 1);
  --pressed: rgba(116, 56, 158, 1);
  --yellow: rgba(255, 189, 45, 1);
  --badge-green: rgba(161, 201, 180, 1);
  --badge-blue: rgba(148, 176, 214, 1);
  --red: rgba(238, 70, 64, 1);
  --orange: rgba(238, 123, 51, 1);
  --light-blue: rgba(89, 206, 245, 1);
  --selected-map: rgba(174, 161, 239, 0.3);
  --overlay: rgba(45, 45, 52, 0.32);
  --border-light: rgba(228, 233, 241, 1);
  --blur-btn-base: rgba(245, 247, 250, 0.24);
  --blur-btn-border: rgba(12, 63, 136, 0.2);
  --main-button-text: rgba(252, 252, 253, 1);
  --card-main-page: rgba(245, 247, 250, 0.4);
}

/*dark theme colors*/
body.dark-theme {
  --background: rgba(15, 15, 16, 1);
  --base-main: rgba(31, 31, 35, 1);
  --base-secondary: rgba(27, 27, 29, 1);
  --base-tertiary: rgba(37, 37, 44, 1);
  --base-quaternary: rgba(44, 44, 52, 1);
  --hover-noise: rgba(23, 23, 25, 1);
  --expanded: rgba(37, 37, 44, 1);
  --icon: rgba(107, 87, 94, 1);
  --border: rgba(75, 67, 81, 1);
  --disabled: rgba(117, 117, 122, 1);
  --gray-3: rgba(120, 120, 130, 1);
  --gray-2: rgba(155, 155, 172, 1);
  --gray-1: rgba(218, 218, 237, 1);
  --gray-0: rgba(155, 155, 172, 1);
  --hover-text: rgba(210, 187, 226, 1);
  --hover-base: rgba(210, 187, 226, 1);
  --paragraph: rgba(212, 211, 218, 1);
  --off-white: rgba(231, 230, 234, 1);
  --highlight: rgba(104, 210, 150, 1);
  --green: rgba(108, 202, 74, 1);
  --btn: rgba(94, 67, 224, 1);
  --badge-transp: rgba(23, 23, 25, 0.8);
  --off-white-64: rgba(231, 230, 234, 0.64);
  --selected-base: rgba(174, 161, 239, 0.12);
  --selected-fill: rgba(174, 161, 239, 1);
  --selected-text: rgba(174, 161, 239, 1);
  --text-on-color: rgba(37, 37, 44, 1);
  --dropdown-shadow: rgba(15, 15, 16, 0.72);
  --border-active: rgba(147, 131, 158, 1);
  --success-base: rgba(60, 80, 52, 1);
  --failure-base: rgba(95, 53, 53, 1);
  --warning-base: rgba(90, 54, 38, 1);
  --failure: rgba(237, 110, 110, 1);
  --warning: rgba(248, 146, 99, 1);
  --logo: rgba(109, 84, 227, 1);
  --pressed: rgba(197, 162, 222, 1);
  --yellow: rgba(224, 184, 63, 1);
  --badge-green: rgba(39, 78, 42, 1);
  --badge-blue: rgba(37, 54, 89, 1);
  --red: rgba(238, 70, 64, 1);
  --orange: rgba(238, 123, 51, 1);
  --light-blue: rgba(89, 206, 245, 1);
  --selected-map: rgba(174, 161, 239, 0.3);
  --overlay: rgba(15, 15, 16, 0.72);
  --border-light: rgba(44, 44, 52, 1);
  --blur-btn-base: rgba(15, 15, 16, 0.24);
  --blur-btn-border: rgba(255, 255, 255, 0.2);
  --main-button-text: rgba(252, 252, 253, 1);
  --card-main-page: rgba(15, 15, 16, 0.8);
}