:root {
    --appli-color:#00abff;
    --appli-color-dark:#4f8593;
    --appli-color-darker:#2d4a52;
    --appli-forecolor:floralwhite;
    --appli-black:#000000f0;
    
    --bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2859, 100, 111, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='1' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
/* .appliColor,.appliColor:hover{
    color: var(--appli-color);
} */
.bg-appliColor{
    background-color: var(--appli-color);
}
.bg-dark{
    background-color:var(--appli-black) !important;
}
.bk-appliColor-darker{
    background-color: var(--appli-color-darker);
}
html{
    /*background-color: #0d0f0f;*/
    color:var(--appli-forecolor);
}
.border-dashed{
    border-style: dashed;
}
button{
    border-radius: 4px !important;
}

.formbtn{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-right: .25rem !important;
    padding-left: .25rem !important;
    margin-right: .25rem !important;
    margin-left: .25rem !important;
}

button.appliColor,.btn-txt.appliColor, .btn-link.appliColor {
    color:var(--appli-forecolor);
    background-color:var(--appli-color);
}
button.appliColor:hover, .btn-txt:hover, .btn-link:hover{
    color:var(--appli-forecolor);
    background-color:var(--appli-color-darker);
    border-color: var(--appli-color);
}

.btn-txt, .btn-link {
    background-color: unset;
    color: var(--appli-forecolor) ;
    padding: 4px;
    text-decoration: none !important;
    border-radius: 4px;
    text-align: center;
}
.btn-link.bg-secondary{
    color:  var(--bs-body-color);
}
.btn-link.bg-secondary:hover,
.btn.bg-secondary:hover{
    color: var(--appli-forecolor);
    border:none;
}

.btn-txt:hover, .btn-link:hover {
    /* background-color: var(--appli-color-darker); */
    cursor: pointer;
  }

.form-control.darkmode,
.dmSensitive.darkmode>*:not(.alert){
    color : var(--appli-forecolor) !important;
    border-color : var(--appli-forecolor) !important;
}
.form-control,
.dmSensitive>*{
    color : var(--appli-black);
    border-color : var(--appli-black) !important;

}
/* .light{
    color : var(--appli-black);
}
.light.darkmode{
    color : var(--appli-forecolor);
} */

.form-control-plaintext{
    color:inherit;
}

.small>.btn{
    font-size: .875em !important;
}
body{
    margin:0;
    font-family: Georgia, 'Times New Roman', Times, serif;
    /* background-color: #ecece2; */
    /* background-image: url("../images/fonds/papier_japonais_clair.png"); */

    opacity:1;
    transition-property: opacity;
    transition-duration: 1s;
    cursor:default;
}
body,dialog{
/* body{ */
    /* background-repeat: repeat; */
    /* background-color: #3a3c3a; */
}
header{
    display:flex;
    position: sticky;
    top: -2rem;
    width: 100%;
    backdrop-filter: saturate(110%) invert(98%);
    transition: saturate .15s linear;
   
}
@media (max-width: 576px) {
    header{
    position:unset;

    }
}
.hero::after, .hero::before {
    display: none;
}
.hero__section{
    /* background: #fff; */
  padding: 50px 0;
  position: relative;
  text-align: center;
}
.hero__section::after {
    clear: both;
  }
  .hero__section::after, .hero__section::before {
    content: " ";
    display: table;
  }
  @media (orientation: landscape) {
    .section--cover-viewport {
      min-height: calc(100vh - 50px);
    }
  }
.hero__image {
    background: #000;
    box-sizing: border-box;
    display: flex;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    /* content : url("../images/hero_cloud.png"); */
}
.hero__img{
    height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;

  text-align: center;
  padding: auto;
  object-fit: cover;
}
.hero__image picture {
    height: 100%;
    object-fit: cover;
    object-position: center center;
    width: 100%;
}
.section--rounded-top::before {
    /* background-color: #f5f5f7; */
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' preserveAspectRatio='none' viewBox='0 0 3801 144'%3E%3Cpath fill='%23fff' d='M1915 0C897.8 0 214.833 95.667.5 143.5h3800C3595.83 95.667 2932.2 0 1915 0Z'/%3E%3C/svg%3E");
    background-position: 50%;
    /* background-size: 100% 100%; */
    content: "";
    height: 2em;
    /* margin-bottom: 4em; */
    width: 100%;
}
@media (min-width: 768px) {
    .hero.section--cover-viewport + .section--rounded-top::before{
      background-color: transparent;
      display: block;
      margin-top: calc(-2em + 1px);
    }
}
@media (width >= 768px) {
    .brand__header + .hero__section {
      padding-top: 103px;
    }
  }
  
dialog{
    /* padding: 10px; */
    /* padding:1rem; */
    min-width:33%;
    border: 1px solid var(--appli-black);
    border-radius: 5px;
}
.fakeDialog{
    color:#212529 !important;
}
.fakeDialog.darkmode{
    color:var(--appli-forecolor) !important;
}
@media (max-width: 576px) {
    .fakeDialog{
        background-image: url("../images/fonds/papier_japonais_clair.png");
        border: 1px solid white;
        border-radius: 5px;
        margin: 1rem;
        /* margin:1px; */
        /* background: #3a3c3a; */
    }
    .fakeDialog.darkmode{
        /* background: var(--appli-forecolor); */
        background-image: url("../images/fonds/papier_japonais_sombrefx.png");

    }
    dialog::backdrop {
        background: #3a3c3a;
    }
    dialog.darkmode::backdrop {
        background: var(--appli-forecolor);
    }
}
body,dialog,.nav-link{
    /* color:#212529 !important; */
}
body.darkmode,dialog.darkmode,.nav-link.darkmode{
    color:var(--appli-forecolor) !important;
}
menu{
    padding-left : 0px;
}
.navbar-nav{
    margin-top:auto;
    margin-bottom: auto;
}

.navbar-toggler-icon {
    background-image: var(--bs-navbar-toggler-icon-bg);
}
.navbar-toggler-icon.darkmode {
    background-color:var(--appli-forecolor);
    border-radius: 3px;
}
.navbar-toggler:focus {
    box-shadow: 0 0 0 .15rem;
    color :var(--appli-color);
}
.navbar-toggler:focus.darkmode {
    background-color:var(--appli-forecolor);
}

/*menu*/
.dropdown-menu {
    min-width: 5rem;
}

/*drag and drop*/
.show_drag_zones *.dragzone{
    border:1px dashed;
}
.dragging {
    background-color: rgba(192, 235, 255,.2);
  }

.mw-100{
    min-width: 100px;
}
.mw-120{
    min-width: 120px;
}

/* input:disabled:readonly{
    background-color: transparent !important;
} */
input[type="number"]{
    border: 0;
    border-radius: 3px;
}
img.imgFullscreen{
    content: url("../icones/fullScreen.png");
    cursor: pointer;
    
}
img.imgFullscreen.darkmode{
    content: url("../icones/fullScreenDarkmode.png");
}
img.imgDarkmode{
    content: url("../icones/darkmode.png");
    cursor: pointer;
}
img.imgDarkmode.darkmode{
    content: url("../icones/darkmode_off.png");
}
.bt-logout{
    content:url("../icones/btDeconnexion.png")
}
.bt-login{
    content:url("../icones/btConnexionDarkmode.png")
}
.bt-login:not(.darkmode){
    content:url("../icones/btConnexion.png")
}
.bt-nav{
    width: 42px;
    height: 42px;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}
.btconnexion{
    background-image: url("../icones/btConnexion.png");
}
.btconnexion.darkmode{
    background-image: url("../icones/btConnexionDarkmode.png");
}
.btdeconnexion{
    background-image: url("../icones/btDeconnexion.png");
}

.numberFont{
    font-family: 'Times New Roman', Times, serif;
}
.bold{
    font-weight: bold;
}
.smaller{
    font-size: smaller;
}
.smallFont{
    font-size: small;
}
.mediumFont{
    font-size: medium;
}
.italic{
    font-style: italic;
}

.border5px{
    border-radius:5px;
}

#dicoListeSources{
    margin-left: 2px;
    list-style-type: "📓";
    max-height: 250px;
    overflow: auto;
    font-size: small;
}
.vertical-middle {
vertical-align: middle;
}
/*.vertical-center {
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }*/

