/* === Logo d’en-tête === */
.header-logo {
  position: fixed;   /* reste visible même quand on défile */
  top: 10px;
  left: 80px;
  z-index: 1000;
  width: 130px;      /* définit la largeur du logo */
  height: auto;      /* garde les proportions d’origine */
}



/* Définir le style général du corps de la page */
body {
  font-family: "Arial";
  line-height: 1.5;
  max-width: 1500px;
  margin: 0 auto;
  padding: 2.0em;
  background-color: #ffffff;
  color: #706159;
  text-align: justify;
  font-size: 0.80em;
}


/* Style par défaut des titres selon leur niveau */

h1 {
  color: #ec6931;
  font-family: "Arial";
  font-size: 2.5em;
  text-align : center;
  font-weight: bold;
  margin-bottom: 0.5em;
  border-bottom: 2px solid #ec6931;
  padding-bottom: 0.2em;
}

h2 {
  color: #005358;
   font-family: "Arial";
  font-size: 1.5em;
  margin-top: 1.5em;
  margin-bottom: 0.5em;
}

h3 {
  color: #005358;
  font-family: "Arial";
  font-size: 1.2em;
  margin-top: 1.2em;
}

h4 {
  color: #005358;
  font-family: "Arial";
  font-size: 1.1em;
  margin-top: 1.2em;
  margin-bottom: 0.3em;
  text-align : center;
  font-weight: bold;
}

/* Style des paragraphes */

p {
  margin-bottom: 1.5em;
  text-align: justify;
}

/* Styliser le conteneur du Table of Content */
#TOC {
  background-color: white;
  padding: 0.5em 0.5em 0.5em 1em;
  border: 1px solid white;
  border-radius: 8px;
}

/* Position du TOC dans la barre latérale */
#quarto-margin-sidebar {
  margin-top: 80px;
}

/* Enlever les puces du TOC */
#TOC ul {
  list-style-type: none;
  padding-left: 0;
  margin-left: 0;
}

/* Aligner tous les titres à gauche */
#TOC li {
  text-align: left;
  padding-left: 0;
  margin-left: 0;
}

/* Liens du TOC */
#TOC a {
  display: block;
  color: #32797F;
  text-decoration: none;
  text-align: left;
  padding-left: 0;
}

/* Titre actif */
#TOC a.active {
  color: #ec6931;
  font-weight: bold;
  background-color: white;
  border-left: 3px solid #32797F;
  padding-left: 6px;
}

/* Effet au survol */
#TOC a:hover {
  text-decoration: underline;
}


/* Styliser les figures */

/* Figure containers */
figure {
  margin: 2em 0;
  text-align: center;
}

/* Images */
img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0,0,3,0.1);
}

/* Figure captions */
figcaption {
  color: #666;
  font-style: italic;
  font-size: 0.9em;
  margin-top: 0.5em;
}

/* === Style pour les phrases glue === */
.phrase-glue {
  color: #706159;
  font-family: "Arial";
  font-size: 1.0em;
  font-weight: 500;
  margin: 1.5em 0;
  line-height: 1.5;
}

.explication {
  background-color: #fff3cd;
  padding: 10px;
  border-radius: 5px;
  border-left: 4px solid #ec6931;
  font-family: 'Arial', sans-serif;  /* ou autre police */
  font-size: 13px;                    /* taille en pixels */
  line-height: 1.5;                   /* espacement entre les lignes */
  color: #706159;
}

.explication h2 {
  color: #ec6931;  /* Couleur du titre "Explication" */
  margin-top: 0;    /* Optionnel : enlever la marge du haut */
  font-size: 14px;  /* Optionnel : taille différente pour le titre */
}

.precision {
  background-color: #005f60;
  padding: 10px;
  border-radius: 5px;
  border-left: 4px solid #FFFAF5
  font-family: 'Arial', sans-serif;  /* ou autre police */
  font-size: 13px;                    /* taille en pixels */
  line-height: 1.5;                   /* espacement entre les lignes */
  color: #FFFAFA;
}

.precision h2 {
  color: #FFFAFA;  /* Couleur du titre "Explication" */
  margin-top: 0;    /* Optionnel : enlever la marge du haut */
  font-size: 14px;  /* Optionnel : taille différente pour le titre */
}


.callout.callout-note {
  background-color: #f0f7ff !important;
  border-left: 5px solid #32797F !important;
  border-radius: 5px;
  font-family: "Arial" !important;
  font-size: 0.80em!important;
  line-height: 1.5;
  color: #706159;
}

.callout.callout-style-default .callout-body {
  font-family: "Arial"!important;
  font-size: 1.2em!important;
  font-weight: 400!important;
}

.callout.callout-note .callout-title-container {
  color:#32797F !important;
  font-size: 13px;!important
  font-weight: 600;
}


.callout.callout-note .callout-icon {
  display: none !important;
}

.remarque {
  background-color: #fff3cd;
  padding: 20px;
  border-radius: 5px;
  border-left: 4px solid #ec6931;
  font-family: "Arial"!important;  
  font-size: 13px !important;                  
  line-height: 1.5;                   /* espacement entre les lignes */
  color: #706159 !important;
}

.remarque h2 {
  color: #ec6931;  /* Couleur du titre "Explication" */
  margin-top: 0;    /* Optionnel : enlever la marge du haut */
  font-size: 14px;  /* Optionnel : taille différente pour le titre */
}


.tableau_html {
  background-color: #EAF3FA;
  padding: 10px;
  border-radius: 5px;
  border-left: 4px solid #7dc2a5;
  font-family: "Arial";  /* ou autre police */
  font-size: 13px;                    /* taille en pixels */
  line-height: 1.5;                   /* espacement entre les lignes */
  color: #706159;
}

.tableau_html h2 {
  color: #7dc2a5;  /* Couleur du titre "Explication" */
  margin-top: 0;    /* Optionnel : enlever la marge du haut */
  font-size: 14px;  /* Optionnel : taille différente pour le titre */
}
/* === Permettre les layouts côte à côte pour les graphiques === */
.quarto-figure {
  display: inline-block;
}

.quarto-figure img,
.cell-output-display img {
  max-width: none;
  width: 100%;
}

/* Container pour layouts multiples */
.quarto-layout-panel {
  display: flex;
  gap: 1em;
}

.quarto-layout-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
}

/* Pour les layouts en colonnes */
.quarto-layout-cell {
  flex: 1;
  min-width: 0;
}

.quarto-layout-cell img {
  max-width: 100%;
  width: 100%;
  height: auto;
}

.footer-etude {
  margin-top: 3em;
  padding-top: 1em;
  border-top: 1px solid #ccc;
  text-align: right;

  /* Personnalisation du texte */
  font-family: "Arial";
  font-size: 0.95em;
  color: #706159;
}

.footer-etude strong {
  font-size: 1em;
  color: #706159;
  font-weight: normal;
}


.stat-box {
  display: inline-block;
  width: 30%;
  margin: 0.5%;
  padding: 20px;
  border-radius: 10px;
  text-align: center;
  color: white;
  vertical-align: top;
}

.stat-number {
  font-family: "Arial";
  text-align: center;
  font-size: 1.5em;
  font-weight: bold;
  display: block;
}

.stat-label {
  font-family: "Arial";
  text-align: center;
  font-size: 1em;
  margin-top: 5px;
}

.box-blue   { background-color: #f78104; }
.box-green  { background-color: #7dc2a5; }
.box-orange { background-color: #E67E4F; }