/* add font variables */
@font-face {
    font-family: Nunito-Bold;
    src: url(../../fonts/Nunito/static/Nunito-Bold.ttf);
    font-weight: 700;
}
@font-face {
    font-family: Nunito-Medium;
    src: url(../../fonts/Nunito/static/Nunito-Medium.ttf);
}
@font-face {
    font-family: Nunito-Italic;
    src: url(../../fonts/Nunito/static/Nunito-Italic.ttf);
    font-style: italic;
}
@font-face {
    font-family: Nunito-Regular;
    src: url(../../fonts/Nunito/static/Nunito-Regular.ttf);
    font-weight: 400;
}
@font-face {
    font-family: Nunito-SemiBold;
    src: url(../../fonts/Nunito/static/Nunito-SemiBold.ttf);
    font-weight: 600;
}

:root {
    --primary-color: #0000000d;
    --secondary-color: #6c757d;

    --background-light: #f4f7fa;
    --background-grey: #65656505;

    --theme-color: #0077ff;
    --theme-color-dark: #0070d1;
    --theme-color-light: #1e83ff;
    --theme-color-accent: #74a0ff;
    --theme-color-bg-light: #f0f7ff;
    --danger-color: #ff0019;
    --white-color: #ffffff;
    --black-color: #000000;
    --text-black: #000000;
    --text-white: #ffffff;

    --border-grey: rgb(177, 177, 177);
    --background-light-gradient: #f8fafb;
    --background-dark-gradient: rgba(0, 0, 0, 0.2);
    --background-grey: #d1d1d105;

    --card-background: #f0f0f0;
    --text-dark: #343a40;
    --text-medium: #6c757d;
    --border-color: #e9ecef;
    --shadow: 0 4px 12px rgba(0, 0, 0, 0.05);

    --font-bold: 'Nunito-Bold', 'Nunito', sans-serif !important;
    --font-medium: 'Nunito-Medium', 'Nunito', sans-serif !important;
    --font-italic: 'Nunito-Italic', 'Nunito', sans-serif !important;
    --font-regular: 'Nunito-Regular', 'Nunito', sans-serif !important;
    --font-semibold: 'Nunito-SemiBold', 'Nunito', sans-serif !important;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}