/* Service-only controls and states; approved prototype styles stay unchanged. */
.pwa-update-notice{position:relative;inset:auto;margin:18px;display:flex;align-items:center;justify-content:center;gap:18px;padding:18px 24px;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:10px}
.pwa-update-notice p{margin:0;font-size:20px;line-height:1.5}
.pwa-update-notice button{min-height:52px;font-size:21px}
@media(max-width:700px){.pwa-update-notice{flex-wrap:wrap}}

/* Real account identifiers can exceed the approved short-name example. */
@media(max-width:700px){
  .pos-header-right{min-width:0}
  .auth-account{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
}

/* Some connected fields contain more than one control and cannot be a label. */
.pos-demo div.field{display:flex;flex-direction:column;gap:9px;color:var(--muted);font-size:20px;min-width:0}
.remaining-options>.panel{margin-top:14px}
#order-form .order-extra>.field{margin-top:16px}

/* Unscoped entry and legacy warehouse repair retain the existing selector layout. */
#movement-form>.movement-warehouse{margin:0 20px 20px}
.movement-warehouse>.field{max-width:640px}
.search-select{position:relative;min-width:0}
.search-select-input{display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid #96aabb;border-radius:8px;background:#f0f4f6;color:#1b3446}
.search-select-input>.icon{width:24px;height:24px}
.search-select-input>input{flex:1;width:0;min-width:0;padding-inline:0;border:0;background:transparent;color:inherit}
.search-select-input:focus-within{outline:3px solid #b4e7ff;outline-offset:3px}
.search-select-input>input:focus{outline:none}
/* Search choices overlay the form so typing does not move quantities or totals. */
.search-select-options{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:40;display:grid;gap:8px;max-height:330px;overflow:auto;margin-top:0;padding:8px;background:var(--raised);border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px #07141c70}
.search-select-options [role=listbox]{display:grid;gap:8px}
.search-select-options button{width:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;text-align:left;white-space:normal;overflow-wrap:anywhere}
.search-select-options button.highlighted,.search-select-options button[aria-selected=true]{background:var(--action);border-color:var(--accent)}
.search-select-options small{font-size:17px;color:var(--muted);font-weight:500}
.search-select-options p{margin:8px}

/* Size labels by map geometry, not work type or individual name length. */
.map-demo .place{padding:6px;gap:5px}
.map-demo .place strong{font-size:clamp(18px,2.1cqw,24px);font-weight:750;line-height:1.15;word-break:keep-all;overflow-wrap:anywhere;max-width:100%;flex-shrink:0}
.map-demo .place small{font-size:clamp(14px,1.5cqw,17px);line-height:1.2;word-break:keep-all;overflow-wrap:anywhere;max-width:100%;flex-shrink:0}
.map-demo .place.large-place{padding:10px;gap:8px}
.map-demo .place.large-place strong{font-size:clamp(22px,2.45cqw,28px)}
.map-demo .place.large-place small{font-size:clamp(16px,1.7cqw,20px)}
.map-demo .place.shallow-place{padding:4px;gap:3px}
.map-demo .place.shallow-place small{font-size:clamp(14px,1.4cqw,16px)}
@container(max-width:1000px){.map-demo .place.shallow-place small{display:none}}

/* Movement labels keep their text as well as distinct, dark-surface colors. */
.map-demo .event-kind.flow-in,.pos-demo .compact-history .kind.flow-in{color:#9cd5ff}
.map-demo .event-kind.flow-out,.pos-demo .compact-history .kind.flow-out{color:#ffc28a}
@container(max-width:1000px){
  .map-demo .place.workspace:not(.large-place){padding:3px}
  .map-demo .place.workspace:not(.large-place) strong{font-size:clamp(14px,2cqw,20px)}
  .map-demo .place.workspace:not(.large-place) small{display:none}
  .map-demo .place.large-place{padding:4px;gap:4px}
  .map-demo .place.large-place small{min-height:2.4em;display:flex;align-items:center;justify-content:center}
}

/* Place actions stay large even when recent history is empty. */
.room-main{min-height:clamp(540px,calc(100dvh - 205px),760px);align-self:start}
.room-actions{grid-auto-rows:minmax(175px,1fr)}
.room-actions>a:last-child:nth-child(3){grid-column:1/-1}
.room-actions .action-card strong{font-size:32px}
input[type=date]{color-scheme:light;cursor:pointer}
input[type=date]::-webkit-calendar-picker-indicator{opacity:1;filter:none;cursor:pointer}
@media(max-width:700px){.room-main{min-height:520px}.room-actions{grid-auto-rows:minmax(150px,1fr)}.room-actions .action-card strong{font-size:28px}}

/* One work surface: avoid mixing old cards, sticky headers and zero-padding columns. */
#work-form .work-grid{
  grid-template-columns:minmax(0,1.1fr) repeat(2,minmax(0,1fr));
  gap:0; padding:28px 0 32px; min-height:0; max-height:none; overflow:visible; align-items:stretch;
}
#work-form.packaging-form .work-grid{min-height:0; max-height:none; align-items:stretch}
#work-form .work-grid>.work-section{
  background:transparent; border:0; border-radius:0; box-shadow:none;
  padding:0 28px; margin:0; min-width:0; max-height:none; overflow:visible;
}
#work-form .work-grid>.work-section+.work-section{border-left:1px solid var(--line)}
#work-form .work-grid>.work-section>h2{
  position:static; background:transparent; padding:0; margin:0 0 24px;
  font-size:24px; line-height:1.4; gap:12px;
}
#work-form .section-number{background:transparent; width:30px; height:30px; font-size:18px}
#work-form .work-section .field-grid{grid-template-columns:minmax(0,1fr); gap:20px}
#work-form .field{margin:0 0 20px; font-size:20px; gap:10px}
#work-form .field-grid>.field{margin:0}
#work-form .work-result-block>.field{margin:0 0 20px}
#work-form .field select{min-height:66px}
#work-form .sort-stock{margin:20px 0 0; padding:14px 0 0; font-size:20px}
#work-form .sort-stock strong{font-size:26px}
#work-form .sort-used:empty{display:none}
#work-form .production-remainder{margin-top:24px; padding-top:24px; border-top:1px solid var(--line)}
#work-form .production-remainder h3{margin:0 0 18px; font-size:21px}
#work-form .production-remainder .segmented{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:4px 0 20px;
}
#work-form .production-remainder .segmented button{min-width:0; min-height:50px; padding:10px 6px; font-size:18px; white-space:normal}
#work-form .work-math{
  background:transparent; border:0; border-radius:0; padding:0;
  margin:18px 0 0; font-size:18px; line-height:1.5; gap:8px 20px; flex-direction:row;
}
#work-form .work-math>span{min-width:0; overflow-wrap:anywhere}
#work-form .work-add{
  width:auto; max-width:100%; min-height:50px; margin:24px 0 8px;
  padding:10px 18px; background:transparent; border-color:#71899b; color:#cce8f8;
  font-size:19px; white-space:normal;
}
#work-form .work-add:hover{background:#3a5264; border-color:var(--accent)}
#work-form .block-heading{margin-bottom:18px; gap:12px; flex-wrap:wrap}
#work-form .work-input-block+.work-input-block,
#work-form .pack-material-row+.pack-material-row{margin-top:28px; padding-top:24px; border-top:1px solid var(--line)}
#work-form .pack-material-row{margin-top:20px}
#work-form .pack-material-row .field{margin-bottom:0}
#work-form .pack-material-row>.field-grid+button{margin-top:16px}
#work-form .checkbox-field{font-size:21px; margin:0 0 20px; min-height:50px}
#work-form .production-place-note{font-size:19px; color:var(--muted); margin:16px 0}
#work-form .production-remainder-grid{
  display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:40px;
  margin:28px 28px 0; padding-top:28px; padding-bottom:0;
}
#work-form .production-remainder-grid>section{min-width:0}
#work-form .production-remainder-grid>section:first-child>.field,
#work-form .production-remainder-grid>section:first-child>.segmented{max-width:560px}
#work-form .work-aggregate{padding:20px 28px; font-size:20px; gap:12px 28px}
#work-form .work-aggregate strong{font-size:26px}
#work-form .form-footer{padding:24px 28px; gap:24px}
#work-form .form-footer>.field{margin:0}
@media(max-width:1100px){
  #work-form .work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #work-form .work-grid>.work-section{padding:0 24px}
  #work-form .work-grid>.work-section:last-of-type{grid-column:1/-1; margin:28px 24px 0; padding:28px 0 0; border-left:0; border-top:1px solid var(--line)}
  #work-form .production-remainder-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr); margin-inline:24px; gap:28px}
}
@media(max-width:700px){
  #work-form .work-grid{grid-template-columns:minmax(0,1fr); padding:24px 0}
  #work-form .work-grid>.work-section{padding:0 20px}
  #work-form .work-grid>.work-section+.work-section{margin:28px 20px 0; padding:28px 0 0; border-left:0; border-top:1px solid var(--line)}
  #work-form .work-grid>.work-section>h2{font-size:23px; margin-bottom:20px}
  #work-form .production-remainder-grid{grid-template-columns:minmax(0,1fr); gap:28px; margin:28px 20px 0}
  #work-form .production-remainder-grid>section+section{padding-top:24px; border-top:1px solid var(--line)}
  #work-form .work-aggregate{padding:20px; gap:12px}
  #work-form .form-footer{padding:24px 20px}
  #work-form .form-footer>.field{flex-direction:column; align-items:stretch}
  #work-form .form-footer>.field input{width:100%}
  #work-form .form-footer button{min-width:0; width:100%}
}

