:root{font-family:system-ui,sans-serif;color:#173429;background:#f4f6f2}*{box-sizing:border-box}body{margin:0}header{background:#216549;color:white;padding:20px 4%;display:flex;gap:24px;flex-wrap:wrap;align-items:center}header strong{font-size:26px}small{font-size:13px}main{max-width:1200px;margin:auto;padding:24px}button,input,select{font:inherit;border:1px solid #bbc8bf;border-radius:8px;padding:12px;min-height:46px}button{background:#216549;color:white;cursor:pointer}button:disabled{opacity:.5;cursor:default}input{max-width:100%;background:white}form,.toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.login{max-width:380px;margin:60px auto;display:grid;background:white;padding:28px;border-radius:16px}.layout{display:grid;grid-template-columns:310px 1fr;gap:24px}.queue,.detail{background:white;border-radius:14px;padding:20px}.order{display:block;width:100%;text-align:left;margin:8px 0;background:#eef4ef;color:#173429}.order.active{border:2px solid #216549}.item{padding:16px;margin:12px 0;border:1px solid #dce3dc;border-radius:10px}.item.added{background:#e1f3ff}.item.replaced{background:#fff2bf}.item.removed{background:#ffe0df}.item input{width:120px}.muted{color:#637468}.problem{padding:12px;background:#fff0ce;margin:10px 0}#message{position:fixed;bottom:16px;left:5%;right:5%;background:#173429;color:white;padding:16px;border-radius:8px;display:none}h2{margin-top:0}pre{white-space:pre-wrap}nav{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}@media(max-width:720px){main{padding:12px}.layout{grid-template-columns:1fr}.queue{max-height:260px;overflow:auto}.toolbar{align-items:stretch}.toolbar button{flex:1}.item .toolbar{margin-top:10px}header{padding:15px;gap:10px}}

.catalog-dialog{width:min(520px,94vw);max-height:85vh;border:0;border-radius:16px;padding:24px;color:#173429}.catalog-dialog::backdrop{background:#10291ca6}.catalog-dialog label{display:grid;gap:8px}.catalog-dialog input{width:100%}#catalog-results{max-height:42vh;overflow:auto;margin:16px 0}.catalog-product{display:block;width:100%;text-align:left;margin:8px 0;background:#eef4ef;color:#173429}

.catalog-dialog textarea{font:inherit;width:100%;padding:12px;border:1px solid #bbc8bf;border-radius:8px;resize:vertical}

.removed-history{margin:16px 0;border:1px solid #dce3dc;border-radius:10px;padding:14px}.removed-history summary{cursor:pointer;font-weight:600;min-height:32px}.removed-row{padding:10px 0;border-top:1px solid #e7ebe7;color:#637468}

.employees-dialog{width:min(950px,96vw)}.employee-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px}.employee-layout section{min-width:0}.employee-layout form{display:grid;align-items:start}.employee-layout label{display:grid;gap:5px;width:100%}.employee-layout label:has(input[type=checkbox]){display:flex;align-items:center}.employee-layout input[type=checkbox]{width:20px}#user-error{color:#a32424}@media(max-width:650px){.employee-layout{grid-template-columns:1fr}}
.queue-completed{margin-top:20px;padding-top:12px;border-top:1px solid #dce3dc}.queue-completed h3{font-size:14px;color:#637468;margin:0 0 8px}.order.order-compact{display:flex;align-items:center;gap:8px;min-height:46px;padding:8px 10px;margin:4px 0;background:#f8faf8;border:1px solid #e1e7e2;border-left:4px solid #7aab8a;border-radius:5px;font-size:14px}.order-compact span:not(.visually-hidden){min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.order-compact b{flex-shrink:0}.order.order-compact.active{background:#e8f1e9;border-color:#216549;border-left-width:4px}.queue-cancelled{margin-top:16px;color:#637468}.queue-cancelled summary{cursor:pointer;padding:10px 0;font-size:14px}.queue-cancelled .order-compact{border-left-color:#a8afa9}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.order-compact[draggable=true]{cursor:grab}.order-compact.dragging{opacity:.5}.order-compact.drop-target{outline:2px dashed #216549;outline-offset:2px}
.detail textarea{font:inherit;width:100%;min-height:90px;padding:10px;border:1px solid #bbc8bf;border-radius:8px;resize:vertical}.detail label:has(#dispatch-address){display:block;margin:12px 0}.detail [hidden]{display:none!important}

/* Цвета этапов в очереди оператора и администратора. */
.queue-operator .queue-new > h3{color:#a52828}
.queue-operator .queue-new .order{background:#fff0f0;border-color:#e9bcbc;border-left:4px solid #c43d3d}
.queue-operator .queue-progress > h3{color:#795900}
.queue-operator .queue-progress .order{background:#fff8d9;border-color:#e3d28a;border-left:4px solid #ba8b0b}
.queue-operator .queue-completed > h3{color:#216549}
.queue-operator .queue-completed .order{background:#eaf5ed;border-color:#b7d7c0;border-left:4px solid #388451}
.queue-operator .order.active{outline:2px solid #173429;outline-offset:1px}