{% extends 'base.html' %}

{% block title %}
Мой кабинет
{% endblock %}

{% block body %}




<style>
body {
  .dropdown-item:focus, .dropdown-item:hover {
        background-color: rgba(255, 255, 255, 0.1); /* Полупрозрачный фон при фокусе */
        color: white; /* Цвет текста при фокусе */
  }
    overflow: hidden; /* Запретить скроллинг */
  }
  #chat_in_task {
    resize: both; /* Разрешаем растягивание по обеим осям */
  }
  #share_table_cont {
    resize: both; /* Разрешаем растягивание по обеим осям */
  }
  #color_settings_cont {
    resize: both; /* Разрешаем растягивание по обеим осям */
  }
    #jarvis_cont {
      resize: both;
      overflow: auto;
      max-height: 95vh;
    }
  [easyfind="chat_area"]::-webkit-scrollbar {
    display: none;  /* Safari and Chrome */
  }
  [easyfind="button_area"]::-webkit-scrollbar {
    display: none;  /* Safari and Chrome */
  }
  #about_user::placeholder {
    color: rgba(255, 255, 255, 0.4); /* Белый цвет с прозрачностью 70% */
  }
  #last_news::placeholder {
    color: rgba(255, 255, 255, 0.4); /* Белый цвет с прозрачностью 70% */
  }
  #new_note_name::placeholder {
    color: rgba(255, 255, 255, 0.4); /* Белый цвет с прозрачностью 70% */
  }
  input[name="new_card"]::placeholder {
    color: rgba(255, 255, 255, 0.4); /* Белый цвет с прозрачностью 70% */
  }
  textarea[name="new_card"]::placeholder {
    color: rgba(255, 255, 255, 0.4); /* Белый цвет с прозрачностью 70% */
  }
  input[name="name_for_card1"]::placeholder {
    color: rgba(255, 255, 255, 0.4); /* Белый цвет с прозрачностью 70% */
  }
  input[name="find_friend_placeholder"]::placeholder {
    color: rgba(255, 255, 255, 0.4); /* Белый цвет с прозрачностью 70% */
  }
  input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1); /* Инвертирует цвет, делая значок белым */
}
</style>



<style>
    .custom-tooltip {
        position: relative;
        display: inline-block;
    }

    .custom-tooltip .tooltip-text {
        visibility: hidden;
        width: 420px;
        position: absolute;
        bottom: 100%;
        left: 30%;
        opacity: 0;
        transition: opacity 0.3s;
    }

    .custom-tooltip:hover .tooltip-text {
        visibility: visible;
        opacity: 1;
    }
    [data-hover] {
        transition: color 0.3s ease;
    }
</style>


