@extends('layout.template')
@section('intitule')
    <h5 class="font-weight-medium text-uppercase mb-0">PROFIL PAGE </h5>
@endsection

@section('breadcrumb')
    <li class="breadcrumb-item active" aria-current="page">Profil page</li>
@endsection

@section('styles')

@endsection

@section('main')
<div class="bg-white p-5" style="height: 100%">
    <ul class="nav nav-tabs" role="tablist">
        <li class="nav-item">
            @if ($numero == 1)
                <a class="nav-link active" data-bs-toggle="tab" href="#home" role="tab" style="font-size: large">
                    <span>Activités</span>
                </a>
            @else
                <a class="nav-link" data-bs-toggle="tab" href="#home" role="tab" style="font-size: large">
                    <span>Activités</span>
                </a>
            @endif
        </li>
        <li class="nav-item">
            <a class="nav-link" data-bs-toggle="tab" href="#profile" role="tab"
                style="font-size: large; border-bottom:3px">
                <span>Profile</span>
            </a>
        </li>
        <li class="nav-item">
            @if ($numero == 0)
                <a class="nav-link active" data-bs-toggle="tab" href="#messages" role="tab"
                    style="font-size: large">
                    <span>Settings</span>
                </a>
            @else
                <a class="nav-link" data-bs-toggle="tab" href="#messages" role="tab" style="font-size: large">
                    <span>Settings</span>
                </a>
            @endif
        </li>
        <li class="nav-item">
            @if ($numero == 2)
                <a class="nav-link active" data-bs-toggle="tab" href="#password" role="tab"
                    style="font-size: large">
                    <span>Password</span>
                </a>
            @else
                <a class="nav-link" data-bs-toggle="tab" href="#password" role="tab" style="font-size: large">
                    <span>Password</span>
                </a>
            @endif
        </li>
    </ul>
    <!-- Tab panes -->
    <div class="tab-content">
        <div class="tab-pane @if ($numero == 1) show active @endif" id="home" role="tabpanel">
            <div class="p-5">
                <div class="row justify-content-center">
                    <div class="col-md-8">
                        <div class="card" style="border: solid #cfcfcf 0.07em; box-shadow: -2px 2px 7px #cfcfcf">
                            <div class="card-header bg-white d-flex align-items-center"
                                style="border-bottom: solid #cfcfcf 0.02em">
                                <h4 class="card-title text-dark">GestStudent</h4>
                                <div class="card-actions ms-auto d-flex button-group">
                                    <a class="mb-0 link d-flex align-items-center pe-0" style="color: #cfcfcf;"
                                        data-action="close">
                                        <i data-feather="x" class="feather-sm"></i>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="tab-pane  p-3 fs-5" id="profile" role="tabpanel">
            <div class="row">
                <div class="col-md-3 col-xs-6 border-end"> <strong style="font-weight: bold">Full Name</strong>
                    <br>
                    <p class="text-muted">{{ session('nom') }} {{ session('prenom') }}</p>
                </div>
                <div class="col-md-3 col-xs-6 border-end"> <strong style="font-weight: bold">Mobile</strong>
                    <br>
                    <p class="text-muted">{{ session('phone') }}</p>
                </div>
                <div class="col-md-3 col-xs-6 border-end"> <strong style="font-weight: bold">Email</strong>
                    <br>
                    <p class="text-muted">{{ session('email') }}</p>
                </div>
                <div class="col-md-3 col-xs-6 "> <strong style="font-weight: bold">Nationalité</strong>
                    <br>
                    <p class="text-muted">{{ session('nationalite') }}</p>
                </div>
            </div>
            <hr>
            
        </div>

        <div class="tab-pane @if ($numero == 2) show active @endif p-4" id="password" role="tabpanel">
            <div class="card">
                <div class="card-body">
                    <form class="form-material mt-4" method="POST" action={{ route('post_password') }}>
                        @csrf
                        @if (Illuminate\Support\Facades\Session::has('erreurChang'))
                            <script>
                                Swal.fire({
                                    title: 'ERREUR!',
                                    text: