/* LO2 TV — profesjonalny ekran informacyjny, wersja jasna.
   Wyłącznie prezentacja: zastępstwa/ogłoszenia są pobierane jak dotychczas. */
:root {
  --tv-ink: #19334c;
  --tv-ink-dark: #123454;
  --tv-accent: #176da9;
  --tv-muted: #647b91;
  --tv-border: #dce7f1;
  --tv-panel: #ffffff;
  --tv-wash: #f4f8fc;
}
* { box-sizing: border-box; }
html, body.tv-signage-body { height: 100%; }
body.tv-signage-body {
  background: #eef3f8;
  color: var(--tv-ink);
  overflow: hidden !important;
  cursor: none;
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: 18px;
}
.box.tv-display {
  display: grid;
  grid-template-rows: 116px minmax(0,1fr) 164px;
  gap: 10px;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  padding: 10px 12px;
  overflow: hidden;
}

/* GÓRA — czytelny pasek zamiast dużego banera */
.tv-display > .tv-header {
  display: flex;
  align-items: center;
  position: relative;
  min-height: 0;
  gap: 18px;
  padding: 12px 24px;
  margin: 0;
  border: 1px solid var(--tv-border) !important;
  border-radius: 18px;
  background: linear-gradient(110deg, #fff 0%, #f5faff 80%, #edf6fe 100%);
  box-shadow: 0 3px 17px rgba(26,69,107,.06);
  overflow: hidden;
}
.tv-top-accent {
  position: absolute;
  width: 5px;
  left: 0;
  top: 0;
  bottom: 0;
  background: linear-gradient(#2783c1, #69b8dd);
}
.tv-header > .kol {
  padding: 0 !important;
  float: none !important;
  width: auto !important;
  min-width: 0;
}
.tv-header > .tv-head-substitutions {
  flex: 1 1 40%;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding-top: 4px !important;
}
.tv-header > .tv-head-date { flex: 1 1 37%; }
.tv-header h2#zastepstwa {
  font-size: 29px;
  line-height: 1.12;
  color: #183e60;
  font-weight: 800;
  letter-spacing: -.035em;
  margin: 0 0 7px !important;
}
.tv-header #nieobecni {
  font-size: 17px;
  line-height: 1.28;
  color: #607891;
}
.tv-header #nieobecni span {
  display: inline-block;
  color: #17699f;
  font-weight: 700;
  margin-right: 9px;
}
.tv-header #nieobecni span.podswietl { color:#085585; }
.tv-head-date > div { width: 100% !important; }
.tv-head-date > div > div {
  float: none !important;
  max-width: 100% !important;
}
.tv-top-meta {
  gap: 8px 10px;
  margin-bottom: 7px;
}
.tv-header #fData {
  font-size: 20px;
  line-height: 1.15;
  color: #2a5676;
  white-space: normal;
}
.tv-head-date .cytaty p {
  font-size: 15px !important;
  line-height: 1.22 !important;
  color: #63798c;
}
.tv-clock-block {
  flex: 0 0 286px;
  min-width: 0;
  align-self: center;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  margin-left: auto;
  height: 100%;
}
.tv-clock-caption {
  font-size: 11px;
  letter-spacing: .16em;
  font-weight: 800;
  color: #7b91a5;
  margin: 0 4px 5px 0;
}
.tv-clock-block .flipTimer {
  height: 100px;
  min-width: 300px;
  margin: -4px -2px 0 0;
  transform: scale(.78);
  transform-origin: center right;
  flex: initial;
}

