:root {

    /*--oran-capi: #e36c0d;*/

    /*    --fonc: #dcdcdc;
        --moye: #dcdcdc;
        --clai: #dcdcdc;
        --tran: #ffffffdd;*/

    /*--menu > --them-fonc
    --coul-1 > --them-medi
    --coul-clai > --them-clai
    
    ----coul-2 > --noti-fonc
    
    --noti-*/


    --them-fonc: #445F73;
    /* Couleur foncée */
    --them-medi: #ccc;
    /* Couleur entre deux */
    --them-clai: #eee;
    /* Couleur des fonds */


    --noti-fonc: #e36c0d;
    /* Couleur des notifs */
    --noti-medi: #ccc;
    --noti-clai: #eee;


    --coul-tran: #eeeeeebb;

    --text-color: #212529;
    --fond: #fff;
    --fond-Edition: #f5f5f5;

    --coul-trav: #4f81be;
    --coul-prev: #90B34B;
    --coul-gamm: #90B34B;
    --coul-equi: #976532;
    --coul-comm: #7E64A1;
    --coul-piec: #C0504D;
    --coul-grou: #49ABC4;
    --coul-util: #49ABC4;
    --coul-arbo: #976532;
    --coul-four: #7E64A1;
    --coul-rapp: #555;
    --coul-admi: #555;


    --coul-acce-0: #953735;
    --coul-acce-1: #e88d06;
    --coul-acce-2: #909090;
    --coul-acce-3: #9bbb59;
    --coul-acce-4: #4f6228;
}



@font-face {
    font-family: 'logo-capi';
    src: url('../gene/logo-capi.ttf');
}

#page-menu {
    background-color: var(--them-fonc);
    transition: 0.2s;
    color: var(--fond);
}

.page-corp {
    background-color: var(--fond);
}

#page-head {
    background-color: var(--fond);
}


#page-head-navi {
    background-color: var(--them-fonc);
    color: var(--fond);
}

#page-head-navi .head-navi-bas {
    background-color: var(--fond);
    color: var(--text-color);
}

#page-head-navi #head-navi-agen:hover,
#page-head-navi #head-navi-aide:hover,
#page-head-navi #head-navi-foru:hover,
#page-head-navi #head-navi-deco:hover {
    background-color: var(--fond);
    color: var(--them-fonc);
}

.page-corp .corp-navi #corp-navi-notif {
    background-color: var(--noti-fonc);
    color: var(--fond);
}

.page-corp .corp-navi #corp-navi-chem .icon {
    color: var(--noti-fonc);
}

.accu-xs-navi .navi-bout {
    background-color: var(--them-fonc);
    color: var(--fond);
}

.accu-xs-navi .navi-bout#navi-bout-deco {
    background-color: var(--noti-fonc);
}

#filt-head,
#list-head,
#list-head-filt,
#list-gran-head,
#edit-head,
#supp-head,
#rech-head,
#edit-menu,
#supp-menu,
#rech-menu,
#rech-menu,
#list-gran-menu {
    background-color: var(--them-fonc);
    color: var(--fond);
    border-top: 2px solid var(--fond);
}





@media (min-width: 576px) {
    .accu-cont-widg {
        border-top: 1px solid var(--them-fonc);
    }

    #filt-head,
    #list-head,
    #list-head-filt,
    #list-gran-head,
    #edit-head,
    #supp-head,
    #rech-head,
    #edit-menu,
    #list-menu,
    #supp-menu,
    #rech-menu,
    #rech-menu,
    #list-gran-menu {
        border: none;
    }

}

.actu-boite {
    background-color: #eee;
}

#accu-actu {
    background-color: #fff9;
}


#modu-list-gran,
#modu-list,
#modu-edit,
#modu-supp,
#modu-rech {
    background-color: var(--fond);
}

#edit-corp {
    background-color: var(--fond);
}

/* #page-modu-nouv {
    background-color: #f6f6f6;
}

#page-modu-nouv:hover {
    background-color: var(--fond);
} */





#edit-choi,
#supp-choi {
    background-color: var(--them-medi);
}

.modu-choi-bout {
    color: var(--them-fonc);
}

.modu-choi-bout-sele,
.modu-choi-bout:hover {
    background-color: var(--them-fonc);
    color: var(--them-medi);
}

/*#supp-choi div{
    background-color: var(--bleu-clai);
    color:  var(--bleu-fonc);  
}*/

#supp-choi button:not(.modu-bout bout-vert-larg)&:not(.modu-bout bout-larg) {
    background-color: var(--them-fonc);
    color: var(--fond);
}





::-webkit-scrollbar-thumb {
    background-color: var(--them-fonc);
}

.menu-sele {
    background-color: var(--them-fonc-hover);
}

/*#edit-corp h3{
    border-bottom-color: var(--them-fonc);
}*/

#actu-notif-titre {
    background-color: var(--noti-fonc);
    color: var(--fond);
}

/*.widg h2{
    background-color: var(--them-medi)
}
.widg h3{
    
}*/
.widg-bouton {
    background-color: var(--coul-tran);
}

.widg {
    background-color: var(--coul-tran);
}

.widg-titr {
    background-color: var(--them-clai);
}

.widg-bouton:hover {
    background-color: var(--them-medi);
}

.widg-bouton .widg-bouton-cont {
    color: var(--noti-fonc)
}

h4 {
    color: #666;
}


/*============================== couleur Modules ================================*/

