{"id":133,"date":"2026-08-11T09:46:20","date_gmt":"2026-08-11T02:46:20","guid":{"rendered":"https:\/\/rkk.ac.th\/?page_id=133"},"modified":"2026-08-11T10:38:09","modified_gmt":"2026-08-11T03:38:09","slug":"%e0%b8%94%e0%b8%b2%e0%b8%a7%e0%b9%82%e0%b8%ab%e0%b8%a5%e0%b8%94%e0%b9%80%e0%b8%ad%e0%b8%81%e0%b8%aa%e0%b8%b2%e0%b8%a3","status":"publish","type":"page","link":"https:\/\/rkk.ac.th\/?page_id=133","title":{"rendered":"\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\u0e23\u0e32\u0e0a\u0e01\u0e32\u0e23"},"content":{"rendered":"\n<div class=\"wp-block-cover alignfull\" style=\"padding-top:0vw;padding-right:0vw;padding-bottom:0vw;padding-left:0vw;min-height:66vh;aspect-ratio:unset;\"><span aria-hidden=\"true\" class=\"wp-block-cover__background has-black-background-color has-background-dim-100 has-background-dim\"><\/span><div class=\"wp-block-cover__inner-container is-layout-flow wp-container-core-cover-is-layout-db2ba782 wp-block-cover-is-layout-flow\">\n<!-- =========================================================\n     RKK DOCUMENT SYSTEM\n     \u0e42\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e19\u0e23\u0e48\u0e21\u0e40\u0e01\u0e25\u0e49\u0e32 \u0e01\u0e32\u0e0d\u0e08\u0e19\u0e1a\u0e38\u0e23\u0e35\n     ========================================================= -->\n\n<div id=\"rkk-doc-system\">\n\n    <!-- HERO -->\n    <section class=\"rkk-doc-hero\">\n\n        <div class=\"rkk-doc-hero-inner\">\n\n            <img decoding=\"async\"\n                class=\"rkk-doc-logo\"\n                src=\"https:\/\/lh3.googleusercontent.com\/d\/1qCwC756tTgKxhjIz48VVebVJMF-APxJu\"\n                alt=\"\u0e15\u0e23\u0e32\u0e42\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e19\u0e23\u0e48\u0e21\u0e40\u0e01\u0e25\u0e49\u0e32 \u0e01\u0e32\u0e0d\u0e08\u0e19\u0e1a\u0e38\u0e23\u0e35\"\n            >\n\n            <div class=\"rkk-doc-pill\">\n                <span class=\"rkk-doc-dot\"><\/span>\n                \u0e23\u0e30\u0e1a\u0e1a\u0e2a\u0e32\u0e23\u0e2a\u0e19\u0e40\u0e17\u0e28\u0e10\u0e32\u0e19\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\u0e23\u0e32\u0e0a\u0e01\u0e32\u0e23\n            <\/div>\n\n            <p class=\"rkk-doc-intro\">\n                \u0e1a\u0e23\u0e34\u0e01\u0e32\u0e23\u0e2a\u0e37\u0e1a\u0e04\u0e49\u0e19\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e40\u0e2d\u0e01\u0e2a\u0e32\u0e23\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\u0e1b\u0e0f\u0e34\u0e1a\u0e31\u0e15\u0e34\u0e2b\u0e19\u0e49\u0e32\u0e17\u0e35\u0e48\u0e23\u0e32\u0e0a\u0e01\u0e32\u0e23\u0e41\u0e25\u0e30\u0e1b\u0e23\u0e30\u0e01\u0e32\u0e28<br>\n                \u0e02\u0e2d\u0e07\u0e42\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e19\u0e23\u0e48\u0e21\u0e40\u0e01\u0e25\u0e49\u0e32 \u0e01\u0e32\u0e0d\u0e08\u0e19\u0e1a\u0e38\u0e23\u0e35 (\u0e43\u0e19\u0e42\u0e04\u0e23\u0e07\u0e01\u0e32\u0e23\u0e1e\u0e23\u0e30\u0e23\u0e32\u0e0a\u0e14\u0e33\u0e23\u0e34)\n            <\/p>\n\n        <\/div>\n\n    <\/section>\n\n\n    <!-- MAIN -->\n    <main class=\"rkk-doc-main\">\n\n        <!-- FILTERS -->\n        <section class=\"rkk-doc-filters\">\n\n            <div class=\"rkk-doc-search\">\n\n                <span class=\"rkk-doc-search-icon\">\n                    \u2315\n                <\/span>\n\n                <input\n                    id=\"rkkDocSearch\"\n                    type=\"text\"\n                    placeholder=\"\u0e04\u0e49\u0e19\u0e2b\u0e32\u0e40\u0e25\u0e02\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07, \u0e0a\u0e37\u0e48\u0e2d\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07, \u0e01\u0e25\u0e38\u0e48\u0e21\u0e07\u0e32\u0e19 \u0e2b\u0e23\u0e37\u0e2d\u0e1b\u0e35 \u0e1e.\u0e28. ...\"\n                >\n\n            <\/div>\n\n\n            <div class=\"rkk-doc-options\">\n\n                <div class=\"rkk-doc-field\">\n\n                    <label for=\"rkkDocGroup\">\n                        \u0e01\u0e25\u0e38\u0e48\u0e21\u0e07\u0e32\u0e19:\n                    <\/label>\n\n                    <select id=\"rkkDocGroup\">\n\n                        <option value=\"\">\n                            \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e27\u0e34\u0e0a\u0e32\u0e01\u0e32\u0e23\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e27\u0e34\u0e0a\u0e32\u0e01\u0e32\u0e23\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e07\u0e1a\u0e1b\u0e23\u0e30\u0e21\u0e32\u0e13\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e07\u0e1a\u0e1b\u0e23\u0e30\u0e21\u0e32\u0e13\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e17\u0e31\u0e48\u0e27\u0e44\u0e1b\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e17\u0e31\u0e48\u0e27\u0e44\u0e1b\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e07\u0e32\u0e19\u0e1a\u0e38\u0e04\u0e04\u0e25\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e07\u0e32\u0e19\u0e1a\u0e38\u0e04\u0e04\u0e25\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e01\u0e34\u0e08\u0e01\u0e32\u0e23\u0e19\u0e31\u0e01\u0e40\u0e23\u0e35\u0e22\u0e19\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e01\u0e34\u0e08\u0e01\u0e32\u0e23\u0e19\u0e31\u0e01\u0e40\u0e23\u0e35\u0e22\u0e19\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e20\u0e32\u0e29\u0e32\u0e44\u0e17\u0e22\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e20\u0e32\u0e29\u0e32\u0e44\u0e17\u0e22\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e04\u0e13\u0e34\u0e15\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e04\u0e13\u0e34\u0e15\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e27\u0e34\u0e17\u0e22\u0e32\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c\u0e41\u0e25\u0e30\u0e40\u0e17\u0e04\u0e42\u0e19\u0e42\u0e25\u0e22\u0e35\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e27\u0e34\u0e17\u0e22\u0e32\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c\u0e41\u0e25\u0e30\u0e40\u0e17\u0e04\u0e42\u0e19\u0e42\u0e25\u0e22\u0e35\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e2a\u0e31\u0e07\u0e04\u0e21\u0e2f\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e2a\u0e31\u0e07\u0e04\u0e21\u0e2f\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e2a\u0e38\u0e02\u0e28\u0e36\u0e01\u0e29\u0e32\u0e2f\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e2a\u0e38\u0e02\u0e28\u0e36\u0e01\u0e29\u0e32\u0e2f\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e28\u0e34\u0e25\u0e1b\u0e30\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e28\u0e34\u0e25\u0e1b\u0e30\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e01\u0e32\u0e23\u0e07\u0e32\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e1e\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e01\u0e32\u0e23\u0e07\u0e32\u0e19\u0e2d\u0e32\u0e0a\u0e35\u0e1e\n                        <\/option>\n\n                        <option value=\"\u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e20\u0e32\u0e29\u0e32\u0e15\u0e48\u0e32\u0e07\u0e1b\u0e23\u0e30\u0e40\u0e17\u0e28\">\n                            \u0e01\u0e25\u0e38\u0e48\u0e21\u0e2a\u0e32\u0e23\u0e30\u0e2f \u0e20\u0e32\u0e29\u0e32\u0e15\u0e48\u0e32\u0e07\u0e1b\u0e23\u0e30\u0e40\u0e17\u0e28\n                        <\/option>\n\n                        <option value=\"\u0e07\u0e32\u0e19\u0e41\u0e19\u0e30\u0e41\u0e19\u0e27\">\n                            \u0e07\u0e32\u0e19\u0e41\u0e19\u0e30\u0e41\u0e19\u0e27\n                        <\/option>\n\n                        <option value=\"\u0e07\u0e32\u0e19\u0e2b\u0e49\u0e2d\u0e07\u0e2a\u0e21\u0e38\u0e14\">\n                            \u0e07\u0e32\u0e19\u0e2b\u0e49\u0e2d\u0e07\u0e2a\u0e21\u0e38\u0e14\n                        <\/option>\n\n                        <option value=\"\u0e07\u0e32\u0e19\u0e18\u0e38\u0e23\u0e01\u0e32\u0e23\">\n                            \u0e07\u0e32\u0e19\u0e18\u0e38\u0e23\u0e01\u0e32\u0e23\n                        <\/option>\n\n                        <option value=\"\u0e2d\u0e37\u0e48\u0e19 \u0e46\">\n                            \u0e2d\u0e37\u0e48\u0e19 \u0e46\n                        <\/option>\n\n                    <\/select>\n\n                <\/div>\n\n\n                <div class=\"rkk-doc-field\">\n\n                    <label for=\"rkkDocYear\">\n                        \u0e1b\u0e35 \u0e1e.\u0e28.:\n                    <\/label>\n\n                    <select id=\"rkkDocYear\">\n\n                        <option value=\"\">\n                            \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14\n                        <\/option>\n\n                    <\/select>\n\n                <\/div>\n\n\n                <button\n                    id=\"rkkDocReset\"\n                    class=\"rkk-doc-reset\"\n                    type=\"button\"\n                >\n                    \u21bb \u0e23\u0e35\u0e40\u0e0b\u0e47\u0e15\n                <\/button>\n\n\n                <div class=\"rkk-doc-view-switch\">\n\n                    <button\n                        id=\"rkkDocTableButton\"\n                        class=\"active\"\n                        type=\"button\"\n                    >\n                        \u2630 \u0e15\u0e32\u0e23\u0e32\u0e07\n                    <\/button>\n\n                    <button\n                        id=\"rkkDocCardButton\"\n                        type=\"button\"\n                    >\n                        \u25a6 \u0e01\u0e32\u0e23\u0e4c\u0e14\n                    <\/button>\n\n                <\/div>\n\n            <\/div>\n\n        <\/section>\n\n\n        <!-- META -->\n        <section class=\"rkk-doc-meta\">\n\n            <div id=\"rkkDocStatus\">\n                \u0e01\u0e33\u0e25\u0e31\u0e07\u0e42\u0e2b\u0e25\u0e14\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25&#8230;\n            <\/div>\n\n            <div id=\"rkkDocCount\"><\/div>\n\n        <\/section>\n\n\n        <!-- TABLE VIEW -->\n        <section\n            id=\"rkkDocTableView\"\n            class=\"rkk-doc-table-box\"\n        >\n\n            <div class=\"rkk-doc-table-scroll\">\n\n                <table>\n\n                    <thead>\n\n                        <tr>\n\n                            <th>\n                                \u0e40\u0e25\u0e02\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\n                            <\/th>\n\n                            <th class=\"rkk-center\">\n                                \u0e1b\u0e35 \u0e1e.\u0e28.\n                            <\/th>\n\n                            <th>\n                                \u0e0a\u0e37\u0e48\u0e2d\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07 \/ \u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\n                            <\/th>\n\n                            <th>\n                                \u0e01\u0e25\u0e38\u0e48\u0e21\u0e07\u0e32\u0e19\n                            <\/th>\n\n                            <th class=\"rkk-center\">\n                                \u0e40\u0e2d\u0e01\u0e2a\u0e32\u0e23\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\n                            <\/th>\n\n                        <\/tr>\n\n                    <\/thead>\n\n                    <tbody id=\"rkkDocTableBody\"><\/tbody>\n\n                <\/table>\n\n            <\/div>\n\n        <\/section>\n\n\n        <!-- CARD VIEW -->\n        <section\n            id=\"rkkDocCardView\"\n            class=\"rkk-doc-card-grid\"\n        ><\/section>\n\n\n        <!-- EMPTY STATE -->\n        <section\n            id=\"rkkDocEmpty\"\n            class=\"rkk-doc-empty\"\n        >\n\n            <div class=\"rkk-doc-empty-icon\">\n                \u25eb\n            <\/div>\n\n            <strong>\n                \u0e44\u0e21\u0e48\u0e1e\u0e1a\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e40\u0e2d\u0e01\u0e2a\u0e32\u0e23\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\n            <\/strong>\n\n            <span>\n                \u0e25\u0e2d\u0e07\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e04\u0e33\u0e04\u0e49\u0e19\u0e2b\u0e32 \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e07\u0e37\u0e48\u0e2d\u0e19\u0e44\u0e02\u0e01\u0e32\u0e23\u0e04\u0e49\u0e19\u0e2b\u0e32\n            <\/span>\n\n        <\/section>\n\n\n        <!-- PAGINATION -->\n        <nav\n            id=\"rkkDocPagination\"\n            class=\"rkk-doc-pagination\"\n        ><\/nav>\n\n    <\/main>\n\n\n    <!-- FOOTER -->\n    <footer class=\"rkk-doc-footer\">\n\n        <strong>\n            \u0e42\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e19\u0e23\u0e48\u0e21\u0e40\u0e01\u0e25\u0e49\u0e32 \u0e01\u0e32\u0e0d\u0e08\u0e19\u0e1a\u0e38\u0e23\u0e35 (\u0e43\u0e19\u0e42\u0e04\u0e23\u0e07\u0e01\u0e32\u0e23\u0e1e\u0e23\u0e30\u0e23\u0e32\u0e0a\u0e14\u0e33\u0e23\u0e34)\n        <\/strong>\n\n        <span>\n            \u0e23\u0e30\u0e1a\u0e1a\u0e10\u0e32\u0e19\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e40\u0e2d\u0e01\u0e2a\u0e32\u0e23\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\u0e42\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e19\n        <\/span>\n\n    <\/footer>\n\n\n    <!-- DOCUMENT VIEWER -->\n    <div\n        id=\"rkkDocModal\"\n        class=\"rkk-doc-modal\"\n    >\n\n        <div class=\"rkk-doc-modal-box\">\n\n            <header class=\"rkk-doc-modal-header\">\n\n                <div class=\"rkk-doc-modal-info\">\n\n                    <div class=\"rkk-doc-pdf-icon\">\n                        PDF\n                    <\/div>\n\n                    <div class=\"rkk-doc-modal-text\">\n\n                        <strong id=\"rkkDocModalTitle\">\n                            \u0e40\u0e2d\u0e01\u0e2a\u0e32\u0e23\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\n                        <\/strong>\n\n                        <span id=\"rkkDocModalSubtitle\">\n                        <\/span>\n\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"rkk-doc-modal-actions\">\n\n                    <a\n                        id=\"rkkDocExternal\"\n                        href=\"#\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                    >\n                        \u0e40\u0e1b\u0e34\u0e14\u0e41\u0e17\u0e47\u0e1a\u0e43\u0e2b\u0e21\u0e48 \u2197\n                    <\/a>\n\n                    <button\n                        id=\"rkkDocClose\"\n                        type=\"button\"\n                        aria-label=\"\u0e1b\u0e34\u0e14\"\n                    >\n                        \u00d7\n                    <\/button>\n\n                <\/div>\n\n            <\/header>\n\n\n            <div class=\"rkk-doc-frame\">\n\n                <iframe\n                    id=\"rkkDocIframe\"\n                    src=\"about:blank\"\n                    title=\"Document preview\"\n                ><\/iframe>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/div>\n\n\n\n<style>\n\n\/* =====================================================\n   RESET \/ VARIABLES\n   ===================================================== *\/\n\n#rkk-doc-system,\n#rkk-doc-system * {\n    box-sizing: border-box;\n}\n\n#rkk-doc-system {\n\n    --rkk-navy-950: #070d1e;\n    --rkk-navy-900: #0f1738;\n    --rkk-navy-850: #121c33;\n    --rkk-navy-800: #141f4b;\n    --rkk-navy-700: #182760;\n    --rkk-navy-600: #1c3177;\n    --rkk-navy-500: #1e3a8a;\n\n    --rkk-white: #ffffff;\n\n    --rkk-slate-50: #f8fafc;\n    --rkk-slate-100: #f1f5f9;\n    --rkk-slate-200: #e2e8f0;\n    --rkk-slate-300: #cbd5e1;\n    --rkk-slate-400: #94a3b8;\n    --rkk-slate-500: #64748b;\n    --rkk-slate-600: #475569;\n    --rkk-slate-700: #334155;\n    --rkk-slate-800: #1e293b;\n\n    --rkk-green-50: #ecfdf5;\n    --rkk-green-200: #a7f3d0;\n    --rkk-green-700: #047857;\n\n    --rkk-blue-50: #eff6ff;\n    --rkk-blue-100: #dbeafe;\n    --rkk-blue-600: #2563eb;\n\n    font-family:\n        \"Prompt\",\n        \"Sarabun\",\n        -apple-system,\n        BlinkMacSystemFont,\n        \"Segoe UI\",\n        sans-serif;\n\n    width: 100%;\n    max-width: none;\n\n    margin: 0;\n\n    background:\n        var(--rkk-slate-50) !important;\n\n    color:\n        var(--rkk-slate-800) !important;\n\n    overflow: hidden;\n}\n\n\n\n\/* =====================================================\n   HERO\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-hero {\n\n    width: 100%;\n\n    padding:\n        68px 20px 58px;\n\n    background-color:\n        var(--rkk-navy-950) !important;\n\n    background-image:\n        radial-gradient(\n            rgba(255,255,255,.12) 1px,\n            transparent 1px\n        ) !important;\n\n    background-size:\n        24px 24px !important;\n\n    border-bottom:\n        1px solid rgba(255,255,255,.08);\n\n    color:\n        #fff !important;\n}\n\n\n#rkk-doc-system .rkk-doc-hero-inner {\n\n    max-width: 1050px;\n\n    margin:\n        0 auto;\n\n    display:\n        flex;\n\n    flex-direction:\n        column;\n\n    align-items:\n        center;\n\n    text-align:\n        center;\n\n    gap:\n        18px;\n}\n\n\n#rkk-doc-system .rkk-doc-logo {\n\n    display:\n        block;\n\n    width:\n        125px;\n\n    height:\n        auto;\n\n    margin:\n        0;\n\n    filter:\n        drop-shadow(\n            0 8px 20px\n            rgba(0,0,0,.6)\n        );\n}\n\n\n#rkk-doc-system .rkk-doc-pill {\n\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    gap:\n        9px;\n\n    padding:\n        8px 19px;\n\n    border-radius:\n        999px;\n\n    background:\n        rgba(30,58,138,.72) !important;\n\n    border:\n        1px solid\n        rgba(96,165,250,.38);\n\n    color:\n        #dbeafe !important;\n\n    font-size:\n        13px;\n\n    font-weight:\n        500;\n\n    box-shadow:\n        0 10px 28px\n        rgba(0,0,0,.15);\n}\n\n\n#rkk-doc-system .rkk-doc-dot {\n\n    width:\n        9px;\n\n    height:\n        9px;\n\n    border-radius:\n        50%;\n\n    background:\n        #60a5fa !important;\n\n    box-shadow:\n        0 0 10px\n        rgba(96,165,250,.9);\n\n    animation:\n        rkkDocPulse 2s infinite;\n}\n\n\n@keyframes rkkDocPulse {\n\n    0%,\n    100% {\n        opacity: 1;\n        transform: scale(1);\n    }\n\n    50% {\n        opacity: .45;\n        transform: scale(.82);\n    }\n\n}\n\n\n#rkk-doc-system .rkk-doc-intro {\n\n    margin:\n        0;\n\n    color:\n        var(--rkk-slate-300) !important;\n\n    font-size:\n        14px;\n\n    font-weight:\n        400;\n\n    line-height:\n        1.8;\n}\n\n\n\n\/* =====================================================\n   MAIN\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-main {\n\n    width:\n        min(\n            1280px,\n            calc(100% - 36px)\n        );\n\n    margin:\n        0 auto;\n\n    padding:\n        35px 0 48px;\n}\n\n\n\n\/* =====================================================\n   FILTER\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-filters {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    gap:\n        18px;\n\n    padding:\n        18px;\n\n    margin-bottom:\n        10px;\n\n    background:\n        #ffffff !important;\n\n    border:\n        1px solid\n        var(--rkk-slate-200);\n\n    border-radius:\n        18px;\n\n    box-shadow:\n        0 6px 22px\n        rgba(15,23,42,.05);\n}\n\n\n#rkk-doc-system .rkk-doc-search {\n\n    position:\n        relative;\n\n    flex:\n        1;\n\n    min-width:\n        260px;\n}\n\n\n#rkk-doc-system .rkk-doc-search-icon {\n\n    position:\n        absolute;\n\n    top:\n        50%;\n\n    left:\n        15px;\n\n    transform:\n        translateY(-50%);\n\n    color:\n        var(--rkk-slate-400) !important;\n\n    font-size:\n        25px;\n\n    pointer-events:\n        none;\n}\n\n\n#rkk-doc-system #rkkDocSearch {\n\n    display:\n        block;\n\n    width:\n        100%;\n\n    height:\n        45px;\n\n    margin:\n        0;\n\n    padding:\n        0 15px 0 46px;\n\n    border:\n        1px solid\n        var(--rkk-slate-200) !important;\n\n    border-radius:\n        12px;\n\n    outline:\n        none;\n\n    box-shadow:\n        none;\n\n    background:\n        #fff !important;\n\n    color:\n        var(--rkk-slate-700) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        13px;\n}\n\n\n#rkk-doc-system #rkkDocSearch:focus {\n\n    border-color:\n        var(--rkk-navy-500) !important;\n\n    box-shadow:\n        0 0 0 3px\n        rgba(30,58,138,.1);\n}\n\n\n#rkk-doc-system .rkk-doc-options {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    flex-wrap:\n        wrap;\n\n    gap:\n        11px;\n}\n\n\n#rkk-doc-system .rkk-doc-field {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    gap:\n        7px;\n}\n\n\n#rkk-doc-system .rkk-doc-field label {\n\n    color:\n        var(--rkk-slate-500) !important;\n\n    font-size:\n        12px;\n\n    white-space:\n        nowrap;\n}\n\n\n#rkk-doc-system .rkk-doc-field select {\n\n    height:\n        42px;\n\n    margin:\n        0;\n\n    padding:\n        0 32px 0 12px;\n\n    border:\n        1px solid\n        var(--rkk-slate-200) !important;\n\n    border-radius:\n        11px;\n\n    outline:\n        none;\n\n    background:\n        #fff !important;\n\n    color:\n        var(--rkk-slate-700) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        12px;\n}\n\n\n#rkk-doc-system .rkk-doc-reset {\n\n    padding:\n        9px 8px;\n\n    border:\n        0 !important;\n\n    outline:\n        none;\n\n    background:\n        transparent !important;\n\n    color:\n        var(--rkk-slate-500) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        12px;\n\n    cursor:\n        pointer;\n}\n\n\n#rkk-doc-system .rkk-doc-reset:hover {\n\n    color:\n        var(--rkk-navy-600) !important;\n}\n\n\n#rkk-doc-system .rkk-doc-view-switch {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    padding:\n        3px;\n\n    background:\n        var(--rkk-slate-100) !important;\n\n    border:\n        1px solid\n        var(--rkk-slate-200);\n\n    border-radius:\n        12px;\n}\n\n\n#rkk-doc-system .rkk-doc-view-switch button {\n\n    margin:\n        0;\n\n    padding:\n        8px 12px;\n\n    border:\n        0 !important;\n\n    border-radius:\n        9px;\n\n    background:\n        transparent !important;\n\n    color:\n        var(--rkk-slate-600) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        12px;\n\n    cursor:\n        pointer;\n}\n\n\n#rkk-doc-system .rkk-doc-view-switch button.active {\n\n    background:\n        #fff !important;\n\n    color:\n        var(--rkk-navy-700) !important;\n\n    font-weight:\n        600;\n\n    box-shadow:\n        0 2px 7px\n        rgba(15,23,42,.1);\n}\n\n\n\n\/* =====================================================\n   META\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-meta {\n\n    display:\n        flex;\n\n    justify-content:\n        space-between;\n\n    align-items:\n        center;\n\n    min-height:\n        33px;\n\n    padding:\n        0 4px;\n\n    margin-bottom:\n        8px;\n\n    color:\n        var(--rkk-slate-500) !important;\n\n    font-size:\n        11px;\n}\n\n\n#rkk-doc-system #rkkDocStatus.error {\n\n    color:\n        #be123c !important;\n}\n\n\n#rkk-doc-system #rkkDocStatus.success {\n\n    color:\n        #047857 !important;\n}\n\n\n\n\/* =====================================================\n   TABLE\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-table-box {\n\n    overflow:\n        hidden;\n\n    background:\n        #fff !important;\n\n    border:\n        1px solid\n        var(--rkk-slate-200);\n\n    border-radius:\n        18px;\n\n    box-shadow:\n        0 5px 20px\n        rgba(15,23,42,.04);\n}\n\n\n#rkk-doc-system .rkk-doc-table-scroll {\n\n    overflow-x:\n        auto;\n}\n\n\n#rkk-doc-system table {\n\n    width:\n        100%;\n\n    margin:\n        0;\n\n    border:\n        0;\n\n    border-collapse:\n        collapse;\n\n    border-spacing:\n        0;\n\n    background:\n        #fff !important;\n}\n\n\n#rkk-doc-system thead {\n\n    background:\n        var(--rkk-slate-50) !important;\n}\n\n\n#rkk-doc-system th {\n\n    padding:\n        14px 16px;\n\n    border:\n        0;\n\n    border-bottom:\n        1px solid\n        var(--rkk-slate-200);\n\n    background:\n        transparent !important;\n\n    color:\n        var(--rkk-slate-600) !important;\n\n    font-size:\n        11px;\n\n    font-weight:\n        600;\n\n    line-height:\n        1.4;\n\n    text-align:\n        left;\n\n    white-space:\n        nowrap;\n}\n\n\n#rkk-doc-system td {\n\n    padding:\n        14px 16px;\n\n    border:\n        0;\n\n    border-bottom:\n        1px solid\n        var(--rkk-slate-100);\n\n    background:\n        transparent !important;\n\n    color:\n        var(--rkk-slate-700) !important;\n\n    font-size:\n        13px;\n\n    line-height:\n        1.5;\n\n    vertical-align:\n        middle;\n}\n\n\n#rkk-doc-system tbody tr {\n\n    background:\n        #fff !important;\n\n    transition:\n        background .2s ease;\n}\n\n\n#rkk-doc-system tbody tr:hover {\n\n    background:\n        #f8fafc !important;\n}\n\n\n#rkk-doc-system .rkk-center {\n\n    text-align:\n        center;\n}\n\n\n#rkk-doc-system .rkk-order-number {\n\n    display:\n        inline-flex;\n\n    min-width:\n        44px;\n\n    justify-content:\n        center;\n\n    padding:\n        5px 9px;\n\n    border:\n        1px solid\n        var(--rkk-slate-200);\n\n    border-radius:\n        7px;\n\n    background:\n        var(--rkk-slate-100) !important;\n\n    color:\n        var(--rkk-slate-800) !important;\n\n    font-size:\n        11px;\n\n    font-weight:\n        600;\n}\n\n\n#rkk-doc-system .rkk-order-title {\n\n    display:\n        block;\n\n    color:\n        var(--rkk-slate-800) !important;\n\n    font-weight:\n        500;\n}\n\n\n#rkk-doc-system .rkk-order-note {\n\n    display:\n        block;\n\n    margin-top:\n        4px;\n\n    color:\n        var(--rkk-slate-400) !important;\n\n    font-size:\n        10px;\n}\n\n\n\n\/* =====================================================\n   GROUP BADGES\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-group-badge {\n\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    max-width:\n        250px;\n\n    padding:\n        5px 9px;\n\n    border-radius:\n        999px;\n\n    border:\n        1px solid #bae6fd;\n\n    background:\n        #e0f2fe !important;\n\n    color:\n        #0369a1 !important;\n\n    font-size:\n        10px;\n\n    font-weight:\n        500;\n\n    line-height:\n        1.3;\n}\n\n\n#rkk-doc-system .rkk-group-admin {\n\n    background:\n        #eef2ff !important;\n\n    border-color:\n        #c7d2fe;\n\n    color:\n        #4338ca !important;\n}\n\n\n#rkk-doc-system .rkk-group-budget {\n\n    background:\n        #fffbeb !important;\n\n    border-color:\n        #fde68a;\n\n    color:\n        #b45309 !important;\n}\n\n\n#rkk-doc-system .rkk-group-academic {\n\n    background:\n        #ecfdf5 !important;\n\n    border-color:\n        #a7f3d0;\n\n    color:\n        #047857 !important;\n}\n\n\n#rkk-doc-system .rkk-group-student {\n\n    background:\n        #fff1f2 !important;\n\n    border-color:\n        #fecdd3;\n\n    color:\n        #be123c !important;\n}\n\n\n\n\/* =====================================================\n   DOCUMENT BUTTON\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-open {\n\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        center;\n\n    gap:\n        5px;\n\n    margin:\n        0;\n\n    padding:\n        7px 11px;\n\n    border:\n        1px solid\n        var(--rkk-green-200) !important;\n\n    border-radius:\n        10px;\n\n    outline:\n        none;\n\n    background:\n        var(--rkk-green-50) !important;\n\n    color:\n        var(--rkk-green-700) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        11px;\n\n    font-weight:\n        500;\n\n    line-height:\n        1.3;\n\n    white-space:\n        nowrap;\n\n    cursor:\n        pointer;\n\n    transition:\n        .18s ease;\n}\n\n\n#rkk-doc-system .rkk-doc-open:hover {\n\n    background:\n        #d1fae5 !important;\n\n    transform:\n        translateY(-1px);\n\n    box-shadow:\n        0 3px 8px\n        rgba(4,120,87,.1);\n}\n\n\n\n\/* =====================================================\n   CARD VIEW\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-card-grid {\n\n    display:\n        none;\n\n    grid-template-columns:\n        repeat(\n            3,\n            minmax(0,1fr)\n        );\n\n    gap:\n        17px;\n}\n\n\n#rkk-doc-system .rkk-doc-card-grid.active {\n\n    display:\n        grid;\n}\n\n\n#rkk-doc-system .rkk-doc-card {\n\n    display:\n        flex;\n\n    flex-direction:\n        column;\n\n    min-height:\n        200px;\n\n    padding:\n        19px;\n\n    border:\n        1px solid\n        var(--rkk-slate-200);\n\n    border-radius:\n        17px;\n\n    background:\n        #fff !important;\n\n    box-shadow:\n        0 5px 16px\n        rgba(15,23,42,.04);\n\n    transition:\n        .2s ease;\n}\n\n\n#rkk-doc-system .rkk-doc-card:hover {\n\n    transform:\n        translateY(-2px);\n\n    box-shadow:\n        0 10px 25px\n        rgba(15,23,42,.08);\n}\n\n\n#rkk-doc-system .rkk-doc-card-top {\n\n    display:\n        flex;\n\n    justify-content:\n        space-between;\n\n    align-items:\n        center;\n\n    gap:\n        10px;\n\n    margin-bottom:\n        13px;\n}\n\n\n#rkk-doc-system .rkk-doc-card-year {\n\n    color:\n        var(--rkk-slate-500) !important;\n\n    font-size:\n        11px;\n}\n\n\n#rkk-doc-system .rkk-doc-card-title {\n\n    flex:\n        1;\n\n    color:\n        var(--rkk-slate-800) !important;\n\n    font-size:\n        14px;\n\n    font-weight:\n        600;\n\n    line-height:\n        1.6;\n}\n\n\n#rkk-doc-system .rkk-doc-card-note {\n\n    margin-top:\n        7px;\n\n    color:\n        var(--rkk-slate-400) !important;\n\n    font-size:\n        10px;\n\n    line-height:\n        1.5;\n}\n\n\n#rkk-doc-system .rkk-doc-card-bottom {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        space-between;\n\n    gap:\n        10px;\n\n    margin-top:\n        16px;\n\n    padding-top:\n        13px;\n\n    border-top:\n        1px solid\n        var(--rkk-slate-100);\n}\n\n\n\n\/* =====================================================\n   EMPTY\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-empty {\n\n    display:\n        none;\n\n    padding:\n        65px 20px;\n\n    flex-direction:\n        column;\n\n    align-items:\n        center;\n\n    text-align:\n        center;\n\n    gap:\n        6px;\n\n    color:\n        var(--rkk-slate-400) !important;\n}\n\n\n#rkk-doc-system .rkk-doc-empty.active {\n\n    display:\n        flex;\n}\n\n\n#rkk-doc-system .rkk-doc-empty-icon {\n\n    margin-bottom:\n        5px;\n\n    font-size:\n        40px;\n}\n\n\n#rkk-doc-system .rkk-doc-empty strong {\n\n    color:\n        var(--rkk-slate-600) !important;\n\n    font-size:\n        14px;\n}\n\n\n#rkk-doc-system .rkk-doc-empty span {\n\n    font-size:\n        11px;\n}\n\n\n\n\/* =====================================================\n   PAGINATION\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-pagination {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        center;\n\n    flex-wrap:\n        wrap;\n\n    gap:\n        6px;\n\n    padding-top:\n        21px;\n}\n\n\n#rkk-doc-system .rkk-page-btn {\n\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        center;\n\n    min-width:\n        36px;\n\n    height:\n        36px;\n\n    margin:\n        0;\n\n    padding:\n        0 9px;\n\n    border:\n        1px solid\n        var(--rkk-slate-200) !important;\n\n    border-radius:\n        9px;\n\n    background:\n        #fff !important;\n\n    color:\n        var(--rkk-slate-600) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        11px;\n\n    cursor:\n        pointer;\n}\n\n\n#rkk-doc-system .rkk-page-btn:hover {\n\n    border-color:\n        var(--rkk-navy-500) !important;\n\n    color:\n        var(--rkk-navy-600) !important;\n}\n\n\n#rkk-doc-system .rkk-page-btn.active {\n\n    border-color:\n        var(--rkk-navy-700) !important;\n\n    background:\n        var(--rkk-navy-700) !important;\n\n    color:\n        #fff !important;\n\n    font-weight:\n        600;\n}\n\n\n\n\/* =====================================================\n   FOOTER\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-footer {\n\n    display:\n        flex;\n\n    flex-direction:\n        column;\n\n    align-items:\n        center;\n\n    gap:\n        2px;\n\n    padding:\n        24px 15px;\n\n    background:\n        var(--rkk-navy-900) !important;\n\n    color:\n        var(--rkk-slate-400) !important;\n\n    text-align:\n        center;\n\n    font-size:\n        11px;\n\n    line-height:\n        1.6;\n}\n\n\n#rkk-doc-system .rkk-doc-footer strong {\n\n    color:\n        var(--rkk-slate-200) !important;\n\n    font-weight:\n        500;\n}\n\n\n\n\/* =====================================================\n   MODAL\n   ===================================================== *\/\n\n#rkk-doc-system .rkk-doc-modal {\n\n    position:\n        fixed;\n\n    inset:\n        0;\n\n    z-index:\n        9999999;\n\n    display:\n        none;\n\n    padding:\n        24px;\n\n    background:\n        rgba(7,13,30,.90) !important;\n\n    backdrop-filter:\n        blur(8px);\n}\n\n\n#rkk-doc-system .rkk-doc-modal.active {\n\n    display:\n        flex;\n}\n\n\n#rkk-doc-system .rkk-doc-modal-box {\n\n    display:\n        flex;\n\n    flex-direction:\n        column;\n\n    width:\n        min(\n            1420px,\n            100%\n        );\n\n    height:\n        min(\n            920px,\n            100%\n        );\n\n    margin:\n        auto;\n}\n\n\n#rkk-doc-system .rkk-doc-modal-header {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        space-between;\n\n    gap:\n        14px;\n\n    padding:\n        13px 15px;\n\n    border-radius:\n        15px 15px 0 0;\n\n    border-bottom:\n        1px solid\n        rgba(255,255,255,.08);\n\n    background:\n        var(--rkk-navy-900) !important;\n\n    color:\n        #fff !important;\n}\n\n\n#rkk-doc-system .rkk-doc-modal-info {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    gap:\n        11px;\n\n    min-width:\n        0;\n}\n\n\n#rkk-doc-system .rkk-doc-pdf-icon {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        center;\n\n    flex:\n        0 0 43px;\n\n    width:\n        43px;\n\n    height:\n        43px;\n\n    border-radius:\n        10px;\n\n    background:\n        var(--rkk-navy-600) !important;\n\n    color:\n        #fbbf24 !important;\n\n    font-size:\n        10px;\n\n    font-weight:\n        700;\n}\n\n\n#rkk-doc-system .rkk-doc-modal-text {\n\n    display:\n        flex;\n\n    flex-direction:\n        column;\n\n    min-width:\n        0;\n\n    gap:\n        2px;\n}\n\n\n#rkk-doc-system .rkk-doc-modal-text strong {\n\n    overflow:\n        hidden;\n\n    color:\n        #fff !important;\n\n    font-size:\n        13px;\n\n    font-weight:\n        600;\n\n    text-overflow:\n        ellipsis;\n\n    white-space:\n        nowrap;\n}\n\n\n#rkk-doc-system .rkk-doc-modal-text span {\n\n    color:\n        var(--rkk-slate-400) !important;\n\n    font-size:\n        10px;\n}\n\n\n#rkk-doc-system .rkk-doc-modal-actions {\n\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    gap:\n        7px;\n\n    flex-shrink:\n        0;\n}\n\n\n#rkk-doc-system .rkk-doc-modal-actions a {\n\n    display:\n        inline-flex;\n\n    padding:\n        8px 11px;\n\n    border-radius:\n        9px;\n\n    background:\n        var(--rkk-slate-800) !important;\n\n    color:\n        var(--rkk-slate-200) !important;\n\n    text-decoration:\n        none !important;\n\n    font-size:\n        10px;\n}\n\n\n#rkk-doc-system #rkkDocClose {\n\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        center;\n\n    width:\n        37px;\n\n    height:\n        37px;\n\n    margin:\n        0;\n\n    padding:\n        0;\n\n    border:\n        0 !important;\n\n    border-radius:\n        9px;\n\n    background:\n        var(--rkk-slate-800) !important;\n\n    color:\n        #fff !important;\n\n    font-size:\n        24px;\n\n    cursor:\n        pointer;\n}\n\n\n#rkk-doc-system .rkk-doc-frame {\n\n    flex:\n        1;\n\n    overflow:\n        hidden;\n\n    border-radius:\n        0 0 15px 15px;\n\n    background:\n        #020617 !important;\n}\n\n\n#rkk-doc-system .rkk-doc-frame iframe {\n\n    display:\n        block;\n\n    width:\n        100%;\n\n    height:\n        100%;\n\n    margin:\n        0;\n\n    padding:\n        0;\n\n    border:\n        0;\n\n    background:\n        #fff !important;\n}\n\n\n\n\/* =====================================================\n   RESPONSIVE\n   ===================================================== *\/\n\n@media (max-width: 1080px) {\n\n    #rkk-doc-system .rkk-doc-filters {\n\n        flex-direction:\n            column;\n\n        align-items:\n            stretch;\n    }\n\n\n    #rkk-doc-system .rkk-doc-card-grid {\n\n        grid-template-columns:\n            repeat(\n                2,\n                minmax(0,1fr)\n            );\n    }\n\n}\n\n\n@media (max-width: 720px) {\n\n    #rkk-doc-system .rkk-doc-hero {\n\n        padding:\n            44px 16px 40px;\n    }\n\n\n    #rkk-doc-system .rkk-doc-logo {\n\n        width:\n            95px;\n    }\n\n\n    #rkk-doc-system .rkk-doc-pill {\n\n        padding:\n            7px 13px;\n\n        font-size:\n            11px;\n    }\n\n\n    #rkk-doc-system .rkk-doc-intro {\n\n        font-size:\n            11px;\n    }\n\n\n    #rkk-doc-system .rkk-doc-main {\n\n        width:\n            calc(\n                100% - 20px\n            );\n\n        padding:\n            18px 0 30px;\n    }\n\n\n    #rkk-doc-system .rkk-doc-filters {\n\n        padding:\n            13px;\n\n        border-radius:\n            14px;\n    }\n\n\n    #rkk-doc-system .rkk-doc-options {\n\n        align-items:\n            stretch;\n    }\n\n\n    #rkk-doc-system .rkk-doc-field {\n\n        width:\n            100%;\n    }\n\n\n    #rkk-doc-system .rkk-doc-field select {\n\n        flex:\n            1;\n\n        min-width:\n            0;\n    }\n\n\n    #rkk-doc-system .rkk-doc-view-switch {\n\n        margin-left:\n            auto;\n    }\n\n\n    #rkk-doc-system .rkk-doc-card-grid {\n\n        grid-template-columns:\n            1fr;\n    }\n\n\n    #rkk-doc-system .rkk-doc-modal {\n\n        padding:\n            5px;\n    }\n\n\n    #rkk-doc-system .rkk-doc-modal-actions a {\n\n        display:\n            none;\n    }\n\n\n    #rkk-doc-system .rkk-doc-modal-header {\n\n        border-radius:\n            10px 10px 0 0;\n    }\n\n\n    #rkk-doc-system .rkk-doc-frame {\n\n        border-radius:\n            0 0 10px 10px;\n    }\n\n}\n\n<\/style>\n\n\n\n<script>\n\n(function () {\n\n    \"use strict\";\n\n\n    \/* =====================================================\n       CONFIG\n       ===================================================== *\/\n\n    const API_URL =\n        window.location.origin +\n        \"\/?rest_route=\/rkk\/v1\/orders\";\n\n    const ITEMS_PER_PAGE = 20;\n\n\n    \/* =====================================================\n       STATE\n       ===================================================== *\/\n\n    let orders = [];\n\n    let filteredOrders = [];\n\n    let currentPage = 1;\n\n    let currentView = \"table\";\n\n\n    \/* =====================================================\n       HELPERS\n       ===================================================== *\/\n\n    function el(id) {\n\n        return document.getElementById(id);\n\n    }\n\n\n    function escapeHTML(value) {\n\n        const temp =\n            document.createElement(\"div\");\n\n        temp.textContent =\n            value == null\n                ? \"\"\n                : String(value);\n\n        return temp.innerHTML;\n\n    }\n\n\n    function escapeAttr(value) {\n\n        return String(\n            value == null\n                ? \"\"\n                : value\n        )\n        .replace(\/&\/g, \"&amp;\")\n        .replace(\/\"\/g, \"&quot;\")\n        .replace(\/<\/g, \"&lt;\")\n        .replace(\/>\/g, \"&gt;\");\n\n    }\n\n\n    \/* =====================================================\n       INITIALIZE\n       ===================================================== *\/\n\n    function init() {\n\n        const app =\n            el(\"rkk-doc-system\");\n\n        if (!app) {\n            return;\n        }\n\n\n        el(\"rkkDocSearch\")\n            .addEventListener(\n                \"input\",\n                filterData\n            );\n\n\n        el(\"rkkDocGroup\")\n            .addEventListener(\n                \"change\",\n                filterData\n            );\n\n\n        el(\"rkkDocYear\")\n            .addEventListener(\n                \"change\",\n                filterData\n            );\n\n\n        el(\"rkkDocReset\")\n            .addEventListener(\n                \"click\",\n                resetFilters\n            );\n\n\n        el(\"rkkDocTableButton\")\n            .addEventListener(\n                \"click\",\n                function () {\n                    switchView(\"table\");\n                }\n            );\n\n\n        el(\"rkkDocCardButton\")\n            .addEventListener(\n                \"click\",\n                function () {\n                    switchView(\"card\");\n                }\n            );\n\n\n        el(\"rkkDocClose\")\n            .addEventListener(\n                \"click\",\n                closeDocument\n            );\n\n\n        el(\"rkkDocModal\")\n            .addEventListener(\n                \"click\",\n                function (event) {\n\n                    if (\n                        event.target ===\n                        el(\"rkkDocModal\")\n                    ) {\n\n                        closeDocument();\n\n                    }\n\n                }\n            );\n\n\n        document.addEventListener(\n            \"keydown\",\n            function (event) {\n\n                if (\n                    event.key ===\n                    \"Escape\"\n                ) {\n\n                    closeDocument();\n\n                }\n\n            }\n        );\n\n\n        loadOrders();\n\n    }\n\n\n\n    \/* =====================================================\n       LOAD API\n       ===================================================== *\/\n\n    async function loadOrders() {\n\n        setStatus(\n            \"\u0e01\u0e33\u0e25\u0e31\u0e07\u0e42\u0e2b\u0e25\u0e14\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e08\u0e32\u0e01 Google Drive...\"\n        );\n\n\n        try {\n\n            const response =\n                await fetch(\n                    API_URL,\n                    {\n                        method:\n                            \"GET\",\n\n                        headers: {\n                            \"Accept\":\n                                \"application\/json\"\n                        },\n\n                        cache:\n                            \"no-store\"\n                    }\n                );\n\n\n            if (\n                !response.ok\n            ) {\n\n                throw new Error(\n                    \"HTTP \" +\n                    response.status\n                );\n\n            }\n\n\n            const result =\n                await response.json();\n\n\n            if (\n                !result ||\n                result.success !== true ||\n                !Array.isArray(result.data)\n            ) {\n\n                throw new Error(\n                    result &&\n                    result.message\n                        ?\n                        result.message\n                        :\n                        \"\u0e23\u0e39\u0e1b\u0e41\u0e1a\u0e1a\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25 API \u0e44\u0e21\u0e48\u0e16\u0e39\u0e01\u0e15\u0e49\u0e2d\u0e07\"\n                );\n\n            }\n\n\n            orders =\n                result.data.map(\n                    normalizeOrder\n                );\n\n\n            sortOrders();\n\n\n            populateYears();\n\n\n            filteredOrders =\n                [...orders];\n\n\n            currentPage =\n                1;\n\n\n            setStatus(\n                \"\u0e40\u0e0a\u0e37\u0e48\u0e2d\u0e21\u0e15\u0e48\u0e2d\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08\",\n                \"success\"\n            );\n\n\n            render();\n\n\n            window.setTimeout(\n                function () {\n\n                    if (\n                        el(\"rkkDocStatus\")\n                            .classList\n                            .contains(\n                                \"success\"\n                            )\n                    ) {\n\n                        el(\"rkkDocStatus\")\n                            .textContent =\n                            \"\";\n\n                    }\n\n                },\n                2500\n            );\n\n\n        }\n\n        catch (error) {\n\n            console.error(\n                \"RKK DOCUMENT ERROR:\",\n                error\n            );\n\n\n            orders =\n                [];\n\n            filteredOrders =\n                [];\n\n\n            setStatus(\n                \"\u0e42\u0e2b\u0e25\u0e14\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e44\u0e21\u0e48\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08: \" +\n                error.message,\n                \"error\"\n            );\n\n\n            render();\n\n        }\n\n    }\n\n\n\n    function normalizeOrder(item) {\n\n        return {\n\n            id:\n                String(\n                    item.id || \"\"\n                ),\n\n            number:\n                String(\n                    item.number || \"\"\n                ).trim(),\n\n            year:\n                String(\n                    item.year || \"\"\n                ).trim(),\n\n            title:\n                String(\n                    item.title || \"\"\n                ).trim(),\n\n            group:\n                String(\n                    item.group || \"\u0e2d\u0e37\u0e48\u0e19 \u0e46\"\n                ).trim(),\n\n            notes:\n                String(\n                    item.notes || \"\"\n                ).trim(),\n\n            docUrl:\n                String(\n                    item.docUrl || \"\"\n                ).trim(),\n\n            previewUrl:\n                String(\n                    item.previewUrl || \"\"\n                ).trim()\n\n        };\n\n    }\n\n\n\n    \/* =====================================================\n       SORT\n       ===================================================== *\/\n\n    function sortOrders() {\n\n        orders.sort(\n            function (a, b) {\n\n                const yearA =\n                    Number(a.year) || 0;\n\n                const yearB =\n                    Number(b.year) || 0;\n\n\n                if (\n                    yearA !==\n                    yearB\n                ) {\n\n                    return (\n                        yearB -\n                        yearA\n                    );\n\n                }\n\n\n                const numberA =\n                    Number(\n                        String(a.number)\n                        .replace(\n                            \/\\D\/g,\n                            \"\"\n                        )\n                    ) || 0;\n\n\n                const numberB =\n                    Number(\n                        String(b.number)\n                        .replace(\n                            \/\\D\/g,\n                            \"\"\n                        )\n                    ) || 0;\n\n\n                return (\n                    numberB -\n                    numberA\n                );\n\n            }\n        );\n\n    }\n\n\n\n    \/* =====================================================\n       YEAR FILTER\n       ===================================================== *\/\n\n    function populateYears() {\n\n        const years =\n            [\n                ...new Set(\n                    orders\n                        .map(\n                            function (item) {\n                                return item.year;\n                            }\n                        )\n                        .filter(Boolean)\n                )\n            ];\n\n\n        years.sort(\n            function (a, b) {\n\n                return (\n                    Number(b) -\n                    Number(a)\n                );\n\n            }\n        );\n\n\n        const select =\n            el(\"rkkDocYear\");\n\n\n        select.innerHTML =\n            '<option value=\"\">\u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14<\/option>';\n\n\n        years.forEach(\n            function (year) {\n\n                const option =\n                    document.createElement(\n                        \"option\"\n                    );\n\n\n                option.value =\n                    year;\n\n\n                option.textContent =\n                    year;\n\n\n                select.appendChild(\n                    option\n                );\n\n            }\n        );\n\n    }\n\n\n\n    \/* =====================================================\n       FILTER\n       ===================================================== *\/\n\n    function filterData() {\n\n        const search =\n            el(\"rkkDocSearch\")\n            .value\n            .trim()\n            .toLowerCase();\n\n\n        const group =\n            el(\"rkkDocGroup\")\n            .value;\n\n\n        const year =\n            el(\"rkkDocYear\")\n            .value;\n\n\n        filteredOrders =\n            orders.filter(\n                function (item) {\n\n                    const combined =\n                        [\n                            item.number,\n                            item.year,\n                            item.title,\n                            item.group,\n                            item.notes\n                        ]\n                        .join(\" \")\n                        .toLowerCase();\n\n\n                    const matchesSearch =\n                        search === \"\" ||\n                        combined.includes(\n                            search\n                        );\n\n\n                    const matchesGroup =\n                        group === \"\" ||\n                        item.group === group;\n\n\n                    const matchesYear =\n                        year === \"\" ||\n                        item.year === year;\n\n\n                    return (\n                        matchesSearch &&\n                        matchesGroup &&\n                        matchesYear\n                    );\n\n                }\n            );\n\n\n        currentPage =\n            1;\n\n\n        render();\n\n    }\n\n\n\n    function resetFilters() {\n\n        el(\"rkkDocSearch\")\n            .value =\n            \"\";\n\n\n        el(\"rkkDocGroup\")\n            .value =\n            \"\";\n\n\n        el(\"rkkDocYear\")\n            .value =\n            \"\";\n\n\n        currentPage =\n            1;\n\n\n        filteredOrders =\n            [...orders];\n\n\n        render();\n\n    }\n\n\n\n    \/* =====================================================\n       RENDER\n       ===================================================== *\/\n\n    function render() {\n\n        const total =\n            filteredOrders.length;\n\n\n        const totalPages =\n            Math.max(\n                1,\n                Math.ceil(\n                    total \/\n                    ITEMS_PER_PAGE\n                )\n            );\n\n\n        if (\n            currentPage >\n            totalPages\n        ) {\n\n            currentPage =\n                totalPages;\n\n        }\n\n\n        const start =\n            (\n                currentPage -\n                1\n            ) *\n            ITEMS_PER_PAGE;\n\n\n        const pageItems =\n            filteredOrders.slice(\n                start,\n                start +\n                ITEMS_PER_PAGE\n            );\n\n\n        renderCount(\n            total\n        );\n\n\n        renderTable(\n            pageItems\n        );\n\n\n        renderCards(\n            pageItems\n        );\n\n\n        renderPagination(\n            totalPages\n        );\n\n\n        if (\n            total === 0\n        ) {\n\n            el(\"rkkDocEmpty\")\n                .classList\n                .add(\n                    \"active\"\n                );\n\n\n            el(\"rkkDocTableView\")\n                .style.display =\n                \"none\";\n\n\n            el(\"rkkDocCardView\")\n                .classList\n                .remove(\n                    \"active\"\n                );\n\n        }\n\n        else {\n\n            el(\"rkkDocEmpty\")\n                .classList\n                .remove(\n                    \"active\"\n                );\n\n\n            applyView();\n\n        }\n\n    }\n\n\n\n    function renderCount(total) {\n\n        el(\"rkkDocCount\")\n            .textContent =\n            \"\u0e1e\u0e1a \" +\n            total +\n            \" \u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\";\n\n    }\n\n\n\n    \/* =====================================================\n       TABLE\n       ===================================================== *\/\n\n    function renderTable(items) {\n\n        const body =\n            el(\"rkkDocTableBody\");\n\n\n        body.innerHTML =\n            \"\";\n\n\n        items.forEach(\n            function (item) {\n\n                const row =\n                    document.createElement(\n                        \"tr\"\n                    );\n\n\n                row.innerHTML =\n\n                    '<td>' +\n\n                        '<span class=\"rkk-order-number\">' +\n                            escapeHTML(\n                                item.number || \"-\"\n                            ) +\n                        '<\/span>' +\n\n                    '<\/td>' +\n\n\n                    '<td class=\"rkk-center\">' +\n\n                        escapeHTML(\n                            item.year || \"-\"\n                        ) +\n\n                    '<\/td>' +\n\n\n                    '<td>' +\n\n                        '<span class=\"rkk-order-title\">' +\n                            escapeHTML(\n                                item.title || \"-\"\n                            ) +\n                        '<\/span>' +\n\n                        (\n                            item.notes\n                                ?\n                                '<span class=\"rkk-order-note\">' +\n                                    escapeHTML(\n                                        item.notes\n                                    ) +\n                                '<\/span>'\n                                :\n                                \"\"\n                        ) +\n\n                    '<\/td>' +\n\n\n                    '<td>' +\n\n                        groupBadge(\n                            item.group\n                        ) +\n\n                    '<\/td>' +\n\n\n                    '<td class=\"rkk-center\">' +\n\n                        documentButton(\n                            item\n                        ) +\n\n                    '<\/td>';\n\n\n                body.appendChild(\n                    row\n                );\n\n            }\n        );\n\n\n        bindDocumentButtons();\n\n    }\n\n\n\n    \/* =====================================================\n       CARDS\n       ===================================================== *\/\n\n    function renderCards(items) {\n\n        const grid =\n            el(\"rkkDocCardView\");\n\n\n        grid.innerHTML =\n            \"\";\n\n\n        items.forEach(\n            function (item) {\n\n                const card =\n                    document.createElement(\n                        \"article\"\n                    );\n\n\n                card.className =\n                    \"rkk-doc-card\";\n\n\n                card.innerHTML =\n\n                    '<div class=\"rkk-doc-card-top\">' +\n\n                        '<span class=\"rkk-order-number\">' +\n                            '\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\u0e17\u0e35\u0e48 ' +\n                            escapeHTML(\n                                item.number || \"-\"\n                            ) +\n                        '<\/span>' +\n\n                        '<span class=\"rkk-doc-card-year\">' +\n                            '\u0e1b\u0e35 ' +\n                            escapeHTML(\n                                item.year || \"-\"\n                            ) +\n                        '<\/span>' +\n\n                    '<\/div>' +\n\n\n                    '<div class=\"rkk-doc-card-title\">' +\n\n                        escapeHTML(\n                            item.title || \"-\"\n                        ) +\n\n                    '<\/div>' +\n\n\n                    (\n                        item.notes\n                            ?\n                            '<div class=\"rkk-doc-card-note\">' +\n                                escapeHTML(\n                                    item.notes\n                                ) +\n                            '<\/div>'\n                            :\n                            \"\"\n                    ) +\n\n\n                    '<div class=\"rkk-doc-card-bottom\">' +\n\n                        groupBadge(\n                            item.group\n                        ) +\n\n                        documentButton(\n                            item\n                        ) +\n\n                    '<\/div>';\n\n\n                grid.appendChild(\n                    card\n                );\n\n            }\n        );\n\n\n        bindDocumentButtons();\n\n    }\n\n\n\n    \/* =====================================================\n       GROUP BADGE\n       ===================================================== *\/\n\n    function groupBadge(group) {\n\n        let cssClass =\n            \"\";\n\n\n        if (\n            group.includes(\n                \"\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e27\u0e34\u0e0a\u0e32\u0e01\u0e32\u0e23\"\n            )\n        ) {\n\n            cssClass =\n                \"rkk-group-academic\";\n\n        }\n\n        else if (\n            group.includes(\n                \"\u0e07\u0e1a\u0e1b\u0e23\u0e30\u0e21\u0e32\u0e13\"\n            )\n        ) {\n\n            cssClass =\n                \"rkk-group-budget\";\n\n        }\n\n        else if (\n            group.includes(\n                \"\u0e01\u0e34\u0e08\u0e01\u0e32\u0e23\u0e19\u0e31\u0e01\u0e40\u0e23\u0e35\u0e22\u0e19\"\n            )\n        ) {\n\n            cssClass =\n                \"rkk-group-student\";\n\n        }\n\n        else if (\n            group.includes(\n                \"\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\"\n            )\n        ) {\n\n            cssClass =\n                \"rkk-group-admin\";\n\n        }\n\n\n        return (\n\n            '<span class=\"rkk-group-badge ' +\n            cssClass +\n            '\">' +\n\n            escapeHTML(\n                group || \"\u0e2d\u0e37\u0e48\u0e19 \u0e46\"\n            ) +\n\n            '<\/span>'\n\n        );\n\n    }\n\n\n\n    \/* =====================================================\n       DOCUMENT BUTTON\n       ===================================================== *\/\n\n    function documentButton(item) {\n\n        return (\n\n            '<button ' +\n            'type=\"button\" ' +\n            'class=\"rkk-doc-open\" ' +\n            'data-rkk-id=\"' +\n            escapeAttr(\n                item.id\n            ) +\n            '\">' +\n\n            '\u25a3 \u0e40\u0e1b\u0e34\u0e14\u0e14\u0e39\u0e40\u0e2d\u0e01\u0e2a\u0e32\u0e23' +\n\n            '<\/button>'\n\n        );\n\n    }\n\n\n\n    function bindDocumentButtons() {\n\n        const buttons =\n            document.querySelectorAll(\n                \"#rkk-doc-system .rkk-doc-open\"\n            );\n\n\n        buttons.forEach(\n            function (button) {\n\n                button.onclick =\n                    function () {\n\n                        openDocument(\n                            button.getAttribute(\n                                \"data-rkk-id\"\n                            )\n                        );\n\n                    };\n\n            }\n        );\n\n    }\n\n\n\n    \/* =====================================================\n       DOCUMENT VIEWER\n       ===================================================== *\/\n\n    function openDocument(id) {\n\n        const item =\n            orders.find(\n                function (entry) {\n\n                    return (\n                        entry.id ===\n                        id\n                    );\n\n                }\n            );\n\n\n        if (!item) {\n\n            return;\n\n        }\n\n\n        const normalURL =\n            item.docUrl;\n\n\n        if (\n            !normalURL\n        ) {\n\n            window.alert(\n                \"\u0e44\u0e21\u0e48\u0e1e\u0e1a\u0e25\u0e34\u0e07\u0e01\u0e4c\u0e40\u0e2d\u0e01\u0e2a\u0e32\u0e23\"\n            );\n\n            return;\n\n        }\n\n\n        let previewURL =\n            item.previewUrl;\n\n\n        if (\n            !previewURL\n        ) {\n\n            previewURL =\n                drivePreviewURL(\n                    normalURL\n                );\n\n        }\n\n\n        el(\"rkkDocModalTitle\")\n            .textContent =\n            item.title ||\n            \"\u0e40\u0e2d\u0e01\u0e2a\u0e32\u0e23\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\";\n\n\n        el(\"rkkDocModalSubtitle\")\n            .textContent =\n            \"\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\u0e17\u0e35\u0e48 \" +\n            (\n                item.number ||\n                \"-\"\n            ) +\n            \" \u2022 \u0e1b\u0e35 \u0e1e.\u0e28. \" +\n            (\n                item.year ||\n                \"-\"\n            );\n\n\n        el(\"rkkDocExternal\")\n            .href =\n            normalURL;\n\n\n        el(\"rkkDocIframe\")\n            .src =\n            previewURL;\n\n\n        el(\"rkkDocModal\")\n            .classList\n            .add(\n                \"active\"\n            );\n\n\n        document.body\n            .style\n            .overflow =\n            \"hidden\";\n\n    }\n\n\n\n    function drivePreviewURL(url) {\n\n        if (\n            !url.includes(\n                \"drive.google.com\"\n            )\n        ) {\n\n            return url;\n\n        }\n\n\n        const fileMatch =\n            url.match(\n                \/\\\/file\\\/d\\\/([^\/]+)\/\n            );\n\n\n        if (\n            fileMatch &&\n            fileMatch[1]\n        ) {\n\n            return (\n                \"https:\/\/drive.google.com\/file\/d\/\" +\n                fileMatch[1] +\n                \"\/preview\"\n            );\n\n        }\n\n\n        const idMatch =\n            url.match(\n                \/[?&]id=([^&]+)\/\n            );\n\n\n        if (\n            idMatch &&\n            idMatch[1]\n        ) {\n\n            return (\n                \"https:\/\/drive.google.com\/file\/d\/\" +\n                idMatch[1] +\n                \"\/preview\"\n            );\n\n        }\n\n\n        return url;\n\n    }\n\n\n\n    function closeDocument() {\n\n        const modal =\n            el(\"rkkDocModal\");\n\n\n        if (\n            !modal\n        ) {\n            return;\n        }\n\n\n        modal.classList\n            .remove(\n                \"active\"\n            );\n\n\n        el(\"rkkDocIframe\")\n            .src =\n            \"about:blank\";\n\n\n        document.body\n            .style\n            .overflow =\n            \"\";\n\n    }\n\n\n\n    \/* =====================================================\n       VIEW MODE\n       ===================================================== *\/\n\n    function switchView(view) {\n\n        currentView =\n            view;\n\n\n        applyView();\n\n    }\n\n\n\n    function applyView() {\n\n        if (\n            currentView ===\n            \"table\"\n        ) {\n\n            el(\"rkkDocTableView\")\n                .style.display =\n                \"block\";\n\n\n            el(\"rkkDocCardView\")\n                .classList\n                .remove(\n                    \"active\"\n                );\n\n\n            el(\"rkkDocTableButton\")\n                .classList\n                .add(\n                    \"active\"\n                );\n\n\n            el(\"rkkDocCardButton\")\n                .classList\n                .remove(\n                    \"active\"\n                );\n\n        }\n\n        else {\n\n            el(\"rkkDocTableView\")\n                .style.display =\n                \"none\";\n\n\n            el(\"rkkDocCardView\")\n                .classList\n                .add(\n                    \"active\"\n                );\n\n\n            el(\"rkkDocTableButton\")\n                .classList\n                .remove(\n                    \"active\"\n                );\n\n\n            el(\"rkkDocCardButton\")\n                .classList\n                .add(\n                    \"active\"\n                );\n\n        }\n\n    }\n\n\n\n    \/* =====================================================\n       PAGINATION\n       ===================================================== *\/\n\n    function renderPagination(\n        totalPages\n    ) {\n\n        const container =\n            el(\n                \"rkkDocPagination\"\n            );\n\n\n        container.innerHTML =\n            \"\";\n\n\n        if (\n            totalPages <=\n            1\n        ) {\n\n            return;\n\n        }\n\n\n        if (\n            currentPage >\n            1\n        ) {\n\n            const previous =\n                createPageButton(\n                    \"\u2039\",\n                    currentPage - 1,\n                    false\n                );\n\n\n            container.appendChild(\n                previous\n            );\n\n        }\n\n\n        let firstPage =\n            Math.max(\n                1,\n                currentPage - 2\n            );\n\n\n        let lastPage =\n            Math.min(\n                totalPages,\n                currentPage + 2\n            );\n\n\n        if (\n            currentPage <=\n            3\n        ) {\n\n            lastPage =\n                Math.min(\n                    5,\n                    totalPages\n                );\n\n        }\n\n\n        if (\n            currentPage >=\n            totalPages - 2\n        ) {\n\n            firstPage =\n                Math.max(\n                    1,\n                    totalPages - 4\n                );\n\n        }\n\n\n        for (\n            let page =\n                firstPage;\n\n            page <=\n                lastPage;\n\n            page++\n        ) {\n\n            const button =\n                createPageButton(\n                    page,\n                    page,\n                    page ===\n                    currentPage\n                );\n\n\n            container.appendChild(\n                button\n            );\n\n        }\n\n\n        if (\n            currentPage <\n            totalPages\n        ) {\n\n            const next =\n                createPageButton(\n                    \"\u203a\",\n                    currentPage + 1,\n                    false\n                );\n\n\n            container.appendChild(\n                next\n            );\n\n        }\n\n    }\n\n\n\n    function createPageButton(\n        label,\n        page,\n        active\n    ) {\n\n        const button =\n            document.createElement(\n                \"button\"\n            );\n\n\n        button.type =\n            \"button\";\n\n\n        button.className =\n            \"rkk-page-btn\" +\n            (\n                active\n                    ?\n                    \" active\"\n                    :\n                    \"\"\n            );\n\n\n        button.textContent =\n            label;\n\n\n        button.onclick =\n            function () {\n\n                currentPage =\n                    page;\n\n\n                render();\n\n\n                const main =\n                    el(\n                        \"rkkDocTableView\"\n                    );\n\n\n                if (\n                    main\n                ) {\n\n                    const top =\n                        main\n                            .getBoundingClientRect()\n                            .top +\n                        window.scrollY -\n                        100;\n\n\n                    window.scrollTo(\n                        {\n                            top:\n                                top,\n\n                            behavior:\n                                \"smooth\"\n                        }\n                    );\n\n                }\n\n            };\n\n\n        return button;\n\n    }\n\n\n\n    \/* =====================================================\n       STATUS\n       ===================================================== *\/\n\n    function setStatus(\n        message,\n        type\n    ) {\n\n        const status =\n            el(\n                \"rkkDocStatus\"\n            );\n\n\n        status.textContent =\n            message || \"\";\n\n\n        status.classList\n            .remove(\n                \"error\",\n                \"success\"\n            );\n\n\n        if (\n            type ===\n            \"error\"\n        ) {\n\n            status.classList\n                .add(\n                    \"error\"\n                );\n\n        }\n\n        else if (\n            type ===\n            \"success\"\n        ) {\n\n            status.classList\n                .add(\n                    \"success\"\n                );\n\n        }\n\n    }\n\n\n\n    \/* =====================================================\n       START\n       ===================================================== *\/\n\n    if (\n        document.readyState ===\n        \"loading\"\n    ) {\n\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            init\n        );\n\n    }\n\n    else {\n\n        init();\n\n    }\n\n\n})();\n\n<\/script>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-no-title","meta":{"footnotes":""},"class_list":["post-133","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rkk.ac.th\/index.php?rest_route=\/wp\/v2\/pages\/133","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rkk.ac.th\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rkk.ac.th\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rkk.ac.th\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rkk.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=133"}],"version-history":[{"count":5,"href":"https:\/\/rkk.ac.th\/index.php?rest_route=\/wp\/v2\/pages\/133\/revisions"}],"predecessor-version":[{"id":143,"href":"https:\/\/rkk.ac.th\/index.php?rest_route=\/wp\/v2\/pages\/133\/revisions\/143"}],"wp:attachment":[{"href":"https:\/\/rkk.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=133"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}