/*
 * The header's project selector and the "not filtered" note.
 *
 * Glacier's Object Selector header variant (section 15), sat after the app
 * name rather than replacing it. A native select styled with the input tokens
 * from section 9.2, at the 32px small-control height so it sits inside the
 * 56px bar without crowding the brand.
 */

.project-scope {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
  margin: 0 0 0 var(--space-3);
}

.project-scope__select {
  height: 32px;
  max-width: 16rem;
  min-width: 0;
  padding: 0 var(--space-2);
  border: 1px solid var(--border-primary);
  border-radius: var(--radius-md);
  background: var(--surface-primary);
  color: var(--text-primary);
  font: inherit;
  font-size: var(--text-body-sm);
  text-overflow: ellipsis;
  cursor: pointer;
}

.project-scope__select:focus-visible {
  outline: 2px solid var(--ptag-blue);
  outline-offset: 1px;
}

/* auto-submit marks the form once it is live; the button is then redundant. */
.project-scope[data-auto-submit-connected] .project-scope__go {
  display: none;
}

.project-scope__note {
  margin: 0 0 var(--space-3);
  color: var(--text-muted);
  font-size: var(--text-caption);
}

@media (max-width: 767px) {
  .project-scope {
    margin-left: var(--space-1);
  }

  .project-scope__select {
    max-width: 9rem;
  }
}