:root {
    --fontSize: 1.2em;
    --fontStyle: 'Roboto';
    --titleStyle: 'Roboto';
    --maxWidth: 1296px; /*valeur d'origine par défaut 960px*/
    --menuWidth: 17rem;

    --blockWarning: var(--blockImportant);
    --blockWarningLight: color-mix(in oklab, var(--blockImportant), transparent 95%);
    --blockAdvice: var(--blockFocus);
    --blockTip: var(--blockFocus);
    --blockExample: var(--blockFocus);
    --blockNote: var(--blockDiscrete);
    --blockLegal: var(--blockDiscrete);
    --blockComplement: var(--blockDiscrete);
    --blockComplementLight: color-mix(in oklab, var(--blockDiscrete), transparent 95%);
    --blockdocderef: #1148E0; /* Nouvelle variable pour le bloc docderef */
    --blockliensutiles: #1148E0; /* Nouvelle variable pour le bloc liens utiles */
    --blockdefinition: #F6AF00; /* Nouvelle variable pour le bloc liens utiles */

  
}

html[data-theme='light'] {
    --contentBG: #fff;
    --contentFG: #333;
    --contentLightBG: #f2f2f2; 
    --contentLightFG:#989898;

    --headerBG: #d9ebff;
    --headerFG: #292929;

    --titleFG: #292929;

    --accentColor:#295494;
    --accentColorAlpha:#2954943d;
    --accentDarkColor:#cf491b;
    --accentDarkFG: #fff;
    --accentLightColor: #f1f1f1;

    --borderColor: #c2c2c2;
    --borderColorAlpha: #c2c2c280;

    --menuBG: #326bb1;
    --menuFG: #ffffff;

    --elmtBG: #d9ebff;

    --blockImportant: #d14121;
    --blockFocus: #388e3c;
    --blockDiscrete: #795548;

    --footerBG: #d9ebff;
    --footerFG: #292929;

    --resultsBG: #e0f2e4;

    --schBG: #fff;
    --schFG: #000;
    --schCoef-1: #A91515;
    --schCoef-2: #936909;
    --schCoef-3: #268130;

    --scrollbar-thumb-color:#989898;
    --scrollbar-bgcolor:#f1f1f1;

/*Mise en colonne des éléments dans la légende des images commentées*/
  .screenZone_co {
    display: flex;
    flex-direction: column !important ;
 }

.tplHomeTitleFrame .tplHomeLogo {
    display: none;
    /* flex-direction: column; */
    /* justify-content: center; */
}

  /*Ajouter espace au niveau des blocs par défaut entre le titre du bloc et le paragraphe*/
.warning.block > .block_ti, .advice.block > .block_ti, .tip.block > .block_ti, .example.block > .block_ti, .note.block > .block_ti, .legal.block > .block_ti, .complement.block > .block_ti, 
.objectives.block > .block_ti, .agenda.block > .block_ti {
    margin-bottom: 10px;
}

/*@media (max-width: 580px){
.twoColumn #outline {
      position: absolute;
      width: auto;
      height: 100%;
      top: 0;
      display: flex;
      flex-direction: column;
      box-sizing: border-box;
      z-index: 999;
      background-color: var(--menuBG);
      font-size: 1rem;
      border-inline-end: 1px solid var(--borderColor);
      left: 0;
      transition: left 0.3s ease;
      width: 100px;

}

   }*/

}

html[data-theme='dark'] {
    --contentBG: #292929;
    --contentFG: #d5d5d5;
    --contentLightBG: #000;
    --contentLightFG:#989898;

    --headerBG: #3b3b3b;
    --headerFG: #fff;

    --titleFG: #fff;

    --accentColor:#6fb8ec;
    --accentColorAlpha:#815f891f;
    --accentDarkColor:#074f82;
    --accentDarkFG: #000;
    --accentLightColor: #011b39;

    --borderColor: #6c6c6c;
    --borderColorAlpha: #6c6c6c80;

    --menuBG: #3b3b3b;
    --menuFG: #6fb8ec;

    --elmtBG: #4c4c4c;

    --blockImportant: #FFA389;
    --blockFocus: #99d55a;
    --blockDiscrete: #ba8c7c;

    --footerBG: #3b3b3b;
    --footerFG: #fff;

    --resultsBG: #1e4827;

    --schBG: #000;
    --schFG: #fff;
    --schCoef-1: #F7726F;
    --schCoef-2: #B09B38;
    --schCoef-3: #28B336;

    --scrollbar-thumb-color:#074f82;
    --scrollbar-bgcolor:#000;

/*Mise en colonne des éléments dans la légende des images commentées*/
  .screenZone_co {
    display: flex;
    flex-direction: column !important ;
}

.tplHomeTitleFrame .tplHomeLogo {
    display: none;
    /* flex-direction: column; */
    /* justify-content: center; */
}

  /*Ajouter espace au niveau des blocs par défaut entre le titre du bloc et le paragraphe*/
.warning.block > .block_ti, .advice.block > .block_ti, .tip.block > .block_ti, .example.block > .block_ti, .note.block > .block_ti, .legal.block > .block_ti, .complement.block > .block_ti, 
.objectives.block > .block_ti, .agenda.block > .block_ti {
    margin-bottom: 10px;
}
  
}
  
#header .toolLayer {
    background-color: #f1f1f1;
}
.tplHomeTitleFrame {
    border-block-end: none;
}

/* Suppression couleur de fond des arbres synoptiques */
.treeRoot {
    background-color: #ffffff;
}
/*Modification de la couleur des encres dans les arbres synoptiques*/
.blockAnchor::before {
    color: #989898;
}

