/* Dynamic KPI Builder · approved 2026-10-09 mockup */
body[data-visual-system="nplus1"] #tab-pivot{
  --da-blue:#1268ea;
  --da-blue-soft:#eef6ff;
  --da-ink:#102347;
  --da-muted:#607393;
  --da-line:#d6e3f3;
  --da-panel:#ffffff;
  --da-page:#f7faff;
  color:var(--da-ink)!important;
  background:var(--da-page)!important;
  padding:18px!important;
  border-radius:20px;
  box-sizing:border-box;
}
body[data-visual-system="nplus1"] #tab-pivot :is(h2,h3,strong,label,small,p,span,button,a,th,td){
  -webkit-text-fill-color:currentColor!important;
}
#tab-pivot .daBreadcrumb{display:flex;align-items:center;gap:10px;margin:0 0 16px;color:#7a8ba6;font-size:13px}
#tab-pivot .daBreadcrumb strong{color:var(--da-ink)}
#tab-pivot .dynamicAnalysisHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:14px}
#tab-pivot .daTitleGroup{display:flex;align-items:center;gap:16px;min-width:0}
#tab-pivot .daTitleIcon{display:grid;place-items:center;flex:0 0 56px;width:56px;height:56px;border-radius:16px;background:linear-gradient(145deg,#ebe9ff,#f5f1ff);color:#6357e8!important;font-size:30px;font-weight:900;box-shadow:inset 0 0 0 1px #e4ddff}
#tab-pivot .daTitleGroup h2{margin:0;color:var(--da-ink)!important;font-size:clamp(24px,2.3vw,34px);line-height:1.1;letter-spacing:-.025em}
#tab-pivot .daTitleGroup p{margin:6px 0 0;color:var(--da-muted)!important;font-size:14px;line-height:1.45}
#tab-pivot .daHeaderActions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
#tab-pivot .daHeaderActions .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:9px 16px;border:1px solid var(--da-line)!important;border-radius:10px!important;background:#fff!important;color:#1c4f9e!important;box-shadow:0 2px 8px rgba(31,68,121,.06)}
#tab-pivot .daHeaderActions .btn.primary{background:var(--da-blue)!important;color:#fff!important;border-color:var(--da-blue)!important}
#tab-pivot .daRangeButton{min-width:190px}
#tab-pivot .daHelpStrip{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:11px 14px;border:1px solid #cfe6f5;border-radius:12px;background:#f4fbff;color:#456180;font-size:12px}
#tab-pivot .daHelpStrip strong{color:var(--da-ink)!important}
#tab-pivot .daHelpStrip a{margin-left:auto;color:var(--da-blue)!important;text-decoration:none;font-weight:800}
#tab-pivot .daHelpIcon{display:grid;place-items:center;width:24px;height:24px;border-radius:999px;background:#dcefff;color:var(--da-blue)!important;font-weight:900}

body[data-visual-system="nplus1"] #tab-pivot .daFilterBar{display:grid!important;grid-template-columns:minmax(230px,1.25fr) repeat(4,minmax(140px,1fr)) auto;gap:12px;margin:0 0 14px!important;padding:14px!important;border:1px solid var(--da-line)!important;border-radius:14px!important;background:var(--da-panel)!important;box-shadow:0 5px 18px rgba(44,83,133,.05)}
#tab-pivot .field{min-width:0}
#tab-pivot .field label{display:block;margin:0 0 6px;color:#344762!important;font-size:12px;font-weight:800}
#tab-pivot :is(input,select){width:100%;min-width:0;min-height:40px;box-sizing:border-box;border:1px solid #cfdeef!important;border-radius:9px!important;background:#fff!important;color:var(--da-ink)!important}
#tab-pivot .daAdvancedField{align-self:end}
#tab-pivot .daAdvancedField .btn{width:100%;min-height:40px;background:#fff!important;color:var(--da-blue)!important;border:1px solid #9fc5f8!important;border-radius:9px!important;white-space:nowrap}

