:root {
    --oom-avatar-size: 24px;
    --oom-member-name-font-size: 14px;
    --oom-duration-font-size: 11px;
    --oom-male-color: #4780F0;
    --oom-female-color: #F080C0;
    --oom-duration-color: #808080;
    --oom-spacing: 6px;

    /* New variables for member counts */
    --oom-count-label-font-size: 14px;
    --oom-count-label-color: #808080;
    --oom-count-value-font-size: 14px;
    --oom-count-value-color: #c0c0c0;
    --oom-count-spacing: 6px;
}

.oom-member-counts {
    margin-bottom: 20px;
    margin-left: 0px;
}

.oom-count-line {
    margin: 0 0 6px 0;
    padding: 0;
}

.oom-count-label {
    font-size: var(--oom-count-label-font-size);
    color: var(--oom-count-label-color);
    margin-right: 2px;
}

.oom-count-value {
    font-size: var(--oom-count-value-font-size);
    color: var(--oom-count-value-color);
    font-weight: bold;
}

#o-online-members-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-left: 0px;  
}

.oom-user {
    display: flex;
    align-items: center;
    margin-bottom: var(--oom-spacing);
}

.oom-avatar {
    width: var(--oom-avatar-size);
    height: var(--oom-avatar-size);
    border-radius: 50%;
    margin-right: var(--oom-spacing);
}

.oom-member-name {
    font-size: var(--oom-member-name-font-size);
    text-decoration: none;
    margin-right: 0px;
}

.oom-mobile-icon {
    margin-left: 0px;
    margin-right: 0px;
}

.oom-user-male {
    color: var(--oom-male-color);
}

.oom-user-female {
    color: var(--oom-female-color);
}

.oom-duration {
    font-size: var(--oom-duration-font-size);
    color: var(--oom-duration-color);
    margin-left: 4px;
    margin-top: 1px;
}