:root {
    --dark-theme-bg: #22272e;
    --dark-theme-txt: #adbac7;
    --grey-color: #777;
    /*--nav-height: 4em;*/
    --third-color : #0a84ff;
    --right-width: 35%;
    --btn-tabs-height: 40px;
}


/** temp addons (if jatsParser enabled)*/
/*.jatsParser__meta, #jatsParserFullText > h2, #jatsParserFullText > p, .usernav,.journal_branding, .jatsParser__cover-wrapper,*/
/*nav li.dropdown, button.navbar-toggler {*/
/*    display: none;*/
/*}*/
/***************************************/

/* hides pkp ojs stuff */
/*#navigationUserWrapper, section.item, .cmp_skip_to_content, .pkp_navigation_primary_row, .pkp_site_name_wrapper,*/
/*.entry_details, .pkp_brand_footer{*/
/*    display:none;*/
/*}*/


*{
    /*border-width: 0;*/
    margin: 0;
    padding: 0;
}

/*.pkp_structure_main::before, .pkp_structure_main::after{*/
/*    background: none;*/
/*}*/

/*.pkp_structure_content, .pkp_structure_main, .obj_article_details .main_entry{*/
/*    margin: 0;*/
/*    padding: 0;*/
/*    width: auto;*/
/*}*/

/*********/
nav {
    /*height: var(--nav-height);*/
    position: fixed;
    width: 100%;
    border-bottom : 1px solid black;
    background-color: white;
    box-sizing: border-box;
}

body.dark nav{
    border-color : var(--dark-theme-txt);
    background-color: var(--dark-theme-bg);
}


nav li {
    display: inline-block;
    padding:5px;
}

#mode-color-btns{
    position: fixed;
    top:5px;
    right: 5px;
    z-index:10;
}
#sun, #moon{
    cursor: pointer;
    width: 24px;
    height: 24px;
    border: none;
    background-color: transparent;
}


body.dark{
    background-color: var(--dark-theme-bg);
    color: var(--dark-theme-txt);
}

.wrap {
    /*padding-top: calc(var(--nav-height));*/
    font-family: "Noto Sans",-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif;
    /*border-top: 1px solid black;*/
}

section.back{
    display: none;
}

.article-and-metas{
    display: flex;
    max-width: 100vw;
}

.left-contents {
    width: 65%;
    overflow-y: auto;
    max-height: 100vh;/*calc(100vh - var(--nav-height));*/
    scrollbar-color: var(--third-color) var(--third-color);
    /*margin-top: var(--nav-height);*/
}

.article-wrap{
    max-width: 820px;
    margin-left: auto;
    margin-right: auto;
}

.right-contents {
    width: var(--right-width);
    position: fixed;
    right:0px;
    top: 0;/*calc(var(--nav-height));*/
    overflow-y: auto;
    scrollbar-width: thin;
    height: 100vh;/*calc(100vh - var(--nav-height));*/
    border-left: 1px solid black;
}

.left-contents h1:not(div.boxed-text *) {
    font-size: 3.2rem;
    margin-bottom: 20px;
    line-height: normal;
    padding-top: 25px;/*calc(var(--nav-height));*/
}


.article-wrap ul, .article-wrap ol{
    margin-left: 40px;
}
/*.left-contents section.body, .left-contents h1{*/
    /*width: 65%;*/
/*}*/
section.body, section.front {
    padding-right: 15px ;
}

section.body {
    font-size: 150%;
    padding-right:50px ;
    line-height: normal ;
}


section.front ol, section.front ol {
    padding-left: 25px ;
}


.button-tabs{
    border-bottom : 1px solid black;
    position: fixed;
    width: var(--right-width);
    height: var(--btn-tabs-height);
    z-index: 1;
    background-color: white;
}

.dark .button-tabs {
    border-bottom: 1px solid var(--dark-theme-txt);
    background-color: var(--dark-theme-bg);
}

