


.app-sidebar-navs .menu .menu-item.here>.menu-link .menu-title {
    color:#fff;
}
.app-sidebar-navs .menu .menu-item .menu-link .menu-title {
    color: #A1A2A7;
}
.app-sidebar-navs .menu .menu-item .menu-link .menu-icon, .app-sidebar-navs .menu .menu-item .menu-link .menu-icon .svg-icon, .app-sidebar-navs .menu .menu-item .menu-link .menu-icon i {
    color: #A1A2A7;
}
.app-sidebar-navs .menu .menu-item .menu-link .menu-badge .badge.badge-custom {
    background-color: #262626;
    color: #A1A2A7;
}
.select2-container--bootstrap5 .select2-selection--single .select2-selection__placeholder {
    color: var(--bs-gray-700);
}
.form-select-lg {
    font-size: 1.1rem;
}
.select2-results__options[id*="select2-f_status"] .select2-results__option:nth-child(1) {
color: #17C653;
}
.select2-results__options[id*="select2-f_status"] .select2-results__option:nth-child(2) {
color: #F6C000;
}
.select2-results__options[id*="select2-f_status"] .select2-results__option:nth-child(3) {
color: #F8285A;
}
.select2-container--bootstrap5 .select2-selection--single .select2-selection__placeholder {
color: var(--bs-gray-600) !important;
}
.form-switch.form-check-solid .form-check-input:not(:checked) {
    background-color: var(--bs-gray-400);
}

.minicolors-theme-default .minicolors-input {
    height: 44px !important;
    padding-left: 44px !important;
    width: 140px !important;
}
.minicolors-theme-default .minicolors-swatch {
    width:25px !important;
    height:25px !important;
    top:9px !important;
    left:9px !important;

}
.file-title{
    overflow-wrap: break-word;
    min-width: 200px;
}
#mobile-title {
    border-bottom: 1px solid #DBDFE9;
}
.mobile-title-buttons {
    margin-left:auto;
    margin-right:30px;

}

.app-content {
    padding-top:5px;
}
.app-header {
    border-bottom: 1px solid #DBDFE9;
}
.page-title {
    margin-left:30px;
}
.app-toolbar {
    padding-left:30px;
    background-color:#fbfbfb;
    border:0;
}
#app_header_wrapper {
    max-width:1280px;
    padding-right:30px;
}
.vision-msg {
    max-width:1280px;
    background-color:#fbfbfb;

}
.vision-btn-back, .vision-btn-back-mobile {
    z-index: 99;
    border-right: 1px solid #DBDFE9;
    height:100%;
    width:40px;
    border-radius:0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}
.vision-app {
    background-color:#fbfbfb;
    
}
.vision-card {
    --bs-card-box-shadow: none;
    --bs-card-border-color: none;
    border: 0;
    background-color:#fbfbfb;
    max-width:1280px;
    padding-top:0;
}
.modal-body .vision-card {
    background-color:#ffffff;
}
/* списки */
.vision-list {
    padding:0;
    background-color: #fff;
}
.vision-list .item {
    max-width:1280px;
    display: flex;
    position: relative;
    border: 1px solid #DBDFE9;
    padding: 15px 20px 15px 20px;
    margin-bottom:-1px;
    justify-content: center;
    align-items: center;
}
.vision-list .item-group {
    max-width:1280px;
    display: flex;
    position: relative;
    border: 1px solid #DBDFE9;
    background-color: #fbfbfb;
    padding: 0px 20px 0px 20px;
    margin-bottom:-1px;
    justify-content: center;
    align-items: center;
}
ul.vision-list > li:first-of-type {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
ul.vision-list > li:last-child {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
.vision-list .image {
    margin-right: 20px;
    width: 70px;
    height: 60px;
    align-self: flex-start;
    display: flex;
    justify-content: center;    
    align-items: center;
}
.vision-list .text {
    flex-grow: 1; 
    flex-direction: column; 
    word-wrap:break-word;
    width:200px;
    padding-right:10px;
}
.vision-list .text-group {
    flex-grow: 1; 
    flex-direction: column; 
    word-wrap:break-word;
    width:200px;
    padding-right:10px;
    /*color:#fff;*/
}
.vision-list a {
    color:#252F4A;
}
.vision-list .title {
    font-size:18px;
    font-weight: 600;

}
.vision-list .details {
    font-size: 12px;
    font-weight: 400;
    color: var(--bs-gray-700);
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
}
.vision-list .details i {
    color: var(--bs-gray-700);
}
.vision-list .details>span {
    margin-right:12px;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-content: center;
    justify-content: flex-start;
    align-items: center;

}
.vision-list .buttons {
    margin-right:10px;
    align-self: flex-start;
    margin-top:10px;
    margin-bottom:10px;
}
.item-group .buttons {
    margin-top:10px;
    margin-bottom:10px;
}
.item-group .buttons .btn {

}
.vision-list .drag-handle {
    cursor: move;
    font-size: 20px;
    color:#aeaeae;
    margin-left:5px;
    align-self: flex-start;
    margin-top:17px;
}
.vision-list > .item > .text > a {
    width: max-content;
}


.size-hide {
    display: none;
}
.size-show {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.period-hide {
    display: none;
}
.period-show {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.edit-week-days {
    display: flex;
    
}

.link_frame_wrap {
    width: 540px;
    height: 600px;
    padding: 0;
    overflow: hidden;
}

.link_frame {
    width: 1080px;
    height: 600px;
    border: 0px;
    zoom: 0.5;
    -moz-transform: scale(0.5);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.5);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.5);
    -webkit-transform-origin: 0 0;
    border:5px solid #4B5675;
    
}

.main-rectangle {
    position: relative;
    background-color: #000;
    overflow: hidden;
    box-sizing: content-box; 
}

.rectangle {
    position: absolute; /* Прямоугольники расположены абсолютно */
    cursor: move;
    box-sizing: border-box;
    z-index: 1; /* Слой выше, чтобы избежать перекрытия */
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;

}

.modal-body .rectangle {
    cursor: default;
}

.rectangle-small .rectangle {
    cursor: pointer;
}

.rectangle-small .rectangle .vision-icon-i {
    position: absolute;
    border-radius: 0px;
    font-size: 15px !important;
    top: calc(50% - 9px);
    left: calc(50% - 7.5px);
}

.rectangle .vision-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    
}

.rectangle .vision-img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border-radius: 0;
    background-color: #f0f0f0;
    object-fit: cover; 
    z-index: 1;
    
}

