/* СПУ: shared control sizes. Keep the workspace wide; bound the fields. */
:root {
  --field-short: 180px;
  --field-medium: 280px;
  --field-wide: 480px;
  --control-height: 46.2px; /* 42px + 10% */
  --control-font: 17.6px;
}
main label {
  --field-width: var(--field-medium);
  display: block;
  width: min(100%, var(--field-width));
  min-width: 0;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}
main label:has(input[type="number"], input[type="time"], input[name="number"]),
main label.field--short { --field-width: var(--field-short); }
main label:has(textarea, input[name="note"], input[name="comment"], input[name="reason"], input[name="title"], input[name="name"], select[name="productId"], select[name="orderItemId"], select[name="normMaterialId"]),
main label.field--wide { --field-width: var(--field-wide); }
main label.field--medium { --field-width: var(--field-medium); }
main label > span { line-height: 1.4; }
main :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]), select:not(.smart-select-native)) {
  min-width: 0;
  width: 100%;
  max-width: var(--field-width, var(--field-medium));
  min-height: var(--control-height);
  height: var(--control-height);
  font-size: var(--control-font);
  font-weight: 400;
  line-height: 1.35;
  padding: 9px 11px;
}
main textarea {
  width: 100%;
  max-width: var(--field-wide);
  min-height: 110px;
  font-size: var(--control-font);
  font-weight: 400;
  line-height: 1.45;
}
main .smart-select, main .password-input { width: 100%; min-width: 0; }
main .password-input input { padding-right: 96px; }
main .smart-select-results button { white-space: normal; overflow-wrap: anywhere; font-size: var(--control-font); font-weight: 400; line-height: 1.35; }

/* Simple forms and explicit field groups share the same wrapping layout.
   Blocks (tables, fieldsets, notices, row containers) keep their own full row. */
:where(main form):has(> label),
main .form-grid, main .employee-create-grid, main .task-filters form,
main .sawing-job-header, main .sawing-job-line,
main .live-shift-header, main .live-shift-row, main .area-roster,
main .order-header-fields, main .order-item-row, main .norm-material-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: flex-end;
}
:where(main form, main .form-grid, main .employee-create-grid,
  main .sawing-job-header, main .sawing-job-line,
  main .live-shift-header, main .live-shift-row, main .area-roster,
  main .order-header-fields, main .order-item-row, main .norm-material-row) > label {
  flex: 0 1 var(--field-width);
  max-width: 100%;
}
:where(main form):has(> label) > :not(label):not(input):not(button):not(.button):not(a):not([data-delegation-end]) {
  flex-basis: 100%;
  min-width: 0;
}
main form > button, main .form-grid > button, main .form-grid > .button {
  width: auto;
  max-width: 100%;
  height: auto;
  min-height: var(--control-height);
  justify-self: start;
}
/* Password hints sit below a control and must not displace adjacent fields. */
main .employee-create-grid { align-items: flex-start; }
main .form-grid > a { align-self: center; }
main .table-card > form { padding: 0 22px 20px; }
main [data-delegation-end] { width: min(100%, var(--field-medium)); }
main .assignment-line {
  grid-template-columns: minmax(0,480px) minmax(0,480px) minmax(140px,180px) max-content;
  max-width: 1320px;
}
main .assignment-line > label { width: 100%; }
main .order-item-row > button, main .assignment-line > button, main .norm-material-row > button { width: auto; height: auto; min-height: var(--control-height); }
main [data-assignment-plan] > p { margin: 0; line-height: 1.5; }
main .assignment-plan-toolbar { margin: 8px 0; }
main .assignment-actions > button { width: auto; min-height: var(--control-height); }
main .role-checkboxes { flex: 0 1 600px; max-width: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); }
main input[type="number"] { --field-width: var(--field-short); }
main .check-line { display: flex; width: auto; align-items: center; }
main input:is([type="checkbox"], [type="radio"]) { width: auto; min-height: 0; }
/* Hidden conditional controls must never become flex/grid items. */
main [hidden] { display: none !important; }

@media (max-width: 1000px) {
  main .assignment-line { grid-template-columns: repeat(2,minmax(0,480px)); }
}
@media (max-width: 620px) {
  main label { width: 100%; }
  :where(main form, main .form-grid, main .employee-create-grid,
    main .sawing-job-header, main .sawing-job-line,
    main .live-shift-header, main .live-shift-row, main .area-roster,
  main .order-header-fields, main .order-item-row, main .norm-material-row) > label { flex-basis: 100%; }
  main :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]), select:not(.smart-select-native), textarea) { max-width: 100%; }
  main .assignment-line { grid-template-columns: minmax(0,1fr); }
  main [data-delegation-end] { width: 100%; }
  main .table-card > form { padding-inline: 16px; }
}
.form-draft-controls{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:14px}.form-draft-status{color:#52645b;font-weight:700}.form-draft-clear{width:auto}.form-draft-conflict-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}@media(max-width:560px){.form-draft-controls{align-items:stretch;display:grid}.form-draft-clear{width:100%}.form-draft-conflict-actions{display:grid}.form-draft-conflict-actions button{width:100%}}