@charset "uft-8";

/* color guide */
:root,
.theme-light {
  --base-bg: rgba(255, 255, 255, 1);
  --base-text: rgba(28, 28, 30, 1);
  --base-text2: rgba(90, 90, 92, 1);
  --red: rgba(255, 59, 48, 1);
  --orange: rgba(255, 149, 0, 1);
  --yellow: rgba(255, 204, 0, 1);
  --green: rgba(40, 205, 65, 1);
  --mint: rgba(0, 199, 190, 1);
  --teal: rgba(89, 173, 196, 1);
  --cyan: rgba(85, 190, 240, 1);
  --blue: rgba(0, 122, 255, 1);
  --indigo: rgba(88, 86, 214, 1);
  --purple: rgba(175, 82, 222, 1);
  --pink: rgba(255, 45, 85, 1);
  --brown: rgba(162, 132, 94, 1);
  --gray: rgba(142, 142, 147, 1);
  --gray1: rgba(142, 142, 147, 1);
  --gray2: rgba(174, 174, 178, 1);
  --gray3: rgba(199, 199, 204, 1);
  --gray4: rgba(209, 209, 214, 1);
  --gray5: rgba(229, 229, 234, 1);
  --gray6: rgba(242, 242, 247, 1);
}

.theme-light.accessible {
  --base-bg: rgba(255, 255, 255, 1);
  --base-text: rgba(0, 0, 0, 1);
  --base-text2: rgba(60, 60, 62, 1);
  --red: rgba(215, 0, 21, 1);
  --orange: rgba(201, 52, 0, 1);
  --yellow: rgba(160, 90, 0, 1);
  --green: rgba(0, 125, 27, 1);
  --mint: rgba(12, 129, 123, 1);
  --teal: rgba(0, 130, 153, 1);
  --cyan: rgba(0, 113, 164, 1);
  --blue: rgba(0, 64, 221, 1);
  --indigo: rgba(54, 52, 163, 1);
  --purple: rgba(173, 68, 171, 1);
  --pink: rgba(211, 15, 69, 1);
  --brown: rgba(127, 101, 69, 1);
  --gray: rgba(105, 105, 110, 1);
  --gray1: rgba(108, 108, 112, 1);
  --gray2: rgba(142, 142, 147, 1);
  --gray3: rgba(174, 174, 178, 1);
  --gray4: rgba(188, 188, 192, 1);
  --gray5: rgba(216, 216, 220, 1);
  --gray6: rgba(235, 235, 240, 1);
}

.theme-light.vibrant {
  --red: rgba(255, 49, 38, 1);
  --orange: rgba(245, 139, 0, 1);
  --yellow: rgba(245, 194, 0, 1);
  --green: rgba(30, 195, 55, 1);
  --mint: rgba(0, 189, 180, 1);
  --teal: rgba(46, 167, 189, 1);
  --cyan: rgba(65, 175, 220, 1);
  --blue: rgba(0, 122, 245, 1);
  --indigo: rgba(84, 82, 204, 1);
  --purple: rgba(159, 75, 201, 1);
  --pink: rgba(245, 35, 75, 1);
  --brown: rgba(152, 122, 84, 1);
  --gray: rgba(132, 132, 137, 1);
}

.theme-light.accessible.vibrant {
  --red: rgba(194, 6, 24, 1);
  --orange: rgba(173, 58, 0, 1);
  --yellow: rgba(146, 81, 0, 1);
  --green: rgba(0, 112, 24, 1);
  --mint: rgba(11, 117, 112, 1);
  --teal: rgba(0, 119, 140, 1);
  --cyan: rgba(0, 103, 150, 1);
  --blue: rgba(0, 64, 221, 1);
  --indigo: rgba(54, 52, 163, 1);
  --purple: rgba(173, 68, 171, 1);
  --pink: rgba(193, 16, 50, 1);
  --brown: rgba(119, 93, 59, 1);
  --gray: rgba(97, 97, 101, 1);
}

