/* 计算工具页 · 电力电网绿主题覆层：白底黑字 / 绿强调 */
:root {
  --jmx-bg: #f5faf7;
  --jmx-panel: #ffffff;
  --jmx-panel-2: #e8f6ee;
  --jmx-line: #b7dcc4;
  --jmx-line-soft: #d0edd9;
  --jmx-text: #111111;
  --jmx-dim: #222222;
  --jmx-mute: #333333;
  --jmx-copper: #007a2f;
  --jmx-copper-deep: #005c24;
  --jmx-ok: #009639;
  --jmx-danger: #c62828;
  --jmx-radius: 10px;
  --jmx-display: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", serif;
  --jmx-body: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
}

body {
  font-family: var(--jmx-body) !important;
  background: linear-gradient(180deg, #e8f6ee 0%, #f5faf7 40%, #ffffff 100%) !important;
  color: var(--jmx-text) !important;
}

a[href="/"],
a[href="/index.html"],
.back-home {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 6px 12px !important;
  border-radius: 999px !important;
  background: #fff !important;
  border: 1px solid var(--jmx-line) !important;
  color: var(--jmx-copper) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
a[href="/"]:hover,
a[href="/index.html"]:hover,
.back-home:hover {
  background: var(--jmx-panel-2) !important;
  border-color: var(--jmx-copper) !important;
  color: var(--jmx-copper-deep) !important;
  box-shadow: none !important;
  transform: none !important;
}

h1,
.header-title,
.page-title,
.subtitle,
.sub-title {
  font-family: var(--jmx-display) !important;
  letter-spacing: 0.04em;
  color: var(--jmx-copper-deep) !important;
  background: none !important;
  -webkit-text-fill-color: initial !important;
}
.subtitle,
.sub-title {
  color: var(--jmx-dim) !important;
  font-family: var(--jmx-body) !important;
  font-weight: 400 !important;
}

.card,
.collapsible-content,
.result-panel,
.split-card,
.func-card,
.result-section,
.form-section,
.promo-message {
  border-radius: var(--jmx-radius) !important;
  border: 1px solid var(--jmx-line) !important;
  box-shadow: 0 8px 22px -14px rgba(0, 92, 36, 0.2) !important;
  background: #fff !important;
  backdrop-filter: none !important;
  color: var(--jmx-text) !important;
}

.card h3,
.card-title,
.section-title {
  color: var(--jmx-copper-deep) !important;
  border-color: var(--jmx-line-soft) !important;
  font-family: var(--jmx-display) !important;
}

.collapsible-header {
  background: var(--jmx-panel-2) !important;
  border: 1px solid var(--jmx-line) !important;
  color: var(--jmx-text) !important;
  box-shadow: none !important;
}
.collapsible-header:hover { background: #d8f0e2 !important; }

input, select, textarea {
  background: #fff !important;
  color: var(--jmx-text) !important;
  border: 1px solid #9fcdb0 !important;
  border-radius: 8px !important;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--jmx-ok) !important;
  box-shadow: 0 0 0 3px rgba(0, 150, 57, 0.18) !important;
  outline: none !important;
}
input[readonly] { background: #f3f8f5 !important; color: #33443b !important; }

.hint { color: var(--jmx-mute) !important; }
.hint.warn { color: var(--jmx-danger, #c62828) !important; }
.hint.err { color: var(--jmx-danger) !important; }

.btn-calc,
.btn-primary,
button.btn-calc,
.tsjx-btn,
.export-btn {
  background: linear-gradient(135deg, #009639, #007a2f) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}
.btn-report {
  background: linear-gradient(135deg, #2e7d32, #1b5e20) !important;
  color: #fff !important;
  border-radius: 999px !important;
}
.btn-info {
  background: #ef6c00 !important;
  color: #fff !important;
  border-radius: 999px !important;
}

.tab-btn {
  background: #e8f6ee !important;
  color: #3d4a42 !important;
  border-radius: 999px !important;
}
.tab-btn.active {
  background: linear-gradient(135deg, #009639, #007a2f) !important;
  color: #fff !important;
}

.selection-rule {
  background: #e8f6ee !important;
  border: 1px solid #b7dcc4 !important;
  color: #005c24 !important;
}

table th {
  background: #e8f6ee !important;
  color: #005c24 !important;
}
table td {
  color: #1a1a1a !important;
  background: #fff !important;
}

.badge-pass, .conclusion-pass { color: #007a2f !important; }
.badge-fail, .conclusion-fail { color: #c62828 !important; }

.metric {
  background: #f5faf7 !important;
  border: 1px solid #d0edd9 !important;
  border-radius: 10px !important;
  color: #1a1a1a !important;
}

.top-header,
.main-header {
  background: #009639 !important;
  color: #fff !important;
  border-bottom: 3px solid #005c24 !important;
}
.page-title, .top-header .page-title { color: #fff !important; }
.top-header .back-home {
  background: rgba(255,255,255,0.15) !important;
  border-color: rgba(255,255,255,0.45) !important;
  color: #fff !important;
}

.workflow-banner {
  background: #fff !important;
  border-left: 4px solid #009639 !important;
}

.split-card {
  background: #fff !important;
  color: #1a1a1a !important;
}
.split-card:hover {
  border-color: #009639 !important;
  background: #f5faf7 !important;
}
.split-icon, .split-arrow, .split-name { color: #007a2f !important; }
.split-detail { color: #6b7a72 !important; }

.promo-message {
  color: #1a1a1a !important;
}
.promo-message .service-item,
.promo-message .service-item i {
  color: #007a2f !important;
}
.promo-message .highlight-blue { color: #007a2f !important; }

.formula-note {
  background: #e8f6ee !important;
  border: 1px solid #b7dcc4 !important;
  color: #1a1a1a !important;
}


/* === Q1_2_PATCH === */
/* 填写说明按钮：红底白字 */
.btn-info,
button.btn-info,
a .btn-info,
.btn-help.btn-info,
button#helpBtn {
  background: #c62828 !important;
  color: #ffffff !important;
  border: none !important;
  font-weight: 700 !important;
}

/* 开始计算等主按钮统一绿底白字 */
#calcBtn,
button#calcBtn,
.calc-btn,
button.calc-btn {
  background: linear-gradient(135deg, #009639, #007a2f) !important;
  color: #fff !important;
  border: none !important;
  font-weight: 700 !important;
}

/* 工具页主标题更清晰（排除顶栏白字标题、填写说明页） */
body > .container > h1,
body > .main-container > h1,
.container > h1 {
  color: #0a3d1e !important;
  font-weight: 800 !important;
  font-size: clamp(1.35rem, 2.2vw, 1.75rem) !important;
  letter-spacing: 0.02em !important;
  text-shadow: none !important;
  -webkit-text-fill-color: #0a3d1e !important;
}

/* 填写说明页标题保持绿底白字 */
h1.doc-title,
.doc-title {
  background: #009639 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 1.75rem !important;
  padding: 14px 12px !important;
  border-radius: 10px 10px 0 0 !important;
}
.top-header .page-title,
.main-header .page-title {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* 张力结果区强制白底黑字 */
#resultContainer,
.result-box,
.result-item,
.result-panel {
  background: #ffffff !important;
  color: #1a1a1a !important;
}
.result-item { border-left-color: #009639 !important; }
.result-label { color: #005c24 !important; font-weight: 700 !important; }

/* 张力页暗色残留清理 */
.collapsible-header {
  background: #e8f6ee !important;
  color: #0a3d1e !important;
}
.modal-content, .modal-body, .help-text, .help-text pre {
  background: #fff !important;
  color: #1a1a1a !important;
}
.modal-header {
  background: #009639 !important;
  color: #fff !important;
}

/* 帮助示意图 */
.help-schematic {
  display: block;
  max-width: 100%;
  margin: 0;
  border: 1px solid #b7dcc4;
  border-radius: 10px;
}
.help-ab-box {
  background: #ffebee;
  border: 1px solid #ef9a9a;
  border-left: 4px solid #c62828;
  padding: 12px 14px;
  margin: 12px 0;
  border-radius: 8px;
  color: #111111;
  line-height: 1.7;
  font-size: 14px;
  display: block;
}
.help-ab-box:has(.help-ab-fig) {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.help-ab-text {
  flex: 1 1 auto;
  min-width: 0;
}
.help-ab-fig {
  flex: 0 0 auto;
  max-width: 42%;
}
.help-ab-fig .help-schematic {
  max-height: 200px;
  width: auto;
  margin-left: auto;
}
@media (max-width: 700px) {
  .help-ab-box:has(.help-ab-fig) { flex-direction: column; }
  .help-ab-fig { max-width: 100%; width: 100%; }
  .help-ab-fig .help-schematic { max-height: 220px; margin: 0 auto; }
}
