/* ==========================================================================
 * peiste-cabinets.cn 浅米黄主题 + 香槟金
 * 创建: 2026-06-06
 * 覆盖范围: 全局（侧栏 / 顶栏 / 卡片 / 按钮 / 表格 / 标签）
 * ========================================================================== */

:root {
  --cream-bg:      #FAF6E9;   /* 页面底色 - 浅米黄 */
  --cream-bg-2:    #F5EFDC;   /* 次级底色 */
  --card-bg:       #FFFFFF;   /* 卡片白 */
  --primary:       #C4956A;   /* 主色 - 香槟金 */
  --primary-dark:  #A67B50;
  --primary-light: #E8D4B8;
  --primary-soft:  #F0E0CC;
  --text-main:     #3D3022;   /* 主文字 - 深棕 */
  --text-sub:      #6B5B4F;   /* 次文字 */
  --text-light:    #8B7360;
  --border:        #E8DCC4;   /* 边框 - 暖灰 */
  --border-light:  #F0E6D2;
  --success:       #7D9B76;
  --warning:       #D4A574;
  --danger:        #C47B6B;
  --shadow:        0 2px 12px rgba(196, 149, 106, 0.08);
  --shadow-hover:  0 4px 20px rgba(196, 149, 106, 0.15);
}

/* ===== 全局背景 ===== */
html, body {
  background: var(--cream-bg) !important;
  color: var(--text-main) !important;
}

#app {
  background: var(--cream-bg) !important;
}

/* ===== 顶栏 (Header) ===== */
.el-header,
.layout-header,
.app-header,
[class*="header"] {
  background: var(--card-bg) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
}

