:root {
  --ea-primary: #409EFF;
  --ea-primary-hover: #66b1ff;
  --ea-primary-active: #3a8ee6;
  --ea-primary-bg: #ecf5ff;
  --ea-primary-light: #d9ecff;

  --ea-success: #67C23A;
  --ea-success-bg: #f0f9eb;
  --ea-warning: #E6A23C;
  --ea-warning-bg: #fdf6ec;
  --ea-danger: #F56C6C;
  --ea-danger-bg: #fef0f0;
  --ea-info: #909399;
  --ea-info-bg: #f4f4f5;

  --sidebar-bg: #304156;
  --sidebar-bg-dk: #1f2d3d;
  --sidebar-bg-hover: #263445;
  --sidebar-text: #BFCBD9;
  --sidebar-text-active: #FFFFFF;
  --sidebar-active-marker: var(--ea-primary);
  --sidebar-logo-bg: #2b3648;

  --topbar-bg: #FFFFFF;
  --topbar-border: #E4E7ED;
  --topbar-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);

  --content-bg: #F0F2F5;
  --card-bg: #FFFFFF;
  --card-border: #EBEEF5;
  --card-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
  --card-shadow-hover: 0 4px 16px rgba(0, 0, 0, 0.08);

  --text-primary: #303133;
  --text-regular: #606266;
  --text-secondary: #909399;
  --text-placeholder: #C0C4CC;
  --border-base: #DCDFE6;
  --border-light: #E4E7ED;
  --border-lighter: #EBEEF5;
  --border-extra-light: #F2F6FC;

  --radius-base: 4px;
  --radius-small: 2px;
  --radius-large: 8px;

  --font-family: 'Sarabun', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-size-base: 14px;
  --font-size-small: 12px;
  --font-size-medium: 16px;
  --font-size-large: 18px;
  --font-size-extra-large: 20px;

  --sidebar-width: 210px;
  --sidebar-width-collapsed: 64px;
  --topbar-height: 50px;
  --transition-base: all 0.28s cubic-bezier(0.645, 0.045, 0.355, 1);
}

* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: var(--font-family);
  font-size: var(--font-size-base);
  color: var(--text-regular);
  background: var(--content-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: var(--ea-primary);
  text-decoration: none;
}

a:hover {
  color: var(--ea-primary-hover);
}

button {
  font-family: inherit;
}