.question--drawer .question--info {
    /*width: 300px;
    */background-color: var(--background-color-custom-2);
    display: grid;
    /* grid-template-rows: 80px 80px; */
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: row;
    place-items: center;
    margin-bottom: 18px;
    padding: 8px 10px;
    box-shadow: 0 0 8px -2px #00000027;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    gap: 8px;
}

.question--drawer .question--info div {
    display: flex;
    flex-wrap: wrap;
    place-items: center;
    padding: 8px;
    margin-inline: 5px;
    background-color: var(--background-color-custom-1);
    width: 100%;
    height: 100%;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}

.question--drawer .question--info div:first-child {
    margin-left: 0;
}

.question--drawer .question--info div:last-child {
    margin-right: 0;
}

.question--drawer .question--info div[data-complexity="1"] {
    background-color: #55B2FF;
}

.question--drawer .question--info div[data-complexity="2"] {
    background-color: #52C41A;
}

.question--drawer .question--info div[data-complexity="3"] {
    background-color: #F8515B;
}

.question--drawer .question--body > div {
    margin: 20px 0;
}

.question--drawer .question--body div[class$="-body"] {
    position: relative;
    background-color: var(--background-color-custom-2);
    border-radius: 8px;
    padding: 16px 15px 0 15px;
    box-shadow: 0 0 8px -2px #00000027;
    border: 1px solid rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}

.question--drawer .question--body div[class$="-body"]:first-child,
.question--drawer .question--body div[class$="-body"]:last-child {
    padding-bottom: 16px;
}

.question--drawer .question--body div[class$="-body"] div[class$="-label"] {
    position: absolute;
    top: -12px;
    left: 5px;
    padding-inline: 10px;
    font-size: 95%;
    background-color: var(--background-color-custom-1);
}

.question--drawer .question--body .question--title-body span * {
    margin-bottom: 0;
}

/* .question--drawer .question--body .question--title-body span {
    margin-bottom: 16px;
} */

.question--drawer .question--body .question--options-body .option {
    display: flex;
    place-items: center;
    min-height: 40px;
    padding-inline: 12px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}

.question--drawer .question--body .question--options-body .option:not(:first-child):not(:last-child):not(:nth-child(2)):not(:nth-last-child(2)) {
    margin-block: 8px;
}

.question--drawer .question--body .question--options-body .option:nth-last-child(2) {
    margin-top: 8px;
    margin-bottom: 5px;
}

.question--drawer .question--body .question--options-body .option:last-child {
    margin-bottom: 8px;
}

.question--drawer .question--body .question--options-body .option:last-child[data-correct-true="1"] {
    margin-bottom: 16px;
}

.question--drawer .question--body .question--options-body .option p{
    margin: 0;
}

.question--drawer .question--body div[data-correct-true="1"] {
    /* background-color: rgb(16, 46, 169); */
    border: 1px solid rgb(16, 46, 169, 0.8);
}

.question--drawer footer .lang--tag {
    margin-top: 10px;
    margin-right: 6px;
    border: 2px solid rgb(16, 46, 169);
    display: inline-block;
    padding-block: 2px;
    padding-inline: 12px;
    box-shadow: 0 0 6px -2px #00000035;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}

