MonScoDocEssai/app/static/css/refcomp_parcours_niveaux.css

:root {
    --col-c1-1: rgb(224, 201, 201);
    --col-c1-2: rgb(231, 127, 130);
    --col-c1-3: rgb(167, 0, 9);
    --col-c2-1: rgb(240, 218, 198);
    --col-c2-2: rgb(231, 142, 95);
    --col-c2-3: rgb(231, 119, 64);
    --col-c3-1: rgb(241, 227, 167);
    --col-c3-2: rgb(238, 208, 86);
    --col-c3-3: rgb(233, 174, 17);
    --col-c4-1: rgb(218, 225, 205);
    --col-c4-2: rgb(159, 207, 111);
    --col-c4-3: rgb(124, 192, 64);
    --col-c5-1: rgb(191, 206, 230);
    --col-c5-2: rgb(119, 156, 208);
    --col-c5-3: rgb(10, 22, 75);
    --col-c6-1: rgb(203, 199, 176);
    --col-c6-2: rgb(152, 143, 97);
    --col-c6-3: rgb(13, 13, 13);
}

div.refcomp_show {
    width: fit-content;
}

div.refcomp_show>div {
    background: rgb(210, 210, 210);
    border-radius: 8px;
    margin-left: 12px;
}

div.table_niveaux_parcours {
    margin-top: 12px;
    color: #111;
    border-radius: 8px;
    padding: 8px;
}


div.liens {
    margin-top: 3ex;
    padding: 8px;
}

div.table_niveaux_parcours .titre {
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 12px;
}


table.table_niveaux_parcours tr th:first-child {
    opacity: 0;
}

table.table_niveaux_parcours th {
    text-align: center;
    color: white;
    padding-left: 4px;
    padding-right: 4px;
}

table.table_niveaux_parcours tr.parcours_but {
    color: #111;
}

table.table_niveaux_parcours tr.parcours_but td {
    padding-top: 8px;
}

table.table_niveaux_parcours tr.parcours_but td b {
    margin-right: 12px;
}

table.table_niveaux_parcours tr.annee_but {
    text-align: center;
}

table.table_niveaux_parcours tr td:not(:first-child) {
    width: 120px;
    border: 1px solid #999;
}

table.table_niveaux_parcours tr.annee_but td:first-child {
    width: 92px;
    font-weight: bold;
    color: #111;
}

table.table_niveaux_parcours tr.annee_but td.empty {
    opacity: 0;
}

/* Les couleurs des niveaux de compétences du BO */
.comp-c1-1 {
    background: var(--col-c1-1);
    color: black;
}

.comp-c1-2 {
    background: var(--col-c1-2);
    color: black;
}

.comp-c1-3,
.comp-c1 {
    background: var(--col-c1-3);
    color: #eee;
}

.comp-c2-1 {
    background: var(--col-c2-1);
}

.comp-c2-2 {
    background: var(--col-c2-2);
}

.comp-c2-3,
.comp-c2 {
    background: var(--col-c2-3);
}

.comp-c3-1 {
    background: var(--col-c3-1);
}

.comp-c3-2 {
    background: var(--col-c3-2);
}

.comp-c3-3,
.comp-c3 {
    background: var(--col-c3-3);
}

.comp-c4-1 {
    background: var(--col-c4-1);
}

.comp-c4-2 {
    background: var(--col-c4-2);
}

.comp-c4-3,
.comp-c4 {
    background: var(--col-c4-3);
}

.comp-c5-1 {
    background: var(--col-c5-1);
    color: black;
}

.comp-c5-2 {
    background: var(--col-c5-2);
    color: black;
}

.comp-c5-3,
.comp-c5 {
    background: var(--col-c5-3);
    color: #eee;
}

.comp-c6-1 {
    background: var(--col-c6-1);
    color: black;
}

.comp-c6-2 {
    background: var(--col-c6-2);
    color: black;
}

.comp-c6-3,
.comp-c6 {
    background: var(--col-c6-3);
    color: #eee;
}