{"id":204,"date":"2026-06-17T19:39:34","date_gmt":"2026-06-17T19:39:34","guid":{"rendered":"https:\/\/shefahospital.sa\/?page_id=204"},"modified":"2026-06-17T19:54:22","modified_gmt":"2026-06-17T19:54:22","slug":"gallery","status":"publish","type":"page","link":"https:\/\/shefahospital.sa\/ar\/gallery\/","title":{"rendered":"Gallery"},"content":{"rendered":"\n<script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500&amp;family=Noto+Kufi+Arabic:wght@400;700&amp;family=Playfair+Display:wght@600;700;800&amp;display=swap\" rel=\"stylesheet\">\n\n<style>\n    \/* SCOPED CSS: Unique ID for Gallery Banner *\/\n    #shefa-gallery-banner {\n        --banner-primary: oklch(62% .08 180);\n        --banner-foreground: oklch(99% .005 170);\n        \n        background-color: var(--banner-primary) !important;\n        \n        \/* Hex Pattern Integration *\/\n        background-image: url(\"data:image\/svg+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' width='60' height='52' viewBox='0 0 60 52'><path d='M15 1l14 8v16l-14 8L1 25V9zM45 1l14 8v16l-14 8-14-8V9z' fill='none' stroke='%2390c4e8' stroke-opacity='0.22' stroke-width='1'\/><\/svg>\");\n        background-repeat: repeat;\n    }\n\n    \/* Force white color using !important to prevent WordPress global overrides *\/\n    #shefa-gallery-banner .gallery-title,\n    #shefa-gallery-banner .gallery-desc {\n        color: var(--banner-foreground) !important;\n    }\n\n    \/* WP Auto-Paragraph hide specific to this scoped ID *\/\n    #shefa-gallery-banner p:empty, \n    #shefa-gallery-banner br { \n        display: none !important; \n    }\n<\/style>\n\n<section id=\"shefa-gallery-banner\" class=\"py-16 md:py-24 w-full flex items-center shadow-inner relative transition-all duration-300\">\n    <div class=\"container mx-auto px-6 md:px-12 lg:px-24\">\n        \n        <h1 class=\"gallery-title text-5xl md:text-6xl lg:text-7xl font-bold tracking-tight mb-4 text-start\">\n            <\/h1>\n        \n        <p class=\"gallery-desc text-base md:text-lg lg:text-xl max-w-2xl opacity-90 leading-relaxed text-start\">\n            <\/p>\n        \n    <\/div>\n<\/section>\n\n<script>\ndocument.addEventListener('DOMContentLoaded', () => {\n    \n    function initGalleryBanner() {\n        const bannerSection = document.getElementById('shefa-gallery-banner');\n        if (!bannerSection) return;\n\n        const titleEl = bannerSection.querySelector('.gallery-title');\n        const descEl = bannerSection.querySelector('.gallery-desc');\n\n        \/\/ Translation Dictionary (English & Arabic) tailored for the Gallery\n        const data = {\n            en: { \n                titleFont: \"'Playfair Display', serif\", \n                bodyFont: \"'Inter', sans-serif\",\n                title: \"Hospital Gallery\", \n                desc: \"Explore our state-of-the-art facilities and medical events.\" \n            },\n            ar: { \n                titleFont: \"'Noto Kufi Arabic', sans-serif\", \n                bodyFont: \"'Noto Kufi Arabic', sans-serif\",\n                title: \"\u0645\u0639\u0631\u0636 \u0627\u0644\u0645\u0633\u062a\u0634\u0641\u0649\", \n                desc: \"\u0627\u0643\u062a\u0634\u0641 \u0645\u0631\u0627\u0641\u0642\u0646\u0627 \u0627\u0644\u0645\u062a\u0637\u0648\u0631\u0629 \u0648\u0641\u0639\u0627\u0644\u064a\u0627\u062a\u0646\u0627 \u0627\u0644\u0637\u0628\u064a\u0629.\" \n            }\n        };\n\n        \/\/ Lang\/RTL Detection\n        const htmlElement = document.documentElement;\n        const isRtl = htmlElement.dir === 'rtl' || htmlElement.lang.includes('ar');\n        const lang = isRtl ? 'ar' : 'en';\n        const content = data[lang];\n\n        bannerSection.setAttribute('dir', isRtl ? 'rtl' : 'ltr');\n\n        \/\/ Inject Data with font styles\n        if(titleEl) {\n            titleEl.textContent = content.title;\n            titleEl.style.fontFamily = content.titleFont;\n        }\n        \n        if(descEl) {\n            descEl.textContent = content.desc;\n            descEl.style.fontFamily = content.bodyFont;\n        }\n    }\n\n    \/\/ Run on load\n    initGalleryBanner();\n\n    \/\/ Observe HTML tag for language changes by TranslatePress\n    const observer = new MutationObserver(initGalleryBanner);\n    observer.observe(document.documentElement, { \n        attributes: true, \n        attributeFilter: ['lang', 'dir'] \n    });\n});\n<\/script>\n\n\n    <style class=\"trp-ignore\" data-no-translation>\n        :root { --font-arabic: \"Noto Kufi Arabic\", sans-serif; --font-display: \"Playfair Display\", serif; }\n        .lang-en { display: block; }\n        .lang-ar { display: none; }\n        html[dir=\"rtl\"] .lang-en, [dir=\"rtl\"] .lang-en, html[lang*=\"ar\"] .lang-en, body.rtl .lang-en { display: none; }\n        html[dir=\"rtl\"] .lang-ar, [dir=\"rtl\"] .lang-ar, html[lang*=\"ar\"] .lang-ar, body.rtl .lang-ar { display: block; }\n        .lang-en-inline { display: inline; }\n        .lang-ar-inline { display: none; }\n        html[dir=\"rtl\"] .lang-en-inline, [dir=\"rtl\"] .lang-en-inline, html[lang*=\"ar\"] .lang-en-inline, body.rtl .lang-en-inline { display: none; }\n        html[dir=\"rtl\"] .lang-ar-inline, [dir=\"rtl\"] .lang-ar-inline, html[lang*=\"ar\"] .lang-ar-inline, body.rtl .lang-ar-inline { display: inline; }\n        .shefa-gallery-bg {\n            background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='180' height='156' viewBox='0 0 180 156'%3E%3Cg fill='none' stroke='%2390c4e8' stroke-opacity='0.45' stroke-width='1.1'%3E%3Cpath d='M45 3l42 24v48l-42 24-42-24V27z'\/%3E%3Cpath d='M135 3l42 24v48l-42 24-42-24V27z'\/%3E%3Cpath d='M90 81l42 24v48l-42 24-42-24v-48z'\/%3E%3C\/g%3E%3Cg fill='%2390c4e8' fill-opacity='0.55'%3E%3Ccircle cx='45' cy='3' r='2'\/%3E%3Ccircle cx='87' cy='27' r='2'\/%3E%3Ccircle cx='87' cy='75' r='2'\/%3E%3Ccircle cx='45' cy='99' r='2'\/%3E%3Ccircle cx='3' cy='75' r='2'\/%3E%3Ccircle cx='3' cy='27' r='2'\/%3E%3Ccircle cx='135' cy='3' r='2'\/%3E%3Ccircle cx='177' cy='27' r='2'\/%3E%3Ccircle cx='177' cy='75' r='2'\/%3E%3Ccircle cx='135' cy='99' r='2'\/%3E%3Ccircle cx='90' cy='81' r='2'\/%3E%3Ccircle cx='132' cy='105' r='2'\/%3E%3Ccircle cx='132' cy='153' r='2'\/%3E%3Ccircle cx='90' cy='177' r='2'\/%3E%3Ccircle cx='48' cy='153' r='2'\/%3E%3Ccircle cx='48' cy='105' r='2'\/%3E%3C\/g%3E%3C\/svg%3E\");\n            background-size: 180px 156px; background-repeat: repeat; background-position: center top;\n        }\n    <\/style>\n    <section id=\"gallery-container\" class=\"relative overflow-hidden bg-[#e3f2fb] py-16 md:py-24 min-h-[70vh]\">\n        <div class=\"absolute inset-0 z-0 opacity-[0.35] pointer-events-none shefa-gallery-bg\"><\/div>\n        <div class=\"container mx-auto px-5 lg:px-8 relative z-10 max-w-7xl\">\n                            <div class=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-8 md:gap-10\">\n                                        <a href=\"\/ar\/wp-json\/wp\/v2\/pages\/204?album_id=1835\" class=\"group block relative rounded-[2rem] overflow-hidden shadow-lg hover:shadow-2xl transition-all duration-500 !no-underline aspect-[4\/5] transform hover:-translate-y-2 bg-slate-800\">\n                        <img decoding=\"async\" src=\"https:\/\/shefahospital.sa\/wp-content\/uploads\/2026\/06\/shefa-logo.png\" class=\"absolute inset-0 w-1\/2 h-full object-contain mx-auto opacity-20 transition-transform duration-1000 group-hover:scale-110\">                        <div class=\"absolute inset-0 bg-gradient-to-t from-[#0f172a] via-[#0f172a]\/40 to-transparent opacity-80 group-hover:opacity-90 transition-opacity duration-500\"><\/div>\n                        <div class=\"absolute inset-0 flex items-center justify-center opacity-0 scale-90 group-hover:opacity-100 group-hover:scale-100 transition-all duration-500\">\n                            <span class=\"bg-white\/20 backdrop-blur-md border border-white\/40 text-white font-bold tracking-widest uppercase text-xs md:text-sm px-6 py-3 rounded-full flex items-center gap-2\">\n                                <span class=\"lang-en-inline\">View Album<\/span>\n                                <span class=\"lang-ar-inline\">\u0639\u0631\u0636 \u0627\u0644\u0623\u0644\u0628\u0648\u0645<\/span>\n                                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"rtl:rotate-180\"><path d=\"m9 18 6-6-6-6\"\/><\/svg>\n                            <\/span>\n                        <\/div>\n                        <div class=\"absolute bottom-0 left-0 right-0 p-6 md:p-8 transform translate-y-3 group-hover:translate-y-0 transition-transform duration-500 flex flex-col items-start rtl:items-end\">\n                            <h3 class=\"text-2xl md:text-3xl font-bold text-white mb-3 drop-shadow-md leading-tight\">Offers For The Month<\/h3>\n                            <div class=\"inline-flex items-center gap-2 text-[#f59e0b] font-medium text-[13px] tracking-wide bg-white\/10 px-3.5 py-1.5 rounded-full backdrop-blur-sm border border-white\/10\">\n                                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\" ry=\"2\"\/><circle cx=\"9\" cy=\"9\" r=\"2\"\/><path d=\"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\"\/><\/svg>\n                                <span>4 <span class=\"lang-en-inline\">Photos<\/span><span class=\"lang-ar-inline\">\u0627\u0644\u0635\u0648\u0631<\/span><\/span>\n                            <\/div>\n                        <\/div>\n                    <\/a>\n                                        <a href=\"\/ar\/wp-json\/wp\/v2\/pages\/204?album_id=1806\" class=\"group block relative rounded-[2rem] overflow-hidden shadow-lg hover:shadow-2xl transition-all duration-500 !no-underline aspect-[4\/5] transform hover:-translate-y-2 bg-slate-800\">\n                        <img decoding=\"async\" src=\"https:\/\/shefahospital.sa\/wp-content\/uploads\/2026\/06\/shefa-logo.png\" class=\"absolute inset-0 w-1\/2 h-full object-contain mx-auto opacity-20 transition-transform duration-1000 group-hover:scale-110\">                        <div class=\"absolute inset-0 bg-gradient-to-t from-[#0f172a] via-[#0f172a]\/40 to-transparent opacity-80 group-hover:opacity-90 transition-opacity duration-500\"><\/div>\n                        <div class=\"absolute inset-0 flex items-center justify-center opacity-0 scale-90 group-hover:opacity-100 group-hover:scale-100 transition-all duration-500\">\n                            <span class=\"bg-white\/20 backdrop-blur-md border border-white\/40 text-white font-bold tracking-widest uppercase text-xs md:text-sm px-6 py-3 rounded-full flex items-center gap-2\">\n                                <span class=\"lang-en-inline\">View Album<\/span>\n                                <span class=\"lang-ar-inline\">\u0639\u0631\u0636 \u0627\u0644\u0623\u0644\u0628\u0648\u0645<\/span>\n                                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"rtl:rotate-180\"><path d=\"m9 18 6-6-6-6\"\/><\/svg>\n                            <\/span>\n                        <\/div>\n                        <div class=\"absolute bottom-0 left-0 right-0 p-6 md:p-8 transform translate-y-3 group-hover:translate-y-0 transition-transform duration-500 flex flex-col items-start rtl:items-end\">\n                            <h3 class=\"text-2xl md:text-3xl font-bold text-white mb-3 drop-shadow-md leading-tight\">Brochure<\/h3>\n                            <div class=\"inline-flex items-center gap-2 text-[#f59e0b] font-medium text-[13px] tracking-wide bg-white\/10 px-3.5 py-1.5 rounded-full backdrop-blur-sm border border-white\/10\">\n                                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\" ry=\"2\"\/><circle cx=\"9\" cy=\"9\" r=\"2\"\/><path d=\"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\"\/><\/svg>\n                                <span>19 <span class=\"lang-en-inline\">Photos<\/span><span class=\"lang-ar-inline\">\u0627\u0644\u0635\u0648\u0631<\/span><\/span>\n                            <\/div>\n                        <\/div>\n                    <\/a>\n                                        <a href=\"\/ar\/wp-json\/wp\/v2\/pages\/204?album_id=211\" class=\"group block relative rounded-[2rem] overflow-hidden shadow-lg hover:shadow-2xl transition-all duration-500 !no-underline aspect-[4\/5] transform hover:-translate-y-2 bg-slate-800\">\n                        <img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/shefahospital.sa\/wp-content\/uploads\/2026\/06\/Shefa-hospital-Banner-1-1024x768.webp\" class=\"absolute inset-0 w-full h-full object-cover transition-transform duration-1000 group-hover:scale-110 opacity-90 group-hover:opacity-100 wp-post-image\" alt=\"\" srcset=\"https:\/\/shefahospital.sa\/wp-content\/uploads\/2026\/06\/Shefa-hospital-Banner-1-1024x768.webp 1024w, https:\/\/shefahospital.sa\/wp-content\/uploads\/2026\/06\/Shefa-hospital-Banner-1-300x225.webp 300w, https:\/\/shefahospital.sa\/wp-content\/uploads\/2026\/06\/Shefa-hospital-Banner-1-768x576.webp 768w, https:\/\/shefahospital.sa\/wp-content\/uploads\/2026\/06\/Shefa-hospital-Banner-1-16x12.webp 16w, https:\/\/shefahospital.sa\/wp-content\/uploads\/2026\/06\/Shefa-hospital-Banner-1.webp 1080w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/>                        <div class=\"absolute inset-0 bg-gradient-to-t from-[#0f172a] via-[#0f172a]\/40 to-transparent opacity-80 group-hover:opacity-90 transition-opacity duration-500\"><\/div>\n                        <div class=\"absolute inset-0 flex items-center justify-center opacity-0 scale-90 group-hover:opacity-100 group-hover:scale-100 transition-all duration-500\">\n                            <span class=\"bg-white\/20 backdrop-blur-md border border-white\/40 text-white font-bold tracking-widest uppercase text-xs md:text-sm px-6 py-3 rounded-full flex items-center gap-2\">\n                                <span class=\"lang-en-inline\">View Album<\/span>\n                                <span class=\"lang-ar-inline\">\u0639\u0631\u0636 \u0627\u0644\u0623\u0644\u0628\u0648\u0645<\/span>\n                                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"rtl:rotate-180\"><path d=\"m9 18 6-6-6-6\"\/><\/svg>\n                            <\/span>\n                        <\/div>\n                        <div class=\"absolute bottom-0 left-0 right-0 p-6 md:p-8 transform translate-y-3 group-hover:translate-y-0 transition-transform duration-500 flex flex-col items-start rtl:items-end\">\n                            <h3 class=\"text-2xl md:text-3xl font-bold text-white mb-3 drop-shadow-md leading-tight\">Hospital Images<\/h3>\n                            <div class=\"inline-flex items-center gap-2 text-[#f59e0b] font-medium text-[13px] tracking-wide bg-white\/10 px-3.5 py-1.5 rounded-full backdrop-blur-sm border border-white\/10\">\n                                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\" ry=\"2\"\/><circle cx=\"9\" cy=\"9\" r=\"2\"\/><path d=\"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\"\/><\/svg>\n                                <span>16 <span class=\"lang-en-inline\">Photos<\/span><span class=\"lang-ar-inline\">\u0627\u0644\u0635\u0648\u0631<\/span><\/span>\n                            <\/div>\n                        <\/div>\n                    <\/a>\n                                    <\/div>\n                    <\/div>\n    <\/section>\n\n    <!-- LIGHTBOX POPUP -->\n    <div id=\"lightbox\" class=\"fixed inset-0 z-[99999] bg-black\/95 hidden flex-col items-center justify-center opacity-0 transition-opacity duration-300\">\n        <div class=\"absolute top-0 left-0 right-0 p-4 md:p-6 flex justify-between items-center bg-gradient-to-b from-black\/80 to-transparent z-50\">\n            <h3 id=\"lightbox-cat-name\" class=\"text-white text-lg md:text-2xl font-bold tracking-wide drop-shadow-md\"><\/h3>\n            <div class=\"flex items-center gap-4\">\n                <span id=\"lightbox-counter\" class=\"text-white\/80 font-medium text-sm md:text-base\"><\/span>\n                <button onclick=\"closeLightbox()\" class=\"text-white hover:text-[#f59e0b] transition-colors p-2 bg-white\/10 rounded-full backdrop-blur-md\">\n                    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"><\/line><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"><\/line><\/svg>\n                <\/button>\n            <\/div>\n        <\/div>\n        <button onclick=\"prevImage(event)\" class=\"absolute left-4 md:left-8 top-1\/2 -translate-y-1\/2 text-white hover:text-[#f59e0b] p-3 md:p-4 bg-black\/40 hover:bg-white\/10 rounded-full backdrop-blur-md transition-all z-50 group\">\n            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"28\" height=\"28\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"group-hover:-translate-x-1 transition-transform rtl:rotate-180 rtl:group-hover:translate-x-1\"><path d=\"m15 18-6-6 6-6\"\/><\/svg>\n        <\/button>\n        <div class=\"relative flex items-center justify-center w-full h-full p-4 md:p-12 overflow-hidden\">\n            <img decoding=\"async\" id=\"lightbox-img\" src=\"\" class=\"max-w-full max-h-full object-contain rounded-lg shadow-2xl scale-95 transition-all duration-300\" alt=\"Full screen image\">\n        <\/div>\n        <button onclick=\"nextImage(event)\" class=\"absolute right-4 md:right-8 top-1\/2 -translate-y-1\/2 text-white hover:text-[#f59e0b] p-3 md:p-4 bg-black\/40 hover:bg-white\/10 rounded-full backdrop-blur-md transition-all z-50 group\">\n            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"28\" height=\"28\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"group-hover:translate-x-1 transition-transform rtl:rotate-180 rtl:group-hover:-translate-x-1\"><path d=\"m9 18 6-6-6-6\"\/><\/svg>\n        <\/button>\n    <\/div>\n\n    <script class=\"trp-ignore\" data-no-translation=\"true\">\n    var galleryImages = [];\n    var currentIndex = 0;\n    var lightbox = document.getElementById('lightbox');\n    var lightboxImg = document.getElementById('lightbox-img');\n    var lightboxCatName = document.getElementById('lightbox-cat-name');\n    var lightboxCounter = document.getElementById('lightbox-counter');\n    var titleHeader = document.querySelector('h1');\n\n    document.addEventListener('DOMContentLoaded', function() {\n        var items = document.querySelectorAll('.gallery-item img');\n        items.forEach(function(img) {\n            galleryImages.push(img.getAttribute('data-full'));\n        });\n    });\n\n    function updateLightboxImage() {\n        lightboxImg.classList.remove('scale-100', 'opacity-100');\n        lightboxImg.classList.add('scale-95', 'opacity-0');\n        setTimeout(function() {\n            lightboxImg.src = galleryImages[currentIndex];\n            lightboxCounter.innerText = (currentIndex + 1) + ' \/ ' + galleryImages.length;\n            lightboxImg.classList.remove('scale-95', 'opacity-0');\n            lightboxImg.classList.add('scale-100', 'opacity-100');\n        }, 200);\n    }\n\n    function openLightbox(index) {\n        if(galleryImages.length === 0) return;\n        currentIndex = index;\n        if(titleHeader) lightboxCatName.innerText = titleHeader.innerText;\n        updateLightboxImage();\n        lightbox.classList.remove('hidden');\n        setTimeout(function() { lightbox.classList.remove('opacity-0'); }, 10);\n        document.body.style.overflow = 'hidden';\n    }\n\n    function closeLightbox() {\n        lightbox.classList.add('opacity-0');\n        lightboxImg.classList.remove('scale-100', 'opacity-100');\n        lightboxImg.classList.add('scale-95', 'opacity-0');\n        setTimeout(function() { lightbox.classList.add('hidden'); lightboxImg.src = ''; }, 300);\n        document.body.style.overflow = 'auto';\n    }\n\n    function nextImage(e) {\n        if(e) e.stopPropagation(); \n        currentIndex = (currentIndex + 1) % galleryImages.length;\n        updateLightboxImage();\n    }\n    function prevImage(e) {\n        if(e) e.stopPropagation();\n        currentIndex = (currentIndex - 1 + galleryImages.length) % galleryImages.length;\n        updateLightboxImage();\n    }\n    document.addEventListener('keydown', function(e) { \n        if(lightbox.classList.contains('hidden')) return;\n        if (e.key === \"Escape\") closeLightbox(); \n        if (e.key === \"ArrowRight\") nextImage();\n        if (e.key === \"ArrowLeft\") prevImage();\n    });\n    if(lightbox) {\n        lightbox.addEventListener('click', function(e) { \n            if (e.target === lightbox || e.target.closest('.relative.flex') === e.target) closeLightbox(); \n        });\n    }\n    <\/script>\n    \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-204","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/shefahospital.sa\/ar\/wp-json\/wp\/v2\/pages\/204","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/shefahospital.sa\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/shefahospital.sa\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/shefahospital.sa\/ar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/shefahospital.sa\/ar\/wp-json\/wp\/v2\/comments?post=204"}],"version-history":[{"count":5,"href":"https:\/\/shefahospital.sa\/ar\/wp-json\/wp\/v2\/pages\/204\/revisions"}],"predecessor-version":[{"id":210,"href":"https:\/\/shefahospital.sa\/ar\/wp-json\/wp\/v2\/pages\/204\/revisions\/210"}],"wp:attachment":[{"href":"https:\/\/shefahospital.sa\/ar\/wp-json\/wp\/v2\/media?parent=204"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}