@extends('base::layouts.default')

@section('header')
    @include('base::layouts.headers.dashboard')
@endsection


@section('content')
    <div data-ng-controller="SubscriberController as subCtrl">
        <div class="dashboard-page " id="dashboard-page">
            <div class="page-heading flexbox align-items-center flex-wrap">
                <h4>{{ __('organizations::index.subscriber') }}</h4>
            </div>

            @include('subscribers::layouts.subscribernav')

            <div class="contentpanel product order_list">
                @include('base::partials.errors')
                <div class="response-msg"></div>
            </div>

            <ul class="nav nav-tabs" role="tablist">
                <li class="active">
                    <a href="#home" role="tab" data-toggle="tab" style="color: black;">General Information</a>
                </li>
            </ul>


            <div class="tab-content">
                <div id="home" class="tab-pane fade in active"><br>
                    <h1 class="fs-4 fw-bold" style="font-size: 1.5rem; font-weight: 900;">General Information</h1>
                    <br>
                    <h3>Note that address will be inherited in activation when adding a credit card on file</h3>
                    <br>

                    <div class="row">
                        <div class="justify-content-center mx-auto" style="width:70%; margin-left: 10rem;">
                            <form method="POST" enctype="multipart/form-data" id="update_plan" data-base-validator
                                data-ng-submit="subCtrl.editsave($event)">
                                {!! csrf_field() !!}
                                <input type="hidden" id="sub-id" name="id" value="{{ request()->query('subscriber-id') }}">

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="organization_name" class="col-sm-2 control-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ trans('subscribers::index.organization.organization') }}*:</label>
                                    <div class="col-sm-10 m-auto">
                                        <input type="text" class="form-control" name="organization_name"
                                            ng-model="subCtrl.sub.organization_name"
                                            placeholder="{{trans('organizations::index.organization_placeholder')}}"
                                            id="organization_name" required
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="account_number" class="col-sm-2 control-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.account_number.account_number') }}*:</label>
                                    <div class="col-sm-8">
                                        <input type="text" class="form-control" name="account_number" id="account_number"
                                            ng-model="subCtrl.sub.account_number"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;"
                                            placeholder="{{ trans('organizations::index.acc_number') }}">
                                    </div>
                                    <div class="col-sm-2" style="margin-top: 0.5rem;">
                                        <input type="checkbox" id="account_number_auto" onclick="generateAccountNumber()">
                                        <label
                                            for="account_number_auto"><strong>{{ __('subscribers::index.auto') }}</strong></label>
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="pin_code" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.pin_code.pin_code') }}*:</label>
                                    <div class="col-sm-10 m-auto">
                                        <input class="form-control rounded-pill border-3" type="text" name="pin_code"
                                            required ng-model="subCtrl.sub.pin_code"
                                            placeholder="{{trans('organizations::index.pin_code')}}" id="pin_code"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="user_name" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.user_name.user_name') }}*:</label>
                                    <div class="col-sm-8">
                                        <input class="form-control rounded-pill border-3" type="text" name="user_name"
                                            required ng-model="subCtrl.sub.user_name"
                                            placeholder="{{trans('organizations::index.username')}}" id="user_name"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                    <div class="col-sm-2" style="margin-top: 0.5rem;">
                                        <input type="checkbox" id="username_auto" onclick="generateUsername()">
                                        <label
                                            for="username_auto"><strong>{{ __('subscribers::index.auto') }}</strong></label>
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="password" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.password.password') }}:</label>
                                    <div class="col-sm-10" style="display: flex; align-items: center; gap: 10px;">
                                        <input type="password" class="form-control" id="accessKeyInput" name="password"
                                            ng-model="subCtrl.sub.password"
                                            placeholder="{{ __('subscribers::index.password.name') }}"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto; flex: 1;">
                                        <button type="button" class="btn btn-default" onclick="toggleAccessKey()"
                                            title="Show/Hide Access Key">
                                            <i class="glyphicon glyphicon-eye-open" id="toggleaccessIcon"></i>
                                        </button>
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="first_name" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.first_name.first_name') }}*:</label>
                                    <div class="col-sm-10 m-auto">
                                        <input class="form-control rounded-pill border-3" type="text" name="first_name"
                                            required ng-model="subCtrl.sub.first_name"
                                            placeholder="{{trans('organizations::index.first_name')}}" id="first_name"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="last_name" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.last_name.last_name') }}*:</label>
                                    <div class="col-sm-10 m-auto">
                                        <input class="form-control rounded-pill border-3" type="text" name="last_name"
                                            required ng-model="subCtrl.sub.last_name"
                                            placeholder="{{trans('organizations::index.last_name')}}" id="last_name"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="email" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.email.email') }}*:</label>
                                    <div class="col-sm-10 m-auto">
                                        <input class="form-control rounded-pill border-3" type="email" name="email" required
                                            ng-model="subCtrl.sub.email"
                                            placeholder="{{trans('organizations::index.email')}}" id="email"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="phone_number" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">
                                        {{ __('subscribers::index.phone_number.phone_number') }}*:
                                    </label>
                                    <div class="col-sm-10 m-auto">
                                        <div class="row">
                                            <div class="col-sm-4">
                                                <select class="form-control rounded-pill border-3"
                                                    ng-model="subCtrl.sub.phone_number_code" name="phone_number_code"
                                                    required
                                                    style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                                    <option value="">{{ __('subscribers::index.phone_number.name') }}
                                                    </option>
                                                    <option value="+1">+1 (United States)</option>
                                                    <option value="+1">+1 (Canada)</option>
                                                    <option value="+44">+44 (United Kingdom)</option>
                                                    <option value="+91">+91 (India)</option>
                                                    <option value="+61">+61 (Australia)</option>
                                                    <option value="+81">+81 (Japan)</option>
                                                    <option value="+49">+49 (Germany)</option>
                                                    <option value="+33">+33 (France)</option>
                                                    <option value="+86">+86 (China)</option>
                                                    <option value="+7">+7 (Russia)</option>
                                                    <option value="+39">+39 (Italy)</option>
                                                    <option value="+34">+34 (Spain)</option>
                                                    <option value="+47">+47 (Norway)</option>
                                                    <option value="+46">+46 (Sweden)</option>
                                                    <option value="+45">+45 (Denmark)</option>
                                                    <option value="+31">+31 (Netherlands)</option>
                                                    <option value="+41">+41 (Switzerland)</option>
                                                    <option value="+43">+43 (Austria)</option>
                                                    <option value="+48">+48 (Poland)</option>
                                                    <option value="+351">+351 (Portugal)</option>
                                                    <option value="+420">+420 (Czech Republic)</option>
                                                    <option value="+421">+421 (Slovakia)</option>
                                                    <option value="+32">+32 (Belgium)</option>
                                                    <option value="+352">+352 (Luxembourg)</option>
                                                    <option value="+353">+353 (Ireland)</option>
                                                    <option value="+36">+36 (Hungary)</option>
                                                    <option value="+30">+30 (Greece)</option>
                                                    <option value="+357">+357 (Cyprus)</option>
                                                    <option value="+359">+359 (Bulgaria)</option>
                                                    <option value="+40">+40 (Romania)</option>
                                                    <option value="+90">+90 (Turkey)</option>
                                                    <option value="+380">+380 (Ukraine)</option>
                                                    <option value="+375">+375 (Belarus)</option>
                                                    <option value="+386">+386 (Slovenia)</option>
                                                    <option value="+385">+385 (Croatia)</option>
                                                    <option value="+387">+387 (Bosnia & Herzegovina)</option>
                                                    <option value="+389">+389 (North Macedonia)</option>
                                                    <option value="+382">+382 (Montenegro)</option>
                                                    <option value="+381">+381 (Serbia)</option>
                                                    <option value="+386">+386 (Slovenia)</option>
                                                    <option value="+371">+371 (Latvia)</option>
                                                    <option value="+370">+370 (Lithuania)</option>
                                                    <option value="+372">+372 (Estonia)</option>
                                                    <option value="+63">+63 (Philippines)</option>
                                                    <option value="+62">+62 (Indonesia)</option>
                                                    <option value="+60">+60 (Malaysia)</option>
                                                    <option value="+65">+65 (Singapore)</option>
                                                    <option value="+66">+66 (Thailand)</option>
                                                    <option value="+84">+84 (Vietnam)</option>
                                                    <option value="+880">+880 (Bangladesh)</option>
                                                    <option value="+92">+92 (Pakistan)</option>
                                                    <option value="+977">+977 (Nepal)</option>
                                                    <option value="+94">+94 (Sri Lanka)</option>
                                                    <option value="+960">+960 (Maldives)</option>
                                                    <option value="+856">+856 (Laos)</option>
                                                    <option value="+855">+855 (Cambodia)</option>
                                                    <option value="+95">+95 (Myanmar)</option>
                                                    <option value="+82">+82 (South Korea)</option>
                                                    <option value="+850">+850 (North Korea)</option>
                                                    <option value="+353">+353 (Ireland)</option>
                                                    <option value="+20">+20 (Egypt)</option>
                                                    <option value="+212">+212 (Morocco)</option>
                                                    <option value="+213">+213 (Algeria)</option>
                                                    <option value="+216">+216 (Tunisia)</option>
                                                    <option value="+218">+218 (Libya)</option>
                                                    <option value="+234">+234 (Nigeria)</option>
                                                    <option value="+27">+27 (South Africa)</option>
                                                    <option value="+254">+254 (Kenya)</option>
                                                    <option value="+255">+255 (Tanzania)</option>
                                                    <option value="+256">+256 (Uganda)</option>
                                                    <option value="+260">+260 (Zambia)</option>
                                                    <option value="+263">+263 (Zimbabwe)</option>
                                                    <option value="+998">+998 (Uzbekistan)</option>
                                                    <option value="+996">+996 (Kyrgyzstan)</option>
                                                    <option value="+993">+993 (Turkmenistan)</option>
                                                    <option value="+994">+994 (Azerbaijan)</option>
                                                    <option value="+995">+995 (Georgia)</option>
                                                    <option value="+972">+972 (Israel)</option>
                                                    <option value="+966">+966 (Saudi Arabia)</option>
                                                    <option value="+971">+971 (United Arab Emirates)</option>
                                                    <option value="+968">+968 (Oman)</option>
                                                    <option value="+974">+974 (Qatar)</option>
                                                    <option value="+973">+973 (Bahrain)</option>
                                                    <option value="+965">+965 (Kuwait)</option>
                                                    <option value="+964">+964 (Iraq)</option>
                                                    <option value="+98">+98 (Iran)</option>
                                                    <option value="+963">+963 (Syria)</option>
                                                    <option value="+961">+961 (Lebanon)</option>
                                                    <option value="+962">+962 (Jordan)</option>
                                                    <option value="+965">+965 (Kuwait)</option>
                                                    <option value="+975">+975 (Bhutan)</option>
                                                    <option value="+7">+7 (Kazakhstan)</option>
                                                    <option value="+358">+358 (Finland)</option>
                                                    <option value="+64">+64 (New Zealand)</option>
                                                    <option value="+52">+52 (Mexico)</option>
                                                    <option value="+51">+51 (Peru)</option>
                                                    <option value="+54">+54 (Argentina)</option>
                                                    <option value="+55">+55 (Brazil)</option>
                                                    <option value="+56">+56 (Chile)</option>
                                                    <option value="+57">+57 (Colombia)</option>
                                                    <option value="+58">+58 (Venezuela)</option>
                                                    <option value="+591">+591 (Bolivia)</option>
                                                    <option value="+592">+592 (Guyana)</option>
                                                    <option value="+593">+593 (Ecuador)</option>
                                                    <option value="+595">+595 (Paraguay)</option>
                                                    <option value="+598">+598 (Uruguay)</option>
                                                    <option value="+507">+507 (Panama)</option>
                                                    <option value="+506">+506 (Costa Rica)</option>
                                                    <option value="+502">+502 (Guatemala)</option>
                                                    <option value="+503">+503 (El Salvador)</option>
                                                    <option value="+504">+504 (Honduras)</option>
                                                    <option value="+505">+505 (Nicaragua)</option>
                                                    <option value="+509">+509 (Haiti)</option>
                                                    <option value="+1">+1 (Jamaica)</option>
                                                    <option value="+1">+1 (Barbados)</option>
                                                    <option value="+1">+1 (Bahamas)</option>
                                                    <option value="+1">+1 (Trinidad & Tobago)</option>
                                                    <option value="+1">+1 (Dominican Republic)</option>
                                                    <option value="+1">+1 (Puerto Rico)</option>
                                                    <option value="+1">+1 (Cuba)</option>
                                                    <option value="+682">+682 (Cook Islands)</option>
                                                    <option value="+675">+675 (Papua New Guinea)</option>
                                                    <option value="+679">+679 (Fiji)</option>
                                                    <option value="+685">+685 (Samoa)</option>
                                                    <option value="+686">+686 (Kiribati)</option>
                                                    <option value="+688">+688 (Tuvalu)</option>
                                                    <option value="+689">+689 (French Polynesia)</option>
                                                </select>
                                            </div>
                                            <div class="col-sm-8">
                                                <input class="form-control rounded-pill border-3" type="tel"
                                                    name="phone_number" required ng-model="subCtrl.sub.phone_number"
                                                    placeholder="{{trans('organizations::index.phone_number')}}"
                                                    id="phone_number"
                                                    style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="address" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.address.address') }}*:</label>
                                    <div class="col-sm-10 m-auto">
                                        <textarea class="form-control rounded-pill border-3" type="text" name="address"
                                            required ng-model="subCtrl.sub.address" rows="4" cols="50"
                                            placeholder="{{trans('organizations::index.address')}}" id="address"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;"></textarea>
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="city" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.city.city') }}*:</label>
                                    <div class="col-sm-10 m-auto">
                                        <input class="form-control rounded-pill border-3" type="text" name="city" required
                                            ng-model="subCtrl.sub.city" placeholder="{{trans('organizations::index.city')}}"
                                            id="city"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="zip_code" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.zip_code.zip_code') }}*:</label>
                                    <div class="col-sm-10 m-auto">
                                        <input class="form-control rounded-pill border-3" type="text" name="zip_code"
                                            required ng-model="subCtrl.sub.zip_code"
                                            placeholder="{{trans('organizations::index.zip_code')}}" id="zip_code"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="country" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.country.country') }}*:</label>
                                    <div class="col-sm-10 m-auto">
                                        <select name="country" id="country" class="form-control rounded-pill border-3"
                                            ng-model="subCtrl.sub.country"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                            <option value="">{{trans('organizations::index.country')}}</option>
                                            <option value="">Select Country</option>
                                            <option value="AF">Afghanistan</option>
                                            <option value="AL">Albania</option>
                                            <option value="DZ">Algeria</option>
                                            <option value="AS">American Samoa</option>
                                            <option value="AD">Andorra</option>
                                            <option value="AO">Angola</option>
                                            <option value="AI">Anguilla</option>
                                            <option value="AQ">Antarctica</option>
                                            <option value="AG">Antigua and Barbuda</option>
                                            <option value="AR">Argentina</option>
                                            <option value="AM">Armenia</option>
                                            <option value="AW">Aruba</option>
                                            <option value="AU">Australia</option>
                                            <option value="AT">Austria</option>
                                            <option value="AZ">Azerbaijan</option>
                                            <option value="BS">Bahamas</option>
                                            <option value="BH">Bahrain</option>
                                            <option value="BD">Bangladesh</option>
                                            <option value="BB">Barbados</option>
                                            <option value="BY">Belarus</option>
                                            <option value="BE">Belgium</option>
                                            <option value="BZ">Belize</option>
                                            <option value="BJ">Benin</option>
                                            <option value="BM">Bermuda</option>
                                            <option value="BT">Bhutan</option>
                                            <option value="BO">Bolivia</option>
                                            <option value="BA">Bosnia and Herzegovina</option>
                                            <option value="BW">Botswana</option>
                                            <option value="BR">Brazil</option>
                                            <option value="IO">British Indian Ocean Territory</option>
                                            <option value="VG">British Virgin Islands</option>
                                            <option value="BN">Brunei</option>
                                            <option value="BG">Bulgaria</option>
                                            <option value="BF">Burkina Faso</option>
                                            <option value="BI">Burundi</option>
                                            <option value="KH">Cambodia</option>
                                            <option value="CM">Cameroon</option>
                                            <option value="CA">Canada</option>
                                            <option value="CV">Cape Verde</option>
                                            <option value="KY">Cayman Islands</option>
                                            <option value="CF">Central African Republic</option>
                                            <option value="TD">Chad</option>
                                            <option value="CL">Chile</option>
                                            <option value="CN">China</option>
                                            <option value="CO">Colombia</option>
                                            <option value="KM">Comoros</option>
                                            <option value="CD">Congo (DRC)</option>
                                            <option value="CG">Congo (Republic)</option>
                                            <option value="CR">Costa Rica</option>
                                            <option value="HR">Croatia</option>
                                            <option value="CU">Cuba</option>
                                            <option value="CY">Cyprus</option>
                                            <option value="CZ">Czech Republic</option>
                                            <option value="DK">Denmark</option>
                                            <option value="DJ">Djibouti</option>
                                            <option value="DM">Dominica</option>
                                            <option value="DO">Dominican Republic</option>
                                            <option value="EC">Ecuador</option>
                                            <option value="EG">Egypt</option>
                                            <option value="SV">El Salvador</option>
                                            <option value="GQ">Equatorial Guinea</option>
                                            <option value="ER">Eritrea</option>
                                            <option value="EE">Estonia</option>
                                            <option value="SZ">Eswatini</option>
                                            <option value="ET">Ethiopia</option>
                                            <option value="FJ">Fiji</option>
                                            <option value="FI">Finland</option>
                                            <option value="FR">France</option>
                                            <option value="GF">French Guiana</option>
                                            <option value="PF">French Polynesia</option>
                                            <option value="GA">Gabon</option>
                                            <option value="GM">Gambia</option>
                                            <option value="GE">Georgia</option>
                                            <option value="DE">Germany</option>
                                            <option value="GH">Ghana</option>
                                            <option value="GR">Greece</option>
                                            <option value="GL">Greenland</option>
                                            <option value="GD">Grenada</option>
                                            <option value="GP">Guadeloupe</option>
                                            <option value="GU">Guam</option>
                                            <option value="GT">Guatemala</option>
                                            <option value="GN">Guinea</option>
                                            <option value="GW">Guinea-Bissau</option>
                                            <option value="GY">Guyana</option>
                                            <option value="HT">Haiti</option>
                                            <option value="HN">Honduras</option>
                                            <option value="HK">Hong Kong</option>
                                            <option value="HU">Hungary</option>
                                            <option value="IS">Iceland</option>
                                            <option value="IN">India</option>
                                            <option value="ID">Indonesia</option>
                                            <option value="IR">Iran</option>
                                            <option value="IQ">Iraq</option>
                                            <option value="IE">Ireland</option>
                                            <option value="IL">Israel</option>
                                            <option value="IT">Italy</option>
                                            <option value="JM">Jamaica</option>
                                            <option value="JP">Japan</option>
                                            <option value="JO">Jordan</option>
                                            <option value="KZ">Kazakhstan</option>
                                            <option value="KE">Kenya</option>
                                            <option value="KI">Kiribati</option>
                                            <option value="KW">Kuwait</option>
                                            <option value="KG">Kyrgyzstan</option>
                                            <option value="LA">Laos</option>
                                            <option value="LV">Latvia</option>
                                            <option value="LB">Lebanon</option>
                                            <option value="LS">Lesotho</option>
                                            <option value="LR">Liberia</option>
                                            <option value="LY">Libya</option>
                                            <option value="LI">Liechtenstein</option>
                                            <option value="LT">Lithuania</option>
                                            <option value="LU">Luxembourg</option>
                                            <option value="MO">Macao</option>
                                            <option value="MG">Madagascar</option>
                                            <option value="MW">Malawi</option>
                                            <option value="MY">Malaysia</option>
                                            <option value="MV">Maldives</option>
                                            <option value="ML">Mali</option>
                                            <option value="MT">Malta</option>
                                            <option value="MH">Marshall Islands</option>
                                            <option value="MQ">Martinique</option>
                                            <option value="MR">Mauritania</option>
                                            <option value="MU">Mauritius</option>
                                            <option value="YT">Mayotte</option>
                                            <option value="MX">Mexico</option>
                                            <option value="FM">Micronesia</option>
                                            <option value="MD">Moldova</option>
                                            <option value="MC">Monaco</option>
                                            <option value="MN">Mongolia</option>
                                            <option value="ME">Montenegro</option>
                                            <option value="MA">Morocco</option>
                                            <option value="MZ">Mozambique</option>
                                            <option value="MM">Myanmar</option>
                                            <option value="NA">Namibia</option>
                                            <option value="NR">Nauru</option>
                                            <option value="NP">Nepal</option>
                                            <option value="NL">Netherlands</option>
                                            <option value="NZ">New Zealand</option>
                                            <option value="NI">Nicaragua</option>
                                            <option value="NE">Niger</option>
                                            <option value="NG">Nigeria</option>
                                            <option value="KP">North Korea</option>
                                            <option value="MK">North Macedonia</option>
                                            <option value="NO">Norway</option>
                                            <option value="OM">Oman</option>
                                            <option value="PK">Pakistan</option>
                                            <option value="PW">Palau</option>
                                            <option value="PS">Palestine</option>
                                            <option value="PA">Panama</option>
                                            <option value="PG">Papua New Guinea</option>
                                            <option value="PY">Paraguay</option>
                                            <option value="PE">Peru</option>
                                            <option value="PH">Philippines</option>
                                            <option value="PL">Poland</option>
                                            <option value="PT">Portugal</option>
                                            <option value="PR">Puerto Rico</option>
                                            <option value="QA">Qatar</option>
                                            <option value="RO">Romania</option>
                                            <option value="RU">Russia</option>
                                            <option value="RW">Rwanda</option>
                                            <option value="KN">Saint Kitts and Nevis</option>
                                            <option value="LC">Saint Lucia</option>
                                            <option value="VC">Saint Vincent and the Grenadines</option>
                                            <option value="WS">Samoa</option>
                                            <option value="SM">San Marino</option>
                                            <option value="ST">Sao Tome and Principe</option>
                                            <option value="SA">Saudi Arabia</option>
                                            <option value="SN">Senegal</option>
                                            <option value="RS">Serbia</option>
                                            <option value="SC">Seychelles</option>
                                            <option value="SL">Sierra Leone</option>
                                            <option value="SG">Singapore</option>
                                            <option value="SK">Slovakia</option>
                                            <option value="SI">Slovenia</option>
                                            <option value="SB">Solomon Islands</option>
                                            <option value="SO">Somalia</option>
                                            <option value="ZA">South Africa</option>
                                            <option value="KR">South Korea</option>
                                            <option value="SS">South Sudan</option>
                                            <option value="ES">Spain</option>
                                            <option value="LK">Sri Lanka</option>
                                            <option value="SD">Sudan</option>
                                            <option value="SR">Suriname</option>
                                            <option value="SE">Sweden</option>
                                            <option value="CH">Switzerland</option>
                                            <option value="SY">Syria</option>
                                            <option value="TW">Taiwan</option>
                                            <option value="TJ">Tajikistan</option>
                                            <option value="TZ">Tanzania</option>
                                            <option value="TH">Thailand</option>
                                            <option value="TL">Timor-Leste</option>
                                            <option value="TG">Togo</option>
                                            <option value="TO">Tonga</option>
                                            <option value="TT">Trinidad and Tobago</option>
                                            <option value="TN">Tunisia</option>
                                            <option value="TR">Turkey</option>
                                            <option value="TM">Turkmenistan</option>
                                            <option value="TV">Tuvalu</option>
                                            <option value="UG">Uganda</option>
                                            <option value="UA">Ukraine</option>
                                            <option value="AE">United Arab Emirates</option>
                                            <option value="GB">United Kingdom</option>
                                            <option value="US">United States</option>
                                            <option value="UY">Uruguay</option>
                                            <option value="UZ">Uzbekistan</option>
                                            <option value="VU">Vanuatu</option>
                                            <option value="VE">Venezuela</option>
                                            <option value="VN">Vietnam</option>
                                            <option value="YE">Yemen</option>
                                            <option value="ZM">Zambia</option>
                                            <option value="ZW">Zimbabwe</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="state(region)" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.state.state') }}:</label>
                                    <div class="col-sm-10 m-auto">
                                        <input class="form-control rounded-pill border-3" type="text" name="state"
                                            ng-model="subCtrl.sub.state"
                                            placeholder="{{trans('organizations::index.state')}}" id="state"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="language" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.language.language') }}s:</label>
                                    <div class="col-sm-10 m-auto">
                                        <select name="language" id="language" class="form-control rounded-pill border-3"
                                            ng-model="subCtrl.sub.language"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                            <option value="">{{trans('organizations::index.language')}}</option>
                                            <option value="ab">Abkhaz</option>
                                            <option value="aa">Afar</option>
                                            <option value="af">Afrikaans</option>
                                            <option value="ak">Akan</option>
                                            <option value="sq">Albanian</option>
                                            <option value="am">Amharic</option>
                                            <option value="ar">Arabic</option>
                                            <option value="an">Aragonese</option>
                                            <option value="hy">Armenian</option>
                                            <option value="as">Assamese</option>
                                            <option value="av">Avaric</option>
                                            <option value="ae">Avestan</option>
                                            <option value="ay">Aymara</option>
                                            <option value="az">Azerbaijani</option>
                                            <option value="bm">Bambara</option>
                                            <option value="ba">Bashkir</option>
                                            <option value="eu">Basque</option>
                                            <option value="be">Belarusian</option>
                                            <option value="bn">Bengali</option>
                                            <option value="bh">Bihari</option>
                                            <option value="bi">Bislama</option>
                                            <option value="bs">Bosnian</option>
                                            <option value="br">Breton</option>
                                            <option value="bg">Bulgarian</option>
                                            <option value="my">Burmese</option>
                                            <option value="ca">Catalan</option>
                                            <option value="ch">Chamorro</option>
                                            <option value="ce">Chechen</option>
                                            <option value="ny">Chichewa</option>
                                            <option value="zh">Chinese</option>
                                            <option value="cv">Chuvash</option>
                                            <option value="kw">Cornish</option>
                                            <option value="co">Corsican</option>
                                            <option value="cr">Cree</option>
                                            <option value="hr">Croatian</option>
                                            <option value="cs">Czech</option>
                                            <option value="da">Danish</option>
                                            <option value="dv">Divehi</option>
                                            <option value="nl">Dutch</option>
                                            <option value="dz">Dzongkha</option>
                                            <option value="en">English</option>
                                            <option value="eo">Esperanto</option>
                                            <option value="et">Estonian</option>
                                            <option value="ee">Ewe</option>
                                            <option value="fo">Faroese</option>
                                            <option value="fj">Fijian</option>
                                            <option value="fi">Finnish</option>
                                            <option value="fr">French</option>
                                            <option value="ff">Fula</option>
                                            <option value="gl">Galician</option>
                                            <option value="ka">Georgian</option>
                                            <option value="de">German</option>
                                            <option value="el">Greek</option>
                                            <option value="gn">Guarani</option>
                                            <option value="gu">Gujarati</option>
                                            <option value="ht">Haitian</option>
                                            <option value="ha">Hausa</option>
                                            <option value="he">Hebrew</option>
                                            <option value="hz">Herero</option>
                                            <option value="hi">Hindi</option>
                                            <option value="ho">Hiri Motu</option>
                                            <option value="hu">Hungarian</option>
                                            <option value="ia">Interlingua</option>
                                            <option value="id">Indonesian</option>
                                            <option value="ie">Interlingue</option>
                                            <option value="ga">Irish</option>
                                            <option value="ig">Igbo</option>
                                            <option value="ik">Inupiaq</option>
                                            <option value="io">Ido</option>
                                            <option value="is">Icelandic</option>
                                            <option value="it">Italian</option>
                                            <option value="iu">Inuktitut</option>
                                            <option value="ja">Japanese</option>
                                            <option value="jv">Javanese</option>
                                            <option value="kl">Kalaallisut</option>
                                            <option value="kn">Kannada</option>
                                            <option value="kr">Kanuri</option>
                                            <option value="ks">Kashmiri</option>
                                            <option value="kk">Kazakh</option>
                                            <option value="km">Khmer</option>
                                            <option value="ki">Kikuyu</option>
                                            <option value="rw">Kinyarwanda</option>
                                            <option value="ky">Kyrgyz</option>
                                            <option value="kv">Komi</option>
                                            <option value="kg">Kongo</option>
                                            <option value="ko">Korean</option>
                                            <option value="ku">Kurdish</option>
                                            <option value="kj">Kwanyama</option>
                                            <option value="la">Latin</option>
                                            <option value="lb">Luxembourgish</option>
                                            <option value="lg">Ganda</option>
                                            <option value="li">Limburgish</option>
                                            <option value="ln">Lingala</option>
                                            <option value="lo">Lao</option>
                                            <option value="lt">Lithuanian</option>
                                            <option value="lu">Luba-Katanga</option>
                                            <option value="lv">Latvian</option>
                                            <option value="gv">Manx</option>
                                            <option value="mk">Macedonian</option>
                                            <option value="mg">Malagasy</option>
                                            <option value="ms">Malay</option>
                                            <option value="ml">Malayalam</option>
                                            <option value="mt">Maltese</option>
                                            <option value="mi">Maori</option>
                                            <option value="mr">Marathi</option>
                                            <option value="mh">Marshallese</option>
                                            <option value="mn">Mongolian</option>
                                            <option value="na">Nauru</option>
                                            <option value="nv">Navajo</option>
                                            <option value="nb">Norwegian Bokmål</option>
                                            <option value="nd">North Ndebele</option>
                                            <option value="ne">Nepali</option>
                                            <option value="ng">Ndonga</option>
                                            <option value="nn">Norwegian Nynorsk</option>
                                            <option value="no">Norwegian</option>
                                            <option value="ii">Nuosu</option>
                                            <option value="nr">South Ndebele</option>
                                            <option value="oc">Occitan</option>
                                            <option value="oj">Ojibwe</option>
                                            <option value="cu">Old Church Slavonic</option>
                                            <option value="om">Oromo</option>
                                            <option value="or">Oriya</option>
                                            <option value="os">Ossetian</option>
                                            <option value="pa">Punjabi</option>
                                            <option value="pi">Pali</option>
                                            <option value="fa">Persian</option>
                                            <option value="pl">Polish</option>
                                            <option value="ps">Pashto</option>
                                            <option value="pt">Portuguese</option>
                                            <option value="qu">Quechua</option>
                                            <option value="rm">Romansh</option>
                                            <option value="rn">Kirundi</option>
                                            <option value="ro">Romanian</option>
                                            <option value="ru">Russian</option>
                                            <option value="sa">Sanskrit</option>
                                            <option value="sc">Sardinian</option>
                                            <option value="sd">Sindhi</option>
                                            <option value="se">Northern Sami</option>
                                            <option value="sm">Samoan</option>
                                            <option value="sg">Sango</option>
                                            <option value="sr">Serbian</option>
                                            <option value="gd">Scottish Gaelic</option>
                                            <option value="sn">Shona</option>
                                            <option value="si">Sinhala</option>
                                            <option value="sk">Slovak</option>
                                            <option value="sl">Slovenian</option>
                                            <option value="so">Somali</option>
                                            <option value="st">Southern Sotho</option>
                                            <option value="es">Spanish</option>
                                            <option value="su">Sundanese</option>
                                            <option value="sw">Swahili</option>
                                            <option value="sv">Swedish</option>
                                            <option value="tl">Tagalog</option>
                                            <option value="tg">Tajik</option>
                                            <option value="ta">Tamil</option>
                                            <option value="tt">Tatar</option>
                                            <option value="te">Telugu</option>
                                            <option value="th">Thai</option>
                                            <option value="bo">Tibetan</option>
                                            <option value="ti">Tigrinya</option>
                                            <option value="to">Tonga</option>
                                            <option value="ts">Tsonga</option>
                                            <option value="tn">Tswana</option>
                                            <option value="tr">Turkish</option>
                                            <option value="tk">Turkmen</option>
                                            <option value="tw">Twi</option>
                                            <option value="ug">Uyghur</option>
                                            <option value="uk">Ukrainian</option>
                                            <option value="ur">Urdu</option>
                                            <option value="uz">Uzbek</option>
                                            <option value="ve">Venda</option>
                                            <option value="vi">Vietnamese</option>
                                            <option value="vo">Volapük</option>
                                            <option value="wa">Walloon</option>
                                            <option value="cy">Welsh</option>
                                            <option value="wo">Wolof</option>
                                            <option value="xh">Xhosa</option>
                                            <option value="yi">Yiddish</option>
                                            <option value="yo">Yoruba</option>
                                            <option value="za">Zhuang</option>
                                            <option value="zu">Zulu</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="date_of_birth" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.date_of_birth.date_of_birth') }}:</label>
                                    <div class="col-sm-10 m-auto">
                                        <input class="form-control rounded-pill border-3" type="date" name="date_of_birth"
                                            ng-model="subCtrl.sub.date_of_birth"
                                            placeholder="{{trans('organizations::index.date_of_birth')}}" id="date_of_birth"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                    </div>
                                </div>

                                <div class="form-group row" style="margin-bottom: 15px;">
                                    <label for="timezone" class="col-sm-2 fw-bold col-form-label"
                                        style="font-size: 14px; color: #000; margin-top: 10px;">{{ __('subscribers::index.time_zone.time_zone') }}:</label>
                                    <div class="col-sm-10 m-auto">
                                        <select name="timezone" id="timezone" class="form-control rounded-pill border-3"
                                            ng-model="subCtrl.sub.timezone"
                                            style="border: 2px solid rgba(128, 130, 133, 0.36); border-radius: 20px; padding: 0px 9px; height: auto;">
                                            <option value="">{{ trans('organizations::index.timezone') }}</option>
                                            <option value="Pacific/Midway">(UTC-11:00) Midway Island, Samoa</option>
                                            <option value="Pacific/Niue">(UTC-11:00) Niue</option>
                                            <option value="Pacific/Pago_Pago">(UTC-11:00) Pago Pago</option>

                                            <option value="America/Adak">(UTC-10:00) Hawaii-Aleutian</option>
                                            <option value="Pacific/Honolulu">(UTC-10:00) Honolulu</option>

                                            <option value="Pacific/Marquesas">(UTC-09:30) Marquesas Islands</option>

                                            <option value="America/Anchorage">(UTC-09:00) Alaska</option>
                                            <option value="Pacific/Gambier">(UTC-09:00) Gambier Islands</option>

                                            <option value="America/Los_Angeles">(UTC-08:00) Pacific Time (US & Canada)
                                            </option>
                                            <option value="America/Tijuana">(UTC-08:00) Tijuana</option>
                                            <option value="Pacific/Pitcairn">(UTC-08:00) Pitcairn Islands</option>

                                            <option value="America/Denver">(UTC-07:00) Mountain Time (US & Canada)</option>
                                            <option value="America/Phoenix">(UTC-07:00) Arizona</option>

                                            <option value="America/Chicago">(UTC-06:00) Central Time (US & Canada)</option>
                                            <option value="America/Mexico_City">(UTC-06:00) Mexico City</option>
                                            <option value="America/Belize">(UTC-06:00) Belize</option>

                                            <option value="America/New_York">(UTC-05:00) Eastern Time (US & Canada)</option>
                                            <option value="America/Toronto">(UTC-05:00) Toronto</option>
                                            <option value="America/Havana">(UTC-05:00) Havana</option>

                                            <option value="America/Caracas">(UTC-04:00) Caracas</option>
                                            <option value="America/La_Paz">(UTC-04:00) La Paz</option>
                                            <option value="America/Santiago">(UTC-04:00) Santiago</option>
                                            <option value="America/Halifax">(UTC-04:00) Atlantic Time (Canada)</option>

                                            <option value="America/St_Johns">(UTC-03:30) Newfoundland</option>

                                            <option value="America/Argentina/Buenos_Aires">(UTC-03:00) Buenos Aires</option>
                                            <option value="America/Sao_Paulo">(UTC-03:00) São Paulo</option>
                                            <option value="America/Godthab">(UTC-03:00) Nuuk</option>

                                            <option value="Atlantic/South_Georgia">(UTC-02:00) South Georgia</option>

                                            <option value="Atlantic/Azores">(UTC-01:00) Azores</option>
                                            <option value="Atlantic/Cape_Verde">(UTC-01:00) Cape Verde</option>

                                            <option value="UTC">(UTC+00:00) UTC (Coordinated Universal Time)</option>
                                            <option value="Europe/London">(UTC+00:00) London</option>
                                            <option value="Africa/Abidjan">(UTC+00:00) Abidjan</option>

                                            <option value="Europe/Paris">(UTC+01:00) Paris, Berlin, Madrid</option>
                                            <option value="Africa/Lagos">(UTC+01:00) Lagos</option>

                                            <option value="Europe/Athens">(UTC+02:00) Athens, Bucharest</option>
                                            <option value="Africa/Cairo">(UTC+02:00) Cairo</option>
                                            <option value="Europe/Kaliningrad">(UTC+02:00) Kaliningrad</option>

                                            <option value="Europe/Moscow">(UTC+03:00) Moscow</option>
                                            <option value="Africa/Nairobi">(UTC+03:00) Nairobi</option>
                                            <option value="Asia/Baghdad">(UTC+03:00) Baghdad</option>

                                            <option value="Asia/Tehran">(UTC+03:30) Tehran</option>

                                            <option value="Asia/Dubai">(UTC+04:00) Dubai</option>
                                            <option value="Asia/Baku">(UTC+04:00) Baku</option>

                                            <option value="Asia/Kabul">(UTC+04:30) Kabul</option>

                                            <option value="Asia/Karachi">(UTC+05:00) Karachi, Tashkent</option>
                                            <option value="Asia/Yekaterinburg">(UTC+05:00) Yekaterinburg</option>

                                            <option value="Asia/Kolkata">(UTC+05:30) India Standard Time</option>
                                            <option value="Asia/Colombo">(UTC+05:30) Sri Lanka</option>

                                            <option value="Asia/Kathmandu">(UTC+05:45) Kathmandu</option>

                                            <option value="Asia/Dhaka">(UTC+06:00) Dhaka</option>
                                            <option value="Asia/Almaty">(UTC+06:00) Almaty</option>

                                            <option value="Asia/Yangon">(UTC+06:30) Yangon</option>

                                            <option value="Asia/Bangkok">(UTC+07:00) Bangkok, Hanoi, Jakarta</option>
                                            <option value="Asia/Novosibirsk">(UTC+07:00) Novosibirsk</option>

                                            <option value="Asia/Shanghai">(UTC+08:00) Beijing, Shanghai</option>
                                            <option value="Asia/Singapore">(UTC+08:00) Singapore</option>
                                            <option value="Asia/Taipei">(UTC+08:00) Taipei</option>
                                            <option value="Australia/Perth">(UTC+08:00) Perth</option>

                                            <option value="Asia/Tokyo">(UTC+09:00) Tokyo, Seoul</option>
                                            <option value="Asia/Seoul">(UTC+09:00) Seoul</option>

                                            <option value="Australia/Adelaide">(UTC+09:30) Adelaide</option>
                                            <option value="Australia/Darwin">(UTC+09:30) Darwin</option>

                                            <option value="Australia/Sydney">(UTC+10:00) Sydney, Melbourne</option>
                                            <option value="Pacific/Guam">(UTC+10:00) Guam</option>
                                            <option value="Asia/Vladivostok">(UTC+10:00) Vladivostok</option>

                                            <option value="Asia/Magadan">(UTC+11:00) Magadan</option>
                                            <option value="Pacific/Noumea">(UTC+11:00) New Caledonia</option>

                                            <option value="Pacific/Auckland">(UTC+12:00) Auckland</option>
                                            <option value="Pacific/Fiji">(UTC+12:00) Fiji</option>

                                            <option value="Pacific/Chatham">(UTC+12:45) Chatham Islands</option>

                                            <option value="Pacific/Tongatapu">(UTC+13:00) Nuku'alofa</option>
                                            <option value="Pacific/Apia">(UTC+13:00) Apia</option>

                                            <option value="Pacific/Kiritimati">(UTC+14:00) Kiritimati</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group text-center">
                                    <button type="submit" class="btn btn-success" id="add_sub">
                                        <strong>Save</strong>
                                    </button>&nbsp;&nbsp;
                                    <button type="button" class="btn btn-danger" onclick="deleteSub({{ request()->id }})">
                                        <strong>Remove</strong>
                                    </button>&nbsp;&nbsp;
                                    <button type="button" class="btn btn-default"
                                        onclick="cancelOrgSub({{ request()->id }})">
                                        <strong>Cancel</strong>
                                    </button>&nbsp;&nbsp;
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
@endsection

<script>
    window.deleteorgbtn = "{{ route('subscribers.destroy') }}";
    window.cancelorgbtn = "{{ route('subscribers.index') }}";
</script>

@include('subscribers::layouts.scripts')

@section('scripts')
    <script src="{{asset('adminview/assets/js/classieSidebarEffects.js')}}"></script>
    <script src="{{asset('adminview/assets/js/classieSidebarEffectsDirective.js')}}"></script>
    <script src="{{asset('adminview/assets/js/canvasjs.min.js')}}"></script>
    <script src="{{asset('adminview/assets/js/requestFactory.js')}}"></script>
    <script src="{{asset('adminview/assets/js/gridView.js')}}"></script>
    <script src="{{asset('adminview/assets/js/subscribers/index.js')}}"></script>
    <script src="{{asset('adminview/assets/js/common/common.js')}}"></script>
    <script src="{{asset('adminview/assets/js/grid.js')}}"></script>
    <script src="{{asset('adminview/assets/js/common/directive.js')}}"></script>
@endsection