/* The /sales landing-page dashboards (Sales::VisitsController,
 * TimingController, EngagementController, ExperimentsController): the /sales
 * navigation, the bar rows (app/views/sales/shared/_bar.html.erb, an SVG bar
 * with an optional 95% interval line), the tables and the experiment status.
 * The date range reuses the funnel's .sales-funnel-range classes. */

.sales-report {
  max-width: 72rem;
  margin-inline: auto;
  color: var(--text-primary);
}

.sales-nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-4) var(--spacing-12);
  max-width: 28rem;

  & [aria-current="page"] { color: var(--text-primary); font-weight: var(--font-weight-600); }
}

.sales-funnel-preset[aria-current="true"] { border-color: var(--border-strong); color: var(--text-primary); }

/* ---------- Bars ---------- */
.sales-report-bars { display: flex; flex-direction: column; gap: var(--spacing-8); }

.sales-report-bar-row {
  display: grid;
  grid-template-columns: minmax(8rem, 14rem) 1fr minmax(6rem, max-content);
  align-items: center;
  gap: var(--spacing-12);
}

.sales-bar {
  display: block;
  width: 100%;
  min-width: 4rem;
  height: 10px;
}

.sales-bar-track { fill: var(--background-surface-2); }
.sales-bar-fill { fill: var(--border-brand); }

.sales-bar-interval {
  stroke: var(--text-primary);
  stroke-width: var(--stroke-weight-2);
}

/* ---------- Tables ---------- */
.sales-report-table-wrap { overflow-x: auto; }

.sales-report-table {
  width: 100%;
  border-collapse: collapse;

  & th, & td {
    padding: var(--spacing-4) var(--spacing-8);
    border-top: var(--stroke-weight-1) solid var(--border-subtle);
    text-align: left;
    vertical-align: top;
  }

  & th { color: var(--text-tertiary); font-weight: var(--font-weight-400); }
  & td .sales-bar { max-width: 12rem; margin-top: var(--spacing-4); }
}

.sales-report-num { text-align: right; white-space: nowrap; }
.sales-report-table .sales-report-num { text-align: right; }
.sales-report-total td { font-weight: var(--font-weight-600); }
.sales-report-group-start td { border-top-color: var(--border-strong); }

.sales-report-note { margin-top: var(--spacing-12); }

.sales-report-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-4) var(--spacing-16);
  padding: 0;
  list-style: none;
}

/* ---------- Experiments ---------- */
.sales-experiment-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--spacing-12);
}

.sales-experiment-status {
  padding: var(--spacing-2) var(--spacing-8);
  border: var(--stroke-weight-1) solid var(--border-default);
  border-radius: var(--corner-radius-full);
  color: var(--text-secondary);
}

.sales-experiment-status--decidable { border-color: var(--border-brand); color: var(--text-primary); }
.sales-experiment-status--stopped_for_harm { border-color: var(--text-danger); color: var(--text-danger); }
.sales-experiment-status--ended { color: var(--text-tertiary); }