@import url('./icons/_icons.css');


body {
    --color-primary-element: #70B62B !important;
    --color-primary-element-hover: #6faf2e !important;
    --color-primary-element-light-hover: #ffffff !important;
    --color-background-hover: transparent !important;
    --sidebar-pad: 0px;
    --vs-border-width: 1px solid #E6E6E6;
    --row-height: 60px !important;

    & #app-content-vue {
        width: 100% !important;
        background-color: transparent !important;
        margin-left: var(--main-margin-panels) !important;
        margin-right: calc(var(--main-margin-panels) - 1px) !important;

        & .files-list .files-list__tbody .files-list__row-icon {
            flex: 0 0 32px !important;
        }



        & .files-list {
            background-color: #ffffff;
            border-radius: 8px;
            margin-top: var(--main-margin-panels);

            & .files-list__before {
                & .files-list__header-workspace {
                  & .text-editor {
                      & .content-wrapper.text-editor__content-wrapper {
                         & .tiptap {

                    
                             & > p[data-placeholder="Start writing or type '/' to add…"]::before {
                               content:"" !important;
                             }
                        }
                     }
                 }
              } 
           }
        }

        & .files-list__header {
            background-color: #ffffff;
            border-radius: 8px;
            height: 40px;
            flex: none;
            padding-inline: calc(var(--default-clickable-area, 44px) + 2 * var(--app-navigation-padding, 4px)) var(--app-navigation-padding, 4px);

            margin-inline: 0 !important;
            margin-block: 0 !important;
        }
    }



    /*upload-picker*/

    & .mask-button-load {
        width: 256px !important;
        min-height: 40px !important;
        color: white;
        background-color: #b8d0a0 !important;
        border-radius: 8px;

        position: absolute;
        top: 0;
        left: 0;
    }

    & #content-vue {
        z-index: 100 !important;
        position: relative;
    }

    & #app-content-vue {
        z-index: 900 !important;
        overflow: visible;
    }

    & .app-navigation {
        z-index: 910 !important;
        top: 40px !important;

        .app-navigation-toggle-wrapper {
            z-index: 960 !important;
        }

        & .app-navigation__search {
            display: none;
        }
    }

    & .upload-picker.files-list__header-upload-button.upload-picker--uploading .action-item {
        display: none !important;
    }


    & .upload-picker:not(.upload-picker--uploading) {
        height: 40px !important;

        & .action-item>div>button {
            color: white;
            width: 256px;
            background-color: #70B62B !important;
            height: 40px;
            /*gap: 8px;*/
            padding: 10px 14px;
            border-radius: 8px;

        }

        & .action-item>div>button:before {
            content: '';
            position: absolute;
            top: 0;
            right: 31px;
            width: 2px;
            height: 100%;
            background: #ffffff;
            pointer-events: none;
        }

        & .action-item>div>button:after {
            content: '';
            position: absolute;
            top: 50%;
            right: 7px;
            transform: translateY(-50%);
            width: 16px;
            height: 16px;
            background-image: url("../../../images/plus.svg");
            background-repeat: no-repeat;
            pointer-events: none;
        }
    }

    & .upload-picker.files-list__header-upload-button {
        display: block !important;
        padding: 0;
        position: absolute;

        left: -261px;
        top: 0;

        z-index: 920 !important;

        & .upload-picker__cancel {
            top: 0;
            right: -20px;
            position: absolute;
        }

        & .action-item {
            & .v-popper>button {
                width: 256px;
                height: 40px;
            }

            & .button-vue__wrapper::before {
                font-family: Raleway;
                font-weight: 500;
                font-size: 14px;
                line-height: 20px;
                letter-spacing: 0px;
                left: 48px;
                position: absolute;
                content: "Создать или загрузить";

            }

            & .button-vue__wrapper:after {
                background-image: url("/themes/forbion/images/inbox-mail-white.svg") !important;
                content: '';
                position: absolute;
                top: 7px;
                left: 15px;
                width: 20px;
                height: 20px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
            }



            & .button-vue__wrapper .button-vue__text,
            .button-vue__wrapper .button-vue__icon {
                display: none;
            }

        }



        & .files-list__header-upload-button--disabled {
            color: white;
            width: 247px;
            background-color: #b8d0a0 !important;
            /*background-color: #70b62b5e !important;*/
            opacity: 1;
            height: 40px;
            padding: 10px 14px;
            border-radius: 8px;
            display: flex !important;



            & .button-vue__wrapper:after {
                background-image: url('/themes/forbion/images/inbox-mail-white.svg') !important;
                content: '';
                position: absolute;
                top: 10px;
                left: 15px;
                width: 20px;
                height: 20px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
            }

            & .button-vue__icon {
                display: none;
            }

            & .button-vue__text {
                font-family: Raleway;
                font-weight: 500;
                font-size: 14px;
                line-height: 20px;
                letter-spacing: 0;
            }
        }

        & .files-list__header-upload-button--disabled:before {
            content: '';
            position: absolute;
            top: 0;
            right: 31px;
            width: 2px;
            height: 100%;
            background: #ffffff;
            pointer-events: none;
        }

        & .files-list__header-upload-button--disabled:after {
            content: '';
            position: absolute;
            top: 50%;
            right: 7px;
            transform: translateY(-50%);
            width: 16px;
            height: 16px;
            background-image: url("../../../images/plus.svg");
            background-repeat: no-repeat;
            pointer-events: none;
        }

        & .files-list__header-share-button {
            display: none !important;
        }

        & .material-design-icon .material-design-icon__svg>path {
            color: white !important;
        }


    }

    /*upload-picker*/

    & .app-navigation.files-navigation {
        /*width: 256px !important;*/
        background-color: transparent !important;

        & .app-navigation-entry__settings {
            background-color: #ffffff !important;
            border-bottom-left-radius: 8px;
            border-bottom-right-radius: 8px;
        }

        & .app-navigation__body {
            border-top-left-radius: 8px;
            border-top-right-radius: 8px;
            margin-top: var(--main-margin-panels);
            background-color: #ffffff !important;
        }

        & .app-navigation-toggle-wrapper {
            top: -37px !important;

            & button {
                background-color: transparent;
            }

            & .material-design-icon>svg {
                display: none;
            }

            & .material-design-icon::before {
                background-image: url("/themes/forbion/images/files/close-sidebar-gray.svg") !important;
                content: '';
                width: 20px;
                height: 36px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;

            }

            & .material-design-icon.menu-icon::before {

                transform: scale(1.1) rotateY(-180deg);

            }

            & .material-design-icon.menu-icon>svg path {
                color: #808080;
            }
        }

        & #app-navigation-vue {
            & .app-navigation__search {

                & .input-field__main-wrapper input {
                    box-shadow: none;
                    border: 1px solid #E6E6E6;
                }

            }

            & .upload-picker.files-list__header-upload-button.upload-picker--uploading {
                height: 40px !important;
                display: flex !important;
            }

            & .upload-picker--uploading button.button-vue.button-vue--size-normal.button-vue--icon-and-text {
                background-color: transparent !important;
                width: 40px !important;
                height: 40px !important;
                border: none;

                & .button-vue__text::after {
                    left: 9px !important;
                }
            }
        }
    }

    & #app-content-vue:has(li.vue-crumb a[aria-label="Предоставленные вам"]),
    #app-content-vue:has(li.vue-crumb a[aria-label="Ожидающие подтверждения"]),
    #app-content-vue:has(li.vue-crumb a[aria-label="Доступные по ссылке"]),
    #app-content-vue:has(li.vue-crumb a[aria-label="Доступные для других"]) {
        & .files-list__empty {
            & .empty-content__icon .icon-vue>span>svg {
                display: none;
            }

            & .empty-content__icon .icon-vue>span::before {
                background-image: url("/themes/forbion/images/files/shared-icon-colored.svg") !important;
                content: '';
                width: 75px;
                height: 75px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                display: block;
            }
        }

    }

    & #app-content-vue:has(li.vue-crumb a[aria-label="Запросы файлов"]) {

        & .files-list__empty {
            & .empty-content__icon .icon-vue>span>svg {
                display: none;
            }

            & .empty-content__icon .icon-vue>span::before {
                background-image: url("/themes/forbion/images/files/folder-icon-colored.svg") !important;
                content: '';
                width: 75px;
                height: 75px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                display: block;
            }
        }

    }

    & #app-content-vue:has(li.vue-crumb a[aria-label="Удалённые общие ресурсы"]) {

        & .files-list__empty {
            & .empty-content__icon .icon-vue>span>svg {
                display: none;
            }

            & .empty-content__icon .icon-vue>span::before {
                background-image: url("/themes/forbion/images/files/trash-icon-colored.svg") !important;
                content: '';
                width: 75px;
                height: 75px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                display: block;
            }
        }

    }

    & #content-vue {
        gap: 0px !important;
    }

    & #app-content-vue {

        & .empty-content .empty-content__icon {
            background-color: #ffffff;

            & .icon-vue svg path {
                color: #70B62B !important;
            }
        }


        & .files-list__before {
            & .editor .container-suggestions {
                margin-left: 0px;
                margin-bottom: 8px;
            }
        }

        & .files-list__empty:has(form.upload-picker.files-list__header-upload-button) {
            & .empty-content__icon .icon-vue>span>svg {
                display: none;
            }

            & .empty-content__icon .icon-vue>span::before {
                background-image: url("/themes/forbion/images/files/folder-icon-colored.svg") !important;
                content: '';
                width: 75px;
                height: 75px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                display: block;
            }
        }

        & .material-design-icon.dots-horizontal-icon>svg {
            display: none;
        }

        & .material-design-icon.dots-horizontal-icon::before {
            background-image: url("/themes/forbion/images/files/dots-vertic-gray.svg") !important;
            content: '';
            width: 16px;
            height: 16px;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
        }

        & .files-list__filters .file-list-filters__filter .icon-vue>svg path {
            color: #808080;
        }

        & .files-list__filters .file-list-filters__filter .button-vue--vue-secondary .icon-vue>svg path {
            color: #ffffff;
        }

        & .files-list__header {
            & .files-list__breadcrumbs.breadcrumb {
                justify-content: space-between;
                margin-inline: 0 !important;

                & .breadcrumb__crumbs {

                    & .button-vue__icon,
                    span.icon-vue svg {
                        display: none;
                    }
                }
            }

            & .magnifier-icon {
                display: flex;
            }

            & .material-design-icon.view-grid-outline-icon>svg,
            .material-design-icon.format-list-bulleted-square-icon>svg,
            .material-design-icon.view-grid-icon>svg {
                display: none;
            }

            & .material-design-icon.view-grid-outline-icon::before,
            .material-design-icon.view-grid-icon::before {
                background-image: url("/themes/forbion/images/files/grid-files-gray.svg") !important;
                content: '';
                width: 16px;
                height: 16px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
            }

            & .material-design-icon.format-list-bulleted-square-icon::before {
                background-image: url("/themes/forbion/images/files/grid-files-gray.svg") !important;
                content: '';
                width: 16px;
                height: 16px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
            }
        }

        & .files-list__thead-overlay {

            & button[data-cy-files-list-selection-action="favorite"] {
                & .icon-vue svg {
                    display: none;
                }

                & .icon-vue::before {
                    background-image: url("/themes/forbion/images/files/star-white.svg") !important;
                    content: '';
                    width: 16px;
                    height: 16px;
                    background-size: contain;
                    background-repeat: no-repeat;
                    background-position: center;
                }
            }

            & button[data-cy-files-list-selection-action="systemtags:bulk"] {
                & .icon-vue svg {
                    display: none;
                }

                & .icon-vue::before {
                    background-image: url("/themes/forbion/images/files/tags-white.svg") !important;
                    content: '';
                    width: 16px;
                    height: 16px;
                    background-size: contain;
                    background-repeat: no-repeat;
                    background-position: center;
                }
            }

            & button[data-cy-files-list-selection-action="move-copy"] {
                & .icon-vue svg {
                    display: none;
                }

                & .icon-vue::before {
                    background-image: url("/themes/forbion/images/files/copy-move-white.svg") !important;
                    content: '';
                    width: 16px;
                    height: 16px;
                    background-size: contain;
                    background-repeat: no-repeat;
                    background-position: center;
                }
            }

        }

        & .files-list__thead-overlay {
            top: 0 !important;
        }

        & .files-list__table {
            & .files-list__thead {
                position: static !important;
            }

            & .files-list__row-head {
                height: 65px !important;

                & .files-list__column.files-list__row-name.files-list__column--sortable {
                    height: 65px !important;

                    & .file-list-filters {
                        gap: 2px !important;
                    }
                }

                & .button-vue.files-list__column-sort-button {
                    min-width: 0 !important;
                    width: 100px;
                }
            }

            & .material-design-icon.checkbox-blank-outline-icon,
            .material-design-icon.checkbox-marked-icon,
            .material-design-icon.minus-box-icon {
                width: 16px !important;
                height: 16px !important;
            }

            & .material-design-icon.checkbox-blank-outline-icon svg path {
                color: #808080;
            }
        }
    }

    & #app-sidebar-vue {
        border-radius: 8px;
  
        & .app-sidebar-header {
             & .app-sidebar-header__info .app-sidebar-header__desc .app-sidebar-header__subname .sidebar__subname {
                 & span.icon-vue svg {
                    display:none;
                  }

                 & span.icon-vue::before {
                    background-image: url("/themes/forbion/images/files/star-green-full.svg") !important;
                    content: "";
                    width: 20px;
                    height: 20px;
                    background-size: contain;
                    background-repeat: no-repeat;
                    background-position: center;
                    display: block;
                }

            } 
       }



        & .app-sidebar-tabs__nav {

            & #tab-button-version_vue .svg-icon,
            #tab-button-version_vue .checkbox-content__icon svg {
                display: none !important;
            }

            & #tab-button-version_vue .checkbox-content__icon::before {
                content: '';
                display: block;
                width: 20px;
                height: 20px;
                background-image: url('/themes/forbion/images/right-sidebar/version-icon-black.svg');
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
            }

            & #tab-button-sharing .svg-icon,
            #tab-button-sharing_vue .checkbox-content__icon svg {
                display: none !important;
            }

            & #tab-button-sharing .checkbox-content__icon::before {
                content: '';
                display: block;
                width: 20px;
                height: 20px;
                background-image: url('/themes/forbion/images/right-sidebar/people-icon-black.svg');
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
            }

            & #tab-button-chat .icon-talk,
            #tab-button-chat_vue .checkbox-content__icon svg {
                display: none !important;
            }

            & #tab-button-chat .checkbox-content__icon::before {
                content: '';
                display: block;
                width: 20px;
                height: 20px;
                background-image: url('/themes/forbion/images/right-sidebar/chats-icon-black.svg');
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
            }
        }

        & #tab-activity {

            & .activity-entry {
                align-items: center;
                gap: 5px;
            }

            & .rich-text--wrapper.activity-entry__content__subject {
                font-weight: 500;
                font-size: 14px;
                line-height: 20.14px;
            }

            & .nc-datetime.activity-entry__date {
                font-weight: 600;
                font-size: 12px;
                line-height: 20.14px;
            }
        }

        & .sharingTab__content {
            display: flex;
            flex-direction: column;

            & .sharing-entry__title {
                font-weight: 500;
                font-size: 14px;
                line-height: 20.14px;
            }
        }

        & .sharingTabDetailsView__wrapper {
            overflow-x: hidden !important;
        }

        & .sharingTabDetailsView__advanced {
            & .input-field__main-wrapper input {
                box-shadow: none;
                border: 1px solid #E6E6E6;
            }
        }

        & .sharingTabDetailsView__wrapper {
            & input[type="text"] {
                box-shadow: none;
                border: 1px solid #E6E6E6;
            }
        }

        & .sharingTab {

            & .avatar-class-icon.avatar-link-share.icon-public-white {
                background-image: url('/themes/forbion/images/right-sidebar/sidebar-share-icon.svg');
            }

            & .avatar-shared.icon-more-white {
                background-image: url('/themes/forbion/images/right-sidebar/sidebar-people-icon.svg');
            }

            & .avatar-external.icon-external-white {
                background-image: url('/themes/forbion/images/right-sidebar/sidebar-link-icon.svg');
            }

            & .material-design-icon.content-copy-icon svg {
                display: none;
            }

            & .material-design-icon.content-copy-icon::before {
                content: '';
                background-image: url("/themes/forbion/images/files/plus-black.svg");
                width: 16px;
                height: 16px;
                background-size: auto;
                background-position: center;
                background-repeat: no-repeat;
            }

            & .sharingTab__content section:nth-child(2) {
                order: -1;
                padding-bottom: 0px;
                border-bottom: none;

                & .section-header,
                .sharing-search {
                    display: none;
                }

            }

            & .sharingTab__content section:nth-child(1) {
                padding-bottom: 0px;
                border-bottom: none;

                & .section-header,
                .sharing-search {
                    display: none;
                }

                & .sharing-entry__desc {
                    &>p {
                        display: none;
                    }
                }

            }

            & .sharingTab__content section:nth-child(3) {
                display: none;
            }

        }

        & .talkChatTab {
            & .icon.icon-talk {
                margin: 0 !important;
                background-image: url("/themes/forbion/images/files/go-to-chat-colored.svg");
                opacity: 1;
            }

            & .emptycontent.room-not-joined>button {
                height: 36px;

                & .button-vue__text {
                    font-weight: 500;
                    font-size: 14px;
                    line-height: 20px;
                }
            }

        }
    }

    & .modal-mask.dialog__modal {
        & .modal-wrapper.modal-wrapper--small {
            & .modal-container {
                padding-top: 32px;

                & .button-vue.button-vue--size-normal.button-vue--icon-and-text.button-vue--vue-primary .button-vue__icon {
                    display: none;
                }

                & .button-vue__wrapper::before {
                    background-image: url("/themes/forbion/images/files/save-icon-white.svg") !important;
                    content: '';
                    width: 18px;
                    height: 18px;
                    background-size: contain;
                    background-repeat: no-repeat;
                    background-position: center;
                    margin-right: 2px;
                }

                & .dialog__name {
                    display: flex;
                    justify-content: start;
                }

                & .input-field__main-wrapper {
                    height: 36px;

                    input {
                        border: 1px solid #E6E6E6;
                        box-shadow: none;
                    }
                }
            }
        }
    }
}


@media (max-width: 1024px) {
    body {
        & #app-content-vue {
            margin-left: 0 !important;
            margin-right: 0 !important;
        }

        & #app-sidebar-vue {
            margin-left: var(--main-margin-panels) !important;
        }
    }
}