@extends('mobile.layouts.app')

@section('content')
<div id="accountPasswordCampaign" class="container">

    @include('mobile.account.navTabs')

    <dl>
        <dt>비밀번호 변경 안내</dt>
        <dd>개인정보보호를 위해 비밀번호를 변경해 주세요.</dd>
        <dd>장기간 비밀번호를 변경하지 않고 동일한 비밀번호를 사용중인 경우 개인정보를</dd>
        <dd>안전하게 보호하고 개인정보 도용으로 인한 피해를 방지하기 위하여 주기적으로 비밀번호 변경 요청을 드리고 있습니다.</dd>
        <dd>비밀번호를 {{ $changePasswordDay }}일 연장하고 싶으시다면 다음에 하기를 눌러 주세요.</dd>
        <dd><u>고객님의 소중한 정보보호를 위하여 적극적인 참여 부탁 드립니다.</u></dd>
    </dl>

    <hr/>
    <form name="f_account_password_campaign" id="fAccountPasswordCampaign" method="post" action="{{ route('account.password.campaign.update') }}" autocomplete="off">
        @csrf
        <table class="table table-borderless">
            <colgroup>
                <col style="width: 17%;min-width: 90px;"/>
                <col style="width: auto;"/>
            </colgroup>
            <tr>
                <th rowspan="4">새 비밀번호</th>
                <td>
                    <label for="password" class="form-label">현재 비밀번호</label>
                    <input type="password" name="password" id="password" class="form-control" required autofocus/>
                </td>
            </tr>
            <tr>
                <td>
                    <label for="newPassword" class="form-label">새 비밀번호</label>
                    <input type="password" name="new_password" id="newPassword" class="form-control" required minlength="{{ config('password_min_length', 0) }}" />
                </td>
            </tr>
            <tr>
                <td>
                    <label for="newPasswordConfirm" class="form-label">새 비밀번호 확인</label>
                    <input type="password" name="new_password_confirmation" id="newPasswordConfirm" class="form-control" required />
                </td>
            </tr>
            <tr>
                <td>
                    <div class="row g-2">
                        <div class="col-auto">
                            <button type="submit" class="btn btn-success">확인</button>
                        </div>
                        <div class="col-auto">
                            <button type="button" id="btnPasswordCampaignSkip" class="btn btn-default">다음에 하기</button>
                        </div>
                    </div>
                </td>
            </tr>
        </table>
    </form>
    <hr/>
</div>
@endsection

@push('styles')
    <link rel="stylesheet" href="{{ asset('css/mobile/account/passwords.css') }}"/>
@endpush

@push('scripts')
    <script src="{{ asset('js/account/passwords.js') }}" defer></script>
@endpush