/* #PRODUIRE{fond=css/couleurs.css}
   md5:77458655986b55b3321ffa0ea2f93e79 */

#nav {background-image : none;}



body h1,body .h1,body h2,body .h2,body h3,body .h3,body .page .h3-like,body h4,body .h4,body #entete .accueil #nom_site_spip{

font-family:Arial,Helvetica,sans-serif;}
body .page,.liste h3.h3{

font-family:Arial,Helvetica,sans-serif;}






#nav {background-image : none;}










/* backgrounds  */
html body{background-color:#A2A2A2;}
#header, thead th {background-color:#FFFFFF;}
#nav,.navbar-responsive.navbar-inverse .navbar-inner .nav-collapse,table.spip thead th,body .pagination ul > .active > span, div .forum .forum-fil .forum-chapo{background-color:#FFFFFF;}
body .navbar-inverse .btn-navbar{background-color: #FFFFFF; background-image : none;}
body #footer {background-color:#A2A2A2;}

.dropdown-menu > li > a:hover {background-image : none; background-color : #FFFFFF;}
.navbar-inverse .nav li.dropdown.active > .dropdown-toggle,.dropdown-menu li a:hover, .dropdown-menu li a:focus, .dropdown-menu > .active > a ,.navbar-inverse .nav .active > a:hover  ,.navbar-inverse .nav-collapse .nav > li > a:hover, body .navbar-inverse .nav .active > a{background-color:#EFEFEF;}
body #aside .rubriques,#formulaire_inscription{background-color:#FFFFFF;}
body .calendriermini .ui-state-highlight a {background-color:#C2C9CB;}
body .liste-items .item:hover,.page_sites .liste.syndics .liste-items .item:hover {background-color:#F6F6F6;}

/* Couleurs des bordures */
body #footer,.dynamic-tab-pane-control .tab-row .tab.selected {border-top:3px solid #FFFFFF;}
body #header .menu-items .item{border-right:1px groove #FFFFFF;}
body .documents_portfolio a:focus .spip_logo,body .documents_portfolio a:hover .spip_logo,body .documents_portfolio a:active .spip_logo {border-color:#A2A2A2;}

/* couleurs des titres  */
#nom_site_spip a, #slogan_site_spip{color:#000000;}
body h1,body .h1,body h2, body .h2,body h3, body h3.spip,body h2 a,body h2 a:hover,body h2 a:focus,body .h2 a,body .h2 a:hover,body .h2 a:focus{color:#02222b;}

/* couleurs des liens */
body a,body a.spip_out,body a.spip_out h3,body a.spip_in,body a.spip_glossaire{color :#0A507E;}
body a:focus,body a:hover,body a:active  {color :#1072B2; background-color : transparent;}
body #aside .rubriques a,#formulaire_inscription legend,#formulaire_inscription label,#formulaire_inscription p{color :#1072B2;}
body #aside .rubriques a:hover,body #aside .rubriques a:focus,body #aside .rubriques a:active {color :#000000;}
.navbar-inverse .nav > li > a,body #pied,body #pied a,body .pagination .on, div .forum .forum-fil .forum-chapo, div .forum .forum-fil .forum-chapo a, .navbar-inverse .nav-collapse .nav > li > a{color:#000000;}
body #nav .item a:hover,body #nav .item.on>a,body #nav .item.on .on>a, .navbar-inverse .nav-collapse .nav li > a:hover,.navbar-inverse .nav-collapse .nav > li.open a:hover{color:#000000;}
.navbar-inverse .nav-collapse .nav > li.open >a{color:#FFFFFF !important;}




#aside {margin : 0px; float : right;};

@media (max-width: 767px){
	.well {background-color : transparent; border : none;}
	#nav {background-color : transparent; background-image : none; border : none;}
	#header {border-bottom:3px solid #FFFFFF;}
	}	
	

/* ######################### */
/* Couleur du fond */
/* ######################### */
.page.container {
background-color: white;
}
/* ######################### */
/* ######################### */



/* ######################### */
/* Bandeau */
/* ######################### */
.logo-institution {
display:none;
}


.bandeau_complet {
padding-left: 10px;
padding-top: 10px;
padding-top: 0px;
padding-bottom: 10px;
}

#nom_site_spip {
margin-left: 70px;
margin-bottom: 0px;
font-size: 1.7em;
font-weight: 700;
*/font-variant-caps: small-caps;*/
line-height: 0.8em;
padding-top: 25px;
}


#header .container #nom_site_spip {
margin-bottom: 0px;
padding-top: 0px;
padding-top: 25px;
}

#slogan_site_spip{
padding-left: 70px;
font-size: 1.2em;
font-size: .95rem;
line-height: 1.5rem;
color: #000091;
}

#header .container {
min-height: unset;
}


#header .container .bandeau_complet .spip_logos {
margin: 0px;
}


  #header {
   border-bottom: none;
   }

   .menu.menu-container.navbar-inner.navbar-inverse.navbar-static-top {
   margin-right: 0px;
   }

.navbar-inverse .nav > li > a {
text-shadow: none;
}

#nav {
 border-width: 1px 0px 2px 0px;
 border-style: solid;
 border-color: #C2C9CB;
 /* background-image: url('https://controlessanitaires.fr/IMG/png/fond_nb_70.png'); */
background-color: #FFFFFF;

}

.navbar .nav > li {
font-weight: 400;
text-shadow: none ;
letter-spacing: .05rem;
}


.item.menu-entree {
/* background-color: rgba(255, 255, 255, 0.7);
margin-top: 5px;
margin-bottom: 5px; */
margin-left: 5px;
margin-right: 5px;
color: #FFFFFF;
}


/* ######################### */
/* ######################### */


.aside {
display: none;
}




.infos{
margin-left: 10px;
padding-right: 5px;
}


spam .on .active {
background-color: green;
}


body .pagination ul > .active > span {
background-color: #000091
}


/* ######################### */
/* Fil d'ariane */
/* ######################### */
/*
.breadcrumb {
margin-top: -14px;
margin-left: -14px;
margin-right: -14px;
}
*/

.active {
color: #000000;
}

.breadcrumb > li > .divider {
padding: 0 5px;
color: #797979;
}



/* ######################### */
/* ######################### */



#content .inner-content {
padding-top: 1em;
padding-left: 1em;
padding-right: 1em;
padding-bottom: 1em;
}




/* Pour les textes sur deux colonnes */
.sur_deux_colonnes {
column-count: 2;
}
/* ######################### */



/* ######################### */
/* On modifie la largeur globale du site */
/* ######################### */
/* Largeur de BASE (entre 980px et 1199 px) */ 
     .span9 {
     width: 940px;
     background-color: #FFFFFF;
     padding: 0px;
     }

#content .inner-content {
padding-left: 1em;
padding-right: 1em;
}


/* Largeur pour écran de largeur entre 0 et 767px; */ 
@media (max-width: 767px){
     .span9 {
    width: 100%;
    }

#content .inner-content {
padding-left: 0.3em;
padding-right: 0.3em;
}



/* Texte sur 2 colonnes passe sur 1 à petite largeur */
  .sur_deux_colonnes {
  column-count: 1;
}


/* ######################### */

}

/* ######################### */
/* Largeur pour écran de largeur entre 768px et 979px */ 
/* ######################### */
@media (max-width: 979px) and (min-width: 768px){
     .span9 {
     width: 725px;
    }

#content .inner-content {
padding-left: 1em;
padding-right: 1em;
}

}
/* ######################### */
/* ######################### */


