.logo {
    /*border: 2px solid rgb(255, 0, 0);*/
    position: absolute;
    top: 0px;
    left: 0px;
    
}

.vider {
    /*border: 2px solid rgb(255, 0, 0);*/
    position: absolute;
    top: 120px;
    right: 50px;
}

.wait {
    position: absolute;
    top: 20px;
    left: 20px;
    background-color: rgb(223, 240, 234);
    border: 1px solid rgb(47, 60, 55);
    padding: 5px;

}



.titre_tab {
    background-color: rgb(223, 240, 234);
    vertical-align: top;
}

.table_groupes {
    display: block;
	/*overflow-y:scroll;*/
    height: auto; /*500px*/
    vertical-align: top;
    border-collapse: collapse; 
    overflow-x: auto; 
    -webkit-overflow-scrolling: touch;
}

.table_sequences {
    display: block;
	/*overflow-y:scroll;*/
    height: auto; /*60px*/
    vertical-align: top;
    vertical-align: top;
    overflow-x: auto; 
    -webkit-overflow-scrolling: touch;
}

.titre_sequences {
    background-color: rgb(223, 240, 234);
}

input[type="text"],
input[type="email"],
input[type="number"],
textarea,
fieldset {
  width: 100%;
  border: 1px solid #333;
  box-sizing: border-box;
}

input:invalid {
    box-shadow: 0 0 5px 1px red;
}

select:invalid {
    box-shadow: 0 0 5px 1px red;
}
  
  input:focus:invalid {
    box-shadow: none;
  }


 /*LANGUES*/
  .language-selector {
    position: relative;
    float: right;
    align-items: end;
    align-content: end;
    text-align: right;
    width: 60px;
    }
    
    .selected img {
      width: 60px;
      border-radius: 5px;
      cursor: pointer;
    }
    
    .dropdown {
      position: absolute;
      /*top: 70px; /* Distance sous l'image sélectionnée */
      padding: 5px;
      display: flex;
      flex-direction: column;
      /*gap: 10px;*/
      width: 100px;
      font-size: 8px;
    }
    .selected_lang {
        font-size: 8px;
        display: flex;
        justify-content: center;
        align-items: center;
      }
    
    .dropdown button {
      display: flex;
      border: none;
      background: none;
      cursor: pointer;
      font-size: 8px;
      justify-content: center;
      align-items: center;
    }
    
    .dropdown img {
      width: 50px;
      border-radius: 5px;
      transition: transform 0.2s ease;
    }
    
    .dropdown img:hover {
      transform: scale(1.1); /* Effet d'agrandissement au survol */
    }

/* LANGUES */
.language-selector {
position: relative;
width: 60px;
}
  
.selected img {
width: 60px;
border-radius: 5px;
cursor: pointer;
}

.dropdown {
position: absolute;
top: 20px; /* Distance sous l'image sélectionnée */
display: flex;
flex-direction: column;
gap: 10px;
border: solid 1px rgb(23, 134, 104);
background-color: whitesmoke;
}

.dropdown button {
border: none;
background: none;
cursor: pointer;
}

.dropdown img {
width: 50px;
border-radius: 5px;
transition: transform 0.2s ease;
}

.dropdown img:hover {
transform: scale(1.1); /* Effet d'agrandissement au survol */
}

.body {
    background-color: rgb(196, 253, 253);
}

.toggleHelp {
    width: 40px;
    padding: 5px 5px;
    background-color: #066363;
    color: white;
    border: none;
    cursor: pointer;
    top: 80px;
    right: 125px;
    position: absolute;
}

.toggleHelp a {
    color: #FFFFFF;
    text-decoration: none;
}

/* AIDE */
.container {
    /*max-width: 99%;*/
    margin: auto;
    background: #fff;
    padding: 5px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.container_ml {
    background: #fff;
    padding: 5px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.container_ml.h1 {
    text-align: center;
    color: #333;
}

.pave_aide {
    background: #82dab0;
    margin: 5px;
    padding: 10px;
    border-radius: 5px;
}


.login {
    display: block;
    width:200px;
    font-size: 8px;
}

.auth_action {
    position: absolute;
    top: 10px;
    right: 15px;
    padding: 10px;
    border: 1px solid rgb(70, 97, 94);
    background-color: rgb(171, 238, 232);
    overflow: auto;
    width: 100px;
    height: 100px;

}

.divlogin {
    position: absolute;
    top: 10px;
    right: 15px;
}

.div_form_login {
    position: absolute;
    top: 10px;
    left: 15px;
    padding: 5px;
    border: 1px solid rgb(70, 97, 94);
    background-color: rgb(171, 238, 232);
    overflow: auto;
    width: 600px;
    height: 300px;

}

.accueil {
    position: absolute;
    top: 10px;
    left: 15px;
    width: 400px;
    /*margin-right: -50%;*/
    /*transform: translate(-50%, -50%);*/
    text-align: center;
    min-height: 100vh;
    padding: 10px;
    border: 1px solid rgb(70, 97, 94);
    background-color: rgb(207, 239, 236);
    

}

.div_form_profil {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 10px;
    border: 1px solid rgb(70, 97, 94);
    background-color: rgb(171, 238, 232);
    overflow: auto;
    width: 600px;
    height: 300px;
}


.box_msg_alerte {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 10px;
    border: 2px solid rgb(255, 0, 0);
    background-color: rgb(205, 141, 130);
    overflow: auto;
    width: 400px;
    height: 100px;
}

.box_msg_ok {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 10px;
    border: 2px solid rgb(0, 103, 19);
    background-color: rgb(170, 221, 220);
    overflow: auto;
    width: 400px;
    height: 100px;
}


/* MENU HAMBURGER */
.menu-container {
position: relative;
font-size: 10px;
}

#hamburger-btn {
cursor: pointer;
width: 25px;
height: 25px;
}

#menu {
    display: none;
    position: absolute;
    top: 32px;
    padding-left: 10px;
    padding-top: 5px;
    left: 0;
    background-color: #f8f9fa;
    width: fit-content;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    font-size: 12px;
}

#menu ul {
list-style: none;
margin: 0;
padding: 10px;
}

#menu li {
margin: 10px 0;
}

#menu a {
text-decoration: none;
color: #333;
}

@media (max-width: 768px) {
#menu {
    width: 100%;
}
}

.achats {
    width : 100%;
    overflow-y: scroll;
    height:600px;
    justify-content: center; 
    align-items: center;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;         /* NEW, Spec - Firefox, Chrome, Opera */
    
}

.box_achats{
    float: left;
    width: 300px;
    margin: 10px 10px;
    padding : 10px;
    border-radius: 8px;
    background-color: #ccddef;
    text-align: center; 
}

.box_achats h1,h2,h3 {
    text-align: center; 
}

.trace_admin {
    background-color: rgb(234, 196, 196);
    width: 100%;
    height: 300px;
    overflow-y:scroll;
    resize: both;
}

hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}

.cookie-banner {
    border: 1px solid rgb(0, 0, 0);
    background-color: rgb(130, 220, 181);
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    text-align: center;
    vertical-align: center;
    width : 600px;
    height: 600px;
}

.warning {
    border: 1px solid rgb(0, 0, 0);
    background-color: rgb(220, 130, 130);
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    text-align: center;
    width : 400px;
    height: 200px;
}

.footer {
    background-color: rgb(223, 240, 234);
}

.td_actions {
    font-size: 10px;
    align-items: center;
    align-content: center;
    text-align: center;
    
}