/* ===== 侧栏 (Sidebar) - 蓝灰 → 浅米黄 ===== */
.el-aside,
.desktop-sidebar,
.sidebar,
[class*="sidebar"]:not([class*="menu"]):not([class*="popup"]) {
  background: linear-gradient(180deg, #FAF6E9 0%, #F5EFDC 100%) !important;
  border-right: 1px solid var(--border) !important;
}

.sidebar-menu,
.desktop-sidebar {
  background: transparent !important;
}

.sidebar-menu .el-menu-item,
.desktop-sidebar .el-menu-item {
  color: var(--text-sub) !important;
  border-radius: 8px;
  margin: 2px 8px;
  transition: all 0.2s ease;
}

.sidebar-menu .el-menu-item:hover,
.desktop-sidebar .el-menu-item:hover {
  color: var(--primary-dark) !important;
  background: var(--primary-soft) !important;
}

.sidebar-menu .el-menu-item.is-active,
.desktop-sidebar .el-menu-item.is-active {
  color: #FFFFFF !important;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(196, 149, 106, 0.3);
}

.menu-group-title {
  color: var(--text-light) !important;
  font-size: 11px !important;
  letter-spacing: 1px;
  padding: 12px 20px 4px !important;
}

.version-tag {
  color: var(--text-light) !important;
  font-size: 11px;
}

/* ===== 主内容区 ===== */
.el-main,
.layout-main,
.app-main,
[class*="main-content"] {
  background: var(--cream-bg) !important;
  padding: 20px !important;
}

.page-title,
h2.page-title {
  color: var(--text-main) !important;
  font-size: 22px !important;
  font-weight: 600;
  margin-bottom: 20px;
  letter-spacing: 0.5px;
}

/* ===== 卡片 (Element Card) ===== */
.el-card {
  background: var(--card-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  box-shadow: var(--shadow) !important;
  transition: all 0.3s ease;
}

.el-card:hover {
  box-shadow: var(--shadow-hover) !important;
  transform: translateY(-2px);
}

.el-card__header {
  background: transparent !important;
  border-bottom: 1px solid var(--border-light) !important;
  padding: 16px 20px !important;
  font-weight: 600;
  color: var(--text-main);
}

/* ===== Dashboard 统计卡 (工作台 4 大数字) ===== */
.stat-card,
[class*="stat-card"] {
  background: var(--card-bg) !important;
  border: 1px solid var(--border-light) !important;
  border-radius: 12px !important;
  padding: 24px !important;
  box-shadow: var(--shadow) !important;
  transition: all 0.3s ease;
}

.stat-card:hover {
  box-shadow: var(--shadow-hover) !important;
  transform: translateY(-3px);
  border-color: var(--primary-light);
}

.stat-icon {
  border-radius: 12px !important;
  background: var(--primary-soft) !important;
  color: var(--primary-dark) !important;
}

.stat-icon.orders     { background: var(--primary-soft) !important; color: var(--primary-dark) !important; }
.stat-icon.producing  { background: #FFF3E0 !important;            color: #E65100 !important; }
.stat-icon.customers  { background: #E8F5E9 !important;            color: #2E7D32 !important; }
.stat-icon.pending    { background: #FCE4EC !important;            color: #C62828 !important; }

.stat-value {
  color: var(--text-main) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
}

.stat-label {
  color: var(--text-light) !important;
  font-size: 13px !important;
  margin-top: 4px;
}

/* ===== 按钮 ===== */
.el-button--primary {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
  border-color: var(--primary) !important;
  color: #FFFFFF !important;
  font-weight: 500;
  box-shadow: 0 2px 8px rgba(196, 149, 106, 0.25);
}

.el-button--primary:hover {
  background: linear-gradient(135deg, var(--primary-dark) 0%, #8B6543 100%) !important;
  border-color: var(--primary-dark) !important;
  box-shadow: 0 4px 12px rgba(196, 149, 106, 0.35);
  transform: translateY(-1px);
}

.el-button--success {
  background: var(--success) !important;
  border-color: var(--success) !important;
}

.el-button--warning {
  background: var(--warning) !important;
  border-color: var(--warning) !important;
}

.el-button--danger {
  background: var(--danger) !important;
  border-color: var(--danger) !important;
}

.el-button {
  border-radius: 8px !important;
  transition: all 0.2s ease;
}

/* ===== 表格 ===== */
.el-table {
  background: var(--card-bg) !important;
  border-radius: 12px;
  overflow: hidden;
}

.el-table th.el-table__cell {
  background: var(--cream-bg-2) !important;
  color: var(--text-main) !important;
  font-weight: 600 !important;
  border-bottom: 1px solid var(--border) !important;
}

.el-table tr {
  background: var(--card-bg) !important;
}

.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
  background: var(--primary-soft) !important;
}

.el-table td.el-table__cell {
  border-bottom: 1px solid var(--border-light) !important;
  color: var(--text-sub);
}

/* ===== 标签 (Tag) ===== */
.el-tag {
  border-radius: 6px !important;
  font-weight: 500;
}

.el-tag--info    { background: #E3F2FD !important; color: #1565C0 !important; border-color: #BBDEFB !important; }
.el-tag--success { background: #E8F5E9 !important; color: #2E7D32 !important; border-color: #C8E6C9 !important; }
.el-tag--warning { background: #FFF3E0 !important; color: #E65100 !important; border-color: #FFE0B2 !important; }
.el-tag--danger  { background: #FCE4EC !important; color: #C62828 !important; border-color: #F8BBD0 !important; }

/* ===== 输入框 / Select ===== */
.el-input__wrapper,
.el-textarea__inner,
.el-select .el-input__wrapper {
  background: var(--card-bg) !important;
  border-radius: 8px !important;
  box-shadow: 0 0 0 1px var(--border) inset !important;
  transition: all 0.2s;
}

.el-input__wrapper:hover,
.el-textarea__inner:hover {
  box-shadow: 0 0 0 1px var(--primary-light) inset !important;
}

.el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px var(--primary) inset !important;
}

/* ===== Element 主色变量覆盖 (Element Plus / Element UI 主题) ===== */
:root {
  --el-color-primary: #C4956A;
  --el-color-primary-light-3: #D4A574;
  --el-color-primary-light-5: #E0B789;
  --el-color-primary-light-7: #ECC9A0;
  --el-color-primary-light-8: #F2D5B5;
  --el-color-primary-light-9: #F8E2C9;
  --el-color-primary-dark-2: #A67B50;
  --el-color-success: #7D9B76;
  --el-color-warning: #D4A574;
  --el-color-danger: #C47B6B;
  --el-color-info: #8B7360;
  --el-bg-color: #FAF6E9;
  --el-bg-color-page: #FAF6E9;
  --el-bg-color-overlay: #FFFFFF;
  --el-text-color-primary: #3D3022;
  --el-text-color-regular: #6B5B4F;
  --el-border-color: #E8DCC4;
  --el-border-color-light: #F0E6D2;
  --el-border-color-lighter: #F5EFDC;
}

/* ===== 滚动条 ===== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--cream-bg-2); }
::-webkit-scrollbar-thumb { background: var(--primary-light); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--primary); }

/* ===== 分割线 ===== */
.el-divider__text {
  background: var(--cream-bg) !important;
  color: var(--text-sub) !important;
  font-weight: 500;
}

/* ===== Dialog / Drawer ===== */
.el-dialog,
.el-drawer {
  border-radius: 16px !important;
  background: var(--card-bg) !important;
}

.el-dialog__header {
  background: var(--cream-bg-2);
  border-radius: 16px 16px 0 0;
  padding: 20px 24px !important;
  border-bottom: 1px solid var(--border);
}

.el-dialog__title {
  color: var(--text-main) !important;
  font-weight: 600;
}

/* ===== 徽章 / 通知 ===== */
.el-badge__content {
  background: var(--danger) !important;
  border-color: var(--card-bg) !important;
}

/* ===== 进度条 ===== */
.el-progress-bar__outer {
  background: var(--cream-bg-2) !important;
  border-radius: 4px;
}

.el-progress-bar__inner {
  background: linear-gradient(90deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
  border-radius: 4px;
}
