{% extends "base.html" %} {% load i18n %} {% block content %} {% block link%}
<style>
  body::before {
    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
      url("../../../static/img/bg_image/bg2.jpg") no-repeat center center;
    background-size: cover;
    content: " ";
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    will-change: transform;
    z-index: -1;
    /* -webkit-transform: translateZ(0); */
  }
</style>
{% endblock %}
<section id="fullscreen_detail" class="fullscreen_detail">
  <div class="wrapper">
    {% include 'header.html'%}
    <div class="settings_menu">
         <a href="{% url 'update_user_profile' %}"><i class="fas fa-cogs"></i>Налаштування</a>
    </div>
    
    <!-- <header class="header">
      <div class="header__logo">
        <img src="/static/img/logo/logo_00x215.png" alt="Logo" />
      </div>
      <div class="header__menu">
        <ul class="header__menu_list">
          <li class="header_menu_item">
            <a href="{% url 'home' %}">Головна</a>
          </li>
          <li class="header_menu_item">
            <a href="#footer">Контакти</a>
          </li>
          {% if user.is_authenticated %}
          <li class="header_menu_item">
            <a href="#">
                <i class="fas fa-cogs"></i>
            </a>
            </li>
          <li class="header_menu_item account">
            <a href="{% url 'log_out' %}">Вихід </a>
          </li>

          {% else %}
          <li class="header_menu_item account">
            <i class="header_icons fas fa-user-tie"></i>
            <a href="#" class="popup-link open_login_form"> Вхід </a>
          </li>
          <li class="header_menu_item">
            <a href="#" class="popup-link open_registration_form">Реєстрація</a>
          </li>

          {% endif %}
        </ul>
      </div>
    </header>
    <div class="menu-btn">
        <span></span>
        <span></span>
        <span></span>
      </div> -->
  </div>
  <section class="user_caminet_main_content">
    <div class="wrapper">
        <div class="cabinet_sub_header">
            <p>Вітаю, {{user.first_name}}</p> 
        </div> 
            <p class="cabinet_cart_wrapper_title">Курси які Вас зацікавили:</p>
            {% for item in cart %}
            <div class="cabinet_cart">
                <div class="cabinet_cart_logo"><img
                    src="../../../media/{{item.cource_name.cource_icon_smal}}"
                    class="logo_icon"
                    alt="logo2"
                />
                </div>
                <div class="cabinet_cart_title">
                    <p>{{item.cource_name}}</p>
                </div>
                <div class="cabinet_cart_price">
                   <p>{{item.cource_name.price_online}} грн.</p>
                </div>
                <div class="cabinet_cart_btn">
                    {% if  item.is_pay %}
                        <div class="card_cource_btnn  " id_item='{{item.id}}'><a href="{% url 'teaching' slug=item.cource_name.slug %}" class="button teaching"> Пройти навчання </a> </div>
                        <div class="card_cource_btnn  " id_item='{{item.id}}'><a href="{% url 'show_diplom' slug=item.cource_name.slug %}" class="button diplom"> Замовити диплом</a> </div>
                       
                        {% else %}
                        <div class="card_cource_btnn  " > <a href="#" id_item='{{item.id}}' class="button del delate_btn" >Видалити</a> </div>
                        <div class="card_cource_btnn  " ><a href="#"  id_item='{{item.cource_name.id}}' class="button buy" >Оплатити</a> </div>
                        
                    {% endif %}
                    
                </div>
            </div>
        
            {% endfor %}

            <div class="recommendation" style="color: red; ">
                <div class="recommendation_title">
                    <p> Рекомендовані курси</p>
                </div>
                <div class="recommendation_wrapper"> 
                {% for cource in recommendation %}
        
                    <div class="elektrik_item">
                        <div class="front">
                        <div class="card_cource_logo">
                            <img src="../../../media/{{cource.cource_icon}}" class="logo_icon" alt="logo2" />
                        </div>
                        <div class="card_cource_title">
                            {{ cource.cource_name}}
                        </div>
                        <div class="card_cource_description"></div>
                        </div>
                        <div class="back">
                        <img class="icon_smal"
                        src="../../../media/{{cource.cource_icon_smal}}"
                        alt="logo2"
                        />
                        <p>
                            {{cource.cource_short_desc}}
                        </p>
                        <div class="card_cource_btn">
                            <a href="{% url 'cource_detail' slug=cource.slug%}">Читати далі</a>
                        </div>
                        </div>
                    </div>
                    {% endfor %}
                    </div>
            </div>

    </div>
    
  </section>