/* ######################### */
/* Largeur pour écran de largeur supérieure à 1200 px */ 
/* ######################### */
@media (min-width: 1200px){
    .span9 {
    width: 1170px;
    }

#content .inner-content {
padding-left: 1em;
padding-right: 1em;
}

}
/* ######################### */
/* ######################### */




/* ######################### */
#nav {
margin-bottom: 0;
}
/* ######################### */

/* ######################### */
/* Pied de page */
/* ######################### */
#footer {
margin-top: 10px;
}

#footer .generator {
display: none;
}

#footer .colophon {
display: none;
}

a.lien_basdepage {
padding-top: 16px;
padding-bottom: 16px;
margin-top: 10px;
margin-bottom: 10px;
color: #FFFFFF;
}

a:hover.lien_basdepage {
color: #449BC8;
}

/* ######################### */


/* ######################### */
/* Définition des titres */
/* ######################### */

/* Titre du site */
.spip_logo {
float: left;
}



/*
html h2{
     margin-bottom: 0.5em;
     margin-top: 0em;
     font-size: 1.5em;
     font-variant: small-caps;
     border-bottom: 0 ;
     font-weight: bold;
     text-align: left;
     background-color: #000000;
     color: white;
     padding:5px;
     padding-left:15px;
     font-weight : 900;
}
*/

    html h2 {
background-color:none;
color: #161616;
border-bottom: 2px solid #000091; 
padding-bottom: 10px; 
margin-bottom: 20px; 
}

html h2 a{
     color: white;
}

html h2 a:hover{
     color: grey;
}

html h1{
     font-size: 1.5em;
     font-weight : 900;
     margin-bottom: 0.5em;
}



html h3{
     margin-bottom: 0.5em;
/*      margin-top: 1.3em;  */
     font-size: 1.3em;
     text-align: left;
     color: #4393D9;
     color: #0B5382;
     font-weight : 900;
}



html h2 i.fa {
     vertical-align:middle;
     color: white;
     font-weight : 100;
}
/* ######################### */


h2 {
    color: #000091;
    border-bottom: 2px solid #e5e5e5; 
    padding-bottom: 12px;
    margin-bottom: 24px;
    margin-top: 32px;
    font-weight: 700;
    font-size: 1.5rem; /* Ajustable selon vos besoins */
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}

/* Le petit détail DSFR : une barre d'accentuation plus courte sous le titre */
h2::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 40px;
    height: 2px;
    background-color: #000091;
}



/* ######################### */
/* Boutons CIBloc vers sites web */
/* ######################### */
.cibtn cibtn-defaut
{
padding-right:10px;
}
/* ######################### */


/* ######################### */
/* Boutons CIBloc vers sites web */
/* ######################### */
.cibtn a, .cibtn span
{
min-width: 300px;
margin-top: 0;
}
/* ######################### */


.cibtn-defaut a, .cibtn-defaut span
{
background-color: #1D3124!important;
border-color: #1D3124!important;

background-color: #0AC2F6!important;
border-color: #0AC2F6!important;

color: #FFF!important;
}


/* ######################### */
/* Boutons CIBloc accordéon */
/* ######################### */
.cibloc_accordeon_commun .accordeon_lien {
color: #549AC4!important;
}
/* ######################### */



/* ######################### */
/* Formulaire de recherche */
/* ######################### */

#formulaire_recherche
{
margin-left:10px;
margin-right:10px;
}

#formulaire_recherche input
{
border: 1px solid #9c9e9f;
border-radius: 4px;
height: 30px;
line-height: 30px;
padding: 1px 15px;
padding-left: 30px;
font-size: 16px;
color: #222;
-webkit-transition: border-color 200ms;
transition: border-color 200ms;
position: relative;
}


.formulaire_spip
{
margin-bottom: 10px;
}


.input-append .btn
{
display:none;
}


.ui-autocomplete
{
border: 2px solid #636397;
border-top: 0;
border-radius: 0 0 4px 4px;
padding-left: 0;
max-height: 240px;
overflow: auto;
}


.ui-menu-item-wrapper
{
width:90%;
height: auto;
line-height: 35px;
background: white;
border-top: 1px solid #e1e2e2;
color: #444;
padding: 15px 14px;
font-size: 16px;
border-left: 0;
border-right: 0;
border-bottom: 0;
}


.ui-autocomplete-loading
{
background:url('https://controlessanitaires.fr/squelettes/images/ajax-loader.gif') no-repeat left center ;
background-position: 10px center;
}
/* ######################### */
/* ######################### */



/* ######################### */
/* Numéros de page ajax */
/* ######################### */
.pagination{
text-align: center;
}
/* ######################### */




/* ######################### */

/* ######################### */
/* Page d'accueil */
/* ######################### */
article {
margin-left: 15px;
}
/* ######################### */


/* ######################### */
/* Carte et logos sur les cartes GIS */
/* ######################### */
.leaflet-marker-icon
{
  width:128px;
  height:128px;
}
/* ######################### */
/* ######################### */


/* ######################### */
/* Le tableau qui affiche les infos sur la fiche de l'établissement */
/* ######################### */
.tableau_informations  {
      width: 100%;
 }

.tableau_informations tbody td > * {
     vertical-align: top;
 }

.tableau_informations tbody tr:nth-child(odd) {
      background-color: #F0F0F0;
 }

.tableau_informations tbody tr:nth-child(even) {
      background-color: #FFFFFF;
 }

.premiere_colonne {
     font-weight: bold;
      width: 50%;
      width: 30%;
}
/* ######################### */
/* ######################### */



/* ######################### */
/* Le tableau qui liste les départements et régions */
/* ######################### */

