/*
|
| Thème C4waste
| -------------
|
*/

body {
  --rouge: #ed3900;
  --vert: #00a651;
  --jaune: #ebe532;
  --noir: #020202;
  --vertClair: #9feac4;
  --bleu: #086297;
  --orange: #ed8200;
  --noirClair: #727272;
}

/*
|
| Sidebar 
| -----------
|
*/

#navbarBrand,
#toggleBurger {
  margin-bottom: 1.5rem;
}


#navSidebarC4w {
}

#ulSidebarC4w {
  padding-top: 1rem;
}



#viewer {
  padding: 1.5rem;
  /* background-color: white; */
}

/*
|
| Boutons
| -----------
|
*/


/* Btn Pleins */

.btnPrimary {
  background-color: var(--vert);
  color: white;
}

.btn-falcon-primary {
  color: var(--vert);
  font-weight: bold;
}

.btnPrimary:hover,
.btnDanger:hover,
.btnWarning:hover,
.btninfo:hover {
  color: white;
  background-color: #020202;
}

.btnDanger {
  background-color: var(--rouge);
  color: white;
}

.btnWarning {
  background-color: var(--orange);
  color: white;
}

.btnInfo {
  background-color: var(--bleu);
  color: white;
}


/* Btn Outline  */

.btnOutlinePrimary {
  color: var(--vert);
  background-color: white;
  border: 1px solid var(--vert);
}

.btnOutlineDanger {
  color: var(--rouge);
  background-color: white;
  border: 1px solid var(--rouge);
}

.btnOutlineWarning {
  color: var(--orange);
  background-color: white;
  border: 1px solid var(--orange);
}

.btnOutlineInfo {
  color: var(--bleu);
  background-color: white;
  border: 1px solid var(--bleu);
}

/* Thème couleur */

.colorPrimary {
  color: var(--vert);
}


/*
|
| Modal
| -----
|
*/

.lightC4w .modal.ws_01 {
  padding: 1rem;
}

.lightC4w .modal.ws_01 .modalHeader,
.lightC4w .modal.ws_01 .modalBody,
.lightC4w .modal.ws_01 .modalFooter {
  padding: 1rem 2rem;
}

.lightC4w .modal.ws_01 .modalHeader {
  display: flex;
  justify-content: space-between;
  padding: 1rem 2rem;
}

.lightC4w .modal.ws_01 .modalHeader .modal-title {
  font-weight: bold;
}

.lightC4w .modal.ws_01 .modalBody {
  padding: 2rem;
  border-left: 3px solid #00a651;
  border-right: 3px solid #00a651;
}

.lightC4w .modal.ws_01 .modalFooter {
  text-align: center;
}


/*
|
| Viewer Demo
| -----------
|
*/


#viewerDemo {
  padding: 4rem 0 2rem 0;
}



.dropdown-toggle.themIcone::after {
  border: 0;
  content: none !important;
  float: right;
  font-family: Feather !important;
  margin-left: 0.255em;
}


/*
|
| Global
| ------
|
*/


span.ref {
  font-weight: bold;
}

span.dechet {
  color: var(--vert);
}

a {
  color: #00a651;
}

a:hover {
  color: #ed8200;
}

img.icoFlag {
  width: 20px;
}

img.flagMini {
  width: 20px !important;
}





h1.h1View {
  font-weight: bold;
  border-left: 20px solid var(--vert);
  padding-left: .5rem;
  margin-top: 1rem;
  line-height: 1.6rem;
  font-size: 1.8rem;
}

h1.h1View span.spDechet {
  font-size: 1.6rem;
  color: var(--vert);
}

h1.h1View span.spTitre {
  font-size: 1.2rem;
  color: var(--noirClair);
}

h1.h1View span.spValueClient {
  font-size: 1.4rem;
  color: var(--rouge);
}

#pDate {
  
}

.fiche h2 {
  margin-bottom: 2rem;
}


#corpus {
  padding: 3rem;
  min-height: 100%;
}


html.lightC4w body {
  background-color: #eee;
}
html.lightC4w .navbar-glass {
  background-color: #eee;
}


/*
|
| Board
| -----
|
*/