.tab-btn{
    background-color: white;
    padding: 10px ;
    font-size: 1rem;
    cursor: pointer;
    border: none;
    font-weight: bold;
    height: var(--btn-tabs-height);
    border-right:1px solid black;
}
.dark .tab-btn {
    border-right:1px solid var(--dark-theme-txt);
}

.content-tab{
    padding: calc(var(--btn-tabs-height) + 10px) 20px;
}

.content-tab .bibliography {
    border:none;
}

.focus-tab{
    background-color: black;
    color: white;
}


.dark .tab-btn{
    background-color: var(--dark-theme-bg);
    color: #adbac7;
}

.dark .focus-tab{
    color: var(--dark-theme-bg);
    background-color: var(--dark-theme-txt);
}

.dark .right-contents {
    border-color: var(--dark-theme-txt);
}


/***** section/h *******/
section.body p:not(div.boxed-text *) {
    margin-top:10px ;
    line-height: 150% ;
    word-wrap: break-word
}

/*
section.body p:first-child {
	margin-top:50px;	
}
*/

.title-sup,
.z39-98 {
    display: inline-block;
	margin-top: 10px;
    font-size: 1.2rem;
	background-color: var(--dark-theme-txt);
    padding-right:2rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-weight: 450;
}

.title-trl {
	margin-top: 20px;
    margin-bottom: 15px;
    font-size: 2rem;
	font-style:italic;
}

.title-sub {
	font-size: 2.4rem;
	margin-top: 25px ;
}

section.body h2:not(div.boxed-text *) {
    margin-top: 30px ;
    margin-bottom: 15px ;
    font-size: 3rem;
    /*line-height: 200%;*/
}

section.body h3:not(div.boxed-text *) {
    margin-top: 25px ;
    margin-bottom: 10px ;
    font-size: 2.5rem;
    /*line-height: 100%;*/
}

section.body h4:not(div.boxed-text *) {
    margin-top: 15px ;
    margin-bottom: 5px ;
    font-size: 2rem;
    /*line-height: 15%;*/
}

section.body h5 {
    margin-top: 15px ;
    margin-bottom: 5px ;
    font-size: 1.6rem;
    /*line-height: 15%;*/
}

section.body h6 {
    margin-top: 15px ;
    margin-bottom: 5px ;
    font-size: 1.4rem;
    /*line-height: 15%;*/
}

/***** figure *******/
figure {
    width: 100%;
    min-height: 100px;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #999;
    margin: 25px 0px;
    background-color: #454545;
}

img {
    width: 100%;
}

.caption {
    padding: 8px;
}

.fig-call-window,
.fig-call-window a,
.fig-call-window a:visited,
.table-call-window,
.table-call-window a,
.table-call-window a:visited {
    color:var(--third-color);  
    text-decoration: none;
}

.table-call-window {
    position: relative;
    top: -10px;
    left: 355px;
    margin-top: -26px;
}

/* right pane */
div[id='figures'] figure {
    border-bottom:1px solid var(--grey-color); 
    padding-bottom: 30px;
    background-color: inherit;
}

/****** formula ******/
.fig-formula {
    background-color:white;
    color: black;
}

figure[class='fig-formula inline'] {
    display:inline;
}

/****** table ******/
table caption {
    font-size: 1.2rem;
    font-style: italic;
}

table {
    display: none;
    width: 100%;
}

table[class='linguistic'] {
    display: table;
    width: 100%;
    margin-top:1em;
    margin-bottom: 1em;
}

td,th {
    border-bottom:1px solid #ccc;
    font-size:1.1rem;
}

.fig-table label {
    padding: 10px;
    margin: 0;
    cursor: pointer;
    padding-left: 1em;
    max-width: 80%;
}

.expand {
    color: var(--third-color);
    text-decoration: none;
    position: relative;
    right: 45%;
    top: 37px;
    margin-top: -27px;
}

