```cs
@using KLMP.Enums
@using KLMP.Models
@using KLMP.Services
@using Microsoft.AspNetCore.SignalR.Client
@rendermode InteractiveServer
@inject UserService UserService;
@inject  NavigationManager Navigation
@inject IHttpContextAccessor HttpContextAccessor

<div class="flex justify-between items-center w-full text-white  mt-10 mb-10 select-none">
    <div class="language-field flex justify-center items-center p-[10] overflow-hidden">
        <div class="language flex justify-center items-center p-[10] mr-[5px] rounded-[10px] bg-[#212830] hover:bg-[#29323c] cursor-pointer z-[100]" @onclick="ToggleLanguageToast">
            @if (_user is null || _user.Info is null || string.IsNullOrEmpty(_user.Info.Language))
            {
                <img src="flags/@(TranslationsService.DefaultLanguage)_flag.svg" alt="Flag" class="w-[22px] h-[17px] m-[10px]">
            }
            else
            {
                <img src="flags/@(_user.Info.Language)_flag.svg" alt="Flag" class="w-[22px] h-[17px] m-[10px]">
            }
        </div>

        <div class="language-toast z-[99] flex transition-all duration-300 ease-in-out transform
                @(_toggleLanguageToast ? "translate-x-0 opacity-100" : "-translate-x-full opacity-0")">
            <div class="language flex justify-center items-center p-[10] rounded-[10px] bg-[#212830]">
                @foreach (var (key, value) in _languages.Where(l => l.Key != (_user?.Info?.Language ?? TranslationsService.DefaultLanguage)))
                {
                    <img src="@value" alt="Flag" class="w-[22px] h-[17px] m-[10px] cursor-pointer" @onclick="() => ChangeLanguage(key)">
                }
            </div>
        </div>
    </div>

    <div class="profile-field flex relative">
        @if (_user != null)
        {
            <div class="buttons flex gap-x-[10px]">
                <button class="w-10 h-10 rounded-[10px] flex items-center justify-center hover:bg-[#29323c] transition duration-200 bg-[#212830]"
                        @onclick="ToggleFriendsMenu">
                    <img src="/img/play.svg" alt="Arrow" class="w-max h-auto"/>
                </button>

                <div class="absolute p-[25px] top-[60px] right-[90%] w-[320px] h-auto max-h-[320px] bg-[#212830] rounded-[30px] shadow-lg z-50 transition-all duration-300 ease-in-out
                    @(_friendsMenuVisible ? "opacity-100 visible" : "opacity-0 invisible") items-center mt-[10px]">
                    <div class="friends-content w-full h-full mr-[5px]">
                        <div class="friends-scroll flex flex-col gap-[20px] overflow-y-auto w-full h-full pr-[5px]">
                            <div class="friends flex flex-col gap-[10px] justify-center items-center">
                                <div class="user w-full h-[55px] flex items-center gap-5 bg-[#2C3845] p-3 rounded-[15px]">
                                    <img class="rounded-full w-10 h-10" src="avatar.jfif" alt="User Avatar">
                                    <div class="flex flex-col justify-center">
                                        <div class="flex items-center gap-1">
                                            <p class="text-[12px]">ART</p>
                                            <div class="dot online w-1.5 h-1.5 rounded-full"></div>
                                        </div>
                                        <p class="text-[10px] text-[#AFBDD1]">Играет на PUBLIC №1</p>
                                    </div>
                                    <a href="#" class="rounded-[8px] bg-[#394959] hover:bg-[#364454] p-2 w-[40px] h-[40px] flex justify-center items-center transition duration-200 ease-in-out">
                                        <img src="img/play.svg" class="w-[20px] h-[20px]" alt=""/>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <button class="w-10 h-10 rounded-[10px] flex items-center justify-center hover:bg-[#29323c] transition duration-200 bg-[#212830]"
                        @onclick="ToggleNotificationsMenu">
                    <img src="/img/bell.svg" alt="Arrow" class="w-max h-auto"/>

                    @if (_notifications.Any(n => !n.IsRead))
                    {
                        <div class="absolute top-[-3px] left-[80px] dot w-[12px] h-[12px]"></div>
                    }
                </button>

                <button class="w-[50px] h-[50px] bg-[#29323c]" @onclick="SendNotificationsa">Send notify</button>
                <div class="absolute p-[25px] top-[60px] right-[79%] w-[320px] h-[320px] bg-[#212830] rounded-[30px] shadow-lg z-50 transition-all duration-300 ease-in-out
                    @(_notificationsMenuVisible ? "opacity-100 visible" : "opacity-0 invisible") items-center mt-[10px]">
                    <div class="notify-content w-full h-full mr-[5px]">
                        <div class="notify-scroll flex flex-col gap-[20px] overflow-y-auto w-full h-full pr-[5px] rounded-[8px]">
                            @foreach (var notification in _notifications)
                            {
                                <div class="notification flex flex-col gap-[10px] justify-center items-center" @onclick="() => MarkAsRead(notification)">
                                    <p class="text-[10px] font-medium text-[#717D8E]">@notification.Time.ToString("yyyy MMMM dd")</p>

                                    <div class="notice w-full h-auto bg-[#2C3845] flex flex-col gap-[10px] p-[20px] rounded-[15px]">
                                        <p class="text-[14px]">@notification.Title</p>
                                        <p class="text-[12px]">@notification.Content</p>

                                        @if (!notification.IsRead)
                                        {
                                            <div class="dot w-3 h-3"></div>
                                        }
                                    </div>
                                </div>
                            }
                        </div>
                    </div>
                </div>

            </div>

            <div class="nickname-and-balance flex ml-[15px] bg-[#212830] rounded-[20px]">
                <span class="flex items-center  text-white text-sm whitespace-nowrap px-[20px]">@_user.Name</span>
                <span class="bg-[#2C3845] h-full flex rounded-[20px] items-center px-5 rounded-full text-sm  text-white whitespace-nowrap">@(_user.Info?.Balance ?? 0) K</span>
            </div>

            <div class="profile-hamburger flex ml-[10px] gap-x-[15px] relative">
                <div class="w-10 h-10 flex items-center justify-center" @onclick="ToggleProfileMenu">
                    <img src="@_user.Avatar" alt="Avatar" class="w-full h-full rounded-full cursor-pointer"/>
                </div>
                <div class="arrow flex items-center cursor-pointer" @onclick="ToggleProfileMenu">
                    <img src="/img/arrow_down.svg" alt="Arrow" class="w-max h-auto"/>
                </div>

                <div class="absolute top-[60px] right-0 w-[200px] bg-[#212830] rounded-[30px] shadow-lg z-50 transition-all duration-300 ease-in-out
                    @(_profileMenuVisible ? "opacity-100 visible" : "opacity-0 invisible") mt-[10px]">
                    <div class="p-[30px] flex flex-col gap-[10px] text-[12px]">
                        <a href="/profile/me" class="bg-[#2C3845] hover:bg-[#29323c] rounded-[8px] p-[10px] text-white inline-flex"><img src="img/person.svg" class="mr-[10px]"/>ПРОФИЛЬ</a>
                        <a href="/profile/me/friends" class="bg-[#2C3845] hover:bg-[#29323c] rounded-[8px] p-[10px] text-white inline-flex"><img src="img/people-white.svg" class="mr-[10px]"/>ДРУЗЬЯ</a>
                        <a href="/profile/me/settings" class="bg-[#2C3845] hover:bg-[#29323c] rounded-[8px] p-[10px] text-white inline-flex"><img src="img/settings.svg" class="mr-[10px]"/>НАСТРОЙКИ</a>
                        <hr class="border-[#2C3845]"/>
                        <a href="#" @onclick="Logout" class="cursor-pointer bg-[#2C3845] hover:bg-[#29323c] rounded-[8px] p-[10px] text-white inline-flex"><img src="img/exit.svg" class="mr-[10px]"/>ВЫЙТИ</a>
                    </div>
                </div>
            </div>
        }
        else
        {
            <a href="/auth/login" class="flex bg-[#212830] pt-[10px] pb-[10px] pl-[20px] pr-[20px] rounded-[10px] gap-[6px] text-[14px] ">
                <i class="bi bi-steam"></i> ВОЙТИ
            </a>
        }
    </div>
</div>

@code {

    private Dictionary<string, string> _languages = new()
    {
        ["ru"] = "flags/ru_flag.svg",
        ["en"] = "flags/en_flag.svg",
        ["ua"] = "flags/ua_flag.svg",
    };

    private bool _toggleLanguageToast;
    private bool _profileMenuVisible;
    private bool _notificationsMenuVisible;
    private bool _friendsMenuVisible;
    private SteamUserProfile? _user;
    private HubConnection? _hubConnection;

    private List<Notification> _notifications = [];

    protected override async Task OnInitializedAsync()
    {
        _user = await UserService.GetCurrentUserAsync();

        await InitializeNotificationHub();
    }

    private async Task InitializeNotificationHub()
    {
        _hubConnection = new HubConnectionBuilder()
            .WithUrl(Navigation.ToAbsoluteUri("/notificationhub"))
            .Build();

        _hubConnection.On<Notification>("ReceiveNotifications", (n) => _notifications.Add(n));
        _hubConnection.On<List<Notification>>("LoadNotifications", (n) => _notifications = n);

        _hubConnection.On<List<Notification>>("UpdateNotification", (n) =>
        {
            _notifications = n;
            InvokeAsync(StateHasChanged);
        });

        await _hubConnection.StartAsync();
        await _hubConnection.SendAsync("Connect", _user?.SteamId?.SteamId64.ToString());
    }

    private async Task SendNotificationsa()
    {
        if (_hubConnection is not null)
        {
            await _hubConnection.SendAsync("SendNotification", new Notification()
            {
                Title = "Hui",
                Content = "Hui 2 3 + 1 0 sosi",
                Time = DateTime.Now,
                Type = NotificationType.Warning,
                IsRead = false
            });
        }
    }

    private async Task MarkAsRead(Notification notification)
    {
        if (_hubConnection is not null && _user is not null)
        {
            await _hubConnection.SendAsync("MarkAsRead", _user.SteamId?.SteamId64.ToString(), notification.Time);
        }

        notification.IsRead = true;
    }

    private void ToggleLanguageToast()
    {
        _toggleLanguageToast ^= true;
    }

    private void ToggleProfileMenu()
    {
        _profileMenuVisible ^= true;
    }

    private void ToggleNotificationsMenu()
    {
        _notificationsMenuVisible ^= true;
    }

    private void ToggleFriendsMenu()
    {
        _friendsMenuVisible ^= true;
    }

    private void Logout()
    {
        Navigation.NavigateTo("/auth/logout", true);
    }

    private async Task ChangeLanguage(string lang)
    {
        ToggleLanguageToast();
        if (_user?.Info != null)
        {
            _user.Info.Language = lang;
            await UserService.UpdatePlayerLanguage(lang);
            Navigation.ReloadPage();
        }
    }

}
```

исправь точку которая в самих уведомлениях, она криво, если абсолют, она не следует за блоком,  даже если настроить позицию, сделай чтобы она была снизу с лева маленькая точка, либо с права сверху