</section>

<!-- <div class="wrapper_cabinet">
    <div class="cabinet_header">
        <div class="cabinet_header_logo">
            <img src="/static/img/logo/logo_00x215.png" alt="Logo" />
        </div>
        <div class="header__menu">
            <ul class="header__menu_list">
                <li class="header_menu_item">
                    <a href="#">
                        <i class="fas fa-cogs"></i>
                    </a>
                </li>
                <li class="header_menu_item">
                    <a href="{% url 'home' %}">Головна</a>
                </li >
                
                <li class="header_menu_item">
                    <a href="{% url 'log_out' %}">Вихід </a>
                </li>
            </ul>
        </div>
    </div>
    <hr />
    <div class="cabinet_sub_header">
        <p>Вітаю, {{user.first_name}}</p> 
    </div> 


  <hr />

    

    <div class="cabinet_cart_wrapper">
        <p class="cabinet_cart_wrapper_title">Курси які Вас зацікавили:</p>
        {% for item in cart %}
        <div class="cabinet_cart">
            <div class="cabinet_cart_logo"><img
                src="../../media/{{item.cource_name.cource_icon}}"
                class="logo_icon"
                alt="logo2"
            />
            </div>
            <div class="cabinet_cart_title">
                <p>{{item.cource_name}}</p>
            </div>
            <div class="cabinet_cart_price">
               <p>{{item.cource_name.price_online}} грн.</p>
            </div>
            <div class="cabinet_cart_btn">
                <div class="card_cource_btnn video_link " id_item='{{item.id}}'> <button>Відео </button> </div>
                {% if  item.is_pay %}
                    <div class="card_cource_btnn teaching " id_item='{{item.id}}'> <button><a href="{% url 'teaching' slug=item.cource_name.slug %}"> Пройти навчання</a></button> </div>
                    {% else %}
                    <div class="card_cource_btnn buy " id_item='{{item.id}}'> <button>Замовити </button> </div>
                    <div class="card_cource_btnn delate_btn " id_item='{{item.id}}'> <button>Видалити </button> </div>
                {% endif %}
                
            </div>
        </div>
    
        {% endfor %}
    </div> 

    <div class="recommendation">
        <div class="recommendation_title">
            <p> Рекомендовані курси</p>
        </div>
        <div class="recommendation_wrapper"> 
        {% for cource in recommendation %}

            <div class="elektrik_item">
                <div class="front">
                <div class="card_cource_logo">
                    <img src="../../media/{{cource.cource_icon}}" class="logo_icon" alt="logo2" />
                </div>
                <div class="card_cource_title">
                    {{ cource.cource_name}}
                </div>
                <div class="card_cource_description"></div>
                </div>
                <div class="back">
                <img class="icon_smal"
                src="../../media/{{cource.cource_icon_smal}}"
                alt="logo2"
                />
                <p>
                    {{cource.cource_short_desc}}
                </p>
                <div class="card_cource_btn">
                    <a href="{% url 'cource_detail' slug=cource.slug%}">Читати далі</a>
                </div>
                </div>
            </div>
            {% endfor %}
            </div>
    </div>
    

    <div class="popular">
        <div class="popular_title">
            <p>Популярні курси</p>
        </div>
        <div class="popular_wrapper">
            {% for cource in recommendation %}

            <div class="elektrik_item">
            <div class="front">
                <div class="card_cource_logo">
                <img src="../../media/{{cource.cource_icon}}" class="logo_icon" alt="logo2" />
                </div>
                <div class="card_cource_title">
                {{ cource.cource_name}}
                </div>
                <div class="card_cource_description"></div>
            </div>
            <div class="back">
                <img class="icon_smal"
                src="../../media/{{cource.cource_icon_smal}}"
                alt="logo2"
            />
                <p>
                {{cource.cource_short_desc}}
                </p>
                <div class="card_cource_btn">
                <a href="{% url 'cource_detail' slug=cource.slug%}">Читати далі</a>
                </div>
            </div>
            </div>
            {% endfor %}

        </div>

    </div>

</div> -->
{% endblock %}