body[data-visual-system="nplus1"] #tab-pivot .daBuilderPanel{margin:0!important;padding:16px!important;border:1px solid var(--da-line)!important;border-radius:15px!important;background:#fff!important;color:var(--da-ink)!important;box-shadow:0 5px 18px rgba(44,83,133,.05)}
#tab-pivot .daFieldLibraryHead{display:flex;align-items:center;justify-content:space-between;gap:16px}
#tab-pivot .daFieldLibraryHead .sectionTitle{display:flex!important;align-items:baseline!important;justify-content:flex-start!important;gap:12px!important;margin:0!important;min-height:auto!important}
#tab-pivot .daFieldLibraryHead h3{margin:0;color:var(--da-ink)!important;font-size:18px}
#tab-pivot .daFieldLibraryHead small{color:var(--da-muted)!important;font-size:12px}
#tab-pivot .daFieldSearch{width:min(240px,100%);flex:0 0 auto}
#tab-pivot .daFieldGroups{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin:12px 0 10px}
#tab-pivot .daFieldGroups button{min-height:34px;padding:7px 16px;border:1px solid var(--da-line);border-radius:9px;background:#fff;color:#405776!important;font-size:12px;font-weight:800;cursor:pointer}
#tab-pivot .daFieldGroups button.active{background:var(--da-blue);border-color:var(--da-blue);color:#fff!important;box-shadow:0 4px 10px rgba(18,104,234,.2)}
body[data-visual-system="nplus1"] #tab-pivot .pivotFieldPool{display:flex;gap:8px;flex-wrap:wrap;min-height:54px;padding:9px!important;border:0!important;border-radius:10px!important;background:#fff!important;color:var(--da-ink)!important}
body[data-visual-system="nplus1"] #tab-pivot .pivotFieldCard{display:flex;align-items:stretch;border:1px solid #cdddf0!important;border-radius:9px!important;background:#f8fbff!important;color:var(--da-ink)!important;overflow:hidden;box-shadow:0 2px 6px rgba(49,84,126,.05)}
body[data-visual-system="nplus1"] #tab-pivot .pivotFieldCard .pivotField{min-height:36px!important;padding:7px 10px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#213957!important;font-size:12px;font-weight:800}
body[data-visual-system="nplus1"] #tab-pivot .pivotFieldCard .pivotField{-webkit-text-fill-color:#213957!important}
#tab-pivot .pivotFieldCard .pivotField::before{content:'⠿';margin-right:7px;color:#7d91ad}
#tab-pivot .pivotFieldActions{display:flex;border-left:1px solid #dce6f2}
body[data-visual-system="nplus1"] #tab-pivot .pivotFieldCard .pivotFieldActions .pivotQuickAdd{min-width:34px;padding:0 7px;border:0;border-left:1px solid #e4ecf6;background:#fff;color:#506986!important;font-size:0;cursor:pointer}
body[data-visual-system="nplus1"] #tab-pivot .pivotFieldCard .pivotFieldActions .pivotQuickAdd{-webkit-text-fill-color:#506986!important}
#tab-pivot .pivotQuickAdd::after{content:'+';font-size:18px;font-weight:700}
#tab-pivot .pivotFieldEmpty{width:100%;padding:12px;text-align:center;color:var(--da-muted)!important;font-size:13px}

