{"id":1153,"date":"2026-06-15T11:22:56","date_gmt":"2026-06-15T11:22:56","guid":{"rendered":"https:\/\/kurdi.krd\/?p=1153"},"modified":"2026-07-13T11:54:27","modified_gmt":"2026-07-13T11:54:27","slug":"%d8%b2%d8%a7%d8%b1%d8%a7%d9%88%db%95%db%8c-%d8%b3%db%86%d8%b1%d8%a7%d9%86%db%8c-%d9%be%db%8c%d8%aa%db%8c-%d8%b9%db%95%d8%b1%db%95%d8%a8%db%8c-%d9%84%d8%a7%d8%aa%db%8c%d9%86%db%8c","status":"publish","type":"post","link":"https:\/\/kurdi.krd\/?p=1153","title":{"rendered":"\u0632\u0627\u0631\u0627\u0648\u06d5\u06cc \u0633\u06c6\u0631\u0627\u0646\u06cc \u067e\u06cc\u062a\u06cc (\u0639\u06d5\u0631\u06d5\u0628\u06cc &#8211; \u0644\u0627\u062a\u06cc\u0646\u06cc)"},"content":{"rendered":"\n<style>\n    \/* Kurdish Alphabet Full-Page Accordion - Premium Glassmorphism & Lazy Load Edition\n       Font: XB Niloofar (Ensure this is loaded in your WP theme)\n    *\/\n    \n    \/* Fluid Colorful Background *\/\n    .kurdish-alphabet-page {\n        font-family: 'XB Niloofar', Tahoma, Arial, sans-serif;\n        direction: rtl;\n        width: 100%;\n        max-width: 1200px; \n        margin: 0 auto;\n        display: flex;\n        flex-direction: column;\n        gap: 16px;\n        padding: 20px 10px; \n        box-sizing: border-box;\n        position: relative;\n        min-height: 60vh; \n        \n        \/* Vibrant, smooth liquid gradient *\/\n        background: linear-gradient(-45deg, #f6d365, #ffb199, #9cedad, #90e0ef);\n        background-size: 300% 300%;\n        animation: fluidGradient 15s ease infinite;\n        border-radius: 24px;\n        \n        counter-reset: alphabet-counter;\n    }\n\n    @keyframes fluidGradient {\n        0% { background-position: 0% 50%; }\n        50% { background-position: 100% 50%; }\n        100% { background-position: 0% 50%; }\n    }\n\n    \/* Glassmorphism Shared Utility *\/\n    .glass-panel {\n        background: rgba(255, 255, 255, 0.45);\n        backdrop-filter: blur(16px);\n        -webkit-backdrop-filter: blur(16px);\n        border: 1px solid rgba(255, 255, 255, 0.6);\n        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.05);\n    }\n\n    \/* --- Main Content Wrapper --- *\/\n    #main-app-content {\n        display: flex; \n        flex-direction: column;\n        gap: 16px;\n        width: 100%;\n    }\n\n    \/* Header Images Component *\/\n    .header-images-container {\n        display: flex;\n        flex-direction: row; \n        flex-wrap: nowrap;\n        justify-content: space-between;\n        align-items: stretch;\n        gap: 12px;\n        padding: 12px;\n        border-radius: 20px;\n        margin-bottom: 8px;\n        width: 100%;\n        box-sizing: border-box;\n    }\n\n    .header-img {\n        flex: 1;\n        width: 100%;\n        min-width: 0; \n        height: auto;\n        object-fit: cover;\n        border-radius: 14px;\n        border: 2px solid rgba(255, 255, 255, 0.8);\n        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);\n        background-color: rgba(255, 255, 255, 0.5);\n        transition: transform 0.3s ease, box-shadow 0.3s ease;\n        box-sizing: border-box;\n    }\n\n    .header-img:hover {\n        transform: translateY(-2px) scale(1.01);\n        box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);\n    }\n\n    \/* Segmented Tab Controls *\/\n    .tabs-navigation {\n        display: flex;\n        background: rgba(255, 255, 255, 0.4);\n        padding: 8px;\n        border-radius: 18px;\n        gap: 8px;\n        margin-bottom: 12px;\n        border: 1px solid rgba(255, 255, 255, 0.5);\n        box-sizing: border-box;\n        width: 100%;\n    }\n\n    .tab-button {\n        flex: 1;\n        padding: 14px 10px;\n        border: none;\n        background: transparent;\n        border-radius: 14px;\n        font-family: inherit;\n        font-size: 18px;\n        font-weight: 700;\n        color: #4a4a4e;\n        cursor: pointer;\n        transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);\n        text-align: center;\n        box-sizing: border-box;\n    }\n\n    .tab-button:hover:not(.active) {\n        background: rgba(255, 255, 255, 0.6);\n    }\n\n    .tab-button.active {\n        background: #ffffff;\n        color: #007aff;\n        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);\n    }\n\n    .tab-content {\n        display: none; \n        animation: fadeIn 0.4s ease forwards;\n        width: 100%;\n        box-sizing: border-box;\n        flex-direction: column;\n        gap: 16px;\n    }\n\n    .tab-content.active {\n        display: flex; \n    }\n\n    @keyframes fadeIn {\n        from { opacity: 0; transform: translateY(10px); }\n        to { opacity: 1; transform: translateY(0); }\n    }\n\n    \/* Sticky Search Bar *\/\n    .search-container {\n        position: sticky;\n        top: 10px;\n        z-index: 100;\n        border-radius: 16px;\n        padding: 12px;\n        margin-bottom: 0px;\n    }\n\n    .search-input {\n        width: 100%;\n        padding: 14px 20px;\n        font-size: 18px;\n        font-family: inherit;\n        border: 1px solid rgba(255, 255, 255, 0.8);\n        border-radius: 12px;\n        background: rgba(255, 255, 255, 0.6);\n        color: #1d1d1f;\n        outline: none;\n        transition: all 0.3s ease;\n        box-sizing: border-box;\n        direction: rtl;\n    }\n\n    .search-input:focus {\n        background: rgba(255, 255, 255, 0.9);\n        border-color: #007aff;\n        box-shadow: 0 0 0 4px rgba(0, 122, 255, 0.15);\n    }\n\n    \/* Generic Accordion Cards *\/\n    .content-card {\n        border-radius: 16px;\n        overflow: hidden;\n        transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);\n        scroll-margin-top: 100px; \n    }\n\n    .content-card.active {\n        background: rgba(255, 255, 255, 0.85);\n        border-color: rgba(255, 255, 255, 0.9);\n        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);\n        transform: scale(1.01);\n    }\n\n    .content-card:hover:not(.active) {\n        background: rgba(255, 255, 255, 0.6);\n    }\n\n    .card-header {\n        width: 100%;\n        background: transparent;\n        border: none;\n        padding: 16px 20px; \n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        cursor: pointer;\n        font-family: inherit;\n        color: #1d1d1f;\n        text-align: right;\n    }\n\n    .card-title {\n        font-size: 28px; \n        font-weight: 700;\n        line-height: 1;\n        margin: 0;\n        display: flex;\n        align-items: center;\n    }\n\n    \/* Automated Numbering strictly for Letters Tab *\/\n    .numbered-title::before {\n        counter-increment: alphabet-counter;\n        content: counter(alphabet-counter, arabic-indic) \" - \";\n        font-size: 0.6em; \n        color: #007aff;\n        font-weight: 700;\n        margin-left: 12px;\n        opacity: 0.8;\n    }\n\n    .toggle-icon {\n        width: 24px;\n        height: 24px;\n        color: #4a4a4e;\n        transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), color 0.3s ease;\n    }\n\n    .card-content-wrapper {\n        display: grid;\n        grid-template-rows: 0fr;\n        transition: grid-template-rows 0.4s cubic-bezier(0.25, 1, 0.5, 1);\n    }\n\n    .content-card.active .card-content-wrapper {\n        grid-template-rows: 1fr;\n    }\n\n    .content-card.active .toggle-icon {\n        transform: rotate(180deg);\n        color: #007aff;\n    }\n\n    .card-content {\n        overflow: hidden;\n    }\n\n    .content-inner {\n        padding: 0 16px 20px 16px; \n        display: flex;\n        flex-direction: column;\n        gap: 16px;\n    }\n\n    .media-container {\n        display: flex !important;\n        flex-direction: row !important;\n        flex-wrap: nowrap !important;\n        justify-content: space-between !important;\n        gap: 12px !important;\n        width: 100% !important;\n        box-sizing: border-box !important;\n    }\n\n    .media-container.single-item {\n        justify-content: center !important;\n    }\n\n    .media-container img {\n        flex: 1 1 0 !important; \n        width: 100% !important;\n        min-width: 0 !important;\n        height: auto !important;\n        aspect-ratio: 732 \/ 1024 !important;\n        object-fit: cover !important;\n        border-radius: 12px !important;\n        border: 2px solid #ffffff !important;\n        background-color: rgba(255,255,255,0.5) !important;\n        display: block !important;\n        transition: transform 0.3s ease !important;\n    }\n\n    @media (hover: hover) {\n        .media-container img:hover {\n            transform: scale(1.02) !important;\n        }\n    }\n\n    \/* Custom Audio Player *\/\n    .custom-audio-player {\n        direction: ltr; \n        display: flex;\n        align-items: center;\n        gap: 12px;\n        width: 100%;\n        background: rgba(255, 255, 255, 0.7);\n        border: 1px solid rgba(255, 255, 255, 0.8);\n        border-radius: 50px;\n        padding: 8px 16px 8px 8px;\n        box-sizing: border-box;\n    }\n\n    .play-pause-btn {\n        width: 48px; \n        height: 48px;\n        border-radius: 50%;\n        background: linear-gradient(135deg, #007aff, #0056b3);\n        color: #ffffff;\n        border: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        flex-shrink: 0;\n        box-shadow: 0 4px 12px rgba(0, 122, 255, 0.3);\n        transition: transform 0.2s, box-shadow 0.2s;\n    }\n\n    .play-pause-btn:active {\n        transform: scale(0.95);\n    }\n\n    .play-pause-btn svg {\n        width: 22px; \n        height: 22px;\n        fill: currentColor;\n    }\n\n    .icon-play {\n        margin-left: 3px; \n    }\n\n    .progress-wrapper {\n        flex-grow: 1;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        cursor: pointer;\n        height: 30px; \n    }\n\n    .progress-bar {\n        width: 100%;\n        height: 6px;\n        background: rgba(0, 0, 0, 0.05);\n        border-radius: 3px;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .progress-filled {\n        height: 100%;\n        width: 0%;\n        background: #007aff;\n        border-radius: 3px;\n        transition: width 0.1s linear;\n    }\n\n    .time-display {\n        font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n        font-size: 13px;\n        color: #4a4a4e;\n        font-variant-numeric: tabular-nums;\n        flex-shrink: 0;\n        min-width: 75px;\n        text-align: right;\n        font-weight: 500;\n    }\n\n    .page-footer-contacts {\n        display: grid;\n        grid-template-columns: 1fr;\n        gap: 16px;\n        margin-top: 24px;\n        width: 100%;\n    }\n\n    .contact-card {\n        padding: 24px;\n        text-align: center;\n        border-radius: 20px;\n    }\n\n    .institute-name {\n        font-size: 22px;\n        color: #1d1d1f;\n        margin: 0 0 16px 0;\n        line-height: 1.4;\n        font-weight: 700;\n    }\n\n    .contact-detail {\n        font-size: 18px;\n        color: #4a4a4e;\n        margin: 10px 0;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        gap: 8px;\n    }\n\n    .contact-detail span.label {\n        font-weight: bold;\n        color: #1d1d1f;\n    }\n\n    .ltr-text {\n        direction: ltr;\n        display: inline-block;\n        font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n        color: #007aff;\n        font-weight: 500;\n    }\n\n    .ltr-text.phone {\n        color: #1d1d1f;\n    }\n\n    .contact-detail a {\n        text-decoration: none;\n    }\n\n    .contact-detail a:hover {\n        text-decoration: underline;\n    }\n\n    \/* Desktop Adjustments *\/\n    @media (min-width: 769px) {\n        .kurdish-alphabet-page { padding: 40px; gap: 20px; border-radius: 40px; }\n        .header-images-container { padding: 24px; margin-bottom: 12px; gap: 24px; }\n        \n        .tabs-navigation { padding: 10px; border-radius: 20px; margin-bottom: 24px; flex-direction: row; }\n        .tab-button { font-size: 20px; padding: 16px 20px; border-radius: 14px; }\n\n        .search-container { padding: 16px; margin-bottom: 8px; }\n        .search-input { font-size: 20px; padding: 16px 24px; }\n        .card-header { padding: 24px 30px; }\n        .card-title { font-size: 36px; }\n        .toggle-icon { width: 32px; height: 32px; }\n        .content-inner { padding: 0 30px 30px 30px; gap: 24px; }\n        .media-container { gap: 20px !important; }\n        .custom-audio-player { padding: 10px 20px 10px 10px; gap: 16px;}\n        .play-pause-btn { width: 56px; height: 56px; }\n        .play-pause-btn svg { width: 26px; height: 26px; }\n        .progress-bar { height: 8px; }\n        .time-display { font-size: 14px; min-width: 85px;}\n        .page-footer-contacts { grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 40px; }\n    }\n    \n    @media (max-width: 768px) {\n        .header-images-container { gap: 8px; padding: 12px; }\n        .tabs-navigation { \n            flex-direction: column;\n            padding: 12px;\n            gap: 10px;\n        }\n        .tab-button {\n            width: 100%;\n            padding: 14px 10px;\n        }\n    }\n<\/style>\n\n<div class=\"kurdish-alphabet-page\">\n    <div id=\"main-app-content\">\n\n        <!-- Cover Images Replacing Text Header -->\n        <div class=\"header-images-container glass-panel\">\n            <img decoding=\"async\" src=\"https:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/image-1.png\" alt=\"Header Image 1\" class=\"header-img\">\n            <img decoding=\"async\" src=\"https:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/image-2.png\" alt=\"Header Image 2\" class=\"header-img\">\n        <\/div>\n\n        <div class=\"tabs-navigation glass-panel\">\n            <button class=\"tab-button active\" onclick=\"switchTab('tab-reading', this)\">\u062e\u0648\u06ce\u0646\u062f\u0646\u06d5\u0648\u06d5\u06cc \u067e\u06cc\u062a\u06d5\u06a9\u0627\u0646<\/button>\n            <button class=\"tab-button\" onclick=\"switchTab('tab-topics', this)\">\u0628\u0627\u0628\u06d5\u062a\u06d5\u06a9\u0627\u0646<\/button>\n            <button class=\"tab-button\" onclick=\"switchTab('tab-images', this)\">\u0648\u06ce\u0646\u06d5\u06a9\u0627\u0646<\/button>\n        <\/div>\n\n        <div id=\"tab-reading\" class=\"tab-content active\">\n            <div class=\"search-container glass-panel\">\n                <input type=\"text\" id=\"alphabetSearch\" class=\"search-input\" placeholder=\"\u06af\u06d5\u0695\u0627\u0646 \u0628\u06c6 \u067e\u06cc\u062a\u06ce\u06a9 (\u0628\u06d5 \u0646\u0645\u0648\u0648\u0646\u06d5: \u0626\u0640)...\">\n            <\/div>\n            <!-- Letters injected here -->\n            <div id=\"dynamic-alphabet-container\" style=\"display: flex; flex-direction: column; gap: 16px;\"><\/div>\n        <\/div>\n\n        <div id=\"tab-topics\" class=\"tab-content\">\n            <!-- Topics injected here -->\n            <div id=\"dynamic-topics-container\" style=\"display: flex; flex-direction: column; gap: 16px;\"><\/div>\n        <\/div>\n\n        <div id=\"tab-images\" class=\"tab-content\">\n            <!-- Posters injected here -->\n            <div id=\"dynamic-posters-container\" style=\"display: flex; flex-direction: column; gap: 16px;\"><\/div>\n        <\/div>\n\n        <div class=\"page-footer-contacts\">\n            <div class=\"contact-card glass-panel\">\n                <h3 class=\"institute-name\">\u0626\u06cc\u0646\u0633\u062a\u06cc\u062a\u0648\u0648\u062a\u06cc \u062e\u0648\u06ce\u0646\u062f\u0646\u06cc \u06a9\u0648\u0631\u062f\u06cc \u0628\u06d5\u0631\u0644\u06cc\u0646<\/h3>\n                <div class=\"contact-detail\">\n                    <span class=\"label\">\u0645\u0627\u06b5\u067e\u06d5\u0695:<\/span> \n                    <a href=\"http:\/\/ifkurds.de\" target=\"_blank\" class=\"ltr-text\">ifkurds.de<\/a>\n                <\/div>\n                <div class=\"contact-detail\">\n                    <span class=\"label\">\u062a\u06d5\u0644\u06d5\u0641\u06c6\u0646:<\/span> \n                    <span class=\"ltr-text phone\">+49 30 821 99 43<\/span>\n                <\/div>\n                <div class=\"contact-detail\">\n                    <span class=\"label\">\u0645\u06c6\u0628\u0627\u06cc\u0644:<\/span> \n                    <span class=\"ltr-text phone\">004917626854229<\/span>\n                <\/div>\n            <\/div>\n\n            <div class=\"contact-card glass-panel\">\n                <h3 class=\"institute-name\">\u067e\u0695\u06c6\u0698\u06d5 \u0632\u0627\u0646\u0633\u062a\u06cc\u06cc\u06d5\u06a9\u0627\u0646\u06cc \u0632\u0645\u0627\u0646\u060c \u0626\u06d5\u062f\u06d5\u0628 \u0648 \u06a9\u0648\u0644\u062a\u0648\u0648\u0631\u06cc \u06a9\u0648\u0631\u062f<\/h3>\n                <div class=\"contact-detail\">\n                    <span class=\"label\">\u0645\u0627\u06b5\u067e\u06d5\u0695:<\/span> \n                    <a href=\"https:\/\/kurdi.krd\" target=\"_blank\" class=\"ltr-text\">kurdi.krd<\/a>\n                <\/div>\n                <div class=\"contact-detail\">\n                    <span class=\"label\">\u062a\u06d5\u0644\u06d5\u0641\u06c6\u0646:<\/span> \n                    <span class=\"ltr-text phone\">+964 750 825 37 02<\/span>\n                <\/div>\n            <\/div>\n        <\/div>\n        \n    <\/div> \n<\/div>\n\n<script>\n    \/\/ --- 1. TAB SWITCHING LOGIC ---\n    function switchTab(tabId, buttonElement) {\n        document.querySelectorAll('.custom-audio-player audio').forEach(audio => {\n            audio.pause();\n            audio.currentTime = 0;\n            const player = audio.closest('.custom-audio-player');\n            if(player) {\n                player.querySelector('.icon-play').style.display = 'block';\n                player.querySelector('.icon-pause').style.display = 'none';\n                player.querySelector('.progress-filled').style.width = '0%';\n            }\n        });\n\n        document.querySelectorAll('.tab-content').forEach(tab => {\n            tab.classList.remove('active');\n        });\n\n        document.querySelectorAll('.tab-button').forEach(btn => {\n            btn.classList.remove('active');\n        });\n\n        document.getElementById(tabId).classList.add('active');\n        buttonElement.classList.add('active');\n    }\n\n    \/\/ --- 2. HTML GENERATOR HELPER ---\n    function generateCardHTML(title, img1, img2, audioUrl, dataKeyword, showNumber = false) {\n        const audioHTML = audioUrl ? `\n            <div class=\"custom-audio-player\">\n                <button class=\"play-pause-btn\" aria-label=\"Play\">\n                    <svg viewBox=\"0 0 24 24\" class=\"icon-play\"><polygon points=\"5 3 19 12 5 21 5 3\"><\/polygon><\/svg>\n                    <svg viewBox=\"0 0 24 24\" class=\"icon-pause\" style=\"display:none;\"><rect x=\"6\" y=\"4\" width=\"4\" height=\"16\"><\/rect><rect x=\"14\" y=\"4\" width=\"4\" height=\"16\"><\/rect><\/svg>\n                <\/button>\n                <div class=\"progress-wrapper\">\n                    <div class=\"progress-bar\"><div class=\"progress-filled\"><\/div><\/div>\n                <\/div>\n                <div class=\"time-display\">0:00 \/ 0:00<\/div>\n                <audio preload=\"none\" style=\"display:none;\">\n                    <source src=\"${audioUrl}\" type=\"audio\/mpeg\">\n                <\/audio>\n            <\/div>` : '';\n\n        const titleClass = showNumber ? \"card-title numbered-title\" : \"card-title\";\n        const img2HTML = img2 ? `<img decoding=\"async\" data-src=\"${img2}\" src=\"data:image\/gif;base64,R0lGODlhAQABAAD\/ACwAAAAAAQABAAACADs=\" alt=\"${title} Image 2\" class=\"lazy-trigger\">` : '';\n        const singleItemClass = !img2 ? 'single-item' : '';\n\n        return `\n        <div class=\"content-card glass-panel\" data-keyword=\"${dataKeyword}\">\n            <button class=\"card-header\" onclick=\"toggleLetterCard(this)\">\n                <h2 class=\"${titleClass}\">${title}<\/h2>\n                <svg class=\"toggle-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"6 9 12 15 18 9\"><\/polyline><\/svg>\n            <\/button>\n            <div class=\"card-content-wrapper\"><div class=\"card-content\"><div class=\"content-inner\">\n                <div class=\"media-container ${singleItemClass}\">\n                    <img decoding=\"async\" data-src=\"${img1}\" src=\"data:image\/gif;base64,R0lGODlhAQABAAD\/ACwAAAAAAQABAAACADs=\" alt=\"${title} Image 1\" class=\"lazy-trigger\">\n                    ${img2HTML}\n                <\/div>\n                ${audioHTML}\n            <\/div><\/div><\/div>\n        <\/div>`;\n    }\n\n    \/\/ --- 3. DYNAMIC DATA BUILDERS ---\n\n    \/\/ A. Alphabet\/Letters Data (Tab 1)\n  \/\/ A. Alphabet\/Letters Data (Tab 1) - Corrected Sequence\n    const lettersList = [\n        \"\u062f\", \"\u0627\", \"\u0631\", \"\u06cc\", \"\u0648\", \"\u06d5\", \"\u0648\u0648\", \"\u0632\", \"\u06c6\", \"\u0626\u0640\", \"\u06ce\", \"\u0695\", \"\u0698\", \n        \"\u06cc\u0640\", \"\u06ce\u0640\", \"\u0646\", \"\u0646\u0640\", \"\u0645\", \"\u0645\u0640\", \"\u0628\", \"\u0628\u0640\", \"\u062a\", \"\u062a\u0640\", \"\u0633\", \"\u0633\u0640\", \n        \"\u0634\", \"\u0634\u0640\", \"\u06a9\", \"\u06a9\u0640\", \"\u067e\", \"\u067e\u0640\", \"\u06af\", \"\u06af\u0640\", \"\u0644\", \"\u0644\u0640\", \"\u0644\u0627\", \"\u0647\u0640\", \n        \"\u06b5\", \"\u06b5\u0640\", \"\u06b5\u0627\", \"\u0642\", \"\u0642\u0640\", \"\u0641\", \"\u0641\u0640\", \"\u06a4\", \"\u06a4\u0640\", \"\u062d\", \"\u062d\u0640\", \"\u062c\", \n        \"\u062c\u0640\", \"\u0686\", \"\u0686\u0640\", \"\u062e\", \"\u062e\u0640\", \"\u0639\", \"\u0639\u0640\", \"\u063a\", \"\u063a\u0640\"\n    ];\n\n    let alphabetHTML = \"\";\n    lettersList.forEach((letter, index) => {\n        const position = index + 1; \n        const img1 = `http:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/Alfbe-BAL-${(position * 2) - 1}.png`;\n        const img2 = `http:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/Alfbe-BAL-${position * 2}.png`;\n        const audio = `https:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/Mp3-Page-${position}.mp3`;\n        \n        alphabetHTML += generateCardHTML(letter, img1, img2, audio, letter, true);\n    });\n    document.getElementById('dynamic-alphabet-container').innerHTML = alphabetHTML;\n\n    \/\/ B. Topics Data (Tab 2)\n    const topicsData = [\n        { title: \"\u067e\u06d5\u0644\u0627\u062a\u06cc\u0646\u06a9\", img1: 13, img2: 1, audio: 1 }, \n        { title: \"\u0642\u06d5\u0644\u06d5\u0645\", img1: 2, img2: 3, audio: 2 },\n        { title: \"\u067e\u0634\u06cc\u06a9\u0627 \u0645\u0646\", img1: 5, img2: 6, audio: 3 },\n        { title: \"\u062a\u06d5\u067e\u06a9\u0627 \u0645\u0646\u06ce\", img1: 8, img2: 4, audio: 4 }\n    ];\n    let topicsHTML = \"\";\n    topicsData.forEach(topic => {\n        const img1 = `http:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/images-BAL-${topic.img1}.png`;\n        const img2 = `http:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/images-BAL-${topic.img2}.png`;\n        const audio = `https:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/Mp3-Topic-${topic.audio}.mp3`;\n        \n        topicsHTML += generateCardHTML(topic.title, img1, img2, audio, topic.title, false);\n    });\n    document.getElementById('dynamic-topics-container').innerHTML = topicsHTML;\n\n    \/\/ C. Images\/Posters Data (Tab 3)\n    const postersData = [\n        { title: \"\u067e\u06c6\u0633\u062a\u06d5\u0631\u06cc \u0626\u06d5\u0644\u0641\u0628\u06ce \u0661\", img1: \"https:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/Alfbey-kurdi-post-cart-Badini-latini-final-25-6-2026_1-732x1024.png\", img2: \"https:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/Alfbey-kurdi-post-cart-Badini-latini-final-25-6-2026_2-732x1024.png\" },\n        { title: \"\u067e\u06c6\u0633\u062a\u06d5\u0631\u06cc \u0626\u06d5\u0644\u0641\u0628\u06ce \u0662\", img1: \"https:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/Alfbey-kurdi-post-cart-Badini-latini-final-25-6-2026_121-732x1024.png\", img2: \"https:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/Alfbey-kurdi-post-cart-Badini-latini-final-25-6-2026_122-732x1024.png\" },\n        { title: \"\u067e\u06c6\u0633\u062a\u06d5\u0631\u06cc \u0626\u06d5\u0644\u0641\u0628\u06ce \u0663\", img1: \"https:\/\/kurdi.krd\/wp-content\/uploads\/2026\/06\/ALFBE-BALX-732x1024.png\", img2: null }\n    ];\n    let postersHTML = \"\";\n    postersData.forEach(poster => {\n        postersHTML += generateCardHTML(poster.title, poster.img1, poster.img2, null, poster.title, false);\n    });\n    document.getElementById('dynamic-posters-container').innerHTML = postersHTML;\n\n    \/\/ --- 4. ACCORDION & LAZY LOADING ---\n    function toggleLetterCard(button) {\n        const card = button.closest('.content-card');\n        const isActive = card.classList.contains('active');\n        document.querySelectorAll('.content-card').forEach(c => {\n            c.classList.remove('active');\n            const audio = c.querySelector('audio');\n            if(audio) { audio.pause(); audio.currentTime = 0; }\n            const playIcon = c.querySelector('.icon-play');\n            const pauseIcon = c.querySelector('.icon-pause');\n            if(playIcon) playIcon.style.display = 'block';\n            if(pauseIcon) pauseIcon.style.display = 'none';\n        });\n        if (!isActive) {\n            const lazyImages = card.querySelectorAll('.lazy-trigger[data-src]');\n            lazyImages.forEach(img => { img.src = img.getAttribute('data-src'); img.removeAttribute('data-src'); });\n            card.classList.add('active');\n            setTimeout(() => { card.scrollIntoView({ behavior: 'smooth', block: 'start' }); }, 100);\n        }\n    }\n\n    \/\/ --- 5. URL PARAMETER REDIRECT (Barcode) ---\n    window.addEventListener('load', function() {\n        const urlParams = new URLSearchParams(window.location.search);\n        const targetLetter = urlParams.get('letter');\n        if (targetLetter) {\n            const targetCard = document.querySelector(`.content-card[data-keyword=\"${targetLetter}\"]`);\n            if (targetCard) {\n                const headerButton = targetCard.querySelector('.card-header');\n                if (headerButton) {\n                    setTimeout(() => { toggleLetterCard(headerButton); }, 800);\n                }\n            }\n        }\n    });\n\n    \/\/ --- 6. AUDIO & SEARCH LOGIC ---\n    document.querySelectorAll('.custom-audio-player').forEach(player => {\n        const audio = player.querySelector('audio');\n        const playBtn = player.querySelector('.play-pause-btn');\n        const playIcon = player.querySelector('.icon-play');\n        const pauseIcon = player.querySelector('.icon-pause');\n        const progressWrapper = player.querySelector('.progress-wrapper');\n        const progressFilled = player.querySelector('.progress-filled');\n        const timeDisplay = player.querySelector('.time-display');\n        audio.addEventListener('loadedmetadata', () => { timeDisplay.textContent = '0:00 \/ ' + formatTime(audio.duration); });\n        playBtn.addEventListener('click', (e) => {\n            e.stopPropagation(); \n            if (audio.readyState === 0) audio.load();\n            if (audio.paused) {\n                document.querySelectorAll('.custom-audio-player audio').forEach(otherAudio => {\n                    if (otherAudio !== audio) { otherAudio.pause(); const otherPlayer = otherAudio.closest('.custom-audio-player'); otherPlayer.querySelector('.icon-play').style.display = 'block'; otherPlayer.querySelector('.icon-pause').style.display = 'none'; }\n                });\n                audio.play(); playIcon.style.display = 'none'; pauseIcon.style.display = 'block';\n            } else { audio.pause(); playIcon.style.display = 'block'; pauseIcon.style.display = 'none'; }\n        });\n        audio.addEventListener('timeupdate', () => {\n            const percent = (audio.currentTime \/ audio.duration) * 100 || 0;\n            progressFilled.style.width = `${percent}%`;\n            timeDisplay.textContent = formatTime(audio.currentTime) + ' \/ ' + (audio.duration ? formatTime(audio.duration) : \"0:00\");\n        });\n        progressWrapper.addEventListener('click', (e) => {\n            e.stopPropagation();\n            if(!audio.duration) return; \n            const rect = progressWrapper.getBoundingClientRect();\n            const clickX = e.clientX - rect.left;\n            const percent = Math.max(0, Math.min(1, clickX \/ rect.width));\n            audio.currentTime = percent * audio.duration;\n        });\n        audio.addEventListener('ended', () => { playIcon.style.display = 'block'; pauseIcon.style.display = 'none'; progressFilled.style.width = '0%'; audio.currentTime = 0; });\n    });\n\n    function formatTime(s) { return Math.floor(s \/ 60) + \":\" + (Math.floor(s % 60) < 10 ? '0' : '') + Math.floor(s % 60); }\n\n    const searchInput = document.getElementById('alphabetSearch');\n    searchInput.addEventListener('input', function(e) {\n        const searchTerm = e.target.value.trim();\n        document.querySelectorAll('#dynamic-alphabet-container .content-card').forEach(card => {\n            const keyword = card.getAttribute('data-keyword');\n            if (searchTerm === '' || keyword.includes(searchTerm)) card.style.display = 'block';\n            else { card.style.display = 'none'; card.classList.remove('active'); const audio = card.querySelector('audio'); if(audio) { audio.pause(); card.querySelector('.icon-play').style.display = 'block'; card.querySelector('.icon-pause').style.display = 'none'; } }\n        });\n    });\n<\/script>\n\n\n\n<div id=\"qrcode-9rjno0oq\" class=\"wp-block-zolo-qrcode qrcode-9rjno0oq zolo-block parent-qrcode-9rjno0oq\"><div class=\"zolo-qrcode-wrapper\" data-options=\"{&quot;qrContent&quot;:&quot;https:\/\/kurdi.krd\/?p=1153&quot;,&quot;qrCodeSize&quot;:181,&quot;qrCodeLevel&quot;:&quot;M&quot;,&quot;codeColor&quot;:&quot;#000&quot;,&quot;qrCodePadding&quot;:&quot;&quot;,&quot;logoWidth&quot;:48,&quot;logoOpacity&quot;:1,&quot;logoPaddingStyle&quot;:&quot;square&quot;,&quot;logoPadding&quot;:&quot;&quot;,&quot;logoQrBehind&quot;:false,&quot;eyeColor&quot;:&quot;#000&quot;,&quot;eyeRadius&quot;:0,&quot;badgeStyle&quot;:&quot;zolo-badge-style-1&quot;,&quot;showBadge&quot;:false,&quot;showBadgeIcon&quot;:false,&quot;badgeText&quot;:&quot;Scan me&quot;,&quot;badgeIcon&quot;:&quot;&lt;svg xmlns=\\&quot;http:\/\/www.w3.org\/2000\/svg\\&quot; viewBox=\\&quot;0 0 448 512\\&quot;&gt;&lt;path d=\\&quot;M144 32C170.5 32 192 53.49 192 80V176C192 202.5 170.5 224 144 224H48C21.49 224 0 202.5 0 176V80C0 53.49 21.49 32 48 32H144zM128 96H64V160H128V96zM144 288C170.5 288 192 309.5 192 336V432C192 458.5 170.5 480 144 480H48C21.49 480 0 458.5 0 432V336C0 309.5 21.49 288 48 288H144zM128 352H64V416H128V352zM256 80C256 53.49 277.5 32 304 32H400C426.5 32 448 53.49 448 80V176C448 202.5 426.5 224 400 224H304C277.5 224 256 202.5 256 176V80zM320 160H384V96H320V160zM352 448H384V480H352V448zM448 480H416V448H448V480zM416 288H448V416H352V384H320V480H256V288H352V320H416V288z\\&quot;\/&gt;&lt;\/svg&gt;&quot;}\"><\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u062e\u0648\u06ce\u0646\u062f\u0646\u06d5\u0648\u06d5\u06cc \u067e\u06cc\u062a\u06d5\u06a9\u0627\u0646 \u0628\u0627\u0628\u06d5\u062a\u06d5\u06a9\u0627\u0646 \u0648\u06ce\u0646\u06d5\u06a9\u0627\u0646 \u0626\u06cc\u0646\u0633\u062a\u06cc\u062a\u0648\u0648\u062a\u06cc \u062e\u0648\u06ce\u0646\u062f\u0646\u06cc \u06a9\u0648\u0631\u062f\u06cc \u0628\u06d5\u0631\u0644\u06cc\u0646 \u0645\u0627\u06b5\u067e\u06d5\u0695: ifkurds.de \u062a\u06d5\u0644\u06d5\u0641\u06c6\u0646: +49 30 821 99 43 \u0645\u06c6\u0628\u0627\u06cc\u0644: 004917626854229 \u067e\u0695\u06c6\u0698\u06d5 \u0632\u0627\u0646\u0633\u062a\u06cc\u06cc\u06d5\u06a9\u0627\u0646\u06cc \u0632\u0645\u0627\u0646\u060c \u0626\u06d5\u062f\u06d5\u0628 \u0648 \u06a9\u0648\u0644\u062a\u0648\u0648\u0631\u06cc \u06a9\u0648\u0631\u062f \u0645\u0627\u06b5\u067e\u06d5\u0695: kurdi.krd \u062a\u06d5\u0644\u06d5\u0641\u06c6\u0646: +964 750 825 37 02<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1153","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/kurdi.krd\/index.php?rest_route=\/wp\/v2\/posts\/1153","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kurdi.krd\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kurdi.krd\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kurdi.krd\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/kurdi.krd\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1153"}],"version-history":[{"count":14,"href":"https:\/\/kurdi.krd\/index.php?rest_route=\/wp\/v2\/posts\/1153\/revisions"}],"predecessor-version":[{"id":1793,"href":"https:\/\/kurdi.krd\/index.php?rest_route=\/wp\/v2\/posts\/1153\/revisions\/1793"}],"wp:attachment":[{"href":"https:\/\/kurdi.krd\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1153"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kurdi.krd\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1153"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kurdi.krd\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1153"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}