/* poopcat public Owncast theme
   Served by Apache.
   Does not modify Owncast internals or database.
   Intentionally light-touch. */

:root {
  color-scheme: dark;
}

/* Page base */
html,
body,
#__next {
  background:
    radial-gradient(circle at top left, rgba(105, 75, 255, .10), transparent 34%),
    radial-gradient(circle at top right, rgba(255, 70, 140, .06), transparent 32%),
    #08090d !important;
  color: #f4f6fb !important;
}

/* Top injected poopcat nav should stay readable */
.pc-site-nav {
  background: rgba(8, 9, 13, .94) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}

.pc-site-nav__brand {
  color: #c8ff3d !important;
}

.pc-site-nav__link {
  color: rgba(255,255,255,.72) !important;
}

.pc-site-nav__link[aria-current="page"] {
  color: #ffffff !important;
}

/* Owncast header / app chrome */
header {
  background: #0b1018 !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}

/* Offline banner */
#offline-banner {
  background: #111827 !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  color: #f4f6fb !important;
}

#offline-banner,
#offline-banner * {
  color: #f4f6fb !important;
}

#offline-banner a {
  color: #ffffff !important;
  text-decoration-color: rgba(255,255,255,.55) !important;
}

/* Main content text */
main,
main p,
main span,
main div,
main h1,
main h2,
main h3 {
  color: #f4f6fb !important;
}

/* Stream name */
h1 {
  color: #f4f6fb !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.35);
}

/* Keep normal links readable without recoloring every element */
main a {
  color: #b7a7ff !important;
}

/* Profile/logo area */
img {
  max-width: 100%;
}

/* Buttons */
button {
  border-radius: 999px !important;
}

/* Chat button */
button[aria-label*="Chat"],
button[title*="Chat"] {
  background: #18243a !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}

/* Footer */
footer {
  background: #0b1018 !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  color: rgba(255,255,255,.70) !important;
}

footer a {
  color: #ff6488 !important;
}

/* Mobile cleanup */
@media (max-width: 760px) {
  body {
    background-color: #08090d !important;
  }

  main {
    padding-bottom: 80px;
  }
}

/* Stage 8C: Owncast variable color correction.
   Keep the page dark, but avoid blue/low-contrast stream text. */

:root {
  --theme-color-components-text-on-light: #f4f6fb !important;
  --theme-color-components-text-on-dark: #f4f6fb !important;
  --theme-color-background-main: #08090d !important;
  --theme-color-background-light: #101827 !important;
  --theme-color-background-header: #0b1018 !important;
  --theme-color-action: #b7a7ff !important;
  --theme-color-action-hover: #d6ccff !important;
  --link-color: #b7a7ff !important;
  --link-hover-color: #d6ccff !important;
}

/* Stream title/name area */
main h1,
main h2,
main [class*="name"],
main [class*="Name"],
main [class*="title"],
main [class*="Title"] {
  color: #f4f6fb !important;
}

/* Tags under stream title */
main [class*="tag"],
main [class*="Tag"],
main a[href*="tag"],
main a[href*="tags"] {
  color: #b7a7ff !important;
  background: rgba(183,167,255,.12) !important;
  border-color: rgba(183,167,255,.22) !important;
}

/* Menu dots button */
button[aria-label*="menu"],
button[aria-label*="Menu"],
button[title*="menu"],
button[title*="Menu"] {
  color: #f4f6fb !important;
  border-color: rgba(255,255,255,.38) !important;
}
