/* PowerMatrixAI 管理界面风格调整 - 与主页保持一致 */

/* 整体配色方案 */
:root {
    --ms-blue: #0078D4;
    --ms-orange: #FFB900;
    --ms-red: #D13438;
    --ms-purple: #5C2E91;
    --ms-teal: #00BCF2;
    --primary-gradient: linear-gradient(135deg, var(--ms-blue) 0%, var(--ms-teal) 100%);
}

/* 顶部导航栏样式 */
.layui-header {
    background: white !important;
    border-bottom: 1px solid #e9ecef !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}

/* Logo区域 */
.layui-logo {
    background: white !important;
    color: #323130 !important;
}

.layui-logo .title {
    font-weight: 700 !important;
    color: #323130 !important;
    font-size: 18px !important;
}

/* 顶部导航菜单 */
.layui-nav {
    background: white !important;
}

.layui-nav .layui-nav-item a {
    color: #323130 !important;
    transition: all 0.3s ease !important;
}

.layui-nav .layui-nav-item a:hover {
    color: var(--ms-blue) !important;
    background-color: #f3f2f1 !important;
}

.layui-nav .layui-this a {
    color: var(--ms-blue) !important;
}

/* 左侧边栏整体样式 - 强制覆盖所有背景 */
.layui-side,
.layui-side.layui-bg-black,
.layui-nav-tree {
    background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%) !important;
    border-right: 1px solid #e9ecef !important;
}

/* 导航树基础样式覆盖 */
.layui-nav-tree,
.pear-nav-tree {
    background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%) !important;
    color: #323130 !important;
}

/* 所有导航项默认样式 */
.layui-nav-tree .layui-nav-item,
.pear-nav-tree .layui-nav-item {
    background-color: transparent !important;
}

.layui-nav-tree .layui-nav-item a,
.pear-nav-tree .layui-nav-item a {
    color: #323130 !important;
    background-color: transparent !important;
}

/* 左侧Logo区域 */
.layui-side .layui-logo {
    background: white !important;
    border-bottom: 1px solid #e9ecef !important;
}

/* 侧边栏菜单项 - 强制覆盖所有样式 */
.pear-nav-tree .layui-nav-item a,
.layui-nav-tree .layui-nav-item a,
.layui-side .layui-nav-item a {
    color: #323130 !important;
    background-color: transparent !important;
    transition: all 0.3s ease !important;
    border-radius: 8px !important;
    margin: 2px 8px !important;
    position: relative;
}

.pear-nav-tree .layui-nav-item a:hover,
.layui-nav-tree .layui-nav-item a:hover,
.layui-side .layui-nav-item a:hover {
    background-color: #f3f2f1 !important;
    color: var(--ms-blue) !important;
    transform: translateX(4px) !important;
}

/* 菜单项文字和图标 */
.pear-nav-tree .layui-nav-item a span,
.layui-nav-tree .layui-nav-item a span,
.pear-nav-tree .layui-nav-item a i,
.layui-nav-tree .layui-nav-item a i {
    color: inherit !important;
}

/* 活动菜单项 */
.pear-nav-tree .layui-this,
.pear-nav-tree .layui-this a {
    background: var(--primary-gradient) !important;
    color: white !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0,120,212,0.3) !important;
}

.pear-nav-tree .layui-this a:hover {
    background: var(--primary-gradient) !important;
    transform: translateX(4px) !important;
}

