/* UX-003: Assembly Builder visual hierarchy only. BOM data and interactions remain unchanged. */
@media screen {
  .workspace:has(.bom-panel) .bom-parts-card {
    padding: var(--erp-space-5);
  }

  .workspace:has(.bom-panel) .bom-section-heading {
    align-items: center;
    margin-bottom: var(--erp-space-4);
  }

  .workspace:has(.bom-panel) .bom-section-heading h3 {
    margin-bottom: var(--erp-space-1);
  }

  .workspace:has(.bom-panel) .bom-section-heading p {
    margin: 0;
  }

  .workspace:has(.bom-panel) .bom-primary-actions {
    flex: 0 0 auto;
  }

  .workspace:has(.bom-panel) .bom-card-list {
    gap: var(--erp-space-2);
  }

  .workspace:has(.bom-panel) .bom-card-list .bom-item {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    grid-template-rows: auto minmax(40px, auto);
    align-items: center;
    min-height: 164px;
    padding: var(--erp-space-3);
    gap: var(--erp-space-3);
    border-color: var(--erp-border);
    border-radius: var(--erp-radius-md);
    background: var(--erp-surface);
    box-shadow: none;
  }

  .workspace:has(.bom-panel) .bom-sequence {
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: stretch;
    align-items: flex-start;
    padding-top: var(--erp-space-1);
  }

  .workspace:has(.bom-panel) .bom-part-identity {
    grid-column: 2 / -1;
    grid-row: 1;
    gap: 2px;
  }

  .workspace:has(.bom-panel) .bom-part-identity > strong {
    overflow: hidden;
    color: var(--erp-text);
    font-size: var(--erp-font-size-md);
    font-weight: var(--erp-font-weight-semibold);
    line-height: var(--erp-line-height-tight);
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .workspace:has(.bom-panel) .bom-part-identity > .bom-part-code,
  .workspace:has(.bom-panel) .bom-part-identity > small {
    overflow: hidden;
    color: var(--erp-text-secondary);
    font-size: var(--erp-font-size-sm);
    font-weight: var(--erp-font-weight-regular);
    line-height: var(--erp-line-height-normal);
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .workspace:has(.bom-panel) .bom-card-fields {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    align-items: center;
    gap: var(--erp-space-2);
  }

  .workspace:has(.bom-panel) .bom-card-field {
    display: block;
  }

  .workspace:has(.bom-panel) .bom-quantity-control {
    display: inline-grid;
    grid-template-columns: minmax(52px, auto) auto;
    align-items: center;
    min-height: var(--erp-control-height-md);
    gap: var(--erp-space-2);
    padding: 0 var(--erp-space-3);
    border: 1px solid var(--erp-border-strong);
    border-radius: var(--erp-radius-sm);
    background: var(--erp-surface-muted);
  }

  .workspace:has(.bom-panel) .bom-quantity-control input {
    width: 56px;
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    text-align: right;
  }

  .workspace:has(.bom-panel) .bom-quantity-control b {
    min-width: 0;
    color: var(--erp-text-secondary);
    font-size: var(--erp-font-size-sm);
    font-weight: var(--erp-font-weight-medium);
  }

  .workspace:has(.bom-panel) .bom-note-field {
    min-width: min(240px, 35vw);
    flex: 1 1 240px;
  }

  .workspace:has(.bom-panel) .bom-note-field input {
    height: var(--erp-control-height-md);
  }

  .workspace:has(.bom-panel) .bom-card-actions {
    grid-column: 3;
    grid-row: 2;
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: var(--erp-space-1);
  }

  .workspace:has(.bom-panel) .bom-card-actions .tf-action-button {
    min-height: var(--erp-control-height-md);
    padding-inline: var(--erp-space-2);
  }

  .workspace:has(.bom-panel) .bom-order-actions,
  .workspace:has(.bom-panel) .bom-delete {
    flex: 0 0 auto;
  }

  .workspace:has(.bom-panel) .bom-inline-editor {
    grid-column: 2 / -1;
    grid-row: 3;
    margin-top: calc(-1 * var(--erp-space-1));
    padding: var(--erp-space-3);
  }
}

@media screen and (max-width: 1100px) {
  .workspace:has(.bom-panel) .bom-card-list .bom-item {
    grid-template-columns: 36px minmax(0, 1fr);
    min-height: 0;
  }

  .workspace:has(.bom-panel) .bom-sequence {
    grid-row: 1 / span 2;
  }

  .workspace:has(.bom-panel) .bom-part-identity {
    grid-column: 2;
  }

  .workspace:has(.bom-panel) .bom-card-fields {
    grid-column: 2;
  }

  .workspace:has(.bom-panel) .bom-card-actions {
    grid-column: 2;
    grid-row: 3;
    justify-content: flex-start;
  }
}

@media screen and (max-width: 760px) {
  .workspace:has(.bom-panel) .bom-parts-card {
    padding: var(--erp-space-4);
  }

  .workspace:has(.bom-panel) .bom-card-list .bom-item {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    min-height: 0;
  }

  .workspace:has(.bom-panel) .bom-sequence {
    grid-column: 1;
    grid-row: 1 / span 3;
  }

  .workspace:has(.bom-panel) .bom-part-identity,
  .workspace:has(.bom-panel) .bom-card-fields,
  .workspace:has(.bom-panel) .bom-card-actions,
  .workspace:has(.bom-panel) .bom-inline-editor {
    grid-column: 2;
  }

  .workspace:has(.bom-panel) .bom-card-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .workspace:has(.bom-panel) .bom-note-field {
    min-width: 0;
  }

  .workspace:has(.bom-panel) .bom-note-field input {
    width: 100%;
  }

  .workspace:has(.bom-panel) .bom-card-actions {
    display: flex;
    flex-wrap: wrap;
  }
}