html.lightC4w .board {
  background-color: #fff;
  padding: 1rem;
  border-radius: 10px;
}

html.lightC4w .board .boardKdre {
  border: 1px solid #00a651;
  border-radius: 12px;
  padding: 1rem;
}

html.lightC4w .board .boardHeader {
  padding: 1rem 0 0;
}

html.lightC4w .board .boardHeader > h3 {
  line-height: 1em;
  font-weight: bold;
}

html.lightC4w .board .boardHeader > h3 > span {
  color: #00a651;
  font-size: 1rem;
}

html.lightC4w .board .boardNav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 0;
}

html.lightC4w .board .boardBody .table-responsive {
  min-height: 400px;
}

html.lightC4w .board .boardBody .table-responsive th {
  font-weight: bold;
}

html.lightC4w .fiche h2 {
  margin-bottom: 2rem;
}

html.lightC4w .fiche .card.cardDechet,
html.lightC4w .fiche .card.cardProducteur,
html.lightC4w .fiche .card.cardCentre {
  border-radius: 0;
  margin-bottom: 1rem;
}
html.lightC4w .fiche .card.cardDechet span.spTitre,
html.lightC4w .fiche .card.cardProducteur span.spTitre,
html.lightC4w .fiche .card.cardCentre span.spTitre {
  font-weight: bold;
}
html.lightC4w .fiche .card.cardDechet .card-header,
html.lightC4w .fiche .card.cardProducteur .card-header,
html.lightC4w .fiche .card.cardCentre .card-header {
  border-radius: 0;
}
html.lightC4w .fiche .card.cardDechet {
  border-bottom: 0;
}
html.lightC4w .fiche .card.cardDechet .barEtat {
  display: flex;
  justify-content: end;
  align-items: center;
}
html.lightC4w .fiche .card.cardDechet .barEtat i.icoEtat {
  background-color: white;
  padding: 1rem;
  margin-right: 1rem;
}
html.lightC4w .fiche .card.cardProducteur .card-header,
html.lightC4w .fiche .card.cardCentre .card-header {
  border-bottom: 0;
  padding: 2rem;
}
html.lightC4w .fiche .card.cardProducteur .card-header h3,
html.lightC4w .fiche .card.cardCentre .card-header h3 {
  font-size: 1.2rem;
  margin-bottom: 2rem;
}
html.lightC4w .fiche .card.cardDechetConfig .card-header h3,
html.lightC4w .fiche .card.cardProducteur .card-header h3 {
  margin-bottom: 1rem;
}
html.lightC4w .fiche .card.cardProducteur .card-header h3 {
  font-weight: bold;
}
html.lightC4w .fiche .card.cardDechetConfig h4 {
  text-decoration: underline;
  margin-bottom: 1rem;
}
html.lightC4w #pClient .spValue {
  font-size: 1.1rem;
  font-weight: bold;
  color: #ed3900;
}
html.lightC4w .card .cardMenu {
  padding: 0rem 2rem 1rem;
}
html.lightC4w .mboardFiche {
  background-color: white;
  padding: 1rem;
  margin-bottom: 2rem;
}
html.lightC4w .boardNav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 0;
}
html.lightC4w .gridLayout {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 1rem;
}
html.lightC4w #sidebarMenu {
  background-color: #ffffff;
  color: white;
  border: 1px solid #555;
}
html.lightC4w #viewPage {
  display: grid;
  grid-template-rows: auto 1fr;
  grid-gap: 1rem;
  /* background-color: #464646; */
}
html.lightC4w #viewHeader {
  /* background-color: olive; */
  border: 1px solid #555;
  padding: 1rem;
}
html.lightC4w .card.cardMenu .card-body {
  background-color: white !important;
}
html.lightC4w #viewBody {
  display: grid;
  grid-template-columns: 3fr 4fr;
  grid-gap: 1rem;
}
html.lightC4w #viewBody.lay_0 {
  grid-template-columns: 1fr;
}
html.lightC4w #zone1 {
  padding: 1rem;
  /* border: 1px solid #555; */
}
html.lightC4w #zone2 {
  /* border: 1px solid #555; */
  padding: 1rem;
}
html.lightC4w div.kdre_btnSave,
html.lightC4w div.kdre_btnAction {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  background-color: #eee;
  margin-top: 1rem;
  margin-bottom: 2rem;
  padding: 0.5rem;
}

