<?php if (isset($component)) { $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54 = $attributes; } ?>
<?php $component = App\View\Components\AppLayout::resolve([] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('app-layout'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\App\View\Components\AppLayout::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes([]); ?>

<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
<style>

@import url("https://fonts.googleapis.com/css?family=Montserrat");

.pricing-table{
 
  --font-family: 'Montserrat', sans-serif;
}

.pricing-table .block-heading {
  padding-top: 50px;
  margin-bottom: 40px;
  text-align: center; 
}

.pricing-table .block-heading h2 {
  color: #3b99e0;
}

.pricing-table .block-heading p {
  text-align: center;
  max-width: 420px;
  margin: auto;
  opacity: 0.7; 
}

.pricing-table .heading {
  text-align: center;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1); 
}

.pricing-table .item {
  background-color: #ffffff;
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.075);
  border-top: 2px solid #5ea4f3;
  padding: 30px;
  overflow: hidden;
  position: relative; 
}

.pricing-table .col-md-5:not(:last-child) .item {
  margin-bottom: 30px; 
}

.pricing-table .item button {
  font-weight: 600; 
}

.pricing-table .ribbon {
  width: 160px;
  height: 32px;
  font-size: 12px;
  text-align: center;
  color: #fff;
  font-weight: bold;
  box-shadow: 0px 2px 3px rgba(136, 136, 136, 0.25);
  background: #4dbe3b;
  transform: rotate(45deg);
  position: absolute;
  right: -42px;
  top: 20px;
  padding-top: 7px; 
}


.pricing-table .ribbon2 {
  width: 160px;
  height: 32px;
  font-size: 12px;
  text-align: center;
  color: #fff;
  font-weight: bold;
  box-shadow: 0px 2px 3px rgba(136, 136, 136, 0.25);
  background: #3b74be;
  transform: rotate(45deg);
  position: absolute;
  right: -42px;
  top: 20px;
  padding-top: 7px; 
}

.pricing-table .item p {
  text-align: center;
  margin-top: 20px;
  opacity: 0.7; 
}

.pricing-table .features .feature {
  font-weight: 600; }

.pricing-table .features h4 {
  text-align: center;
  font-size: 18px;
  padding: 5px; 
}

.pricing-table .price h4 {
  margin: 15px 0;
  font-size: 45px;
  text-align: center;
  color: #2288f9; 
}

.pricing-table .buy-now button {
  text-align: center;
  margin: auto;
  font-weight: 600;
  padding: 9px 0; 
}


</style>

<style>
.card-body {
    text-align: center;
}
.card-body img {
    display: block;
    margin: 0 auto;
}
</style>



     <?php $__env->slot('header', null, []); ?> 
        <h2 class="font-semibold text-xl text-gray-800 leading-tight"><style>
.card-body {
    text-align: center;
}
.card-body img {
    display: block;
    margin: 0 auto;
}
</style>
            <?php echo e(__('الحضور')); ?>

        </h2>
     <?php $__env->endSlot(); ?>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                <div class="p-6 text-gray-900">
                    <?php echo e(__("  بطاقة حضور  ")); ?>

                </div>


                

<div class="col-md-12">
    <br>
</div>


<div class="col-md-12 ">
    <!-- Area 1 -->
    <div style="color: black;" class="col-md-4 ">
    
    </div>

    
    <section id="guest-card" class="col-md-4 shadow pricing-table" style="display: table;padding-top: 20px;">
        <div class="item text-center">
            <div class="ribbon2"></div>
            <div class="heading">
                <h6 style="margin-right: 12px;"> 
                    بطاقة حضور
                  <br>
                  Attendance card
                </h6>
            </div>
            <div class="card-body" style="text-align: center;">
                 <img src="<?php echo e(asset('storage/qrcode_'.$GstIdencrypt.'.png')); ?>" alt="QR Code" style="height:200px;">
                <hr>
                <strong><?php echo e($Gust_data->Full_Name); ?></strong><br>
                <strong><?php echo e($Gust_data->Participant_name); ?></strong><br>
                <strong><?php echo e($Gust_data->Job); ?></strong><br>
                <strong><?php echo e($Gust_data->Tel); ?></strong>
            </div>
        </div>
         <button id="downloadCard" class="btn btn-primary" style="background: #519eaf;">📥 تحميل البطاقة كصورة</button>
    </section>


    <!-- Area 3 -->
    <div style="color: black;" class="col-md-4 ">
     
    </div>
</div>



    <!-- Area 2 -->


<script>
document.getElementById("downloadCard").addEventListener("click", function() {
    html2canvas(document.querySelector("#guest-card")).then(canvas => {
        // Create a link element
        let link = document.createElement("a");
        link.download = "attendance_card.png";
        link.href = canvas.toDataURL("image/png");
        link.click();
    });
});
</script>

     


<div class="col-md-12">
    
                    <div class="my-settings footer-center" style="padding-top: 30px;text-align: center;">
                        <p>
                            <br>
                            وزارة الصحة الاتحادية - تقنية المعلومات <i class="fa fa-computer"></i>
                            <!--img class="flex items-center justify-end" src="<?php echo e(url('img/logo-fmoh1.png')); ?>" width="30" height="30" -->
                        </p>

                    </div>
</div>
    
                 

 <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $attributes = $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $component = $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>
<?php /**PATH /var/www/html/conference-system/resources/views/registration/Id_card.blade.php ENDPATH**/ ?>