/* Day theme "Flat & crisp". Loaded after styles.css.
   Every rule is scoped to day mode, so night mode is untouched. To drop this
   theme, remove its <link> from index.html. */

:root:not([data-theme="night"]) {
  --bg: #0e0e10;
  --panel: #161618;
  --panel-border: transparent;
  --row-divider: rgba(255,255,255,0.055);
  --card: #1d1d20;
  --radius: 1.1rem;
  --muted: #8f959c;
}

:root:not([data-theme="night"]) .panel { border: 0; padding: 1.4rem 1.75rem; }

:root:not([data-theme="night"]) .strip { border: 0; }

:root:not([data-theme="night"]) .topbar__clock { font-weight: 300; letter-spacing: 0.04em; }

:root:not([data-theme="night"]) .topbar__place,
:root:not([data-theme="night"]) .topbar__date { font-size: 1.5rem; letter-spacing: 0.04em; }

:root:not([data-theme="night"]) .panel__head h2 {
  font-size: 1.1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--muted);
}

:root:not([data-theme="night"]) .panel__sub {
  font-size: 1.1rem;
  letter-spacing: 0.02em;
  text-transform: none;
  color: var(--text);
  margin-left: 0.9rem;
}

:root:not([data-theme="night"]) .panel__head { margin-bottom: 0.5rem; }

:root:not([data-theme="night"]) .row { border-bottom-color: var(--row-divider); padding: 0.7rem 0; }

:root:not([data-theme="night"]) .badge--bus {
  background: transparent;
  color: #ff6b66;
  border: 2px solid var(--bus);
  border-radius: 0.6rem;
}

:root:not([data-theme="night"]) .row--bus .row__dest { font-size: 1.7rem; }

:root:not([data-theme="night"]) .row--bus { grid-template-columns: 5.5rem 1fr 8.5rem; }

:root:not([data-theme="night"]) .row__time { font-size: 2rem; font-weight: 500; white-space: nowrap; }

:root:not([data-theme="night"]) .row__time.due { color: var(--ok); }

:root:not([data-theme="night"]) .station__name {
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 600;
  color: var(--text);
  margin-bottom: 0.4rem;
}

:root:not([data-theme="night"]) #station-bvd .station__name { color: #55c1ee; }

:root:not([data-theme="night"]) #station-abw .station__name { color: #a88fe0; }

:root:not([data-theme="night"]) .station__name .crs { text-transform: none; letter-spacing: 0.02em; color: var(--muted); }

:root:not([data-theme="night"]) .station + .station { border-left-color: var(--row-divider); }

:root:not([data-theme="night"]) .row--train .row__sched { font-size: 1.55rem; font-weight: 500; }

:root:not([data-theme="night"]) .row__plat {
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 1.2rem;
}

:root:not([data-theme="night"]) .row__plat::before { content: "P"; opacity: 0.55; margin-right: 0.1rem; font-size: 0.8em; }

:root:not([data-theme="night"]) .row__status { font-weight: 500; font-size: 1.15rem; }

:root:not([data-theme="night"]) .weather__temp { font-weight: 300; font-size: 5rem; }

:root:not([data-theme="night"]) .weather__icon { font-size: 4rem; }

:root:not([data-theme="night"]) .advice {
  background: transparent;
  border-left: 0;
  border: 1px solid rgba(227,179,65,0.4);
  border-radius: 999px;
  padding: 0.6rem 1.4rem;
}

:root:not([data-theme="night"]) .hourly { --hgap: 0.25rem; }

:root:not([data-theme="night"]) .hourly__h { background: transparent; border-radius: 0.8rem; padding: 0.7rem 0.2rem; }

:root:not([data-theme="night"]) .hourly__h--now { box-shadow: none; background: #23262b; }

:root:not([data-theme="night"]) .hourly__h:not(.hourly__h--now):nth-child(odd) { background: rgba(255,255,255,0.02); }

:root:not([data-theme="night"]) .forecast { gap: 0.5rem; }

:root:not([data-theme="night"]) .forecast__day { background: transparent; border: 1px solid var(--row-divider); border-radius: 0.8rem; }

:root:not([data-theme="night"]) .forecast__day:first-child { background: #23262b; border-color: transparent; }

:root:not([data-theme="night"]) .strip { background: #131315; }

:root:not([data-theme="night"]) .pill {
  border: 0;
  background: transparent;
  padding: 0.4rem 0.2rem;
  font-size: 1.3rem;
}

:root:not([data-theme="night"]) .pill--warn,
:root:not([data-theme="night"]) .pill--bad { background: transparent; }

:root:not([data-theme="night"]) .pill--warn { color: var(--warn); }

:root:not([data-theme="night"]) .pill--bad { color: var(--bad); }

:root:not([data-theme="night"]) .pill--air[data-band="3"],
:root:not([data-theme="night"]) .pill--air[data-band="4"],
:root:not([data-theme="night"]) .pill--air[data-band="5"],
:root:not([data-theme="night"]) .pill--air[data-band="6"] { border: 0; }

:root:not([data-theme="night"]) .pill--pollen[data-level="3"] { border: 0; }

:root:not([data-theme="night"]) .strip__label { letter-spacing: 0.16em; }
