{"id":19527,"date":"2025-12-17T11:53:55","date_gmt":"2025-12-17T06:23:55","guid":{"rendered":"https:\/\/demo.vleafy.com\/ibc2\/?page_id=19527"},"modified":"2025-12-17T13:07:40","modified_gmt":"2025-12-17T07:37:40","slug":"industries","status":"publish","type":"page","link":"https:\/\/demo.vleafy.com\/ibc2\/industries\/","title":{"rendered":"Industries"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"19527\" class=\"elementor elementor-19527\">\n\t\t\t\t<div class=\"elementor-element elementor-element-687dc95 e-flex e-con-boxed e-con e-parent \" data-id=\"687dc95\" data-element_type=\"container\">\t\t\t<div class=\"e-con-inner\">\r\n\t\t\t\t<div class=\"elementor-element elementor-element-721ba2b elementor-widget elementor-widget-pxl_heading\" data-id=\"721ba2b\" data-element_type=\"widget\" data-widget_type=\"pxl_heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div id=\"pxl-pxl_heading-721ba2b-9729\" class=\"pxl-heading pxl-heading--tcustom\">\n\t<div class=\"pxl-heading--inner\">\n\n\t\t\n\t<h3 class=\"pxl-item--title   pxl-color-style-1 wow fadeInUp\" data-wow-delay=\"300ms\">\n\n\n\tIMPA Industries\t\t\t\n\t<\/h3>\n\n<\/div>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0697cc9 elementor-widget elementor-widget-html\" data-id=\"0697cc9\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Industry Members<\/title>\r\n    <style>\r\n\r\n        .ind-table-container {\r\n            max-width: 90%;\r\n            margin: 0 auto;\r\n        }\r\n\r\n        .ind-table-header {\r\n            text-align: center;\r\n            margin-bottom: 50px;\r\n        }\r\n\r\n        .ind-table-title {\r\n            color: #fff;\r\n            font-size: 3rem;\r\n            font-weight: 700;\r\n            text-transform: uppercase;\r\n            letter-spacing: 3px;\r\n            margin-bottom: 15px;\r\n            background: linear-gradient(135deg, #8a2be2, #ff1493);\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n            background-clip: text;\r\n        }\r\n\r\n        .ind-table-subtitle {\r\n            color: rgba(255, 255, 255, 0.7);\r\n            font-size: 1.2rem;\r\n        }\r\n\r\n        .ind-table-wrapper {\r\n            background: rgba(26, 11, 46, 0.6);\r\n            border-radius: 20px;\r\n            overflow: hidden;\r\n            border: 2px solid rgba(138, 43, 226, 0.3);\r\n        }\r\n\r\n        .ind-table-row {\r\n            display: grid;\r\n            grid-template-columns: 80px 60px 1fr 150px 180px 150px;\r\n            align-items: center;\r\n            gap: 25px;\r\n            padding: 25px 35px;\r\n            border-bottom: 1px solid rgba(138, 43, 226, 0.2);\r\n            transition: all 0.3s;\r\n            position: relative;\r\n        }\r\n\r\n        .ind-table-row:hover {\r\n            background: rgba(138, 43, 226, 0.1);\r\n            border-left: 4px solid #ff1493;\r\n            padding-left: 31px;\r\n        }\r\n\r\n        .ind-table-row:last-child {\r\n            border-bottom: none;\r\n        }\r\n\r\n        .ind-table-number-col {\r\n            color: rgba(255, 255, 255, 0.5);\r\n            font-size: 1.2rem;\r\n            font-weight: 700;\r\n            text-align: center;\r\n        }\r\n\r\n        .ind-table-icon-col {\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n        }\r\n\r\n        .ind-table-icon {\r\n            width: 60px;\r\n            height: 60px;\r\n            border-radius: 50%;\r\n            background: linear-gradient(135deg, #8a2be2, #ff1493);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .ind-table-icon svg {\r\n            width: 30px;\r\n            height: 30px;\r\n            fill: #fff;\r\n        }\r\n\r\n        .ind-table-name-col {\r\n            color: #fff;\r\n            font-size: 1.2rem;\r\n            font-weight: 600;\r\n        }\r\n\r\n        .ind-table-members-col {\r\n            color: #fff;\r\n            font-size: 1.3rem;\r\n            font-weight: 700;\r\n            text-align: center;\r\n        }\r\n\r\n        .ind-table-value-col {\r\n            color: #fff;\r\n            font-size: 1.3rem;\r\n            font-weight: 700;\r\n            text-align: center;\r\n            background: linear-gradient(135deg, #8a2be2, #ff1493);\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n            background-clip: text;\r\n        }\r\n\r\n        .ind-table-action-col {\r\n            display: flex;\r\n            justify-content: center;\r\n        }\r\n\r\n        .ind-table-view-btn {\r\n            padding: 12px 30px;\r\n            background: transparent;\r\n            border: 2px solid #8a2be2;\r\n            border-radius: 50px;\r\n            color: #fff;\r\n            font-size: 0.95rem;\r\n            font-weight: 600;\r\n            cursor: pointer;\r\n            transition: all 0.3s;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1px;\r\n            white-space: nowrap;\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 8px;\r\n        }\r\n\r\n        .ind-table-view-btn:hover {\r\n            background: linear-gradient(135deg, #8a2be2, #ff1493);\r\n            border-color: #ff1493;\r\n            transform: translateX(5px);\r\n        }\r\n\r\n        .ind-table-view-btn svg {\r\n            width: 16px;\r\n            height: 16px;\r\n            fill: currentColor;\r\n        }\r\n\r\n        \/* Modal Styles *\/\r\n        .ind-table-modal {\r\n            display: none;\r\n            position: fixed;\r\n            top: 0;\r\n            left: 0;\r\n            width: 100%;\r\n            height: 100%;\r\n            background: rgba(0, 0, 0, 0.8);\r\n            z-index: 1001;\r\n            padding: 20px;\r\n            overflow-y: auto;\r\n            animation: ind-table-fadeIn 0.3s;\r\n        }\r\n\r\n        .ind-table-modal.ind-table-active {\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n        }\r\n\r\n        @keyframes ind-table-fadeIn {\r\n            from { opacity: 0; }\r\n            to { opacity: 1; }\r\n        }\r\n\r\n        .ind-table-modal-content {\r\n            background: linear-gradient(145deg, #2d1b4e, #1a0b2e);\r\n            border: 2px solid rgba(138, 43, 226, 0.5);\r\n            border-radius: 25px;\r\n            max-width: 900px;\r\n            width: 100%;\r\n            max-height: 90vh;\r\n            overflow: hidden;\r\n            display: flex;\r\n            flex-direction: column;\r\n            animation: ind-table-slideUp 0.3s;\r\n        }\r\n\r\n        @keyframes ind-table-slideUp {\r\n            from { \r\n                opacity: 0;\r\n                transform: translateY(50px);\r\n            }\r\n            to { \r\n                opacity: 1;\r\n                transform: translateY(0);\r\n            }\r\n        }\r\n\r\n        .ind-table-modal-header {\r\n            background: linear-gradient(135deg, rgba(138, 43, 226, 0.3), rgba(255, 20, 147, 0.3));\r\n            padding: 30px;\r\n            border-bottom: 2px solid rgba(138, 43, 226, 0.4);\r\n            position: relative;\r\n        }\r\n\r\n        .ind-table-modal-title {\r\n            color: #fff;\r\n            font-size: 2rem;\r\n            font-weight: 700;\r\n            margin-bottom: 15px;\r\n        }\r\n\r\n        .ind-table-modal-stats {\r\n            display: flex;\r\n            gap: 30px;\r\n            flex-wrap: wrap;\r\n        }\r\n\r\n        .ind-table-modal-stat {\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        .ind-table-modal-stat-label {\r\n            color: rgba(255, 255, 255, 0.6);\r\n            font-size: 0.85rem;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1px;\r\n            margin-bottom: 5px;\r\n        }\r\n\r\n        .ind-table-modal-stat-value {\r\n            color: #fff;\r\n            font-size: 1.5rem;\r\n            font-weight: 700;\r\n        }\r\n\r\n        .ind-table-close-btn {\r\n            position: absolute;\r\n            top: 20px;\r\n            right: 20px;\r\n            width: 40px;\r\n            height: 40px;\r\n            background: rgba(255, 255, 255, 0.1);\r\n            border: 2px solid rgba(255, 255, 255, 0.3);\r\n            border-radius: 50%;\r\n            color: #fff;\r\n            font-size: 1.5rem;\r\n            cursor: pointer;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            transition: all 0.3s;\r\n        }\r\n\r\n        .ind-table-close-btn:hover {\r\n            background: rgba(255, 20, 147, 0.3);\r\n            border-color: #ff1493;\r\n            transform: rotate(90deg);\r\n        }\r\n\r\n        .ind-table-modal-body {\r\n            padding: 30px;\r\n            overflow-y: auto;\r\n            flex: 1;\r\n        }\r\n\r\n        .ind-table-search-box {\r\n            margin-bottom: 25px;\r\n        }\r\n\r\n        .ind-table-search-input {\r\n            width: 100%;\r\n            padding: 15px 20px;\r\n            background: rgba(138, 43, 226, 0.1);\r\n            border: 2px solid rgba(138, 43, 226, 0.3);\r\n            border-radius: 50px;\r\n            color: #fff;\r\n            font-size: 1rem;\r\n            outline: none;\r\n            transition: all 0.3s;\r\n        }\r\n\r\n        .ind-table-search-input::placeholder {\r\n            color: rgba(255, 255, 255, 0.5);\r\n        }\r\n\r\n        .ind-table-search-input:focus {\r\n            background: rgba(138, 43, 226, 0.2);\r\n            border-color: #ff1493;\r\n        }\r\n\r\n        .ind-table-list {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\r\n            gap: 15px;\r\n\t\t\tcounter-reset: member-counter;\r\n        }\r\n\r\n        .ind-table-list-item {\r\n            background: linear-gradient(145deg, rgba(138, 43, 226, 0.1), rgba(75, 0, 130, 0.1));\r\n            border: 1px solid rgba(138, 43, 226, 0.3);\r\n            border-radius: 12px;\r\n            padding: 15px 20px;\r\n            color: rgba(255, 255, 255, 0.9);\r\n            font-size: 0.95rem;\r\n            transition: all 0.3s;\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 12px;\r\n        }\r\n\r\n        .ind-table-list-item:hover {\r\n            background: linear-gradient(145deg, rgba(138, 43, 226, 0.2), rgba(75, 0, 130, 0.2));\r\n            border-color: #ff1493;\r\n            transform: translateX(5px);\r\n        }\r\n\r\n        .ind-table-list-item::before {\r\n            counter-increment: member-counter;\r\n\t\t\tcontent: counter(member-counter);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            width: 24px;\r\n            height: 24px;\r\n            background: linear-gradient(135deg, #8a2be2, #ff1493);\r\n            border-radius: 50%;\r\n            color: #fff;\r\n            font-size: 0.8rem;\r\n            font-weight: 700;\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .ind-table-no-results {\r\n            text-align: center;\r\n            color: rgba(255, 255, 255, 0.6);\r\n            padding: 40px;\r\n            font-size: 1.1rem;\r\n        }\r\n\r\n        @media (max-width: 1200px) {\r\n            .ind-table-row {\r\n                grid-template-columns: 60px 50px 1fr 120px 140px 120px;\r\n                gap: 15px;\r\n                padding: 20px 25px;\r\n            }\r\n\r\n            .ind-table-icon {\r\n                width: 50px;\r\n                height: 50px;\r\n            }\r\n\r\n            .ind-table-icon svg {\r\n                width: 25px;\r\n                height: 25px;\r\n            }\r\n\r\n            .ind-table-name-col {\r\n                font-size: 1.1rem;\r\n            }\r\n\r\n            .ind-table-members-col,\r\n            .ind-table-value-col {\r\n                font-size: 1.1rem;\r\n            }\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            .ind-table-title {\r\n                font-size: 2rem;\r\n            }\r\n\r\n            .ind-table-row {\r\n                grid-template-columns: 1fr;\r\n                gap: 15px;\r\n                padding: 20px;\r\n            }\r\n\r\n            .ind-table-number-col {\r\n                position: absolute;\r\n                top: 20px;\r\n                right: 20px;\r\n                font-size: 1rem;\r\n            }\r\n\r\n            .ind-table-icon-col {\r\n                justify-content: flex-start;\r\n            }\r\n\r\n            .ind-table-name-col,\r\n            .ind-table-members-col,\r\n            .ind-table-value-col {\r\n                text-align: left;\r\n            }\r\n\r\n            .ind-table-action-col {\r\n                justify-content: flex-start;\r\n            }\r\n\r\n            .ind-table-list {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            .ind-table-modal-title {\r\n                font-size: 1.5rem;\r\n            }\r\n        }\r\n\r\n        \/* Scrollbar styling *\/\r\n        .ind-table-modal-body::-webkit-scrollbar {\r\n            width: 8px;\r\n        }\r\n\r\n        .ind-table-modal-body::-webkit-scrollbar-track {\r\n            background: rgba(138, 43, 226, 0.1);\r\n        }\r\n\r\n        .ind-table-modal-body::-webkit-scrollbar-thumb {\r\n            background: linear-gradient(135deg, #8a2be2, #ff1493);\r\n            border-radius: 10px;\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n    <div class=\"ind-table-container\">\r\n      \r\n\r\n        <div class=\"ind-table-wrapper\" id=\"industryTable\"><\/div>\r\n    <\/div>\r\n\r\n    <!-- Modal -->\r\n    <div class=\"ind-table-modal\" id=\"memberModal\">\r\n        <div class=\"ind-table-modal-content\">\r\n            <div class=\"ind-table-modal-header\">\r\n                <button class=\"ind-table-close-btn\" onclick=\"closeModal()\">\u00d7<\/button>\r\n                <h2 class=\"ind-table-modal-title\" id=\"modalTitle\"><\/h2>\r\n                <div class=\"ind-table-modal-stats\">\r\n                    <div class=\"ind-table-modal-stat\">\r\n                        <div class=\"ind-table-modal-stat-label\">Total Members<\/div>\r\n                        <div class=\"ind-table-modal-stat-value\" id=\"modalMembers\"><\/div>\r\n                    <\/div>\r\n                    <div class=\"ind-table-modal-stat\">\r\n                        <div class=\"ind-table-modal-stat-label\">Business Value<\/div>\r\n                        <div class=\"ind-table-modal-stat-value\" id=\"modalValue\"><\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"ind-table-modal-body\">\r\n               \r\n                <div class=\"ind-table-list\" id=\"memberList\"><\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        \/\/ Industry icons (SVG paths)\r\n        const industryIcons = {\r\n            financial: '<rect x=\"2\" y=\"6\" width=\"20\" height=\"12\" rx=\"2\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\"\/> <path d=\"M9 10h6M9 12h6M9 14h6\" stroke=\"#fff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/> <path d=\"M14 10c-1.5 0-3 .8-3 2s1.5 2 3 2\" fill=\"none\" stroke=\"#fff\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/>',\r\n            food: '<path d=\"M18.06 22.99h1.66c.84 0 1.53-.64 1.63-1.46L23 5.05h-5V1h-1.97v4.05h-4.97l.3 2.34c1.71.47 3.31 1.32 4.27 2.26 1.44 1.42 2.43 2.89 2.43 5.29v8.05zM1 21.99V21h15.03v.99c0 .55-.45 1-1.01 1H2.01c-.56 0-1.01-.45-1.01-1zm15.03-7c0-8-15.03-8-15.03 0h15.03zM1.02 17h15v2h-15z\"\/>',\r\n            manufacturing: '<path d=\"M19.14 12.94c.04-.31.06-.63.06-.94s-.02-.63-.06-.94l2.03-1.58a.5.5 0 0 0 .12-.64l-1.92-3.32a.5.5 0 0 0-.6-.22l-2.39.96a7.07 7.07 0 0 0-1.63-.94l-.36-2.54a.5.5 0 0 0-.5-.42h-3.84a.5.5 0 0 0-.5.42l-.36 2.54c-.58.23-1.12.54-1.63.94l-2.39-.96a.5.5 0 0 0-.6.22L2.68 8.84a.5.5 0 0 0 .12.64l2.03 1.58c-.04.31-.06.63-.06.94s.02.63.06.94L2.8 14.52a.5.5 0 0 0-.12.64l1.92 3.32c.13.22.39.31.6.22l2.39-.96c.5.4 1.05.71 1.63.94l.36 2.54c.05.24.26.42.5.42h3.84c.24 0 .45-.18.5-.42l.36-2.54c.58-.23 1.12-.54 1.63-.94l2.39.96c.22.09.47 0 .6-.22l1.92-3.32a.5.5 0 0 0-.12-.64l-2.03-1.58zM12 15.5A3.5 3.5 0 1 1 12 8a3.5 3.5 0 0 1 0 7.5z\"\/>',\r\n            travel: '<path d=\"M1 7h12v8H1z\"\/> <path d=\"M13 10h5l3 3v2h-8z\"\/> <circle cx=\"5\" cy=\"17\" r=\"2\"\/> <circle cx=\"16\" cy=\"17\" r=\"2\"\/>',\r\n            medicine: '<path d=\"M19 3H5c-1.1 0-1.99.9-1.99 2L3 19c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-1 11h-4v4h-4v-4H6v-4h4V6h4v4h4v4z\"\/>',\r\n            retail: '<path d=\"M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.58-6.49c.08-.14.12-.31.12-.48 0-.55-.45-1-1-1H5.21l-.94-2H1zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2z\"\/>',\r\n            education: '<path d=\"M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82zM12 3L1 9l11 6 9-4.91V17h2V9L12 3z\"\/>'\r\n        };\r\n\r\n        \/\/ Industry data\r\n        const industryData = [\r\n    {\r\n        id: 1,\r\n        name: \"Financial Sector\",\r\n        icon: \"financial\",\r\n        members: 1200,\r\n        businessValue: \"1000 Cr\",\r\n        memberList: Array(40).fill(\"Company Name\")\r\n    },\r\n    {\r\n        id: 2,\r\n        name: \"Food and Hospitality Industry\",\r\n        icon: \"food\",\r\n        members: 500,\r\n        businessValue: \"800 Cr\",\r\n        memberList: Array(30).fill(\"Company Name\")\r\n    },\r\n    {\r\n        id: 3,\r\n        name: \"Manufacturing Industry\",\r\n        icon: \"manufacturing\",\r\n        members: 700,\r\n        businessValue: \"600 Cr\",\r\n        memberList: Array(30).fill(\"Company Name\")\r\n    },\r\n    {\r\n        id: 4,\r\n        name: \"Travel, Transport & Logistics\",\r\n        icon: \"travel\",\r\n        members: 500,\r\n        businessValue: \"500 Cr\",\r\n        memberList: Array(30).fill(\"Company Name\")\r\n    },\r\n    {\r\n        id: 5,\r\n        name: \"Medicine & Hospital Industry\",\r\n        icon: \"medicine\",\r\n        members: 800,\r\n        businessValue: \"400 Cr\",\r\n        memberList: Array(30).fill(\"Company Name\")\r\n    },\r\n    {\r\n        id: 6,\r\n        name: \"Consumer Products and Retail\",\r\n        icon: \"retail\",\r\n        members: 700,\r\n        businessValue: \"800 Cr\",\r\n        memberList: Array(30).fill(\"Company Name\")\r\n    },\r\n    {\r\n        id: 7,\r\n        name: \"Education Industry\",\r\n        icon: \"education\",\r\n        members: 500,\r\n        businessValue: \"200 Cr\",\r\n        memberList: Array(30).fill(\"Company Name\")\r\n    }\r\n];\r\n\r\n\r\n        \/\/ Render industry table rows\r\n        function renderIndustryTable() {\r\n            const table = document.getElementById('industryTable');\r\n\t\t\t\r\n\t\t\tconst headerRow = document.createElement('div');\r\n\t\t\theaderRow.className = 'ind-table-row ind-table-header-row'; \/\/ Use the same row class + header modifier if needed\r\n\r\n\t\t\theaderRow.innerHTML = `\r\n\t\t\t\t<div class=\"ind-table-number-col\"> <\/div>\r\n\t\t\t\t<div class=\"ind-table-icon-col\"><\/div>\r\n\t\t\t\t<div class=\"ind-table-name-col\">Industry<\/div>\r\n\t\t\t\t<div class=\"ind-table-members-col\">Members<\/div>\r\n\t\t\t\t<div class=\"ind-table-members-col\">Business Value<\/div>\r\n\t\t\t\t<div class=\"ind-table-action-col\">Action<\/div>\r\n\t\t\t`;\r\n\r\n\t\t\t\/\/ Append the header first\r\n\t\t\ttable.appendChild(headerRow);\r\n\r\n            \r\n            industryData.forEach(industry => {\r\n                const row = document.createElement('div');\r\n                row.className = 'ind-table-row';\r\n                \r\n                row.innerHTML = `\r\n                    <div class=\"ind-table-number-col\">${industry.id}<\/div>\r\n                    \r\n                    <div class=\"ind-table-icon-col\">\r\n                        <div class=\"ind-table-icon\">\r\n                            <svg viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n                                ${industryIcons[industry.icon]}\r\n                            <\/svg>\r\n                        <\/div>\r\n                    <\/div>\r\n                    \r\n                    <div class=\"ind-table-name-col\">${industry.name}<\/div>\r\n                    \r\n                    <div class=\"ind-table-members-col\">${industry.members}<\/div>\r\n                    \r\n                    <div class=\"ind-table-value-col\">${industry.businessValue}<\/div>\r\n                    \r\n                    <div class=\"ind-table-action-col\">\r\n                        <button class=\"ind-table-view-btn\" onclick=\"openModal(${industry.id})\">\r\n                            List\r\n                            <svg viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n                                <path d=\"M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z\"\/>\r\n                            <\/svg>\r\n                        <\/button>\r\n                    <\/div>\r\n                `;\r\n                \r\n                table.appendChild(row);\r\n            });\r\n        }\r\n\r\n        \/\/ Open modal with member list\r\n        let currentIndustry = null;\r\n\r\n        function openModal(industryId) {\r\n            currentIndustry = industryData.find(ind => ind.id === industryId);\r\n            \r\n            document.getElementById('modalTitle').textContent = currentIndustry.name;\r\n            document.getElementById('modalMembers').textContent = currentIndustry.members;\r\n            document.getElementById('modalValue').textContent = currentIndustry.businessValue;\r\n            \r\n            renderMemberList(currentIndustry.memberList);\r\n            \r\n            document.getElementById('memberModal').classList.add('ind-table-active');\r\n            document.body.style.overflow = 'hidden';\r\n        }\r\n\r\n        function closeModal() {\r\n            document.getElementById('memberModal').classList.remove('ind-table-active');\r\n            document.body.style.overflow = 'auto';\r\n        }\r\n\r\n        function renderMemberList(members) {\r\n            const listContainer = document.getElementById('memberList');\r\n            listContainer.innerHTML = '';\r\n            \r\n            if (members.length === 0) {\r\n                listContainer.innerHTML = '<div class=\"ind-table-no-results\">No members found<\/div>';\r\n                return;\r\n            }\r\n            \r\n            members.forEach(member => {\r\n                const item = document.createElement('div');\r\n                item.className = 'ind-table-list-item';\r\n                item.textContent = member;\r\n                listContainer.appendChild(item);\r\n            });\r\n        }\r\n\r\n        \r\n\r\n        \/\/ Close modal on outside click\r\n        document.getElementById('memberModal').addEventListener('click', function(e) {\r\n            if (e.target === this) {\r\n                closeModal();\r\n            }\r\n        });\r\n\r\n        \/\/ Close modal on Escape key\r\n        document.addEventListener('keydown', function(e) {\r\n            if (e.key === 'Escape') {\r\n                closeModal();\r\n            }\r\n        });\r\n\r\n        \/\/ Initialize\r\n        renderIndustryTable();\r\n\t\t<\/script>\r\n\t\t<\/body>\r\n\t\t<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\r\n\t\t\t\t<\/div>\r\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>IMPA Industries Industry Members \u00d7 Total Members Business Value<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-19527","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/demo.vleafy.com\/ibc2\/wp-json\/wp\/v2\/pages\/19527","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo.vleafy.com\/ibc2\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.vleafy.com\/ibc2\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.vleafy.com\/ibc2\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.vleafy.com\/ibc2\/wp-json\/wp\/v2\/comments?post=19527"}],"version-history":[{"count":0,"href":"https:\/\/demo.vleafy.com\/ibc2\/wp-json\/wp\/v2\/pages\/19527\/revisions"}],"wp:attachment":[{"href":"https:\/\/demo.vleafy.com\/ibc2\/wp-json\/wp\/v2\/media?parent=19527"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}