.divSection {
    display: grid;
    overflow: auto;
    width: 100%;
}
.divSection.section1Colonnes {
    grid-template-columns: [column1] 1fr;
}
.divSection.section2Colonnes {
    grid-template-columns: [column1] 1fr [column2] 1fr;
}
.divSection.section3Colonnes {
    grid-template-columns: [column1] 1fr [column2] 1fr [column3] 1fr;
}
.divSection.section4Colonnes {
    grid-template-columns: [column1] 1fr [column2] 1fr [column3] 1fr [column4] 1fr;
}

.divZone {
    display: inline-flex;
    overflow: hidden;
    flex-direction: row;
    align-items: center;
}

.divLibelle {
    padding: 0 0 0 0.25em;
}

.divSection.section1Colonnes .divLibelle {
    flex-basis: 20%;
    flex-basis: calc(20% / var(--size-x));
}
.divSection.section2Colonnes .divLibelle {
    flex-basis: 30%;
    flex-basis: calc(30% / var(--size-x));
}
.divSection.section3Colonnes .divLibelle {
    flex-basis: 35%;
    flex-basis: calc(35% / var(--size-x));
}
.divSection.section4Colonnes .divLibelle {
    flex-basis: 35%;
    flex-basis: calc(35% / var(--size-x));
}

.fieldsetSection .divChamp,
.fieldsetSection .divLibelle {
    font-size: 0.9em;
}

.divChamp {
    overflow: hidden;
    margin-left: 4px;
    flex-grow: 1;
}
.divSection.section1Colonnes .divChamp {
    flex-basis: 80%;
}
.divSection.section2Colonnes .divChamp {
    flex-basis: 70%;
}
.divSection.section3Colonnes .divChamp {
    flex-basis: 65%;
}
.divSection.section4Colonnes .divChamp {
    flex-basis: 65%;
}

.inputElements {
    flex-grow: 1;
}
.divSection.section1Colonnes .divChamp .inputElements,
.hybridInput .inputElements {
    flex-basis: 94%;
    /* 4rem vient de la taille de .inpuAction */
    max-width: calc(100% - 4rem);
}
.divSection.section2Colonnes .divChamp .inputElements {
    flex-basis: 86%;
    /* 4rem vient de la taille de .inpuAction */
    max-width: calc(100% - 4rem);
}
.divSection.section3Colonnes .divChamp .inputElements {
    flex-basis: 79%;
    /* 4rem vient de la taille de .inpuAction */
    max-width: calc(100% - 4rem);
}
.divSection.section4Colonnes .divChamp .inputElements {
    flex-basis: 72%;
    /* 2rem vient de la taille de .inpuAction */
    max-width: calc(100% - 2rem);
}

.divSection.section1Colonnes .divChamp .inputActions,
.divSection.section2Colonnes .divChamp .inputActions,
.divSection.section3Colonnes .divChamp .inputActions,
.hybridInput .inputActions {
    flex-basis: 4rem;
    min-width: 4rem;
    max-width: 4rem;
}
.divSection.section4Colonnes .divChamp .inputActions {
    flex-basis: 2rem;
    min-width: 2rem;
    max-width: 2rem;
}

/********************/

.divZone:hover {
    background-color: var(--personal-hover-color);
}

.divZone.hasTabDet .divLibelle {
    align-self: flex-start;
    padding-top: 0.4em;
}
.divChamp .divTabDet {
    max-width: 99%;
}

input.checkbox.totalCheckbox {
    margin-right: 5px;
}

.hybridSelect {
    max-width: 40%;
}
.hybridSelect .select2.select2-container {
    max-width: 100%;
}

.divChamp .hybridButton,
.hybridInput .hybridButton {
    min-height: 30px;
    min-width: 30px;
}
.divChamp .hybridButton a i,
.hybridInput .hybridButton a i {
    font-size: 0.9em;
}

form .divZone .hybridInput .inputElements.inputElementVide {
    outline: none;
}
form .divZone:hover .hybridInput .inputElements {
    background-color: transparent;
}

html.dark-theme {
    --unity-text-color: #b9b9b9;
}
html.light-theme {
    --unity-text-color: #4a4a4a;
}
.divChamp .unity {
    margin-left: 2px;
    flex-grow: 1;
    color: var(--unity-text-color);
}