/* ============================================================================
   rounds-panel.css: the shared "Funding rounds" panel
   (src/tpl/partials/rounds-panel.php). Task 6, two-site sync 2026-09-29.

   Two audiences in this one file:

   1. body.cg-profile-os callers (single-profile-os.php, cryptogames.gg only,
      switch on) and body.cg-game-os callers (the Theme\GameOs branch of
      single-dapp.php). Section 1 below is the `.cg-pfo-panel` /
      `.cg-pfo-rounds` / `.cg-pfo-round-*` / `.cg-pfo-cnt` block moved,
      unchanged, out of profile-os.css — still keyed off the --pfo-* tokens
      that file defines at body.cg-profile-os. Theme\ProfileOs::assets()
      enqueues this file as a dependency of profile-os.css, so the two always
      load together and nothing there regresses. (game-os.css keeps its own
      separate body.cg-game-os copy, mirroring --pfo-* as --gmo-*; untouched
      by this file.)

   2. The legacy guild/investor/developer single templates — egamers.io
      always, and cryptogames.gg when the cg_profile_os switch is off (Task
      6). These carry neither body.cg-profile-os nor body.cg-game-os, and
      single-developer.php does not even load cryptogames.css (functions.php's
      $cpt_types list omits 'developer' — see profile-os.css's Ruling 2
      comment). So section 2 is fully self-contained: its own --rp-* tokens,
      mirroring --pfo-*'s dark/light values, same pattern as game-os.css's
      --gmo-* mirror. Unscoped selectors here lose to the two body-scoped
      blocks above by specificity, so cg-profile-os and cg-game-os pages are
      unaffected.
   ============================================================================ */

/* ------------------------------------------------------ 1. profile-os / game-os callers */
body.cg-profile-os .cg-pfo-panel { padding: 18px 20px; border-radius: 16px; background: var(--pfo-s1); }
body.cg-profile-os .cg-pfo-panel h2 {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 12px;
  font: 700 17px/1.3 Inter, system-ui, sans-serif; color: var(--pfo-text); text-wrap: balance;
}
body.cg-profile-os .cg-pfo-cnt { padding: 2px 8px; border-radius: 999px; background: var(--pfo-s2); font-size: 12px; font-weight: 600; color: var(--pfo-muted); }
body.cg-profile-os .cg-pfo-rounds { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
body.cg-profile-os .cg-pfo-rounds li { border: 1px solid var(--pfo-line); border-radius: 12px; padding: 10px 12px; }
body.cg-profile-os .cg-pfo-round-h { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; font-weight: 700; color: var(--pfo-text); }
body.cg-profile-os .cg-pfo-round-h time { color: var(--pfo-muted); font-size: .85em; font-weight: 600; white-space: nowrap; }
body.cg-profile-os .cg-pfo-round-inv { margin: 4px 0 0; font-size: .9em; color: var(--pfo-muted); }
body.cg-profile-os .cg-pfo-round-inv a { color: var(--pfo-accent); }
@media (max-width: 600px) {
  body.cg-profile-os .cg-pfo-panel { padding: 16px; }
}

/* -------------------------------------------------- 2. legacy singles (standalone) */
/* No `color` here: Section 1's body.cg-profile-os / body.cg-game-os panel
   rules never declare their own `color` on .cg-pfo-panel (they only style
   background/padding), so an unscoped `color` on this bare selector would
   win there too (nothing outranks it) and leak onto those pages. Every
   text-bearing descendant (h2, .cg-pfo-cnt, .cg-pfo-round-h incl. its <b>/
   <time>, .cg-pfo-round-inv incl. its <a>) already sets its own explicit
   `color: var(--rp-text|--rp-muted|--rp-accent)` below, so the legacy
   standalone panel stays fully legible without it. */
.cg-pfo-panel {
  --rp-s1: #212121;
  --rp-s2: #333333;
  --rp-line: rgba(255, 255, 255, .08);
  --rp-text: #ffffff;
  --rp-muted: #b5b5b5;
  --rp-accent: #9d8cff;
  padding: 18px 20px; border-radius: 16px; background: var(--rp-s1);
}
body:not([data-theme="dark"]) .cg-pfo-panel {
  --rp-s1: #f4f4f6;
  --rp-s2: #e9e9ee;
  --rp-line: rgba(0, 0, 0, .08);
  --rp-text: #191919;
  --rp-muted: #6b6b6b;
  --rp-accent: #4a28c4;
}
.cg-pfo-panel h2 {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 12px;
  font: 700 17px/1.3 Inter, system-ui, sans-serif; color: var(--rp-text); text-wrap: balance;
}
.cg-pfo-cnt { padding: 2px 8px; border-radius: 999px; background: var(--rp-s2); font-size: 12px; font-weight: 600; color: var(--rp-muted); }
.cg-pfo-rounds { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.cg-pfo-rounds li { border: 1px solid var(--rp-line); border-radius: 12px; padding: 10px 12px; }
.cg-pfo-round-h { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; font-weight: 700; color: var(--rp-text); }
.cg-pfo-round-h time { color: var(--rp-muted); font-size: .85em; font-weight: 600; white-space: nowrap; }
.cg-pfo-round-inv { margin: 4px 0 0; font-size: .9em; color: var(--rp-muted); }
.cg-pfo-round-inv a { color: var(--rp-accent); }
@media (max-width: 600px) {
  .cg-pfo-panel { padding: 16px; }
}