/* Remaining raw material is a shared row below the three main steps, not a long side column. */
#work-form .packaging-remainders{grid-column:1/-1; margin:28px 28px 0; padding-top:24px; border-top:1px solid var(--line); min-width:0}
#work-form .packaging-remainders>h3{font-size:21px; margin:0 0 20px}
#work-form .packaging-remainder-row{margin:0; padding:0; border:0}
#work-form .packaging-remainder-row+.packaging-remainder-row{margin-top:24px; padding-top:24px; border-top:1px solid var(--line)}
#work-form .remainder-fields{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; align-items:start}
#work-form .remainder-fields>.field{margin:0}
#work-form .remainder-disposition .segmented{margin:0}
#work-form .remainder-disposition .segmented button{min-height:68px}
@media(max-width:1100px){#work-form .packaging-remainders{margin-inline:24px}#work-form .remainder-fields{grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px}}
@media(max-width:700px){#work-form .packaging-remainders{margin-inline:20px}#work-form .remainder-fields{grid-template-columns:minmax(0,1fr); gap:20px}#work-form .remainder-disposition .segmented button{min-height:52px}}

/* Complete reference choices with a useful scroll area. */
.example-item-list { max-height:360px; }
.example-item-list .item-option { display:flex; align-items:center; gap:12px; }
.example-item-list .item-option strong { flex:1; min-width:0; text-align:left; overflow-wrap:anywhere; }
.example-item-list .item-unit { flex-shrink:0; font-size:16px; color:var(--muted); }
.search-select-options .more-row { margin:0; padding:8px; font-size:16px; }
@media(max-width:700px) { .example-item-list { max-height:280px; } }
