/* Primer Colors */
/* Please also update colors_light.css with light mode appropriate colors when modifying this file. */

:root {
    --blue-900: #082a52;
    --blue-800: #063366;
    --blue-700: #0b498f;
    --blue-600: #0c65c9;
    --blue-500: #0d6edb;
    --blue-400: #2e8fff;
    --blue-300: #85beff;
    --blue-200: #d1e6ff;
    --blue-100: #e5f2ff;
    --blue-000: #f5faff;
    --gray-1000: #050505;
    --gray-950: #0b0b0d;
    --gray-900: #17181a;
    --gray-850: #242528;
    --gray-800: #2e2f37;
    --gray-750: #383a42;
    --gray-700: #41434e;
    --gray-650: #4b4d58;
    --gray-600: #525560;
    --gray-550: #5e616e;
    --gray-500: #6c6f7e;
    --gray-450: #787c8c;
    --gray-400: #9194a1;
    --gray-350: #a9abb6;
    --gray-300: #bfc1c9;
    --gray-250: #d6d7dc;
    --gray-200: #e3e4e8;
    --gray-150: #eff0f5;
    --gray-100: #f7f7f9;
    --gray-050: #fbfbfc;
    --gray-000: #ffffff;
    --green-900: #184d25;
    --green-800: #1b612b;
    --green-700: #1e7533;
    --green-600: #2b8f43;
    --green-500: #32b24f;
    --green-400: #40d663;
    --green-300: #95f0ab;
    --green-200: #cbf7d5;
    --green-100: #e5ffeb;
    --green-000: #f5fff8;
    --yellow-900: #755f13;
    --yellow-800: #b89007;
    --yellow-700: #e0b112;
    --yellow-600: #ffcb1a;
    --yellow-500: #ffd74d;
    --yellow-400: #ffe166;
    --yellow-300: #ffec8a;
    --yellow-200: #fff6b8;
    --yellow-100: #fffce5;
    --yellow-000: #fffef5;
    --orange-900: #a84603;
    --orange-800: #c75204;
    --orange-700: #d65c09;
    --orange-600: #eb680e;
    --orange-500: #fa6f0f;
    --orange-400: #ff8a38;
    --orange-300: #ffae75;
    --orange-200: #ffd5b2;
    --orange-100: #ffeee0;
    --orange-000: #fffaf5;
    --red-900: #8f1d22;
    --red-800: #a82229;
    --red-700: #bd222d;
    --red-600: #d62b38;
    --red-500: #e04352;
    --red-400: #f55363;
    --red-300: #ff808d;
    --red-200: #ffb2bb;
    --red-100: #ffe0e4;
    --red-000: #fff0f2;
    --pink-900: #702653;
    --pink-800: #9e3674;
    --pink-700: #c2428e;
    --pink-600: #d63c99;
    --pink-500: #f051b0;
    --pink-400: #f576c2;
    --pink-300: #fa9bd4;
    --pink-200: #ffbde4;
    --pink-100: #fee0f2;
    --pink-000: #fff0f9;
    --purple-900: #2e1757;
    --purple-800: #3f2175;
    --purple-700: #522e8f;
    --purple-600: #6139a8;
    --purple-500: #7548c7;
    --purple-400: #916bd6;
    --purple-300: #b899f0;
    --purple-200: #dac7ff;
    --purple-100: #eae0ff;
    --purple-000: #f6f2ff;
    --textPrimary: var(--gray-050);
    --textSecondary: var(--gray-300);
    --textTertiary: var(--gray-400);
    --textPlaceholder: rgba(145, 148, 161, 0.5);
    --link: var(--blue-400);
    --appBackground: var(--gray-1000);
    --backgroundSecondary: var(--gray-900);
    --backgroundTertiary: var(--gray-850);
    --border: rgba(191, 193, 201, 0.16);
    --borderOpaque: var(--gray-700);
    --iconPrimary: var(--gray-300);
    --iconSecondary: var(--gray-500);
    --inputBackground: rgba(191, 193, 201, 0.12);
    --backgroundPrimary: var(--gray-1000);
    --backgroundElevatedPrimary: var(--gray-900);
    --backgroundElevatedSecondary: rgba(191, 193, 201, 0.04);
    --backgroundElevatedTertiary: rgba(191, 193, 201, 0.08);
    --backgroundInset: var(--gray-900);
    --link-hover: var(--gray-800);
    --color-icon-success: var(--green-600);
    --color-text-danger: var(--red-600);
    --diffLineNumberAdditionBackground: #08260f;
    --diffLineNumberAdditionText: #95f0ab;
    --diffLineAdditionBackground: #061c0b;
    --diffLineNumberDeletionBackground: #3b0507;
    --diffLineNumberDeletionText: #ff808d;
    --diffLineDeletionBackground: #300406;
    --suggestedChangeDeletionText: #ffffff;
    --suggestedChangeAdditionText: #ffffff;
    --suggestedChangeDeletionBackground: rgba(218,54,51,0.6);
    --suggestedChangeAdditionBackground: rgba(46,160,67,0.6);
    --videoBackground: #000000;
}

/* Custom Base Styles */

:root {
    --link-highlight: rgba(46, 143, 255, 0.08);
    --pre-background: var(--backgroundElevatedTertiary);
    --code-background: var(--pre-background);
    --hr-background: var(--borderOpaque);
    --thead-background: var(--pre-background);
    --thead-border: var(--hr-background);
    --tr-border: var(--gray-300);
    --tr-alt-background: var(--pre-background);
    --kbd-background: var(--pre-background);
    --kbd-color: var(--gray-350);
    --kbd-border: var(--gray-750);
    --blockquote-color: var(--gray-400);
    --blockquote-border: var(--hr-background);
    --heading-color: var(--gray-100);
    --h6-color: var(--gray-500);
    --frame-border: var(--hr-background);
    --frame-color: var(--gray-200);
    --mention-color: var(--textPrimary);
    --email-toggle-color: var(--kbd-color);
    --email-toggle-background: var(--blockquote-border);
    --email-quoted-color: var(--blockquote-color);
    --keyword-color: var(--gray-600);
    --code-font: ui-monospace, Menlo, monospace;
}
