/* Issue 1525. A species photo preview is shown WHOLE and never deformed.
 *
 * Every photo sits in a frame of the same 4:3 box so the grid stays even, and the image inside is
 * `object-fit: contain`, centred: a portrait leaves bands on the sides, a landscape above and
 * below, and neither is cropped, stretched or enlarged past its own pixels. `cover` and `fill`
 * are what Nahim asked to avoid («ten cuidado de que al desplegarlas no se deformen»).
 */
.species-photo-frame {
  aspect-ratio: 4 / 3;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: var(--bs-tertiary-bg, #f1f3f5);
  border-radius: var(--bs-border-radius, 0.375rem);
}

.species-photo-frame > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.species-photo-frame > [data-species-photo-fallback] {
  margin: 0;
  padding: 0.5rem;
  text-align: center;
}