/* Raquete por Perto — componentes. Valores de cor, espaço e canto vêm dos tokens. */

/* Botao */
.rpp-botao {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--espaco-1);
  height: 48px;
  padding: 0 var(--espaco-3);
  border: 1px solid transparent;
  border-radius: var(--raio-card);
  font-family: var(--font-texto);
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  cursor: pointer;
}
.rpp-botao-principal { background: var(--saibro); color: var(--texto-sobre-saibro); }
.rpp-botao-secundario { background: var(--branco); color: var(--pinho); border-color: var(--musgo); }
.rpp-botao:hover { box-shadow: inset 0 0 0 999px rgba(15, 59, 46, 0.08); }
.rpp-botao:focus-visible { outline: 2px solid var(--pinho); outline-offset: 2px; }
.rpp-botao:disabled { opacity: 0.45; cursor: not-allowed; box-shadow: none; }
.rpp-botao-bloco { width: 100%; }

/* Selo */
.rpp-selo {
  display: inline-flex;
  align-items: center;
  padding: 2px var(--espaco-1);
  border: 1px solid transparent;
  border-radius: var(--raio-selo);
  font-family: var(--font-texto);
  font-size: 13px;
  line-height: 18px;
  font-weight: 600;
  white-space: nowrap;
}
.rpp-selo-loja { background: var(--pinho); color: var(--branco); }
.rpp-selo-conferida { background: var(--branco); color: var(--saibro); border-color: var(--saibro); }
.rpp-selo-impulsionado { background: var(--bola); color: var(--texto-sobre-bola); }
.rpp-selo-patrocinado { background: var(--giz); color: var(--musgo); border-color: var(--divisor); }
.rpp-selo-vendido { background: var(--musgo); color: var(--branco); }

/* CardAnuncio */
.rpp-card {
  display: flex;
  flex-direction: column;
  background: var(--branco);
  border: 1px solid var(--divisor);
  border-radius: var(--raio-card);
  overflow: hidden;
  color: var(--pinho);
  text-decoration: none;
}
.rpp-card:focus-visible { outline: 2px solid var(--pinho); outline-offset: 2px; }
.rpp-card-foto { position: relative; aspect-ratio: 4 / 3; background: var(--giz); }
.rpp-card-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rpp-card-selos { position: absolute; top: var(--espaco-1); left: var(--espaco-1); display: flex; gap: var(--espaco-1); }
.rpp-card-corpo { display: flex; flex-direction: column; gap: 4px; padding: var(--espaco-2); }
.rpp-card-titulo { margin: 0; font-family: var(--font-display); font-size: 20px; line-height: 24px; font-weight: 700; }
.rpp-card-preco { margin: 0; font-family: var(--font-display); font-size: 24px; line-height: 28px; font-weight: 800; }
.rpp-card-local { margin: 0; font-family: var(--font-texto); font-size: 13px; line-height: 18px; font-weight: 500; color: var(--musgo); }
.rpp-card-vendido .rpp-card-foto img { opacity: 0.5; }