.device-overview {
    display: flex;

    .left-menu-container {
        width: 248px;
        margin-right: 16px;
        background: #ffffff;
        box-shadow: 0px 2px 6px 0px #cccccc;
        border-radius: 4px 4px 4px 4px;

        :deep(.ant-collapse-content-box) {
            padding: 0 !important;
        }

        .menu-grid-view {
            display: flex;
            flex-wrap: wrap;
            background: #f7f7f7;
            padding: 5px 16px;

            .menu-item {
                cursor: pointer;
                width: 102px;
                height: 72px;
                background: #ffffff;
                border-radius: 4px 4px 4px 4px;
                font-size: 12px;
                font-family: PingFang SC-Medium, PingFang SC;
                font-weight: 500;
                color: #333333;
                line-height: 28px;
                text-align: center;
                padding-top: 10px;
                margin: 5px 0;

                &.active {
                    box-shadow: 0px 0px 4px 0px #9bb2e9;
                    border-radius: 4px 4px 4px 4px;
                }

                &:nth-child(2) {
                    margin-left: 12px;
                }

                img {
                    width: 32px;
                    height: 32px;
                }
            }
        }

        .menu-list-view {
            .menu-item {
                cursor: pointer;
                display: flex;
                align-items: center;
                width: 220px;
                height: 40px;
                padding-left: 40px;
                background: #ffffff;
                font-size: 12px;
                font-family: PingFang SC-Medium, PingFang SC;
                font-weight: 500;
                color: #333333;
                line-height: 28px;

                &.active {
                    background: rgba(66, 119, 255, 0.08);
                }

                img {
                    width: 17px;
                    height: 17px;
                    margin-right: 5px;
                }

                div {
                    display: inline;
                }
            }
        }
    }

    .right-content-container {
        flex: 1;
        .page-top {
            width: 100%;
            display: flex;
        }
        .page-middle {
            width: 100%;
            display: flex;
            margin-top: 16px;
        }
        .page-bottom {
            width: 100%;
            display: flex;
            margin-top: 16px;
            height: 341px;
        }
    }
}