/* ==========================================================================
   DFLV theme: "Is It Safe to Walk" section (homepage).
   Sits inside the DFLV Homepage plugin's homepage markup.
   ========================================================================== */

/* ---------- walk conditions ---------- */
.walk { display: flex; flex-wrap: wrap; gap: 16px; }
.walk-now { flex: 1 1 300px; border-radius: var(--r-lg); padding: 28px; display: flex; flex-direction: column; gap: 8px; }
.walk-now p { margin: 0; }
.walk-label { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); }
.walk-temp { font-family: var(--font-display); font-weight: 800; font-size: 76px; line-height: 1; letter-spacing: -.04em; }
.walk-level { font-size: 16px; font-weight: 700; }
.walk-note { font-size: 14px; line-height: 1.55; color: var(--ink-2); }
.walk-day { flex: 999 1 560px; min-width: 0; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 28px; display: flex; flex-direction: column; gap: 16px; }
.walk-day-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.walk-day-head h3 { margin: 0; font-size: 18px; }
.walk-day-head span { font-size: 13px; color: var(--ink-3); }
.walk-chart { list-style: none; margin: 0; padding: 0; display: flex; align-items: flex-end; gap: 3px; height: 120px; }
.walk-chart li { flex: 1; min-width: 0; height: var(--h, 20%); border-radius: 6px 6px 3px 3px; background: var(--teal); }
.walk-chart .tone-bar-gold { background: var(--gold); }
.walk-chart .tone-bar-coral { background: var(--coral); }
.walk-axis { display: flex; justify-content: space-between; margin-top: -8px; font-size: 12px; color: var(--ink-3); }
.walk-windows { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.walk-legend { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: 13px; color: var(--ink-2); padding: 0 4px; }
.key { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-left: 6px; }
.key--teal { background: var(--teal); }
.key--gold { background: var(--gold); }
.key--coral { background: var(--coral); }
@media (max-width: 640px) {
	.walk-now, .walk-day { padding: 22px; }
	.walk-temp { font-size: 60px; }
}

/* plugin homepage.css is absent when the plugin is off */
.home-fallback .dflv-section { padding: 64px 0; border-bottom: 1px solid var(--line); }
.home-fallback .dflv-wrap { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.home-fallback .dflv-sec-head { margin-bottom: 26px; }
.home-fallback .dflv-label { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }
.home-fallback .dflv-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 8px; background: var(--coral); vertical-align: 1px; }
.home-fallback .dflv-sec-head h2 { margin: 8px 0 0; font-size: 30px; }
.home-fallback .dflv-cond-credit { margin-top: 14px; font-size: 11px; color: var(--ink-3); text-align: right; }