{"id":366,"date":"2025-08-27T16:02:37","date_gmt":"2025-08-27T16:02:37","guid":{"rendered":"https:\/\/crownhospital.ae\/hospital\/?page_id=366"},"modified":"2026-07-05T07:36:33","modified_gmt":"2026-07-05T07:36:33","slug":"department","status":"publish","type":"page","link":"https:\/\/crownhospital.ae\/hospital\/department\/","title":{"rendered":"Department"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"366\" class=\"elementor elementor-366\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7835e3a8 e-flex e-con-boxed e-con e-parent\" data-id=\"7835e3a8\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5527041f elementor-widget elementor-widget-heading\" data-id=\"5527041f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Medical<br>\nDepartments<\/h1>\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-1140906f e-flex e-con-boxed e-con e-parent\" data-id=\"1140906f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-51e01960 elementor-widget elementor-widget-heading\" data-id=\"51e01960\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Our Medical Departments <\/h1>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1406a08 elementor-widget elementor-widget-heading\" data-id=\"1406a08\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Specialized Care, Expert Teams<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4970847b elementor-widget elementor-widget-text-editor\" data-id=\"4970847b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Our hospital is also home to a range of specialty clinics, including a diabetes clinic, a hypertension clinic, and a cancer care center. We believe that prevention is the best medicine, which is why we offer comprehensive health check-ups to help our patients stay healthy and catch any potential health issues early on.<\/p><p>\u2028Our exclusive focus on outpatient procedures allows us to minimize hospital time, reduce overall costs, and enhance patient experience. At Crown Hospital, we are committed to efficiency without compromise\u2014ensuring every patient receives an expert diagnosis, treatment, and recovery support all within a single day.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e88a032 e-con-full e-flex e-con e-child\" data-id=\"e88a032\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-47806e3 elementor-widget elementor-widget-html\" data-id=\"47806e3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@400;500;700;800&display=swap\" rel=\"stylesheet\">\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/flatpickr\/dist\/flatpickr.min.css\">\r\n\r\n<style>\r\n.dep-page{\r\n    --navy: #001c54;\r\n    --navy-hover: #001236;\r\n    --text-color:#222;\r\n    --text-mute:#6b7280;\r\n    --border-color:#e5e7eb;\r\n    --bg-color:#ffffff;\r\n    --sidebar-bg:#fafafa;\r\n\r\n    font-family: 'Roboto', Tahoma, Geneva, Verdana, sans-serif;\r\n    color: var(--text-color);\r\n    background: var(--bg-color);\r\n    max-width: 1300px;\r\n    margin: 0 auto;\r\n    padding: 40px 24px;\r\n}\r\n\r\n.dep-page *{\r\n    box-sizing: border-box;\r\n}\r\n\r\n.dep-layout{\r\n    display: grid;\r\n    grid-template-columns: 280px 1fr;\r\n    gap: 40px;\r\n    align-items: start;\r\n}\r\n\r\n\/* ---- Sidebar ---- *\/\r\n.dep-sidebar-title{\r\n    font-size: 13px;\r\n    font-weight: 700;\r\n    letter-spacing: 0.06em;\r\n    color: var(--navy);\r\n    margin-bottom: 14px;\r\n}\r\n\r\n.dep-sidebar-list{\r\n    list-style: none;\r\n    margin: 0;\r\n    padding: 0;\r\n    border: 1px solid var(--border-color);\r\n    border-radius: 10px;\r\n    overflow: hidden;\r\n}\r\n\r\n.dep-sidebar-item{\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    padding: 14px 16px;\r\n    font-size: 14px;\r\n    color: var(--navy);\r\n    cursor: pointer;\r\n    border-bottom: 1px solid var(--border-color);\r\n    background: var(--sidebar-bg);\r\n    transition: background 0.15s ease, color 0.15s ease;\r\n}\r\n\r\n.dep-sidebar-item:last-child{\r\n    border-bottom: none;\r\n}\r\n\r\n.dep-sidebar-item:hover{\r\n    background: #f0f2f7;\r\n}\r\n\r\n.dep-sidebar-item.active{\r\n    background: var(--navy);\r\n    color: #fff;\r\n}\r\n\r\n.dep-sidebar-item .dep-arrow{\r\n    opacity: 0.6;\r\n    font-size: 12px;\r\n}\r\n\r\n\/* ---- Main content ---- *\/\r\n.dep-title{\r\n    font-size: 22px;\r\n    font-weight: 800;\r\n    letter-spacing: 0.02em;\r\n    color: var(--navy);\r\n    margin-bottom: 20px;\r\n    text-transform: uppercase;\r\n}\r\n\r\n.dep-hero-img{\r\n    width: 100%;\r\n    max-height: 320px;\r\n    object-fit: cover;\r\n    border-radius: 10px;\r\n    margin-bottom: 20px;\r\n    background: #eee;\r\n}\r\n\r\n.dep-description{\r\n    font-size: 14.5px;\r\n    line-height: 1.7;\r\n    color: var(--text-color);\r\n    margin-bottom: 18px;\r\n}\r\n\r\n.dep-services-label{\r\n    font-size: 14px;\r\n    font-weight: 700;\r\n    color: var(--navy);\r\n    margin-bottom: 10px;\r\n}\r\n\r\n.dep-services-list{\r\n    list-style: none;\r\n    margin: 0 0 18px 0;\r\n    padding: 0;\r\n}\r\n\r\n.dep-services-list li{\r\n    position: relative;\r\n    padding-left: 18px;\r\n    font-size: 14px;\r\n    color: var(--text-color);\r\n    margin-bottom: 8px;\r\n    line-height: 1.5;\r\n}\r\n\r\n.dep-services-list li:before{\r\n    content: \"\";\r\n    position: absolute;\r\n    left: 0;\r\n    top: 8px;\r\n    width: 5px;\r\n    height: 5px;\r\n    background: var(--navy);\r\n    border-radius: 1px;\r\n}\r\n\r\n.dep-tagline{\r\n    font-size: 14px;\r\n    font-weight: 700;\r\n    color: var(--navy);\r\n    margin-bottom: 32px;\r\n}\r\n\r\n.dep-divider{\r\n    border: none;\r\n    border-top: 1px solid var(--border-color);\r\n    margin: 8px 0 32px;\r\n}\r\n\r\n\/* ---- Doctor cards ---- *\/\r\n.dep-doctors{\r\n    display: grid;\r\n    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));\r\n    gap: 24px;\r\n}\r\n\r\n.dep-doctor-card{\r\n    display: flex;\r\n    flex-direction: column;\r\n    height: 100%;\r\n    border: 1px solid var(--border-color);\r\n    border-radius: 10px;\r\n    overflow: hidden;\r\n    background: #fff;\r\n}\r\n\r\n.dep-doctor-photo{\r\n    width: 100%;\r\n    aspect-ratio: 1 \/ 1;\r\n    height: auto;\r\n    object-fit: cover;\r\n    object-position: center 20%;\r\n    background: #e5e7eb;\r\n    display: block;\r\n}\r\n\r\n.dep-doctor-body{\r\n    flex: 1;\r\n    display: flex;\r\n    flex-direction: column;\r\n    padding: 14px 16px 18px;\r\n}\r\n\r\n.dep-doctor-name{\r\n    font-size: 14px;\r\n    font-weight: 700;\r\n    color: var(--navy);\r\n    margin-bottom: 2px;\r\n}\r\n\r\n.dep-doctor-dept{\r\n    font-size: 12.5px;\r\n    color: var(--text-mute);\r\n    margin-bottom: 8px;\r\n}\r\n\r\n.dep-doctor-qual{\r\n    font-size: 12px;\r\n    color: var(--text-mute);\r\n    margin-bottom: 14px;\r\n    flex: 1;\r\n}\r\n\r\n.dep-doctors-title{\r\n    font-size: 20px;\r\n    font-weight: 700;\r\n    color: var(--navy);\r\n    margin-bottom: 16px;\r\n}\r\n\r\n.dep-book-btn{\r\n    display: inline-block;\r\n    width: 100%;\r\n    text-align: center;\r\n    background: var(--navy);\r\n    color: #fff;\r\n    border: none;\r\n    padding: 10px 0;\r\n    border-radius: 4px;\r\n    font-size: 13px;\r\n    font-weight: 700;\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    transition: background 0.15s ease;\r\n}\r\n\r\n.dep-book-btn:hover{\r\n    background: var(--navy-hover);\r\n}\r\n\r\n.dep-empty-state{\r\n    font-size: 14px;\r\n    color: var(--text-mute);\r\n    padding: 40px 0;\r\n    text-align: center;\r\n}\r\n\r\n@media (max-width: 860px){\r\n    .dep-layout{\r\n        grid-template-columns: 1fr;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<div class=\"dep-page\">\r\n    <div class=\"dep-layout\">\r\n\r\n        <div>\r\n            <div class=\"dep-sidebar-title\">DEPARTMENT<\/div>\r\n            <ul class=\"dep-sidebar-list\" id=\"dep-sidebar-list\">\r\n                <li class=\"dep-sidebar-item\">Loading departments\u2026<\/li>\r\n            <\/ul>\r\n        <\/div>\r\n\r\n        <div>\r\n            <div id=\"dep-main-content\">\r\n                <div class=\"dep-empty-state\">Select a department to see details.<\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function () {\r\n\r\n    const API_URL = 'https:\/\/dashboard.crownhospital.ae';\r\n    const API_KEY = 'crown_api_be60fba42921a42ef84d72cebfa42921';\r\n\r\n    \/\/ Fallback image only used if a department\/doctor record has no photo set.\r\n    const FALLBACK_IMAGE = \"https:\/\/images.unsplash.com\/photo-1519494026892-80bbd2d6fd0d?w=1200&q=80\";\r\n\r\n    \/\/ Your \/api\/departments photo fields are coming back wrapped in markdown\r\n    \/\/ link syntax, e.g.:\r\n    \/\/   https:\/\/[dashboard.crownhospital.ae](http:\/\/dashboard.crownhospital.ae\/)\/uploads\/xyz.png\r\n    \/\/ instead of a plain URL. This pulls the real domain back out and\r\n    \/\/ reassembles a clean, working URL. If the API is later fixed to send\r\n    \/\/ plain URLs, this function just passes them through unchanged.\r\n    function cleanPhotoUrl(url) {\r\n        if (!url) return null;\r\n        const match = url.match(\/^(https?:\\\/\\\/)\\[([^\\]]+)\\]\\([^)]*\\)(\\\/.*)$\/);\r\n        if (match) {\r\n            return match[1] + match[2] + match[3];\r\n        }\r\n        return url;\r\n    }\r\n\r\n    const sidebarList = document.getElementById('dep-sidebar-list');\r\n    const mainContent = document.getElementById('dep-main-content');\r\n    let departmentsData = [];\r\n\r\n    fetch(API_URL + '\/api\/departments', {\r\n        headers: {\r\n            'Accept': 'application\/json',\r\n            'X-API-KEY': API_KEY\r\n        }\r\n    })\r\n        .then(res => res.json())\r\n        .then(data => {\r\n            departmentsData = data;\r\n            renderSidebar();\r\n            if (departmentsData.length) {\r\n                selectDepartment(departmentsData[0].code);\r\n            }\r\n        })\r\n        .catch(err => {\r\n            console.error(\"Error loading departments:\", err);\r\n            sidebarList.innerHTML = '<li class=\"dep-sidebar-item\">Unable to load departments<\/li>';\r\n        });\r\n\r\n    function renderSidebar() {\r\n        sidebarList.innerHTML = '';\r\n        departmentsData.forEach(dept => {\r\n            const li = document.createElement('li');\r\n            li.className = 'dep-sidebar-item';\r\n            li.dataset.code = dept.code;\r\n            li.innerHTML = '<span>' + dept.name + '<\/span><span class=\"dep-arrow\">\u203a<\/span>';\r\n            li.addEventListener('click', function () {\r\n                selectDepartment(dept.code);\r\n            });\r\n            sidebarList.appendChild(li);\r\n        });\r\n    }\r\n\r\n    function selectDepartment(code) {\r\n        const dept = departmentsData.find(d => d.code === code);\r\n        if (!dept) return;\r\n\r\n        sidebarList.querySelectorAll('.dep-sidebar-item').forEach(item => {\r\n            item.classList.toggle('active', item.dataset.code === code);\r\n        });\r\n\r\n        let doctorsHtml = '<div class=\"dep-empty-state\">No doctors listed for this department yet.<\/div>';\r\n        if (dept.doctors && dept.doctors.length) {\r\n            doctorsHtml = '<div class=\"dep-doctors-title\">Doctors<\/div><div class=\"dep-doctors\">' +\r\n                dept.doctors.map(doc => {\r\n                    const photo = cleanPhotoUrl(doc.photo) || FALLBACK_IMAGE;\r\n                    const qual = doc.description || 'Specialist';\r\n                    return '' +\r\n                        '<div class=\"dep-doctor-card\">' +\r\n                            '<img decoding=\"async\" class=\"dep-doctor-photo\" src=\"' + photo + '\" alt=\"' + doc.name + '\">' +\r\n                            '<div class=\"dep-doctor-body\">' +\r\n                                '<div class=\"dep-doctor-name\">' + doc.name + '<\/div>' +\r\n                                '<div class=\"dep-doctor-dept\">' + dept.name + '<\/div>' +\r\n                                '<div class=\"dep-doctor-qual\">' + qual + '<\/div>' +\r\n                                '<button type=\"button\" class=\"dep-book-btn\" data-doctor=\"' + doc.name + '\">Book Appointment<\/button>' +\r\n                            '<\/div>' +\r\n                        '<\/div>';\r\n                }).join('') +\r\n            '<\/div>';\r\n        }\r\n\r\n        mainContent.innerHTML =\r\n            '<div class=\"dep-title\">' + dept.name + '<\/div>' +\r\n            '<img decoding=\"async\" class=\"dep-hero-img\" src=\"' + (cleanPhotoUrl(dept.photo) || FALLBACK_IMAGE) + '\" alt=\"' + dept.name + '\">' +\r\n            '<div class=\"dep-description\">' + (dept.description || '') + '<\/div>' +\r\n            '<hr class=\"dep-divider\">' +\r\n            doctorsHtml;\r\n\r\n        \/\/ Hook up \"Book Appointment\" buttons to scroll to \/ prefill your\r\n        \/\/ existing booking widget if it's on the same page. Adjust the\r\n        \/\/ selector below to match wherever your .bap-widget form lives.\r\n        mainContent.querySelectorAll('.dep-book-btn').forEach(btn => {\r\n            btn.addEventListener('click', function () {\r\n                const bookingWidget = document.querySelector('.bap-widget');\r\n                if (bookingWidget) {\r\n                    bookingWidget.scrollIntoView({ behavior: 'smooth' });\r\n                    const deptSelect = bookingWidget.querySelector('.bap-department');\r\n                    const docSelect = bookingWidget.querySelector('.bap-doctor');\r\n                    if (deptSelect) {\r\n                        deptSelect.value = code;\r\n                        deptSelect.dispatchEvent(new Event('change'));\r\n                        setTimeout(() => {\r\n                            if (docSelect) docSelect.value = this.dataset.doctor;\r\n                        }, 300);\r\n                    }\r\n                }\r\n            });\r\n        });\r\n    }\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Medical Departments Our Medical Departments Specialized Care, Expert Teams Our hospital is also home to a range of specialty clinics, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":559,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","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-366","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/crownhospital.ae\/hospital\/wp-json\/wp\/v2\/pages\/366","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/crownhospital.ae\/hospital\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/crownhospital.ae\/hospital\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/crownhospital.ae\/hospital\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/crownhospital.ae\/hospital\/wp-json\/wp\/v2\/comments?post=366"}],"version-history":[{"count":0,"href":"https:\/\/crownhospital.ae\/hospital\/wp-json\/wp\/v2\/pages\/366\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/crownhospital.ae\/hospital\/wp-json\/wp\/v2\/media\/559"}],"wp:attachment":[{"href":"https:\/\/crownhospital.ae\/hospital\/wp-json\/wp\/v2\/media?parent=366"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}