<?php $__env->startSection('content'); ?>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@flaticon/flaticon-uicons/css/all/all.css">

    <style>
        .live-chat-card {
            /* background: #ffffff; */
            border-radius: 14px;
            padding: 28px;
            /* border: 1px solid #eef1f6; */
            max-width: 650px;
        }

        .live-chat-title {
            font-size: 1.75rem;
            /* BIG title */
            font-weight: 700;
            margin-bottom: 12px;
        }

        .live-chat-desc {
            font-size: 1.05rem;
            line-height: 1.7;
            color: #4b5563;
            margin-bottom: 8px;
        }

        .live-chat-sub {
            font-size: 0.95rem;
            color: #6b7280;
        }

        .chat-loader,
        .chat-success {
            font-size: 1rem;
            font-weight: 500;
        }

        .spinning-icon {
            font-size: 1.4rem;
            animation: spin 1.2s linear infinite;
        }

        @keyframes spin {
            from {
                transform: rotate(0deg);
            }

            to {
                transform: rotate(360deg);
            }
        }

        .chat-success {
            background: #f0fdf4;
            border: 1px solid #dcfce7;
            padding: 14px 16px;
            border-radius: 10px;
            animation: fadeIn 0.5s ease-in-out;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(6px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
    </style>
    <div class="page-container">

        <div class="page-title-head d-flex align-items-sm-center flex-sm-row flex-column gap-2">
            <div class="flex-grow-1">
                <h4 class="fs-18 fw-semibold mb-0"><?php echo e($title); ?></h4>
            </div>

            <div class="text-end">
                <?php if (isset($component)) { $__componentOriginalc60db44e52d942d3b0e4d76f7065f04b = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginalc60db44e52d942d3b0e4d76f7065f04b = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.dashboard.breadcrumbs','data' => ['breadcrumbs' => $breadcrumbs]] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('dashboard.breadcrumbs'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes(['breadcrumbs' => \Illuminate\View\Compilers\BladeCompiler::sanitizeComponentAttribute($breadcrumbs)]); ?>
<?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::processComponentKey($component); ?>

<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginalc60db44e52d942d3b0e4d76f7065f04b)): ?>
<?php $attributes = $__attributesOriginalc60db44e52d942d3b0e4d76f7065f04b; ?>
<?php unset($__attributesOriginalc60db44e52d942d3b0e4d76f7065f04b); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalc60db44e52d942d3b0e4d76f7065f04b)): ?>
<?php $component = $__componentOriginalc60db44e52d942d3b0e4d76f7065f04b; ?>
<?php unset($__componentOriginalc60db44e52d942d3b0e4d76f7065f04b); ?>
<?php endif; ?>
            </div>
        </div>

        <div class="row">
            <div class="col-12">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-10">
                            <div class="live-chat-card">

                                <h2 class="live-chat-title">
                                    Live Chat Support
                                </h2>

                                <p class="live-chat-desc">
                                    Need assistance? Start a live chat with our dedicated support team.
                                    We’re here to help you resolve any issue or answer your questions
                                    in real time.
                                </p>

                                <p class="live-chat-sub">
                                    Please hang on for a moment while the chat widget loads.
                                </p>

                                <!-- Animated Chat Loader -->
                                <div id="chat-loader" class="chat-loader d-flex align-items-center mt-4">
                                    <i class="fi fi-rr-comments spinning-icon me-2"></i>
                                    <span>Connecting to live support…</span>
                                </div>

                                <!-- Success Message -->
                                <div id="chat-success" class="chat-success mt-4 d-none">
                                    <i class="fi fi-rr-check-circle text-success me-2"></i>
                                    Live chat is ready. Check the bottom-right corner of your screen.
                                </div>

                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const loader = document.getElementById('chat-loader');
            const success = document.getElementById('chat-success');

            // Simulate chat widget loading
            setTimeout(() => {
                loader.classList.add('d-none'); // hide loader
                success.classList.remove('d-none'); // show success
            }, 2500); // 2.5 seconds
        });
    </script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('dashboard.user.layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\xampp\htdocs\projects\broker-v6.0\resources\views/dashboard/user/support/index.blade.php ENDPATH**/ ?>