#tab-pivot .pivotDropGrid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;margin-top:12px!important}
body[data-visual-system="nplus1"] #tab-pivot .pivotDropZone{min-height:118px!important;padding:0!important;border:1px solid!important;border-radius:12px!important;background:#fff!important;color:var(--da-ink)!important;overflow:hidden}
#tab-pivot .pivotDropZone .daZoneHeading{padding:10px 13px;border-bottom:1px solid currentColor;background:color-mix(in srgb,currentColor 7%,white);opacity:1}
#tab-pivot .pivotDropZone .daZoneHeading strong{display:block;color:inherit!important;font-size:14px}
body[data-visual-system="nplus1"] #tab-pivot .pivotDropZone .daZoneHeading small{display:block;margin:3px 0 0;color:#465a78!important;font-size:10px}
body[data-visual-system="nplus1"] #tab-pivot .daRowsZone .daZoneHeading strong{color:#0958b8!important;-webkit-text-fill-color:#0958b8!important}
body[data-visual-system="nplus1"] #tab-pivot .daColumnsZone .daZoneHeading strong{color:#087553!important;-webkit-text-fill-color:#087553!important}
body[data-visual-system="nplus1"] #tab-pivot .daValuesZone .daZoneHeading strong{color:#5933b8!important;-webkit-text-fill-color:#5933b8!important}
body[data-visual-system="nplus1"] #tab-pivot .daFiltersZone .daZoneHeading strong{color:#925500!important;-webkit-text-fill-color:#925500!important}
body[data-visual-system="nplus1"] #tab-pivot .pivotDropZone .daZoneHeading small{-webkit-text-fill-color:#465a78!important}
#tab-pivot .daRowsZone{color:#0958b8!important;border-color:#91c4ff!important}
#tab-pivot .daColumnsZone{color:#087553!important;border-color:#92e0c4!important}
#tab-pivot .daValuesZone{color:#5933b8!important;border-color:#c8b6fa!important}
#tab-pivot .daFiltersZone{color:#925500!important;border-color:#f5c783!important}
body[data-visual-system="nplus1"] #tab-pivot .pivotZoneItems{display:flex;align-content:flex-start;gap:7px;flex-wrap:wrap;min-height:64px;padding:12px!important;background:transparent!important;color:var(--da-ink)!important}
body[data-visual-system="nplus1"] #tab-pivot .pivotChip{display:inline-flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid #cdddf0!important;border-radius:8px!important;background:#eef6ff!important;color:#244b78!important;font-size:12px;font-weight:800}
body[data-visual-system="nplus1"] #tab-pivot .pivotChip button{border:0;background:transparent;color:#55708f!important;font-size:16px;cursor:pointer}
body[data-visual-system="nplus1"] #tab-pivot .pivotDropZone .pivotZoneItems .pivotZoneHint{display:block;width:100%;padding-top:11px;color:#526681!important;text-align:center;font-size:12px}
body[data-visual-system="nplus1"] #tab-pivot .pivotZoneItems>.pivotChip{color:#244b78!important;-webkit-text-fill-color:#244b78!important}
body[data-visual-system="nplus1"] #tab-pivot .pivotChip button{-webkit-text-fill-color:#55708f!important}
body[data-visual-system="nplus1"] #tab-pivot .pivotDropZone .pivotZoneItems .pivotZoneHint{-webkit-text-fill-color:#526681!important}
#tab-pivot .pivotDropZone.dragover{outline:3px solid rgba(18,104,234,.18);outline-offset:2px}
#tab-pivot .pivotDropZone.daAttention{animation:daAttentionPulse .9s ease}
@keyframes daAttentionPulse{0%,100%{box-shadow:none}45%{box-shadow:0 0 0 5px rgba(227,138,19,.2)}}

#tab-pivot .pivotToolbar{display:grid!important;grid-template-columns:minmax(130px,.8fr) minmax(150px,1fr) minmax(220px,1.55fr) minmax(150px,.9fr) auto!important;gap:12px!important;align-items:end;margin-top:14px!important;padding-top:14px;border-top:1px solid #e6edf6}
#tab-pivot .pivotToolbar .btn{min-height:40px;width:100%;border-radius:9px!important}
#tab-pivot #generatePivotBtn{border-color:var(--da-blue)!important;background:var(--da-blue)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
#tab-pivot .daResetField .btn{border:0!important;background:transparent!important;color:var(--da-blue)!important;white-space:nowrap}

