/* Revenue Intelligence owns paired surface/foreground tokens. The global
   theme recolors headings with !important; the old fixed-white analytical
   cards did not consume the corresponding surface token. Keep this bridge
   scoped to the workspace: the global RIVA drawer and portal stay untouched. */
#riCanonicalLayout {
  background: var(--surface-primary, #f5f8fc) !important;
  color: var(--text-primary, #0b172a) !important;
}
#riCanonicalLayout .riCanonicalWorkspace {
  --ri-surface: var(--card-background, var(--surface-secondary, #fff));
  --ri-ink: var(--card-text, var(--text-primary, #0b172a));
  --ri-secondary: color-mix(in srgb, var(--ri-ink) 85%, var(--ri-surface));
}
#riCanonicalLayout #riCanonicalTitle {
  color: var(--text-primary, #0b172a) !important;
  -webkit-text-fill-color: currentColor !important;
}
#riCanonicalLayout :is(.riCanonicalKpi, .riCanonicalPanel) {
  background: var(--ri-surface) !important;
  color: var(--ri-ink) !important;
  border-color: var(--border-default, #cfdeed) !important;
}
#riCanonicalLayout .riCanonicalKpi {
  --ri-surface: var(--vcard-background, var(--surface-secondary, #fff));
  --ri-ink: var(--vcard-text, var(--text-primary, #0b172a));
  --ri-secondary: color-mix(in srgb, var(--ri-ink) 85%, var(--ri-surface));
  display: flex;
  flex-direction: column;
  align-items: stretch;
  box-sizing: border-box;
}
/* Help mounts headerless cards as a generic two-column grid. Revenue KPI
   visuals have their own vertical rhythm and an absolutely positioned action
   rail, so preserve that rhythm after every dynamic remount. */
#riCanonicalLayout .riCanonicalKpi.revupHelpHeaderless {
  display: flex !important;
  grid-template-columns: none !important;
}
#riCanonicalLayout .riCanonicalKpi.revupHelpHeaderless > :not(.revupHelpActions) {
  grid-column: auto !important;
  grid-row: auto !important;
}
/* Universal help is an action overlay, not KPI content. Keeping it out of the
   layout flow prevents the injected control from shifting the metric rows and
   placing the chart over its explanatory copy. */
#riCanonicalLayout .riCanonicalKpi > .revupHelpActions {
  position: absolute !important;
  inset: 12px 12px auto auto !important;
  width: auto !important;
  min-width: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
}
#riCanonicalLayout .riCanonicalKpiHead {
  min-width: 0;
  padding-right: 48px;
}
#riCanonicalLayout .riCanonicalKpiMeta {
  flex: 0 0 auto;
  min-width: 0;
  min-height: 16px;
  margin-bottom: 12px !important;
  overflow-wrap: anywhere;
}
#riCanonicalLayout .riCanonicalKpi > :is(.riCanonicalSpark, .riCanonicalSegment, .riCanonicalProgress) {
  flex: 0 0 auto;
  align-self: stretch;
  position: relative !important;
  inset: auto !important;
  /* Keep an independent leading gutter as well as the copy's trailing
     gutter.  The authenticated portal composes legacy and tenant styles at
     runtime; either side alone can collapse to a sub-pixel gap there. */
  margin-top: 12px !important;
}
#riCanonicalLayout .riCanonicalTrendPanel {
  --ri-surface: var(--chart-background, var(--card-background, var(--surface-secondary, #fff)));
  --ri-ink: var(--chart-text, var(--card-text, var(--text-primary, #0b172a)));
  --ri-secondary: color-mix(in srgb, var(--ri-ink) 85%, var(--ri-surface));
  overflow: hidden;
}
#riCanonicalLayout :is(.riCanonicalKpiHead, .riCanonicalKpiHead > span:last-child,
  .riCanonicalKpi > strong, .riCanonicalPanelHead h2, .riCanonicalPanelHead h2 > span,
  .n1ExecutiveIntelligence h3, .n1ExecutiveIntelligence h4,
  .n1ExecutiveIntelligence strong, .n1ExecutiveIntelligence p,
  .n1ExecutiveIntelligence li, .n1ExecutiveIntelligence span) {
  color: var(--ri-ink) !important;
  -webkit-text-fill-color: currentColor !important;
}
#riCanonicalLayout :is(.riCanonicalKpiMeta, .riCanonicalLegend,
  .riCanonicalLegend span, .n1ExecutiveIntelligence small, .n1ExecutiveDataState) {
  color: var(--ri-secondary) !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}
#riCanonicalLayout :is(.n1ExecutiveIntelligence .notice,
  .n1ExecutiveMetricGrid article, .n1ExecutiveDetailGrid article) {
  background: var(--ri-surface) !important;
  color: var(--ri-ink) !important;
  border-color: var(--border-default, #cfdeed) !important;
}
/* Status text uses its own paired chip, also in dark tenant branding (which
   need not have data-theme-mode="dark"). Do not rely on the mode name. */
#riCanonicalLayout .riCanonicalKpiDelta {
  justify-self: start;
  padding: 3px 7px;
  border-radius: 5px;
  background: #dcfce7 !important;
  color: #166534 !important;
  -webkit-text-fill-color: currentColor !important;
}
#riCanonicalLayout .riCanonicalKpiDelta.warn {
  background: #fef3c7 !important;
  color: #854d0e !important;
}
#riCanonicalLayout .riCanonicalKpiIcon {
  background: #0759c7 !important;
  color: #fff !important;
  -webkit-text-fill-color: currentColor !important;
}
#riCanonicalLayout .riCanonicalPanelHead h2 .riCanonicalCount {
  background: #b42318 !important;
  color: #fff !important;
}
#riCanonicalLayout :is(.riCanonicalPanelHead, .riCanonicalTable th, .riCanonicalTable td) {
  border-color: var(--border-default, #cfdeed) !important;
}
#riCanonicalLayout :is(.riCanonicalTable th, .riCanonicalTable td,
  .riCanonicalTable td > span, .riCanonicalTable td strong) {
  background: var(--ri-surface) !important;
  color: var(--ri-ink) !important;
  -webkit-text-fill-color: currentColor !important;
}
#riCanonicalLayout :is(.riCanonicalFilter, .riCanonicalAdvancedFilters > summary,
  .riCanonicalAdvancedFilters > div, .riCanonicalPanelHead select) {
  background: var(--input-background, #fff) !important;
  color: var(--input-text, #0b172a) !important;
  -webkit-text-fill-color: currentColor !important;
}
#riCanonicalLayout .riCanonicalFilter :is(b, span, select, input) {
  color: var(--input-text, #0b172a) !important;
  -webkit-text-fill-color: currentColor !important;
}
#riCanonicalLayout .riCanonicalFilter :is(select, input) {
  background: var(--input-background, #fff) !important;
}
#riCanonicalLayout :is(.riCanonicalExport, .riCanonicalRowAction, .riCanonicalAllOpps) {
  background: #fff !important;
  color: #0759c7 !important;
  -webkit-text-fill-color: currentColor !important;
}
#riCanonicalLayout .riCanonicalExport span { color: inherit !important; }
#riCanonicalLayout .riCanonicalMore { color: var(--ri-ink) !important; }
#riCanonicalLayout .riCanonicalTrend text { fill: var(--ri-secondary) !important; }
#riCanonicalLayout .riCanonicalTrend .grid { stroke: var(--border-default, #cfdeed); }
#riCanonicalLayout .riCanonicalTrend {
  height: auto;
  min-height: 340px;
  display: grid;
  grid-template-rows: auto auto;
  gap: 10px;
}
#riCanonicalLayout .riPipelinePlot{display:block;width:100%;max-width:100%;min-height:280px;height:clamp(240px,30vw,360px);overflow:hidden}
#riCanonicalLayout .riPipelinePlot .series-marker{fill:#0867e8;stroke:#fff;stroke-width:1.5}
#riCanonicalLayout .riTrendValueSummary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
#riCanonicalLayout .riTrendValueSummary span {
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--border-default, #cfdeed);
  border-radius: 10px;
  color: var(--ri-ink);
  overflow-wrap: anywhere;
}
#riCanonicalLayout .riTrendValueSummary b { display: block; color: var(--ri-secondary); font-size: 11px; }
#riCanonicalLayout .riTrendRange{grid-column:1/-1;margin:0;color:var(--ri-secondary);font-size:12px}
#riCanonicalLayout .riTrendRange b{display:inline;color:var(--ri-ink);font-size:inherit}
#riCanonicalLayout .riCanonicalSegment b { border-top-color: var(--ri-ink); }
#riCanonicalLayout .riCanonicalSpark path:not(.fill) { stroke: var(--ri-ink); }
#riCanonicalLayout :is(button, select, summary):focus-visible {
  outline: 2px solid currentColor !important;
  outline-offset: 3px;
}
@media (max-width: 680px) {
  #riCanonicalLayout .riCanonicalHeader { display: flex; flex-direction: column; gap: 12px; }
  #riCanonicalLayout .riCanonicalExport { position: static; min-height: 44px; }
  #riCanonicalLayout .riTrendValueSummary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #riCanonicalLayout .riPipelinePlot{min-height:240px}
}