/* /Components/JsonDocumentViewer.razor.rz.scp.css */
.json-entity-section[b-aq1upgi6qd] {
    border-radius: 8px;
    background-color: #ffffff;
    transition: background-color 150ms;
}

.json-entity-section:hover[b-aq1upgi6qd] {
    background-color: rgba(49, 178, 159, 0.04);
}

.json-entity-header[b-aq1upgi6qd] {
    cursor: pointer;
    border-bottom: 1px solid #dde5ea;
}

.json-entity-content[b-aq1upgi6qd] {
    padding-left: 12px;
    background-color: #ffffff;
}

.json-property-row[b-aq1upgi6qd] {
    border-bottom: 1px solid #f0f3f5;
}

.json-property-row:last-child[b-aq1upgi6qd] {
    border-bottom: none;
}

// Edit mode gets a subtle tint to distinguish from read-only[b-aq1upgi6qd]
 .mud-input-outlined .mud-input-slot {
    background-color: #ecf4f7;
}
/* /Pages/Tracking.razor.rz.scp.css */
/* The tracking page: summary strip, journey strip and the phases with their attempts and steps.
   Colours follow the app palette (#032e40 ink, #035c81 accent, #dde5ea lines, #5c7278 muted). */

.mono[b-ic3ke1wpwh] { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; }
.num[b-ic3ke1wpwh] { font-variant-numeric: tabular-nums; }
.eyebrow[b-ic3ke1wpwh] { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #5c7278; font-weight: 500; margin-bottom: 8px; }

/* ---- summary: one row of label-over-value facts, wrapping when narrow ---- */
.facts[b-ic3ke1wpwh] { display: flex; flex-wrap: wrap; padding: 8px 4px; }
.fact[b-ic3ke1wpwh] { display: grid; gap: 2px; padding: 6px 16px; border-right: 1px solid #dde5ea; min-width: 0; }
.fact:last-child[b-ic3ke1wpwh] { border-right: 0; }
.fact .l[b-ic3ke1wpwh] { font-size: 11.5px; color: #5c7278; letter-spacing: .02em; }
.fact .v[b-ic3ke1wpwh] { font-size: 14px; font-weight: 500; color: #032e40; white-space: nowrap; }
.fact .v .u[b-ic3ke1wpwh] { font-weight: 400; color: #5c7278; font-size: 12.5px; }

/* ---- journey strip ---- */
.journey-row[b-ic3ke1wpwh] { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.phase-box[b-ic3ke1wpwh] { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid #dde5ea; border-radius: 10px; background: #ffffff; }
.phase-box .name[b-ic3ke1wpwh] { font-weight: 500; color: #032e40; }
.phase-box .att[b-ic3ke1wpwh] { display: flex; gap: 4px; }
.att-dot[b-ic3ke1wpwh] { width: 22px; height: 22px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 11px; font-weight: 500;
    font-variant-numeric: tabular-nums; border: 1.5px solid; }
.arrow[b-ic3ke1wpwh] { color: #9aa8ad; font-size: 18px; line-height: 1; padding: 0 2px; }

/* ---- phases ---- */
.phase[b-ic3ke1wpwh] { overflow: hidden; }
.phase-head[b-ic3ke1wpwh] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 14px 20px; border-bottom: 1px solid #dde5ea; }
.phase-head .meta[b-ic3ke1wpwh] { color: #5c7278; font-size: 12.5px; }
.phase-head .right[b-ic3ke1wpwh] { margin-left: auto; display: flex; gap: 8px; align-items: center; }

.attempt[b-ic3ke1wpwh] { border-bottom: 1px solid #dde5ea; }
.attempt:last-child[b-ic3ke1wpwh] { border-bottom: 0; }
.att-head[b-ic3ke1wpwh] { width: 100%; display: flex; align-items: center; gap: 10px; padding: 10px 20px; background: #ecf4f7;
    border: 0; font: inherit; color: #032e40; text-align: left; cursor: pointer; }
.att-head .t[b-ic3ke1wpwh] { font-weight: 500; }
.att-head .m[b-ic3ke1wpwh] { color: #5c7278; font-size: 12.5px; }
.att-head[b-ic3ke1wpwh]  .caret { margin-left: auto; color: #9aa8ad; }

/* ---- steps timeline ---- */
.steps[b-ic3ke1wpwh] { display: grid; padding: 6px 20px 10px; }
.step[b-ic3ke1wpwh] { display: grid; grid-template-columns: 62px 22px 1fr; column-gap: 12px; position: relative; }
.step .time[b-ic3ke1wpwh] { padding-top: 12px; color: #5c7278; font-size: 12px; text-align: right; }
.step .time .d[b-ic3ke1wpwh] { display: block; color: #9aa8ad; font-size: 11px; }
.step .rail[b-ic3ke1wpwh] { position: relative; }
.step .rail[b-ic3ke1wpwh]::before { content: ""; position: absolute; left: 10px; top: 0; bottom: 0; width: 2px; background: #dde5ea; }
.step:first-child .rail[b-ic3ke1wpwh]::before { top: 18px; }
.step:last-child .rail[b-ic3ke1wpwh]::before { bottom: calc(100% - 18px); }
.step .dot[b-ic3ke1wpwh] { position: absolute; left: 4px; top: 12px; width: 14px; height: 14px; border-radius: 50%; border: 2px solid; background: #9aa8ad; }

.step-body[b-ic3ke1wpwh] { padding: 6px 0 10px; border-bottom: 1px solid #dde5ea; min-width: 0; }
.step:last-child .step-body[b-ic3ke1wpwh] { border-bottom: 0; }
.step-head[b-ic3ke1wpwh] { width: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 4px 0; background: transparent; border: 0;
    font: inherit; color: #032e40; text-align: left; cursor: pointer; }
.step-head:disabled[b-ic3ke1wpwh] { cursor: default; color: #032e40; }
.step-head .name[b-ic3ke1wpwh] { font-weight: 500; }
.step-head .who[b-ic3ke1wpwh] { color: #9aa8ad; font-size: 12px; }
.step-head .n[b-ic3ke1wpwh] { margin-left: auto; color: #9aa8ad; font-size: 11.5px; font-variant-numeric: tabular-nums; }
.step .msg[b-ic3ke1wpwh] { margin: 2px 0 0; color: #35505b; white-space: pre-wrap; overflow-wrap: anywhere; }
.step.bad .msg[b-ic3ke1wpwh] { color: #b3261e; }
.step-actions[b-ic3ke1wpwh] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 2px 0 4px; }
.step-actions[b-ic3ke1wpwh]  .run-link { border: 1px solid #c3d1d8; border-radius: 11px; padding: 1px 8px; font-weight: 500; white-space: nowrap; }

.details[b-ic3ke1wpwh] { margin-top: 8px; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.kv[b-ic3ke1wpwh] { border: 1px solid #dde5ea; border-radius: 8px; padding: 8px 10px; background: #f4f7f9; min-width: 0; }
.kv h4[b-ic3ke1wpwh] { margin: 0 0 6px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: #5c7278; font-weight: 500; }
.kv dl[b-ic3ke1wpwh] { margin: 0; display: grid; grid-template-columns: max-content 1fr; gap: 3px 12px; }
.kv dt[b-ic3ke1wpwh] { color: #5c7278; font-size: 12px; }
.kv dd[b-ic3ke1wpwh] { margin: 0; font-size: 12.5px; overflow-wrap: anywhere; }
.kv.err[b-ic3ke1wpwh] { border-color: #e8b4b0; }
.kv.err h4[b-ic3ke1wpwh] { color: #b3261e; }

.timings[b-ic3ke1wpwh] { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12px; color: #5c7278; margin-top: 6px; }
.timings b[b-ic3ke1wpwh] { font-weight: 500; color: #35505b; font-variant-numeric: tabular-nums; }

.raw[b-ic3ke1wpwh] { margin: 0; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; line-height: 1.5; overflow-x: auto; color: #35505b; white-space: pre; }

@media (max-width: 560px) {
    .step[b-ic3ke1wpwh] { grid-template-columns: 22px 1fr; }
    .step .time[b-ic3ke1wpwh] { display: none; }
    .steps[b-ic3ke1wpwh] { padding-inline: 12px; }
    .phase-head[b-ic3ke1wpwh], .att-head[b-ic3ke1wpwh] { padding-inline: 14px; }
}