@import "bootstrap/accordion.css";
@import "bootstrap/alert.css";
@import "bootstrap/badge.css";
@import "bootstrap/breadcrumb.css";
@import "bootstrap/button.css";
@import "bootstrap/card.css";
@import "bootstrap/dropdown.css";
@import "bootstrap/forms.css";
@import "bootstrap/list-group.css";
@import "bootstrap/modal.css";
@import "bootstrap/nav.css";
@import "bootstrap/offcanvas.css";
@import "bootstrap/pagination.css";
@import "bootstrap/progress.css";
@import "bootstrap/spinners.css";
@import "bootstrap/table.css";
@import "bootstrap/toasts.css";
@import "breakpoint.css";
@import "color.css";
@import "quickgrid.css";
@import "sidebar.css";

:root, [data-bs-theme="light"] {
    /*todo: revalider l'utilisation des font customs :  Native font stack https://getbootstrap.com/docs/5.3/content/reboot/#native-font-stack */
    --bs-font-sans-serif: "Open Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    /*couleur Bootstrap*/
    --bs-primary: var(--teluq-vert-26); /* #2A8906;*/ /*#388515;*/
    --bs-primary-rgb: 44, 130, 4; /*42, 137, 6;*/ /*56, 133, 21;*/
    --bs-danger: #BA1A1A;
    --bs-danger-rgb: 186, 26, 26;
    --bs-link-color: var(--bs-primary);
    --bs-link-color-rgb: var(--bs-primary-rgb);
    --bs-link-hover-color: #29640f; /*var(--bs-link-color)*/
    --bs-link-hover-color-rgb: 41, 100, 15; /*var(--bs-link-color-rgb)*/
    --bs-form-invalid-color: #BA1A1A;
    --bs-form-invalid-border-color: #BA1A1A;
    /*--bs-code-color: #414141;*/
    --bs-focus-ring-color-rgb: 155, 215, 123;
    /*couleur TELUQ*/
    /*gris*/
    --teluq-gris-14: #242424;
    --teluq-gris-24: #404142;
    --teluq-gris-24-rgb: 64, 65, 66;
    --teluq-gris-38: #5F6061;
    --teluq-gris-44: #6E6F70;
    --teluq-gris-52: #838485;
    --teluq-gris-60: #969A9C;
    --teluq-gris-72: #B5B8BB;
    --teluq-gris-82: #CED1D4;
    --teluq-gris-88: #DEE0E3;
    --teluq-gris-92: #ECEEF0;
    --teluq-gris-94: #F2F4F6;
    --teluq-gris-96: #F5F7F9;
    --teluq-gris-96-rgb: 245, 247, 249;
    --teluq-gris-98: #F9FAFB;
    --teluq-gris-98-rgb: 249, 250, 251;
    /*vert*/
    --teluq-vert-02: #040603;
    --teluq-vert-08: #131B0E;
    --teluq-vert-12: #1A2B12;
    --teluq-vert-16: #223D15;
    --teluq-vert-20: #295115;
    --teluq-vert-22: #2C5F12;
    --teluq-vert-24: #2F700C;
    --teluq-vert-26: #2C8204;
    --teluq-vert-34: #429518;
    --teluq-vert-42: #5AA731;
    --teluq-vert-52: #74BA4E;
    --teluq-vert-64: #97CE78;
    --teluq-vert-74: #B3DF9C;
    --teluq-vert-86: #D5F1C6;
    --teluq-vert-90: #E0F6D5;
    --teluq-vert-92: #E6F7DD;
    --teluq-vert-94: #EEF6EA;
    --teluq-vert-96: #F4F9F1;
    --teluq-vert-98: #F9FCF8;
    /*bleu*/
    --teluq-bleu-10: #FBFEFF;
    --teluq-bleu-20: #EAF4FF;
    --teluq-bleu-30: #D6ECFF;
    --teluq-bleu-40: #ABD8FF;
    --teluq-bleu-50: #7DC2FF;
    --teluq-bleu-60: #49B0FF;
    --teluq-bleu-70: #3098DE;
    --teluq-bleu-80: #1A7FBA;
    --teluq-bleu-90: #036B9F;
    --teluq-bleu-100: #024E75;
    /*rouge*/
    --teluq-rouge-10: #FFFBFF;
    --teluq-rouge-20: #FFEDEA;
    --teluq-rouge-30: #FFDAD6;
    --teluq-rouge-40: #FFB4AB;
    --teluq-rouge-50: #FF897D;
    --teluq-rouge-60: #FF5449;
    --teluq-rouge-70: #DE3730;
    --teluq-rouge-80: #BA1A1A;
    --teluq-rouge-90: #A2000B;
    --teluq-rouge-100: #770008;
    /*statut cours*/
    --teluq-statut-a-faire: #0ABCFF;
    --teluq-statut-en-attente: #FAC74D;
    --teluq-statut-en-cours: #FC934A;
    --teluq-statut-reussi: #75D15C;
    --teluq-statut-abandonne: #BFB3F4;
    --teluq-statut-echoue: #F65651;
    --teluq-statut-excellent: #57C75C;
    --teluq-statut-non-fait: #57C75C;
}

[data-bs-theme="dark"] {
    color-scheme: dark;
}

/*body*/
body {
    overflow: hidden scroll;
}

main {
    min-height: calc(100vh - 151px); /*patch temporaire pour mettre le footer au bas de l'écran lorsque contenu < viewport*/
}

@media (max-width: 992px) {
    main {
        min-height: calc(100vh - 170px);
    }
}

/*typo*/
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 500;
    margin-bottom: 1rem;
}

    h1:focus-visible {
        outline: none;
    }

    h1.emphasis:after,
    .h1.emphasis:after {
        content: "";
        display: block;
        height: .375rem;
        width: 4.75rem; 
        /*height: 5px;*/ /*V1*/
        /*width: 70px;*/ /*V1*/
        background-color: var(--bs-primary);
        margin-top: .625rem; 
        /*margin-top: 16px;*/ /*V1*/
    }

.fs-7 {
    font-size: 0.875rem;
}

/* hr */
.hr {
    height: 1px;
    background-color: var(--teluq-gris-82);
    margin: 1rem 0;
}

/*external link*/
.link-external,
.link-external-end {
    text-decoration: none;
}

    .link-external > :first-child,
    .link-external-end > :first-child {
        text-decoration: underline;
    }

    .link-external:before {
        display: inline;
        font-family: phosphor;
        content: "\E5DE";
        vertical-align: -.125em;
        font-size: 1.25rem;
        font-weight: 400;
        line-height: 1;
        margin-right: .5rem;
    }

    .link-external-end:after {
        display: inline;
        font-family: phosphor;
        content: "\E5DE";
        vertical-align: -.125em;
        font-size: 1.25rem;
        font-weight: 400;
        line-height: 1;
        margin-left: .5rem;
    }

.link-back {
    text-decoration: none;
    color: var(--teluq-gris-24);
}

    .link-back:before {
        content: "\E058";
        font-family: "Phosphor";
        display: inline;
        vertical-align: -.125em;
        font-size: 1.25rem;
        font-weight: 400;
        line-height: 1;
        margin-right: .25rem;
    }

/*badge*/
.badge-profil {
    height: 2.5rem;
    width: 2.5rem;
}

    .badge-profil.large {
        height: 3.5rem;
        width: 3.5rem;
    }

/*sticky*/
.sticky-max-content {
    width: max-content;
}

.sticky-aide {
    float: right !important;
    margin-top: -3rem;
}

/*phosphor icon*/
.ph,
.ph-fill {
    vertical-align: -.125em;
}