@media print {
    
    * {
        font-family: arial !important;
        color: black !important;
        font-size: 95%;
    }

    .prealables .title {
        font-size: 12px !important;
    }

    .page {
        margin-top: 0 !important;
    }

    .print-header {
        font-weight: bold;
        display: flex !important;
        justify-content: space-between;
        padding-top: 32px;
        margin-bottom: -8px;
    }

    a {
        color: black;
        text-decoration: none;
    }

}

#page-header {
    display: none;
}

#sidebar {
  --pico-primary: var(--pico-contrast);
}

p {
    text-align: justify;
}

.anchor {
  scroll-margin-top: 116px;
}

#presentation {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.box {
    border: 1px solid var(--pico-color);
    display: flex;
    padding: 4px 8px;
    gap: 8px;
}

.box label {
    font-weight: bold;     
    margin: 0;
}

.box p {
    flex-grow: 1; 
    text-align: center;
    margin: 0;
}

.box.br {
    flex-wrap: wrap;
    align-content: flex-start;
}

.box.br label {
    width: 100%;
}

.box.br p {
    text-align: justify;
    vertical-align: top;
}

.prealables {
    display: flex; flex-direction: column; gap: 4px;
}

.prealables .title {
    font-size: 90%;
    font-weight: bold; 
    text-align: center; 
    margin: 0;
}

.table {
    border: 1px solid var(--pico-contrast-background);
    font-size: 90%;
}

.table .header {
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    background-color: var(--pico-muted-color);
    color: var(--pico-background-color);
    padding: 8px;
    /* force header background in print */
    -webkit-print-color-adjust: exact !important;   /* Chrome, Safari 6 – 15.3, Edge */
    color-adjust: exact !important;                 /* Firefox 48 – 96 */
    print-color-adjust: exact !important;
}


.table table {
    margin: 0;
    display: block;
    overflow-x: auto;
}

.table tbody {
    display: inline-table;
}

.table th {
    font-weight: bold;
}

.table tbody {
    width: 100%;
}

.table th, td {
    border: 1px solid;
    border-collapse: collapse;
}

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

@media (max-width: 555px) {
    
    #cegep-plan-de-cours {
       flex-wrap: wrap; 
       justify-content: center !important;
       column-gap: 32px;
    }

    #numero_ponderation_unitees {
        grid-template-columns: 100% !important;
    }

    #numero_ponderation_unitees label {
        width: 108px;
    }

    #composantes_departement {
        grid-template-columns: 100% !important;
    }

}