.theme-dark {
  --base-bg: rgba(0, 0, 0, 1);
  --base-text: rgba(227, 227, 225, 1);
  --base-text2: rgba(167, 167, 165, 1);
  --red: rgba(255, 69, 58, 1);
  --orange: rgba(255, 159, 10, 1);
  --yellow: rgba(255, 214, 10, 1);
  --green: rgba(50, 215, 75, 1);
  --mint: rgba(102, 212, 207, 1);
  --teal: rgba(106, 196, 220, 1);
  --cyan: rgba(90, 200, 245, 1);
  --blue: rgba(10, 132, 255, 1);
  --indigo: rgba(94, 92, 230, 1);
  --purple: rgba(191, 90, 242, 1);
  --pink: rgba(255, 55, 95, 1);
  --brown: rgba(172, 142, 104, 1);
  --gray: rgba(152, 152, 157, 1);
  --gray1: rgba(142, 142, 147, 1);
  --gray2: rgba(99, 99, 102, 1);
  --gray3: rgba(72, 72, 74, 1);
  --gray4: rgba(58, 58, 60, 1);
  --gray5: rgba(44, 44, 46, 1);
  --gray6: rgba(28, 28, 30, 1);
}

.theme-dark.accessible {
  --base-bg: rgba(0, 0, 0, 1);
  --base-text: rgba(255, 255, 255, 1);
  --base-text2: rgba(197, 197, 195, 1);
  --red: rgba(255, 105, 97, 1);
  --orange: rgba(255, 179, 64, 1);
  --yellow: rgba(255, 212, 38, 1);
  --green: rgba(49, 222, 75, 1);
  --mint: rgba(102, 212, 207, 1);
  --teal: rgba(93, 230, 255, 1);
  --cyan: rgba(112, 215, 255, 1);
  --blue: rgba(64, 156, 255, 1);
  --indigo: rgba(125, 122, 255, 1);
  --purple: rgba(218, 143, 255, 1);
  --pink: rgba(255, 100, 130, 1);
  --brown: rgba(181, 148, 105, 1);
  --gray: rgba(152, 152, 157, 1);
  --gray1: rgba(174, 174, 178, 1);
  --gray2: rgba(124, 124, 128, 1);
  --gray3: rgba(84, 84, 86, 1);
  --gray4: rgba(68, 68, 70, 1);
  --gray5: rgba(54, 54, 56, 1);
  --gray6: rgba(36, 36, 38, 1);
}

.theme-dark.vibrant {
  --red: rgba(255, 79, 68, 1);
  --orange: rgba(255, 169, 20, 1);
  --yellow: rgba(255, 224, 20, 1);
  --green: rgba(60, 225, 85, 1);
  --mint: rgba(108, 224, 219, 1);
  --teal: rgba(68, 212, 237, 1);
  --cyan: rgba(90, 205, 250, 1);
  --blue: rgba(20, 142, 255, 1);
  --indigo: rgba(99, 97, 242, 1);
  --purple: rgba(204, 101, 255, 1);
  --pink: rgba(255, 65, 105, 1);
  --brown: rgba(182, 152, 114, 1);
  --gray: rgba(162, 162, 167, 1);
}

.theme-dark.accessible.vibrant {
  --red: rgba(255, 65, 54, 1);
  --orange: rgba(255, 179, 64, 1);
  --yellow: rgba(255, 212, 38, 1);
  --green: rgba(49, 222, 75, 1);
  --mint: rgba(102, 212, 207, 1);
  --teal: rgba(93, 230, 255, 1);
  --cyan: rgba(112, 215, 255, 1);
  --blue: rgba(64, 156, 255, 1);
  --indigo: rgba(125, 122, 255, 1);
  --purple: rgba(218, 143, 255, 1);
  --pink: rgba(255, 58, 95, 1);
  --brown: rgba(181, 148, 105, 1);
  --gray: rgba(152, 152, 157, 1);
}