* { box-sizing: border-box; }
html, body, #app { height: 100%; margin: 0; padding: 0; }
body {
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  background: #f0f2f5;
  color: #303133;
}
.layout { height: 100%; }
.aside { background: #1f2d3d; overflow: auto; }
.logo {
  height: 60px; line-height: 60px; text-align: center; color: #fff;
  font-size: 15px; font-weight: bold; letter-spacing: 0; background: #18222c;
  padding: 0 6px; overflow: hidden; white-space: nowrap;
}
.el-menu { border-right: none; }
.header {
  display: flex; align-items: center; justify-content: space-between;
  background: #fff; box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08); padding: 0 20px;
}
.header .title { font-size: 16px; font-weight: 600; }
.header .right { display: flex; align-items: center; gap: 12px; }
/* 顶栏实时时钟 */
.header .clock {
  flex: 1; display: flex; align-items: center; justify-content: center;
  gap: 18px; color: #5a6573; font-size: 14px;
}
.header .clock .clock-date { font-weight: 600; color: #303133; }
.header .clock .clock-lunar { color: #409eff; }
.header .clock .clock-time {
  font-variant-numeric: tabular-nums; font-weight: 700; color: #303133;
  letter-spacing: 1px; min-width: 78px; text-align: center;
}
.main { padding: 16px; overflow: auto; }
.page {
  background: #fff; border-radius: 6px; padding: 16px;
  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
}
.page-head {
  display: flex; align-items: center; justify-content: flex-start;
  margin-bottom: 14px; flex-wrap: wrap; gap: 10px 20px;
}
.page-head h3 { margin: 0; font-size: 17px; }
.toolbar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
/* 主要操作（新增/登记类绿色按钮）排到工具栏最左侧，靠近页面标题，点起来更顺手 */
.toolbar .el-button--success { order: -1; }
.toolbar .el-button--warning { order: -1; }
.stat-card {
  background: #fff; border-radius: 6px; padding: 18px 20px;
  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
}
.stat-card .label { color: #909399; font-size: 13px; }
.stat-card .value { font-size: 24px; font-weight: 700; margin-top: 6px; }
.stat-card .value.warn { color: #e6a23c; }
.stat-card .value.good { color: #67c23a; }
.stat-card .value.primary { color: #409eff; }
.login-wrap {
  height: 100%; display: flex; align-items: center; justify-content: center; position: relative;
  background: url('/static/img/login-bg.png') center center / cover no-repeat;
}
/* 半透明渐变遮罩：保证登录框和文字始终清晰可读 */
.login-wrap::before {
  content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background: linear-gradient(120deg, rgba(9, 27, 56, 0.55) 0%, rgba(16, 52, 96, 0.42) 60%, rgba(12, 32, 64, 0.52) 100%);
}
/* 登录卡片：品牌头 + 表单体 */
.login-box {
  position: relative; z-index: 1; width: 400px; overflow: hidden;
  background: rgba(255, 255, 255, 0.97); border-radius: 14px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.32);
}
.login-brand {
  display: flex; align-items: center; gap: 14px; padding: 24px 30px 22px; color: #fff;
  background: linear-gradient(120deg, #14418f 0%, #1d6fd8 55%, #17a9e0 100%);
}
.login-brand .brand-logo {
  width: 52px; height: 52px; border-radius: 13px; flex: none; font-size: 24px; font-weight: 700;
  background: rgba(255, 255, 255, 0.22); border: 1px solid rgba(255, 255, 255, 0.35);
  display: flex; align-items: center; justify-content: center;
}
.login-brand .brand-name { font-size: 20px; font-weight: 700; letter-spacing: 1px; }
.login-brand .brand-sub { font-size: 13px; opacity: 0.9; margin-top: 4px; letter-spacing: 2px; }
.login-body { padding: 24px 30px 30px; }
.login-title { font-size: 17px; font-weight: 700; color: #1f2d3d; margin-bottom: 18px; }
.login-box .el-form-item { margin-bottom: 20px; }
.login-input .el-input__wrapper { height: 46px; border-radius: 8px; box-shadow: 0 0 0 1px #d8dee9 inset; }
.login-input .el-input__inner { height: 46px; font-size: 15px; }
.login-btn {
  width: 100%; height: 48px; margin-top: 4px; border: none; border-radius: 8px;
  font-size: 17px; font-weight: 700; letter-spacing: 6px;
  background: linear-gradient(120deg, #14418f 0%, #1d6fd8 55%, #17a9e0 100%);
  box-shadow: 0 8px 20px rgba(23, 118, 208, 0.35);
}
.login-btn:hover { opacity: 0.93; }
.captcha-row { display: flex; gap: 10px; width: 100%; }
.captcha-input { flex: 1; min-width: 0; }
.captcha-box {
  width: 122px; height: 46px; flex: none; cursor: pointer; border-radius: 8px;
  overflow: hidden; background: #f4f7fc; box-shadow: 0 0 0 1px #d8dee9 inset;
}
.captcha-box svg { display: block; width: 100%; height: 100%; }
.table-amount { color: #f56c6c; font-weight: 600; }
.text-muted { color: #909399; }
.dialog-items .el-table { margin-bottom: 8px; }
.mb10 { margin-bottom: 10px; }
.mt10 { margin-top: 10px; }
.goods-pick { display: flex; gap: 8px; align-items: center; }

/* 库存预警配置 */
.alert-default {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: #fdf6ec; border: 1px solid #f5dab1; border-radius: 6px;
  padding: 14px 18px; margin-bottom: 14px;
}
.alert-default .label { font-size: 15px; font-weight: 600; color: #8a5a12; }
.alert-default .unit { color: #8a5a12; font-size: 14px; }

/* 关于系统 */
.about-card {
  background: #fff; border-radius: 10px; overflow: hidden;
  box-shadow: 0 2px 12px rgba(0, 21, 41, 0.1);
}
.about-hero {
  display: flex; align-items: center; gap: 16px; padding: 26px 28px; color: #fff;
  background: linear-gradient(120deg, #2b5876 0%, #4e4376 100%);
}
.about-logo {
  width: 64px; height: 64px; border-radius: 12px; flex: none;
  background: rgba(255, 255, 255, 0.22);
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; font-weight: 700; letter-spacing: 1px;
}
.about-name { font-size: 22px; font-weight: 700; }
.about-ver { margin-top: 6px; font-size: 13px; opacity: 0.85; }
.about-body { padding: 26px 28px; }
.about-section + .about-section { margin-top: 24px; border-top: 1px dashed #ebeef5; padding-top: 24px; }
.about-label { font-size: 13px; color: #909399; margin-bottom: 10px; }
.about-text { font-size: 16px; line-height: 2; color: #303133; }
.about-phone { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.about-phone .num { font-size: 28px; font-weight: 700; color: #409eff; letter-spacing: 2px; }
.about-foot { padding: 16px 28px; background: #fafafa; color: #909399; font-size: 13px; text-align: center; }

/* 首页快捷开单大卡片 */
.quick-card {
  display: flex; align-items: center; gap: 18px; cursor: pointer;
  padding: 26px 28px; border-radius: 10px; color: #fff;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.quick-card:hover { transform: translateY(-3px); box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22); }
.quick-card .qc-icon {
  width: 62px; height: 62px; border-radius: 50%; flex: none;
  display: flex; align-items: center; justify-content: center;
  font-size: 26px; font-weight: 700; background: rgba(255, 255, 255, 0.24);
}
.quick-card .qc-title { font-size: 22px; font-weight: 700; letter-spacing: 1px; }
.quick-card .qc-sub { font-size: 13px; opacity: 0.9; margin-top: 6px; }
.quick-card .qc-arrow { margin-left: auto; font-size: 16px; font-weight: 600; opacity: 0.95; }
.quick-in { background: linear-gradient(120deg, #1d976c 0%, #93f9b9 100%); }
.quick-out { background: linear-gradient(120deg, #2b5876 0%, #4e9ff5 100%); }

/* 待办留言板 */
.todo-board {
  background: linear-gradient(135deg, #fff8e8 0%, #ffefd6 100%);
  border: 1px solid #ffd591;
  border-radius: 8px;
  padding: 18px 20px;
  box-shadow: 0 2px 10px rgba(217, 143, 0, 0.12);
}
.todo-board .todo-title {
  font-size: 20px;
  font-weight: 700;
  color: #ad6800;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
.todo-board .todo-title .el-tag { font-size: 13px; }
.todo-board .todo-input .el-input__inner { height: 42px; font-size: 15px; }
.todo-board .el-button { height: 42px; font-size: 15px; padding: 0 22px; }
.todo-board .el-table { font-size: 15px; background: transparent; }
.todo-board .el-table th { background: #ffe7ba !important; color: #874d00; }
.todo-text { font-size: 15px; }
.todo-item.done .todo-text { text-decoration: line-through; color: #c0c4cc; }
.todo-empty { text-align: center; padding: 16px 0; color: #b07d2b; font-size: 14px; }

/* ===== 全局可读性优化：字号放大、对比加强 ===== */
body { font-size: 15px; color: #1f2d3d; }
.text-muted { color: #6b7280; }
.page-head h3 { font-size: 19px; font-weight: 700; color: #1f2d3d; }

/* 侧栏菜单 */
.el-menu-item, .el-sub-menu__title { font-size: 15px; height: 48px; line-height: 48px; }
.el-menu-item { color: #d8dee7; }
.el-menu-item.is-active { color: #fff; font-weight: 600; background: #2f6fd0; }
.el-sub-menu__title { color: #e6ebf2; font-weight: 600; }

/* 表格：字号、行高、表头、单元格对比 */
.el-table, .el-table--small { font-size: 15px; }
.el-table th.el-table__cell {
  background: #eef2f7; color: #1f2d3d; font-weight: 700; font-size: 15px;
}
.el-table td.el-table__cell { padding: 10px 0; color: #1f2d3d; }
.el-table .cell { line-height: 24px; }
.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell { background: #fafbfc; }
.table-amount { color: #e23c3c; font-weight: 700; }

/* 统计卡片 */
.stat-card .label { font-size: 14px; font-weight: 600; color: #58616d; }
.stat-card .value { font-size: 26px; color: #1f2d3d; }

/* 表单与输入 */
.el-form-item__label { font-size: 15px; font-weight: 600; color: #1f2d3d; }
.el-input__inner, .el-textarea__inner, .el-select__placeholder { font-size: 15px; color: #1f2d3d; }
.el-button { font-size: 14px; }
.el-tag { font-size: 13px; }
.el-pagination { font-size: 14px; }
.el-dialog__title { font-size: 18px; font-weight: 700; }
.el-message { font-size: 15px; }
