/* ------------------------------- UI ELEMENTS ------------------------------- */

/*modal*/

#modal {position: fixed; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; overflow: hidden; display: none; opacity: 0;
    filter: alpha(opacity=0); background: rgba(0, 21, 51, 0.72); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); z-index: 5000;}

#modal.active {display: block; opacity: 1; filter: alpha(opacity=100);}
#modal_container {overflow-y: scroll; z-index: 1201; top: 0; bottom: 0; left: 0; width: 100%; height: 100%;text-align: left; direction: ltr; position: fixed;}
#modal_overlay {position: absolute; width: 100%; min-height: 100%; left: 0; top: 0;}
/* Подложка модалки. Была background:transparent при живой тени — тень висела
   без карточки, содержимое лежало прямо на затемнении. */
#modal_content {position: relative; z-index: unset; height: auto; margin: 55px auto 20px; background: #fff; padding: 0; border-radius: 24px; overflow: hidden; -webkit-box-shadow: 0 24px 60px rgba(0, 32, 77, 0.32); box-shadow: 0 24px 60px rgba(0, 32, 77, 0.32);}
/* Заголовок модалки — как .mtitle редактора слайда (было легаси 32pt UPPERCASE) */
#modal_content .title {font-weight: 900;font-size: 22px;color: var(--cp-deep-blue);min-width: 200px; margin-bottom: 28px}

/* ------------------------- MODAL DIALOG -------------------------- */

