@extends('source.layouts.app')
@section('content')
    <div class="main-wrapper">		
        @include('source.common.header')
        @include('source.common.sidebar')
        <div class="page-wrapper" style="min-height: 311px;">
            <div class="content">
                <div class="row justify-content-center">
                    <div class="col-xl-12">
                        <div class="row settings-wrapper d-flex">
                            <div class="col-xl-3 col-lg-4">
                                <div class="card settings-card">
                                    <div class="card-header">
                                        <h6 class="mb-0">Settings</h6>
                                    </div>
                                    <div class="card-body">
                                        <div class="sidebars settings-sidebar">
                                            <div class="sidebar-inner">
                                                <div class="sidebar-menu p-0">
                                                    <ul>
                                                        <li class="submenu-open">
                                                            <ul>
                                                                <li class="submenu">
                                                                    <a href="javascript:void(0);" class="active subdrop">
                                                                        <i class="isax isax-setting-2 fs-18"></i>
                                                                        <span class="fs-14 fw-medium ms-2">General Settings</span>
                                                                        <span class="isax isax-arrow-down-1 arrow-menu ms-auto"></span>
                                                                    </a>
                                                                    <ul>
                                                                        <li><a href="/profile">Profile Settings</a></li>
                                                                        <li><a href="/profilepassword" class="active">Change Password</a></li>
                                                                    </ul>
                                                                </li>
                                                            </ul>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-xl-9 col-lg-8">
                                @if(session('success'))
                                    <div class="alert alert-success">{{ session('success') }}</div>
                                @endif
                                <div class="mb-3">
                                    <div class="pb-3 border-bottom mb-3">
                                        <h6 class="mb-0">Account Settings</h6>
                                    </div>
                                    <div class="d-flex align-items-center mb-3">
                                        <span class="bg-dark avatar avatar-sm me-2 flex-shrink-0"><i class="isax isax-info-circle fs-14"></i></span>
                                        <h6 class="fs-16 fw-semibold mb-0">Change Password</h6>
                                    </div>
                                    <form action="{{ route('profile.password.update') }}" method="POST" enctype="multipart/form-data">
                                        @csrf
                                        <div class="border-bottom mb-3 pb-2">
                                            <div class="row gx-3">
                                                <div class="col-lg-4 col-md-6">
                                                    <div class="mb-3">
                                                        <label class="form-label">Current Password</label>
                                                        <input type="password" name="current_password" class="form-control">
                                                        @error('current_password')
                                                            <small class="text-danger">{{ $message }}</small>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-4 col-md-6">
                                                    <div class="mb-3">
                                                        <label class="form-label">New Password</label>
                                                        <input type="password" name="password" class="form-control">
                                                        @error('password')
                                                            <small class="text-danger">{{ $message }}</small>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-4 col-md-6">
                                                    <div class="mb-3">
                                                        <label class="form-label">Confirm New Password</label>
                                                        <input type="password" name="password_confirmation" class="form-control">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="d-flex align-items-center justify-content-between">
                                            <button type="button" class="btn btn-outline-white">Cancel</button>
                                            <button type="submit" class="btn btn-primary">Save Changes</button>
                                        </div>                                        
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="footer d-sm-flex align-items-center justify-content-between bg-white py-2 px-4 border-top">
                <p class="text-dark mb-0">
                    &copy; {{ date('Y') }}
                    <a href="javascript:void(0);" class="link-primary">C3S Publishers</a>,
                    All Rights Reserved
                </p>
            </div>
        </div>
@endsection