<?php
if (Auth('admin')->User()->dashboard_style == 'light') {
    $text = 'dark';
} else {
    $text = 'light';
}
?>



<?php $__env->startSection('content'); ?>

<style>
    .shipment-details-page {
        --sd-bg: #eef3fb;
        --sd-card: rgba(255, 255, 255, 0.96);
        --sd-border: rgba(148, 163, 184, 0.24);
        --sd-text: #0f172a;
        --sd-muted: #64748b;
        --sd-blue: #2563eb;
        --sd-indigo: #4f46e5;
        --sd-green: #059669;
        --sd-orange: #f97316;
        --sd-red: #dc2626;
        --sd-yellow: #facc15;
        --sd-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
        --sd-shadow-soft: 0 8px 25px rgba(15, 23, 42, 0.06);

        margin: -0.5rem -1rem 0;
        padding: 1.5rem 1.25rem 2rem;
        min-height: calc(100vh - 8rem);
        color: var(--sd-text);
        background:
            radial-gradient(circle at 8% 8%, rgba(37, 99, 235, .15), transparent 28%),
            radial-gradient(circle at 94% 14%, rgba(245, 158, 11, .18), transparent 30%),
            radial-gradient(circle at 50% 100%, rgba(5, 150, 105, .10), transparent 35%),
            linear-gradient(135deg, #f8fbff 0%, var(--sd-bg) 100%);
        position: relative;
        overflow-x: hidden;
    }

    .shipment-details-page::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image:
            linear-gradient(rgba(15, 23, 42, 0.035) 1px, transparent 1px),
            linear-gradient(90deg, rgba(15, 23, 42, 0.035) 1px, transparent 1px);
        background-size: 42px 42px;
        mask-image: linear-gradient(to bottom, rgba(0,0,0,.72), transparent 78%);
        pointer-events: none;
    }

    .shipment-details-page > * {
        position: relative;
        z-index: 2;
    }

    .shipment-details-hero {
        background:
            linear-gradient(135deg, rgba(15, 23, 42, 0.95), rgba(30, 64, 175, 0.92)),
            radial-gradient(circle at 88% 10%, rgba(250, 204, 21, .28), transparent 28%);
        border: 1px solid rgba(255,255,255,.14);
        border-radius: 26px;
        padding: 1.75rem;
        box-shadow: var(--sd-shadow);
        color: #fff;
        margin-bottom: 1.5rem;
        position: relative;
        overflow: hidden;
    }

    .shipment-details-hero::before {
        content: "";
        position: absolute;
        width: 280px;
        height: 280px;
        border-radius: 50%;
        right: -90px;
        top: -110px;
        background: radial-gradient(circle, rgba(255,255,255,.22), transparent 65%);
        pointer-events: none;
    }

    .shipment-details-hero-content,
    .shipment-details-actions {
        position: relative;
        z-index: 2;
    }

    .shipment-details-badge {
        display: inline-flex;
        align-items: center;
        gap: .45rem;
        font-size: .72rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .08em;
        color: #bfdbfe;
        background: rgba(255,255,255,.12);
        border: 1px solid rgba(255,255,255,.18);
        border-radius: 999px;
        padding: .42rem .8rem;
        margin-bottom: .85rem;
    }

    .shipment-details-hero h1 {
        color: #fff;
        font-size: clamp(1.5rem, 2vw, 2.1rem);
        letter-spacing: -.04em;
        margin-bottom: .4rem;
        font-weight: 900;
    }

    .shipment-details-hero p {
        color: rgba(226, 232, 240, .92);
        max-width: 46rem;
        margin-bottom: 0;
        line-height: 1.6;
    }

    .shipment-details-actions {
        display: flex;
        flex-wrap: wrap;
        gap: .55rem;
        justify-content: flex-end;
    }

    .shipment-action-btn {
        border-radius: 14px;
        font-weight: 900;
        padding: .72rem 1rem;
        border: none;
        display: inline-flex;
        align-items: center;
        gap: .45rem;
        transition: all .18s ease;
        white-space: nowrap;
    }

    .shipment-action-btn:hover {
        transform: translateY(-2px);
    }

    .btn-sd-back {
        background: rgba(255,255,255,.14);
        color: #fff !important;
        border: 1px solid rgba(255,255,255,.20);
    }

    .btn-sd-status {
        background: linear-gradient(135deg, #38bdf8, #2563eb);
        color: #fff !important;
        box-shadow: 0 12px 24px rgba(37, 99, 235, .25);
    }

    .btn-sd-edit {
        background: linear-gradient(135deg, #facc15, #f97316);
        color: #111827 !important;
        box-shadow: 0 12px 24px rgba(249, 115, 22, .25);
    }

    .btn-sd-print {
        background: #111827;
        color: #fff !important;
        box-shadow: 0 12px 24px rgba(17, 24, 39, .20);
    }

    .sd-card {
        background: var(--sd-card);
        border: 1px solid var(--sd-border);
        border-radius: 22px;
        box-shadow: var(--sd-shadow-soft);
        backdrop-filter: blur(14px);
        overflow: hidden;
        color: var(--sd-text);
    }

    .sd-card-header {
        padding: 1.15rem 1.25rem;
        background: rgba(255,255,255,.70);
        border-bottom: 1px solid rgba(148, 163, 184, .18);
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
    }

    .sd-card-header h5 {
        margin: 0;
        color: var(--sd-text);
        font-weight: 900;
        letter-spacing: -.02em;
        display: flex;
        align-items: center;
        gap: .55rem;
    }

    .sd-card-header h5 i {
        color: var(--sd-blue);
    }

    .tracking-box {
        text-align: center;
        padding: 1.5rem;
    }

    .barcode-wrap {
        background: #fff;
        border: 1px solid rgba(148, 163, 184, .22);
        border-radius: 18px;
        padding: 1rem;
        display: inline-block;
        max-width: 100%;
        box-shadow: 0 8px 20px rgba(15, 23, 42, .04);
    }

    .barcode-wrap img {
        max-width: 100%;
    }

    .tracking-number {
        font-family: monospace;
        font-size: 1.3rem;
        font-weight: 900;
        color: var(--sd-text);
        letter-spacing: 1px;
        margin-top: 1rem;
        word-break: break-word;
    }

    .badge-lg {
        display: inline-flex;
        align-items: center;
        gap: .4rem;
        font-size: .82rem;
        padding: .5rem .85rem;
        border-radius: 999px;
        font-weight: 900;
        margin-top: .4rem;
    }

    .badge-success {
        background: #dcfce7 !important;
        color: #166534 !important;
        border: 1px solid #bbf7d0;
    }

    .badge-warning {
        background: #fef3c7 !important;
        color: #92400e !important;
        border: 1px solid #fde68a;
    }

    .badge-info {
        background: #e0f2fe !important;
        color: #075985 !important;
        border: 1px solid #bae6fd;
    }

    .created-date {
        color: var(--sd-muted);
        font-size: .85rem;
        font-weight: 700;
        margin-top: .65rem;
    }

    .info-table {
        margin: 0;
    }

    .info-table th {
        width: 34%;
        color: var(--sd-muted);
        font-size: .78rem;
        text-transform: uppercase;
        letter-spacing: .04em;
        border: none;
        padding: .8rem .75rem;
        vertical-align: top;
    }

    .info-table td {
        color: var(--sd-text);
        font-weight: 800;
        border: none;
        padding: .8rem .75rem;
        vertical-align: top;
        word-break: break-word;
    }

    .info-table tr:not(:last-child) {
        border-bottom: 1px solid rgba(148, 163, 184, .14);
    }

    .info-table a {
        color: var(--sd-blue);
        font-weight: 900;
    }

    .package-photo {
        max-height: 220px;
        border-radius: 16px;
        border: 1px solid rgba(148, 163, 184, .24);
        padding: .25rem;
        background: #fff;
        box-shadow: 0 8px 20px rgba(15, 23, 42, .05);
    }

    .total-cost-row {
        background: linear-gradient(135deg, #fff7ed, #ffffff);
        border-radius: 14px;
    }

    .total-cost-row th,
    .total-cost-row td {
        color: #9a3412 !important;
        font-size: .95rem;
    }

    .tracking-timeline {
        position: relative;
        padding: 1.35rem;
    }

    .tracking-item {
        position: relative;
        display: flex;
        gap: 1rem;
        padding-bottom: 1.35rem;
    }

    .tracking-item:not(:last-child)::before {
        content: "";
        position: absolute;
        left: 20px;
        top: 42px;
        bottom: -2px;
        width: 2px;
        background: linear-gradient(180deg, rgba(245,158,11,.55), rgba(37,99,235,.12));
    }

    .tracking-icon {
        width: 42px;
        height: 42px;
        border-radius: 16px;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 12px 25px rgba(15, 23, 42, .10);
        z-index: 2;
    }

    .tracking-icon.bg-success {
        background: linear-gradient(135deg, #22c55e, #059669) !important;
    }

    .tracking-icon.bg-warning {
        background: linear-gradient(135deg, #facc15, #f97316) !important;
        color: #111827;
    }

    .tracking-icon.bg-info {
        background: linear-gradient(135deg, #38bdf8, #2563eb) !important;
    }

    .tracking-content {
        flex: 1;
        background: rgba(248,250,252,.78);
        border: 1px solid rgba(148, 163, 184, .18);
        border-radius: 18px;
        padding: 1rem;
    }

    .tracking-date {
        color: var(--sd-muted);
        font-size: .78rem;
        font-weight: 800;
        margin-bottom: .4rem;
    }

    .tracking-status {
        color: var(--sd-text);
        font-size: .95rem;
    }

    .tracking-status .font-weight-bold {
        font-weight: 900 !important;
    }

    .tracking-status .text-muted {
        color: var(--sd-muted) !important;
    }

    .tracking-text {
        color: var(--sd-muted);
        font-size: .9rem;
        line-height: 1.55;
    }

    .empty-history {
        padding: 2.5rem 1rem;
        text-align: center;
        color: var(--sd-muted);
        font-weight: 700;
    }

    .empty-history i {
        display: block;
        font-size: 2rem;
        margin-bottom: .7rem;
        color: #94a3b8;
    }

    .alert {
        border-radius: 16px;
        border: none;
    }

    @media (max-width: 768px) {
        .shipment-details-page {
            padding: 1rem .85rem 1.5rem;
            margin-left: -.75rem;
            margin-right: -.75rem;
        }

        .shipment-details-hero {
            padding: 1.35rem;
        }

        .shipment-details-actions {
            justify-content: stretch;
            margin-top: 1rem;
        }

        .shipment-details-actions .shipment-action-btn {
            flex: 1 1 45%;
            justify-content: center;
        }

        .sd-card-header {
            align-items: flex-start;
            flex-direction: column;
        }

        .info-table th,
        .info-table td {
            display: block;
            width: 100%;
            padding: .55rem .75rem;
        }

        .info-table th {
            padding-bottom: .15rem;
        }

        .info-table td {
            padding-top: .15rem;
        }
    }

    @media (max-width: 480px) {
        .shipment-details-actions .shipment-action-btn {
            flex: 1 1 100%;
        }

        .tracking-number {
            font-size: 1rem;
        }

        .tracking-item {
            gap: .75rem;
        }
    }
</style>

<div class="shipment-details-page">
    <div class="shipment-details-hero">
        <div class="row align-items-center">
            <div class="col-lg-6">
                <div class="shipment-details-hero-content">
                    <span class="shipment-details-badge">
                        <i class="fa fa-box"></i>
                        Shipment Information
                    </span>

                    <h1>Shipment Details</h1>

                    <p>
                        Review full shipment information, barcode tracking, sender details, receiver details, cost summary, package information, and tracking history.
                    </p>
                </div>
            </div>

            <div class="col-lg-6">
                <div class="shipment-details-actions">
                    <a href="<?php echo e(route('admin.shipments')); ?>" class="btn shipment-action-btn btn-sd-back">
                        <i class="fa fa-arrow-left"></i>
                        <span>Back</span>
                    </a>

                    <a href="<?php echo e(route('admin.shipments.update-status-form', $shipment->id)); ?>" class="btn shipment-action-btn btn-sd-status">
                        <i class="fa fa-truck-loading"></i>
                        <span>Update Status</span>
                    </a>

                    <a href="<?php echo e(route('admin.shipments.edit', $shipment->id)); ?>" class="btn shipment-action-btn btn-sd-edit">
                        <i class="fa fa-edit"></i>
                        <span>Edit</span>
                    </a>

                    <a href="<?php echo e(route('admin.shipments.print', $shipment->id)); ?>" target="_blank" class="btn shipment-action-btn btn-sd-print">
                        <i class="fa fa-print"></i>
                        <span>Print</span>
                    </a>
                </div>
            </div>
        </div>
    </div>

    <?php if (isset($component)) { $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4 = $component; } ?>
<?php $component = $__env->getContainer()->make(Illuminate\View\AnonymousComponent::class, ['view' => 'components.danger-alert','data' => []]); ?>
<?php $component->withName('danger-alert'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php $component->withAttributes([]); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4)): ?>
<?php $component = $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4; ?>
<?php unset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4); ?>
<?php endif; ?>
    <?php if (isset($component)) { $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4 = $component; } ?>
<?php $component = $__env->getContainer()->make(Illuminate\View\AnonymousComponent::class, ['view' => 'components.success-alert','data' => []]); ?>
<?php $component->withName('success-alert'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php $component->withAttributes([]); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4)): ?>
<?php $component = $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4; ?>
<?php unset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4); ?>
<?php endif; ?>

    <?php if(session('success')): ?>
        <div class="alert alert-success">
            <?php echo e(session('success')); ?>

        </div>
    <?php endif; ?>

    <!-- Tracking Information -->
    <div class="row mb-4">
        <div class="col-md-12">
            <div class="sd-card">
                <div class="tracking-box">
                    <div class="barcode-wrap mb-3">
                        <img src="https://barcode.tec-it.com/barcode.ashx?data=<?php echo e($shipment->trackingnumber); ?>&code=Code128" alt="<?php echo e($shipment->trackingnumber); ?>" class="img-fluid">
                    </div>

                    <h5 class="tracking-number"><?php echo e($shipment->trackingnumber); ?></h5>

                    <?php
                        $statusClass = \App\Support\ShipmentStatus::bootstrapClass($shipment->status);
                    ?>
                    <div class="badge badge-<?php echo e($statusClass); ?> badge-lg">
                        <i class="fa fa-circle" style="font-size: .45rem;"></i>
                        <?php echo e($shipment->status); ?>

                    </div>

                    <div class="created-date">
                        <i class="fa fa-calendar-alt mr-1"></i>
                        Created on <?php echo e(\Carbon\Carbon::parse($shipment->created_at)->format('F d, Y - h:i A')); ?>

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

    <!-- Sender, Receiver, Package and Cost Information -->
    <div class="row">
        <div class="col-md-6">
            <div class="sd-card mb-4">
                <div class="sd-card-header">
                    <h5>
                        <i class="fa fa-user-edit"></i>
                        Sender Information
                    </h5>
                </div>

                <div class="card-body">
                    <table class="table table-borderless info-table">
                        <tr>
                            <th>Name:</th>
                            <td><?php echo e($shipment->sname); ?></td>
                        </tr>
                        <tr>
                            <th>Email:</th>
                            <td>
                                <?php if($shipment->semail): ?>
                                    <a href="mailto:<?php echo e($shipment->semail); ?>"><?php echo e($shipment->semail); ?></a>
                                <?php else: ?>
                                    Not provided
                                <?php endif; ?>
                            </td>
                        </tr>
                        <tr>
                            <th>Address:</th>
                            <td><?php echo e($shipment->saddress); ?></td>
                        </tr>
                        <tr>
                            <th>Origin:</th>
                            <td><?php echo e($shipment->take_off_point); ?></td>
                        </tr>
                    </table>
                </div>
            </div>

            <div class="sd-card mb-4">
                <div class="sd-card-header">
                    <h5>
                        <i class="fa fa-user-check"></i>
                        Receiver Information
                    </h5>
                </div>

                <div class="card-body">
                    <table class="table table-borderless info-table">
                        <tr>
                            <th>Name:</th>
                            <td><?php echo e($shipment->name); ?></td>
                        </tr>
                        <tr>
                            <th>Email:</th>
                            <td>
                                <a href="mailto:<?php echo e($shipment->email); ?>"><?php echo e($shipment->email); ?></a>
                            </td>
                        </tr>
                        <tr>
                            <th>Phone:</th>
                            <td>
                                <a href="tel:<?php echo e($shipment->phone); ?>"><?php echo e($shipment->phone); ?></a>
                            </td>
                        </tr>
                        <tr>
                            <th>Address:</th>
                            <td><?php echo e($shipment->address); ?></td>
                        </tr>
                        <tr>
                            <th>Destination:</th>
                            <td><?php echo e($shipment->final_destination); ?></td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>

        <div class="col-md-6">
            <div class="sd-card mb-4">
                <div class="sd-card-header">
                    <h5>
                        <i class="fa fa-box-open"></i>
                        Package Details
                    </h5>
                </div>

                <div class="card-body">
                    <table class="table table-borderless info-table">
                        <tr>
                            <th>Quantity:</th>
                            <td><?php echo e($shipment->qty); ?></td>
                        </tr>
                        <tr>
                            <th>Description:</th>
                            <td><?php echo e($shipment->description); ?></td>
                        </tr>

                        <?php if($shipment->photo): ?>
                            <tr>
                                <th>Photo:</th>
                                <td>
                                    <a href="<?php echo e(asset('public/' . $shipment->photo)); ?>" target="_blank">
                                        <img src="<?php echo e(asset('public/' . $shipment->photo)); ?>" alt="Shipment Photo" class="img-thumbnail package-photo">
                                    </a>
                                </td>
                            </tr>
                        <?php endif; ?>
                    </table>
                </div>
            </div>

            <div class="sd-card mb-4">
                <div class="sd-card-header">
                    <h5>
                        <i class="fa fa-coins"></i>
                        Cost Information
                    </h5>
                </div>

                <div class="card-body">
                    <table class="table table-borderless info-table">
                        <tr>
                            <th>Shipping Cost:</th>
                            <td><?php echo e($settings->s_currency); ?> <?php echo e(number_format($shipment->cost, 2)); ?></td>
                        </tr>
                        <tr>
                            <th>Clearance Cost:</th>
                            <td><?php echo e($settings->s_currency); ?> <?php echo e(number_format($shipment->clearance_cost, 2)); ?></td>
                        </tr>
                        <tr class="total-cost-row">
                            <th>Total Cost:</th>
                            <td><?php echo e($settings->s_currency); ?> <?php echo e(number_format($shipment->cost + $shipment->clearance_cost, 2)); ?></td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <!-- Tracking History -->
    <div class="row mt-2">
        <div class="col-md-12">
            <div class="sd-card">
                <div class="sd-card-header">
                    <h5>
                        <i class="fa fa-route"></i>
                        Tracking History
                    </h5>
                </div>

                <div class="card-body p-0">
                    <div class="tracking-timeline">
                        <?php $__empty_1 = true; $__currentLoopData = $tracks; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $track): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                            <div class="tracking-item">
                                <div class="tracking-icon bg-<?php echo e(\App\Support\ShipmentStatus::bootstrapClass($track->status)); ?>">
                                    <i class="fa <?php echo e(\App\Support\ShipmentStatus::faIcon($track->status)); ?>"></i>
                                </div>

                                <div class="tracking-content">
                                    <div class="tracking-date">
                                        <i class="fa fa-calendar-alt mr-1"></i>
                                        <?php echo e(\Carbon\Carbon::parse($track->created_at)->format('F d, Y - h:i A')); ?>

                                    </div>

                                    <div class="tracking-status">
                                        <span class="font-weight-bold"><?php echo e($track->status); ?></span>

                                        <?php if($track->address): ?>
                                            <span class="ml-2 text-muted">
                                                <i class="fa fa-map-marker-alt"></i>
                                                <?php echo e($track->address); ?>

                                            </span>
                                        <?php endif; ?>
                                    </div>

                                    <div class="tracking-text mt-2">
                                        <?php echo e($track->comment); ?>

                                    </div>
                                </div>
                            </div>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                            <div class="empty-history">
                                <i class="fa fa-inbox"></i>
                                No tracking history found
                            </div>
                        <?php endif; ?>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/kdcwrbdi/public_html/resources/views/admin/view-shipment.blade.php ENDPATH**/ ?>