/**
 * Do not edit directly, this file was auto-generated.
 */

/* Source scoped these to [data-brand='dahl']. This export contains only Dahl, so they
   are promoted to :root — no data-brand attribute needed. */
:root {
  --sg-color-accent-100: #f0f9ff;
  --sg-color-accent-200: #e0f3ff;
  --sg-color-accent-300: #c2e8ff;
  --sg-color-accent-400: #99d8ff;
  --sg-color-accent-500: #57bfff;
  --sg-color-accent-600: #0fa3ff;
  --sg-color-accent-700: #007ecc;
  --sg-color-accent-800: #00578d; /** Brand value, used as supplied */
  --sg-color-accent-900: #003c61;
  --sg-color-accent-1000: #001f33;
  --sg-font-family-heading: 'Lato', Arial, 'Helvetica Neue', sans-serif;
  --sg-color-accent-brand: var(--sg-color-accent-800); /** The colour the brand supplied, which sits at step 800. */
  --sg-color-accent-brand-darker: var(--sg-color-accent-900); /** One step below the colour the brand supplied, at step 900. */
  --sg-link-inverted-hover: var(--sg-color-accent-100);
  --sg-shape-input: var(--sg-radius-4); /** A field, a badge, a plain tooltip. Small boxes holding one line. */
  --sg-shape-action: var(--sg-radius-8); /** A button, an accordion header, a table. Boxes you press or scan, wider than they are tall. */
  --sg-shape-container: var(--sg-radius-12); /** Anything holding other components: a list, a dropdown, an alert, a tree. */
  --sg-shape-panel: var(--sg-radius-12); /** A card or a dialog. The largest boxes, and the only ones round enough to be noticed as round. */
  --sg-surface-hover: var(--sg-color-accent-200);
}