/* RBA — design tokens
 *
 * Brand source: the official RBA logo (responsiblebusiness.org/media/
 * responsible-business-alliance-logo.svg) ships two brand blues —
 *   RBA blue  #005ca6  = hsl(207 100% 33%)  → primary, header, links, ring
 *   RBA navy  #002f60  = hsl(210 100% 19%)  → secondary / deep surfaces
 * These replace the previous forest-green palette (FTR — RBA blue retheme,
 * 2026-06-22). A mid azure (hsl 204 70% 45%) is the in-family accent.
 *
 * Scoped under [data-theme="rba"]. See sys.css for the App-chrome
 * contract every theme exposes, and req/ux/style_guide.md for intent.
 */

[data-theme="rba"] {
  /* App-chrome contract — RBA blue header */
  --app-header-bg:        hsl(207, 100%, 33%);
  --app-header-fg:        hsl(0, 0%, 100%);
  --app-header-hover-bg:  hsl(207, 100%, 38%);
  --app-primary:          hsl(207, 100%, 33%);
  --app-primary-hover:    hsl(207, 100%, 38%);
  --app-secondary:        hsl(210, 100%, 19%);
  --app-secondary-hover:  hsl(210, 100%, 25%);

  /* Shadcn-style palette */
  --primary:              hsl(207, 100%, 33%);
  --primary-foreground:   hsl(0, 0%, 100%);
  --secondary:            hsl(210, 100%, 19%);
  --secondary-foreground: hsl(0, 0%, 100%);
  --accent:               hsl(204, 70%, 45%);
  --accent-foreground:    hsl(0, 0%, 100%);
  --destructive:          hsl(350, 80%, 46%);
  --destructive-foreground: hsl(0, 0%, 100%);
  --muted:                hsl(216, 14%, 93%);
  --muted-foreground:     hsl(220, 6%, 46%);
  --background:           hsl(216, 20%, 95%);
  --foreground:           hsl(204, 44%, 21%);
  --border:               hsl(0, 0%, 85%);
  --input:                hsl(0, 0%, 75%);
  --ring:                 hsl(207, 100%, 33%);
  --card:                 hsl(0, 0%, 100%);
  --card-foreground:      hsl(204, 44%, 21%);
  --card-border:          hsl(0, 0%, 90%);
  --sidebar:              hsl(0, 0%, 96%);
  --sidebar-primary:      hsl(207, 100%, 33%);
  --sidebar-primary-fg:   hsl(0, 0%, 100%);
  --sidebar-foreground:   hsl(204, 44%, 21%);
  --sidebar-border:       hsl(0, 0%, 88%);
  --popover:              hsl(0, 0%, 100%);
  --popover-border:       hsl(0, 0%, 90%);
  --elevate-1:            rgba(0,0,0,0.03);
  --elevate-2:            rgba(0,0,0,0.08);

  /* Status fills used by the RBA Facility journey surface (RBA-FAC):
   * --rba-flag-* drives the amber "required-field marking, not error" prompt
   * (cleanchain §2.7 pattern), --rba-busy-bg is the pale-blue period-bar fill,
   * --rba-done* the green active/persisted state. Parallels cc.css's
   * --cc-flag-*/--cc-step-* but lives under the RBA theme so the journey reads
   * tokenized (UX-STY-024, no hex fallbacks in component code). */
  --rba-flag-bg:          hsl(45, 90%, 94%);
  --rba-flag-fg:          hsl(32, 80%, 32%);
  --rba-busy-bg:          hsl(204, 38%, 92%);
  --rba-done:             hsl(150, 55%, 33%);
  --rba-done-bg:          hsl(150, 45%, 93%);
}

/* RBA Review Scorecard (RBA-SCR) — re-homes the shared <ScorecardBody>'s
 * `.tgt-card` styling + `--tgt-*` tokens to the RBA theme, exactly as cc.css does
 * for the CleanChain scorecard. Each scorecard section renders as its own card on
 * the RBA page background (grouped/chunked, not one flat block). Scoped under the
 * RBA theme so it never leaks to other surfaces. */
[data-theme="rba"] .rba-scorecard-scope {
  --tgt-text-primary:   var(--foreground);
  --tgt-text-secondary: var(--muted-foreground);
  --tgt-muted-gray:     var(--muted-foreground);
  --tgt-border-gray:    var(--border);
  --tgt-light-gray:     var(--muted);
  --tgt-white:          var(--card);
  --tgt-teal:           var(--primary);
  --tgt-teal-light:     var(--rba-busy-bg);
  --tgt-on-color:       var(--primary-foreground);
  --tgt-status-unmatched:    var(--destructive);
  --tgt-status-unmatched-bg: var(--rba-flag-bg);
}
[data-theme="rba"] .rba-scorecard-scope .tgt-card {
  background-color: var(--card);
  border: 1px solid var(--card-border);
  border-radius: 8px;
  box-shadow: 0 2px 4px var(--elevate-1);
}
[data-theme="rba"] .rba-scorecard-scope .tgt-card-body { padding: 1.5rem; }
[data-theme="rba"] .rba-scorecard-scope .tgt-heading-lg {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--foreground);
  line-height: 1.3;
}

/* Dark mode for RBA page content (style_guide.md §2.3 — every App theme
 * file MUST re-map its neutral tokens under .dark; cc.css/tgt.css carry the
 * same block). The RBA views are mostly Tailwind dark:-variant shared
 * components today, so this is largely preventive: it covers any surface
 * styled against the tokens above via var() — currently the home-tile
 * product codes (text-[var(--primary)]) — and keeps a future token-styled
 * RBA page from regressing the way CC did.
 *
 * Kept un-flipped: the App-chrome contract (header stays branded RBA blue in
 * both modes) and --secondary/--accent (fills under white foregrounds).
 * --primary lightens to 207 90% 58% (the §2.3 pattern) so it reads as text
 * on dark surfaces.
 *
 * Specificity: `.dark [data-theme="rba"]` (0,2,0) beats the base
 * `[data-theme="rba"]` (0,1,0), and the AppFrame's data-theme div is always
 * a descendant of <html class="dark">, so this wins without !important. */
.dark [data-theme="rba"] {
  --primary:              hsl(207, 90%, 58%);

  /* Neutral surfaces + text */
  --background:           #16181c;
  --foreground:           #e7e9ec;
  --muted:                #262a30;
  --muted-foreground:     #aab0b8;
  --border:               #353a42;
  --input:                #4a505a;
  --ring:                 hsl(207, 80%, 55%);
  --card:                 #1f2227;
  --card-foreground:      #e7e9ec;
  --card-border:          #353a42;
  --sidebar:              #1a1d21;
  --sidebar-foreground:   #e7e9ec;
  --sidebar-border:       #353a42;
  --popover:              #1f2227;
  --popover-border:       #353a42;
  --elevate-1:            rgba(255,255,255,0.04);
  --elevate-2:            rgba(255,255,255,0.09);

  /* Status foreground — lightened to read as text on the dark panels. */
  --destructive:          hsl(350, 70%, 62%);

  /* RBA-FAC status fills, dark-mode re-map (style_guide §2.3). */
  --rba-flag-bg:          #2e2410;
  --rba-flag-fg:          #e8bd78;
  --rba-busy-bg:          #15314a;
  --rba-done:             hsl(150, 50%, 60%);
  --rba-done-bg:          #14301f;
}