{"id":110,"date":"2026-03-31T05:41:43","date_gmt":"2026-03-31T05:41:43","guid":{"rendered":"https:\/\/ph-portal.zyneventures.com\/?page_id=110"},"modified":"2026-03-31T05:42:34","modified_gmt":"2026-03-31T05:42:34","slug":"insurance","status":"publish","type":"page","link":"https:\/\/ph-portal.zyneventures.com\/index.php\/insurance\/","title":{"rendered":"Insurance"},"content":{"rendered":"<style>.kadence-column110_480b07-67 > .kt-inside-inner-col,.kadence-column110_480b07-67 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column110_480b07-67 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column110_480b07-67 > .kt-inside-inner-col{flex-direction:column;}.kadence-column110_480b07-67 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column110_480b07-67 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column110_480b07-67{position:relative;}@media all and (max-width: 1024px){.kadence-column110_480b07-67 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column110_480b07-67 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column110_480b07-67\"><div class=\"kt-inside-inner-col\"><style>.kb-row-layout-id110_40591a-54 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id110_40591a-54 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id110_40591a-54 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 1fr);}.kb-row-layout-id110_40591a-54 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id110_40591a-54 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id110_40591a-54 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id110_40591a-54 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column110_277ee4-10 > .kt-inside-inner-col,.kadence-column110_277ee4-10 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column110_277ee4-10 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column110_277ee4-10 > .kt-inside-inner-col{flex-direction:column;}.kadence-column110_277ee4-10 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column110_277ee4-10 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column110_277ee4-10{position:relative;}@media all and (max-width: 1024px){.kadence-column110_277ee4-10 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column110_277ee4-10 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column110_277ee4-10\"><div class=\"kt-inside-inner-col\">\n<style>\n        :root {\n        --primary-blue: #0180FF;\n        --hover-blue: #3499FF;\n        --text-dark: #212529;\n        --text-muted: #8D8C9C;\n        --border-color: #EFEFEF;\n        --success-green: #28a745;\n        --error-red: #dc3545;\n        }\n        body { \n            font-family: 'Sora', sans-serif; \n            color: var(--text-dark); \n        }\n\n        \/* Responsive Container *\/\n        .main-wrapper {\n            max-width: 100%;\n            margin: 0 auto;\n            background: white;\n        }\n\n        @media (max-width: 768px) {\n            .main-wrapper { padding: 20px 16px; }\n        }\n        \n        \/* Header Section *\/\n        .header-container { \n            display: flex; \n            justify-content: space-between; \n            align-items: center; \n            margin-bottom: 30px; \n            flex-wrap: wrap;\n            gap: 20px;\n        }\n        .title-group { \n            display: flex; \n            align-items: center; \n            gap: 10px; \n        }\n        .title-group h2 { \n            margin: 0; \n            font-size: 21px; \n            font-weight: 500; \n            text-transform: uppercase; \n            letter-spacing: 0.5px; \n        }\n        .count { \n            color: var(--text-muted); \n            font-size: 16px; \n        }\n        \n        .action-group { \n            display: flex; \n            gap: 12px; \n            align-items: center; \n            flex-wrap: wrap;\n        }\n\n        \/* Search Bar *\/\n        .search-wrapper { \n            background: #F1F3F4; \n            border-radius: 6px; \n            padding: 8px 15px; \n            display: flex; \n            align-items: center; \n            min-width: 300px; \n            gap: 10px;\n        }\n        .search-icon { width: 18px; height: 18px; color: #8D8C9C; }\n        .search-wrapper input { \n            border: none; \n            background: transparent; \n            outline: none; \n            width: 100%; \n            font-size: 12px; \n            font-family: 'Sora'; \n        }\n\n        .btn { \n            padding: 8px 15px; \n            border-radius: 6px; \n            font-size: 12px; \n            font-weight: 500; \n            cursor: pointer; \n            border: none; \n            transition: 0.2s; \n            display: inline-flex; \n            align-items: center; \n            justify-content: center;\n            gap: 8px;\n        }\n        .btn-primary { background: var(--primary-blue); color: white; }\n        .btn-primary:hover { background: #3499FF; }\n        .btn-outline { background: #F1F3F4; color: #5f6368; }\n\n        \/* Filter button - matches original design exactly *\/\n        .filter-btn {\n            background: transparent;\n            border: 1px solid;\n            border-color: #F1F3F4;\n            border-radius: 6px !important;\n            padding: 8px 12px !important;\n            cursor: pointer;\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            color: #5f6368;\n            flex-shrink: 0;\n        }\n        .filter-btn:hover { background: transparent !important; color: #5f6368; }\n        .btn-close {\n            background: transparent;\n            color: var(--text-dark);\n            border: 1px solid transparent;\n        }\n        .btn-close:hover {\n            background: transparent;\n            color: var(--text-dark);\n        }\n\n        \/* Table Design *\/\n        .table-responsive {\n            width: 100%;\n            overflow-x: auto;\n            margin-top: 20px;\n        }\n        .table-container {\n            width: 100%;\n            border-collapse: collapse;\n            min-width: 800px;\n        }\n        .table-header {\n            background-color: #f5f5f5;\n            border-bottom: 2px solid var(--border-color);\n        }\n        .table-header th {\n            text-align: left;\n            padding: 15px;\n            font-size: 12px;\n            font-weight: 500;\n            color: #212529;\n            text-transform: uppercase;\n        }\n        .table-row { border-bottom: 1px solid var(--border-color); }\n        .table-row td { \n            padding: 15px; \n            font-size: 12px;\n            color: #8D8C9C; \n            vertical-align: middle; \n        }\n\n        \/* Name Column with Logo *\/\n        .name-cell { display: flex; align-items: center; gap: 12px; }\n        .insurance-logo { \n            width: 32px; \n            height: 32px; \n            border-radius: 50%; \n            object-fit: cover; \n            background: #eee; \n        }\n        .name-info { display: flex; flex-direction: column; }\n        .name-info b { font-weight: 400; font-size: 12px; }\n        .name-info span { color: var(--text-muted); font-size: 12px; }\n\n        \/* Status Badge *\/\n        .status-badge { \n            padding: 4px 12px; \n            border-radius: 20px; \n            font-size: 12px; \n            font-weight: 500; \n            display: inline-flex; \n            align-items: center; \n            gap: 6px; \n        }\n        .status-active { background: #E6F4EA; color: var(--success-green); }\n        .status-active::before { content: '\u25cf'; font-size: 8px; }\n        .status-inactive { background: #FCE8E6; color: var(--error-red); }\n        .status-inactive::before { content: '\u25cf'; font-size: 8px; }\n        .status-badge:hover { opacity: 0.8; }\n        \n        .edit-link { \n            color: var(--text-muted); \n            cursor: pointer; \n            text-decoration: none; \n            display: flex; \n            align-items: center; \n            gap: 5px; \n            font-weight: 400;\n        }\n        .edit-link:hover { color: var(--text-muted); }\n\n        \/* Modal Styling *\/\n        .modal-overlay { \n            display: none; \n            position: fixed; \n            top: 0; \n            left: 0; \n            width: 100%; \n            height: 100%; \n            background: rgba(0,0,0,0.5); \n            z-index: 1000; \n            justify-content: center; \n            align-items: flex-start; \n            padding: 20px 0; \n            overflow-y: auto; \n        }\n        .modal-content { \n            background: white; \n            padding: 30px; \n            border-radius: 12px; \n            width: 90%; \n            max-width: 550px; \n            box-shadow: 0 20px 40px rgba(0,0,0,0.2);\n            margin: auto; \n            position: relative;\n        }\n        .modal-content h3 { margin: 0 0 25px 0; font-size: 21px; }\n        \n        .form-group { margin-bottom: 18px; }\n        .form-group label { display: block; font-size: 12px; font-weight: 500; margin-bottom: 8px; }\n        .form-group label span { color: var(--error-red); }\n        .form-control { \n            width: 100%; \n            padding: 12px; \n            border: 1px solid #E0E0E0; \n            border-radius: 8px; \n            box-sizing: border-box; \n            font-family: 'Sora'; \n            font-size: 12px;\n        }\n\n        .phone-group-row { display: flex; gap: 10px; margin-bottom: 10px; align-items: center; }\n        .btn-dynamic { \n            padding: 8px 12px; \n            border-radius: 6px; \n            font-size: 12px; \n            cursor: pointer; \n            background: white; \n            white-space: nowrap; \n        }\n        .btn-add-more {            \n            border: 1px solid var(--success-green);\n            color: var(--success-green);\n        }.btn-add-more:hover {\n            background: #2e7d32;\n            color: #fff;\n        }\n        .btn-delete {\n            border: 1px solid var(--error-red);\n            color: var(--error-red);\n        }.btn-delete:hover {\n            background: #dc3545;\n            color: #fff;\n        }\n\n        .toggle-row { \n            display: flex; \n            justify-content: space-between; \n            align-items: center; \n            background: transparent; \n            }\n        .switch { position: relative; display: inline-block; width: 40px; height: 20px; }\n        .switch input { opacity: 0; width: 0; height: 0; }\n        .slider { \n            position: absolute; \n            cursor: pointer; \n            top: 0; \n            left: 0; \n            right: 0; \n            bottom: 0; \n            background-color: #ccc; \n            transition: .4s; \n            border-radius: 34px; \n        }\n        .slider:before { \n            position: absolute; \n            content: \"\"; \n            height: 14px; \n            width: 14px; \n            left: 3px; \n            bottom: 3px; \n            background-color: white; \n            transition: .4s; \n            border-radius: 50%; \n        }\n        input:checked + .slider { background-color: var(--primary-blue); }\n        input:checked + .slider:before { transform: translateX(20px); }\n\n        \/* Pagination *\/\n        .pagination-footer { \n            margin-top: 30px; \n            display: flex; \n            justify-content: space-between; \n            align-items: center; \n            color: var(--text-muted); \n            font-size: 12px; \n            flex-wrap: wrap; \n            gap: 15px;\n        }\n        .pagination-controls { display: flex; align-items: center; gap: 12px; }\n        .page-num { \n            cursor: pointer; \n            width: 32px; \n            height: 32px; \n            display: flex; \n            align-items: center; \n            justify-content: center; \n            border-radius: 50%; \n        }\n        .page-num.active { background: var(--primary-blue); color: white; }\n        .nav-btn { cursor: pointer; font-weight: 500; color: var(--text-dark); }\n        .nav-btn.disabled { color: #ccc; pointer-events: none; }\n\n        \/* Mobile Adjustments *\/\n        @media (max-width: 600px) {\n            .header-container { \n                display: grid;\n                grid-template-columns: 1fr;\n                gap: 15px;\n            }\n            .title-group { grid-row: 1; }\n            \n            .action-group { \n                display: grid;\n                grid-template-columns: 1fr auto;\n                gap: 10px;\n                width: 100%;\n            }\n            \n            \/* Search and Filter Button on row 1 *\/\n            .search-wrapper { \n                grid-row: 1;\n                grid-column: 1;\n                min-width: unset;\n                width: 100%;\n            }\n            .filter-btn { grid-row: 1; grid-column: 2; }\n\n            \/* Action Buttons on row 2 *\/\n            .action-group .btn-primary { grid-row: 2; grid-column: 1; }\n            .action-group .download-btn { grid-row: 2; grid-column: 2; }\n        }\n\n        @media (max-width: 400px) {\n            .action-group { grid-template-columns: 1fr 1fr; }\n            .action-group .btn-primary,\n            .action-group .download-btn { font-size: 11px; padding: 8px 8px; }\n        }\n    <\/style>\n\n\n<div class=\"main-wrapper\">\n    <div class=\"header-container\">\n        <div class=\"title-group\">\n            <h2>Insurance<\/h2>\n            <span class=\"count\" id=\"insuranceCount\">(0)<\/span>\n        <\/div>\n        <div class=\"action-group\">\n            <div class=\"search-wrapper\">\n                <svg class=\"search-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><circle cx=\"11\" cy=\"11\" r=\"8\"><\/circle><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"><\/line><\/svg>\n                <input type=\"text\" id=\"searchInput\" placeholder=\"Search Insurance...\" oninput=\"handleSearch()\">\n            <\/div>\n            <button class=\"filter-btn\" title=\"Filter\">\n                <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\">\n                    <line x1=\"3\" y1=\"6\" x2=\"21\" y2=\"6\"><\/line>\n                    <line x1=\"6\" y1=\"12\" x2=\"18\" y2=\"12\"><\/line>\n                    <line x1=\"9\" y1=\"18\" x2=\"15\" y2=\"18\"><\/line>\n                <\/svg>\n            <\/button>\n            <button class=\"btn btn-primary\" onclick=\"openModal('add')\">+ Add New Insurance<\/button>\n            <button class=\"btn btn-primary download-btn\" onclick=\"downloadCSV()\">Download CSV<\/button>\n        <\/div>\n    <\/div>\n\n    <div class=\"table-responsive\">\n        <table class=\"table-container\">\n            <thead class=\"table-header\">\n                <tr>\n                    <th width=\"30\"><\/th> <th>Name<\/th>\n                    <th>Plan\/Group<\/th>\n                    <th>Website<\/th>\n                    <th>Phone<\/th>\n                    <th>Status<\/th>\n                    <th>Action<\/th>\n                <\/tr>\n            <\/thead>\n            <tbody id=\"insuranceTableBody\"><\/tbody>\n        <\/table>\n    <\/div>\n\n    <div class=\"pagination-footer\">\n        <div class=\"pagination-controls\">\n            <span id=\"prevBtn\" class=\"nav-btn\">\u00ab Previous<\/span>\n            <div id=\"pageNumbers\" style=\"display:flex; gap:8px;\"><\/div>\n            <span id=\"nextBtn\" class=\"nav-btn\">Next \u00bb<\/span>\n        <\/div>\n        <div id=\"entryInfo\">Showing 0 to 0 of 0 entries<\/div>\n    <\/div>\n<\/div>\n\n<div class=\"modal-overlay\" id=\"insuranceModal\">\n    <div class=\"modal-content\">\n        <h3 id=\"modalTitle\">New Insurance<\/h3>\n        <form id=\"insuranceForm\">\n            <input type=\"hidden\" id=\"editInsuranceId\">\n            \n            <div class=\"form-group\">\n                <label>Upload Insurance logo <span>*<\/span><\/label>\n                <input type=\"file\" id=\"insuranceLogo\" class=\"form-control\" accept=\"image\/*\" style=\"padding: 8px;\">\n            <\/div>\n\n            <div class=\"form-group\">\n                <label>Insurance Name <span>*<\/span><\/label>\n                <input type=\"text\" id=\"insuranceName\" class=\"form-control\" placeholder=\"Enter Insurance Name\" required>\n            <\/div>\n\n            <div class=\"form-group\">\n                <label>Insurance Email <span>*<\/span><\/label>\n                <input type=\"email\" id=\"insuranceEmail\" class=\"form-control\" placeholder=\"Enter Insurance email\" required>\n            <\/div>\n\n            <div class=\"form-group\">\n                <label>Insurance Website <span>*<\/span><\/label>\n                <input type=\"url\" id=\"insuranceWebsite\" class=\"form-control\" placeholder=\"https:\/\/xyz-insurance.com\" required>\n            <\/div>\n\n            <div class=\"form-group\">\n                <label>Plan\/ Group <span>*<\/span><\/label>\n                <input type=\"text\" id=\"planGroup\" class=\"form-control\" placeholder=\"Enter Plan\/ Group\" required>\n            <\/div>\n            \n            <div id=\"phoneSection\">\n                <div class=\"form-group\">\n                    <label>Phone 1 <span>*<\/span><\/label>\n                    <div class=\"phone-group-row\">\n                        <input type=\"text\" class=\"form-control insurance-phone\" placeholder=\"Phone Number\" required>\n                        <button type=\"button\" class=\"btn-dynamic btn-add-more\" onclick=\"addPhoneField()\">Add More<\/button>\n                    <\/div>\n                <\/div>\n            <\/div>\n            \n            <div class=\"toggle-row\">\n                <label style=\"font-size:12px; font-weight:400; background-color: transparent;\">Insurance Active<\/label> <label class=\"switch\">\n                    <input type=\"checkbox\" id=\"insuranceActive\" checked>\n                    <span class=\"slider\"><\/span>\n                <\/label>\n            <\/div>\n\n            <div style=\"display:flex; justify-content:flex-end; gap:12px; margin-top:30px;\">\n                <button type=\"button\" class=\"btn btn-close\" onclick=\"closeModal()\">Close<\/button>\n                <button type=\"submit\" id=\"saveBtn\" class=\"btn btn-primary\" style=\"min-width: 120px;\">Submit<\/button>\n            <\/div>\n        <\/form>\n    <\/div>\n<\/div>\n\n<script>\n    const BASE_URL = 'https:\/\/api-ph-portal.zyneventures.com\/api\/v1';\n    const ENDPOINTS = {\n        ALL: `${BASE_URL}\/insurance\/all`,\n        DETAIL: `${BASE_URL}\/insurance\/detail`,\n        ADD: `${BASE_URL}\/insurance\/add`,\n        UPDATE: `${BASE_URL}\/insurance\/update`\n    };\n\n    let allInsurance = [];\n    let paginationData = { page: 1, limit: 10, total: 0, pages: 1 };\n\n    const getAuthHeader = () => {\n        const token = localStorage.getItem(\"TOKEN\");\n        return { 'Authorization': `Bearer ${token}` };\n    };\n\n    function addPhoneField(value = \"\") {\n        const container = document.getElementById('phoneSection');\n        const group = document.createElement('div');\n        group.className = 'form-group';\n        group.innerHTML = `\n            <label>Phone Number <span>*<\/span><\/label>\n            <div class=\"phone-group-row\">\n                <input type=\"text\" class=\"form-control insurance-phone\" placeholder=\"Phone Number\" value=\"${value}\" required>\n                <button type=\"button\" class=\"btn-dynamic btn-delete\" onclick=\"this.closest('.form-group').remove()\">Delete<\/button>\n            <\/div>\n        `;\n        container.appendChild(group);\n    }\n\n    async function toggleStatus(id, currentStatus) {\n        const newStatus = currentStatus === 1 ? 0 : 1;\n        const label = newStatus === 1 ? 'Active' : 'Inactive';\n        if (!confirm(`Set this insurance to \"${label}\"?`)) return;\n\n        try {\n            const formData = new FormData();\n            formData.append('id', id);\n            formData.append('is_active', newStatus);\n\n            const res = await fetch(ENDPOINTS.UPDATE, {\n                method: 'POST',\n                headers: getAuthHeader(),\n                body: formData\n            });\n            const result = await res.json();\n            if (result.code === 200) {\n                \/\/ Update local data immediately without re-fetching\n                const item = allInsurance.find(i => i.id === id);\n                if (item) item.is_active = newStatus;\n                renderTable();\n            } else {\n                alert('Failed to update status: ' + (result.errors || result.messages?.[0] || 'Unknown error'));\n            }\n        } catch (err) {\n            console.error(err);\n            alert('Connection failed');\n        }\n    }\n\n    async function fetchInsurances(page = 1) {\n        try {\n            const res = await fetch(`${ENDPOINTS.ALL}?page=${page}`, { \n                headers: { ...getAuthHeader(), 'Content-Type': 'application\/json' } \n            });\n            const result = await res.json();\n            if (result.code === 200) {\n                allInsurance = result.data.data;\n                paginationData.total = result.data.total;\n                paginationData.page = result.data.page;\n                paginationData.pages = Math.ceil(result.data.total \/ result.data.perPage);\n                renderTable();\n                renderPagination();\n            }\n        } catch (err) { console.error(\"Fetch Error:\", err); }\n    }\n\n    function renderTable(filtered = null) {\n        const tbody = document.getElementById('insuranceTableBody');\n        const list = filtered || allInsurance;\n        document.getElementById('insuranceCount').textContent = `(${paginationData.total})`;\n        \n        const start = paginationData.total === 0 ? 0 : ((paginationData.page - 1) * 10) + 1;\n        const end = Math.min(paginationData.page * 10, paginationData.total);\n        document.getElementById('entryInfo').textContent = `Showing ${start} to ${end} of ${paginationData.total} entries`;\n\n        tbody.innerHTML = '';\n        list.forEach(item => {\n            const isActive = item.is_active == 1;\n            const row = document.createElement('tr');\n            row.className = 'table-row';\n            row.innerHTML = `\n                <td><input type=\"checkbox\"><\/td>\n                <td>\n                    <div class=\"name-cell\">\n                        <img decoding=\"async\" src=\"${item.logo || 'https:\/\/via.placeholder.com\/32'}\" class=\"insurance-logo\" alt=\"logo\">\n                        <div class=\"name-info\">\n                            <b>${item.name || 'N\/A'}<\/b>\n                            <span>${item.email || 'N\/A'}<\/span>\n                        <\/div>\n                    <\/div>\n                <\/td>\n                <td>${item.plan_group || 'N\/A'}<\/td>\n                <td><a href=\"${item.website}\" target=\"_blank\" style=\"color: #8D8C9C; text-decoration:none;\">${item.website || 'N\/A'}<\/a><\/td>\n                <td>${item.phone || 'N\/A'}<\/td>\n                <td>\n                    <span class=\"status-badge ${isActive ? 'status-active' : 'status-inactive'}\" \n                          style=\"cursor:pointer;\" \n                          title=\"Click to toggle status\"\n                          onclick=\"toggleStatus(${item.id}, ${isActive ? 1 : 0})\">\n                        ${isActive ? 'Active' : 'Inactive'}\n                    <\/span>\n                <\/td>\n                <td>\n                    <a class=\"edit-link\" onclick=\"openModal('edit', ${item.id})\">\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\n                        Edit\n                    <\/a>\n                <\/td>\n            `;\n            tbody.appendChild(row);\n        });\n    }\n\n    async function openModal(mode, id = null) {\n        const modal = document.getElementById('insuranceModal');\n        const form = document.getElementById('insuranceForm');\n        form.reset();\n        \n        document.getElementById('phoneSection').innerHTML = `\n            <div class=\"form-group\">\n                <label>Phone 1 <span>*<\/span><\/label>\n                <div class=\"phone-group-row\">\n                    <input type=\"text\" class=\"form-control insurance-phone\" placeholder=\"Phone Number\" required>\n                    <button type=\"button\" class=\"btn-dynamic btn-add-more\" onclick=\"addPhoneField()\">Add More<\/button>\n                <\/div>\n            <\/div>\n        `;\n        \n        if (mode === 'edit') {\n            document.getElementById('modalTitle').textContent = 'Update Insurance';\n            try {\n                const res = await fetch(ENDPOINTS.DETAIL, { \n                    method: 'POST', \n                    headers: { ...getAuthHeader(), 'Content-Type': 'application\/json' }, \n                    body: JSON.stringify({ id }) \n                });\n                const result = await res.json();\n                const data = result.data;\n                \n                document.getElementById('editInsuranceId').value = data.id;\n                document.getElementById('insuranceName').value = data.name || '';\n                document.getElementById('insuranceEmail').value = data.email || '';\n                document.getElementById('insuranceWebsite').value = data.website || '';\n                document.getElementById('planGroup').value = data.plan_group || '';\n                document.getElementById('insuranceActive').checked = (data.is_active == 1);\n                \n                if (data.phone) {\n                    const phones = data.phone.split(' | ');\n                    document.querySelector('.insurance-phone').value = phones[0];\n                    for (let i = 1; i < phones.length; i++) addPhoneField(phones[i]);\n                }\n            } catch (err) { console.error(err); }\n        } else {\n            document.getElementById('modalTitle').textContent = 'New Insurance';\n            document.getElementById('editInsuranceId').value = '';\n        }\n        modal.style.display = 'flex';\n        document.body.style.overflow = 'hidden';\n    }\n\n    function closeModal() { \n        document.getElementById('insuranceModal').style.display = 'none'; \n        document.body.style.overflow = 'auto'; \n    }\n\n    document.getElementById('insuranceForm').onsubmit = async (e) => {\n        e.preventDefault();\n        const btn = document.getElementById('saveBtn');\n        const id = document.getElementById('editInsuranceId').value;\n        \n        btn.disabled = true;\n        btn.textContent = 'Submitting...';\n\n        const formData = new FormData();\n        formData.append('name', document.getElementById('insuranceName').value);\n        formData.append('email', document.getElementById('insuranceEmail').value);\n        formData.append('website', document.getElementById('insuranceWebsite').value);\n        formData.append('plan_group', document.getElementById('planGroup').value);\n        formData.append('is_active', document.getElementById('insuranceActive').checked ? 1 : 0);\n        \n        const fileInput = document.getElementById('insuranceLogo');\n        if (fileInput.files[0]) {\n            formData.append('file', fileInput.files[0]);\n        }\n\n        const phoneInputs = document.querySelectorAll('.insurance-phone');\n        const phoneString = Array.from(phoneInputs).map(i => i.value).join(' | ');\n        formData.append('phone', phoneString);\n\n        if (id) formData.append('id', id);\n\n        const url = id ? ENDPOINTS.UPDATE : ENDPOINTS.ADD;\n\n        try {\n            const res = await fetch(url, {\n                method: 'POST', \n                headers: getAuthHeader(),\n                body: formData\n            });\n            const result = await res.json();\n            if (result.code === 200) { \n                alert(result.messages[0]);\n                closeModal(); \n                fetchInsurances(paginationData.page); \n            } else {\n                alert(\"Error: \" + (result.errors || \"Something went wrong\"));\n            }\n        } catch (err) { \n            console.error(err); \n            alert(\"Connection failed\");\n        } finally {\n            btn.disabled = false;\n            btn.textContent = 'Submit';\n        }\n    };\n\n    function renderPagination() {\n        const container = document.getElementById('pageNumbers');\n        container.innerHTML = '';\n        document.getElementById('prevBtn').onclick = () => fetchInsurances(paginationData.page - 1);\n        document.getElementById('prevBtn').className = paginationData.page === 1 ? 'nav-btn disabled' : 'nav-btn';\n        \n        for (let i = 1; i <= paginationData.pages; i++) {\n            const span = document.createElement('span');\n            span.className = i === paginationData.page ? 'page-num active' : 'page-num';\n            span.textContent = i;\n            span.onclick = () => fetchInsurances(i);\n            container.appendChild(span);\n        }\n        \n        document.getElementById('nextBtn').onclick = () => fetchInsurances(paginationData.page + 1);\n        document.getElementById('nextBtn').className = (paginationData.page === paginationData.pages || paginationData.pages === 0) ? 'nav-btn disabled' : 'nav-btn';\n    }\n\n    function handleSearch() {\n        const q = document.getElementById('searchInput').value.toLowerCase();\n        const filtered = allInsurance.filter(item => \n            (item.name && item.name.toLowerCase().includes(q)) || \n            (item.email && item.email.toLowerCase().includes(q))\n        );\n        renderTable(filtered);\n    }\n\n    function downloadCSV() {\n        if (!allInsurance || allInsurance.length === 0) {\n            alert('No data available to download.');\n            return;\n        }\n        const headers = ['Name', 'Email', 'Plan\/Group', 'Website', 'Phone', 'Status'];\n        const rows = allInsurance.map(item => [\n            item.name || 'N\/A',\n            item.email || 'N\/A',\n            item.plan_group || 'N\/A',\n            item.website || 'N\/A',\n            item.phone || 'N\/A',\n            item.is_active == 1 ? 'Active' : 'Inactive'\n        ]);\n        const csvContent = [headers, ...rows]\n            .map(row => row.map(val => `\"${String(val).replace(\/\"\/g, '\"\"')}\"`).join(','))\n            .join('\\n');\n        const blob = new Blob([csvContent], { type: 'text\/csv;charset=utf-8;' });\n        const url = URL.createObjectURL(blob);\n        const a = document.createElement('a');\n        a.href = url;\n        a.download = 'insurance.csv';\n        a.click();\n        URL.revokeObjectURL(url);\n    }\n\n    fetchInsurances();\n<\/script>\n<\/div><\/div>\n\n<\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Insurance (0) + Add New Insurance Download CSV Name Plan\/Group Website Phone Status Action \u00ab Previous Next \u00bb Showing 0 to 0 of 0 entries New Insurance Upload Insurance logo * Insurance Name * Insurance Email * Insurance Website * Plan\/ Group * Phone 1 * Add More Insurance Active Close Submit<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-110","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ph-portal.zyneventures.com\/index.php\/wp-json\/wp\/v2\/pages\/110","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ph-portal.zyneventures.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ph-portal.zyneventures.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ph-portal.zyneventures.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ph-portal.zyneventures.com\/index.php\/wp-json\/wp\/v2\/comments?post=110"}],"version-history":[{"count":3,"href":"https:\/\/ph-portal.zyneventures.com\/index.php\/wp-json\/wp\/v2\/pages\/110\/revisions"}],"predecessor-version":[{"id":113,"href":"https:\/\/ph-portal.zyneventures.com\/index.php\/wp-json\/wp\/v2\/pages\/110\/revisions\/113"}],"wp:attachment":[{"href":"https:\/\/ph-portal.zyneventures.com\/index.php\/wp-json\/wp\/v2\/media?parent=110"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}