span[class='expand empty'] {
    color: var(--third-color);
    text-decoration: none;
    position: relative;
    right: 45%;
    top: 20px;
    margin-top: -27px;
}

.credits {
    margin: 0 5 5 20px;
    font-size:smaller;
    align-self: flex-start;
}

/*counters*/
section.body {
    counter-reset: section;
}

section.body  h2:not(div.boxed-text *){
    counter-reset: subsection;
}
section.body h3:not(div.boxed-text *){
    counter-reset: subsubsection;
}
section.body h4:not(div.boxed-text *){
    counter-reset: subsubsubsection;
}


/* biblio end */
.bibliography {
    margin-top:4ex;
    border-top:1px solid #efefef;
}

section.bibliography h2 {
    font-size: 2rem;
}

section.bibliography h3 {
    font-size: 1.8rem;
}

section.bibliography ul {
    list-style-type: none;
    margin-left: 0;
}

section.bibliography li.bibl {
    font-size:1.3rem;
}


/***** TOC *******/

#toc li {
    margin-top:5px;
}
#toc a {
    color: black;
    text-decoration: none;
   /* padding-left: 5px;
    padding-right: 5px;*/
    /*display: inline-block;*/
}

#toc a:hover{
    color: var(--grey-color);
}

.dark #toc a {
    color: var(--dark-theme-txt);
}

#toc a.active {
    color: white;
    background-color: black;
    padding-left: 5px;
    padding-right: 5px;
}

.dark #toc a.active {
    color: var(--dark-theme-bg);
    background-color: var(--dark-theme-txt);
}

#toc ol {
    list-style-type: none;
}

#toc .section2 {
    margin-left:5%;
}

#toc .section3 {
    margin-left:10%;
}

#toc .section4 {
    margin-left:15%;
}

#toc .section5 {
    margin-left:20%;
}

.toc-floatingText {
    background-color: #ddd;
}

/***** REVIEW *******/
.author-aut,
.authority_affiliation {
    text-align: right;
}

/***** INLINE ELEMENTS******/

span[class*="fn-call"], sup{ /** must not affect line height **/
    font-size: .60em;
    vertical-align: 0.65em;
    line-height: 0;
}

span[class*="fn-call"] {
    /*font-variant-position: super;*/
    color: var(--third-color);
    cursor: pointer;
}

span.bibr-call{
    text-decoration: underline;
    cursor: pointer;
}

/***** FOOTNOTES ******/
div[id^="footnotes"] ul,
div[id^="footnotes"] ul {
    list-style-type: none;
}

div[id^="footnotes"] li{
    box-sizing: border-box;
    padding: 20px 10px 20px 10px;
    border-bottom: 1px solid #888;
}

div[id^="footnotes"] li.focus, #refs .ref.focus{
    border-right: 5px solid var(--third-color);
}

div[id^="footnotes"] li .label {
    display: inline-block;
    margin-right:10px;
    cursor: pointer;
}

div[id^="footnotes"] li .label:hover{
    color: var(--grey-color);
}

div[id^="footnotes"] li .label:before {
    content: '[';
}

div[id^="footnotes"] li .label:after {
    content: '] ';
}

/*
#footnotes .label {
    color:var(--third-color);
}
*/

div[id^="footnotes"] .label {
    color:var(--third-color);
}

.mixed-citation {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 10px;
    border-bottom: 1px solid #888;
}

.dark div[id^="footnotes"] li, .dark .mixed-citation {
    border-bottom: 1px solid var(--dark-theme-txt);
}

/*********** INDEX **********/
#index .index-level1 {
    list-style-type: none;
    margin-top: 3%;
    font-weight: bold;
}

#index .index-level2 {
    list-style-type: none;
    margin-top: 1%;
    margin-left: 5%;
    font-weight: normal;
}

#index .index-level3 {
    list-style-type: none;
    margin-top: 1%;
    margin-left: 5%;
    font-weight: normal;
}

