{% extends 'base.html' %}
{% block content %}

{%load static%}
{% get_media_prefix as MEDIA_URL %}
<div id="kt_header" class="header  ">
    <!--begin::Container-->
    <div class=" container-fluid  d-flex align-items-stretch justify-content-between">
        <!--begin::Header Menu Wrapper-->
        <div class="header-menu-wrapper header-menu-wrapper-left" id="kt_header_menu_wrapper">
            <!--begin::Header Menu-->
            <div id="kt_header_menu" class="header-menu header-menu-mobile  header-menu-layout-default ">
                <!--begin::Header Nav-->
                <ul class="menu-nav ">



                    <style>
                        /* تعریف متغیرهای CSS برای تنظیمات رنگ */
                        :root {
                            --light-bg: #f4f4f4;
                            --light-text: #333;
                            --light-card-bg: #fff;
                            --light-link: #2196f3;
                            --light-link-hover: #1976d2;

                            --dark-bg: #919191;
                            --dark-text: #e0e0e0;
                            --dark-card-bg: #494949;
                            --dark-header-bg: #333;
                            --dark-link: #ff9800;
                            --dark-link-hover: #ff5722;
                            --dark-border: #555;

                            --transition: 0.3s ease;
                            --card-shadow-light: 0 6px 15px rgba(0, 0, 0, 0.1);
                            --card-shadow-light-hover: 0 10px 20px rgba(0, 0, 0, 0.2);
                            --card-shadow-dark: 0 6px 15px rgba(0, 0, 0, 0.4);
                            --card-shadow-dark-hover: 0 10px 20px rgba(0, 0, 0, 0.6);
                        }

                        /* استایل عمومی برای هر دو حالت */
                        body {
                            margin: 0;
                            padding: 0;
                            background-color: var(--light-bg);
                            color: var(--light-text);
                            transition: background-color var(--transition), color var(--transition);
                        }

                        /* دارک مود */
                        body.dark-mode {
                            background-color: var(--dark-bg);
                            color: var(--dark-text);
                        }

                        /* حالت عادی */
                        #kt_header_mobile {
                            background-color: #ffffff;
                            /* رنگ پس‌زمینه سفید */
                            color: #000000;
                            /* رنگ متن مشکی */
                        }

                        /* حالت دارک مود */
                        body.dark-mode #kt_header_mobile {
                            background-color: #1a1a1a;
                            /* رنگ پس‌زمینه تیره */
                            color: #ffffff;
                            /* رنگ متن سفید */
                        }

                        body.dark-mode #kt_header_mobile a img {
                            filter: invert(1);
                            /* معکوس کردن رنگ لوگو در حالت دارک مود */
                        }


                        /* استایل هدر */
                        /* استایل هدر در حالت دارک مود */
                        body.dark-mode #kt_header {
                            background-color: #333;
                            /* پس‌زمینه تیره‌تر برای هدر */
                            color: #e0e0e0;
                            /* رنگ متن */
                            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
                            transition: background-color 0.3s ease, color 0.3s ease;
                        }

                        /* استایل هدر در حالت لایت مود */
                        body:not(.dark-mode) #kt_header {
                            background-color: #ffffff;
                            /* پس‌زمینه روشن */
                            color: #333;
                            /* رنگ متن */
                            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
                            transition: background-color 0.3s ease, color 0.3s ease;
                        }

                        /* استایل کارت‌ها */
                        .card {
                            background-color: var(--light-card-bg);
                            color: var(--light-text);
                            border-radius: 8px;
                            box-shadow: var(--card-shadow-light);
                            padding: 15px;
                            transition: box-shadow var(--transition), background-color var(--transition), color var(--transition);
                        }

                        .card:hover {
                            box-shadow: var(--card-shadow-light-hover);
                        }

                        body.dark-mode .card {
                            background-color: var(--dark-card-bg);
                            box-shadow: var(--card-shadow-dark);
                        }

                        body.dark-mode .card:hover {
                            box-shadow: var(--card-shadow-dark-hover);
                        }

                        /* لینک‌ها */
                        a {
                            color: var(--light-link);
                            transition: color var(--transition);
                        }

                        a:hover {
                            color: var(--light-link-hover);
                        }

                        body.dark-mode a {
                            color: var(--dark-link);
                        }

                        body.dark-mode a:hover {
                            color: var(--dark-link-hover);
                        }

                        /* دکمه‌ها */
                        .button {
                            background-color: transparent;
                            color: var(--light-link);
                            border: 2px solid var(--light-link);
                            padding: 10px 20px;
                            border-radius: 5px;
                            cursor: pointer;
                            font-size: 16px;
                            transition: background-color var(--transition), color var(--transition);
                        }

                        .button:hover {
                            background-color: var(--light-link);
                            color: #fff;
                        }

                        body.dark-mode .button {
                            color: var(--dark-link);
                            border-color: var(--dark-link);
                        }

                        body.dark-mode .button:hover {
                            background-color: var(--dark-link);
                            color: #fff;
                        }

                        /* ورودی‌ها */
                        input,
                        textarea {
                            background-color: var(--light-card-bg);
                            color: var(--light-text);
                            border: 1px solid #ccc;
                            padding: 10px;
                            border-radius: 5px;
                            transition: border-color var(--transition), background-color var(--transition);
                        }

                        input:focus,
                        textarea:focus {
                            border-color: var(--light-link);
                        }

                        body.dark-mode input,
                        body.dark-mode textarea {
                            background-color: var(--dark-header-bg);
                            color: var(--dark-text);
                            border: 1px solid var(--dark-border);
                        }

                        body.dark-mode input:focus,
                        body.dark-mode textarea:focus {
                            border-color: var(--dark-link);
                        }

                        /* دکمه تغییر دارک مود */
                        .dark-mode-toggle {
                            background-color: transparent;
                            border: none;
                            padding: 10px;
                            cursor: pointer;
                            font-size: 24px;
                            color: var(--light-link);
                            transition: color var(--transition);
                        }

                        body.dark-mode .dark-mode-toggle {
                            color: var(--dark-link);
                        }
                    </style>
                    <li class="menu-item  menu-item-submenu menu-item-rel menu-item-active" data-menu-toggle="click"
                        aria-haspopup="true"><a href="javascript:;" class="menu-link menu-toggle"><span
                                class="menu-text">داشبورد</span><i class="menu-arrow"></i></a>
                        <div class="menu-submenu menu-submenu-classic menu-submenu-left">
                            <ul class="menu-subnav">

                                {% if roles_status.خانواده%}
                                <!-- فقط منوی "اطلاعات فرزندان" نمایش داده شود -->
                                <li class="menu-item " aria-haspopup="true">
                                    <a href="/report/" class="menu-link ">
                                        <span class="svg-icon menu-icon">
                                            <svg xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24" />
                                                    <path
                                                        d="M6,2 L18,2 C19.6568542,2 21,3.34314575 21,5 L21,19 C21,20.6568542 19.6568542,22 18,22 L6,22 C4.34314575,22 3,20.6568542 3,19 L3,5 C3,3.34314575 4.34314575,2 6,2 Z M12,11 C13.1045695,11 14,10.1045695 14,9 C14,7.8954305 13.1045695,7 12,7 C10.8954305,7 10,7.8954305 10,9 C10,10.1045695 10.8954305,11 12,11 Z M7.00036205,16.4995035 C6.98863236,16.6619875 7.26484009,17 7.4041679,17 C11.463736,17 14.5228466,17 16.5815,17 C16.9988413,17 17.0053266,16.6221713 16.9988413,16.5 C16.8360465,13.4332455 14.6506758,12 11.9907452,12 C9.36772908,12 7.21569918,13.5165724 7.00036205,16.4995035 Z"
                                                        fill="#000000" />
                                                </g>
                                            </svg>
                                        </span>
                                        <span class="menu-text">اطلاعات کارنامه ها</span>
                                    </a>
                                </li>
                                <!-- فقط منوی "اطلاعات فرزندان" نمایش داده شود -->
                                <li class="menu-item " aria-haspopup="true">
                                    <a href="/children/" class="menu-link ">
                                        <span class="svg-icon menu-icon">
                                            <svg xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24" />
                                                    <path
                                                        d="M4,4 L11.6314229,2.5691082 C11.8750185,2.52343403 12.1249815,2.52343403 12.3685771,2.5691082 L20,4 L20,13.2830094 C20,16.2173861 18.4883464,18.9447835 16,20.5 L12.5299989,22.6687507 C12.2057287,22.8714196 11.7942713,22.8714196 11.4700011,22.6687507 L8,20.5 C5.51165358,18.9447835 4,16.2173861 4,13.2830094 L4,4 Z"
                                                        fill="#000000" opacity="0.3" />
                                                    <path
                                                        d="M14.5,11 C15.0522847,11 15.5,11.4477153 15.5,12 L15.5,15 C15.5,15.5522847 15.0522847,16 14.5,16 L9.5,16 C8.94771525,16 8.5,15.5522847 8.5,15 L8.5,12 C8.5,11.4477153 8.94771525,11 9.5,11 L9.5,10.5 C9.5,9.11928813 10.6192881,8 12,8 C13.3807119,8 14.5,9.11928813 14.5,10.5 L14.5,11 Z M12,9 C11.1715729,9 10.5,9.67157288 10.5,10.5 L10.5,11 L13.5,11 L13.5,10.5 C13.5,9.67157288 12.8284271,9 12,9 Z"
                                                        fill="#000000" />
                                                </g>
                                            </svg>
                                        </span>
                                        <span class="menu-text">اطلاعات‌شخصی‌فرزندان</span>
                                    </a>
                                </li>
                                <li class="menu-item  menu-item-submenu" data-menu-toggle="hover" aria-haspopup="true">
                                    <a href="#" class="menu-link menu-toggle"><span
                                            class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/ارتباطات/Mail-box.svg--><svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24"></rect>
                                                    <path
                                                        d="M22,15 L22,19 C22,20.1045695 21.1045695,21 20,21 L4,21 C2.8954305,21 2,20.1045695 2,19 L2,15 L6.27924078,15 L6.82339262,16.6324555 C7.09562072,17.4491398 7.8598984,18 8.72075922,18 L15.381966,18 C16.1395101,18 16.8320364,17.5719952 17.1708204,16.8944272 L18.118034,15 L22,15 Z"
                                                        fill="#000000"></path>
                                                    <path
                                                        d="M2.5625,13 L5.92654389,7.01947752 C6.2807805,6.38972356 6.94714834,6 7.66969497,6 L16.330305,6 C17.0528517,6 17.7192195,6.38972356 18.0734561,7.01947752 L21.4375,13 L18.118034,13 C17.3604899,13 16.6679636,13.4280048 16.3291796,14.1055728 L15.381966,16 L8.72075922,16 L8.17660738,14.3675445 C7.90437928,13.5508602 7.1401016,13 6.27924078,13 L2.5625,13 Z"
                                                        fill="#000000" opacity="0.3"></path>
                                                </g>
                                            </svg><!--end::Svg Icon--></span><span class="menu-text"> کارنامه
                                        </span><i class="menu-arrow"></i></a>
                                    <div class="menu-submenu menu-submenu-classic menu-submenu-right">
                                        <ul class="menu-subnav">
                                            <li class="menu-item " aria-haspopup="true"><a href="show-reportcard-my-child/"
                                                class="menu-link "><i
                                                    class="menu-bullet menu-bullet-line"><span></span></i><span
                                                    class="menu-text"> کارنامه های فرهنگی</span></a></li>
                                            <li class="menu-item " aria-haspopup="true"><a href="users_report/"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-line"><span></span></i><span
                                                        class="menu-text">کارنامه های نهایی</span></a></li>
                                            


                                        </ul>
                                    </div>
                                </li>
                                {% else %}
                                <li class="menu-item " aria-haspopup="true"><a href="meeting/notifications/"
                                        class="menu-link "><span
                                            class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/Clothes/Briefcase.svg--><svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24" />
                                                    <path
                                                        d="M14.486222,18 L12.7974954,21.0565532 C12.530414,21.5399639 11.9220198,21.7153335 11.4386091,21.4482521 C11.2977127,21.3704077 11.1776907,21.2597005 11.0887419,21.1255379 L9.01653358,18 L5,18 C3.34314575,18 2,16.6568542 2,15 L2,6 C2,4.34314575 3.34314575,3 5,3 L19,3 C20.6568542,3 22,4.34314575 22,6 L22,15 C22,16.6568542 20.6568542,18 19,18 L14.486222,18 Z"
                                                        fill="#000000" opacity="0.3" />
                                                    <path
                                                        d="M6,7 L15,7 C15.5522847,7 16,7.44771525 16,8 C16,8.55228475 15.5522847,9 15,9 L6,9 C5.44771525,9 5,8.55228475 5,8 C5,7.44771525 5.44771525,7 6,7 Z M6,11 L11,11 C11.5522847,11 12,11.4477153 12,12 C12,12.5522847 11.5522847,13 11,13 L6,13 C5.44771525,13 5,12.5522847 5,12 C5,11.4477153 5.44771525,11 6,11 Z"
                                                        fill="#000000" opacity="0.3" />
                                                </g>
                                            </svg>
                                            <!--end::Svg Icon--></span><span class="menu-text">پیغام ها</span></a>
                                </li>






                                <li class="menu-item  menu-item-submenu" data-menu-toggle="hover" aria-haspopup="true">
                                    <a href="javascript:;" class="menu-link menu-toggle"><span
                                            class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/کد/CMD.svg--><svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24"></rect>
                                                    <path
                                                        d="M9,15 L7.5,15 C6.67157288,15 6,15.6715729 6,16.5 C6,17.3284271 6.67157288,18 7.5,18 C8.32842712,18 9,17.3284271 9,16.5 L9,15 Z M9,15 L9,9 L15,9 L15,15 L9,15 Z M15,16.5 C15,17.3284271 15.6715729,18 16.5,18 C17.3284271,18 18,17.3284271 18,16.5 C18,15.6715729 17.3284271,15 16.5,15 L15,15 L15,16.5 Z M16.5,9 C17.3284271,9 18,8.32842712 18,7.5 C18,6.67157288 17.3284271,6 16.5,6 C15.6715729,6 15,6.67157288 15,7.5 L15,9 L16.5,9 Z M9,7.5 C9,6.67157288 8.32842712,6 7.5,6 C6.67157288,6 6,6.67157288 6,7.5 C6,8.32842712 6.67157288,9 7.5,9 L9,9 L9,7.5 Z M11,13 L13,13 L13,11 L11,11 L11,13 Z M13,11 L13,7.5 C13,5.56700338 14.5670034,4 16.5,4 C18.4329966,4 20,5.56700338 20,7.5 C20,9.43299662 18.4329966,11 16.5,11 L13,11 Z M16.5,13 C18.4329966,13 20,14.5670034 20,16.5 C20,18.4329966 18.4329966,20 16.5,20 C14.5670034,20 13,18.4329966 13,16.5 L13,13 L16.5,13 Z M11,16.5 C11,18.4329966 9.43299662,20 7.5,20 C5.56700338,20 4,18.4329966 4,16.5 C4,14.5670034 5.56700338,13 7.5,13 L11,13 L11,16.5 Z M7.5,11 C5.56700338,11 4,9.43299662 4,7.5 C4,5.56700338 5.56700338,4 7.5,4 C9.43299662,4 11,5.56700338 11,7.5 L11,11 L7.5,11 Z"
                                                        fill="#000000" fill-rule="nonzero"></path>
                                                </g>
                                            </svg><!--end::Svg Icon--></span><span class="menu-text">اطلاعات شخصی
                                        </span><i class="menu-arrow"></i></a>
                                    <div class="menu-submenu menu-submenu-classic menu-submenu-right">
                                        <ul class="menu-subnav">
                                            <li class="menu-item " aria-haspopup="true"><a href="information"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                        class="menu-text">فردی</span></a></li>
                                            <li class="menu-item " aria-haspopup="true"><a href="personaddress"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                        class="menu-text">آدرس</span></a></li>
                                            <li class="menu-item " aria-haspopup="true"><a href="other"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                        class="menu-text"> علمی و فرهنگی</span></a></li>

                                        </ul>
                                    </div>
                                </li>
                                <li class="menu-item  menu-item-submenu" data-menu-toggle="hover" aria-haspopup="true">
                                    <a href="#" class="menu-link menu-toggle"><span
                                            class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/ارتباطات/Mail-box.svg--><svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24"></rect>
                                                    <path
                                                        d="M22,15 L22,19 C22,20.1045695 21.1045695,21 20,21 L4,21 C2.8954305,21 2,20.1045695 2,19 L2,15 L6.27924078,15 L6.82339262,16.6324555 C7.09562072,17.4491398 7.8598984,18 8.72075922,18 L15.381966,18 C16.1395101,18 16.8320364,17.5719952 17.1708204,16.8944272 L18.118034,15 L22,15 Z"
                                                        fill="#000000"></path>
                                                    <path
                                                        d="M2.5625,13 L5.92654389,7.01947752 C6.2807805,6.38972356 6.94714834,6 7.66969497,6 L16.330305,6 C17.0528517,6 17.7192195,6.38972356 18.0734561,7.01947752 L21.4375,13 L18.118034,13 C17.3604899,13 16.6679636,13.4280048 16.3291796,14.1055728 L15.381966,16 L8.72075922,16 L8.17660738,14.3675445 C7.90437928,13.5508602 7.1401016,13 6.27924078,13 L2.5625,13 Z"
                                                        fill="#000000" opacity="0.3"></path>
                                                </g>
                                            </svg><!--end::Svg Icon--></span><span class="menu-text"> کارنامه
                                        </span><i class="menu-arrow"></i></a>
                                    <div class="menu-submenu menu-submenu-classic menu-submenu-right">
                                        <ul class="menu-subnav">
                                            {% if roles_status.اعضای_شورا%}

                                            <li class="menu-item " aria-haspopup="true"><a href="meeting/reportcard_unit/categories/history"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-line"><span></span></i><span
                                                        class="menu-text">کارنامه واحد من</span></a></li>
                                            {% endif %}
                                            <li class="menu-item " aria-haspopup="true"><a href="report"
                                                class="menu-link "><i
                                                    class="menu-bullet menu-bullet-line"><span></span></i><span
                                                    class="menu-text"> کارنامه های فرهنگی</span></a></li>
                                            <li class="menu-item " aria-haspopup="true"><a href="users_report/"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-line"><span></span></i><span
                                                        class="menu-text">کارنامه های نهایی</span></a></li>
                                            


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




                                {% if roles_status.سرگروه %}

                                <li class="menu-item " aria-haspopup="true"><a href="/my-ring/" class="menu-link "><span
                                            class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/کد/Compiling.svg--><svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24"></rect>
                                                    <path
                                                        d="M2.56066017,10.6819805 L4.68198052,8.56066017 C5.26776695,7.97487373 6.21751442,7.97487373 6.80330086,8.56066017 L8.9246212,10.6819805 C9.51040764,11.267767 9.51040764,12.2175144 8.9246212,12.8033009 L6.80330086,14.9246212 C6.21751442,15.5104076 5.26776695,15.5104076 4.68198052,14.9246212 L2.56066017,12.8033009 C1.97487373,12.2175144 1.97487373,11.267767 2.56066017,10.6819805 Z M14.5606602,10.6819805 L16.6819805,8.56066017 C17.267767,7.97487373 18.2175144,7.97487373 18.8033009,8.56066017 L20.9246212,10.6819805 C21.5104076,11.267767 21.5104076,12.2175144 20.9246212,12.8033009 L18.8033009,14.9246212 C18.2175144,15.5104076 17.267767,15.5104076 16.6819805,14.9246212 L14.5606602,12.8033009 C13.9748737,12.2175144 13.9748737,11.267767 14.5606602,10.6819805 Z"
                                                        fill="#000000" opacity="0.3"></path>
                                                    <path
                                                        d="M8.56066017,16.6819805 L10.6819805,14.5606602 C11.267767,13.9748737 12.2175144,13.9748737 12.8033009,14.5606602 L14.9246212,16.6819805 C15.5104076,17.267767 15.5104076,18.2175144 14.9246212,18.8033009 L12.8033009,20.9246212 C12.2175144,21.5104076 11.267767,21.5104076 10.6819805,20.9246212 L8.56066017,18.8033009 C7.97487373,18.2175144 7.97487373,17.267767 8.56066017,16.6819805 Z M8.56066017,4.68198052 L10.6819805,2.56066017 C11.267767,1.97487373 12.2175144,1.97487373 12.8033009,2.56066017 L14.9246212,4.68198052 C15.5104076,5.26776695 15.5104076,6.21751442 14.9246212,6.80330086 L12.8033009,8.9246212 C12.2175144,9.51040764 11.267767,9.51040764 10.6819805,8.9246212 L8.56066017,6.80330086 C7.97487373,6.21751442 7.97487373,5.26776695 8.56066017,4.68198052 Z"
                                                        fill="#000000"></path>
                                                </g>
                                            </svg><!--end::Svg Icon--></span><span class="menu-text">حلقه‌ی‌من
                                        </span><span class="menu-label"><span></span></span></a></li>
                                {% endif %}


                                {% if roles_status.اعضای_شورا%}

                                <li class="menu-item " aria-haspopup="true"><a href="meeting/same-raste-users/"
                                        class="menu-link "><span
                                            class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/کد/Compiling.svg--><svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24" />
                                                    <path
                                                        d="M12.2674799,18.2323597 L12.0084872,5.45852451 C12.0004303,5.06114792 12.1504154,4.6768183 12.4255037,4.38993949 L15.0030167,1.70195304 L17.5910752,4.40093695 C17.8599071,4.6812911 18.0095067,5.05499603 18.0083938,5.44341307 L17.9718262,18.2062508 C17.9694575,19.0329966 17.2985816,19.701953 16.4718324,19.701953 L13.7671717,19.701953 C12.9505952,19.701953 12.2840328,19.0487684 12.2674799,18.2323597 Z"
                                                        fill="#000000" fill-rule="nonzero"
                                                        transform="translate(14.701953, 10.701953) rotate(-135.000000) translate(-14.701953, -10.701953) " />
                                                    <path
                                                        d="M12.9,2 C13.4522847,2 13.9,2.44771525 13.9,3 C13.9,3.55228475 13.4522847,4 12.9,4 L6,4 C4.8954305,4 4,4.8954305 4,6 L4,18 C4,19.1045695 4.8954305,20 6,20 L18,20 C19.1045695,20 20,19.1045695 20,18 L20,13 C20,12.4477153 20.4477153,12 21,12 C21.5522847,12 22,12.4477153 22,13 L22,18 C22,20.209139 20.209139,22 18,22 L6,22 C3.790861,22 2,20.209139 2,18 L2,6 C2,3.790861 3.790861,2 6,2 L12.9,2 Z"
                                                        fill="#000000" fill-rule="nonzero" opacity="0.3" />
                                                </g>
                                            </svg>
                                            <!--end::Svg Icon--></span><span
                                            class="menu-text">اعضای‌رسته‌ی‌من</span></a>
                                    </span><span class="menu-label"><span></span></span></a></li>
                                {% endif %}



                                <li class="menu-item " aria-haspopup="true"><a href="meeting/my-duties/"
                                        class="menu-link "><span
                                            class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/Clothes/Briefcase.svg--><svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24"></rect>
                                                    <path
                                                        d="M5.84026576,8 L18.1597342,8 C19.1999115,8 20.0664437,8.79732479 20.1528258,9.83390904 L20.8194924,17.833909 C20.9112219,18.9346631 20.0932459,19.901362 18.9924919,19.9930915 C18.9372479,19.9976952 18.8818364,20 18.8264009,20 L5.1735991,20 C4.0690296,20 3.1735991,19.1045695 3.1735991,18 C3.1735991,17.9445645 3.17590391,17.889153 3.18050758,17.833909 L3.84717425,9.83390904 C3.93355627,8.79732479 4.80008849,8 5.84026576,8 Z M10.5,10 C10.2238576,10 10,10.2238576 10,10.5 L10,11.5 C10,11.7761424 10.2238576,12 10.5,12 L13.5,12 C13.7761424,12 14,11.7761424 14,11.5 L14,10.5 C14,10.2238576 13.7761424,10 13.5,10 L10.5,10 Z"
                                                        fill="#000000"></path>
                                                    <path
                                                        d="M10,8 L8,8 L8,7 C8,5.34314575 9.34314575,4 11,4 L13,4 C14.6568542,4 16,5.34314575 16,7 L16,8 L14,8 L14,7 C14,6.44771525 13.5522847,6 13,6 L11,6 C10.4477153,6 10,6.44771525 10,7 L10,8 Z"
                                                        fill="#000000" fill-rule="nonzero" opacity="0.3">
                                                    </path>
                                                </g>
                                            </svg><!--end::Svg Icon--></span><span class="menu-text">لیست‌وظایف‌واحد‌من
                                        </span></a></li>

                                {% if roles_status.اعضای_شورا%}

                                <li class="menu-item " aria-haspopup="true"><a href="meeting/evaluations/"
                                        class="menu-link "><span
                                            class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/Clothes/Crown.svg--><svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <polygon points="0 0 24 0 24 24 0 24"></polygon>
                                                    <path
                                                        d="M11.2600599,5.81393408 L2,16 L22,16 L12.7399401,5.81393408 C12.3684331,5.40527646 11.7359848,5.37515988 11.3273272,5.7466668 C11.3038503,5.7680094 11.2814025,5.79045722 11.2600599,5.81393408 Z"
                                                        fill="#000000" opacity="0.3"></path>
                                                    <path
                                                        d="M12.0056789,15.7116802 L20.2805786,6.85290308 C20.6575758,6.44930487 21.2903735,6.42774054 21.6939717,6.8047378 C21.8964274,6.9938498 22.0113578,7.25847607 22.0113578,7.535517 L22.0113578,20 L16.0113578,20 L2,20 L2,7.535517 C2,7.25847607 2.11493033,6.9938498 2.31738608,6.8047378 C2.72098429,6.42774054 3.35378194,6.44930487 3.7307792,6.85290308 L12.0056789,15.7116802 Z"
                                                        fill="#000000"></path>
                                                </g>
                                            </svg><!--end::Svg Icon--></span><span class="menu-text">مشاهده
                                            نظرات
                                            فرمانده
                                        </span></a></li>

                                {% endif %}




                                <li class="menu-item " aria-haspopup="true"><a href="reset-password/" ><li
                                        class="menu-item " aria-haspopup="true"><a href="password-change/"
                                            class="menu-link "><span
                                                class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/ارتباطات/هرزنامه ها.svg--><svg
                                                    xmlns="http://www.w3.org/2000/svg"
                                                    xmlns:xlink="http://www.w3.org/1999/xlink" width="24px"
                                                    height="24px" viewBox="0 0 24 24" version="1.1">
                                                    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                        <rect x="0" y="0" width="24" height="24"></rect>
                                                        <path
                                                            d="M4.5,3 L19.5,3 C20.3284271,3 21,3.67157288 21,4.5 L21,19.5 C21,20.3284271 20.3284271,21 19.5,21 L4.5,21 C3.67157288,21 3,20.3284271 3,19.5 L3,4.5 C3,3.67157288 3.67157288,3 4.5,3 Z M8,5 C7.44771525,5 7,5.44771525 7,6 C7,6.55228475 7.44771525,7 8,7 L16,7 C16.5522847,7 17,6.55228475 17,6 C17,5.44771525 16.5522847,5 16,5 L8,5 Z M10.5857864,14 L9.17157288,15.4142136 C8.78104858,15.8047379 8.78104858,16.4379028 9.17157288,16.8284271 C9.56209717,17.2189514 10.1952621,17.2189514 10.5857864,16.8284271 L12,15.4142136 L13.4142136,16.8284271 C13.8047379,17.2189514 14.4379028,17.2189514 14.8284271,16.8284271 C15.2189514,16.4379028 15.2189514,15.8047379 14.8284271,15.4142136 L13.4142136,14 L14.8284271,12.5857864 C15.2189514,12.1952621 15.2189514,11.5620972 14.8284271,11.1715729 C14.4379028,10.7810486 13.8047379,10.7810486 13.4142136,11.1715729 L12,12.5857864 L10.5857864,11.1715729 C10.1952621,10.7810486 9.56209717,10.7810486 9.17157288,11.1715729 C8.78104858,11.5620972 8.78104858,12.1952621 9.17157288,12.5857864 L10.5857864,14 Z"
                                                            fill="#000000"></path>
                                                    </g>
                                                </svg><!--end::Svg Icon--></span><span class="menu-text"> تغییر رمز‌عبور
                                            </span></a></li>

                            </ul>


                        </div>
                    </li>
                    {% if roles_status.ادمین_اصلی or roles_status.فرماندهی  or roles_status.جانشین or roles_status.نیرو_انسانی or roles_status.امام_جماعت or roles_status.تعلیم_و_تربیت or roles_status.علمی_و_آموزشی or roles_status.حفاظت %}
                    <li class="menu-item  menu-item-submenu" data-menu-toggle="click" aria-haspopup="true"><a
                            href="javascript:;" class="menu-link menu-toggle"><span class="menu-text">مدیریت</span><i
                                class="menu-arrow"></i></a>

                        <div class="menu-submenu  menu-submenu-fixed menu-submenu-left" style="width:1000px">

                            <div class="menu-subnav">

                                <ul class="menu-content">
                                    {% if roles_status.ادمین_اصلی or roles_status.فرماندهی  or roles_status.جانشین %}
                                    <li class="menu-item ">
                                        <h3 class="menu-heading menu-toggle"><i
                                                class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                class="menu-text">شورا</span><i class="menu-arrow"></i></h3>
                                        <ul class="menu-inner">

                                            <li class="menu-item " aria-haspopup="true"><a href="meeting/history/"
                                                    class="menu-link "><span
                                                        class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/Clothes/Crown.svg--><svg
                                                            xmlns="http://www.w3.org/2000/svg"
                                                            xmlns:xlink="http://www.w3.org/1999/xlink" width="24px"
                                                            height="24px" viewBox="0 0 24 24" version="1.1">
                                                            <g stroke="none" stroke-width="1" fill="none"
                                                                fill-rule="evenodd">
                                                                <rect x="0" y="0" width="24" height="24" />
                                                                <path
                                                                    d="M6,7 C7.1045695,7 8,6.1045695 8,5 C8,3.8954305 7.1045695,3 6,3 C4.8954305,3 4,3.8954305 4,5 C4,6.1045695 4.8954305,7 6,7 Z M6,9 C3.790861,9 2,7.209139 2,5 C2,2.790861 3.790861,1 6,1 C8.209139,1 10,2.790861 10,5 C10,7.209139 8.209139,9 6,9 Z"
                                                                    fill="#000000" fill-rule="nonzero" />
                                                                <path
                                                                    d="M7,11.4648712 L7,17 C7,18.1045695 7.8954305,19 9,19 L15,19 L15,21 L9,21 C6.790861,21 5,19.209139 5,17 L5,8 L5,7 L7,7 L7,8 C7,9.1045695 7.8954305,10 9,10 L15,10 L15,12 L9,12 C8.27142571,12 7.58834673,11.8052114 7,11.4648712 Z"
                                                                    fill="#000000" fill-rule="nonzero" opacity="0.3" />
                                                                <path
                                                                    d="M18,22 C19.1045695,22 20,21.1045695 20,20 C20,18.8954305 19.1045695,18 18,18 C16.8954305,18 16,18.8954305 16,20 C16,21.1045695 16.8954305,22 18,22 Z M18,24 C15.790861,24 14,22.209139 14,20 C14,17.790861 15.790861,16 18,16 C20.209139,16 22,17.790861 22,20 C22,22.209139 20.209139,24 18,24 Z"
                                                                    fill="#000000" fill-rule="nonzero" />
                                                                <path
                                                                    d="M18,13 C19.1045695,13 20,12.1045695 20,11 C20,9.8954305 19.1045695,9 18,9 C16.8954305,9 16,9.8954305 16,11 C16,12.1045695 16.8954305,13 18,13 Z M18,15 C15.790861,15 14,13.209139 14,11 C14,8.790861 15.790861,7 18,7 C20.209139,7 22,8.790861 22,11 C22,13.209139 20.209139,15 18,15 Z"
                                                                    fill="#000000" fill-rule="nonzero" />
                                                            </g>
                                                        </svg><!--end::Svg Icon--></span><span class="menu-text">مشاهده
                                                        تاریخچه پیام‌ها و کارها
                                                    </span></a></li>
                                            <li class="menu-item " aria-haspopup="true"><a href="meeting/reportcard_unit/categories/"
                                                    class="menu-link "><span
                                                        class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/کد/Lock-overturning.svg--><svg
                                                            xmlns="http://www.w3.org/2000/svg"
                                                            xmlns:xlink="http://www.w3.org/1999/xlink" width="24px"
                                                            height="24px" viewBox="0 0 24 24" version="1.1">
                                                            <g stroke="none" stroke-width="1" fill="none"
                                                                fill-rule="evenodd">
                                                                <rect x="0" y="0" width="24" height="24"></rect>
                                                                <path
                                                                    d="M11.6734943,8.3307728 L14.9993074,6.09979492 L14.1213255,5.22181303 C13.7308012,4.83128874 13.7308012,4.19812376 14.1213255,3.80759947 L15.535539,2.39338591 C15.9260633,2.00286161 16.5592283,2.00286161 16.9497526,2.39338591 L22.6066068,8.05024016 C22.9971311,8.44076445 22.9971311,9.07392943 22.6066068,9.46445372 L21.1923933,10.8786673 C20.801869,11.2691916 20.168704,11.2691916 19.7781797,10.8786673 L18.9002333,10.0007208 L16.6692373,13.3265608 C16.9264145,14.2523264 16.9984943,15.2320236 16.8664372,16.2092466 L16.4344698,19.4058049 C16.360509,19.9531149 15.8568695,20.3368403 15.3095595,20.2628795 C15.0925691,20.2335564 14.8912006,20.1338238 14.7363706,19.9789938 L5.02099894,10.2636221 C4.63047465,9.87309784 4.63047465,9.23993286 5.02099894,8.84940857 C5.17582897,8.69457854 5.37719743,8.59484594 5.59418783,8.56552292 L8.79074617,8.13355557 C9.76799113,8.00149544 10.7477104,8.0735815 11.6734943,8.3307728 Z"
                                                                    fill="#000000"></path>
                                                                <polygon fill="#000000" opacity="0.3"
                                                                    transform="translate(7.050253, 17.949747) rotate(-315.000000) translate(-7.050253, -17.949747) "
                                                                    points="5.55025253 13.9497475 5.55025253 19.6640332 7.05025253 21.9497475 8.55025253 19.6640332 8.55025253 13.9497475">
                                                                </polygon>
                                                            </g>
                                                        </svg><!--end::Svg Icon--></span><span class="menu-text">کارنامه
                                                        واحدها</span></a></li>

                                                        <li class="menu-item " aria-haspopup="true"><a href="meeting/futurework/"
                                                            class="menu-link "><span
                                                                class="svg-icon menu-icon"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                                                                    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                                        <rect x="0" y="0" width="24" height="24"/>
                                                                        <rect fill="#000000" opacity="0.3" x="13" y="4" width="3" height="16" rx="1.5"/>
                                                                        <rect fill="#000000" x="8" y="9" width="3" height="11" rx="1.5"/>
                                                                        <rect fill="#000000" x="18" y="11" width="3" height="9" rx="1.5"/>
                                                                        <rect fill="#000000" x="3" y="13" width="3" height="7" rx="1.5"/>
                                                                    </g>
                                                                </svg><!--begin::Svg Icon | path:assets/media/svg/icons/کد/Lock-overturning.svg--><!--end::Svg Icon--></span><span class="menu-text">
                                                                 لیست کار های آینده</span></a></li>
        


                                        </ul>
                                    </li>
                                    {% endif %}

                                    <li class="menu-item ">
                                        <h3 class="menu-heading menu-toggle"><i
                                                class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                class="menu-text">مدیریت</span><i class="menu-arrow"></i></h3>
                                        <ul class="menu-inner">

                                            {% if roles_status.ادمین_اصلی or roles_status.فرماندهی  or roles_status.جانشین or roles_status.نیرو_انسانی  %}

                                            <li class="menu-item " aria-haspopup="true"><a href="users"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-line"><span></span></i><span
                                                        class="menu-text">لیست اعضای کانون </span></a></li>
                                                        {% endif %}

                                                        {% if roles_status.ادمین_اصلی or roles_status.فرماندهی  or roles_status.جانشین or roles_status.نیرو_انسانی  %}
                                            <li class="menu-item " aria-haspopup="true"><a
                                                    href="meeting/council_members" class="menu-link " ><i
                                                        class="menu-bullet menu-bullet-line"><span></span></i><span
                                                        class="menu-text">لیست اعضا شورا</span></a></li>


                                            <li class="menu-item " aria-haspopup="true"><a href="meeting/council_list"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-line"><span></span></i><span
                                                        class="menu-text">لیست جلسات شورا</span></a></li>
                                            <li class="menu-item " aria-haspopup="true"><a href="family"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-line"><span></span></i><span
                                                        class="menu-text">لیست خانواده ها</span></a></li>
                                           
                                      {% endif %} 
                                      {% if roles_status.ادمین_اصلی or roles_status.فرماندهی  or roles_status.جانشین %}
                                     <li class="menu-item " aria-haspopup="true"><a href="rate/"
                                        class="menu-link "><i
                                            class="menu-bullet menu-bullet-dot"><span></span></i><span
                                            class="menu-text">ارزیابی اعضا</span></a></li>
                                            {% elif  roles_status.امام_جماعت or roles_status.ورزشی_و_اردویی or roles_status.تعلیم_و_تربیت or roles_status.علمی_و_آموزشی %}
                                            <li class="menu-item " aria-haspopup="true"><a href="rate-users/"
                                                class="menu-link "><i
                                                    class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                    class="menu-text">ارزیابی اعضا</span></a></li>
                                            {% endif %}
                                    </ul>
                                    </li>

                                    
                                    {% if roles_status.ادمین_اصلی or roles_status.فرماندهی  or roles_status.جانشین %}

                                    <li class="menu-item ">
                                        <h3 class="menu-heading menu-toggle"><i
                                                class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                class="menu-text">مدیریت‌وارزیابی </span><i class="menu-arrow"></i>
                                        </h3>
                                        <ul class="menu-inner">
                                            <li class="menu-item " aria-haspopup="true"><a
                                                    href="meeting/duties/categories/" class="menu-link "><i
                                                        class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                        class="menu-text">لیست رسته ها</span></a></li>
                                            <li class="menu-item " aria-haspopup="true"><a href="rings-with-members/"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                        class="menu-text">لیست حلقه ها</span></a></li>
                                                        <li class="menu-item " aria-haspopup="true"><a href="index/list/"
                                                            class="menu-link "><i
                                                                class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                                class="menu-text">شاخصه ها</span></a></li>
                                                                
                                                               
                                        
                                        </ul>
                                    </li>
                                    {% endif %}

                                </ul>
                            </div>
                        </div>
                    </li>
                    {% endif %}

                    <li class="menu-item  menu-item-submenu menu-item-rel" data-menu-toggle="click"
                        aria-haspopup="true"><a href="javascript:;" class="menu-link menu-toggle"><span
                                class="menu-text">بسیج انصار </span><i class="menu-arrow"></i></a>
                        <div class="menu-submenu menu-submenu-classic menu-submenu-left">
                            <ul class="menu-subnav">

                                <li class="menu-item  menu-item-submenu" data-menu-toggle="hover" aria-haspopup="true">
                                    <a href="javascript:;" class="menu-link menu-toggle"><span
                                            class="svg-icon menu-icon"><!--begin::Svg Icon | path:assets/media/svg/icons/ارتباطات/send.svg--><svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px"
                                                viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24"></rect>
                                                    <path
                                                        d="M3,13.5 L19,12 L3,10.5 L3,3.7732928 C3,3.70255344 3.01501031,3.63261921 3.04403925,3.56811047 C3.15735832,3.3162903 3.45336217,3.20401298 3.70518234,3.31733205 L21.9867539,11.5440392 C22.098181,11.5941815 22.1873901,11.6833905 22.2375323,11.7948177 C22.3508514,12.0466378 22.2385741,12.3426417 21.9867539,12.4559608 L3.70518234,20.6826679 C3.64067359,20.7116969 3.57073936,20.7267072 3.5,20.7267072 C3.22385763,20.7267072 3,20.5028496 3,20.2267072 L3,13.5 Z"
                                                        fill="#000000"></path>
                                                </g>
                                            </svg><!--end::Svg Icon--></span><span class="menu-text">
                                            مقالات</span><i class="menu-arrow"></i></a>
                                    <div class="menu-submenu menu-submenu-classic menu-submenu-right">
                                        <ul class="menu-subnav">
                                            <li class="menu-item " aria-haspopup="true"><a href="blog/posts"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                        class="menu-text">مشاهده</span></a></li>

                                                        {% if roles_status.ادمین_اصلی or roles_status.فرماندهی  or roles_status.جانشین %}

                                            <li class="menu-item " aria-haspopup="true"><a href="/blog/post/create/"
                                                    class="menu-link "><i
                                                        class="menu-bullet menu-bullet-dot"><span></span></i><span
                                                        class="menu-text">نوشتن</span></a></li>
                                                        {% endif %}

                                        </ul>
                                    </div>
                                </li>
                             
                                            {% endif %}

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

                </ul>
                <!--end::Header Nav-->
            </div>
            <!--end::Header Menu-->
        </div>
        <!--end::Header Menu Wrapper-->
        <!--begin::Topbar-->
        <div class="topbar">
            <button id="dark-mode-toggle" class="dark-mode-toggle">
                <i id="icon" class="fas fa-sun"></i> <!-- آیکون خورشید -->
            </button>
            <!--begin::جستجو-->
            
         
            <!--begin::زبان ها-->
            <div class="dropdown">
                <!--begin::Toggle-->
                <div class="topbar-item" data-toggle="dropdown" data-offset="10px,0px">
                    <div class="btn btn-icon btn-clean btn-dropdown btn-lg mr-1">
                        <img id="user-avatar" src="{% static 'media/users/default_profile.png' %}" alt="تصویر پیش‌فرض" width="45" height="45" class="rounded-circle"/>
                    </div>
                </div>
            </div>
            
            <!--end::زبان ها-->

            <!--begin::User-->
            <div class="topbar-item">
                <div class="btn btn-icon btn-icon-mobile w-auto btn-clean d-flex align-items-center btn-lg px-2"
                    id="kt_quick_user_toggle">
                    <span class="text-muted font-weight-bold font-size-base d-none d-md-inline mr-1">سلام
                        خوش‌آمدید</span>
                    <span class="text-dark-50 font-weight-bolder font-size-base d-none d-md-inline mr-3"></span>
                    <span class="symbol symbol-lg-35 symbol-25 symbol-light-success">
                        <a href="{% url 'logout' %}"><span
                                class="symbol-label font-size-h5 font-weight-bold">خروج</span></a>
                    </span>
                </div>
            </div>
            <!--end::User-->
        </div>
        <!--end::Topbar-->
    </div>
    <!--end::Container-->
</div>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        fetch("{% url 'get_user_avatar' %}")
            .then(response => response.json())
            .then(data => {
                let avatar = document.getElementById('user-avatar');
                if (data.avatar_url) {
                    avatar.src = data.avatar_url;
                } else {
                    avatar.src = "{% static 'media/users/default_profile.png' %}";
                }
            })
            .catch(error => {
                console.error("خطا در دریافت آواتار:", error);
                document.getElementById('user-avatar').src = "{% static 'media/users/default_profile.png' %}";
            });
    });
</script>

{% endblock %}