﻿:root {
    /* Colors: */
    --selection-background: #d7e2fa;
    --color-primary-accent: #ff7800;
    --color-secondary-accent: #001a71;
    /* warning */
    --color-warning: darkorange;
    --color-warning-light: color-mix(in srgb, var(--color-warning), white 25%);
    --color-warning-lighter: color-mix(in srgb, var(--color-warning), white 50%);
    --color-warning-lightest: color-mix(in srgb, var(--color-warning), white 75%);
    /* waiting */
    --color-waiting: dimgray;
    --color-waiting-light: color-mix(in srgb, var(--color-waiting), white 25%);
    --color-waiting-lighter: color-mix(in srgb, var(--color-waiting), white 50%);
    --color-waiting-lightest: color-mix(in srgb, var(--color-waiting), white 75%);
    /* --color-disabled */
    --color-disabled: lightgray;
    --color-disabled-light: color-mix(in srgb, var(--color-disabled), white 25%);
    --color-disabled-lighter: color-mix(in srgb, var(--color-disabled), white 50%);
    --color-disabled-lightest: color-mix(in srgb, var(--color-disabled), white 75%);
    /* error */
    --color-error: red;
    --color-error-light: color-mix(in srgb, var(--color-error), white 25%);
    --color-error-lighter: color-mix(in srgb, var(--color-error), white 50%);
    --color-error-lightest: color-mix(in srgb, var(--color-error), white 75%);
    /* success */
    --color-success: forestgreen;
    --color-success-light: color-mix(in srgb, var(--color-success), white 25%);
    --color-success-lighter: color-mix(in srgb, var(--color-success), white 50%);
    --color-success-lightest: color-mix(in srgb, var(--color-success), white 75%);
    /* failure */
    --color-failure: darkred;
    --color-failure-light: color-mix(in srgb, var(--color-failure), white 25%);
    --color-failure-lighter: color-mix(in srgb, var(--color-failure), white 50%);
    --color-failure-lightest: color-mix(in srgb, var(--color-failure), white 75%);
    /* active/performer/business */
    --color-active: #8fff00;
    --color-performer: #f5bc3f;
    --color-business: #ff824d;
    --color-mission: #5dfac8;
    /* Measurements: */
    --top-bar-height: 55px;
    --detail-view-width: 400px;
    /* Icons */
    --icon-color-default: #a1a1a1;
    --icon-color-disabled: #a1a1a13b;
    /* Fonts: */
    --font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --font-size-largest: 1.25rem; /* 20px */
    --font-size-larger: 1.125rem; /* 18px */
    --font-size-normal: 1rem; /* 16px */
    --font-size-smaller: 0.875rem; /* 14px */
    --font-size-smallest: 0.75rem; /* 12px */
    --font-weight-bold: 600;
    /* Analytics */
    --color-analytics-background: rgb(243, 243, 243);
}