.rectangle .vision-img-set {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border-radius: 0;
    background-color: #515151;
    object-fit: cover !important; /* Чтобы изображение заполняло прямоугольник */
    z-index: 1;
    overflow: hidden;
}

.rectangle .vision-img-set .vision-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border-radius: 0;
    background-color: #515151;
    object-fit: cover !important; /* Чтобы изображение заполняло прямоугольник */
    z-index: 1;
    overflow: hidden;
    margin:0;
}


.number {
    position: relative;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9), -1px -1px 1px rgba(0, 0, 0, 0.9), -1px 1px 1px rgba(0, 0, 0, 0.9), 1px -1px 1px rgba(0, 0, 0, 0.9); /* Тень для читаемости */
    z-index: 50; /* Поверх изображения */
    color: white;
    font-weight: bold;
}
.rectangle .number {
    font-size: 25px;  
}
.vision-list .image .number {
    position: absolute;
    top: 30px;
    left: 50px;
    font-size: 20px;
}


.rectangle-info > .item > .image > a > .vision-icon {
    width: 60px;
    height: 60px;
    border-radius: 10px;
    padding: 8px 8px;
    margin:0px 4px;
}

.rectangle > .vision-icon {
    width: 100%;
    height: 100%;
    position: absolute;
    border-radius: 0px;
    padding: 12px 10px;
    overflow: hidden;
    font-size:45px;
}

.screen-border-1 {
    border:1px solid #000;
}


.sm_week_day {
    border: 1px solid var(--bs-primary);
    border-radius:5px;
    padding:2px 4px;
    margin-right:2px;
    font-size:10px;
    color: var(--bs-dark);
}

.sm_week_day_chk {
    color: var(--bs-primary-inverse);
    background-color: var(--bs-primary) !important;    
}
.vision-list .details > span.channel_intervals {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    
}
.channel_dates {
    display: flex;
    flex-direction: row;
    border:1px solid var(--bs-gray-400);
    width:max-content;
    padding:5px 8px;
    border-radius: 5px;
    margin-top:5px;
}
.channel_time {
    border:1px solid var(--bs-gray-400);
    width:140px;
}

.screen_rectangle .main-rectangle, .screen_rectangle .rectangle {
    cursor:default !important;
}

#view-video {
    max-height: 400px;
}

/* ИКОНКИ */
.vision-folder i {
    color: var(--bs-primary);
    font-size:55px;
}
.vision-icon {
    width:62px;
    height:50px;
    border-radius:5px;    
    display: flex;
    justify-content: center;
    align-items: center;
    background-color:var(--bs-gray-600);
    border:1px solid var(--bs-gray-600);
}
.rectangle-small .vision-icon {
    border:1px solid #000000;
}

