/* *************************************** */
/********   Commun toutes Pages    *********/
/* *************************************** */

@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&display=swap');

html, body
{ 
    margin: 0 auto; 
    font-family: 'Quicksand', sans-serif;
 }

 .spinner-wrapper
 {
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    display: none;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    z-index: 9999;
 }

 .spinner-border 
 {
    height: 15rem;
    width: 15rem;
 }

 /* Sous titre card sous map */
 .siteNameSubtitle
 {
    font-size: 20px;
 }


 .badge.commonLicenseBadge {
    font-size: 16px !important;
    font-style: italic !important;
    background-color: rgb(243, 210, 100) !important;
    color: #221f1f;
 }

.infoMonitoringOwner
{
    font-size: 16px !important;
    font-style: italic !important;
    background-color: rgb(243, 210, 100) !important;
    color: #221f1f;
   
}

.infoSampleOwner
{
    font-size: 16px !important;
    font-style: italic !important;
    background-color: rgb(243, 210, 100) !important;
    color: #221f1f;
    width: 63%;
}

/*  Hauteur minimale Div enveloppant le header card page "Sample" */
.cardHeaderCommonLicence
{
    min-height: 6rem;
    background-color: rgb(223, 213, 188) ;
}

/* couleur header cards */
.titleCardMonitoring, .titleCardStation, .titleCardSensor, .titleCardSample, .titleCardMonitoringsamples

{
    background-color: rgb(223, 213, 188) ;
    color: rgb(2, 2, 2) !important;
    vertical-align: middle;
    display:inline-block;
    text-align: center;
}

/*  Permet la meme hauteur des cards alignées */
.hSectionInfo
{
    min-height: 100% !important;
}

.clickIcone
{
    float: right;
    margin: 6px;
   
}

/*  Gestion du header FIXE sur toutes les pages le content décalé plus bas sous navbarre */
content.page
{
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    padding-top: 110px; /* espace sous le header fixe */
}

header, .navbar
{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    align-items: center;
    display: flex;
    height: 130px;
    z-index: 10; /* reste au-dessus du contenu */
}
/* ***************************************************** */
/*  Bouton de téléchargement sur photo unique dans modal */
/* .download-btn 
/* ***************************************************** */

.download-btn {
    background-color: #000;
    color: #fff;
    border: 2px solid #000;
    padding: 10px 18px;
    border-radius: 6px;
    font-weight: 600;
    letter-spacing: 1px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: all 0.25s ease;
}

/* Icône jaune */
.download-btn i {
    color: #ffc107; /* jaune Bootstrap */
    font-size: 1.2rem;
    transition: color 0.25s ease, transform 0.25s ease;
}

/* Hover */
.download-btn:hover {
    background-color: #ffc107;
    color: #000;
    border-color: #ffc107;
}

/* Icône au hover */
.download-btn:hover i {
    color: #000;
    transform: translateY(2px);
}

/* Focus accessible */
.download-btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255, 193, 7, 0.5);
}

/* Désactivé (optionnel) */
.download-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}


 /* Le bouton apparaît au survol de l'image dans la modale */
.modal-content:hover .download-btn {
  opacity: 1;
}

/* Contact mail pour les documents et images non téléchargeables */
.contact
{
    text-decoration: none;
}
.dialog
{
    color: rgb(160, 132, 98) !important;

}
/* ***************************************************** */
/*        Reglage fenêtres modal pour les photos         */
/* ***************************************************** */
/* Taille fixe (ou proportionnelle à la fenêtre) */
.image-wrapper {
  width: 80vw;         /* 100% de la largeur de la fenêtre */
  height: 85vh;        /* 100% de la hauteur de la fenêtre */
  max-width: 800px;    /* limite maximale sur grands écrans */
  max-height: 600px;
  position: relative;
  overflow: hidden ;    /* empêche l’image de déborder */
  border-radius: 10px;
  background-color: #000; /* pour les bords en cas d'image trop petite */
}
/* L’image s’adapte sans se déformer */
.modal-img {
  width: 100%;
  height: 85%;
  object-fit: contain;  /* garde les proportions */
  border-radius: 10px;
}
#singleImage
{
    width: 100%;
    height: 90%;
    object-fit: contain;  /* garde les proportions */
    border-radius: 10px;
}