.tableau_regions_departements tbody tr:nth-child(odd) {
      background-color: #EFEFEF;
 }

.tableau_regions_departements tbody tr:nth-child(even) {
      background-color: #C2C9CB;
 }

/*
.tableau_regions_departements tbody td, .tableau_regions_departements tbody span {
      padding-right:3em;
 }
*/
/* ######################### */
/* ######################### */




/* ######################### */
/* Tous les tableaux */
/* ######################### */

td p {
margin-bottom: 0px;
}


/* Adaptation à la largeur et retour à la ligne */
table {
width: auto;
word-wrap:break-word;
table-layout: fixed;
}

#statistiques_eple .tablesorter-header {
text-align: center;
vertical-align: middle;
background-image: none ;
padding: 1px ;
}

#statistiques_eple td {
padding: 1px;
text-align: right;
vertical-align: top;
}


.tablesorter-header-inner {
text-align: center;
}

.tablesorter-header.tablesorter-headerUnSorted {
background-color: #b7bdc1;
padding: 5px 2px 5px 2px;
padding: 0px 0px 0px 0px;
}

.tablesorter-header.tablesorter-headerDesc {
background-color: #b7bdc1;
padding: 5px 2px 5px 2px;
padding: 0px 0px 0px 0px;
}

.tablesorter-header.tablesorter-headerAsc {
background-color: #91989f;
padding: 0px 0px 0px 0px;
}


#tableau_stats {
width: auto;
font-size: 1em;
}

#tableau_stats tbody tr:nth-child(odd) {
      background-color: #EFEFEF;
}

#tableau_stats tbody tr:nth-child(even) {
      background-color: #C2C9CB;
}
/* ######################### */
/* ######################### */


/* ######################### */
/* Largeur des colonnes de texte */
/* ######################### */
col-sm-6 {
padding-left: 3px;
padding-right: 0px;
}


.cimulti_colonnes div.col-sm-6 {
padding-right: 0;
}

.cimulti_colonnes div.col-sm-12 {
padding-right: 0;
}

/* ######################### */


/* ######################### */
/* Pour virer l'espace à droite en mode responsive  */
/* ######################### */
.cimulti_colonnes {
  margin-right: 0rem!important;
}
/* ######################### */


html body {
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif;
    padding-left:0px;
    padding-right:0px;
    background-image: none ;
}



/* ######################### */
/* Zone de présentation  */
/* ######################### */
.presentation {
background-color: #efefef !important;
border: 1px solid #bfbfbf !important;
padding-top: 0.5rem !important;
padding-bottom: 0.5rem !important;
padding-right: 1.0rem !important;
padding-left: 1.0rem !important;
margin-bottom: 2em;
}
/* ######################### */




.vente {
    padding-top: 0px;
    padding-bottom: 10px;
    padding-left: 0px;
    padding-ritgh: 0px;
}


.vente:nth-of-type(odd) {
    background-color: #FFFFFF;
}
.vente:nth-of-type(even) {
    background-color: #FFFFFF;
}

.vente:hover {
/*  background-color: #BACEC1 ; */
}

.important{
     text-align: center;
      font-size: 1.2em;
     color: red;
}


/* ######################### */
/* liens surlignés pour faire plaisir à Page Speed Google*/
/* ######################### */
#content a:hover {
text-decoration: underline;
}
/* ######################### */


/* --- Mise en page globale --- */
.table-responsive {
    width: 100%;
    overflow-x: auto;
    margin: 20px 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    border-radius: 4px;
}

.tab-officiel {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    min-width: 700px;
}

/* --- En-tête --- */
.tab-officiel thead th {
    background: #f5f5f5;
    color: #000091; /* Bleu Institutionnel */
    padding: 15px 10px;
    font-size: 0.75rem;
    text-transform: uppercase;
    border-bottom: 2px solid #000091;
}

/* --- Cellules --- */
.tab-officiel td {
    padding: 12px 10px;
    border-bottom: 1px solid #eee;
    text-align: center;
    font-size: 0.9rem;
}

