.focalboard-body .SidebarBoardItem {
    .octo-sidebar-item {
        display: flex;
        flex-direction: row;
        font-weight: 500;
        padding: 0 16px 0 8px;
        height: 36px;
        align-items: center;

        &:hover {
            background-color: rgba(var(--sidebar-text-rgb), 0.08);
            display: flex;
        }

        &.subitem {
            padding-left: 20px;
            color: rgba(var(--sidebar-text-rgb), 0.64);
            font-weight: 400;
        }

        &.active {
            background: rgba(var(--sidebar-text-rgb), 0.1);
            position: relative;
            color: white;

            .Icon {
                stroke: rgba(var(--sidebar-text-rgb), 1);
            }

            &:not(.subitem) {
                &:before {
                    content: '';
                    background: var(--sidebar-text-active-border);
                    width: 2px;
                    height: 100%;
                    position: absolute;
                    left: 0;
                    top: 0;
                }
            }
        }

        &.no-views {
            color: rgba(var(--sidebar-text-rgb), 0.4);

            &:hover {
                background-color: rgba(var(--sidebar-bg-rgb));
            }
        }

        &:not(.no-views) {
            cursor: pointer;
        }

        > .Icon {
            stroke: rgba(var(--sidebar-text-rgb), 0.3);
            height: 14px;
            width: 14px;
            margin-right: 8px;
            flex-shrink: 0;
            &.GalleryIcon {
                fill: rgba(var(--sidebar-text-rgb), 0.3);
                stroke: unset;
            }
        }

        > .IconButton {
            background-color: var(--sidebar-bg-rgb);

            &:hover {
                background-color: rgba(var(--sidebar-text-rgb), 0.1);
            }
        }

        .Menu.left {
            right: -16px;
        }

        &.expanded {
            .DisclosureTriangleIcon {
                transform: rotate(90deg);
            }
        }

        .DisclosureTriangleIcon {
            transition: 200ms ease-in-out;
            transform: rotate(0deg);
        }
    }

    .octo-sidebar-title {
        font-weight: 600;
        flex-grow: 1;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
