#fakeend:invalid { border-bottom: coral 1px solid; }
#fakestart:invalid { border-bottom: coral 1px solid; }

.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] { grid-area: sections; }
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] { grid-area: target; }
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-l'] { grid-area: location; }
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] { grid-area: type; }
.block.block-views.views-exposed-form form div.form-item-tt {
    grid-area: search;
    margin-left: 3px;
}
.block.block-views.views-exposed-form form div.form-item-h { grid-area: hosted; }
.block.block-views.views-exposed-form form div[data-drupal-selector='edit-actions'] {
    grid-area: buttons;
    display: flex;
    flex-direction: row-reverse;
}

/* hide home checkbox */
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item:first-child { display: none; }

/* hide scientific activity filter (automatically added with button) */
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-60 { display: none; }

/* hide grouped buttons */
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-51,
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-53,
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-58 { display: none; }

.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.form-item-tg-9,
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.form-item-tg-14 { display: none; }

.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.form-item-tg-11,
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.form-item-tg-12,
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.form-item-tg-13 { display: none; }

.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-l'] .form-item.form-item-l-16 { display: none; }


/* ------------------------------ COMMON FORM ACTION - BUTTONS ------------------------------ */
.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] { margin: 1rem 0 0 0; }
.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] > * {
    font-size: 12px;
    border-radius: 3rem;
    padding: .75rem 2rem;
    margin: auto 0 auto 1rem;
    transition: all 300ms ease;
}

.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] .button[value="Search"],
.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] .button#edit-submit-events {
    color: #FFF;
    background-color: var(--main_blue);
    border: 1px solid var(--main_blue);
    font-weight: 700;
    text-transform: uppercase;
}
.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] .button[value="Search"]:hover,
.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] .button#edit-submit-events {
    /* background-color: transparent; */
    /* color: var(--main_blue); */
    background-color: var(--main_blue_hover);
    border: 1px solid var(--main_blue_hover);
    transition: all 300ms ease;
}


.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] .cancel-action,
.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] .button[value="Reset all"] {
    color: var(--text_color);
    text-decoration: underline;
    border: none;
    background-color: transparent;
    font-weight: 400;
}
.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] .button[value="Reset all"] {
    border: 1px solid var(--border_gray);
    padding: .75rem 1.5rem .75rem 2.5rem;
    background-repeat: no-repeat;
    text-decoration: none;
    background-size: 1rem 1rem;
    background-position: 1rem center;
    background-image: url(../../assets/icons/icon-refresh.png);
}

.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] .cancel-action:hover,
.block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] .button[value="Reset all"]:hover {
    background-color: var(--border_gray);
    transition: all 300ms ease;
}


/* SEARCH INPUT STYLE */
.block.block-views.views-exposed-form .form-item-tt input {
    width: 100%;
    height: 3rem;
    font-size: 16px;
    padding: .5rem 3.5rem .5rem 1rem;
    background-color: #FFF;
    border: none;
}
.block.block-views.views-exposed-form .form-item-tt input:focus {
    outline: 1px solid var(--main_blue);
}
.block.block-views.views-exposed-form .form-item-tt { position: relative; }
.block.block-views.views-exposed-form .form-item-tt .search-submit {
    content: '';
    width: 3rem;
    height: 3rem;
    border: none;
    font-size: 0;
    position: absolute;
    right: 0;
    bottom: 0;
    cursor: pointer;
    background-color: var(--main_blue);
    background-image: url(../../assets/icons/icon-search-w.svg);
    background-size: 40%;
    background-repeat: no-repeat;
    background-position: center center;
}
.block.block-views.views-exposed-form .form-item-tt .search-submit:hover {
    background-color: var(--main_blue_hover);
    /* background-image: url(../../assets/icons/icon-search-blue.svg); */
    /* border: 1px solid var(--main_blue); */
}


.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-54 label,
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-55 label,
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-56 label {
    font-size: 0;
}
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-54 label::after,
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-55 label::after,
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-56 label::after {
    position: relative;
    font-size: 14px;
    top: .25rem;
    font-weight: 500;
}
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-55 label::after { content: 'Workshops'; }
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-54 label::after { content: 'Schools';}
.block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-56 label::after { content: 'Conferences'; }


