{"id":60,"date":"2025-05-14T20:06:29","date_gmt":"2025-05-14T20:06:29","guid":{"rendered":"https:\/\/digitaltelawah.org.sa\/?page_id=60"},"modified":"2025-08-04T15:49:10","modified_gmt":"2025-08-04T15:49:10","slug":"%d8%aa%d9%82%d8%a7%d8%b1%d9%8a%d8%b1-%d8%a7%d9%84%d8%ac%d9%85%d8%b9%d9%8a%d8%a9","status":"publish","type":"page","link":"https:\/\/digitaltelawah.org.sa\/?page_id=60","title":{"rendered":"\u062a\u0642\u0627\u0631\u064a\u0631 \u0627\u0644\u062c\u0645\u0639\u064a\u0629"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n \u062a\u0642\u0627\u0631\u064a\u0631 \u0627\u0644\u062c\u0645\u0639\u064a\u0629<\/title>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n <style>\r\n \/* Define color palette and font *\/\r\n :root {\r\n --primary-dark-blue: #01474F; \/* From #01474F *\/\r\n --accent-green: #ABD58D; \/* From #ABD58D *\/\r\n --dark-text: #111111; \/* From #111111 *\/\r\n --light-bg: #FAFAFA; \/* From #FAFAFA *\/\r\n --white: #ffffff;\r\n --border-color: #e0e0e0;\r\n --font-family: 'Cairo', sans-serif;\r\n --box-shadow-light: rgba(0, 0, 0, 0.04);\r\n --box-shadow-hover: rgba(0, 0, 0, 0.1);\r\n }\r\n\r\n body {\r\n font-family: var(--font-family);\r\n margin: 0;\r\n background-color: var(--light-bg);\r\n color: var(--dark-text);\r\n line-height: 1.6;\r\n direction: rtl; \/* Ensure RTL for all text *\/\r\n padding: 20px; \/* Add some padding around the edges *\/\r\n }\r\n\r\n .container {\r\n max-width: 1200px;\r\n margin: 40px auto;\r\n background: var(--white);\r\n padding: 30px 40px; \/* Slightly more horizontal padding *\/\r\n border-radius: 12px; \/* More rounded corners for modern look *\/\r\n box-shadow: 0 8px 25px var(--box-shadow-light); \/* Softer, larger shadow *\/\r\n }\r\n\r\n .header-section {\r\n text-align: center;\r\n margin-bottom: 50px; \/* More space below header *\/\r\n }\r\n\r\n .header-section h1 {\r\n color: var(--primary-dark-blue);\r\n font-weight: 700;\r\n font-size: 3.2em; \/* Larger main title *\/\r\n margin-bottom: 10px; \/* Closer to subtitle *\/\r\n position: relative;\r\n display: inline-block; \/* To center the ::after element correctly *\/\r\n padding-bottom: 20px; \/* Space for the underline *\/\r\n }\r\n\r\n .header-section h1::after {\r\n content: '';\r\n position: absolute;\r\n bottom: 0;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n width: 120px; \/* Wider accent line *\/\r\n height: 6px; \/* Thicker accent line *\/\r\n background-color: var(--accent-green); \/* Use accent color *\/\r\n border-radius: 3px;\r\n }\r\n\r\n .header-section h2 {\r\n color: #555; \/* Softer color for subtitle *\/\r\n font-weight: 400; \/* Lighter weight for subtitle *\/\r\n font-size: 1.6em; \/* Appropriate size for subtitle *\/\r\n margin-top: 0;\r\n line-height: 1.5;\r\n }\r\n\r\n .report-filter {\r\n margin-bottom: 35px;\r\n padding: 25px;\r\n background-color: #f6f6f6; \/* A very subtle gray background for the filter section *\/\r\n border-radius: 10px;\r\n display: flex;\r\n gap: 20px; \/* More space between filter elements *\/\r\n justify-content: flex-end; \/* Align items to the right for RTL *\/\r\n \/* ---------------------------------- *\/\r\n align-items: center;\r\n box-shadow: inset 0 2px 5px var(--box-shadow-light); \/* Subtle inner shadow *\/\r\n }\r\n\r\n .report-filter label {\r\n font-weight: 600;\r\n color: var(--primary-dark-blue);\r\n margin-left: 10px; \/* Adjust margin for RTL *\/\r\n white-space: nowrap;\r\n font-size: 1.05em; \/* Slightly larger label text *\/\r\n }\r\n\r\n .report-filter select,\r\n .report-filter input[type=\"text\"] {\r\n padding: 12px 18px; \/* More padding for a larger feel *\/\r\n border-radius: 8px; \/* More rounded inputs *\/\r\n border: 1px solid var(--border-color);\r\n font-family: var(--font-family);\r\n font-size: 1em;\r\n color: var(--dark-text);\r\n background-color: var(--white);\r\n flex-grow: 1;\r\n max-width: 220px; \/* Adjusted max width *\/\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .report-filter select:focus,\r\n .report-filter input[type=\"text\"]:focus {\r\n border-color: var(--accent-green); \/* Highlight border on focus *\/\r\n box-shadow: 0 0 0 3px rgba(171, 213, 141, 0.4); \/* Soft focus ring *\/\r\n outline: none;\r\n }\r\n\r\n .report-filter input[type=\"text\"] {\r\n max-width: 350px;\r\n }\r\n\r\n .report-list {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); \/* Slightly wider cards *\/\r\n gap: 30px; \/* More space between cards *\/\r\n }\r\n\r\n .report-card {\r\n background-color: var(--white);\r\n border: 1px solid var(--border-color);\r\n border-radius: 12px; \/* Rounded corners for card-like feel *\/\r\n padding: 25px; \/* More internal padding *\/\r\n box-shadow: 0 6px 18px var(--box-shadow-light); \/* Soft shadow *\/\r\n transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;\r\n text-align: right; \/* Align text to the right for RTL *\/\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n }\r\n\r\n .report-card:hover {\r\n transform: translateY(-10px); \/* More pronounced lift effect *\/\r\n box-shadow: 0 12px 30px var(--box-shadow-hover); \/* Stronger shadow on hover *\/\r\n }\r\n\r\n .report-card h3 {\r\n color: var(--primary-dark-blue);\r\n margin-top: 0;\r\n margin-bottom: 15px;\r\n font-weight: 700; \/* Bolder title for cards *\/\r\n font-size: 1.5em; \/* Larger title *\/\r\n line-height: 1.3;\r\n }\r\n\r\n .report-card p {\r\n font-size: 0.95em; \/* Slightly larger body text *\/\r\n line-height: 1.7;\r\n color: #555;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .report-card p strong {\r\n color: var(--dark-text); \/* Key info in dark text *\/\r\n font-weight: 600;\r\n }\r\n\r\n .report-card a {\r\n display: inline-flex; \/* Use flex for button content *\/\r\n align-items: center;\r\n justify-content: center;\r\n margin-top: 20px; \/* More space above button *\/\r\n padding: 12px 25px; \/* Larger button padding *\/\r\n background-color: var(--primary-dark-blue); \/* Main button color *\/\r\n color: var(--white);\r\n text-decoration: none;\r\n border-radius: 8px; \/* Rounded button *\/\r\n transition: background-color 0.3s ease, transform 0.2s ease;\r\n font-weight: 600;\r\n font-size: 1em;\r\n align-self: flex-start; \/* Align button to the right in RTL flex container *\/\r\n gap: 8px; \/* Space for potential icon *\/\r\n }\r\n\r\n .report-card a:hover {\r\n background-color: #003a42; \/* Slightly darker blue on hover *\/\r\n transform: translateY(-2px); \/* Slight lift on hover *\/\r\n }\r\n\r\n \/* Responsive adjustments *\/\r\n @media (max-width: 992px) {\r\n .container {\r\n margin: 30px auto;\r\n padding: 25px 30px;\r\n }\r\n .report-list {\r\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\r\n gap: 25px;\r\n }\r\n .header-section h1 {\r\n font-size: 2.8em;\r\n }\r\n .header-section h2 {\r\n font-size: 1.4em;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n body {\r\n padding: 15px;\r\n }\r\n .container {\r\n margin: 20px auto;\r\n padding: 20px 25px;\r\n border-radius: 10px;\r\n }\r\n .header-section {\r\n margin-bottom: 40px;\r\n }\r\n .header-section h1 {\r\n font-size: 2.2em;\r\n padding-bottom: 15px;\r\n }\r\n .header-section h1::after {\r\n width: 90px;\r\n height: 5px;\r\n }\r\n .header-section h2 {\r\n font-size: 1.2em;\r\n }\r\n .report-filter {\r\n flex-direction: column;\r\n align-items: stretch;\r\n gap: 15px;\r\n padding: 20px;\r\n \/* --- \u0627\u0644\u062a\u0639\u062f\u064a\u0644 \u0647\u0646\u0627 \u0644\u0636\u0645\u0627\u0646 \u0627\u0644\u0645\u062d\u0627\u0630\u0627\u0629 \u0639\u0644\u0649 \u0627\u0644\u0623\u062c\u0647\u0632\u0629 \u0627\u0644\u0635\u063a\u064a\u0631\u0629 --- *\/\r\n justify-content: flex-end;\r\n \/* -------------------------------------------------- *\/\r\n }\r\n .report-filter select,\r\n .report-filter input[type=\"text\"] {\r\n max-width: 100%;\r\n padding: 10px 15px;\r\n }\r\n .report-card {\r\n padding: 20px;\r\n border-radius: 10px;\r\n }\r\n .report-card h3 {\r\n font-size: 1.3em;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .container {\r\n padding: 15px 20px;\r\n }\r\n .report-list {\r\n grid-template-columns: 1fr; \/* Single column on very small screens *\/\r\n gap: 20px;\r\n }\r\n .report-card a {\r\n padding: 10px 20px;\r\n font-size: 0.95em;\r\n }\r\n .header-section h1 {\r\n font-size: 1.8em;\r\n padding-bottom: 10px;\r\n }\r\n .header-section h1::after {\r\n width: 70px;\r\n height: 4px;\r\n }\r\n .header-section h2 {\r\n font-size: 1em;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"container\">\r\n <div class=\"header-section\">\r\n <h1>\u062a\u0642\u0627\u0631\u064a\u0631 \u0627\u0644\u062c\u0645\u0639\u064a\u0629 \u0627\u0644\u0633\u0646\u0648\u064a\u0629<\/h1>\r\n <h2>\u0627\u0643\u062a\u0634\u0641 \u0625\u0646\u062c\u0627\u0632\u0627\u062a\u0646\u0627 \u0648\u0623\u062f\u0627\u0621\u0646\u0627 \u0639\u0644\u0649 \u0645\u062f\u0627\u0631 \u0627\u0644\u0633\u0646\u0648\u0627\u062a<\/h2>\r\n <\/div>\r\n\r\n <div class=\"report-filter\">\r\n <label for=\"report-year\">\u0627\u0644\u0633\u0646\u0629:<\/label>\r\n <select id=\"report-year\">\r\n <option value=\"\">\u0627\u0644\u0643\u0644<\/option>\r\n <option value=\"2025\">2025<\/option>\r\n <option value=\"2024\">2024<\/option>\r\n <option value=\"2023\">2023<\/option>\r\n <option value=\"2022\">2022<\/option>\r\n <option value=\"2021\">2021<\/option>\r\n <\/select>\r\n\r\n <label for=\"report-type\">\u0627\u0644\u0646\u0648\u0639:<\/label>\r\n <select id=\"report-type\">\r\n <option value=\"\">\u0627\u0644\u0643\u0644<\/option>\r\n <option value=\"\u0645\u0627\u0644\u064a\">\u0645\u0627\u0644\u064a<\/option>\r\n <option value=\"\u0625\u062f\u0627\u0631\u064a\">\u0625\u062f\u0627\u0631\u064a<\/option>\r\n <option value=\"\u0633\u0646\u0648\u064a\">\u0633\u0646\u0648\u064a<\/option>\r\n <option value=\"\u0646\u0634\u0627\u0637\">\u0646\u0634\u0627\u0637<\/option>\r\n <\/select>\r\n\r\n <label for=\"report-search\">\u0628\u062d\u062b:<\/label>\r\n <input type=\"text\" id=\"report-search\" placeholder=\"\u0627\u0628\u062d\u062b \u0639\u0646 \u062a\u0642\u0631\u064a\u0631...\">\r\n <\/div>\r\n\r\n <div class=\"report-list\" id=\"report-container\">\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Sample report data (you would typically fetch this from a backend)\r\n const reports = [\r\n {\r\n title: \"\u0627\u0644\u062a\u0642\u0631\u064a\u0631 \u0627\u0644\u0645\u0627\u0644\u064a \u0644\u0639\u0627\u0645 2024\",\r\n description: \"\u0646\u0638\u0631\u0629 \u0639\u0627\u0645\u0629 \u0648\u0634\u0627\u0645\u0644\u0629 \u0639\u0644\u0649 \u0627\u0644\u0648\u0636\u0639 \u0627\u0644\u0645\u0627\u0644\u064a \u0644\u0644\u062c\u0645\u0639\u064a\u0629 \u062e\u0644\u0627\u0644 \u0639\u0627\u0645 2024\u060c \u062a\u0641\u0627\u0635\u064a\u0644 \u0627\u0644\u0625\u064a\u0631\u0627\u062f\u0627\u062a \u0648\u0627\u0644\u0645\u0635\u0631\u0648\u0641\u0627\u062a.\",\r\n year: \"2024\",\r\n type: \"\u0645\u0627\u0644\u064a\",\r\n link: \"reports\/financial_2024.pdf\"\r\n },\r\n {\r\n title: \"\u0627\u0644\u062a\u0642\u0631\u064a\u0631 \u0627\u0644\u0625\u062f\u0627\u0631\u064a \u0648\u0627\u0644\u062a\u0634\u063a\u064a\u0644\u064a \u0644\u0639\u0627\u0645 2023\",\r\n description: \"\u0645\u0644\u062e\u0635 \u0644\u0623\u0628\u0631\u0632 \u0627\u0644\u0623\u0646\u0634\u0637\u0629 \u0648\u0627\u0644\u0625\u0646\u062c\u0627\u0632\u0627\u062a \u0627\u0644\u0625\u062f\u0627\u0631\u064a\u0629 \u0648\u0627\u0644\u062a\u0634\u063a\u064a\u0644\u064a\u0629 \u0644\u0644\u062c\u0645\u0639\u064a\u0629 \u0641\u064a \u0639\u0627\u0645 2023\u060c \u0645\u062a\u0636\u0645\u0646\u064b\u0627 \u0627\u0644\u0645\u0634\u0627\u0631\u064a\u0639 \u0627\u0644\u0645\u0646\u0641\u0630\u0629.\",\r\n year: \"2023\",\r\n type: \"\u0625\u062f\u0627\u0631\u064a\",\r\n link: \"reports\/admin_2023.pdf\"\r\n },\r\n {\r\n title: \"\u0627\u062c\u062a\u0645\u0627\u0639 \u0645\u062c\u0644\u0633 \u0627\u0644\u0625\u062f\u0627\u0631\u0629 \u0627\u0644\u0633\u0627\u062f\u0633 \u0644\u0639\u0627\u0645 2025\",\r\n description: \"\u0645\u062d\u0636\u0631 \u0648\u062c\u062f\u0648\u0644 \u0623\u0639\u0645\u0627\u0644 \u0627\u0644\u0627\u062c\u062a\u0645\u0627\u0639 \u0627\u0644\u0633\u0627\u062f\u0633 \u0644\u0645\u062c\u0644\u0633 \u0625\u062f\u0627\u0631\u0629 \u062c\u0645\u0639\u064a\u0629 \u062a\u0644\u0627\u0648\u0629 \u0627\u0644\u0631\u0642\u0645\u064a\u0629\u060c \u0648\u0627\u0644\u0630\u064a \u0627\u0633\u062a\u0639\u0631\u0636 \u0645\u0633\u062a\u062c\u062f\u0627\u062a \u0627\u0644\u0639\u0645\u0644 \u0648\u0648\u062c\u0647\u0627\u062a \u0627\u0644\u062a\u0637\u0648\u064a\u0631 \u0627\u0644\u0645\u0642\u062a\u0631\u062d\u0629.\",\r\n year: \"2025\",\r\n type: \"\u0625\u062f\u0627\u0631\u064a\",\r\n link: \"https:\/\/digitaltelawah.org.sa\/wp-content\/uploads\/2025\/08\/\u062c\u062f\u0648\u0644-\u0627\u0644\u0627\u062c\u062a\u0645\u0627\u0639-\u0627\u0644\u0633\u0627\u062f\u0633-\u0644\u0645\u062c\u0644\u0633-\u0627\u0644\u0625\u062f\u0627\u0631\u0629.pdf\"\r\n},\r\n {\r\n title: \"\u0627\u0644\u062a\u0642\u0631\u064a\u0631 \u0627\u0644\u0633\u0646\u0648\u064a \u0627\u0644\u0634\u0627\u0645\u0644 2023\",\r\n description: \"\u062a\u0642\u0631\u064a\u0631 \u062a\u0641\u0635\u064a\u0644\u064a \u064a\u0644\u062e\u0635 \u062c\u0645\u064a\u0639 \u0623\u0646\u0634\u0637\u0629 \u0627\u0644\u062c\u0645\u0639\u064a\u0629 \u0648\u0625\u0646\u062c\u0627\u0632\u0627\u062a\u0647\u0627 \u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629 \u0648\u0627\u0644\u0645\u0627\u0644\u064a\u0629 \u0648\u0627\u0644\u062a\u0634\u063a\u064a\u0644\u064a\u0629 \u0644\u0639\u0627\u0645 2023.\",\r\n year: \"2023\",\r\n type: \"\u0633\u0646\u0648\u064a\",\r\n link: \"reports\/annual_2023.pdf\"\r\n },\r\n {\r\n title: \"\u062a\u0642\u0631\u064a\u0631 \u0623\u0646\u0634\u0637\u0629 \u0627\u0644\u0631\u0628\u0639 \u0627\u0644\u0623\u0648\u0644 2024\",\r\n description: \"\u062a\u0641\u0627\u0635\u064a\u0644 \u0627\u0644\u0623\u0646\u0634\u0637\u0629 \u0648\u0627\u0644\u0645\u0634\u0627\u0631\u064a\u0639 \u0648\u0627\u0644\u0641\u0639\u0627\u0644\u064a\u0627\u062a \u0627\u0644\u0645\u0646\u0641\u0630\u0629 \u062e\u0644\u0627\u0644 \u0627\u0644\u0631\u0628\u0639 \u0627\u0644\u0623\u0648\u0644 \u0645\u0646 \u0639\u0627\u0645 2024\u060c \u0645\u0639 \u0627\u0644\u0625\u062d\u0635\u0627\u0626\u064a\u0627\u062a \u0627\u0644\u0623\u0648\u0644\u064a\u0629.\",\r\n year: \"2024\",\r\n type: \"\u0646\u0634\u0627\u0637\",\r\n link: \"reports\/activities_Q1_2024.pdf\"\r\n },\r\n {\r\n title: \"\u0627\u0644\u062a\u0642\u0631\u064a\u0631 \u0627\u0644\u0645\u0627\u0644\u064a \u0644\u0644\u0631\u0628\u0639 \u0627\u0644\u0623\u062e\u064a\u0631 2023\",\r\n description: \"\u062a\u062d\u0644\u064a\u0644 \u0645\u0627\u0644\u064a \u0645\u0641\u0635\u0644 \u0644\u0644\u0631\u0628\u0639 \u0627\u0644\u0623\u062e\u064a\u0631 \u0645\u0646 \u0639\u0627\u0645 2023\u060c \u064a\u0648\u0636\u062d \u0627\u0644\u0623\u062f\u0627\u0621 \u0627\u0644\u0645\u0627\u0644\u064a \u0644\u0644\u062c\u0645\u0639\u064a\u0629 \u0641\u064a \u0646\u0647\u0627\u064a\u0629 \u0627\u0644\u0639\u0627\u0645.\",\r\n year: \"2023\",\r\n type: \"\u0645\u0627\u0644\u064a\",\r\n link: \"reports\/financial_Q4_2023.pdf\"\r\n },\r\n {\r\n title: \"\u062a\u0642\u0631\u064a\u0631 \u0627\u0633\u062a\u062f\u0627\u0645\u0629 \u0627\u0644\u0645\u0634\u0627\u0631\u064a\u0639 2022\",\r\n description: \"\u062f\u0631\u0627\u0633\u0629 \u062d\u0648\u0644 \u0627\u0633\u062a\u062f\u0627\u0645\u0629 \u0645\u0634\u0627\u0631\u064a\u0639 \u0627\u0644\u062c\u0645\u0639\u064a\u0629 \u0627\u0644\u0645\u0646\u0641\u0630\u0629 \u062e\u0644\u0627\u0644 \u0639\u0627\u0645 2022 \u0648\u0622\u062b\u0627\u0631\u0647\u0627 \u0637\u0648\u064a\u0644\u0629 \u0627\u0644\u0645\u062f\u0649.\",\r\n year: \"2022\",\r\n type: \"\u0625\u062f\u0627\u0631\u064a\",\r\n link: \"reports\/sustainability_2022.pdf\"\r\n },\r\n {\r\n title: \"\u062a\u0642\u0631\u064a\u0631 \u0627\u0644\u0623\u062f\u0627\u0621 \u0627\u0644\u0633\u0646\u0648\u064a 2021\",\r\n description: \"\u062a\u0642\u064a\u064a\u0645 \u0634\u0627\u0645\u0644 \u0644\u0623\u062f\u0627\u0621 \u0627\u0644\u062c\u0645\u0639\u064a\u0629 \u0648\u0625\u0646\u062c\u0627\u0632\u0627\u062a\u0647\u0627 \u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629 \u0641\u064a \u0639\u0627\u0645 2021\u060c \u0645\u0639 \u062a\u062d\u0644\u064a\u0644 \u0644\u0644\u062a\u062d\u062f\u064a\u0627\u062a \u0648\u0627\u0644\u0641\u0631\u0635.\",\r\n year: \"2021\",\r\n type: \"\u0633\u0646\u0648\u064a\",\r\n link: \"reports\/performance_2021.pdf\"\r\n }\r\n ];\r\n\r\n const reportContainer = document.getElementById('report-container');\r\n const reportYearFilter = document.getElementById('report-year');\r\n const reportTypeFilter = document.getElementById('report-type');\r\n const reportSearchInput = document.getElementById('report-search');\r\n\r\n function displayReports(filteredReports) {\r\n reportContainer.innerHTML = ''; \/\/ Clear previous reports\r\n if (filteredReports.length === 0) {\r\n reportContainer.innerHTML = '<p style=\"text-align: center; width: 100%; color: #666; padding: 30px; font-size: 1.1em; border-radius: 8px; background-color: #f9f9f9; box-shadow: 0 2px 8px var(--box-shadow-light);\">\u0644\u0627 \u062a\u0648\u062c\u062f \u062a\u0642\u0627\u0631\u064a\u0631 \u0645\u0637\u0627\u0628\u0642\u0629 \u0644\u0644\u0645\u0639\u0627\u064a\u064a\u0631 \u0627\u0644\u0645\u062d\u062f\u062f\u0629.<\/p>';\r\n return;\r\n }\r\n\r\n filteredReports.forEach(report => {\r\n const reportCard = document.createElement('div');\r\n reportCard.classList.add('report-card');\r\n reportCard.innerHTML = `\r\n <h3>${report.title}<\/h3>\r\n <p><strong>\u0627\u0644\u0633\u0646\u0629:<\/strong> ${report.year}<\/p>\r\n <p><strong>\u0627\u0644\u0646\u0648\u0639:<\/strong> ${report.type}<\/p>\r\n <p>${report.description}<\/p>\r\n <a href=\"${report.link}\" target=\"_blank\">\u0639\u0631\u0636 \u0627\u0644\u062a\u0642\u0631\u064a\u0631<\/a>\r\n `;\r\n reportContainer.appendChild(reportCard);\r\n });\r\n }\r\n\r\n function filterReports() {\r\n const selectedYear = reportYearFilter.value;\r\n const selectedType = reportTypeFilter.value;\r\n const searchTerm = reportSearchInput.value.toLowerCase();\r\n\r\n const filtered = reports.filter(report => {\r\n const matchesYear = selectedYear === \"\" || report.year === selectedYear;\r\n const matchesType = selectedType === \"\" || report.type === selectedType;\r\n const matchesSearch = report.title.toLowerCase().includes(searchTerm) ||\r\n report.description.toLowerCase().includes(searchTerm);\r\n return matchesYear && matchesType && matchesSearch;\r\n });\r\n displayReports(filtered);\r\n }\r\n\r\n \/\/ Add event listeners to filters\r\n reportYearFilter.addEventListener('change', filterReports);\r\n reportTypeFilter.addEventListener('change', filterReports);\r\n reportSearchInput.addEventListener('keyup', filterReports);\r\n\r\n \/\/ Initial display of all reports\r\n document.addEventListener('DOMContentLoaded', () => {\r\n displayReports(reports);\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-32426e48 e-flex e-con-boxed e-con e-parent\" data-id=\"32426e48\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-10cdc605 elementor-button-success elementor-align-right elementor-widget elementor-widget-button\" data-id=\"10cdc605\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"sticky":"bottom","sticky_on":["desktop","tablet","mobile"],"sticky_offset":0,"sticky_effects_offset":0,"sticky_anchor_link_offset":0}\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/digitaltelawah.org.sa\/?page_id=48\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-heart\" viewBox=\"0 0 512 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M462.3 62.6C407.5 15.9 326 24.3 275.7 76.2L256 96.5l-19.7-20.3C186.1 24.3 104.5 15.9 49.7 62.6c-62.8 53.6-66.1 149.8-9.9 207.9l193.5 199.8c12.5 12.9 32.8 12.9 45.3 0l193.5-199.8c56.3-58.1 53-154.3-9.8-207.9z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u062a\u0628\u0631\u0639 \u0627\u0644\u0627\u0646<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u062a\u0642\u0627\u0631\u064a\u0631 \u0627\u0644\u062c\u0645\u0639\u064a\u0629 \u062a\u0642\u0627\u0631\u064a\u0631 \u0627\u0644\u062c\u0645\u0639\u064a\u0629 \u0627\u0644\u0633\u0646\u0648\u064a\u0629 \u0627\u0643\u062a\u0634\u0641 \u0625\u0646\u062c\u0627\u0632\u0627\u062a\u0646\u0627 \u0648\u0623\u062f\u0627\u0621\u0646\u0627 \u0639\u0644\u0649 \u0645\u062f\u0627\u0631 \u0627\u0644\u0633\u0646\u0648\u0627\u062a \u0627\u0644\u0633\u0646\u0629: \u0627\u0644\u0643\u064420252024202320222021 \u0627\u0644\u0646\u0648\u0639: \u0627\u0644\u0643\u0644\u0645\u0627\u0644\u064a\u0625\u062f\u0627\u0631\u064a\u0633\u0646\u0648\u064a\u0646\u0634\u0627\u0637 \u0628\u062d\u062b: \u062a\u0628\u0631\u0639 \u0627\u0644\u0627\u0646<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"give_campaign_id":0,"footnotes":""},"class_list":["post-60","page","type-page","status-publish","hentry"],"campaignId":"","_links":{"self":[{"href":"https:\/\/digitaltelawah.org.sa\/index.php?rest_route=\/wp\/v2\/pages\/60","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/digitaltelawah.org.sa\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/digitaltelawah.org.sa\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/digitaltelawah.org.sa\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/digitaltelawah.org.sa\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=60"}],"version-history":[{"count":28,"href":"https:\/\/digitaltelawah.org.sa\/index.php?rest_route=\/wp\/v2\/pages\/60\/revisions"}],"predecessor-version":[{"id":952,"href":"https:\/\/digitaltelawah.org.sa\/index.php?rest_route=\/wp\/v2\/pages\/60\/revisions\/952"}],"wp:attachment":[{"href":"https:\/\/digitaltelawah.org.sa\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=60"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}