/* Strona pojedynczej wiadomości. Paleta z okienka „Wywóz odpadów”. */

.wiadomosc__okruchy { font-size: 13px; color: var(--tekst-przygaszony); margin-bottom: var(--s3); }
.wiadomosc__okruchy a { color: var(--tekst-przygaszony); }

.wiadomosc {
  padding: var(--s4);
  border-radius: var(--r-m);
  background-color: var(--akcent-tlo);
  border-left: 5px solid var(--color-indianRed);
  max-width: 70ch;
}

.wiadomosc__nadtytul {
  margin: 0 0 var(--s1);
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--akcent);
  font-weight: var(--weight-semi-bold);
}

.wiadomosc h1 { margin: 0 0 var(--s2); }

.wiadomosc__data {
  margin: 0 0 var(--s3);
  font-size: 14px;
  color: var(--tekst-przygaszony);
}

/* Wpis archiwalny oznaczamy słowem, nie samym przygaszeniem — czytelnik ma
   wiedzieć, że patrzy na coś sprzed lat, zanim to udostępni. */
.wiadomosc__stara {
  display: inline-block;
  margin-left: var(--s2);
  padding: 1px 8px;
  border: 1px solid var(--obwodka-mocna);
  border-radius: var(--r-pill);
  font-size: 12px;
}

.wiadomosc__zajawka { font-size: 17px; margin: 0 0 var(--s4); }

.wiadomosc__zrodlo-blok { margin: 0 0 var(--s4); }

.wiadomosc__przycisk {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: 0 var(--s5);
  border-radius: var(--r-s);
  background-color: var(--akcent);
  color: var(--tekst-odwrocony);
  text-decoration: none;
  font-weight: var(--weight-semi-bold);
}

.wiadomosc__przycisk:hover,
.wiadomosc__przycisk:focus-visible { filter: brightness(.88); }

.wiadomosc__uwaga {
  display: block;
  margin-top: var(--s2);
  font-size: 13px;
  color: var(--tekst-przygaszony);
}

.wiadomosc__udostepnij { padding-top: var(--s3); border-top: 1px solid var(--obwodka); }

.wiadomosc__podobne { margin-top: var(--s5); max-width: 70ch; }

.wiadomosc__podobne h2 {
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--akcent);
  margin-bottom: var(--s3);
}

.wiadomosc__podobne ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); }

.wiadomosc__podobne li {
  display: flex;
  justify-content: space-between;
  gap: var(--s3);
  padding: var(--s2) var(--s3);
  border: 1px solid var(--obwodka);
  border-radius: var(--r-s);
  background-color: var(--tlo-karta);
  font-size: 14px;
}

.wiadomosc__podobne li span { color: var(--tekst-przygaszony); white-space: nowrap; }

.wiadomosc__brak {
  padding: var(--s5);
  border-radius: var(--r-m);
  background-color: var(--tlo-karta);
  border: 1px solid var(--obwodka);
  max-width: 60ch;
}