@import "https://assets.elements.dev/assets/app/shared/ui-catalog/catalog/style.c38e1d7304920e3.css";

.attachment-demo-row {
  display:     flex;
  flex-wrap:   wrap;
  align-items: center;
  gap:         var(--space-3);
}

[data-testid="demo-list"] .attachments,
[data-testid="demo-upload"] .attachments[data-variant="list"],
[data-testid="demo-sources"] .attachments[data-variant="list"],
[data-testid="demo-custom"] .attachments {
  width:     100%;
  max-width: var(--container-sm);
}

.attachment-demo-end {
  display:         flex;
  justify-content: flex-end;
  width:           100%;
}

/* A caller's class on each root: a muted panel behind the strip and the empty state. */
.attachments.attachment-demo-classed,
.attachment-empty.attachment-demo-classed {
  background:    var(--bg-muted);
  border-radius: var(--radius-surface);
  padding:       var(--space-2);
}

.attachment.attachment-demo-classed {
  font-weight: var(--weight-ui);
}