@import 'variables.css';


table tbody:not(#tableVehicule tbody) {
    display: flex;
    flex-direction: column;
}
#tableVehicule tbody {
    display: contents;
}

table tbody tr th:not(:first-child) {
    padding-left: 30px;
}

table tbody tr:not(#tableVehicule tbody tr) {
    display: flex;
    justify-content: space-between;
}
#tableVehicule  tbody tr {
    display: table-row;
}

tbody tr td input {
    border: none;
    background: inherit;
    font-family: inherit;
    color: inherit;
    text-align: end;
}
tbody tr td input:not(#tableVehicule tbody tr td input) {
    width: 100%;
}

tbody tr td select {
    border: none;
    background: inherit;
    font-family: inherit;
    color: inherit;
    width: 200px;
    text-align-last: right;
}
tbody tr td select:not(#tableVehicule tbody tr td select) {
    width: 100%;
}

tbody tr td {
    text-align: end;
}
tbody tr td:not(#tableVehicule tbody tr td) {
    width: 100%;
}

#CGV-grid{
    display: grid;
    grid-template-columns:1fr 1.5fr;
    gap: 5px;
    margin:0 0 50px 0;
}
#CGV-grid .titre{
    color: var(--rose-color);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    margin: 0 0 10px 0;
    font-weight: bold;
    text-transform: uppercase;
}

#CGV-grid .titre:nth-child(even){
    text-align: center;
}
#CGV-grid .data:nth-child(odd){
    text-align: left;
}
#CGV-grid .data:nth-child(even){
    text-align: center;
}

.titre-tableau h4 {
    color: var(--rose-color);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    margin: 0;
    font-weight: bold;
    text-transform: uppercase;
}

.tableau {
    background-color: white;
    border-radius: 7px;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    padding: 20px;
    gap: 20px;
}

.titre-tableau {
    display: flex;
    align-items: center;
    gap: 10px;
}

.svg-tableau {
    display: flex;
    gap: 5px;
}

.svg-tableau svg{
    cursor: pointer;
}

.texteManquant, .couleurLignePaye{ 
    color: var(--rose-color);
}

@media screen and (max-width: 550px) {

    table tbody tr th:not(:first-child) {
        padding-left: 0px;
    }

    table tbody tr {
        display: flex;
        align-items: center;
        flex-direction: column;
        padding: 10px 0px 10px 0px;
    }

    #tableVehicule tbody tr {
        display: flex;
    }

    table tbody tr th {
        padding: 0px;
    }

    tbody tr td input {
        text-align: center;
    }

    tbody tr td select {
        text-align-last: center;
        padding-left: 13px;
    }

    tbody tr td {
        text-align: center;
    }

    .titre-tableau {
        display: flex;
        justify-content: space-between;
    }
} 

.isOk{
    color: red!important;
}

#repriseANTS{
    background-color: var(--rose-color); 
    border: none;
    color: white;
    padding: 3px 12px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 13px;
}