#tab-pivot .pivotResultsGrid{display:grid!important;grid-template-columns:minmax(0,1.12fr) minmax(0,.92fr)!important;gap:14px!important;margin-top:14px!important;align-items:stretch!important}
body[data-visual-system="nplus1"] #tab-pivot .pivotResultsGrid>.pivotResultPanel{display:flex!important;flex-direction:column!important;min-width:0!important;min-height:410px!important;height:auto!important;margin:0!important;padding:14px!important;border:1px solid var(--da-line)!important;border-radius:15px!important;background:#fff!important;color:var(--da-ink)!important;box-shadow:0 5px 18px rgba(44,83,133,.05)}
#tab-pivot .pivotResultPanel>.sectionTitle{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;min-height:48px!important;margin:0 0 8px!important}
#tab-pivot .pivotResultPanel>.sectionTitle h3{margin:0;color:var(--da-ink)!important;font-size:17px}
#tab-pivot .pivotResultPanel>.sectionTitle small{display:block;margin-top:4px;color:var(--da-muted)!important;font-size:11px}
#tab-pivot .daResultActions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
#tab-pivot .daResultActions .btn{min-height:36px;padding:7px 11px;border:1px solid var(--da-line)!important;border-radius:8px!important;background:#fff!important;color:#356099!important;font-size:12px}
#tab-pivot .pivotResultPanel>.sectionTitle select{width:auto;min-width:130px;min-height:36px}
#tab-pivot .pivotFilterControls{margin-bottom:8px}
#tab-pivot .pivotFilterControls:empty{display:none}
#tab-pivot .pivotFilterControls .notice{padding:9px 12px;border-color:#d9e7f6;background:#f7fbff;color:#607393}
#tab-pivot .pivotTableWrap{flex:1 1 auto!important;min-width:0;overflow:auto;border:1px solid #e2eaf4;border-radius:10px;background:#fff}
#tab-pivot .pivotTable{width:100%;border-collapse:collapse;color:var(--da-ink)!important;font-size:12px}
#tab-pivot .pivotTable :is(th,td){padding:10px 12px;border-bottom:1px solid #e7eef7;text-align:right;white-space:nowrap;color:var(--da-ink)!important}
#tab-pivot .pivotTable :is(th,td):first-child{text-align:left}
#tab-pivot .pivotTable thead th{position:sticky;top:0;z-index:1;background:#eaf2fd!important;color:#263d5e!important;font-weight:850}
#tab-pivot .pivotTable tbody tr:nth-child(even){background:#f8fbff}
#tab-pivot #pivotChartArea{display:flex;align-items:stretch;justify-content:stretch;flex:1 1 auto!important;min-width:0;min-height:290px!important;padding:10px;border:1px solid #edf2f8;border-radius:10px;background:linear-gradient(180deg,#fff,#fbfdff)}
#tab-pivot #pivotChartArea .chart{display:flex;align-items:flex-end;justify-content:space-around;gap:10px;width:100%;min-height:270px;padding:26px 8px 6px;border-bottom:1px solid #d8e3f0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 52px,#e9eff7 53px)}
#tab-pivot #pivotChartArea .chartCol{display:grid;grid-template-rows:24px minmax(150px,1fr) auto;align-items:end;justify-items:center;min-width:44px;max-width:88px;height:100%;color:#354d6b}
#tab-pivot #pivotChartArea .chartVal{color:#203858!important;font-weight:850}
#tab-pivot #pivotChartArea .chartBar{width:min(52px,76%);min-height:3px;border-radius:5px 5px 0 0;background:linear-gradient(180deg,#3989f6,#1769dd);box-shadow:0 3px 8px rgba(23,105,221,.18)}
#tab-pivot #pivotChartArea .chartCol:nth-child(3n+2) .chartBar{background:linear-gradient(180deg,#34b8ec,#1695d2)}
#tab-pivot #pivotChartArea .chartCol:nth-child(3n) .chartBar{background:linear-gradient(180deg,#3fcf91,#1eae72)}
#tab-pivot #pivotChartArea .chartLabel{margin-top:7px;color:#526884!important;font-size:10px;text-align:center;line-height:1.15;white-space:normal}
#tab-pivot .pivotLineChart{width:100%;min-width:560px;align-self:center}
#tab-pivot .pivotLineChart svg{display:block;width:100%;height:auto;overflow:visible}
#tab-pivot .pivotLineGrid{fill:none;stroke:#dfe8f3;stroke-width:1}
#tab-pivot .pivotLinePath{fill:none;stroke:#1268ea;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
#tab-pivot .pivotLineChart circle{fill:#fff;stroke:#1268ea;stroke-width:4}
#tab-pivot .pivotLineChart text{fill:#526884;font-size:10px;text-anchor:middle}
#tab-pivot .pivotLineChart .pivotLineValue{fill:#203858;font-size:12px;font-weight:800}

