@extends('admin.layouts.master')
@section('listColor','light')
@section('pendColor','light')
@section('dashColor','light')
@section('content')
    <style>
        .main_container {
            margin-top: 70px !important;
            padding: 40px 10px;
            background-color: #fff;
            box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
            border-radius: 8px;
        }

        .input_fields {
            display: block;
            width: 100%;
            height: calc(1.5em + 0.75rem + 2px);
            padding: 0.375rem 0.75rem;
            font-size: 1rem;
            font-weight: 400;
            line-height: 1.5;
            color: #495057;
            background-color: #fff;
            background-clip: padding-box;
            border: 1px solid #ced4da;
            border-radius: 0.25rem;
            -webkit-transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
            transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
            transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
            transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
        }

        .input_fields:focus {
            background-color: #fefeff;
            border-color: #95a0f4;
            outline: none;
        }

        @media (max-width: 567px) {
            .update_btn {
                width: 100% !important;
            }
        }

        .update_btn {
            border: 1px solid black !important;
            color: black !important;
            background-color: #fff !important;
        }

        .update_btn:hover {
            border: 1px solid #fff !important;
            color: #fff !important;
            background-color: black !important;
        }
    </style>
    <div class="main-content">
        <section class="section">
            <div class="main_container">
                <div class="container">
                    <h2 class="mb-3">
                        Change Password
                    </h2>
                    @if (Session::has('message'))
                        <div id="btnclose"
                            class="alert alert-{{ Session::get('messageType') }} alert-dismissible fade show succes_show"
                            role="alert">
                            <strong>{{ Session::get('message') }} </strong>
                            <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span
                                    class="close_btn" aria-hidden="true">&times;</span></button>
                        </div>
                    @endif
                    <form action="{{ route('admin.change.password.process') }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        <div class="row">
                            <div class="col-md-6">
                                <div>
                                    <label class="mt-2">Old Password</label> <br>
                                    <input class="input_fields" type="password" placeholder="Old Password"
                                        name="o_password">
                                    @error('o_password')
                                        <span class="text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <label class="mt-2">New Password</label> <br>
                                <input class="input_fields" type="password" placeholder="New Password" name="password">
                                @error('password')
                                    <span class="text-danger">
                                        {{ $message }}
                                    </span>
                                @enderror
                            </div>
                        </div>
                        <div class="row mt-4">
                            <div class="col-md-6">
                                <div>
                                    <label class="mt-2">Confirm Password</label> <br>
                                    <input class="input_fields" type="password" placeholder="Confirm Password"
                                        name="c_password">
                                    @error('c_password')
                                        <span class="text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>
                            </div>
                        </div>
                        <div class="row mt-4">
                        </div>
                        <button type="submit" class="btn update_btn mt-3 w-25">Update</button>
                    </form>
                </div>
            </div>
        </section>
    </div>
@endsection