.vision-icon i {
    color: var(--bs-white);
    font-size:35px;
}

li .vision-img-link img {
    /*border:1px solid var(--bs-gray-400) !important;*/
    /*border-radius:5px;   */
}

.vision-img {
    top: 0;
    left: 0;
}

.main-rectangle .vision-img, .main-rectangle .vision-img img {
    width: 100%;
    height: 100%;
    border-radius: 0px;
    object-fit: cover;
}


li .vision-img img {
    width: auto;
    height: auto;
    max-width:64px;
    max-height:64px;
    border: 1px solid black;
}


.vision-img-link img {
    object-fit: cover; 
    object-position: top;
}

.vision-img-widget {
    width:64px; 
    height:64px;
}

.vision-img-widget img {
    object-fit: none !important; 
    max-width:100%;
    max-height:100%;
}

.vision-screen {
    border:2px solid #000;
    background-color:#333; 
    overflow: hidden;
}

.vision-screen-no-move .rectangle {
    cursor:default;
}

.vision-screen .vision-img {
    width:100%;
    height:100%;
}

.vision-screen .vision-img img {
    width:100%;
    height:100%;
    border-radius:0px;
    object-fit: cover; 
    border:none;
}

.vision-screen .vision-icon {
    width:100%;
    height:100%;
    border-radius:0px;
    font-size: inherit;
}

.main-rectangle, .main-rectangle .rectangle, .main-rectangle .rectangle .vision-icon {
    font-size: inherit;
}

.vision-screen .vision-icon i, .rectangle .vision-icon i {
    font-size: inherit;
}

.vision-list .main-rectangle .vision-icon {
    width:100%;
    height:100%;
    border-radius:0px;
    font-size: inherit;
    background-color:none !important; 
}
.main-rectangle .vision-icon {


}

.vision-list .main-rectangle .vision-icon i {
    font-size: inherit;
}

.link_img {
    width: 100%;
    height:450px;
    overflow:scroll;
    border: 1px solid var(--bs-gray-300);
    border-radius: 10px;
}
.link_img img {
    width: 100%;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .link_frame {
      zoom: 1;
    }
} 

/* Loading modal */
.lds-dual-ring {
    color: var(--bs-primary);
  }
  .lds-dual-ring,
  .lds-dual-ring:after {
    box-sizing: border-box;
  }
  .lds-dual-ring {
    display: inline-block;
    width: 80px;
    height: 80px;
  }
  .lds-dual-ring:after {
    content: " ";
    display: block;
    width: 64px;
    height: 64px;
    margin: 8px;
    border-radius: 50%;
    border: 6.4px solid currentColor;
    border-color: currentColor transparent currentColor transparent;
    animation: lds-dual-ring 1.2s linear infinite;
  }
  @keyframes lds-dual-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }


@media (max-width: 991px) {
    .sm_week_day {
        border: 1px solid var(--bs-gray-700);
        border-radius:2px;
        padding:1px 2px;
        margin-right:2px;
        font-size:9px;
        color: var(--bs-dark);
    }
    .sm_week_day_chk {
        color: var(--bs-primary-inverse);
        background-color: var(--bs-gray-600) !important;    
    }
    .vision-list .image .number {
        left: 38px;
    }
    .app-header {
        background-color: #131313;
        
    }
    #mobile-title {
        display:flex;
    }
    .hide-mobile {
        display:none !important;
    }
    .file-title{
        width: 200px;
    }
    .app-container {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    .vision-btn-back {
        display:none;
    }
    .vision-btn-back-mobile {
        display:flex;
    }
    .vision-mobile-menu {
        margin-left:10px;
    }
    .vision-mobile-menu-back {
        margin-left:-10px;
    }
    /* крупный шрифт для мобильных чтобы избежать zoom*/
    input[type="color"],
    input[type="date"],
    input[type="datetime"],
    input[type="datetime-local"],
    input[type="email"],
    input[type="month"],
    input[type="number"],
    input[type="password"],
    input[type="search"],
    input[type="tel"],
    input[type="text"],
    input[type="time"],
    input[type="url"],
    input[type="week"],
    select:focus,
    textarea {
        font-size: 16px;
    }
    #edit_channel_dates {
        display:none;
    }
}
@media (min-width: 992px) {
    #mobile-title {
        display:none;
    }
    .hide-full {
        display:none !important;
    }
    .app-container {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
    .vision-btn-back-mobile {
        display:none;
    }
    .vision-btn-back {
        display:flex;
    }

}
