/* Parallax RP child style. Loaded after prosilver. */
:root {
  --px-bg: #090a11;
  --px-surface: #12131d;
  --px-surface-raised: #1a1b2a;
  --px-border: #303146;
  --px-text: #f4f3fa;
  --px-muted: #b8b7ca;
  --px-accent: #ab68ff;
  --px-accent-bright: #c893ff;
  --px-focus: #dfbaff;
}

html, body { background: var(--px-bg); color: var(--px-text); }
body { font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 14px; }
.wrap { max-width: 1280px; background: var(--px-bg); border: 0; box-shadow: none; }
h2, h3, .postbody, .content, .postprofile, .postprofile strong,
.panel, .panel-container, .panel-container h3, .panel-container h2,
table.table1 td, .stat-block, .stat-block h3 { color: var(--px-text); }
a, .postlink, .postlink:visited, .icon, .button .icon { color: var(--px-accent-bright); }
a:hover, .postlink:hover, .arrow-left:hover, .arrow-right:hover { color: #fff; }
:focus-visible { outline: 2px solid var(--px-focus) !important; outline-offset: 3px; }

/* The supplied project wordmark forms the banner. */
.headerbar {
  position: relative;
  min-height: clamp(300px, 40vw, 520px);
  border: 1px solid var(--px-border);
  border-radius: 18px;
  background: #090a11 url("./images/parallax-banner.png") center 58% / cover no-repeat;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .28);
}
.headerbar .inner, .site-description { min-height: clamp(300px, 40vw, 520px); }
.site-description #logo { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; }
.site-description .site_logo { display: none; }
.site-description h1, .site-description > p:not(.skiplink) {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.headerbar .search-header { position: relative; z-index: 2; }

.navbar, .panel, .bg1, .bg2, .bg3, .post, .dropdown .dropdown-contents,
.panel-container .panel, .panel-container .cp-mini { background: var(--px-surface); color: var(--px-text); }
.navbar, .panel, .post, .dropdown .dropdown-contents { border: 1px solid var(--px-border); border-radius: 12px; }
.navbar { margin-top: 10px; }
.forabg, .forumbg {
  background: var(--px-surface);
  border: 1px solid var(--px-border);
  border-radius: 14px;
  padding: 8px;
}
.forabg .header, .forumbg .header { background: var(--px-surface-raised); }
ul.topiclist li.header { color: var(--px-muted); }
ul.topiclist.forums { background: var(--px-surface); background-image: none; }
ul.topiclist li.row, .post { border-color: var(--px-border); }
ul.topiclist li.row, ul.topiclist li.row dd, ul.topiclist li.row dt { color: var(--px-muted); }
ul.topiclist li.row:hover, table.table1 tbody tr:hover { background: var(--px-surface-raised); }
ul.topiclist li.row:hover dd, ul.topiclist li.row:hover dt { border-color: var(--px-border); }
.forumtitle, .topictitle { color: var(--px-text); font-weight: 700; }
.forumtitle:hover, .topictitle:hover { color: var(--px-accent-bright); }
.responsive-hide, .row .small, .postprofile dd, .postprofile dt, .post-info,
.pagination, .username-coloured, .stat-block p, .breadcrumbs { color: var(--px-muted); }

.button, .button1, .button2, .button3, a.button1, a.button2,
input.button1, input.button2, input.button3 {
  background: var(--px-surface-raised); color: var(--px-text);
  border: 1px solid var(--px-border); border-radius: 8px;
}
.button:hover, .button:focus, a.button1:hover, a.button2:hover,
input.button1:hover, input.button2:hover { background: #34214c; border-color: var(--px-accent); color: #fff; }
.button1, a.button1, input.button1 { background: #7136b9; border-color: #a666f2; color: #fff; }
.inputbox, input.inputbox, textarea.inputbox, select, .search-box .inputbox {
  background: var(--px-surface-raised); color: var(--px-text);
  border: 1px solid var(--px-border); border-radius: 8px;
}
.inputbox:focus, input.inputbox:focus, textarea.inputbox:focus, select:focus {
  background: var(--px-surface-raised); color: #fff; border-color: var(--px-accent);
}
.inputbox::placeholder { color: var(--px-muted); opacity: 1; }
.pagination li a, .pagination li.ellipsis span { background: var(--px-surface-raised); border-color: var(--px-border); color: var(--px-text); }
.pagination li.active span { background: #7136b9; border-color: var(--px-accent); color: #fff; }
.post:target .content, .post h3 a.first-unread, .post:target h3 a { color: var(--px-text); }
hr, h3 { border-color: var(--px-border); }
.signature, .postbody .content, .postprofile { border-color: var(--px-border); }
.dropdown li, .dropdown li li { border-color: var(--px-border); }
.dropdown-extended .header, .dropdown-extended .footer { background: var(--px-surface-raised); }

@media (max-width: 700px) {
  .wrap { padding: 8px; }
  .headerbar { min-height: clamp(200px, 54vw, 300px); border-radius: 12px; background-size: cover; }
  .headerbar .inner, .site-description { min-height: clamp(200px, 54vw, 300px); }
  .headerbar .search-header { display: none; }
  .forabg, .forumbg { padding: 5px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
