:root {
    --color-blue: #1D30DB;
    --color-skyblue: #00CDFC;
    --color-darkblue: #051390;
    --color-skyblue2: #04CDFC;
    --color-red: #FF4040;
    --color-grey: #6C6868;
    --color-grey2: #F8F8FD;
    --color-grey3: #EEEEEE;
    --color-disabledGrey: #D5D5D5;
    --color-black: #1E1E1E;
    --color-blackFooter: #202430;
    --color-green: #45FF77;
}

@font-face {
    font-family: "GothamR";
    font-style: normal;
    font-weight: 600;
    src: url("../assets/fonts/Gotham Rounded Bold.otf");
}

@font-face {
    font-family: "GothamR";
    font-style: normal;
    font-weight: 500;
    src: url("../assets/fonts/Gotham Rounded Medium.otf");
}

@font-face {
    font-family: "GothamR";
    font-style: normal;
    font-weight: 400;
    src: url("../assets/fonts/Gotham Rounded Book.otf");
}

@font-face {
    font-family: "GothamR";
    font-style: normal;
    font-weight: 300;
    src: url("../assets/fonts/Gotham Rounded Light.otf");
}

* {
    font-family: "GothamR";
}

.bg-now-blue {
    background-color: var(--color-blue);
}

.bg-now-darkblue {
    background-color: var(--color-darkblue);
}

.bg-now-skyblue {
    background-color: var(--color-skyblue);
}

.bg-now-skyblue2 {
    background-color: var(--color-skyblue2);
}

.bg-now-red {
    background-color: var(--color-red);
}

.bg-now-grey {
    background-color: var(--color-grey);
}

.bg-now-grey2 {
    background-color: var(--color-grey2);
}

.bg-now-grey3 {
    background-color: var(--color-grey3);
}

.bg-now-disabledGrey {
    background-color: var(--color-disabledGrey);
}

.bg-now-black {
    background-color: var(--color-black);
}

.bg-now-blackFooter {
    background-color: var(--color-blackFooter);
}

.bg-now-green {
    background-color: var(--color-green);
}

    *,
    *:after,
    *:before {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        text-decoration: none;
    }

html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

.header-logo{
    width: auto;
    height : 40px
}

.navbar-collapse .dropdown-item:hover {
    background-color: var(--color-blue) !important;
}

.required-field::after {
    content: "*";
    color: red;
    margin-left: 4px;
}

.font-blue {
    color: var(--color-blue);
}

.chart-container {
    background: white;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    position: relative;
    height: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chart-container-canvas {
    max-height: 100% !important;
}