<div class="modal fade" id="clientModal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title fw-bold" id="clientModalTitle">Add New Client</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                
                <form id="clientForm">
                    <div class="modal-body p-4">
                        <input type="hidden" id="clientId" name="id">
                        
                        <h6 class="fw-bold mb-3 text-secondary text-uppercase" style="font-size: 0.75rem;">Company Details</h6>
                        <div class="row g-3 mb-4">
                            <div class="col-md-6">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Company Name *</label>
                                <input type="text" class="form-control" id="clientName" name="name" required placeholder="e.g. Kasapreko Distilleries">
                            </div>
                            <div class="col-md-6">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Location / Country</label>
                                <input type="text" class="form-control" id="country" name="location" placeholder="">
                            </div>
                            <div class="col-md-6">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Company Type</label>
                                <select class="form-select" id="companyType" name="company_type">
                                    <option value="" selected disabled>--Select--</option>
                                    <option value="aggregator">Aggregator/Supplier</option>
                                    <option value="enterprise">Enterprice</option>
                                    <option value="hybrid">Hybrid</option>
                                </select>
                            </div>
                            <div class="col-md-6">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Industry Type</label>
                                <select class="form-select" id="industryType" name="industry_type">
                                    <option value="" selected disabled>--Select--</option>
                                    <option value="aggregator">Aggregator SMS/USSD/Voice</option>
                                    <option value="delivery">Delivery Service</option>
                                    <option value="education">Education </option>
                                    <option value="financial">Financial Institution</option>
                                    <option value="games">Games & Gambling</option>
                                    <option value="general">General</option>
                                    <option value="government">Government</option>
                                    <option value="health">Health</option>
                                    <option value="hospitality">Hospitality</option>
                                    <option value="mobile_network_operator">Mobile Network Operator</option>
                                    <option value="ngo">NGO</option>
                                </select>
                            </div>
                            
                        </div>

                        <h6 class="fw-bold mb-3 text-secondary text-uppercase" style="font-size: 0.75rem;">Primary Contact</h6>
                        <div class="row g-3 mb-4">
                            <div class="col-md-4">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Full Name</label>
                                <input type="text" class="form-control" id="clientContact" name="contact_name" placeholder="Contact person">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Email Address *</label>
                                <input type="email" class="form-control" id="clientEmail" name="email" required placeholder="name@company.com">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Phone Number</label>
                                <input type="text" class="form-control" id="clientPhone" name="phone" placeholder="+233 ...">
                            </div>
                        </div>

                        <h6 class="fw-bold mb-3 text-secondary text-uppercase" style="font-size: 0.75rem;">Service & Billing Configuration</h6>
                        <div class="row g-3">
                            <div class="col-md-4">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Primary Service</label>
                                <select class="form-select" id="clientService" name="service_type">
                                    <option value="" selected disabled>--Select--</option>
                                    <option value="sms">SMS</option>
                                    <option value="ussd">USSD</option>
                                    <option value="airtime">Airtime</option>
                                    <option value="voice">Voice</option>
                                </select>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Billing Type</label>
                                <select class="form-select" id="clientBilling" name="billing_type">
                                    <option value="" selected disabled>--Select--</option>
                                    <option value="postpaid">Postpaid (Invoice)</option>
                                    <option value="prepaid">Prepaid (Balance)</option>
                                </select>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label text-secondary fw-semibold" style="font-size: 0.85rem;">Account Status</label>
                                <select class="form-select" id="clientStatus" name="status">
                                    <option value="" selected disabled>--Select--</option>
                                    <option value="active">Active</option>
                                    <option value="onboarding">Prospective</option>
                                    <option value="suspended">In Discussion</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer bg-light">
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
                        <button type="submit" class="btn text-white fw-bold px-4" style="background-color: #5c4df0;" id="btnSubmitClient">
                            Save Client
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>