
.layout-chartdesigner {
    @tab-bg-color-active: #727D99;
    @text-color: #D2E0F3;
    &> .layout-header {
        background: @content-background-color;
    }
    &> .layout-content {
        &> .chartdesigner {
            &> .ant-layout-sider {
                background: @sider-background-color;
                border: none;
                &> .ant-layout-sider-children {
                    >.collapse-toggle {
                        color: blue;
                    }
                    >.ant-tabs {
                        >.ant-tabs-bar {
                            border: none;
                            >.ant-tabs-nav-container {
                                margin-bottom: 0px;
                                >.ant-tabs-nav-wrap {
                                    >.ant-tabs-nav-scroll {
                                        >.ant-tabs-nav {
                                            .ant-tabs-tab {
                                                color: @text-color;
                                                &.ant-tabs-tab-active {
                                                    background: @tab-bg-color-active;
                                                }
                                            }
                                            .ant-tabs-ink-bar {
                                                display: none !important;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                        >.ant-tabs-content {
                            .ant-tabs-tabpane {
                                color: @text-color;
                                &.ant-tabs-tabpane-active {
                                    background: @tab-bg-color-active;
                                }
                            }
                            .ant-form-item, .ant-form-item-label > label {
                                color: @text-color;
                            }
                            .checkbox-group-statistics {
                                >.ant-row {
                                    >div>label {
                                        color: @text-color;
                                    }
                                }
                            }
                        }
                    }
                    >.sider-footer {
                        background: @sider-background-color;
                        border: none;
                    }
                }
            }
            &> .view-content {
                >.ant-layout {
                    >.content-header {
                        background: @content-background-color;
                    }
                    >.content-body {
                        background: @content-background-color;
                        padding: 12px;
                        >.echarts-for-react {
                            background: #fff;
                        }
                    }
                }
            }
        }
    }
}

.baseconfig-viewtype {
    border: 1px solid #E2EFFF;
    .ant-select-dropdown-menu .ant-select-dropdown-menu-item .viewtype-box {
        .viewtype-icon {
            color: #419BF9;
        }
    }
}