/* MAIN COLOR */
:root {
    --main-color-full: black;
    --main-color-grey1: #7C7C7C;
    --main-color-grey2: #E4E4E4;
    --main-color-grey3: #F7F7F7;
}

/* HEADER */
#menu-principal {
    height: 40px;
    background-color: var(--main-color-grey1);
    /* background: linear-gradient(-380deg, #d5d5d5 -50%, #606775 100%); */
    background : var(--main-color-full);
    vertical-align: middle;
    position: relative;
}
#menu-principal .navbar {
    height:100%;
    margin-bottom:0px;
    border:none;
}
#menu-principal .navbar ul li {
    display:inline-block;
    min-width:60px;
    text-align:center;
    height:100%;
    float:left;
}

#menu-principal ul li:hover {
    /*background-color: #717886;*/
    border-bottom: 4px solid #717886;
}
#menu-principal .navbar ul {
    margin-left: 0px;
    margin-bottom: 0px;
    height: 40px;
}
#menu-principal ul li a {
    color: #fff;
    display: block;
    width: 100%;
    padding: 11px 15px;
    font-size: 14px;
}
#menu-principal ul li.active {
    text-decoration: none;
    font-weight: bold;
    background-color: var(--main-color-full);
}
#menu-lateral #animation-menu {
    height: 40px;
    background-color: var(--main-color-client1);
    display: block;
    cursor: pointer;
}
#menu-lateral span, #menu-lateral #animation-menu span {
    padding: 10px 10px;
    display: inline-block;
    font-weight: bold;
}
#menu-lateral.off {
    width: 3%;
    transition: width 400ms;
    -moz-transition: width 400ms;
    -webit-transition: width 400ms;
}
#content.off {
    width: 97%;
    transition: width 400ms;
    -moz-transition: width 400ms;
    -webit-transition: width 400ms;
}
#panier {
    background-color: rgba(0, 0, 0, 0);
    background-image: url(../images/panier.png);
    position: relative;
}
.notif {
    background-color: rgba(0, 0, 0, 0);
    background-image: url(../images/notif.png);
    position: relative;
}
.settings {
    background-color: rgba(0, 0, 0, 0);
    background-image: url(../images/logo_srm__16x16.png);
}
#identification_client span.initiale, span.initiale {
    width: 17px;
    height: 17px;
    background-image: none;
    background-position: 0px center;
    background-repeat: no-repeat;
    display: inline-block;
    color: var(--main-color-grey1);
    text-align: center;
    margin-right: 10px;
    font-weight: bold;
}
#identification_client span.client {
    white-space: nowrap;
    height: 33px;
    border-radius: 2px;
    background-color: var(--main-color-grey3);
    padding: 7px 15px;
    display: inline-block;
    position: relative;
    min-width: 165px !important;
    text-align: left;
    top: -9px;
    margin-left: 17px;
    color: var(--main-color-grey1);
}
/* Menu LEFT*/

#menu-lateral .mg-gestion_fournisseur {
    background-image: url(../IconeV2/leftMenu/supplier.svg);
    background-repeat:no-repeat;
    position:relative;
    background-size: 20px;
}
#menu-lateral .mg-groupement_fournisseur {
    background-image: url(../IconeV2/leftMenu/supplier-groups.svg);
    background-repeat:no-repeat;
    position:relative;
    background-size: 20px;
}
#menu-lateral .mg-suivi {
    background-image: url(../IconeV2/leftMenu/request-follow.svg);
    background-repeat:no-repeat;
    position:relative;
    background-size: 20px;
}
#menu-lateral .mg-signature {
    background-image: url(../IconeV2/leftMenu/signature-and-delegation.svg);
    background-repeat:no-repeat;
    position:relative;
    background-size: 20px;
}
#menu-lateral .mg-liste {
    background-image: url(../IconeV2/leftMenu/short-list.svg);
    background-repeat:no-repeat;
    position:relative;
    background-size: 20px;
}
#menu-lateral .mg-incident {
    background-image: url(../IconeV2/leftMenu/incidental.svg);
    background-repeat:no-repeat;
    position:relative;
    background-size: 20px;
}
#menu-lateral .mg-supplier-import {
    background-image: url(../IconeV2/leftMenu/supplier-import.svg);
    background-repeat:no-repeat;
    position:relative;
    background-size: 20px;
}

#menu-lateral .mg-supplier-analysis {
    background-image: url(../IconeV2/leftMenu/supplier-analysis.svg);
    background-repeat:no-repeat;
    position:relative;
    background-size: 20px;
}
#menu-lateral .mg-parametrage {
    background-image: url(../IconeV2/leftMenu/parameters.svg);
    background-repeat:no-repeat;
    position:relative;
    background-size: 20px;
}

#menu-lateral .mg-quality {
    background-image:url(../images/MG_Quality.png);
    background-repeat:no-repeat;
    position:relative;
    background-size: 34px;
}