/*ELEMENTS*/

.txtList{
    font-weight: bold;
    width: max-content;
    border-radius: 8px;
    margin-left: 3px; margin-right: 3px;
    text-align:center;
}
.imgLogo{
    position:absolute;
    width: 64px;
    margin: 7px;
}
.brandLogoMotCroise{
    content: url("../images/LogoMotsCroises_F_64.png");
}
.brandLogoParent{
    content: url("../../favicon64.ico");
}
 /*FLASH*/
 .flash,.flash-validation{
    display: flex;
    justify-content: center;
 }
 .flashAlert{
     background-color: #f00c;
 }
 .flashOk{
    background-color: rgba(0, 128, 28, 0.63);
}



.header{
    /* height:auto!important; */
    display: flex;
    /* --border-header: var(--border); */
    /* line-height: 1; */
    align-items: flex-start !important;
}
.collapse.show{
    z-index: 5;
    align-items: center;
    justify-content: space-between;

}
.collapse.show>*{
    .nav-link.my-auto{
        margin-top:0.25em !important;
    }
}

/* .navbar.navbar-expand-sm{
    padding-top: 0;
    padding-bottom: 0;
    margin:1em 1em 1em 1em !important;

} */
body.darkmode>header{
    background-image: none;
    
}

h1 {
    /*font-size: calc(1.375rem + 1.5vw);
    margin-bottom: 1px;
     font-size: medium; */
    /* volub style : 
    color: #0000000f;
    text-decoration: none;
    letter-spacing: 2px;
    /* text-transform: uppercase; */
    -webkit-text-stroke: 1px rgb(241, 241, 241);
}