html.lightC4w div.kdre_btnSave.them_3,
html.lightC4w div.kdre_btnAction.them_3 {
  justify-content: flex-start;
}




.card.cardC4w {
  border: 1px solid #dedede;
}
.card.cardC4w .card-title {
  margin-bottom: 2rem;
}


/*
|
| Header titre
| ------------
|
*/


.headerNav {
 margin-top: 2rem; 
}

.headerModule {
  margin: 0;
  background-color: white;
  border-radius: 12px 12px 0 0;
  padding: 1rem;
  /* box-shadow: 0 -3px 5px #dcdcdc;*/
  border: 1px solid #dedede;
}

.headerModule h2 {
  font-weight: bold;
  margin: 2rem 0 0;
}


.headerModule h2  span {
  color: var(--vert);
  font-size: 1.rem;
}

.kdreTitreRa9 {
  margin: 0;
  background-color: white;
  border-radius: 12px 12px 0 0;
  padding: 1rem;
  /* box-shadow: 0 -3px 5px #dcdcdc;*/
  border: 1px solid #dedede;
}


.kdreTitreRa9 h2 {
  font-weight: bold;
  margin: 2rem 0 0;
}

.kdreTitreRa9 h2  span {
  color: var(--vert);
  font-size: 1.rem;
}


.kdreTitreRa9 .client {
  margin: 0;
  font-weight: bold;
  font-size: 1.2rem;
}

.kdreTitreRa9 .client .spTitre {
  color: var(--noirClair);
}


.kdreTitreRa9 .client .spValue {
  color: var(--orange);
  font-size: 1.rem;
}



#navbarC4w {
  background-color: #fefefe !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border-radius: 0 0 12px 12px;
  /* box-shadow: 0 3px 5px #dcdcdc;*/ 
  border: 1px solid #dedede;
  
}

#navbarC4w .navbar-brand {
  color: var(--vert);
  font-size: 1.2rem;
}


#navbarC4w .nav-link {
  padding: 1.2rem 1rem;
  font-weight: bold;
}

#navbarC4w .nav-link:hover,
#navbarC4w .nav-link.active {
  background-color: green;
  color: white !important;
}

h5.hLabel {
  font-weight: bold;
  font-size: 1.1rem;  
}

form.formDemo label {
  font-weight: bold;
  font-size: 1.1rem;
  
}





form.formDemo label.form-check-label {
  margin: 0;
  font-size: 1rem;
  font-weight: normal;
}


form.formDemo input {
  border: 1px solid var(--vert);
  border-radius: 0;
  padding: .5rem;
}

form.formDemo .cell-group {
  margin-bottom: 2rem;
}


table.tableC4w thead th {
  padding: .25rem;
  font-weight: bold;
  background-color: var(--vertClair);

}



#view_devis_creation {
  margin: 2rem 0;
  padding: 0 2rem 2rem;
  background-color: white;
}


/*
#view_devis_creation {}
*/


#view_devis_creation h1 {
  display: table;
  margin: 0 0 3rem;
  padding: .5rem 0;
  
  font-size: 1.8rem;
  font-weight: bold;
}

#bordDeco {
  display: table;
  width: 20px;
  height: 40px;
  background-color: var(--vert);
}

.section_devis {
  margin-bottom: 2rem;
  
}

span.numSection {
  background-color: var(--rouge);
  color: white;
  padding: .5rem 1rem;
  font-size: 1.1rem;
  border-radius: 10px;
  margin-right: 1rem;
  font-weight: bold;
}

#view_devis_creation span.label {
  color: var(--rouge);  
  margin-right: 1rem;
}

.formC4w.mod_devis {
  margin-left: 1.25rem;
  padding: 1rem;
  border-left: 2px solid var(--rouge);
  text-align: right;
}


.kdreForm.client {
  margin: 0 auto 1rem 0;
  border: 1px solid #eee;
  padding: 2rem;
}


.kdreAction {
  text-align: left;
}

p.nomSoc {
  text-transform: uppercase;
  font-weight: bold;
  
}