.index-anchor {
    color:var(--third-color);
    font-size: 75%;
}

.index-link:first-of-type {
    margin-left: 12px;
}

/* collapse via toggle-button */
.index-level2 {
  display: none;
}

.toggle-button {
  cursor: pointer;
  color:var(--third-color);
}

.expanded .toggle-button::after {
  content: "[-]";
}

.collapsed .toggle-button::after {
  content: "[+]";
}

/******************************************/
.journal-meta {
    padding: 10px;
}

.meta-field:before {
    display: block;
    color: var(--grey-color);
    margin-top: 10px;
    content:"";
}

/*
.meta-field::before {
  content: '\f007'; 
  font-family: 'Font Awesome 6 Free'; 
  position: absolute; 
  right: 10px; 
  font-size: 24px; 
  color: var(--grey-color); 
}
*/

.subject:before{
    content : "Sujet";

}
.article-title:before {
    content : "Titre";
}
.subtitle:before {
    content : "Sous-titre";
}

.trans-title:before{
    content : "Titre traduit";

}
.contrib-group:before{
    content : "Contributeurs";

}

.abstract {
    margin-top:6px;
}

.correction {
    border:1px solid black;
    margin-top:6px;
    padding:3px;
}

.ack {
    font-style: italic;
    margin-top:6px;
}

.front .epigraph {
    margin-top:6px;
}

.kwd-group:before{
    content: "Mots-clés";
}

.kwd {
    display:inline-block;
    margin-right:5px;

}

.kwd:after{
    margin-left:5px;
    content: "·";
}

.underline {
    text-decoration: underline;
}

div[class='idno'] {
    border-bottom: 1px dotted black;
    padding-bottom: 10px;
}

.bio {
    margin-bottom:2ex;
}

/********* BOXED TEXT **********/
div.boxed-text {
    border: 1px solid var(--grey-color);
    border-radius:25px;
    padding: 15px;
    padding-top:5px;
    padding-bottom:5px;
    margin-top: 10px;
    margin-bottom:10px;
}

div.boxed-text h1 {
	font-size: 2.3rem;
    margin-bottom: 10px;
    line-height: normal;
    padding-top: 25px;
}

div.boxed-text h2 {
	font-size: 1.8rem;
    margin-bottom: 20px;
    line-height: normal;
    padding-top: 25px;
}

div.boxed-text h3 {
	font-size: 1.6rem;
    margin-bottom: 20px;
    line-height: normal;
    padding-top: 25px;
}

div.boxed-text p {
	font-size:1.2rem;
	margin-top: 10px;
	line-height: 150%;
	word-wrap: break-word;
}

div.boxed-text * {
	font-size:1.2rem;
}

/** galleys DL links**/
div.item.galleys {
    position: fixed;
    top:20px;
    right: 75px;
    display: flex;
    justify-content: right;
    font-size:0.75rem;
}
div.item.galleys h2 {
    display: none;
}
div.item.galleys ul {
    list-style-type: none;
}

/*********** QUOTE *******************/
disp-quote {
    display: block;
    text-align:right;
}

blockquote {    
    padding-left: 5%;
}

.quotation2 {
    border-left: 2px solid var(--grey-color);
    padding-left: 5%;
    margin-left: -5%;
}

/*********** BR *******************/
.lb::after {
    content: "\a";
    white-space: pre;
}

/*************** DRAG-BAR ***************************/
ul, ol {
    margin-top:2ex; 
    margin-bottom:2ex;
    line-height: 150% ;
}

iframe {
    border: solid 0.5pt;
}

#map { height: 400px; }

#drag-bar {
    width: 1px;
    cursor: col-resize;
    background-color: black;
    display: block;
    z-index: 1000;
}

#drag-bar:hover {
    width: 5px;
    cursor: col-resize;
    background-color: #ddd;
    z-index: 1000;
}