.profile-box{
        text-align:center;
        padding:10px 10px 16px;
        border-bottom:1px solid #ececec;
        margin-bottom:14px;
        overflow:visible;
    }

    .avatar{

        width:64px;
        height:64px;

        margin:0 auto 10px;

        border-radius:50%;

        overflow:hidden;

        background:
        linear-gradient(135deg,#7c3aed,#a855f7);

        border:
        3px solid rgba(255,255,255,.14);

        box-shadow:
        0 10px 24px rgba(0,0,0,.25);

        flex-shrink:0;
    }

    .avatar img{
        width:100%;
        height:100%;

        object-fit:cover;

        display:block;
    }

    .profile-name{
        font-size:18px;
        font-weight:800;
        color:#111827;
    }

    .profile-sub{
        margin-top:4px;
        font-size:13px;
        color:#6b7280;
        word-break:break-word;
    }

    .profile-link{
        position:relative;
        display:block;
        text-decoration:none;
        transition:.18s ease;
        z-index:1000;
    }

    .profile-link:hover .profile-name{
        color:#7c3aed;
    }

    .profile-link:hover{
        transform:translateY(-1px);
    }

    .global-sidebar h3{
        font-size:12px;
        letter-spacing:.6px;
        text-transform:uppercase;
        color:#9ca3af;
        margin:14px 0 8px;
        padding-left:6px;
    }

    .side-ico{
        width:28px !important;
        height:28px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        font-size:16px !important;
        line-height:1 !important;
    }

    .side-text{
        display:block !important;
        line-height:1 !important;
        white-space:nowrap !important;
        margin:0 !important;
        padding:0 !important;
    }

    .search-wrap{
        position:relative;
        margin-bottom:10px;
    }

    .search-input{
        width:100%;
        height:48px;
        padding:0 14px;
        border:1px solid rgba(255,255,255,.14);
        border-radius:16px;
        outline:none;

        background:rgba(255,255,255,.06);
        backdrop-filter:blur(10px);

        color:#fff;
        font-size:14px;
        font-weight:500;

        transition:.25s;
    }

    .search-input::placeholder{
        color:rgba(255,255,255,.45);
    }

    .search-input:focus{
        border-color:#7c3aed;
        box-shadow:
        0 0 0 3px rgba(124,58,237,.18),
        0 10px 25px rgba(124,58,237,.12);
        background:rgba(255,255,255,.08);
    }

    .live-box{
        display:none;
        position:absolute;
        top:56px;
        left:0;
        right:0;

        background:#1b2433;

        border:1px solid rgba(255,255,255,.08);
        border-radius:18px;

        box-shadow:
        0 18px 40px rgba(0,0,0,.35),
        0 0 0 1px rgba(255,255,255,.03);

        overflow:hidden;
        z-index:99;

        backdrop-filter:blur(14px);
    }

    .live-item{
        display:block;
        padding:12px 14px;

        text-decoration:none;

        color:#fff;
        font-size:14px;
        font-weight:500;

        border-bottom:1px solid rgba(255,255,255,.05);

        transition:.22s;
    }

    .live-item:hover{
        background:rgba(124,58,237,.18);
        padding-left:18px;
    }

    .live-item strong{
        color:#fff;
        font-weight:700;
    }

    .live-item small{
        display:block;
        margin-top:4px;
        font-size:12px;
        color:rgba(255,255,255,.55);
    }

.sidebar-online-users{

    margin-top:auto;

    padding-top:24px;

    border-top:
    1px solid rgba(255,255,255,.08);

}

.global-sidebar-inner{

    display:flex;

    flex-direction:column;

    height:100%;

}

/* =====================================
   ONLINE USERS
===================================== */

.online-user-card{

    display:flex;
    align-items:center;
    gap:12px;

    padding:12px;

    margin-bottom:10px;

    border-radius:14px;

    text-decoration:none;

    background:
    rgba(255,255,255,.04);

    border:
    1px solid rgba(255,255,255,.06);

    transition:.18s ease;
}

.online-user-card:hover{

    background:
    rgba(124,58,237,.18);

    border-color:
    rgba(124,58,237,.30);
}

.online-user-avatar{

    position:relative;

    width:42px;
    height:42px;

    border-radius:50%;

    overflow:visible;

    flex-shrink:0;
}

.online-user-avatar img{

    width:100%;
    height:100%;

    object-fit:cover;

    display:block;
}

.online-mobile-badge{

    color:#ffffff;

    position:absolute;

    right:-4px;
    bottom:-4px;

    width:22px;
    height:22px;

    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:13px;

    background:#7c3aed;

    border:2px solid #1b2433;

    box-shadow:
    0 0 10px rgba(124,58,237,.45);

    line-height:1;
}

.online-mobile-badge svg{

    width:11px;
    height:11px;

    display:block;
}

.online-user-info{

    flex:1;
    min-width:0;
}

.online-user-top{

    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
}

.online-user-name{

    color:#fff;

    font-size:14px;
    font-weight:700;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.online-user-role{

    margin-top:3px;

    color:#9ca3af;

    font-size:12px;
}

.online-user-status{

    display:flex;
    align-items:center;
    gap:6px;

    color:#86efac;

    font-size:11px;
    font-weight:700;

    white-space:nowrap;
}

.online-dot{

    width:8px;
    height:8px;

    border-radius:50%;

    background:#22c55e;

    display:inline-block;
}

.online-user-status.available{

    color:#86efac;
}

.online-user-status.away{

    color:#fcd34d;
}

.online-user-status.busy{

    color:#fca5a5;
}

.online-user-status.mobile{

    color:#c4b5fd;
}

.online-dot.available{

    background:#22c55e;

    box-shadow:
    0 0 8px rgba(34,197,94,.65);
}

.online-dot.away{

    background:#f59e0b;

    box-shadow:
    0 0 8px rgba(245,158,11,.65);
}

.online-dot.busy{

    background:#ef4444;

    box-shadow:
    0 0 8px rgba(239,68,68,.65);
}

.online-dot.mobile{

    background:#7c3aed;

    box-shadow:
    0 0 8px rgba(124,58,237,.65);
}

/* =====================================
   USER STATUS COLORS
===================================== */

.avatar-available{

    border:
    3px solid #22c55e !important;

    box-shadow:
    0 0 0 3px rgba(34,197,94,.18),
    0 10px 24px rgba(0,0,0,.25);
}

.avatar-away{

    border:
    3px solid #f59e0b !important;

    box-shadow:
    0 0 0 3px rgba(245,158,11,.18),
    0 10px 24px rgba(0,0,0,.25);
}

.avatar-busy{

    border:
    3px solid #ef4444 !important;

    box-shadow:
    0 0 0 3px rgba(239,68,68,.18),
    0 10px 24px rgba(0,0,0,.25);
}

.avatar-offline{

    border:
    3px solid #6b7280 !important;

    box-shadow:
    0 0 0 3px rgba(107,114,128,.18),
    0 10px 24px rgba(0,0,0,.25);
}

.avatar-mobile{

    border:
    3px solid #7c3aed !important;

    box-shadow:
    0 0 0 3px rgba(124,58,237,.18),
    0 10px 24px rgba(0,0,0,.25);
}

/* =====================================
   AVATAR STATUS MENU
===================================== */

.avatar-dropdown-wrap{

    position:relative;

    display:flex;
    justify-content:center;
}

/* =====================================
   AVATAR NOTIFICATION BADGE
===================================== */

.avatar-notification-badge{

    position:absolute;

    top:-6px;
    right:95px;

    min-width:20px;
    height:20px;

    padding:0 6px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:999px;

    background:
    linear-gradient(
        135deg,
        #a855f7,
        #7c3aed
    );

    color:#fff;

    font-size:11px;
    font-weight:800;

    border:1px solid #111827;

    box-shadow:
    0 0 0 3px rgba(124,58,237,.18),
    0 8px 18px rgba(124,58,237,.45);

    z-index:999999;

    line-height:1;
}

.avatar-status-menu{

    display:none;

    position:absolute;

    top:100%;
    left:50%;

    transform:
    translateX(-50%);

    margin-top:10px;

    min-width:140px;

    background:#1b2433;

    border:
    1px solid rgba(255,255,255,.06);

    border-radius:12px;

    overflow:hidden;

    z-index:99999;

    pointer-events:auto;

    box-shadow:
    0 12px 30px rgba(0,0,0,.28);
}

.avatar-status-menu.show{

    display:block;
}

.avatar-status-item{

    display:flex;
    align-items:center;
    gap:10px;

    padding:9px 12px;

    color:#e5e7eb;

    font-size:13px;
    font-weight:600;

    cursor:pointer;

    transition:.18s ease;
}

.avatar-status-item:hover{

    background:
    rgba(255,255,255,.04);
}

.avatar-status-dot{

    width:8px;
    height:8px;

    border-radius:50%;

    flex-shrink:0;
}

.avatar-status-dot.available{

    background:#22c55e;

    box-shadow:
    0 0 8px rgba(34,197,94,.65);
}

.avatar-status-dot.away{

    background:#f59e0b;

    box-shadow:
    0 0 8px rgba(245,158,11,.65);
}

.avatar-status-dot.busy{

    background:#ef4444;

    box-shadow:
    0 0 8px rgba(239,68,68,.65);
}

/* =====================================
   PROFILE STATUS
===================================== */

.profile-status-sidebar{

    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    margin-top:4px;

    font-size:13px;
    font-weight:600;
}

.profile-status-dot{

    width:8px;
    height:8px;

    border-radius:50%;

    flex-shrink:0;
}

.profile-status-dot.available{

    background:#22c55e;

    box-shadow:
    0 0 8px rgba(34,197,94,.65);
}

.profile-status-dot.away{

    background:#f59e0b;

    box-shadow:
    0 0 8px rgba(245,158,11,.65);
}

.profile-status-dot.busy{

    background:#ef4444;

    box-shadow:
    0 0 8px rgba(239,68,68,.65);
}

.profile-status-dot.offline{

    background:#6b7280;

    box-shadow:
    0 0 8px rgba(107,114,128,.45);
}

.edit-mode{

outline:4px solid #7c3aed;

}