.inventory-attention-center {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.inventory-attention-center > header {
  align-items: flex-start;
  display: flex;
  gap: 14px;
}

.inventory-attention-center h2,
.inventory-attention-center p { margin: 0; }
.inventory-attention-center p { color: var(--text-muted, #64748b); margin-top: 4px; }

.inventory-attention-back {
  background: transparent;
  border: 0;
  color: var(--primary, #176b4d);
  flex: 0 0 auto;
  padding: 7px 0;
}

.inventory-attention-reasons {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
}

.inventory-attention-reason {
  align-items: center;
  background: #fff;
  border: 1px solid #dfe7e3;
  border-left: 4px solid #9baaa3;
  border-radius: 7px;
  color: #20342c;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-width: 0;
  padding: 13px;
  text-align: left;
}

.inventory-attention-reason:hover,
.inventory-attention-reason.is-active { border-left-color: #167451; box-shadow: 0 5px 16px rgb(24 78 59 / 10%); }
.inventory-attention-reason span { display: grid; gap: 3px; min-width: 0; }
.inventory-attention-reason small { color: #64748b; font-weight: 400; overflow-wrap: anywhere; }
.inventory-attention-reason b { color: #155f45; font-size: 1.25rem; }

.inventory-attention-warning,
.inventory-attention-explainer,
.inventory-attention-state {
  background: #f6f9f7;
  border-left: 4px solid #7c9388;
  border-radius: 6px;
  overflow-wrap: anywhere;
  padding: 12px 14px;
}

.inventory-attention-warning { background: #fff8e8; border-left-color: #bd7a0b; color: #704800; }
.inventory-attention-explainer { display: grid; gap: 3px; }
.inventory-attention-explainer span { color: #52665d; }

.inventory-attention-toolbar {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 280px);
  min-width: 0;
}

.inventory-attention-toolbar label,
.inventory-attention-bulk label { display: grid; gap: 5px; min-width: 0; }
.inventory-attention-toolbar input,
.inventory-attention-toolbar select,
.inventory-attention-bulk input,
.inventory-attention-bulk select { width: 100%; }
.inventory-attention-bulk input,
.inventory-attention-bulk select { min-height: 44px; }

.inventory-attention-list { display: grid; gap: 8px; min-width: 0; }
.inventory-attention-item {
  align-items: center;
  background: #fff;
  border: 1px solid #e4ebe7;
  border-radius: 7px;
  display: grid;
  gap: 12px;
  grid-template-columns: auto minmax(160px, 1.2fr) minmax(140px, .8fr) minmax(190px, 1.2fr);
  min-width: 0;
  padding: 12px;
}

.inventory-attention-check {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
}
.inventory-attention-check input { margin: 0; }
.inventory-attention-product,
.inventory-attention-status { display: grid; gap: 3px; min-width: 0; }
.inventory-attention-product strong,
.inventory-attention-product small,
.inventory-attention-status span { overflow-wrap: anywhere; }
.inventory-attention-product small,
.inventory-attention-status { color: #64748b; }
.inventory-attention-tags { display: flex; flex-wrap: wrap; gap: 5px; min-width: 0; }
.inventory-attention-tags span {
  background: #f0f5f2;
  border-radius: 999px;
  color: #385348;
  font-size: .78rem;
  padding: 4px 8px;
}

.inventory-attention-bulk {
  align-items: end;
  background: #eef7f2;
  border-left: 4px solid #167451;
  border-radius: 7px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 1fr) minmax(220px, 1fr) auto;
  min-width: 0;
  padding: 14px;
}
.inventory-attention-bulk > div { display: grid; gap: 3px; }
.inventory-attention-bulk small { color: #587065; }
.inventory-attention-bulk-preview {
  align-self: stretch;
  background: rgb(255 255 255 / 68%);
  border: 1px solid rgb(22 116 81 / 18%);
  border-radius: 6px;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 9px 10px;
}
.inventory-attention-bulk-preview strong,
.inventory-attention-bulk-preview small { overflow-wrap: anywhere; }
.inventory-attention-bulk-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.inventory-attention-bulk-actions button { min-height: 44px; }

.inventory-attention-pager {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.inventory-attention-pager span { margin-right: auto; }

@media (max-width: 900px) {
  .inventory-attention-item { grid-template-columns: auto minmax(0, 1fr); }
  .inventory-attention-status,
  .inventory-attention-tags { grid-column: 2; }
  .inventory-attention-bulk { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  .inventory-attention-center > header { display: grid; }
  .inventory-attention-toolbar,
  .inventory-attention-bulk { grid-template-columns: 1fr; }
  .inventory-attention-item { align-items: start; }
  .inventory-attention-bulk-actions,
  .inventory-attention-bulk-actions button { width: 100%; }
}