<?php $__env->startPush('backend_css'); ?>
    <style>
        .countdown {
            font-size: 0.85rem;
            font-weight: 600;
        }

        .countdown-badge {
            display: inline-block;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            padding: 0.4rem 0.8rem;
            border-radius: 0.25rem;
            margin-top: 0.3rem;
        }

        .countdown-expired {
            color: #dc3545;
        }
    </style>
<?php $__env->stopPush(); ?>

<?php $__env->startSection('backend_content'); ?>
    <div class="container-fluid">
        
        <div class="d-flex justify-content-between align-items-center mb-4">
            <div>
                <h4 class="fw-bold mb-1"><?php echo e($product->product_title); ?></h4>
                <small class="text-muted"><?php echo e($shop->name); ?> · SKU: <?php echo e($product->sku); ?></small>
            </div>
            <div class="d-flex gap-2">
                <a href="<?php echo e(route('admin.shops.products.edit', [$shop, $product])); ?>" class="btn btn-warning">
                    <i class="bx bx-edit"></i> Edit
                </a>
                <form action="<?php echo e(route('admin.shops.products.destroy', [$shop, $product])); ?>" method="POST"
                    style="display: inline;" id="deleteProductForm">
                    <?php echo csrf_field(); ?>
                    <?php echo method_field('DELETE'); ?>
                    <button type="button" class="btn btn-danger"
                        onclick="openDeleteProductModal('deleteProductForm', '<?php echo e(addslashes($product->product_title)); ?>')">
                        <i class="bx bx-trash"></i> Delete
                    </button>

                </form>
                <a href="<?php echo e(route('admin.shops.products.index', $shop)); ?>" class="btn btn-light">
                    <i class="bx bx-arrow-back"></i> Back
                </a>
            </div>
        </div>

        <div class="row">
            
            <div class="col-md-6">
                <div class="card border-0 shadow-sm mb-3">
                    <div class="card-body">
                        <h6 class="card-title fw-semibold mb-3">Product Images</h6>

                        
                        <?php if($product->feature_image): ?>
                            <div class="mb-3">
                                <small class="text-muted d-block mb-2">Feature Image:</small>
                                <img src="<?php echo e(asset('storage/' . $product->feature_image)); ?>"
                                    alt="<?php echo e($product->product_title); ?>" class="img-fluid rounded" style="max-width: 100%;">
                            </div>
                        <?php endif; ?>

                        
                        <?php if($product->images->count() > 0): ?>
                            <div>
                                <small class="text-muted d-block mb-2">Gallery:</small>
                                <div class="row g-2">
                                    <?php $__currentLoopData = $product->images; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $image): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        <div class="col-md-4">
                                            <img src="<?php echo e(asset('storage/' . $image->image_path)); ?>" alt="Gallery"
                                                class="img-fluid rounded">
                                        </div>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                </div>
                            </div>
                        <?php endif; ?>
                    </div>
                </div>
            </div>

            
            <div class="col-md-6">
                <div class="card border-0 shadow-sm mb-3">
                    <div class="card-body">
                        <h6 class="card-title fw-semibold mb-3">Product Details</h6>

                        <div class="mb-3">
                            <small class="text-muted">Price</small>
                            <h5 class="mb-0">$<?php echo e(number_format($product->price, 2)); ?></h5>
                        </div>

                        <div class="mb-3">
                            <small class="text-muted">Offer Price</small>
                            <?php if($product->offer_price): ?>
                                <h5 class="mb-1 text-success">$<?php echo e(number_format($product->offer_price, 2)); ?></h5>
                                <?php if($product->offer_expiry_date): ?>
                                    <div class="countdown-badge" id="offerCountdown"
                                        data-expiry="<?php echo e($product->offer_expiry_date->toIso8601String()); ?>">
                                        <i class="bx bx-time"></i> <span id="countdownText">Loading...</span>
                                    </div>
                                <?php else: ?>
                                    <small class="text-success">Offer active all time</small>
                                <?php endif; ?>
                            <?php else: ?>
                                <p class="mb-0 text-muted">-</p>
                            <?php endif; ?>
                        </div>

                        <div class="mb-3">
                            <small class="text-muted">Stock</small>
                            <div>
                                <?php if($product->stock > 0): ?>
                                    <span class="badge bg-success"><?php echo e($product->stock); ?> in stock</span>
                                <?php else: ?>
                                    <span class="badge bg-danger">Out of stock</span>
                                <?php endif; ?>
                            </div>
                        </div>

                        <div class="mb-3">
                            <small class="text-muted">SKU</small>
                            <p class="mb-0"><code><?php echo e($product->sku); ?></code></p>
                        </div>

                        <div class="mb-3">
                            <small class="text-muted">Created By</small>
                            <p class="mb-0"><?php echo e($product->creator->name); ?></p>
                        </div>

                        <div class="mb-3">
                            <small class="text-muted">Created At</small>
                            <p class="mb-0"><?php echo e($product->created_at->format('M d, Y · H:i A')); ?></p>
                        </div>

                        <div>
                            <small class="text-muted">Last Updated</small>
                            <p class="mb-0"><?php echo e($product->updated_at->format('M d, Y · H:i A')); ?></p>
                        </div>
                    </div>
                </div>

                
                <?php if(is_array($product->attributes) && count($product->attributes) > 0): ?>
                    <div class="card border-0 shadow-sm">
                        <div class="card-body">
                            <h6 class="card-title fw-semibold mb-3">Product Variations / Attributes</h6>

                            <div class="d-flex flex-column gap-3">
                                <?php $__currentLoopData = $product->attributes; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $attributeKey => $attributeValues): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <div>
                                        <small class="text-muted d-block mb-2">
                                            <?php echo e(\Illuminate\Support\Str::headline(str_replace('_', ' ', (string) $attributeKey))); ?>

                                        </small>

                                        <div class="d-flex flex-wrap gap-2">
                                            <?php
                                                $values = is_array($attributeValues)
                                                    ? $attributeValues
                                                    : [$attributeValues];
                                            ?>

                                            <?php $__currentLoopData = $values; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $value): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                <?php
                                                    $displayValue = $value;

                                                    if (is_array($value)) {
                                                        $displayValue =
                                                            $value['name'] ??
                                                            ($value['value'] ?? ($value['code'] ?? null));
                                                    }
                                                ?>

                                                <?php if(!is_null($displayValue) && $displayValue !== ''): ?>
                                                    <span class="badge bg-secondary"><?php echo e($displayValue); ?></span>
                                                <?php endif; ?>
                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                        </div>
                                    </div>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </div>
                        </div>
                    </div>
                <?php endif; ?>
            </div>
        </div>
    </div>

    <div class="modal fade" id="deleteProductModal" tabindex="-1" aria-labelledby="deleteProductModalLabel"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="deleteProductModalLabel">Delete Product</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <p class="mb-2">Are you sure you want to delete this product?</p>
                    <p class="mb-0 text-muted" id="deleteProductName"></p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Cancel</button>
                    <button type="button" class="btn btn-danger" id="confirmDeleteProductBtn">Delete</button>
                </div>
            </div>
        </div>
    </div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('backend_js'); ?>
    <script>
        let selectedDeleteProductFormId = null;

        function openDeleteProductModal(formId, productTitle) {
            selectedDeleteProductFormId = formId;
            document.getElementById('deleteProductName').textContent = productTitle ? `Product: ${productTitle}` : '';
            const modal = new bootstrap.Modal(document.getElementById('deleteProductModal'));
            modal.show();
        }

        document.getElementById('confirmDeleteProductBtn').addEventListener('click', function() {
            if (!selectedDeleteProductFormId) {
                return;
            }

            const form = document.getElementById(selectedDeleteProductFormId);
            if (form) {
                form.submit();
            }
        });

        (function() {
            const countdownContainer = document.getElementById('offerCountdown');
            const countdownText = document.getElementById('countdownText');

            if (!countdownContainer || !countdownText) {
                return;
            }

            const expiry = new Date(countdownContainer.dataset.expiry).getTime();

            if (Number.isNaN(expiry)) {
                countdownText.textContent = 'Invalid expiry date';
                countdownContainer.classList.add('countdown-expired');
                return;
            }

            const updateCountdown = () => {
                const now = Date.now();
                const difference = expiry - now;

                if (difference <= 0) {
                    countdownText.textContent = 'Offer expired';
                    countdownContainer.classList.add('countdown-expired');
                    return false;
                }

                const days = Math.floor(difference / (1000 * 60 * 60 * 24));
                const hours = Math.floor((difference / (1000 * 60 * 60)) % 24);
                const minutes = Math.floor((difference / (1000 * 60)) % 60);
                const seconds = Math.floor((difference / 1000) % 60);

                countdownText.textContent = `${days}d ${hours}h ${minutes}m ${seconds}s left`;
                return true;
            };

            if (!updateCountdown()) {
                return;
            }

            const timer = setInterval(() => {
                if (!updateCountdown()) {
                    clearInterval(timer);
                }
            }, 1000);
        })();
    </script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('backend.layout', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\Users\Abdur Rahman\Desktop\faa\resources\views\backend\products\show.blade.php ENDPATH**/ ?>