:root {
    --brand-color-1: #337ab7;
    --brand-color-2: #7a98cc;
    --brand-color-3: #9ab8cf;
    --brand-color-4: #9ab8ea;

    --dark-grey: #374241;
    --dark-grey-2: #485352;
    --medium-grey: #999999;
    --light-grey: #aaaaaa;

    --default-font-color: var(--dark-grey);

    --border-color: #6fa0df;
    --border-radius: .35em;

    --page-background-color: #f8f9fd;

    --table-header-background-color: #d7defb;
    --table-border-color: #9ab8cf;

    --main-nav-border-radius: .25em;

    --main-nav-tab-background-color: #0000004a;
    --main-nav-tab-border-color: #bababa;
    --main-nav-tab-font-color: #fff;

    --main-nav-tab-hover-background-color: #e5f1ff;
    --main-nav-tab-hover-border-color: #5b6a84;
    --main-nav-tab-hover-font-color: #404040;

    --main-nav-tab-active-background-color: #e5f1ff;
    --main-nav-tab-active-border-color: #5b6a84;
    --main-nav-tab-active-font-color: #000;

    --main-nav-tab-disabled-background-color: #0000001f;
    --main-nav-tab-disabled-border-color: #dedede;
    --main-nav-tab-disabled-font-color: #bfbfbfd1;

    --header-panel-border-radius: .35em;

    --header-panel-tab-background-color: #e9e9e9;
    --header-panel-tab-font-color: #dddddd;

    --header-panel-tab-hover-background-color: #fff;
    --header-panel-tab-hover-font-color: #000;

    --header-panel-tab-active-background-color: var(--brand-color-1);
    --header-panel-tab-active-font-color: #ffffff;

    --header-panel-tab-disabled-background-color: #ffffff;
    --header-panel-tab-disabled-font-color: #888888;

    /* --form-background: #d0def0; */
    --form-background: #6fa1dc70;

    --font-family-default: arial,tahoma,helvetica,sans-serif;

}

.environment-banner {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    padding: 0.5rem 1.25rem;
    text-align: center;
    font-weight: 600;
    letter-spacing: 0.03em;
}

.environment-banner__label {
    text-transform: uppercase;
}

.environment-banner__message {
    font-weight: 500;
}

.environment-banner--development {
    background-color: #2c7be5;
    color: #ffffff;
}

.environment-banner--staging {
    background-color: #f0ad4e;
    color: #1f1f1f;
}