p.numEntrepriseSoc {
  background-color: #eee;
  padding: .5rem;
  font-weight: bold;
}


.card.cardControl {
  text-align: left !important;
}

.navDevisCreation {
  margin: 2rem 0;

}

.navDevisCreation a.btnCrea {
  background-color: #ffffff;
}

#view_devis_creation {
  border-radius: 20px;
}


/*
|
| CardControl
|
*/

.cardControl .cardTitle {
  padding-left: .75rem;
  border-left: 5px solid var(--vert);
}

.cardControl .cardTitle span {
  color: var(--vert);
  font-size: 1rem;
}

.cardControl .cardNav {
  margin: 1rem;
}



/* *********** 
CODE CHRIS
********** */ 


table {
  border-collapse: collapse;
  width: 100%;
  background-color: #fff;
  color: #020202;
}

table, tr, td {
  padding: 2px;
  border: 1px solid #c5c5c5;
}



td {
  padding: 5px!important;
  color: #020202;
  font-size: 0.7rem;
  border: 1px solid #727272;
}

tr:hover {
  background-color: #c5c5c5!important;
  border: 1px solid --bleu!important;
}

.txt-white {
  color: #fff;
  padding: 3px;
}

.txt-center {
  text-align: center;
}

.cvert, .corange, .crouge, .cbleu {
  padding: 2px 4px;
  margin: 2px;
  border-radius: 5px;
  font-size: 0.8rem;
  color: #fff;
}

.cvert { background: var(--vert); }
.corange { background: var(--orange); }
.crouge { background: var(--rouge); }
.cbleu { background: var(--bleu); }

thead tr {
  background-color: var(--vert); /* Couleur de fond vert */
  color: white !important; /* Écriture blanche */
  font-size: 1rem;
}

thead th, thead td {
  border: 1px solid white; /* Applique une bordure blanche autour de chaque cellule de titre */
}


/* Style de base pour l'élément déclencheur */
.ib {
  position: relative;
  cursor: help;
  display: inline-block;
  font-size:8px;
  background-color: var(--bleu); /* Couleur de fond vert */
  color: white !important; /* Écriture blanche */
  border: 1px solid #fff;
  padding: 2px 4px;
}

/* Style de l'infobulle */
.ib::after {
  content: attr(t-info); /* Utilise le contenu de l'attribut t-info */
  position: absolute;
  white-space: nowrap;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background-color: black;
  color: white;
  padding: 5px 10px;
  border-radius: 4px;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s;
  visibility: hidden;
  font-size:12px;
}

/* Afficher l'infobulle au survol */
.ib:hover::after {
  opacity: 1;
  visibility: visible;
}


h4 {
  border-left: 20px solid var(--vert);
  padding-left: .5rem;
  line-height: 1rem;
  font-weight: bold;
}


   /* Style du bouton */
   .btn-scroll {
    position: fixed;
    right: 20px;
    background-color: #007bff; /* Couleur de fond bleu */
    color: white; /* Couleur du texte blanc */
    border: none;
    border-radius: 50px; /* Forme arrondie */
    padding: 7px 12px; /* Espacement interne */
    font-size: 12px; /* Taille du texte */
    cursor: pointer; /* Curseur pointeur */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Ombre légère */
    z-index: 1000; /* Priorité d'affichage */
    display: none; /* Masqué par défaut */
    transition: opacity 0.3s ease; /* Transition fluide pour l'affichage */
    width:50px;
  }

  /* Apparence du bouton au survol */
  #btnTop:hover {
    background-color: #0056b3; /* Couleur plus foncée au survol */
  }

    /* Positionnement du bouton Haut */
    #btnTop {
      bottom: 60px; /* Positionné au-dessus du bouton Bas */
    }

    /* Positionnement du bouton Bas */
    #btnBottom {
      bottom: 20px; /* Positionné tout en bas */
    }

    h5.vert {
      background-color: #00a651;
      color: #ffffff;
      padding: 5px;
    }
    
    h5.bleu {
      background-color: #086297; 
      color: #ffffff;
      padding: 5px;
    }
    
    h5.rouge {
      background-color: #ed3900;
      color: #ffffff;
      padding: 5px;
    }