body {
    margin: 0;
    /* font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', */
    /* 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', */
    /* sans-serif; */
    font-family: RoundedElegance, Roboto, Arial;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.toolbar-button,
.input-text {
    border-radius: 5px;
    background-color: var(--bleu_clair);
    border-color: rgba(170, 170, 170, 0.404);
    /* width: 34px;  */
    color: white;
    height: 34px;
    margin-left: 6px;
    margin-right: 6px;
    margin-top: 5px;
}

.input-text::placeholder {
    font-style: italic;
}

.toolbar-button:hover {
    background-color: var(--bleu);
}

.toolbar-button:disabled {
    background-color: var(--disabled);
}

.divider {
    margin: 0;
    border-width: 0;
    border-style: solid;
    border-color: rgba(170, 170, 170, 0.404);
    border-bottom-width: 0;
    border-right-width: thin;
    background-color: #fff;
}

:root {
    --blanc: #FFFFFF;
    --valide_input: #83f1ad56;
    --invalide_input: #e0747456;
    --vert: #28ad1d;
    --vert_clair: #1bc45350;
    --orange: #E9B05E;
    --bleu: #3D6FC8;
    --disabled: #ccc;
    --bleu_clair: #95b0e0;
    --rouge: #E71919;
    --gris_clair: #f2f2f2;
    --tr1: rgb(240, 240, 240);
    --gris: rgb(216, 222, 226);
    --selected: #28ad1d;
    --TILESET: rgb(125, 165, 192);
    --OBJET_3D: rgb(78, 201, 142);
    --CLOUD: rgb(213, 211, 236);
    --POV: rgb(179, 78, 160);
    --GLB: rgb(54, 44, 130);
    --GEOJSON: rgb(153, 186, 63);
    --FILES: rgb(214, 156, 89);
    --PARAMETRE: rgb(74, 202, 176);
    --TITLE: rgb(192, 195, 190);
    --CAM: rgb(193, 33, 140);
    --IMG: rgb(241, 122, 53);
    --GROUP: rgb(51, 53, 37);
}

button {
    border: 10px solidrgb(255, 255, 255);
    border-radius: 2px;
}

td,
th {
    height: 30px;
    font-size: 100%;
    border-bottom: none;
    border-top: none;
    /* border-left-style: none;
    border-right-style: none; */
    padding-left: 2px;
    padding-right: 2px;
    border: 2px solidrgb(255, 255, 255);
    border-radius: 4px;
    /* box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); */
    /* Ombre légère */
}

th {
    background-color: rgb(201, 201, 201);
}

td {
    background-color: rgb(236, 236, 236);
}

td.add-licence {
    height: 20px;
    font-size: 100%;
    background-color: var(--vert);
    border-bottom: none;
    border-top: none;
    border-left-style: none;
    border-right-style: none;
    padding: 5px;
}

td.info {
    background-color: var(--gris_clair);
    color: black;
    cursor: pointer;
    border-radius: 2px;
}

td.btntd {
    background-color: var(--vert);
    color: white;
    cursor: pointer;
    border: 10px solidrgb(255, 255, 255);
    border-radius: 2px;
}

td.btntd:hover {
    background-color: var(--bleu);
    color: white;
    cursor: pointer;
}

td.btn_menu:hover {
    background-color: var(--bleu);
    color: white;
    cursor: pointer;
}

td.btntd-var {
    background-color: var(--gris_clair);
    color: black;
    cursor: pointer;
    border: 10px solidrgb(255, 255, 255);
    border-radius: 2px;
}

td.btntd-var:hover {
    background-color: var(--bleu);
    color: white;
    cursor: pointer;
}

td.btntdet {
    background-color: var(--bleu);
    color: white;
    cursor: pointer;
    border: 2px solidrgb(255, 255, 255);
    border-radius: 20px 0 0 20px;
}

td.btntdet:hover {
    cursor: inherit;
}

td.select {}

td.select-flex {}

td.mail-input {}

td.select:hover {
    background-color: rgb(103, 127, 171);
    cursor: pointer;
}

td.select-flex:hover {
    background-color: rgb(103, 127, 171);
    cursor: pointer;
}

td.btn-type-etendu {
    background-color: var(--bleu);
    color: white;
    border: 2px solidrgb(255, 255, 255);
    border-radius: 20px 0 0 20px;
}

td.btn-type-etendu:hover {
    cursor: pointer;
    background-color: rgb(103, 127, 171);
    color: white;
}

td.btn-front {
    background-color: var(--bleu);
    color: white;
    border: 2px solidrgb(255, 255, 255);
    border-radius: 20px 0 0 20px;
}

td.btn-type {}

td.btn-type:hover {
    cursor: pointer;
    background-color: rgb(103, 127, 171);
    color: white;
}

td.cadre {
    background-color: rgb(248, 248, 248);
    color: black;
    border: 2px solid black;
    /* Cadre de 2px d'épaisseur */
    border-color: black;
}

td.bouton-ajouter {
    color: white;
    background-color: var(--bleu_clair);
    text-align: center;
    font-size: 14px;
}

td.bouton-retirer {
    color: white;
    background-color: var(--orange);
    text-align: center;
    font-size: 14px;
}

td.bouton-invalide {
    color: white;
    background-color: var(--vert);
    text-align: center;
    font-size: 14px;
}

select {
    text-rendering: auto;
    color: fieldtext;
    letter-spacing: normal;
    word-spacing: normal;
    line-height: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    appearance: auto;
    box-sizing: border-box;
    align-items: center;
    -webkit-rtl-ordering: logical;
    background-color: field;
    cursor: default;
    margin: 0em;
    white-space: pre;
    border-width: 1px;
    border-style: solid;
    border-color: light-dark(rgb(118, 118, 118), rgb(133, 133, 133));
    border-image: initial;
    border-radius: 2px;
    width: 100%;
    /* Prend toute la largeur du td */
    box-sizing: border-box;
    /* Inclut padding et bordures dans la largeur */
    height: 100%;
    /* Ajuste la hauteur au td */
    margin: 0;
    /* Supprime les marges */
    border: none;
    /* Supprime la bordure par défaut */
    font-size: inherit;
    /* Hérite de la taille de police du td */
}

input {
    width: 100%;
    /* Prend toute la largeur du td */
    box-sizing: border-box;
    /* Inclut padding et bordures dans la largeur */
    height: 100%;
    /* Ajuste la hauteur au td */
    margin: 0;
    /* Supprime les marges */
    border: none;
    /* Supprime la bordure par défaut */
    font-size: inherit;
    /* Hérite de la taille de police du td */
    background-color: white;
    color: inherit;
}

input::placeholder {
    color: var(--gris);
}

.inputwrong {
    border: 2px solid red;
    border-radius: 4px;
    border-color: red;
}

button {
    width: auto;
    height: 30px;
    font-size: 100%;
    padding-left: 6px;
    padding-right: 6px;
    border: 2px solidrgb(255, 255, 255);
    border-radius: 4px;
    background-color: var(--vert);
    color: white;
}

button:hover {
    background-color: var(--bleu);
}

.petit-bouton {
    width: auto;
    height: auto;
    font-size: 100%;
    padding-left: 6px;
    padding-right: 6px;
    padding-top: 6px;
    padding-bottom: 6px;
    border: none;
    border-radius: 0px;
    background-color: var(--gris);
    color: black;
}

.petit-bouton:hover {
    background-color: var(--bleu);
    color: white;
}

.secondaire {
    width: 400px;
    height: 20px;
    font-size: 14px;
    padding-left: 6px;
    padding-right: 6px;
    border: none;
    border-radius: 4px;
    background-color: white;
    color: black;
}

.scrollable-div {
    height: 400px;
    /* Hauteur fixe */
    /*width: 95%;*/
    /* Largeur fixe (facultative) */
    overflow-y: auto;
    /* Active la barre de défilement verticale */
    overflow-x: hidden;
    /* Empêche le défilement horizontal */
    border: 1px solid #ccc;
    /* Bordure pour visualiser le conteneur */
    /*padding: 10px;*/
    /* Espacement interne */
    background-color: var(--gris_clair);
    /* Couleur d'arrière-plan */
}

.vignette {
    float: left;
    margin-left: 10px;
    margin-top: 10px;
    width: 200px;
    height: 50px;
    background-color: var(--gris_clair);
    display: flex;
    justify-content: center;
    /* Centre le texte horizontalement */
    align-items: center;
    /* Centre le texte verticalement */
    border-radius: 5px;
    /* Coins arrondis */
    font-family: Arial, sans-serif;
    font-weight: bold;
}

.vignette:hover {
    cursor: pointer;
    background-color: var(--bleu);
    color: white;
}

.fake_btn {
    background-color: var(--bleu_clair);
    padding: 6px;
    margin-left: 10px;
}

.fake_btn:hover {
    background-color: var(--orange);
    cursor: pointer;
}

.img_thumb {
    margin-left: 10px;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    cursor: pointer;
}

.img_thumb:hover {
    cursor: pointer;

}