h1.darkmode{
    -webkit-text-stroke: 1px rgba(0, 0, 0, 0.5);

}

h2{
    text-align: center;
    margin: 2rem 0 1rem 0;

}
h3{
    text-indent: .5rem;
}
h4{
    color: var(--appli-color);
    margin: .25rem .25rem .25rem .06rem;
    border-radius: 2px;
    font-size: large;
    -webkit-text-stroke: 1px rgba(0, 0, 0, 0.5);
    text-align: justify;
    backdrop-filter: contrast(1.3);
}
h4.darkmode{
    -webkit-text-stroke: 1px #fffaf091;
}
h4:empty{
    padding: 0px;
}
h5{
    margin: .75rem 0 0 0;

}
p{
    margin-top: unset;
}
/* h2:hover,h3:hover,h4:hover{
    cursor: default;
} */

main{
    /*border:1px solid floralwhite;*/
    /* margin:2px; */
    /* overflow-y: auto; */
/*height: 100%;*/
    margin-bottom:17px;
}
footer{
    margin-top: 5rem;
    backdrop-filter: saturate(110%) invert(98%);
  transition: saturate .15s linear;
  background-color: black;
  width: auto;
}

/* BODY FX */
.grayed{
    opacity: 0.5;
}
.wait{
    cursor:wait;
}
.wait > * {
    pointer-events:none;
    opacity: 0.8;

}
/*LOG*/
#logSources{
    max-height: 50px;
    display: grid;
}
.log{
    overflow-y: auto;
    font-size: small;
    background-color: darkolivegreen;
    color:floralwhite;
}

