/* le SVG s’étire en largeur et garde son ratio */
/* #svgContainer svg {
    width: 100%;
    height: auto;
    display: block;
  } */

#Container {
  /* min-width:560px;
  height:580px; */
  overflow-x: auto;
}

.temp {
  color: #5a5a5a;
}
#exportBtn {
  padding: 0.5rem 1rem;
  font-size: 1rem;
  cursor: pointer;
}
.pdfbox {
  min-width: 200px;
  min-height: 200px;
  padding: 2px;
  /* margin: auto; */
  width: fit-content;
  /* display: inline-block; */
}
#svgContainer {
  max-width: 545px; /* ou toute autre largeur fixe */
  height: 565px; /* hauteur visible souhaitée */
  overflow-y: auto; /* permet le défilement vertical */
  border: 1px solid #ccc; /* pour la visibilité */
}
/* déjà défini dans style.css */
#consigne {
  line-height: 1.5;
}
#consigne mjx-container,
#consigne mjx-container * {
  background-color: transparent !important;
  /* font-size: 1rem; */
}
#correction mjx-container,
#correction mjx-container * {
  background-color: transparent !important;
  /* font-size: 1rem; */
  line-height: 0.25;
}
#resultat mjx-container,
#resultat mjx-container * {
  background-color: transparent !important;
  /* font-size: 1rem; */
  line-height: 0.25;
}
/* ******************************************** */
.exp-consigne {
  text-align: left;
  padding: 2px 20px;
}
.exp-containerBox {
  background-color: var(--blue-very-dark);
  border-radius: 4px;
  border: 4px solid #000000;
  max-width: 1160px;
  height:745px;
  overflow-y: auto;
}
.exp-container {
  /* background-color: var(--blue-very-dark);
  border-radius: 4px; */
  /* border: 4px solid #000000; */
  /* width: 1180px;     */
  /* width: 1160px; */
  /* overflow-y: auto; */
  font-size: 1.25em;
  margin: auto auto 2px auto;
  padding: 0px 0px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: left;
  align-content: flex-start;
  /* column-gap: 8px;  
  row-gap: 8px;    */
}
/* Scrollbar globale */
.exp-containerBox::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

/* Fond de la scrollbar */
.exp-containerBox::-webkit-scrollbar-track {
  background: #34546c2a;
  border-radius: 4px;
}

/* Poignée de la scrollbar */
.exp-containerBox::-webkit-scrollbar-thumb {
  background-color: hsl(207, 35%, 25%);
  border-radius: 4px;
  border: 2px solid var(--blue-very-dark);
}

/* Au survol */
.exp-containerBox::-webkit-scrollbar-thumb:hover {
  background-color: #3b5366;
}
.element {
  scrollbar-width: thin; /* auto | thin | none */
  scrollbar-color: #888 #f0f0f0; /* poignée | fond */
}
.expBox {
  flex: 1 1 210px;
  position: relative;
  /* height: 160px; */
  width: max-content;
  color: #000000;
  background-color: white;
  border-radius: 6px;
  border: 3px solid #000000;
  padding: 15px 30px; 
  font-size: 0.85em;
}
.expBox mjx-container,
.expBox mjx-container * {
  background-color: transparent !important;
  line-height: 0.125;
}
.base {
  width: 100%;
  height: 100%;
  background: lightblue;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background: rgba(255, 0, 0, 0.5) */
  z-index: 10;
}
.btncl {
  /* background-color: var(--blue-lite); */
  position: absolute;
  /* left: 50%;
  transform: translate(-50%, -50%);  */
  bottom: 5px;
  right: 5px;
  background-color: #87aac575;
  border: 2px solid var(--blue-dark);
  height: 24px;
  /* border: none; */
  color: var(--blue-dark);
  padding: 0px 5px;
  min-width: 42px;
  font-size: 12px;
  font-weight: bolder;
  cursor: pointer;
  border-radius: 6px 6px 6px 6px;
  margin: auto 4px;
}
.btnclOn {
  /* background-color: var(--blue-lite); */
  background-color: #87aac5;
}
.btncl:hover {
  background-color: #87aac5;
}
.btncl:disabled {
  background-color: #87aac575;
  color: #6492b4;
  cursor: auto;
}