> #containerObject { width: 100%; height: 100%; overflow: hidden; padding: 52px 12px 12px 12px; }
> #containerObject {
	> .inner { display: flex; flex-direction: column; width: 100%; height: 100%; background: var(--color-bg-primary); border-radius: 12px; }
	> .inner {
		> .head { display: flex; flex-direction: column; gap: 8px 0px; overflow: hidden; padding: 0px 0px 12px 0px; }
		> .head {
			.titleWrap { 
				display: flex; flex-direction: row; align-items: center; gap: 0px 8px; width: 100%; padding: 16px 10px 1px 10px; justify-content: space-between;
			}
			.titleWrap {
				.side { height: 32px; }
				.side.left { display: flex; flex-direction: row; align-items: center; gap: 0px 8px; }
				.side.right { display: flex; flex-direction: row; align-items: center; justify-content: flex-end; }

				.title { @include text-paragraph; font-weight: 600; flex-grow: 1; }
				.icon.back { flex-shrink: 0; background-image: url('~img/icon/widget/back.svg'); }
				.icon.more { background-image: url('~img/icon/menu/action/more0.svg'); }
			}

			.sides { display: flex; flex-direction: row; gap: 0px 8px; }
			.sides {
				.side.left { flex-grow: 1; }
				.side.right { flex-shrink: 0; }
				.side.right:empty { display: none; }
			}

			.tabs, .sides.sidesFilter { padding: 0px 16px; }

			.tabs { position: relative; }
			.tabs {
				.scrollWrap { overflow-y: hidden; overflow-x: auto; padding: 0px 0px 3px 0px; }
				.scrollWrap::-webkit-scrollbar { display: none; }

				.scroll { display: flex; align-items: center; gap: 0px 12px; font-weight: 500; color: var(--color-control-active); }

				.tab { white-space: nowrap; flex-shrink: 0; transition: $transitionAllCommon;  }
				.tab.active, .tab:hover { color: var(--color-text-primary); }

				.controls { position: absolute; top: -4px; left: 0px; width: 100%; display: flex; justify-content: space-between; }
				.controls {
					.side { width: 60px; position: relative; }
					.side.hide {
						.icon.arrow, .gradient { display: none; }
					}

					.icon.arrow { background-image: url('~img/arrow/sidebarObjectTab.svg'); position: absolute; z-index: 2; top: 1px; }
					.gradient { position: absolute; width: 100%; height: 28px; z-index: 1; top: 0px; pointer-events: none; }

					.side.left {
						.icon.arrow { left: 16px; transform: rotateZ(180deg); }
						.gradient { left: 0px; background-image: linear-gradient(270deg, rgba(255,255,255,0) 0px, var(--color-bg-primary) 16px, var(--color-bg-primary) 100%); }
					}

					.side.right {
						.icon.arrow { right: 16px; }
						.gradient { right: 0px; background-image: linear-gradient(90deg, rgba(255,255,255,0) 0px, var(--color-bg-primary) 16px, var(--color-bg-primary) 100%); }
					}
				}
			}

			.filter { padding: 0px 4px; border-radius: 6px; border: 1px solid var(--color-shape-secondary); }
			.filter {
				.inner { height: 26px; gap: 0px; }
				.line { display: none; }
				.icon.search { background-size: 13px; }
				.icon.clear { margin-left: 8px; }
			}

			.label { padding: 8px 16px; @include text-small; color: var(--color-text-secondary); }
		}

		> .body { flex-grow: 1; overflow: hidden; }
		> .body {
			.ReactVirtualized__List { padding: 0px 8px 8px 8px; overscroll-behavior: none; }

			.emptySearch { height: auto; padding: 5px 0px 0px 0px; }
			.emptySearch {
				.txt { color: var(--color-text-secondary); }
				.small { @include text-small; }
			}

			.items { height: 100%; }

			.item { padding: 8px; display: flex; flex-direction: row; align-items: center; gap: 0px 12px; position: relative; }
			.item {
				.iconObject { flex-shrink: 0; }
				.iconObject.c48 { background-color: var(--color-shape-tertiary); }

				.info { width: 100%; display: flex; flex-direction: column; }

				.nameWrap { flex-grow: 1; overflow: hidden; }
				.name { @include text-overflow-nw; width: 100%; }

				.icon.lock { width: 16px !important; height: 16px !important; background-image: url('~img/icon/widget/lock.svg'); flex-shrink: 0; }

				.bottomWrap { 
					display: flex; @include text-overflow-nw; width: 100%; @include text-small; color: var(--color-text-secondary); gap: 0px 6px; 
					align-items: center;
				}
				.bottomWrap {
					.type { max-width: 40%; @include text-overflow-nw; flex-shrink: 0; }
					.descr { position: relative; @include text-overflow-nw; max-width: 100%; }
					.descr:empty { display: none; }
					.bullet { width: 2px; height: 2px; border-radius: 50%; background-color: var(--color-text-secondary); flex-shrink: 0; display: none; }
				}
			}
			.item:not(.isCompact) {
				.iconObject { border-radius: 6px; }
			}

			.item.withDescr {
				.bullet { display: block; }
			}

			.item.withIcon {
				.info { width: calc(100% - 60px); }
			}

			.item.isCompact {
				.iconObject { background-color: unset; }

				.info { width: calc(100% - 28px); }
				.nameWrap { display: flex; flex-direction: row; align-items: center; gap: 0px 8px; }
				.descrWrap {
					.type, .descr::before { display: none; }
				}
			}

			.item.isCompact.withIcon {
				.descrWrap { padding-left: 26px; }
			}

			.item.isFile {
				.iconObject { background-color: unset !important; }
			}

			.item.isSection { @include text-small; color: var(--color-text-secondary); padding: 8px 8px 2px 8px; }

			.item::before {
				content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(79,79,79,0); z-index: 1;
				pointer-events: none; border-radius: 6px;
			}
			.item.active::before, .item.hover::before { background: var(--color-shape-highlight-medium); }
			.item.selected::before { background: var(--color-system-selection); }
		}
	}
}