.hoverzoom:not(a,.nav-link-icone,table){
    transition: ease .4s;
    width: fit-content;
}
div.hoverzoom:hover{

    transform: scale3d(1.06, 1.06, 1);
    /* border-color: var(--bs-card-bg); */
    box-shadow: 1px 2px 5px #b0b0b0;
}
table>tbody.border-0>tr{
    border-bottom: hidden;
}
table.hoverzoom>tbody>tr:hover>td{
    transform: scale3d(1.06, 1.06, 1);
    transition: ease .4s;
    font-size:large;
    filter:drop-shadow(1px 2px 5px #b0b0b0);

    cursor: pointer;
}
table.hoverzoom>tbody>tr>td,
a.hoverzoom{
    transition: ease .4s;
}
a.hoverzoom:hover{
/* span.hoverzoom:hover{ */
    /* text-transform:scale3d(1.06, 1.06, 1);
    font-size:large; */
}
span.hoverzoom:hover{
    transform: scale3d(1.06, 1.06, 1);
    font-size:large;
    border-color: var(--bs-card-bg);
}


img.hoverzoom:hover,
a.hoverzoom:hover,
section.hoverzoom:hover{
    transform: scale3d(1.06, 1.06, 1);
    /* border-color: var(--bs-card-bg); */
    filter:drop-shadow(1px 2px 5px #b0b0b0);
}

/*DICTIONNAIRE*/
.sourceTextArea{
    width: 96%;
    height: 620px;
    resize: none;
    line-height: normal;
}

table{
    text-align: center;
}

/* NAV */
nav{
    display: flex;
    justify-content: center;
    margin-bottom: 6px;margin-top: 6px;
}

.navMenu{
    margin:5px auto 5px auto;
    display:flex;
    
}
/* .collapsing {
    height: 10px;
    overflow: hidden;
    transition: height 0.35s ease;
    color:red !important;
} */
/* .collapsing {
    height: 10em;
    overflow: hidden;
    transition: height 0.35s ease;
}
@media (prefers-reduced-motion: reduce) {
    .collapsing {
        transition: none;
    }
}
.collapsing.collapse-horizontal {
    width: 0;
    height: auto;
    transition: width 0.35s ease;
}
@media (prefers-reduced-motion: reduce) {
    .collapsing.collapse-horizontal {
        transition: none;
    }
} */

a{
    text-decoration: none;
    cursor:pointer;
    font-weight: bold;
    color: var(--appli-color-dark);
}
a:hover{
  color: var(--appli-color);
}
.navMenu a{
    height: 25px;
}
.switchDiv{
    background-color: rgba(40, 40, 40, 0.8);
    margin: 0px 10px;
    /* display: inline-flex; 
    text-align: center; */
}
.switchLabel,.switchLabelOnOff{
    padding:3px;
    border: medium none;
    cursor: pointer;
    font-size: 1.2em;
    min-width: 28px; 
    width: auto;
    border: 1px solid black;
    -webkit-transition: background-color 300ms linear;
    -ms-transition: background-color 300ms linear;
    transition: background-color 300ms linear;
}
.switchLabel.selected,.switchLabelOnOff.selected{
    background-color: green;
    /*border: medium 1px transparent;*/
    border: 1px solid #7fff0075;
    -webkit-transition: background-color 60ms ease;
    -ms-transition: background-color 60ms ease;
    transition: background-color 60ms ease;
}
.switchLabel.disabled{
    color: gray; pointer-events: none;
}
.switchLabel.pointable{
    color:floralwhite;
}
.switchLabel.pointable:hover{
    border: 1px solid #7fff0075;
}

.centerContainer{
    margin-top: 5px;
    margin-bottom : 2px;
    display: flex;
    /* padding-bottom: 10px; */
    /* overflow:auto; */
    align-items: center;
}
.column{
    flex-direction: column;
}
.entoure{
    border:1px solid floralwhite;
}

/*TABLEAU*/

.tableau{
    display: flex;
    flex-flow: column nowrap;
    max-height: 400px;/*100%;*/
    width: 100%;
    border-collapse: collapse;
}
.tableau>thead{
    text-align: center;
    flex: 0 0 auto;
    width: calc(100% - 1.2em);
    display: table;
    table-layout: fixed;
    font-size: small;
}
.tableau>tbody{
    flex: 1 1 auto;
    display: block;
    overflow-y: scroll;
    overflow-x: hidden;
    height: auto;
    max-height: 100%;
    text-align: center;
    background-color: var(--appli-black);
    border: 1px solid beige;
    /*
    border: 1px solid #b0b0b0;
    background-color:transparent;
    */
}
.tableau>tbody>tr{
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 100%;
    display: table;
    table-layout: fixed;
}
.tableau>tbody>tr.selected{
    background-color:var(--appli-color-darker);
}

.led{
    margin: 1px;
    width: 12px;
    height: 12px;
    display: inline-flex;
    background-size: contain;
}
.ledVerte{
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5QUZECoJZT1gCAAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAoUlEQVQY04WPKw7CQAAFpz+xSanHtCuwBIdG4WrYU/QEYDgJGrmqt0DhmmDY1uBIAyWbkA1BUAiuk4x5o57HB9n7jwFM0IeFVGI52yYbqcTKg6itXAS0ISClEvPpelTEaQhAMgkLAKOt8QEyJfJvBIjTkEyJHMBnAB+g1rbsGvcbu8ZRa1sCBABt5aLn9XUJhDe+n93ttHvsjbYH4OgN3XwDH+kwuI3yMsAAAAAASUVORK5CYII');
}
.ledBlanche{
    background-image: url('data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABmJLR0QAyQDPAMeCtbe7AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5QUZFBEXpIkajwAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAnElEQVQY04WPQQqCQABFn5rkFZxNdonWrZxhwE2XEDFo24UKXAuiV2jVXgUhGbdTJ2iRRTsf/M1/8OE7fIjm/DMAgzeLvdIyPp7ys9LyAPhd2/uAXQGR0nKX5mkmRAjAZhtlAHXVDC6A0jL5SgAhQpSWCYDLAu48VRoz/UpjJuqqKQE8gK7t/ae1UxCsw/Exvoprcamr5gbcnaWbb7efMXNf8mjMAAAAAElFTkSuQmCC');
}
.ledJaune{
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5QUZExAbsWtxYAAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAApUlEQVQY04WPKw7CQAAFp7+EFaCLaSo4AxrR4mrYIyBITwCGk6BxrKpsT4DC1ZWmCaGKAAlZsyEICsExyZg36lm8CTt/qYHa6cJERmK6XgxWMhYzwCsr4wFXFwhlJMbLeT8NfBeAUeCmAKrQtQ0gY5F8IkDgu8hYJAA2f7ABVK6zpjXfsWkNKtcZgANQVsa73J5n0bOGx5O5b3aPrSr0HjhY/26+AMGGMQK8IlCVAAAAAElFTkSuQmCC');
}
.ledRouge{
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5QUZExc6skP3+QAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAoUlEQVQY04WPrQ6CUABGD5cfd4MOmhRG8BnMJhvF+xQ8gRafxGy8ibcw2YgyisUJc3OXsTtnEJ2Ns53ynfQ5fEgH/6mAyh3CSoVyvY9nOxXJDeCXnfWB1gNSFcrldj7Nk8ADYDHxcgDdmkoAqEhm3wiQBB4qkhmAYAQBoBtT1L39jXVv0Y0pAFyAsrP+3b6uUjjxpbePw+151K05AWdn7OYb3Y8wmoktOM4AAAAASUVORK5CYII');
}



table.scroll {
    display: flex;
  flex-flow: column nowrap;
 
  /* width: 100%; */
  border-collapse: collapse;
}
.scroll thead
{
    text-align: center;
  flex: 0 0 auto;
  width: calc(100% - 1.1em);
  display: table;
  table-layout: fixed;
}
 
.scroll tbody
{
    flex: 1 1 auto;
  display: block;
  overflow: hidden scroll;
  height: auto;
  max-height: 100%;
}
 
.scroll tfoot
{
    display:block;
}
 
/* .scroll td, .scroll th
{
    width: 100px;
    text-align: center;
} */

.scroll tbody>tr{
    margin: 3px 0px;
  box-sizing: border-box;
  width: 100%;
  display: table;
  table-layout: fixed;
  border: 0px;
}

ul.admin.size-50{
    max-height: 50%;
    overflow: auto;
    border: 1px solid;
    margin: 1rem;
}

.ico_miniMC{
    background-image: url("../icones/miniMC2.png");
    background-size: contain;
    display: inline-flex;
    border: 0;
    vertical-align: middle;
    width:18px;
    height:18px;
    margin:0.25rem;
}