/* ***************************************************** */


/* *************************************** */
/******  Commun toutes Pages  listes *******/
/* *************************************** */
h2 .listTitle
{
    text-align: center;
}

.minHeightPage
{
    min-height: 570px;
    width: auto;
    
}

#listeIcon
{
    width: 60px;
}

/* ====== */
/* header */
/* ====== */

.headerMonitoring
{
    text-align: center;
    background-image: url("../images/photos/headerRoche.png");
    background-size: 100%;
    height: 10vh;
    background-repeat: no-repeat;
    display: flex;
    align-items: center; /* Centre verticalement */
    justify-content: center; /* Centre horizontalement (optionnel) */

}

/* ====== */
/* navbar */
/* ====== */

#colorText
{
    color:rgb(218, 206, 174) !important;
    font-size: 34px;
    line-height: 38px !important;
}

.iconUser
{
    margin-left: 50px;
}

/* Espacement des items de la navbar + taille police menu */
.itemmenu
{
    margin: auto;
    font-size: 25px;
}

/*  Couleur de la police de la navbar */
.navbar-brand, .nav-link, .navbar-toggler-icon, .dropdown-item
{
    color:rgb(218, 206, 174) !important;
    margin-right: 0;
}

.navbar-toggler
{
    background-color: rgb(218, 206, 174);
}

/*  Menus déroulants  */
.dropdown-item
{
    font-size: 18px;
}

.dropdown-item:hover
{
    background-color: #ffc107;
    color: #181717 !important;
    font-weight: 800;
}

.navbar navbar-expand
{
    height: 130px;
}

/* Accordéon info speleo page accueil */
.accordHomeMargin
{
    margin-top: 16px;
}

.dropdown-menu 
{
     background-color: #212529;
     position: relative;
}

header, .navbar
{
    background-color: #212529; 
}

.logo-navbar {
  height: 100px;
  max-height: 100%;
  transition: height 0.3s ease;
}

/* ====== */
/* footer */
/* ====== */

.footer
{
    height: 105px;
    background-color: #212529;
    text-align: center;
    color: rgb(218, 206, 174);
    margin: 0;
   
}

.footer a
{
    text-decoration: none;
    color:rgb(218, 206, 174);   
}

.footer a i
{
    width: 30px;
    margin-bottom: 1px;
}

/* ========= */
/* Page home */
/* ========= */