@media (max-width: 1023px) {
    /* filters grid template */
    .block.block-views.views-exposed-form form > div:not(.num-total-active) {
        /* display: grid;
        grid-template-areas:
            'search'
            'sections'
            'type'
            'target'
            'location'
            'hosted'
            'empty'
            'buttons';
        grid-template-rows: 1fr 1fr 1fr 1fr 2fr .5fr 1fr 1fr; */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .block.block-views.views-exposed-form form div.form-item-tt { order: 1; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] { order: 2; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] { order: 3; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] { order: 4; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-l'] { order: 5; }
    .block.block-views.views-exposed-form form div.form-item-h { order: 6; }
    .block.block-views.views-exposed-form form div[data-drupal-selector='edit-actions'] {
        /* grid-area: buttons; */
        order: 7;
        display: flex;
        flex-direction: row-reverse;
    }

    /* to make expanded layout not scrollable horizontally */
    .block.block-views.views-exposed-form { overflow: hidden; }

    /* form layout divided between selectors and checkboxes */
    .block.block-views.views-exposed-form form {
        max-width: unset;
        width: calc(200% + 2rem);
        position: relative;
        transition: transform 500ms ease;
    }
    .block.block-views.views-exposed-form form::after { display: none; } /* hide horizontal line */
    .block.block-views.views-exposed-form.showfilters form { /* min height to expand accordion */
        /* min-height: 556px; */
        min-height: calc(100vh - 70px);
        max-height: unset;
        transition: transform 500ms ease;
    }
    .block.block-views.views-exposed-form form > div:not(.num-total-active) {  /* expand fieldsets to full height of form */
        /* height: calc(556px - 4rem);  */
        height: 100%;
    }

    /* translate to second section of form when click on filter  */
    .block.block-views.views-exposed-form.translated form {
        transform: translateX(-50%);
        overflow: visible;
    }
    .block.block-views.views-exposed-form.translated form .form-item-tt { pointer-events: none; }


    /* buttons and filters placed only on first section */
    .block.block-views.views-exposed-form form div[data-drupal-selector="edit-actions"] { width: calc(50% - 2rem); }
    /* .block.block-views.views-exposed-form form .form-item-h { right: calc(50% + 2rem); } */
    .block.block-views.views-exposed-form form .advanced-filters {
        width: calc(50% - 3rem);
        left: 1rem;
        color: var(--main_blue);
        font-size: 18px;
        font-weight: 500;
        text-align: left;
    }

    .block.block-views.views-exposed-form form .num-total-active {
        width: 20px;
        height: 20px;
        left: calc(50% - 7rem);
        top: 2rem;
        position: absolute;
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        background-color: var(--border_gray);
        color: var(--main_blue);
        font-size: 14px;
        font-weight: 500;
        border-radius: 50%;
        z-index: 100;
        transform: translateY(-50%);
        pointer-events: none;
    }


    /* clickable fieldset legend titles */
    .block.block-views.views-exposed-form fieldset legend {
        /* height: 4.5rem; */
        min-height: 4.5rem;
    }

    .block.block-views.views-exposed-form .form-item-tt label,
    .block.block-views.views-exposed-form fieldset legend {
        display: block;
        width: calc(50% - 2rem);
        margin: 0;
        padding: 1.5rem 3rem 1rem 0;
        font-size: 16px;
        font-weight: 400;
        cursor: pointer;
        position: relative;
        background-position: right 2rem;
        background-size: 1rem 1rem;
        background-repeat: no-repeat;
    }
    .block.block-views.views-exposed-form fieldset:not([data-drupal-selector='edit-l']) legend {
        background-image: url(../../assets/icons/icon_arrow_right.svg);
        border-bottom: 2px solid var(--border_gray);
    }
    .block.block-views.views-exposed-form .form-item-tt label::before,
    .block.block-views.views-exposed-form fieldset legend::before {
        font-weight: 400;
        font-size: 16px;
    }

    .block.block-views.views-exposed-form fieldset legend span {
        display: inline-block;
        line-height: 2em;
    }

    .block.block-views.views-exposed-form fieldset legend ul {
        list-style: none;
        margin-top: .5rem;
    }
    .block.block-views.views-exposed-form fieldset legend ul li {
        list-style: none;
        position: relative;
        color: var(--main_blue);
        font-size: 12px;
        padding: 0 0 0 1rem;
        margin: 0;
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-ty"] legend ul li { text-transform: capitalize; }

    .block.block-views.views-exposed-form fieldset legend ul li::before {
        content: '';
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background-color: var(--medium_gray);
        display: block;
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
    }

    .block.block-views.views-exposed-form fieldset legend .num-active {
        font-size: 14px;
        font-weight: 500;
        color: var(--main_blue);
        background-color: var(--border_gray);
        border-radius: 50%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: absolute;
        text-align: center;
        top: 2rem;
        left: 60%;
        transform: translateX(-50%);
        width: 20px;
        height: 20px;
        pointer-events: none;
    }


    /* initially hidden fieldsets */
    .block.block-views.views-exposed-form fieldset:not([data-drupal-selector="edit-l"]) .fieldset-wrapper {
        transform: translateX(calc(100% + 3rem));
        width: calc(50% - 2rem);
        position: absolute;
        top: 3.5rem;
        left: 0;
        max-height: 0;
        overflow: hidden;
    }
    /* opened fieldsets */
    .block.block-views.views-exposed-form fieldset .fieldset-wrapper.expanded {
        max-height: unset;
        overflow: visible;
    }


    /* generally place checkboxes in column */
    .block.block-views.views-exposed-form fieldset .fieldset-wrapper .form-checkboxes.form--inline {
        display: flex;
        flex-direction: column;
    }


    /* ------------------------------ GLOBAL CHECKBOX ITEM STYLE ------------------------------ */
    .block.block-views.views-exposed-form fieldset { margin: 0; }

    .block.block-views.views-exposed-form .form-item-h,
    .block.block-views.views-exposed-form .form-item-tt,
    .block.block-views.views-exposed-form fieldset .form-item {
        /* max-width: 400px; */
        margin: 0 1rem 0 0;
        position: relative;
        cursor: pointer;
    }

    .block.block-views.views-exposed-form .form-item-h input,
    .block.block-views.views-exposed-form fieldset .form-item input {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 10;
        opacity: 0;
        cursor: pointer;
    }

    /* SEARCH BUTTON MOBILE */
    .block.block-views.views-exposed-form .form-item-tt input {
        width: calc(50% - 2rem);
        font-size: 14px;
    }
    .block.block-views.views-exposed-form .form-item-tt { position: relative; }
    .block.block-views.views-exposed-form .form-item-tt .search-submit { right: calc(50% + 2rem); }


    /* --------------- MOBILE FILTERS STYLE --------------- */

    /* --------------- --------------- SECTIONS --------------- --------------- */
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item {
        background-repeat: no-repeat;
        background-size: 3rem 10px;
        background-position: left center;
        position: relative;
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked { background-size: 3rem 3rem; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item::before {
        content: '';
        display: block;
        position: absolute;
        background-color: var(--border_gray);
        width: 3rem;
        height: 3rem;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        z-index: -1;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item label {
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: relative;
        width: 100%;
        height: 4rem;
        padding: .5rem 0 .5rem 3.5rem;
        border-bottom: 1px solid var(--border_gray);
        color: var(--border_gray);
        font-size: 14px;
        font-weight: 500;
        line-height: 1.25em;
        background-repeat: no-repeat;
        background-size: 3rem 3rem;
        background-position: left center;
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item label::before {
        content: '';
        width: 3rem;
        height: 3rem;
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked label { color: var(--text_color); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.form-item-s-2 { background-image: url(../../assets/loghi/logo-hecap-dark-typo.svg); }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked.form-item-s-2 { background-image: url(../../assets/loghi/logo-hecap-col-typo.svg); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.form-item-s-3 { background-image: url(../../assets/loghi/logo-cmsp-dark-typo.svg); }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked.form-item-s-3 { background-image: url(../../assets/loghi/logo-cmsp-col-typo.svg); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.form-item-s-5 { background-image: url(../../assets/loghi/logo-math-dark-typo.svg); }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked.form-item-s-5 { background-image: url(../../assets/loghi/logo-math-col-typo.svg); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.form-item-s-7 { background-image: url(../../assets/loghi/logo-esp-dark-typo.svg); }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked.form-item-s-7 { background-image: url(../../assets/loghi/logo-esp-col-typo.svg); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.form-item-s-4 { background-image: url(../../assets/loghi/logo-sti-dark-typo.svg); }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked.form-item-s-4 { background-image: url(../../assets/loghi/logo-sti-col-typo.svg); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.form-item-s-6 { background-image: url(../../assets/loghi/logo-qls-dark-typo.svg); }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked.form-item-s-6 { background-image: url(../../assets/loghi/logo-qls-col-typo.svg); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.form-item-s-8 { background-image: url(../../assets/icons/icon_plus.svg); }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked.form-item-s-8::before { background-color: var(--medium_gray); }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item.checked.form-item-s-8 {
        background-image: url(../../assets/icons/icon_plus_w.svg);
        background-size: 3rem 10px;
    }


    /* --------------- --------------- EVENT TYPE --------------- --------------- */
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-checkboxes.form--inline {
        display: grid;
        gap: 0;
        grid-template-areas:
            'lecturescolloquia'
            'ceremoniesprizes'
            'allscientific'
            'schools'
            'workshops'
            'conferences'
            'seminars';
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.colloquia-lectures { grid-area: lecturescolloquia; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-59 { grid-area: ceremoniesprizes; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-52 { grid-area: seminars; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .all-scientific-select { grid-area: allscientific; }

    /* ------------ minor checkboxes all added on button click toghether ------------ */
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-54 { grid-area: schools; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-55 { grid-area: workshops; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-56 { grid-area: conferences; }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] button.form-item {
        border: none;
        ;
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item {
        padding: 1.25rem 0;
        margin: .5rem 1rem .5rem 0;
        background-color: var(--border_gray);
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.checked { background-color: var(--main_blue); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item label {
        font-size: 14px;
        font-weight: 700;
        width: 100%;
        line-height: 1em;
        display: block;
        text-align: center;
        text-transform: capitalize;
        color: var(--text_color);
        pointer-events: none;
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.checked label { color: #FFF; }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-54,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-55,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-56 {
        padding: .5rem 1rem;
        margin: .75rem 1rem .75rem .5rem;
        background-color: transparent;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-54 label,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-55 label,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-56 label {
        padding-left: 2.5rem;
        text-align: left;
        position: relative;
        color: var(--medium_gray);
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.checked.form-item-ty-54 label,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.checked.form-item-ty-55 label,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.checked.form-item-ty-56 label { color: var(--text_color); }


    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-54 label::before,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-55 label::before,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.form-item-ty-56 label::before {
        content: '';
        display: block;
        width: 2rem;
        height: 2rem;
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        transform-origin: center center;
        background-color: var(--border_gray);
        box-shadow: inset 0px 0px 0px 4px var(--border_gray);
        transition: all 300ms ease;
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.checked.form-item-ty-54 label::before,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.checked.form-item-ty-55 label::before,
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-ty'] .form-item.checked.form-item-ty-56 label::before {
        background-color: var(--main_blue);
    }


    /* --------------- --------------- TARGETS --------------- --------------- */
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-checkboxes.form--inline {
        display: grid;
        gap: 0;
        grid-template-areas:
            'graduate'
            'student'
            'researcher';
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.graduate { grid-area: graduate; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.researchers { grid-area: researcher; }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.form-item-tg-10 { grid-area: student; }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] button.form-item {
        border: none;
        ;
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item {
        margin: .5rem 1rem .5rem 0;
        background-color: var(--border_gray);
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.checked { background-color: var(--main_blue); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item label {
        font-size: 14px;
        width: fit-content;
        font-weight: 700;
        margin: 0 auto;
        padding: 1.25rem 0 1.25rem 3rem;
        line-height: 1em;
        display: block;
        text-align: center;
        text-transform: capitalize;
        color: var(--text_color);
        background-size: 2rem 2rem;
        background-position: left center;
        background-repeat: no-repeat;
        pointer-events: none;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.checked label { color: #FFF; }

    /* button icons */
    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.graduate label {
      background-image: url(../../assets/icons/icon_event_tg_graduate.svg);
      background-size: 36px 36px;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.checked.graduate label { background-image: url(../../assets/icons/icon_event_tg_graduate_w.svg); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.form-item-tg-10 label {
      background-image: url(../../assets/icons/icon_event_tg_student.svg);
      background-size: 36px 36px;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.checked.form-item-tg-10 label {
      background-image: url(../../assets/icons/icon_event_tg_student_w.svg);
      background-size: 36px 36px;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.researchers label {
      background-image: url(../../assets/icons/icon_event_tg_research.svg);
      background-size: 36px 36px;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-tg'] .form-item.checked.researchers label {
      background-size: 36px 36px;
      background-image: url(../../assets/icons/icon_event_tg_research_w.svg); }


    /* --------------- --------------- LOCATION --------------- --------------- */
    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] {
        padding-bottom: 1rem;
        margin-bottom: 1rem;
        border-bottom: 2px solid var(--border_gray);
        width: calc(50% - 2rem);
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] legend { width: 100%; }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] .fieldset-wrapper .form-checkboxes.form--inline {
        flex-direction: row;
        justify-content: space-between;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] .form-item {
        width: 48%;
        margin: 0;
        padding: 1.25rem 0 1.25rem 3.5rem;
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] .form-item::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        width: 3rem;
        height: 3rem;
        background-color: var(--border_gray);
        background-position: center center;
        background-size: 1rem 1rem;
        background-repeat: no-repeat;
    }
    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] .form-item.checked::before { background-color: var(--main_blue); }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] .form-item.form-item-l-15::before {
      background-image: url(../../assets/icons/icon_online.svg);
      background-size: 18px 22px;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] .form-item.checked.form-item-l-15::before {
      background-image: url(../../assets/icons/icon_online_w.svg);
      background-size: 18px 22px;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] .form-item.form-item-l-17::before {
      background-image: url(../../assets/icons/icon_pin.svg);
      background-size: 24px 24px;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector="edit-l"] .form-item.checked.form-item-l-17::before {
      background-image: url(../../assets/icons/icon_pin_w.svg);
      background-size: 24px 24px;
    }

    /* show only hosted */
    .block.block-views.views-exposed-form .form-item-h {
      width: calc(50% - 2rem);
      max-width: 300px;
      padding: 1.25rem 0.5rem 1.25rem 3rem;
      background-color: var(--border_gray);
      background-repeat: no-repeat;
      background-position: 1rem center;
      background-size: 1.35rem 1.35rem;
      background-image: url(../../assets/icons/icon_hide.svg);
      background-size: 20px 20px;
    }

    .block.block-views.views-exposed-form .form-item-h.checked {
      background-color: var(--main_blue);
      background-image: url(../../assets/icons/icon_show_w.svg);
      background-size: 20px 20px;
    }

    .block.block-views.views-exposed-form .form-item-h label {
        font-size: 14px;
        font-weight: 700;
        width: 100%;
        line-height: 1em;
        display: block;
        text-align: left;
        color: var(--text_color);
        pointer-events: none;
    }
    .block.block-views.views-exposed-form .form-item-h.checked label { color: #FFF; }


    /* ------------------------------ FORM ACTIONS ------------------------------ */
    .block.block-views.views-exposed-form div[data-drupal-selector='edit-actions'] > * { padding: .75rem 1.25rem; }

    .block.block-views.views-exposed-form .mobile-select {
        /* position: absolute;
        bottom: 1rem;
        right: calc(25% - 2rem);
        margin: auto 0 auto 1rem; */
        margin: .5rem auto;
        width: fit-content;
        padding: .75rem 1.25rem;
        color: #FFF;
        border: 1px solid var(--main_blue);
        border-radius: 3rem;
        background-color: var(--main_blue);
        ;
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        transition: all 300ms ease;
    }

    .block.block-views.views-exposed-form fieldset[data-drupal-selector='edit-s'] .form-item:nth-last-child(2) { margin-bottom: .5rem; }

    .block.block-views.views-exposed-form form .mobile-back {
        position: absolute;
        top: 1rem;
        left: calc(50% + 1rem);
        padding: .5rem .75rem;
        border-radius: 2rem;
        font-size: 0;
        width: 4rem;
        height: 2rem;
        background-position: center center;
        background-origin: content-box;
        background-size: contain;
        background-repeat: no-repeat;
        border: 2px solid var(--border_gray);
        background-image: url(../../assets/icons/icon_arrow_right.svg);
        background-color: transparent;
        transform: scaleX(-1);
        transform-origin: center center;
    }

}