/*
:root {
    --background: #dcf2ff;
    --main-theme-color: var(--primary-color);
    --second-theme-color: #1b233a;
    --third-theme-color: #00ffff;

    --font-color: #3688ff;
    --input-color: #3688ff;
    --button-color: #d3d3d3;

    --error-color: #dc3545;
    --error-darkcolor: #942b35;

    --valid-color: green;


    --cancelled-color: #E6B9B8;
    --signed-color: #D7E4BD;
    --waiting-color: #FAC090;


    --box-shadow: 0 5px 20px 0 rgba(109, 110, 111, 0.08);
}
*/
:root{
    --color-primary-background: #53cecb;
    /*    - #293f70 pour les textes
    - #53cecb pour les fonds*/
}
:root {
    /* Font sizes */
    --font-xs: 12px;
    --font-sm: 14px;
    --font-md: 16px;
    --font-lg: 22px;
    --font-xl: 28px;
    --font-xxl: 48px;

    /* Spacing */
    --space-xs: 8px;
    --space-sm: 12px;
    --space-md: 20px;
    --space-lg: 40px;
    --space-xl: 150px;
    --space-xxl: 175px;

    /* Border radius */
    --radius-sm: 0.25rem;
    --radius-md: 0.5rem;
    --radius-lg: 1rem;
    --radius-xl: 1.5rem;

    /* Colors */
    --color-primary: #003FD8;
    --color-primary-dark: #233B74;
    --color-secondary: #1666ad;
    --color-deepblue: #0B0C4F;
    --color-lightblue: #D4F1FF;
    --color-lightgrey: #d9dce3;
    --color-text-light: #FFF;
    --color-muted: #626262;
    --color-input-border: #ced4da;
    --color-dropdown-border: #272735;
}
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap");

html {
    margin: 0;
    padding: 0;
}

body {
    font-family: "Work Sans", sans-serif;
    min-height: 100vh;
    background: #F3F4F9;

}

img.responsive {
    width: 100%;
}

.modal.modal-xl .modal-container {
    box-shadow: none;
    max-width: 1300px
}

.card {
    position: relative;
}

.p-3rem {
    padding:  0 3rem 1rem 3rem;
}

.bg-bleu-sombre {
    background-color: var(--primary-color);
    color: #FFF;
}

.bg-gris-sombre-oblic h2 {
    font-weight: 600;
    font-size: 1.2rem;
    margin: 1rem;
}

.bg-gris-sombre-oblic .card-title {
    font-weight: 600;
    font-size: 1rem;
    margin: 1rem;
}

.bg-gris-sombre-oblic .card-body {
    color: #747474;
    font-size: 0.7rem;
}

#spinner {
    display: none;
    background-color: white;
    opacity: 0.5;
    position: absolute;
    z-index: 999;
    height: 100vh;
    width: 100vw;
}

#spinner.active {
    display: block;
    position: fixed;
}

#spinner>.loading {
    position: absolute;
    top: 50%;
    left: 50%
}

/** Tableaux **/

thead {
    text-align: center;
    background-color: var(--main-theme-color);
    color: white;
    font-size: 12px;
}

thead th {
    border: none;
}

tbody td {
    border: none!important;
    text-align: center;

}

section {
    /* background-color: white; */
    margin-bottom: 20px;
}

.logoBloc a {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.cancelled {
    background-color: var(--cancelled-color);
}

.waiting {
    background-color: var(--signed-color);
}

.signed {
    background-color: var(--waiting-color);
}

.italic {
    font-style: italic;
}

.negatif {
    color: var(--error-color);
}

.entrepriseName {
    font-size: 12px;
}

.message {
    margin: 20px;
}

.custom-loading {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99;
    background-color: rgba(0, 0, 0, 0.75);
}

.loading.loading-lg::after {
    height: 3.6rem;
    margin-left: -0.8rem;
    margin-top: -0.8rem;
    width: 3.6rem;
}

.hidden {
    display: none !important;
}

.logTextClass {
    color: white;
    position: absolute;
    top: 59%;
    left: 45%;
}

.loading::after {
    animation: loading .5s infinite linear;
    background: 0 0;
    border: 0.1rem solid white;
    border-radius: 50%;
    border-right-color: transparent;
    border-top-color: transparent;
    content: "";
    display: block;
    height: 0.8rem;
    left: 50%;
    margin-left: -0.4rem;
    margin-top: -0.4rem;
    opacity: 1;
    padding: 0;
    position: absolute;
    top: 50%;
    width: 0.8rem;
    z-index: 1;
}

#loadingContainerID {
    display: none;
}


.fakedata {
    background-color: #d7524d !important;
}

.uppercase {
    text-transform: uppercase !important;
}

.capitalize {
    text-transform: capitalize !important;
}

.black-overlay {
    background: rgb(0 0 0 / 78%) !important;
    backdrop-filter: blur(10px);
}

.custom-card {
    height: 100%;
    border-radius: 12px !important;
    border: none;
    background-color: white !important;
    color: var(--primary-text-color) !important;
}


form input[type=text], form input[type=password], form input[type=email] {
    padding: 20px !important;
    border-color: #0B0C4F33 !important;
    border-radius: 12px !important;
    border-width: 2px !important;
    height: 60px;
}

form select{
    height: 60px!important;
    padding: 0px 20px!important;
}

/* CSS for mobile devices using Bootstrap breakpoints */
@media (max-width: 576px) {
    .form-signin{
        margin: 0 1em;
    }
}


@media (max-width: 992px) {
    :root {
        --font-xs: 11px;
        --font-sm: 13px;
        --font-md: 12px;
        --font-lg: 20px;
        --font-xl: 24px;
        --font-xxl: 36px;

        --space-sm: 10px;
        --space-md: 16px;
        --space-lg: 30px;
        --space-xl: 60px;
        --space-xxl: 120px;
    }
}

@media (max-width: 640px) {
    :root {
        --font-xs: 10px;
        --font-sm: 12px;
        --font-md: 14px;
        --font-lg: 18px;
        --font-xl: 20px;
        --font-xxl: 28px;

        --space-sm: 8px;
        --space-md: 12px;
        --space-lg: 20px;
        --space-xl: 60px;
        --space-xxl: 80px;
    }

    .container-spacer > .row{
        padding: 0;
        margin: 0;
    }
}

@media(min-width: 768px) {}

@media(max-width: 767px) {}

@media (max-width: 840px) {
    .col-md-4 {
        width: 33.33333333%;
        margin: 15px 0px;
    }
}