/* Copyright 2020 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */
/**
 * These are the new set of colors for the new Light/Dark themes. See
 * https://crbug.com/1122511 and
 * https://docs.google.com/document/d/1QrSSRsJRzaQBY3zz73ZL84bTcFUV60yMtE5cuu6ED14
 * for details.
*/
:root {
  --color-primary: #1a73e8;
  --color-primary-variant: #4285f4;
  --color-background: #fff;
  --color-background-elevation-1: #f1f3f4;
  --color-background-elevation-2: #dee1e6;
  --color-background-highlight: #cacdd1;
  --color-text-primary: #202124;
  --color-text-secondary: #5f6368;
  --color-text-disabled: #80868b;
  --color-details-hairline: #cacdd1;
  --color-accent-red: #d93025;
  --color-accent-green: #188038;
  --color-link: var(--color-primary);
  --color-syntax-1: #c80000;
  --color-syntax-2: #881280;
  --color-syntax-3: #1a1aa6;
  --color-syntax-4: #994500;
  --color-syntax-5: #84f0ff;
  --color-syntax-6: #236e25;
  --color-syntax-7: #303942;
  --color-syntax-8: #a894a6;
  --drop-shadow:
    0 0 0 1px rgb(0 0 0 / 5%),
    0 2px 4px rgb(0 0 0 / 20%),
    0 2px 6px rgb(0 0 0 / 10%);
  --box-shadow-outline-color: rgb(0 0 0 / 50%);
}

.-theme-with-dark-background {
  --color-primary: #8ab4f8;
  --color-primary-variant: #669df6;
  --color-background: #202124;
  --color-background-elevation-1: #292a2d;
  --color-background-elevation-2: #35363a;
  --color-background-highlight: #4b4c4f;
  --color-text-primary: #e8eaed;
  --color-text-secondary: #9aa0a6;
  --color-text-disabled: #80868b;
  --color-details-hairline: #494c50;
  --color-accent-red: #f28b82;
  --color-accent-green: #81c995;
  --color-link: var(--color-primary);
  --color-syntax-1: #35d4c7;
  --color-syntax-2: #5db0d7;
  --color-syntax-3: #f29766;
  --color-syntax-4: #9bbbdc;
  --color-syntax-5: #84f0ff;
  --color-syntax-6: #898989;
  --color-syntax-7: #cfd0d0;
  --color-syntax-8: #5db0d7;
  --drop-shadow:
    0 0 0 1px rgb(255 255 255 / 20%),
    0 2px 4px 2px rgb(0 0 0 / 20%),
    0 2px 6px 2px rgb(0 0 0 / 10%);
  --box-shadow-outline-color: rgb(0 0 0 / 50%);
}