/* 子菜单样式 */
.pear-nav-tree .layui-nav-child {
    background: white !important;
    border: 1px solid #e9ecef !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

.pear-nav-tree .layui-nav-child dd a {
    color: #323130 !important;
    border-radius: 6px !important;
    margin: 1px 4px !important;
}

.pear-nav-tree .layui-nav-child dd a:hover {
    background-color: #f3f2f1 !important;
    color: var(--ms-blue) !important;
}

.pear-nav-tree .layui-nav-child dd.layui-this a {
    background: var(--primary-gradient) !important;
    color: white !important;
}

/* 页面内容区域 */
.layui-body {
    background-color: #f8f9fa !important;
}

/* 页脚样式 */
.layui-footer {
    background: white !important;
    border-top: 1px solid #e9ecef !important;
    color: #6c757d !important;
}

/* 按钮样式调整 */
.layui-btn-normal {
    background: var(--primary-gradient) !important;
    border: none !important;
}

.layui-btn-normal:hover {
    background: var(--ms-blue) !important;
    box-shadow: 0 4px 12px rgba(0,120,212,0.3) !important;
}

.layui-btn-primary {
    border: 2px solid var(--ms-blue) !important;
    color: var(--ms-blue) !important;
}

.layui-btn-primary:hover {
    background: var(--ms-blue) !important;
    color: white !important;
}

/* 表格样式 */
.layui-table {
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

.layui-table thead tr {
    background: linear-gradient(90deg, #f8f9fa 0%, #e9ecef 100%) !important;
}

.layui-table tbody tr:hover {
    background-color: #f8f9fa !important;
}

/* 表单样式 */
.layui-form-item {
    margin-bottom: 20px !important;
}

.layui-input, .layui-textarea, .layui-select {
    border: 2px solid #e9ecef !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
}

.layui-input:focus, .layui-textarea:focus {
    border-color: var(--ms-blue) !important;
    box-shadow: 0 0 0 3px rgba(0,120,212,0.1) !important;
}

/* 面板和卡片样式 */
.layui-card {
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    border: 1px solid #e9ecef !important;
}

.layui-card-header {
    background: linear-gradient(90deg, #f8f9fa 0%, #ffffff 100%) !important;
    border-bottom: 1px solid #e9ecef !important;
    font-weight: 600 !important;
    color: #323130 !important;
}

/* Tab标签页样式 */
.layui-tab-title li {
    position: relative;
    border-radius: 6px 6px 0 0 !important;
}

.layui-tab-title .layui-this {
    background: var(--primary-gradient) !important;
    color: white !important;
}

.layui-tab-title .layui-this:after {
    border-bottom-color: white !important;
}

/* 弹出层样式优化 */
.layui-layer {
    border-radius: 8px !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.15) !important;
}

.layui-layer-title {
    background: var(--primary-gradient) !important;
    color: white !important;
    border-radius: 8px 8px 0 0 !important;
}

/* 消息提示样式 */
.layui-layer-msg {
    border-radius: 6px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}

/* 右侧工具栏按钮 */
.layui-layout-right .layui-nav-item a {
    border-radius: 6px !important;
    margin: 0 2px !important;
    transition: all 0.3s ease !important;
}

.layui-layout-right .layui-nav-item a:hover {
    background-color: #f3f2f1 !important;
    color: var(--ms-blue) !important;
}

/* 面包屑导航 */
.layui-breadcrumb a {
    color: #6c757d !important;
    transition: color 0.3s ease !important;
}

.layui-breadcrumb a:hover {
    color: var(--ms-blue) !important;
}

/* 分页样式 */
.layui-laypage a {
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
}

.layui-laypage .layui-laypage-curr .layui-laypage-em {
    background: var(--primary-gradient) !important;
    border-radius: 4px !important;
}

/* 进度条样式 */
.layui-progress-bar {
    background: var(--primary-gradient) !important;
}

/* 时间线样式 */
.layui-timeline-item:before {
    background-color: var(--ms-blue) !important;
}

/* 统计卡片样式 */
.console-card {
    border-radius: 12px !important;
    background: white !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
    border: 1px solid #e9ecef !important;
    transition: all 0.3s ease !important;
}

.console-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.12) !important;
}

/* 图标样式优化 */
.layui-icon {
    transition: all 0.3s ease !important;
}

/* 响应式调整 */
@media (max-width: 768px) {
    .pear-nav-tree a {
        margin: 1px 4px !important;
    }
    
    .layui-card {
        margin: 10px 5px !important;
    }
}

/* 夜间模式兼容 */
@media (prefers-color-scheme: dark) {
    /* 在这里可以添加夜间模式的样式 */
}

/* 动画效果 */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.pear-nav-tree .layui-nav-item {
    animation: slideIn 0.3s ease-out !important;
}

/* 滚动条美化 */
.layui-side-scroll::-webkit-scrollbar {
    width: 6px !important;
}

.layui-side-scroll::-webkit-scrollbar-track {
    background: #f1f1f1 !important;
    border-radius: 3px !important;
}

.layui-side-scroll::-webkit-scrollbar-thumb {
    background: #c1c1c1 !important;
    border-radius: 3px !important;
}

.layui-side-scroll::-webkit-scrollbar-thumb:hover {
    background: var(--ms-blue) !important;
}

/* 强制覆盖所有可能的黑色背景 */
.layui-nav-tree,
.pear-nav-tree,
.layui-side,
.layui-side *,
.layui-nav-tree *,
.pear-nav-tree * {
    background-color: transparent !important;
}

.layui-side,
.layui-nav-tree,
.pear-nav-tree {
    background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%) !important;
}

/* 强制设置所有文字颜色 */
.layui-nav-tree a,
.pear-nav-tree a,
.layui-nav-tree span,
.pear-nav-tree span,
.layui-nav-tree i,
.pear-nav-tree i {
    color: #323130 !important;
}

/* 特别处理 layui-bg-black 类 */
.layui-bg-black {
    background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%) !important;
}

/* 子菜单强制样式 */
.layui-nav-child,
.pear-nav-tree .layui-nav-child {
    background: white !important;
    border: 1px solid #e9ecef !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

.layui-nav-child a,
.pear-nav-tree .layui-nav-child a {
    color: #323130 !important;
    background-color: transparent !important;
}

/* 悬浮菜单强制样式 */
.layui-nav-hover,
.pear-nav-tree .layui-nav-hover {
    background: white !important;
}

.layui-nav-hover:before,
.pear-nav-tree .layui-nav-hover:before {
    background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%) !important;
}