.modu-four-fond {
    background-color: var(--coul-four);
}

.modu-trav-fond {
    background-color: var(--coul-trav);
}

.modu-equi-fond {
    background-color: var(--coul-equi);
}

.modu-piec-fond {
    background-color: var(--coul-piec);
}

.modu-util-fond {
    background-color: var(--coul-util);
}

.modu-prev-fond {
    background-color: var(--coul-prev);
}

.modu-gamm-fond {
    background-color: var(--coul-gamm);
}

.modu-comm-fond {
    background-color: var(--coul-comm);
}

.modu-grou-fond {
    background-color: var(--coul-grou);
}

.modu-arbo-fond {
    background-color: var(--coul-arbo);
}

.modu-rapp-fond {
    background-color: var(--coul-rapp);
}

.modu-admi-fond {
    background-color: var(--coul-admi);
}


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



.gene-fond-clai {
    background-color: var(--them-clai);
    color: var(--them-fonc);
}



/*============================ couleurs prédéfinies ==========================*/
.a_definir {
    background-color: red;
    color: white;
}

.modu-serv:not(:empty) {
    display: inline-block !important;
    padding: 4px 6px;
    text-align: left;

    color: white;
    background-color: var(--them-fonc);
    border-radius: 4px;
    font-weight: 600;

    text-overflow: ellipsis;
    line-height: 100%;
}

.modu-serv-edit {
    color: var(--them-fonc);
    font-weight: bold;
}

/*.modu-libe-serv {
    color: #445f73 !important;
    font-weight: bold !important;
    background-color: var(--them-medi) !important;
    padding: 0 2px;
}*/



.message-erreur {
    color: #fff;
    background-color: #212529;
    padding: 10px;
    align-items: center;
}

.important {
    width: 100%;
    border: 3px solid #FA6ADA;
    background-color: #fff;
}

.attention {
    color: #dc3545;
}

.gene-alert {
    color: var(--noti-fonc);
    font-weight: bold;
}

.grpt-reta {
    background: linear-gradient(45deg, #cd0000 12.5%, #fff 12.5%, #fff 37.5%, #cd0000 37.5%, #cd0000 62.5%, #fff 62.5%, #fff 87.5%, #cd0000 87.5%);
    background-size: 10px 10px;
    background-position: 5px 5px;
}

.grpt-dela {
    background: linear-gradient(45deg, #8dc872 12.5%, #fff0 12.5%, #fff0 37.5%, #8dc872 37.5%, #8dc872 62.5%, #fff0 62.5%, #fff0 87.5%, #8dc872 87.5%);
    background-size: 10px 10px;
    background-position: 5px 5px;
}

.boutonActif {
    color: #fff;
    background-color: #E36B0A;
    border-radius: 50%;
}

.modu-impo {
    border-left: 3px solid #e36c0d;
}



.bout-para {
    border: 1px solid var(--them-fonc);
    margin: 15px;
    color: var(--them-fonc);
}

/*============================ PLAN ========================*/
.modu-plan-case {
    background-color: #ffffffdd;
    border: 1px solid #999;
    border-radius: 3px;
    font-size: 85%;
}

.modu-plan-norm {
    background-color: #559d3a85;
}

.modu-plan-gris {
    /*si un autre est mis en avant*/
    background-color: #ddd;
}

.modu-plan-plansele {
    /*si mis en avant*/
    background-color: #fff;
}

.modu-plan-travsele {
    /*si mis en avant d une planif du meme travail*/
    border: 3px solid var(--noti-fonc) !important;
}

.modu-plan-avan {
    /*si en avance*/
    background-color: #5287ad42;
}

.modu-plan-reta {
    /*si en retard*/
    background-color: #ad525242;
}

.modu-plan-pros {
    /*si en action prospective*/
    background-color: var(--noti-medi);
}

.clignote {
    color: var(--noti-fonc);
    animation: clignote-doux 2s ease-in-out infinite;
}

@keyframes clignote {
    50% {
        opacity: 100;
    }

    51% {
        opacity: 0;
    }

    99% {
        opacity: 0;
    }
}

.clignotant {
    animation: clignotant 1s ease-in-out infinite;
}

@keyframes clignotant {
    0% {
        opacity: 100;
    }

    25% {
        opacity: 75;
    }

    50% {
        opacity: 50;
    }

    75% {
        opacity: 25;
    }

    100% {
        opacity: 0;
    }
}

@keyframes clignote-doux {
    0% {
        opacity: 100;
    }

    25% {
        opacity: 50;
    }

    50% {
        opacity: 0;
    }

    75% {
        opacity: 50;
    }

    100% {
        opacity: 100;
    }
}

.clignote-double {
    animation: clignote-double 2s ease-in-out infinite;
}

@keyframes clignote-double {

    0%,
    10% {
        opacity: 1;
    }

    14% {
        opacity: 0.15;
    }

    16% {
        opacity: 0;
    }

    18% {
        opacity: 0.15;
    }

    22% {
        opacity: 1;
    }

    22%,
    32% {
        opacity: 1;
    }

    36% {
        opacity: 0.15;
    }

    38% {
        opacity: 0;
    }

    40% {
        opacity: 0.15;
    }

    44% {
        opacity: 1;
    }

    44%,
    100% {
        opacity: 1;
    }
}


/*============================ PLAN ========================*/
.modu-plan-feri {
    background: repeating-linear-gradient(45deg, #aaa, #aaa 2px, #fff0 2px, #fff0 5px);
}