/* Member (student) public profile page — paired with gebruiker.html +
 * /app/features/gebruiker/gebruiker.js. Reuses the premium hero/stats/section shell
 * from /app/features/docent/docent.css (docent-hero, docent-stat, docent-section,
 * docent-empty, docent-error); this file only adds the recent-activity list
 * rows, which docent.html doesn't need (it uses course-card grids instead). */

.gebruiker-headline {
  font-size: 1.02rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.92);
  margin: 0.15rem 0 0.5rem;
}

.gebruiker-socials {
  display: flex;
  gap: 0.6rem;
  margin-top: 0.9rem;
}
.gebruiker-socials__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  transition: background 0.2s ease, transform 0.2s ease;
}
.gebruiker-socials__link i {
  font-size: 1.15rem;
}
.gebruiker-socials__link:hover {
  background: rgba(255, 255, 255, 0.25);
  transform: translateY(-2px);
}

.gebruiker-list {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.gebruiker-row {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  background: var(--white);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  text-decoration: none;
  color: inherit;
  transition: var(--transition), transform 0.2s ease;
}
.gebruiker-row:hover {
  border-color: var(--primary-color);
  transform: translateX(4px);
}
.gebruiker-row > i:first-child {
  flex: 0 0 auto;
  font-size: 1.4rem;
  color: var(--primary-color);
}
.gebruiker-row__body {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
  flex: 1 1 auto;
}
.gebruiker-row__title {
  font-weight: 600;
  color: var(--secondary-color);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gebruiker-row__meta {
  font-size: 0.82rem;
  color: var(--gray);
}
.gebruiker-row > i:last-child {
  flex: 0 0 auto;
  font-size: 1.3rem;
  color: var(--gray);
  transition: transform 0.2s ease;
}
.gebruiker-row:hover > i:last-child {
  color: var(--primary-color);
  transform: translateX(2px);
}