/**
 * eda-tools 样式覆盖
 * 
 * EDA Tools 使用紫蓝色配色方案，覆盖 common/style.css 的默认蓝色
 * 基础组件样式由 /common/style.css 提供
 */

/* ===== EDA 专属配色覆盖 ===== */
:root {
  --tb-primary: #667eea;
  --tb-secondary: #764ba2;
  --tb-accent: #00f2fe;

  /* 旧变量名别名（兼容 HTML 中的 var(--accent) 等旧写法） */
  --primary: var(--tb-primary);
  --secondary: var(--tb-secondary);
  --accent: var(--tb-accent);
  --bg-color: var(--tb-bg);
  --surface: var(--tb-surface);
  --surface-hover: var(--tb-surface-hover);
  --border: var(--tb-border);
  --text-primary: var(--tb-text);
  --text-secondary: var(--tb-text-secondary);
  --text-muted: var(--tb-text-muted);
  --glass-blur: var(--tb-glass-blur);
  --success: var(--tb-success);
  --warning: var(--tb-warning);
  --error: var(--tb-error);
  --info: var(--tb-info);
  --font-mono: var(--tb-font-mono);
  --font-sans: var(--tb-font-sans);
  --radius: var(--tb-radius);
  --radius-sm: var(--tb-radius-sm);
  --transition: var(--tb-transition);
  --sidebar-width: var(--tb-sidebar-width);
  --topbar-height: var(--tb-topbar-height);
}

body.light-mode {
  --bg-color: var(--tb-bg);
  --surface: var(--tb-surface);
  --surface-hover: var(--tb-surface-hover);
  --border: var(--tb-border);
  --text-primary: var(--tb-text);
  --text-secondary: var(--tb-text-secondary);
  --text-muted: var(--tb-text-muted);
}

/* ===== EDA 特有样式 ===== */

/* 计算器布局 */
.calculator-layout {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}
.calc-main {
  flex: 1;
  padding: 24px;
}
.calc-sidebar {
  width: 280px;
  padding: 20px;
}

/* 结果框 */
.result-box {
  background: var(--tb-surface);
  border-radius: var(--tb-radius-sm);
  padding: 16px;
  margin-bottom: 12px;
}
.result-box .label {
  font-size: 0.8rem;
  color: var(--tb-text-secondary);
  margin-bottom: 4px;
}
.result-box .value {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--tb-accent);
  font-family: var(--tb-font-mono);
}
.result-box .unit {
  font-size: 0.85rem;
  color: var(--tb-text-secondary);
  margin-left: 4px;
}

/* 色环电阻样式 */
.color-band {
  width: 30px;
  height: 60px;
  border-radius: 4px;
  cursor: pointer;
  transition: var(--tb-transition);
  border: 2px solid transparent;
}
.color-band:hover {
  transform: scale(1.1);
  border-color: var(--tb-accent);
}

/* 响应式 */
@media (max-width: 992px) {
  .calculator-layout {
    flex-direction: column;
  }
  .calc-sidebar {
    width: 100%;
  }
}