.homeClass
{
    background-image: url("../images/photos/backgHome.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

.homeText 
{
    color:black;
    font-size: larger ;
    text-indent: 2rem;
    text-align: justify;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    opacity: 0.70;
    padding: 3%;
    max-width: 100%; /* Div text de Meme largeur que "mapdiv" */
    background-color:rgb(243, 242, 237);
}
 .homeAccordion
{
    background-color:rgb(243, 242, 237);
}
.accordionHomeTitle
{
    font-size:25px ;
}


.homeDiv
{
    /* reglage de la largeur de la div de la map dans "home" */
    width:70%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    background-color:rgb(216, 205, 175);
}
/* Pour que la map glisse sous la navbar */
#homeMap, #siteMap
{
    z-index: 1 !important;
}
/*  Gestion de la couleur des badges "types de recherche" */
#Archeology, .archeology, #checkbox_archeology, .underground, #underground
{
    background-color: rgb(215, 197, 147);
    margin: 2;
    padding: 2;
    font-size: 10;
    color: rgb(41, 41, 39);
    width: 135px;
}

#Paleoclimate, .paleoclimate, #checkbox_paleoclimate, .outside, #outside
{
    background-color: rgb(189, 227, 200) ;
    color: rgb(41, 41, 39);
    text-align: center;
    font-size: 10;
    width: 135px;
    padding: 3px;
}


#Monitoring, .monitoring, #checkbox_monitoring
{
    background-color: rgb(173, 213, 237);
    color: rgb(41, 41, 39);
    text-align: center;
    font-size: 10;
    width: 135px;
}



#Geomorphology, .geomorphology, #checkbox_geomorphology
{
    background-color: rgb(231, 116, 135) ;
    color: rgb(41, 41, 39);
    text-align: center;
    font-size: 10;
    width: 135px;
}

#Hydrogeology, .hydrogeology, #checkbox_hydrogeology
{
    
    background-color: rgb(227, 205, 236) ;
    color: rgb(41, 41, 39);
    text-align: center;
    font-size: 10;
    width: 135px;
}

#Mineralogy, .mineralogy, #checkbox_mineralogy
{
    background-color: rgb(177, 171, 164) ;
    color: rgb(41, 41, 39);
    text-align: center;
    font-size: 10;
    width: 135px;
}

#inside, .inside
{
    background-color:rgb(120, 87, 42);
    color: rgb(218, 218, 183);
    text-align: center;
    font-size: 10;
    width: 135px;
}


.btn-warning 
{
    background-color:rgb(215, 197, 147) !important;
    border-color :#8d8e50
}


span .badge 
{
    margin: 2px;
    vertical-align: top ;
}


/* Couleur du cercle i en entete de tableaux + icon download */
th a i, i.fa.fa-download::before, td a i.fa-eye
{
    margin: 4px;
    color: rgb(160, 132, 98) !important;
}

/* Force les textes très longs à un retour à la ligne  */
/*  pour les support media petits */

table.dataTable
{
    vertical-align: top;
    
}

table.datatableSites, table.datatableSites thead tr, table.datatableSamples, table.datatableSamples thead tr, table.datatableprelevements, table.datatableprelevements thead tr, table.datatableStationSensors, table.datatableStationSensors thead tr
{
    width: 92%;  
    text-align: center;
    padding: 20px;   
}

/*  Taille de la div contenant la datatable page Home */
.outer
{
    padding: 10px 20px 5px 20px;
    
}
/* Attention sert pour la page d'accueil et la page listes des sites */
#datatableSites_wrapper
{
    /* background-color:rgb(218, 206, 174); */
     background-color: rgb(220, 215, 195);
     /* background-color: rgb(228, 225, 212); */

    border-radius: 1%;
    margin: 10px 10px 10px 10px;
    overflow: scroll;
}

.marker-cluster {
    background-color: rgba(35, 30, 30, 0.6);
    background-color: rgba(248, 235, 5, 0.6);
}

table.dataTable tbody tr.selected {
    font-size: 21px;
    background-color: white ;
    background-color: #ffc107 !important;
}

#datatableSites tbody tr 
{ 
    cursor: pointer; 
}

#datatableSites_filter, #datatableSites_length
{
    padding: 10px !important;
}


/* ========== */
/* Page Sites */
/* ========== */

.sitesClass
{
    background-image: url("../images/photos/backgHome.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

.sitesDiv
{
    width: 93%;
    min-height: 20% !important;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    background-color:rgb(220, 215, 195);  
    /* background-color: rgb(232,228,211); en attente validation couleur copil*/

}

.listSites
{
    /* background-color:rgb(220, 215, 195); */
    background-color: rgb(232,228,211);

}

.cac
{
    margin-right: 5px;
    padding-right: 7px;
}
/* Gestion de la largeur du datatable des sites page home et liste site */
#datatableSites_wrapper {
    max-width: 100%; 
    overflow: hidden; /*Pas de défilement */
 } 

 table.dataTable#datatableSites{
  table-layout: fixed; /* Colonnes avec des largeurs fixes */
    width: 100%;  /*Force l'ajustement au conteneur */
 } 

table.dataTable th input {
    width: 90%;
    box-sizing: border-box;
} 

/* ========= */
/* Page Site */
/* ========= */

.siteHeader
{
    background-color:rgb(158, 132, 101);
    font-size: 25px;
    color: rgb(15, 15, 15);
    text-align: center;
    padding: 2px;
}

/* Map sur la page "Site" */
#siteMap
{
    width: auto;
    min-height: 700px;
}
/* Card sur la page "home" */
#map
{
    margin: 0;
    margin-left: auto;
    margin-right: auto;
    height: 400px;
    width: 100%;
    border: 2px solid rgb(200, 150, 13);
    position : relative;
    display: inline-block;
}


.siteClass
{
    background-image: url("../images/photos/backgHome.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

.siteErrorClass
{
    background-color:white;
}

/* La card à droite de la map meme hauteur que #siteMap */
.siteCard 
{
    margin-left: 3vw;
    border-radius: 15px;
    width: auto;
    background-color: antiquewhite;
    min-height: 700px;
}

#siteTitleCard 
{
    background-color: rgb(160, 132, 98);
    color: white;
    padding: 1vw;
}

/* Div contenant l'image du site */
#DivSiteImg
{text-align: center; 
    height: 450px;
    width: 100%;
}

/* L'image du site */
#siteImgCard
{
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
    height: 98%;
    width: auto;  
}

.localityDescription-wrapper
{
   overflow-y: auto;
   padding: 10px; 
}

.accordion-button
{
    background-color: rgb(231, 207, 177) !important;
    color: rgb(158, 142, 106) !important;
    padding: 1vw;
}
.accordion-button:focus, .accordion-button .accordion-header
{
    background-color: antiquewhite;
    color: rgb(119, 86, 15) !important;

}

#accordion-item
{
    background-color: antiquewhite;  
}

.badgeAccordion{
    background-color: rgb(160, 132, 98);
 } 

 #divBadge
 {  
    flex-wrap: wrap;
 }

.bckgSampleSiteAccordeon
{
    background-color: rgb(253, 250, 235);
}

/* ============ */
/* Page Samples */
/* ============ */

.samplesClass
{
    /* background-image: url("../images/photos/backgHome.jpg");
    background-repeat: no-repeat;
    background-size: cover; */
    background-color: rgb(253, 250, 235);

}

.samplesDiv
{
    width: 90%;
    min-height: 20% !important;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    /* background-color:rgb(218, 206, 174); */
    /* background-color:rgb(220, 215, 195);   */

}
#datatableSamples, #datatableSites 
{
    background-color:#ccc;
}

/* ============ */
/* Page Sample */
/* ============ */

/* css pour la page d'un sample */
.sampleClass
{
    background-color: white ;
}

.card text-dark bg-light
{
   background-color: white ;
   min-width: 50%;
   max-width: auto;
}

/* Dimensionne l'image représentative de l'échantillon */
.sampleRepresentativeImage, .monitoringsampleRepresentativeImage, .stationRepresentativeImage 
{
    max-height: 350px;
    min-width: 200px;
}

/*  Taille modale diaporama  photos */
.carouselSample
{
    max-width: 400px ;
    height: auto;
}
/*  Fond noir modale diaporama photos sample */
.modal-body
{
    background-color: #000;
    
}

/* CSS pour gallery photos */
#gallerybackg
{
    background-repeat: no-repeat;
    color: #000;
    overflow-x: hidden;
    border-radius: 2%;
}

.lightbox-gallery p
{
    color:#fff;
}
.lightbox-gallery h2
{
    font-weight:bold;
    margin-bottom:30px;
    padding-top:30px;
    color:#fff;
}
@media (max-width:500)
{
    .lightbox-gallery h2
    {
        margin-bottom:25px;
        padding-top:25px;
        font-size:24px;
    }
}
.lightbox-gallery .intro
{
    font-size:16px;
    max-width:700px;
    margin:0 auto 40px;
}
.lightbox-gallery .intro p
{
    margin-bottom:0;
}

.lightbox-gallery .photos
{
    padding-bottom:20px;
}

.lightbox-gallery .item
{
    padding-bottom:30px;
}

/* Dimention de la div contenant les accordéons */
#accordionSection
{
    min-height: 100px;
    border-radius: 2%;
}

/* Force l'affichage du contenu du datatable Existing Analyses en noir sinon se met en blanc sur blanc */
.dtr-data,  #monitoringSampleAccordion .dtr-title
{
    overflow-x: auto;
    color: black !important;
}
#datatableSampleAnalyses, #datatableSamplePublications
{
    overflow: auto;
}
.dt-container
{
    table-layout: fixed;
}

.accordion-button
{
   background-color: rgb(223, 213, 188) !important;
}


a i, i.fa.fa-info-circle::before
{
    margin: 4px;
    color: rgb(227, 179, 34) !important;
}

/* Gestion des couleurs des informations dans les cards page "sample" */
p span a.nav-item:hover
{
    color: rgb(235, 178, 9) !important;
}

span a.nav-item
{
    color:rgb(126, 89, 43) !important;
    font-weight: bold;
}

/* Paramètrage Couleur Bootstrap "text-primary" en marron au lieu de bleu */
span.text-primary, .infoCard
{
    color:rgb(126, 89, 43) !important;
    font-weight: bold;
}

#titleCardMoreInformation
{
    background-color: rgb(223, 213, 188) ;
}

.commonLicenceSizeFont
{
    font-size: 17px;
    min-height: 6rem;
}


/*  Gestion du Title de card information et more information */
.card-header#titleCardSample, .card-header#moreInfoCardSample
{
    border-bottom: none !important;
    background-color: rgb(223, 213, 188) ;
}
/* *************************************** */
/****   Commun Pages intermediaires   ******/
/* *************************************** */

.textIntermediatePages
{
  color: rgb(218, 206, 174);
  font-size: 22px !important;
}

/*  background des cards */
.bkgroundIntermediatePage, .bkgrCardTextPGIntermediaire
{
  background-color: black;
  /* background-color: rgb(30, 27, 27); */
}

li .pointIntermediatePages
{
  font-style: italic;
  color: rgb(199, 151, 130 )!important;

}

.titleIntermediatePage, li.menu a.nav-link
{
  color: rgb(218, 206, 174);
}


a.nav-link.textIntermediatePages:hover 
{
  color:rgb(218, 206, 174) !important;
}

/*  Floutage de l'image paleo et monitoring*/
.blurring::before {
    content: "";
    position: absolute;
    top: -20px;
    left: -20px;
    right: -20px;
    bottom: -20px;
    background: radial-gradient(circle, rgba(153, 56, 17, 0.8) 20%, rgba(172, 97, 46, 0.1) 70%, rgba(126, 106, 92, 0) 100%);
    filter: blur(15px);
    z-index: -1;
    border-radius:40%;
}

.blurring
{
    border-image-outset: 0 ;
    background: radial-gradient(circle, rgba(215, 103, 17, 0.892) 10%, rgba(172, 89, 44, 0.1) 70%, rgba(209, 152, 53, 0) 85%); 
    border-radius:12%;
}


/* Background du body entier */
.archeologyClass, .monitoringClass, .paleoclimateClass, .geomorphologyClass, .hydrogeologyClass, .mineralogyClass
{
    background-color: black;
    min-height: 66vh;
    padding-top: 10vh ;
} 



/* ======================= */
/* Page Monoitorings list  */
/* ======================= */

.monitoringsClass, .monitoringsamplesClass
{
    background-color: rgb(253, 250, 235);
}

.parameter
{
    color: #121111;
}

/* ======================= */
/* Page STATIONS list  */
/* ======================= */
#stationsList
{
    min-height: 600px;
    width: 92%;  
    margin-left: auto;
    margin-right: auto;
}

.stationsClass, .sensorsClass, .sitesClass
{
    background-color: rgb(253, 250, 235);

}
.listTitle
{
    text-align: center;
}


/* ======================= */
/* Page STATIONS détails  */
/* ======================= */

.bkgroundColor
{
  background-color: rgb(253, 250, 235);

} 


/*  Pour le bouton hors toile avec la map */
.canvaBtnMapMonitoring
{
  border-color: rgb(221, 190, 105) ;
  border-width: 2px;
  display: block;
  margin: auto;
}

/* Texte des puces parameters */ 
/* .textLiStation
{
    color: #40403e;
} */

/*  Titres des accordéons page "STATION" */
#sensorAccordionBtn, #publicationAccordionBtn, #documentAccordionBtn, #imageAccordionBtn, #mapAccordionBtn, #sampleAccordionBtn, #sampleAccordionBtn, #stationAccordionBtn
{
    font-size: 30px !important;
    color: rgb(119, 86, 15) !important;
    font-weight: 500 !important;
}

/* Centrage des titres  */
.sensorAccordionBtn, #publicationAccordionBtn, .documentAccordionBtn, .imageAccordionBtn, #mapAccordionBtn, #sampleAccordionBtn, #sampleAccordionBtn,#stationAccordionBtn
{
    display: block;
}

/* Dimension de la div contenant l'image  */
.imageStation, .imageSample
{
    min-height: 370px;
}

/* Dimensionne l'image représentative de la station ou monitoringsamples*/
.stationRepresentativeImage, .stationRepresentativePlan, .monitoringsamplesDefaultImage
{

    /* max-height: 450px; */
    max-height: 400px;
    
}

/* Dimensions section information à droite de la photo */
.stationDivInfo, .siteDivInfo
{
    display: flex;
    align-items: center;
    min-height: 300px;
}
/* Dimensions des 2 cards information à droite de la photo */
.cardInfoStation, .cardInfoSensor, .cardInfoMonitoringsample
{
    min-height: 50%;
}

#sensor
{
    background-color: #fff;
}

#monitoringsamplesTitleCard
{
    /* background-color: rgb(223, 213, 188) ; */

}

#monitoringsamplesInfoCard
{
    min-height: 1170px;
   
}

#document
{
    background-color:  rgb(248,249,250);
}


/* ======================= */
/*   Page SENSOR détails   */
/* ======================= */
/* Gere les cards à droite de l'image*/
.cardInfoSensor
{
    min-height: 50%;
}

#iconLegalNotice
{
    max-width: 70px;
}

/* ================================== */
/*  Gestion datatables "Responsives   */
/* ================================== */

@media (max-width: 979px) {
    table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control,
    table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control {
        text-align: left;
    }

    table.dataTable .dtr-details {
        text-align: left;
    }
}
/*  Gestion de la ligne champs de recherche  */
/*  lorsqu'on est en mode mobile  */

/*****  Liste PRELEVEMENTS devenu MONITORING SAMPLES *****/
#datatablePrelevements thead th {
  vertical-align: bottom;
}

#datatablePrelevements thead .dt-title {
  font-weight: 600;
  margin-bottom: 4px;
}

#datatablePrelevements thead input {
  width: 100%;
  box-sizing: border-box;
  font-size: 0.85em;
}


#datatableStations thead input {
  width: 100%;
  box-sizing: border-box;
}
/*****  Liste des SPELEOTHEM SAMPLES *****/
#datatableSamples thead th {
  vertical-align: bottom;
}
#datatableSamples thead .dt-title {
  font-weight: 600;
  margin-bottom: 4px;
}

