/* TDesign 基础样式 */
:root {
  --td-primary-color: #165dff;
  --td-success-color: #00b42a;
  --td-warning-color: #ff7d00;
  --td-danger-color: #f53f3f;
  --td-info-color: #86909c;
  --td-text-color-primary: #1d2129;
  --td-text-color-regular: #4e5969;
  --td-text-color-secondary: #86909c;
  --td-text-color-placeholder: #c9CDD4;
  --td-border-color: #e5e6eb;
  --td-border-color-light: #ebedf0;
  --td-bg-color-container: #fff;
  --td-bg-color-page: #f2f3f5;
  --td-bg-color-component: #f7f8fa;
  --td-bg-color-hover: #f7f8fa;
  --td-bg-color-active: #ebedf0;
  --td-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --td-font-size-xs: 12px;
  --td-font-size-sm: 14px;
  --td-font-size-base: 16px;
  --td-font-size-lg: 18px;
  --td-font-size-xl: 20px;
  --td-line-height-xs: 16px;
  --td-line-height-sm: 18px;
  --td-line-height-base: 22px;
  --td-line-height-lg: 24px;
  --td-line-height-xl: 28px;
  --td-border-radius-sm: 2px;
  --td-border-radius-base: 4px;
  --td-border-radius-lg: 8px;
  --td-shadow-base: 0 2px 8px rgba(0, 0, 0, 0.08);
  --td-shadow-dark: 0 4px 16px rgba(0, 0, 0, 0.12);
}

/* 深色主题变量 */
.tdesign-dark {
  --td-primary-color: #4080ff;
  --td-success-color: #36cbcb;
  --td-warning-color: #faad14;
  --td-danger-color: #ff4d4f;
  --td-info-color: #919eab;
  --td-text-color-primary: #f0f2f5;
  --td-text-color-regular: #c9CDD4;
  --td-text-color-secondary: #86909c;
  --td-text-color-placeholder: #6b7785;
  --td-border-color: #4e5969;
  --td-border-color-light: #343a40;
  --td-bg-color-container: #1d2129;
  --td-bg-color-page: #0f1115;
  --td-bg-color-component: #272b30;
  --td-bg-color-hover: #272b30;
  --td-bg-color-active: #343a40;
}

/* 卡片样式 */
.td-card, .tdesign-card {
  background-color: var(--td-bg-color-container);
  border: 1px solid var(--td-border-color);
  border-radius: var(--td-border-radius-lg);
  box-shadow: var(--td-shadow-base);
  transition: all 0.3s ease;
}

.td-card:hover, .tdesign-card:hover {
  box-shadow: var(--td-shadow-dark);
  transform: translateY(-2px);
}

/* 文本样式 */
.td-text {
  font-family: var(--td-font-family);
  font-size: var(--td-font-size-base);
  line-height: var(--td-line-height-base);
  color: var(--td-text-color-primary);
}

.td-text-primary {
  color: var(--td-text-color-primary);
}

.td-text-regular {
  color: var(--td-text-color-regular);
}

.td-text-secondary {
  color: var(--td-text-color-secondary);
}

/* 按钮样式 */
.td-btn {
  display: inline-block;
  padding: 6px 16px;
  font-family: var(--td-font-family);
  font-size: var(--td-font-size-base);
  font-weight: 400;
  line-height: var(--td-line-height-base);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: var(--td-border-radius-base);
  transition: all 0.3s ease;
  outline: none;
  user-select: none;
}

.td-btn-primary {
  color: #fff;
  background-color: var(--td-primary-color);
  border-color: var(--td-primary-color);
}

.td-btn-primary:hover {
  background-color: #4080ff;
  border-color: #4080ff;
}

.td-btn-secondary {
  color: var(--td-text-color-regular);
  background-color: var(--td-bg-color-component);
  border-color: var(--td-border-color);
}

.td-btn-secondary:hover {
  background-color: var(--td-bg-color-hover);
  border-color: var(--td-primary-color);
}

/* 表单样式 */
.td-input {
  display: inline-block;
  width: 100%;
  padding: 6px 12px;
  font-family: var(--td-font-family);
  font-size: var(--td-font-size-base);
  line-height: var(--td-line-height-base);
  color: var(--td-text-color-primary);
  background-color: var(--td-bg-color-container);
  background-clip: padding-box;
  border: 1px solid var(--td-border-color);
  border-radius: var(--td-border-radius-base);
  transition: all 0.3s ease;
  outline: none;
}

.td-input:focus {
  border-color: var(--td-primary-color);
  box-shadow: 0 0 0 2px rgba(22, 93, 255, 0.2);
}

/* 标签样式 */
.td-label {
  font-family: var(--td-font-family);
  font-size: var(--td-font-size-base);
  font-weight: 500;
  color: var(--td-text-color-primary);
}

/* 列表样式 */
.td-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.td-list-item {
  padding: 12px 0;
  border-bottom: 1px solid var(--td-border-color-light);
}

.td-list-item:last-child {
  border-bottom: none;
}