/* ===========================================================
   Sales Analytics — Phase 5 U3: Inline sparklines
   =========================================================== */

.sa-sparkline {
    width: 60px;
    height: 16px;
    display: block;
    overflow: visible;
}

    .sa-sparkline path {
        fill: none;
        stroke: var(--sa-accent, #4f7cff);
        stroke-width: 1;
        stroke-linecap: round;
        stroke-linejoin: round;
        opacity: 0.85;
    }

.sa-sparkline-dot {
    fill: var(--sa-accent, #4f7cff);
    stroke: none;
}

.sa-item-sparkline {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
}

.sa-sparkline-col {
    font-size: 0.7rem;
    color: var(--sa-muted, #888);
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.sa-acc-sparkline-spacer {
    /* Empty — division-level aggregation deferred */
}
.sa-sparkline path {
    stroke-width: 1.25;
    opacity: 1;
}

.sa-sparkline-dot {
    r: 2;
}

/* ───────── Direction-based coloring (Phase 5 U3 enhancement) ─────────
   Partial adds .sa-sparkline-up / -down / -flat based on first-half-avg
   vs second-half-avg with ±10% dead zone. Threshold lives in the partial.
*/
.sa-sparkline-up path {
    stroke: var(--sa-spark-up, #16a34a);
}

.sa-sparkline-up .sa-sparkline-dot {
    fill: var(--sa-spark-up, #16a34a);
}

.sa-sparkline-down path {
    stroke: var(--sa-spark-down, #dc2626);
}

.sa-sparkline-down .sa-sparkline-dot {
    fill: var(--sa-spark-down, #dc2626);
}

.sa-sparkline-flat path {
    stroke: var(--sa-spark-flat, #9ca3af);
}

.sa-sparkline-flat .sa-sparkline-dot {
    fill: var(--sa-spark-flat, #9ca3af);
}