.tab-officiel tr:hover { background-color: #f9f9f9; }

.tab-officiel .txt-dep {
    text-align: right;
    font-weight: 600;
    color: #161616;
    background: #fcfcfc;
    border-right: 1px solid #eee;
}

.tab-officiel .txt-dep a { text-decoration: none; color: inherit; }
.tab-officiel .txt-dep a:hover { color: #000091; }

.tab-officiel .txt-total { font-weight: 700; }

.tab-officiel .txt-stats strong {
    display: block;
    color: #000091;
    font-size: 1rem;
}

.tab-officiel .txt-stats span {
    font-size: 0.75rem;
    color: #666;
}

/* --- Petits ronds de couleur --- */
.dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 5px;
}
.dot-green { background: #27a658; }
.dot-yellow { background: #ffca28; }
.dot-orange { background: #f57c00; }
.dot-red { background: #d32f2f; }

.tab-officiel .txt-empty { color: #999; font-style: italic; }


/* --- Conteneur Responsive (Scroll mobile) --- */
.table-container {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 2rem 0;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    background: #fff;
}

/* --- Style du Tableau --- */
.tab-officiel {
    width: 100%;
    border-collapse: collapse;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    min-width: 750px; /* Assure la lisibilité des colonnes */
}

/* En-tête bleu institutionnel */
.tab-officiel thead th {
    background-color: #f6f6f6;
    color: #000091; /* Bleu Marianne */
    padding: 15px 10px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid #000091;
}

/* Cellules */
.tab-officiel td {
    padding: 12px 10px;
    border-bottom: 1px solid #eee;
    text-align: center;
    vertical-align: middle;
}

/* Première colonne (Libellés) */
.tab-officiel .cell-nom {
    text-align: right;
    font-weight: 700;
    color: #161616;
    background-color: #fcfcfc;
    border-right: 1px solid #eee;
    width: 220px;
}

.tab-officiel .cell-nom a {
    text-decoration: none;
    color: inherit;
}

.tab-officiel .cell-nom a:hover {
    color: #000091;
    text-decoration: underline;
}

/* Mise en avant des chiffres */
.tab-officiel .cell-total {
    font-weight: 700;
    color: #161616;
}

.tab-officiel .cell-percent strong {
    display: block;
    color: #000091;
    font-size: 1.1rem;
}

.tab-officiel .cell-percent small {
    color: #666;
    font-size: 0.8rem;
}

/* Effet au survol */
.tab-officiel tbody tr:hover {
    background-color: #f4f4ff;
}

/* Indicateurs de couleur (Dots) */
.dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 5px;
    vertical-align: middle;
}
.dot-green { background-color: #27a658; }
.dot-yellow { background-color: #ffca28; }
.dot-orange { background-color: #f57c00; }
.dot-red { background-color: #d32f2f; }

/* Cas vide */
.tab-officiel .cell-empty {
    color: #999;
    font-style: italic;
    font-size: 0.85rem;
}



/* Style pour TableSorter */
th.header {
    background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZdgWQf1lHT6R4FADs=);
    background-repeat: no-repeat;
    background-position: center right;
    cursor: pointer;
    padding-right: 20px !important;
}

th.headerSortUp {
    background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8ByaHdfmYvawoXADs=);
    background-color: #e0e0f0;
}

th.headerSortDown {
    background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8ByaHdfmYvawoXADs=);
    background-color: #e0e0f0;
    transform: rotate(180deg); /* Simple astuce pour l'icône */
}

/* --- Mise en page globale --- */
.table-container {
    width: 100%;
    overflow-x: auto;
    margin: 20px 0;
    border: 1px solid #ddd;
    border-radius: 5px;
    background: #fff;
}

.tab-officiel {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
    min-width: 800px;
}

/* --- En-tête --- */
.tab-officiel thead th {
    background: #f6f6f6;
    color: #000091;
    padding: 12px 8px;
    font-size: 0.75rem;
    text-transform: uppercase;
    border-bottom: 2px solid #000091;
    text-align: center;
    vertical-align: bottom;
}

.tab-officiel thead th img {
    margin-bottom: 5px;
}

/* --- Cellules --- */
.tab-officiel td {
    padding: 10px;
    border-bottom: 1px solid #eee;
    text-align: center;
    vertical-align: middle;
}

.tab-officiel .cell-nom {
    text-align: right;
    font-weight: bold;
    background: #fcfcfc;
    border-right: 1px solid #eee;
    color: #333;
}

.tab-officiel .cell-total {
    font-weight: bold;
    font-size: 1rem;
}

/* --- Alignement icône + texte --- */
.stat-flex {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.stat-flex img {
    flex-shrink: 0;
}

.tab-officiel .cell-stats strong {
    color: #000091;
    font-size: 1rem;
}

.tab-officiel .cell-stats small {
    display: block;
    color: #888;
    font-size: 0.75rem;
    margin-top: 2px;
}

.tab-officiel tr:hover {
    background-color: #f8f8ff;
}

/* --- Style TableSorter --- */
.tab-officiel thead th.header {
    cursor: pointer;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24"><path d="M12 5.83L15.17 9l1.41-1.41L12 3 7.41 7.59 8.83 9 12 5.83zm0 12.34L8.83 15l-1.41 1.41L12 21l4.59-4.59L15.17 15 12 18.17z"/></svg>');
    background-repeat: no-repeat;
    background-position: center right 5px;
}


/* Titres et présentation */
h1 small { color: #666; font-size: 0.5em; font-weight: normal; }
.presentation { margin-bottom: 2rem; font-size: 1.1rem; line-height: 1.5; color: #333; }

/* Lien stats principal */
.stats-global-link { margin-bottom: 2.5rem; text-align: center; }
.btn-officiel.main {
    display: inline-flex;
    align-items: center;
    background: #000091;
    color: white;
    padding: 12px 24px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: bold;
    gap: 15px;
    transition: background 0.2s;
}
.btn-officiel.main:hover { background: #1212ff; }

/* Grille principale */
.grid-departements {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
    margin: 2rem 0;
}

/* Style de la carte */
.card-dep a {
    display: block;
    text-decoration: none;
    color: #161616;
    background: #ffffff;
    border: 1px solid #e5e5e5;
    border-bottom: 3px solid #000091; /* Bleu Institutionnel */
    transition: all 0.2s ease;
}

.card-dep a:hover {
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transform: translateY(-2px);
    background-color: #f9f9ff;
}

/* En-tête de la carte (Code + Nom) */
.card-header {
    padding: 15px;
    background: #f6f6f6;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #eee;
}

.card-header .code {
    background: #000091;
    color: white;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 3px;
    margin-right: 12px;
    font-size: 0.9rem;
}

.card-header .nom {
    font-size: 1.05rem;
    color: #161616;
}

/* Corps de la carte */
.card-body {
    padding: 15px;
}

.card-body .region {
    display: block;
    font-size: 0.75rem;
    text-transform: uppercase;
    color: #666;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}

.card-body .action {
    display: block;
    font-weight: bold;
    color: #000091;
    font-size: 0.9rem;
}

.card-body .action i {
    margin-right: 5px;
}


/* Titre et texte */
h1 small { color: #666; font-size: 0.6em; font-weight: normal; vertical-align: middle; }
.presentation { margin-bottom: 2.5rem; color: #3b3b3b; font-size: 1.1rem; }

/* La Grille */
.grid-regions {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 20px;
    margin-bottom: 3rem;
}

/* La Carte Région */
.card-region a {
    display: block;
    text-decoration: none;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-left: 5px solid #000091; /* Signature bleue à gauche */
    padding: 20px;
    transition: all 0.2s ease;
}

.card-region a:hover {
    background-color: #f9f9ff;
    border-left-width: 10px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.card-content {
    display: flex;
    align-items: center;
    gap: 20px;
}

.icon-box {
    color: #000091;
    font-size: 1.8rem;
    opacity: 0.3;
}

.text-box {
    display: flex;
    flex-direction: column;
}

.text-box .nom {
    font-size: 1.2rem;
    color: #161616;
    margin-bottom: 5px;
}

.text-box .action {
    font-size: 0.85rem;
    color: #000091;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.text-box .action i {
    font-size: 0.7rem;
    margin-left: 5px;
    transition: transform 0.2s;
}

.card-region a:hover .action i {
    transform: translateX(5px);
}

/* Mobile */
@media (max-width: 600px) {
    .grid-regions { grid-template-columns: 1fr; }
}

.nb-stats {
    display: block;
    margin-bottom: 10px;
    font-size: 0.95rem;
    color: #444;
}

.nb-stats i {
    color: #000091;
    margin-right: 5px;
    opacity: 0.6;
}

.nb-stats strong {
    color: #161616;
}

.card-body .action {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #000091;
    font-weight: bold;
}


/* Titre avec icone */
.h-icon { font-size: 1.4rem; margin-bottom: 20px; color: #FFFFFF; border-bottom: 2px solid #eee; padding-bottom: 10px; }
.h-icon i { margin-right: 10px; opacity: 0.5; }

/* Grille des communes */
.grid-communes {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 8px;
    max-height: 800px; /* On limite la hauteur pour ne pas pousser la carte trop bas */
    overflow-y: auto;  /* Scroll interne si trop de villes */
    padding-right: 10px;
}

.card-commune a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f6f6f6;
    padding: 8px 12px;
    text-decoration: none;
    color: #333;
    border-radius: 4px;
    border: 1px solid #eee;
    font-size: 0.9rem;
    transition: all 0.2s;
}

/* État au survol de la carte commune */
.card-commune a:hover {
    border-color: #000091;
    background: #000091 !important; /* Fond bleu officiel */
    color: #ffffff !important;      /* Texte de la ville en blanc */
    transform: translateX(3px);
    text-decoration: none;
}


.badge-count {
    background: #e5e5e5;
    color: #666;
    font-size: 0.75rem;
    padding: 2px 6px;
    border-radius: 10px;
    font-weight: bold;
}


/* On force aussi le badge à changer de look au survol pour éviter le blanc sur blanc */
.card-commune a:hover .badge-count {
    background: #ffffff !important; /* Le badge devient blanc */
    color: #000091 !important;      /* Le chiffre devient bleu */
}

/* Carte */
.wrapper-carte {
    border: 1px solid #ccc;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    margin-bottom: 20px;
}


.is-commune {
    font-weight: bold !important;
    color: #000000 !important;
}



/* Le conteneur principal du haut */
#entete {
    background: #fff !important;
    border-bottom: 1px solid #e5e5e5 !important;
    padding: 20px 0 !important;
    box-shadow: none !important; /* On retire l'ombre portée */
}

/* Ton titre principal */
#entete .nom-site a {
    color: #161616 !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-decoration: none;
    font-size: 1.4rem;
}

/* Le slogan/sous-titre */
#entete .slogan-site {
    color: #666 !important;
    font-size: 0.9rem;
    margin-top: 5px;
}



/* La barre de navigation */
#nav {
    background-color: #fff !important;
    border-top: 1px solid #e5e5e5 !important;
    border-bottom: 2px solid #000091 !important; /* Barre bleue DSFR */
    padding: 0 !important;
}

/* Les éléments du menu */
#nav ul.menu-items {
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
}

#nav ul.menu-items li {
    margin: 0;
}

#nav ul.menu-items li a {
    color: #161616 !important;
    font-weight: 500 !important;
    padding: 12px 20px !important;
    display: block;
    text-decoration: none;
    transition: background 0.2s;
}

/* Effet de survol façon État Français */
#nav ul.menu-items li a:hover {
    background-color: #f6f6f6 !important;
    color: #000091 !important;
}

/* Élément actif (la page où l'on se trouve) */
#nav ul.menu-items li.on a {
    background-color: #f6f6f6 !important;
    color: #000091 !important;
    font-weight: 700 !important;
}




.formulaire_recherche input.text {
    border: none !important;
    border-bottom: 2px solid #000091 !important;
    background-color: #f6f6f6 !important;
    padding: 8px 12px !important;
    border-radius: 4px 4px 0 0 !important;
}

.formulaire_recherche .submit {
    background-color: #000091 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 8px 15px !important;
}




/* --- Mise en forme du bandeau complet --- */
.bandeau_complet {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    padding: 15px 20px !important;
}

/* --- Style du Logo --- */
.bandeau_complet .spip_logo {
    width: 80px !important; /* On le réduit un peu pour plus d'élégance */
    height: auto !important;
    border-radius: 4px;
}

/* --- Bloc Titre et Slogan --- */
.bandeau_complet .infos {
    border-left: 1px solid #ddd !important; /* Filet de séparation discret */
    padding-left: 20px !important;
}

/* --- Le Titre (Style DSFR) --- */
#nom_site_spip.h1 {
    margin: 0 !important;
    padding: 0 !important;
}

#nom_site_spip.h1 a {
    color: #161616 !important; /* Noir neutre DSFR */
    font-size: 1.8rem !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: -0.5px !important;
    text-decoration: none !important;
    line-height: 1 !important;
    display: block !important;
}

/* Petit effet au survol */
#nom_site_spip.h1 a:hover {
    color: #000091 !important; /* Bleu France au survol */
}

/* --- Le Slogan --- */
#slogan_site_spip {
    margin-top: 8px !important;
    color: #666 !important;
    font-size: 0.95rem !important;
    line-height: 1.4 !important;
    max-width: 600px;
    padding-left: 0px;
}