/* 餐饮经营管理平台 - 样式 */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#f0f2f5}

.main-container{height:100vh}

/* 侧边栏 */
.sidebar{background:linear-gradient(180deg,#2d5016 0%,#1a3a0a 100%);overflow-y:auto;border-right:none;display:flex;flex-direction:column}
.sidebar .logo{padding:20px;font-size:20px;font-weight:700;color:#fff;text-align:center;border-bottom:1px solid rgba(255,255,255,.1)}
.sidebar .el-menu{border-right:none!important}
.sidebar .el-menu-item{height:48px;line-height:48px;margin:4px 8px;border-radius:8px}
.sidebar .el-menu-item:hover{background:rgba(255,255,255,.1)!important}
.sidebar .el-menu-item.is-active{background:rgba(255,255,255,.15)!important;font-weight:600}

/* 主内容 */
.main-content{padding:24px;background:#f0f2f5;overflow-y:auto}

/* 统计卡片 */
.stat-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.stat-card{background:#fff;border-radius:12px;padding:20px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.stat-card .label{font-size:13px;color:#8c8c8c;margin-bottom:8px}
.stat-card .value{font-size:28px;font-weight:700;color:#1a1a1a}
.stat-card .sub{font-size:12px;color:#8c8c8c;margin-top:6px}
.stat-card .trend-up{color:#52c41a}
.stat-card .trend-down{color:#ff4d4f}

/* 图表容器 */
.chart-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}
.chart-box{background:#fff;border-radius:12px;padding:20px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.chart-box .title{font-size:15px;font-weight:600;color:#1a1a1a;margin-bottom:16px}
.chart-box .chart{width:100%;height:320px}

/* 全宽图表 */
.chart-full{background:#fff;border-radius:12px;padding:20px;box-shadow:0 1px 3px rgba(0,0,0,.08);margin-bottom:24px}
.chart-full .title{font-size:15px;font-weight:600;color:#1a1a1a;margin-bottom:16px}
.chart-full .chart{width:100%;height:360px}

/* 页面标题 */
.page-header{margin-bottom:24px;display:flex;align-items:center;justify-content:space-between}
.page-header h2{font-size:20px;font-weight:700;color:#1a1a1a}

/* 表格容器 */
.table-box{background:#fff;border-radius:12px;padding:20px;box-shadow:0 1px 3px rgba(0,0,0,.08);margin-bottom:24px}
.table-box .title{font-size:15px;font-weight:600;color:#1a1a1a;margin-bottom:16px}

/* 筛选栏 */
.filter-bar{display:flex;gap:12px;align-items:center;margin-bottom:16px;flex-wrap:wrap}

/* 报表卡片 */
.report-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 1px 3px rgba(0,0,0,.08);margin-bottom:16px}
.report-card .report-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.report-card .report-title{font-size:16px;font-weight:600}
.report-card .report-date{font-size:13px;color:#8c8c8c}
.report-card .report-body{white-space:pre-line;font-size:14px;line-height:1.8;color:#333}

/* 预警标签 */
.alert-tag{margin:2px 4px}

/* ========== 移动端顶部栏 ========== */
.mobile-header{
  display:none;
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:48px;
  background:linear-gradient(135deg,#2d5016 0%,#1a3a0a 100%);
  color:#fff;
  padding:0 16px;
  align-items:center;
  justify-content:space-between;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.mobile-header-title{font-size:16px;font-weight:700}
.mobile-header-page{font-size:13px;color:rgba(255,255,255,.7)}

/* ========== 移动端底部导航 ========== */
.mobile-tabbar{
  display:none;
  position:fixed;bottom:0;left:0;right:0;z-index:100;
  height:56px;
  background:#fff;
  border-top:1px solid #e8e8e8;
  justify-content:space-around;
  align-items:center;
  padding-bottom:env(safe-area-inset-bottom);
}
.tabbar-item{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  flex:1;height:100%;cursor:pointer;
  color:#8c8c8c;transition:color .2s;
  -webkit-tap-highlight-color:transparent;
}
.tabbar-item.active{color:#2d5016}
.tabbar-item.active .tabbar-icon{transform:scale(1.15)}
.tabbar-icon{font-size:20px;line-height:1;margin-bottom:2px;transition:transform .2s}
.tabbar-label{font-size:11px;line-height:1}

/* ========== 响应式断点 ========== */
@media(max-width:1200px){
  .stat-cards{grid-template-columns:repeat(2,1fr)}
  .chart-row{grid-template-columns:1fr}
}

@media(max-width:768px){
  .stat-cards{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}
  .stat-card{padding:14px!important}
  .stat-card .value{font-size:20px!important}
  .chart-row{grid-template-columns:1fr!important;gap:12px!important}
  .chart-box{padding:14px!important}
  .chart-box .chart{height:240px!important}

  /* 显示移动端导航 */
  .mobile-header{display:flex!important}
  .mobile-tabbar{display:flex!important}

  /* 隐藏PC侧边栏 */
  .sidebar{display:none!important}

  /* 主内容区适配 */
  .main-container{height:100vh;flex-direction:column}
  .mobile-main{padding:60px 12px 68px!important;-webkit-overflow-scrolling:touch}
  .main-content{padding:16px!important}

  /* 页面标题 */
  .page-header{margin-bottom:16px!important;flex-wrap:wrap;gap:8px}
  .page-header h2{font-size:17px!important}

  /* 报表卡片 */
  .report-card{padding:14px!important}
  .report-card .report-header{flex-direction:column;gap:8px;align-items:flex-start}

  /* 筛选栏 */
  .filter-bar{flex-direction:column;align-items:flex-start;gap:8px}

  /* Element Plus Dialog 移动端适配 */
  .el-dialog{width:95vw!important;margin:5vh auto!important}
  .el-dialog__body{padding:12px!important}

  /* 表格横向滚动 */
  .el-table{font-size:12px!important}
  .ms-table-wrap{padding:0 8px!important;overflow-x:auto}

  /* 美团销售页移动适配 */
  .ms-header{flex-direction:column;align-items:flex-start;gap:10px;padding:12px!important}
  .ms-toolbar{flex-wrap:wrap;gap:4px}
  .ms-filter-area{padding:10px 12px!important}
  .ms-filter-row{flex-direction:column;gap:6px;align-items:flex-start}
  .ms-filter-item{margin-right:0!important;flex-wrap:wrap}
  .ms-pagination{padding:8px 12px!important;justify-content:center}
}

/* ========== 美团管家 - 菜品销售统计页面 ========== */
.meituan-sales {
  background: #fff;
  min-height: 100%;
  padding: 0;
  font-size: 13px;
  color: #333;
}

/* 顶部标题栏 */
.ms-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px 12px;
  border-bottom: 1px solid #e8e8e8;
}
.ms-title {
  font-size: 18px;
  font-weight: 700;
  color: #333;
  margin: 0;
}
.ms-toolbar {
  display: flex;
  align-items: center;
  gap: 4px;
}
.ms-toolbar .el-button {
  color: #666;
  font-size: 12px;
  padding: 4px 8px;
}
.ms-toolbar .el-button:hover {
  color: #ff6633;
}
.toolbar-icon {
  margin-right: 2px;
  font-size: 13px;
}

/* 筛选区域 */
.ms-filter-area {
  padding: 16px 20px 12px;
  border-bottom: 1px solid #f0f0f0;
  background: #fff;
}
.ms-filter-row {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  flex-wrap: wrap;
  gap: 8px;
}
.ms-filter-item {
  display: flex;
  align-items: center;
  margin-right: 24px;
}
.ms-filter-label {
  font-size: 13px;
  color: #666;
  white-space: nowrap;
  margin-right: 8px;
}
.ms-filter-sep {
  margin: 0 6px;
  color: #999;
  font-size: 12px;
}

/* Tab 按钮组 */
.ms-tab-group {
  display: inline-flex;
  border: 1px solid #dcdfe6;
  border-radius: 3px;
  overflow: hidden;
}
.ms-tab-btn {
  padding: 4px 14px;
  font-size: 12px;
  border: none;
  background: #fff;
  color: #606266;
  cursor: pointer;
  border-right: 1px solid #dcdfe6;
  transition: all .2s;
  outline: none;
  line-height: 20px;
}
.ms-tab-btn:last-child {
  border-right: none;
}
.ms-tab-btn:hover {
  color: #ff6633;
}
.ms-tab-btn.active {
  background: #ff6633;
  color: #fff;
}

/* 更多筛选 & 查询按钮 */
.ms-more-filter {
  color: #ff6633;
  font-size: 13px;
  text-decoration: none;
  margin-right: 12px;
}
.ms-more-filter:hover {
  text-decoration: underline;
}
.ms-query-btn {
  background: #ff6633 !important;
  border-color: #ff6633 !important;
  color: #fff !important;
  min-width: 64px;
}
.ms-query-btn:hover {
  background: #e55a2b !important;
  border-color: #e55a2b !important;
}
.ms-save-query {
  color: #999 !important;
  font-size: 12px !important;
}

/* 查询时间范围提示 */
.ms-time-hint {
  padding: 8px 20px;
  font-size: 12px;
  color: #999;
  background: #fafafa;
  border-bottom: 1px solid #f0f0f0;
}

/* 表格区域 */
.ms-table-wrap {
  padding: 0 20px;
  margin-top: 0;
}
.ms-table {
  width: 100%;
  font-size: 13px;
}
.ms-table .el-table__header th {
  background: #f5f5f5 !important;
  color: #333 !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  padding: 8px 0 !important;
  border-color: #e8e8e8 !important;
}
.ms-table .el-table__body td {
  padding: 6px 0 !important;
  font-size: 13px !important;
  border-color: #f0f0f0 !important;
}
.ms-table .el-table__row:hover > td {
  background: #fff8e6 !important;
}
/* 合计行 */
.ms-table .el-table__footer td {
  background: #fafafa !important;
  font-weight: 700 !important;
  color: #333 !important;
  font-size: 13px !important;
  padding: 8px 0 !important;
  border-top: 2px solid #e8e8e8 !important;
}
.ms-table .el-table__footer .cell {
  font-weight: 700 !important;
}

/* 分页 */
.ms-pagination {
  padding: 12px 20px 16px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  background: #fff;
}
.ms-pagination .el-pagination {
  font-size: 13px;
}
.ms-pagination .el-pager li.is-active {
  background: #ff6633 !important;
  color: #fff !important;
  border-radius: 2px;
}
.ms-pagination .el-pager li:hover {
  color: #ff6633 !important;
}

/* Element Plus 覆盖 - 美团橙色主题 */
.meituan-sales .el-button--primary {
  background: #ff6633;
  border-color: #ff6633;
}
.meituan-sales .el-button--primary:hover {
  background: #e55a2b;
  border-color: #e55a2b;
}
.meituan-sales .el-input__wrapper:hover,
.meituan-sales .el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px #ff6633 inset !important;
}
.meituan-sales .el-select .el-input.is-focus .el-input__wrapper {
  box-shadow: 0 0 0 1px #ff6633 inset !important;
}
.meituan-sales .el-date-editor.el-input__wrapper:hover,
.meituan-sales .el-date-editor.el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px #ff6633 inset !important;
}

/* 排序箭头颜色 */
.ms-table .el-table__column-filter-trigger i,
.ms-table .sort-caret.ascending {
  border-bottom-color: #ff6633;
}
.ms-table .ascending .sort-caret.ascending {
  border-bottom-color: #ff6633;
}
.ms-table .descending .sort-caret.descending {
  border-top-color: #ff6633;
}

/* 全屏模式 */
.meituan-sales:fullscreen {
  background: #fff;
  overflow-y: auto;
  padding: 0;
}

/* === 菜品销售统计 - 增强样式 === */
.ms-quick-dates {
  display: inline-flex;
  gap: 2px;
  margin-left: 12px;
}
.ms-quick-dates .el-button {
  padding: 4px 8px !important;
  font-size: 12px;
}
.ms-result-hint {
  margin-left: 16px;
  font-size: 13px;
  color: #666;
}
.ms-result-hint b {
  color: #333;
  font-weight: 600;
}
.ratio-cell {
  position: relative;
  padding-right: 4px;
}
.ratio-cell span {
  position: relative;
  z-index: 1;
}
.ratio-bar {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 3px;
  background: #67c23a;
  border-radius: 2px;
  transition: width 0.3s;
  opacity: 0.6;
}
.ratio-bar-blue {
  background: #409eff;
}