{"id":126,"date":"2026-07-12T14:40:06","date_gmt":"2026-07-12T08:40:06","guid":{"rendered":"https:\/\/nurulharamainmadrasa.com\/?page_id=126"},"modified":"2026-07-13T00:27:00","modified_gmt":"2026-07-12T18:27:00","slug":"madrasa-home-page-portal","status":"publish","type":"page","link":"https:\/\/nurulharamainmadrasa.com\/","title":{"rendered":"Madrasa Home Page Portal"},"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\t\r\n\r\n\r\n \r\n \r\n \u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be - \u09aa\u09cb\u09b0\u09cd\u099f\u09be\u09b2<\/title>\r\n \r\n <!-- Tailwind CSS CDN for Modern Styling -->\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <script>\r\n tailwind.config = {\r\n darkMode: 'class',\r\n theme: {\r\n extend: {\r\n colors: {\r\n emerald: {\r\n 50: '#ecfdf5',\r\n 100: '#d1fae5',\r\n 200: '#a7f3d0',\r\n 300: '#6ee7b7',\r\n 400: '#34d399',\r\n 500: '#10b981',\r\n 600: '#059669',\r\n 700: '#047857',\r\n 800: '#065f46',\r\n 900: '#064e3b',\r\n 950: '#022c22',\r\n },\r\n amber: {\r\n 500: '#f59e0b',\r\n 600: '#d97706',\r\n 700: '#b45309',\r\n }\r\n },\r\n fontFamily: {\r\n sans: ['Anek Bangla', 'Inter', 'sans-serif'],\r\n }\r\n }\r\n }\r\n }\r\n <\/script>\r\n \r\n <!-- Google Fonts for Bengali & English -->\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Anek+Bangla:wght@300;400;600;700;800&family=Inter:wght@300;400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n .nh-wp-wrapper {\r\n font-family: 'Anek Bangla', 'Inter', sans-serif;\r\n -webkit-font-smoothing: antialiased;\r\n -moz-osx-font-smoothing: grayscale;\r\n text-rendering: optimizeLegibility;\r\n }\r\n \/* Custom scrollbar for Chat Assistant *\/\r\n .nh-chat-scroll::-webkit-scrollbar {\r\n width: 5px;\r\n }\r\n .nh-chat-scroll::-webkit-scrollbar-thumb {\r\n background-color: #059669;\r\n border-radius: 10px;\r\n }\r\n \/* Prevent Theme pollution on input elements *\/\r\n .nh-wp-wrapper select, \r\n .nh-wp-wrapper input, \r\n .nh-wp-wrapper textarea {\r\n color: #0f172a !important;\r\n background-color: #ffffff !important;\r\n outline: none !important;\r\n }\r\n .dark .nh-wp-wrapper select, \r\n .dark .nh-wp-wrapper input, \r\n .dark .nh-wp-wrapper textarea {\r\n color: #f1f5f9 !important;\r\n background-color: #1e293b !important;\r\n border-color: #334155 !important;\r\n }\r\n .nh-wp-wrapper input:focus, \r\n .nh-wp-wrapper textarea:focus, \r\n .nh-wp-wrapper select:focus {\r\n box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.25) !important;\r\n border-color: #10b981 !important;\r\n }\r\n \/* Smooth page transitions *\/\r\n .tab-content {\r\n transition: all 0.4s ease-in-out;\r\n }\r\n \/* CRITICAL: Force crisp outlines, prevent fuzzy outer glow rendering bugs *\/\r\n *, *::before, *::after {\r\n text-shadow: none !important;\r\n }\r\n \/* Hide scrollbar for mobile nav *\/\r\n .mobile-nav-scroll::-webkit-scrollbar {\r\n display: none;\r\n }\r\n .mobile-nav-scroll {\r\n -ms-overflow-style: none;\r\n scrollbar-width: none;\r\n }\r\n .shadow-premium {\r\n box-shadow: 0 10px 30px -10px rgba(2, 44, 34, 0.15) !important;\r\n }\r\n .dark .shadow-premium {\r\n box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.5) !important;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"bg-slate-50 dark:bg-slate-950 transition-colors duration-300\">\r\n\r\n <div class=\"nh-wp-wrapper min-h-screen flex flex-col text-slate-900 dark:text-slate-100 pb-20 lg:pb-0\">\r\n \r\n <!-- ================= Floating Toast Notification ================= -->\r\n <div id=\"nh-toast\" class=\"fixed top-16 right-4 z-50 max-w-sm bg-gradient-to-r from-emerald-800 to-emerald-950 text-white px-5 py-4 rounded-2xl shadow-premium border border-emerald-500\/30 flex items-center gap-3 hidden transform transition-all duration-300\">\r\n <span class=\"text-xl animate-bounce\">\u2728<\/span>\r\n <p id=\"nh-toast-text\" class=\"text-sm font-semibold\"><\/p>\r\n <\/div>\r\n\r\n <!-- ================= Notice Ticker Bar ================= -->\r\n <div class=\"bg-gradient-to-r from-emerald-950 via-emerald-900 to-amber-800 text-amber-50 py-3 px-4 text-xs md:text-sm shadow-md\">\r\n <div class=\"max-w-7xl mx-auto flex flex-col md:flex-row justify-between items-center gap-3\">\r\n <div class=\"flex items-center gap-2 font-medium w-full md:w-auto justify-center md:justify-start\">\r\n <span class=\"bg-amber-500 text-emerald-950 text-[10px] md:text-xs px-3 py-1 rounded-full font-bold uppercase shrink-0 tracking-wide animate-pulse\" data-translate=\"ticker_badge\">\u099a\u09b2\u09a4\u09bf \u09a8\u09cb\u099f\u09bf\u09b6<\/span>\r\n <marquee id=\"announcement-ticker\" class=\"text-xs text-amber-100 hover:pause cursor-pointer\">\r\n \u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\u09af\u09bc \u09e8\u09e6\u09e8\u09ec \u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09ac\u09b0\u09cd\u09b7\u09c7 \u09b8\u0995\u09b2 \u09b6\u09be\u0996\u09be\u09af\u09bc (\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be, \u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be \u0993 \u0986\u099b\u09bf\u09af\u09bc\u09be \u0987\u0989\u09b8\u09c1\u09ab \u09ae\u09b9\u09bf\u09b2\u09be \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be) \u09a8\u09a4\u09c1\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf \u099a\u09b2\u099b\u09c7! \u09b8\u09b0\u09be\u09b8\u09b0\u09bf \u09ac\u09be \u0985\u09a8\u09b2\u09be\u0987\u09a8\u09c7\u09b0 \u09ae\u09be\u09a7\u09cd\u09af\u09ae\u09c7 \u0986\u09ac\u09c7\u09a6\u09a8 \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8 \u0995\u09b0\u09c1\u09a8\u0964\r\n <\/marquee>\r\n <\/div>\r\n <div class=\"flex items-center gap-4 flex-wrap justify-center\">\r\n <span class=\"hidden lg:inline text-amber-200 font-semibold\" id=\"header-address-text\" data-translate=\"address\">\ud83d\udccd \u09b8\u09bf\u0995\u09a6\u09be\u09b0 \u09aa\u09be\u09a1\u09bc\u09be, \u09e9\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\u0964<\/span>\r\n <div class=\"flex items-center bg-emerald-900\/40 p-0.5 rounded-lg border border-emerald-700\/50\">\r\n <button onclick=\"setLanguage('bn')\" id=\"lang-btn-bn\" class=\"px-3 py-1 rounded-md text-xs transition-all font-bold\">\u09ac\u09be\u0982\u09b2\u09be<\/button>\r\n <button onclick=\"setLanguage('en')\" id=\"lang-btn-en\" class=\"px-3 py-1 rounded-md text-xs transition-all font-bold\">EN<\/button>\r\n <\/div>\r\n <button onclick=\"toggleDarkMode()\" class=\"p-2 rounded-xl bg-emerald-800\/30 hover:bg-emerald-800\/50 text-amber-400 transition-colors border border-emerald-700\/40\" title=\"\u09a5\u09bf\u09ae \u09aa\u09b0\u09bf\u09ac\u09b0\u09cd\u09a4\u09a8\">\r\n <svg class=\"w-4 h-4 dark:hidden\" fill=\"currentColor\" viewBox=\"0 0 20 20\"><path d=\"M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z\"><\/path><\/svg>\r\n <svg class=\"w-4 h-4 hidden dark:block\" fill=\"currentColor\" viewBox=\"0 0 20 20\"><path fill-rule=\"evenodd\" d=\"M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.707.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464a1 1 0 10-1.414-1.414l.707.707a1 1 0 101.414-1.414l-.707-.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z\" clip-rule=\"evenodd\"><\/path><\/svg>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- ================= STREAMING_CHUNK: Sticky Header Navigation ================= -->\r\n <nav class=\"sticky top-0 z-40 backdrop-blur-md bg-white\/90 border-b border-slate-200\/80 dark:bg-slate-950\/90 dark:border-slate-800\/80 shadow-md\">\r\n <div class=\"max-w-7xl mx-auto px-4 py-3.5 flex justify-between items-center\">\r\n <div class=\"flex items-center gap-3.5 cursor-pointer\" onclick=\"switchTab('home')\">\r\n <!-- Reliable SVG Vector Logo -->\r\n <svg viewBox=\"0 0 500 500\" class=\"w-14 h-14 rounded-full border-2 border-emerald-600 bg-white shrink-0 shadow-sm transition-transform duration-300 hover:scale-105\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <circle cx=\"250\" cy=\"250\" r=\"240\" fill=\"none\" stroke=\"#15803d\" stroke-width=\"8\"\/>\r\n <path id=\"arc-top\" d=\"M 80 250 A 170 170 0 1 1 420 250\" fill=\"none\"\/>\r\n <text fill=\"#15803d\" font-size=\"34\" font-weight=\"900\" font-family=\"sans-serif\"><textPath href=\"#arc-top\" startOffset=\"50%\" text-anchor=\"middle\">\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8<\/textPath><\/text>\r\n <path d=\"M 160 360 L 160 200 C 160 120, 340 120, 340 200 L 340 360 Z\" fill=\"#15803d\"\/>\r\n <path d=\"M 250 280 A 40 40 0 0 0 210 360 L 290 360 A 40 40 0 0 0 250 280 Z\" fill=\"#ffffff\"\/>\r\n <text x=\"250\" y=\"430\" fill=\"#15803d\" font-size=\"36\" font-weight=\"900\" text-anchor=\"middle\">\u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be<\/text>\r\n <\/svg>\r\n <div>\r\n <h1 class=\"text-sm md:text-xl font-extrabold text-emerald-800 dark:text-emerald-400 tracking-wide font-serif\" data-translate=\"title\">\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be<\/h1>\r\n <p class=\"text-[10px] md:text-xs text-amber-600 dark:text-amber-400 font-bold tracking-wider\">Darul Uloom Nurul Haramain Madrasah Group<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <!-- Desktop Navigation Menu -->\r\n <div class=\"hidden xl:flex items-center gap-2 text-sm\">\r\n <button onclick=\"switchTab('home')\" class=\"nav-tab font-black px-4 py-2.5 rounded-xl transition-all duration-300 flex items-center gap-2\" id=\"tab-btn-home\">\r\n <img decoding=\"async\" src=\"https:\/\/i.ibb.co\/Xz9ZJ8K\/nh-logo.jpg\" class=\"w-5 h-5 rounded-full object-cover border border-current\" alt=\"Logo\">\r\n <span data-translate=\"home\">\u09b9\u09cb\u09ae<\/span>\r\n <\/button>\r\n <button onclick=\"switchTab('gallery')\" class=\"nav-tab font-black px-4 py-2.5 rounded-xl transition-all duration-300 flex items-center gap-1.5\" id=\"tab-btn-gallery\">\r\n <span class=\"text-lg\">\ud83d\uddbc\ufe0f\ud83d\udcc2<\/span> <span data-translate=\"gallery\">\u0997\u09cd\u09af\u09be\u09b2\u09be\u09b0\u09bf \u0993 \u09a8\u09cb\u099f\u09bf\u09b6<\/span>\r\n <\/button>\r\n <button onclick=\"switchTab('admission')\" class=\"nav-tab font-black px-4 py-2.5 rounded-xl transition-all duration-300 flex items-center gap-1.5\" id=\"tab-btn-admission\">\r\n <span class=\"text-lg\">\ud83d\udcdd\ud83d\udcf2<\/span> <span data-translate=\"admission\">\u0985\u09a8\u09b2\u09be\u0987\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf<\/span>\r\n <\/button>\r\n <button onclick=\"switchTab('fees')\" class=\"nav-tab font-black px-4 py-2.5 rounded-xl transition-all duration-300 flex items-center gap-1.5\" id=\"tab-btn-fees\">\r\n <span class=\"text-lg\">\ud83d\udcb3<\/span> <span data-translate=\"fees\">\u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7<\/span>\r\n <\/button>\r\n <button onclick=\"switchTab('donation')\" class=\"nav-tab font-black px-4 py-2.5 rounded-xl transition-all duration-300 flex items-center gap-1.5\" id=\"tab-btn-donation\">\r\n <span class=\"text-lg\">\ud83d\udce6\ud83e\ude99<\/span> <span data-translate=\"donate\">\u09a6\u09be\u09a8 \u0995\u09b0\u09c1\u09a8<\/span>\r\n <\/button>\r\n <\/div>\r\n\r\n <div class=\"hidden md:flex items-center gap-3\">\r\n <button onclick=\"switchTab('fees')\" class=\"bg-gradient-to-r from-emerald-700 to-emerald-600 hover:from-emerald-600 hover:to-emerald-500 text-white font-extrabold py-2.5 px-5 rounded-xl text-xs md:text-sm shadow-md hover:shadow-lg transition-all transform hover:-translate-y-0.5\">\r\n \ud83d\udcb3 \u09ac\u09c7\u09a4\u09a8 \u09a6\u09bf\u09a8\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Mobile Bottom Navigation Tab Bar with Scrollable items -->\r\n <div class=\"xl:hidden fixed bottom-0 left-0 right-0 z-50 bg-white\/95 dark:bg-slate-900\/95 border-t border-slate-200 dark:border-slate-800 backdrop-blur-md py-2 px-1 shadow-2xl\">\r\n <div class=\"flex justify-between items-center overflow-x-auto mobile-nav-scroll gap-2 px-2\">\r\n <button onclick=\"switchTab('home')\" class=\"mobile-tab flex flex-col items-center gap-1 text-[10px] min-w-[4rem]\" id=\"m-tab-home\">\r\n <svg viewBox=\"0 0 500 500\" class=\"w-6 h-6 rounded-full border border-current shadow-sm bg-white\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <circle cx=\"250\" cy=\"250\" r=\"240\" fill=\"none\" stroke=\"#15803d\" stroke-width=\"15\"\/><path d=\"M 160 360 L 160 200 C 160 120, 340 120, 340 200 L 340 360 Z\" fill=\"#15803d\"\/>\r\n <\/svg>\r\n <span data-translate=\"home\">\u09b9\u09cb\u09ae<\/span>\r\n <\/button>\r\n <button onclick=\"switchTab('gallery')\" class=\"mobile-tab flex flex-col items-center gap-1 text-[10px] min-w-[4rem]\" id=\"m-tab-gallery\">\r\n <span class=\"text-xl\">\ud83d\uddbc\ufe0f\ud83d\udcc2<\/span> <span data-translate=\"gallery_m\">\u0997\u09cd\u09af\u09be\u09b2\u09be\u09b0\u09bf<\/span>\r\n <\/button>\r\n <button onclick=\"switchTab('admission')\" class=\"mobile-tab flex flex-col items-center gap-1 text-[10px] min-w-[4rem]\" id=\"m-tab-admission\">\r\n <span class=\"text-xl\">\ud83d\udcdd\ud83d\udcf2<\/span> <span data-translate=\"admission\">\u09ad\u09b0\u09cd\u09a4\u09bf<\/span>\r\n <\/button>\r\n <button onclick=\"switchTab('fees')\" class=\"mobile-tab flex flex-col items-center gap-1 text-[10px] min-w-[4rem]\" id=\"m-tab-fees\">\r\n <span class=\"text-xl\">\ud83d\udcb3<\/span> <span data-translate=\"fees\">\u09ac\u09c7\u09a4\u09a8<\/span>\r\n <\/button>\r\n <button onclick=\"switchTab('donation')\" class=\"mobile-tab flex flex-col items-center gap-1 text-[10px] min-w-[4rem]\" id=\"m-tab-donation\">\r\n <span class=\"text-xl\">\ud83d\udce6\ud83e\ude99<\/span> <span data-translate=\"donate\">\u09a6\u09be\u09a8<\/span>\r\n <\/button>\r\n <button onclick=\"switchTab('tasbeeh')\" class=\"mobile-tab flex flex-col items-center gap-1 text-[10px] min-w-[4rem]\" id=\"m-tab-tasbeeh\">\r\n <span class=\"text-xl\">\ud83d\udcff<\/span> <span data-translate=\"tasbeeh\">\u09a4\u09be\u09b8\u09ac\u09c0\u09b9<\/span>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/nav>\r\n\r\n <!-- ========================================== Main Content Grid ========================================== -->\r\n <main class=\"flex-grow max-w-7xl mx-auto px-4 py-8 w-full\">\r\n\r\n <!-- ================= STREAMING_CHUNK: Home Section ================= -->\r\n <!-- ---------------- PAGE: HOME ---------------- -->\r\n <section id=\"page-home\" class=\"tab-content block\">\r\n <!-- Hero Banner Section -->\r\n <div class=\"relative overflow-hidden bg-emerald-900 text-white py-16 md:py-24 px-6 rounded-3xl shadow-premium mb-10 border border-emerald-500\/20\">\r\n <div class=\"absolute inset-0 opacity-20 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-emerald-400 via-emerald-900 to-black pointer-events-none\"><\/div>\r\n <div class=\"max-w-4xl mx-auto text-center relative z-10 flex flex-col items-center\">\r\n <div class=\"inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-amber-500\/10 border border-amber-400\/30 text-amber-400 text-xs md:text-sm mb-6 animate-bounce font-bold\">\r\n <span>\u2728<\/span> <span data-translate=\"notice\">\u09e8\u09e6\u09e8\u09ec \u09b8\u09be\u09b2\u09c7\u09b0 \u0995\u09bf\u09a4\u09be\u09ac, \u09b9\u09bf\u09ab\u099c, \u09a8\u09be\u099c\u09c7\u09b0\u09be \u0993 \u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u09b6\u09be\u0996\u09be\u09af\u09bc \u09ad\u09b0\u09cd\u09a4\u09bf \u099a\u09b2\u099b\u09c7<\/span>\r\n <\/div>\r\n \r\n <!-- High Contrast Solid Text (Removed background-clip text to fix glow issue) -->\r\n <h2 class=\"text-3xl md:text-5xl font-serif font-black text-white leading-tight mb-6\" data-translate=\"title\">\r\n \u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\r\n <\/h2>\r\n <p class=\"text-xs md:text-lg text-emerald-100 max-w-3xl font-semibold leading-relaxed mb-10\" data-translate=\"subtitle\">\r\n \u0986\u09a7\u09c1\u09a8\u09bf\u0995 \u09aa\u09cd\u09b0\u09af\u09c1\u0995\u09cd\u09a4\u09bf\u09b0 \u09b8\u09ae\u09a8\u09cd\u09ac\u09af\u09bc\u09c7 \u0995\u09c1\u09b0\u0986\u09a8 \u0993 \u09b8\u09c1\u09a8\u09cd\u09a8\u09be\u09b9\u09ad\u09bf\u09a4\u09cd\u09a4\u09bf\u0995 \u0986\u09a6\u09b0\u09cd\u09b6 \u0987\u09b8\u09b2\u09be\u09ae\u09c0 \u09b6\u09bf\u0995\u09cd\u09b7\u09be \u09aa\u09cd\u09b0\u09a4\u09bf\u09b7\u09cd\u09a0\u09be\u09a8 \u098f\u09ac\u0982 \u09ac\u09cd\u09af\u09be\u09aa\u0995 \u09b6\u09be\u0996\u09be \u09a8\u09c7\u099f\u0993\u09af\u09bc\u09be\u09b0\u09cd\u0995\r\n <\/p>\r\n <div class=\"flex flex-wrap justify-center gap-4\">\r\n <button onclick=\"switchTab('admission')\" class=\"bg-amber-500 hover:bg-amber-600 text-emerald-950 font-extrabold text-sm py-3.5 px-8 rounded-2xl shadow-lg transform transition-all hover:-translate-y-1 flex items-center gap-2\">\r\n <span class=\"text-xl\">\ud83d\udcdd\ud83d\udcf2<\/span> \u0985\u09a8\u09b2\u09be\u0987\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf \u0986\u09ac\u09c7\u09a6\u09a8\r\n <\/button>\r\n <button onclick=\"switchTab('fees')\" class=\"bg-emerald-700 hover:bg-emerald-600 text-white font-bold text-sm py-3.5 px-8 rounded-2xl shadow-lg transform transition-all hover:-translate-y-1 border border-emerald-500\/30 flex items-center gap-2\">\r\n <span class=\"text-xl\">\ud83d\udcb3<\/span> \u0985\u09a8\u09b2\u09be\u0987\u09a8\u09c7 \u09ac\u09c7\u09a4\u09a8 \u09a6\u09bf\u09a8\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Picture Grid Showcase -->\r\n <div class=\"grid grid-cols-2 md:grid-cols-4 gap-4 mb-16\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1564121211835-e88c852648ab?auto=format&fit=crop&w=600&q=80\" alt=\"Mosque\" class=\"w-full h-32 md:h-48 object-cover rounded-2xl shadow-md border border-slate-200 dark:border-slate-800 hover:scale-105 transition-transform cursor-pointer\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1609599006353-e629aaab31fc?auto=format&fit=crop&w=600&q=80\" alt=\"Quran\" class=\"w-full h-32 md:h-48 object-cover rounded-2xl shadow-md border border-slate-200 dark:border-slate-800 hover:scale-105 transition-transform cursor-pointer\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1584551246679-0daf3d275d05?auto=format&fit=crop&w=600&q=80\" alt=\"Islamic Art\" class=\"w-full h-32 md:h-48 object-cover rounded-2xl shadow-md border border-slate-200 dark:border-slate-800 hover:scale-105 transition-transform cursor-pointer\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1585036156171-384164a8c675?auto=format&fit=crop&w=600&q=80\" alt=\"Madrasah\" class=\"w-full h-32 md:h-48 object-cover rounded-2xl shadow-md border border-slate-200 dark:border-slate-800 hover:scale-105 transition-transform cursor-pointer\">\r\n <\/div>\r\n\r\n <!-- Prayer Times Widget -->\r\n <div class=\"max-w-6xl mx-auto relative z-20 mb-16\">\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl shadow-premium p-6 border border-emerald-500\/10 grid grid-cols-1 lg:grid-cols-3 gap-6 items-center\">\r\n <div class=\"flex flex-col gap-3 lg:border-r lg:border-slate-100 dark:lg:border-slate-800 lg:pr-6\">\r\n <div class=\"flex items-center gap-3\">\r\n <div class=\"text-3xl\">\ud83d\udd4c<\/div>\r\n <div>\r\n <h3 class=\"font-black text-emerald-800 dark:text-emerald-400 font-serif\" data-translate=\"prayerTimes\">\u09a8\u09be\u09ae\u09be\u099c\u09c7\u09b0 \u09b8\u09ae\u09af\u09bc\u09b8\u09c2\u099a\u09c0<\/h3>\r\n <p class=\"text-xs text-slate-500 dark:text-slate-400 font-bold\" id=\"active-location-display\">\u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <!-- GPS and District Select -->\r\n <div class=\"flex flex-col gap-2 mt-2\">\r\n <div class=\"flex items-center gap-2\">\r\n <select id=\"district-selector\" onchange=\"handleDistrictChange()\" class=\"text-xs border border-slate-200 dark:border-slate-700 rounded-xl px-2.5 py-2 w-full bg-slate-50 dark:bg-slate-800 font-semibold cursor-pointer\">\r\n <option value=\"tangail\">\u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2 (\u09aa\u09cd\u09b0\u09a7\u09be\u09a8)<\/option>\r\n <option value=\"dhaka\">\u09a2\u09be\u0995\u09be (Dhaka)<\/option>\r\n <option value=\"chittagong\">\u099a\u099f\u09cd\u099f\u0997\u09cd\u09b0\u09be\u09ae (Chittagong)<\/option>\r\n <option value=\"sylhet\">\u09b8\u09bf\u09b2\u09c7\u099f (Sylhet)<\/option>\r\n <option value=\"rajshahi\">\u09b0\u09be\u099c\u09b6\u09be\u09b9\u09c0 (Rajshahi)<\/option>\r\n <\/select>\r\n <button onclick=\"detectMyLocation()\" id=\"detect-location-btn\" class=\"bg-emerald-700 hover:bg-emerald-600 text-white p-2.5 rounded-xl text-xs font-bold shrink-0 transition-colors flex items-center gap-1\">\r\n \ud83d\udccd \u0986\u09ae\u09be\u09b0 \u0985\u09ac\u09b8\u09cd\u09a5\u09be\u09a8\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 5 Prayer Times Display -->\r\n <div class=\"grid grid-cols-5 gap-2 text-center\">\r\n <div id=\"p-fajr\" class=\"p-3 rounded-2xl bg-slate-50 dark:bg-slate-800\/50 transition-colors\">\r\n <span class=\"block text-[10px] text-slate-500 dark:text-slate-400 font-bold\" data-translate=\"fajr\">\u09ab\u099c\u09b0<\/span>\r\n <span class=\"font-extrabold text-xs md:text-sm text-emerald-800 dark:text-emerald-400 font-mono mt-1 block\" id=\"time-fajr\">--:-- --<\/span>\r\n <\/div>\r\n <div id=\"p-dhuhr\" class=\"p-3 rounded-2xl bg-slate-50 dark:bg-slate-800\/50 transition-colors\">\r\n <span class=\"block text-[10px] text-slate-500 dark:text-slate-400 font-bold\" data-translate=\"dhuhr\">\u09af\u09cb\u09b9\u09b0<\/span>\r\n <span class=\"font-extrabold text-xs md:text-sm text-emerald-800 dark:text-emerald-400 font-mono mt-1 block\" id=\"time-dhuhr\">--:-- --<\/span>\r\n <\/div>\r\n <div id=\"p-asr\" class=\"p-3 rounded-2xl bg-slate-50 dark:bg-slate-800\/50 transition-colors\">\r\n <span class=\"block text-[10px] text-slate-500 dark:text-slate-400 font-bold\" data-translate=\"asr\">\u0986\u09b8\u09b0<\/span>\r\n <span class=\"font-extrabold text-xs md:text-sm text-emerald-800 dark:text-emerald-400 font-mono mt-1 block\" id=\"time-asr\">--:-- --<\/span>\r\n <\/div>\r\n <div id=\"p-maghrib\" class=\"p-3 rounded-2xl bg-slate-50 dark:bg-slate-800\/50 transition-colors\">\r\n <span class=\"block text-[10px] text-slate-500 dark:text-slate-400 font-bold\" data-translate=\"maghrib\">\u09ae\u09be\u0997\u09b0\u09bf\u09ac<\/span>\r\n <span class=\"font-extrabold text-xs md:text-sm text-emerald-800 dark:text-emerald-400 font-mono mt-1 block\" id=\"time-maghrib\">--:-- --<\/span>\r\n <\/div>\r\n <div id=\"p-isha\" class=\"p-3 rounded-2xl bg-slate-50 dark:bg-slate-800\/50 transition-colors\">\r\n <span class=\"block text-[10px] text-slate-500 dark:text-slate-400 font-bold\" data-translate=\"isha\">\u098f\u09b6\u09be<\/span>\r\n <span class=\"font-extrabold text-xs md:text-sm text-emerald-800 dark:text-emerald-400 font-mono mt-1 block\" id=\"time-isha\">--:-- --<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Countdown Module -->\r\n <div class=\"bg-gradient-to-r from-amber-500\/10 to-emerald-500\/10 p-4 rounded-2xl border border-amber-500\/20 text-center\">\r\n <span class=\"text-xs font-bold text-slate-600 dark:text-slate-300 block\" id=\"next-prayer-title\">\u09aa\u09b0\u09ac\u09b0\u09cd\u09a4\u09c0 \u09a8\u09be\u09ae\u09be\u099c: \u0986\u09b8\u09b0<\/span>\r\n <span class=\"text-xs md:text-sm font-black text-emerald-700 dark:text-amber-400 block mt-1 tracking-wide\" id=\"prayer-countdown-timer\">\u09b9\u09bf\u09b8\u09be\u09ac \u0995\u09b0\u09be \u09b9\u099a\u09cd\u099b\u09c7...<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- ================= STREAMING_CHUNK: Branches Info ================= -->\r\n <div class=\"mb-16\">\r\n <div class=\"text-center mb-12\">\r\n <span class=\"text-emerald-700 dark:text-amber-400 font-extrabold tracking-wider text-xs uppercase bg-emerald-100 dark:bg-slate-800 px-3 py-1.5 rounded-full\" data-translate=\"our_branches_label\">\u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be \u09b6\u09be\u0996\u09be \u09b8\u09ae\u09c2\u09b9<\/span>\r\n <h3 class=\"text-2xl md:text-4xl font-serif font-black text-emerald-800 dark:text-emerald-400 mt-3\" data-translate=\"our_branches_title\">\u0986\u09ae\u09be\u09a6\u09c7\u09b0 \u09e9\u099f\u09bf \u09b8\u09cd\u09ac\u09a4\u09a8\u09cd\u09a4\u09cd\u09b0 \u09a6\u09cd\u09ac\u09c0\u09a8\u09bf \u09b6\u09bf\u0995\u09cd\u09b7\u09be \u09aa\u09cd\u09b0\u09a4\u09bf\u09b7\u09cd\u09a0\u09be\u09a8<\/h3>\r\n <\/div>\r\n \r\n <div class=\"grid grid-cols-1 lg:grid-cols-3 gap-8\">\r\n <!-- Branch 1 (Main) -->\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 shadow-premium border border-slate-100 dark:border-slate-800\/50 hover:shadow-2xl transition-all transform hover:-translate-y-1.5 flex flex-col justify-between\">\r\n <div>\r\n <div class=\"flex justify-between items-start mb-4\">\r\n <span class=\"text-4xl\">\ud83d\udd4c<\/span>\r\n <span class=\"bg-amber-500\/10 text-amber-600 dark:text-amber-400 font-bold text-[10px] md:text-xs px-3 py-1 rounded-full border border-amber-500\/20\" data-translate=\"main_campus_badge\">\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u0995\u09cd\u09af\u09be\u09ae\u09cd\u09aa\u09be\u09b8<\/span>\r\n <\/div>\r\n <h4 class=\"font-serif font-black text-lg text-emerald-800 dark:text-emerald-400 mb-2 leading-snug\" data-translate=\"branch_main_title\">\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be (\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be)<\/h4>\r\n <p class=\"text-slate-500 dark:text-slate-400 text-xs mb-4 flex items-start gap-1\">\ud83d\udccd \u09b8\u09bf\u0995\u09a6\u09be\u09b0 \u09aa\u09be\u09a1\u09bc\u09be, \u09e9\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\u0964<\/p>\r\n <span class=\"bg-emerald-50 dark:bg-slate-800 text-emerald-800 dark:text-emerald-300 text-xs font-bold px-2.5 py-1 rounded-md block mb-4 w-fit\" data-translate=\"branch_main_sub\">\u09ac\u09be\u09b2\u0995 \u09b6\u09be\u0996\u09be (\u0986\u09ac\u09be\u09b8\u09bf\u0995)<\/span>\r\n <\/div>\r\n <div class=\"border-t border-slate-100 dark:border-slate-800\/80 pt-4 mt-6 flex flex-col gap-2.5\">\r\n <div class=\"text-[11px] text-slate-500 flex flex-col gap-1.5\">\r\n <span class=\"font-bold text-slate-400 border-b border-slate-100 dark:border-slate-800 pb-1\">\u09af\u09cb\u0997\u09be\u09af\u09cb\u0997 (\u0985\u09ab\u09bf\u09b8 \u0993 \u09ae\u09c1\u09b9\u09a4\u09be\u09ae\u09bf\u09ae):<\/span>\r\n <div class=\"grid grid-cols-2 gap-2 mt-1\">\r\n <a href=\"tel:+8801920183767\" class=\"flex flex-col text-emerald-700 dark:text-emerald-400 hover:underline font-bold text-xs bg-slate-50 dark:bg-slate-800 p-2 rounded-lg\">\r\n <span class=\"text-[9px] text-slate-400 mb-0.5\">\u09ae\u09c1\u09b9\u09a4\u09be\u09ae\u09bf\u09ae \u09b8\u09be\u09b9\u09c7\u09ac<\/span>\ud83d\udcde \u09e6\u09e7\u09e7\u09ef\u09e8\u09e6-\u09e7\u09ee\u09e9\u09ed\u09ec\u09ed\r\n <\/a>\r\n <a href=\"tel:+8801714276393\" class=\"flex flex-col text-emerald-700 dark:text-emerald-400 hover:underline font-bold text-xs bg-slate-50 dark:bg-slate-800 p-2 rounded-lg\">\r\n <span class=\"text-[9px] text-slate-400 mb-0.5\">\u0985\u09ab\u09bf\u09b8<\/span>\ud83d\udcde \u09e6\u09e7\u09ed\u09e7\u09ea-\u09e8\u09ed\u09ec\u09e9\u09ef\u09e9\r\n <\/a>\r\n <a href=\"tel:+8801886989881\" class=\"flex items-center gap-1 text-slate-600 dark:text-slate-300 hover:text-emerald-600 font-bold text-[10px]\">\u0995\u09bf\u09a4\u09be\u09ac: \u09e6\u09e7\u09ee\u09ee\u09ec-\u09ef\u09ee\u09ef\u09ee\u09ee\u09e7<\/a>\r\n <a href=\"tel:+8801886989883\" class=\"flex items-center gap-1 text-slate-600 dark:text-slate-300 hover:text-emerald-600 font-bold text-[10px]\">\u09b9\u09bf\u09ab\u099c: \u09e6\u09e7\u09ee\u09ee\u09ec-\u09ef\u09ee\u09ef\u09ee\u09ee\u09e9<\/a>\r\n <a href=\"tel:+8801748535515\" class=\"flex items-center gap-1 text-slate-600 dark:text-slate-300 hover:text-emerald-600 font-bold text-[10px]\">\u09a8\u09be\u099c\u09c7\u09b0\u09be: \u09e6\u09e7\u09ed\u09ea\u09ee-\u09eb\u09e9\u09eb\u09eb\u09e7\u09eb<\/a>\r\n <a href=\"tel:+8801624301011\" class=\"flex items-center gap-1 text-slate-600 dark:text-slate-300 hover:text-emerald-600 font-bold text-[10px]\">\u09a8\u09c2\u09b0\u09be\u09a8\u09c0: \u09e6\u09e7\u09ec\u09e8\u09ea-\u09e9\u09e6\u09e7\u09e6\u09e7\u09e7<\/a>\r\n <\/div>\r\n <\/div>\r\n <div class=\"flex items-center justify-between mt-2 pt-2 border-t border-slate-100 dark:border-slate-800\/80\">\r\n <button onclick=\"openBranchDetails('main')\" class=\"bg-emerald-100 dark:bg-slate-800 text-emerald-700 dark:text-emerald-400 hover:bg-emerald-200 font-bold text-[11px] px-3.5 py-2 rounded-xl transition-all\">\u09ac\u09bf\u09b8\u09cd\u09a4\u09be\u09b0\u09bf\u09a4 \u09a6\u09c7\u0996\u09c1\u09a8<\/button>\r\n <button onclick=\"selectBranchAndRegister('main')\" class=\"bg-emerald-700 hover:bg-emerald-600 text-white font-bold text-[11px] px-3.5 py-2 rounded-xl transition-all\" data-translate=\"register_now_btn\">\u09ad\u09b0\u09cd\u09a4\u09bf \u09ab\u09b0\u09ae \u2794<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <!-- Branch 2 (Kachabazar) -->\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 shadow-premium border border-slate-100 dark:border-slate-800\/50 hover:shadow-2xl transition-all transform hover:-translate-y-1.5 flex flex-col justify-between\">\r\n <div>\r\n <div class=\"flex justify-between items-start mb-4\">\r\n <span class=\"text-4xl\">\ud83d\udcd6<\/span>\r\n <span class=\"bg-emerald-500\/10 text-emerald-600 dark:text-emerald-400 font-bold text-[10px] md:text-xs px-3 py-1 rounded-full border border-emerald-500\/20\" data-translate=\"new_branch_badge\">\u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be<\/span>\r\n <\/div>\r\n <h4 class=\"font-serif font-black text-lg text-emerald-800 dark:text-emerald-400 mb-2 leading-snug\" data-translate=\"branch_kb_title\">\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be (\u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be)<\/h4>\r\n <p class=\"text-slate-500 dark:text-slate-400 text-xs mb-4 flex items-start gap-1\">\ud83d\udccd \u09ae\u09be\u0987\u09a8\u0989\u09a6\u09cd\u09a6\u09bf\u09a8 \u0986\u09ac\u09be\u09b8\u09bf\u0995 \u098f\u09b2\u09be\u0995\u09be, \u09eb\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\u0964<\/p>\r\n <span class=\"bg-emerald-50 dark:bg-slate-800 text-emerald-800 dark:text-emerald-300 text-xs font-bold px-2.5 py-1 rounded-md block mb-4 w-fit\" data-translate=\"branch_kb_sub\">\u09ac\u09be\u09b2\u0995 \u09b6\u09be\u0996\u09be (\u0986\u09ac\u09be\u09b8\u09bf\u0995\/\u0985\u09a8\u09be\u09ac\u09be\u09b8\u09bf\u0995)<\/span>\r\n <\/div>\r\n <div class=\"border-t border-slate-100 dark:border-slate-800\/80 pt-4 mt-6 flex flex-col gap-2.5\">\r\n <div class=\"text-[11px] text-slate-500 flex flex-col gap-1.5\">\r\n <span class=\"font-bold text-slate-400 border-b border-slate-100 dark:border-slate-800 pb-1\">\u0985\u09ab\u09bf\u09b8\u09bf\u09df\u09be\u09b2 \u09af\u09cb\u0997\u09be\u09af\u09cb\u0997:<\/span>\r\n <a href=\"tel:+8801886989884\" class=\"flex flex-col text-emerald-700 dark:text-emerald-400 hover:underline font-bold text-xs bg-slate-50 dark:bg-slate-800 p-2.5 rounded-lg mt-1 w-full text-center border border-emerald-500\/10\">\r\n <span class=\"text-[10px] text-slate-400 mb-0.5\">\u09b6\u09be\u0996\u09be \u09aa\u09b0\u09bf\u099a\u09be\u09b2\u0995<\/span>\ud83d\udcde \u09e6\u09e7\u09ee\u09ee\u09ec-\u09ef\u09ee\u09ef\u09ee\u09ee\u09ea\r\n <\/a>\r\n <\/div>\r\n <div class=\"flex items-center justify-between mt-2 pt-2 border-t border-slate-100 dark:border-slate-800\/80\">\r\n <button onclick=\"openBranchDetails('kachabazar')\" class=\"bg-emerald-100 dark:bg-slate-800 text-emerald-700 dark:text-emerald-400 hover:bg-emerald-200 font-bold text-[11px] px-3.5 py-2 rounded-xl transition-all\">\u09ac\u09bf\u09b8\u09cd\u09a4\u09be\u09b0\u09bf\u09a4 \u09a6\u09c7\u0996\u09c1\u09a8<\/button>\r\n <button onclick=\"selectBranchAndRegister('kachabazar')\" class=\"bg-emerald-700 hover:bg-emerald-600 text-white font-bold text-[11px] px-3.5 py-2 rounded-xl transition-all\" data-translate=\"register_now_btn\">\u09ad\u09b0\u09cd\u09a4\u09bf \u09ab\u09b0\u09ae \u2794<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Branch 3 (Female) -->\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 shadow-premium border border-slate-100 dark:border-slate-800\/50 hover:shadow-2xl transition-all transform hover:-translate-y-1.5 flex flex-col justify-between\">\r\n <div>\r\n <div class=\"flex justify-between items-start mb-4\">\r\n <span class=\"text-4xl\">\ud83c\udf38<\/span>\r\n <span class=\"bg-rose-500\/10 text-rose-600 dark:text-rose-400 font-bold text-[10px] md:text-xs px-3 py-1 rounded-full border border-rose-500\/20\" data-translate=\"female_branch_badge\">\u09ae\u09b9\u09bf\u09b2\u09be \u09b6\u09be\u0996\u09be<\/span>\r\n <\/div>\r\n <h4 class=\"font-serif font-black text-lg text-emerald-800 dark:text-emerald-400 mb-2 leading-snug\" data-translate=\"branch_female_title\">\u0986\u099b\u09bf\u09af\u09bc\u09be \u0987\u0989\u09b8\u09c1\u09ab \u09ae\u09b9\u09bf\u09b2\u09be \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be<\/h4>\r\n <p class=\"text-slate-500 dark:text-slate-400 text-xs mb-4 flex items-start gap-1\">\ud83d\udccd \u0986\u09ac\u09c1 \u0987\u0989\u09b8\u09c1\u09ab \u09b0\u09cb\u09a1, \u09e9\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\u0964<\/p>\r\n <span class=\"bg-emerald-50 dark:bg-slate-800 text-emerald-800 dark:text-emerald-300 text-xs font-bold px-2.5 py-1 rounded-md block mb-4 w-fit\" data-translate=\"branch_female_sub\">\u09b8\u09cd\u09ac\u09a4\u09a8\u09cd\u09a4\u09cd\u09b0 \u09ac\u09be\u09b2\u09bf\u0995\u09be \u09b6\u09be\u0996\u09be (\u0986\u09ac\u09be\u09b8\u09bf\u0995 \u0993 \u0985\u09a8\u09be\u09ac\u09be\u09b8\u09bf\u0995)<\/span>\r\n <\/div>\r\n <div class=\"border-t border-slate-100 dark:border-slate-800\/80 pt-4 mt-6 flex flex-col gap-2.5\">\r\n <div class=\"text-[11px] text-slate-500 flex flex-col gap-1.5\">\r\n <span class=\"font-bold text-slate-400 border-b border-slate-100 dark:border-slate-800 pb-1\">\u0985\u09ab\u09bf\u09b8\u09bf\u09df\u09be\u09b2 \u09af\u09cb\u0997\u09be\u09af\u09cb\u0997:<\/span>\r\n <div class=\"grid grid-cols-2 gap-2 mt-1\">\r\n <a href=\"tel:+8801886989880\" class=\"flex flex-col text-emerald-700 dark:text-emerald-400 hover:underline font-bold text-xs bg-slate-50 dark:bg-slate-800 p-2 rounded-lg border border-emerald-500\/10\">\r\n <span class=\"text-[9px] text-slate-400 mb-0.5\">\u09ae\u09b9\u09bf\u09b2\u09be \u09b6\u09be\u0996\u09be \u0985\u09ab\u09bf\u09b8<\/span>\ud83d\udcde \u09e6\u09e7\u09ee\u09ee\u09ec-\u09ef\u09ee\u09ef\u09ee\u09ee\u09e6\r\n <\/a>\r\n <a href=\"tel:+8801751504140\" class=\"flex flex-col text-emerald-700 dark:text-emerald-400 hover:underline font-bold text-xs bg-slate-50 dark:bg-slate-800 p-2 rounded-lg border border-emerald-500\/10\">\r\n <span class=\"text-[9px] text-slate-400 mb-0.5\">\u09ae\u09b9\u09bf\u09b2\u09be \u09b9\u09bf\u09ab\u099c \u09ac\u09bf\u09ad\u09be\u0997<\/span>\ud83d\udcde \u09e6\u09e7\u09ed\u09eb\u09e7-\u09eb\u09e6\u09ea\u09e7\u09ea\u09e6\r\n <\/a>\r\n <\/div>\r\n <span class=\"text-rose-500 text-[10px] font-extrabold text-center mt-1\">(\u09b6\u09c1\u09a7\u09c1\u09ae\u09be\u09a4\u09cd\u09b0 \u09ae\u09b9\u09bf\u09b2\u09be\u09a6\u09c7\u09b0 \u0995\u09a5\u09be \u09ac\u09b2\u09be\u09b0 \u099c\u09a8\u09cd\u09af)<\/span>\r\n <\/div>\r\n <div class=\"flex items-center justify-between mt-2 pt-2 border-t border-slate-100 dark:border-slate-800\/80\">\r\n <button onclick=\"openBranchDetails('asiya_yusuf')\" class=\"bg-emerald-100 dark:bg-slate-800 text-emerald-700 dark:text-emerald-400 hover:bg-emerald-200 font-bold text-[11px] px-3.5 py-2 rounded-xl transition-all\">\u09ac\u09bf\u09b8\u09cd\u09a4\u09be\u09b0\u09bf\u09a4 \u09a6\u09c7\u0996\u09c1\u09a8<\/button>\r\n <button onclick=\"selectBranchAndRegister('asiya_yusuf')\" class=\"bg-emerald-700 hover:bg-emerald-600 text-white font-bold text-[11px] px-3.5 py-2 rounded-xl transition-all\" data-translate=\"register_now_btn\">\u09ad\u09b0\u09cd\u09a4\u09bf \u09ab\u09b0\u09ae \u2794<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Quotes Slideshow -->\r\n <div class=\"max-w-4xl mx-auto text-center mb-6\">\r\n <div class=\"bg-gradient-to-br from-amber-50 to-emerald-50 dark:from-slate-900 dark:to-slate-900 p-8 rounded-3xl border border-amber-200\/40 dark:border-emerald-900\/20 shadow-inner\">\r\n <span class=\"text-4xl text-emerald-600 block mb-3\">\ud83d\udcd6<\/span>\r\n <p id=\"quote-text\" class=\"text-base md:text-xl italic font-serif text-slate-800 dark:text-slate-200 font-semibold mb-4 transition-opacity duration-500\">\r\n \"\u09a4\u09cb\u09ae\u09be\u09a6\u09c7\u09b0 \u09ae\u09a7\u09cd\u09af\u09c7 \u09b8\u09b0\u09cd\u09ac\u09cb\u09a4\u09cd\u09a4\u09ae \u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf \u09b8\u09c7\u0987, \u09af\u09c7 \u09a8\u09bf\u099c\u09c7 \u0995\u09c1\u09b0\u0986\u09a8 \u09b6\u09bf\u0996\u09c7 \u098f\u09ac\u0982 \u0985\u09aa\u09b0\u0995\u09c7 \u09b6\u09bf\u0995\u09cd\u09b7\u09be \u09a6\u09c7\u09af\u09bc\u0964\"\r\n <\/p>\r\n <span id=\"quote-source\" class=\"text-xs uppercase tracking-widest font-extrabold text-emerald-700 dark:text-emerald-500\">\r\n \u2014 \u09b8\u09b9\u09c0\u09b9 \u09ac\u09c1\u0996\u09be\u09b0\u09c0\r\n <\/span>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ================= STREAMING_CHUNK: Branch Details Section ================= -->\r\n <!-- ---------------- PAGE: BRANCH DETAILS ---------------- -->\r\n <section id=\"page-branch-details\" class=\"tab-content hidden animate-[fadeIn_0.4s_ease-in-out]\">\r\n <div class=\"max-w-6xl mx-auto px-4\">\r\n <button onclick=\"switchTab('home')\" class=\"mb-5 bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 px-4 py-2 rounded-xl text-emerald-700 dark:text-emerald-400 font-bold text-sm shadow-sm hover:bg-emerald-50 transition-colors flex items-center gap-2\">\r\n <span>\u2b05<\/span> \u09ae\u09c2\u09b2 \u09aa\u09c7\u099c\u09c7 \u09ab\u09bf\u09b0\u09c7 \u09af\u09be\u09a8\r\n <\/button>\r\n \r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 md:p-10 shadow-premium border border-slate-100 dark:border-slate-800\/80\">\r\n <div class=\"text-center mb-8 border-b border-slate-100 dark:border-slate-800 pb-8\">\r\n <span class=\"text-4xl block mb-3\">\ud83c\udfeb<\/span>\r\n <h2 id=\"bd-title\" class=\"text-2xl md:text-4xl font-serif font-black text-emerald-800 dark:text-emerald-400\">\u09b6\u09be\u0996\u09be\u09b0 \u09a8\u09be\u09ae<\/h2>\r\n <p id=\"bd-address\" class=\"text-slate-500 font-bold mt-2 text-sm\">\u09a0\u09bf\u0995\u09be\u09a8\u09be<\/p>\r\n <\/div>\r\n\r\n <!-- Sub Tabs -->\r\n <div class=\"flex flex-wrap justify-center gap-3 mb-8\">\r\n <button id=\"bd-btn-activities\" onclick=\"switchBranchSubTab('activities')\" class=\"px-6 py-2.5 rounded-full text-xs md:text-sm font-bold transition-all shadow-sm\">\u0995\u09be\u09b0\u09cd\u09af\u0995\u09cd\u09b0\u09ae \u0993 \u09ac\u09c8\u09b6\u09bf\u09b7\u09cd\u099f\u09cd\u09af<\/button>\r\n <button id=\"bd-btn-students\" onclick=\"switchBranchSubTab('students')\" class=\"px-6 py-2.5 rounded-full text-xs md:text-sm font-bold transition-all shadow-sm\">\u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09b0\u09cd\u09a5\u09c0 \u09a4\u09be\u09b2\u09bf\u0995\u09be<\/button>\r\n <button id=\"bd-btn-gallery\" onclick=\"switchBranchSubTab('gallery')\" class=\"px-6 py-2.5 rounded-full text-xs md:text-sm font-bold transition-all shadow-sm\">\u098f\u0995\u09be\u09a1\u09c7\u09ae\u09bf\u0995 \u0997\u09cd\u09af\u09be\u09b2\u09be\u09b0\u09bf<\/button>\r\n <\/div>\r\n\r\n <!-- Sub Content: Activities -->\r\n <div id=\"bd-tab-activities\">\r\n <h3 class=\"font-bold text-lg text-emerald-800 dark:text-emerald-400 mb-4 px-2\">\u098f\u0987 \u09b6\u09be\u0996\u09be\u09b0 \u09ac\u09bf\u09b6\u09c7\u09b7 \u09ac\u09c8\u09b6\u09bf\u09b7\u09cd\u099f\u09cd\u09af\u09b8\u09ae\u09c2\u09b9:<\/h3>\r\n <div class=\"bg-emerald-50 dark:bg-slate-800\/50 p-6 rounded-2xl border border-emerald-500\/20\">\r\n <ul id=\"bd-activities-list\" class=\"space-y-4 text-sm font-semibold text-slate-700 dark:text-slate-200\">\r\n <!-- Populated via JS -->\r\n <\/ul>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Sub Content: Students -->\r\n <div id=\"bd-tab-students\" class=\"hidden\">\r\n <div class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center mb-6 px-2 gap-4\">\r\n <h3 class=\"font-bold text-lg text-emerald-800 dark:text-emerald-400\">\u0985\u09a7\u09cd\u09af\u09af\u09bc\u09a8\u09b0\u09a4 \u099b\u09be\u09a4\u09cd\u09b0-\u099b\u09be\u09a4\u09cd\u09b0\u09c0\u09a6\u09c7\u09b0 \u09a4\u09be\u09b2\u09bf\u0995\u09be (\u09a1\u09c7\u09ae\u09cb)<\/h3>\r\n <input type=\"text\" placeholder=\"\ud83d\udd0d \u09a8\u09be\u09ae \u09ac\u09be \u09b0\u09cb\u09b2 \u0996\u09c1\u0981\u099c\u09c1\u09a8...\" class=\"border border-slate-200 dark:border-slate-700 px-4 py-2 rounded-xl text-xs bg-slate-50 dark:bg-slate-950 font-bold w-full sm:w-64\">\r\n <\/div>\r\n <div id=\"bd-student-list\" class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4\">\r\n <!-- Populated via JS -->\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Sub Content: Gallery -->\r\n <div id=\"bd-tab-gallery\" class=\"hidden\">\r\n <h3 class=\"font-bold text-lg text-emerald-800 dark:text-emerald-400 mb-6 px-2\">\u0995\u09cd\u09b2\u09be\u09b8 \u0993 \u09aa\u09b0\u09bf\u09ac\u09c7\u09b6\u09c7\u09b0 \u0997\u09cd\u09af\u09be\u09b2\u09be\u09b0\u09bf<\/h3>\r\n <div id=\"bd-gallery-grid\" class=\"grid grid-cols-2 md:grid-cols-3 gap-4\">\r\n <!-- Populated via JS -->\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ================= STREAMING_CHUNK: Online Fee Payment ================= -->\r\n <!-- ---------------- PAGE: FEES ---------------- -->\r\n <section id=\"page-fees\" class=\"tab-content hidden\">\r\n <div class=\"max-w-5xl mx-auto\">\r\n <div class=\"text-center mb-10\">\r\n <span class=\"text-5xl\">\ud83d\udcb3<\/span>\r\n <h2 class=\"text-2xl md:text-4xl font-serif font-black text-emerald-800 dark:text-emerald-400 mt-3\" data-translate=\"fees_title\">\u0985\u09a8\u09b2\u09be\u0987\u09a8\u09c7 \u09ae\u09be\u09b8\u09bf\u0995 \u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7<\/h2>\r\n <p class=\"text-slate-500 dark:text-slate-400 mt-2 text-sm font-semibold\" data-translate=\"fees_sub\">\u099b\u09be\u09a4\u09cd\u09b0-\u099b\u09be\u09a4\u09cd\u09b0\u09c0\u09a6\u09c7\u09b0 \u09ae\u09be\u09b8\u09bf\u0995 \u09ac\u09c7\u09a4\u09a8, \u0986\u09ac\u09be\u09b8\u09bf\u0995 \u09ab\u09bf \u098f\u09ac\u0982 \u0985\u09a8\u09cd\u09af\u09be\u09a8\u09cd\u09af \u09ac\u0995\u09c7\u09df\u09be \u098f\u0996\u09a8 \u0998\u09b0\u09c7 \u09ac\u09b8\u09c7\u0987 \u09ac\u09bf\u0995\u09be\u09b6 \u09ac\u09be \u09a8\u0997\u09a6\u09c7\u09b0 \u09ae\u09be\u09a7\u09cd\u09af\u09ae\u09c7 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7 \u0995\u09b0\u09c1\u09a8\u0964<\/p>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-8\">\r\n <!-- Fees Structure Table -->\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 shadow-premium border border-slate-100 dark:border-slate-800\/80\">\r\n <h3 class=\"font-bold text-lg text-emerald-800 dark:text-emerald-400 border-b border-slate-100 dark:border-slate-800\/80 pb-3 mb-4\" data-translate=\"fees_chart\">\u09ae\u09be\u09b8\u09bf\u0995 \u09ac\u09c7\u09a4\u09a8\u09c7\u09b0 \u09a4\u09be\u09b2\u09bf\u0995\u09be (\u09a4\u09a5\u09cd\u09af\u09b8\u09c2\u09a4\u09cd\u09b0)<\/h3>\r\n \r\n <div class=\"space-y-3\">\r\n <div class=\"flex justify-between items-center bg-slate-50 dark:bg-slate-800 p-3.5 rounded-xl border border-slate-100 dark:border-slate-700\">\r\n <div>\r\n <strong class=\"text-sm text-slate-800 dark:text-slate-200 block\">\u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u0993 \u09a8\u09be\u099c\u09c7\u09b0\u09be \u09ac\u09bf\u09ad\u09be\u0997<\/strong>\r\n <span class=\"text-[10px] text-slate-500 dark:text-slate-400 font-bold\">\u0985\u09a8\u09be\u09ac\u09be\u09b8\u09bf\u0995 (Day Scholar)<\/span>\r\n <\/div>\r\n <span class=\"font-mono font-bold text-emerald-600 dark:text-emerald-400 bg-emerald-100 dark:bg-emerald-900\/40 px-3 py-1 rounded-lg\">\u09f3 \u09eb\u09e6\u09e6 - \u09ed\u09e6\u09e6<\/span>\r\n <\/div>\r\n <div class=\"flex justify-between items-center bg-slate-50 dark:bg-slate-800 p-3.5 rounded-xl border border-slate-100 dark:border-slate-700\">\r\n <div>\r\n <strong class=\"text-sm text-slate-800 dark:text-slate-200 block\">\u09b9\u09bf\u09ab\u099c\u09c1\u09b2 \u0995\u09c1\u09b0\u0986\u09a8 \u09ac\u09bf\u09ad\u09be\u0997<\/strong>\r\n <span class=\"text-[10px] text-slate-500 dark:text-slate-400 font-bold\">\u0986\u09ac\u09be\u09b8\u09bf\u0995 \u0993 \u0985\u09a8\u09be\u09ac\u09be\u09b8\u09bf\u0995<\/span>\r\n <\/div>\r\n <span class=\"font-mono font-bold text-emerald-600 dark:text-emerald-400 bg-emerald-100 dark:bg-emerald-900\/40 px-3 py-1 rounded-lg\">\u09f3 \u09ee\u09e6\u09e6 - \u09e7\u09e6\u09e6\u09e6<\/span>\r\n <\/div>\r\n <div class=\"flex justify-between items-center bg-slate-50 dark:bg-slate-800 p-3.5 rounded-xl border border-slate-100 dark:border-slate-700\">\r\n <div>\r\n <strong class=\"text-sm text-slate-800 dark:text-slate-200 block\">\u0995\u09bf\u09a4\u09be\u09ac \u09ac\u09bf\u09ad\u09be\u0997<\/strong>\r\n <span class=\"text-[10px] text-slate-500 dark:text-slate-400 font-bold\">\u09b8\u0995\u09b2 \u099c\u09be\u09ae\u09be\u09a4<\/span>\r\n <\/div>\r\n <span class=\"font-mono font-bold text-emerald-600 dark:text-emerald-400 bg-emerald-100 dark:bg-emerald-900\/40 px-3 py-1 rounded-lg\">\u09f3 \u09e7\u09e6\u09e6\u09e6+<\/span>\r\n <\/div>\r\n <div class=\"flex justify-between items-center bg-amber-50 dark:bg-amber-900\/20 p-3.5 rounded-xl border border-amber-200 dark:border-amber-700\">\r\n <div>\r\n <strong class=\"text-sm text-slate-800 dark:text-slate-200 block\">\u09ac\u09cb\u09b0\u09cd\u09a1\u09bf\u0982 \u09ab\u09bf (\u0986\u09ac\u09be\u09b8\u09bf\u0995 \u099b\u09be\u09a4\u09cd\u09b0\u09a6\u09c7\u09b0 \u099c\u09a8\u09cd\u09af)<\/strong>\r\n <span class=\"text-[10px] text-amber-600 font-bold\">\u0996\u09be\u09ac\u09be\u09b0 \u0993 \u09b2\u099c\u09bf\u0982 \u099a\u09be\u09b0\u09cd\u099c<\/span>\r\n <\/div>\r\n <span class=\"font-mono font-bold text-amber-700 bg-amber-200\/50 px-3 py-1 rounded-lg\">\u09f3 \u09e9\u09e6\u09e6\u09e6 - \u09e9\u09eb\u09e6\u09e6<\/span>\r\n <\/div>\r\n <\/div>\r\n <p class=\"text-[10px] text-rose-500 mt-4 font-bold text-center\">** \u09a6\u09cd\u09b0\u09b7\u09cd\u099f\u09ac\u09cd\u09af: \u098f\u099f\u09bf \u098f\u0995\u099f\u09bf \u0986\u09a8\u09c1\u09ae\u09be\u09a8\u09bf\u0995 \u09a4\u09be\u09b2\u09bf\u0995\u09be\u0964 \u0986\u09aa\u09a8\u09be\u09b0 \u09aa\u09cd\u09b0\u0995\u09c3\u09a4 \u09ac\u09c7\u09a4\u09a8 \u099c\u09be\u09a8\u09a4\u09c7 \u09a1\u09cd\u09af\u09be\u09b6\u09ac\u09cb\u09b0\u09cd\u09a1\u09c7 \u09b2\u0997\u0987\u09a8 \u0995\u09b0\u09c1\u09a8 \u0985\u09a5\u09ac\u09be \u0985\u09ab\u09bf\u09b8\u09c7 \u09af\u09cb\u0997\u09be\u09af\u09cb\u0997 \u0995\u09b0\u09c1\u09a8\u0964<\/p>\r\n <\/div>\r\n\r\n <!-- Online Payment Form -->\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 shadow-premium border border-slate-100 dark:border-slate-800\/80 flex flex-col justify-between\">\r\n <div>\r\n <h3 class=\"font-bold text-lg text-emerald-800 dark:text-emerald-400 border-b border-slate-100 dark:border-slate-800\/80 pb-3\" data-translate=\"pay_form_title\">\u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7 \u09ab\u09b0\u09cd\u09ae<\/h3>\r\n <div class=\"space-y-4 mt-4\">\r\n <div class=\"grid grid-cols-2 gap-3\">\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase\">\u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09b0\u09cd\u09a5\u09c0\u09b0 \u0986\u0987\u09a1\u09bf \/ \u09b0\u09cb\u09b2*<\/label>\r\n <input type=\"text\" id=\"fee-std-id\" required placeholder=\"Ex: 101\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs font-mono font-bold\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase\">\u09af\u09c7 \u09ae\u09be\u09b8\u09c7\u09b0 \u09ac\u09c7\u09a4\u09a8*<\/label>\r\n <select id=\"fee-month\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs font-semibold\">\r\n <option value=\"January\">\u099c\u09be\u09a8\u09c1\u09df\u09be\u09b0\u09bf<\/option>\r\n <option value=\"February\">\u09ab\u09c7\u09ac\u09cd\u09b0\u09c1\u09df\u09be\u09b0\u09bf<\/option>\r\n <option value=\"March\">\u09ae\u09be\u09b0\u09cd\u099a<\/option>\r\n <option value=\"April\">\u098f\u09aa\u09cd\u09b0\u09bf\u09b2<\/option>\r\n <option value=\"May\">\u09ae\u09c7<\/option>\r\n <option value=\"June\">\u099c\u09c1\u09a8<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase\">\u09ac\u09bf\u09ad\u09be\u0997 \/ \u09b6\u09be\u0996\u09be*<\/label>\r\n <select id=\"fee-dept\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs font-semibold\">\r\n <option value=\"main_hifz\">\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be - \u09b9\u09bf\u09ab\u099c\/\u09a8\u09be\u099c\u09c7\u09b0\u09be<\/option>\r\n <option value=\"main_kitab\">\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be - \u0995\u09bf\u09a4\u09be\u09ac \u09ac\u09bf\u09ad\u09be\u0997<\/option>\r\n <option value=\"kb_branch\">\u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be<\/option>\r\n <option value=\"female_branch\">\u09ae\u09b9\u09bf\u09b2\u09be \u09b6\u09be\u0996\u09be<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase\">\u09aa\u09b0\u09bf\u09b6\u09cb\u09a7\u09c7\u09b0 \u09aa\u09b0\u09bf\u09ae\u09be\u09a3 (\u099f\u09be\u0995\u09be)*<\/label>\r\n <input type=\"number\" id=\"fee-amount\" required placeholder=\"ex: 1500\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-sm font-mono font-bold text-emerald-700\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <button onclick=\"simulateFeePayment()\" class=\"w-full bg-gradient-to-r from-emerald-700 to-emerald-600 hover:from-emerald-600 hover:to-emerald-500 text-white font-extrabold py-3.5 rounded-xl transition-all shadow-md mt-6\">\u09aa\u09c7\u09ae\u09c7\u09a8\u09cd\u099f \u0997\u09c7\u099f\u0993\u09df\u09c7\u09a4\u09c7 \u09af\u09be\u09a8 \u2794<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ================= STREAMING_CHUNK: Gallery & Notice ================= -->\r\n <!-- ---------------- PAGE: GALLERY & NOTICES ---------------- -->\r\n <section id=\"page-gallery\" class=\"tab-content hidden\">\r\n <div class=\"max-w-7xl mx-auto px-4\">\r\n <div class=\"grid grid-cols-1 lg:grid-cols-3 gap-8\">\r\n \r\n <!-- Notice Board -->\r\n <div class=\"lg:col-span-2 space-y-6\">\r\n <div class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4\">\r\n <h3 class=\"font-serif font-black text-2xl text-emerald-800 dark:text-emerald-400 flex items-center gap-2\">\r\n <span class=\"text-3xl\">\ud83d\udce2<\/span> <span data-translate=\"notice_board_title\">\u098f\u0995\u09be\u09a1\u09c7\u09ae\u09bf\u0995 \u09a8\u09cb\u099f\u09bf\u09b6 \u09ac\u09cb\u09b0\u09cd\u09a1<\/span>\r\n <\/h3>\r\n <input type=\"text\" id=\"notice-search\" onkeyup=\"filterNotices()\" placeholder=\"\ud83d\udd0d \u09a8\u09cb\u099f\u09bf\u09b6 \u0996\u09c1\u0981\u099c\u09c1\u09a8...\" class=\"border border-slate-200 dark:border-slate-700 px-4 py-2.5 rounded-xl text-xs w-full sm:w-64 bg-white dark:bg-slate-800 font-medium\">\r\n <\/div>\r\n \r\n <div id=\"notice-container\" class=\"space-y-4\">\r\n <!-- Loaded dynamically via JS -->\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Gallery Grid -->\r\n <div class=\"space-y-6\">\r\n <h3 class=\"font-serif font-black text-2xl text-emerald-800 dark:text-emerald-400 flex items-center gap-2\">\r\n <span class=\"text-3xl\">\ud83d\uddbc\ufe0f<\/span> <span data-translate=\"photo_gallery_title\">\u09ab\u099f\u09cb \u0997\u09cd\u09af\u09be\u09b2\u09be\u09b0\u09bf<\/span>\r\n <\/h3>\r\n <div class=\"grid grid-cols-2 gap-4\" id=\"gallery-grid\">\r\n <!-- Loaded dynamically via JS -->\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ================= STREAMING_CHUNK: Admission ================= -->\r\n <!-- ---------------- PAGE: ADMISSION ---------------- -->\r\n <section id=\"page-admission\" class=\"tab-content hidden\">\r\n <div class=\"max-w-3xl mx-auto px-4\">\r\n <div class=\"text-center mb-8\">\r\n <span class=\"text-5xl\">\ud83d\udcdd\ud83d\udcf2<\/span>\r\n <h2 class=\"text-2xl md:text-4xl font-serif font-black text-emerald-800 dark:text-emerald-400 mt-3\" data-translate=\"admission_portal_title\">\u0985\u09a8\u09b2\u09be\u0987\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf \u09ab\u09b0\u09ae (\u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09ac\u09b0\u09cd\u09b7 \u09e8\u09e6\u09e8\u09ec)<\/h2>\r\n <p class=\"text-slate-500 mt-2 text-xs md:text-sm font-semibold\" data-translate=\"admission_portal_sub\">\u09ad\u09b0\u09cd\u09a4\u09bf\u09b0 \u099c\u09a8\u09cd\u09af \u09b8\u09a0\u09bf\u0995 \u0993 \u09a8\u09bf\u09b0\u09cd\u09ad\u09c1\u09b2 \u09a4\u09a5\u09cd\u09af \u09a6\u09bf\u09af\u09bc\u09c7 \u0986\u09ac\u09c7\u09a6\u09a8\u09aa\u09a4\u09cd\u09b0\u099f\u09bf \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8 \u0995\u09b0\u09c1\u09a8\u0964<\/p>\r\n <\/div>\r\n\r\n <!-- Wizard Progress Indicators -->\r\n <div class=\"flex justify-between items-center mb-8 px-2 text-[10px] sm:text-xs md:text-sm font-bold border-b border-slate-200 dark:border-slate-800 pb-5\">\r\n <div id=\"step-ind-1\" class=\"flex flex-col sm:flex-row items-center gap-1.5 text-emerald-600\">\r\n <span class=\"w-6 h-6 rounded-full bg-emerald-600 text-white flex items-center justify-center text-xs shadow-md\">\u09e7<\/span> \r\n <span data-translate=\"step_1\">\u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf\u0997\u09a4 \u09a4\u09a5\u09cd\u09af<\/span>\r\n <\/div>\r\n <div id=\"step-ind-2\" class=\"flex flex-col sm:flex-row items-center gap-1.5 text-slate-400\">\r\n <span class=\"w-6 h-6 rounded-full bg-slate-200 text-slate-600 dark:bg-slate-800 dark:text-slate-400 flex items-center justify-center text-xs\">\u09e8<\/span> \r\n <span data-translate=\"step_2\">\u098f\u0995\u09be\u09a1\u09c7\u09ae\u09bf\u0995 \u09a4\u09a5\u09cd\u09af<\/span>\r\n <\/div>\r\n <div id=\"step-ind-3\" class=\"flex flex-col sm:flex-row items-center gap-1.5 text-slate-400\">\r\n <span class=\"w-6 h-6 rounded-full bg-slate-200 text-slate-600 dark:bg-slate-800 dark:text-slate-400 flex items-center justify-center text-xs\">\u09e9<\/span> \r\n <span data-translate=\"step_3\">\u0985\u09ad\u09bf\u09ad\u09be\u09ac\u0995 \u09a4\u09a5\u09cd\u09af<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Admission Form -->\r\n <form id=\"admission-form\" onsubmit=\"handleAdmissionSubmit(event)\" class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 md:p-8 shadow-premium border border-slate-100 dark:border-slate-800\/80 space-y-6\">\r\n \r\n <!-- Step 1 -->\r\n <div id=\"step-section-1\" class=\"space-y-5 animate-[fadeIn_0.4s_ease-in-out]\">\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_std_name\">\u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09b0\u09cd\u09a5\u09c0\u09b0 \u09aa\u09c1\u09b0\u09cb \u09a8\u09be\u09ae*<\/label>\r\n <input type=\"text\" id=\"std_name\" required class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_birth_date\">\u099c\u09a8\u09cd\u09ae \u09a4\u09be\u09b0\u09bf\u0996*<\/label>\r\n <input type=\"date\" id=\"std_dob\" required class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold\">\r\n <\/div>\r\n <\/div>\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_gender\">\u09b2\u09bf\u0999\u09cd\u0997*<\/label>\r\n <select id=\"std_gender\" onchange=\"adjustBranchOnGender()\" required class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold cursor-pointer\">\r\n <option value=\"male\">\u099b\u09be\u09a4\u09cd\u09b0 (\u09ac\u09be\u09b2\u0995)<\/option>\r\n <option value=\"female\">\u099b\u09be\u09a4\u09cd\u09b0\u09c0 (\u09ac\u09be\u09b2\u09bf\u0995\u09be)<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_blood\">\u09b0\u0995\u09cd\u09a4\u09c7\u09b0 \u0997\u09cd\u09b0\u09c1\u09aa<\/label>\r\n <select id=\"std_blood\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold cursor-pointer\">\r\n <option value=\"\">\u09a8\u09bf\u09b0\u09cd\u09ac\u09be\u099a\u09a8 \u0995\u09b0\u09c1\u09a8<\/option>\r\n <option value=\"A+\">A+<\/option>\r\n <option value=\"A-\">A-<\/option>\r\n <option value=\"B+\">B+<\/option>\r\n <option value=\"B-\">B-<\/option>\r\n <option value=\"O+\">O+<\/option>\r\n <option value=\"O-\">O-<\/option>\r\n <option value=\"AB+\">AB+<\/option>\r\n <option value=\"AB-\">AB-<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n <button type=\"button\" onclick=\"goToStep(2)\" class=\"w-full bg-emerald-700 hover:bg-emerald-600 text-white font-bold py-3.5 rounded-xl transition-all shadow-md mt-4\">\u09aa\u09b0\u09ac\u09b0\u09cd\u09a4\u09c0 \u09a7\u09be\u09aa \u2794<\/button>\r\n <\/div>\r\n\r\n <!-- Step 2 -->\r\n <div id=\"step-section-2\" class=\"space-y-5 hidden animate-[fadeIn_0.4s_ease-in-out]\">\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_branch\">\u09aa\u099b\u09a8\u09cd\u09a6\u09c7\u09b0 \u09b6\u09be\u0996\u09be*<\/label>\r\n <select id=\"std_branch\" required class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold cursor-pointer\">\r\n <option value=\"main\">\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be (\u09b8\u09bf\u0995\u09a6\u09be\u09b0 \u09aa\u09be\u09a1\u09bc\u09be)<\/option>\r\n <option value=\"kachabazar\">\u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be (\u09ae\u09be\u0987\u09a8\u0989\u09a6\u09cd\u09a6\u09bf\u09a8 \u098f\u09b2\u09be\u0995\u09be)<\/option>\r\n <option value=\"asiya_yusuf\">\u0986\u099b\u09bf\u09af\u09bc\u09be \u0987\u0989\u09b8\u09c1\u09ab \u09ae\u09b9\u09bf\u09b2\u09be \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_dept\">\u0986\u09ac\u09c7\u09a6\u09a8\u0995\u09c3\u09a4 \u09ac\u09bf\u09ad\u09be\u0997*<\/label>\r\n <select id=\"std_dept\" required class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold cursor-pointer\">\r\n <option value=\"noorani\">\u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u09ac\u09bf\u09ad\u09be\u0997<\/option>\r\n <option value=\"nazera\">\u09a8\u09be\u099c\u09c7\u09b0\u09be \u09ac\u09bf\u09ad\u09be\u0997<\/option>\r\n <option value=\"hifz\">\u09b9\u09bf\u09ab\u099c\u09c1\u09b2 \u0995\u09c1\u09b0\u0986\u09a8 \u09ac\u09bf\u09ad\u09be\u0997<\/option>\r\n <option value=\"kitab\">\u0995\u09bf\u09a4\u09be\u09ac \u09ac\u09bf\u09ad\u09be\u0997<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_type\">\u09ad\u09b0\u09cd\u09a4\u09bf\u09b0 \u09a7\u09b0\u09a8*<\/label>\r\n <select id=\"std_type\" required class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold cursor-pointer\">\r\n <option value=\"residential\">\u0986\u09ac\u09be\u09b8\u09bf\u0995 (\u09ac\u09cb\u09b0\u09cd\u09a1\u09bf\u0982)<\/option>\r\n <option value=\"day_scholar\">\u0985\u09a8\u09be\u09ac\u09be\u09b8\u09bf\u0995 (\u09a1\u09c7-\u09b8\u09cd\u0995\u09b2\u09be\u09b0)<\/option>\r\n <\/select>\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_prev_edu\">\u09aa\u09c2\u09b0\u09cd\u09ac\u09ac\u09b0\u09cd\u09a4\u09c0 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\/\u09b8\u09cd\u0995\u09c1\u09b2<\/label>\r\n <input type=\"text\" id=\"std_prev_edu\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold\">\r\n <\/div>\r\n <\/div>\r\n <div class=\"flex gap-3 mt-4\">\r\n <button type=\"button\" onclick=\"goToStep(1)\" class=\"w-1\/2 bg-slate-200 hover:bg-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700 text-slate-700 dark:text-slate-200 font-bold py-3.5 rounded-xl transition-all\">\u2794 \u09aa\u09c2\u09b0\u09cd\u09ac\u09ac\u09b0\u09cd\u09a4\u09c0 \u09a7\u09be\u09aa<\/button>\r\n <button type=\"button\" onclick=\"goToStep(3)\" class=\"w-1\/2 bg-emerald-700 hover:bg-emerald-600 text-white font-bold py-3.5 rounded-xl transition-all shadow-md\">\u09aa\u09b0\u09ac\u09b0\u09cd\u09a4\u09c0 \u09a7\u09be\u09aa \u2794<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Step 3 -->\r\n <div id=\"step-section-3\" class=\"space-y-5 hidden animate-[fadeIn_0.4s_ease-in-out]\">\r\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_father\">\u09aa\u09bf\u09a4\u09be\u09b0 \u09a8\u09be\u09ae*<\/label>\r\n <input type=\"text\" id=\"std_father\" required class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_phone\">\u09ae\u09cb\u09ac\u09be\u0987\u09b2 \u09a8\u09ae\u09cd\u09ac\u09b0*<\/label>\r\n <input type=\"tel\" id=\"std_phone\" required placeholder=\"01XXXXXXXXX\" pattern=\"[0-9]{11}\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-mono font-bold\">\r\n <\/div>\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase tracking-wide\" data-translate=\"f_address\">\u09ac\u09b0\u09cd\u09a4\u09ae\u09be\u09a8 \u09a0\u09bf\u0995\u09be\u09a8\u09be*<\/label>\r\n <textarea id=\"std_address\" required rows=\"3\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs md:text-sm font-semibold bg-white dark:bg-slate-800\"><\/textarea>\r\n <\/div>\r\n <div class=\"flex gap-3 mt-4\">\r\n <button type=\"button\" onclick=\"goToStep(2)\" class=\"w-1\/2 bg-slate-200 hover:bg-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700 text-slate-700 dark:text-slate-200 font-bold py-3.5 rounded-xl transition-all\">\u2794 \u09aa\u09c2\u09b0\u09cd\u09ac\u09ac\u09b0\u09cd\u09a4\u09c0 \u09a7\u09be\u09aa<\/button>\r\n <button type=\"submit\" class=\"w-1\/2 bg-gradient-to-r from-amber-500 to-amber-600 hover:from-amber-600 text-emerald-950 font-black py-3.5 rounded-xl transition-all shadow-md\">\u09b8\u09be\u09ac\u09ae\u09bf\u099f \u0995\u09b0\u09c1\u09a8 \u2794<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/form>\r\n\r\n <!-- Receipt Success Display -->\r\n <div id=\"admission-success-card\" class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 md:p-8 shadow-2xl border border-emerald-500\/30 text-center space-y-6 hidden\">\r\n <div class=\"w-20 h-20 bg-emerald-100 dark:bg-emerald-900\/40 rounded-full flex items-center justify-center text-4xl mx-auto shadow-inner\">\ud83c\udf89<\/div>\r\n <div>\r\n <h3 class=\"font-serif font-black text-2xl text-emerald-800 dark:text-emerald-400\">\u09ad\u09b0\u09cd\u09a4\u09bf \u0986\u09ac\u09c7\u09a6\u09a8 \u09b8\u09ab\u09b2\u09ad\u09be\u09ac\u09c7 \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8 \u09b9\u09af\u09bc\u09c7\u099b\u09c7!<\/h3>\r\n <p class=\"text-xs text-slate-500 dark:text-slate-400 mt-2 font-semibold\">\u0986\u09aa\u09a8\u09be\u09b0 \u0986\u09ac\u09c7\u09a6\u09a8\u099f\u09bf \u09b8\u09bf\u09b8\u09cd\u099f\u09c7\u09ae\u09c7 \u09b8\u0982\u09b0\u0995\u09cd\u09b7\u09bf\u09a4 \u09b9\u09af\u09bc\u09c7\u099b\u09c7\u0964 \u09b8\u09b6\u09b0\u09c0\u09b0\u09c7 \u09ad\u09b0\u09cd\u09a4\u09bf\u09b0 \u09b8\u09ae\u09af\u09bc \u09a8\u09bf\u099a\u09c7\u09b0 \u09a1\u09c7\u09ae\u09cb \u09b0\u09b8\u09bf\u09a6\u099f\u09bf \u09aa\u09cd\u09b0\u09a6\u09b0\u09cd\u09b6\u09a8 \u0995\u09b0\u09c1\u09a8\u0964<\/p>\r\n <\/div>\r\n \r\n <div class=\"border border-dashed border-emerald-500\/50 p-6 rounded-2xl bg-emerald-50\/40 dark:bg-slate-950 text-left space-y-3.5 text-xs md:text-sm relative overflow-hidden\">\r\n <div class=\"absolute right-4 top-4 opacity-5 text-7xl select-none\">\ud83d\udd4c<\/div>\r\n <div class=\"flex justify-between border-b border-slate-200 dark:border-slate-800\/80 pb-2\">\r\n <span class=\"text-slate-500 dark:text-slate-400 font-bold\">\u0986\u09ac\u09c7\u09a6\u09a8 \u09a8\u09ae\u09cd\u09ac\u09b0 (App ID)<\/span>\r\n <strong id=\"rec-id\" class=\"text-emerald-700 dark:text-emerald-400 font-mono text-base\">-<\/strong>\r\n <\/div>\r\n <div class=\"flex justify-between border-b border-slate-200 dark:border-slate-800\/80 pb-2\">\r\n <span class=\"text-slate-500 dark:text-slate-400 font-bold\">\u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09b0\u09cd\u09a5\u09c0\u09b0 \u09a8\u09be\u09ae<\/span>\r\n <strong id=\"rec-name\" class=\"text-slate-800 dark:text-slate-100\">-<\/strong>\r\n <\/div>\r\n <div class=\"flex justify-between border-b border-slate-200 dark:border-slate-800\/80 pb-2\">\r\n <span class=\"text-slate-500 dark:text-slate-400 font-bold\">\u09a8\u09bf\u09b0\u09cd\u09ac\u09be\u099a\u09bf\u09a4 \u09b6\u09be\u0996\u09be<\/span>\r\n <strong id=\"rec-branch\" class=\"text-slate-800 dark:text-slate-100\">-<\/strong>\r\n <\/div>\r\n <div class=\"flex justify-between border-b border-slate-200 dark:border-slate-800\/80 pb-2\">\r\n <span class=\"text-slate-500 dark:text-slate-400 font-bold\">\u0986\u09ac\u09c7\u09a6\u09a8\u0995\u09c3\u09a4 \u09ac\u09bf\u09ad\u09be\u0997<\/span>\r\n <strong id=\"rec-dept\" class=\"text-slate-800 dark:text-slate-100\">-<\/strong>\r\n <\/div>\r\n <div class=\"flex justify-between pb-1\">\r\n <span class=\"text-slate-500 dark:text-slate-400 font-bold\">\u09ae\u09cb\u09ac\u09be\u0987\u09b2 \u09a8\u09ae\u09cd\u09ac\u09b0<\/span>\r\n <strong id=\"rec-phone\" class=\"text-slate-800 dark:text-slate-100 font-mono\">-<\/strong>\r\n <\/div>\r\n <\/div>\r\n <div class=\"flex gap-4 mt-6 justify-center\">\r\n <button onclick=\"window.print()\" class=\"bg-emerald-700 hover:bg-emerald-600 text-white font-bold text-xs py-3 px-6 rounded-xl shadow-md transition-all\">\ud83d\udda8\ufe0f \u09b0\u09b8\u09bf\u09a6 \u09aa\u09cd\u09b0\u09bf\u09a8\u09cd\u099f \u0995\u09b0\u09c1\u09a8<\/button>\r\n <button onclick=\"resetAdmissionForm()\" class=\"bg-slate-200 hover:bg-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700 text-slate-800 dark:text-slate-200 font-bold text-xs py-3 px-6 rounded-xl shadow-md transition-all\">\u09a8\u09a4\u09c1\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf \u0986\u09ac\u09c7\u09a6\u09a8<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ================= STREAMING_CHUNK: Donation ================= -->\r\n <!-- ---------------- PAGE: DONATION ---------------- -->\r\n <section id=\"page-donation\" class=\"tab-content hidden\">\r\n <div class=\"max-w-4xl mx-auto px-4\">\r\n <div class=\"text-center mb-10\">\r\n <span class=\"text-5xl\">\ud83d\udce6\ud83e\ude99<\/span>\r\n <h2 class=\"text-2xl md:text-4xl font-serif font-black text-emerald-800 dark:text-emerald-400 mt-3\" data-translate=\"donate_title\">\u09a6\u09be\u09a8 \u0995\u09b0\u09c1\u09a8 \u0993 \u09a6\u09cd\u09ac\u09c0\u09a8\u09bf \u0995\u09be\u099c\u09c7 \u0985\u0982\u09b6 \u09a8\u09bf\u09a8<\/h2>\r\n <p class=\"text-slate-500 dark:text-slate-400 mt-2 text-xs md:text-base font-semibold\" data-translate=\"donate_sub\">\u0986\u09aa\u09a8\u09be\u09b0 \u09b9\u09be\u09b2\u09be\u09b2 \u0993 \u0995\u09b7\u09cd\u099f\u09be\u09b0\u09cd\u099c\u09bf\u09a4 \u0989\u09aa\u09be\u09b0\u09cd\u099c\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\u09b0 \u09b2\u09bf\u09b2\u09cd\u09b2\u09be\u09b9 \u09ab\u09be\u09a8\u09cd\u09a1, \u0995\u09b0\u09cd\u099c\u09c7 \u09b9\u09be\u09b8\u09be\u09a8\u09be \u0985\u09a5\u09ac\u09be \u09a8\u09bf\u09b0\u09cd\u09ae\u09be\u09a3 \u0995\u09be\u099c\u09c7 \u09a6\u09be\u09a8 \u0995\u09b0\u09a4\u09c7 \u09aa\u09be\u09b0\u09c7\u09a8\u0964<\/p>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-8\">\r\n <!-- Direct Account Details Info Card -->\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 shadow-premium border border-slate-100 dark:border-slate-800\/80 space-y-4\">\r\n <h3 class=\"font-bold text-lg text-emerald-800 dark:text-emerald-400 border-b border-slate-100 dark:border-slate-800\/80 pb-3\" data-translate=\"bank_donation\">\u09ac\u09cd\u09af\u09be\u0982\u0995 \u0993 \u09b8\u09b0\u09be\u09b8\u09b0\u09bf \u09b9\u09bf\u09b8\u09be\u09ac<\/h3>\r\n \r\n <div class=\"p-3.5 bg-emerald-50 dark:bg-emerald-950\/20 rounded-2xl flex justify-between items-center border border-emerald-500\/10\">\r\n <div>\r\n <span class=\"text-[10px] text-emerald-600 dark:text-emerald-400 font-bold uppercase tracking-wider block mb-0.5\">\u0986\u09b2-\u0986\u09b0\u09be\u09ab\u09be\u09b9 \u09ac\u09cd\u09af\u09be\u0982\u0995 (\u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09b6\u09be\u0996\u09be)<\/span>\r\n <strong class=\"block text-sm text-slate-800 dark:text-slate-100 font-mono tracking-wide\">\u09b9\u09bf\u09b8\u09be\u09ac: \u09e7\u09ec\u09ec\u09e7\u09e7\u09e8\u09e6\u09e6\u09e7\u09e8\u09ec\u09eb\u09e9<\/strong>\r\n <span class=\"text-[10px] text-slate-500 dark:text-slate-400 font-semibold\">\u09a6\u09be. \u0989. \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be<\/span>\r\n <\/div>\r\n <button onclick=\"copyToClipboard('1661120012653')\" class=\"bg-white dark:bg-slate-800 p-2.5 rounded-xl text-emerald-600 dark:text-emerald-400 hover:bg-emerald-100 shadow-sm transition-colors\" title=\"\u0995\u09aa\u09bf \u0995\u09b0\u09c1\u09a8\">\ud83d\udccb<\/button>\r\n <\/div>\r\n \r\n <div class=\"p-3.5 bg-pink-50 dark:bg-pink-950\/20 rounded-2xl flex justify-between items-center border border-pink-500\/10\">\r\n <div>\r\n <span class=\"text-[10px] text-pink-600 dark:text-pink-400 font-bold uppercase tracking-wider block mb-0.5\">\u09ac\u09bf\u0995\u09be\u09b6 (\u0985\u09ab\u09bf\u09b8)<\/span>\r\n <strong class=\"block text-sm text-slate-800 dark:text-slate-100 font-mono tracking-wide\">\u09e6\u09e7\u09ed\u09e7\u09ea-\u09e8\u09ed\u09ec\u09e9\u09ef\u09e9<\/strong>\r\n <\/div>\r\n <button onclick=\"copyToClipboard('01714276393')\" class=\"bg-white dark:bg-slate-800 p-2.5 rounded-xl text-pink-600 dark:text-pink-400 hover:bg-pink-100 shadow-sm transition-colors\" title=\"\u0995\u09aa\u09bf \u0995\u09b0\u09c1\u09a8\">\ud83d\udccb<\/button>\r\n <\/div>\r\n \r\n <div class=\"p-3.5 bg-amber-50 dark:bg-amber-950\/20 rounded-2xl flex justify-between items-center border border-amber-500\/10\">\r\n <div>\r\n <span class=\"text-[10px] text-amber-600 dark:text-amber-400 font-bold uppercase tracking-wider block mb-0.5\">\u09a8\u0997\u09a6 (\u09ae\u09c1\u09b9\u09a4\u09be\u09ae\u09bf\u09ae)<\/span>\r\n <strong class=\"block text-sm text-slate-800 dark:text-slate-100 font-mono tracking-wide\">\u09e6\u09e7\u09ec\u09ee\u09ec-\u09e7\u09ed\u09e7\u09ee\u09e7\u09ee<\/strong>\r\n <\/div>\r\n <button onclick=\"copyToClipboard('01686171818')\" class=\"bg-white dark:bg-slate-800 p-2.5 rounded-xl text-amber-600 dark:text-amber-400 hover:bg-amber-100 shadow-sm transition-colors\" title=\"\u0995\u09aa\u09bf \u0995\u09b0\u09c1\u09a8\">\ud83d\udccb<\/button>\r\n <\/div>\r\n\r\n <div class=\"p-3.5 bg-blue-50 dark:bg-blue-950\/20 rounded-2xl flex justify-between items-center border border-blue-500\/10\">\r\n <div>\r\n <span class=\"text-[10px] text-blue-600 dark:text-blue-400 font-bold uppercase tracking-wider block mb-0.5\">\u09a1\u09be\u099a-\u09ac\u09be\u0982\u09b2\u09be \/ \u09b0\u0995\u09c7\u099f (\u09ae\u09c1\u09b9\u09a4\u09be\u09ae\u09bf\u09ae)<\/span>\r\n <strong class=\"block text-sm text-slate-800 dark:text-slate-100 font-mono tracking-wide\">\u09e6\u09e7\u09ef\u09e8\u09e6-\u09e7\u09ee\u09e9\u09ed\u09ec\u09ed<\/strong>\r\n <\/div>\r\n <button onclick=\"copyToClipboard('01920183767')\" class=\"bg-white dark:bg-slate-800 p-2.5 rounded-xl text-blue-600 dark:text-blue-400 hover:bg-blue-100 shadow-sm transition-colors\" title=\"\u0995\u09aa\u09bf \u0995\u09b0\u09c1\u09a8\">\ud83d\udccb<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Donation Box \/ Checkout Card -->\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 shadow-premium border border-slate-100 dark:border-slate-800\/80 flex flex-col justify-between\">\r\n <div>\r\n <h3 class=\"font-bold text-lg text-emerald-800 dark:text-emerald-400 border-b border-slate-100 dark:border-slate-800\/80 pb-3\" data-translate=\"donate_form_title\">\u09a8\u09bf\u09b0\u09be\u09aa\u09a6 \u0985\u09a8\u09b2\u09be\u0987\u09a8 \u099a\u09c7\u0995\u0986\u0989\u099f \u09a1\u09c7\u09ae\u09cb<\/h3>\r\n <div class=\"space-y-4 mt-4\">\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase\">\u09a6\u09be\u09a4\u09be\u09b0 \u09a8\u09be\u09ae (\u0990\u099a\u09cd\u099b\u09bf\u0995)<\/label>\r\n <input type=\"text\" id=\"donor-name\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs bg-white dark:bg-slate-800 font-semibold\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase\">\u09a6\u09be\u09a8\u09c7\u09b0 \u09aa\u09b0\u09bf\u09ae\u09be\u09a3 (\u099f\u09be\u0995\u09be)*<\/label>\r\n <input type=\"number\" id=\"donor-amount\" required placeholder=\"500\" min=\"10\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-sm bg-white dark:bg-slate-800 font-mono font-bold text-emerald-700\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-500 dark:text-slate-400 mb-1.5 uppercase\">\u09a4\u09b9\u09ac\u09bf\u09b2\u09c7\u09b0 \u0989\u09a6\u09cd\u09a6\u09c7\u09b6\u09cd\u09af<\/label>\r\n <select id=\"donor-fund\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs font-semibold bg-white dark:bg-slate-800 cursor-pointer\">\r\n <option value=\"lillah\">\u09b2\u09bf\u09b2\u09cd\u09b2\u09be\u09b9 \u0993 \u098f\u09a4\u09bf\u09ae \u09ab\u09be\u09a8\u09cd\u09a1<\/option>\r\n <option value=\"general\">\u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be \u0989\u09a8\u09cd\u09a8\u09af\u09bc\u09a8 \u0993 \u09b8\u09be\u09a7\u09be\u09b0\u09a3 \u09ab\u09be\u09a8\u09cd\u09a1<\/option>\r\n <option value=\"mosque\">\u09ae\u09b8\u099c\u09bf\u09a6 \u09a8\u09bf\u09b0\u09cd\u09ae\u09be\u09a3 \u0995\u09be\u099c<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <button onclick=\"simulateDonationPayment()\" class=\"w-full bg-gradient-to-r from-emerald-700 to-emerald-600 hover:from-emerald-600 text-white font-extrabold py-3.5 rounded-xl transition-all shadow-md mt-6\">\u0985\u09a8\u09b2\u09be\u0987\u09a8 \u09aa\u09c7\u09ae\u09c7\u09a8\u09cd\u099f \u09a1\u09c7\u09ae\u09cb \u2794<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ================= STREAMING_CHUNK: Tasbeeh ================= -->\r\n <!-- ---------------- PAGE: TASBEEH ---------------- -->\r\n <section id=\"page-tasbeeh\" class=\"tab-content hidden\">\r\n <div class=\"max-w-md mx-auto px-4\">\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 shadow-premium border border-slate-100 dark:border-slate-800\/80 text-center space-y-6\">\r\n <div>\r\n <h2 class=\"text-2xl font-serif font-black text-emerald-800 dark:text-emerald-400\" data-translate=\"tasbeeh_head\">\u09b8\u09cd\u09ae\u09be\u09b0\u09cd\u099f \u09a1\u09bf\u099c\u09bf\u099f\u09be\u09b2 \u09a4\u09be\u09b8\u09ac\u09c0\u09b9 \u0995\u09be\u0989\u09a8\u09cd\u099f\u09be\u09b0<\/h2>\r\n <p class=\"text-xs text-slate-500 dark:text-slate-400 mt-2 font-semibold\" data-translate=\"tasbeeh_sub\">\u0995\u09cb\u09a8\u09cb \u09ac\u09be\u09b9\u09cd\u09af\u09bf\u0995 \u09b6\u09ac\u09cd\u09a6 \u09ab\u09be\u0987\u09b2 \u099b\u09be\u09a1\u09bc\u09be\u0987 \u09b2\u09be\u0987\u09ad \u09b8\u09be\u0989\u09a8\u09cd\u09a1 \u0987\u09ab\u09c7\u0995\u09cd\u099f \u0993 \u09ad\u09be\u0987\u09ac\u09cd\u09b0\u09c7\u09b6\u09a8 \u0985\u09a8\u09c1\u09ad\u09c2\u09a4\u09bf \u09b8\u09b9 \u099c\u09bf\u0995\u09bf\u09b0 \u099f\u09cd\u09b0\u09cd\u09af\u09be\u0995\u09be\u09b0\u0964<\/p>\r\n <\/div>\r\n\r\n <!-- Sounds & Goals Controls -->\r\n <div class=\"flex justify-between items-center text-xs\">\r\n <button onclick=\"toggleTasbeehSound()\" class=\"flex items-center gap-1.5 px-3.5 py-2 rounded-xl bg-slate-100 hover:bg-slate-200 dark:bg-slate-800 dark:hover:bg-slate-700 text-slate-600 dark:text-slate-300 font-bold transition-colors\">\r\n <span id=\"sound-icon-holder\">\ud83d\udd0a<\/span> <span id=\"sound-text-lbl\">\u09b6\u09ac\u09cd\u09a6 \u09b8\u099a\u09b2<\/span>\r\n <\/button>\r\n <span id=\"tasbeeh-goal-badge\" class=\"bg-amber-100 dark:bg-amber-950\/20 text-amber-700 dark:text-amber-400 font-extrabold px-3.5 py-2 rounded-xl border border-amber-500\/10\">\u09b2\u0995\u09cd\u09b7\u09cd\u09af: \u09e9\u09e9<\/span>\r\n <\/div>\r\n\r\n <!-- Dhikr Select Dropdown -->\r\n <div class=\"text-left\">\r\n <label class=\"block text-[11px] font-bold text-slate-400 uppercase tracking-wider mb-1.5\">\u099c\u09bf\u0995\u09bf\u09b0 \u09a8\u09bf\u09b0\u09cd\u09ac\u09be\u099a\u09a8 \u0995\u09b0\u09c1\u09a8<\/label>\r\n <select id=\"tasbeeh-dhikr-select\" onchange=\"changeDhikr()\" class=\"w-full text-xs border border-slate-200 dark:border-slate-700 p-3 rounded-xl bg-slate-50 dark:bg-slate-800 font-semibold cursor-pointer\">\r\n <option value=\"Subhanallah\">\u09b8\u09c1\u09ac\u09b9\u09be\u09a8\u09be\u09b2\u09cd\u09b2\u09be\u09b9 (Subhanallah)<\/option>\r\n <option value=\"Alhamdulillah\">\u0986\u09b2\u09b9\u09be\u09ae\u09a6\u09c1\u09b2\u09bf\u09b2\u09cd\u09b2\u09be\u09b9 (Alhamdulillah)<\/option>\r\n <option value=\"Allahu Akbar\">\u0986\u09b2\u09cd\u09b2\u09be\u09b9\u09c1 \u0986\u0995\u09ac\u09be\u09b0 (Allahu Akbar)<\/option>\r\n <option value=\"Astaghfirullah\">\u0986\u09b8\u09cd\u09a4\u09be\u0997\u09ab\u09bf\u09b0\u09c1\u09b2\u09cd\u09b2\u09be\u09b9 (Astaghfirullah)<\/option>\r\n <option value=\"La ilaha illallah\">\u09b2\u09be \u0987\u09b2\u09be\u09b9\u09be \u0987\u09b2\u09cd\u09b2\u09be\u09b2\u09cd\u09b2\u09be\u09b9 (La ilaha illallah)<\/option>\r\n <\/select>\r\n <\/div>\r\n\r\n <!-- Dynamic Ring Counter Display -->\r\n <div class=\"relative w-56 h-56 mx-auto flex items-center justify-center rounded-full bg-slate-50 dark:bg-slate-950 border-[8px] border-emerald-600 shadow-2xl cursor-pointer select-none transform active:scale-95 transition-all\" onclick=\"incrementTasbeeh()\">\r\n <div id=\"pulse-bg\" class=\"absolute inset-0 bg-emerald-500\/20 rounded-full hidden scale-105 animate-ping\"><\/div>\r\n \r\n <div class=\"relative z-10 text-center\">\r\n <span class=\"block text-[11px] uppercase tracking-widest text-slate-400 font-extrabold\" id=\"dhikr-lbl-sub\">SUBHANALLAH<\/span>\r\n <span class=\"text-6xl font-mono font-black text-emerald-800 dark:text-emerald-400 block my-1\" id=\"tasbeeh-count\">\u09e6<\/span>\r\n <span class=\"block text-[10px] text-slate-400 dark:text-slate-500 font-bold uppercase tracking-wider\">\u0995\u09cd\u09b2\u09bf\u0995 \u0995\u09b0\u09a4\u09c7 \u098f\u0996\u09be\u09a8\u09c7 \u099f\u09cd\u09af\u09be\u09aa \u0995\u09b0\u09c1\u09a8<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Goals Selection Presets -->\r\n <div class=\"flex justify-center gap-2\">\r\n <button onclick=\"setTasbeehGoal(33)\" id=\"goal-btn-33\" class=\"px-4 py-1.5 rounded-full text-xs font-bold border border-emerald-600 bg-emerald-600 text-white shadow-sm transition-all\">\u09e9\u09e9<\/button>\r\n <button onclick=\"setTasbeehGoal(99)\" id=\"goal-btn-99\" class=\"px-4 py-1.5 rounded-full text-xs font-bold border border-slate-200 text-slate-500 dark:border-slate-700 bg-white dark:bg-slate-800 shadow-sm transition-all\">\u09ef\u09ef<\/button>\r\n <button onclick=\"setTasbeehGoal(100)\" id=\"goal-btn-100\" class=\"px-4 py-1.5 rounded-full text-xs font-bold border border-slate-200 text-slate-500 dark:border-slate-700 bg-white dark:bg-slate-800 shadow-sm transition-all\">\u09e7\u09e6\u09e6<\/button>\r\n <button onclick=\"setTasbeehGoal(0)\" id=\"goal-btn-0\" class=\"px-4 py-1.5 rounded-full text-xs font-bold border border-slate-200 text-slate-500 dark:border-slate-700 bg-white dark:bg-slate-800 shadow-sm transition-all\">\u09b8\u09c0\u09ae\u09be\u09b9\u09c0\u09a8<\/button>\r\n <\/div>\r\n\r\n <div class=\"flex gap-4\">\r\n <button onclick=\"resetTasbeeh()\" class=\"w-full bg-slate-100 hover:bg-slate-200 dark:bg-slate-800 dark:hover:bg-slate-700 text-slate-800 dark:text-slate-200 font-bold py-3 rounded-xl text-xs shadow-sm transition-colors\" data-translate=\"t_reset\">\u0995\u09be\u0989\u09a8\u09cd\u099f\u09be\u09b0 \u09b0\u09bf\u09b8\u09c7\u099f<\/button>\r\n <\/div>\r\n\r\n <!-- Saved sessions history logs -->\r\n <div class=\"border-t border-slate-100 dark:border-slate-800\/80 pt-4 text-left\">\r\n <h4 class=\"text-xs font-bold text-slate-400 uppercase tracking-wide mb-2\">\u0986\u099c\u0995\u09c7\u09b0 \u099c\u09bf\u0995\u09bf\u09b0 \u09b9\u09bf\u09b8\u09cd\u099f\u09cd\u09b0\u09bf:<\/h4>\r\n <div id=\"tasbeeh-history\" class=\"space-y-2 text-xs text-slate-500 dark:text-slate-400 max-h-24 overflow-y-auto nh-chat-scroll pr-2\">\r\n <!-- Rendered dynamically -->\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <\/main>\r\n\r\n <!-- ================= STREAMING_CHUNK: Comprehensive Footer Section ================= -->\r\n <footer class=\"bg-emerald-950 dark:bg-black text-emerald-100 pt-16 pb-24 lg:pb-12 border-t-4 border-amber-500 mt-10\" style=\"text-shadow: none !important; box-shadow: none !important;\">\r\n <div class=\"max-w-7xl mx-auto px-6 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-10\">\r\n <!-- Column 1: Identity -->\r\n <div class=\"space-y-4\">\r\n <svg viewBox=\"0 0 500 500\" class=\"w-16 h-16 rounded-full border-2 border-emerald-500 bg-white shrink-0 object-cover\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <circle cx=\"250\" cy=\"250\" r=\"240\" fill=\"none\" stroke=\"#15803d\" stroke-width=\"8\"\/>\r\n <path id=\"arc-top-ft\" d=\"M 80 250 A 170 170 0 1 1 420 250\" fill=\"none\"\/>\r\n <text fill=\"#15803d\" font-size=\"34\" font-weight=\"900\" font-family=\"sans-serif\"><textPath href=\"#arc-top-ft\" startOffset=\"50%\" text-anchor=\"middle\">\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8<\/textPath><\/text>\r\n <path d=\"M 160 360 L 160 200 C 160 120, 340 120, 340 200 L 340 360 Z\" fill=\"#15803d\"\/>\r\n <path d=\"M 250 280 A 40 40 0 0 0 210 360 L 290 360 A 40 40 0 0 0 250 280 Z\" fill=\"#ffffff\"\/>\r\n <text x=\"250\" y=\"430\" fill=\"#15803d\" font-size=\"36\" font-weight=\"900\" text-anchor=\"middle\">\u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be<\/text>\r\n <\/svg>\r\n <h3 class=\"text-xl font-serif font-black text-white\">\u09a6\u09be. \u0989. \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be<\/h3>\r\n <p class=\"text-xs text-emerald-300 leading-relaxed font-medium\">\u0986\u09a7\u09c1\u09a8\u09bf\u0995 \u09aa\u09cd\u09b0\u09af\u09c1\u0995\u09cd\u09a4\u09bf\u09b0 \u09b8\u09ae\u09a8\u09cd\u09ac\u09af\u09bc\u09c7 \u0995\u09c1\u09b0\u0986\u09a8 \u0993 \u09b8\u09c1\u09a8\u09cd\u09a8\u09be\u09b9\u09ad\u09bf\u09a4\u09cd\u09a4\u09bf\u0995 \u0986\u09a6\u09b0\u09cd\u09b6 \u0987\u09b8\u09b2\u09be\u09ae\u09c0 \u09b6\u09bf\u0995\u09cd\u09b7\u09be \u09aa\u09cd\u09b0\u09a4\u09bf\u09b7\u09cd\u09a0\u09be\u09a8 \u098f\u09ac\u0982 \u09ac\u09cd\u09af\u09be\u09aa\u0995 \u09b6\u09be\u0996\u09be \u09a8\u09c7\u099f\u0993\u09af\u09bc\u09be\u09b0\u09cd\u0995\u0964 \u0986\u09ae\u09be\u09a6\u09c7\u09b0 \u09ae\u09c2\u09b2 \u0989\u09a6\u09cd\u09a6\u09c7\u09b6\u09cd\u09af \u09b9\u09b2\u09cb \u09b8\u09a0\u09bf\u0995 \u09a6\u09cd\u09ac\u09c0\u09a8\u09bf \u09b6\u09bf\u0995\u09cd\u09b7\u09be \u09aa\u09cd\u09b0\u09a4\u09bf\u099f\u09bf \u0998\u09b0\u09c7 \u09aa\u09cc\u0981\u099b\u09c7 \u09a6\u09c7\u0993\u09df\u09be\u0964<\/p>\r\n <\/div>\r\n \r\n <!-- Column 2: Quick Links -->\r\n <div class=\"space-y-4\">\r\n <h4 class=\"text-sm font-bold text-amber-500 uppercase tracking-widest border-b border-emerald-800 pb-2\">\u09aa\u09cd\u09b0\u09df\u09cb\u099c\u09a8\u09c0\u09df \u09b2\u09bf\u0982\u0995<\/h4>\r\n <ul class=\"space-y-2.5 text-xs font-semibold\">\r\n <li><button onclick=\"switchTab('home')\" class=\"hover:text-amber-400 transition-colors\">\u2794 \u09b9\u09cb\u09ae \u09aa\u09c7\u0987\u099c<\/button><\/li>\r\n <li><button onclick=\"switchTab('admission')\" class=\"hover:text-amber-400 transition-colors\">\u2794 \u0985\u09a8\u09b2\u09be\u0987\u09a8\u09c7 \u09ad\u09b0\u09cd\u09a4\u09bf \u0986\u09ac\u09c7\u09a6\u09a8<\/button><\/li>\r\n <li><button onclick=\"switchTab('fees')\" class=\"hover:text-amber-400 transition-colors\">\u2794 \u0985\u09a8\u09b2\u09be\u0987\u09a8\u09c7 \u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7<\/button><\/li>\r\n <li><button onclick=\"switchTab('donation')\" class=\"hover:text-amber-400 transition-colors\">\u2794 \u09ab\u09be\u09a8\u09cd\u09a1\u09c7 \u09a6\u09be\u09a8 \u0995\u09b0\u09c1\u09a8<\/button><\/li>\r\n <li><button onclick=\"switchTab('gallery')\" class=\"hover:text-amber-400 transition-colors\">\u2794 \u09a8\u09cb\u099f\u09bf\u09b6 \u0993 \u0997\u09cd\u09af\u09be\u09b2\u09be\u09b0\u09bf<\/button><\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <!-- Column 3: Contact Branch 1 & 2 -->\r\n <div class=\"space-y-4\">\r\n <h4 class=\"text-sm font-bold text-amber-500 uppercase tracking-widest border-b border-emerald-800 pb-2\">\u09af\u09cb\u0997\u09be\u09af\u09cb\u0997\u09c7\u09b0 \u09a0\u09bf\u0995\u09be\u09a8\u09be<\/h4>\r\n <div class=\"text-xs space-y-3 font-medium\">\r\n <div>\r\n <strong class=\"text-white block mb-0.5\">\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be (\u09ac\u09be\u09b2\u0995 \u0986\u09ac\u09be\u09b8\u09bf\u0995):<\/strong>\r\n <p class=\"text-emerald-300\">\u09b8\u09bf\u0995\u09a6\u09be\u09b0 \u09aa\u09be\u09a1\u09bc\u09be, \u09e9\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\u0964<\/p>\r\n <p class=\"mt-1\">\u09ae\u09c1\u09b9\u09a4\u09be\u09ae\u09bf\u09ae: <a href=\"tel:01920183767\" class=\"text-amber-400 hover:underline\">\u09e6\u09e7\u09ef\u09e8\u09e6-\u09e7\u09ee\u09e9\u09ed\u09ec\u09ed<\/a><\/p>\r\n <p>\u0985\u09ab\u09bf\u09b8: <a href=\"tel:01714276393\" class=\"text-amber-400 hover:underline\">\u09e6\u09e7\u09ed\u09e7\u09ea-\u09e8\u09ed\u09ec\u09e9\u09ef\u09e9<\/a><\/p>\r\n <\/div>\r\n <div>\r\n <strong class=\"text-white block mb-0.5\">\u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be:<\/strong>\r\n <p class=\"text-emerald-300\">\u09ae\u09be\u0987\u09a8\u0989\u09a6\u09cd\u09a6\u09bf\u09a8 \u0986\u09ac\u09be\u09b8\u09bf\u0995 \u098f\u09b2\u09be\u0995\u09be, \u09eb\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\u0964<\/p>\r\n <p class=\"mt-1\">\u0985\u09ab\u09bf\u09b8: <a href=\"tel:01886989884\" class=\"text-amber-400 hover:underline\">\u09e6\u09e7\u09ee\u09ee\u09ec-\u09ef\u09ee\u09ef\u09ee\u09ee\u09ea<\/a><\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Column 4: Contact Branch 3 & Mail -->\r\n <div class=\"space-y-4\">\r\n <h4 class=\"text-sm font-bold text-amber-500 uppercase tracking-widest border-b border-emerald-800 pb-2\">\u09ae\u09b9\u09bf\u09b2\u09be \u09b6\u09be\u0996\u09be \u0993 \u0987\u09ae\u09c7\u0987\u09b2<\/h4>\r\n <div class=\"text-xs space-y-3 font-medium\">\r\n <div>\r\n <strong class=\"text-white block mb-0.5\">\u0986\u099b\u09bf\u09af\u09bc\u09be \u0987\u0989\u09b8\u09c1\u09ab \u09ae\u09b9\u09bf\u09b2\u09be \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be:<\/strong>\r\n <p class=\"text-emerald-300\">\u0986\u09ac\u09c1 \u0987\u0989\u09b8\u09c1\u09ab \u09b0\u09cb\u09a1, \u09e9\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\u0964<\/p>\r\n <p class=\"mt-1\">\u09ae\u09b9\u09bf\u09b2\u09be \u09b6\u09be\u0996\u09be \u0985\u09ab\u09bf\u09b8: <a href=\"tel:01886989880\" class=\"text-amber-400 hover:underline\">\u09e6\u09e7\u09ee\u09ee\u09ec-\u09ef\u09ee\u09ef\u09ee\u09ee\u09e6<\/a><\/p>\r\n <p>\u09ae\u09b9\u09bf\u09b2\u09be \u09b9\u09bf\u09ab\u099c \u09ac\u09bf\u09ad\u09be\u0997: <a href=\"tel:01751504140\" class=\"text-amber-400 hover:underline\">\u09e6\u09e7\u09ed\u09eb\u09e7-\u09eb\u09e6\u09ea\u09e7\u09ea\u09e6<\/a><\/p>\r\n <\/div>\r\n <div class=\"pt-2\">\r\n <strong class=\"text-white block mb-0.5\">\u0985\u09ab\u09bf\u09b8\u09bf\u09df\u09be\u09b2 \u0987\u09ae\u09c7\u0987\u09b2 \u0993 \u0993\u09df\u09c7\u09ac\u09b8\u09be\u0987\u099f:<\/strong>\r\n <a href=\"mailto:nurulharamainmadrasha@gmail.com\" class=\"text-amber-400 hover:underline block mb-1\">nurulharamainmadrasha@gmail.com<\/a>\r\n <a href=\"https:\/\/www.nurulharamainmadrasa.com\" target=\"_blank\" class=\"text-amber-400 hover:underline block\">www.nurulharamainmadrasa.com<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"max-w-7xl mx-auto px-6 mt-10 pt-6 border-t border-emerald-900 text-center text-[10px] text-emerald-500 font-bold tracking-widest uppercase\">\r\n © \u09e8\u09e6\u09e8\u09ec \u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\u0964 \u09b8\u09b0\u09cd\u09ac\u09b8\u09cd\u09ac\u09a4\u09cd\u09ac \u09b8\u0982\u09b0\u0995\u09cd\u09b7\u09bf\u09a4\u0964\r\n <\/div>\r\n <\/footer>\r\n\r\n <!-- ================= STREAMING_CHUNK: Modals and Chat UI ================= -->\r\n <!-- Image Lightbox Modal -->\r\n <div id=\"gallery-modal\" class=\"fixed inset-0 z-50 bg-black\/90 hidden items-center justify-center p-4 transition-opacity\">\r\n <button onclick=\"closeGalleryModal()\" class=\"absolute top-6 right-6 text-white text-4xl font-light hover:text-amber-500 transition-colors\">×<\/button>\r\n <img decoding=\"async\" id=\"modal-image\" src=\"\" alt=\"Preview\" class=\"max-w-full max-h-[85vh] rounded-2xl object-contain shadow-2xl border border-white\/10\">\r\n <\/div>\r\n\r\n <!-- Simulated Gateway Modal -->\r\n <div id=\"donation-gateway-modal\" class=\"fixed inset-0 z-50 bg-black\/70 hidden items-center justify-center p-4\">\r\n <div class=\"bg-white dark:bg-slate-900 rounded-3xl p-6 max-w-sm w-full space-y-4 text-slate-800 dark:text-slate-100 shadow-2xl border border-slate-100 dark:border-slate-800\">\r\n <div class=\"flex justify-between items-center border-b dark:border-slate-800 pb-2.5\">\r\n <strong class=\"text-sm font-bold text-emerald-800 dark:text-emerald-400 font-serif\">\u09a8\u09bf\u09b0\u09be\u09aa\u09a6 \u09a1\u09c7\u09ae\u09cb \u0997\u09c7\u099f\u0993\u09af\u09bc\u09c7<\/strong>\r\n <button onclick=\"closeDonationGateway()\" class=\"text-xl font-bold text-red-500 hover:text-red-600\">×<\/button>\r\n <\/div>\r\n <div class=\"p-3 bg-slate-50 dark:bg-slate-950 rounded-2xl text-xs space-y-1.5 font-bold\">\r\n <div class=\"flex justify-between\"><span>\u09aa\u09b0\u09bf\u09ae\u09be\u09a3:<\/span> <strong id=\"gateway-amount\" class=\"text-emerald-700 dark:text-emerald-400 font-mono\">-<\/strong><\/div>\r\n <div class=\"flex justify-between\"><span>\u09ac\u09bf\u09ac\u09b0\u09a3:<\/span> <strong id=\"gateway-fund\" class=\"text-amber-600\">-<\/strong><\/div>\r\n <\/div>\r\n <div class=\"grid grid-cols-2 gap-2\">\r\n <button id=\"m-btn-bkash\" onclick=\"setGatewayMethod('bkash')\" class=\"py-2.5 border-2 border-emerald-500 rounded-xl font-bold text-xs bg-emerald-500\/10 text-emerald-700\">\u09ac\u09bf\u0995\u09be\u09b6 (bKash)<\/button>\r\n <button id=\"m-btn-nagad\" onclick=\"setGatewayMethod('nagad')\" class=\"py-2.5 border border-slate-200 dark:border-slate-700 rounded-xl font-bold text-xs text-slate-500 bg-white dark:bg-slate-800\">\u09a8\u0997\u09a6 (Nagad)<\/button>\r\n <\/div>\r\n <div>\r\n <label class=\"block text-[11px] font-bold text-slate-400 mb-1.5 uppercase tracking-wide\">\u0986\u09aa\u09a8\u09be\u09b0 \u09ae\u09cb\u09ac\u09be\u0987\u09b2 \u09aa\u09c7\u09ae\u09c7\u09a8\u09cd\u099f \u09a8\u09ae\u09cd\u09ac\u09b0<\/label>\r\n <input type=\"tel\" id=\"gateway-phone\" placeholder=\"01XXXXXXXXX\" pattern=\"[0-9]{11}\" class=\"w-full border border-slate-200 dark:border-slate-700 rounded-xl p-3 text-xs font-mono font-bold bg-white dark:bg-slate-800\">\r\n <\/div>\r\n <button onclick=\"confirmSimulatedPayment()\" class=\"w-full bg-emerald-700 hover:bg-emerald-600 text-white font-bold py-3.5 rounded-xl text-xs shadow-md transition-all\">\u09aa\u09c7\u09ae\u09c7\u09a8\u09cd\u099f \u09a8\u09bf\u09b6\u09cd\u099a\u09bf\u09a4 \u0995\u09b0\u09c1\u09a8 \u2794<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- AI Assistant Chat UI -->\r\n <div class=\"fixed bottom-20 lg:bottom-6 right-4 z-40 flex flex-col items-end gap-3\">\r\n <div id=\"ai-chat-container\" class=\"w-72 md:w-85 h-96 bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 rounded-3xl shadow-2xl flex-col hidden overflow-hidden transition-all duration-300\">\r\n <div class=\"bg-gradient-to-r from-emerald-800 to-emerald-700 text-white p-4 flex justify-between items-center shrink-0\">\r\n <div class=\"flex items-center gap-2.5\">\r\n <span class=\"text-2xl\">\ud83e\udd16<\/span>\r\n <div>\r\n <strong class=\"text-xs md:text-sm block leading-tight font-serif\">\u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u098f\u0986\u0987<\/strong>\r\n <span class=\"text-[9px] text-emerald-200 uppercase font-bold tracking-wider\">\u09ad\u09be\u09b0\u09cd\u099a\u09c1\u09af\u09bc\u09be\u09b2 \u09b9\u09c7\u09b2\u09cd\u09aa \u09a1\u09c7\u09b8\u09cd\u0995<\/span>\r\n <\/div>\r\n <\/div>\r\n <button onclick=\"toggleAIChat()\" class=\"text-white hover:text-slate-200 font-bold text-lg\">×<\/button>\r\n <\/div>\r\n \r\n <div class=\"flex-1 p-3.5 space-y-3.5 overflow-y-auto text-xs nh-chat-scroll\" id=\"ai-chat-logs\">\r\n <div class=\"flex gap-2\">\r\n <span class=\"text-lg bg-emerald-100 dark:bg-emerald-950 p-1.5 rounded-full h-fit shrink-0\">\ud83e\udd16<\/span>\r\n <div class=\"bg-slate-50 dark:bg-slate-800 text-slate-700 dark:text-slate-200 p-2.5 rounded-2xl rounded-tl-none leading-relaxed font-medium\">\r\n \u0986\u09b8\u09b8\u09be\u09b2\u09be\u09ae\u09c1 \u0986\u09b2\u09be\u0987\u0995\u09c1\u09ae\u0964 \u09ad\u09b0\u09cd\u09a4\u09bf, \u09ac\u09c7\u09a4\u09a8 \u09ac\u09be \u09b6\u09be\u0996\u09be \u09b8\u09ae\u09cd\u09aa\u09b0\u09cd\u0995\u09bf\u09a4 \u09af\u09c7\u0995\u09cb\u09a8\u09cb \u09a4\u09a5\u09cd\u09af \u099c\u09be\u09a8\u09a4\u09c7 \u0986\u09ae\u09be\u09af\u09bc \u09a8\u09bf\u099a\u09c7 \u099f\u09be\u0987\u09aa \u0995\u09b0\u09c1\u09a8\u0964\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"p-2 border-t border-slate-50 dark:border-slate-800 flex gap-1.5 overflow-x-auto text-[10px] whitespace-nowrap bg-slate-50\/50 dark:bg-slate-950 shrink-0 nh-chat-scroll\">\r\n <button onclick=\"sendQuickChat('\u09ad\u09b0\u09cd\u09a4\u09bf \u09a4\u09a5\u09cd\u09af')\" class=\"bg-white dark:bg-slate-800 border dark:border-slate-700 px-2.5 py-1.5 rounded-lg text-slate-600 dark:text-slate-300 font-bold\">\u09ad\u09b0\u09cd\u09a4\u09bf \u0995\u09c0\u09ad\u09be\u09ac\u09c7 \u09b9\u09ac\u09cb?<\/button>\r\n <button onclick=\"sendQuickChat('\u09b6\u09be\u0996\u09be \u0993 \u09a0\u09bf\u0995\u09be\u09a8\u09be')\" class=\"bg-white dark:bg-slate-800 border dark:border-slate-700 px-2.5 py-1.5 rounded-lg text-slate-600 dark:text-slate-300 font-bold\">\u09b6\u09be\u0996\u09be \u0995\u09af\u09bc\u099f\u09bf?<\/button>\r\n <button onclick=\"sendQuickChat('\u09ac\u09c7\u09a4\u09a8')\" class=\"bg-white dark:bg-slate-800 border dark:border-slate-700 px-2.5 py-1.5 rounded-lg text-slate-600 dark:text-slate-300 font-bold\">\u09ac\u09c7\u09a4\u09a8 \u09a6\u09bf\u09ac \u0995\u09c0\u09ad\u09be\u09ac\u09c7?<\/button>\r\n <\/div>\r\n \r\n <form onsubmit=\"handleChatSubmit(event)\" class=\"p-2.5 border-t border-slate-200 dark:border-slate-800 flex gap-1.5 items-center shrink-0 bg-white dark:bg-slate-900\">\r\n <input type=\"text\" id=\"chat-input\" placeholder=\"\u09aa\u09cd\u09b0\u09b6\u09cd\u09a8 \u099f\u09be\u0987\u09aa \u0995\u09b0\u09c1\u09a8...\" class=\"flex-1 border border-slate-200 dark:border-slate-700 rounded-xl px-3 py-2.5 text-xs bg-white dark:bg-slate-800 font-medium\">\r\n <button type=\"submit\" class=\"bg-emerald-700 text-white font-bold p-2.5 rounded-xl text-xs hover:bg-emerald-600 transition-colors\">\u2794<\/button>\r\n <\/form>\r\n <\/div>\r\n\r\n <button onclick=\"toggleAIChat()\" class=\"w-14 h-14 rounded-full bg-emerald-700 hover:bg-emerald-600 text-white shadow-2xl flex items-center justify-center text-2xl hover:scale-110 active:scale-95 transition-all border border-emerald-500\/30\" title=\"\u09b8\u09b9\u09be\u09af\u09bc\u09bf\u0995\u09be \u09b9\u09c7\u09b2\u09cd\u09aa \u09a1\u09c7\u09b8\u09cd\u0995\">\r\n \ud83d\udcac\r\n <\/button>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <!-- ================= STREAMING_CHUNK: Global JS Scripts ================= -->\r\n <script>\r\n let currentLang = 'bn';\r\n let currentTheme = 'light';\r\n let currentTab = 'home';\r\n \r\n let tasbeehCount = 0;\r\n let tasbeehGoal = 33;\r\n let tasbeehSoundActive = true;\r\n let selectedDhikr = 'Subhanallah';\r\n let tasbeehHistory = [];\r\n\r\n let activeLat = 24.2513; \r\n let activeLng = 89.9167; \r\n let activeLocationLabel = \"\u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\";\r\n\r\n const districtCoordinates = {\r\n tangail: { bn: \"\u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\", en: \"Sakhipur, Tangail\", lat: 24.2513, lng: 89.9167, offset: 0 },\r\n dhaka: { bn: \"\u09a2\u09be\u0995\u09be\", en: \"Dhaka\", lat: 23.8103, lng: 90.4125, offset: -1 },\r\n chittagong: { bn: \"\u099a\u099f\u09cd\u099f\u0997\u09cd\u09b0\u09be\u09ae\", en: \"Chittagong\", lat: 22.3569, lng: 91.7832, offset: -6 },\r\n sylhet: { bn: \"\u09b8\u09bf\u09b2\u09c7\u099f\", en: \"Sylhet\", lat: 24.8949, lng: 91.8687, offset: -7 },\r\n rajshahi: { bn: \"\u09b0\u09be\u099c\u09b6\u09be\u09b9\u09c0\", en: \"Rajshahi\", lat: 24.3745, lng: 88.6042, offset: 6 }\r\n };\r\n\r\n const baseDhakaTimes = {\r\n fajr: 255, dhuhr: 735, asr: 1005, maghrib: 1130, isha: 1215\r\n };\r\n\r\n let currentPrayerTimes = {\r\n fajr: \"04:15 AM\", dhuhr: \"12:15 PM\", asr: \"04:45 PM\", maghrib: \"06:50 PM\", isha: \"08:15 PM\"\r\n };\r\n\r\n let audioCtx = null;\r\n function playBeep(frequency, duration) {\r\n if (!tasbeehSoundActive) return;\r\n try {\r\n if (!audioCtx) audioCtx = new (window.AudioContext || window.webkitAudioContext)();\r\n const oscillator = audioCtx.createOscillator();\r\n const gainNode = audioCtx.createGain();\r\n \r\n oscillator.type = 'sine';\r\n oscillator.frequency.value = frequency;\r\n duration = duration \/ 1000;\r\n \r\n oscillator.connect(gainNode);\r\n gainNode.connect(audioCtx.destination);\r\n \r\n oscillator.start();\r\n gainNode.gain.setValueAtTime(0.3, audioCtx.currentTime);\r\n gainNode.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + duration);\r\n oscillator.stop(audioCtx.currentTime + duration);\r\n } catch (e) { console.log(e); }\r\n }\r\n\r\n const translationDict = {\r\n bn: {\r\n title: \"\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\",\r\n subtitle: \"\u0986\u09a7\u09c1\u09a8\u09bf\u0995 \u09aa\u09cd\u09b0\u09af\u09c1\u0995\u09cd\u09a4\u09bf\u09b0 \u09b8\u09ae\u09a8\u09cd\u09ac\u09af\u09bc\u09c7 \u0995\u09c1\u09b0\u0986\u09a8 \u0993 \u09b8\u09c1\u09a8\u09cd\u09a8\u09be\u09b9\u09ad\u09bf\u09a4\u09cd\u09a4\u09bf\u0995 \u0986\u09a6\u09b0\u09cd\u09b6 \u0987\u09b8\u09b2\u09be\u09ae\u09c0 \u09b6\u09bf\u0995\u09cd\u09b7\u09be \u09aa\u09cd\u09b0\u09a4\u09bf\u09b7\u09cd\u09a0\u09be\u09a8 \u098f\u09ac\u0982 \u09ac\u09cd\u09af\u09be\u09aa\u0995 \u09b6\u09be\u0996\u09be \u09a8\u09c7\u099f\u0993\u09af\u09bc\u09be\u09b0\u09cd\u0995\",\r\n home: \"\u09b9\u09cb\u09ae\",\r\n gallery: \"\u0997\u09cd\u09af\u09be\u09b2\u09be\u09b0\u09bf \u0993 \u09a8\u09cb\u099f\u09bf\u09b6\",\r\n gallery_m: \"\u0997\u09cd\u09af\u09be\u09b2\u09be\u09b0\u09bf\",\r\n admission: \"\u0985\u09a8\u09b2\u09be\u0987\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf\",\r\n fees: \"\u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7\",\r\n donate: \"\u09a6\u09be\u09a8 \u0995\u09b0\u09c1\u09a8\",\r\n tasbeeh: \"\u09a4\u09be\u09b8\u09ac\u09c0\u09b9\",\r\n ticker_badge: \"\u099a\u09b2\u09a4\u09bf \u09a8\u09cb\u099f\u09bf\u09b6\",\r\n address: \"\ud83d\udccd \u09b8\u09bf\u0995\u09a6\u09be\u09b0 \u09aa\u09be\u09a1\u09bc\u09be, \u09e9\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\u0964\",\r\n notice: \"\u09e8\u09e6\u09e8\u09ec \u09b8\u09be\u09b2\u09c7\u09b0 \u0995\u09bf\u09a4\u09be\u09ac, \u09b9\u09bf\u09ab\u099c, \u09a8\u09be\u099c\u09c7\u09b0\u09be \u0993 \u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u09b6\u09be\u0996\u09be\u09af\u09bc \u09ad\u09b0\u09cd\u09a4\u09bf \u099a\u09b2\u099b\u09c7\",\r\n prayerTimes: \"\u09a8\u09be\u09ae\u09be\u099c\u09c7\u09b0 \u09b8\u09ae\u09af\u09bc\u09b8\u09c2\u099a\u09c0\",\r\n fajr: \"\u09ab\u099c\u09b0\", dhuhr: \"\u09af\u09cb\u09b9\u09b0\", asr: \"\u0986\u09b8\u09b0\", maghrib: \"\u09ae\u09be\u0997\u09b0\u09bf\u09ac\", isha: \"\u098f\u09b6\u09be\",\r\n our_branches_label: \"\u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be \u09b6\u09be\u0996\u09be \u09b8\u09ae\u09c2\u09b9\",\r\n our_branches_title: \"\u0986\u09ae\u09be\u09a6\u09c7\u09b0 \u09e9\u099f\u09bf \u09b8\u09cd\u09ac\u09a4\u09a8\u09cd\u09a4\u09cd\u09b0 \u09a6\u09cd\u09ac\u09c0\u09a8\u09bf \u09b6\u09bf\u0995\u09cd\u09b7\u09be \u09aa\u09cd\u09b0\u09a4\u09bf\u09b7\u09cd\u09a0\u09be\u09a8\",\r\n main_campus_badge: \"\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u0995\u09cd\u09af\u09be\u09ae\u09cd\u09aa\u09be\u09b8\",\r\n branch_main_title: \"\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be (\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be)\",\r\n branch_main_sub: \"\u09ac\u09be\u09b2\u0995 \u09b6\u09be\u0996\u09be (\u0986\u09ac\u09be\u09b8\u09bf\u0995)\",\r\n register_now_btn: \"\u09ad\u09b0\u09cd\u09a4\u09bf \u09ab\u09b0\u09ae \u2794\",\r\n new_branch_badge: \"\u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be\",\r\n branch_kb_title: \"\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be (\u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be)\",\r\n branch_kb_sub: \"\u09ac\u09be\u09b2\u0995 \u09b6\u09be\u0996\u09be (\u0986\u09ac\u09be\u09b8\u09bf\u0995\/\u0985\u09a8\u09be\u09ac\u09be\u09b8\u09bf\u0995)\",\r\n female_branch_badge: \"\u09ae\u09b9\u09bf\u09b2\u09be \u09b6\u09be\u0996\u09be\",\r\n branch_female_title: \"\u0986\u099b\u09bf\u09af\u09bc\u09be \u0987\u0989\u09b8\u09c1\u09ab \u09ae\u09b9\u09bf\u09b2\u09be \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\",\r\n branch_female_sub: \"\u09b8\u09cd\u09ac\u09a4\u09a8\u09cd\u09a4\u09cd\u09b0 \u09ac\u09be\u09b2\u09bf\u0995\u09be \u09b6\u09be\u0996\u09be (\u0986\u09ac\u09be\u09b8\u09bf\u0995 \u0993 \u0985\u09a8\u09be\u09ac\u09be\u09b8\u09bf\u0995)\",\r\n notice_board_title: \"\u098f\u0995\u09be\u09a1\u09c7\u09ae\u09bf\u0995 \u09a8\u09cb\u099f\u09bf\u09b6 \u09ac\u09cb\u09b0\u09cd\u09a1\",\r\n photo_gallery_title: \"\u09ab\u099f\u09cb \u0997\u09cd\u09af\u09be\u09b2\u09be\u09b0\u09bf\",\r\n admission_portal_title: \"\u0985\u09a8\u09b2\u09be\u0987\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf \u09ab\u09b0\u09ae (\u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09ac\u09b0\u09cd\u09b7 \u09e8\u09e6\u09e8\u09ec)\",\r\n admission_portal_sub: \"\u09ad\u09b0\u09cd\u09a4\u09bf\u09b0 \u099c\u09a8\u09cd\u09af \u09b8\u09a0\u09bf\u0995 \u0993 \u09a8\u09bf\u09b0\u09cd\u09ad\u09c1\u09b2 \u09a4\u09a5\u09cd\u09af \u09a6\u09bf\u09af\u09bc\u09c7 \u0986\u09ac\u09c7\u09a6\u09a8\u09aa\u09a4\u09cd\u09b0\u099f\u09bf \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8 \u0995\u09b0\u09c1\u09a8\u0964\",\r\n step_1: \"\u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf\u0997\u09a4 \u09a4\u09a5\u09cd\u09af\", step_2: \"\u098f\u0995\u09be\u09a1\u09c7\u09ae\u09bf\u0995 \u09a4\u09a5\u09cd\u09af\", step_3: \"\u0985\u09ad\u09bf\u09ad\u09be\u09ac\u0995 \u09a4\u09a5\u09cd\u09af\",\r\n f_std_name: \"\u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09b0\u09cd\u09a5\u09c0\u09b0 \u09aa\u09c1\u09b0\u09cb \u09a8\u09be\u09ae*\", f_birth_date: \"\u099c\u09a8\u09cd\u09ae \u09a4\u09be\u09b0\u09bf\u0996*\", f_gender: \"\u09b2\u09bf\u0999\u09cd\u0997*\", f_blood: \"\u09b0\u0995\u09cd\u09a4\u09c7\u09b0 \u0997\u09cd\u09b0\u09c1\u09aa\",\r\n f_branch: \"\u09aa\u099b\u09a8\u09cd\u09a6\u09c7\u09b0 \u09b6\u09be\u0996\u09be*\", f_dept: \"\u0986\u09ac\u09c7\u09a6\u09a8\u0995\u09c3\u09a4 \u09ac\u09bf\u09ad\u09be\u0997*\", f_type: \"\u09ad\u09b0\u09cd\u09a4\u09bf\u09b0 \u09a7\u09b0\u09a8*\", f_prev_edu: \"\u09aa\u09c2\u09b0\u09cd\u09ac\u09ac\u09b0\u09cd\u09a4\u09c0 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\/\u09b8\u09cd\u0995\u09c1\u09b2\",\r\n f_father: \"\u09aa\u09bf\u09a4\u09be\u09b0 \u09a8\u09be\u09ae*\", f_phone: \"\u09ae\u09cb\u09ac\u09be\u0987\u09b2 \u09a8\u09ae\u09cd\u09ac\u09b0*\", f_address: \"\u09ac\u09b0\u09cd\u09a4\u09ae\u09be\u09a8 \u09a0\u09bf\u0995\u09be\u09a8\u09be*\",\r\n donate_title: \"\u09a6\u09be\u09a8 \u0995\u09b0\u09c1\u09a8 \u0993 \u09a6\u09cd\u09ac\u09c0\u09a8\u09bf \u0995\u09be\u099c\u09c7 \u0985\u0982\u09b6 \u09a8\u09bf\u09a8\",\r\n donate_sub: \"\u0986\u09aa\u09a8\u09be\u09b0 \u09b9\u09be\u09b2\u09be\u09b2 \u0993 \u0995\u09b7\u09cd\u099f\u09be\u09b0\u09cd\u099c\u09bf\u09a4 \u0989\u09aa\u09be\u09b0\u09cd\u099c\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\u09b0 \u09b2\u09bf\u09b2\u09cd\u09b2\u09be\u09b9 \u09ab\u09be\u09a8\u09cd\u09a1, \u0995\u09b0\u09cd\u099c\u09c7 \u09b9\u09be\u09b8\u09be\u09a8\u09be \u0985\u09a5\u09ac\u09be \u09a8\u09bf\u09b0\u09cd\u09ae\u09be\u09a3 \u0995\u09be\u099c\u09c7 \u09a6\u09be\u09a8 \u0995\u09b0\u09a4\u09c7 \u09aa\u09be\u09b0\u09c7\u09a8\u0964\",\r\n bank_donation: \"\u09ac\u09cd\u09af\u09be\u0982\u0995 \u0993 \u09b8\u09b0\u09be\u09b8\u09b0\u09bf \u09b9\u09bf\u09b8\u09be\u09ac\",\r\n donate_form_title: \"\u09a8\u09bf\u09b0\u09be\u09aa\u09a6 \u0985\u09a8\u09b2\u09be\u0987\u09a8 \u099a\u09c7\u0995\u0986\u0989\u099f \u09a1\u09c7\u09ae\u09cb\",\r\n fees_title: \"\u0985\u09a8\u09b2\u09be\u0987\u09a8\u09c7 \u09ae\u09be\u09b8\u09bf\u0995 \u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7\",\r\n fees_sub: \"\u099b\u09be\u09a4\u09cd\u09b0-\u099b\u09be\u09a4\u09cd\u09b0\u09c0\u09a6\u09c7\u09b0 \u09ae\u09be\u09b8\u09bf\u0995 \u09ac\u09c7\u09a4\u09a8, \u0986\u09ac\u09be\u09b8\u09bf\u0995 \u09ab\u09bf \u098f\u09ac\u0982 \u0985\u09a8\u09cd\u09af\u09be\u09a8\u09cd\u09af \u09ac\u0995\u09c7\u09df\u09be \u098f\u0996\u09a8 \u0998\u09b0\u09c7 \u09ac\u09b8\u09c7\u0987 \u09ac\u09bf\u0995\u09be\u09b6 \u09ac\u09be \u09a8\u0997\u09a6\u09c7\u09b0 \u09ae\u09be\u09a7\u09cd\u09af\u09ae\u09c7 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7 \u0995\u09b0\u09c1\u09a8\u0964\",\r\n fees_chart: \"\u09ae\u09be\u09b8\u09bf\u0995 \u09ac\u09c7\u09a4\u09a8\u09c7\u09b0 \u09a4\u09be\u09b2\u09bf\u0995\u09be (\u09a4\u09a5\u09cd\u09af\u09b8\u09c2\u09a4\u09cd\u09b0)\",\r\n pay_form_title: \"\u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7 \u09ab\u09b0\u09cd\u09ae\",\r\n tasbeeh_head: \"\u09b8\u09cd\u09ae\u09be\u09b0\u09cd\u099f \u09a1\u09bf\u099c\u09bf\u099f\u09be\u09b2 \u09a4\u09be\u09b8\u09ac\u09c0\u09b9 \u0995\u09be\u0989\u09a8\u09cd\u099f\u09be\u09b0\",\r\n tasbeeh_sub: \"\u0995\u09cb\u09a8\u09cb \u09ac\u09be\u09b9\u09cd\u09af\u09bf\u0995 \u09b6\u09ac\u09cd\u09a6 \u09ab\u09be\u0987\u09b2 \u099b\u09be\u09a1\u09bc\u09be\u0987 \u09b2\u09be\u0987\u09ad \u09b8\u09be\u0989\u09a8\u09cd\u09a1 \u0987\u09ab\u09c7\u0995\u09cd\u099f \u0993 \u09ad\u09be\u0987\u09ac\u09cd\u09b0\u09c7\u09b6\u09a8 \u0985\u09a8\u09c1\u09ad\u09c2\u09a4\u09bf \u09b8\u09b9 \u099c\u09bf\u0995\u09bf\u09b0 \u099f\u09cd\u09b0\u09cd\u09af\u09be\u0995\u09be\u09b0\u0964\",\r\n t_reset: \"\u0995\u09be\u0989\u09a8\u09cd\u099f\u09be\u09b0 \u09b0\u09bf\u09b8\u09c7\u099f\",\r\n },\r\n en: {\r\n title: \"Darul Uloom Nurul Haramain Madrasah\",\r\n subtitle: \"An ideal Islamic educational institution combining modern technology with Quran and Sunnah, featuring a comprehensive branch network.\",\r\n home: \"Home\",\r\n gallery: \"Gallery & Notices\",\r\n gallery_m: \"Gallery\",\r\n admission: \"Admission\",\r\n fees: \"Pay Fees\",\r\n donate: \"Donate\",\r\n tasbeeh: \"Tasbeeh\",\r\n ticker_badge: \"Notice\",\r\n address: \"\ud83d\udccd Sikdar Para, Ward 3, Sakhipur Pourashava, Sakhipur, Tangail.\",\r\n notice: \"Admissions open for Hifz, Noorani, and Kitab sections for 2026!\",\r\n prayerTimes: \"Prayer Schedule\",\r\n fajr: \"Fajr\", dhuhr: \"Dhuhr\", asr: \"Asr\", maghrib: \"Maghrib\", isha: \"Isha\",\r\n our_branches_label: \"Our Branches\",\r\n our_branches_title: \"Our 3 Specialized Islamic Campuses\",\r\n main_campus_badge: \"Main Campus\",\r\n branch_main_title: \"Darul Uloom Nurul Haramain (Main Campus)\",\r\n branch_main_sub: \"Boys Campus (Residential)\",\r\n register_now_btn: \"Apply Now \u2794\",\r\n new_branch_badge: \"Kachabazar Branch\",\r\n branch_kb_title: \"Darul Uloom Nurul Haramain (Kachabazar Campus)\",\r\n branch_kb_sub: \"Boys Branch (Residential\/Day)\",\r\n female_branch_badge: \"Female Campus\",\r\n branch_female_title: \"Asiya Yusuf Female Madrasah\",\r\n branch_female_sub: \"Dedicated Female Branch (Residential & Day)\",\r\n notice_board_title: \"Academic Notice Board\",\r\n photo_gallery_title: \"Our Photo Gallery\",\r\n admission_portal_title: \"Online Admission Form (2026)\",\r\n admission_portal_sub: \"Fill up all mandatory credentials with absolute precision.\",\r\n step_1: \"Personal Info\", step_2: \"Academic Info\", step_3: \"Guardian Contact\",\r\n f_std_name: \"Student Full Name*\", f_birth_date: \"Date of Birth*\", f_gender: \"Gender*\", f_blood: \"Blood Group\",\r\n f_branch: \"Preferred Branch*\", f_dept: \"Applied Department*\", f_type: \"Admission Type*\", f_prev_edu: \"Previous School\",\r\n f_father: \"Father's Name*\", f_phone: \"Parent Mobile*\", f_address: \"Present Address*\",\r\n donate_title: \"Support the Cause of Deen - Donate\",\r\n donate_sub: \"Securely fund orphan scholarships, infrastructure development, and welfare missions.\",\r\n bank_donation: \"Bank & Direct Accounts\",\r\n donate_form_title: \"Secure Online Checkout\",\r\n fees_title: \"Online Monthly Fee Payment\",\r\n fees_sub: \"Pay student tuition fees, boarding charges, and dues easily using bKash\/Nagad from home.\",\r\n fees_chart: \"Monthly Fee Structure (Reference)\",\r\n pay_form_title: \"Fee Payment Form\",\r\n tasbeeh_head: \"Interactive Smart Tasbeeh\",\r\n tasbeeh_sub: \"Maintain dhikr targets seamlessly using digital ring haptics\",\r\n t_reset: \"Reset Counter\",\r\n }\r\n };\r\n\r\n window.onload = function() {\r\n setLanguage('bn');\r\n loadSavedLocation();\r\n loadMockNotices();\r\n loadMockGallery();\r\n startPrayerCountdown();\r\n cycleHadithQuotes();\r\n updateTasbeehHistoryUI();\r\n };\r\n\r\n function setLanguage(lang) {\r\n currentLang = lang;\r\n document.querySelectorAll('[data-translate]').forEach(el => {\r\n const key = el.getAttribute('data-translate');\r\n if (translationDict[lang][key]) el.innerText = translationDict[lang][key];\r\n });\r\n\r\n const bBn = document.getElementById('lang-btn-bn');\r\n const bEn = document.getElementById('lang-btn-en');\r\n \r\n if (bBn && bEn) {\r\n if (lang === 'bn') {\r\n bBn.className = \"px-3 py-1 rounded-md text-xs transition-all bg-amber-500 text-emerald-950 font-bold shadow-sm\";\r\n bEn.className = \"px-3 py-1 rounded-md text-xs transition-all hover:bg-emerald-800\/30 text-white font-semibold\";\r\n } else {\r\n bBn.className = \"px-3 py-1 rounded-md text-xs transition-all hover:bg-emerald-800\/30 text-white font-semibold\";\r\n bEn.className = \"px-3 py-1 rounded-md text-xs transition-all bg-amber-500 text-emerald-950 font-bold shadow-sm\";\r\n }\r\n }\r\n updateCountdownTimer();\r\n }\r\n\r\n function toggleDarkMode() {\r\n const html = document.documentElement;\r\n if (html.classList.contains('dark')) {\r\n html.classList.remove('dark');\r\n showToast(\"\u09b2\u09be\u0987\u099f \u09a5\u09bf\u09ae \u09b8\u0995\u09cd\u09b0\u09bf\u09af\u09bc\");\r\n } else {\r\n html.classList.add('dark');\r\n showToast(\"\u09a1\u09be\u09b0\u09cd\u0995 \u09a5\u09bf\u09ae \u09b8\u0995\u09cd\u09b0\u09bf\u09af\u09bc\");\r\n }\r\n }\r\n\r\n function showToast(text) {\r\n const toast = document.getElementById('nh-toast');\r\n const toastText = document.getElementById('nh-toast-text');\r\n if (toast && toastText) {\r\n toastText.innerText = text;\r\n toast.classList.remove('hidden');\r\n setTimeout(() => toast.classList.add('hidden'), 3000);\r\n }\r\n }\r\n\r\n function switchTab(tabId) {\r\n currentTab = tabId;\r\n document.querySelectorAll('.tab-content').forEach(el => el.classList.add('hidden'));\r\n \r\n const selectedSection = document.getElementById(`page-${tabId}`);\r\n if (selectedSection) selectedSection.classList.remove('hidden');\r\n\r\n \/\/ Sync Desktop tabs\r\n document.querySelectorAll('.nav-tab').forEach(el => {\r\n el.className = \"nav-tab font-black px-4 py-2.5 rounded-xl transition-all duration-300 flex items-center gap-1.5 text-slate-700 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-800\";\r\n });\r\n const desktopBtn = document.getElementById(`tab-btn-${tabId}`);\r\n if (desktopBtn) {\r\n desktopBtn.className = \"nav-tab font-black px-4 py-2.5 rounded-xl transition-all duration-300 flex items-center gap-1.5 border border-emerald-600 dark:border-emerald-500 text-white bg-emerald-700 dark:bg-emerald-600 shadow-md transform scale-105\";\r\n }\r\n\r\n \/\/ Sync Mobile Bottom Nav\r\n document.querySelectorAll('.mobile-tab').forEach(el => {\r\n el.className = \"mobile-tab flex flex-col items-center gap-1 text-[10px] text-slate-500 font-bold min-w-[4rem] transition-all\";\r\n });\r\n const mobileBtn = document.getElementById(`m-tab-${tabId}`);\r\n if (mobileBtn) {\r\n mobileBtn.className = \"mobile-tab flex flex-col items-center gap-1 text-[10px] text-emerald-700 dark:text-emerald-400 font-black min-w-[4rem] transform scale-110\";\r\n }\r\n\r\n window.scrollTo({ top: 0, behavior: 'smooth' });\r\n }\r\n\r\n \/\/ ---------- Location & Prayers System ----------\r\n function loadSavedLocation() {\r\n const savedLoc = localStorage.getItem('nh_user_location');\r\n if (savedLoc) {\r\n try {\r\n const locData = JSON.parse(savedLoc);\r\n activeLat = locData.lat;\r\n activeLng = locData.lng;\r\n activeLocationLabel = locData.label;\r\n const selector = document.getElementById('district-selector');\r\n if (selector && locData.districtKey) selector.value = locData.districtKey;\r\n fetchPrayerTimes(activeLat, activeLng, activeLocationLabel);\r\n } catch (e) { calculateOfflineTimes('tangail'); }\r\n } else calculateOfflineTimes('tangail');\r\n }\r\n\r\n function calculateOfflineTimes(districtKey) {\r\n const data = districtCoordinates[districtKey];\r\n if (!data) return;\r\n activeLat = data.lat; activeLng = data.lng;\r\n activeLocationLabel = currentLang === 'bn' ? data.bn : data.en;\r\n const formatted = {};\r\n for (const prayer in baseDhakaTimes) {\r\n const totalMins = baseDhakaTimes[prayer] + data.offset;\r\n formatted[prayer] = getMinutesString(totalMins);\r\n }\r\n updatePrayerTimesUI(formatted, activeLocationLabel);\r\n }\r\n\r\n function handleDistrictChange() {\r\n const selector = document.getElementById('district-selector');\r\n if (selector) calculateOfflineTimes(selector.value);\r\n }\r\n\r\n function detectMyLocation() {\r\n if (!navigator.geolocation) return showToast(\"\u099c\u09bf\u09aa\u09bf\u098f\u09b8 \u09b8\u09ae\u09b0\u09cd\u09a5\u09a8 \u0995\u09b0\u09c7 \u09a8\u09be\u0964\");\r\n showToast(\"\u0985\u09ac\u09b8\u09cd\u09a5\u09be\u09a8 \u0996\u09cb\u0981\u099c\u09be \u09b9\u099a\u09cd\u099b\u09c7...\");\r\n navigator.geolocation.getCurrentPosition(async (position) => {\r\n const lat = position.coords.latitude;\r\n const lng = position.coords.longitude;\r\n let locationName = \"\u0986\u09ae\u09be\u09b0 \u0985\u09ac\u09b8\u09cd\u09a5\u09be\u09a8\";\r\n try {\r\n const res = await fetch(`https:\/\/nominatim.openstreetmap.org\/reverse?format=json&lat=${lat}&lon=${lng}&zoom=12`);\r\n if (res.ok) {\r\n const addr = await res.json();\r\n locationName = addr.address.city || addr.address.town || addr.address.county || locationName;\r\n }\r\n } catch (e) {}\r\n fetchPrayerTimes(lat, lng, locationName);\r\n }, () => showToast(\"\u099c\u09bf\u09aa\u09bf\u098f\u09b8 \u09b8\u09bf\u0997\u09a8\u09cd\u09af\u09be\u09b2 \u09aa\u09be\u0993\u09af\u09bc\u09be \u09af\u09be\u09af\u09bc\u09a8\u09bf\u0964\"), { enableHighAccuracy: true, timeout: 8000 });\r\n }\r\n\r\n async function fetchPrayerTimes(lat, lng, label) {\r\n try {\r\n const res = await fetch(`https:\/\/api.aladhan.com\/v1\/timings?latitude=${lat}&longitude=${lng}&method=1`);\r\n if (!res.ok) throw new Error(\"API failed\");\r\n const timings = (await res.json()).data.timings;\r\n const formatted = {\r\n fajr: convert24To12(timings.Fajr), dhuhr: convert24To12(timings.Dhuhr),\r\n asr: convert24To12(timings.Asr), maghrib: convert24To12(timings.Maghrib), isha: convert24To12(timings.Isha)\r\n };\r\n updatePrayerTimesUI(formatted, label);\r\n } catch (e) { calculateOfflineTimes('tangail'); }\r\n }\r\n\r\n function convert24To12(timeStr) {\r\n const parts = timeStr.split(':');\r\n let hrs = parseInt(parts[0], 10);\r\n const period = hrs >= 12 ? \"PM\" : \"AM\";\r\n hrs = hrs % 12; if (hrs === 0) hrs = 12;\r\n return `${hrs.toString().padStart(2, '0')}:${parts[1]} ${period}`;\r\n }\r\n\r\n function getMinutesString(totalMins) {\r\n let hrs = Math.floor(totalMins \/ 60);\r\n let mins = totalMins % 60;\r\n const period = hrs >= 12 ? \"PM\" : \"AM\";\r\n hrs = hrs % 12; if (hrs === 0) hrs = 12;\r\n return `${hrs.toString().padStart(2, '0')}:${mins.toString().padStart(2, '0')} ${period}`;\r\n }\r\n\r\n function updatePrayerTimesUI(timings, label) {\r\n currentPrayerTimes = timings;\r\n const displayMap = { 'time-fajr': timings.fajr, 'time-dhuhr': timings.dhuhr, 'time-asr': timings.asr, 'time-maghrib': timings.maghrib, 'time-isha': timings.isha };\r\n for (const id in displayMap) {\r\n const el = document.getElementById(id);\r\n if (el) el.innerText = currentLang === 'bn' ? toBengaliNumberStr(displayMap[id]) : displayMap[id];\r\n }\r\n const locDisplay = document.getElementById('active-location-display');\r\n if (locDisplay) locDisplay.innerText = label;\r\n updateCountdownTimer();\r\n }\r\n\r\n function toBengaliNumberStr(englishStr) {\r\n const bnDigits = ['\u09e6', '\u09e7', '\u09e8', '\u09e9', '\u09ea', '\u09eb', '\u09ec', '\u09ed', '\u09ee', '\u09ef'];\r\n return englishStr.replace(\/[0-9]\/g, digit => bnDigits[parseInt(digit)]);\r\n }\r\n\r\n function parseTimeToMinutes(timeStr) {\r\n const cleanStr = timeStr.replace(\/[\u09e6-\u09ef]\/g, d => '\u09e6\u09e7\u09e8\u09e9\u09ea\u09eb\u09ec\u09ed\u09ee\u09ef'.indexOf(d));\r\n const parts = cleanStr.trim().split(' ');\r\n const hm = parts[0].split(':');\r\n let hour = parseInt(hm[0], 10);\r\n const isPM = parts[1] && parts[1].toUpperCase() === \"PM\";\r\n if (isPM && hour < 12) hour += 12;\r\n if (!isPM && hour === 12) hour = 0;\r\n return hour * 60 + parseInt(hm[1], 10);\r\n }\r\n\r\n function updateCountdownTimer() {\r\n const now = new Date();\r\n const nowMins = now.getHours() * 60 + now.getMinutes();\r\n const schedule = {\r\n fajr: parseTimeToMinutes(currentPrayerTimes.fajr), dhuhr: parseTimeToMinutes(currentPrayerTimes.dhuhr),\r\n asr: parseTimeToMinutes(currentPrayerTimes.asr), maghrib: parseTimeToMinutes(currentPrayerTimes.maghrib), isha: parseTimeToMinutes(currentPrayerTimes.isha)\r\n };\r\n let nextName = \"Fajr\", diff = 0;\r\n ['p-fajr', 'p-dhuhr', 'p-asr', 'p-maghrib', 'p-isha'].forEach(p => {\r\n const el = document.getElementById(p);\r\n if (el) el.className = \"p-3 rounded-2xl bg-slate-50 dark:bg-slate-800\/50 transition-colors\";\r\n });\r\n\r\n if (nowMins < schedule.fajr) { nextName = currentLang === 'bn' ? \"\u09ab\u099c\u09b0\" : \"Fajr\"; diff = schedule.fajr - nowMins; highlightPrayerCard('p-fajr'); }\r\n else if (nowMins < schedule.dhuhr) { nextName = currentLang === 'bn' ? \"\u09af\u09cb\u09b9\u09b0\" : \"Dhuhr\"; diff = schedule.dhuhr - nowMins; highlightPrayerCard('p-dhuhr'); }\r\n else if (nowMins < schedule.asr) { nextName = currentLang === 'bn' ? \"\u0986\u09b8\u09b0\" : \"Asr\"; diff = schedule.asr - nowMins; highlightPrayerCard('p-asr'); }\r\n else if (nowMins < schedule.maghrib) { nextName = currentLang === 'bn' ? \"\u09ae\u09be\u0997\u09b0\u09bf\u09ac\" : \"Maghrib\"; diff = schedule.maghrib - nowMins; highlightPrayerCard('p-maghrib'); }\r\n else if (nowMins < schedule.isha) { nextName = currentLang === 'bn' ? \"\u098f\u09b6\u09be\" : \"Isha\"; diff = schedule.isha - nowMins; highlightPrayerCard('p-isha'); }\r\n else { nextName = currentLang === 'bn' ? \"\u09ab\u099c\u09b0\" : \"Fajr\"; diff = (1440 - nowMins) + schedule.fajr; highlightPrayerCard('p-fajr'); }\r\n\r\n const h = Math.floor(diff \/ 60), m = diff % 60;\r\n const str = currentLang === 'bn' ? `${toBengaliNumberStr(h.toString())} \u0998\u09a8\u09cd\u099f\u09be ${toBengaliNumberStr(m.toString())} \u09ae\u09bf\u09a8\u09bf\u099f \u09ac\u09be\u0995\u09bf` : `${h}h ${m}m remaining`;\r\n const titleEl = document.getElementById('next-prayer-title');\r\n const timerEl = document.getElementById('prayer-countdown-timer');\r\n if(titleEl) titleEl.innerText = currentLang === 'bn' ? `\u09aa\u09b0\u09ac\u09b0\u09cd\u09a4\u09c0 \u09a8\u09be\u09ae\u09be\u099c: ${nextName}` : `Next Prayer: ${nextName}`;\r\n if(timerEl) timerEl.innerText = str;\r\n }\r\n\r\n function highlightPrayerCard(cardId) {\r\n const el = document.getElementById(cardId);\r\n if (el) el.className = \"p-3 rounded-2xl bg-emerald-500\/10 border border-emerald-500\/30 transition-colors shadow-sm animate-pulse\";\r\n }\r\n\r\n function startPrayerCountdown() { setInterval(updateCountdownTimer, 30000); updateCountdownTimer(); }\r\n\r\n \/\/ ---------- Quotes Slider ----------\r\n const hadithQuotes = [\r\n { bn: '\"\u09a4\u09cb\u09ae\u09be\u09a6\u09c7\u09b0 \u09ae\u09a7\u09cd\u09af\u09c7 \u09b8\u09b0\u09cd\u09ac\u09cb\u09a4\u09cd\u09a4\u09ae \u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf \u09b8\u09c7\u0987, \u09af\u09c7 \u09a8\u09bf\u099c\u09c7 \u0995\u09c1\u09b0\u0986\u09a8 \u09b6\u09bf\u0996\u09c7 \u098f\u09ac\u0982 \u0985\u09aa\u09b0\u0995\u09c7 \u09b6\u09bf\u0995\u09cd\u09b7\u09be \u09a6\u09c7\u09af\u09bc\u0964\"', source_bn: \"\u2014 \u09b8\u09b9\u09c0\u09b9 \u09ac\u09c1\u0996\u09be\u09b0\u09c0\", en: '\"The best among you are those who learn the Qur\\'an and teach it.\"', source_en: \"\u2014 Sahih al-Bukhari\" },\r\n { bn: '\"\u09a6\u09cd\u09ac\u09c0\u09a8 \u09b9\u09b2\u09cb \u09b6\u09c1\u09ad\u0995\u09be\u09ae\u09a8\u09be\u0964\"', source_bn: \"\u2014 \u09b8\u09b9\u09c0\u09b9 \u09ae\u09c1\u09b8\u09b2\u09bf\u09ae\", en: '\"The religion is sincerity.\"', source_en: \"\u2014 Sahih Muslim\" },\r\n { bn: '\"\u09af\u09c7 \u09ac\u09cd\u09af\u0995\u09cd\u09a4\u09bf \u09a6\u09cd\u09ac\u09c0\u09a8\u09bf \u0987\u09b2\u09ae \u0985\u09a8\u09cd\u09ac\u09c7\u09b7\u09a3\u09c7 \u09ac\u09c7\u09b0 \u09b9\u09af\u09bc, \u09ab\u09bf\u09b0\u09c7 \u0986\u09b8\u09be \u09aa\u09b0\u09cd\u09af\u09a8\u09cd\u09a4 \u09b8\u09c7 \u0986\u09b2\u09cd\u09b2\u09be\u09b9\u09b0 \u09b0\u09be\u09b8\u09cd\u09a4\u09be\u09af\u09bc \u09a5\u09be\u0995\u09c7\u0964\"', source_bn: \"\u2014 \u09a4\u09bf\u09b0\u09ae\u09bf\u09af\u09c0\", en: '\"He who goes forth in search of knowledge is in the path of Allah until he returns.\"', source_en: \"\u2014 At-Tirmidhi\" }\r\n ];\r\n let currentQuoteIndex = 0;\r\n function cycleHadithQuotes() {\r\n setInterval(() => {\r\n currentQuoteIndex = (currentQuoteIndex + 1) % hadithQuotes.length;\r\n const qt = document.getElementById('quote-text'), qs = document.getElementById('quote-source');\r\n if (qt && qs) {\r\n qt.style.opacity = '0';\r\n setTimeout(() => {\r\n qt.innerText = currentLang === 'bn' ? hadithQuotes[currentQuoteIndex].bn : hadithQuotes[currentQuoteIndex].en;\r\n qs.innerText = currentLang === 'bn' ? hadithQuotes[currentQuoteIndex].source_bn : hadithQuotes[currentQuoteIndex].source_en;\r\n qt.style.opacity = '1';\r\n }, 500);\r\n }\r\n }, 8000);\r\n }\r\n\r\n \/\/ ---------- Mock Data Loading ----------\r\n function loadMockNotices() {\r\n const mockNotices = [\r\n { id: 1, date: \"\u09e7\u09e6 \u099c\u09c1\u09b2\u09be\u0987, \u09e8\u09e6\u09e8\u09ec\", title_bn: \"\u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09ac\u09b0\u09cd\u09b7 \u09e8\u09e6\u09e8\u09ec-\u098f\u09b0 \u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be\u09af\u09bc \u09ad\u09b0\u09cd\u09a4\u09bf \u09ac\u09bf\u099c\u09cd\u099e\u09aa\u09cd\u09a4\u09bf\", desc_bn: \"\u09b9\u09bf\u09ab\u099c \u0993 \u0995\u09bf\u09a4\u09be\u09ac \u09ac\u09bf\u09ad\u09be\u0997\u09c7\u09b0 \u099c\u09a8\u09cd\u09af \u09b8\u09c0\u09ae\u09bf\u09a4 \u09b8\u0982\u0996\u09cd\u09af\u0995 \u09b8\u09bf\u099f \u0996\u09be\u09b2\u09bf \u0986\u099b\u09c7\u0964 \u0985\u09a8\u09a4\u09bf\u09ac\u09bf\u09b2\u09ae\u09cd\u09ac\u09c7 \u0986\u09ac\u09c7\u09a6\u09a8 \u0995\u09b0\u09c1\u09a8\u0964\", title_en: \"Admission Notice 2026\", desc_en: \"Limited seats available for Hifz & Kitab sections.\" },\r\n { id: 2, date: \"\u09e6\u09eb \u099c\u09c1\u09b2\u09be\u0987, \u09e8\u09e6\u09e8\u09ec\", title_bn: \"\u0986\u099b\u09bf\u09af\u09bc\u09be \u0987\u0989\u09b8\u09c1\u09ab \u09ae\u09b9\u09bf\u09b2\u09be \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\u09b0 \u0986\u09ac\u09be\u09b8\u09bf\u0995 \u09b8\u09bf\u099f \u09ac\u09c1\u0995\u09bf\u0982\", desc_bn: \"\u0986\u09ac\u09be\u09b8\u09bf\u0995 \u099b\u09be\u09a4\u09cd\u09b0\u09c0\u09a6\u09c7\u09b0 \u09a8\u09bf\u09b0\u09be\u09aa\u09a4\u09cd\u09a4\u09be\u09b0 \u09b8\u09b0\u09cd\u09ac\u09cb\u099a\u09cd\u099a \u09a4\u09a6\u09be\u09b0\u0995\u09bf \u09ac\u09cd\u09af\u09ac\u09b8\u09cd\u09a5\u09be \u0993 \u09b9\u09cb\u09b8\u09cd\u099f\u09c7\u09b2 \u09b8\u0982\u0995\u09cd\u09b0\u09be\u09a8\u09cd\u09a4 \u09a4\u09a5\u09cd\u09af\u0964\", title_en: \"Female Campus Booking\", desc_en: \"Hostel facility updates for residential female students.\" }\r\n ];\r\n const container = document.getElementById('notice-container');\r\n if (!container) return;\r\n container.innerHTML = '';\r\n mockNotices.forEach(notice => {\r\n container.innerHTML += `\r\n <div class=\"p-5 bg-white dark:bg-slate-900 border border-slate-100 dark:border-slate-800 rounded-3xl hover:border-emerald-500\/30 transition-all shadow-md flex gap-4 items-start notice-card\">\r\n <div class=\"bg-amber-100 dark:bg-amber-950\/30 p-3 rounded-2xl text-lg text-amber-600 font-bold text-center w-16 shrink-0 leading-tight\">\r\n \ud83d\udcc5<br><span class=\"text-[9px] uppercase font-bold text-slate-500\">${notice.date.split(',')[0]}<\/span>\r\n <\/div>\r\n <div>\r\n <span class=\"text-[10px] font-bold text-emerald-600 block mb-1\">#NH-${notice.id}<\/span>\r\n <h4 class=\"font-serif font-bold text-base text-slate-800 dark:text-slate-100 mb-1.5\">${currentLang === 'bn' ? notice.title_bn : notice.title_en}<\/h4>\r\n <p class=\"text-xs text-slate-500 dark:text-slate-400\">${currentLang === 'bn' ? notice.desc_bn : notice.desc_en}<\/p>\r\n <\/div>\r\n <\/div>`;\r\n });\r\n }\r\n\r\n function filterNotices() {\r\n const v = document.getElementById('notice-search').value.toLowerCase();\r\n document.querySelectorAll('.notice-card').forEach(c => c.style.display = c.innerText.toLowerCase().includes(v) ? 'flex' : 'none');\r\n }\r\n\r\n function loadMockGallery() {\r\n const galleryImages = [\r\n { title: \"\u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be \u09ad\u09ac\u09a8\", url: \"https:\/\/images.unsplash.com\/photo-1585036156171-384164a8c675?auto=format&fit=crop&w=600&q=80\" },\r\n { title: \"\u09b9\u09bf\u09ab\u099c \u0995\u09cd\u09b2\u09be\u09b8 \u09b0\u09c1\u09ae\", url: \"https:\/\/images.unsplash.com\/photo-1609599006353-e629aaab31fc?auto=format&fit=crop&w=600&q=80\" },\r\n { title: \"\u09ae\u09b8\u099c\u09bf\u09a6 \u09aa\u09cd\u09b0\u09be\u0999\u09cd\u0997\u09a3\", url: \"https:\/\/images.unsplash.com\/photo-1564121211835-e88c852648ab?auto=format&fit=crop&w=600&q=80\" },\r\n { title: \"\u0987\u09b8\u09b2\u09be\u09ae\u09bf\u0995 \u09b6\u09bf\u09b2\u09cd\u09aa\", url: \"https:\/\/images.unsplash.com\/photo-1584551246679-0daf3d275d05?auto=format&fit=crop&w=600&q=80\" }\r\n ];\r\n const grid = document.getElementById('gallery-grid');\r\n if (!grid) return;\r\n grid.innerHTML = '';\r\n galleryImages.forEach(img => {\r\n grid.innerHTML += `\r\n <div class=\"relative group rounded-2xl overflow-hidden cursor-pointer shadow-md\" onclick=\"openGalleryModal('${img.url}')\">\r\n <img decoding=\"async\" src=\"${img.url}\" alt=\"${img.title}\" class=\"w-full h-32 md:h-48 object-cover group-hover:scale-110 transition-transform duration-300\">\r\n <div class=\"absolute inset-0 bg-gradient-to-t from-black\/80 via-transparent to-transparent opacity-0 group-hover:opacity-100 transition-opacity flex items-end p-3\">\r\n <span class=\"text-white text-xs font-bold font-serif\">${img.title}<\/span>\r\n <\/div>\r\n <\/div>`;\r\n });\r\n }\r\n\r\n function openGalleryModal(url) {\r\n const m = document.getElementById('gallery-modal'), i = document.getElementById('modal-image');\r\n if (m && i) { i.src = url; m.classList.remove('hidden'); m.classList.add('flex'); }\r\n }\r\n function closeGalleryModal() {\r\n const m = document.getElementById('gallery-modal');\r\n if (m) { m.classList.remove('flex'); m.classList.add('hidden'); }\r\n }\r\n\r\n \/\/ ---------- Forms (Admission & Payment) ----------\r\n function selectBranchAndRegister(branchId) {\r\n switchTab('admission');\r\n const bs = document.getElementById('std_branch');\r\n if (bs) bs.value = branchId;\r\n showToast(\"\u09aa\u099b\u09a8\u09cd\u09a6\u09c7\u09b0 \u09b6\u09be\u0996\u09be \u09ab\u09b0\u09cd\u09ae \u09b8\u09c7\u0995\u09b6\u09a8\u09c7 \u0985\u099f\u09cb \u09ab\u09bf\u09b2\u0986\u09aa \u09b9\u09af\u09bc\u09c7\u099b\u09c7\");\r\n }\r\n\r\n function adjustBranchOnGender() {\r\n const gs = document.getElementById('std_gender'), bs = document.getElementById('std_branch');\r\n if (gs && bs) bs.value = gs.value === 'female' ? 'asiya_yusuf' : 'main';\r\n }\r\n\r\n function goToStep(step) {\r\n if (step === 2) {\r\n const n = document.getElementById('std_name'), d = document.getElementById('std_dob');\r\n if ((n && !n.checkValidity()) || (d && !d.value)) return showToast(\"\u09a8\u09be\u09ae \u0993 \u099c\u09a8\u09cd\u09ae \u09a4\u09be\u09b0\u09bf\u0996 \u09b8\u09a0\u09bf\u0995\u09ad\u09be\u09ac\u09c7 \u09b2\u09bf\u0996\u09c1\u09a8\");\r\n }\r\n if (step === 3) {\r\n const b = document.getElementById('std_branch'), d = document.getElementById('std_dept');\r\n if ((b && !b.value) || (d && !d.value)) return showToast(\"\u09b6\u09be\u0996\u09be \u0993 \u09ac\u09bf\u09ad\u09be\u0997 \u09a8\u09bf\u09b0\u09cd\u09ac\u09be\u099a\u09a8 \u0986\u09ac\u09b6\u09cd\u09af\u09bf\u0995\");\r\n }\r\n ['step-section-1', 'step-section-2', 'step-section-3'].forEach(id => {\r\n const el = document.getElementById(id); if (el) el.classList.add('hidden');\r\n });\r\n const cur = document.getElementById(`step-section-${step}`);\r\n if (cur) cur.classList.remove('hidden');\r\n\r\n for (let i = 1; i <= 3; i++) {\r\n const ind = document.getElementById(`step-ind-${i}`);\r\n if (ind) {\r\n const num = ind.querySelector('span');\r\n if (i === step) {\r\n ind.className = \"flex flex-col sm:flex-row items-center gap-1.5 text-emerald-600 font-bold\";\r\n if (num) num.className = \"w-6 h-6 rounded-full bg-emerald-600 text-white flex items-center justify-center text-xs shadow-md\";\r\n } else if (i < step) {\r\n ind.className = \"flex flex-col sm:flex-row items-center gap-1.5 text-slate-500 font-medium\";\r\n if (num) num.className = \"w-6 h-6 rounded-full bg-slate-300 dark:bg-slate-700 text-slate-800 dark:text-slate-200 flex items-center justify-center text-xs\";\r\n } else {\r\n ind.className = \"flex flex-col sm:flex-row items-center gap-1.5 text-slate-400 font-medium\";\r\n if (num) num.className = \"w-6 h-6 rounded-full bg-slate-200 dark:bg-slate-800 text-slate-600 dark:text-slate-400 flex items-center justify-center text-xs\";\r\n }\r\n }\r\n }\r\n }\r\n\r\n function handleAdmissionSubmit(e) {\r\n e.preventDefault();\r\n const n = document.getElementById('std_name'), p = document.getElementById('std_phone');\r\n const id = \"NH-2026-\" + Math.floor(1000 + Math.random() * 9000);\r\n \r\n const tr = document.getElementById('rec-id'); if(tr) tr.innerText = id;\r\n const tn = document.getElementById('rec-name'); if(tn) tn.innerText = n ? n.value : '-';\r\n const tp = document.getElementById('rec-phone'); if(tp) tp.innerText = p ? p.value : '-';\r\n \r\n const f = document.getElementById('admission-form'), s = document.getElementById('admission-success-card');\r\n if (f) f.classList.add('hidden'); if (s) s.classList.remove('hidden');\r\n playBeep(880, 150); showToast(\"\u0986\u09ac\u09c7\u09a6\u09a8 \u09b8\u09ab\u09b2\u09ad\u09be\u09ac\u09c7 \u09b8\u09be\u09ac\u09ae\u09bf\u099f \u09b9\u09af\u09bc\u09c7\u099b\u09c7!\");\r\n }\r\n\r\n function resetAdmissionForm() {\r\n const f = document.getElementById('admission-form'), s = document.getElementById('admission-success-card');\r\n if (f) { f.reset(); f.classList.remove('hidden'); }\r\n if (s) s.classList.add('hidden');\r\n goToStep(1);\r\n }\r\n\r\n function copyToClipboard(txt) {\r\n const i = document.createElement('input'); i.value = txt; document.body.appendChild(i);\r\n i.select(); document.execCommand('copy'); document.body.removeChild(i);\r\n showToast(`${txt} \u0995\u09aa\u09bf \u0995\u09b0\u09be \u09b9\u09af\u09bc\u09c7\u099b\u09c7`);\r\n }\r\n\r\n \/\/ Shared Gateway for Donation & Fees\r\n let gatewayContext = 'donation'; \/\/ 'donation' or 'fees'\r\n\r\n function simulateDonationPayment() {\r\n const amt = document.getElementById('donor-amount');\r\n if (!amt || !amt.value || amt.value <= 0) return showToast(\"\u09b8\u09a0\u09bf\u0995 \u09aa\u09b0\u09bf\u09ae\u09be\u09a3 \u09b2\u09bf\u0996\u09c1\u09a8\");\r\n gatewayContext = 'donation';\r\n openGatewayModal(amt.value, '\u09b2\u09bf\u09b2\u09cd\u09b2\u09be\u09b9 \/ \u09b8\u09be\u09a7\u09be\u09b0\u09a3 \u09ab\u09be\u09a8\u09cd\u09a1');\r\n }\r\n\r\n function simulateFeePayment() {\r\n const id = document.getElementById('fee-std-id'), amt = document.getElementById('fee-amount'), m = document.getElementById('fee-month');\r\n if (!id || !id.value) return showToast(\"\u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09b0\u09cd\u09a5\u09c0\u09b0 \u0986\u0987\u09a1\u09bf \u09a6\u09bf\u09a8\");\r\n if (!amt || !amt.value || amt.value <= 0) return showToast(\"\u09b8\u09a0\u09bf\u0995 \u099f\u09be\u0995\u09be\u09b0 \u09aa\u09b0\u09bf\u09ae\u09be\u09a3 \u09b2\u09bf\u0996\u09c1\u09a8\");\r\n gatewayContext = 'fees';\r\n openGatewayModal(amt.value, `\u09ac\u09c7\u09a4\u09a8: \u0986\u0987\u09a1\u09bf ${id.value} - ${m.value}`);\r\n }\r\n\r\n function openGatewayModal(amt, desc) {\r\n const am = document.getElementById('gateway-amount'), fd = document.getElementById('gateway-fund');\r\n if (am) am.innerText = `${amt} \u09f3`; if (fd) fd.innerText = desc;\r\n const m = document.getElementById('donation-gateway-modal');\r\n if (m) { m.classList.remove('hidden'); m.classList.add('flex'); }\r\n }\r\n\r\n function closeDonationGateway() {\r\n const m = document.getElementById('donation-gateway-modal');\r\n if (m) { m.classList.add('hidden'); m.classList.remove('flex'); }\r\n }\r\n\r\n function setGatewayMethod(method) {\r\n const b = document.getElementById('m-btn-bkash'), n = document.getElementById('m-btn-nagad');\r\n if (b && n) {\r\n if (method === 'bkash') {\r\n b.className = \"py-2.5 border-2 border-emerald-500 rounded-xl font-bold text-xs bg-emerald-500\/10 text-emerald-700\";\r\n n.className = \"py-2.5 border border-slate-200 dark:border-slate-700 rounded-xl font-bold text-xs text-slate-500 bg-white dark:bg-slate-800\";\r\n } else {\r\n n.className = \"py-2.5 border-2 border-emerald-500 rounded-xl font-bold text-xs bg-emerald-500\/10 text-emerald-700\";\r\n b.className = \"py-2.5 border border-slate-200 dark:border-slate-700 rounded-xl font-bold text-xs text-slate-500 bg-white dark:bg-slate-800\";\r\n }\r\n }\r\n }\r\n\r\n function confirmSimulatedPayment() {\r\n const p = document.getElementById('gateway-phone');\r\n if (!p || p.value.length < 11) return showToast(\"\u09b8\u09a0\u09bf\u0995 \u09e7\u09e7-\u09a1\u09bf\u099c\u09bf\u099f\u09c7\u09b0 \u09ae\u09cb\u09ac\u09be\u0987\u09b2 \u09a8\u09ae\u09cd\u09ac\u09b0 \u09b2\u09bf\u0996\u09c1\u09a8\");\r\n closeDonationGateway();\r\n showToast(gatewayContext === 'fees' ? \"\u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7 \u09b8\u09ab\u09b2 \u09b9\u09af\u09bc\u09c7\u099b\u09c7! \u099c\u09be\u099c\u09be\u0995\u09be\u09b2\u09cd\u09b2\u09be\u09b9\u0964\" : \"\u0986\u09aa\u09a8\u09be\u09b0 \u0985\u09a8\u09c1\u09a6\u09be\u09a8 \u09b8\u09ab\u09b2 \u09b9\u09af\u09bc\u09c7\u099b\u09c7! \u099c\u09be\u099c\u09be\u0995\u09be\u09b2\u09cd\u09b2\u09be\u09b9\u09c1 \u0996\u09be\u09af\u09bc\u09c7\u09b0!\");\r\n playBeep(660, 250);\r\n \r\n if (gatewayContext === 'donation') {\r\n const da = document.getElementById('donor-amount'); if (da) da.value = '';\r\n } else {\r\n const fa = document.getElementById('fee-amount'); if (fa) fa.value = '';\r\n }\r\n }\r\n\r\n \/\/ ---------- Tasbeeh Logic ----------\r\n function toggleTasbeehSound() {\r\n tasbeehSoundActive = !tasbeehSoundActive;\r\n const i = document.getElementById('sound-icon-holder'), l = document.getElementById('sound-text-lbl');\r\n if (i && l) {\r\n i.innerText = tasbeehSoundActive ? \"\ud83d\udd0a\" : \"\ud83d\udd07\";\r\n l.innerText = tasbeehSoundActive ? \"\u09b6\u09ac\u09cd\u09a6 \u09b8\u099a\u09b2\" : \"\u09b6\u09ac\u09cd\u09a6 \u0985\u099a\u09b2\";\r\n }\r\n }\r\n\r\n function setTasbeehGoal(goal) {\r\n tasbeehGoal = goal;\r\n ['goal-btn-33', 'goal-btn-99', 'goal-btn-100', 'goal-btn-0'].forEach(id => {\r\n const el = document.getElementById(id);\r\n if (el) el.className = \"px-4 py-1.5 rounded-full text-xs font-bold border border-slate-200 dark:border-slate-700 text-slate-500 bg-white dark:bg-slate-800 shadow-sm transition-all\";\r\n });\r\n const ab = document.getElementById(`goal-btn-${goal}`);\r\n if (ab) ab.className = \"px-4 py-1.5 rounded-full text-xs font-bold border border-emerald-600 bg-emerald-600 text-white shadow-sm transition-all\";\r\n \r\n const bg = document.getElementById('tasbeeh-goal-badge');\r\n if (bg) bg.innerText = goal === 0 ? \"\u09b2\u0995\u09cd\u09b7\u09cd\u09af: \u09b8\u09c0\u09ae\u09be\u09b9\u09c0\u09a8\" : `\u09b2\u0995\u09cd\u09b7\u09cd\u09af: ${goal}`;\r\n resetTasbeeh();\r\n }\r\n\r\n function changeDhikr() {\r\n const s = document.getElementById('tasbeeh-dhikr-select'), dl = document.getElementById('dhikr-lbl-sub');\r\n if (s && dl) { selectedDhikr = s.value; dl.innerText = selectedDhikr.toUpperCase(); resetTasbeeh(); }\r\n }\r\n\r\n function incrementTasbeeh() {\r\n tasbeehCount++;\r\n if (navigator.vibrate) navigator.vibrate(25); \/\/ Premium Haptic Feedback\r\n \r\n const pb = document.getElementById('pulse-bg');\r\n if (pb) { pb.classList.remove('hidden'); setTimeout(() => pb.classList.add('hidden'), 200); }\r\n\r\n const tc = document.getElementById('tasbeeh-count');\r\n if (tc) tc.innerText = currentLang === 'bn' ? toBengaliNumberStr(tasbeehCount.toString()) : tasbeehCount;\r\n\r\n playBeep(480, 45); \/\/ Subtle tap sound\r\n\r\n if (tasbeehGoal > 0 && tasbeehCount >= tasbeehGoal) {\r\n setTimeout(() => playBeep(880, 180), 100);\r\n setTimeout(() => playBeep(1046.5, 250), 250);\r\n showToast(`\u09ae\u09be-\u09b6\u09be-\u0986\u09b2\u09cd\u09b2\u09be\u09b9! ${tasbeehGoal} \u09ac\u09be\u09b0 \u099c\u09bf\u0995\u09bf\u09b0 \u09aa\u09c2\u09b0\u09cd\u09a3 \u09b9\u09af\u09bc\u09c7\u099b\u09c7\u0964`);\r\n tasbeehHistory.push({ time: new Date().toLocaleTimeString('bn-BD', { hour: '2-digit', minute: '2-digit' }), dhikr: selectedDhikr, count: tasbeehGoal });\r\n updateTasbeehHistoryUI();\r\n tasbeehCount = 0;\r\n if (tc) tc.innerText = currentLang === 'bn' ? \"\u09e6\" : \"0\";\r\n }\r\n }\r\n\r\n function resetTasbeeh() {\r\n tasbeehCount = 0;\r\n const tc = document.getElementById('tasbeeh-count');\r\n if (tc) tc.innerText = currentLang === 'bn' ? \"\u09e6\" : \"0\";\r\n }\r\n\r\n function updateTasbeehHistoryUI() {\r\n const h = document.getElementById('tasbeeh-history');\r\n if (!h) return;\r\n if (tasbeehHistory.length === 0) {\r\n h.innerHTML = `<span class=\"text-slate-400 italic\">\u0986\u099c \u098f\u0996\u09a8 \u09aa\u09b0\u09cd\u09af\u09a8\u09cd\u09a4 \u0995\u09cb\u09a8\u09cb \u099c\u09bf\u0995\u09bf\u09b0 \u09b9\u09bf\u09b8\u09cd\u099f\u09cd\u09b0\u09bf \u09a8\u09c7\u0987<\/span>`; return;\r\n }\r\n h.innerHTML = '';\r\n tasbeehHistory.slice(-4).reverse().forEach(log => {\r\n h.innerHTML += `\r\n <div class=\"flex justify-between py-1 border-b border-slate-50 dark:border-slate-800\">\r\n <span>\ud83d\udcff ${log.dhikr} (${log.count} \u09ac\u09be\u09b0)<\/span>\r\n <span class=\"text-slate-400 font-mono\">${log.time}<\/span>\r\n <\/div>`;\r\n });\r\n }\r\n\r\n \/\/ ---------- Chat System ----------\r\n let isChatOpen = false;\r\n\r\n \/\/ ---------- Branch Details System ----------\r\n const branchData = {\r\n main: {\r\n title: \"\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 (\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be)\",\r\n address: \"\u09b8\u09bf\u0995\u09a6\u09be\u09b0 \u09aa\u09be\u09a1\u09bc\u09be, \u09e9\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\",\r\n activities: [\r\n \"\u09a8\u09bf\u09df\u09ae\u09bf\u09a4 \u09b8\u09be\u09aa\u09cd\u09a4\u09be\u09b9\u09bf\u0995 \u0993 \u09ae\u09be\u09b8\u09bf\u0995 \u09aa\u09b0\u09c0\u0995\u09cd\u09b7\u09be \u0997\u09cd\u09b0\u09b9\u09a3\u0964\",\r\n \"\u0985\u09ad\u09bf\u099c\u09cd\u099e \u0995\u09cd\u09ac\u09be\u09b0\u09c0 \u09b8\u09be\u09b9\u09c7\u09ac\u09a6\u09c7\u09b0 \u09a6\u09cd\u09ac\u09be\u09b0\u09be \u09ae\u09b6\u0995 \u0995\u09b0\u09be\u09a8\u09cb\u0964\",\r\n \"\u0986\u09b0\u09ac\u09bf \u09b8\u09b9 \u09ac\u09be\u0982\u09b2\u09be, \u0985\u0982\u0995, \u0987\u0982\u09b0\u09c7\u099c\u09bf\u09b0 \u09aa\u09cd\u09b0\u09a4\u09bf \u09ac\u09bf\u09b6\u09c7\u09b7 \u0997\u09c1\u09b0\u09c1\u09a4\u09cd\u09ac \u09a6\u09c7\u0993\u09df\u09be \u09b9\u09df\u0964\",\r\n \"\u09ae\u09a8\u09cb\u09b0\u09ae \u0993 \u0995\u09cb\u09b2\u09be\u09b9\u09b2\u09ae\u09c1\u0995\u09cd\u09a4 \u09aa\u09b0\u09bf\u09ac\u09c7\u09b6\u09c7 \u09aa\u09be\u09a0\u09a6\u09be\u09a8\u0964\",\r\n \"\u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u09aa\u09cd\u09b0\u09b6\u09bf\u0995\u09cd\u09b7\u09a3 \u09aa\u09cd\u09b0\u09be\u09aa\u09cd\u09a4 \u0993\u09b8\u09cd\u09a4\u09be\u09a6 \u09a6\u09cd\u09ac\u09be\u09b0\u09be \u09aa\u09b0\u09bf\u099a\u09be\u09b2\u09bf\u09a4\u0964\"\r\n ],\r\n students: [\r\n { roll: \"\u09e7\u09e6\u09e7\", name: \"\u0986\u09ac\u09cd\u09a6\u09c1\u09b2\u09cd\u09b2\u09be\u09b9 \u0986\u09b2 \u09ae\u09be\u09ae\u09c1\u09a8\", class: \"\u09b9\u09bf\u09ab\u099c\u09c1\u09b2 \u0995\u09c1\u09b0\u0986\u09a8\" },\r\n { roll: \"\u09e7\u09e6\u09e8\", name: \"\u09b8\u09be\u0987\u09a6\u09c1\u09b0 \u09b0\u09b9\u09ae\u09be\u09a8\", class: \"\u0995\u09bf\u09a4\u09be\u09ac (\u09b6\u09b0\u09b9\u09c7 \u09ac\u09c7\u0995\u09be\u09af\u09bc\u09be)\" },\r\n { roll: \"\u09e7\u09e6\u09e9\", name: \"\u09ae\u09cb\u09b9\u09be\u09ae\u09cd\u09ae\u09a6 \u0989\u09ae\u09b0\", class: \"\u09a8\u09be\u099c\u09c7\u09b0\u09be \u09ac\u09bf\u09ad\u09be\u0997\" },\r\n { roll: \"\u09e7\u09e6\u09ea\", name: \"\u09b9\u09be\u09b8\u09be\u09a8 \u09ae\u09be\u09b9\u09ae\u09c1\u09a6\", class: \"\u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u09a4\u09c3\u09a4\u09c0\u09af\u09bc \u09b6\u09cd\u09b0\u09c7\u09a3\u09bf\" },\r\n { roll: \"\u09e7\u09e6\u09eb\", name: \"\u09a4\u09b0\u09bf\u0995\u09c1\u09b2 \u0987\u09b8\u09b2\u09be\u09ae\", class: \"\u09b9\u09bf\u09ab\u099c\u09c1\u09b2 \u0995\u09c1\u09b0\u0986\u09a8\" },\r\n { roll: \"\u09e7\u09e6\u09ec\", name: \"\u09b8\u09be\u09a6\u09bf\u0995\u09c1\u09b0 \u09b0\u09b9\u09ae\u09be\u09a8\", class: \"\u0995\u09bf\u09a4\u09be\u09ac (\u09a4\u09be\u0987\u09b8\u09bf\u09b0)\" },\r\n { roll: \"\u09e7\u09e6\u09ed\", name: \"\u09af\u09cb\u09ac\u09be\u09af\u09bc\u09c7\u09b0 \u0986\u09b9\u09ae\u09c7\u09a6\", class: \"\u09a8\u09be\u099c\u09c7\u09b0\u09be \u09ac\u09bf\u09ad\u09be\u0997\" }\r\n ],\r\n images: [\r\n \"https:\/\/images.unsplash.com\/photo-1584551246679-0daf3d275d05?auto=format&fit=crop&w=600&q=80\",\r\n \"https:\/\/images.unsplash.com\/photo-1585036156171-384164a8c675?auto=format&fit=crop&w=600&q=80\",\r\n \"https:\/\/images.unsplash.com\/photo-1564121211835-e88c852648ab?auto=format&fit=crop&w=600&q=80\",\r\n \"https:\/\/images.unsplash.com\/photo-1609599006353-e629aaab31fc?auto=format&fit=crop&w=600&q=80\"\r\n ]\r\n },\r\n kachabazar: {\r\n title: \"\u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 (\u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be)\",\r\n address: \"\u09ae\u09be\u0987\u09a8\u0989\u09a6\u09cd\u09a6\u09bf\u09a8 \u0986\u09ac\u09be\u09b8\u09bf\u0995 \u098f\u09b2\u09be\u0995\u09be, \u09eb\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\",\r\n activities: [\r\n \"\u09a8\u09c2\u09b0\u09be\u09a8\u09c0, \u09a8\u09be\u099c\u09c7\u09b0\u09be \u0993 \u09b9\u09bf\u09ab\u099c \u09ac\u09bf\u09ad\u09be\u0997\u09c7\u09b0 \u09ac\u09bf\u09b6\u09c7\u09b7 \u09af\u09a4\u09cd\u09a8\u0964\",\r\n \"\u0985\u09ad\u09bf\u099c\u09cd\u099e \u09b9\u09be\u09ab\u09c7\u099c\u09a6\u09c7\u09b0 \u09a4\u09a4\u09cd\u09a4\u09cd\u09ac\u09be\u09ac\u09a7\u09be\u09a8\u09c7 \u09b9\u09bf\u09ab\u099c\u09c1\u09b2 \u0995\u09c1\u09b0\u0986\u09a8\u0964\",\r\n \"\u09b6\u09bf\u09b6\u09c1 \u09b6\u09cd\u09b0\u09c7\u09a3\u09bf \u09a5\u09c7\u0995\u09c7 \u09e9\u09af\u09bc \u09b6\u09cd\u09b0\u09c7\u09a3\u09bf \u09aa\u09b0\u09cd\u09af\u09a8\u09cd\u09a4 \u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u09ac\u09bf\u09ad\u09be\u0997\u0964\",\r\n \"\u09a8\u09bf\u09af\u09bc\u09ae\u09bf\u09a4 \u09b8\u09be\u09aa\u09cd\u09a4\u09be\u09b9\u09bf\u0995 \u0986\u09ae\u09b2 \u0993 \u09a4\u09b0\u09ac\u09bf\u09af\u09bc\u09a4\u0964\"\r\n ],\r\n students: [\r\n { roll: \"\u09e8\u09e6\u09e7\", name: \"\u0986\u09ac\u09c1 \u09ac\u0995\u09b0 \u09b8\u09bf\u09a6\u09cd\u09a6\u09bf\u0995\", class: \"\u09b9\u09bf\u09ab\u099c\u09c1\u09b2 \u0995\u09c1\u09b0\u0986\u09a8\" },\r\n { roll: \"\u09e8\u09e6\u09e8\", name: \"\u0986\u09b2\u09c0 \u09b9\u09be\u09b8\u09be\u09a8\", class: \"\u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u09b6\u09bf\u09b6\u09c1 \u09b6\u09cd\u09b0\u09c7\u09a3\u09bf\" },\r\n { roll: \"\u09e8\u09e6\u09e9\", name: \"\u09b0\u09be\u0995\u09bf\u09ac\u09c1\u09b2 \u0987\u09b8\u09b2\u09be\u09ae\", class: \"\u09a8\u09be\u099c\u09c7\u09b0\u09be \u09ac\u09bf\u09ad\u09be\u0997\" },\r\n { roll: \"\u09e8\u09e6\u09ea\", name: \"\u09ae\u09bf\u09a8\u09b9\u09be\u099c \u0989\u09a6\u09cd\u09a6\u09c0\u09a8\", class: \"\u09b9\u09bf\u09ab\u099c\u09c1\u09b2 \u0995\u09c1\u09b0\u0986\u09a8\" },\r\n { roll: \"\u09e8\u09e6\u09eb\", name: \"\u0987\u09af\u09bc\u09be\u09b8\u09bf\u09a8 \u0986\u09b0\u09be\u09ab\u09be\u09a4\", class: \"\u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u09e7\u09ae \u09b6\u09cd\u09b0\u09c7\u09a3\u09bf\" }\r\n ],\r\n images: [\r\n \"https:\/\/images.unsplash.com\/photo-1609599006353-e629aaab31fc?auto=format&fit=crop&w=600&q=80\",\r\n \"https:\/\/images.unsplash.com\/photo-1564121211835-e88c852648ab?auto=format&fit=crop&w=600&q=80\",\r\n \"https:\/\/images.unsplash.com\/photo-1584551246679-0daf3d275d05?auto=format&fit=crop&w=600&q=80\"\r\n ]\r\n },\r\n asiya_yusuf: {\r\n title: \"\u0986\u099b\u09bf\u09af\u09bc\u09be \u0987\u0989\u09b8\u09c1\u09ab \u09ae\u09b9\u09bf\u09b2\u09be \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\",\r\n address: \"\u0986\u09ac\u09c1 \u0987\u0989\u09b8\u09c1\u09ab \u09b0\u09cb\u09a1, \u09e9\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\",\r\n activities: [\r\n \"\u09ae\u09b9\u09bf\u09b2\u09be\u09a6\u09c7\u09b0 \u099c\u09a8\u09cd\u09af \u0986\u09b2\u09be\u09a6\u09be \u09b8\u09ae\u09cd\u09aa\u09c2\u09b0\u09cd\u09a3 \u09a8\u09bf\u09b0\u09be\u09aa\u09a6 \u09aa\u09b0\u09cd\u09a6\u09be\u0998\u09c7\u09b0\u09be \u0995\u09cd\u09af\u09be\u09ae\u09cd\u09aa\u09be\u09b8\u0964\",\r\n \"\u0985\u09ad\u09bf\u099c\u09cd\u099e \u09ae\u09b9\u09bf\u09b2\u09be \u09b6\u09bf\u0995\u09cd\u09b7\u09bf\u0995\u09be \u09a6\u09cd\u09ac\u09be\u09b0\u09be \u09aa\u09b0\u09bf\u099a\u09be\u09b2\u09bf\u09a4\u0964\",\r\n \"\u09b9\u09bf\u09ab\u099c, \u09a8\u09be\u099c\u09c7\u09b0\u09be \u098f\u09ac\u0982 \u0995\u09bf\u09a4\u09be\u09ac \u09ac\u09bf\u09ad\u09be\u0997 (\u09ae\u09c7\u09b6\u0995\u09be\u09a4 \u09aa\u09b0\u09cd\u09af\u09a8\u09cd\u09a4)\u0964\",\r\n \"\u0986\u09ac\u09be\u09b8\u09bf\u0995 \u0993 \u0985\u09a8\u09be\u09ac\u09be\u09b8\u09bf\u0995 \u099b\u09be\u09a4\u09cd\u09b0\u09c0\u09a6\u09c7\u09b0 \u099c\u09a8\u09cd\u09af \u09ac\u09bf\u09b6\u09c7\u09b7 \u09b0\u09c1\u099f\u09bf\u09a8 \u0993 \u0986\u09ae\u09b2\u0964\"\r\n ],\r\n students: [\r\n { roll: \"\u09e9\u09e6\u09e7\", name: \"\u09ab\u09be\u09a4\u09c7\u09ae\u09be \u0986\u0995\u09cd\u09a4\u09be\u09b0\", class: \"\u0995\u09bf\u09a4\u09be\u09ac (\u09b9\u09c7\u09a6\u09be\u09af\u09bc\u09be\u09a4\u09c1\u09a8\u09cd\u09a8\u09be\u09b9\u09c1)\" },\r\n { roll: \"\u09e9\u09e6\u09e8\", name: \"\u0986\u09af\u09bc\u09c7\u09b6\u09be \u09b8\u09bf\u09a6\u09cd\u09a6\u09bf\u0995\u09be\", class: \"\u09b9\u09bf\u09ab\u099c\u09c1\u09b2 \u0995\u09c1\u09b0\u0986\u09a8\" },\r\n { roll: \"\u09e9\u09e6\u09e9\", name: \"\u0996\u09be\u09a6\u09bf\u099c\u09be \u09ac\u09bf\u09a8\u09a4\u09c7 \u0989\u09ae\u09b0\", class: \"\u09a8\u09be\u099c\u09c7\u09b0\u09be \u09ac\u09bf\u09ad\u09be\u0997\" },\r\n { roll: \"\u09e9\u09e6\u09ea\", name: \"\u09b8\u09c1\u09ae\u09be\u0987\u09af\u09bc\u09be \u09b0\u09b9\u09ae\u09be\u09a8\", class: \"\u0995\u09bf\u09a4\u09be\u09ac (\u09ae\u09bf\u09af\u09be\u09a8)\" },\r\n { roll: \"\u09e9\u09e6\u09eb\", name: \"\u09b0\u09c1\u0995\u09be\u0987\u09af\u09bc\u09be \u0987\u09b8\u09b2\u09be\u09ae\", class: \"\u09a8\u09c2\u09b0\u09be\u09a8\u09c0 \u09b6\u09bf\u09b6\u09c1 \u09b6\u09cd\u09b0\u09c7\u09a3\u09bf\" }\r\n ],\r\n images: [\r\n \"https:\/\/images.unsplash.com\/photo-1585036156171-384164a8c675?auto=format&fit=crop&w=600&q=80\",\r\n \"https:\/\/images.unsplash.com\/photo-1584551246679-0daf3d275d05?auto=format&fit=crop&w=600&q=80\",\r\n \"https:\/\/images.unsplash.com\/photo-1564121211835-e88c852648ab?auto=format&fit=crop&w=600&q=80\"\r\n ]\r\n }\r\n };\r\n\r\n function openBranchDetails(branchId) {\r\n switchTab('branch-details');\r\n const data = branchData[branchId];\r\n if(!data) return;\r\n\r\n document.getElementById('bd-title').innerText = data.title;\r\n document.getElementById('bd-address').innerText = \"\ud83d\udccd \" + data.address;\r\n\r\n \/\/ Render Activities\r\n const actList = document.getElementById('bd-activities-list');\r\n actList.innerHTML = data.activities.map(act => `<li class=\"flex gap-3 items-start p-3 bg-white dark:bg-slate-900 rounded-xl shadow-sm border border-slate-100 dark:border-slate-700\/50\"><span class=\"text-emerald-500 text-lg\">\u2705<\/span> <span class=\"pt-0.5\">${act}<\/span><\/li>`).join('');\r\n\r\n \/\/ Render Students\r\n const stdList = document.getElementById('bd-student-list');\r\n stdList.innerHTML = data.students.map(std => `\r\n <div class=\"flex justify-between items-center p-4 bg-slate-50 dark:bg-slate-800\/50 rounded-2xl border border-slate-100 dark:border-slate-700\">\r\n <div class=\"flex items-center gap-3\">\r\n <div class=\"w-10 h-10 rounded-full bg-emerald-100 dark:bg-emerald-900\/50 flex items-center justify-center text-emerald-700 dark:text-emerald-400 font-black text-xs border border-emerald-200 dark:border-emerald-800\">#${std.roll}<\/div>\r\n <div>\r\n <strong class=\"text-sm text-slate-800 dark:text-slate-200 block\">${std.name}<\/strong>\r\n <span class=\"text-[10px] text-slate-500 font-bold\">${std.class}<\/span>\r\n <\/div>\r\n <\/div>\r\n <span class=\"bg-emerald-50 dark:bg-emerald-900\/30 text-emerald-600 dark:text-emerald-400 px-2.5 py-1 rounded-md text-[10px] font-black border border-emerald-500\/20\">\u0985\u09a7\u09cd\u09af\u09af\u09bc\u09a8\u09b0\u09a4<\/span>\r\n <\/div>\r\n `).join('');\r\n\r\n \/\/ Render Gallery\r\n const galGrid = document.getElementById('bd-gallery-grid');\r\n galGrid.innerHTML = data.images.map(img => `\r\n <div class=\"overflow-hidden rounded-2xl shadow-sm border border-slate-200 dark:border-slate-700 cursor-pointer\" onclick=\"openGalleryModal('${img}')\">\r\n <img decoding=\"async\" src=\"${img}\" class=\"w-full h-32 md:h-48 object-cover hover:scale-110 transition-transform duration-300\" \/>\r\n <\/div>\r\n `).join('');\r\n\r\n \/\/ Default open activities tab\r\n switchBranchSubTab('activities');\r\n }\r\n\r\n function switchBranchSubTab(tab) {\r\n ['activities', 'students', 'gallery'].forEach(t => {\r\n const content = document.getElementById(`bd-tab-${t}`);\r\n const btn = document.getElementById(`bd-btn-${t}`);\r\n if(content && btn) {\r\n content.classList.add('hidden');\r\n btn.classList.remove('bg-emerald-600', 'text-white', 'border-transparent');\r\n btn.classList.add('bg-white', 'dark:bg-slate-800', 'text-slate-600', 'dark:text-slate-300', 'border', 'border-slate-200', 'dark:border-slate-700');\r\n }\r\n });\r\n const activeContent = document.getElementById(`bd-tab-${tab}`);\r\n const activeBtn = document.getElementById(`bd-btn-${tab}`);\r\n if(activeContent && activeBtn) {\r\n activeContent.classList.remove('hidden');\r\n activeBtn.classList.remove('bg-white', 'dark:bg-slate-800', 'text-slate-600', 'dark:text-slate-300', 'border', 'border-slate-200', 'dark:border-slate-700');\r\n activeBtn.classList.add('bg-emerald-600', 'text-white', 'border-transparent');\r\n }\r\n }\r\n\r\n function toggleAIChat() {\r\n isChatOpen = !isChatOpen;\r\n const b = document.getElementById('ai-chat-container');\r\n if (b) {\r\n if (isChatOpen) { b.classList.remove('hidden'); b.classList.add('flex'); }\r\n else { b.classList.add('hidden'); b.classList.remove('flex'); }\r\n }\r\n }\r\n function sendQuickChat(k) {\r\n const i = document.getElementById('chat-input');\r\n if (i) { i.value = k; handleChatSubmit(new Event('submit')); }\r\n }\r\n function handleChatSubmit(e) {\r\n if (e) e.preventDefault();\r\n const i = document.getElementById('chat-input'), l = document.getElementById('ai-chat-logs');\r\n if (!i || !l || !i.value.trim()) return;\r\n\r\n const q = i.value.trim();\r\n l.innerHTML += `<div class=\"flex gap-2 justify-end\"><div class=\"bg-emerald-600 text-white p-2.5 rounded-2xl rounded-tr-none max-w-[80%] leading-relaxed font-semibold shadow-sm\">${q}<\/div><\/div>`;\r\n i.value = '';\r\n\r\n let r = \"\"; const lq = q.toLowerCase();\r\n if (lq.includes('\u09ad\u09b0\u09cd\u09a4\u09bf') || lq.includes('admission')) r = \"\u09e8\u09e6\u09e8\u09ec \u09b8\u09be\u09b2\u09c7\u09b0 \u09a8\u09a4\u09c1\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf \u099a\u09b2\u099b\u09c7\u0964 '\u0985\u09a8\u09b2\u09be\u0987\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf' \u099f\u09cd\u09af\u09be\u09ac\u09c7 \u0997\u09bf\u09af\u09bc\u09c7 \u09ab\u09b0\u09cd\u09ae \u09aa\u09c2\u09b0\u09a3 \u0995\u09b0\u09c1\u09a8\u0964 \u09aa\u09cd\u09b0\u09df\u09cb\u099c\u09a8\u09c7 \u0995\u09b2 \u0995\u09b0\u09c1\u09a8: \u09e6\u09e7\u09ef\u09e8\u09e6-\u09e7\u09ee\u09e9\u09ed\u09ec\u09ed\";\r\n else if (lq.includes('\u09b6\u09be\u0996\u09be') || lq.includes('branch')) r = \"\u0986\u09ae\u09be\u09a6\u09c7\u09b0 \u09e9\u099f\u09bf \u09b6\u09be\u0996\u09be: \u09e7. \u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be (\u09b8\u09bf\u0995\u09a6\u09be\u09b0 \u09aa\u09be\u09a1\u09bc\u09be), \u09e8. \u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be, \u09e9. \u0986\u099b\u09bf\u09af\u09bc\u09be \u0987\u0989\u09b8\u09c1\u09ab \u09ae\u09b9\u09bf\u09b2\u09be \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\u0964\";\r\n else if (lq.includes('\u09ac\u09c7\u09a4\u09a8') || lq.includes('fee')) r = \"\u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7 \u0995\u09b0\u09a4\u09c7 '\u09ac\u09c7\u09a4\u09a8 \u09aa\u09b0\u09bf\u09b6\u09cb\u09a7' \u099f\u09cd\u09af\u09be\u09ac\u09c7 \u09af\u09be\u09a8\u0964 \u09b8\u09c7\u0996\u09be\u09a8\u09c7 \u09ac\u09bf\u0995\u09be\u09b6 \u09ac\u09be \u09a8\u0997\u09a6\u09c7\u09b0 \u09ae\u09be\u09a7\u09cd\u09af\u09ae\u09c7 \u0985\u09a8\u09b2\u09be\u0987\u09a8\u09c7 \u09ab\u09bf \u09a6\u09c7\u0993\u09df\u09be \u09af\u09be\u09df\u0964\";\r\n else r = \"\u09a7\u09a8\u09cd\u09af\u09ac\u09be\u09a6\u0964 \u09ac\u09bf\u09b8\u09cd\u09a4\u09be\u09b0\u09bf\u09a4 \u099c\u09be\u09a8\u09a4\u09c7 \u0986\u09ae\u09be\u09a6\u09c7\u09b0 \u09b9\u09c7\u09b2\u09cd\u09aa\u09b2\u09be\u0987\u09a8\u09c7 \u09b8\u09b0\u09be\u09b8\u09b0\u09bf \u0995\u09b2 \u0995\u09b0\u09c1\u09a8: \u09e6\u09e7\u09ef\u09e8\u09e6-\u09e7\u09ee\u09e9\u09ed\u09ec\u09ed\";\r\n\r\n setTimeout(() => {\r\n l.innerHTML += `<div class=\"flex gap-2\"><span class=\"text-lg bg-emerald-100 p-1.5 rounded-full h-fit shrink-0\">\ud83e\udd16<\/span><div class=\"bg-slate-50 dark:bg-slate-800 text-slate-700 dark:text-slate-200 p-2.5 rounded-2xl rounded-tl-none leading-relaxed font-medium shadow-sm\">${r}<\/div><\/div>`;\r\n l.scrollTop = l.scrollHeight;\r\n playBeep(440, 100);\r\n }, 600);\r\n }\r\n <\/script>\r\n<\/body>\r\n<\/html>\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-2275ae6 e-flex e-con-boxed e-con e-parent\" data-id=\"2275ae6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\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>\u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be – \u09aa\u09cb\u09b0\u09cd\u099f\u09be\u09b2 \u2728 \u099a\u09b2\u09a4\u09bf \u09a8\u09cb\u099f\u09bf\u09b6 \u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be\u09af\u09bc \u09e8\u09e6\u09e8\u09ec \u09b6\u09bf\u0995\u09cd\u09b7\u09be\u09ac\u09b0\u09cd\u09b7\u09c7 \u09b8\u0995\u09b2 \u09b6\u09be\u0996\u09be\u09af\u09bc (\u09aa\u09cd\u09b0\u09a7\u09be\u09a8 \u09b6\u09be\u0996\u09be, \u0995\u09be\u0981\u099a\u09be\u09ac\u09be\u099c\u09be\u09b0 \u09b6\u09be\u0996\u09be \u0993 \u0986\u099b\u09bf\u09af\u09bc\u09be \u0987\u0989\u09b8\u09c1\u09ab \u09ae\u09b9\u09bf\u09b2\u09be \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be) \u09a8\u09a4\u09c1\u09a8 \u09ad\u09b0\u09cd\u09a4\u09bf \u099a\u09b2\u099b\u09c7! \u09b8\u09b0\u09be\u09b8\u09b0\u09bf \u09ac\u09be \u0985\u09a8\u09b2\u09be\u0987\u09a8\u09c7\u09b0 \u09ae\u09be\u09a7\u09cd\u09af\u09ae\u09c7 \u0986\u09ac\u09c7\u09a6\u09a8 \u09b8\u09ae\u09cd\u09aa\u09a8\u09cd\u09a8 \u0995\u09b0\u09c1\u09a8\u0964 \ud83d\udccd \u09b8\u09bf\u0995\u09a6\u09be\u09b0 \u09aa\u09be\u09a1\u09bc\u09be, \u09e9\u09a8\u0982 \u0993\u09af\u09bc\u09be\u09b0\u09cd\u09a1, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0 \u09aa\u09cc\u09b0\u09b8\u09ad\u09be, \u09b8\u0996\u09bf\u09aa\u09c1\u09b0, \u099f\u09be\u0999\u09cd\u0997\u09be\u0987\u09b2\u0964 \u09ac\u09be\u0982\u09b2\u09be EN \u09a6\u09be\u09b0\u09c1\u09b2 \u0989\u09b2\u09c2\u09ae \u09a8\u09c2\u09b0\u09c1\u09b2 \u09b9\u09be\u09b0\u09be\u09ae\u09be\u0987\u09a8 \u09ae\u09be\u09a6\u09b0\u09be\u09b8\u09be \u09a6\u09be\u09b0\u09c1\u09b2 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-126","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nurulharamainmadrasa.com\/index.php?rest_route=\/wp\/v2\/pages\/126","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nurulharamainmadrasa.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nurulharamainmadrasa.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nurulharamainmadrasa.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nurulharamainmadrasa.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=126"}],"version-history":[{"count":21,"href":"https:\/\/nurulharamainmadrasa.com\/index.php?rest_route=\/wp\/v2\/pages\/126\/revisions"}],"predecessor-version":[{"id":156,"href":"https:\/\/nurulharamainmadrasa.com\/index.php?rest_route=\/wp\/v2\/pages\/126\/revisions\/156"}],"wp:attachment":[{"href":"https:\/\/nurulharamainmadrasa.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=126"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}