/* Base styles for the local webexercises checker. */
:root {
    /* egenn webex */
    --incorrect: #E44C9A;
    --incorrect_alpha: #E9ABCB;
    --correct: #00A3AD;
    --correct_alpha: #A4D0D5;
    --highlight: #F08904; /* rtemis palette: orange */
}

/* .webex-check {} */

.webex-box {
    border: 1px solid var(--highlight);
    padding: 0.5em 0.25em;
    margin: 1em 0;
    /* border-radius: .25em; */
    background-color: rgba(127, 127, 127, 0.05);
}

.webex-total_correct {
    margin-left: 1em;
}

.unchecked .webex-total_correct {
    display: none;
}

.unchecked .webex-incorrect:not(label),
.unchecked .webex-correct:not(label) {
    border: 2px dotted grey !important;
    background-color: white !important;
}

/* styles for webex-solveme */
/* .webex-select,
input.webex-solveme,
.unchecked .webex-radiogroup label.webex-incorrect,
.unchecked .webex-radiogroup label.webex-correct {
    border: 2px dotted grey;
    background-color: white;
    border-radius: 0.25em;
} */

.webex-incorrect:not(label),
input.webex-solveme.webex-incorrect {
    /* border: 2px dotted var(--incorrect); */
    background-color: var(--incorrect_alpha);
    color: black;
    border-radius: 0.25em;
}

.webex-correct:not(label),
input.webex-solveme.webex-correct {
    /* border: 2px solid var(--correct); */
    background-color: var(--correct_alpha);
    color: black;
    border-radius: 0.25em;
}

/* styles for hidden solutions */
.webex-solution {
    height: 2.5em;
    overflow-y: hidden;
    padding: 0.5em;
    margin-bottom: 10px;
}

.webex-solution.open {
    height: auto;
    border: 2px solid var(--highlight);
    border-radius: 5px;
}

.webex-solution button,
.webex-check-button {
    height: 2em;
    margin-top: 1em;
    margin-bottom: 0.5em;
    border-radius: 0.5em;
    background-color: var(--highlight);
    color: white;
    padding: 0 0.5em;
    border: none;
}

.webex-solution pre.sourceCode {
    border-color: var(--correct);
}

/* webexercises in dark mode */
.quarto-dark .webex-solveme {
    background-color: #222222 !important;
    color: #e7e7e7 !important;
}
