/* =====================================================================
   style.css — 熱中症指数（WBGT）・危険度 ツール固有の微調整のみ。
   共通スタイルは /_shared/shirugear.css に任せる。
   ===================================================================== */

/* 結果値はタブ幅数字で桁を揃える */
.sg-result__value {
  font-variant-numeric: tabular-nums;
}

/* 各入力の補助ラベルを入力直下に詰める */
.sg-field .sg-help {
  margin-top: var(--sg-space-1);
}

/* 危険度区分の色（背景＋文字） */
.wbgt-level {
  font-weight: 700;
}
.wbgt-level.is-safe {
  color: #1b7f4b;
}
.wbgt-level.is-attention {
  color: #2f7bd6;
}
.wbgt-level.is-warning {
  color: #c98a00;
}
.wbgt-level.is-severe {
  color: #d9540b;
}
.wbgt-level.is-danger {
  color: #c2272d;
}

/* 危険度区分 早見表 */
.wbgt-legend {
  list-style: none;
  margin: var(--sg-space-2) 0 0;
  padding: 0;
  display: grid;
  gap: var(--sg-space-1);
}
.wbgt-legend__item {
  display: flex;
  align-items: center;
  gap: var(--sg-space-3);
  padding: 8px var(--sg-space-3);
  border-radius: var(--sg-radius-sm, 8px);
  border-left: 6px solid currentColor;
  background: var(--sg-surface-2);
}
.wbgt-legend__range {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  min-width: 4.5em;
}
.wbgt-legend__name {
  font-weight: 600;
  color: var(--sg-fg);
}
.wbgt-legend__item.is-safe {
  color: #1b7f4b;
}
.wbgt-legend__item.is-attention {
  color: #2f7bd6;
}
.wbgt-legend__item.is-warning {
  color: #c98a00;
}
.wbgt-legend__item.is-severe {
  color: #d9540b;
}
.wbgt-legend__item.is-danger {
  color: #c2272d;
}