@extends('backEnd.layouts.master')
@section('title', 'SMS Settings')

@section('content')
<div class="page-header">
    <div>
        <h4><i class="fas fa-sms me-2 text-success"></i>SMS Settings</h4>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-0">
                <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Dashboard</a></li>
                <li class="breadcrumb-item active">SMS Settings</li>
            </ol>
        </nav>
    </div>
</div>

<form action="{{ route('admin.settings.sms.update') }}" method="POST">
    @csrf
    <div class="row g-4">
        <div class="col-md-8">
            <div class="admin-card mb-4">
                <div class="admin-card-header">
                    <h5><i class="fas fa-key me-2"></i>IT Square BD SMS Gateway</h5>
                </div>
                <div class="admin-card-body">
                    <div class="alert alert-info">
                        <i class="fas fa-info-circle me-2"></i>
                        SMS Gateway provided by <strong>IT Square BD</strong>. Contact: <a href="mailto:info@itsquarebd.com">info@itsquarebd.com</a>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-600">Enable SMS Gateway</label>
                        <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox" name="sms_enabled" id="smsEnabled"
                                   value="1" {{ env('SMS_GATEWAY_ENABLED') == 'true' ? 'checked' : '' }}>
                            <label class="form-check-label" for="smsEnabled">Enable SMS sending</label>
                        </div>
                    </div>

                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label">API Key</label>
                            <input type="text" name="api_key" class="form-control font-monospace"
                                   value="{{ env('SMS_GATEWAY_API_KEY') }}"
                                   placeholder="Your IT Square BD API Key">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label">Sender ID</label>
                            <input type="text" name="sender_id" class="form-control"
                                   value="{{ env('SMS_GATEWAY_SENDER_ID') }}"
                                   placeholder="e.g. MASTERBD">
                        </div>
                    </div>
                </div>
            </div>

            <div class="admin-card">
                <div class="admin-card-header">
                    <h5><i class="fas fa-bell me-2"></i>SMS Triggers</h5>
                </div>
                <div class="admin-card-body">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <div class="form-check form-switch mb-2">
                                <input class="form-check-input" type="checkbox" name="sms_order_confirm" id="smsOrderConfirm"
                                       value="1" {{ $setting->sms_order_confirm ? 'checked' : '' }}>
                                <label class="form-check-label" for="smsOrderConfirm">
                                    <strong>Order Confirmation SMS</strong>
                                    <div class="text-muted small">Customer পাবে যখন order confirm হবে</div>
                                </label>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-check form-switch mb-2">
                                <input class="form-check-input" type="checkbox" name="sms_status_update" id="smsStatusUpdate"
                                       value="1" {{ $setting->sms_status_update ? 'checked' : '' }}>
                                <label class="form-check-label" for="smsStatusUpdate">
                                    <strong>Status Update SMS</strong>
                                    <div class="text-muted small">Customer পাবে status change হলে</div>
                                </label>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-check form-switch">
                                <input class="form-check-input" type="checkbox" name="sms_forgot_pass" id="smsForgotPass"
                                       value="1" {{ $setting->sms_forgot_pass ?? false ? 'checked' : '' }}>
                                <label class="form-check-label" for="smsForgotPass">
                                    <strong>Password Reset OTP</strong>
                                    <div class="text-muted small">Customer password reset-এ OTP</div>
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="admin-card mb-4">
                <div class="admin-card-header"><h5>SMS Templates</h5></div>
                <div class="admin-card-body">
                    <div class="mb-3">
                        <label class="form-label fw-600 small">Order Confirm Template</label>
                        <textarea class="form-control form-control-sm" rows="3" disabled>আপনার অর্ডার #{invoice_id} কনফার্ম হয়েছে! মোট: ৳{amount}। ধন্যবাদ!</textarea>
                    </div>
                    <div class="mb-3">
                        <label class="form-label fw-600 small">Shipped Template</label>
                        <textarea class="form-control form-control-sm" rows="3" disabled>আপনার অর্ডার #{invoice_id} শিপ হয়েছে! ট্র্যাকিং: {consignment_id}</textarea>
                    </div>
                    <div class="alert alert-warning p-2 small mb-0">
                        <i class="fas fa-exclamation-triangle me-1"></i>
                        Template customization coming soon
                    </div>
                </div>
            </div>

            <div class="admin-card">
                <div class="admin-card-header"><h5>Test SMS</h5></div>
                <div class="admin-card-body">
                    <div class="mb-2">
                        <input type="text" id="testPhone" class="form-control form-control-sm" placeholder="01XXXXXXXXX">
                    </div>
                    <button type="button" class="btn btn-outline-primary btn-sm w-100" onclick="sendTestSms()">
                        <i class="fas fa-paper-plane me-1"></i>Send Test SMS
                    </button>
                    <div id="testSmsResult" class="mt-2"></div>
                </div>
            </div>
        </div>
    </div>

    <div class="mt-4">
        <button type="submit" class="btn btn-primary">
            <i class="fas fa-save me-1"></i>Save SMS Settings
        </button>
    </div>
</form>
@endsection

@push('scripts')
<script>
function sendTestSms() {
    const phone = document.getElementById('testPhone').value;
    if (!phone) { alert('Phone number required!'); return; }
    // TODO: API call to test SMS
    document.getElementById('testSmsResult').innerHTML = '<div class="alert alert-info p-2 small">Test SMS feature coming soon</div>';
}
</script>
@endpush