[hidden]{display:none!important}
.office-app .account-main{max-width:1500px;padding:24px 30px 70px}
.office-app .office-role-nav{background:var(--forest);width:fit-content;margin-bottom:24px}
.office-app .office-workspace{min-width:0}
.office-app .office-order-toolbar{padding:12px 16px;background:white;border:1px solid var(--line);border-radius:12px}
.office-app .office-order-toolbar h2{font-size:1rem;margin:0}
.office-app .office-order-toolbar label{display:flex;gap:10px;align-items:center;margin:0}
.office-app .office-order-toolbar select{width:auto;min-width:180px}
.office-app #incomingDetail{padding:24px}
.office-app #incomingDetail>p{margin:8px 0;color:var(--muted);font-size:.88rem}
.office-app #incomingDetail>.warning-text{color:#9b2929}
.office-app #incomingDetail>.secondary-button{margin:12px 0}
.office-app .section-tab:focus-visible,.office-app .role-tab:focus-visible{outline:3px solid #6da57d;outline-offset:3px}
.office-app #officeHeading:focus{outline:none}
.office-app .order-queue-panel{align-self:start}
.office-app .order-list{max-height:65vh;overflow:auto}
.office-app .order-list-item{min-height:86px}
.office-app #pullsheetWorkspace>summary{font-size:1rem}
.office-app #pullShipDate{width:100%;max-width:280px;min-height:52px;padding:12px 14px;box-sizing:border-box;font-size:1rem;line-height:1.5}
.office-app #pullShipDate::-webkit-calendar-picker-indicator{width:24px;height:24px;padding:4px;cursor:pointer}
@media(max-width:1000px){.office-app .support-grid{grid-template-columns:1fr}.office-app .order-list{max-height:40vh}}
@media(max-width:600px){.office-app .account-main{padding:16px 12px 40px}.office-app .office-order-toolbar label{flex-wrap:wrap}.office-app #incomingDetail{padding:16px}}
.account-main{max-width:1080px;margin:auto;padding:24px}
.account-header,.account-section-heading,.account-actions{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.account-card{background:white;border:1px solid #d8e0da;border-radius:16px;padding:24px;margin:0 0 20px}
.login-card{max-width:460px;margin:36px auto}
.account-main form{display:grid;gap:10px;max-width:580px}
.account-main form>button{margin-top:8px;justify-self:start}
.account-main input{max-width:100%;min-width:0}
.account-main fieldset{display:flex;flex-wrap:wrap;gap:12px;border:1px solid #d8e0da;border-radius:8px;padding:12px}
.account-main fieldset label{display:flex;gap:8px;align-items:center}
.user-card{border-top:1px solid #d8e0da;padding:20px 0}
.user-card p{overflow-wrap:anywhere}
.user-card form{max-width:none}
.user-card .active-label{display:flex;align-items:center;gap:8px}
#status{min-height:1.5em;white-space:pre-wrap}
#status[data-error="true"]{color:#9b2929;border-left:4px solid #9b2929;padding-left:12px}
#availabilityItems{padding-left:20px}
#availabilityItems li{margin-bottom:8px}
@media(max-width:600px){.account-main{padding:12px}.account-card{padding:18px}.account-header{font-size:14px}.account-section-heading{align-items:flex-start}.account-actions button{min-height:44px}.login-card{margin-top:20px}}

.account-disclosure>summary{font-size:1.4rem;font-weight:700;cursor:pointer;min-height:44px;align-content:center}
.account-disclosure>summary:focus-visible{outline:3px solid #236b49;outline-offset:4px}
.account-disclosure[open]>summary{margin-bottom:18px}

#passwordControls{display:grid;width:100%;box-sizing:border-box;gap:10px}

/* Rep account navigation stays compact on the mobile header. */
.rep-header-actions{display:flex;align-items:center;gap:8px}.rep-menu-toggle{display:grid;place-content:center;gap:4px;width:44px;min-width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:8px;background:white}.rep-menu-toggle span{display:block;width:20px;height:2px;background:var(--forest);border-radius:2px}.rep-menu-toggle:focus-visible,.rep-header-menu button:focus-visible{outline:3px solid var(--forest-2);outline-offset:3px}.rep-app-header{position:relative;display:flex;gap:10px}.rep-app-header .brand-block{flex:1;min-width:0}.rep-app-header .brand-name{font-size:clamp(14px,4vw,20px)}.rep-app-header #signOut{flex:none;padding:8px 10px}.rep-header-menu{position:absolute;z-index:10;left:12px;right:auto;top:calc(100% - 4px);display:grid;min-width:210px;padding:8px;border:1px solid var(--line);border-radius:10px;background:white;box-shadow:0 10px 26px rgba(16,45,32,.18)}.rep-menu-profile{display:grid;gap:3px;padding:10px 12px;border-bottom:1px solid var(--line);color:var(--muted);font-size:.82rem}.rep-menu-profile strong{color:var(--ink);font-size:.95rem;overflow-wrap:anywhere}.rep-header-menu button{width:100%;min-height:44px;padding:8px 12px;border:0;background:transparent;color:var(--ink);font:inherit;text-align:left}.rep-header-menu button:hover{background:#edf5ef}@media(max-width:600px){.rep-header-actions .secondary-button{min-height:44px;padding:8px 10px}.rep-header-menu{left:8px;right:auto}}

#draftList{display:grid;gap:10px;margin-bottom:16px}
#draftList>button{width:100%;text-align:left;white-space:pre-line;overflow-wrap:anywhere;line-height:1.5}

/* Rep Review uses the prototype's compact summary and disclosure presentation. */
#repPanel #draftReview{max-width:580px;min-width:0}
#repPanel #draftReview .compact-heading>div{min-width:0}
#repPanel #draftReview p,#repPanel #reviewLinesList{overflow-wrap:anywhere}
#repPanel .rep-review-lines>summary{cursor:pointer;list-style:none}
#repPanel .rep-review-lines>summary::-webkit-details-marker{display:none}
#repPanel .rep-review-lines>summary:focus-visible{outline:3px solid var(--forest-2);outline-offset:3px}
#repPanel .rep-review-lines[open] .review-chevron{transform:rotate(180deg)}

#repPanel .rep-order-progress{max-width:580px;padding:12px 0;margin:18px 0}
#repPanel .rep-order-progress .step{min-height:44px}
#repPanel .rep-order-progress .step:focus-visible{outline:3px solid var(--forest-2);outline-offset:3px}
#repPanel #draftStoreStep,#repPanel #draftPlantsStep{min-width:0;display:grid;gap:10px}
#repPanel #draftStoreStep .screen-heading{margin-bottom:4px}
#repPanel #draftStoreStep .field-label{margin-bottom:0}
#repPanel #draftStoreStep .store-card>div,#repPanel #draftPlantsStep .compact-heading>div{min-width:0;overflow-wrap:anywhere}
#repPanel #draftPlantsStep>button{justify-self:start}
#repPanel #draftPlantsStep .rep-review-action{position:static;margin-top:4px;justify-self:stretch}
#repPanel #draftPlantsStep .plant-card>div{min-width:0}
#repPanel #draftPlantsStep .plant-title-row{overflow-wrap:anywhere}
#repPanel #draftPlantsStep>section{min-width:0}

#weeklyItemForm{max-width:none}.weekly-plant-row{display:grid;grid-template-columns:minmax(180px,2fr) minmax(90px,1fr) 80px minmax(160px,2fr);gap:12px}.weekly-plant-row label{min-width:0}.weekly-plant-row .field-control{width:100%;box-sizing:border-box}
@media(max-width:700px){.weekly-plant-row{grid-template-columns:1fr}}

#repPanel .rep-order-progress{grid-template-columns:auto 1fr auto 1fr auto 1fr auto}
#repPanel #draftDetailsStep{display:grid;gap:10px;min-width:0}
#repPanel #draftDetailsStep>button{justify-self:start}

#incomingOrders{margin-bottom:24px}#incomingDetail{padding:20px;min-width:0;overflow-wrap:anywhere}#incomingDetail .table-wrap{overflow-x:auto}#incomingOrders .account-actions{padding:12px}
#incomingDetail details{margin-top:16px;border-top:1px solid #d8e0da;padding-top:12px}#incomingDetail summary{cursor:pointer;font-weight:700;min-height:36px}#incomingDetail summary:focus-visible{outline:3px solid #236b49;outline-offset:3px}

/* Logistics selection and routing follow the approved desktop prototype. */
.office-app .pullsheet-picker{display:grid;grid-template-columns:minmax(0,1fr) 140px minmax(0,1fr);gap:18px;align-items:start}
.office-app .transfer-actions{display:grid;gap:12px;align-self:center}
.office-app .selection-order,.office-app #logisticsList>label{display:block;padding:16px;margin:10px 0;border:1px solid var(--line);border-radius:10px;background:#f7faf8}
.office-app #logisticsDetail>select{width:100%;margin-bottom:16px}
.office-app #logisticsDetail>.primary-button{margin-top:20px;width:100%}
.office-app .route-planning-layout{display:grid;grid-template-columns:minmax(310px,.4fr) minmax(0,1fr);gap:16px;align-items:start}
.office-app #routeAvailable>section{padding:12px;margin:12px 0}
.office-app #routeAvailable>section h3{font-size:1rem}
.office-app #routeAvailable p{font-size:.85rem;color:var(--muted)}
.office-app #routeAvailable button{margin:4px 4px 4px 0}
.office-app #routeStops{min-width:0;overflow-x:auto;padding:20px}
.office-app #routeStops .truck-visual{margin:18px 0;min-width:570px}
.office-app #routeStops .rack-grid{grid-template-rows:repeat(4,47px)}
.office-app #routeStops .rack-cell{width:100%;min-width:0;margin:0}
@media(max-width:1000px){.office-app .route-planning-layout{grid-template-columns:1fr}.office-app .pullsheet-picker{grid-template-columns:minmax(0,1fr) 110px minmax(0,1fr)}}
@media(max-width:650px){.office-app .pullsheet-picker{grid-template-columns:1fr}.office-app .transfer-actions{grid-template-columns:1fr 1fr}}

.office-app .route-right-panel{min-width:0;padding:20px}
.office-app .route-right-panel #routeStops{padding:0}
.office-app .route-document-controls{border-top:1px solid var(--line);margin-top:24px;padding-top:20px}
.office-app .route-document-controls:empty{display:none}
.office-app .route-document-controls h2{font-size:1.1rem;margin:0 0 14px}
.office-app .document-action-row,.office-app .document-completion-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.office-app .document-completion-row{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.office-app .document-completion-row label{flex-basis:100%;display:flex;gap:8px;align-items:center}

.office-app .load-estimate-summary{padding:14px;margin:12px 0;border:1px solid var(--line);border-radius:10px;background:#f1f6f3}.office-app .load-estimate-summary p{margin:6px 0}

/* Disabled must remain visibly unavailable across all button variants and hover states. */
body button:disabled{background:#e5e7eb!important;color:#60656c!important;border-color:#b8bdc5!important;opacity:1!important;box-shadow:none!important;transform:none!important;cursor:not-allowed!important}

/* Compact Office availability rows keep actions aligned at the right edge. */
#weeklySavedItems .weekly-saved-row{display:flex;align-items:center;gap:16px;padding:10px 0}
#weeklySavedItems .weekly-saved-row>p{flex:1;min-width:0;margin:0}
#weeklySavedItems .weekly-row-actions{display:flex;flex:none;gap:6px;margin-left:auto}
#weeklySavedItems .weekly-row-actions button{width:auto;min-height:30px;margin:0;padding:4px 10px;font-size:13px;line-height:20px;white-space:nowrap}

.weekly-catalog-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;align-items:end;margin-bottom:12px}
.weekly-catalog-filters .weekly-search{grid-column:1/-1}
#weeklyPlant{height:222px;min-height:222px;padding:0;overflow-y:scroll;background-image:none}
#weeklyPlant option{padding:8px 12px;min-height:36px}
@media(max-width:700px){.weekly-catalog-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}

#availabilityDialog,#availabilityArchiveDialog,#openShelfPicker,#rackRecipeDialog{width:min(1120px,calc(100vw - 48px));max-height:90vh;overflow-y:auto;border:0;border-radius:18px;padding:26px;color:#172b22;background:white}
#availabilityDialog::backdrop,#availabilityArchiveDialog::backdrop,#openShelfPicker::backdrop,#rackRecipeDialog::backdrop{background:rgba(10,30,22,.65)}
.availability-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.availability-dialog-heading h2{margin:0}
#availabilityDialog form{max-width:none}

#weeklyCarryPanel{margin:16px 0;padding:12px;border:1px solid #d8e0da;border-radius:8px}
#weeklyCarryItems{max-height:260px;overflow:auto;margin:12px 0}
#weeklyCarryItems label{display:flex;align-items:center;gap:10px;padding:8px 0}
#weeklyCarryItems input{width:auto;flex:none}

/* Shared column widths align pulling details along the right side of every saved row. */
#weeklySavedItems .weekly-saved-row{display:grid;grid-template-columns:minmax(160px,1fr) 100px 64px minmax(180px,1fr) auto;gap:10px;align-items:end;max-width:none}
#weeklySavedItems .weekly-saved-row>p{align-self:center}
#weeklySavedItems .weekly-saved-row>label{display:flex;flex-direction:column;gap:4px;margin:0;font-size:11px}
#weeklySavedItems .field-control{width:100%;min-width:0;margin:0;padding:6px 8px;height:34px;font-size:13px}
#weeklySavedItems .weekly-row-actions{align-self:end;margin:0;height:34px;align-items:center}
@media(max-width:850px){#weeklySavedItems .weekly-saved-row{grid-template-columns:100px 64px minmax(130px,1fr)}#weeklySavedItems .weekly-saved-row>p{grid-column:1/-1}#weeklySavedItems .weekly-row-actions{grid-column:1/-1;justify-self:end}}

#plantResults{height:222px;padding:0;background-image:none;overflow-y:scroll}#plantResults option{padding:8px 12px}
.plant-create-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#plantCreate{margin:20px 0;padding:16px;border:1px solid #d8e0da;border-radius:8px}

#weeklyRackEditor .rack-item-row{display:grid;grid-template-columns:minmax(160px,1fr) 100px 64px minmax(180px,1fr) auto;gap:10px;align-items:end;max-width:none;margin:12px 0}
#weeklyRackEditor .rack-item-row>p{margin:0;align-self:center}#weeklyRackEditor .rack-item-row>label{display:flex;flex-direction:column;gap:4px;margin:0;font-size:11px}
#weeklyRackEditor .rack-item-row .field-control{width:100%;min-width:0;margin:0;padding:6px 8px;height:34px;font-size:13px}
#weeklyRackEditor .rack-item-row button{width:auto;min-height:34px;margin:0;padding:4px 10px;font-size:13px}
@media(max-width:850px){#weeklyRackEditor .rack-item-row{grid-template-columns:100px 64px minmax(130px,1fr)}#weeklyRackEditor .rack-item-row>p{grid-column:1/-1}#weeklyRackEditor .rack-item-row>button{grid-column:1/-1;justify-self:end}}

#weeklyRackEditor .open-shelf-row{grid-template-columns:minmax(160px,1fr) 100px 64px minmax(180px,1fr) auto auto}
@media(max-width:850px){#weeklyRackEditor .open-shelf-row{grid-template-columns:100px 64px minmax(120px,1fr)}}

#shelfResults{height:222px;padding:0;overflow-y:auto;background-image:none}#shelfResults option{padding:8px 12px;min-height:36px}

.recipe-plant-row{display:grid;grid-template-columns:minmax(160px,1fr) 80px 100px 64px minmax(160px,1fr) auto;gap:10px;align-items:end}.recipe-plant-row label{display:flex;flex-direction:column}.recipe-plant-row input,.recipe-plant-row select{min-width:0;width:100%}
@media(max-width:850px){.recipe-plant-row{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Compact item defaults and a six-row multi-select catalog. */
.approval-default{display:flex;align-items:center;gap:6px;font-size:12px;margin:6px 0}.approval-default input[type=checkbox]{width:16px;height:16px;min-height:0;flex:none;margin:0}
.shelf-checkbox-results{height:222px;overflow-y:auto;border:1px solid #c5d2ca;border-radius:6px;padding:0 8px}.shelf-checkbox-results label{display:flex;align-items:center;gap:10px;min-height:36px;margin:0;font-size:13px}.shelf-checkbox-results input{width:16px;height:16px;flex:none;margin:0}

/* Manual delivery entry stays in the Truck workspace, above Home Depot stops. */
.manual-deliveries { margin: 1rem 0; }
.manual-delivery-form { display: grid; gap: .65rem; margin: .75rem 0; }
.manual-delivery-form label { display: grid; gap: .25rem; }
.manual-delivery-form input { width: 100%; min-width: 0; box-sizing: border-box; }
.manual-delivery-form input[name="racks"] { max-width: 7rem; }
.manual-delivery-row { padding: .75rem 0; border-bottom: 1px solid #d8e2dd; }

.document-checklist { display: grid; gap: .6rem; margin: 1rem 0; }
.document-checklist label { display: flex; align-items: center; gap: .55rem; }
.document-checklist input[type="checkbox"] { width: 1.15rem; height: 1.15rem; }

/* Archive documents use the full workspace width. */
.office-app .archive-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; align-items:end; }
.office-app .archive-document-row { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid #dde6df; }
.office-app .archive-document-row > span:first-child { flex:1 1 360px; overflow-wrap:anywhere; }
.office-app .archive-document-group { padding:12px 0; }
.office-app .archive-document-group > summary { cursor:pointer; font-weight:600; overflow-wrap:anywhere; }

/* Row-level missing store information is advisory and editable. */
.store-missing{color:#8a3d0a;background:#fff4d8;border-left:4px solid #c07c1a;padding:10px 12px;font-weight:600}
.users-and-stores{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,1fr);gap:24px;align-items:start}
.rep-stores-panel{border:1px solid #ccd5df;border-radius:14px;padding:18px;min-width:0}
.rep-stores-list{max-height:420px;overflow:auto;border:1px solid #ccd5df;border-radius:8px;padding:8px}
.rep-stores-list label{display:flex;align-items:center;gap:10px;padding:8px}
.rep-stores-list input[type=checkbox]{width:auto;flex:none}
 .save-dialog{box-sizing:border-box;width:min(620px,calc(100vw - 32px));max-height:90vh;overflow:auto;border:1px solid #ccd5df;border-radius:16px;padding:22px}
 .save-dialog::backdrop{background:rgba(15,23,42,.5)}
 .account-main .save-dialog form{width:100%;max-width:none;box-sizing:border-box}
 #addUserDialog{width:min(820px,calc(100vw - 32px))}
 #addUserDialog .users-and-stores{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:20px}
 .save-dialog.save-dialog-complete,#addUserDialog.save-dialog-complete{width:min(420px,calc(100vw - 32px))}
 .save-dialog-complete>section{display:grid;gap:16px}
 .save-dialog-complete>section>button{justify-self:end;min-width:90px}
 .account-main .role-checklist{flex-direction:column;align-items:flex-start;gap:10px}
 .record-disclosure>summary{display:flex;align-items:center;gap:12px;min-height:44px;cursor:pointer;font-weight:700;list-style:none}
 .record-disclosure>summary::-webkit-details-marker{display:none}
 .record-disclosure>summary::after{content:'›';font-size:1.6rem;margin-left:auto;flex:none}
 .record-disclosure[open]>summary::after{transform:rotate(90deg)}
 .record-disclosure>summary:focus-visible{outline:3px solid #236b49;outline-offset:3px}
 .record-warning{font-size:.8rem;color:#8a3d0a;background:#fff4d8;border-radius:6px;padding:4px 8px;font-weight:600}
 #addUserDialog #cancelRepStores,#addUserDialog #updateRepStores,#addUserDialog #reloadRepStores{display:none}
@media(max-width:800px){.users-and-stores,#addUserDialog .users-and-stores{grid-template-columns:1fr}}


#repStoresDialog .rep-stores-panel{border:0;padding:0}
#repStoresDialog #repStoresTitle{display:none}

.load-choice-list { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1rem; }
.load-choice { text-align: left; padding: .6rem .75rem; border-radius: .5rem; }
.load-choice.is-active { background: #e3efe7; border-color: #2b6047; }

.office-app .route-stop { display: block; padding: 12px; position: relative; }
.route-stop-header { display: grid; grid-template-columns: 28px minmax(0,1fr) 30px 30px; gap: 4px; align-items: center; }
.office-app #routeAvailable .route-stop-header>button { min-width: 0; margin: 0; box-sizing: border-box; }
.office-app #routeAvailable .route-stop-toggle { width: 100%; overflow-wrap: anywhere; line-height: 1.3; }
.route-stop-toggle { text-align: left; font-weight: 700; background: transparent; border: 0; padding: 6px 2px; }
.route-order-arrow, .route-drag-handle { width: 28px; min-height: 30px; padding: 2px; border-radius: 6px; }
.route-drag-handle { cursor: grab; background: transparent; border-color: transparent; font-size: 22px; }
.route-drag-handle:active { cursor: grabbing; }
.route-drag-handle:disabled { cursor: default; }
.route-stop-body { padding: 8px 4px 0; }
.route-stop.is-dragging { opacity: .45; }
.route-stop.drop-before { box-shadow: inset 0 3px #2b6047; }
.route-stop.drop-after { box-shadow: inset 0 -3px #2b6047; }

.pull-process-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:12px;margin-top:24px}


/* Availability selection and selected-plant details share one compact box. */
.weekly-matching-box{min-width:0;margin:0;padding:14px;border:1px solid #cbd8df;border-radius:12px}
.weekly-matching-box legend{font-weight:700;padding:0 6px}
.weekly-matching-grid{display:grid;grid-template-columns:minmax(240px,2fr) minmax(110px,.8fr) 64px minmax(150px,1.2fr) 120px;gap:12px;align-items:start}
.weekly-matching-grid>label{display:flex;flex-direction:column;gap:6px;min-width:0;margin:0}
.weekly-matching-grid .field-control{width:100%;min-width:0;box-sizing:border-box;margin:0}
.weekly-matching-grid>.approval-default{flex-direction:row;align-items:center;align-self:start;padding-top:30px}
.weekly-matching-actions{display:flex;justify-content:flex-end;align-items:center;gap:12px;flex-wrap:wrap}
.weekly-matching-actions button{margin:0}
.weekly-matching-box p{margin:10px 0;font-size:13px}
@media(max-width:950px){.weekly-matching-grid{grid-template-columns:minmax(110px,1fr) 64px minmax(150px,2fr) 120px}.weekly-matching-list{grid-column:1/-1}}
@media(max-width:600px){.weekly-matching-grid{grid-template-columns:1fr 80px}.weekly-matching-grid>label:nth-child(4){grid-column:1/-1}.weekly-matching-grid>.approval-default{grid-column:1/-1;padding-top:0}}