/* ============================================
   钰双源服饰官网 - 后台管理系统旗舰版样式
   优化：深蓝主色+品牌绿高亮、分层阴影、精致圆角、交互动效升级
   ============================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root {
  --primary-dark: #052350;
  --primary-blue: #1E3A5F;
  --primary-light-blue: #2A4D7C;
  --brand-green: #28a760;
  --brand-green-dark: #2F855A;
  --text-main: #1d2939;
  --text-normal: #333333;
  --text-secondary: #667085;
  --text-light: #98A2B3;
  --bg-page: #F5F7FB;
  --bg-card: #ffffff;
  --bg-input: #F5F7FA;
  --border-base: #E4E7EC;
  --border-light: #EAF0F7;
  --danger-red: #E53E3E;
  --danger-red-dark: #C53030;
  --shadow-sm: 0 1px 4px rgba(5,35,80,0.04);
  --shadow-card: 0 2px 14px rgba(5, 35, 80, 0.08);
  --shadow-modal: 0 20px 60px rgba(0,0,0,.15);
  --radius-sm: 6px;
  --radius-base: 8px;
  --radius-lg: 12px;
  --transition-base: all 0.24s ease;
}
body{font-family:"Microsoft YaHei","PingFang SC",sans-serif;font-size:14px;color:var(--text-normal);background:var(--bg-page)}
a{text-decoration:none;color:inherit}
img{max-width:100%}
ul{list-style:none}
button{cursor:pointer;border:none;font-family:inherit;transition:var(--transition-base)}

/* Login Page */
.login-page{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,var(--primary-blue) 0%,var(--primary-light-blue) 100%)}
.login-box{background:var(--bg-card);border-radius:var(--radius-lg);padding:48px 40px;width:420px;max-width:95%;box-shadow:var(--shadow-modal)}
.login-box .login-logo{text-align:center;margin-bottom:32px}
.login-box .login-logo img{height:60px;width:auto;max-width:280px;max-height:72px;object-fit:contain;margin:0 auto 12px}
.login-box .login-logo h1{font-size:20px;color:var(--primary-blue);font-weight:600}
.login-box .form-group{margin-bottom:20px}
.login-box .form-group label{display:block;font-size:14px;color:#475467;margin-bottom:6px;font-weight:500}
.login-box .form-group input{width:100%;padding:12px 16px;border:1px solid var(--border-base);border-radius:var(--radius-sm);font-size:15px;transition:var(--transition-base);background:var(--bg-input)}
.login-box .form-group input:focus{border-color:var(--primary-blue);outline:none;background:#fff}
.login-box .login-btn{width:100%;padding:14px;background:var(--primary-blue);color:#fff;font-size:16px;font-weight:500;border-radius:var(--radius-sm);transition:var(--transition-base)}
.login-box .login-btn:hover{background:var(--primary-light-blue)}
.login-box .login-error{color:var(--danger-red);font-size:13px;margin-top:12px;text-align:center;display:none}

/* Dashboard Layout 旗舰侧边栏升级 */
.admin-layout{display:flex;height:100vh;overflow:hidden}
.admin-sidebar{width:240px;background:var(--primary-dark);color:#fff;flex-shrink:0;display:flex;flex-direction:column;box-shadow:2px 0 10px rgba(0,0,0,0.06);z-index:10}
.sidebar-header{padding:24px 20px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;gap:12px}
.sidebar-header img{height:36px;width:auto;max-width:120px;max-height:44px;background:#fff;border-radius:4px;padding:4px;object-fit:contain}
.sidebar-header span{font-size:16px;font-weight:600;letter-spacing:0.5px}
.sidebar-menu{flex:1;padding:12px 8px;overflow-y:auto}
.sidebar-menu a{display:flex;align-items:center;gap:10px;padding:12px 14px;color:rgba(255,255,255,.7);font-size:14px;transition:var(--transition-base);border-radius:var(--radius-base);margin-bottom:6px;position:relative}
.sidebar-menu a .icon{font-size:18px;width:20px;text-align:center}
.sidebar-menu a:hover{color:#fff;background:rgba(255,255,255,.08)}
.sidebar-menu a.active{color:#fff;background:rgba(40, 167, 96, 0.15)}
.sidebar-menu a.active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:4px;background:var(--brand-green);border-radius:0 4px 4px 0}
.sidebar-footer{padding:16px 20px;border-top:1px solid rgba(255,255,255,.1)}
.sidebar-footer button{width:100%;padding:10px;background:rgba(255,255,255,.1);color:#fff;border-radius:var(--radius-sm);font-size:14px}
.sidebar-footer button:hover{background:var(--danger-red)}

.admin-main{flex:1;display:flex;flex-direction:column;overflow:hidden}
.admin-topbar{background:var(--bg-card);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow-sm)}
.admin-topbar .topbar-left{display:flex;align-items:center;gap:12px;min-width:0}
.admin-topbar h2{font-size:18px;color:var(--primary-dark);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.menu-toggle{display:none;align-items:center;justify-content:center;width:38px;height:38px;flex-shrink:0;border-radius:var(--radius-sm);background:var(--bg-input);color:var(--primary-dark);font-size:20px;line-height:1}
.menu-toggle:hover{background:var(--border-light)}
.admin-topbar .topbar-right{display:flex;align-items:center;gap:16px;font-size:14px;color:var(--text-secondary)}
.admin-content{padding:24px 32px;flex:1;overflow-y:auto;min-height:0}
/* 加载占位（合并自 dashboard 原内联样式） */
.loading-box{min-height:220px;display:flex;align-items:center;justify-content:center;background:var(--bg-card);border-radius:var(--radius-base);box-shadow:var(--shadow-card);font-size:15px;color:var(--text-secondary)}

/* Panel / Card 卡片质感升级 */
.panel{background:var(--bg-card);border-radius:var(--radius-base);box-shadow:var(--shadow-card);margin-bottom:24px}
.panel-header{padding:20px 24px;border-bottom:1px solid var(--border-light);display:flex;align-items:center;justify-content:space-between}
.panel-header h3{font-size:16px;color:var(--primary-dark);font-weight:600}
.panel-body{padding:24px}
.panel-footer{padding:16px 24px;border-top:1px solid var(--border-light);display:flex;justify-content:flex-end;gap:12px}

/* Buttons 品牌色系统一 */
.btn{padding:8px 20px;font-size:14px;border-radius:var(--radius-sm);transition:var(--transition-base);display:inline-flex;align-items:center;gap:6px}
.btn-primary{background:var(--primary-blue);color:#fff}
.btn-primary:hover{background:var(--primary-light-blue)}
.btn-success{background:var(--brand-green);color:#fff}
.btn-success:hover{background:var(--brand-green-dark)}
.btn-danger{background:var(--danger-red);color:#fff}
.btn-danger:hover{background:var(--danger-red-dark)}
.btn-outline{border:1px solid var(--border-base);color:#475467;background:#fff}
.btn-outline:hover{border-color:var(--primary-blue);color:var(--primary-blue)}
.btn-sm{padding:5px 12px;font-size:12px}
.btn-lg{padding:12px 28px;font-size:16px}

/* Forms */
.form-row{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-bottom:20px}
.form-group{margin-bottom:20px}
.form-group label{display:block;font-size:14px;color:#475467;margin-bottom:6px;font-weight:500}
.form-group input,.form-group textarea,.form-group select{width:100%;padding:10px 14px;border:1px solid var(--border-base);border-radius:var(--radius-sm);font-size:14px;color:var(--text-normal);transition:var(--transition-base);background:var(--bg-input)}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--primary-blue);background:#fff;outline:none}
.form-group textarea{height:120px;resize:vertical}
.form-group .help-text{font-size:12px;color:var(--text-secondary);margin-top:4px}

/* Tables */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
table th,table td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--border-light);font-size:14px}
table th{background:var(--bg-input);color:#475467;font-weight:600;white-space:nowrap}
table td{color:var(--text-normal);word-break:break-word;overflow-wrap:anywhere}
table tbody tr:hover{background:var(--bg-input)}
table .img-thumb{width:60px;height:40px;border-radius:var(--radius-sm);object-fit:cover;background:var(--border-light)}

/* Tags */
.tag{padding:2px 10px;border-radius:20px;font-size:12px;display:inline-block}
.tag-blue{background:#EAF0F7;color:var(--primary-blue)}
.tag-green{background:#C6F6D5;color:#22543D}
.tag-red{background:#FED7D7;color:#9B2C2C}

/* Modal */
.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:2000;display:flex;align-items:flex-start;justify-content:center;padding:60px 20px;overflow-y:auto}
.modal{background:var(--bg-card);border-radius:var(--radius-lg);width:720px;max-width:100%;box-shadow:var(--shadow-modal)}
.modal-header{padding:20px 24px;border-bottom:1px solid var(--border-light);display:flex;align-items:center;justify-content:space-between}
.modal-header h3{font-size:18px;color:var(--primary-dark);font-weight:600}
.modal-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:18px;color:var(--text-secondary);transition:var(--transition-base);background:none}
.modal-close:hover{background:var(--bg-input);color:var(--text-main)}
.modal-body{padding:24px;max-height:60vh;overflow-y:auto}
.modal-footer{padding:16px 24px;border-top:1px solid var(--border-light);display:flex;justify-content:flex-end;gap:12px}

/* Upload */
.upload-zone{border:2px dashed var(--border-base);border-radius:var(--radius-base);padding:30px;text-align:center;cursor:pointer;transition:var(--transition-base);background:var(--bg-input)}
.upload-zone:hover{border-color:var(--primary-blue);background:#EAF0F7}
.upload-zone .upload-icon{font-size:36px;color:var(--text-secondary);margin-bottom:8px}
.upload-zone p{font-size:14px;color:var(--text-secondary)}
.upload-preview{display:flex;gap:12px;flex-wrap:wrap;margin-top:12px}
.upload-preview .preview-item{position:relative;width:100px;height:100px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border-base)}
.upload-preview .preview-item img{width:100%;height:100%;object-fit:cover}
.upload-preview .preview-item .remove-btn{position:absolute;top:4px;right:4px;width:20px;height:20px;background:rgba(0,0,0,.5);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;cursor:pointer}

/* Rich Text Editor 富文本编辑器（企业内容七栏目：大段文本/图文混排，高度自适应） */
.rte-wrap{border:1px solid var(--border-base);border-radius:var(--radius-sm);overflow:hidden}
/* 标签多选 chips（产品表单） */
.chip-row{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:4px 12px;border:1px solid var(--border-base);border-radius:14px;cursor:pointer;font-size:13px;color:var(--text-sub);background:#fff;user-select:none}
.chip.on{background:var(--primary-dark,#123c6b);border-color:var(--primary-dark,#123c6b);color:#fff}
/* 行拖拽排序视觉反馈（合作伙伴/轮播图） */
#pt-tbody tr[draggable="true"],#bn-tbody tr[draggable="true"]{cursor:grab}
#pt-tbody tr.dragging,#bn-tbody tr.dragging{opacity:.45}
#pt-tbody tr.drag-over,#bn-tbody tr.drag-over{outline:2px dashed var(--primary-dark,#123c6b);outline-offset:-2px}
/* 产品分类树形拖拽视觉反馈：上/下边缘=同级前/后插入，整行虚线=成为子分类 */
#pc-tbody tr[draggable="true"]{cursor:grab}
#pc-tbody tr.dragging{opacity:.45}
#pc-tbody tr.drop-before{box-shadow:inset 0 3px 0 var(--primary-dark,#123c6b)}
#pc-tbody tr.drop-after{box-shadow:inset 0 -3px 0 var(--primary-dark,#123c6b)}
#pc-tbody tr.drop-child{outline:2px dashed var(--primary-dark,#123c6b);outline-offset:-2px}
.rte-toolbar{display:flex;flex-wrap:wrap;gap:4px;padding:8px;background:var(--bg-input);border-bottom:1px solid var(--border-base)}
.rte-toolbar button{min-width:32px;padding:4px 10px;font-size:13px;border:1px solid var(--border-base);background:#fff;border-radius:4px;cursor:pointer;color:var(--text-normal);transition:var(--transition-base)}
.rte-toolbar button:hover{border-color:var(--primary-blue);color:var(--primary-blue)}
.rte-body{min-height:300px;max-height:1200px;padding:14px 16px;font-size:14px;line-height:1.8;color:var(--text-normal);background:#fff;outline:none;overflow-y:auto}
.rte-body img{max-width:100%;height:auto;border-radius:4px;margin:8px 0}
.rte-body h3{margin:12px 0 6px;font-size:16px;font-weight:600}
.rte-body blockquote{margin:8px 0;padding:8px 14px;border-left:3px solid var(--primary-blue);background:var(--bg-input);color:var(--text-secondary)}
.rte-body ul,.rte-body ol{padding-left:22px;margin-bottom:8px}

/* Stats 数据统计卡片旗舰优化 */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:24px}
.stat-card{background:var(--bg-card);border-radius:var(--radius-base);padding:24px;box-shadow:var(--shadow-card);transition:var(--transition-base)}
.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 18px rgba(5,35,80,0.1)}
.stat-card .stat-value{font-size:28px;font-weight:700;color:var(--primary-dark);margin-bottom:4px}
.stat-card .stat-label{font-size:14px;color:var(--text-secondary)}

/* Tabs */
.admin-tabs{display:flex;gap:0;margin-bottom:24px;border-bottom:2px solid var(--border-light)}
.admin-tab{padding:12px 24px;font-size:14px;color:var(--text-secondary);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:var(--transition-base)}
.admin-tab:hover{color:var(--primary-blue)}
.admin-tab.active{color:var(--primary-blue);border-bottom-color:var(--primary-blue);font-weight:600}

/* Alert */
.alert{padding:12px 20px;border-radius:var(--radius-sm);margin-bottom:16px;font-size:14px}
.alert-success{background:#C6F6D5;color:#22543D}
.alert-error{background:#FED7D7;color:#9B2C2C}
.alert-info{background:#BEE3F8;color:#2A4365}
.alert-warn{background:#FEF0C7;color:#92400E}

/* Empty State */
.empty-state{text-align:center;padding:60px 20px;color:var(--text-secondary)}
.empty-state .icon{font-size:48px;margin-bottom:12px;opacity:.5}

/* Dashboard */
.dashboard-grid{display:grid;grid-template-columns:2fr 1fr;gap:24px}

/* 未读消息角标 */
.nav-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin-left:6px;border-radius:9px;background:#ff4d4f;color:#fff;font-size:12px}

/* 筛选栏、留言表格、分页 */
.filter-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.filter-bar input[type="date"]{padding:6px 10px;border:1px solid var(--border-base);border-radius:var(--radius-sm);font-size:13px;color:var(--text-normal);background:var(--bg-input)}
.filter-hint{font-size:12px;color:var(--text-light);margin-left:auto}
.row-unread{background:#FFF7F7}
.row-unread td{font-weight:500}
.td-msg{max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pager{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:16px;font-size:13px;color:var(--text-secondary)}
.pager .btn:disabled{opacity:.5;cursor:not-allowed}

/* ============ 素材资源库（文件夹树 + 图文管理双栏 + 网格/列表双视图 + 上传进度） ============ */
.mat-layout{display:grid;grid-template-columns:280px 1fr;gap:16px;align-items:start}
.mat-side,.mat-main{border:1px solid var(--border-base);border-radius:var(--radius-sm);background:var(--bg-input);overflow:hidden}
.mat-side-header{display:flex;align-items:center;gap:8px;padding:12px 14px;font-weight:600;font-size:14px;color:var(--text-normal);background:var(--bg-card);border-bottom:1px solid var(--border-base)}
.mat-side-header .filter-hint{font-weight:400}
.mat-side-body{max-height:640px;overflow-y:auto;padding:8px 0}
.mat-main-body{padding:14px}
.mat-folder{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:8px 10px;cursor:pointer;border-left:3px solid transparent;user-select:none}
.mat-folder:hover{background:rgba(37,99,235,.06)}
.mat-folder.active{background:rgba(37,99,235,.1);border-left-color:var(--primary,#2563EB)}
.mat-folder.disabled .mat-folder-name{color:var(--text-light);text-decoration:line-through}
.mat-folder-name{font-size:13px;color:var(--text-normal);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mat-folder-name em{font-style:normal;color:var(--text-light);font-size:12px}
.mat-folder-ops{display:none;flex-shrink:0;gap:4px}
.mat-folder:hover .mat-folder-ops{display:inline-flex}
.mat-folder-ops .btn{padding:2px 6px;font-size:11px}
.mat-folder.drop-hint{background:rgba(37,99,235,.16);outline:2px dashed var(--primary,#2563EB)}
.mat-stats-bar{display:flex;gap:18px;align-items:center;padding:10px 14px;margin-bottom:12px;background:rgba(37,99,235,.06);border:1px solid rgba(37,99,235,.18);border-radius:var(--radius-sm);font-size:13px;color:var(--text-normal)}
.mat-stats-bar strong{color:var(--primary,#2563EB);font-size:15px}
.mat-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;align-items:center}
.mat-tags i{font-style:normal;font-size:11px;padding:1px 6px;border-radius:8px;background:rgba(37,99,235,.1);color:var(--primary,#2563EB)}
.mat-card[draggable="true"],#mat-tbody tr[draggable="true"]{cursor:grab}
.mat-card[draggable="true"]:active,#mat-tbody tr[draggable="true"]:active{cursor:grabbing}
.mat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.mat-card{position:relative;border:1px solid var(--border-base);border-radius:var(--radius-sm);background:var(--bg-card);overflow:hidden;transition:box-shadow .15s}
.mat-card:hover{box-shadow:0 4px 14px rgba(16,24,40,.1)}
.mat-card>img{width:100%;height:140px;object-fit:cover;display:block;cursor:zoom-in;background:#F2F4F7}
.mat-card-body{padding:10px 12px}
.mat-check{position:absolute;top:8px;left:8px;z-index:2;background:rgba(255,255,255,.92);border-radius:4px;padding:2px 4px;line-height:1;cursor:pointer}
.mat-code{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12px;color:var(--text-normal);word-break:break-all}
.mat-code .btn{flex-shrink:0;padding:2px 8px;font-size:11px}
.mat-meta{margin-top:4px;font-size:12px;color:var(--text-light)}
.mat-ops{display:flex;gap:6px;margin-top:8px}
.mat-progress{display:flex;align-items:center;gap:10px;margin-bottom:12px;height:22px;border-radius:11px;background:#EAF0F7;position:relative;overflow:hidden}
.mat-progress-bar{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#2563EB,#60A5FA);transition:width .2s}
.mat-progress span{position:relative;z-index:1;font-size:12px;color:var(--text-normal);padding-left:12px}
.mat-picker-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));max-height:56vh;overflow-y:auto}
.mat-pick-card{cursor:pointer}
.mat-pick-card>img{height:104px}
.mat-pick-card:hover{border-color:var(--primary,#2563EB)}

/* 移动端侧边栏遮罩 */
.sidebar-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:999}
.sidebar-backdrop.show{display:block}

/* 响应式适配 - 平板 */
@media (max-width:1024px){
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .dashboard-grid{grid-template-columns:1fr}
  .admin-topbar{padding:0 20px}
  .admin-content{padding:20px}
}

/* 响应式适配 - 手机 */
@media (max-width:768px){
  .admin-sidebar{position:fixed;left:-240px;top:0;height:100%;z-index:1000;transition:left .3s}
  .admin-sidebar.open{left:0}
  .menu-toggle{display:flex}
  .form-row{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .dashboard-grid{grid-template-columns:1fr}
  .admin-content{padding:16px}
  .admin-topbar{padding:0 16px}
  .panel-header{flex-wrap:wrap;gap:12px}
  .modal-overlay{padding:24px 12px}
  .modal-body{max-height:62vh}
  .mat-layout{grid-template-columns:1fr}
  .mat-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
}

/* ============ 控制台 Dashboard 增强（v=20260905o：维护横幅/留言行/快捷两级/日志卡/系统信息栏） ============ */
.dash-maint-banner{background:#FEF3F2;color:#B42318;border:1px solid #FDA29B;border-radius:8px;padding:12px 16px;margin-bottom:16px;font-size:14px;display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.btn-light{background:#fff;color:#B42318;border:1px solid #FDA29B}
.btn-light:hover{background:#FFF7F7}
.panel-hint{font-size:12px;color:#98A2B3}
.dash-msg-row{padding:10px 8px;border-bottom:1px solid #EAF0F7;border-radius:6px}
.dash-msg-row.row-unread{background:#FFF7F7;border-left:3px solid #F04438}
.dash-msg-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dash-msg-title{font-size:14px;color:#101828}
.dash-msg-meta{color:#667085;font-size:12px}
.dash-msg-preview{font-size:13px;color:#475467;margin:4px 0 6px}
.quick-group-label{font-size:12px;color:#98A2B3;margin:4px 0 8px}
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.quick-grid .btn{width:100%}
.oplog-line{padding:6px 0;border-bottom:1px dashed #EAF0F7;font-size:13px;color:#475467}
.oplog-time{color:#98A2B3;font-size:12px;margin-right:8px}
.sysinfo-bar{font-size:13px;color:#667085;line-height:2}
.sysinfo-poll{margin-left:12px;color:#98A2B3;font-size:12px}
@media (max-width: 768px){
  .quick-grid{grid-template-columns:1fr}
}