/* Performance owns its nested foreground/surface pairs. Never inherit a
   dark-shell foreground on a light Branding card (or the reverse). */
#tab-kam360 {
  --perf-surface: var(--surface-primary, #f5f8fc);
  --perf-ink: var(--text-primary, #0b172a);
  background: var(--perf-surface);
  color: var(--perf-ink);
}
#tab-kam360 :is(.pkHero, .pkIntelligenceHeader, .panel, .savedKpiCard, .performanceSectionNav) {
  --perf-surface: var(--card-background, var(--surface-secondary, #fff));
  --perf-ink: var(--card-text, var(--text-primary, #0b172a));
  background: var(--perf-surface) !important;
  color: var(--perf-ink) !important;
}
#tab-kam360 :is(.pkMetricCard, .forecastStatCard, .pkHorizonCard, .piRollingCard,
  .piCapacityCompare > div, .piTeamForecast > div, .capacityPlannerCard,
  .performanceHoursTotal, .performanceHourRow, .kpi) {
  --perf-surface: var(--vcard-background, var(--card-background, var(--surface-secondary, #fff)));
  --perf-ink: var(--vcard-text, var(--card-text, var(--text-primary, #0b172a)));
  background: var(--perf-surface) !important;
  color: var(--perf-ink) !important;
}
#tab-kam360 :is(.chart, .pkForecastChart, .piTrendChart) {
  --perf-surface: var(--chart-background, var(--card-background, var(--surface-secondary, #fff)));
  --perf-ink: var(--chart-text, var(--card-text, var(--text-primary, #0b172a)));
  background: var(--perf-surface) !important;
  color: var(--perf-ink) !important;
}
#tab-kam360 :is(h2, h3, h4, p, label, span, strong, b, em, small, th, td, code,
  .eyebrow, .notice, .opsPersonalExplainer, .piRollingCard > div) {
  color: var(--perf-ink) !important;
  -webkit-text-fill-color: currentColor !important;
}
#tab-kam360 :is(p, small, .fieldHelp, .chartLabel) {
  color: color-mix(in srgb, var(--perf-ink) 85%, var(--perf-surface)) !important;
  opacity: 1 !important;
}
#tab-kam360 :is(.notice, .capacityPlannerMetrics > div, .pkRecNum, .piRank,
  .piSnapshot, .piBrief, .piBriefIcon, .opsFormulaBreakdown, .opsFormulaBreakdown code,
  .opsPersonalExplainer) {
  background: var(--perf-surface) !important;
  color: var(--perf-ink) !important;
}
#tab-kam360 .pkForecastChart .forecastTrack b {
  background: var(--perf-surface) !important;
  color: var(--perf-ink) !important;
  padding: 1px 3px; border-radius: 3px;
}
#tab-kam360 .piFunnel > div {
  --perf-ink: #fff; --perf-surface: #0759c7;
  background: var(--perf-surface) !important;
}
#tab-kam360 .piFunnel > i { color: var(--perf-ink) !important; }
#tab-kam360 .piPipelineGroup { display:grid; gap:12px; padding:16px; border:1px solid color-mix(in srgb,var(--perf-ink) 16%,transparent); border-radius:14px; }
#tab-kam360 .piPipelineGroup + .piPipelineGroup { margin-top:14px; }
#tab-kam360 .piPipelineGroup > header { display:flex; justify-content:space-between; gap:16px; align-items:center; }
/* Keep the visual meaning of status colors, but give the text a known surface. */
#tab-kam360 :is(.pkCapacityStatus, .pkScore, .pkHorizonCard em, .pkRecommendation em,
  .piCompare em, .piSuggestion em, .piAllGood) {
  --perf-ink: #0759c7;
  --perf-surface: #e8f1ff;
  background: var(--perf-surface) !important;
  color: var(--perf-ink) !important;
  padding: 3px 6px;
  border-radius: 5px;
}
#tab-kam360 :is(.pkCapacityStatus.normal, .pkScore.green, .pkHorizonCard em.ok,
  .pkRecommendation.low em, .piCompare em.up, .piSuggestion em, .piAllGood) {
  --perf-ink: #166534; --perf-surface: #dcfce7;
}
#tab-kam360 :is(.pkCapacityStatus.high, .pkScore.red, .pkHorizonCard em.bad,
  .pkRecommendation.high em, .piCompare em.down) {
  --perf-ink: #991b1b; --perf-surface: #fee2e2;
}
#tab-kam360 :is(.pkScore.yellow, .pkHorizonCard em.warn, .pkRecommendation.medium em) {
  --perf-ink: #854d0e; --perf-surface: #fef3c7;
}
#tab-kam360 :is(input, select, textarea) {
  background: var(--input-background, #fff) !important;
  color: var(--input-text, #0b172a) !important;
  -webkit-text-fill-color: currentColor !important;
}
#tab-kam360 :is(input, textarea)::placeholder {
  color: var(--input-text, #0b172a) !important;
  -webkit-text-fill-color: var(--input-text, #0b172a) !important;
  opacity: .75 !important;
}
#tab-kam360 :is(button, .btn) {
  background: #fff !important; color: #0759c7 !important;
  -webkit-text-fill-color: currentColor !important; border-color: #7296c9 !important;
}
#tab-kam360 button :is(span, strong, small) { color: inherit !important; }
#tab-kam360 .performanceSectionNav button[aria-current="true"] {
  background: #0759c7 !important; color: #fff !important;
}
#tab-kam360 .favoriteStar { background: #0b172a !important; color: #ffd566 !important; }
#tab-kam360 :is(button, input, select, textarea):focus-visible {
  outline: 2px solid currentColor !important; outline-offset: 3px;
}