<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title><?php echo $__env->yieldContent('title', 'KLINIK PKP JAWA 3'); ?></title>
    <!-- favicons Icons -->
    <link rel="apple-touch-icon" sizes="180x180" id="apple-touch-icon"
        href="<?php echo e(asset('assets/images/favicons/apple-touch-icon.png')); ?>" />
    <link rel="icon" type="image/png" sizes="32x32" id="favicon-32"
        href="<?php echo e(asset('assets/images/favicons/favicon-32x32.png')); ?>" />
    <link rel="icon" type="image/png" sizes="16x16" id="favicon-16"
        href="<?php echo e(asset('assets/images/favicons/favicon-16x16.png')); ?>" />
    <link rel="manifest" href="<?php echo e(asset('assets/images/favicons/site.webmanifest')); ?>" />
    <meta name="description" content="KLINIK PKP JAWA 3" />

    <!-- Load Favicon from API -->
    <script>
        (function() {
            const baseUrl = "<?php echo e(env('BASE_URL')); ?>";
            const slug = "<?php echo e(env('DAERAH')); ?>";
            const apiUrl = `${baseUrl}/api/public/sites/${slug}`;

            // Check if we have cached favicon
            const cachedFavicon = localStorage.getItem('site_favicon');
            if (cachedFavicon) {
                updateFavicons(cachedFavicon);
            }

            // Fetch from API
            fetch(apiUrl)
                .then(res => res.json())
                .then(data => {
                    if (data && data.site && data.site.path_favicon) {
                        const faviconUrl = data.site.path_favicon.startsWith('http') ?
                            data.site.path_favicon :
                            `${baseUrl}/${data.site.path_favicon.replace(/\\/g, '/')}`;

                        // Cache for next time
                        localStorage.setItem('site_favicon', faviconUrl);
                        updateFavicons(faviconUrl);
                    }
                })
                .catch(err => {
                    console.error('Failed to load favicon from API:', err);
                });

            function updateFavicons(url) {
                // Update all favicon links
                const favicon16 = document.getElementById('favicon-16');
                const favicon32 = document.getElementById('favicon-32');
                const appleTouchIcon = document.getElementById('apple-touch-icon');

                if (favicon16) favicon16.href = url;
                if (favicon32) favicon32.href = url;
                if (appleTouchIcon) appleTouchIcon.href = url;

                // Also update the shortcut icon if exists
                let shortcutIcon = document.querySelector('link[rel="shortcut icon"]');
                if (!shortcutIcon) {
                    shortcutIcon = document.createElement('link');
                    shortcutIcon.rel = 'shortcut icon';
                    document.head.appendChild(shortcutIcon);
                }
                shortcutIcon.href = url;
            }
        })();
    </script>

    <!-- fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link
        href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
        rel="stylesheet">


    <link rel="stylesheet" href="<?php echo e(asset('assets/css/bootstrap.min.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/animate.min.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/custom-animate.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/swiper.min.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/font-awesome-all.css')); ?>" />
    <!-- Font Awesome CDN fallback to ensure brand icons (fab) are available -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/jarallax.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/jquery.magnific-popup.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/odometer.min.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/flaticon.css')); ?>">
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/owl.carousel.min.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/owl.theme.default.min.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/nice-select.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/jquery-ui.css')); ?>" />


    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/slider.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/footer.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/about.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/service.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/why-choose.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/testimonial.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/case.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/counter.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/team.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/pricing.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/process.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/sliding-text.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/video.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/brand.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/blog.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/faq.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/module-css/skill.css')); ?>" />

    <!-- template styles -->
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/style.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('assets/css/responsive.css')); ?>" />

    
    <?php echo $__env->yieldPushContent('styles'); ?>

    <?php echo $__env->yieldPushContent('style_dark'); ?>
    <script>
        (function() {
            try {
                var saved = localStorage.getItem('theme');
                if (!saved) {
                    var prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
                    saved = prefersDark ? 'dark' : 'light';
                }
                if (saved === 'dark') {
                    var link = document.createElement('link');
                    link.id = 'dark-theme-css';
                    link.rel = 'stylesheet';
                    link.href = '<?php echo e(asset('assets/css/dark.css')); ?>';
                    document.head.appendChild(link);
                    document.documentElement.setAttribute('data-theme', 'dark');
                } else {
                    document.documentElement.setAttribute('data-theme', 'light');
                }
            } catch (e) {}
        })();
    </script>
    <script>
        // Centralized site data fetch for header: populate window.pkpSiteData and common globals
        (function() {
            try {
                const baseUrl = "<?php echo e(env('BASE_URL')); ?>";
                const slug = "<?php echo e(env('DAERAH')); ?>";
                const apiUrl = `${baseUrl}/api/public/sites/${slug}`;

                // If already loaded, don't fetch again
                if (window.pkpSiteData) return;

                // helper: convert hex color to 'r, g, b' string
                function hexToRgb(hex) {
                    if (!hex) return null;
                    hex = hex.replace('#', '').trim();
                    if (hex.length === 3) {
                        hex = hex.split('').map(c => c + c).join('');
                    }
                    if (hex.length !== 6) return null;
                    const bigint = parseInt(hex, 16);
                    const r = (bigint >> 16) & 255;
                    const g = (bigint >> 8) & 255;
                    const b = bigint & 255;
                    return `${r}, ${g}, ${b}`;
                }

                // helper: apply primary color to CSS variables
                function applySitePrimaryColor(color) {
                    try {
                        if (!color) return;
                        // ensure color starts with # when hex
                        var primary = String(color).trim();
                        // set CSS variable --judges-base
                        document.documentElement.style.setProperty('--judges-base', primary);
                        // set RGB variable for rgba usages
                        const rgb = hexToRgb(primary);
                        if (rgb) document.documentElement.style.setProperty('--judges-base-rgb', rgb);
                        // also set a generic --site-primary used in footer component
                        document.documentElement.style.setProperty('--site-primary', primary);
                    } catch (e) { console.warn('applySitePrimaryColor error', e); }
                }

                // Try cached copy in sessionStorage first (short-lived)
                const cached = sessionStorage.getItem('pkpSiteData');
                if (cached) {
                    try {
                        const parsed = JSON.parse(cached);
                        window.pkpSiteData = parsed;
                        window.pkpSiteName = parsed.name || parsed.title || window.pkpSiteName || '';
                        window.pkpSiteEmail = parsed.email || window.pkpSiteEmail || '';
                        window.pkpSiteLogo = parsed.logo || parsed.logo_url || parsed.path_image || parsed.path_logo || '';
                        // apply theme colors from cached data if present
                        try {
                            const theme = parsed.theme || (parsed.site && parsed.site.theme) || null;
                            if (theme && theme.primary_color) applySitePrimaryColor(theme.primary_color);
                        } catch(e) { /* ignore */ }
                    } catch (e) {
                        // fallthrough to fetch
                    }
                }

                fetch(apiUrl)
                    .then(r => r.json())
                    .then(d => {
                        if (!d || !d.site) return;
                        const s = d.site;
                        window.pkpSiteData = s;
                        window.pkpSiteName = s.name || s.title || '';
                        window.pkpSiteEmail = s.email || '';
                        window.pkpSiteLogo = s.logo || s.logo_url || s.path_image || s.path_logo || '';
                        window.pkpSitePhone = s.no_phone || s.phone || s.phone_number || '';

                        // apply theme primary color to CSS variables so the whole site can use it
                        try {
                            const theme = s.theme || null;
                            if (theme && theme.primary_color) applySitePrimaryColor(theme.primary_color);
                        } catch(e) { /* ignore */ }

                        try { sessionStorage.setItem('pkpSiteData', JSON.stringify(s)); } catch (e) {}

                        // If other components expose update functions, call them now
                        try { if (typeof updateFooterSiteName === 'function') updateFooterSiteName(); } catch(e){}
                        try { if (typeof updateFooterEmail === 'function') updateFooterEmail(window.pkpSiteEmail); } catch(e){}
                        try { if (typeof updateFooterMedsos === 'function') updateFooterMedsos(s.medsos || {}); } catch(e){}
                        try { if (typeof updateFooterLocation === 'function') updateFooterLocation(s); } catch(e){}
                        try { if (typeof updateFooterPhone === 'function') updateFooterPhone(window.pkpSitePhone); } catch(e){}

                        // Dispatch a global event so components (footer/mobile) can react immediately
                        try {
                            const evt = new CustomEvent('pkpSiteDataReady', { detail: s });
                            window.dispatchEvent(evt);
                        } catch (e) { /* ignore */ }
                        // Also update favicon if provided (keep existing logic in page but help it)
                        if (s.path_favicon) {
                            try {
                                const faviconUrl = s.path_favicon.startsWith('http') ? s.path_favicon : `${baseUrl}/${s.path_favicon.replace(/\\/g, '/')}`;
                                try { localStorage.setItem('site_favicon', faviconUrl); } catch(e){}
                                // update head favicons if updateFavicons function is available
                                if (typeof updateFavicons === 'function') updateFavicons(faviconUrl);
                            } catch(e){}
                        }
                    })
                    .catch(err => {
                        console.warn('Header: failed to fetch site data', err);
                    });
            } catch (e) {
                console.warn('Header site-data setup error', e);
            }
        })();
    </script>
</head>
<?php /**PATH D:\laravel\krs-jawa3-template\krs-jawa3-web-template\resources\views/components/head.blade.php ENDPATH**/ ?>