/* Styles for user tiles within the right sidebar's contacts section */
.right-sidebar .contacts-wrapper .user-tile {
    padding: 8px 10px; /* Smaller padding for compactness */
    margin-bottom: 8px; /* Smaller margin */
    background-color: #2a2a2a; /* Darker background for tiles */
    border: 1px solid #3a3a3a; /* Subtle border */
    border-radius: 6px; /* Slightly less rounded corners */
    box-shadow: none; /* Remove shadow for a flatter look */
    cursor: pointer;
    transition: background-color 0.2s ease;
    display: flex;
    align-items: center;
    width: 100%; /* Ensure it takes full width of its container */
}

.right-sidebar .contacts-wrapper .user-tile:hover {
    background-color: #3a3a3a; /* Lighter on hover */
    transform: none; /* No lift effect in sidebar */
}

.right-sidebar .contacts-wrapper .user-avatar {
    width: 32px; /* Smaller avatar */
    height: 32px;
    margin-right: 10px; /* Smaller margin */
}

.right-sidebar .contacts-wrapper .user-info {
    flex-grow: 1;
    overflow: hidden; /* Hide overflowing content */
}

.right-sidebar .contacts-wrapper .user-info h4 {
    margin: 0;
    font-size: 0.9em; /* Smaller font size for name */
    color: var(--primary-text-color);
    display: block; /* Stack name and email */
    white-space: normal; /* Allow text to wrap */
    word-break: break-word; /* Ensure long names wrap */
    gap: 0; /* Remove gap from flex display */
}

.right-sidebar .contacts-wrapper .user-info h4 .verification-status-badge {
    font-size: 0.6em; /* Smaller badge */
    padding: 2px 5px;
    margin-left: 5px; /* Space between name and badge */
    vertical-align: middle; /* Align badge vertically */
}

.right-sidebar .contacts-wrapper .user-info p {
    margin: 0;
    font-size: 0.75em; /* Smaller font size for email */
    color: var(--secondary-text-color);
    white-space: normal; /* Allow text to wrap */
    word-break: break-word; /* Ensure long emails wrap */
}

/* Hide status icons and quick actions in the sidebar contacts */
.right-sidebar .contacts-wrapper .user-status-icons,
.right-sidebar .contacts-wrapper .user-quick-actions {
    display: none;
}
