/* Police spécifique */
    /* @font-face kit by Fonts2u (https://fonts2u.com) */ 
    @font-face {
        font-family:"Bus Stop Regular";
        src:    url("fonts/bus-stop.eot") format("eot"),
                url("fonts/bus-stop.woff") format("woff"),
                url("fonts/bus-stop.ttf") format("truetype"),
                url("fonts/bus-stop.svg#BusStop") format("svg");
        font-weight: normal;
        font-style: normal;
    }

    *::-webkit-scrollbar{
        display: none;
    }

    /* *::-webkit-scrollbar{
        display: block;
        height: 10px;
        width: 10px;
        border-radius: 5px;
        margin: 5px 0;
    }

    *::-webkit-scrollbar-thumb{
        background: #22222200;
    }

    *:hover::-webkit-scrollbar-thumb{
        background: #22222280;
    } */


/* Style réutilisable non disponible sur Bootstrap */
    /* Width & Heigth */
        .w-h-fenetre{
            width: 100dvw;
            max-width: 100dvw;
            min-width: 100dvw;
            height: 100dvh;
            max-height: 100dvh;
            min-height: 100dvh;
        }

        .w-h-fenetre-nav{
            min-width: calc(100dvw - 70px);
            width: calc(100dvw - 70px);
            max-width: calc(100dvw - 70px);
            min-height: calc(100dvw - 100px);
            height: calc(100dvw - 100px);
            max-height: calc(100dvw - 100px);
        }

        .app{
            width: calc(100dvw - 70px);
            max-width: calc(100dvw - 70px);
            min-width: calc(100dvw - 70px);
            padding: 0;
            margin: 0 0 0 70px;
            height: 100dvh;
            max-height: 100dvh;
            min-height: 100dvh;
            overflow: hidden;
        }

        .nav-icon-size{
            font-size: 30px;
        }
        
        .child-element-100>*{
            min-width: 100%;
            max-width: 100%;
            width: 100%;
            height: 100%;
            max-height: 100%;
            min-height: 100%;
        }
    /* D-Flex */
        .g-5{
            gap: 5px;
        }

        .g-10{
            gap: 10px;
        }
        .g-20{
            gap: 20px;
        }

    /* Text */
        .text-tab{
            font-family: 'Bus Stop Regular';
        }

        .text-supp{
            text-decoration:line-through;
        }

    /* Colors */
        .bg-bluelight{
            background-color: #E5EDF1;
        }

        .bg-bluegrey{
            background-color: #E5EDF1;
        }

        .text-success-light{
            color: #D1E7DD;
        }
        .text-danger-light{
            color: #F8D7DA;
        }
        .text-primary-light{
            color: #CFE2FF;
        }

        .text-directeur{
            color: #b10202;
        }

        .text-adjoint{
            color: #0a53a8;
        }

        .text-gold{
            color: #D4AF37;
        }

        .text-silver{
            color: #C0C0C0;
        }

        .text-bronze{
            color: #C48C49;
        }

        .bg-gold{
            background-color: #D4AF37;
        }

        .bg-silver{
            background-color: #C0C0C0;
        }

        .bg-bronze{
            background-color: #C48C49;
        }

        .container-table-striped:nth-child(2n){
            background-color: #222222;
        }

        .element-liste-striped:nth-of-type(2n){
            background-color: #F1F1F1;
            /* border-bottom: 1px solid dark; */
        }

        .border-child-none *{
            border: none !important;
        }

        .border-childs-none>*{
            border: none !important;
        }

        .rounded-child-none *{
            border-radius: 0 !important;
        }

        .div-rounded-15:first-child{
            border-radius: 15px 15px 0 0;
        }

        .div-rounded-15:last-child{
            border-radius: 0 0 15px 15px;
        }

    /* Autres */
        .cursor:hover{
            cursor: pointer;
        }

        .popover-modal{
            position: absolute;
            display: none;
            width: max-content;
            top: 50%;
            left: 50%;
            transform: translateX(-50%) translateY(-50%);
            background-color: #C0C0C0;
            padding: 2px 5px;
            border-radius: 5px;
            box-shadow: #222222 2px 2px  30px;
        }

        .text-nowrap{
            white-space: nowrap;
        }

        .progress-bar:hover .popover-modal{
            display: block;
        }

        table tr:last-of-type>th,
        table tr:last-of-type>td{
            border-bottom: none;
        }

        table tr:nth-of-type(2n) input{
            background-color: rgba(0, 0, 0, 0.075);
        }
        
        .hover:hover{
            background-color: rgba(0, 0, 0, 0.075);
        }

        .hover-light{
            background-color: #222222;
        }
        .hover-light:hover{
            background-color: #555555;
        }

        .table-multibody>body>tr:last-of-type>*{
            border-bottom: 3px solid black;
        }

        .rounded-7{
            border-radius: 7px;
        }

        .rounded-9{
            border-radius: 9px;
        }
        
        .rounded-10{
            border-radius: 10px;
        }

        .rounded-15{
            border-radius: 15px;
        }


        /* Calendar */
            /* Week */
                .calendar-week-h{
                    display: grid;
                    align-items: center;
                    grid-template-columns: 200px repeat(96, 10px) 1fr;
                    grid-template-rows: 30px repeat(7, 48px);
                    gap: 5px 2px;
                    min-width: 100%;
                    max-width: 100%;
                    min-height: 441px;
                    max-height: 441px;
                    padding: 20px;
                    border: none;
                }


    /* Dashboard */
        .dashboard-gestion{
            display: grid; 
            grid-template-columns: repeat(10, 1fr); 
            grid-auto-rows: 100px; 
            gap: 20px;   
        }

    /* Animations */

        /* Loader */
            svg.loader {
                width: 3.25em;
                transform-origin: center;
                animation: rotate4 2s linear infinite;
            }
            
            .loader circle {
                fill: none;
                stroke: hsl(214, 97%, 59%);
                stroke-width: 2;
                stroke-dasharray: 1, 200;
                stroke-dashoffset: 0;
                stroke-linecap: round;
                animation: dash4 1.5s ease-in-out infinite;
            }
            
            @keyframes rotate4 {
                100% {
                    transform: rotate(360deg);
                }
            }
            
            @keyframes dash4 {
                0% {
                    stroke-dasharray: 1, 200;
                    stroke-dashoffset: 0;
                }
            
                50% {
                    stroke-dasharray: 90, 200;
                    stroke-dashoffset: -35px;
                }
            
                100% {
                    stroke-dashoffset: -125px;
                }
            }