@import './colors';

$max_width: 1800px;

$width_lg: 1904px;
$width_md: 1264px;
$width_sm: 960px;
$width_xs: 600px;
$width_xxs: 400px;

$container_padding_xl: 30px 18vw;
$container_padding_lg: 30px 8vw;
$container_padding_md: 30px 24px;
$container_padding_sm: 30px 24px;
$container_padding_xs: 30px 24px;

$navbar_height_offset_xl: 140px;
$navbar_height_offset_lg: 140px;
$navbar_height_offset_md: 140px;
$navbar_height_offset_sm: 15px;
$navbar_height_offset_xs: 15px;

$primary-color: $black;
$primary-color-light: $gray;
$primary-color-xlight: $gray-light;

$secondary-color: $red;
$secondary-color-light: $red-light;
$secondary-color-xlight: $red-xlight;

$background-color: $dark-white;
$button: $button-gray;

@if $VUE_APP_DEFAULT_NETWORKID == 5 {
    $secondary-color: $blue;
    $secondary-color-light: $blue-light;
    $secondary-color-xlight: $blue-light2;
}

$bg-light: $white;

$h2_xs: 18px;
$h2_s: 20px;
$h2_m: 22px;

$box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.05);

.force-ellipsis {
    word-break: keep-all;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@import './mobile';
@import './typography';
@import './components/common';
@import './components/styles';
