/* 360 极速 / 国产 Chromium 兼容层 */

html {
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    min-height: 100vh;
    min-height: -webkit-fill-available;
}

/* 登录页：Grid 不支持时用 Flex 双栏 */
.login-page {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    width: 100%;
}

.login-brand,
.login-panel {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 50%;
    flex: 1 1 50%;
    min-width: 280px;
    max-width: 50%;
}

.login-panel {
    max-width: none;
    min-width: 300px;
}

@supports (display: grid) {
    .login-page {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .login-brand,
    .login-panel {
        max-width: none;
    }
}

/* inset / backdrop 回退 */
.sidebar-overlay {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

.modal {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .sidebar-overlay {
        background: rgba(6, 13, 24, 0.85);
    }
    .modal {
        background: rgba(6, 13, 24, 0.75);
    }
}

/* 工作台 Grid 回退 */
.dashboard-grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -8px;
}

.dashboard-grid .dashboard-card {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(20% - 16px);
    flex: 0 0 calc(20% - 16px);
    width: calc(20% - 16px);
    margin: 8px;
    min-width: 140px;
}

@supports (display: grid) {
    .dashboard-grid {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        margin: 0;
    }
    .dashboard-grid .dashboard-card {
        -ms-flex: none;
        flex: none;
        width: auto;
        margin: 0;
        min-width: 0;
    }
}

.dashboard-bottom {
    display: block;
}

.dashboard-bottom > * {
    margin-bottom: 20px;
}

@supports (display: grid) {
    .dashboard-bottom {
        display: grid;
        grid-template-columns: 1.2fr 1fr;
        gap: 20px;
    }
    .dashboard-bottom > * {
        margin-bottom: 0;
    }
}

/* SVG use 图标尺寸 */
.nav-icon .icon,
.card-icon .icon,
.action-icon .icon {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.nav-icon svg,
.card-icon svg {
    display: block;
    overflow: visible;
}

/* Flex gap 回退（极老内核） */
.sidebar-header > * + *,
.nav-item > * + * {
    margin-left: 12px;
}

.nav-item {
    margin-bottom: 2px;
}

.products-grid,
.solutions-editor,
.services-editor {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -10px;
}

.products-grid > *,
.solutions-editor > *,
.services-editor > * {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(33.333% - 20px);
    flex: 0 0 calc(33.333% - 20px);
    width: calc(33.333% - 20px);
    margin: 10px;
    min-width: 260px;
}

@supports (display: grid) {
    .products-grid,
    .solutions-editor,
    .services-editor {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        margin: 0;
    }
    .products-grid > *,
    .solutions-editor > *,
    .services-editor > * {
        width: auto;
        margin: 0;
        min-width: 0;
    }
}

@media (max-width: 1200px) {
    .dashboard-grid .dashboard-card {
        -ms-flex: 0 0 calc(33.333% - 16px);
        flex: 0 0 calc(33.333% - 16px);
        width: calc(33.333% - 16px);
    }
}

@media (max-width: 992px) {
    .login-page {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .login-brand,
    .login-panel {
        max-width: 100%;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }
    .dashboard-grid .dashboard-card {
        -ms-flex: 0 0 calc(50% - 16px);
        flex: 0 0 calc(50% - 16px);
        width: calc(50% - 16px);
    }
}

@media (max-width: 768px) {
    .dashboard-grid .dashboard-card {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        width: 100%;
    }
    .products-grid > *,
    .solutions-editor > *,
    .services-editor > * {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        width: 100%;
    }
}
