.profile-header {
  background: white;

  padding: 35px;

  border-radius: 20px;
}

.profile-avatar {
  width: 90px;
  height: 90px;

  margin: auto;

  border-radius: 50%;

  background: var(--gold);

  color: white;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 2.5rem;

  font-weight: 700;
}

.profile-menu {
  background: white;

  border-radius: 20px;

  overflow: hidden;
}

.profile-item {
  display: flex;

  align-items: center;

  gap: 20px;

  padding: 22px 25px;

  border-bottom: 1px solid #eee;

  color: var(--text);

  text-decoration: none;

  transition: 0.3s;
}

.profile-item:hover {
  background: var(--bg-main);
}

.profile-item > i:first-child {
  font-size: 1.5rem;

  color: var(--gold);
}

.profile-item div {
  flex: 1;
}

.profile-item h5 {
  margin: 0;

  font-size: 1rem;

  font-weight: 600;
}

.profile-item p {
  margin: 5px 0 0;

  color: var(--gray);

  font-size: 0.9rem;
}

.profile-item .bi-chevron-right {
  color: #aaa;
}

.logout i:first-child {
  color: #dc3545;
}

@media (max-width: 768px) {
  .profile-item {
    padding: 18px;
  }

  .profile-item p {
    font-size: 0.8rem;
  }
}