/*
    THE LOSS WATERFALL'S OWN STYLESHEET.

    Everything Components/Shared/LossWaterfallChart.razor and the table beside it,
    Components/Shared/ClippingBreakdownTable.razor, need and nothing else. The two share a file
    because they are one reading of one solved field: the fifteen steps, and the four causes step 13
    counts apart.

    A STEP THAT DID NOT APPLY REPORTS ZERO AND SAYS SO. It never disappears and never renders a bare
    zero, so the "not modelled" row has its own treatment and is not the same shape as a row that
    came out at nothing.

    A GAIN IS DRAWN AS A GAIN. Step 2 is a transposition gain on a tilted plane, and a chart that
    can only descend has to lie about it.

    WHAT IT DOES NOT OWN. .sv-table, .sv-table-wrap and .sv-measured are utilities and stay in
    utilities.css.
*/

.sv-waterfall__table {
  width: 100%;
}

.sv-waterfall__index {
  display: inline-block;
  width: 20px;
  color: var(--sv-text-tertiary);
  font-family: var(--sv-font-mono);
  font-size: 11px;
}

.sv-waterfall__unit {
  font-size: 9px;
  color: var(--sv-text-tertiary);
  margin-left: 2px;
}

.sv-waterfall__row--none td {
  color: var(--sv-text-tertiary);
}

.sv-waterfall__none {
  color: var(--sv-text-tertiary);
}

.sv-waterfall__gain {
  color: var(--sv-module-edge);
}

/* What the chart cannot say on its own: the steps that can come out as a gain, and the one rule
   about the column. Printed under the table because a hover handler would round-trip over SignalR
   and a PDF has no pointer at all. */
.sv-waterfall__notes {
  display: grid;
  gap: var(--sv-space-2);
  margin: var(--sv-space-3) 0 0;
}

.sv-waterfall__notes dt {
  display: flex;
  align-items: baseline;
  gap: var(--sv-space-1);
  margin-bottom: 2px;
}

.sv-waterfall__notes dd {
  margin: 0;
  font: 400 12px/1.5 var(--sv-font-sans);
  color: var(--sv-text-secondary);
}

.sv-waterfall__composition {
  margin: var(--sv-space-3) 0 0;
  padding-top: var(--sv-space-2);
  border-top: 1px solid var(--sv-border-subtle);
  font: 400 12px/1.5 var(--sv-font-sans);
  color: var(--sv-text-secondary);
}

/* Step 13 by cause. A cause that did not happen keeps its row and greys out; one that is not
   modelled at all prints the house dash, because a nought would be a measurement nobody made. */
.sv-clipping__row--none td {
  color: var(--sv-text-tertiary);
}

.sv-clipping__unmodelled {
  color: var(--sv-text-tertiary);
}

.sv-clipping__notes {
  display: grid;
  gap: var(--sv-space-2);
  margin: var(--sv-space-3) 0 0;
}

.sv-clipping__notes dd {
  margin: 0;
  font: 400 12px/1.5 var(--sv-font-sans);
  color: var(--sv-text-secondary);
}

.sv-clipping__clear {
  margin: var(--sv-space-3) 0 0;
  font: 400 12px/1.5 var(--sv-font-sans);
  color: var(--sv-text-secondary);
}

.sv-waterfall__bar-head {
  width: 34%;
}

.sv-waterfall__bar-cell {
  padding-right: var(--sv-space-3);
}

/* The FILL token, because this is a shape rather than text. The accent measures
   about 2:1 against paper and fails AA as text; as a bar it is fine. */
.sv-waterfall__bar {
  display: block;
  height: 8px;
  border-radius: 2px;
  background: var(--sv-accent-fill);
  min-width: 1px;
}
