/* Shared status colours and typography in staff and customer views. */
.f8-order-status.status-wait{--os-bg:#4c3c21;--os-text:#ffd485;--os-border:#846335}
.f8-order-status.status-approval{--os-bg:#382c55;--os-text:#ddc1ff;--os-border:#8060ad}
.f8-order-status.status-work{--os-bg:#14395b;--os-text:#79c7ff;--os-border:#2668a0}
.f8-order-status.status-ready{--os-bg:#103d38;--os-text:#62e6c5;--os-border:#286658}
.f8-order-status.status-closed{--os-bg:#242d3e;--os-text:#b1bfd5;--os-border:#44516a}
.f8-order-status{display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;max-width:100%;min-height:36px;padding:7px 12px;border:1px solid var(--os-border,#44516a);border-radius:12px;background:var(--os-bg,#242d3e);color:var(--os-text,#b1bfd5);font-family:inherit;font-size:14px;font-weight:600;line-height:1.4;white-space:normal;overflow-wrap:anywhere;text-align:left}
span.f8-order-status::before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.order-data-head{flex-wrap:wrap;gap:14px}
.order-status-control{flex:0 1 310px;max-width:100%;min-width:0}
.order-status-control select.f8-order-status{width:100%;min-width:0;min-height:44px;padding:10px 34px 10px 12px;border-radius:12px;font-size:14px;font-weight:600;line-height:1.4;background-color:var(--os-bg,#242d3e);color:var(--os-text,#b1bfd5);border-color:var(--os-border,#44516a);background-image:none;appearance:auto}
select.f8-order-status option{background:#142032;color:#eef1ff}
.order-row .f8-order-status{font-size:11px;min-height:28px;padding:4px 8px;line-height:1.4}
.cp-view .cp-stage{display:flex;margin:18px 0 0;padding:0;background:transparent;border:0;border-radius:0;color:inherit}
.ca-order .f8-order-status{justify-self:start}
@media(max-width:700px){.order-status-control{flex-basis:100%;width:100%}.order-data-head{align-items:flex-start}}

/* One set of buttons replaces the separate status and stage editors. */
.order-status-control{width:100%;max-width:none;flex-basis:100%;margin:20px 0 0}
.order-status-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:9px}
.order-status-buttons .order-status-button{width:100%;min-width:0;min-height:44px;justify-content:center;text-align:center;padding:10px 9px;border:1px solid #3c4c64;background:#162236;color:#bac7dc;border-radius:11px;font-size:13px;font-weight:550;cursor:pointer;transition:background .12s,border-color .12s}
.order-status-buttons .order-status-button[aria-pressed=true]{background:var(--os-bg);color:var(--os-text);border-color:var(--os-text);box-shadow:inset 0 0 0 1px var(--os-border);font-weight:750}
.order-status-buttons .order-status-button:focus-visible{outline:3px solid #d48be9;outline-offset:2px}
.order-status-buttons .order-status-button:disabled{cursor:wait;opacity:.65}
.order-status-buttons [data-order-status-option="Согласование с клиентом"]{grid-column:span 2}
.order-status-control[data-saving=true] .order-status-buttons{opacity:.85}
.ca-progress [data-status-timeline]{overflow-x:auto;scrollbar-width:thin;scroll-padding-inline:15px;padding-bottom:8px}
.ca-progress [data-status-timeline] .ca-step{flex:0 0 var(--status-step-width,80px);min-width:var(--status-step-width,80px);max-width:var(--status-step-width,80px)}
.ca-progress [data-status-timeline] .ca-step[aria-current=step]{color:var(--ca-ink,#181b2b);font-weight:750}
@media(max-width:700px){.order-status-buttons{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.order-status-buttons .order-status-button{font-size:13px;min-height:44px}.order-status-control{margin-top:20px}}