/* 基础重置 */
[v-cloak] { display: none; }
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif; }

/* 登录页样式 */
.login-container {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0c2340 0%, #1a4b8c 40%, #2D78EB 100%);
    position: relative;
    overflow: hidden;
}
.login-container::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 800px;
    height: 800px;
    background: radial-gradient(circle, rgba(93,163,245,0.15) 0%, transparent 70%);
    border-radius: 50%;
}
.login-container::after {
    content: '';
    position: absolute;
    bottom: -30%;
    left: -10%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(45,120,235,0.12) 0%, transparent 70%);
    border-radius: 50%;
}
.login-card {
    width: 440px;
    padding: 48px 44px 36px;
    background: rgba(255,255,255,0.97);
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2), 0 0 0 1px rgba(255,255,255,0.1);
    position: relative;
    z-index: 1;
    backdrop-filter: blur(10px);
}
.login-card .login-logo {
    text-align: center;
    margin-bottom: 8px;
}
.login-card .login-logo .logo-icon {
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, #2D78EB, #5ba3f5);
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 28px;
    font-weight: bold;
    box-shadow: 0 4px 16px rgba(45,120,235,0.35);
}
.login-card h2 {
    text-align: center;
    margin-bottom: 4px;
    color: #1a2332;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 1px;
}
.login-card .login-sub {
    text-align: center;
    color: #8c96a6;
    font-size: 13px;
    margin-bottom: 36px;
}
.login-card .el-form-item {
    margin-bottom: 22px;
}
.login-card .el-input__wrapper {
    border-radius: 8px;
    padding: 4px 12px;
    box-shadow: 0 0 0 1px #dcdfe6 inset;
    transition: all 0.25s;
}
.login-card .el-input__wrapper:hover {
    box-shadow: 0 0 0 1px #b0cfff inset;
}
.login-card .el-input__wrapper.is-focus {
    box-shadow: 0 0 0 1px #2D78EB inset, 0 0 0 3px rgba(45,120,235,0.12);
}
.login-card .login-btn {
    width: 100%;
    height: 44px;
    font-size: 16px;
    letter-spacing: 4px;
    border-radius: 8px;
    background: linear-gradient(135deg, #2D78EB, #4a90e2);
    border: none;
    box-shadow: 0 4px 12px rgba(45,120,235,0.35);
    transition: all 0.3s;
}
.login-card .login-btn:hover {
    background: linear-gradient(135deg, #1a6ad8, #3a80d5);
    box-shadow: 0 6px 20px rgba(45,120,235,0.45);
    transform: translateY(-1px);
}
.login-card .login-btn:active {
    transform: translateY(0);
}
.login-card .login-footer {
    text-align: center;
    color: #b0b8c4;
    font-size: 12px;
    margin-top: 24px;
}

/* 统一后台布局 */
.app-layout { display: flex; height: 100vh; }
.app-sidebar {
    width: 220px;
    background: #1e3a5f;
    overflow-y: auto;
    flex-shrink: 0;
    transition: width 0.3s;
    display: flex;
    flex-direction: column;
}
.app-sidebar.collapsed { width: 64px; }
.app-sidebar .sidebar-logo {
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    flex-shrink: 0;
    white-space: nowrap;
    overflow: hidden;
}
.app-sidebar .el-menu { border-right: none; }
.app-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #f0f2f5;
}
.app-header {
    height: 56px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #e4e7ed;
    flex-shrink: 0;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.app-header-left { display: flex; align-items: center; gap: 12px; }
.app-header-right { display: flex; align-items: center; gap: 16px; }
.app-content {
    flex: 1;
    overflow: auto;
    padding: 20px;
}

/* 页面通用样式 */
.page-container {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
}
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.page-header h3 { margin: 0; color: #303133; font-size: 18px; }

/* 统计卡片 */
.stat-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}
.stat-card {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    transition: transform 0.2s;
}
.stat-card:hover { transform: translateY(-2px); }
.stat-card .icon-box {
    width: 52px; height: 52px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 22px; color: #fff;
}
.stat-card .info .label { color: #909399; font-size: 13px; }
.stat-card .info .value { font-size: 26px; font-weight: 600; color: #303133; }

/* 搜索栏 */
.search-bar {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
    flex-wrap: wrap;
    align-items: center;
}

/* 空状态 */
.empty-state {
    text-align: center;
    padding: 60px 20px;
    color: #909399;
}

/* 消息徽标 */
.msg-badge { margin-right: 8px; }

/* 流程节点可视化 */
.wf-node-card {
    width: 360px; border-radius: 8px; overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1); transition: all 0.2s;
    background: #fff; border: 1px solid #e4e7ed;
}
.wf-node-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.15); transform: translateY(-1px); }
.wf-node-header {
    padding: 8px 16px; color: #fff; font-size: 14px; font-weight: 500;
    display: flex; align-items: center;
}
.wf-node-body {
    padding: 10px 16px; display: flex; align-items: center; flex-wrap: wrap; gap: 4px;
}
.wf-node-actions {
    position: absolute; top: 4px; right: 4px; display: flex; gap: 2px; opacity: 0; transition: opacity 0.2s;
}
.wf-node-card:hover .wf-node-actions { opacity: 1; }
.wf-connector { display: flex; flex-direction: column; align-items: center; }
.wf-connector-line { width: 2px; height: 16px; background: #c0c4cc; }
.wf-connector-arrow { color: #c0c4cc; font-size: 14px; }
.wf-node-start .wf-node-header { background: #67c23a !important; }
.wf-node-end .wf-node-header { background: #909399 !important; }
.wf-node-approver .wf-node-header { background: #409eff !important; }
.wf-node-cc .wf-node-header { background: #e6a23c !important; }
.wf-node-condition .wf-node-header { background: #f56c6c !important; }
.wf-node-condition { border: 2px dashed #f56c6c; }

/* 子菜单文字垂直居中 */
.app-sidebar .el-sub-menu__title { display: flex; align-items: center; }
.app-sidebar .el-sub-menu .el-menu-item { display: flex; align-items: center; padding-left: 52px !important; min-height: 44px; }
.app-sidebar .el-menu-item { display: flex; align-items: center; }

/* ===== 以下为从 components.css 合并的有用样式 ===== */

/* 全局覆盖：表单项内容宽度 */
.el-form-item .el-form-item__content > div { width: 100%; }

/* 全局覆盖：下拉弹窗隐藏修复 */
.el-dropdown__popper[aria-hidden="true"] { display: none !important; pointer-events: none !important; }

/* 全局覆盖：表格单元格定位修复 */
.el-table .el-table__cell { position: static !important; }

/* 全局滚动条样式 */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f5f5f5; }
::-webkit-scrollbar-thumb { background: #aaa; border-radius: 4px; }
::-webkit-scrollbar-corner { display: none; }
@supports (-moz-appearance:none) {
    ::-moz-scrollbar { width: 8px; }
    ::-moz-scrollbar-track { background: #f5f5f5; }
    ::-moz-scrollbar-thumb { background: #aaa; border-radius: 4px; }
}

/* 附件样式（documentDetail） */
.attachment-item {
    display: block; padding: 8px; margin-top: 10px;
    background-color: #f5f7fa; border-radius: 4px;
    transition: background-color .3s; width: 100%; box-sizing: border-box;
}
.attachment-item .delete-icon { float: right; cursor: pointer; }
.file-name2 {
    display: inline-block; max-width: calc(100% - 30px);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.attachment-item::after { content: ""; display: table; clear: both; }

/* 审批记录卡片（approvalDetail, documentDetail） */
.record-card {
    background: #f8f9fa; border-radius: 6px; padding: 16px;
    margin: 8px 0; transition: all 0.3s; border-left: 4px solid;
}
.record-card.approved { border-color: #67C23A; background: linear-gradient(to right, #f0f9eb 10%, #f8f9fa 100%); }
.record-card.rejected { border-color: #F56C6C; background: linear-gradient(to right, #fef0f0 10%, #f8f9fa 100%); }
.record-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.status-wrapper { display: flex; align-items: center; gap: 15px; }
.approver-name { color: #606266; font-size: 14px; }
.approver-name i { margin-right: 5px; color: #909399; }

/* 评论样式（documentDetail） */
.comment { font-size: 14px; color: #666; margin-top: 5px; }

/* 全屏模式适配（Layout.js 使用 admin-layout 类名） */
:fullscreen .aside-menu,
:fullscreen .el-header { display: none !important; }
:fullscreen .main-content,
:fullscreen .main-content > div { height: 100vh !important; overflow: auto !important; background: transparent !important; padding: 0 !important; border-radius: 0 !important; }
:fullscreen .el-aside { display: none !important; }
:fullscreen .admin-layout .el-container { margin-left: 0 !important; }
:fullscreen .el-watermark { display: none !important; }
