body { background-color: #eef2f7; }
  .logo-title {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 600;
    color: #a5a5a5;
  }
  .avatar-preview {
    display: block;
    margin: 0 auto;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #ccc;
    box-shadow: 0 0.25rem 0.5rem rgba(0,0,0,0.1);
  }
  .nickname-display {
    text-align: center;
    font-size: 1.35rem;
    font-weight: 600;
    color: #222;
    margin-top: 0.5rem;
    margin-bottom: 1.2rem;
  }
  @media (max-width: 560px) {
    dl.row dt, dl.row dd {
      width: 40%;
      float: left;
      box-sizing: border-box;
      margin-bottom: 0.75rem;
    }
    dl.row dt { font-weight: 500; color: #6c757d; }
    dl.row dd { padding-left: 0.25rem; }
  }
  .member.rounded-pill { background-color: #e8e8e8 !important; }
  .seller.rounded-pill { background-color: #ebfdce !important; }
  .store.rounded-pill { background-color: #fde7f9 !important; }
  .admin.rounded-pill { background-color: #d4f6fc !important; }
  .superadmin.rounded-pill { background-color: #fcf8d7 !important; }
  .member-card {
    position: relative;
    border-radius: 1rem !important;
    border: 1px solid #ccc !important;
    background-color: #fff;
    box-shadow: 0 0 0.5rem rgba(0,0,0,0.05);
    overflow: hidden;
    transition: box-shadow 0.3s ease;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }
  .member-card:hover {
    box-shadow: 0 0 0.75rem rgba(100,100,200,0.2);
  }
  .member-card::after {
    content: "";
    position: absolute;
    top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(120deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0.2) 100%);
    transform: skewX(-20deg);
  }
  .member-card.shine::after {
    animation: shine 1s ease forwards;
  }
  @keyframes shine {
    0%   { left: -75%; }
    100% { left: 125%; }
  }
  .justify-label {
    display: inline-block;
    width: 4em;
    text-align: justify;
  }
  .justify-label::after {
    content: "";
    display: inline-block;
    width: 100%;
  }
  a {
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1.5px;
  }
.message-btn {
  border: none;
  background: none;
  padding: 0;
  outline: none;
  cursor: pointer;
}
.message-btn img {
  display: block;
  margin: 0 auto;
}
@keyframes wiggleUpDown {
  0%   { transform: translateY(0); }
  20%  { transform: translateY(-4px); }
  40%  { transform:  translateY(4px); }
  60%  { transform:  translateY(-2px); }
  80%  { transform:  translateY(2px); }
  100% { transform:  translateY(0); }
}
.profile-owl {
  display: block;
  margin: 0 auto;
  will-change: transform;
}
.wiggle {
  animation: wiggleUpDown 0.6s ease;
}
.breadcrumb-nav {margin-top: 0px;margin-bottom: 10px;margin-left:-0px;}