/* ----------------------------------------------
 * Favoritos
 * ---------------------------------------------- */

.chart {
  width: 100%;
  image-rendering: auto;
  transition: transform 0.3s ease;
}

.grid {
  display: grid;
  grid-gap: 16px;
  justify-content: center;
  text-align: center;
  margin: 24px 0;
  width: 100%;
}

.grid img {
  image-rendering: pixelated;
  outline: 1px solid var(--clr-gray-a0);
  border-radius: 3px;
  transition: box-shadow 0.3s ease;
  transform-style: preserve-3d;
}

.grid img:hover {
  /* box-shadow: 0 0px 12px rgba(255, 255, 255, 0.25); */
  box-shadow: 0 0 0 3px var(--clr-main-a30);
}

.grid img.tenho {
  /* border: 2px solid var(--clr-main-a40); */
  /* box-shadow: 0px 0px 8px var(--clr-main-a40); */
}

.grid.albuns {
  grid-template-columns: repeat(auto-fit, 154px);
}

.grid.albuns img {
  width: 154px;
  height: 154px;
}

.grid.filmes {
  grid-template-columns: repeat(auto-fit, 120px);
}

.grid.filmes img {
  width: 120px;
  height: 180px;
}

.grid .placeholder {
  background: var(--clr-black-a10);
  border-radius: 3px;
  outline: 1px solid var(--clr-gray-a0);
  display: block;
}

.grid.jogos {
  grid-template-columns: repeat(auto-fit, 120px);
}

.grid.jogos img {
  width: 120px;
  height: 160px;
}

/* .chart:hover {
    transform: scale(1.3);
} */

.midias-secao .favoritos {
  margin-top: 32px;
}

div.midias-secao div.favoritos h2 {
  --clr-texto: var(--clr-gray-a50);

  color: var(--clr-white);
  border-bottom: 1px solid var(--clr-gray-a40);
  font-family: var(--fonte-corpo);
  font-size: 1rem;
  padding-bottom: 0.25rem;
  text-transform: uppercase;
}