/**
 * @license
 * Generated by Zeplin
 * Copyright (C) 2025 - present Zeplin
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at

 *     http://www.apache.org/licenses/LICENSE-2.0

 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

:root {

}

.Mode-A {
  --color-black: #01303f;
  --color-gray: #677c8b;
  --color-gray-subtle: #d9d9d9;
  --color-blue-subtle: #e7ebee;
  --color-white: #fff;
  --color-white-40: rgba(255, 255, 255, 0.4);
  --color-white-60: rgba(255, 255, 255, 0.6);
  --color-brand-blue: #02a9f7;
  --color-action: #0474bc;
  --color-icon-a: var(--color-black); // 2
  --color-icon-b: var(--color-blue-subtle); // 1
  --color-icon-white: var(--color-white);  // 2
  --color-infobox: #f2f4fd;
}

.Mode-B {
  /* Black */
  --color-black: #01303f;

  /* Gray */
  --color-gray: #677c8b;

  /* Gray subtle */
  --color-gray-subtle: #d9d9d9;

  /* Blue subtle */
  --color-blue-subtle: #e7ebee;

  /* White */
  --color-white: #fff;

  /* White 40 */
  --color-white-40: rgba(255, 255, 255, 0.4);

  /* White 60 */
  --color-white-60: rgba(255, 255, 255, 0.6);

  /* Brand blue */
  --color-brand-blue: #02a9f7;

  /* Action */
  --color-action: #0474bc;

  /* Icon A */
  --color-icon-a: var(--color-white); // 1

  /* Icon B */
  --color-icon-b: var(--color-gray); // 1

  /* Icon White */
  --color-icon-white: var(--color-black); // 1

  /* Infobox */
  --color-infobox: #f2f4fd;
}

.Mode-C {
  /* Black */
  --color-black: #01303f;

  /* Gray */
  --color-gray: #677c8b;

  /* Gray subtle */
  --color-gray-subtle: #d9d9d9;

  /* Blue subtle */
  --color-blue-subtle: #e7ebee;

  /* White */
  --color-white: #fff;

  /* White 40 */
  --color-white-40: rgba(255, 255, 255, 0.4);

  /* White 60 */
  --color-white-60: rgba(255, 255, 255, 0.6);

  /* Brand blue */
  --color-brand-blue: #02a9f7;

  /* Action */
  --color-action: #0474bc;

  /* Icon A */
  --color-icon-a: var(--color-action); // 1

  /* Icon B */
  --color-icon-b: var(--color-white); // 1

  /* Icon White */
  --color-icon-white: var(--color-white); // 2

  /* Infobox */
  --color-infobox: #f2f4fd;
}