/* ŚRODEK — zastępstwa jako główny panel, ogłoszenia jako drugi */
.tv-display > .tv-content {
  display: grid;
  grid-template-columns: minmax(0, 2.13fr) minmax(390px, .87fr);
  gap: 14px;
  min-height: 0;
  width: 100%;
  margin: 0;
  overflow: hidden;
}
.tv-content .kol,
.tv-content .brakzas,
.tv-content .brakzas.infopokaz.lewy,
.tv-content .brakzas.infoukryj {
  display: flex !important;
  flex-direction: column;
  float: none !important;
  flex-grow: initial !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0;
  min-height: 0;
  padding: 0 !important;
  overflow: hidden;
}
.tv-content > .tv-panel {
  position: relative;
  border-radius: 18px;
  background: var(--tv-panel);
  border: 1px solid var(--tv-border);
  box-shadow: 0 5px 22px rgba(39,75,108,.07);
}
.tv-panel-substitutions { border-top: 4px solid var(--tv-accent) !important; }
.tv-panel-news { border-top: 4px solid #67a7d1 !important; }
.tv-panel-head {
  min-height: 54px;
  width: 100%;
  padding: 12px 20px;
  border-bottom: 1px solid #e5edf4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-shrink: 0;
}
.tv-eyebrow {
  display: block;
  color: #7190aa;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .15em;
  margin-bottom: 6px;
}
.tv-panel-head h2 {
  margin: 0;
  padding: 0;
  color: #163956;
  font-size: 22px;
  letter-spacing: -.02em;
  line-height: 1;
  font-weight: 800;
}
.tv-panel-badge {
  color: #1a699e;
  background: #e8f4fc;
  border: 1px solid #d3eafa;
  white-space: nowrap;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
}
.tv-news-dot {
  flex: 0 0 11px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #41a687;
  box-shadow: 0 0 0 5px #e2f6ef;
  margin-right: 7px;
}
.tv-substitution-content {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 0 11px;
}
.tv-substitution-content .rotator {
  width: 100% !important;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}
.tv-substitution-content .tabele {
  width: 100% !important;
  margin-top: 0 !important;
}
.tv-substitution-content .tabele table {
  width: 100%;
  table-layout: auto;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0 !important;
}
.tv-substitution-content .tabele table td {
  padding: 12px 12px;
  border: 0 !important;
  border-bottom: 1px solid #e8edf3 !important;
  background: #fff;
  color: #29435b;
  font-size: clamp(17px,1.12vw,21px) !important;
  line-height: 1.25;
  vertical-align: middle;
}
.tv-substitution-content .tabele tr.tv-day-heading td {
  padding: 7px 14px !important;
  background: #e9f3fc !important;
  border-bottom: 1px solid #d5e7f5 !important;
  color: #235e8b;
  font-size: 21px !important;
  line-height: 1.2;
  text-align: left !important;
}
.tv-substitution-content .tabele tr.tv-day-heading td b { font-weight: 800; }
.tv-substitution-content .tabele tr.tv-column-heading td {
  padding: 6px 11px !important;
  background: #f5f8fc !important;
  color: #6a8197;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 13px !important;
  font-weight: 800;
}
.tv-substitution-content .tabele tr.tv-sub-row:nth-child(even) td {
  background: #f8fbfe;
}
.tv-substitution-content .tabele tr.tv-sub-row td:nth-child(1) {
  white-space: nowrap;
  font-weight: 700;
  color: #1f547d;
}
.tv-substitution-content .tabele tr.tv-sub-row td:nth-child(2) {
  font-weight: 800;
  color: #21455f;
}
.tv-substitution-content .tabele tr.tv-sub-row td:nth-child(4) {
  text-align: center;
  color: #346583;
}
.tv-panel-footer {
  flex: 0 0 auto;
  margin-top: auto;
  padding: 11px 21px;
  text-align: right;
  border-top: 1px solid #e7eef5;
  background: #fbfdff;
  color: #8aa0b4;
  font-size: 13px;
  letter-spacing: .01em;
}
.tv-empty-message {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 14px;
  text-align: center;
  background: radial-gradient(circle at 50% 30%, #f0f8ff 0%, #fff 65%);
  padding: 20px;
}
.tv-empty-icon {
  width: 72px;
  height: 72px;
  background: #e4f5ed;
  border-radius: 24px;
  display: grid;
  place-items: center;
  color: #29946a;
  font-size: 46px;
  font-weight: 800;
}
.tv-empty-message h3 {
  font-size: 32px;
  font-weight: 800;
  color: #2a5577;
}
.tv-empty-message p {
  max-width: 480px;
  font-size: 20px;
  line-height: 1.35;
  color: #778ba0;
}
.tv-panel-substitutions .tv-empty-message + .tv-substitution-content { display: none; }

/* Ogłoszenia: obrazy bez rozciągania i bez ucinania */
.tv-panel-news .tv-news-content,
.tv-panel-news .info {
  flex: 1;
  display: flex;
  min-height: 0;
  width: 100%;
  padding: 14px;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  background: #f8fbfe;
  line-height: normal !important;
}
.tv-news-content > p,
.tv-news-content > div {
  max-height: 100%;
  max-width: 100%;
  overflow: hidden;
}
.tv-news-content > p {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  margin: 0;
}
.tv-panel-news .info img,
.tv-panel-news .info img.obfix {
  display: block;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain;
  margin: auto;
  border-radius: 10px;
  box-shadow: 0 5px 13px rgba(36,63,82,.10);
}
.tv-panel-news .info p { line-height: 1.3 !important; }
.tv-panel-news .sidebar {
  display: none;
}
.tv-panel-news .info.infoukryj { display: none; }
.tv-panel-news.is-no-news .sidebar {
  display: block;
  width: calc(100% - 30px);
  height: calc(100% - 105px);
  margin: 15px;
  background-image: url('logo2.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

/* DÓŁ — jedna linia: numerek, odliczanie, pogoda w prawym dolnym rogu. */
.tv-display > .tv-footer {
  display: grid;
  grid-template-columns: minmax(230px, .7fr) minmax(315px, .95fr) minmax(460px, 1.35fr);
  align-items: center;
  gap: 14px;
  padding: 0 0 0 20px;
  min-width: 0;
  min-height: 0;
  border-radius: 18px;
  background: linear-gradient(105deg, #e7f1fa, #f9fcff 70%, #edf5fa);
  border: 1px solid #d6e5f0;
  box-shadow: 0 4px 15px rgba(25,73,111,.05);
  color: #285a7b;
  position: static;
  width: auto;
  margin: 0;
  overflow: hidden;
}
.tv-footer-lucky,
.tv-footer-timer {
  min-width: 0;
  display: flex;
  align-items: center;
}
.tv-footer-lucky { height: 100%; gap: 12px; }
.tv-footer-lucky .lucky {
  flex: 0 0 78px;
  width: 78px;
  height: 74px;
  background-image: url('lucky.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.tv-lucky-number,
.tv-lucky-number #wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  min-width: 0;
  gap: 10px;
}
.tv-lucky-number #number {
  position: static;
  margin: 0;
  flex-shrink: 0;
  height: 72px;
  width: 72px !important;
  line-height: 72px;
  font-size: 32px;
  text-shadow: 0 1px 1px #fff;
  background-size: 100% 100%;
}
.tv-lucky-number #text {
  line-height: 1.2;
  font-size: 15px;
  text-align: left;
  font-weight: 800;
  color: #285d7d;
}
.tv-footer-timer {
  height: 100%;
  padding: 0 18px 0 24px;
  border-left: 1px solid #cbddea;
  justify-content: center;
  text-align: center;
}
.tv-next-countdown {
  color: #2b617f;
  font-size: clamp(20px,1.55vw,29px);
  line-height: 1.3;
  font-weight: 650;
}
.tv-footer #lekcja2 {
  display: inline-block;
  font-size: clamp(24px,2vw,36px);
  line-height: 1.15;
  font-weight: 800;
  padding: 0 0 0 4px;
  color: #175d8f;
}

/* POGODA — teraz największe, dalej trzy mniejsze prognozy godzinowe. */
.tv-weather-panel {
  --weather-ink: #245978;
  position: relative;
  align-self: stretch;
  min-height: 0;
  min-width: 0;
  border-left: 1px solid #cbddeb;
  background: linear-gradient(115deg, #e9f4fe 0%, #d9edfb 100%);
  color: var(--weather-ink);
  overflow: hidden;
  isolation: isolate;
}
.tv-weather-panel > *:not(.tv-weather-decor) { position: relative; z-index: 1; }
.tv-weather-decor {
  position: absolute;
  right: -18px;
  top: -80px;
  width: 245px;
  height: 245px;
  border-radius: 50%;
  opacity: .55;
  pointer-events: none;
  background: radial-gradient(circle, rgba(255,255,255,.7), transparent 68%);
}
.tv-weather-main {
  display: grid;
  grid-template-columns: minmax(158px, .85fr) minmax(235px, 1.15fr);
  align-items: center;
  gap: 10px;
  height: calc(100% - 36px);
  padding: 10px 14px 4px 18px;
}
.tv-weather-now { min-width: 0; }
.tv-weather-current-caption, .tv-hourly-heading {
  font-size: 11px;
  letter-spacing: .13em;
  font-weight: 800;
  color: #5e849f;
  white-space: nowrap;
}
.tv-weather-hero { display: flex; align-items: center; gap: 9px; margin: 3px 0 2px; }
.tv-weather-icon {
  font-size: clamp(40px, 2.9vw, 52px);
  line-height: 1.05;
  filter: drop-shadow(0 4px 7px rgba(54,105,135,.12));
}
.tv-weather-temp {
  font-size: clamp(43px,3.1vw,58px);
  line-height: 1;
  letter-spacing: -.055em;
  font-weight: 850;
  color: #174f77;
  white-space: nowrap;
}
.tv-weather-description {
  color: #476f8b;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
}
.tv-hourly-wrap { min-width: 0; padding-left: 12px; border-left: 1px solid rgba(87,135,164,.2); }
.tv-hourly-forecast { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; margin-top: 9px; }
.tv-hour {
  border: 1px solid rgba(122,164,189,.28);
  border-radius: 12px;
  background: rgba(255,255,255,.5);
  padding: 6px 2px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 0;
}
.tv-hour-label { font-size: 12px; color: #416c88; font-weight: 750; }
.tv-hour-icon { font-size: 22px; line-height: 1.06; }
.tv-hour strong { font-size: 18px; font-weight: 800; color: #245f89; }

/* Wskaźnik jakości powietrza jako dolny wiersz karty pogody. */
.tv-air-inline {
  height: 36px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 18px;
  background: rgba(255,255,255,.32);
  border-top: 1px solid rgba(100,150,185,.22);
  font-size: 13px;
  color: #436983;
  white-space: nowrap;
}
.tv-air-inline b { font-weight: 800; color: #235977; }
.tv-air-dot { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: #a6b8c7; }
.tv-air-dot[data-state="good"] { background: #23ad75; }
.tv-air-dot[data-state="medium"] { background: #dfa021; }
.tv-air-dot[data-state="bad"] { background: #e05e58; }
.tv-air-aqi { padding: 3px 7px; border-radius: 6px; background: rgba(255,255,255,.45); font-size: 11px; font-weight: 700; }
.tv-weather-source { margin-left: auto; font-size: 10px; color: #6f94aa; }

/* Motywy pogodowe — delikatne zmiany nastroju; czytelność tabel nie zależy od pogody. */
.tv-weather-panel[data-weather="sunny"] {
  --weather-ink: #70511f;
  background: linear-gradient(117deg, #fff8e5, #ffe9aa 75%, #fbd58f);
  border-left-color: #f1d18b;
}
.tv-weather-panel[data-weather="sunny"] .tv-weather-decor {
  opacity: .75;
  background: radial-gradient(circle, rgba(255,245,172,.9) 0 17%, rgba(255,207,89,.32) 23%, rgba(255,208,99,.14) 53%, transparent 72%);
}
.tv-weather-panel[data-weather="sunny"] .tv-weather-temp,
.tv-weather-panel[data-weather="sunny"] .tv-hour strong { color: #9b5d16; }
.tv-weather-panel[data-weather="sunny"] .tv-weather-description,
.tv-weather-panel[data-weather="sunny"] .tv-hour-label,
.tv-weather-panel[data-weather="sunny"] .tv-hourly-heading { color: #926c36; }
.tv-weather-panel[data-weather="sunny"] .tv-hour { border-color: rgba(208,151,51,.24); background: rgba(255,255,255,.48); }
.tv-weather-panel[data-weather="cloudy"] { background: linear-gradient(115deg, #e8f0f6, #d2e0ec); }
.tv-weather-panel[data-weather="rain"] { background: linear-gradient(110deg, #dcebf7, #b8d5ed); }
.tv-weather-panel[data-weather="rain"] .tv-weather-decor { background: repeating-linear-gradient(110deg, transparent, transparent 14px, rgba(80,132,172,.10) 15px, transparent 17px); }
.tv-weather-panel[data-weather="snow"] { background: linear-gradient(110deg, #f1f9ff, #d9eefb); }
.tv-weather-panel[data-weather="night"] { background: linear-gradient(110deg, #e4eafa, #c6d8f3); }
.tv-weather-panel[data-weather="storm"] { background: linear-gradient(110deg, #e8e6f4, #cfd4eb); }
body.tv-signage-body[data-weather="sunny"] .tv-display > .tv-header { background: linear-gradient(110deg, #fff, #fffaf0); }
body.tv-signage-body[data-weather="rain"] .tv-display > .tv-header { background: linear-gradient(110deg, #fff, #edf6ff); }
body.tv-signage-body[data-weather="sunny"] .tv-top-accent { background: linear-gradient(#efb44f,#f7d587); }

@media (max-width: 1550px) {
  .box.tv-display { grid-template-rows: 108px minmax(0,1fr) 152px; gap: 9px; padding: 9px; }
  .tv-display > .tv-content { grid-template-columns: minmax(0,2.1fr) minmax(350px,.9fr); gap: 9px; }
  .tv-header h2#zastepstwa { font-size: 26px; }
  .tv-display > .tv-header { gap: 12px; padding: 10px 18px; }
  .tv-clock-block { flex-basis: 254px; }
  .tv-clock-block .flipTimer { transform: scale(.71); }
  .tv-panel-head { min-height: 48px; padding: 10px 16px; }
  .tv-panel-head h2 { font-size: 21px; }
  .tv-substitution-content .tabele table td { font-size: 17px !important; padding: 11px 9px; }
  .tv-display > .tv-footer { grid-template-columns: minmax(205px,.67fr) minmax(260px,.88fr) minmax(440px,1.45fr); gap: 6px; padding-left: 12px; }
  .tv-weather-main { padding-left: 12px; padding-right: 10px; }
  .tv-footer-timer { padding: 0 10px 0 16px; }
  .tv-footer-lucky .lucky { flex-basis: 67px; width: 67px; }
  .tv-lucky-number #number { width: 64px !important; height: 64px; line-height: 64px; }
}
@media (max-width: 1150px) {
  .tv-head-date .cytaty { display: none; }
  .tv-header #fData { font-size: 17px; }
  .tv-display > .tv-content { grid-template-columns: minmax(0,1.7fr) minmax(310px,.85fr); }
  .tv-display > .tv-footer { grid-template-columns: minmax(135px,.45fr) minmax(180px,.8fr) minmax(385px,1.55fr); }
  .tv-lucky-number #text { display: none; }
  .tv-weather-main { grid-template-columns: minmax(120px,.75fr) minmax(220px,1.25fr); }
  .tv-weather-source { display: none; }
  .tv-next-countdown { font-size: 20px; }
}

/* LO2 TV v5 — kompaktowy nagłówek, pełnowymiarowe ogłoszenia, stabilny zegar */
.box.tv-display {
  grid-template-rows: 88px minmax(0,1fr) 150px;
  gap: 8px;
  padding: 8px 10px;
}
.tv-display > .tv-header {
  padding: 6px 13px;
  gap: 12px;
  border-radius: 15px;
}
.tv-header > .tv-head-substitutions { padding-top: 0 !important; }
.tv-header h2#zastepstwa { font-size: 26px; margin-bottom: 3px !important; }
.tv-header #nieobecni { font-size: 16px; line-height: 1.13; }
.tv-head-date .tv-top-meta { margin-bottom: 3px; }
.tv-header #fData { font-size: 18px; line-height: 1.12; }
.tv-head-date .cytaty p { font-size: 14px !important; line-height: 1.13 !important; }
.tv-head-date .cytaty { margin: 0; }
.tv-clock-block {
  flex: 0 0 288px;
  min-width: 288px;
  max-width: 288px;
  height: 100%;
  overflow: visible;
  align-items: flex-end;
}
.tv-digital-clock {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 2px;
  width: max-content;
  white-space: nowrap;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.tv-clock-digit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 69px;
  flex: 0 0 56px;
  border-radius: 7px;
  border: 1px solid #29343f;
  background: linear-gradient(to bottom,#33363d 0%,#15191f 49.4%,#62676c 50%,#22262c 50.8%,#1d2026 100%);
  box-shadow: inset 0 2px 3px rgba(255,255,255,.12),0 2px 6px rgba(25,53,77,.14);
  color: #fff;
  font-size: 59px;
  font-family: "Arial Narrow", "Segoe UI", Arial, sans-serif;
  font-weight: 780;
  letter-spacing: -2px;
}
.tv-clock-colon {
  flex: 0 0 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 59px;
  font-weight: 700;
  line-height: 1;
  color: #2c3c4b;
  padding-bottom: 7px;
}
/* Usunięty nagłówek ogłoszeń: grafika wypełnia cały zaokrąglony panel. */
.tv-display > .tv-content { gap: 10px; }
.tv-panel-news { overflow: hidden; isolation: isolate; }
.tv-panel-news .tv-news-content,
.tv-panel-news .info {
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 0 15px 15px;
  background: #fff;
}
.tv-panel-news .info > p,
.tv-panel-news .info > div {
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  margin: 0;
}
.tv-panel-news .info img,
.tv-panel-news .info img.obfix {
  height: 100% !important;
  max-height: 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  object-fit: contain;
  border-radius: 0;
  box-shadow: none;
}
.tv-panel-news.is-no-news .sidebar {
  height: calc(100% - 24px);
  width: calc(100% - 24px);
  margin: 12px;
}
/* Wskaźnik powietrza pod odliczaniem, nie przy ikonie pogody. */
.tv-footer-timer {
  flex-direction: column;
  justify-content: center;
  gap: 9px;
  align-items: center;
}
.tv-next-countdown { text-align: center; }
.tv-footer-timer .tv-air-inline {
  width: 100%;
  height: auto;
  min-height: 24px;
  padding: 2px 0 0;
  justify-content: center;
  background: transparent;
  border-top: 1px solid #d8e6f0;
  font-size: 14px;
  white-space: normal;
}
.tv-footer-timer .tv-air-aqi { white-space: nowrap; }
.tv-weather-main { height: 100%; padding-bottom: 10px; }
.tv-weather-panel { border-radius: 0 15px 15px 0; }
@media (max-width: 1550px) {
  .box.tv-display { grid-template-rows: 80px minmax(0,1fr) 143px; }
  .tv-display > .tv-header { padding: 5px 11px; gap: 9px; }
  .tv-clock-block { flex: 0 0 249px; min-width: 249px; max-width: 249px; }
  .tv-clock-digit { width: 48px; flex-basis: 48px; height: 59px; font-size: 51px; }
  .tv-clock-colon { flex-basis: 15px; font-size: 50px; }
  .tv-header h2#zastepstwa { font-size: 23px; }
  .tv-header #nieobecni { font-size: 15px; }
  .tv-head-date .cytaty p { font-size: 13px !important; }
  .tv-footer-timer { padding: 0 9px 0 12px; }
}
@media (max-width: 1150px) {
  .tv-clock-block { flex: 0 0 202px; min-width: 202px; max-width: 202px; }
  .tv-clock-digit { width: 38px; flex-basis: 38px; height: 50px; font-size: 40px; }
  .tv-clock-colon { flex-basis: 12px; font-size: 41px; padding-bottom: 4px; }
  .tv-footer-timer .tv-air-inline { font-size: 12px; }
}
.tv-panel-news .tv-news-content, .tv-panel-news .info { background: #f7efdf; }


/* LO2 TV v6 — oryginalna typografia zegara, zwięzły pasek i prognoza. */
.tv-clock-digit,
.tv-clock-colon {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
  letter-spacing: -1px;
  font-variant-numeric: tabular-nums;
}

/* Więcej miejsca dla zastępstw i treści w środku ekranu. */
.box.tv-display {
  grid-template-rows: 88px minmax(0, 1fr) 112px;
}
.tv-display > .tv-footer {
  grid-template-columns: minmax(210px, .72fr) minmax(400px, 1.6fr) minmax(450px, 1.45fr);
  gap: 5px;
  padding-left: 12px;
}
.tv-footer-lucky { gap: 8px; }
.tv-footer-lucky .lucky {
  flex: 0 0 61px;
  width: 61px;
  height: 57px;
}
.tv-lucky-number, .tv-lucky-number #wrapper { gap: 7px; }
.tv-lucky-number #number {
  width: 61px !important;
  height: 61px;
  line-height: 61px;
  font-size: 29px;
}
.tv-lucky-number #text { font-size: 14px; }

/* Odliczanie to główny element środka dolnego paska. */
.tv-footer-timer {
  padding: 0 10px;
  gap: 3px;
  border-left: 1px solid #d5e3ed;
}
.tv-next-countdown {
  font-size: clamp(21px, 1.6vw, 29px);
  line-height: 1.12;
  white-space: nowrap;
}
.tv-footer #lekcja2 {
  font-size: clamp(25px, 2.05vw, 37px);
  line-height: 1;
  padding-left: 3px;
}
.tv-footer-timer .tv-air-inline {
  min-height: 18px;
  padding: 0;
  border-top: 0;
  gap: 6px;
  font-size: 12px;
  line-height: 1.1;
}
.tv-footer-timer .tv-air-aqi {
  font-size: 11px;
  padding: 1px 5px;
}

/* Pogoda: brak zbędnego tytułu, przezroczyste godziny bez ramek. */
.tv-weather-main {
  grid-template-columns: minmax(144px, .9fr) minmax(204px, 1.1fr);
  gap: 4px;
  padding: 6px 12px 6px 14px;
  height: 100%;
  align-items: center;
}
.tv-weather-hero { gap: 5px; margin: 1px 0; }
.tv-weather-icon { font-size: clamp(34px, 2.4vw, 45px); }
.tv-weather-temp { font-size: clamp(39px, 2.8vw, 52px); }
.tv-weather-description { font-size: 13px; }
.tv-hourly-wrap { padding-left: 8px; border-left: 0; }
.tv-hourly-forecast {
  gap: 3px;
  margin-top: 0;
  align-items: center;
}
.tv-weather-panel .tv-hour,
.tv-weather-panel[data-weather="sunny"] .tv-hour {
  border: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  padding: 1px 1px;
  gap: 1px;
}
.tv-hour-label { font-size: 12px; }
.tv-hour-icon { font-size: 21px; }
.tv-hour strong { font-size: 17px; }

@media (max-width: 1550px) {
  .box.tv-display { grid-template-rows: 80px minmax(0,1fr) 106px; }
  .tv-display > .tv-footer {
    grid-template-columns: minmax(166px, .65fr) minmax(360px, 1.56fr) minmax(425px, 1.5fr);
    gap: 3px;
    padding-left: 8px;
  }
  .tv-footer-lucky { gap: 5px; }
  .tv-footer-lucky .lucky { flex-basis: 51px; width: 51px; height: 50px; }
  .tv-lucky-number #number { width: 52px !important; height: 52px; line-height: 52px; font-size: 26px; }
  .tv-lucky-number #text { font-size: 13px; }
  .tv-footer-timer { padding: 0 6px; gap: 3px; }
  .tv-next-countdown { font-size: clamp(18px, 1.55vw, 24px); }
  .tv-footer #lekcja2 { font-size: clamp(22px, 2.2vw, 32px); }
  .tv-weather-main { grid-template-columns: minmax(135px, .92fr) minmax(185px, 1.08fr); padding: 4px 8px; gap: 2px; }
  .tv-weather-description { font-size: 12px; }
}
@media (max-width: 1150px) {
  .tv-display > .tv-footer { grid-template-columns: minmax(116px, .5fr) minmax(290px, 1.42fr) minmax(345px, 1.4fr); }
  .tv-next-countdown { font-size: 18px; }
  .tv-footer #lekcja2 { font-size: 23px; }
  .tv-weather-main { grid-template-columns: minmax(100px, .82fr) minmax(180px, 1.18fr); }
  .tv-weather-temp { font-size: 36px; }
  .tv-weather-icon { font-size: 31px; }
  .tv-hour-icon { font-size: 18px; }
  .tv-hour strong { font-size: 15px; }
}

/* LO2 TV v7 — ciasny pasek, absolutny numerek, większa prognoza, ostrzeżenia AQI. */
.tv-header > .tv-head-substitutions { padding: 0 !important; }
.tv-header #fData { font-size: 21px !important; line-height: 1.1; }
.tv-head-date .cytaty p { font-size: 15px !important; line-height: 1.13 !important; }
.tv-display > .tv-header { gap: 10px; padding: 4px 12px; }
.tv-head-date .tv-top-meta { margin-bottom: 2px; }

/* Nie zajmujemy osobnej kolumny na numerek — odliczanie zyskuje miejsce. */
.box.tv-display { grid-template-rows: 80px minmax(0,1fr) 84px; }
.tv-display > .tv-footer {
  position: relative;
  overflow: hidden;
  grid-template-columns: minmax(0,1fr) minmax(390px,39%);
  gap: 0;
  padding: 0 0 0 clamp(170px, 13vw, 215px);
}
.tv-footer-lucky {
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
  height: 67px;
  width: clamp(153px, 12vw, 205px);
  display: flex;
  gap: 5px;
  z-index: 2;
  align-items: center;
  justify-content: flex-start;
}
.tv-footer-lucky .lucky { flex: 0 0 54px; width: 54px; height: 52px; }
.tv-lucky-number, .tv-lucky-number #wrapper { gap: 6px; }
.tv-lucky-number #number {
  position: static;
  margin: 0;
  flex: 0 0 56px;
  width: 56px !important;
  height: 56px;
  line-height: 56px;
  font-size: 27px;
}
.tv-lucky-number #text { font-size: 13px; line-height: 1.06; }

.tv-footer-timer {
  padding: 3px 11px;
  height: 100%;
  min-width: 0;
  border-left: 0;
  gap: 4px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.tv-next-countdown { font-size: clamp(21px,1.7vw,30px); line-height: 1.06; white-space: nowrap; }
.tv-footer #lekcja2 { font-size: clamp(26px,2.05vw,38px); line-height: 1; }
.tv-footer-timer .tv-air-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 4px 8px;
  width: 100%;
  min-height: 20px;
  padding: 0;
  font-size: clamp(14px,1vw,17px);
  line-height: 1.12;
  border: 0;
  background: none;
  white-space: normal;
}
.tv-footer-timer .tv-air-inline b { font-size: inherit; }
.tv-footer-timer .tv-air-aqi { font-size: 13px; padding: 1px 5px; }
.tv-footer-timer .tv-air-dot { width: 10px; height: 10px; flex-basis: 10px; }
.tv-air-alert {
  font-size: clamp(11px,.85vw,14px);
  line-height: 1.1;
  font-weight: 800;
  white-space: nowrap;
}
.tv-air-alert[hidden] { display: none !important; }
.tv-air-alert[data-level="warning"] { color: #936000; }
.tv-air-alert[data-level="danger"] {
  color: #ac181f;
  background: #ffe9e9;
  padding: 2px 7px;
  border-radius: 5px;
  border: 1px solid #e9a9ad;
}

/* Ikony na kolejnych godzinach nie są absolutnie pozycjonowane:
   pozostają większe, ale nie nakładają się na temperaturę ani godzinę. */
.tv-weather-main { height: 100%; padding: 3px 11px 3px 13px; gap: 4px; }
.tv-weather-hero { margin: 1px 0; }
.tv-weather-icon { font-size: clamp(34px,2.6vw,46px); line-height: 1; }
.tv-weather-temp { font-size: clamp(39px,2.8vw,53px); }
.tv-weather-description { font-size: 12px; line-height: 1.1; }
.tv-hourly-wrap { padding-left: 6px; }
.tv-hourly-forecast { gap: 2px; }
.tv-hour-label { font-size: 12px; }
.tv-hour-icon { font-size: clamp(26px,1.7vw,31px); line-height: 1; }
.tv-hour strong { font-size: clamp(17px,1.1vw,20px); }
.tv-weather-panel .tv-hour, .tv-weather-panel[data-weather="sunny"] .tv-hour { padding: 0; gap: 1px; }

@media (max-width: 1550px) {
  .box.tv-display { grid-template-rows: 75px minmax(0,1fr) 78px; }
  .tv-display > .tv-footer {
    grid-template-columns: minmax(0,1fr) minmax(365px,40%);
    padding-left: 164px;
  }
  .tv-footer-lucky { left: 7px; width: 155px; gap: 3px; }
  .tv-footer-lucky .lucky { flex-basis: 45px; width: 45px; height: 46px; }
  .tv-lucky-number #number { flex-basis: 49px; width: 49px !important; height: 49px; line-height: 49px; font-size: 26px; }
  .tv-lucky-number #text { font-size: 12px; }
  .tv-next-countdown { font-size: clamp(20px,1.65vw,25px); }
  .tv-footer #lekcja2 { font-size: clamp(24px,2.1vw,32px); }
  .tv-footer-timer .tv-air-inline { font-size: 15px; }
  .tv-air-alert { font-size: 12px; }
  .tv-hour-icon { font-size: 27px; }
  .tv-weather-main { grid-template-columns: minmax(120px,.87fr) minmax(208px,1.13fr); padding: 2px 7px; }
}
@media (max-width: 1150px) {
  .box.tv-display { grid-template-rows: 73px minmax(0,1fr) 76px; }
  .tv-display > .tv-footer {
    grid-template-columns: minmax(0,1fr) minmax(340px,42%);
    padding-left: 119px;
  }
  .tv-footer-lucky { width: 113px; }
  .tv-footer-lucky .lucky { flex-basis: 34px; width: 34px; height: 38px; }
  .tv-lucky-number #number { flex-basis: 48px; width: 48px !important; height: 48px; line-height: 48px; }
  .tv-lucky-number #text { display: none; }
  .tv-next-countdown { font-size: 18px; }
  .tv-footer #lekcja2 { font-size: 23px; }
  .tv-footer-timer .tv-air-inline { font-size: 13px; gap: 2px 5px; }
  .tv-air-alert { font-size: 11px; }
  .tv-weather-main { grid-template-columns: minmax(105px,.84fr) minmax(195px,1.16fr); }
  .tv-hour-icon { font-size: 24px; }
}

/* LO2 TV v8 — wyrównanie paneli, mniej odstępów, dół bez własnego tła. */
.tv-display > .tv-header {
  padding: 4px 12px 0 15px;
}
.tv-substitution-content {
  padding: 0;
}

/* Dzielimy dół w tej samej proporcji co środkowe panele.
   Początek pogody pokrywa się z lewą krawędzią panelu informacji. */
.tv-display > .tv-footer {
  grid-template-columns: minmax(0, 2.13fr) minmax(390px, .87fr);
  gap: 10px;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
}
.tv-footer-timer {
  padding-left: clamp(170px, 13vw, 215px);
}
.tv-weather-panel {
  border-left-color: #67a7d1;
  border-radius: 15px;
}

@media (max-width: 1550px) {
  .tv-display > .tv-footer {
    grid-template-columns: minmax(0, 2.1fr) minmax(350px, .9fr);
    gap: 10px;
    padding: 0;
  }
  .tv-footer-timer { padding-left: 164px; }
}
@media (max-width: 1150px) {
  .tv-display > .tv-footer {
    grid-template-columns: minmax(0, 1.7fr) minmax(310px, .85fr);
    gap: 10px;
    padding: 0;
  }
  .tv-footer-timer { padding-left: 119px; }
}

/* LO2 TV v9 — przezroczysta prognoza, większy napis AQI i Lucky Number nad kulą. */
.tv-display > .tv-footer .tv-weather-panel,
.tv-display > .tv-footer .tv-weather-panel[data-weather] {
  background: transparent;
  background-image: none;
  border: 0;
  border-left: 1px solid #67a7d1;
  border-radius: 0;
  box-shadow: none;
}
.tv-weather-panel .tv-weather-decor {
  display: none;
}

.tv-footer-timer .tv-air-inline,
.tv-footer-timer .tv-air-inline b {
  font-size: clamp(17px, 1.23vw, 21px);
  line-height: 1.16;
}
.tv-footer-timer .tv-air-aqi {
  font-size: clamp(14px, 1vw, 17px);
  padding: 2px 6px;
}
.tv-footer-timer .tv-air-alert {
  font-size: clamp(11px, .85vw, 14px);
}

/* Banner graficzny nad kulą, jak w pierwotnej stronie TV. */
.tv-display > .tv-footer { overflow: visible; }
.tv-footer-lucky {
  display: block;
  top: 0;
  left: 12px;
  width: 148px;
  height: 100%;
  transform: none;
}
.tv-footer-lucky .lucky {
  position: absolute;
  z-index: 2;
  top: -31px;
  left: 0;
  width: 142px;
  height: 65px;
  background-image: url('lucky.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left bottom;
  flex: none;
}
.tv-footer-lucky .tv-lucky-number {
  position: absolute;
  z-index: 1;
  top: 19px;
  left: 38px;
  display: block;
}
.tv-footer-lucky .tv-lucky-number #wrapper {
  display: block;
  width: 64px;
  height: 64px;
}
.tv-footer-lucky .tv-lucky-number #number {
  display: block;
  width: 64px !important;
  height: 64px;
  line-height: 64px;
  font-size: 30px;
  margin: 0;
}
.tv-footer-lucky .tv-lucky-number #text { display: none; }

@media (max-width: 1550px) {
  .tv-footer-lucky { left: 7px; width: 134px; }
  .tv-footer-lucky .lucky { top: -27px; width: 132px; height: 60px; }
  .tv-footer-lucky .tv-lucky-number { top: 19px; left: 34px; }
  .tv-footer-lucky .tv-lucky-number #wrapper { width: 56px; height: 56px; }
  .tv-footer-lucky .tv-lucky-number #number {
    width: 56px !important;
    height: 56px;
    line-height: 56px;
    font-size: 28px;
  }
  .tv-footer-timer .tv-air-inline,
  .tv-footer-timer .tv-air-inline b { font-size: 17px; }
  .tv-footer-timer .tv-air-aqi { font-size: 15px; }
}
@media (max-width: 1150px) {
  .tv-footer-lucky .lucky { width: 112px; height: 53px; top: -22px; }
  .tv-footer-lucky .tv-lucky-number { left: 27px; }
  .tv-footer-timer .tv-air-inline,
  .tv-footer-timer .tv-air-inline b { font-size: 15px; }
}

/* LO2 TV v10 — cztery prognozy co 2 godziny, bez linii z lewej. */
.tv-display > .tv-footer .tv-weather-panel,
.tv-display > .tv-footer .tv-weather-panel[data-weather] {
  border: 0;
  border-left: 0;
}
.tv-weather-panel .tv-hourly-forecast {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* Jeden rozmiar numerka i logo niezależnie od szerokości telewizora. */
.tv-footer-lucky .lucky {
  top: -34px;
  width: 132px;
  height: 60px;
}
.tv-footer-lucky .tv-lucky-number #wrapper {
  width: 64px;
  height: 64px;
}
.tv-footer-lucky .tv-lucky-number #number {
  width: 64px !important;
  height: 64px;
  line-height: 63px;
  font-size: 28px;
}

/* Pełny opis aktualnej pogody pozostaje widoczny nawet przy dużym ekranie. */
.tv-display > .tv-footer .tv-weather-panel { overflow: visible; }
/* LO2 TV v11 — spokojniejsza kolorystyka: granat, morski błękit, ciepła biel.
   Bez zmian wymiarów, układu, danych i skryptów. */
:root {
  --tv-ink: #253e51;
  --tv-ink-dark: #1c4059;
  --tv-accent: #207789;
  --tv-muted: #617d8b;
  --tv-border: #d9e4e8;
  --tv-panel: #ffffff;
  --tv-wash: #f4f7f7;
}
body.tv-signage-body {
  background: #eef2f3;
  color: #253e51;
}
.tv-display > .tv-header,
body.tv-signage-body[data-weather="sunny"] .tv-display > .tv-header,
body.tv-signage-body[data-weather="rain"] .tv-display > .tv-header {
  background: linear-gradient(110deg, #ffffff 0%, #fbfcfb 65%, #f6f9f9 100%);
  border-color: #d8e3e7 !important;
  box-shadow: 0 2px 12px rgba(39, 70, 78, .035);
}
.tv-display > .tv-header .tv-top-accent,
body.tv-signage-body[data-weather="sunny"] .tv-top-accent {
  background: linear-gradient(180deg, #1e7186, #6dbdb8);
}
.tv-header h2#zastepstwa,
.tv-header #fData { color: #22465d; }
.tv-header #nieobecni { color: #71818d; }
.tv-header #nieobecni span,
.tv-header #nieobecni span.podswietl { color: #18778c; }
.tv-head-date .cytaty p { color: #6a7f89; }

.tv-content > .tv-panel {
  border-color: #d9e4e8;
  box-shadow: 0 4px 16px rgba(42, 69, 78, .045);
}
.tv-panel-substitutions { border-top-color: #21788a !important; }
.tv-panel-news { border-top-color: #c5a375 !important; }
.tv-substitution-content .tabele tr.tv-day-heading td {
  background: #eaf3f3 !important;
  color: #276a7c;
  border-bottom-color: #d4e8e7 !important;
}
.tv-substitution-content .tabele tr.tv-column-heading td {
  background: #f3f6f6 !important;
  color: #667d88;
  border-bottom-color: #e1e8e9 !important;
}
.tv-substitution-content .tabele table td {
  color: #324a58;
  border-bottom-color: #e5ebec !important;
}
.tv-substitution-content .tabele tr.tv-sub-row:nth-child(even) td { background: #f8faf9; }
.tv-substitution-content .tabele tr.tv-sub-row td:nth-child(1),
.tv-substitution-content .tabele tr.tv-sub-row td:nth-child(2) { color: #24485d; }
.tv-substitution-content .tabele tr.tv-sub-row td:nth-child(4) { color: #396e78; }
.tv-panel-news .tv-news-content, .tv-panel-news .info { background: #faf7f0; }

.tv-next-countdown { color: #2b5565; }
.tv-footer #lekcja2 { color: #186e83; }
.tv-footer-timer .tv-air-inline,
.tv-footer-timer .tv-air-inline b { color: #376878; }
.tv-footer-timer .tv-air-aqi {
  background: #e2eeee;
  color: #276b75;
}
.tv-weather-current-caption, .tv-hour-label { color: #587f8b; }
.tv-weather-panel .tv-weather-temp,
.tv-weather-panel .tv-hour strong { color: #1c6b82; }
.tv-weather-panel .tv-weather-description { color: #4f7581; }
.tv-weather-panel[data-weather="sunny"] .tv-weather-temp,
.tv-weather-panel[data-weather="sunny"] .tv-hour strong { color: #b67c2b; }
.tv-weather-panel[data-weather="sunny"] .tv-hour-label { color: #8c7752; }

/* LO2 TV v12 — ciemniejszy cytat i czytelniejsza pogoda / AQI. */
.tv-display > .tv-header .tv-head-date .cytaty p {
  color: #22282b !important;
}
/* Transformacja nie wpływa na wymiary wiersza prognozy ani wysokość stopki. */
.tv-display .tv-weather-panel .tv-hour-icon {
  display: inline-block;
  transform: scale(1.3);
  transform-origin: center;
}
.tv-display .tv-footer-timer .tv-air-inline,
.tv-display .tv-footer-timer .tv-air-inline b {
  font-size: clamp(20px, 1.27vw, 23px);
  line-height: 1.12;
}
@media (max-width: 1150px) {
  .tv-display .tv-footer-timer .tv-air-inline,
  .tv-display .tv-footer-timer .tv-air-inline b {
    font-size: 17px;
  }
}

/* LO2 TV v13 — delikatne korekty położenia, bez zwiększania belki. */
.tv-display .tv-next-countdown {
  line-height: 1.5;
}
/* Podnosi całą stopkę o 5 px, bez zmiany jej wysokości w siatce. */
.tv-display > .tv-footer {
  top: -5px;
}
/* v14 — tylko dolne wartości temperatury prognoz przesunięte o 3 px.
   Godziny, ikony i cała sekcja prognozy pozostają bez zmian. */
.tv-display .tv-weather-panel .tv-hourly-forecast {
  transform: none;
}
.tv-display .tv-weather-panel .tv-hour strong {
  position: relative;
  top: 3px;
}

/* LO2 TV v15 — pozycje i rozmiary Lucky Number. */
.tv-footer-lucky {
  left: 7px;
  width: 134px;
}
.tv-footer-lucky .lucky {
  top: -50px;
  width: 132px;
  height: 60px;
}
.tv-footer-lucky .tv-lucky-number {
  top: 4px;
  left: 34px;
}
/* Kontener kuli musi być równie duży jak sama kula, by jej nie przycinać. */
.tv-footer-lucky .tv-lucky-number #wrapper {
  width: 71px;
  height: 72px;
}
.tv-footer-lucky .tv-lucky-number #number {
  width: 71px !important;
  height: 72px;
  line-height: 70px;
  font-size: 28px;
}

/* TV v17: oryginalne emoji pogodowe, z zachowaniem aktywnego nauczyciela. */
.tv-display .tv-header #nieobecni span { font-weight: 400; }
.tv-display .tv-header #nieobecni span.podswietl { font-weight: 800; }


/* TV v18 — kolory prognozy jak na pierwotnym zrzucie.
   Stały morski błękit także przy słonecznym motywie, bez żółto-brązowych nadpisań. */
.tv-display .tv-weather-panel .tv-weather-current-caption,
.tv-display .tv-weather-panel .tv-hour-label {
  color: #587f8b;
}
.tv-display .tv-weather-panel .tv-weather-temp,
.tv-display .tv-weather-panel .tv-hour strong {
  color: #1c6b82;
}


/* TV v19 — precyzyjne ustawienia nagłówka i prognozy. */
.tv-display > .tv-header > .tv-head-substitutions {
  flex: 1 1 60%;
}

/* Nauczyciel (imię + nazwisko) zawsze w całości;
   lista może zawijać się pomiędzy kolejnymi osobami. */
.tv-display .tv-header #nieobecni span {
  display: inline-block;
  white-space: nowrap;
}


/* Jednolity kolor bieżącej i czterech przyszłych temperatur. */
.tv-display .tv-weather-panel .tv-weather-temp,
.tv-display .tv-weather-panel .tv-hour strong {
  color: #587f8b;
}

/* TV v20 — wspólny kolor cytatu i listy nieobecnych. */
.tv-display .tv-header #nieobecni,
.tv-display .tv-header #nieobecni span,
.tv-display .tv-header #nieobecni span.podswietl,
.tv-display > .tv-header .tv-head-date .cytaty p {
  color: #324a58 !important;
}

/* TV v22 — dopracowanie typografii, tabeli i położenia pogody. */
.tv-header #nieobecni {
  font-size: 16px;
}

.tv-display .tv-weather-panel .tv-hourly-wrap {
  position: relative;
  top: -10px;
}

.tv-display .tv-weather-panel .tv-weather-now {
  position: relative;
  top: -5px;
}

.tv-display .tv-weather-panel .tv-hour-icon {
  font-size: 30px;
  padding-bottom: 5px;
}

.tv-display .tv-weather-panel .tv-weather-description {
  font-size: 13px;
  line-height: 1.7;
}

.tv-display .tv-weather-panel .tv-weather-icon {
  font-size: clamp(38px, 3.6vw, 54px);
}

.tv-substitution-content .tabele table td {
  font-size: 19px !important;
  padding: 9px 9px;
}

.tv-substitution-content .tabele tr.tv-column-heading td {
  font-size: 17px !important;
}


/* TV v23 — odstępy pogody jak na wskazanym zrzucie (bez podmieniania emoji).
   Cztery godziny mają równe kolumny; godzina / ikona / temperatura
   mają stałe wysokości i nie zmieniają odstępów zależnie od przeglądarki. */
.tv-display .tv-weather-panel .tv-weather-main {
  grid-template-columns: minmax(125px, .44fr) minmax(0, 1fr);
  gap: 0;
}
.tv-display .tv-weather-panel .tv-hourly-wrap {
  padding-left: 0;
  top: -6px; /* v24: 9 px wyżej niż w v23 (było +3px) */
}
.tv-display .tv-weather-panel .tv-hourly-forecast {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  align-items: start;
}
.tv-display .tv-weather-panel .tv-hour {
  justify-content: flex-start;
  gap: 0;
  padding: 0;
}
.tv-display .tv-weather-panel .tv-hour-label {
  height: 17px;
  line-height: 17px;
  white-space: nowrap;
}
.tv-display .tv-weather-panel .tv-hour-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 53px;
  width: 100%;
  line-height: 1;
  padding-bottom: 0;
}
.tv-display .tv-weather-panel .tv-hour strong {
  top: 0;
  line-height: 22px;
}
/* Tylko ikonka i temperatura bieżącej pogody idą 6 px wyżej. */
.tv-display .tv-weather-panel .tv-weather-hero {
  position: relative;
  top: -6px;
}

/* TV v24 — wysokość opisu pogody i temperatur prognozy. */
.tv-display .tv-weather-panel .tv-hour strong {
  line-height: 22px;
}
.tv-display .tv-weather-panel .tv-weather-description {
  line-height: 1px;
}


/* TV v25 — pozycja numerka, prognozy i odstępy na życzenie.
   Imię i nazwisko w nagłówku dnia: .tv-day-heading .tv-teacher-name */
.tv-footer-lucky .lucky {
  top: -53px;
  height: 64px;
}
.tv-footer-lucky .tv-lucky-number #wrapper {
  width: 75px;
  height: 76px;
}
.tv-footer-lucky .tv-lucky-number #number {
  width: 75px !important;
  height: 76px;
  line-height: 75px;
  font-size: 28px;
}
.tv-display .tv-weather-panel .tv-hour-label {
  line-height: 38px;
}
.tv-display .tv-weather-panel .tv-weather-main {
  position: relative;
  top: -6px;
}
.tv-display .tv-weather-panel .tv-weather-description {
  line-height: 5px;
}
.tv-display .tv-weather-panel .tv-hour strong {
  line-height: 16px;
}

/* TV v26 — wyśrodkowanie zawartości komórek tabeli zastępstw. */
.tv-substitution-content .tabele table td {
  text-align: center;
}

/* TV v27 — odstepy w zwyklych komorkach tabeli zastepstw. */
.tv-substitution-content .tabele table td {
  padding: 8px 9px;
}


/* TV v28 — czytelne emoji jakości powietrza zamiast kolorowej kropki. */
.tv-display .tv-footer-timer .tv-air-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 23px;
  font-size: clamp(18px, 1.3vw, 22px);
  line-height: 1;
  vertical-align: middle;
}
.tv-display .tv-footer-timer .tv-air-icon[data-state="bad"],
.tv-display .tv-footer-timer .tv-air-icon[data-state="very-bad"] {
  color: #c51f29;
}
.tv-display .tv-footer-timer .tv-air-alert[data-level="warning"] {
  color: #886000;
}
.tv-display .tv-footer-timer .tv-air-alert[data-level="danger"] {
  color: #ad1c25;
  background: #ffe9e9;
  border-color: #e9a9ad;
  white-space: normal;
  text-align: center;
  max-width: 100%;
}


/* TV v29 — mniejszy opis i wyśrodkowana aktualna pogoda. */
.tv-display .tv-weather-panel .tv-weather-description {
  font-size: 12px;
}
.tv-display .tv-weather-panel .tv-weather-now {
  text-align: center;
}
.tv-display .tv-weather-panel .tv-weather-hero {
  justify-content: center;
}


/* TV v31 — wspólna linia bazowa opisu powietrza i (AQI n). */
.tv-display .tv-footer-timer .tv-air-inline {
  align-items: baseline;
}
.tv-display .tv-footer-timer .tv-air-icon {
  align-self: center;
}
.tv-display .tv-footer-timer .tv-air-aqi {
  align-self: baseline;
  line-height: 1.16;
}
.tv-display .tv-footer-timer .tv-air-alert {
  align-self: center;
}


/* TV v32 — poprawne formy jakości powietrza i alert w jednym wierszu. */
.tv-display .tv-footer-timer .tv-air-aqi {
  align-self: auto;
  padding: 0;
}
/* Ostrzeżenie jest obok AQI, a nie pod nim. */
.tv-display .tv-footer-timer .tv-air-inline.tv-air-has-alert {
  flex-wrap: nowrap;
  white-space: nowrap;
  gap: clamp(3px, .3vw, 6px);
  font-size: clamp(12px, .92vw, 17px);
}
.tv-display .tv-footer-timer .tv-air-inline.tv-air-has-alert b {
  font-size: inherit;
}
.tv-display .tv-footer-timer .tv-air-inline.tv-air-has-alert > span {
  white-space: nowrap;
}
.tv-display .tv-footer-timer .tv-air-inline.tv-air-has-alert .tv-air-alert {
  white-space: nowrap;
  max-width: none;
  font-size: clamp(10px, .78vw, 13px);
}


/* TV v33: jednolite obrazki pogodowe PNG, niezależne od fontów na TV. */
.tv-display .tv-weather-panel .tv-weather-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: clamp(38px,3.6vw,54px);
  height: clamp(38px,3.6vw,54px);
  font-size: clamp(38px,3.6vw,54px);
  line-height: 1;
}
.tv-display .tv-weather-panel .tv-hour-icon {
  font-size: 30px;
  overflow: visible;
}
.tv-display .tv-weather-panel .tv-weather-emoji-image {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  flex: 0 0 auto;
  filter: none;
}
/* Wartość odliczania większa o 10% od opisu przerwy/lekcji. */
.tv-display .tv-footer-timer .tv-next-countdown #lekcja2 {
  display: inline;
  font-size: 1.1em;
  font-weight: 750;
  line-height: inherit;
  vertical-align: baseline;
  padding: 0 0 0 4px;
}

/* Stała wielkość PNG prognozy; kontener 53px zachowuje poprzednie odstępy. */
.tv-display .tv-weather-panel .tv-hour-icon {
  transform: none;
  font-size: 30px;
}
.tv-display .tv-weather-panel .tv-hour-icon .tv-weather-emoji-image {
  width: min(100%, 44px);
  height: 44px;
  object-fit: contain;
}


/* TV v38 — cytat i szerokosc listy nieobecnych. */
.tv-head-date .cytaty p {
  font-size: 16px !important;
}
.tv-display > .tv-header > .tv-head-substitutions {
  flex: 1 1 55%;
}

/* TV v39 — data i cyfry zegara. */
.tv-header #fData {
  font-size: 21px !important;
  line-height: 1;
  font-weight: 800 !important;
}
.tv-clock-digit {
  width: 48px;
  flex-basis: 48px;
  height: 64px;
  font-size: 51px;
}
/* Dla wąskich ekranów pozostawiamy kompaktowy zegar. */
@media (max-width: 1150px) {
  .tv-clock-digit {
    width: 38px;
    flex-basis: 38px;
    height: 50px;
    font-size: 40px;
  }
}

/* TV v40 — data i cytat w jednej górnej linii z listą nieobecnych. */
.tv-display > .tv-header > .tv-head-date {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding-top: 0 !important;
  transform: none;
}


/* TV v41 — oba bloki nagłówka mają dokładnie tę samą wysokość.
   Zegar zachowuje własne wyśrodkowanie (align-self: center). */
.tv-display > .tv-header {
  align-items: stretch;
}
.tv-display > .tv-header > .tv-head-substitutions,
.tv-display > .tv-header > .tv-head-date {
  align-self: stretch;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding-top: 0 !important;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  transform: none;
}
.tv-display > .tv-header > .tv-head-date > div {
  margin-top: 0;
  padding-top: 0;
  /* Tekst daty startuje na tym samym poziomie co nagłówek „Zastępstwa”. */
  top: -3px;
}

/* TV v42 — grafika przy braku zastępstw + większy nagłówek „brak zastępstw”. */
.tv-empty-showcase {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  overflow: hidden;
  background: radial-gradient(circle at 50% 18%, rgba(255,255,255,.96) 0%, rgba(240,248,252,.95) 45%, rgba(233,242,247,.93) 100%);
}
.tv-empty-showcase-stage {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(255,255,255,.55), rgba(232,242,247,.75));
  box-shadow: inset 0 0 0 1px rgba(58, 96, 124, .09), 0 14px 36px rgba(35, 69, 95, .08);
}
.tv-empty-showcase-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.18) 38%, rgba(255,255,255,.02) 60%, rgba(255,255,255,0) 100%);
  transform: translateX(-115%);
  animation: tvShowcaseSheen 11s linear infinite;
  pointer-events: none;
}
.tv-empty-showcase-image {
  display: block;
  width: auto;
  max-width: min(98%, 1100px);
  max-height: 96%;
  object-fit: contain;
  filter: drop-shadow(0 20px 34px rgba(28, 53, 76, .16));
  transform-origin: 50% 55%;
  animation: tvShowcaseFloat 8.8s ease-in-out infinite;
}
@keyframes tvShowcaseFloat {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-8px) scale(1.012); }
}
@keyframes tvShowcaseSheen {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(120%); }
}


/* TV v43 — grafika ma wypełniać cały lewy panel w trybie brak zastępstw. */
.tv-panel-substitutions.brakzas { overflow: hidden; }
.tv-panel-substitutions.brakzas .tv-substitution-content { padding: 0; margin: 0; flex: 1; min-height: 0; }
.tv-empty-showcase-cover {
  flex: 1;
  min-height: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: 0;
  background-image: url("no_way_oswiak.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  overflow: hidden;
  animation: tvShowcaseDrift 22s ease-in-out infinite alternate;
}
.tv-empty-showcase-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.12) 42%, rgba(255,255,255,0) 68%);
  transform: translateX(-120%);
  animation: tvShowcaseSweep 14s linear infinite;
  pointer-events: none;
}
@keyframes tvShowcaseDrift {
  0% { background-position: 48% 50%; }
  100% { background-position: 52% 50%; }
}
@keyframes tvShowcaseSweep {
  0% { transform: translateX(-130%); }
  100% { transform: translateX(130%); }
}


/* TV v44 — tło strony, poprawny cover bez pustego flexa, położenie „Brak zastępstw”. */
html { background: #fcf2ff; }
body.tv-signage-body {
  background: linear-gradient(135deg, #fcf2ff 0%, #faf2ff 48%, #f1f6ff 100%) !important;
}
.box.tv-display { background: transparent; }
/* Dotyczy TYLKO trybu bez zastępstw. W zwykłym trybie tabela jest nadal widoczna. */
.tv-display .tv-panel-substitutions.brakzas > .tv-substitution-content {
  display: none !important;
}
.tv-display .tv-panel-substitutions.brakzas > .tv-empty-showcase-cover {
  flex: 1 1 100%;
  width: 100%;
  min-height: 0;
  height: 100%;
  padding: 0;
  margin: 0;
  background-size: cover;
  background-position: center center;
}
.tv-display .tv-header .tv-head-substitutions > h2.dol3 {
  margin-top: 14px !important;
  margin-bottom: 0 !important;
  font-size: 42px;
  height: auto;
  line-height: 1.04;
  padding: 0;
}


/* TV v45 — placeholder prawego panelu przy braku informacji. */
.tv-content.tv-no-news { gap: 0 !important; }
.tv-content.tv-no-news > .tv-panel-substitutions { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.tv-content.tv-no-news > .tv-panel-news { border-top-left-radius: 0; border-bottom-left-radius: 0; border-left: 0; }
.tv-panel-news.is-no-news .sidebar {
  display: block;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  min-height: 0;
  background-color: #f8f8fb;
  background-image: url("tv_no_info_right.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  border-radius: 0 0 18px 0;
}
.tv-panel-news.is-no-news .sidebar::after {
  content: none;
  display: none;
}


/* TV v47 — gwarantowany plakat po prawej przy braku informacji.
   Tło jest na samym panelu, więc zadziała nawet bez elementu .sidebar. */
.tv-display > .tv-content > .tv-panel-news.is-no-news {
  background-color: #ffffff !important;
  background-image: url("tv_no_info_right.png") !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}
.tv-display > .tv-content > .tv-panel-news.is-no-news > .sidebar {
  display: none !important;
}
.tv-display > .tv-content > .tv-panel-news.is-no-news > .tv-news-content {
  display: none !important;
}
.tv-display > .tv-content.tv-no-news {
  gap: 0 !important;
}

/* TV v49 — przy braku ogłoszeń oba panele są jednym wspólnym blokiem.
   Jeden obrys i cień, tylko zewnętrzne zaokrąglenia, bez szczeliny i podwójnych ramek. */
.tv-display > .tv-content.tv-no-news {
  gap: 0 !important;
  column-gap: 0 !important;
  row-gap: 0 !important;
  border: 1px solid #d9e4e8;
  border-top: 4px solid #3a9a9d;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 5px 18px rgba(42, 69, 78, .065);
  overflow: hidden;
  isolation: isolate;
}
.tv-display > .tv-content.tv-no-news > .tv-panel-substitutions,
.tv-display > .tv-content.tv-no-news > .tv-panel-news {
  min-width: 0;
  min-height: 0;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  background-clip: border-box;
  overflow: hidden;
}
.tv-display > .tv-content.tv-no-news > .tv-panel-news.is-no-news {
  background: #fff url("tv_no_info_right.png") center center / cover no-repeat !important;
}
.tv-display > .tv-content.tv-no-news > .tv-panel-news.is-no-news::before,
.tv-display > .tv-content.tv-no-news > .tv-panel-news.is-no-news::after {
  content: none !important;
  display: none !important;
}


/* TV v52 — normalnie panele są oddzielne i zaokrąglone.
   Jeden wspólny baner pokazujemy WYŁĄCZNIE wtedy, gdy nie ma zastępstw i nie ma informacji. */
.tv-display > .tv-content.tv-content-single-banner {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
}
.tv-display > .tv-content.tv-content-single-banner > .tv-panel-combined-empty {
  min-width: 0;
  min-height: 0;
  border-radius: 18px;
  border: 1px solid var(--tv-border);
  border-top: 4px solid var(--tv-accent) !important;
  background: #ffffff;
  box-shadow: 0 5px 22px rgba(39,75,108,.07);
  overflow: hidden;
}
.tv-combined-empty-cover {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  background: #ffffff url("tv_empty_merged.png") center center / cover no-repeat;
  overflow: hidden;
}
.tv-combined-empty-cover::before {
  content: "";
  position: absolute;
  top: -8%;
  bottom: -8%;
  left: 74.15%;
  width: 4px;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.95) 18%, rgba(255,255,255,.98) 50%, rgba(255,255,255,.85) 82%, rgba(255,255,255,0) 100%);
  box-shadow: 0 0 12px rgba(255,255,255,.95), 0 0 24px rgba(255,255,255,.75), 0 0 52px rgba(115,195,255,.20), 0 0 72px rgba(197,95,255,.16);
  opacity: .92;
  pointer-events: none;
}
/* TV v61 — subtelna pionowa smuga z v59, jedynie odrobinę jaśniejsza. */
.tv-combined-empty-cover::before {
  content: none;
  display: none;
}
.tv-combined-empty-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.23) 38%,
    rgba(255,255,255,.03) 60%,
    rgba(255,255,255,0) 100%);
  transform: translateX(-120%);
  animation: tvShowcaseSweep 14s linear infinite;
  pointer-events: none;
}
/* Wyłącz wcześniejsze sklejanie paneli — od teraz tylko klasa tv-content-single-banner
   odpowiada za tryb jednego dużego obrazu. */
.tv-display > .tv-content:not(.tv-content-single-banner) {
  gap: 14px !important;
}
.tv-display > .tv-content:not(.tv-content-single-banner) > .tv-panel-substitutions,
.tv-display > .tv-content:not(.tv-content-single-banner) > .tv-panel-news {
  border-radius: 18px !important;
  border-left-width: 1px !important;
}
.tv-display > .tv-content:not(.tv-content-single-banner) > .tv-panel-news.is-no-news {
  background-color: #ffffff !important;
  background-image: url("tv_no_info_right.png") !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  overflow: hidden;
}
.tv-display > .tv-content:not(.tv-content-single-banner) > .tv-panel-news.is-no-news > .sidebar {
  display: none !important;
}
.tv-display > .tv-content:not(.tv-content-single-banner) > .tv-panel-news.is-no-news > .tv-news-content {
  display: none !important;
}


/* TV v57 — cytat 17 px, komunikat braku zastępstw 45 px. */
.tv-head-date .cytaty p {
  font-size: 17px !important;
}
.tv-display .tv-header .tv-head-substitutions > h2.dol3 {
  font-size: 45px !important;
}

/* TV v58 — aktualna pogoda i szczęśliwy numerek. */
.tv-display .tv-weather-panel .tv-weather-now {
  top: -2px;
}
.tv-footer-lucky .tv-lucky-number #wrapper {
  width: 80px;
  height: 80px;
}
.tv-footer-lucky .tv-lucky-number #number {
  width: 80px !important;
  height: 80px;
  line-height: 80px;
}

/* TV v59 — położenie grafiki szczęśliwego numerka. */
.tv-footer-lucky .lucky {
  top: -57px;
  height: 64px;
}
.tv-footer-lucky .tv-lucky-number {
  top: 1px;
}
/* TV v62 — czytelna stopka TV: czas, AQI i cała prognoza w obrębie dolnego paska.
   Stałe wysokości komórek uniemożliwiają chowanie temperatur poniżej ekranu. */
.tv-display .tv-footer-timer {
  gap: 5px;
  justify-content: center;
}
.tv-display .tv-footer-timer .tv-next-countdown {
  font-size: clamp(24px, 1.87vw, 35px);
  font-weight: 750;
  line-height: 1.14;
  white-space: nowrap;
}
.tv-display .tv-footer-timer .tv-next-countdown #lekcja2 {
  font-size: 1.08em;
  font-weight: 800;
}
.tv-display .tv-footer-timer .tv-air-inline {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 24px;
  white-space: nowrap;
  line-height: 1.16;
}
.tv-display .tv-footer-timer .tv-air-inline,
.tv-display .tv-footer-timer .tv-air-inline b,
.tv-display .tv-footer-timer .tv-air-inline.tv-air-has-alert {
  font-size: clamp(18px, 1.34vw, 24px);
}
.tv-display .tv-footer-timer .tv-air-icon {
  font-size: clamp(20px, 1.5vw, 25px);
  min-width: 24px;
}
.tv-display .tv-footer-timer .tv-air-aqi {
  font-size: .94em;
  line-height: 1.16;
  white-space: nowrap;
}

/* Pogoda ma się w całości zmieścić w stopce 76–84 px (również na TV 1366/1536 px). */
.tv-display .tv-weather-panel .tv-weather-main {
  position: relative;
  top: 0;
  display: grid;
  grid-template-columns: minmax(120px, .44fr) minmax(0, 1fr);
  align-items: center;
  gap: 3px;
  height: 100%;
  padding: 0 6px 0 8px;
}
.tv-display .tv-weather-panel .tv-weather-now {
  top: -2px;
  min-width: 0;
  text-align: center;
}
.tv-display .tv-weather-panel .tv-weather-current-caption {
  display: block;
  font-size: 11px;
  line-height: 14px;
}
.tv-display .tv-weather-panel .tv-weather-hero {
  top: 0;
  margin: 0;
  gap: 4px;
  justify-content: center;
}
.tv-display .tv-weather-panel .tv-weather-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  font-size: 38px;
}
.tv-display .tv-weather-panel .tv-weather-icon .tv-weather-emoji-image {
  width: 38px !important;
  height: 38px !important;
  max-width: 38px !important;
  max-height: 38px !important;
  object-fit: contain;
}
.tv-display .tv-weather-panel .tv-weather-temp {
  font-size: clamp(34px, 2.45vw, 42px);
  line-height: 1;
}
.tv-display .tv-weather-panel .tv-weather-description {
  font-size: 12px;
  line-height: 14px;
  min-height: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tv-display .tv-weather-panel .tv-hourly-wrap {
  top: 0;
  padding-left: 0;
  align-self: center;
  min-width: 0;
}
.tv-display .tv-weather-panel .tv-hourly-forecast {
  margin: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  align-items: center;
}
.tv-display .tv-weather-panel .tv-hour {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: 0;
  padding: 0;
}
.tv-display .tv-weather-panel .tv-hour-label {
  display: block;
  height: 17px;
  line-height: 17px;
  font-size: 13px;
  white-space: nowrap;
}
.tv-display .tv-weather-panel .tv-hour-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 35px;
  min-height: 35px;
  padding: 0;
  transform: none;
  overflow: visible;
}
.tv-display .tv-weather-panel .tv-hour-icon .tv-weather-emoji-image {
  width: 34px !important;
  height: 34px !important;
  max-width: 34px !important;
  max-height: 34px !important;
  object-fit: contain;
}
.tv-display .tv-weather-panel .tv-hour strong {
  position: relative;
  top: 0;
  display: block;
  font-size: clamp(17px, 1.13vw, 21px);
  line-height: 20px;
  height: 20px;
  white-space: nowrap;
}
@media (max-width: 1150px) {
  .tv-display .tv-footer-timer .tv-next-countdown { font-size: 21px; }
  .tv-display .tv-footer-timer .tv-air-inline,
  .tv-display .tv-footer-timer .tv-air-inline b,
  .tv-display .tv-footer-timer .tv-air-inline.tv-air-has-alert { font-size: 17px; }
  .tv-display .tv-weather-panel .tv-weather-main {
    grid-template-columns: minmax(105px, .44fr) minmax(0, 1fr);
    padding-left: 4px;
    padding-right: 3px;
  }
}


/* TV v63 — fizyczna szczelina między dwoma panelami, niezależnie od obsługi
   CSS grid-gap/gap w starszych przeglądarkach Smart TV.
   Odstęp robi margines lewego panelu, a nie gap siatki. */
.tv-display > .tv-content.tv-content-split {
  gap: 0 !important;
  column-gap: 0 !important;
  grid-column-gap: 0 !important;
  row-gap: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.tv-display > .tv-content.tv-content-split > .tv-panel-substitutions {
  margin: 0 14px 0 0 !important;
  border: 1px solid #d9e4e8 !important;
  border-top: 4px solid #21788a !important;
  border-radius: 18px !important;
  box-shadow: 0 4px 16px rgba(42,69,78,.045) !important;
  flex: 1 1 69% !important; /* bez wpływu na obsługujące grid ekrany; fallback dla starszych TV */
  min-width: 0;
}
.tv-display > .tv-content.tv-content-split > .tv-panel-news {
  margin: 0 !important;
  border: 1px solid #d9e4e8 !important;
  border-top: 4px solid #c5a375 !important;
  border-radius: 18px !important;
  box-shadow: 0 4px 16px rgba(42,69,78,.045) !important;
  flex: 1 1 31% !important;
  min-width: 0;
}
/* Tylko tryb jednego wspólnego baneru nie ma wewnętrznego odstępu. */
.tv-display > .tv-content.tv-content-single-banner > .tv-panel-combined-empty {
  margin: 0 !important;
}

/* TV v63 — 32 px dla prognozy godzinowej. */
.tv-display .tv-weather-panel .tv-hour-icon {
  height: 32px !important;
  min-height: 32px !important;
}
.tv-display .tv-weather-panel .tv-hour-icon .tv-weather-emoji-image {
  width: 32px !important;
  height: 32px !important;
  max-width: 32px !important;
  max-height: 32px !important;
}


/* TV v64 — wypełnienie wolnych boków pionowych plakatów rozmytą kopią.
   Plakat pozostaje zawsze ostry, w całości widoczny (object-fit: contain).
   Działa tylko dla panelu rzeczywistych ogłoszeń zawierających duży obraz.
   Nie dotyczy trybu „brak informacji” i pojedynczego szerokiego baneru. */
.tv-display > .tv-content > .tv-panel-news .tv-news-poster-blur {
  display: none;
}
.tv-display > .tv-content > .tv-panel-news.tv-poster-blur-enabled > .tv-news-poster-blur {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: #eee8e6;
}
/* TV v65 — rozmyty plakat ma ten sam rozkład kolorów w pionie co
   ostry plakat. Kopię rozciągamy TYLKO wszerz, bez powiększania i
   obcinania fragmentów w pionie jak przy background-size: cover. */
.tv-display > .tv-content > .tv-panel-news .tv-news-poster-blur-image {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  -webkit-filter: blur(18px) brightness(1.55) saturate(1);
  filter: blur(18px) brightness(1.55) saturate(1);
  transform: translateZ(0);
}
.tv-display > .tv-content > .tv-panel-news.tv-poster-blur-enabled > .tv-news-content {
  position: relative;
  z-index: 1;
  background: transparent !important;
}
.tv-display > .tv-content > .tv-panel-news.tv-poster-blur-enabled .tv-news-content img {
  object-fit: contain !important;
}


/* TV v67 — delikatniejszy, szerzej rozłożony cień po obu bokach plakatu.
   drop-shadow śledzi widoczne krawędzie obrazu (contain), nie obrys całego
   panelu; plakat pozostaje nierozmyty. Reguła tylko dla aktywnego plakatu. */
.tv-display > .tv-content > .tv-panel-news.tv-poster-blur-enabled .tv-news-content img {
  -webkit-filter: drop-shadow(-10px 0 10px rgba(20, 23, 34, .20))
                  drop-shadow(10px 0 10px rgba(20, 23, 34, .20));
  filter: drop-shadow(-10px 0 10px rgba(20, 23, 34, .20))
          drop-shadow(10px 0 10px rgba(20, 23, 34, .20));
}

/* TV v68 — drobne korekty grafiki, stopki, pogody i cytatu. */
/* Bez zastępstw, gdy widoczny jest lewy panel z NO WAY: wypełnij cały panel obrazem. */
.tv-display .tv-panel-substitutions.brakzas > .tv-empty-showcase-cover {
  background-size: 100% 100% !important;
}
/* Pozycja napisu/ilustracji szczęśliwego numerka. */
.tv-footer-lucky .lucky {
  top: -75px;
  height: 89px;
  left: -24px;
}
/* Większe symbole prognozy bez powiększania wiersza i chowania temperatur. */
.tv-display .tv-weather-panel .tv-hour-icon {
  font-size: 35px;
  overflow: visible;
}
.tv-display .tv-weather-panel .tv-hour-icon .tv-weather-emoji-image {
  width: 35px !important;
  height: 35px !important;
  max-width: 35px !important;
  max-height: 35px !important;
}
/* Godziny prognozy: 13 -> 14 px; tekst cytatu: 17 -> 18 px. */
.tv-display .tv-weather-panel .tv-hour-label {
  font-size: 14px !important;
}
.tv-head-date .cytaty p {
  font-size: 18px !important;
}


/* TV v69 — korekty ustawień TV po v68. */
/* Tryb bez zastępstw, ale z informacjami: obraz zachowuje proporcje (cover). */
.tv-display .tv-panel-substitutions.brakzas > .tv-empty-showcase-cover {
  background-size: cover !important;
}
/* Pasek szczęśliwego numerka — pozycja i wymiar grafiki. */
.tv-footer-lucky .lucky {
  top: -78px;
  height: 89px;
  left: -15px;
  width: 151px;
}
/* Większe obrazki chmurek/słońca; zachowujemy wysokość wiersza
   prognozy 32px, żeby nie obcinać temperatur w stopce. */
.tv-display .tv-weather-panel .tv-hour-icon {
  font-size: 38px;
  overflow: visible;
}
.tv-display .tv-weather-panel .tv-hour-icon .tv-weather-emoji-image {
  width: 38px !important;
  height: 38px !important;
  max-width: 38px !important;
  max-height: 38px !important;
}
/* Godziny 14 -> 15 px. */
.tv-display .tv-weather-panel .tv-hour-label {
  font-size: 15px !important;
}

/* TV v70 — powiększenie prognozy godzinowej i daty w nagłówku. */
/* Ikonki pogody: 38 -> 40 px. Bez zmiany wysokości wierszy prognozy. */
.tv-display .tv-weather-panel .tv-hour-icon {
  font-size: 40px;
  overflow: visible;
}
.tv-display .tv-weather-panel .tv-hour-icon .tv-weather-emoji-image {
  width: 40px !important;
  height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
}
/* Godziny prognozy: 15 -> 16 px. */
.tv-display .tv-weather-panel .tv-hour-label {
  font-size: 16px !important;
}
/* Dzień tygodnia i data w nagłówku: 21 -> 23 px. */
.tv-header #fData {
  font-size: 23px !important;
}


/* TV v71 — powiększenie samych symboli pogodowych bez zmiany układu stopki. */
.tv-display .tv-weather-panel .tv-hour-icon {
  scale: 1.4;
  transform-origin: center center;
}
.tv-display .tv-weather-panel .tv-weather-icon {
  scale: 1.7;
  margin-right: 5px;
  transform-origin: center center;
}
/* Zgodność ze starszymi przeglądarkami telewizorów bez CSS scale. */
@supports not (scale: 1) {
  .tv-display .tv-weather-panel .tv-hour-icon {
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }
  .tv-display .tv-weather-panel .tv-weather-icon {
    -webkit-transform: scale(1.7);
    transform: scale(1.7);
  }
}