/* ==========================================================================
   FEED AKTYWNOSCI (zakladka AKTYWNOSC w panelu znajomych, od 4.10.2026)
   Uklad C z mockupy/mockup-feed-wpisy.html: grupy po osobie w obrebie dnia,
   jeden szkielet wpisu (okladka | etykieta typu | tytul | szczegoly),
   kolor TYLKO na malej ikonie typu, etykiety szare. Ocena w kolorach skali
   ocen (dane, nie motyw), moje rzeczy w --accent. Klasy z przedrostkiem fd-.
   ========================================================================== */

.fd-host {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 8px 10px 24px;
  scrollbar-width: thin;
  scrollbar-color: #22262c transparent;
}
.fd-host[hidden] { display: none; }

.fd-empty { padding: 34px 16px; text-align: center; color: #8b949c; font-size: 0.76rem; line-height: 1.6; }
.fd-empty i { display: block; font-size: 1.5rem; color: var(--accent-social); margin-bottom: 10px; opacity: 0.7; }
.fd-empty small { display: block; margin-top: 4px; color: #68727b; font-size: 0.7rem; }

.fd-day { margin: 16px 6px 6px; font-size: 0.6rem; letter-spacing: 2px; font-weight: 700; color: #68727b; }

/* --- podsumowanie tygodnia --- */
.fd-week {
  margin: 4px 2px 6px;
  padding: 12px 14px 10px;
  border-radius: 14px;
  background: linear-gradient(160deg, color-mix(in srgb, var(--accent) 8%, #0c0f12), #0a0c0f 70%);
  border: 1px solid color-mix(in srgb, var(--accent) 20%, #1a1f25);
}
.fd-wh { font-size: 0.62rem; letter-spacing: 2px; font-weight: 700; color: var(--accent); }
.fd-wh i { margin-right: 7px; }
.fd-ws { font-size: 0.64rem; color: #68727b; margin: 1px 0 9px; }
.fd-rk {
  display: grid;
  grid-template-columns: 18px minmax(0, 72px) minmax(0, 1fr) 44px;
  align-items: center;
  gap: 8px;
  margin: 5px 0;
  font-size: 0.72rem;
}
.fd-rn { color: #5a626a; font-size: 0.6rem; }
.fd-rnk { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #c9d0d6; }
.fd-rb { height: 7px; border-radius: 4px; background: #15181d; overflow: hidden; }
.fd-rb i { display: block; height: 100%; border-radius: 4px; background: color-mix(in srgb, var(--accent-social) 80%, transparent); }
.fd-rh { text-align: right; font-family: "JetBrains Mono", Consolas, monospace; font-size: 0.64rem; color: #c9d0d6; }
.fd-rk.fd-me .fd-rnk { color: #fff; font-weight: 700; }
.fd-rk.fd-me .fd-rb i { background: var(--accent); }
.fd-wnone { font-size: 0.7rem; color: #8b949c; line-height: 1.5; }
.fd-wst { display: flex; gap: 14px; margin-top: 9px; padding-top: 8px; border-top: 1px solid #1a1f25; font-size: 0.62rem; color: #8b949c; }
.fd-wst b { color: #fff; margin-right: 3px; }

/* --- grupa osoby --- */
.fd-grp { padding: 8px 2px 4px; }
.fd-gh {
  display: flex; align-items: center; gap: 9px;
  padding: 4px 6px; margin-bottom: 2px; border-radius: 9px; cursor: pointer; outline: none;
}
.fd-gh:hover, .fd-gh:focus-visible { background: #0e1014; }
.fd-nick { font-size: 0.8rem; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.fd-when { margin-left: auto; flex: 0 0 auto; font-size: 0.6rem; color: #5a626a; font-family: "JetBrains Mono", Consolas, monospace; }

/* awatar: inicjal pod spodem, zdjecie na wierzchu (jak .fr-av) */
.fd-av {
  position: relative; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: #15171c; border: 1.5px solid color-mix(in srgb, var(--accent-social) 55%, transparent);
}
.fd-av img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.fd-ini { font-weight: 700; color: var(--accent-social); }
.fd-av26 { width: 26px; height: 26px; }
.fd-av26 .fd-ini { font-size: 0.6rem; }

/* --- wpis --- */
.fd-it {
  position: relative;
  display: flex; align-items: center; gap: 10px;
  margin-left: 12px; padding: 6px 6px 6px 9px;
  border-left: 1px solid #1d232b; border-radius: 0 10px 10px 0;
  cursor: pointer; outline: none;
}
.fd-it:hover, .fd-it:focus-visible { background: #0e1014; }
.fd-cv {
  width: 28px; height: 38px; flex: 0 0 auto; border-radius: 4px;
  background: #15171c center / cover no-repeat; border: 1px solid #22262c;
}
.fd-cvi { display: flex; align-items: center; justify-content: center; font-size: 0.72rem; }
.fd-stack { display: flex; flex: 0 0 auto; width: 44px; }
.fd-stack span { width: 22px; height: 30px; flex: 0 0 auto; border-radius: 3px; margin-right: -11px; border: 1.5px solid #08090c; background: #15171c center / cover no-repeat; }
.fd-bd { flex: 1; min-width: 0; }
.fd-ty { display: block; font-size: 0.56rem; letter-spacing: 1.6px; font-weight: 700; color: #8b949c; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fd-ty i { margin-right: 5px; font-size: 0.6rem; }
.fd-tt { font-size: 0.78rem; font-weight: 600; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
.fd-mt { font-size: 0.66rem; color: #8b949c; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fd-rt { font-weight: 700; }
.fd-r-top { color: var(--ocena-top); }
.fd-r-high { color: var(--ocena-high); }
.fd-r-mid { color: var(--ocena-mid); }
.fd-r-low { color: var(--ocena-low); }
.fd-mine { color: var(--accent); }
.fd-chip { font-size: 0.64rem; color: var(--accent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fd-chip i { margin-right: 4px; font-size: 0.56rem; }
.fd-q {
  margin-top: 3px; font-size: 0.7rem; color: #aab3bb; font-style: italic; line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* strzalka „napisz” — na PC po najechaniu, na telefonie zawsze */
.fd-rep {
  flex: 0 0 auto; align-self: center;
  width: 30px; height: 30px; border-radius: 8px; cursor: pointer;
  border: 1px solid #1d232b; background: #0a0c0f; color: #68727b; font-size: 0.72rem;
  opacity: 0; transition: opacity 0.15s ease;
}
.fd-it:hover .fd-rep, .fd-it:focus-within .fd-rep, .fd-rep:focus-visible { opacity: 1; }
.fd-rep:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
@media (hover: none) { .fd-rep { opacity: 1; } }

/* wpis systemowy: wspolne czekanie na premiere (srebro listy zyczen) */
.fd-sys {
  display: flex; align-items: center; gap: 10px;
  margin: 6px 2px; padding: 9px 10px; border-radius: 11px; cursor: pointer; outline: none;
  border: 1px dashed color-mix(in srgb, var(--zyczenia) 32%, transparent); background: #0b0d10;
}
.fd-sys:hover, .fd-sys:focus-visible { border-color: color-mix(in srgb, var(--zyczenia) 55%, transparent); }
/* tu etykieta niesie najwazniejsze (za ile dni premiera) — zawijamy zamiast ucinac */
.fd-sys .fd-ty { white-space: normal; }

.fd-more {
  display: block; margin: 16px auto 4px; padding: 7px 14px; border-radius: 9px; cursor: pointer;
  border: 1px solid #1d232b; background: none; color: #8b949c;
  font: inherit; font-size: 0.64rem; font-weight: 700; letter-spacing: 1.5px;
}
.fd-more:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.fd-end { margin: 16px 0 4px; text-align: center; font-size: 0.62rem; letter-spacing: 1.5px; color: #4b535b; }

@media (prefers-reduced-motion: reduce) { .fd-rep { transition: none; } }