/* Article "Minimum wage in the US" (js/art-minimum-wage.js). Classes mw-*. */

.mw-plot-stair { min-height: 400px; }
.mw-plot-strip { min-height: 400px; }
.mw-plot-ratio { min-height: 320px; }
@media (max-width: 640px) { .mw-plot-stair { min-height: 300px; } .mw-plot-strip { min-height: 320px; } }

/* the staircase */
.mw-real-area { fill: var(--s2); opacity: 0.07; stroke: none; }
.mw-real-area.on { opacity: 0.16; }
.mw-peak { fill: var(--ink-2); font: 600 11.5px var(--mono); font-variant-numeric: tabular-nums; paint-order: stroke; stroke: var(--surface); stroke-width: 4px; stroke-linejoin: round; }

/* the states since 2000 */
.mw-fedline { fill: none; stroke: var(--line-gray); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }
.sw-sq.mw-fedsw { background: var(--line-gray); height: 4px; width: 14px; border-radius: 2px; }
.mw-dot { fill: var(--s1); fill-opacity: 0.72; stroke: var(--surface); stroke-width: 1; }
.mw-dot.on { fill-opacity: 1; }
.mw-col-on { fill: var(--track); opacity: 0.8; }
.mw-count { fill: var(--muted); font: 600 10px var(--mono); font-variant-numeric: tabular-nums; }
.tick.mw-now { fill: var(--ink); font-weight: 700; }

/* the longest waits */
.mw-waits-card { margin-top: 8px; padding: 22px 26px 16px; }
.mw-waits { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.mw-wait { display: grid; grid-template-columns: minmax(150px, 0.9fr) minmax(0, 2.4fr) 92px minmax(150px, 1fr); gap: 6px 18px; align-items: center; }
.mw-wait-h { display: flex; align-items: baseline; gap: 10px; }
.mw-wait-h b { font: 650 17px var(--mono); color: var(--ink); letter-spacing: -0.03em; }
.mw-wait-h span { font-size: 13px; color: var(--muted); }
.mw-wait-bar { display: block; height: 12px; border-radius: 6px; background: var(--track); overflow: hidden; }
.mw-wait-bar span { display: block; height: 100%; border-radius: 6px; background: var(--line-gray); opacity: 0.75; }
.mw-wait.now .mw-wait-bar span { background: var(--s1); opacity: 1; }
.mw-wait-n { font: 650 18px var(--mono); color: var(--ink); text-align: right; letter-spacing: -0.03em; }
.mw-wait-n small { font: 500 12px var(--font); color: var(--muted); margin-left: 5px; letter-spacing: 0; }
.mw-wait-lost { font-size: 13px; color: var(--muted); }
.mw-wait.now .mw-wait-lost { color: var(--bad); font-weight: 600; }
.mw-waits-foot { margin: 16px 0 0; }
@media (max-width: 720px) {
  .mw-wait { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; }
  .mw-wait-bar { grid-column: 1 / -1; grid-row: 2; }
  .mw-wait-lost { grid-column: 1 / -1; grid-row: 3; }
  .mw-waits-card { padding: 18px 18px 12px; }
}

/* the ranked list of states */
.mw-rank .mw-rk { width: 2.6em; padding-right: 4px; color: var(--muted); text-align: right; }
.mw-rank th[scope="row"] { white-space: normal; min-width: 9em; }
.mw-rank thead th:nth-child(2) { text-align: left; }
.mw-rank td.mw-bar-cell, .mw-rank th.mw-bar-cell { width: 38%; padding-left: 6px; text-align: left; }
.mw-rank tr.mw-fed th[scope="row"] { color: var(--ink-2); font-weight: 500; }
.mw-raises td b { color: var(--ink); font-weight: 650; }
@media (max-width: 560px) { .mw-rank .mw-bar-cell { display: none; } }

/* the legend keeps clear of the full-screen button in the corner */
.art.mw .chart .legend { padding-right: 44px; }