{"__meta":{"id":"01M373PG595NK0A8Z6P5H6M444","tabUuid":null,"batchId":null,"timestamp":"2026-09-23T12:26:24.809Z","utime":1790166384.809681,"method":"GET","url":"https://izan.dengrweb.com/admin","component":null,"requestType":"http","status":200,"redirectLocation":null,"serverTimingMs":166.09877,"visitId":null},"http":{"requestHeaders":{"x-forwarded-proto":"https","priority":"u=0, i","accept-language":"en-US,en;q=0.9,bn;q=0.8","referer":"https://izan.dengrweb.com/login","sec-fetch-dest":"document","sec-fetch-user":"?1","sec-fetch-mode":"navigate","sec-fetch-site":"same-origin","accept":"text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7","user-agent":"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/153.0.0.0 Safari/537.36","upgrade-insecure-requests":"1","sec-ch-ua-platform":"\"Windows\"","sec-ch-ua-mobile":"?0","sec-ch-ua":"\"Google Chrome\";v=\"153\", \"Not_A Brand\";v=\"8\", \"Chromium\";v=\"153\"","cookie":"[REDACTED]","content-length":"0","host":"izan.dengrweb.com"},"responseHeaders":{"content-type":"text/html; charset=utf-8","cache-control":"no-cache, private","date":"Wed, 23 Sep 2026 12:26:24 GMT","vary":"X-Inertia","x-inertia-devtools-id":"01M373PG595NK0A8Z6P5H6M444","x-inertia-devtools-parent-out":"01M373PG595NK0A8Z6P5H6M444"},"requestBody":{"status":"empty"},"responseBody":{"status":"present","value":"<!DOCTYPE html>\n<html lang=\"en\">\n\n<head>\n    <meta charset=\"utf-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n<meta name=\"csrf-token\" content=\"vnomUoaA8esiyTQKqNeWfpoF9CzHl4ZxNnj9NMos\">\n<title>Dashboard | App Name Short</title>\n<link rel=\"icon\" href=\"https://izan.dengrweb.com/preset/fixing.png\">\n\n\n\n<!-- Font Awesome -->\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/fontawesome-free/css/all.min.css\">\n<!-- Ionicons -->\n\n<!-- iCheck -->\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/bootstrap/bootstrap.min.css\" >\n<!-- JQVMap -->\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/jqvmap/jqvmap.min.css\">\n<!-- Theme style -->\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/assets/dist/css/adminlte.min.css\">\n\n<!-- Daterange picker -->\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/daterangepicker/daterangepicker.css\">\n\n<script src=\"https://izan.dengrweb.com/vendor/ckeditor/ckeditor.js\"></script>\n<!-- tostar -->\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/flasher/flasher.min.css\">\n\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/datatables/dataTables.bootstrap4.min.css\">\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/datatables-responsive/css/responsive.bootstrap4.min.css\">\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/bootstrap-icons/bootstrap-icons.min.css\">\n\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/select2/css/select2.min.css\">\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/datatables-buttons/css/buttons.bootstrap4.min.css\">\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/vendor/datatables-buttons/css/buttons.dataTables.min.css\">\n<link rel=\"stylesheet\" href=\"https://izan.dengrweb.com/assets/dist/css/custom.css\">\n\n\n\n<style>\n\n\n    .brand-link .brand-image {\n        margin-top: 0px;\n        height: 40px;\n        width: 36px;\n        object-fit: cover;\n    }\n\n\n    .input-group{\n        flex-wrap: nowrap;\n    }\n    .input-group button{\n        white-space: nowrap;\n    }\n    .selection, span.select2-selection.select2-selection--single{\n        height: 100% !important;\n        border-top-left-radius: 5px;\n        border-bottom-left-radius: 5px;\n    }\n\n\n\n    .dt-buttons {\n        display: flex;\n        /* align-items: center; */\n        /* text-align: center; */\n        justify-content: center;\n        margin-bottom:0px !important;\n\n    }\n    .dt-buttons button{\n        border:none;\n        border:1px solid #9e9e9e;\n\n\n    }\n    .dt-buttons button:first-child{\n        border-top-left-radius:4px;\n        border-bottom-left-radius:4px;\n    }\n\n    .dt-buttons button:last-child{\n        border-top-right-radius:4px;\n        border-bottom-right-radius:4px;\n    }\n\n    .card .inner .overlay{\n        height: 100%;\n        position: absolute;\n        top: 0;\n        left: 0;\n        right: 0;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .items_list_list_mail {\n        margin-bottom: 10px;\n        display: flex;\n        gap: 8px;\n    }\n    .items_list_list_mail span{\n    background:#6c757d;\n        border-radius:5px;\n        padding:3px 5px;\n        color:white;\n        cursor:pointer;\n    }\n    .cursor-pointer{\n        cursor: pointer;\n        user-select: none;\n    }\n    .language_container{\n        height: 27px;\n        margin: auto 0;\n    }\n    .btn:has(span.btn_grouped){\n        padding:0px 7px 0 0;\n        overflow:hidden;\n        border:none\n\n    }\n\n    .btn span.btn_grouped{\n        padding:7px 10px;\n        margin-right:4px;\n        display:inline-block;\n        background:#000000ad;\n    }\n\n    .btn:has(span.btn_grouped):hover span.btn_grouped{\n            background:#000000c7;\n    }\n</style>\n</head>\n\n\n\n<body class=\"layout-fixed control-sidebar-slide-open layout-navbar-fixed\">\n\n    <div class=\"wrapper\">\n        <!-- Preloader -->\n\n\n\n\n        <!-- Navbar -->\n        <nav class=\"main-header navbar navbar-expand navbar-white navbar-light\">\n        <!-- Left navbar links -->\n    <ul class=\"navbar-nav\">\n        <li class=\"nav-item\">\n            <a class=\"nav-link\" data-widget=\"pushmenu\" href=\"#\" role=\"button\"><i class=\"fas fa-bars\"></i></a>\n        </li>\n\n        <li class=\"nav-item d-none d-sm-inline-block\">\n            <a href=\"https://izan.dengrweb.com/admin/dashboard\" class=\"nav-link\">Home</a>\n        </li>\n    </ul>\n\n    <!-- Right navbar links -->\n    <ul class=\"navbar-nav ml-auto\">\n        <li class=\"nav-item\">\n            <a class=\"nav-link position-relative\" href=\"https://izan.dengrweb.com/admin/sale?search_data%5Bstatus%5D=1\"\n                title=\"New Orders\">\n                <i class=\"fas fa-shopping-bag\"></i>\n                                    <span class=\"badge badge-danger navbar-badge\">4</span>\n                            </a>\n        </li>\n\n  \n\n        <!-- Notifications Dropdown Menu -->\n        <li class=\"nav-item dropdown dashboard_profile_dropdown\">\n            <a class=\"nav-link dashboard_profile\" data-toggle=\"dropdown\" href=\"#\">\n                <i class=\"fas fa-user dashboard_profile_icon\"></i> &nbsp; Super Admin\n            </a>\n            <div class=\"dropdown-menu dropdown-menu-sm dropdown-menu-right\">\n\n\n                \n                <a href=\"https://izan.dengrweb.com/admin/profile\" class=\"dropdown-item\">\n                    <i class=\"fas fa-user\"></i> Profile\n                </a>\n                <form action=\"https://izan.dengrweb.com/logout\" method=\"POST\">\n                    <input type=\"hidden\" name=\"_token\" value=\"vnomUoaA8esiyTQKqNeWfpoF9CzHl4ZxNnj9NMos\" autocomplete=\"off\">                    <button onclick=\"confirm('Do you want to logout?')\" class=\"dropdown-item\">\n                        <i class=\"fas fa-user\"></i> Logout\n                    </button>\n                </form>\n                \n\n            </div>\n        </li>\n    </ul>\n</nav>\n        <!-- /.navbar -->\n\n        <!-- Main Sidebar Container -->\n        <aside class=\"main-sidebar  sidebar-dark-primary elevation-4\">\n    <!-- Brand Logo -->\n    <a href=\"https://izan.dengrweb.com/admin/dashboard\" class=\"brand-link d-flex align-items-center\n    Theme Brand Link\n    \">\n        <img src=\"https://izan.dengrweb.com/preset/fixing.png\" alt=\"App Name Short\" class=\"brand-image img-circle \" style=\"opacity: .8\">\n        <span class=\"brand-text font-weight-light\">App Name Short</span>\n    </a>\n    <!-- Sidebar -->\n    <div class=\"sidebar\">\n        \n        <!-- SidebarSearch Form -->\n        <div class=\"form-inline p-2\">\n            <div class=\"input-group\" data-widget=\"sidebar-search\">\n                <input class=\"form-control form-control-sidebar\" type=\"search\" placeholder=\"Search\" aria-label=\"Search\">\n                <div class=\"input-group-append\">\n                    <button class=\"btn btn-sidebar\">\n                        <i class=\"fas fa-search fa-fw\"></i>\n                    </button>\n                </div>\n            </div>\n        </div>\n        \n\n\n        <!-- Sidebar Menu -->\n        <nav class=\"mt-2\">\n            <ul class=\"nav nav-pills nav-sidebar flex-column nav-flat nav-child-indent\" data-widget=\"treeview\" role=\"menu\" data-accordion=\"false\">\n                <li class=\"nav-item\">\n                    <a href=\"https://izan.dengrweb.com\" class=\"nav-link \" target=\"_blank\">\n\n                        <i class=\"fas fa-external-link-alt nav-icon\"></i>\n                        <p>\n                            Visit Site\n                        </p>\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a href=\"https://izan.dengrweb.com/admin/dashboard\" class=\"nav-link\n                    \n            \">\n                        <i class=\"nav-icon fas fa-tachometer-alt\"></i>\n                        <p>\n                            Dashboard\n                        </p>\n                    </a>\n                </li>\n\n                <li class=\"nav-item\">\n    <a href=\"#\" class=\"nav-link\">\n        <i class=\"fas fa-tools nav-icon \"></i>\n        <p>\n            Administration\n            <i class=\"fas fa-angle-left right\"></i>\n        </p>\n    </a>\n    <ul class=\"nav nav-treeview\">\n\n\n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/product/create\"\n                class=\"nav-link \">\n                <i class=\"fas fa-plus nav-icon\"></i>\n                <p>Product Create</p>\n            </a>\n        </li>\n        \n\n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/product\" class=\"nav-link\">\n                <i class=\"fas fa-th-large nav-icon\"></i>\n                <p>Product List</p>\n            </a>\n        </li>\n        \n        <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/selected-roots\"\n                class=\"nav-link \">\n                <i class=\"fas fa-layer-group nav-icon\"></i>\n                <p>Selected Items</p>\n            </a>\n        </li>\n\n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/category\"\n                class=\"nav-link \">\n                <i class=\"fab fa-linode nav-icon\"></i>\n                <p>Category</p>\n            </a>\n        </li>\n        \n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/subcategory\" class=\"nav-link \">\n                <i class=\"fab fa-linode nav-icon\"></i>\n                <p>Subcategory</p>\n            </a>\n        </li>\n        \n\n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/generic\" class=\"nav-link \">\n                <i class=\"fab fa-linode nav-icon\"></i>\n                <p>Generics</p>\n            </a>\n        </li>\n        \n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/brand\" class=\"nav-link \">\n                <i class=\"fas fa-ring nav-icon\"></i>\n                <p>Brand</p>\n            </a>\n        </li>\n        \n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/unit\" class=\"nav-link\">\n                <i class=\"fab fa-unity nav-icon\"></i>\n                <p>Unit</p>\n            </a>\n        </li>\n                        <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/coupon\" class=\"nav-link\">\n                <i class=\"fab  nav-icon\">%</i>\n                <p>Coupon</p>\n            </a>\n        </li>\n            </ul>\n</li>\n\n\n                <li class=\"nav-item\">\n              <a href=\"#\" class=\"nav-link\">\n                  <i class=\"fas fa-user-cog nav-icon\"></i>\n                  <p>\n                      User Manage\n                      <i class=\"fas fa-angle-left right\"></i>\n                  </p>\n              </a>\n              <ul class=\"nav nav-treeview\">\n                                        <li class=\"nav-item\">\n                          <a href=\"https://izan.dengrweb.com/admin/user\" class=\"nav-link\">\n                              <i class=\"fas fa-user-tie nav-icon\"></i>\n                              <p>User</p>\n                          </a>\n                      </li>\n                                                          <li class=\"nav-item\">\n                          <a href=\"https://izan.dengrweb.com/admin/permission\" class=\"nav-link\">\n                              <i class=\"fas fa-user-shield nav-icon\"></i>\n                              <p>Role</p>\n                          </a>\n                      </li>\n                  \n                  <li class=\"nav-item\">\n                      <a href=\"https://izan.dengrweb.com/admin/profile\" class=\"nav-link \">\n                          <i class=\"fas fa-id-card nav-icon\"></i>\n                          <p>Profile</p>\n                      </a>\n                  </li>\n\n              </ul>\n          </li>\n\n\n\n                <li class=\"nav-item\">\n                    <a href=\"https://izan.dengrweb.com/admin/inventory\"\n                        class=\"nav-link \">\n                        <i class=\"fas fa-boxes nav-icon\"></i>\n                        <p>Inventory & Alerts</p>\n                    </a>\n                </li>\n\n                <li class=\"nav-item \">\n                    <a href=\"#\" class=\"nav-link \">\n                        <i class=\"fas fa-shopping-cart nav-icon\"></i>\n                        <p>\n                            Sales\n                            <i class=\"right fas fa-angle-left\"></i>\n                        </p>\n                    </a>\n                    <ul class=\"nav nav-treeview\">\n                        <li class=\"nav-item\">\n                            <a href=\"https://izan.dengrweb.com/admin/sale?search_data%5Bstatus%5D=all\"\n                                class=\"nav-link \">\n                                <i class=\"far fa-circle nav-icon\"></i>\n                                <p>\n                                    All Sale\n                                </p>\n                            </a>\n                        </li>\n                        <li class=\"nav-item\">\n                            <a href=\"https://izan.dengrweb.com/admin/sale?search_data%5Bstatus%5D=1\"\n                                class=\"nav-link \">\n                                <i class=\"far fa-circle nav-icon\"></i>\n                                <p>\n                                  New Sale\n                                                                            <span class=\"right badge badge-danger\">4</span>\n                                                                    </p>\n                            </a>\n                        </li>\n                                                    <li class=\"nav-item\">\n                                <a href=\"https://izan.dengrweb.com/admin/sale_status\"\n                                    class=\"nav-link \">\n                                    <i class=\"far fa-circle nav-icon\"></i>\n                                    <p>Sale Status</p>\n                                </a>\n                            </li>\n                                            </ul>\n                </li>\n\n                                <li class=\"nav-item\">\n                    <a href=\"https://izan.dengrweb.com/admin/sub-scribers\" class=\"nav-link\">\n                        <i class=\"nav-icon far fa-newspaper\"></i>\n                        <p> Subscribers</p>\n                    </a>\n                </li>\n                \n                <li class=\"nav-item\">\n        <a href=\"#\" class=\"nav-link \">\n            <i class=\"nav-icon fas fa-tv\"></i>\n            <p>\n                Frontend Theme\n                <i class=\"fas fa-angle-left right\"></i>\n            </p>\n        </a>\n        <ul class=\"nav nav-treeview\">\n            <li class=\"nav-item\">\n                                    <a href=\"https://izan.dengrweb.com/admin/slider\" class=\"nav-link \">\n                        <i class=\"fas fa-book-open nav-icon\"></i>\n                        <p>Slider / Hero </p>\n                    </a>\n                \n\n                                    <a href=\"https://izan.dengrweb.com/admin/service\" class=\"nav-link \">\n                        <i class=\"fab fa-servicestack nav-icon\"></i>\n                        <p>Service</p>\n                    </a>\n                \n\n\n\n                            <li class=\"nav-item\">\n                    <a href=\"#\" class=\"nav-link\">\n                        <i class=\"fas fa-user-cog nav-icon\"></i>\n                        <p>\n                            Blog\n                            <i class=\"fas fa-angle-left right\"></i>\n                        </p>\n                    </a>\n                    <ul class=\"nav nav-treeview\">\n                                                    <li class=\"nav-item\">\n                                <a href=\"https://izan.dengrweb.com/admin/blog/category\" class=\"nav-link\">\n                                    <i class=\"fas fa-user-tie nav-icon\"></i>\n                                    <p>Category</p>\n                                </a>\n                            </li>\n                        \n                                                    <li class=\"nav-item\">\n                                <a href=\"https://izan.dengrweb.com/admin/blog/blog/create\" class=\"nav-link\">\n                                    <i class=\"fas fa-user-tie nav-icon\"></i>\n                                    <p>Blog Create</p>\n                                </a>\n                            </li>\n                                                                            <li class=\"nav-item\">\n                                <a href=\"https://izan.dengrweb.com/admin/blog/blog\"\n                                    class=\"nav-link \">\n                                    <i class=\"fas fa-user-tie nav-icon\"></i>\n                                    <p>Blog</p>\n                                </a>\n                            </li>\n                        \n                    </ul>\n                </li>\n            \n\n\n    </li>\n\n\n\n\n\n\n    <li class=\"nav-item\">\n        <a href=\"#\" class=\"nav-link \">\n\n            <i class=\"fas fa-check-circle nav-icon\"></i>\n            <p>\n                <p>Why Choose Us <i class=\"fas fa-angle-left right\"></i></p>\n            </p>\n        </a>\n        <ul class=\"nav nav-treeview\">\n            <li class=\"nav-item\">\n                <a href=\"https://izan.dengrweb.com/admin/whychooseus\"\n                    class=\"nav-link \">\n                    <i class=\"fas fa-check-circle nav-icon\"></i>\n                    <p>Why Choose Topic</p>\n                </a>\n            </li>\n            <li class=\"nav-item\">\n                <a href=\"https://izan.dengrweb.com/admin/achivement\"\n                    class=\"nav-link \">\n                    <i class=\"fas fa-certificate  nav-icon\"></i>\n                    <p>Achivement</p>\n                </a>\n            </li>\n                            <li class=\"nav-item\">\n                    <a href=\"https://izan.dengrweb.com/admin/client\" class=\"nav-link\">\n                        <i class=\"nav-icon fas fa-handshake\"></i>\n                        <p> Client</p>\n                    </a>\n                </li>\n            \n\n                            <li class=\"nav-item\">\n                    <a href=\"https://izan.dengrweb.com/admin/testimonial\" class=\"nav-link \">\n                        <i class=\"fas fa-star-half-alt nav-icon\"></i>\n                        <p>Testimonial</p>\n                    </a>\n                </li>\n            \n                            <li class=\"nav-item\">\n                    <a href=\"https://izan.dengrweb.com/admin/faq\" class=\"nav-link \">\n                        <i class=\"fas fa-question nav-icon\"></i>\n                        <p>Faq</p>\n                    </a>\n                </li>\n                    </ul>\n    </li>\n\n\n            <li class=\"nav-item\">\n            <a href=\"#\" class=\"nav-link \">\n\n                <i class=\"fas fa-book nav-icon\"></i>\n                <p>\n                    <p>Page Manage <i class=\"fas fa-angle-left right\"></i></p>\n                </p>\n            </a>\n            <ul class=\"nav nav-treeview\">\n\n\n                <li class=\"nav-item\">\n                    <a href=\"https://izan.dengrweb.com/admin/page\"\n                        class=\"nav-link \" class=\"nav-link\">\n                        <i class=\"fas fa-book nav-icon\"></i>\n                        <p>Page </p>\n                    </a>\n                </li>\n\n            </ul>\n        </li>\n    \n    </ul>\n    </li>\n\n\n                <li class=\"nav-item \">\n    <a href=\"#\" class=\"nav-link\">\n\n        <i class=\"fas fa-tools nav-icon\"></i>\n        <p>\n          Settings\n            <i class=\"fas fa-angle-left right\"></i>\n        </p>\n    </a>\n\n    <ul class=\"nav nav-treeview\">\n                    <li class=\"nav-item\">\n                <a href=\"https://izan.dengrweb.com/admin/settings/main\" class=\"nav-link\">\n                    <i class=\"fas fa-cogs nav-icon\"></i>\n                    <p>Main Setting</p>\n                </a>\n            </li>\n        \n                    <li class=\"nav-item\">\n                <a href=\"https://izan.dengrweb.com/admin/settings/site-verify\" class=\"nav-link\">\n                    <i class=\"fas fa-certificate nav-icon\"></i>\n                    <p>Site Verification</p>\n                </a>\n            </li>\n        \n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/settings/site-tag-auth\" class=\"nav-link\">\n                <i class=\"fas fa-shield-alt  nav-icon\"></i>\n                <p>Site Tag & Auth </p>\n            </a>\n        </li>\n        \n\n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/settings/fraud-report\" class=\"nav-link\">\n                <i class=\"fas fa-route nav-icon\"></i>\n                <p>Fraud Checker</p>\n            </a>\n        </li>\n        \n\n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/settings/pwa\" class=\"nav-link\">\n                <i class=\"bi bi-app-indicator nav-icon\"></i>\n                <p>Site PWA </p>\n            </a>\n        </li>\n        \n\n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/settings/cookie\" class=\"nav-link\">\n                <i class=\"fas fa-cookie-bite nav-icon\"></i>\n                <p>Cookie </p>\n            </a>\n        </li>\n        \n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/settings/custom-script\" class=\"nav-link\">\n                <i class=\"fas fa-code nav-icon\"></i>\n                <p>Custom JS/CSS</p>\n            </a>\n        </li>\n        \n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/mail\" class=\"nav-link\">\n                <i class=\"fas fa-envelope-open-text nav-icon\"></i>\n                <p>Email Setting</p>\n            </a>\n        </li>\n        \n\n\n\n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/settings/courier\" class=\"nav-link \">\n                <i class=\"fas fa-truck-loading nav-icon\"></i>\n                <p>  Courier Settings</p>\n            </a>\n        </li>\n        \n                <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/settings/message-sdk\" class=\"nav-link\">\n                <i class=\"bi bi-chat-left-dots-fill nav-icon\"></i>\n                <p>Message SDK</p>\n            </a>\n        </li>\n                        <li class=\"nav-item\">\n            <a href=\"https://izan.dengrweb.com/admin/settings/sms\" class=\"nav-link \">\n                <i class=\"fas fa-sms nav-icon\"></i>\n                <p> SMS Configuration</p>\n            </a>\n        </li>\n        \n\n\n\n\n\n\n    </ul>\n</li>\n<li class=\"nav-item\">\n    <a href=\"https://izan.dengrweb.com/clear\" class=\"nav-link\">\n        <i class=\"fas fa-redo-alt nav-icon\"></i>\n        <p>Clear Cache</p>\n    </a>\n</li>\n\n\n\n\n        </nav>\n\n\n\n        <!-- /.sidebar-menu -->\n    </div>\n    <!-- /.sidebar -->\n</aside>\n        <div class=\"content-wrapper position-relative\">\n\n\n            <!-- Main content -->\n            <section class=\"content\">\n                <div class=\"container-fluid pt-4\">\n                    <style>\n    /* ============================================\n       PROFESSIONAL DASHBOARD STYLES\n       ============================================ */\n\n    /* -- Animations -- */\n    @keyframes fadeInUp {\n        from { opacity: 0; transform: translateY(24px); }\n        to { opacity: 1; transform: translateY(0); }\n    }\n    @keyframes fadeIn {\n        from { opacity: 0; }\n        to { opacity: 1; }\n    }\n    @keyframes slideInLeft {\n        from { opacity: 0; transform: translateX(-20px); }\n        to { opacity: 1; transform: translateX(0); }\n    }\n    @keyframes pulse {\n        0%, 100% { transform: scale(1); }\n        50% { transform: scale(1.05); }\n    }\n    @keyframes shimmer {\n        0% { background-position: -200% 0; }\n        100% { background-position: 200% 0; }\n    }\n    @keyframes countUp {\n        from { opacity: 0; transform: translateY(10px); }\n        to { opacity: 1; transform: translateY(0); }\n    }\n\n    .dash-animate { animation: fadeInUp 0.5s ease both; }\n    .dash-animate-1 { animation-delay: 0.05s; }\n    .dash-animate-2 { animation-delay: 0.1s; }\n    .dash-animate-3 { animation-delay: 0.15s; }\n    .dash-animate-4 { animation-delay: 0.2s; }\n    .dash-animate-5 { animation-delay: 0.25s; }\n    .dash-animate-6 { animation-delay: 0.3s; }\n    .dash-animate-7 { animation-delay: 0.35s; }\n    .dash-animate-8 { animation-delay: 0.4s; }\n\n    /* -- Hero Banner -- */\n    .dash-hero {\n        position: relative;\n        border-radius: 1.25rem;\n        overflow: hidden;\n        background: linear-gradient(135deg, #0f172a 0%, #1e293b 40%, #0f766e 100%);\n        color: #fff;\n        padding: 2rem 2.25rem;\n        margin-bottom: 1.5rem;\n    }\n    .dash-hero::before {\n        content: '';\n        position: absolute;\n        inset: 0;\n        background:\n            radial-gradient(ellipse at 20% 50%, rgba(56, 189, 248, 0.15) 0%, transparent 60%),\n            radial-gradient(ellipse at 80% 20%, rgba(16, 185, 129, 0.12) 0%, transparent 50%);\n        pointer-events: none;\n    }\n    .dash-hero .hero-content { position: relative; z-index: 1; }\n    .dash-hero h1 {\n        font-size: clamp(1.4rem, 2.5vw, 2rem);\n        font-weight: 800;\n        margin-bottom: .35rem;\n        letter-spacing: -0.02em;\n    }\n    .dash-hero h1 .greeting-wave {\n        display: inline-block;\n        animation: pulse 2s ease infinite;\n        transform-origin: 70% 70%;\n    }\n    .dash-hero p {\n        color: rgba(226, 232, 240, 0.75);\n        font-size: .95rem;\n        max-width: 540px;\n        margin-bottom: 0;\n    }\n    .dash-hero .hero-meta {\n        display: flex;\n        flex-wrap: wrap;\n        gap: 1rem;\n        margin-top: 1.15rem;\n    }\n    .dash-hero .hero-meta-item {\n        display: flex;\n        align-items: center;\n        gap: .45rem;\n        font-size: .82rem;\n        color: rgba(226, 232, 240, 0.65);\n        background: rgba(255,255,255,0.07);\n        border: 1px solid rgba(255,255,255,0.1);\n        border-radius: 999px;\n        padding: .3rem .75rem;\n    }\n    .dash-hero .hero-meta-item i { color: #38bdf8; }\n    .dash-hero .hero-actions {\n        position: relative;\n        z-index: 1;\n    }\n\n    /* -- Stat Cards -- */\n    .stat-card {\n        border: 1px solid rgba(15, 23, 42, 0.07);\n        border-radius: 1rem;\n        background: #fff;\n        box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 8px 24px rgba(0,0,0,0.03);\n        padding: 1.25rem 1.35rem;\n        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n        position: relative;\n        overflow: hidden;\n        cursor: default;\n        height: 100%;\n    }\n    .stat-card:hover {\n        transform: translateY(-4px);\n        box-shadow: 0 4px 12px rgba(0,0,0,0.06), 0 16px 40px rgba(0,0,0,0.06);\n        border-color: rgba(15, 23, 42, 0.12);\n    }\n    .stat-card .stat-icon {\n        width: 2.75rem;\n        height: 2.75rem;\n        border-radius: .75rem;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        font-size: 1.1rem;\n        color: #fff;\n        flex-shrink: 0;\n    }\n    .stat-card .stat-value {\n        font-size: 1.65rem;\n        font-weight: 800;\n        letter-spacing: -0.03em;\n        line-height: 1.1;\n        margin-top: .15rem;\n    }\n    .stat-card .stat-label {\n        font-size: .78rem;\n        text-transform: uppercase;\n        letter-spacing: .06em;\n        color: #64748b;\n        font-weight: 600;\n    }\n    .stat-card .stat-trend {\n        font-size: .75rem;\n        font-weight: 600;\n        display: inline-flex;\n        align-items: center;\n        gap: .2rem;\n        padding: .15rem .45rem;\n        border-radius: 999px;\n    }\n    .stat-card .stat-trend.up { color: #059669; background: #ecfdf5; }\n    .stat-card .stat-trend.down { color: #dc2626; background: #fef2f2; }\n    .stat-card .stat-trend.neutral { color: #6b7280; background: #f3f4f6; }\n    .stat-card::after {\n        content: '';\n        position: absolute;\n        bottom: 0;\n        left: 0;\n        right: 0;\n        height: 3px;\n        background: var(--card-accent, #3b82f6);\n        opacity: 0;\n        transition: opacity 0.3s;\n    }\n    .stat-card:hover::after { opacity: 1; }\n\n    /* -- Dashboard Panels -- */\n    .dash-panel {\n        border: 1px solid rgba(15, 23, 42, 0.07);\n        border-radius: 1rem;\n        background: #fff;\n        box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 8px 24px rgba(0,0,0,0.03);\n        overflow: hidden;\n        margin-bottom: 1.25rem;\n        transition: box-shadow 0.3s;\n    }\n    .dash-panel:hover {\n        box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 12px 32px rgba(0,0,0,0.05);\n    }\n    .dash-panel .panel-header {\n        padding: 1rem 1.35rem;\n        border-bottom: 1px solid rgba(15, 23, 42, 0.06);\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        background: #fff;\n    }\n    .dash-panel .panel-header h3 {\n        font-size: 1rem;\n        font-weight: 700;\n        margin: 0;\n        color: #0f172a;\n    }\n    .dash-panel .panel-header small {\n        color: #94a3b8;\n        font-size: .8rem;\n    }\n    .dash-panel .panel-body { padding: 1.25rem 1.35rem; }\n    .dash-panel .panel-body.flush { padding: 0; }\n\n    /* -- Quick Actions -- */\n    .quick-action-btn {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        gap: .5rem;\n        padding: 1rem .75rem;\n        border-radius: .75rem;\n        background: #f8fafc;\n        border: 1px solid rgba(15, 23, 42, 0.06);\n        color: #334155;\n        text-decoration: none;\n        font-size: .8rem;\n        font-weight: 600;\n        transition: all 0.25s;\n        text-align: center;\n    }\n    .quick-action-btn:hover {\n        background: #0f172a;\n        color: #fff;\n        transform: translateY(-2px);\n        box-shadow: 0 6px 20px rgba(15, 23, 42, 0.15);\n        text-decoration: none;\n    }\n    .quick-action-btn .qa-icon {\n        width: 2.5rem;\n        height: 2.5rem;\n        border-radius: .65rem;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        font-size: 1rem;\n        color: #fff;\n    }\n\n    /* -- Table Enhancements -- */\n    .dash-panel .table {\n        margin-bottom: 0;\n    }\n    .dash-panel .table thead th {\n        font-size: .72rem;\n        letter-spacing: .07em;\n        text-transform: uppercase;\n        color: #94a3b8;\n        background: #f8fafc;\n        border-bottom: 1px solid rgba(15, 23, 42, 0.06);\n        font-weight: 700;\n        padding: .75rem 1rem;\n    }\n    .dash-panel .table tbody td {\n        padding: .85rem 1rem;\n        vertical-align: middle;\n        border-color: rgba(15, 23, 42, 0.05);\n        font-size: .88rem;\n    }\n    .dash-panel .table tbody tr {\n        transition: background 0.2s;\n    }\n    .dash-panel .table tbody tr:hover {\n        background: rgba(59, 130, 246, 0.03);\n    }\n\n    /* -- Status Badges -- */\n    .status-badge {\n        display: inline-flex;\n        align-items: center;\n        gap: .3rem;\n        padding: .25rem .65rem;\n        border-radius: 999px;\n        font-size: .75rem;\n        font-weight: 600;\n        line-height: 1;\n    }\n    .status-badge::before {\n        content: '';\n        width: 6px;\n        height: 6px;\n        border-radius: 50%;\n        flex-shrink: 0;\n    }\n    .status-badge.pending { background: #fffbeb; color: #b45309; }\n    .status-badge.pending::before { background: #f59e0b; }\n    .status-badge.processing { background: #eff6ff; color: #1d4ed8; }\n    .status-badge.processing::before { background: #3b82f6; }\n    .status-badge.delivered { background: #ecfdf5; color: #047857; }\n    .status-badge.delivered::before { background: #10b981; }\n    .status-badge.cancelled { background: #fef2f2; color: #b91c1c; }\n    .status-badge.cancelled::before { background: #ef4444; }\n\n    /* -- Chart Panel -- */\n    .chart-panel-dark .panel-header {\n        background: linear-gradient(135deg, #0f172a, #1e293b);\n        color: #fff;\n        border-bottom: none;\n    }\n    .chart-panel-dark .panel-header h3 { color: #fff; }\n    .chart-panel-dark .panel-header small { color: rgba(255,255,255,0.5); }\n\n    /* -- Mini Stat in Chart Header -- */\n    .chart-mini-stats {\n        display: flex;\n        gap: 1rem;\n        flex-wrap: wrap;\n    }\n    .chart-mini-stat {\n        background: rgba(255,255,255,0.08);\n        border: 1px solid rgba(255,255,255,0.1);\n        border-radius: .6rem;\n        padding: .5rem .85rem;\n        text-align: center;\n    }\n    .chart-mini-stat .cms-value {\n        font-weight: 700;\n        font-size: 1rem;\n    }\n    .chart-mini-stat .cms-label {\n        font-size: .68rem;\n        text-transform: uppercase;\n        letter-spacing: .05em;\n        opacity: 0.6;\n    }\n\n    /* -- Order Row -- */\n    .order-id {\n        font-weight: 700;\n        color: #0f172a;\n    }\n    .customer-cell {\n        display: flex;\n        align-items: center;\n        gap: .5rem;\n    }\n    .customer-avatar {\n        width: 32px;\n        height: 32px;\n        border-radius: 50%;\n        background: linear-gradient(135deg, #6366f1, #8b5cf6);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        color: #fff;\n        font-weight: 700;\n        font-size: .75rem;\n        flex-shrink: 0;\n    }\n\n    /* -- Product Cell -- */\n    .product-cell {\n        display: flex;\n        align-items: center;\n        gap: .65rem;\n    }\n    .product-thumb {\n        width: 40px;\n        height: 40px;\n        border-radius: .5rem;\n        background: linear-gradient(135deg, #e0f2fe, #f0f9ff);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        color: #0284c7;\n        font-size: .85rem;\n        flex-shrink: 0;\n    }\n\n    /* -- Progress Bar -- */\n    .stock-bar {\n        height: 6px;\n        border-radius: 3px;\n        background: #e2e8f0;\n        overflow: hidden;\n    }\n    .stock-bar-fill {\n        height: 100%;\n        border-radius: 3px;\n        transition: width 0.6s ease;\n    }\n\n    /* -- Scrollbar -- */\n    .dash-panel .table-responsive::-webkit-scrollbar { height: 4px; }\n    .dash-panel .table-responsive::-webkit-scrollbar-track { background: #f1f5f9; }\n    .dash-panel .table-responsive::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 2px; }\n\n    /* -- Empty State -- */\n    .empty-state {\n        text-align: center;\n        padding: 2.5rem 1rem;\n        color: #94a3b8;\n    }\n    .empty-state i { font-size: 2rem; margin-bottom: .75rem; display: block; opacity: 0.4; }\n\n    /* -- Live Clock -- */\n    .live-clock {\n        font-variant-numeric: tabular-nums;\n        font-weight: 600;\n    }\n\n    /* -- Responsive tweaks -- */\n    @media (max-width: 767.98px) {\n        .dash-hero { padding: 1.25rem; border-radius: 1rem; }\n        .dash-hero h1 { font-size: 1.3rem; }\n        .stat-card .stat-value { font-size: 1.35rem; }\n        .dash-panel .panel-header { flex-direction: column; align-items: flex-start; gap: .5rem; }\n    }\n</style>\n\n\n<div class=\"dash-hero dash-animate\">\n    <div class=\"d-flex flex-wrap align-items-start justify-content-between gap-3\">\n        <div class=\"hero-content\">\n            <h1>\n                <span class=\"greeting-wave\">👋</span>\n                                Good Afternoon, Super Admin\n            </h1>\n            <p>Here's what's happening with your store today. Monitor sales, track orders, and manage everything from one place.</p>\n            <div class=\"hero-meta\">\n                <span class=\"hero-meta-item\">\n                    <i class=\"fas fa-calendar-alt\"></i>\n                    <span id=\"heroDate\">Wednesday, 23 Sep 2026</span>\n                </span>\n                <span class=\"hero-meta-item\">\n                    <i class=\"fas fa-clock\"></i>\n                    <span class=\"live-clock\" id=\"heroTime\">12:26:24 PM</span>\n                </span>\n                <span class=\"hero-meta-item\">\n                    <i class=\"fas fa-box\"></i>\n                    9 Products\n                </span>\n                <span class=\"hero-meta-item\">\n                    <i class=\"fas fa-users\"></i>\n                    1 Customers\n                </span>\n            </div>\n        </div>\n        <div class=\"hero-actions d-flex gap-2 flex-wrap\">\n            <a href=\"https://izan.dengrweb.com\" target=\"_blank\" class=\"btn btn-sm btn-light fw-semibold shadow-sm\">\n                <i class=\"fas fa-external-link-alt me-1\"></i> Visit Store\n            </a>\n            <a href=\"https://izan.dengrweb.com/admin/sale\" class=\"btn btn-sm btn-success fw-semibold\">\n                <i class=\"fas fa-plus me-1\"></i> New Sale\n            </a>\n        </div>\n    </div>\n</div>\n\n\n<div class=\"row g-3 mb-4\">\n    \n    <div class=\"col-12 col-sm-6 col-xl-3 dash-animate dash-animate-1\">\n        <div class=\"stat-card\" style=\"--card-accent: #3b82f6;\">\n            <div class=\"d-flex align-items-start justify-content-between\">\n                <div>\n                    <div class=\"stat-label\">Total Revenue</div>\n                    <div class=\"stat-value\" data-counter=\"0\">BDT 0</div>\n                                            <span class=\"stat-trend neutral\">0% vs last month</span>\n                                    </div>\n                <div class=\"stat-icon\" style=\"background: linear-gradient(135deg, #3b82f6, #2563eb);\">\n                    <i class=\"fas fa-dollar-sign\"></i>\n                </div>\n            </div>\n        </div>\n    </div>\n\n    \n    <div class=\"col-12 col-sm-6 col-xl-3 dash-animate dash-animate-2\">\n        <div class=\"stat-card\" style=\"--card-accent: #8b5cf6;\">\n            <div class=\"d-flex align-items-start justify-content-between\">\n                <div>\n                    <div class=\"stat-label\">Total Orders</div>\n                    <div class=\"stat-value\" data-counter=\"7\">0</div>\n                                            <span class=\"stat-trend up\">\n                            <i class=\"fas fa-arrow-up\"></i>\n                            250% vs last month\n                        </span>\n                                    </div>\n                <div class=\"stat-icon\" style=\"background: linear-gradient(135deg, #8b5cf6, #7c3aed);\">\n                    <i class=\"fas fa-shopping-cart\"></i>\n                </div>\n            </div>\n        </div>\n    </div>\n\n    \n    <div class=\"col-12 col-sm-6 col-xl-3 dash-animate dash-animate-3\">\n        <div class=\"stat-card\" style=\"--card-accent: #10b981;\">\n            <div class=\"d-flex align-items-start justify-content-between\">\n                <div>\n                    <div class=\"stat-label\">Today's Revenue</div>\n                    <div class=\"stat-value\" data-counter=\"0\">BDT 0</div>\n                    <span class=\"stat-trend neutral\">0 orders today</span>\n                </div>\n                <div class=\"stat-icon\" style=\"background: linear-gradient(135deg, #10b981, #059669);\">\n                    <i class=\"fas fa-chart-line\"></i>\n                </div>\n            </div>\n        </div>\n    </div>\n\n    \n    <div class=\"col-12 col-sm-6 col-xl-3 dash-animate dash-animate-4\">\n        <div class=\"stat-card\" style=\"--card-accent: #f59e0b;\">\n            <div class=\"d-flex align-items-start justify-content-between\">\n                <div>\n                    <div class=\"stat-label\">Pending Orders</div>\n                    <div class=\"stat-value\" data-counter=\"0\">0</div>\n                    <span class=\"stat-trend up\">\n                        4 processing\n                    </span>\n                </div>\n                <div class=\"stat-icon\" style=\"background: linear-gradient(135deg, #f59e0b, #d97706);\">\n                    <i class=\"fas fa-hourglass-half\"></i>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n\n<div class=\"row g-3 mb-4 dash-animate dash-animate-5\">\n    <div class=\"col-12\">\n        <div class=\"d-flex gap-2 flex-wrap\">\n                        <a href=\"https://izan.dengrweb.com/admin/sale\" class=\"quick-action-btn flex-fill\" style=\"min-width: 120px;\">\n                <span class=\"qa-icon\" style=\"background: linear-gradient(135deg, #3b82f6, #2563eb);\">\n                    <i class=\"fas fa-plus\"></i>\n                </span>\n                New Sale\n            </a>\n                                    <a href=\"https://izan.dengrweb.com/admin/product\" class=\"quick-action-btn flex-fill\" style=\"min-width: 120px;\">\n                <span class=\"qa-icon\" style=\"background: linear-gradient(135deg, #8b5cf6, #7c3aed);\">\n                    <i class=\"fas fa-box\"></i>\n                </span>\n                Products\n            </a>\n                                    <a href=\"https://izan.dengrweb.com/admin/category\" class=\"quick-action-btn flex-fill\" style=\"min-width: 120px;\">\n                <span class=\"qa-icon\" style=\"background: linear-gradient(135deg, #10b981, #059669);\">\n                    <i class=\"fas fa-tags\"></i>\n                </span>\n                Categories\n            </a>\n                                    <a href=\"https://izan.dengrweb.com/admin/customer\" class=\"quick-action-btn flex-fill\" style=\"min-width: 120px;\">\n                <span class=\"qa-icon\" style=\"background: linear-gradient(135deg, #f59e0b, #d97706);\">\n                    <i class=\"fas fa-users\"></i>\n                </span>\n                Customers\n            </a>\n                        <a href=\"https://izan.dengrweb.com\" target=\"_blank\" class=\"quick-action-btn flex-fill\" style=\"min-width: 120px;\">\n                <span class=\"qa-icon\" style=\"background: linear-gradient(135deg, #ec4899, #db2777);\">\n                    <i class=\"fas fa-globe\"></i>\n                </span>\n                View Store\n            </a>\n                        <a href=\"https://izan.dengrweb.com/admin/settings/main\" class=\"quick-action-btn flex-fill\" style=\"min-width: 120px;\">\n                <span class=\"qa-icon\" style=\"background: linear-gradient(135deg, #6366f1, #4f46e5);\">\n                    <i class=\"fas fa-cog\"></i>\n                </span>\n                Settings\n            </a>\n                    </div>\n    </div>\n</div>\n\n\n<div class=\"row g-4 mb-4\">\n    \n    <div class=\"col-12 col-xl-8 dash-animate dash-animate-5\">\n        <div class=\"dash-panel chart-panel-dark\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Sales Trend</h3>\n                    <small>Daily revenue from completed sales (last 30 days)</small>\n                </div>\n                <div class=\"chart-mini-stats\">\n                    <div class=\"chart-mini-stat\">\n                        <div class=\"cms-value\">BDT 0</div>\n                        <div class=\"cms-label\">Total</div>\n                    </div>\n                    <div class=\"chart-mini-stat\">\n                        <div class=\"cms-value\">BDT 0</div>\n                        <div class=\"cms-label\">Avg/Day</div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"panel-body\">\n                <div id=\"salesTrendChart\" style=\"min-height: 320px;\"></div>\n            </div>\n        </div>\n    </div>\n\n    \n    <div class=\"col-12 col-xl-4 dash-animate dash-animate-6\">\n        <div class=\"dash-panel h-100\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Order Status</h3>\n                    <small>Distribution across all orders</small>\n                </div>\n            </div>\n            <div class=\"panel-body\">\n                <div id=\"orderStatusChart\" style=\"min-height: 220px;\"></div>\n                <div class=\"mt-3\">\n                    <div class=\"d-flex align-items-center justify-content-between mb-2\">\n                        <span class=\"d-flex align-items-center gap-2 small\">\n                            <span style=\"width:10px;height:10px;border-radius:3px;background:#f59e0b;\"></span> Pending\n                        </span>\n                        <strong>0</strong>\n                    </div>\n                    <div class=\"d-flex align-items-center justify-content-between mb-2\">\n                        <span class=\"d-flex align-items-center gap-2 small\">\n                            <span style=\"width:10px;height:10px;border-radius:3px;background:#3b82f6;\"></span> Processing\n                        </span>\n                        <strong>4</strong>\n                    </div>\n                    <div class=\"d-flex align-items-center justify-content-between mb-2\">\n                        <span class=\"d-flex align-items-center gap-2 small\">\n                            <span style=\"width:10px;height:10px;border-radius:3px;background:#10b981;\"></span> Delivered\n                        </span>\n                        <strong>0</strong>\n                    </div>\n                    <div class=\"d-flex align-items-center justify-content-between\">\n                        <span class=\"d-flex align-items-center gap-2 small\">\n                            <span style=\"width:10px;height:10px;border-radius:3px;background:#ef4444;\"></span> Cancelled\n                        </span>\n                        <strong>1</strong>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n\n<div class=\"row g-3 mb-4\">\n    <div class=\"col-6 col-md-3 dash-animate dash-animate-5\">\n        <div class=\"stat-card text-center\" style=\"--card-accent: #06b6d4;\">\n            <div class=\"stat-icon mx-auto mb-2\" style=\"background: linear-gradient(135deg, #06b6d4, #0891b2); width: 2.25rem; height: 2.25rem; font-size: .9rem;\">\n                <i class=\"fas fa-layer-group\"></i>\n            </div>\n            <div class=\"stat-value\" style=\"font-size:1.35rem;\">8</div>\n            <div class=\"stat-label\">Categories</div>\n        </div>\n    </div>\n    <div class=\"col-6 col-md-3 dash-animate dash-animate-6\">\n        <div class=\"stat-card text-center\" style=\"--card-accent: #a855f7;\">\n            <div class=\"stat-icon mx-auto mb-2\" style=\"background: linear-gradient(135deg, #a855f7, #9333ea); width: 2.25rem; height: 2.25rem; font-size: .9rem;\">\n                <i class=\"fas fa-star\"></i>\n            </div>\n            <div class=\"stat-value\" style=\"font-size:1.35rem;\">1</div>\n            <div class=\"stat-label\">Brands</div>\n        </div>\n    </div>\n    <div class=\"col-6 col-md-3 dash-animate dash-animate-7\">\n        <div class=\"stat-card text-center\" style=\"--card-accent: #f97316;\">\n            <div class=\"stat-icon mx-auto mb-2\" style=\"background: linear-gradient(135deg, #f97316, #ea580c); width: 2.25rem; height: 2.25rem; font-size: .9rem;\">\n                <i class=\"fas fa-exclamation-triangle\"></i>\n            </div>\n            <div class=\"stat-value\" style=\"font-size:1.35rem;\">2</div>\n            <div class=\"stat-label\">Low Stock</div>\n        </div>\n    </div>\n    <div class=\"col-6 col-md-3 dash-animate dash-animate-8\">\n        <div class=\"stat-card text-center\" style=\"--card-accent: #ef4444;\">\n            <div class=\"stat-icon mx-auto mb-2\" style=\"background: linear-gradient(135deg, #ef4444, #dc2626); width: 2.25rem; height: 2.25rem; font-size: .9rem;\">\n                <i class=\"fas fa-times-circle\"></i>\n            </div>\n            <div class=\"stat-value\" style=\"font-size:1.35rem;\">2</div>\n            <div class=\"stat-label\">Out of Stock</div>\n        </div>\n    </div>\n</div>\n\n\n<div class=\"row g-4 mb-4\">\n    <div class=\"col-12 col-xl-7 dash-animate dash-animate-6\">\n        <div class=\"dash-panel\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Monthly Revenue</h3>\n                    <small>Last 6 months revenue overview</small>\n                </div>\n            </div>\n            <div class=\"panel-body\">\n                <div id=\"monthlyRevenueChart\" style=\"min-height: 280px;\"></div>\n            </div>\n        </div>\n    </div>\n    <div class=\"col-12 col-xl-5 dash-animate dash-animate-7\">\n        <div class=\"dash-panel h-100\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Sales by Category</h3>\n                    <small>Top categories by units sold</small>\n                </div>\n            </div>\n            <div class=\"panel-body\">\n                                    <div class=\"empty-state\">\n                        <i class=\"fas fa-chart-bar\"></i>\n                        <div>No sales data available yet.</div>\n                    </div>\n                            </div>\n        </div>\n    </div>\n</div>\n\n\n<div class=\"row g-4 mb-4\">\n    \n    <div class=\"col-12 col-xl-7 dash-animate dash-animate-7\">\n        <div class=\"dash-panel\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Recent Orders</h3>\n                    <small>Latest transactions from the store</small>\n                </div>\n                <a href=\"https://izan.dengrweb.com/admin/sale\" class=\"btn btn-sm btn-outline-primary rounded-pill px-3\">\n                    View All <i class=\"fas fa-arrow-right ms-1\"></i>\n                </a>\n            </div>\n            <div class=\"panel-body flush\">\n                <div class=\"table-responsive\">\n                    <table class=\"table table-hover align-middle\">\n                        <thead>\n                            <tr>\n                                <th>Order</th>\n                                <th>Customer</th>\n                                <th>Amount</th>\n                                <th>Status</th>\n                                <th>Date</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                                                            <tr>\n                                    <td><span class=\"order-id\">#1789295888</span></td>\n                                    <td>\n                                        <div class=\"customer-cell\">\n                                            <div class=\"customer-avatar\">U</div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">Walk-in</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\"></div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">BDT 700.00</td>\n                                    <td>\n                                                                                <span class=\"status-badge processing\">Pending</span>\n                                    </td>\n                                    <td class=\"text-muted small\">13 Sep, 2026</td>\n                                </tr>\n                                                            <tr>\n                                    <td><span class=\"order-id\">#1785845187</span></td>\n                                    <td>\n                                        <div class=\"customer-cell\">\n                                            <div class=\"customer-avatar\">G</div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">General Customer</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">0170xxxxxxx</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">BDT 2,350.00</td>\n                                    <td>\n                                                                                <span class=\"status-badge processing\">Pending</span>\n                                    </td>\n                                    <td class=\"text-muted small\">04 Aug, 2026</td>\n                                </tr>\n                                                            <tr>\n                                    <td><span class=\"order-id\">#1785845124</span></td>\n                                    <td>\n                                        <div class=\"customer-cell\">\n                                            <div class=\"customer-avatar\">G</div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">General Customer</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">0170xxxxxxx</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">BDT 3,200.00</td>\n                                    <td>\n                                                                                <span class=\"status-badge processing\">Pending</span>\n                                    </td>\n                                    <td class=\"text-muted small\">04 Aug, 2026</td>\n                                </tr>\n                                                            <tr>\n                                    <td><span class=\"order-id\">#1785322576</span></td>\n                                    <td>\n                                        <div class=\"customer-cell\">\n                                            <div class=\"customer-avatar\">G</div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">General Customer</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">0170xxxxxxx</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">BDT 350.00</td>\n                                    <td>\n                                                                                <span class=\"status-badge processing\">Pending</span>\n                                    </td>\n                                    <td class=\"text-muted small\">29 Jul, 2026</td>\n                                </tr>\n                                                            <tr>\n                                    <td><span class=\"order-id\">#1784113250</span></td>\n                                    <td>\n                                        <div class=\"customer-cell\">\n                                            <div class=\"customer-avatar\">G</div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">General Customer</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">0170xxxxxxx</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">BDT 350.00</td>\n                                    <td>\n                                                                                <span class=\"status-badge processing\">In Review</span>\n                                    </td>\n                                    <td class=\"text-muted small\">15 Jul, 2026</td>\n                                </tr>\n                                                            <tr>\n                                    <td><span class=\"order-id\">#1784113118</span></td>\n                                    <td>\n                                        <div class=\"customer-cell\">\n                                            <div class=\"customer-avatar\">G</div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">General Customer</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">0170xxxxxxx</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">BDT 1,450.00</td>\n                                    <td>\n                                                                                <span class=\"status-badge processing\">In Review</span>\n                                    </td>\n                                    <td class=\"text-muted small\">15 Jul, 2026</td>\n                                </tr>\n                                                    </tbody>\n                    </table>\n                </div>\n            </div>\n        </div>\n    </div>\n\n    \n    <div class=\"col-12 col-xl-5 dash-animate dash-animate-8\">\n        <div class=\"dash-panel\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Top Products</h3>\n                    <small>Most viewed items in your store</small>\n                </div>\n                <span class=\"badge bg-primary rounded-pill px-3 py-2\">8</span>\n            </div>\n            <div class=\"panel-body flush\">\n                <div class=\"table-responsive\">\n                    <table class=\"table table-hover align-middle\">\n                        <thead>\n                            <tr>\n                                <th>Product</th>\n                                <th>Views</th>\n                                <th>Stock</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                                                            <tr>\n                                    <td>\n                                        <div class=\"product-cell\">\n                                            <div class=\"product-thumb\">\n                                                                                                    <i class=\"fas fa-crown\" style=\"color: #f59e0b;\"></i>\n                                                                                            </div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">Cap</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">Mountain Cap</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">0</td>\n                                    <td>\n                                                                                <div class=\"d-flex align-items-center gap-2\">\n                                            <div class=\"stock-bar flex-fill\" style=\"max-width:60px;\">\n                                                <div class=\"stock-bar-fill\" style=\"width: 0%; background: #ef4444;\"></div>\n                                            </div>\n                                            <small class=\"text-muted\">0</small>\n                                        </div>\n                                    </td>\n                                </tr>\n                                                            <tr>\n                                    <td>\n                                        <div class=\"product-cell\">\n                                            <div class=\"product-thumb\">\n                                                                                                    <i class=\"fas fa-crown\" style=\"color: #f59e0b;\"></i>\n                                                                                            </div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">Cap</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">Dark Cap</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">0</td>\n                                    <td>\n                                                                                <div class=\"d-flex align-items-center gap-2\">\n                                            <div class=\"stock-bar flex-fill\" style=\"max-width:60px;\">\n                                                <div class=\"stock-bar-fill\" style=\"width: 50%; background: #f59e0b;\"></div>\n                                            </div>\n                                            <small class=\"text-muted\">10</small>\n                                        </div>\n                                    </td>\n                                </tr>\n                                                            <tr>\n                                    <td>\n                                        <div class=\"product-cell\">\n                                            <div class=\"product-thumb\">\n                                                                                                    <i class=\"fas fa-crown\" style=\"color: #f59e0b;\"></i>\n                                                                                            </div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">Cap</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">Yoyo Cap</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">0</td>\n                                    <td>\n                                                                                <div class=\"d-flex align-items-center gap-2\">\n                                            <div class=\"stock-bar flex-fill\" style=\"max-width:60px;\">\n                                                <div class=\"stock-bar-fill\" style=\"width: 50%; background: #f59e0b;\"></div>\n                                            </div>\n                                            <small class=\"text-muted\">10</small>\n                                        </div>\n                                    </td>\n                                </tr>\n                                                            <tr>\n                                    <td>\n                                        <div class=\"product-cell\">\n                                            <div class=\"product-thumb\">\n                                                                                                    <i class=\"fas fa-box\"></i>\n                                                                                            </div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">Cap</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">premium Cap</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">0</td>\n                                    <td>\n                                                                                <div class=\"d-flex align-items-center gap-2\">\n                                            <div class=\"stock-bar flex-fill\" style=\"max-width:60px;\">\n                                                <div class=\"stock-bar-fill\" style=\"width: 50%; background: #f59e0b;\"></div>\n                                            </div>\n                                            <small class=\"text-muted\">10</small>\n                                        </div>\n                                    </td>\n                                </tr>\n                                                            <tr>\n                                    <td>\n                                        <div class=\"product-cell\">\n                                            <div class=\"product-thumb\">\n                                                                                                    <i class=\"fas fa-box\"></i>\n                                                                                            </div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">D Cap</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">D cap</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">0</td>\n                                    <td>\n                                                                                <div class=\"d-flex align-items-center gap-2\">\n                                            <div class=\"stock-bar flex-fill\" style=\"max-width:60px;\">\n                                                <div class=\"stock-bar-fill\" style=\"width: 0%; background: #ef4444;\"></div>\n                                            </div>\n                                            <small class=\"text-muted\">0</small>\n                                        </div>\n                                    </td>\n                                </tr>\n                                                            <tr>\n                                    <td>\n                                        <div class=\"product-cell\">\n                                            <div class=\"product-thumb\">\n                                                                                                    <i class=\"fas fa-box\"></i>\n                                                                                            </div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">Cap</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">N/A</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">0</td>\n                                    <td>\n                                                                                <div class=\"d-flex align-items-center gap-2\">\n                                            <div class=\"stock-bar flex-fill\" style=\"max-width:60px;\">\n                                                <div class=\"stock-bar-fill\" style=\"width: 5%; background: #f59e0b;\"></div>\n                                            </div>\n                                            <small class=\"text-muted\">1</small>\n                                        </div>\n                                    </td>\n                                </tr>\n                                                            <tr>\n                                    <td>\n                                        <div class=\"product-cell\">\n                                            <div class=\"product-thumb\">\n                                                                                                    <i class=\"fas fa-box\"></i>\n                                                                                            </div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">E Cap</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">E cap</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">0</td>\n                                    <td>\n                                                                                <div class=\"d-flex align-items-center gap-2\">\n                                            <div class=\"stock-bar flex-fill\" style=\"max-width:60px;\">\n                                                <div class=\"stock-bar-fill\" style=\"width: 5%; background: #f59e0b;\"></div>\n                                            </div>\n                                            <small class=\"text-muted\">1</small>\n                                        </div>\n                                    </td>\n                                </tr>\n                                                            <tr>\n                                    <td>\n                                        <div class=\"product-cell\">\n                                            <div class=\"product-thumb\">\n                                                                                                    <i class=\"fas fa-box\"></i>\n                                                                                            </div>\n                                            <div>\n                                                <div class=\"fw-semibold small\">Sajjad Vai er cap</div>\n                                                <div class=\"text-muted\" style=\"font-size:.73rem;\">E cap</div>\n                                            </div>\n                                        </div>\n                                    </td>\n                                    <td class=\"fw-semibold\">0</td>\n                                    <td>\n                                                                                <div class=\"d-flex align-items-center gap-2\">\n                                            <div class=\"stock-bar flex-fill\" style=\"max-width:60px;\">\n                                                <div class=\"stock-bar-fill\" style=\"width: 35%; background: #f59e0b;\"></div>\n                                            </div>\n                                            <small class=\"text-muted\">7</small>\n                                        </div>\n                                    </td>\n                                </tr>\n                                                    </tbody>\n                    </table>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n\n<div class=\"row g-4 mb-4\">\n    <div class=\"col-12 col-lg-6 dash-animate dash-animate-7\">\n        <div class=\"dash-panel\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Recent Customers</h3>\n                    <small>Newest customer registrations</small>\n                </div>\n                <span class=\"badge bg-success rounded-pill px-3 py-2\">1</span>\n            </div>\n            <div class=\"panel-body flush\">\n                <div class=\"table-responsive\">\n                    <table class=\"table table-hover align-middle\">\n                        <thead>\n                            <tr>\n                                <th>Customer</th>\n                                <th>Phone</th>\n                                <th>Joined</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                                                            <tr>\n                                    <td>\n                                        <div class=\"customer-cell\">\n                                            <div class=\"customer-avatar\" style=\"background: linear-gradient(135deg, #10b981, #059669);\">\n                                                G\n                                            </div>\n                                            <div class=\"fw-semibold small\">General Customer</div>\n                                        </div>\n                                    </td>\n                                    <td class=\"text-muted small\">0170xxxxxxx</td>\n                                    <td class=\"text-muted small\">2 months ago</td>\n                                </tr>\n                                                    </tbody>\n                    </table>\n                </div>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"col-12 col-lg-6 dash-animate dash-animate-8\">\n        <div class=\"dash-panel\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Recent Visitors</h3>\n                    <small>Latest browsing activity</small>\n                </div>\n                <span class=\"badge bg-dark rounded-pill px-3 py-2\">0</span>\n            </div>\n            <div class=\"panel-body flush\">\n                <div class=\"table-responsive\">\n                    <table class=\"table table-hover align-middle\">\n                        <thead>\n                            <tr>\n                                <th>Date</th>\n                                <th>Browser</th>\n                                <th>Device Info</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                                                            <tr>\n                                    <td colspan=\"3\">\n                                        <div class=\"empty-state\">\n                                            <i class=\"fas fa-eye\"></i>\n                                            <div>No visitor data yet.</div>\n                                        </div>\n                                    </td>\n                                </tr>\n                                                    </tbody>\n                    </table>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n\n<div class=\"row g-4 mb-4\">\n    <div class=\"col-12 col-md-5 dash-animate dash-animate-7\">\n        <div class=\"dash-panel\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Website QR Code</h3>\n                    <small>Scan to visit your store</small>\n                </div>\n            </div>\n            <div class=\"panel-body text-center\">\n                <div class=\"d-inline-block p-3 bg-light rounded-3 border\" onclick=\"copyToClipboard('https://izan.dengrweb.com')\" style=\"cursor: pointer;\" title=\"Click to copy URL\">\n                    <table class=\"qr\" cellpadding=\"0\" cellspacing=\"0\" style=\"font-size: 1px;\">\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"on\" style=\"width: 4px; background-color: #000\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n<tr style=\"height: 4px;\"><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td><td class=\"off\" style=\"width: 4px; background-color: #FFF\">&nbsp;</td></tr>\n</table>\n                </div>\n                <div class=\"mt-2\">\n                    <small class=\"text-muted\">Click QR to copy website URL</small>\n                </div>\n                <a href=\"https://izan.dengrweb.com\" target=\"_blank\" class=\"btn btn-sm btn-primary mt-3 rounded-pill px-4\">\n                    <i class=\"fas fa-external-link-alt me-1\"></i> Visit Website\n                </a>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"col-12 col-md-7 dash-animate dash-animate-8\">\n        <div class=\"dash-panel\">\n            <div class=\"panel-header\">\n                <div>\n                    <h3>Cron Jobs & Scheduler</h3>\n                    <small>System scheduled tasks</small>\n                </div>\n            </div>\n            <div class=\"panel-body\">\n                <div class=\"row g-3\">\n                    <div class=\"col-12\">\n                        <div class=\"rounded-3 border bg-light p-3 d-flex align-items-center gap-3\">\n                            <div class=\"stat-icon\" style=\"background: linear-gradient(135deg, #3b82f6, #2563eb); width: 2rem; height: 2rem; font-size: .8rem;\">\n                                <i class=\"fas fa-clock\"></i>\n                            </div>\n                            <div class=\"flex-fill\">\n                                <div class=\"fw-semibold small\">Scheduler</div>\n                                <code class=\"small text-muted\">* * * * * cd /home/izanfood_com/public_html/public && php artisan schedule:run >> /dev/null 2>&1</code>\n                            </div>\n                        </div>\n                    </div>\n                    <div class=\"col-12\">\n                        <div class=\"rounded-3 border bg-light p-3 d-flex align-items-center gap-3\">\n                            <div class=\"stat-icon\" style=\"background: linear-gradient(135deg, #f59e0b, #d97706); width: 2rem; height: 2rem; font-size: .8rem;\">\n                                <i class=\"fas fa-cogs\"></i>\n                            </div>\n                            <div class=\"flex-fill\">\n                                <div class=\"fw-semibold small\">Queue Worker</div>\n                                <code class=\"small text-muted\">cd /home/izanfood_com/public_html/public && php artisan queue:work</code>\n                            </div>\n                        </div>\n                    </div>\n                    <div class=\"col-12\">\n                        <div class=\"rounded-3 border bg-light p-3 d-flex align-items-center gap-3\">\n                            <div class=\"stat-icon\" style=\"background: linear-gradient(135deg, #10b981, #059669); width: 2rem; height: 2rem; font-size: .8rem;\">\n                                <i class=\"fas fa-database\"></i>\n                            </div>\n                            <div class=\"flex-fill\">\n                                <div class=\"fw-semibold small\">Backup Job</div>\n                                <code class=\"small text-muted\">0 */6 * * * curl -s https://izan.dengrweb.com/database/backupJobs</code>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n\n\n                </div><!-- /.container -->\n            </section>\n            <!-- /.content -->\n        </div>\n        <!-- /.content-wrapper -->\n\n        <!-- Scroll Button Group -->\n<div class=\"scroll-btn-group22222\">\n    <button class=\"scroll-btn\" id=\"scrollToTop555\" title=\"Go to Top\">\n        <i class=\"fas fa-angle-double-up\"></i>\n    </button>\n    <button class=\"scroll-btn\" id=\"scrollUp2222\" title=\"Scroll Up\">\n        <i class=\"fas fa-angle-up\"></i>\n    </button>\n    <button class=\"scroll-btn scroll-percent\" id=\"scrollPercent333\">0%</button>\n    <button class=\"scroll-btn\" id=\"scrollDown3333\" title=\"Scroll Down\">\n        <i class=\"fas fa-angle-down\"></i>\n    </button>\n    <button class=\"scroll-btn\" id=\"scrollToBottom555\" title=\"Go to Bottom\">\n        <i class=\"fas fa-angle-double-down\"></i>\n    </button>\n</div>\n\n<style>\n  .scroll-btn-group22222 {\n        position: fixed;\n        top: 50%;\n        right: 1px;\n        transform: translateY(-50%);\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        z-index: 9999;\n        /* gap: 21px; */\n        /* minimal space */\n        border-radius: 25px;\n        overflow: hidden;\n        /* padding: 10px 0; */\n    }\n\n    /* Circle buttons */\n    .scroll-btn {\n        background: rgba(0,0,0,0.7);\n        border: none;\n        color: #fff;\n        cursor: pointer;\n        font-size: 20px;\n        width: 30px;\n        height: 30px;\n        /* border-radius: 50%; */\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        transition: all 0.2s ease;\n        padding: 22px 0;\n    }\n\n    .scroll-btn:hover {\n        background: #007bff;\n        transform: scale(1.1);\n    }\n\n    /* Percentage button (vertical) */\n    .scroll-percent {\n        background: #222;\n        color: #fff;\n        font-size: 12px;\n        font-weight: 600;\n        width: 30px;\n        height: 52px;\n        /* border-radius: 4px; */\n        cursor: default;\n        pointer-events: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        writing-mode: sideways-lr;\n        /* rotate text vertically */\n        /* text-orientation: mixed; */\n        /* upright numbers */\n    }\n\n    /* Disabled buttons */\n    .hidden22222 {\n        opacity: 0.35;\n        pointer-events: none;\n    }\n</style>\n\n<script>\n(function () {\n    const upBtn = document.getElementById('scrollUp2222');\n    const downBtn = document.getElementById('scrollDown3333');\n    const percentBtn = document.getElementById('scrollPercent333');\n    const topBtn = document.getElementById('scrollToTop555');\n    const bottomBtn = document.getElementById('scrollToBottom555');\n\n    function smoothScroll(direction) {\n        const distance = window.innerHeight * 0.8;\n        window.scrollBy({ top: direction * distance, behavior: 'smooth' });\n    }\n\n    function goToTop() {\n        window.scrollTo({ top: 0, behavior: 'smooth' });\n    }\n\n    function goToBottom() {\n        window.scrollTo({ top: document.documentElement.scrollHeight, behavior: 'smooth' });\n    }\n\n    function updatescrollPercent333() {\n        const doc = document.documentElement;\n        const scrollTop = window.scrollY || doc.scrollTop;\n        const scrollHeight = doc.scrollHeight - doc.clientHeight;\n        const percent = Math.round((scrollTop / scrollHeight) * 100);\n        percentBtn.textContent = percent + '%';\n\n        topBtn.classList.toggle('hidden22222', scrollTop <= 0);\n        upBtn.classList.toggle('hidden22222', scrollTop <= 0);\n        downBtn.classList.toggle('hidden22222', scrollTop >= scrollHeight - 1);\n        bottomBtn.classList.toggle('hidden22222', scrollTop >= scrollHeight - 1);\n    }\n\n    upBtn.addEventListener('click', () => smoothScroll(-1));\n    downBtn.addEventListener('click', () => smoothScroll(1));\n    topBtn.addEventListener('click', goToTop);\n    bottomBtn.addEventListener('click', goToBottom);\n    window.addEventListener('scroll', updatescrollPercent333, { passive: true });\n    window.addEventListener('resize', updatescrollPercent333);\n\n    updatescrollPercent333();\n})();\n</script>\n\n\n\n        <!-- Control Sidebar -->\n\n        <!-- /.control-sidebar -->\n\n    </div>\n    <!-- ./wrapper -->\n\n    <!-- jQuery -->\n<script src=\"https://izan.dengrweb.com/vendor/jquery/jquery.min.js\"></script>\n<!-- jQuery UI 1.11.4 -->\n<script src=\"https://izan.dengrweb.com/vendor/jquery-ui/jquery-ui.min.js\"></script>\n<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->\n\n<script src=\"https://izan.dengrweb.com/vendor/printarea/jquery.PrintArea.js\"></script>\n\n<script>\n    $.widget.bridge('uibutton', $.ui.button)\n</script>\n<!-- Bootstrap 4 -->\n<script src=\"https://izan.dengrweb.com/vendor/bootstrap/js/bootstrap.bundle.min.js\"></script>\n<!-- ChartJS -->\n<script src=\"https://izan.dengrweb.com/vendor/chart.js/Chart.min.js\"></script>\n<!-- Sparkline -->\n<script src=\"https://izan.dengrweb.com/vendor/sparklines/sparkline.js\"></script>\n<!-- JQVMap -->\n\n<!-- daterangepicker -->\n<script src=\"https://izan.dengrweb.com/vendor/moment/moment.min.js\"></script>\n<script src=\"https://izan.dengrweb.com/vendor/daterangepicker/daterangepicker.js\"></script>\n<script src=\"https://izan.dengrweb.com/vendor/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.js\"></script>\n\n<!-- flasher -->\n<script src=\"https://izan.dengrweb.com/vendor/flasher/flasher.min.js\"></script>\n\n\n<script src=\"https://izan.dengrweb.com/vendor/datatables/jquery.dataTables.min.js\"></script>\n<script src=\"https://izan.dengrweb.com/vendor/datatables-buttons/js/dataTables.buttons.min.js\"></script>\n<script src=\"https://izan.dengrweb.com/vendor/datatables-buttons/js/buttons.html5.min.js\"></script>\n<script src=\"https://izan.dengrweb.com/vendor/datatables-buttons/js/buttons.print.min.js\"></script>\n<script src=\"https://izan.dengrweb.com/vendor/datatables-buttons/js/buttons.colVis.min.js\"></script>\n<script src=\"https://izan.dengrweb.com/vendor/jszip/jszip.js\"></script>\n<script src=\"https://izan.dengrweb.com/vendor/datatables-buttons/js/pdfmake.min.js\"></script>\n<script src=\"https://izan.dengrweb.com/vendor/datatables-buttons/js/vfs_fonts.js\"></script>\n\n\n\n\n\n\n\n<script src=\"https://izan.dengrweb.com/vendor/select2/js/select2.min.js\"></script>\n<!-- AdminLTE App -->\n<script src=\"https://izan.dengrweb.com/assets/dist/js/adminlte.js\"></script>\n\n<!-- AdminLTE dashboard demo (This is only for demo purposes) -->\n<script src=\"https://izan.dengrweb.com/assets/dist/js/pages/dashboard.js\"></script>\n\n<script src=\"https://izan.dengrweb.com/assets/dist/js/common.js\"></script>\n<script src=\"https://izan.dengrweb.com/assets/dist/js/account.js\"></script>\n\n<script>\n    let base_url = \"https://izan.dengrweb.com\";\n    let filter_data_type = '';\n    function updaePagePaginate(url, thi, target) {\n        $.ajax({\n            url: url,\n            type: \"GET\",\n            data: {\n                variant_id: filter_data_type\n            },\n            success: function(response) {\n                $(thi).parents(target).html(response);\n            },\n            error: function(xhr, status, error) {\n                console.error(xhr.responseText);\n                $(thi).parents(target).html('<p>Error loading content.</p>');\n            }\n        })\n    }\n\n function change_category(thi, target_class, param_key = 'cat_id', items_value_unsets = []) {\n    const selectedValue = $(thi).val();\n    // Reset target select\n    $(target_class)\n        .val(0)\n        .trigger('change')\n        .attr('data-placeholder', 'Select item');\n\n        if (items_value_unsets.length > 0) {\n            items_value_unsets.forEach(item => {\n                $(item).val(0).trigger('change').attr('data-placeholder', 'Select item');\n            });\n        }\n\n    // Update URL\n    let data_url = $(target_class).data('url');\n    const url = new URL(data_url, window.location.origin);\n\n    url.searchParams.set(param_key, selectedValue);\n\n    $(target_class).data('url', url.toString());\n\n    select2_caller();\n}\n\n\n\n\n</script>\n    <script>\n    function price_format(price) {\n  // Example: simulate settings('currency_symbol', 9)\n  // Suppose this returns something like \"$ `price`\" or \"`price` €\"\n  const currencySymbol = 'BDT `price`';\n\n  // Format number with 2 decimal places\n  const formattedPrice = Number(Math.abs(price)).toLocaleString(undefined, {\n    minimumFractionDigits: 2,\n    maximumFractionDigits: 2\n  });\n\n  // Replace the placeholder with the formatted price\n  return price < 0 ? '-' + currencySymbol.replace('`price`', formattedPrice) : currencySymbol.replace('`price`', formattedPrice);\n}\n\n\nfunction timeAgo(dateString) {\n    const date = new Date(dateString);\n    const now = new Date();\n    const seconds = Math.floor((now - date) / 1000);\n\n    let interval = Math.floor(seconds / 31536000);\n    if (interval >= 1) return interval + \" year\" + (interval > 1 ? \"s\" : \"\") + \" ago\";\n\n    interval = Math.floor(seconds / 2592000);\n    if (interval >= 1) return interval + \" month\" + (interval > 1 ? \"s\" : \"\") + \" ago\";\n\n    interval = Math.floor(seconds / 86400);\n    if (interval >= 1) return interval + \" day\" + (interval > 1 ? \"s\" : \"\") + \" ago\";\n\n    interval = Math.floor(seconds / 3600);\n    if (interval >= 1) return interval + \" hour\" + (interval > 1 ? \"s\" : \"\") + \" ago\";\n\n    interval = Math.floor(seconds / 60);\n    if (interval >= 1) return interval + \" minute\" + (interval > 1 ? \"s\" : \"\") + \" ago\";\n\n    return \"just now\";\n}\n\n</script>\n    <script src=\"https://izan.dengrweb.com/vendor/apexcharts/apexcharts.min.js\"></script>\n<script>\ndocument.addEventListener('DOMContentLoaded', function () {\n\n    // --- Live Clock ---\n    function updateClock() {\n        const now = new Date();\n        const timeEl = document.getElementById('heroTime');\n        if (timeEl) {\n            timeEl.textContent = now.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: true });\n        }\n    }\n    setInterval(updateClock, 1000);\n\n    // --- Animated Counters ---\n    document.querySelectorAll('[data-counter]').forEach(function (el) {\n        const target = parseFloat(el.getAttribute('data-counter')) || 0;\n        const isCurrency = el.textContent.includes('BDT');\n        const duration = 1200;\n        const startTime = performance.now();\n\n        function animate(currentTime) {\n            const elapsed = currentTime - startTime;\n            const progress = Math.min(elapsed / duration, 1);\n            const eased = 1 - Math.pow(1 - progress, 3);\n            const current = target * eased;\n\n            if (isCurrency) {\n                el.textContent = 'BDT ' + Math.round(current).toLocaleString();\n            } else {\n                el.textContent = Math.round(current).toLocaleString();\n            }\n\n            if (progress < 1) {\n                requestAnimationFrame(animate);\n            } else {\n                if (isCurrency) {\n                    el.textContent = 'BDT ' + target.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });\n                } else {\n                    el.textContent = target.toLocaleString();\n                }\n            }\n        }\n\n        requestAnimationFrame(animate);\n    });\n\n    // --- Sales Trend Chart ---\n    const salesEl = document.querySelector('#salesTrendChart');\n    if (salesEl && typeof ApexCharts !== 'undefined') {\n        const salesChart = new ApexCharts(salesEl, {\n            series: [{\n                name: 'Revenue',\n                data: [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],\n            }],\n            chart: {\n                type: 'area',\n                height: 320,\n                toolbar: { show: false },\n                zoom: { enabled: false },\n                fontFamily: 'inherit',\n                sparkline: { enabled: false },\n            },\n            stroke: { curve: 'smooth', width: 2.5 },\n            fill: {\n                type: 'gradient',\n                gradient: {\n                    shadeIntensity: 1,\n                    opacityFrom: 0.35,\n                    opacityTo: 0.02,\n                    stops: [0, 100],\n                }\n            },\n            colors: ['#38bdf8'],\n            grid: { borderColor: 'rgba(255,255,255,0.08)', strokeDashArray: 4, padding: { left: 8, right: 8 } },\n            dataLabels: { enabled: false },\n            xaxis: {\n                categories: [\"25 Aug\",\"26 Aug\",\"27 Aug\",\"28 Aug\",\"29 Aug\",\"30 Aug\",\"31 Aug\",\"01 Sep\",\"02 Sep\",\"03 Sep\",\"04 Sep\",\"05 Sep\",\"06 Sep\",\"07 Sep\",\"08 Sep\",\"09 Sep\",\"10 Sep\",\"11 Sep\",\"12 Sep\",\"13 Sep\",\"14 Sep\",\"15 Sep\",\"16 Sep\",\"17 Sep\",\"18 Sep\",\"19 Sep\",\"20 Sep\",\"21 Sep\",\"22 Sep\",\"23 Sep\"],\n                labels: { style: { colors: 'rgba(255,255,255,0.45)', fontSize: '11px' } },\n                axisBorder: { color: 'rgba(255,255,255,0.08)' },\n                axisTicks: { color: 'rgba(255,255,255,0.08)' },\n            },\n            yaxis: {\n                labels: {\n                    formatter: v => 'BDT ' + Number(v).toLocaleString(),\n                    style: { colors: 'rgba(255,255,255,0.45)', fontSize: '11px' },\n                },\n            },\n            tooltip: {\n                theme: 'dark',\n                y: { formatter: v => 'BDT ' + Number(v).toLocaleString() },\n            },\n            markers: {\n                size: 0,\n                hover: { size: 5, sizeOffset: 3 },\n            },\n        });\n        salesChart.render();\n    }\n\n    // --- Order Status Donut ---\n    const statusEl = document.querySelector('#orderStatusChart');\n    if (statusEl && typeof ApexCharts !== 'undefined') {\n        const statusChart = new ApexCharts(statusEl, {\n            series: [0,4,0,1],\n            chart: { type: 'donut', height: 220, fontFamily: 'inherit' },\n            colors: [\"#f59e0b\",\"#3b82f6\",\"#10b981\",\"#ef4444\"],\n            labels: [\"Pending\",\"Processing\",\"Delivered\",\"Cancelled\"],\n            plotOptions: {\n                pie: {\n                    donut: {\n                        size: '72%',\n                        labels: {\n                            show: true,\n                            name: { show: false },\n                            value: {\n                                show: true,\n                                fontSize: '22px',\n                                fontWeight: 700,\n                                formatter: function (val) { return val; },\n                            },\n                            total: {\n                                show: true,\n                                label: 'Total',\n                                fontSize: '12px',\n                                color: '#94a3b8',\n                                formatter: function (w) {\n                                    return w.globals.seriesTotals.reduce((a, b) => a + b, 0);\n                                },\n                            },\n                        },\n                    },\n                },\n            },\n            stroke: { width: 0 },\n            dataLabels: { enabled: false },\n            legend: { show: false },\n            tooltip: { theme: 'light' },\n        });\n        statusChart.render();\n    }\n\n    // --- Monthly Revenue Bar Chart ---\n    const monthlyEl = document.querySelector('#monthlyRevenueChart');\n    if (monthlyEl && typeof ApexCharts !== 'undefined') {\n        const monthlyChart = new ApexCharts(monthlyEl, {\n            series: [{\n                name: 'Revenue',\n                data: [0,0,0,0,0,0],\n            }],\n            chart: {\n                type: 'bar',\n                height: 280,\n                toolbar: { show: false },\n                fontFamily: 'inherit',\n            },\n            colors: ['#6366f1'],\n            plotOptions: {\n                bar: {\n                    borderRadius: 6,\n                    columnWidth: '55%',\n                    distributed: true,\n                },\n            },\n            grid: { borderColor: '#e2e8f0', strokeDashArray: 4, padding: { left: 8, right: 8 } },\n            dataLabels: { enabled: false },\n            xaxis: {\n                categories: [\"Apr 2026\",\"May 2026\",\"Jun 2026\",\"Jul 2026\",\"Aug 2026\",\"Sep 2026\"],\n                labels: { style: { colors: '#94a3b8', fontSize: '11px' } },\n                axisBorder: { show: false },\n                axisTicks: { show: false },\n            },\n            yaxis: {\n                labels: {\n                    formatter: v => 'BDT ' + Number(v).toLocaleString(),\n                    style: { colors: '#94a3b8', fontSize: '11px' },\n                },\n            },\n            tooltip: {\n                y: { formatter: v => 'BDT ' + Number(v).toLocaleString() },\n            },\n        });\n        monthlyChart.render();\n    }\n\n    // --- Category Sales Horizontal Bar ---\n    const catEl = document.querySelector('#categoryChart');\n    if (catEl && typeof ApexCharts !== 'undefined' && 0 > 0) {\n        const catChart = new ApexCharts(catEl, {\n            series: [{\n                name: 'Units Sold',\n                data: [],\n            }],\n            chart: {\n                type: 'bar',\n                height: 280,\n                toolbar: { show: false },\n                fontFamily: 'inherit',\n            },\n            colors: ['#06b6d4'],\n            plotOptions: {\n                bar: {\n                    borderRadius: 4,\n                    horizontal: true,\n                    barHeight: '65%',\n                },\n            },\n            grid: { borderColor: '#e2e8f0', strokeDashArray: 4, padding: { left: 8, right: 8 } },\n            dataLabels: { enabled: false },\n            xaxis: {\n                categories: [],\n                labels: { style: { colors: '#94a3b8', fontSize: '11px' } },\n                axisBorder: { show: false },\n                axisTicks: { show: false },\n            },\n            yaxis: {\n                labels: { style: { colors: '#64748b', fontSize: '12px' } },\n            },\n            tooltip: {},\n        });\n        catChart.render();\n    }\n\n    // --- Intersection Observer for scroll animations ---\n    if ('IntersectionObserver' in window) {\n        const observer = new IntersectionObserver(function (entries) {\n            entries.forEach(function (entry) {\n                if (entry.isIntersecting) {\n                    entry.target.style.animationPlayState = 'running';\n                    observer.unobserve(entry.target);\n                }\n            });\n        }, { threshold: 0.1 });\n\n        document.querySelectorAll('.dash-animate').forEach(function (el) {\n            el.style.animationPlayState = 'paused';\n            observer.observe(el);\n        });\n    }\n\n});\n\n// --- Copy to Clipboard ---\nfunction copyToClipboard(text) {\n    if (navigator.clipboard) {\n        navigator.clipboard.writeText(text).then(function () {\n            showToast('URL copied to clipboard!');\n        });\n    } else {\n        var ta = document.createElement('textarea');\n        ta.value = text;\n        document.body.appendChild(ta);\n        ta.select();\n        document.execCommand('copy');\n        document.body.removeChild(ta);\n        showToast('URL copied to clipboard!');\n    }\n}\n\nfunction showToast(message) {\n    var toast = document.createElement('div');\n    toast.textContent = message;\n    toast.style.cssText = 'position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#0f172a;color:#fff;padding:10px 24px;border-radius:8px;font-size:14px;z-index:99999;box-shadow:0 4px 20px rgba(0,0,0,0.2);animation:fadeIn 0.3s ease;';\n    document.body.appendChild(toast);\n    setTimeout(function () { toast.remove(); }, 2500);\n}\n</script>\n    <!-- Button trigger modal -->\n<button type=\"button\" hidden class=\"btn btn-primary\" data-toggle=\"modal\" data-target=\"#ajax_modal\">\n    Launch modal data-target=\"#ajax_modal\"\n</button>\n\n<!-- Modal -->\n<div class=\"modal fade ajax_modal_dialog\" id=\"ajax_modal\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"ajax_modalLabel\"\n    aria-hidden=\"true\">\n    <div class=\"modal-dialog modal-dialog-scrollable\" role=\"document\">\n        <div class=\"modal-content \">\n            <div class=\"modal-header\">\n                <h5 class=\"modal-title\" id=\"eajax_modalLabel\">Modal title</h5>\n                <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\">\n                    <span aria-hidden=\"true\">&times;</span>\n                </button>\n            </div>\n            <div class=\"modal-body\">\n                ...\n            </div>\n\n        </div>\n    </div>\n</div>\n\n\n\n\n<!-- Button trigger modal -->\n<button type=\"button\" hidden class=\"btn btn-primary\" data-toggle=\"modal\" data-target=\"#ajax_modal_dialog_add\">\n    Launch modal data-target=\"#ajax_modal_dialog_add\"\n</button>\n\n<!-- Modal -->\n<div class=\"modal fade ajax_modal_dialog_add\" id=\"ajax_modal_dialog_add\" tabindex=\"-1\" role=\"dialog\"\n    aria-labelledby=\"add_modal_lLabel\" aria-hidden=\"true\">\n    <div class=\"modal-dialog modal-dialog-scrollable\" role=\"document\">\n        <div class=\"modal-content\">\n            <div class=\"modal-header\">\n                <h5 class=\"modal-title\" id=\"eajax_modalLabel\">Modal title</h5>\n                <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\">\n                    <span aria-hidden=\"true\">&times;</span>\n                </button>\n            </div>\n            <div class=\"modal-body\">\n                ...\n            </div>\n\n        </div>\n    </div>\n</div>\n\n\n\n\n<!-- Button trigger modal -->\n<button type=\"button\" hidden class=\"btn btn-primary\" data-toggle=\"modal\" data-target=\"#ajax_modal_add_plus\">\n    Launch modal data-target=\"#ajax_modal_add_plus\"\n</button>\n\n<!-- Modal -->\n<div class=\"modal fade ajax_modal_add_plus\" id=\"ajax_modal_add_plus\" tabindex=\"-1\" role=\"dialog\"\n    aria-labelledby=\"add_modal_lLabel\" aria-hidden=\"true\">\n    <div class=\"modal-dialog modal-dialog-scrollable\" role=\"document\">\n        <div class=\"modal-content\">\n            <div class=\"modal-header\">\n                <h5 class=\"modal-title\" id=\"eajax_modalLabel\">Modal title</h5>\n                <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\">\n                    <span aria-hidden=\"true\">&times;</span>\n                </button>\n            </div>\n            <div class=\"modal-body\">\n                ...\n            </div>\n\n        </div>\n    </div>\n</div>\n\n\n<!-- Button trigger modal -->\n<button type=\"button\" hidden class=\"btn btn-primary\" data-toggle=\"modal\" data-target=\"#ajax_modal_add_plus_x\">\n    Launch modal data-target=\"#ajax_modal_add_plus_x\"\n</button>\n\n<!-- Modal -->\n<div class=\"modal fade ajax_modal_add_plus_x\" id=\"ajax_modal_add_plus_x\" tabindex=\"-1\" role=\"dialog\"\n    aria-labelledby=\"add_modal_lLabel\" aria-hidden=\"true\">\n    <div class=\"modal-dialog modal-dialog-scrollable\" role=\"document\">\n        <div class=\"modal-content\">\n            <div class=\"modal-header\">\n                <h5 class=\"modal-title\" id=\"eajax_modalLabel\">Modal title</h5>\n                <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\">\n                    <span aria-hidden=\"true\">&times;</span>\n                </button>\n            </div>\n            <div class=\"modal-body\">\n                ...\n            </div>\n\n        </div>\n    </div>\n</div>\n\n\n\n\n<script>\n    var modalDialog = '';\n    var setElement = '';\n    var model = '';\n    var success_func = null;\n    var placeholder_body = `\n        <div class=\"w-100 p-2 glow_text\"></div>\n        <div class=\"w-100 p-2 glow_text\"></div>\n        <div class=\"w-100 p-2 glow_text\"></div>\n        <div class=\"w-100 p-2 glow_text\"></div>\n        <div class=\"w-100 p-2 glow_text\"></div>\n        <div class=\"w-100 p-2 glow_text\"></div>\n        <div class=\"w-100 p-2 glow_text\"></div>\n`;\n\n\n    function button_ajax(thi) {\n\n\n        if ($(thi).data('setelement')) {\n            setElement = $(thi).data('setelement');\n\n        } else {\n\n            if ($(thi).data('target')) {\n                model = document.querySelector($(thi).data('target'));\n            } else {\n                model = document.querySelector('#ajax_modal');\n            }\n\n\n            if ($(thi).data('success')) {\n                success_func = $(thi).data('success');\n            }\n\n\n\n            modalDialog = model.querySelector('.modal-dialog')\n\n            setElement = model.querySelector('.modal-body');\n\n            if ($(thi).data('dialog')) {\n                if ($(modalDialog).data('dialog')) {\n                    var data_array = modalDialog.getAttribute('data-dialog').split(\" \");\n                    data_array.forEach(function(element) {\n                        $(modalDialog).removeClass(element); // Remove each class from modal-dialog\n                    });\n                }\n\n\n                var dialogValue = thi.getAttribute('data-dialog');\n                $(modalDialog).addClass($(thi).data('dialog'));\n                // Add the data-dialog attribute value from thi to the .modal-dialog element\n                modalDialog.setAttribute('data-dialog', dialogValue);\n            }\n\n            \n            if ($(thi).data('title')) {\n                $(model).find('#eajax_modalLabel').html($(thi).data('title'));\n            } else {\n                if ($(thi).title) {\n                    $(model).find('#eajax_modalLabel').html($(thi).title);\n                } else {\n                    $(model).find('#eajax_modalLabel').html('data-title or title');\n                }\n            }\n            \n\n\n        }\n        $(setElement).html(placeholder_body);\n\n\n\n        // console.log(model)\n\n\n        let model_dialog = $(model);\n        if ($(thi).data('dialogstatus') === true || $(thi).data('dialogstatus') === undefined && !$(thi).data('notshow')) {\n            model_dialog.modal('show');\n        }\n\n\n\n\n\n        \n        if ($(thi).data('href')) {\n\n            $.ajax({\n                'type': 'get',\n                'url': thi.getAttribute('data-href'),\n                success: function(response) {\n                    const data = normalizeAjaxResponse(response);\n                    if (data && typeof data === 'object' && !Array.isArray(data)) {\n                        if (data.success == false) {\n                            flasher.error(data.message || data.title);\n                        } else if (data.success == true  || data.type == 'success') {\n                            flasher.success(data.message || data.title);\n                        }\n                        setTimeout(() => {\n                            model_dialog.modal('hide');\n                        }, 1500);\n                    } else {\n                        $(setElement).html(data);\n                    }\n                    if (data && data.refresh && data.refresh == 'true') {\n                        if (typeof datatableM === 'undefined') {\n                            console.log('Data table refresh not found');\n                        } else {\n\n                            datatableM.ajax.reload(null, false); // Reload datatable data without resetting pagination\n\n                        }\n                    }\n\n                    select2_caller();\n                    ckeditor_render();\n                    form_submit('#' + model.getAttribute('id') + ' form');\n                    tooltip_active()\n\n                },\n                error: function(xhr, status, error) {\n\n                    //Error show and refresh button generate\n                    var items_refresh = \"<div class='text-center btn_refresh_head d-flex align-items-center justify-content-center flex-column'>\" + thi.outerHTML +\n                        \"<br/><br/>AJAX Error: \" + status + error + \"</div>\";\n                    $(model).find('.modal-body').html(items_refresh);\n                    $(model).find('.btn_refresh_head .btn').html('Refresh')\n                    //Error show and refresh button generate\n                }\n            })\n        } else {\n            $(model).find('.modal-body').html('data-href');\n        }\n\n\n\n\n\n\n    }\n\n    function isValidJSONObject(obj) {\n        try {\n            JSON.parse(obj);\n            return true;\n        } catch (e) {\n            return false;\n        }\n    }\n\n    function normalizeAjaxResponse(payload) {\n        if (payload && typeof payload === 'object') {\n            return payload;\n        }\n\n        if (typeof payload === 'string') {\n            try {\n                return JSON.parse(payload);\n            } catch (e) {\n                return payload;\n            }\n        }\n\n        return payload;\n    }\n\n    //ckeditor render\n    function ckeditor_render(class_element = '.ckeditor') {\n        // Destroy existing editors first to avoid duplicates\n        for (let name in CKEDITOR.instances) {\n            CKEDITOR.instances[name].destroy(true);\n        }\n\n        document.querySelectorAll(class_element).forEach((el) => {\n            \n             if (el.style.display == 'none') {\n               console.log('none');\n            }else{\n                console.log('block');\n                if (!el.getAttribute('id')) {\n                    el.id = 'ckeditor_' + Math.random().toString(36).substr(2, 9);\n                }\n    \n                // el.setAttribute('contenteditable', 'true');\n    \n                CKEDITOR.replace(el.id, {\n                    height: 200,\n                    removePlugins: 'easyimage,cloudservices',\n                });\n            }\n\n        });\n    }\n\n    // Default All sumernote render\n    // ckeditor_render();default by editors\n\n\n    // All Modal Submit\n    function error_show(xhr, status, error) {\n        var response_error = xhr.responseJSON || normalizeAjaxResponse(xhr.responseText);\n\n        if (typeof response_error === 'string') {\n            flasher.error(response_error || ('AJAX Error: ' + status + ' ' + error));\n            return;\n        }\n\n        if (response_error.errors) {\n            const errors = response_error.errors;\n            var i = 0;\n            Object.keys(errors).forEach(function(key) {\n                i++\n                if (i == 1) {\n                    $('input[name=\"' + key + '\"]').focus();\n                }\n                errors[key].forEach(function(errorMessage) {\n                    flasher.error(errorMessage);\n                });\n            });\n        } else if (response_error.message) {\n            flasher.error(response_error.message);\n        } else {\n            // Error show and refresh button generate\n            var items_refresh = \"<div class='text-center btn_refresh_head d-flex align-items-center justify-content-center flex-column'>\" +\n                \"<div class='btn btn-primary disabled'>Refresh</div>\" +\n                \"<br/><br/>AJAX Error: \" + status + \" \" + error + \"</div>\";\n            $('#ajax_modal .modal-body').html(items_refresh);\n            $('.btn_refresh_head .btn').html('Refresh')\n            // Error show and refresh button generate\n\n        }\n    }\n\n\n\n    // Capture the state before reloading\n    function form_submit(class_element = null) {\n        var forem_reset = false;\n        if (class_element == null) {\n            class_element = '.form_ajax_submit'\n        }\n        document.querySelectorAll(class_element).forEach(function(element) {\n            // console.log(element);\n\n            $(element).on('submit', function(e) {\n\n                // CKEditor Change update before subit\n                for (instance in CKEDITOR.instances) {\n                    CKEDITOR.instances[instance].updateElement();\n                }\n\n                if($(this).data('success')){\n                    success_func = $(this).data('success');\n                }\n                e.preventDefault(); // Prevent the default form submission\n\n                $.ajax({\n                    type: $(this).attr('method'), // Correct way to get form method\n                    url: $(this).attr('action'), // Correct way to get form action URL\n                    data: new FormData(this),\n                    headers: {\n                        Accept: 'application/json'\n                    },\n                    processData: false, // Required for FormData\n                    contentType: false, // Required for FormData\n                    success: function(response, status, xhr) {\n                        const data = normalizeAjaxResponse(response);\n                        console.log(data.status); // Handle success\n                        if (data.type == 'success') {\n                            flasher.success(data.title);\n                            $(model).modal('hide');\n\n                        } else if (data.status == 400) {\n\n                            // its for steedfast specily\n                            error_show(xhr, data.status, 'Bad Request');\n                        } else {\n                            flasher.error(data.title);\n                        }\n\n\n\n                        if (forem_reset == true) {\n                            element.reset();\n                        } else if (data.refresh == 'true') {\n                            if (typeof datatableM === 'undefined') {\n                                console.log('Data table refresh not found');\n                            } else {\n\n                                datatableM.ajax.reload(null, false); // Reload datatable data without resetting pagination\n\n                            }\n                        } else {\n                            if (data.page == 'true') {\n                                window.location.href = '';\n                            } else {\n                                console.log('not changed');\n                            }\n                        }\n\n\n                        if (success_func) {\n                            try {\n                                eval(success_func);\n                            } catch (handlerError) {\n                                console.error('Ajax success handler failed:', handlerError);\n                            }\n                        }\n\n\n\n\n\n\n                    },\n                    error: function(xhr, status, error) {\n                        error_show(xhr, status, error)\n                    }\n                });\n            });\n\n        });\n\n    }\n\n    //Default Call for mapping\n    form_submit();\n\n\n    //when declare class select2 convert select2 format\n    function select2_caller() {\n        document.querySelectorAll('.select2').forEach(function(element) {\n            if ($(element).data('ajax')) {\n                if ($(element).data('model')) {\n                    ajax_data_request(element, true)\n                } else {\n                    ajax_data_request(element)\n                }\n\n            } else {\n                if ($(element).data('model')) {\n                    let model = $(element).closest('.modal')\n                    model = model[0].id;\n                    model = '#' + model;\n                    $(element).select2({\n                        dropdownParent: model,\n\n                    });\n                    console.log(2342)\n                } else {\n                    let tagable = false;\n                    if ($(element).data('tagble')) {\n                        tagable = $(element).data('tagble');\n                    }\n                    $(element).select2({\n                        tags: tagable,\n\n                    });\n                }\n\n            }\n        });\n    }\n\n    //Default Calling option Select2\n    select2_caller();\n\n\n\n    //select2 ajax request\n    function ajax_data_request(thi, model = false) {\n        if (model == true) {\n            model = $(thi).closest('.modal')\n            model = model[0].id;\n            model = '#' + model;\n        }\n\n\n\n        $(thi).select2({\n            dropdownParent: model,\n            placeholder: $(thi).placeholder,\n            ajax: {\n                url: $(thi).data('url'), // Replace with your API endpoint\n                dataType: 'json',\n                delay: 250,\n                data: function(params) {\n                    return {\n                        q: params.term, // Search term\n                    };\n                },\n                processResults: function(data, params) {\n                    // Parse the results into the format expected by Select2\n                    return {\n                        results: data.items, // The array of items\n                    };\n                },\n                cache: true\n            },\n            minimumInputLength: 0 // Minimum length of input to trigger search\n        });\n\n\n    }\n\n\n\n    function tooltip_active() {\n        $(function() {\n            $('[data-toggle=\"tooltip\"]').tooltip();\n        });\n    }\n    tooltip_active()\n\n    function copyElement(button) {\n\n        const text = button.getAttribute('data-href');\n\n        // Copy the text to the clipboard\n        navigator.clipboard.writeText(text).then(() => {\n            alert('Text copied to clipboard!');\n        }).catch(err => {\n            console.error('Error copying text: ', err);\n        });\n    }\n\n\n    function load_items_card(element, retryCount = 3) {\n        if ($(element).data('items') != '') {\n            $.ajax({\n                type: 'get',\n                url: 'https://izan.dengrweb.com/admin/items_load_card',\n                data: {\n                    'items': $(element).data('items'),\n                    'where': $(element).data('where'),\n                },\n                success: function(data) {\n                    $(element).find('.inner .overlay').css('display', 'none');\n                    $(element).find('h3 span').html(data);\n                },\n                error: function(jqXHR, textStatus, errorThrown) {\n                    // Display an error message if needed\n                    console.error('Error loading items:', textStatus, errorThrown);\n                    $(element).find('.inner .overlay').css('display', 'none');\n\n                    if (retryCount > 0) {\n                        console.log('Retrying... Remaining attempts:', retryCount);\n                        load_items_card(element, retryCount - 1); // Retry the request\n                    } else {\n                        $(element).find('h3 span').html('Failed to load items. Please try again later.');\n                    }\n                }\n            });\n        }\n    }\n\n\n    var card_count_loaded = document.querySelectorAll('.card_count_loaded').forEach(function(element) {\n        load_items_card(element);\n\n    })\n\n\n    \n\n</script>\n\n\n\n\n<!-- Button trigger modal -->\n<button type=\"button\" hidden class=\"btn btn-primary upload_ajax_modalbtn\" data-toggle=\"modal\"\n    data-target=\"#upload_ajax_modal\">\n    Launch demo modal\n</button>\n\n<!-- Modal -->\n<div class=\"modal fade\" id=\"upload_ajax_modal\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"upload_ajax_modalLabel\"\n    aria-hidden=\"true\">\n    <div class=\"modal-dialog modal-xl modal-dialog-scrollable\" role=\"document\">\n        <div class=\"modal-content\">\n            <div class=\"modal-header \">\n\n                <h5 class=\"modal-title\" id=\"upload_ajax_modalLabel\">File Manager</h5>\n                <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\">\n                    <span aria-hidden=\"true\">&times;</span>\n                </button>\n\n            </div>\n            <div class=\"modal-body\">\n\n\n                <div class=\"row mb-3\">\n                    \n                    <div class=\"col-md-6 mb-3\">\n                        <div class=\"p-2 converter bg-secondary rounded\">\n                            <label for=\"converter_enabled\" class=\"d-flex align-items-center gap-3\">\n                                <input type=\"checkbox\" name=\"converter_enabled\" class=\"form-check converter_enabled \"\n                                    id=\"converter_enabled\">\n                                Enabled to Resize\n                            </label>\n\n                            <div class=\"row\">\n                                <div class=\"col-12\">\n                                    <label for=\"resize-width\">Resize Width:</label> <br>\n                                    <input type=\"number\" id=\"resize-width\" name=\"resize-width\" placeholder=\"Width\"\n                                        min=\"1\" max=\"5000\" class=\"form-control\">\n                                </div>\n                                <div class=\"col-12\">\n                                    <label for=\"resize-height\">Resize Height:</label> <br>\n                                    <input type=\"number\" id=\"resize-height\" name=\"resize-height\" placeholder=\"Height\"\n                                        min=\"1\" max=\"5000\" class=\"form-control\">\n                                </div>\n                                <div class=\"col-12\">\n                                    <label for=\"quality\">Quality (1-100):</label> <br>\n                                    <input type=\"number\" class=\"form-control\" id=\"quality\" name=\"quality\"\n                                        value=\"100\" min=\"1\" max=\"100\">\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                    \n\n                    \n                    <div class=\"col-md-6 mb-3\"  id=\"drop-area_main\">\n                        <label for=\"file-input\" class=\"d-block\" id=\"drop-area\">\n                            Drag here to upload. Supported formats:</br>\n                            png, jpg, jpeg, gif, webp, mmp, avif\n                            <br />\n                            <div class=\"text-center\">\n                                <span class=\"btn btn-primary\">Browse... Multiple Files Support</span>\n                            </div>\n                        </label>\n                        <input type=\"file\" id=\"file-input\" multiple hidden required\n                            accept=\"image/png, image/jpeg, image/gif, image/webp, image/mmp, image/avif\">\n                    </div>\n                    \n                </div>\n\n                <div class=\"row class_for_sticky_top\">\n                    <div class=\"col-4\">\n                        <label for=\"enable_delete\" style=\"display: inline-flex;gap: 5px; cursor: pointer; user-select: none;\"><input type=\"checkbox\" name=\"enable_delete\" value=\"1\" id=\"enable_delete\" class=\"form-check \" id=\"enable_delete\"> Enabled to Delete</label>\n                    </div>\n                </div>\n\n                \n                <div class=\"row\" id=\"preview-container\"></div>\n\n                \n                <div id=\"image-container\" style=\"\"></div>\n                <br>\n\n            </div>\n\n        </div>\n    </div>\n</div>\n\n\n\n\n\n<script>\n    const dropArea = document.getElementById('drop-area_main');\n    const fileInput = document.getElementById('file-input');\n    var previewContainer = document.querySelector('#preview-container');\n    var imageContainer = document.querySelector('#image-container');\n\n    // Utility function to prevent default browser behavior\n    function preventDefaults(e) {\n        e.preventDefault();\n        e.stopPropagation();\n    }\n\n    // Preventing default browser behavior when dragging a file over the container\n    dropArea.addEventListener('dragover', preventDefaults);\n    dropArea.addEventListener('dragenter', preventDefaults);\n    dropArea.addEventListener('dragleave', preventDefaults);\n\n    // Handling dropping files into the area\n    dropArea.addEventListener('drop', handleDrop);\n\n    // We’ll discuss `handleDrop` function down the road\n    function handleDrop(e) {\n        e.preventDefault();\n\n        // Getting the list of dragged files\n        const files = e.dataTransfer.files;\n\n        // Checking if there are any files\n        if (files.length) {\n            // Assigning the files to the hidden input from the first step\n            fileInput.files = files;\n\n            // Processing the files for previews (next step)\n            //   console.log(files)\n            //   handleFiles(files);\n            file_upload(files);\n            dropArea.classList.remove('drag-over');\n        }\n    }\n\n    fileInput.addEventListener('change', function(e) {\n        e.preventDefault();\n        file_upload(this.files)\n        // handleFiles(this.files);\n    })\n\n    // function generateUniqueFileName(originalName) {\n    //     const timestamp = Date.now(); // Current timestamp\n    //     const randomString = Math.random().toString(36).substring(2, 8); // Random string\n    //     const fileExtension = originalName.substring(originalName.lastIndexOf('.')) || ''; // Extract file extension\n    //     const baseName = originalName.substring(0, originalName.lastIndexOf('.')) || originalName; // Extract base name\n\n    //     return `${baseName.replaceAll('/[ \\-\\/\\\\&+=%#@.,:;()]/g,', '_')}_${timestamp}_${randomString}${fileExtension}`;\n    // }\n\n    function generateUniqueFileName(originalName) {\n        const timestamp = Date.now(); // Current timestamp\n        const randomString = Math.random().toString(36).substring(2, 8); // Random string\n        const fileExtension = originalName.substring(originalName.lastIndexOf('.')) || ''; // Extract file extension\n        const baseName = originalName.substring(0, originalName.lastIndexOf('.')) || originalName; // Extract base name\n\n        // Replace spaces, slashes, special chars with underscores\n        const sanitizedBaseName = baseName.replace(/[ \\-\\/\\\\&+=%#@.,:;()]/g, '_');\n\n        return `${sanitizedBaseName}_${timestamp}_${randomString}${fileExtension}`;\n    }\n\n\n\n\n\n\n    const CHUNK_SIZE = 0.5 * 1024 * 1024; // 500KB\n    const MAX_RETRIES = 3; // Maximum retry attempts\n    async function file_upload(files) {\n\n        for (let j = 0; j < files.length; j++) {\n            let preview_image = `<div  type=\"button\"  class=\"border progress_${j}\">\n                <div class=\"text-center\">\n                    <i class=\"fas fa-spinner fa-pulse\"></i>\n                </div>\n                <div> Please wait</div>\n                <div class=\"progress\">\n\n                     <div class=\"progress-bar progress-bar-striped\" role=\"progressbar\" style=\"width: 10%\" aria-valuenow=\"10\" aria-valuemin=\"0\" aria-valuemax=\"100\"> 0%</div>\n                    </div>\n                </div>\n            </div>`;\n            $(previewContainer).prepend(preview_image)\n        }\n\n        for (let i = 0; i < files.length; i++) {\n            const file = files[i];\n            if (!file) continue;\n            const uniqueFileName = generateUniqueFileName(file.name);\n\n            const totalChunks = Math.ceil(file.size / CHUNK_SIZE);\n            let uploadedChunks = 0;\n\n            for (let chunkIndex = 0; chunkIndex < totalChunks; chunkIndex++) {\n                const start = chunkIndex * CHUNK_SIZE;\n                const end = Math.min(start + CHUNK_SIZE, file.size);\n                const chunk = file.slice(start, end);\n\n                let retryCount = 0;\n                let success = false;\n\n                while (retryCount < MAX_RETRIES && !success) {\n                    try {\n                        await uploadChunk(chunk, uniqueFileName, chunkIndex, totalChunks, file.size, i);\n                        success = true;\n                        uploadedChunks++;\n                    } catch (error) {\n                        retryCount++;\n                        console.error(\n                            `Error uploading chunk ${chunkIndex + 1}: ${error.message}. Retrying (${retryCount}/${MAX_RETRIES})`\n                        );\n                    }\n                }\n\n                if (!success) {\n                    console.error(`Failed to upload chunk ${chunkIndex + 1} after ${MAX_RETRIES} attempts.`);\n                    alert(`Upload failed for file: ${file.name}.`);\n                    return;\n                }\n\n                const progress = Math.floor((uploadedChunks / totalChunks) * 100);\n                // console.log(`Progress: ${progress}%`);\n                $(`.progress_${i} .progress`).html(\n                    `\n                     <div class=\"progress-bar progress-bar-striped\" role=\"progressbar\" style=\"width: ${progress}%\" aria-valuenow=\"10\" aria-valuemin=\"0\" aria-valuemax=\"100\">${progress}%</div>`\n                    )\n                // Optionally update a progress bar or UI element here\n            }\n\n\n\n            \n            \n\n        }\n    }\n\n\n\n    async function uploadChunk(chunk, fileName, chunkIndex, totalChunks, size, current_key) {\n        let converter_enabled = $('input[name=\"converter_enabled\"]').is(':checked') ? 'convert_eanabled' : 'no';\n        let quality = $('input[name=\"quality\"]').val();\n        let resize_width = $('input[name=\"resize-width\"]').val();\n        let resize_height = $('input[name=\"resize-height\"]').val();\n\n\n        const formData = new FormData();\n        formData.append('file', chunk);\n        formData.append('fileName', fileName);\n        formData.append('chunkIndex', chunkIndex);\n        formData.append('totalChunks', totalChunks);\n        formData.append('file_size', size);\n        formData.append('converter_enabled', converter_enabled);\n        formData.append('quality', quality);\n        formData.append('resize_width', resize_width);\n        formData.append('resize_height', resize_height);\n\n        const response = await fetch('https://izan.dengrweb.com/uploads/post', {\n            method: 'POST',\n            body: formData,\n        });\n\n        if (!response.ok) {\n            throw new Error(`HTTP error! status: ${response.status}`);\n        }\n\n        \n        const data = await response.json();\n        if (data.complete) {\n            preview_image = format_image_preview(data.name, data.id)\n            $(`.progress_${current_key}`).html(`${preview_image}`)\n            $(`.progress_${current_key}`).removeClass(`progress_${current_key}`)\n        }\n        \n\n    }\n\n\n\n\n\n\n    dropArea.addEventListener('dragover', () => {\n        dropArea.classList.add('drag-over');\n    });\n\n    dropArea.addEventListener('dragleave', () => {\n        dropArea.classList.remove('drag-over');\n    });\n\n\n\n    function format_image_preview(src_image, id) {\n\n        var src_image = 'https://izan.dengrweb.com/uploads/' + src_image;\n\n        // Check the file extension to determine if it's a video\n        const videoExtensions = ['mp4', 'webm', 'ogg'];\n\n        const extension = src_image.split('.').pop().toLowerCase();\n\n        if (videoExtensions.includes(extension)) {\n\n\n            return `<div  type=\"button\"  class=\"border\"  onclick=\"select_image(this)\">\n            <img hidden data-id=\"${id}\" class=\"img-fluid h-100 \"  style=\"object-fit:contain; max-height: 60px;\" src=\"${src_image}\"/>\n             <video   class=\"img-fluid \" style=\"width:100%;height:100%;object-fit:contain\"\n                        style=\"object-fit:contain;\"\n                        src=\"${src_image}\"\n                        preload=\"metadata\">\n                    </video>\n        </div>`;\n        } else{\n            \n            return `<div  type=\"button\"  class=\"border\"  onclick=\"select_image(this)\">\n                    <img data-id=\"${id}\" class=\"img-fluid h-100 \" style=\"object-fit:contain; max-height: 60px;\" src=\"${src_image}\"/>\n                </div>`;\n        }\n\n    }\n\n    function isValidFileType(file) {\n        const allowedTypes = ['image/jpeg', 'image/png', 'image/webp', 'image/gif'];\n        return allowedTypes.includes(file.type);\n    }\n\n\n\n\n\n\n\n\n    var current_id_loaded = 9999999999999;\n\n    function load_image_ajax() {\n        if(found_false){\n            return;\n        }\n        loding_image = true;\n        $.ajax({\n            type: 'get',\n            url: 'https://izan.dengrweb.com/uploads/get',\n            data: {\n                id: current_id_loaded,\n            },\n            success: function(data) {\n                data = JSON.parse(data);\n                if (data.length == 0) {\n                    $(imageContainer).append('<div>No Found More Data</div>');\n                }\n                Object.keys(data).forEach(function(id, key) {\n\n                    $(imageContainer).append(format_image_preview(data[id], id))\n                    if (id <= parseInt(current_id_loaded)) {\n                        current_id_loaded = id\n                    }\n\n\n                })\n                loding_image = false;\n                // console.log(loding_image);\n                if(data.length == 0){\n                    found_false = true;\n                }\n            },\n            error: function(jqXHR, textStatus, errorThrown) {\n                console.error('Error uploading files:', textStatus, errorThrown); // Handle errors\n                loding_image = false;\n            }\n        })\n    }\n\n\n\n</script>\n\n\n\n\n<script>\n    var currnet_element_selected = '';\n    var p_w_image = '';\n    var p_h_image = '';\n    var loding_image = false;\n    var found_false = false;\n    var ceditor = null;\n\n    function upload_select(thi, width = null, height = null, editor = null) {\n        $('#upload_ajax_modal').modal('show');\n        currnet_element_selected = thi;\n        ceditor =editor\n        p_w_image = width ? width : '';\n        p_h_image = height ? height : '';\n        $(\"#upload_ajax_modal\").find('input[name=\"resize-width\"]').val(p_w_image);\n        $(\"#upload_ajax_modal\").find('input[name=\"resize-height\"]').val(p_h_image);\n\n        let image_container = $('#image-container');\n        if(image_container.length > 0){\n            if(image_container.html() == ''){\n                load_image_ajax();\n            }\n        }\n    }\n\n   // Load more image when scroll\n    let file_upload_manager = $('#drop-area_main');\n    if (file_upload_manager.length > 0) {\n        file_upload_manager.on('scroll', function () {\n            if(loding_image){\n                return;\n            }\n            const scrollTop = $(this).scrollTop();\n            const scrollHeight = $(this)[0].scrollHeight;\n            const containerHeight = $(this).height();\n\n            if (scrollTop + containerHeight >= scrollHeight * 0.9) {\n                load_image_ajax();\n            }\n        });\n    }\n    // end Load more image when scroll\n\n\n\n\n    function select_image(thi) {\n\n         //getting image data from upload window\n        var img_tag_form_upload_window = $(thi).find('img');\n        var src_img = $(img_tag_form_upload_window).attr('src');\n        var img_id = $(img_tag_form_upload_window).data('id');\n\n        let enable_delete = $('#enable_delete');\n        if(enable_delete.length > 0){\n            if($(enable_delete).is(':checked')){\n               if(confirm('Are you sure you want to delete this image?')){\n                    $.ajax({\n                        type: 'get',\n                        url: 'https://izan.dengrweb.com/uploads/delete',\n                        data: {\n                            id: img_id,\n                        },\n                        success: function(data) {\n                            data = JSON.parse(data);\n                        if(data.success){\n                            $(thi).remove();\n                        }else{\n                            alert(data.message);\n                        }\n                        },\n                    })\n                }\n                return;\n            }\n        }\n\n        if(ceditor){\n            const [tabName, elementId] = currnet_element_selected.filebrowser.target.split(':');\n            const dialog = currnet_element_selected.getDialog();\n            const inputField = dialog.getContentElement(tabName, elementId);\n\n            if (!inputField) return console.error('Target input not found!');\n\n            // 3️⃣ Set the value\n            inputField.setValue(src_img);\n\n            // 4️⃣ Update dialog preview if it exists\n            if (dialog.preview) {\n                dialog.preview.setAttribute('src', src_img);\n                dialog.preview.removeStyle('display');\n            }\n\n            console.log('URL filled:', inputField.getValue());\n        }else{\n\n            //setting img info selecting window\n            var selected_eleemtn = $(currnet_element_selected).find('input');\n            var selected_eleemtn_img = $(currnet_element_selected).find('img');\n            if(selected_eleemtn_img.length == 0){\n                selected_eleemtn_img = $(currnet_element_selected).find('video');\n            }\n            $(selected_eleemtn).val(img_id)\n\n            // check image or video\n            var extension = src_img.split('.').pop().toLowerCase();\n            var videoExtensions = ['mp4', 'webm', 'ogg'];\n            if(videoExtensions.includes(extension)){\n                $(selected_eleemtn).attr('type', 'video');\n\n                var video_tag = `<video  class=\"img-fluid \" style=\"width:100%;height:100%;object-fit:contain\"\n                                    style=\"object-fit:contain;max-height: 60px;\"\n                                    src=\"${src_img}\"\n                                    preload=\"metadata\">\n                                </video>`;\n                selected_eleemtn_img.replaceWith(video_tag);\n            }else{\n                var image_tag = `<img class=\"img-fluid h-100 \" style=\"object-fit:contain;max-height: 60px;\" src=\"${src_img}\"/>`;\n                selected_eleemtn_img.replaceWith(image_tag);\n                // selected_eleemtn_img.attr('src', src_img);\n            }\n\n                // check video\n\n            // console.log(src_img);\n            }\n\n        $('#upload_ajax_modal').modal('hide');\n    }\n</script>\n<script>\n    function remove_element_image(thi) {\n        $(thi).parents('.image_items_removeable').remove();\n    }\n\n    function add_more_filed_image(width = null, height = null) {\n        var items_image = `<div class=\"image_items_removeable\">\n                                 <label type=\"button\" class=\"multiple\" onclick=\"upload_select(this, ${width}, ${height})\">\n                                    <input type=\"text\" hidden name=\"images_multiple[]\" id=\"image\" class=\"form-control mb-2\"/>\n                                    <img style=\"max-height: 60px\" src=\"https://izan.dengrweb.com/preset/fixing.png\" alt=\"\"/>\n                                </label>\n                                <span  onclick=\"remove_element_image(this)\">x</span>\n                            </div>`;\n        $('.items_filed_iamge').append(items_image)\n    }\n</script>\n\n\n<style>\n    #preview-container,\n    #image-container {\n        display: grid;\n        max-width: 1250px;\n        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));\n        grid-auto-flow: dense;\n        margin: 0 auto;\n        justify-content: center;\n        grid-gap: 5px;\n    }\n\n\n    #drop-area {\n        width: 100%;\n        height: 100%;\n        /* margin: 20px auto; */\n        padding: 0 15px;\n        text-align: center;\n        line-height: 43px;\n        border: 2px dashed #ccc;\n        cursor: pointer;\n        display: flex !important;\n        align-items: center;\n        justify-content: center;\n        flex-direction: column;\n    }\n\n    #preview-container {\n        text-align: center;\n    }\n\n\n\n    #drop-area.drag-over {\n        background-color: #eee;\n    }\n\n\n\n\n    .items_container_image .items_filed_iamge {\n        display: flex;\n        gap: 7px;\n    }\n\n    .items_container_image .items_filed_iamge input {\n        visibility: hidden;\n    }\n\n    .items_container_image .image_items_removeable {\n        max-width: 70px;\n        position: relative;\n    }\n\n\n    .items_container_image .image_items_removeable span {\n        position: absolute;\n        top: -5px;\n        right: -6px;\n        z-index: 9;\n        background: red;\n        width: 25px;\n        height: 25px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border-radius: 5px\n    }\n\n    .items_container_image .image_items_removeable span:hover {\n        opacity: 0.8;\n    }\n\n    .items_container_image .items_container_image {\n        display: flex;\n        gap: 5px;\n        flex-wrap: wrap;\n    }\n\n\n    .items_container_image .items_filed_iamge {\n        display: flex;\n        flex-wrap: wrap;\n    }\n\n    .items_container_image button.add_image_filed.btn.btn-primary {\n        cursor: pointer;\n    }\n\n    #preview-container i.fas.fa-spinner.fa-pulse {\n        font-size: 23px;\n        margin-top: 10px;\n    }\n\n    #preview-container .progress {\n        margin: 5px;\n    }\n\n    .class_for_sticky_top {\n        position: sticky;\n        top: -16px;\n        background: white;\n        padding: 10px 0px 3px 0;\n        border-bottom: 1px sol;\n        box-shadow: 0px 1px 0px 0px #d5d5d5;\n        margin-bottom: 11px;\n    }\n    div#upload_ajax_modal{\n        z-index: 99999;\n    }\n</style>\n\n\n\n\n</body>\n\n</html>\n"}},"props":[],"propValues":[],"route":{"name":"admin.index","uri":"/admin","action":"App\\Http\\Controllers\\dashboardController@index","actionSource":{"file":"/home/izanfood_com/public_html/app/Http/Controllers/dashboardController.php","line":43}},"renderSource":null,"componentPath":null}