{% include "includes/MODAL_ACTION_TO_ROW.html" %}

    <div id="color_settings_cont" class="visually-hidden bg-dark border-1 border-secondary rounded-2"  data-bs-theme="dark" style="opacity: 0.8; position: absolute; top: 20vh; left: 35vw; overflow-x: hidden; display:block; position: fixed; width: 600px; height: 500px; background-color: rgba(255, 255, 255, 0.9); border: 1px solid #ccc; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); z-index: 8000;">
        {% include "includes/color_editor.html" %}


    </div>

    {% set show_cont = jarvis_data['show_cont'] %}
    {% set size_jarvis_user_area_text = jarvis_data['size'] %}
    {% set pos = jarvis_data['pos'] %}
    <div id="jarvis_cont" color_id="4_mainBackDesk_BG" easyfind="jarvis_cont" class="visually-hidden bg-dark border-1 border-secondary rounded-2" data-bs-theme="dark" style="position: fixed; top: {{ pos[0] }}; left: {{ pos[1] }}; overflow: hidden; width: {{ size_jarvis_user_area_text[0] }}; height: {{ size_jarvis_user_area_text[1] }}; background-color: rgba(255, 255, 255, 0.9); border: 1px solid #ccc; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); z-index: 2000;">
        {% include "includes/jarvis.html" %}
    </div>

    {% include "includes/share_table_menu.html" %}



    {% if "Lead_of_team" in access or "Adm" in access %}
        <div id="edit_mini_modal" class="container-fluid bg-dark border-0 rounded-2"  data-bs-theme="dark" style="overflow-y: auto; display:none; position: fixed; width: 300px; height: auto; background-color: rgba(255, 255, 255, 0.9); border: 1px solid #ccc; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); z-index: 1000;">

            <div class="mt-2 mb-2 bg-dark d-flex rounded-2">
                 <input type="text" class="w-100 form-control me-2 fs-7 text-white text-end border-1 fw-light" id="chat_now_name" style="" value="">
                 <button title="Клик два раза - сохранить" id="save_namechat_button" class="btn border btn-secondary bg-gradient"  type="button"><img width="24" height="24" src="https://img.icons8.com/material-outlined/24/microsoft-to-do-app.png" alt="microsoft-to-do-app"/></button>
            </div>


        </div>
    {% endif %}

    <div id="mini_smile_container" class="bg-dark border-1 border-secondary rounded-2"  data-bs-theme="dark" style="overflow-y: auto; display:none; position: fixed; width: 300px; height: 200px; background-color: rgba(255, 255, 255, 0.9); border: 1px solid #ccc; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); z-index: 1000;">
        <div class="container-fluid bg-dark rounded-2" >
            {% for emoji in emojis %}
                <div class="btn btn-dark" style="cursor: pointer; font-size: 24px; text-align: center;" onclick="sendEmoji('{{ emoji }}')">
                    {{ emoji }}
                </div>
            {% endfor %}
        </div>


    </div>

    <div id="chat_in_task" class="bg-dark border-1 border-secondary rounded-2"  data-bs-theme="dark" style="overflow: hidden; display:none; position: fixed; width: 400px; max-height: 700px; height: auto; background-color: rgba(255, 255, 255, 0.9); border: 1px solid #ccc; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); z-index: 5000;">
        <div class="bg-dark w-100 rounded-2 d-flex" id="task_cont_of_data">
            <div class="container visually-hidden mt-1 me-1 ms-1 mb-1 bg-dark w-50 rounded-2 d-flex" id="sticky_string_cont" style="max-height: 700px;  height: auto">

                <div class="w-100 ">
                    <div class="border rounded-1 mt-2 mb-2" style="height: 270px; overflow-y: auto;" id="headers_collector_cont">


                    </div>
                    <textarea style="height: 400px;" id="string_example_field" class="w-100 form-control text-start border-1 mb-2 border-warning text-white" placeholder="Поле формирования данных (для передачи в задачу)"></textarea>

                </div>

            </div>

            <div class="bg-dark  w-100">
                <div class="bg-dark w-100 rounded-2 d-flex" id="head_task_cont">
                    <div class="bg-dark w-100 rounded-2" id="name_of_task">

                    </div>
                    <div class="w-25 d-flex me-2 mt-2 justify-content-end" id="base_window_buttons">
                        <button title="Свернуть" id="hide_task_window" onclick="hide_me()" class="me-2 btn btn-outline-secondary text-white  text-center" style="width: 25px; height: 25px; line-height: 1px; " type="button">_</button>
                        <button title="Закрыть окно" id="close_task_window" onclick="close_me()" class="btn btn-outline-secondary text-white  text-center" style="width: 25px; height: 25px; line-height: 0px; " type="button">X</button>
                    </div>
                </div>

                <div class="bg-dark rounded-2" id="nasru_v_menya_bratan" style="padding-bottom: 60px; overflow-y: auto; max-height: 580px; min-height: 580px; height: auto">

                </div>

                <div class="container bg-dark rounded-2 mt-2 mb-2" style="position: relative;">

                     <textarea style="height: 60px; resize: none;" id="task_comment_field" class="form-control text-start border-1 mb-2 border-warning text-white" placeholder="Новый комментарий к задаче"></textarea>
                    <button id="send_comment_to_task"  class="btn btn-dark border-0 me-1" style="position: absolute; top: 5px; right: 15px; display: flex; justify-content: center; align-items: center; width: 50px; height: 50px;" >
                        <img width="26" height="26" src="https://img.icons8.com/metro/26/FAB005/sent.png" alt="microsoft-to-do-app" style="max-width: 100%; max-height: 100%;"/>
                    </button>
                </div>
            </div>
        </div>

    </div>


    <div class="d-flex" style="height: 100vh; width: 100vw;">
        <p class="custom-tooltip hide-elem-mob text-secondary fs-7 ms-3 mt-2 fw-light" style="z-index: -1; position: fixed; bottom: -5px; height: 20px;">
            {{ version }}
            <textarea class="border-dark form-control text-white bg-dark text-start tooltip-text" data-bs-theme="dark" style="resize: none; height: 50vh;">{{version_info}}</textarea>
        </p>

        <div class="ms-1 mt-2 border-0"  style="height: 95vh;">
            {% include "includes/side_bar.html" %}
        </div>
            <div class="spinner-border spinner-border-sm " style="position: fixed; margin-top: 12px; left: 10px; z-index: 9999; " id="on_find_button" role="status"></div>


        <div class="container-fluid ms-1 w-100 " style="height: 98vh;" >



                {% set find_today_task = finded_task %}


                 <nav class="navbar rounded-3 navbar-dark navbar-expand-lg " style="position: static; z-index: 1000;">

                        <div class="rounded-3 navbar-collapse border" color_id="2_Up_sideBar_BG" style="background: linear-gradient(to right, #000000, #000000); border-color: #000000 !important;" id="navbarNavAltMarkup">
                            <div class="w-100 fluid d-flex">

                                <div class="navbar-nav ms-2" style="width: 450%">

                                <div class="w-100 d-flex flex-wrap gap-2">
                                    <a class="nav-link hide-elem-mob active" id="nav_1" data-hover color_id="1_1_mainText_Color" style="margin: 0 2.5px; width: auto; text-align: center; color: rgb(255, 255, 255);" type="button" onclick="change_desk('user_info_window', 'nav_1')">О себе</a>
                                    <a class="nav-link hide-elem-mob" id="nav_2" data-hover color_id="1_1_mainText_Color" type="button" style="margin: 0 2.5px; width: auto; text-align: center; color: rgb(255, 255, 255);" onclick="change_desk('user_work_friend', 'nav_2')">Коллеги</a>
                                    <a class="nav-link hide-elem-mob" id="nav_3" data-hover color_id="1_1_mainText_Color" style="margin: 0 2.5px; width: auto; text-align: center; color: rgb(255, 255, 255);" type="button" claud_item="nav_3" onclick="change_desk('user_work_statistic', 'nav_3')">Аналитика</a>
                                    <a class="nav-link hide-elem-mob" id="nav_6" data-hover color_id="1_1_mainText_Color" type="button" style="margin: 0 2.5px; width: auto; text-align: center; color: rgb(255, 255, 255);" onclick="change_desk('user_work_exchanges', 'nav_6')">Расходы</a>
                                    <a class="nav-link hide-elem-mob" id="nav_7" data-hover color_id="1_1_mainText_Color" type="button" style="margin: 0 2.5px; width: auto; text-align: center; color: rgb(255, 255, 255);" claud_item="nav_7" onclick="change_desk('user_work_notes', 'nav_7')">Заметки</a>

                                    <li class="nav-item dropdown hide-elem-mob">

                                        <a class="nav-link dropdown-toggle" data-hover color_id="1_1_mainText_Color" href="#" style="margin: 0 2.5px; width: auto; text-align: center; color: rgb(255, 255, 255);" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                            Разное
                                        </a>

                                        <ul class="dropdown-menu bg-dark hide-elem-mob" style="z-index: 3000;">
                                            <li>
                                                <a class="disabled dropdown-item text-secondary" href="#" style="display: flex; align-items: center;">
                                                    <img width="25" height="25" src="https://img.icons8.com/windows/32/FAB005/trophy.png" alt="trophy" style="margin-right: 8px;" />
                                                    Мои достижения
                                                </a>
                                            </li>
                                            <li>
                                                <a class="dropdown-item text-white" onclick="add_atribute_to_element('color_settings_cont', 'visually-hidden', 'del')" style="display: flex; align-items: center;">
                                                    <img width="20" height="20" src="https://img.icons8.com/metro/26/FAB005/paint-palette.png" alt="paint-palette" style="margin-right: 13px;" />
                                                    Редактор тем
                                                </a>
                                            </li>

                                        </ul>
                                    </li>


                                    <li class="nav-item dropdown show-elem-mob visually-hidden"  style="position: relative;">
                                        <a class="nav-link" id="mobile_menu" data-hover color_id="1_1_mainText_Color" href="#" style="margin: 0 2.5px; width: auto; text-align: left; color: rgb(255, 255, 255);" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                            <img width="26" height="26" src="https://img.icons8.com/metro/26/FFFFFF/menu.png" alt="menu"/>

                                        </a>
                                        <ul class="dropdown-menu bg-dark" style="z-index: 3000; position: absolute;">
                                            <li>
                                                <a class="nav-link ms-2" data-hover color_id="1_1_mainText_Color" style="text-align: left; color: rgb(255, 255, 255);" onclick="change_desk('user_work_friend', 'nav_2')">👥 Коллеги</a>
                                                <a class="nav-link ms-2" data-hover color_id="1_1_mainText_Color" style="text-align: left; color: rgb(255, 255, 255);" type="button" claud_item="nav_3" onclick="change_desk('user_work_statistic', 'nav_3')">📊 Аналитика</a>
                                                <a class="nav-link ms-2" data-hover color_id="1_1_mainText_Color" style="text-align: left; color: rgb(255, 255, 255);" onclick="change_desk('user_work_exchanges', 'nav_6')">💸 Расходы</a>
                                                <a class="nav-link ms-2" data-hover color_id="1_1_mainText_Color" style="text-align: left; color: rgb(255, 255, 255);" claud_item="nav_7" onclick="change_desk('user_work_notes', 'nav_7')">📝 Заметки</a>
                                                <a class="disabled nav-link ms-2" href="#" style="display: flex; align-items: left;">
                                                    🏆 Достижения
                                                </a>

                                            </li>
                                        </ul>
                                    </li>

                                    <li class="nav-item dropdown show-elem-mob visually-hidden"  style="position: relative;">

                                        <a class="nav-link" id="mobile_man_menu" data-hover color_id="1_1_mainText_Color" href="#" style="margin: 0 2.5px; width: auto; text-align: left; color: rgb(255, 255, 255);" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                            <img width="26" height="22" src="https://img.icons8.com/ios-filled/50/FFFFFF/tie.png" alt="menu"/>
                                        </a>

                                        <ul class="dropdown-menu bg-dark" style="z-index: 3000; position: absolute;">

                                            <a type="button" data-hover onclick="change_desk('user_info_window', 'nav_1')" color_id="1_1_mainText_Color" class="dropdown-item d-flex gap-1 align-items-center" aria-current="page">
                                                <img width="20" height="20" class="me-1" alt="Bootstrap" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAx0lEQVR4nO3SPQrCMBiA4dChk+Di4NwbeAAnFz2AV/AKHsBbeAg3Z8Gi0GNYJwe3Tgq+Ugj+Yn7KF0HJC12Spg98qVIxh4AM2OonU98I6AMH7h2BQWh0Apx47wxMQ4ApMMde/U6qz2z0Wt4U7QAr3KvB7uNCE7QH7PDv6YwvOgYqBHIFE2AGXJArsaEtYIF8S6BtggvCVZjgPCC8drln0azgT8LK8I0Ix1Hfij+XS6apve59DOF84L2gW/rAIyG8BIbOcOyvugLeV0oF53EveAAAAABJRU5ErkJggg==">
                                                Мой профиль
                                            </a>

                                            <a type="button" data-hover onclick="change_desk('task_cont', 'nav_9')" color_id="1_1_mainText_Color" claud_item="nav_9" class="dropdown-item d-flex gap-1 align-items-center" aria-current="page">
                                              <img width="20" height="20" class="me-1" alt="Bootstrap" src="https://img.icons8.com/ios-glyphs/30/FFFFFF/find-matching-job.png" alt="find-matching-job">
                                              Задачи <span class="badge bg-secondary text-dark" id="count_of_my_task" ></span>
                                            </a>


                                            <a type="button" data-hover onclick="change_desk('sup_tables_cont', 'nav_11')" color_id="1_1_mainText_Color" class="dropdown-item d-flex gap-1 align-items-center" aria-current="page">
                                              <img width="20" height="20" class="me-1" alt="Bootstrap" src="https://img.icons8.com/fluency-systems-filled/48/FFFFFF/new-spreadsheet.png" alt="new-spreadsheet">
                                              Личная Таблица
                                            </a>

                                            {% if "APP" in access %}
                                                <li class="nav-item">
                                                  <a type="button" data-hover onclick="change_desk('olejka_cont', 'nav_8')" color_id="1_1_mainText_Color" class="dropdown-item d-flex gap-1 align-items-center">
                                                  <img width="20" height="20" class="me-1" alt="Bootstrap"  src="https://img.icons8.com/ios-filled/50/FFFFFF/apple-app-store--v2.png">
                                                  Олежка Статист
                                                  </a>
                                                </li>
                                            {% endif %}
                                            <div class="container-fluid"><hr class="dropdown-divider" style="border-color: #9b7b70;"></div>


                                            <a type="button" data-hover href="logout" class="dropdown-item d-flex gap-1 align-items-center" color_id="1_1_mainText_Color" aria-current="page">
                                                <img width="20" height="20" class="me-1" alt="Bootstrap" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAm0lEQVR4nO2WwQ3CMAxFvQ2TwWQMARcqRoEt8v4hqJWKCiK4QZAi8Dsmcp5jWZbNggI551VKaQ1sJZ2AzhqJXmV+gsD+PlrSuU8C2NSaa8Qjg6j/feH+M2LzEwvxQ6LU0VxXvKagktI7xYenZ5KO4/hrKgY64NBcPCXEHjfleoYX4JpCPJf/LTULrD67RZa9N6+3w5j9/oXefpULELq2CgV6GMAAAAAASUVORK5CYII=">
                                                Выход
                                            </a>

                                        </ul>

                                    </li>

                                    <li class="ms-2 nav-item dropdown show-elem-mob visually-hidden" style="position: relative;">
                                        <a class="nav-link" data-hover color_id="1_1_mainText_Color" href="#" style="margin: 0 2.5px; width: auto; text-align: left; color: rgb(255, 255, 255);" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                            <img width="25" height="25" src="https://img.icons8.com/pulsar-line/48/FFFFFF/themes.png" alt="themes"/>
                                        </a>

                                        <ul class="dropdown-menu bg-dark" style="z-index: 3000; position: absolute;">
                                            {% for theme in server_themes %}
                                                <li><a class="dropdown-item text-white" onclick="load_theme('{{theme['short_info']['theme_id']}}')" style="color: inherit;">{{theme['short_info']['name']}}</a></li>
                                            {% endfor %}

                                            {% if user_themes %}
                                                <li>
                                                    <div class="container-fluid"><hr class="dropdown-divider" style="border-color: #9b7b70;"></div>
                                                </li>
                                                {% for theme in user_themes %}
                                                    <li><a class="dropdown-item text-white" onclick="load_theme('{{theme['short_info']['theme_id']}}')" style="color: inherit;">{{theme['short_info']['name']}}</a></li>
                                                {% endfor %}
                                            {% endif %}
                                        </ul>
                                    </li>

                                    <script>
                                        const rainbowColors = ['#FF0000', '#FF7F00', '#FFFF00', '#00FF00', '#00FFFF', '#0000FF', '#4B0082', '#9400D3'];
                                        function blurBackground() {
                                            const bgElement = document.getElementById('1_mainPage_BG');
                                            bgElement.style.filter = 'blur(5px)';
                                            setTimeout(() => bgElement.style.filter = 'blur(0px)', 500);
                                        }
                                        let first = true
                                        function playRainbow() {
                                            let index = 0;
                                            const duration = 1000; // 1 second
                                            const intervalTime = duration / rainbowColors.length;

                                            const interval = setInterval(() => {
                                                document.getElementById('info#412').style.color = rainbowColors[index];
                                                index++;
                                                if (index >= rainbowColors.length) {
                                                    clearInterval(interval)
                                                    if (first){first=false}else{
                                                    add_atribute_to_element('jarvis_cont', 'visually-hidden', 'del');}
                                                }
                                            }, intervalTime);
                                        }
                                        playRainbow()
                                    </script>

                                    <div class="" style="position: relative; display: flex; align-items: center;">
                                        <a class="nav-link" onclick="playRainbow()" style="position: absolute; left: 50%; transform: translateX(-50%); z-index: 1;">
                                            <img width="25" height="25" src="https://img.icons8.com/metro/104/FD7E14/iron-man.png" alt="paint-palette" style="margin-top: 2px;" />
                                        </a>
                                        <p class="fs-7 ms-1 text-start mt-2 text-truncate" id="info#412" style="height: 13px; margin-left: 30px;">X  X</p>
                                        <script>
                                            document.getElementById('info#412').innerHTML = `X ${parseFloat("{{ j_money }}").toFixed(7)} X`;
                                        </script>
                                    </div>

                                </div>
                            </div>

                                <!-- Аудиоплеер вынесен наружу, закреплен в правом верхнем углу -->
                                <div class="mt-2 me-2 fluid audio-container justify-content-end d-flex" style="width: 90%" id="database_cont">

                                    <audio id="audioPlayer" class="visually-hidden" controls>
                                        <source src="" type="audio/mpeg">
                                        Your browser does not support the audio element.
                                    </audio>

                                    <input type="text" class="w-25 form-control visually-hidden fs-7 ms-1 text-danger text-end border-0 bg-transparent fw-light me-2" id="track_name" style="height: 25px;" value="" readonly>

                                    <div class="d-flex">
                                        <button title="I like this s//hit !" class="visually-hidden me-1 btn btn-outline-dark border border-secondary bg-gradient d-flex justify-content-center text-white" ondblclick="i_like_that()" id="like_this_shit" style="height: 25px; width: 30px" type="button">
                                            <img width="25" height="18" style="margin-top: -3px;" src="https://img.icons8.com/ios-glyphs/30/FA5252/like--v1.png" alt="like--v1" alt="forward"/>
                                        </button>

                                        <button title="Play Syndycate <Base_Data> Radio" onclick="startPlaylist()" class="btn btn-outline-dark border border-secondary bg-gradient d-flex justify-content-center text-white" id="start_r" style="height: 25px; width: 30px" type="button">
                                            <img width="25" height="20" style="margin-top: -4px;" src="https://img.icons8.com/windows/32/FA5252/play--v1.png" alt="next"/>
                                        </button>

                                        <button title="Continue play" onclick="continue_play_radio()" class="btn btn-outline-dark border visually-hidden border-secondary bg-gradient d-flex justify-content-center text-white" id="continue_r" style="height: 25px; width: 30px" type="button">
                                            <img width="25" height="20" style="margin-top: -4px;" src="https://img.icons8.com/windows/32/FA5252/play--v1.png" alt="next"/>
                                        </button>

                                        <button title="Pause" class="btn btn-outline-dark border visually-hidden border-secondary bg-gradient d-flex justify-content-center text-white" onclick="pause_radio()" id="stop_r" style="height: 25px; width: 30px" type="button">
                                            <img width="25" height="20" style="margin-top: -4px;" src="https://img.icons8.com/material-sharp/24/FA5252/pause--v1.png"/>
                                        </button>

                                        <button title="Next track" class="disabled ms-1 btn btn-outline-dark border border-secondary bg-gradient d-flex justify-content-center text-white" onclick="nextTrack()" id="next_r" style="height: 25px; width: 30px" type="button">
                                            <img width="25" height="18" style="margin-top: -3px;" src="https://img.icons8.com/metro/26/FA5252/forward.png" alt="forward"/>
                                        </button>

                                    </div>

                                </div>
                            </div>
                        </div>
                 </nav>

                 <div class="d-flex " style="height: 90vh;" data-bs-theme="dark">

                    <div class="w-100 rounded-3 d-flex flex-column" id="main_back_desk" color_id="4_mainBackDesk_BG" style="background: linear-gradient(to right, #000000, #000000); border-color: #000000 !important; overflow-y: auto; border: 1px solid #454443;">
                            <div class="d-flex mt-2 container-fluid flex-wrap" style="height: 85vh;" id="user_info_window" data-size="small">

                                {% include "includes/!A_xlixk_cont_site.html" %}
                                {% include "includes/!A_xlixk_cont_mob.html" %}
                            </div>

                            <div class="d-flex mt-4 visually-hidden" id="user_work_friend">
                               {% include "includes/my_friends.html" %}
                                {% if "Adm" in access %}
                                    {% include "includes/Modal_friend_edit.html" %}
                                {% endif %}
                            </div>

                            <div class="d-flex mt-1 visually-hidden "  id="user_work_statistic">
                                <div class="d-flex flex-column w-100 justify-content-center "  id="statistic_cont">

                                </div>
                            </div>

                            <div class="d-flex mt-4 visually-hidden" id="user_work_cards">

                                    <div class="container-fluid">
                                        <div class="fluid justify-content-between" style="position: relative; top: -15px; left: 0; height: 5px; width: 10px;">
                                            <a title="Опции" class="nav-link dropdown-toggle custom-dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false"></a>
                                            <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
                                                <li><a class="disabled dropdown-item">Подгрузить из таблицы (скоро...)</a></li>
                                            </ul>
                                        </div>
                                        <div class="d-flex">
                                            <div class="fluid w-100">
                                                <input type="text" name="new_card"  class="form-control text-center bg-dark text-white" id="new_card_name" onchange="access_new_c_sv('save_new_card_button')" placeholder="Номер карты" >
                                                <div class="input-group mb-1 ">
                                                  <input type="text" name="new_card" class="form-control text-center bg-dark text-white" id="new_card_date" placeholder="Дата" >
                                                  <input type="text" name="new_card"  class="form-control text-center bg-dark text-white" id="new_card_cvv" placeholder="CVV" >
                                                </div>
                                            </div>

                                            <div class="input-group mb-1 ">
                                                <input type="text"  name="new_card" class="form-control text-center bg-dark text-white" id="new_card_info" placeholder="Дополнительная информация по карте" >
                                                <button title="Сохранить карту" id="save_new_card_button" class="disabled btn border btn-secondary  bg-gradient" onclick="add_new_card()" type="button">
                                                    <img width="24" height="24" src="https://img.icons8.com/material-outlined/24/microsoft-to-do-app.png" alt="microsoft-to-do-app"/>
                                                </button>

                                            </div>

                                        </div>



                                        <div class="fluid" style="min-height: 68vh; border-radius: 5px;">
                                            {% include "includes/my_cards_menu_NG.html" %}

                                        </div>
                                    </div>

                            </div>

                            <div class="d-flex mt-4 visually-hidden" id="user_work_proxy">

                                <div class="container-fluid">
                                        <div class="fluid justify-content-between" style="position: relative; top: -15px; left: 0; height: 5px; width: 10px;">
                                            <a title='Опции' class="nav-link dropdown-toggle custom-dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false"></a>
                                            <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
                                                <li><a class="disabled dropdown-item">Подгрузить из таблицы (скоро...)</a></li>
                                            </ul>
                                        </div>
                                        <div class="input-group ms-1 mb-1 ">
                                          <input type="text" name="new_card" id="name_prx" onchange="access_to_save_new_proxy()"  class="form-control text-center bg-dark text-white w-25" placeholder="http://login:password@site:port" >
                                          <input type="text"  name="new_card" id="info_prx" onchange="access_to_save_new_proxy()" class="form-control text-center bg-dark text-white" placeholder="Страна прокси / полезная информация" >
                                          <button title="Сохранить прокси" id="saveprx_new" class="btn disabled border btn-secondary  bg-gradient" onclick="save_new_proxy('new')" type="button"><img width="24" height="24" src="https://img.icons8.com/material-outlined/24/microsoft-to-do-app.png" alt="microsoft-to-do-app"/></button>

                                        </div>

                                         <div class="fluid mt-2" style="min-height: 73vh; border-radius: 5px;">
                                           <p class="fs-7 ms-1 mt-2 fw-light" id="main_prx_cont" style="height: 10px;">Вы еще не добавили ни одной прокси...</p>

                                        </div>
                                </div>

                            </div>

                            <div class="d-flex mt-4 visually-hidden" id="user_work_exchanges">

                                <div class="container-fluid">
                                        <div class="fluid justify-content-between" style="position: relative; top: -15px; left: 0; height: 5px; width: 10px;">
                                            <a title='Опции' class="nav-link dropdown-toggle custom-dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false"></a>
                                            <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
                                                <li><a class="disabled dropdown-item">Подгрузить из таблицы (скоро...)</a></li>
                                            </ul>
                                        </div>
                                        <div class="input-group mb-1 ">
                                          <input type="text" name="new_card" id="new_ex_info" onchange="access_to_save_new_exchange()" class="form-control text-center w-50" color_id="8.0_exchange_InputBG_color" placeholder="Описание расхода" >
                                          <input type="number" name="new_card" id="new_ex_sum" onchange="access_to_save_new_exchange()" class="form-control text-center w-25" color_id="8.0_exchange_InputBG_color" placeholder="Сумма" step="0.01" min="0">

                                            <select class="form-select text-white" color_id="8.0_exchange_InputBG_color" name="valute_choosed" id="valute_choosed">
                                                <option selected value="RUB">RUB</option>
                                                <option value="USD">USD</option>
                                                <option value="EUR">EUR</option>
                                            </select>
                                            <button title="Сохранить расход" id="save_new_exchange_button" class="btn disabled border" onclick="save_new_exchange()" color_id="8.1_exchange_ButtonsBG_color" type="button"><img width="24" height="24" src="https://img.icons8.com/material-outlined/24/microsoft-to-do-app.png" alt="microsoft-to-do-app"/></button>

                                        </div>



                                        <div class="fluid" id="main_exp_cont" style="min-height: 73vh; border-radius: 5px;">

                                        </div>
                                </div>

                            </div>

                            <div class="d-flex visually-hidden" id="user_work_notes">
                                <div class="d-flex w-100 flex-wrap container-fluid justify-content-center" style="gap: 30px;" id="main_notes_container">

                                </div>

                            </div>

                            <div class="d-flex mt-1 visually-hidden" style="" id="task_cont" >

                                <div class="container-fluid" id="main_task_container">
                                    {% include "includes/my_task_menu_NG.html" %}

                                </div>

                            </div>



                            <div class="d-flex mt-4 visually-hidden" id="message_cont">
                                <div class="container-fluid" id="main_message_container">
                                    мы работаем над этим
                                </div>

                            </div>

                            <div class="d-flex visually-hidden" style="width: 80vw;" id="sup_tables_cont">
                                <div class="fluid border-2 border-white"  style="margin-top: -5px; " id="main_sup_tables_container">
                                    {% include "includes/tables_NG.html" %}

                                </div>

                            </div>

                            <div class="d-flex mt-1 visually-hidden" id="number_buy_cont">
                                <div class="container-fluid" style="margin-top: -20px;" id="number_buy_container">
                                    {% include "includes/buy_number_menu_NG.html" %}

                                </div>

                            </div>

                            <div class="container d-flex mt-4 visually-hidden" id="only_text_cont">

                                <div class="container fluid w-100 me-2" style="margin-top: -20px;" id="express_text_container">
                                    <textarea id="express_dashboard" data-bs-theme="dark" class="bg-dark text-white border-secondary form-control mt-2 me-2 ms-2 mb-2"  style="height: 640px;">

                                    </textarea>

                                </div>

                            </div>

                            <div class="d-flex mt-4 visually-hidden" id="olejka_cont">
                                <div class="fluid w-100" style="margin-top: -20px;" id="main_olejka_container">
                                    {% include "includes/olejka_NG.html" %}

                                </div>

                            </div>

                    </div>
                 </div>


        </div>

    </div>







{% include "js/my_room.js" %}
{% include "js/coin_script.js" %}
{% include "includes/Modal_ARE_YOU_SURE.html" %}

{% endblock %}