
/* === ФИЛЬТР === */

/* Start:/MITEX/js/select2/select2.css*/
.select2-container {box-sizing:border-box; display:block; margin:0; position:relative; width:auto !important}
.select2-container .select2-selection--single {box-sizing:border-box; cursor:pointer; display:block; height:40px; user-select:none; -webkit-user-select:none}
.select2-container .select2-selection--single .select2-selection__rendered {display:block; padding-left:9px; padding-right:44px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.select2-container .select2-selection--single .select2-selection__clear {position:relative}

.select2-container .select2-selection--multiple {box-sizing:border-box; cursor:pointer; display:block; min-height:40px; user-select:none; -webkit-user-select:none}
.select2-container .select2-selection--multiple .select2-selection__rendered {display:inline-block; overflow:hidden; padding-left:9px}

.select2-container .select2-search--inline {display:inline-block; vertical-align:top; margin:0; padding:0; flex:1; min-width:50px}
.select2-container .select2-search--inline .select2-search__field {box-sizing:border-box; border:none; font-size:100%; margin-top:0; padding:0}
.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {-webkit-appearance:none}

.select2-dropdown {background-color:#F1F3F7; box-sizing:border-box; display:block; position:absolute; left:-100000px; width:100%; z-index:1051}

.select2-results {display:block}
.select2-results__options {list-style:none; margin:0; padding:0}
.select2-results__option {margin:0; padding:8px 44px 8px 10px; font-size:14px; line-height:20px; font-weight:normal; letter-spacing:-0.01em; color:#65646A; user-select:none; position:relative; -webkit-user-select:none}
.select2-results__option::after {content:""; display:block; width:24px; height:24px; background:url(/MITEX/js/select2/selected.svg) no-repeat; opacity:0; position:absolute; right:10px; top:6px}
.select2-results__option[aria-selected] {cursor:pointer}
.select2-results__option::before {display:none}

.select2-container--open .select2-dropdown {left:0}
.select2-container--open .select2-dropdown--above {margin-top:-10px}
.select2-container--open .select2-dropdown--below {margin-top:10px}

.select2-search--dropdown {display:block; padding:0}
.select2-search--dropdown .select2-search__field {padding:4px; width:100%; box-sizing:border-box}
.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {-webkit-appearance:none}
.select2-search--dropdown.select2-search--hide {display:none}

.select2-close-mask {border:0; margin:0; padding:0; display:block; position:fixed; left:0; top:0; min-height:100%; min-width:100%; height:auto; width:auto; opacity:0; z-index:99; background-color:#FFFFFF}
.select2-hidden-accessible {border:0 !important; clip:rect(0 0 0 0) !important; -webkit-clip-path:inset(50%) !important; clip-path:inset(50%) !important; height:1px !important; overflow:hidden !important; padding:0 !important; position:absolute !important; width:1px !important; white-space:nowrap !important}

.select2-container--default .select2-selection--single {background-color:#F1F3F7; display:block; border:1px solid #F1F3F7; line-height:20px; font-size:14px; font-weight:normal; letter-spacing:-0.01em; padding-top:10px; transition:border-color 0.2s}
.form-select select.error+label.error+.select2-container--default .select2-selection--single {border-color:#EF3E22}
.form-select select.error+label.error+.select2-container--default {padding-bottom:28px}

.select2-container--full .select2-selection--single {padding-top:16.5px}

.select2-container--full::after {content:attr(data-placeholder); font-weight:normal; position:absolute; left:10px; top:2.5px; color:#65646A; font-size:12px; line-height:17px; letter-spacing:-0.01em; pointer-events:none}
select[multiple]+.select2-container--full::after {display:none}
.select2-container--default .select2-selection--single .select2-selection__rendered {color:#1E1E22}
.select2-container--default .select2-selection--single .select2-selection__clear {cursor:pointer; float:right; font-weight:bold}
.select2-container--default .select2-selection--single .select2-selection__placeholder {font-weight:normal; color:#65646A}
.select2-container--default .select2-selection--single .select2-selection__arrow {position:absolute; top:0; right:0; height:40px; width:34px}
.select2-container--default .select2-selection--single .select2-selection__arrow b {display:block; width:24px; height:24px; position:absolute; left:0; top:50%; margin-top:-12px; background:url("/local/templates/tourismexpo_2024/js/select2/arrow.svg") no-repeat; background-size:100%}
.select2-container .select2-selection--multiple::after {content:""; display:block; width:34px; height:38px; position:absolute; right:0; top:0; background:url(/MITEX/js/select2/arrow.svg) no-repeat left center}

.select2-container--default.select2-container--disabled .select2-selection--single {background-color:#F8F8FC; border-color:#E6E6EF; cursor:default; border-radius: 0;}
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {display:none}

.select2-container--default:hover .select2-selection--single,
.select2-container--default:hover .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single {border-color:var(--second-light)}

.select2-container--default .select2-selection--multiple {background-color:#F1F3F7; border:1px solid #F1F3F7; cursor:text; transition:border-color 0.2s}
.select2-container--default .select2-selection--multiple .select2-selection__rendered {box-sizing:border-box; list-style:none; margin:0; padding:8px 44px 0 9px; width:100%; display:flex; align-items:flex-start; flex-wrap:wrap}
.select2-container--default .select2-selection--multiple .select2-selection__rendered::before {content:attr(data-placeholder); font-weight:normal; margin:0 4px 0 0; color:#65646A; font-size:14px; line-height:22px; white-space:nowrap; letter-spacing:-0.01em; pointer-events:none}

.select2-container--default .select2-selection--multiple .select2-selection__rendered li {text-indent:0; list-style:none}
.select2-container--default .select2-selection--multiple .select2-selection__rendered li::before {display:none}

.select2-container--default .select2-selection--multiple .select2-selection__clear {cursor:pointer; position:absolute; right:0; top:0; bottom:0; width:44px; background:#fff; background:url(/MITEX/js/select2/clear.svg) no-repeat center; z-index:1; color:rgba(0, 0, 0, 0)}
.select2-container--default .select2-selection--multiple .select2-selection__choice {background-color:var(--white); border:none; font-weight:normal; font-size:12px; line-height:17px; letter-spacing:normal; display:inline-block; vertical-align:top; text-indent:0; margin:0 4px 4px 0; padding:3px 28px 3px 8px; color:var(--second); position:relative}
.select2-container--default .select2-selection--multiple .select2-selection__choice::before {display:none}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {display:block; position:absolute; right:8px; top:4px; width:16px; border:none; height:16px; background:url(/MITEX/js/select2/remove.svg) no-repeat center; color:rgba(0, 0, 0, 0); cursor:pointer; font-size:0; border-radius:0; opacity:0.5; transition:opacity 0.2s}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {opacity:1}

.select2-container--default.select2-container--focus .select2-selection--multiple {border-color:var(--second-light); outline:0}

.select2-container--default.select2-container--disabled .select2-selection--multiple {background-color:#F8F8FC; border-color:#E6E6EF; cursor:default}
.select2-container--default.select2-container--disabled .select2-selection__choice__remove {display:none}

.select2-container--default .select2-search--dropdown {position:relative}
.select2-container--default .select2-search--dropdown::after {content:""; position:absolute; left:12px; top:12px; width:16px; height:16px; background:url(/MITEX/js/select2/search-input.svg) no-repeat; background-size:100%; pointer-events:none}
.select2-container--default .select2-search--dropdown .select2-search__field {position:relative; border:1px solid var(--second-light); font:14px/20px Inter, sans-serif; color:#1E1E22; vertical-align:top; margin:0; padding:9px 9px 9px 39px; width:100%; height:40px; box-sizing:border-box; outline:none; border-radius:0; background:#F9FBFD; -webkit-appearance:none}

.select2-container--default .select2-search--dropdown .select2-search__field::-webkit-input-placeholder {opacity:1; color:#65646A}
.select2-container--default .select2-search--dropdown .select2-search__field::-moz-placeholder {opacity:1; color:#65646A}
.select2-container--default .select2-search--dropdown .select2-search__field:-ms-input-placeholder {opacity:1; color:#65646A}

.select2-container--default .select2-search--inline .select2-search__field {display:block; background:transparent; border:none; outline:0; box-shadow:none;  height:20px; color:#1E1E22; width:100% !important; -webkit-appearance:textfield}


.select2-container .select2-search--inline .select2-search__field::placeholder {
    opacity: 1;
    color: var(--gray);
}
.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {-webkit-appearance:none}

.select2-container--default .select2-results > .select2-results__options {max-height:282px; padding:0; overflow-y:auto}
.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-thumb {background:#C6C7D3; }
.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar {width:4px; height:4px; background:transparent}

.select2-container--default .select2-results__option[role=group] {padding:0}
.select2-results__option[role="group"] .select2-results__option {padding-left:20px}

.select2-container--default .select2-results__option[aria-disabled=true] {color:#999999}

.select2-results__option[aria-selected="true"] {color:#1E1E22}
.select2-results__option[aria-selected="true"]::after {opacity:1}

.select2-container--default .select2-results__option--highlighted[aria-selected] {background:#F9FBFD}

.select2-container--default .select2-results__group {cursor:default; display:block; padding:10px; font-weight:600; color:#00AEEF}
/* End */

.program-filter {margin: 20px 0 0 0; background: var(--light-gray); padding: 20px 0;;
    & form { margin: 0; padding: 0; display: flex; align-items: flex-start; justify-content: center;}
}
.form-select {position:relative; margin:16px 0;  border:1px solid var(--second-light-opacity); }
.form-select select {position:relative; border:0;  color:var(--text); vertical-align:top; margin:0; padding:16.5px 9px 1.5px 9px; width:100%; height:40px; box-sizing:border-box; outline:none; background:var(--white); -webkit-appearance:none; transition:border-color 0.2s}
.form-select label.error {display:block; color:#EF3E22; font-size:14px; line-height:20px; letter-spacing:-0.01em; text-align:right; position:absolute; right:0; bottom:0; left:0}

/* Фильтр */
.program-filter-dates-select-current {display: none;}
.program-filter-dates-select-list {display: flex;}
.program-filter-date {margin: 0 0 0 12px; min-width: 66px; height: 42px; border: 1px solid var(--second-light-opacity); display: flex; align-items: center; justify-content: center; background: var(--white-opacity); font: 680 1.2rem/1.2 var(--font-oswald); letter-spacing: 0.02em; color: var(--second-light); cursor: pointer; transition: background 0.2s, color 0.2s, border-color 0.2s;
    &:first-child {margin: 0;}
    &:hover {background: var(--primary); border-color: var(--primary); color: var(--white);}
    &.active {background: var(--primary); border-color: var(--primary); color: var(--white);}
}
.program-filter-halls {display: none;}
.program-filter-formats {min-width: 311px; max-width: 607px; margin: 0 0 0 20px;
    & .form-select {margin: 0;}
}

/* Сетка */
.program {margin: 0px 0 -40px 0; position: relative; min-height: 200px; overflow: hidden;
    &::before {content: ""; position: absolute; left: -999px; top: 0; right: -999px; bottom: 0; background: var(--second) var(--bg-light) var(--bg-repeat) var(--bg-position);}
    &.loading::after {content: ""; position: absolute; left: -999px; top: 0; right: -999px; bottom: 0; background: rgba(255, 255, 255, 0.9) url(/MITEX/img/loading.svg) no-repeat center;}
}

.programm-list { background: var(--second) var(--bg-light) var(--bg-repeat) var(--bg-position);}
.program-container {position: relative; width: 100%;background: var(--white-opacity-strong);}

/* Часы */
.program-hours {padding: 100px 0 109px 35px;}
.program-hour {height: 1px; background: var(--second-light-opacity); position: relative; margin: 110px 0 0 0;
    &:first-child {margin: 0;}
    & span {position: absolute; left: -40px; top: -10px; font-size: 14px; line-height: 20px; color: var(--second-light); filter:opacity(.6)}
}

/* Залы */
.program-halls {position: absolute; left: 40px; top: 0px; right: 0px; display: flex; /*background: var(--second-light)*/}
.program-hall {flex: 1; margin: 30px 30px 15px 30px; position: relative;;
    & .title-small {display: flex; height: 63px; align-items: center; color: var(--primary); font-family: var(--font-oswald); font-size: 1.6rem; text-transform: uppercase;justify-content: center;}
}

/* Карточка */
.program-item {position: absolute; overflow: hidden; text-decoration: none; left: 0; right: 0; margin: 63px 0 0 0; display: flex; flex-direction: column; justify-content: space-between; padding: 12px; backdrop-filter: blur(0); background: var(--bg-card); box-shadow: var(--box-shadow); transition: transform 0.2s, max-height 0.2s;
    &.hidden {display: none;}
    &:hover {max-height: 500px !important; z-index: 2; transform: translateY(-5px);}
}
.program-item-header {display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-shrink: 0;border-bottom: 1px solid var(--primary); padding-bottom: 5px;}
.program-item-time {display: flex; align-items: center; font-size: 16px; line-height: 17px; color: var(--gray); white-space: nowrap; flex-shrink: 0;
    & svg {display: block; width: 18px; height: 18px; fill: none; stroke: var(--light-gray); margin: 0 7px 0 0;}
}
.program-item .title-medium {margin: 10px 0 0 0; color: var(--second-light); font-size: 1.3rem; font-weight: 580; line-height: 1.5; font-family: var(--font-arial-narrow);}
    .program-item:hover .title-medium {color: var(--primary);}
.program-item-format {font-size: .75rem; line-height: 16px; color: var(--second); background: var(--gray-opacity-banner); padding: 5px 10px; font-family: var(--font-arial-narrow); text-transform: uppercase; letter-spacing: 1px; white-space: nowrap; flex-shrink: 0;}

/* Адаптив */
@media (max-width: 1579px) {
    .program-halls {left: 108px; right: -10px;}
    .program-hall {margin: 0 10px;}
}

@media (max-width: 1219px) {
    .program-filter {margin: 32px 0 60px 0;
        & form {flex-wrap: wrap;}
    }
    .program-filter-dates {width: 100%;}
    .program-filter-dates-select-list {justify-content: center;}
    .program-filter-formats {min-width: 100%; max-width: 100%; margin: 20px 0 0 0;}
    .program {margin: 60px -20px -120px -20px;
        &::before {left: 0; right: 0; width: 100%;}
    }
    .program-halls {left: 78px;}
}

@media (max-width: 767px) {
    .program-filter {margin: 40px 0;
        & form {justify-content: flex-start;}
    }
    .program-filter-dates {width: auto; min-width: calc(50% - 7.5px); max-width: calc(50% - 7.5px);border:1px solid var(--second-light-opacity)}
    .program-filter-dates-select {position: relative;background: var(--white);}
    .program-filter-dates-select-current {display: block; position: relative; height: 40px; background: #F9FBFD; cursor: pointer;
        & svg {position: absolute; right: 10px; top: 8px; width: 24px; height: 24px; fill: none; stroke: var(--gray);}
    }
    .program-filter-dates-select.open .program-filter-dates-select-current svg {transform: rotate(-180deg);}
    .program-filter-dates-select-label {position: absolute; left: 10px; top: 2.5px; font-weight: normal;line-height: 17px;  color: var(--gray);}
    .program-filter-dates-select-value {position: absolute; left: 10px; top: 17.5px; font-weight: normal; font-size: 14px; line-height: 20px; letter-spacing: -0.01em; color: var(--text);}
    .program-filter-dates-select-list {display: none; position: absolute; left: 0; top: 100%; right: 0; margin: 10px 0 0 0; background: #F9FBFD; z-index: 99;}
    .program-filter-dates-select.open .program-filter-dates-select-list {display: block;}
    .program-filter-date {margin: 0; min-width: 0; padding: 6px 34px 6px 10px; height: auto; border: none; display: block; background: none; font: 14px/20px var(--font-arial-narrow); letter-spacing: -0.01em; color: var(--gray); position: relative;
        &.active {background: none; color: var(--text);
            &::after {content: ""; position: absolute; right: 10px; top: 6px; width: 24px; height: 24px; background: url(/MITEX/img/dropdown-active.svg) no-repeat;}
        }
    }
    .program-filter-halls {display: block; min-width: calc(50% - 7.5px); max-width: calc(50% - 7.5px); margin: 0 0 0 15px; border:1px solid var(--second-light-opacity)}
    .program-filter-halls-select {position: relative; background: var(--white);}
    .program-filter-halls-select-current {display: block; position: relative; height: 40px; background: #F9FBFD;; cursor: pointer;
        & svg {position: absolute; right: 10px; top: 8px; width: 24px; height: 24px; fill: none; stroke: var(--gray);}
    }
    .program-filter-halls-select.open .program-filter-halls-select-current svg {transform: rotate(-180deg);}
    .program-filter-halls-select-label {position: absolute; left: 10px; top: 2.5px; font-weight: normal; line-height: 17px; color: var(--gray);}
    .program-filter-halls-select-value {position: absolute; left: 10px; top: 17.5px; font-weight: normal; font-size: 14px; line-height: 20px; letter-spacing: -0.01em; color: var(--text);}
    .program-filter-halls-select-list {display: none; position: absolute; left: 0; top: 100%; right: 0; margin: 10px 0 0 0; background: #F9FBFD; z-index: 99;}
    .program-filter-halls-select.open .program-filter-halls-select-list {display: block;}
    .program-filter-hall {padding: 6px 34px 6px 10px; font-size: 14px; line-height: 20px; color: var(--gray); position: relative; cursor: pointer;
        &.active {color: var(--text);
            &::after {content: ""; position: absolute; right: 10px; top: 6px; width: 24px; height: 24px; background: url(/MITEX/img/dropdown-active.svg) no-repeat;}
        }
    }
    .program {margin: 0;
        &::before {right: 0; width: auto;}
    }
    .program-hours {padding: 70px 20px 163px 35px;}
    .program-halls {left: 63px; right: 63px; display: block;}
    .program-hall {margin: 0; display: none;
        &.active {display: block;}
    }
    .program-item-format {font-size: .6rem;}
    .program-item .title-medium {font-size: 1.0rem;line-height: 1.2;}

}