/* Keeps bookmark notes readable while preserving a compact running log. */
.data-table[data-wide="bookmarks"] {
  min-width: 48rem;
}

@scope (.data-table[data-wide="bookmarks"]) {
  th,
  td {
    padding: var(--space-5) var(--space-4);
    vertical-align: top;
  }

  :is(th, td):first-child {
    padding-left: var(--space-9);
    white-space: nowrap;
  }

  :is(th, td):last-child {
    padding-right: var(--space-9);
  }

  td[data-notes] {
    min-width: 16rem;
    white-space: pre-wrap;
  }

  td[data-notes] p {
    margin: 0;
    white-space: normal;
  }

  td[data-bookmark-action] button {
    min-height: auto;
    padding: var(--space-2) var(--space-4);
    border-color: var(--color-border);
    background: var(--color-surface-muted);
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
  }

  td[data-bookmark-action] > div {
    display: flex;
    gap: var(--space-3);
    white-space: nowrap;
  }
}

@scope (.filter-bar[aria-label="Bookmark status"]) {
  > div {
    display: flex;
    gap: var(--space-3);
  }
}

/* Marks an already-saved discovery without presenting another action. */
.bookmark-indicator {
  display: inline-flex;
  min-width: var(--space-12);
  min-height: var(--space-12);
  align-items: center;
  justify-content: center;
  color: var(--color-accent-strong);
}

@scope (.bookmark-indicator) {
  svg {
    width: var(--space-8);
    height: var(--space-8);
    fill: currentColor;
  }
}