/* ============================================
   后台管理样式
   ============================================ */
:root {
    --color-primary: #1A4B8C;
    --color-primary-dark: #0F3366;
    --color-primary-light: #E8F0FB;
    --color-accent: #FF6B35;
    --color-success: #1DC981;
    --color-warning: #EFAA17;
    --color-danger: #E8463A;
    --color-info: #3B82F6;
    --color-text: #1F2937;
    --color-text-muted: #6B7280;
    --color-text-light: #9CA3AF;
    --color-bg: #F5F7FA;
    --color-surface: #FFFFFF;
    --color-border: #E5E7EB;
    --color-sidebar: #0F3366;
    --radius: 8px;
    --radius-lg: 12px;
    --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
    --shadow: 0 2px 8px rgba(0,0,0,.08);
    --font-sans: "PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:var(--font-sans); color:var(--color-text); background:var(--color-bg); font-size:14px; line-height:1.6; }
a { color:var(--color-primary); text-decoration:none; }

/* 登录页 */
.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#0F3366 0%,#1A4B8C 100%); }
.login-card { background:#fff; border-radius:var(--radius-lg); box-shadow:0 8px 32px rgba(0,0,0,.2); padding:40px; width:400px; max-width:90vw; }
.login-logo { text-align:center; margin-bottom:24px; }
.login-logo .mark { width:56px; height:56px; background:var(--color-primary); color:#fff; font-size:28px; font-weight:700; border-radius:var(--radius); display:inline-flex; align-items:center; justify-content:center; }
.login-logo h1 { font-size:20px; color:var(--color-primary); margin-top:12px; }
.login-logo p { font-size:13px; color:var(--color-text-muted); margin-top:4px; }
.form-group { margin-bottom:16px; }
.form-label { display:block; margin-bottom:6px; font-weight:500; }
.form-control { width:100%; padding:10px 14px; border:1px solid #D1D5DB; border-radius:var(--radius); font-size:14px; font-family:inherit; }
.form-control:focus { outline:none; border-color:var(--color-primary); box-shadow:0 0 0 3px rgba(26,75,140,.1); }
.btn { display:inline-block; padding:8px 20px; border:none; border-radius:var(--radius); font-size:14px; font-weight:500; cursor:pointer; font-family:inherit; transition:all .2s; }
.btn-primary { background:var(--color-primary); color:#fff; }
.btn-primary:hover { background:var(--color-primary-dark); }
.btn-success { background:var(--color-success); color:#fff; }
.btn-danger { background:var(--color-danger); color:#fff; }
.btn-warning { background:var(--color-warning); color:#fff; }
.btn-outline { background:transparent; border:1px solid #D1D5DB; color:var(--color-text); }
.btn-outline:hover { background:#F5F7FA; }
.btn-sm { padding:4px 12px; font-size:13px; }
.btn-block { width:100%; }
.btn-lg { padding:12px 32px; font-size:15px; }

/* 后台布局 */
.admin-layout { display:flex; min-height:100vh; }
.sidebar { width:220px; background:var(--color-sidebar); color:rgba(255,255,255,.85); flex-shrink:0; position:fixed; top:0; bottom:0; left:0; overflow-y:auto; }
.sidebar-header { padding:20px; text-align:center; border-bottom:1px solid rgba(255,255,255,.1); }
.sidebar-header .mark { width:40px; height:40px; background:#fff; color:var(--color-primary); border-radius:var(--radius); font-size:20px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.sidebar-header h2 { font-size:15px; color:#fff; margin-top:8px; }
.sidebar-nav { padding:12px 0; }
.sidebar-nav a { display:block; padding:10px 20px; color:rgba(255,255,255,.75); font-size:14px; transition:all .2s; }
.sidebar-nav a:hover { background:rgba(255,255,255,.08); color:#fff; }
.sidebar-nav a.active { background:var(--color-primary); color:#fff; border-left:3px solid var(--color-accent); }
.sidebar-nav .nav-section { padding:12px 20px 4px; font-size:11px; color:rgba(255,255,255,.4); text-transform:uppercase; }

.main-area { flex:1; margin-left:220px; }
.topbar { background:#fff; padding:12px 24px; box-shadow:var(--shadow-sm); display:flex; justify-content:space-between; align-items:center; position:sticky; top:0; z-index:50; }
.topbar h1 { font-size:18px; color:var(--color-text); }
.topbar-user { display:flex; align-items:center; gap:12px; font-size:14px; }
.topbar-user .role-badge { padding:2px 8px; border-radius:4px; font-size:12px; }
.role-super_admin { background:rgba(255,107,53,.15); color:#E55A2B; }
.role-admin { background:rgba(26,75,140,.15); color:#1A4B8C; }
.role-translator { background:rgba(59,130,246,.15); color:#1D4ED8; }
.content { padding:24px; }

/* 统计卡片 */
.stat-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-bottom:24px; }
.stat-card { background:#fff; border-radius:var(--radius-lg); padding:20px; box-shadow:var(--shadow); }
.stat-card .label { font-size:13px; color:var(--color-text-muted); }
.stat-card .value { font-size:28px; font-weight:700; color:var(--color-primary); margin-top:4px; }
.stat-card.success .value { color:var(--color-success); }
.stat-card.accent .value { color:var(--color-accent); }

/* 面板 */
.panel { background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow); margin-bottom:24px; overflow:hidden; }
.panel-header { padding:16px 20px; border-bottom:1px solid var(--color-border); display:flex; justify-content:space-between; align-items:center; }
.panel-header h2 { font-size:16px; color:var(--color-text); }
.panel-body { padding:20px; }

/* 表格 */
table { width:100%; border-collapse:collapse; }
th { background:var(--color-bg); padding:10px 12px; text-align:left; font-size:13px; color:var(--color-text-muted); font-weight:500; border-bottom:1px solid var(--color-border); }
td { padding:10px 12px; border-bottom:1px solid var(--color-border); font-size:14px; vertical-align:top; }
tr:hover { background:var(--color-bg); }
.badge { display:inline-block; padding:2px 8px; border-radius:4px; font-size:12px; font-weight:500; }
.badge-pending { background:rgba(239,170,23,.15); color:#B45309; }
.badge-translating,.badge-reviewing { background:rgba(59,130,246,.15); color:#1D4ED8; }
.badge-approved { background:rgba(34,197,94,.15); color:#15803D; }
.badge-processing { background:rgba(111,111,255,.15); color:#4B3FE3; }
.badge-completed { background:rgba(29,201,129,.15); color:#059669; }
.badge-rejected { background:rgba(232,70,58,.15); color:#B91C1C; }

/* 详情弹窗 */
.detail-modal { position:fixed; inset:0; background:rgba(0,0,0,.5); display:none; align-items:center; justify-content:center; z-index:1000; padding:20px; }
.detail-modal.show { display:flex; }
.detail-content { background:#fff; border-radius:var(--radius-lg); max-width:800px; width:100%; max-height:90vh; overflow-y:auto; }
.detail-header { padding:16px 24px; border-bottom:1px solid var(--color-border); display:flex; justify-content:space-between; align-items:center; }
.detail-body { padding:24px; }
.detail-close { background:none; border:none; font-size:24px; cursor:pointer; color:var(--color-text-muted); }

img.thumb { width:60px; height:60px; object-fit:cover; border-radius:4px; }
img.large { width:100%; max-height:400px; object-fit:contain; border-radius:var(--radius); }

textarea.form-control { min-height:80px; resize:vertical; }

@media (max-width:768px) {
    .sidebar { width:60px; }
    .sidebar-header h2,.sidebar-nav a span,.sidebar-nav .nav-section { display:none; }
    .main-area { margin-left:60px; }
    .stat-cards { grid-template-columns:repeat(2,1fr); }
}