#datatableSamples thead input {
  width: 100%;
  box-sizing: border-box;
  font-size: 0.85em;
}
/*****  Liste des SITES ******/
#datatableSites thead th {
  vertical-align: bottom;
}
#datatableSites thead .dt-title {
  font-weight: 600;
  margin-bottom: 4px;
}

#datatableSites thead input {
  width: 100%;
  box-sizing: border-box;
  font-size: 0.85em;
}

/*****  Liste des MONITORING DATA  *****/
#datatableMonitorings thead th {
  vertical-align: bottom;
}
#datatableMonitorings thead .dt-title {
  font-weight: 600;
  margin-bottom: 4px;
}

#datatableMonitorings thead input {
  width: 100%;
  box-sizing: border-box;
  font-size: 0.85em;
}
/****  Liste des STATIONS  *****/
#datatableStations thead th {
  vertical-align: bottom;
}
#datatableStations thead .dt-title {
  font-weight: 600;
  margin-bottom: 4px;
}

#datatableSensors thead input {
  width: 100%;
  box-sizing: border-box;
  font-size: 0.85em;
}

/****  Liste des SENSORS  *****/
#datatableSensors thead th {
  vertical-align: bottom;
}
#datatableSensors thead .dt-title {
  font-weight: 600;
  margin-bottom: 4px;
}

#datatableSensors thead input {
  width: 100%;
  box-sizing: border-box;
  font-size: 0.85em;
}