/* ============================================
   [24] Stats do perfil sem moldura
   Remove background/border dos boxes Posts/Fã/Hate
   mantendo apenas números e labels bem separados.
   ============================================ */

.profile-hero-inner .profile-stats-inline {
  gap: 22px;
}

.profile-hero-inner .profile-stats-inline .stat,
.profile-hero-inner .profile-stats-inline .stat:hover {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
  transform: none !important;
  box-shadow: none !important;
}

.profile-hero-inner .profile-stats-inline .stat strong {
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
}
.profile-hero-inner .profile-stats-inline .stat span {
  font-size: 11px;
  letter-spacing: .4px;
  margin-top: 4px;
  text-transform: uppercase;
  opacity: .75;
}

@media (min-width: 640px) {
  .profile-hero-inner .profile-stats-inline { gap: 28px; }
  .profile-hero-inner .profile-stats-inline .stat strong { font-size: 22px; }
}

/* ============ [FIX 24b] Desktop: stats to the RIGHT of the name (Posts/Fã/Hate) ============ */
@media (min-width: 720px) {
  .profile-hero-inner .profile-info {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 28px;
    align-items: start;
  }
  .profile-hero-inner .profile-info h1 { grid-column: 1; grid-row: 1; min-width: 0; }
  .profile-hero-inner .profile-info .profile-username { grid-column: 1; grid-row: 2; }
  .profile-hero-inner .profile-info .mutual-tag { grid-column: 1; grid-row: 3; }
  .profile-hero-inner .profile-info .profile-stats-inline {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: center;
    justify-self: end;
    margin: 0;
  }
}

/* ============ [24c FIX] Stats sempre à direita do nome (mobile + desktop) ============ */
.profile-hero-inner .profile-info {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 18px;
  align-items: start;
}
.profile-hero-inner .profile-info h1 { grid-column: 1; grid-row: 1; min-width: 0; }
.profile-hero-inner .profile-info .profile-username { grid-column: 1; grid-row: 2; }
.profile-hero-inner .profile-info .mutual-tag { grid-column: 1; grid-row: 3; }
.profile-hero-inner .profile-info .profile-stats-inline {
  grid-column: 2;
  grid-row: 1 / span 3;
  align-self: center;
  justify-self: end;
  margin: 0;
}
@media (max-width: 420px) {
  .profile-hero-inner .profile-info { column-gap: 10px; }
  .profile-hero-inner .profile-stats-inline { gap: 14px; }
  .profile-hero-inner .profile-stats-inline .stat strong { font-size: 17px; }
  .profile-hero-inner .profile-stats-inline .stat span { font-size: 10px; }
}