.modal_dialog { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.6); z-index: 99999; box-shadow: unset !important;}
.modal_dialog > div,
.modal_dialog > form { max-width: 90%; position: relative; margin: 5% auto auto; padding: 70px; border-radius: 24px; background: #fff; min-height: 80vh; }
.modal_content { margin-top: 15px; }
.modal_content > h4 { font-weight: 600; font-size: 14px; color: #11131F; margin-bottom: 8px; }
.modal_close { color: #86868B; line-height: 25px; position: absolute; right: 16px; text-align: center; top: 19px; width: 24px; text-decoration: none; font-weight: bold; }
.modal_close:hover { color: var(--cp-accent);  border-radius: 50%; }
.big_close {line-height: 50px; font-size: 50px; opacity: 0.3; right: 40px;}
.big_close > i{text-shadow: 1px 1px 2px #575656, 0 0 1em #575656; font-weight: normal}
.big_close:hover{opacity: 1;}

/* ------------------------- MODAL LOAD SLIDE -------------------------- */

.load_slide_from > div {display: flex;}
.load_slide_from > div > .filter-block {width: 40%; display: flex; flex-wrap: wrap; position: relative; overflow: auto; max-height: 600px;}
.load_slide_from > div > .filter-block > .filter-box { width: 50%; min-width: 250px;}
.load_slide_from > div > .form_block {width: 60%; display: flex; flex-direction: column; justify-content: space-evenly; padding: 10px 70px; }
.load_slide_from > div > .form_block > .modal_buttons_block {display: flex; flex-direction: row; align-items: center; align-self: flex-end; margin: 15px 0px 0 0;}
.load_slide_from > div > .form_block > .modal_buttons_block > .upload-button {margin-left: 20px;}
.load_slide_from > div > .form_block > .upload_pptx {background-color: #6f6e6e; width: 100%; padding-bottom: 56.25%; position: relative; margin: 0 0 15px 0; display: flex; justify-content: center}
.load_slide_from > div > .form_block > .upload_pptx > .upload-button {position: absolute; margin: 50% auto; top: -50%;left: 50%;margin-left: -180px; text-align: center;}
.load_slide_from > div > .form_block > .upload_pptx > img {position: absolute; max-width: 100%; max-height: 100%;}

/* ------------------------- MODAL LOAD LOGO -------------------------- */

.load_logo_from > div {display: flex;}
.load_logo_from > div > .filter-block {width: 40%; display: flex; flex-wrap: wrap; position: relative; overflow: auto; max-height: 600px;}
.load_logo_from > div > .filter-block > .filter-box { width: 50%; min-width: 250px;}
.load_logo_from > div > .form_block {width: 60%; display: flex; flex-direction: column; justify-content: space-evenly; padding: 10px 70px; }
.load_logo_from > div > .form_block > .modal_buttons_block {display: flex; flex-direction: row; align-items: center; align-self: flex-end; margin: 15px 0px 0 0;}
.load_logo_from > div > .form_block > .modal_buttons_block > .upload-button {margin-left: 20px;}
.load_logo_from > div > .form_block > .upload_pptx {border:1px solid #D6E7FF; border-radius: 8px; width: 100%; position: relative; margin: 0 0 15px 0;display: flex; justify-content: center; align-items: center}
.load_logo_from > div > .form_block > .upload_pptx:before {padding-bottom: 56.25%; content: ""; float: left}
.load_logo_from > div > .form_block > .upload_pptx > .upload-button {position: absolute; margin: 50% auto; top: -50%;left: 50%;margin-left: -180px; text-align: center;}
.load_logo_from > div > .form_block > .upload_pptx.upload_logo > .upload-button.update {top: 5px !important; right: 5px!important;  left: unset; margin: unset !important;}
.load_logo_from > div > .form_block > .upload_pptx > img {position: absolute; max-width: 85%; max-height: 85%;}

/* ------------------------- MODAL ADD/EDIT FILTER -------------------------- */

.modal_filter_content {display: flex; flex-wrap: wrap;}
.modal_filter_content > div {width: 50%; padding-right: 50px; margin-top: 30px}
.modal_filter_content > .title {width: 100%}
.modal_filter_content > div:last-child {padding-left: 50px;}
.modal_filter_content > div > * { margin-bottom: 20px;}
.modal_filter_content > div > input {width: 100%;}
.modal_filter_content > div > .input-row {width: 100%; display: flex; }
.modal_filter_content > div > .input-row > input {width: 64%; margin-right: 15px;}
.modal_filter_content select {font-size: 12px; color: #6f6e6e}
.add_filter_from { display: flex; flex-direction: column; justify-content: space-between}
.add_filter_from .tags-for-filter h3{margin-top: 0; color: var(--cp-deep-blue);}
.tags-for-filter > .subs_list {display: flex; flex-direction: column;}
.tags-for-filter > .subs_list > span {margin-bottom: 10px;}
.tags-for-filter > .subs_list i {color: #d9d9d9; cursor: pointer}
.tags-for-filter > .tag_list {display: flex; flex-direction: column;}
.tags-for-filter > .tag_list > span {margin-bottom: 10px;}
.tags-for-filter > .tag_list > span > i {color: var(--cp-accent); cursor: pointer}
.add_filter_from .upload-button {float: right}

/* ------------------------- MODAL ADD/EDIT USER -------------------------- */

.modal_user_content > div:not(.title){width: 40%; display: flex; flex-direction: column;}
.modal_user_content > div > select,
.modal_user_content > div > input {width: 100%; margin-bottom: 15px; font-size: 14px;}
.modal_user_content > div > select {padding-left: 13px; box-sizing: border-box; padding-right: 25px; position: relative;display: inline-block;}
.add_user_from { display: flex; flex-direction: column; justify-content: space-between}
.add_user_from .tags-for-filter h3{margin-top: 0; color: var(--cp-deep-blue);}
.add_user_from .upload-button {float: right}


/* ------------------------- MODAL EDIT TAG -------------------------- */

.modal_tag_content > div:not(.title){width: 40%; display: flex; flex-direction: column;}
.modal_tag_content > div.title > span {display: block; font-size: 26pt}
.modal_tag_content > div > select,
.modal_tag_content > div > input {width: 100%; margin-bottom: 15px; font-size: 14px;}
.modal_tag_content > div > select {padding-left: 13px; box-sizing: border-box; padding-right: 25px; position: relative;display: inline-block;}
.add_tag_from { display: flex; flex-direction: column; justify-content: space-between}
.add_tag_from .tags-for-filter h3{margin-top: 0; color: var(--cp-deep-blue);}
.add_tag_from .upload-button {float: right}


/** SLIDE/LOGO **/
.upload-button.update { opacity:0.5; z-index: 3}
.upload-button.update:hover { opacity:1;}

select {
    font: inherit;
    letter-spacing: inherit;
    word-spacing: inherit;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
}

select:not([multiple]) {
    padding-right: 1.2em;
    background-repeat: no-repeat;
    background-position: top 50% right 18px;
    background-size: 0.85em auto;
    background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath d='M70.3 13.8L40 66.3 9.7 13.8z' fill='%236f6e6e'%3E%3C/path%3E%3C/svg%3E");
}

select::-ms-expand {
    display: none;
}