/* Preserve Avo's visual design while providing WCAG-sized pointer targets. */
.button,
.button-icon {
  min-height: 48px;
  min-width: 48px;
}

.avo-asset-preview {
  display: block;
  width: 8rem;
  max-width: 100%;
  height: 6rem;
  object-fit: contain;
}

.avo-asset-preview-unavailable {
  display: inline-block;
  max-width: 10rem;
  overflow-wrap: anywhere;
}

/* Avo's packed stylesheet does not scan application-owned custom-tool views. */
[data-performance-dashboard],
[data-performance-cohort] {
  --color-content-secondary: var(--color-avo-neutral-700);
}

:is([data-performance-dashboard], [data-performance-cohort]) .border-b {
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

:is([data-performance-dashboard], [data-performance-cohort]) .overflow-x-auto {
  overflow-x: auto;
}

:is([data-performance-dashboard], [data-performance-cohort]) .decoration-accent {
  text-decoration-color: var(--color-accent);
}

:is([data-performance-dashboard], [data-performance-cohort]) .underline-offset-4 {
  text-underline-offset: var(--spacing);
}

:is([data-performance-dashboard], [data-performance-cohort]) .avo-performance-link {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
}

[data-performance-dashboard] .border-accent {
  border-color: var(--color-accent);
}

[data-performance-dashboard] .accent-accent {
  accent-color: var(--color-accent);
}

[data-performance-dashboard] .text-3xl {
  font-size: var(--text-3xl);
  line-height: var(--text-3xl--line-height);
}

[data-performance-dashboard] .space-y-5 > :not(:last-child) {
  margin-block-end: calc(var(--spacing) * 5);
}

@media (min-width: 48rem) {
  [data-performance-dashboard] .md\:block {
    display: block;
  }

  [data-performance-dashboard] .md\:hidden {
    display: none;
  }
}

@media (min-width: 80rem) {
  [data-performance-dashboard] .xl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  [data-performance-dashboard] .xl\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  [data-performance-dashboard] .xl\:col-span-2 {
    grid-column: span 2 / span 2;
  }

  [data-performance-dashboard] .xl\:col-span-3 {
    grid-column: span 3 / span 3;
  }
}
