
/* ------------------------------------------
Choices-JS
/* ------------------------------------------ */

.choices__list{
    min-width: 20rem;
}
#teachers .choices__input{
    min-width: unset !important;
}
.choices__input{
    min-width: 10rem !important;
}

[role="listbox"] > .choices__item,
.choices__item.choices__item--selectable.is-selected{
    height: 1.75rem;
    line-height: 1.4rem;
}
.choices__list--multiple .choices__item{
    background-color:  #efefef;
    border: 2px solid #ccc;
    color: #333;
    padding: .1rem .75rem;
}
.choices[data-type*=select-multiple] .choices__item .choices__button,
.choices[data-type*=text] .choices__item .choices__button{
    border-left: '0';
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMzMzIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==) !important;
}
.choices__list--multiple .choices__item.is-highlighted,
.choices__list--multiple .choices__item:focus,
.choices__list--multiple .choices__item:active{
    background-color: #ccc;
}

.choices .choices__item.choices__item--choice,
.choices .choices__item.choices__item--choice.choices__item--selectable{
    padding: .75rem;
    min-height: 2.75rem;
    height: auto;
    display: flex;
    flex-direction: column;
}
.choices__list--dropdown .choices__item.choices__item--choice .description,
.choices__list--dropdown .choices__item.choices__item--choice.choices__item--selectable .description{
    color: #888;
    font-size: .7rem;
    font-style: italic;
    max-width: 90%;
}

.choices__list--dropdown .choices__list, .choices__list[aria-expanded] .choices__list{
    max-height: 270px;
}

/* ------------------------------------ */
/* Levels
/* ------------------------------------ */

.choices__inner:has(#cefr_level) [role="listbox"] > .choices__item{
    height: 2.75rem;
    line-height: 2.75rem;
    padding: 0 1rem;
    border-radius: 3rem;
}
.choices__inner:has(#cefr_level){
    border: 0 !important;
}
.choices__inner:has(#cefr_level) .choices__list.choices__list--single{
    min-width: 10rem;
    padding: 0 !important;
}
.choices[data-type*=select-one]:has(#cefr_level)::after{
    right: 1.5rem;
}
.choices:has(#cefr_level) .choices__list.choices__list--dropdown .choices__item.choices__item--choice,
.choices:has(#cefr_level) .choices__list.choices__list--dropdown .choices__item.choices__item--choice.choices__item--selectable{
    margin: .25rem;
    border-radius: 3rem;
    padding-left: 2rem;
}


/* ------------------------------------ */
/* Teachers
/* ------------------------------------ */

.choices:has(#teachers) .choices__list{
    min-width: 25rem;
}
.choices:has(#teachers) .choices__list .choices__list{
    display: flex;
    flex-wrap: wrap;
}
.choices:has(#teachers) .choices__list.choices__list--dropdown .choices__item.choices__item--choice.choices__item--selectable{
    margin: .2rem;
    color: #eee;
    font-size:.75rem;
    border-radius: 3rem;
    max-width: max-content;
    padding-right: 3rem;
}
.choices:has(#teachers) .choices__list.choices__list--dropdown .choices__item.choices__item--choice.choices__item--selectable:hover{
    opacity: 0.9;
}

/* ------------------------------------ */
/* JS Readonly
/* ------------------------------------ */

.choices[data-type*=select-multiple] .choices__inner, .choices[data-type*=text] .choices__inner{
    min-height: 3.1rem; /* So that padlock at the botton does not change position on click */
}

.choices__inner:has(.is-readonly) { /* Style for the Choices container when it is readonly */
  background-color: #e9ecef !important; /* A light grey color, similar to disabled inputs */
  /* cursor: default !important; */
}
.choices__inner:has(.is-readonly)::after { /* Hide the dropdown arrow for read-only fields */
    content: none !important;
}
.choices:has(.is-readonly.is-open) .choices__list--dropdown { /* Make sure the dropdown menu itself is not shown */
    display: none !important;
}
.choices:has(.is-readonly.is-open) .choices__item{
    padding-right: 0.75rem !important;
    cursor: default !important;
}
.choices:has(.is-readonly) input[type="search"]{
    display: none !important;
}
.choices:has(.is-readonly) .choices__item button{
    display: none !important;
}
.te-choices-container{ /* Only added to the HTML when needing to select a parentElement of .choices */
    width: 100%;
}

/* ------------------------------------ */
/* Students
/* ------------------------------------ */

.choices #students ~ .choices__list .choices__item[data-custom-properties]::before{
    height: 1rem;
    width: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    margin-right: .2rem;
}
.choices #students ~ .choices__list .choices__item[data-custom-properties*="absent"]::before{
    content: '\2716'; /* Bigger than × */
    background: lightpink;
    color: tomato !important;
}
.choices #students ~ .choices__list .choices__item[data-custom-properties*="present"]::before{
    content: '\2714';
    background: lightgreen;
    color: darkgreen     !important;
}
.choices #students ~ .choices__list .choices__item[data-custom-properties*="added"]::before{
    content: '\2731'; /* ✱ */
    background: lightblue;
    color: #06c !important;
}

