/**
 * Copyright 2026 The WPT Dashboard Project. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

/*
 * Theme tokens shared by every page and component. Custom properties are
 * inherited into shadow roots, so both Polymer and Lit components can use
 * them.
 *
 * The colors are the Material Design palette values that wpt.fyi used through
 * @polymer/paper-styles/color.js (--paper-<color>-<shade>), with the same
 * names under a --wpt- prefix. Only the shades in use are defined; add others
 * from the same palette as needed.
 */
:root {
  --wpt-amber-300: #ffd54f;

  --wpt-blue-100: #bbdefb;
  --wpt-blue-300: #64b5f6;
  --wpt-blue-500: #2196f3;
  --wpt-blue-700: #1976d2;
  --wpt-blue-900: #0d47a1;

  --wpt-green-300: #81c784;
  --wpt-green-500: #4caf50;
  --wpt-green-700: #388e3c;

  --wpt-grey-100: #f5f5f5;
  --wpt-grey-200: #eeeeee;
  --wpt-grey-300: #e0e0e0;
  --wpt-grey-600: #757575;

  --wpt-light-blue-100: #b3e5fc;
  --wpt-light-blue-500: #03a9f4;

  --wpt-light-green-300: #aed581;

  --wpt-lime-300: #dce775;

  --wpt-orange-300: #ffb74d;

  --wpt-red-100: #ffcdd2;
  --wpt-red-300: #e57373;
  --wpt-red-500: #f44336;
  --wpt-red-700: #d32f2f;

  --wpt-yellow-300: #fff176;
  --wpt-yellow-500: #ffeb3b;

  /* The 2dp elevation shadow of paper-styles/shadow.js (--shadow-elevation-2dp). */
  --wpt-shadow-2dp: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
                    0 1px 5px 0 rgba(0, 0, 0, 0.12),
                    0 3px 1px -2px rgba(0, 0, 0, 0.2);
}