/* Lowest-rate index used on /texas and /nrg. Rates are in the HTML so they can be indexed. */
.wk-rate-index h3 {
  font-family: Outfit, sans-serif;
  font-weight: 400;
  font-size: 22px;
  letter-spacing: -0.02em;
  margin: 28px 0 12px;
}

.wk-rate-index .when {
  color: #5c6570;
  font-size: 0.72em;
}

.wk-rate-index .split + .split {
  margin-top: 8px;
}

.wk-rate-index .wrap {
  overflow-x: auto;
  background: #fff;
}

.wk-rate-index table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  min-width: 720px;
  background: #fff;
}

.wk-rate-index th,
.wk-rate-index td {
  text-align: left;
  padding: 12px;
  border-bottom: 1px solid #e4e7ec;
  vertical-align: middle;
  background: #fff;
}

.wk-rate-index th {
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #5c6570;
  font-weight: 600;
}

.wk-rate-index .util {
  font-weight: 700;
  color: #101827;
}

.wk-rate-index .area {
  display: block;
  color: #5c6570;
  font-weight: 500;
  font-size: 12px;
  margin-top: 2px;
  letter-spacing: 0;
  text-transform: none;
}

.wk-rate-index .pair {
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
}

.wk-rate-index .rate {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 18px;
  color: #101827;
  text-transform: none;
  letter-spacing: 0;
}

.wk-rate-index .pair img {
  height: 28px;
  width: auto;
  max-width: 120px;
  object-fit: contain;
}

.wk-rate-index .term {
  color: #5c6570;
  font-size: 12px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
}

.wk-rate-index .miss {
  color: #5c6570;
  font-weight: 500;
}

.wk-rate-index td.is-low {
  background: #ecfdf3;
}

.wk-rate-index td.is-low .rate {
  color: #027a48;
}