/*Foncer la couleur du texte de troisième niveau dans les arbres synoptiques*/
.block_co p {
    color: #3b3b3b;
}

/* Couleur des boutons pour le choix de visualisation dans les procédures */
.slpTools a.disabled_true {
    background-color: #326BB1;
}

/* Suppression filet des boutons pour le choix de visualisation dans les procédures */
a.slpBtnStp, a.slpBtnLst {
    border-block-end: 1px solid #C2C2C2;
}

/* Couleur des boutons pour le choix de visualisation dans les images commentées */
.scrTools a[aria-selected="true"] {
    background-color: #326BB1;
}

/* Suppression filet des boutons pour le choix de visualisation dans les images commentées */
.scrTools a {
    border-block-end: 1px solid #c2c2c2;
}

/* couleur des étiquettes de l'exercice de catégorisation */
.ddDropTi {
    background-color: #326BB1;
}

/* Changer couleur bloc exemple */
.example {
    --block-color: #007db8;
}
/*changer couleur du bloc trucs et astuces*/
.tip {
    --block-color: #f65678;
}

/* Couleur bloc conseil liseré + titre */
.advice {
    --block-color: #388e3c;
}

/* Couleur bloc remarque liseré + titre */
.note {
    --block-color: #e16f05;
}

/* Changer couleur du liseré du bloc complément */
.complement.block, .typed.block.cbk-closeable, .typed.block.cbk-closed {
    border-block-end: 3px solid #d9ebff;
}

/* Changer couleur fond du bloc complément */
.complement {
    --block-color: #326bb1;
    background-color: #d9ebff;
}

/* Changer couleur du titre du bloc complément */
.complement.block a.block_btn_closed, .complement.block a.block_btn_open {
    color: #074f82;
}

/* Faire en sorte que les nouveaux blocs importants créés soient violets */
.typed.important {
    --block-color: #a60db9;
    background-color: #f5dff7;
}
/* Couleur du bloc docderef :liseré */
.docderef {
    --block-color: #1148E0 !important; /* Force l'application de la couleur */
    border-left: 4px solid var(--block-color) !important; /* Liseré gauche */
}

/* Style du titre du bloc docderef */
.docderef .block_title {
    color: var(--block-color) !important; /* Couleur du titre */
}
/* Couleur du bloc liens utiles :liseré */
.liensutiles {
    --block-color: #1148E0 !important; /* Force l'application de la couleur */
    border-left: 4px solid var(--block-color) !important; /* Liseré gauche */
}

/* Style du titre du bloc liens utiles */
.liensutiles .block_title {
    color: var(--block-color) !important; /* Couleur du titre */
}
/*Couleur jaune message de retour pour exercice interactif*/
.feedback .WFeedbackEntry {
    background-color: 
 color-mix(in oklab, #F6AF00, transparent 85%);
    border-inline-start: 3px solid #F6AF00;
  }
.feedback .WFeedbackEntry::before {
    color: #F6AF00;
}
/* Couleur du bloc Définition :liseré */
.definition {
    --block-color: #F6AF00 !important; /* Force l'application de la couleur */
    border-left: 4px solid var(--block-color) !important; /* Liseré gauche */
}

/* Style du titre du bloc definition */
.definition .blockTitle {
    color: #333 !important; /* Couleur du titre */
}

/* styles des tableaux*/
table.txt_tb .txt_cellEmp_tbtd {
    color: #333;
  }
table.txt_tb caption {
    color: #333333;
   }
#outline {
    top: 0px;
    padding-top: 10rem;
    background: var(--menuBG) url(img/logo-abes-cercle.png) no-repeat center 1em;
}
.tplMenuScroll {
    display: block;
  }

/*Agrandir police du fil d'ariane*/
.tplContextMenu {
    font-size: 0.8em;
}

/*Agrandir police du titre du manuel dans le header*/
#header .tplTitle a {
    font-size: 1em;
}

/*FAQ agrandir police question*/
a.condensed_btn_open, a.condensed_btn_closed {
    font-size: 1.2em;
}
/*Couleur FAQ*/
section.condensedChild {
    background-color: #f1f1f1;
  }
/* Suppression du sommaire au niveau d ela page d'accueil du manuel*/
div.nestedTopics {
    display: none;
}

/*Hiérarchie des titres*/

h2 {
    font-size: 2em;
}

h3 {
    font-size: 1.8em;
}
h4 {
    font-size: 1.6em;
}

h5 {
    font-size: 1.4em;
}

h6 {
    font-size: 1.2em;
}

/*bug exercice catégorisation, croche grise qui ne sert à rien */

.mtTdArrow::before {
    color: #ffffff;
}

/*Bug menu sur mobile
.oneColumn #outline {
  left: calc(250% * -1);
}*/

@media (max-width: 580px){
.oneColumn #outline {
      position: absolute;
      width: auto;
      height: 100%;
      top: 0;
      display: flex;
      flex-direction: column;
      box-sizing: border-box;
      z-index: 999;
      background-color: var(--menuBG);
      font-size: 1rem;
      border-inline-end: 1px solid var(--borderColor);
      left: 0;
      transition: left 0.3s ease;
      width: 100px;

}

   }

/*bug menu latéral sur mobile qui ne se rétracte pas complètement : ne fonctionne pas
.oneColumn #outline {
 position: absolute;
 top: 0;
 bottom: 0;
 left: calc(160% * -1);
 display: flex;
 flex-direction: column;
 padding-block-end: 10px;
 padding-inline: 0;
 background-color: var(--menuBG);
 border-inline-end: 1px solid var(--borderColor);
 z-index: 99;
 transition: left 0.3s ease;
}*/


}