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

:root {
    --blue-900: #05264c;
    --blue-800: #032f62;
    --blue-700: #044289;
    --blue-600: #005cc5;
    --blue-500: #0366d6;
    --blue-400: #2188ff;
    --blue-300: #79b8ff;
    --blue-200: #c8e1ff;
    --blue-100: #dbedff;
    --blue-000: #f1f8ff;
    --gray-1000: #050505;
    --gray-950: #0b0b0d;
    --gray-900: #17181a;
    --gray-850: #242528;
    --gray-800: #2f3037;
    --gray-750: #383a42;
    --gray-700: #41434e;
    --gray-650: #4b4d58;
    --gray-600: #525560;
    --gray-550: #5e616e;
    --gray-500: #6a6d7c;
    --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: #144620;
    --green-800: #165c26;
    --green-700: #176f2c;
    --green-600: #22863a;
    --green-500: #28a745;
    --green-400: #34d058;
    --green-300: #85e89d;
    --green-200: #bef5cb;
    --green-100: #dcffe4;
    --green-000: #f0fff4;
    --yellow-900: #735c0f;
    --yellow-800: #b08800;
    --yellow-700: #dbab09;
    --yellow-600: #f9c513;
    --yellow-500: #ffd33d;
    --yellow-400: #ffdf5d;
    --yellow-300: #ffea7f;
    --yellow-200: #fff5b1;
    --yellow-100: #fffbdd;
    --yellow-000: #fffdef;
    --orange-900: #a04100;
    --orange-800: #c24e00;
    --orange-700: #d15704;
    --orange-600: #e36209;
    --orange-500: #f66a0a;
    --orange-400: #fb8532;
    --orange-300: #ffab70;
    --orange-200: #ffd1ac;
    --orange-100: #ffebda;
    --orange-000: #fff8f2;
    --red-900: #86181d;
    --red-800: #9e1c23;
    --red-700: #b31d28;
    --red-600: #cb2431;
    --red-500: #d73a49;
    --red-400: #ea4a5a;
    --red-300: #f97583;
    --red-200: #fdaeb7;
    --red-100: #ffdce0;
    --red-000: #ffeef0;
    --pink-900: #6d224f;
    --pink-800: #99306f;
    --pink-700: #b93a86;
    --pink-600: #d03592;
    --pink-500: #ea4aaa;
    --pink-400: #ec6cb9;
    --pink-300: #f692ce;
    --pink-200: #f9b3dd;
    --pink-100: #fedbf0;
    --pink-000: #ffeef8;
    --purple-900: #29134e;
    --purple-800: #3a1d6e;
    --purple-700: #4c2888;
    --purple-600: #5a32a3;
    --purple-500: #6f42c1;
    --purple-400: #8a63d2;
    --purple-300: #b392f0;
    --purple-200: #d1bcf9;
    --purple-100: #e6dcfd;
    --purple-000: #f5f0ff;
    --textPrimary: var(--gray-1000);
    --textSecondary: var(--gray-700);
    --textTertiary: var(--gray-500);
    --textPlaceholder: rgba(82, 85, 96, 0.5);
    --link: var(--blue-500);
    --appBackground: var(--gray-000);
    --backgroundSecondary: var(--gray-000);
    --backgroundTertiary: var(--gray-000);
    --border: rgba(65, 67, 78, 0.25);
    --borderOpaque: var(--gray-300);
    --iconPrimary: var(--gray-600);
    --iconSecondary: var(--gray-400);
    --inputBackground: rgba(65, 67, 78, 0.12);
    --backgroundPrimary: var(--gray-150);
    --backgroundElevatedPrimary: var(--gray-150);
    --backgroundElevatedSecondary: var(--gray-000);
    --backgroundElevatedTertiary: var(--gray-000);
    --backgroundInset: var(--gray-200);
    --link-hover: var(--gray-200);
    --color-icon-success: var(--green-600);
    --color-text-danger: var(--red-600);
    --diffLineNumberAdditionBackground: #dcffe4;
    --diffLineNumberAdditionText: #22863a;
    --diffLineAdditionBackground: #f0fff4;
    --diffLineNumberDeletionBackground: #ffdce0;
    --diffLineNumberDeletionText: #cb2431;
    --diffLineDeletionBackground: #ffeef0;
    --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(3, 102, 214, 0.08);
    --pre-background: var(--gray-100);
    --code-background: var(--pre-background);
    --hr-background: var(--gray-200);
    --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-650);
    --kbd-border: var(--gray-250);
    --blockquote-color: var(--gray-500);
    --blockquote-border: var(--hr-background);
    --heading-color: var(--gray-900);
    --h6-color: var(--gray-500);
    --frame-border: var(--hr-background);
    --frame-color: var(--gray-850);
    --mention-color: var(--gray-850);
    --email-toggle-color: var(--kbd-color);
    --email-toggle-background: var(--blockquote-border);
    --email-quoted-color: var(--blockquote-color);
    --keyword-color: var(--gray-400);
    --code-font: ui-monospace, Menlo, monospace;
}
