/* Desawana V2 — page-scoped overrides (Design: public_html/Design/)
 * Load after app.css. Each route sets a unique body class (pg-*).
 * Edit matching blocks in app.css, then run: python scripts/build-page-scopes-css.py
 */

/* ── Audio detail only (Design/song.php) — prevent classic/list bleed ── */
body.pg-audio-detail .song-hero{
  display:grid;grid-template-columns:280px 1fr;
  gap:2.5rem;align-items:start;padding:1.5rem 0 2rem;
}
body.pg-audio-detail .song-cover{
  width:100%;aspect-ratio:1;border-radius:20px;
  background:linear-gradient(135deg,#c8b4e8,#9060c0);
  display:flex;align-items:center;justify-content:center;
  font-size:5rem;box-shadow:0 20px 60px rgba(0,0,0,.3);
  position:relative;overflow:hidden;flex-shrink:0;
  border:none;
}
[data-theme="dark"] body.pg-audio-detail .song-cover{background:linear-gradient(135deg,#2a1c3a,#1c1028)}
body.pg-audio-detail .song-cover::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(232,54,93,.15),transparent)}
body.pg-audio-detail .song-cover img{width:100%;height:100%;object-fit:cover;display:block;position:relative;z-index:1;border-radius:20px}
body.pg-audio-detail .song-hero .song-details{
  background:transparent;border:none;border-radius:0;margin:0;padding:0;overflow:visible;
}

/* ── Classic detail only (Design/classic.php?id=) ── */
body.pg-classic-detail .song-top .song-cover{
  width:220px;height:220px;border-radius:16px;
  aspect-ratio:unset;box-shadow:none;
  border:2px solid rgba(255,215,0,.2);
}
body.pg-classic-detail .song-top .song-cover::after{display:none}
body.pg-classic-detail .song-layout .song-details{
  background:var(--surface2);border-radius:12px;overflow:hidden;
  border:1.5px solid var(--border);margin-bottom:1.2rem;
}

/* ── Audio list: scoped filter bar (not global .filters-bar column layout) ── */
body.pg-audio-list .filters-bar{
  display:flex;flex-direction:column;gap:.7rem;
}

/* ── New releases / remix / ringtone / video use dedicated *-filters-bar in app.css ── */

/* ── News list/detail (Design: industry-news.php) — 1100px like Design, not global 1160px ── */
body.pg-news-list .wrap,
body.pg-news-detail .wrap{
  max-width:1100px;
}
body.pg-news-list .news-layout,
body.pg-news-detail .article-layout{
  display:grid;grid-template-columns:1fr 280px;gap:2rem;
}
@media(max-width:960px){
  body.pg-news-list .news-layout,
  body.pg-news-detail .article-layout{grid-template-columns:1fr}
}

/* ── Advertising (Design: advertising.php) — centered hero, 1100px wrap ── */
body.pg-advertising .wrap{max-width:1100px}
body.pg-advertising .adv-hero .ah-inner{
  display:block !important;
  text-align:center !important;
  grid-template-columns:none !important;
  gap:0 !important;
}
body.pg-advertising .adv-main .stats-band{
  background:var(--surface);border:1.5px solid var(--border);border-radius:16px;
}