{% extends "user_dashboard_base.html" %}
{% load static %}
{% load crispy_forms_tags %}
{% block title %}Profile Update{% endblock  %}
{% block Style %}
<style>
    :root {
        --footer-color: {{ FOOTER_COLOR }};
        --notification-color: {{ NOTIFICATION_COLOR }};
        --price-color: {{ PRICE_COLOR }};
        --button-color: {{ BUTTON_COLOR }};
    }
    .cusbtn2 {
        background: var(--button-color) !important;
    }
    .footer-area {
        background: var(--footer-color) !important;
    }
    
</style>
{% endblock %}
{% block content %}
{% if messages %}
    <div class="container mt-3">
        {% for message in messages %}
            <div class="alert alert-{{ message.tags }} alert-dismissible fade show" role="alert">
                {{ message }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        {% endfor %}
    </div>
{% endif %}

<div class="customerdashcontents">
    <div class="customer-header">
        <h2 class="fw-bold">Update Profile</h2>
    </div>
    <form action="" method="POST" enctype="multipart/form-data">
        {% csrf_token %}
        <div class="card p-4">
            <div class="row">
                <div class="col-md-6">
                    {{form.name|as_crispy_field}}
                </div>
                <div class="col-md-6">
                    {{form.email|as_crispy_field}}
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    {{form.phone|as_crispy_field}}
                </div>
                <div class="col-md-6">
                    {{form.gender|as_crispy_field}}
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    {{form.dob|as_crispy_field}}
                </div>
                <div class="col-md-6">
                    {{form.country|as_crispy_field}}
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    {{form.address|as_crispy_field}}
                </div>
                <div class="col-md-6">
                    {{form.image|as_crispy_field}}
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-md-12 text-center">
                    <button type="submit" class="btn cusbtn2">Update</button>
                </div>
            </div>
        </div>
    </form>


</div>


{% endblock  %}

{% block JS %}

{% endblock  %}