/* Stylesheet for everything related to workshops */
/* */


/* New Workshop */
#selectedTeacher {
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    padding: 0px;
}

#selectedTeacher li {    
    border-radius: 10px;
    background-color: #72A2F9;
    color: black;
    padding: 5px;
    margin-left: 5px;
    margin-top: 5px;
}

input[name=lehrer2] {
    width: 100%;
}


/* -----------------------------------------------
*   Single workshop view
*   
*/

.single-workshop {
    margin: 3px; 
    padding: 10px; 
    border: 1px; 
    border-style: solid;
    border-color: #85ABE7;
    overflow-wrap: break-word;
    gap: 15px;
}

.single-workshop p {
    margin: 0;
}

.single-workshop h3 {
    color: #85ABE7;
    margin: 0;
    width: 100%;
}

.single-workshop .buttonContainer {
    margin-top: auto;
}

.registered {
    order: 1;
    color: green;
    font-weight: bold;
    align-self: flex-end;
    padding-bottom: 12px;
}

.registered-workshop {
    border-width: 4px;
}

.single-workshop form {
    order: 3;
    text-align: end;
    align-self: flex-end;
}

.btn-details, .btn-participants {
    order: 2;
    background-color: #72A2F9;
    color: black;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 10px;
}


.btn-details:hover, .btn-participants:hover {
    background-color: #4383F8;
}


.single-workshop input[type=submit] {
    width: fit-content;
    margin: 0;
}

.workshop-info {
    gap: 10px;
    justify-content: space-between;
}

.notBookableReason {
    order: 3;
    text-align: end;
    align-self: center;
    color: #EC5B57;
}

/* -----------------------------------------------
*   Simple workshop item
*   Used for rendering as dropdown item
*/

.workshop-item {
    margin: 0;
    padding: 5px;
    border-color: #85ABE7;
    border-width: 1px;
    border-style: ridge;
    border-radius: 2px;
    flex-grow: 1;   
}

.dropdown-content .workshop-item:hover {
    background-color: #85ABE7;
    cursor: pointer;
}


.dropdown-content .workshop-item:hover .workshop-item-title {
    font-weight: bold;
    color: white;
}

.workshop-item-title {
    text-align: left;
    /* font-weight: bold; */
    color: #85ABE7;
}


.workshop-item-participants {
    text-align: left;
    flex: 1 1 auto;
}

.workshop-item-subjects {
    text-align: center;
    flex: 1 1 auto;
}

.workshop-item-grades {
    text-align: right;
    flex: 1 1 auto;
}

.workshop-item input[type=submit] {
    width: max-content;
}

.workshop-item .unregisterbutton {
    align-self: flex-end;
}

/*
.workshop-item-container {
    min-width: 300px;
    transform: translateY(40px);
}*/

.dropdown-content .not-clickable:hover {
    cursor: not-allowed;
}

/* -----------------------------------------------
*   set color in items and single workshops for sportworkshops and uue
*   
*/
.sportworkshop, .sportworkshops {
    border-color: #EC5B57;
}

.sportworkshop h3, .sportworkshops h3 {
    color: #EC5B57;
}

.sportworkshop .workshop-item-title, .sportworkshops .workshop-item-title {
    color: #EC5B57;
}

.dropdown-content .sportworkshop:hover, .dropdown-content .sportworkshops:hover  {
    background-color: #EC5B57;
}

.uue {
    border-color: #3D8C4B;
}

.uue h3, .uue .workshop-item-title {
    color: #3D8C4B;
}

.dropdown-content .uue:hover {
    background-color: #3D8C4B;
}



/* -----------------------------------------------
*   'kursanmeldung' view
*   
*/
.semester-title {
    margin-top: 30px;
    margin-bottom: 0px;
}

.day-container {
    gap: 10px;
    text-align: center;
    margin-bottom: 60px;
}
.day-container h4 {
    text-align: center;
}

/* -----------------------------------------------
*   'Meine Workshops' view
*   
*/
.myworkshops .flexbox-normal {
    gap: 10px;
}
.myworkshops input[type=submit] {
    margin-top: 0;
    white-space: normal;
}

.item-container {
    gap: 2px;
    flex-wrap: wrap;
}

@media screen and (max-width: 1350px) {
    .workshop-item .col-125 {
        width: calc(12.5% - 14px);
        margin-top: 6px;
    }
    .workshop-item .col-25 {
        width: calc(25% - 14px);
        margin-top: 6px;
    }
}

@media screen and (max-width: 700px){
    .single-workshop{
        hyphens: auto;
    }

    .sportworkshop h3 {
        hyphens: auto;
    }
}