:root {
  --brand-color: #ff6800;
  --brand-color-hover: #ff7d1f;
  --brand-color-active: #e65a00;

  --sidebar-width: 240px;
  --sidebar-width-collapsed: 64px;
  --header-height: 56px;

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    Roboto,
    'Helvetica Neue',
    Arial,
    'PingFang SC',
    'Hiragino Sans GB',
    'Microsoft YaHei',
    sans-serif;
  color: #1f2937;
  background-color: #f5f7fa;
}

* {
  box-sizing: border-box;
}

html,
body,
#app {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

/* Element Plus brand color overrides */
:root {
  --el-color-primary: var(--brand-color);
  --el-color-primary-light-3: #ff8f3d;
  --el-color-primary-light-5: #ffb073;
  --el-color-primary-light-7: #ffd1a8;
  --el-color-primary-light-8: #ffe0c2;
  --el-color-primary-light-9: #fff0e0;
  --el-color-primary-dark-2: #e65a00;
}

/* Brand-colored buttons */
.el-button--primary {
  --el-button-bg-color: var(--brand-color);
  --el-button-border-color: var(--brand-color);
  --el-button-hover-bg-color: var(--brand-color-hover);
  --el-button-hover-border-color: var(--brand-color-hover);
  --el-button-active-bg-color: var(--brand-color-active);
  --el-button-active-border-color: var(--brand-color-active);
}

/* Page wrapper helper */
.page-container {
  padding: 16px;
}

.page-card {
  background: #ffffff;
  border-radius: 6px;
  padding: 16px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

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

.filter-bar .el-input,
.filter-bar .el-select,
.filter-bar .el-cascader {
  width: 200px;
}

/* Action cell padding */
.table-actions .el-button + .el-button {
  margin-left: 8px;
}

/* Brand-colored dialog titles */
.brand-title {
  color: var(--brand-color);
  font-weight: 600;
}