.bop-workspace { display: grid; gap: 16px; color: #172538; min-width: 0; }
.bop-workspace * { box-sizing: border-box; }
.bop-card { padding: 22px; background: #fff; border: 1px solid #dfe6ed; border-radius: 16px; min-width: 0; }
.bop-workspace h2, .bop-workspace h3, .bop-workspace h4 { margin: 0 0 10px; color: #172538; }
.bop-workspace h2 { font-size: 26px; }
.bop-heading, .bop-toolbar, .bop-actions, .bop-scope { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px; }
.bop-eyebrow { margin: 0 0 7px; font-size: 12px; color: #68798a; }
.bop-help { color: #637387; font-size: 13px; line-height: 1.6; margin: 6px 0; }
.bop-scope { justify-content: flex-start; padding-top: 14px; }
.bop-scope label, .bop-command-picker { display: flex; gap: 10px; align-items: center; }
.bop-workspace input:not([type=checkbox]), .bop-workspace select, .bop-workspace textarea { border: 1px solid #c9d3df; border-radius: 8px; background: #fff; color: #172538; padding: 9px 11px; font: inherit; min-width: 0; max-width: 100%; }
.bop-workspace input:focus-visible, .bop-workspace select:focus-visible, .bop-workspace button:focus-visible, .bop-table-scroll:focus-visible { outline: 3px solid #a8cfff; outline-offset: 2px; }
.bop-workspace button { min-height: 38px; padding: 8px 14px; white-space: normal; border-radius: 8px; cursor: pointer; border: 1px solid #2563eb; background: #2563eb; color: #fff; font: inherit; }
.bop-workspace button.secondary { color: #334155; border-color: #cbd5e1; background: #fff; }
.bop-workspace button:disabled { opacity: .55; cursor: default; }
.bop-tabs { display: flex; flex-wrap: wrap; gap: 9px; padding-top: 18px; }
.bop-toolbar { justify-content: flex-start; margin-bottom: 20px; }
#bop-search { display: flex; gap: 8px; flex: 1; min-width: 230px; }
#bop-search input { flex: 1; }
.bop-table-scroll { overflow: auto; width: 100%; }
.bop-table-scroll table { border-collapse: collapse; width: 100%; font-size: 14px; min-width: 650px; }
.bop-table-scroll th { text-align: left; padding: 12px; background: #f5f7fa; color: #5a6a7b; font-weight: 600; }
.bop-table-scroll td { padding: 14px 12px; border-bottom: 1px solid #edf1f5; vertical-align: top; }
.bop-table-scroll td small { display: block; color: #748194; margin-top: 5px; }
.bop-status { display: inline-block; background: #eff4f9; border-radius: 6px; padding: 4px 8px; font-size: 12px; white-space: nowrap; }
.bop-empty { padding: 32px 12px; color: #718096; text-align: center; }
.bop-alert { padding: 15px 19px; background: #eff6ff; border: 1px solid #c9e0ff; border-radius: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.bop-alert button { margin-left: 12px; }
.bop-danger { color: #b42318; }
.bop-alert.bop-danger { background: #fff5f4; border-color: #fecdc9; }
.bop-editor { border-color: #a8c8fa; }
.bop-workspace fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.bop-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.bop-field { display: grid; gap: 7px; font-size: 14px; min-width: 0; }
.bop-field input, .bop-field select, .bop-field textarea { width: 100%; }
.bop-field input[type=checkbox] { width: 20px; height: 20px; }
.bop-field small { color: #6b7889; font-size: 12px; line-height: 1.6; }
.bop-required { color: #b42318; }
.bop-wide { grid-column: 1 / -1; }
.bop-actions { justify-content: flex-start; margin-top: 20px; }
.bop-preview { padding: 20px; margin-top: 20px; background: #f7faff; border: 1px solid #cbdcf4; border-radius: 12px; line-height: 1.7; }
.bop-summary-line { display: flex; gap: 15px; margin: 7px 0; overflow-wrap: anywhere; }
.bop-summary-line > strong { color: #607085; flex: 0 0 92px; font-weight: 500; }
.bop-roster-row { padding: 17px; margin: 12px 0; border: 1px solid #dfe6ed; border-radius: 12px; }
.bop-roster-row > strong { display: block; margin-bottom: 14px; }
.bop-roster-row > button { margin-top: 14px; }
.bop-delivery { border-color: #7bb899; background: #f3fcf7; }
.bop-handoff-list { padding: 16px; margin-bottom: 24px; border: 1px solid #d8e4f1; border-radius: 12px; background: #f8fbff; }
.bop-handoff-list details { margin-top: 14px; }
.bop-delivery code { display: inline-block; font-size: 19px; font-weight: 700; padding: 8px; letter-spacing: 1px; overflow-wrap: anywhere; }
.bop-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.bop-workspace [hidden] { display: none !important; }
@media(max-width: 720px) { .bop-card { padding: 16px; } .bop-form-grid { grid-template-columns: 1fr; } .bop-heading { align-items: flex-start; } .bop-scope { align-items: flex-start; } .bop-scope label { width: 100%; } .bop-tabs button { flex: 1; padding: 8px; font-size: 13px; } .bop-toolbar { align-items: stretch; } #bop-search { width: 100%; flex-basis: 100%; min-width: 0; } .bop-command-picker { flex: 1; min-width: 0; } .bop-command-picker select { min-width: 0; flex: 1; } .bop-preview { padding: 14px; } .bop-summary-line { flex-wrap: wrap; gap: 5px; } .bop-alert button { display: block; margin: 10px 0 0; } }

.bop-appointments { display: grid; gap: 9px; min-width: 160px; margin-top: 8px; }
.bop-appointments > div { border-left: 2px solid #c5d8ef; padding-left: 8px; }
.bop-temporary-list { padding: 16px; margin-bottom: 24px; border: 1px solid #dfe6ed; border-radius: 12px; }