/* GLOBAL */
h1, h2, h3, h4, h5 {
    color: var(--main-color-full);
    font-weight: bold;
    margin-top:10px;
}
.border_form {
    border: solid 1px var(--main-color-grey3);
}
.td_icon {
  padding: 0px !important;
}
.nav-tabs .active .nb_affectation, .titre_detail span {
    color: var(--main-color-client1);
}
.titre_block {
    background-color:  var(--main-color-grey1);
    padding: 5px 15px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}
.block_edition {
    display: inline-block;
    width: 100%;
    border: 1px solid var(--main-color-grey2);
    margin-bottom: 20px;
    position: relative;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}
form .filtre .row {
    margin: 0px;
    display: flex;
    align-items: center;
}
.colonne3 .row, .colonne2 .row {
    margin:0px 0px 10px 0px;
    position:relative;
    display: flex;
    align-items:center;
    width:100%;
}
.filtreRow {
    width: 55%;
    margin-left: 3%;
}
.filtreRow input {
    width: 100% !important;
}

/* Ariane */
.nav-tabs { position:relative; margin-bottom:1px;}
.nav-tabs li a {
    color: #b6b6b6;
    font-size:14px;
    margin-right: 0px;
    border:0px;
}
.nav > li > a {
    padding: 6px 15px;
}
.nav-tabs {
    border-bottom: 0px solid;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    border : 0px solid;
    border-bottom: 2px solid var(--main-color-client1);
    color: var(--main-color-client1) !important;
    background-color: transparent;
}
.nav-tabs .active .nb_affectation {background-color:var(--main-color-client1)}
.nav-tabs li:hover {
    border-radius:4px 4px 0px 0px;
    -moz-border-radius:4px 4px 0px 0px;
    -webkit-border-radius:4px 4px 0px 0px;
    }
.nav-tabs .active .nb_affectation, .titre_detail span {
    color:#F5F5F5;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: #fff;
    border-radius: 4px 4px 0 0;
    font-weight: bold;
    font-size: 14px;
}
.nav-tabs .nb_affectation {
    background-color: #F5F5F5;
    color: var(--main-color-grey1);
    padding: 2px 4px;
    margin-left: 10px;
    border-radius: 3px;
    font-size: 12px;
}
.nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none;
    background-color: transparent;
    border-bottom: 2px solid #eee;
  }
.clickable {
    padding: 6px 28px !important;
}

button.principal:hover, a.button.principal:hover,button.principal, a.button.principal,
button.secondaire:hover, a.button.secondaire:hover,button.secondaire, a.button.secondaire {
    font-weight: bold;
}
button.principal:hover, a.button.principal:hover,button.principal, a.button.principal {
    border: 1px solid #3377cb;
}
button.secondaire:hover, a.button.secondaire:hover,button.secondaire, a.button.secondaire {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--main-color-grey2);
}
/* .nav-tabs.sous_onglet {border-bottom: 1px solid #f3f3f3;} */
.nav-tabs.sous_onglet > li.active > a, .nav-tabs.sous_onglet > li.active > a:hover, .nav-tabs.sous_onglet > li.active > a:focus {
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    -o-border-radius: 0px;
    font-size: 12px;
}

.nav-tabs.sous_onglet > li > a {font-size:12px;}
.nav-tabs.sous_onglet > div {padding:15px;}



/* bulle filter */
.result {
    border-radius: 15px;
    background-color: var(--main-color-opac15);
    display: inline-block;
    padding: 7px 10px;
    margin-right: 5px;
}

/* tableau */
table thead tr {
    background-color: var(--main-color-grey1);
    color: #fff;
}
table tr.recherche {
    background-color: var(--main-color-grey3);
}
table tbody tr:hover{
    background-color: var(--main-color-opac15) !important;
}


/* bouton */
.contenu .button.principal.ajout {
    background-repeat: no-repeat;
    background-position: 10% 9px;
    padding: 8px 1% 8px 3%;
}
button.secondaire, a.secondaire, button.principal, a.principal {
    padding: 8px 8px 8px 8px;
}
button.btn_filtre {
    padding: 6px 20px 6px 40px !important;
    background-image: url(../images/filtre.png);
    background-repeat: no-repeat;
    background-position: 15% center;
}
button.secondaire.ajout[data-toggle="collapse"], button.secondaire.ajout, a.secondaire.ajout {
    background-position: 15px -36px;
    padding: 6px 1% 6px 3%;
}
button.principal, a.button.principal {
    background-color: #3377cb;
    color: #fff;
    padding: 8px 8px 8px 8px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
}
.odd {
    background-color: #fff !important;
}
tr:nth-child(even){
    background-color: var(--main-color-grey3);
}

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    padding: 5px;
}

