.online-users-names{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:15px;padding:10px}.online-user-name{background-color:#f0f4f8;border-radius:15px;padding:5px 12px;transition:all 0.2s ease;box-shadow:0 1px 2px rgb(0 0 0 / .05)}.online-user-name:hover{background-color:#e6eaef;transform:translateY(-2px);box-shadow:0 2px 4px rgb(0 0 0 / .1)}.online-user-name a{color:#4a5568;text-decoration:none;font-size:13px;font-weight:500;display:inline-block;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.online-user-name a:hover{color:#2d3748}@media (max-width:768px){.online-users-names{gap:6px}.online-user-name{padding:4px 10px}.online-user-name a{font-size:12px;max-width:100px}}.online-user-name{opacity:0;animation:fadeIn 0.3s ease forwards}@keyframes fadeIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.hide-on-mobile{display:none!important}}.online-users-names::-webkit-scrollbar{width:6px;height:6px}.online-users-names::-webkit-scrollbar-track{background:#f1f1f1}.online-users-names::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.online-users-names::-webkit-scrollbar-thumb:hover{background:#a8a8a8}