/* ============================================================
   PureWare — PROJECT page · full theme template (original CSS)
   ------------------------------------------------------------
   Paste into Manage → Custom CSS on a project you own and edit
   any value. Applies to the project page AND its post pages.
   Rules are auto-scoped EXCEPT body/html/:root which
   intentionally theme the whole-page background.

   Default palette (override anywhere):
     page bg   #0F1115     card      #1B202A
     surface   #161A22     hover     #242B38
     text      #FFFFFF     muted     #9CA3AF
     success   #22C55E     danger    #EF4444
     border    #242B38

   Element hooks on this page:
     body / :root     whole-page background
     .pw-custom       content wrapper (max-width, font, etc.)
     .pw-hero         hero card        .pw-banner / .pw-logo
     .pw-name         project name (h1)
     .pw-author       "by <user>" link
     .pw-summary      short summary
     .pw-stats        followers/views/releases row
     .pw-overview     overview card
     .pw-news         news card
     .pw-releases     releases card
     .pw-sidebar      right sidebar
     .card .btn .btn-primary .btn-secondary a h1 h2 h3 p
     pre code .prose img
   ============================================================ */

/* ---------- PAGE BACKGROUND (whole page) ---------- */
body {
  background-color: #0f1115;
  background-image: linear-gradient(180deg, #0c1a14, #0f1115);
  /* background-image: url("https://your.cdn/bg.jpg");
     background-size: cover; background-attachment: fixed; */
}

.pw-custom {
  /* max-width: 1040px; margin: 0 auto; */
  font-family: inherit;
}

/* ---------- TYPOGRAPHY ---------- */
h1, h2, .pw-name { color: #ffffff; }
p, .pw-summary { color: #9ca3af; }
a, .pw-author { color: #9ca3af; }
a:hover { color: #ffffff; }

/* ---------- HERO ---------- */
.pw-hero {
  background-color: #1b202a;
  border: 1px solid #242b38;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  overflow: hidden;
}
.pw-banner { background-color: #161a22; }
.pw-banner img { object-fit: cover; }
.pw-logo {
  border: 4px solid #1b202a;
  border-radius: 12px;
  /* box-shadow: 0 0 0 3px #22c55e; */
}
.pw-stats { border-top: 1px solid #242b38; color: #9ca3af; }

/* ---------- SECTION CARDS ---------- */
.card,
.pw-overview, .pw-news, .pw-releases {
  background-color: #1b202a;
  border: 1px solid #242b38;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}
.card:hover { border-color: #2ecc71; }

/* news items / list rows use .bg-surface inside cards */
.pw-news a:hover { color: #6ee7a8; }

/* sidebar */
.pw-sidebar .card { background-color: #161a22; }

/* ---------- CODE / CHANGELOG / WIKI ---------- */
pre, code {
  background-color: #07120c;
  color: #9ef0c0;
  border-radius: 8px;
}
.prose a { color: #6ee7a8; }

/* ---------- BUTTONS ---------- */
.btn { border-radius: 10px; transition: all 200ms ease; }
.btn-primary { background-color: #ffffff; color: #0f1115; }
.btn-primary:hover { background-color: #34d27a; transform: translateY(-1px); }
.btn-primary:active { transform: translateY(0); }
.btn-secondary { background-color: #1b202a; color: #ffffff; border: 1px solid #242b38; }
.btn-secondary:hover { background-color: #242b38; }
.btn:focus-visible { outline: 2px solid #6ee7a8; outline-offset: 2px; }

/* ---------- ANIMATIONS (keyframes stay global) ---------- */
@keyframes pw-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.35); }
  50%      { box-shadow: 0 0 0 8px rgba(34, 197, 94, 0); }
}
/* .btn-primary { animation: pw-pulse 2.5s infinite; } */

/* ---------- RESPONSIVE ---------- */
@media (max-width: 640px) {
  h1, .pw-name { font-size: 1.5rem; }
}