body {
font-size: 12px;
color: var(--main-color-full);
font-family: "Segoe UI", Helvetica, Arial, sans-serif;
}


/* popup */
.modal-header {
    padding: 2px 16px;
    background-color: var(--main-color-opac15);
    color: #666666;
    border-radius: 10px 10px 0px 0px;
    -webkit-border-radius: 10px 10px 0px 0px;
    -moz-border-radius: 10px 10px 0px 0px;
    cursor: move;
}


/* Menu contextuel */
.menuConxtuel .actionPrincipal {
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: var(--main-color-opac15);
}

.actionPrincipal .MC_tuile {
    width: 80px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -o-border-radius: 2px;
    display: block;
    color: var(--main-color-full);
    padding: 10px 0 10px 0px;
    flex:1;
}
.actionPrincipal .MC_tuile:hover{
    background-color: var(--main-color-grey2);
    cursor:pointer;
}
.MC_tuile .interactions {
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    background-color: #fff;
    height: 30px;
    width: 30px;
    vertical-align: middle;
    margin: auto;
    /*border: solid 1px #dcdcdc;*/
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}
.MC_tuile {
    text-align: center;
}
.MC_tuile .pictos{
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: 8px 7px;
}
.MC_tuile a {
    color: #000000;
}
.pictoEdit{
    background-image: url(../IconeV2/plain-big-icons-black/edit.svg);
}
.pictoFollow{
    background-image: url(../IconeV2/plain-big-icons-black/follow.svg);
}
.pictoPrint{
    background-image: url(../IconeV2/plain-big-icons-black/print.svg);
}
.menuConxtuel .secondaire {
    display: grid;
    /*grid-template-rows: repeat(8, min-content);*/
    grid-auto-flow: column;
    padding: 15px;
}
.menuConxtuel .secondaireCol {
    display: flex;
    padding: 15px;
}
.menuConxtuel .secondaire li, .menuConxtuel .secondaireCol li {
    border-bottom: 0px;
    padding: 5px;
    width: 200px;
    cursor: pointer;
}
.menuConxtuel.ss_parametres{
      width: fit-content;
}
.MC_footer {
    height: 30px;
    background-color: var(--main-color-client1);
}
.MG_titre {
    cursor: context-menu !important;
    color: var(--main-color-client1);
    font-weight: bold !important;
}
.MG_titre {
    background-color: rgba(0, 0, 0, 0) !important;
}
.col .MG_titre:not(:first-child) {
    margin-top: 10px;
  }
/* .ss_parametres li a, .ss_params li a, .ss_parametres_top li a {padding-left:0px!important;} */
.ss_parametres .secondaire li a,.ss_parametres .secondaireCol li a  {
    padding-left: 0px !important;
  }
/* Couleur Client */
/* CSS Document */
#menu-principal ul li.active {border-bottom: solid 4px var(--main-color-client1);}

#menu-lateral .submenu li.active, #menu-lateral .ouverture_menu li.active, #menu-lateral li.plier.active { border-left: solid 4px var(--main-color-client1);}
#menu-lateral .notification {background-color:var(--main-color-client1);}

#connexion_backup, .tuiles_index.active  {background-color:var(--main-color-client1);}

.tuiles_index{border:1px solid var(--main-color-client1);;color:var(--main-color-client1);}
.tuiles_index:hover{background-color:var(--main-color-client1);opacity:0.7;color:#FFF;}
.tuiles_index:hover .interactions {border: solid 1px #fff;}
.tuiles_index .interactions {border: solid 3px var(--main-color-client1);background-color:var(--main-color-client1);}
#acces-rapide a{background-color: var(--main-color-client1);}

h2.border-bottom{border-bottom:solid 1px var(--main-color-client1);;padding-bottom:10px}

#mes_favoris a span {color: var(--main-color-client1);}
#mes_favoris a, #mes_favoris .card {border-bottom: 1px dotted var(--main-color-client1);}
#mes_favoris .card {padding-top:10px;padding-bottom:5px;cursor: pointer;}
#mes_favoris a:last-child{border-bottom:0px;}

#detail_fournisseur .parametrage.parametre_general {background-position: center -154px;}

.tuiles .interactions .pictos svg {fill:var(--main-color-client1);height:100%;margin:auto;}

.pictos img {fill:var(--main-color-client1);height:100%;margin:auto;}

.panel-default{border-color:transparent}

a.list-group-item, button.list-group-item{border:1px solid var(--main-color-client1);}

 .node-treeview6 .badge {background-color:var(--main-color-client1);}
 
.separateur_bottom{border-bottom: 1px solid var(--main-color-client1);}

.svg_color{
    filter: invert(37%) sepia(66%) saturate(1018%) hue-rotate(183deg) brightness(95%) contrast(84%);
}

.listGroupV2 a.list-group-item{
    color: var(--main-color-client1)!important;
}