/* Tenant Branding is allowed to define global text tokens, but every element
   below lives on a fixed light Dynamic Analysis surface. Keep foregrounds
   paired with those surfaces at a specificity that wins over tab-scoped
   Branding declarations, including -webkit-text-fill-color. */
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .daFieldLibraryHead small,
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .pivotResultPanel>.sectionTitle small{
  color:var(--da-muted)!important;
  -webkit-text-fill-color:var(--da-muted)!important;
}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .pivotFieldCard .pivotField{
  color:#213957!important;
  -webkit-text-fill-color:#213957!important;
}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .pivotFieldCard .pivotQuickAdd{
  color:#506986!important;
  -webkit-text-fill-color:#506986!important;
}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .pivotDropZone .daZoneHeading small{
  color:#465a78!important;
  -webkit-text-fill-color:#465a78!important;
}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .daRowsZone .daZoneHeading strong{color:#0958b8!important;-webkit-text-fill-color:#0958b8!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .daColumnsZone .daZoneHeading strong{color:#087553!important;-webkit-text-fill-color:#087553!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .daValuesZone .daZoneHeading strong{color:#5933b8!important;-webkit-text-fill-color:#5933b8!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .daFiltersZone .daZoneHeading strong{color:#925500!important;-webkit-text-fill-color:#925500!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .pivotZoneItems>.pivotChip{color:#244b78!important;-webkit-text-fill-color:#244b78!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .pivotZoneItems>.pivotChip button{color:#55708f!important;-webkit-text-fill-color:#55708f!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .daBuilderPanel .pivotDropZone .pivotZoneHint{color:#526681!important;-webkit-text-fill-color:#526681!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .pivotResultPanel>.sectionTitle h3,
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .pivotResultPanel .pivotTable :is(th,td,strong){color:var(--da-ink)!important;-webkit-text-fill-color:var(--da-ink)!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .pivotResultPanel .pivotTable thead th{color:#263d5e!important;-webkit-text-fill-color:#263d5e!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .pivotResultPanel #pivotChartArea .chartVal{color:#203858!important;-webkit-text-fill-color:#203858!important}
body[data-visual-system="nplus1"] #tab-pivot#tab-pivot .pivotResultPanel #pivotChartArea .chartLabel{color:#526884!important;-webkit-text-fill-color:#526884!important}

@media(max-width:1180px){
 body[data-visual-system="nplus1"] #tab-pivot .daFilterBar{grid-template-columns:repeat(3,minmax(0,1fr))}
 #tab-pivot .pivotDropGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 #tab-pivot .pivotToolbar{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 #tab-pivot .daKpiNameField{grid-column:span 2}
 #tab-pivot .pivotResultsGrid{grid-template-columns:1fr!important}
}
@media(max-width:760px){
 body[data-visual-system="nplus1"] #tab-pivot{padding:12px!important;border-radius:14px}
 #tab-pivot .dynamicAnalysisHeader{flex-direction:column}
 #tab-pivot .daHeaderActions{width:100%;justify-content:stretch}
 #tab-pivot .daHeaderActions .btn{flex:1 1 140px}
 #tab-pivot .daHelpStrip{align-items:flex-start;flex-wrap:wrap}
 #tab-pivot .daHelpStrip a{width:100%;margin-left:34px}
 body[data-visual-system="nplus1"] #tab-pivot .daFilterBar{grid-template-columns:1fr!important}
 #tab-pivot .daFieldLibraryHead{align-items:stretch;flex-direction:column}
 #tab-pivot .daFieldLibraryHead .sectionTitle{align-items:flex-start!important;flex-direction:column}
 #tab-pivot .daFieldSearch{width:100%}
 #tab-pivot .daFieldGroups{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
 #tab-pivot .daFieldGroups button{flex:0 0 auto}
 #tab-pivot .pivotDropGrid{grid-template-columns:1fr!important}
 #tab-pivot .pivotToolbar{grid-template-columns:1fr!important}
 #tab-pivot .daKpiNameField{grid-column:auto}
 #tab-pivot .pivotResultPanel>.sectionTitle{align-items:flex-start!important;flex-direction:column}
 #tab-pivot .daResultActions{width:100%;justify-content:stretch}
 #tab-pivot .daResultActions .btn{flex:1 1 130px}
 #tab-pivot #pivotChartArea{overflow-x:auto}
 #tab-pivot #pivotChartArea .chart{min-width:620px}
}
