/* Shared Insights navigation. Keep all four views on one component contract. */
.nv-insights-tabs {
  display: flex;
  width: fit-content;
  max-width: 100%;
  min-width: 0;
  min-height: 32px;
  align-items: center;
  gap: 6px;
  padding: 0;
  overflow-x: auto;
  background: transparent;
  scrollbar-width: none;
}

.nv-insights-tabs::-webkit-scrollbar { display: none; }

.nv-insights-tabs > :is(a, button, span) {
  display: inline-flex;
  width: auto;
  min-height: 32px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  padding: 0 13px;
  border: 0;
  border-radius: 999px;
  background: var(--nv-table-well, var(--dash-card));
  color: var(--nv-table-head, var(--dash-text-muted));
  font: inherit;
  font-size: var(--nv-type-footnote-size);
  letter-spacing: var(--nv-type-footnote-tracking);
  font-weight: var(--nv-type-weight-medium);
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 140ms ease, color 140ms ease;
}

.nv-insights-tabs > :is(a, button):hover {
  background: var(--nv-table-row-hover, var(--dash-surface-hover));
  color: var(--nv-table-text, var(--dash-text));
}

.nv-insights-tabs > :is(.is-active, [aria-selected="true"], [aria-current="page"]) {
  background: var(--nv-table-row-selected, var(--dash-surface-hover));
  color: var(--nv-table-text, var(--dash-text));
  cursor: default;
}