@extends('layouts.main-app')

@section('content')
<div class="row justify-content-center mb-4">
    <div class="col-md-12">
        <ul class="nav nav-tabs" id="settingTab" role="tablist">
            <li class="nav-item" role="presentation">
                <a class="nav-link {{ request()->routeIs('setting.setting.profile-setting') ? 'active' : '' }}" 
                    href="{{ route('setting.setting.profile-setting') }}" role="tab" 
                    aria-selected="false"
                >
                    @lang('Profile')
                </a>
            </li> 
            <li class="nav-item" role="presentation">
                <a class="nav-link {{ request()->routeIs('setting.setting.change-password') ? 'active' : '' }}" 
                    href="{{ route('setting.setting.change-password') }}" 
                    aria-selected="false" 
                >
                    @lang('Change Password')
                </a>
            </li>
                        <li class="nav-item" role="presentation">
                <a class="nav-link {{ request()->routeIs('twofactor.twofactor') ? 'active' : '' }}" 
                    href="{{ route('twofactor.twofactor') }}" 
                    aria-selected="false" 
                >
                    @lang('2FA Security')
                </a>
            </li>
            <li class="nav-item" role="presentation">
                <a class="nav-link {{ request()->routeIs('setting.setting.api-key') ? 'active' : '' }}" 
                    href="{{ route('setting.setting.api-key') }}" 
                    aria-selected="false"
                >
                    @lang('Api Key') 
                </a>
            </li>
            <li class="nav-item" role="presentation">
                <a class="nav-link {{ request()->routeIs('setting.setting.ip-allow') ? 'active' : '' }}" 
                    href="{{ route('setting.setting.ip-allow') }}" role="tab" 
                    aria-selected="false"
                >
                    @lang('IP Allow')
                </a>
            </li>
            <li class="nav-item" role="presentation">
                <a class="nav-link {{ request()->routeIs('setting.setting.help') ? 'active' : '' }}" 
                    href="{{ route('setting.setting.help') }}" role="tab" 
                    aria-selected="true"
                >
                    @lang('Support Account')
                </a>
            </li>
        </ul>
    </div>
</div>
<style>
    .nav-tabs .nav-link{
        border: none !important;
        font-weight: 700;
        color: #7e7e7e;
    }
    .nav-tabs .nav-link.active{
        color: #002046;
    }
    .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
        background: transparent;
    }
</style> 
<div class="row justify-content-center gy-4">
    <div class="col-12">
        <div class="page-heading mb-4">
            <h3 class="mb-2">@lang('Support Account List')</h3>
            <p>
                @lang('Manage the list of support account for accessing your support panel.')
            </p>
        </div> 
        <hr>
    </div>
    <div class="col-12">
        <div class="text-end">
            <form id="addIpForm" action="{{ route('setting.setting.help-store') }}" method="POST" enctype="multipart/form-data">
                @csrf
                <div class="input-group mb-3">
                    <input type="email" name="email_address" class="form-control" placeholder="Enter Email Address" required>
            <input type="password" class="form-control" name="password" required placeholder="Enter your password">
                    <button type="submit" class="btn btn--base">@lang('Add Account')</button>
                </div>
                
            </form>
        </div>
        
        <div class="card custom--card ip-list h-auto">
            <div class="card-header bg-white">
                <h6>@lang('Support Account')</h6>
            </div>
            <div class="card-body">
                @if($helpAddresses->isEmpty())
                <p class="text-muted text-center">@lang('No account added yet.')</p>
            @else
   
                    @foreach($helpAddresses as $account)
                        <li class="list-group-item d-flex justify-content-between align-items-center">
                            <span>{{ $account->email }}</span>
                            <form action="{{ route('setting.setting.help-destroy', $account->id) }}" method="POST">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="btn btn-danger btn-sm">
                                    @lang('Remove')
                                </button>
                            </form>
                        </li>
                    @endforeach
     
            @endif
            </div>
        </div>
    </div>
</div>
@endsection
