/* /Components/Pages/Sessions/Tabs/TestsTab.razor.rz.scp.css */
/*
 * © 2026 Xping.io. All Rights Reserved.
 *
 * This file is part of the Xping Solution.
 */

/* The sort picker sits in the same row as the filter chips, so it has to be small enough not to
   dominate them.

   ::deep because the class is handed to MudSelect, and CSS isolation only stamps its scope
   attribute onto elements this component renders itself — a child component's own root never
   carries it, so a bare .xping-tests__sort would compile to a selector that matches nothing and
   the picker would stretch the whole row. */
.xping-tests__toolbar[b-ji4vz0is1s]  .xping-tests__sort {
    flex: 0 0 auto;
    width: 190px;
    margin-inline-start: auto;
}

/* Below the sort picker's own breakpoint it needs the full row rather than a fixed width. */
@media (max-width: 599px) {
    .xping-tests__toolbar[b-ji4vz0is1s]  .xping-tests__sort {
        width: 100%;
        margin-inline-start: 0;
    }
}
/* /Components/Shared/Common/StatusDotIndicator.razor.rz.scp.css */
/*
 * © 2025 Xping.io. All Rights Reserved.
 *
 * This file is part of the Xping Solution.
 */

.status-dot[b-8uown08l11] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    vertical-align: middle;
}

/* 8px where the dot sits in a narrow gutter beside 11px type rather than in a table cell. */
.status-dot--dense[b-8uown08l11] {
    width: 8px;
    height: 8px;
}

/* Static states */
.status-dot--success[b-8uown08l11]  { background-color: #10B981; }   /* Complete             — green */
.status-dot--danger[b-8uown08l11]   { background-color: #EF4444; }   /* Failed / Abandoned   — red   */
.status-dot--warning[b-8uown08l11]  { background-color: #F59E0B; }   /* unused               — amber */
.status-dot--pending[b-8uown08l11]  { background-color: #6B7280; }   /* Pending              — grey  */

/* Processing — blue with CSS pulse animation */
.status-dot--processing[b-8uown08l11] {
    background-color: #3B82F6;
    animation: status-pulse-b-8uown08l11 1.4s ease-in-out infinite;
}

@keyframes status-pulse-b-8uown08l11 {
    0%, 100% { opacity: 1;   transform: scale(1);    }
    50%       { opacity: 0.4; transform: scale(0.85); }
}

@media (prefers-reduced-motion: reduce) {
    .status-dot--processing[b-8uown08l11] {
        animation: none;
    }
}
/* /Components/Shared/OutcomeSparkline.razor.rz.scp.css */
/*
 * © 2025 Xping.io. All Rights Reserved.
 *
 * This file is part of the Xping Solution.
 */

/* The slot width is a custom property because two rules need it and they cannot live in the same
   file: this one, and the .mud-tooltip-root rule in app.css that pins a tooltipped slot to the same
   box as a bare one. Blazor stamps its scope attribute only onto elements this component renders
   itself, and MudTooltip's wrapper is not one of them — so that rule has to be global, and this is
   what stops the two widths drifting apart. See the comment beside it in app.css. */
.outcome-sparkline[b-nbn3rmrcve] {
    display: flex;
    align-items: center;
    gap: 3px;
    --xping-spark-slot-width: 9px;
}

.outcome-sparkline__slot[b-nbn3rmrcve] {
    display: block;
    width: var(--xping-spark-slot-width);
    height: 14px;
    border-radius: 2px;
    flex-shrink: 0;
}

/* The sparkline palette is deliberately its own thing rather than Success/Warning/Error — the
   handoff picks colours that read at 9px, which the text colours do not. Declared in app.css. */
.outcome-sparkline__slot--pass[b-nbn3rmrcve] {
    background-color: var(--xping-spark-pass);
}

.outcome-sparkline__slot--degraded[b-nbn3rmrcve] {
    background-color: var(--xping-spark-degraded);
}

.outcome-sparkline__slot--fail[b-nbn3rmrcve] {
    background-color: var(--xping-spark-fail);
}

.outcome-sparkline__slot--empty[b-nbn3rmrcve] {
    background-color: var(--mud-palette-lines-default);
}
