/* 位置清單編輯器（新增 / 編輯品項 modal 的位置列、位置調整；跨頁共用，CSS 架構重構 P5 自 4-pages/inventory-locations.css 改為共用元件） */
@layer components {
/* Inventory location editing and target-location adjustment surfaces. */
#edit-modal .edit-stock-headers, #add-modal .edit-stock-headers, #edit-stock-rows .stock-row, #add-stock-rows .stock-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 60px minmax(0, 1fr) 40px;
  gap: 6px;
  align-items: center;
}

#edit-modal .edit-stock-headers .ch-cabinet, #add-modal .edit-stock-headers .ch-cabinet { grid-column: 1; }
#edit-modal .edit-stock-headers .ch-pos, #add-modal .edit-stock-headers .ch-pos { grid-column: 2; }
#edit-modal .edit-stock-headers .ch-qty, #add-modal .edit-stock-headers .ch-qty { grid-column: 3; width: auto; }
#edit-modal .edit-stock-headers .ch-note, #add-modal .edit-stock-headers .ch-note { grid-column: 4; }
#edit-modal .edit-stock-headers .ch-remove, #add-modal .edit-stock-headers .ch-remove { grid-column: 5; }

#edit-stock-rows .stock-field, #add-stock-rows .stock-field {
  display: block;
  min-width: 0;
  margin: 0;
}

#edit-stock-rows .stock-field select, #add-stock-rows .stock-field select, #edit-stock-rows .stock-field input, #add-stock-rows .stock-field input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
}

#edit-stock-rows .stock-mobile-label, #add-stock-rows .stock-mobile-label { display: none; }

#edit-stock-rows .stock-remove, #add-stock-rows .stock-remove {
  width: 40px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--c-danger-border);
  border-radius: var(--r-md);
  background: var(--c-white);
  color: var(--c-danger-strong);
  font-size: var(--fs-16);
  font-weight: var(--fw-bold);
  cursor: pointer;
}

#edit-stock-rows .stock-remove:hover, #add-stock-rows .stock-remove:hover { background: var(--c-danger-soft); }

/* 與 .modal 同在 components 層且 modal.css 較晚載入：用 .modal.stock-adjust-modal 提高特異度，寬度才不會被 .modal 蓋掉 */
.modal.stock-adjust-modal {
  width: min(420px, calc(100vw - 24px));
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
}

.stock-adjust-description {
  margin: -4px 0 12px;
  color: var(--c-muted);
  font-size: var(--fs-13);
}

.stock-adjust-location-list {
  display: grid;
  gap: 8px;
  max-height: min(50vh, 360px);
  overflow-y: auto;
}

.stock-adjust-location-option {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  background: var(--c-white);
  color: var(--c-text);
  text-align: left;
  overflow-wrap: anywhere;
  cursor: pointer;
}

.stock-adjust-location-option:hover, .stock-adjust-location-option:focus-visible {
  border-color: var(--c-primary);
  background: var(--c-white);
}

.stock-adjust-location-name { font-size: var(--fs-14); font-weight: var(--fw-bold); }
.stock-adjust-location-qty { color: var(--c-muted); font-size: var(--fs-12); }

@media (max-width: 767px) {
  #edit-modal .edit-stock-headers, #add-modal .edit-stock-headers { display: none; }

  #edit-stock-rows .stock-row, #add-stock-rows .stock-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px;
    grid-template-areas: "cabinet sub remove" "qty note remove";
    gap: 8px 6px;
    align-items: end;
    padding: 8px;
    border: 1px solid var(--c-border);
    border-radius: var(--r-md);
  }

  #edit-stock-rows .stock-field-cabinet, #add-stock-rows .stock-field-cabinet { grid-area: cabinet; }
  #edit-stock-rows .stock-field-sub, #add-stock-rows .stock-field-sub { grid-area: sub; }
  #edit-stock-rows .stock-field-qty, #add-stock-rows .stock-field-qty { grid-area: qty; }
  #edit-stock-rows .stock-field-note, #add-stock-rows .stock-field-note { grid-area: note; }
  #edit-stock-rows .stock-remove, #add-stock-rows .stock-remove {
    grid-area: remove;
    width: 44px;
    height: 44px;
    align-self: center;
  }
  #edit-stock-rows .stock-mobile-label, #add-stock-rows .stock-mobile-label {
    display: block;
    margin-bottom: 3px;
    color: var(--c-muted);
    font-size: var(--fs-11);
    font-weight: var(--fw-medium);
  }
  #edit-stock-rows .stock-field input, #add-stock-rows .stock-field input, #edit-stock-rows .stock-field select, #add-stock-rows .stock-field select {
    padding: 8px 7px;
    font-size: var(--fs-13);
  }
}
}