Please update the following code to meet the layout of template:
<?php
    // 整理資料結構，成為像原本cartData結構（分店分類）
    // $cart結構可能是扁平，先做分店群組，並帶必需欄位
    
    // 用店名分組
    $grouped = [];
    foreach($cart as $row) {
      if(empty($row['qty']) || $row['qty'] == 0) continue; //跳過無數量商品
      $store = $row['store_name'] ?? 'Unknown Store';
      if(!isset($grouped[$store])) $grouped[$store] = [];
      $price = $row['special_price_num'] != '' && $row['special_price_num'] != null && $row['special_price_num'] > 0 ? $row['special_price_num'] : $row['price_num'];
      $price_text = $row['special_price'] != '' && $row['special_price'] != null && $row['special_price_num'] > 0 ? $row['special_price'] : $row['price'];
      $qty = (int)$row['qty'];
      $grouped[$store][] = [
        'id' => $row['id'],
        'product_variant_id' => $row['product_variant_id'],
        'image' => $row['image'],
        'name' => $row['name'],
        'price' => $price,
        'price_text' => $price_text,
        'qty' => $qty,
        'slug' => $row['slug'],
        'minimum_order_quantity' => $row['minimum_order_quantity'],
        'quantity_step_size' => $row['quantity_step_size'],
        'total_allowed_quantity' => $row['total_allowed_quantity'],
        'total' => $row['total']
      ];
    }

    $finalData = [];
    foreach($grouped as $storeName => $items) {
      $finalData[] = [
        'store' => $storeName,
        'items' => $items
      ];
    }
  ?>
<style>
h2 {
    margin-top: 0;
    margin-bottom: 20px;
    font-weight: 600;
    color: #333;
}

/* Store group styles */
.store-group {
    margin-bottom: 5px;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 15px;
    background: #fafafa;
}

.store-name {
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 5px;
    color: #222;
    border-bottom: 2px solid #ccc;
    padding-bottom: 5px;
}

/* Cart Items List */
.cart-items {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.cart-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-bottom: 1px solid #ddd;
    padding-bottom: 5px;
    position: relative;
}

/* Remove button */
.remove-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    border: none;
    background: transparent;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    color: #a00;
    font-weight: 700;
    user-select: none;
    padding: 0;
    transition: color 0.2s ease;
}

.remove-btn:hover {
    color: #e00;
}

.cart-item img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
    flex-shrink: 0;
}

.item-details {
    flex: 1 1 200px;
    padding: 0 15px;
}

.item-title {
    font-weight: 600;
    margin: 0 0 8px;
}

.store-label {
    font-size: 0.85rem;
    color: #888;
    margin-bottom: 4px;
}

.unit-price,
.item-total-price {
    font-size: 0.9rem;
    color: #555;
}

/* Quantity control */
.quantity-control {
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 4px;
    overflow: hidden;
    width: 120px;
    margin-top: 8px;
}

.quantity-control button {
    background: #eee;
    border: none;
    width: 36px;
    height: 36px;
    font-size: 20px;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.2s ease;
}

.quantity-control button:hover {
    background: #ddd;
}

.quantity-control input {
    border: none;
    width: 60px;
    text-align: center;
    font-size: 1rem;
    outline: none;
}

/* Total price */
.item-total-price {
    font-weight: 700;
    color: #000;
    text-align: right;
    min-width: 80px;
    position: absolute;
    bottom: 20px;
    right: 10px;
}

/* Cart Summary */
.cart-summary {
    border-top: 2px solid #333;
    padding-top: 20px;
    max-width: 350px;
    margin-left: auto;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    font-size: 1rem;
    color: #333;
}

.summary-row.total {
    font-weight: 700;
    font-size: 1.2rem;
    border-top: 2px solid #333;
    padding-top: 12px;
    margin-top: 12px;
}

/* Checkout button */
.checkout-button {
    display: block;
    width: 100%;
    background-color: #28a745;
    color: white;
    font-weight: 700;
    font-size: 1.1rem;
    padding: 15px 0;
    text-align: center;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    margin-top: 25px;
    transition: background-color 0.3s ease;
    text-decoration: none;
    /* if you use 
        <a> */
}

.checkout-button:hover {
    background-color: #218838;
}

/* Responsive */
@media (max-width: 600px) {
    .cart-item {
    flex-direction: column;
    align-items: flex-start;
    padding-bottom: 10px;
    /* reduce space under each item */
    margin-bottom: 10px;
    /* ensure items don't have big gaps */
    }

    .item-details {
    padding: 0 5px 10px 5px;
    /* reduce horizontal padding */
    width: 100%;
    flex: 1 1;
    }

    /* Group quantity and total price row */
    .quantity-and-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    }

    .quantity-control {
    margin: 0;
    /* remove top margin */
    width: auto;
    flex-shrink: 0;
    }

    .item-total-price {
    text-align: right;
    flex: 0 0 auto;
    min-width: 70px;
    font-weight: 700;
    color: #000;
    }
}
</style>

<!-- ========================= Breadcrumb Start =============================== -->
<div class="breadcrumb mb-0 py-26 bg-main-two-50">
    <div class="container container-lg">
        <div class="breadcrumb-wrapper flex-between flex-wrap gap-16">
            <h6 class="mb-0">購物車</h6>
            <ul class="flex-align gap-8 flex-wrap">
                <li class="text-sm">
                    <a href="https://yymart.com.hk" class="text-gray-900 flex-align gap-8 hover-text-main-600">
                        <i class="ph ph-house"></i>
                        主頁
                    </a>
                </li>
                <li class="flex-align">
                    <i class="ph ph-caret-right"></i>
                </li>
                <li class="text-sm text-main-600"> 購物車 </li>
            </ul>
        </div>
    </div>
</div>
<!-- ========================= Breadcrumb End =============================== -->

    <!-- ================================ Cart Section Start ================================ -->
 <section class="cart py-80">
    <div class="container container-lg">
        <?php if (isset($cart[0]['total_items']) && !empty($cart[0]['total_items']) && $cart[0]['total_items'] != "") { ?>
            <div id="cart-container" class="col-xl-9 col-lg-8">
                <?php foreach($finalData as $storeData) {?>
                    <div class="store-group" data-store="<?=$storeData['store']?>">
                        <div class="store-name"><?=$storeData['store']?></div>
                        <div class="cart-items">
                            <?php foreach($storeData['items'] as $row) { ?>
                                <div class="cart-item" data-id="<?=$row['id']?>" data-store="<?=$storeData['store']?>" data-price="<?=$row['price']?>">
                                    <div class="product-removal remove-btn">
                                        <i class="ph ph-trash" name="remove_inventory" id="remove_inventory" data-id="<?=$row['product_variant_id']?>" title="Remove From Cart" style="font-size:28px;"></i>
                                    </div>
                                    <img src="<?=$row['image']?>" alt="<?=$row['name']?>" />
                                    <div class="item-details">
                                        <h6 class="title text-lg fw-semibold mb-8">
                                            <a href="<?= base_url('products/details/' . $row['slug']) ?>" class="link text-line-2" tabindex="0"><?= output_escaping(str_replace('\r\n', '&#13;&#10;', $row['name'] ?? "")); ?></a>
                                        </h6>
                                        <p class="unit-price"><?="單價: ".$row['price_text']?></p>
                                        <div class="quantity-and-total">
                                            <div class="quantity-control">
                                                <div class="d-flex rounded-4 overflow-hidden qty_box num-block skin-2 product-quantity">
                                                    <?php $check_current_stock_status = validate_stock(
                                                        [$row['id']],
                                                        [$row['qty']]
                                                    ); ?>
                                                    <?php if (isset($check_current_stock_status['error'])  && $check_current_stock_status['error'] == TRUE) { ?>
                                                            <div><span class='text text-danger'>  沒有庫存 </span></div>
                                                        <?php } else { ?>
                                                        <div class="num-in" style="margin-top:0px;display:flex;">
                                                            <button type="button" class="minus dis quantity__minus text-neutral-600 flex-center hover-bg-main-600 hover-text-white" data-min="<?= (isset($row['minimum_order_quantity']) && !empty($row['minimum_order_quantity'])) ? $row['minimum_order_quantity'] : 1 ?>" data-step="<?= (isset($row['minimum_order_quantity']) && !empty($row['quantity_step_size'])) ? $row['quantity_step_size'] : 1 ?>">
                                                                <i class="ph ph-minus"></i>
                                                            </button>
                                                            <!--<input type="number" class="quantity__input flex-grow-1 border border-gray-100 border-start-0 border-end-0 text-center w-32 px-4" value="1" min="1">-->
                                                            <input type="number" class="in-num itemQty" data-page="cart" data-id="<?= $row['id']; ?>" value="<?= $row['qty'] ?>" data-price="<?= $row['price'] ?>" data-step="<?= (isset($row['minimum_order_quantity']) && !empty($row['quantity_step_size'])) ? $row['quantity_step_size'] : 1 ?>" data-min="<?= (isset($row['minimum_order_quantity']) && !empty($row['minimum_order_quantity'])) ? $row['minimum_order_quantity'] : 1 ?>" data-max="<?= (isset($row['total_allowed_quantity']) && !empty($row['total_allowed_quantity'])) ? $row['total_allowed_quantity'] : 0 ?>">
                                                            <button type="button" class="plus quantity__plus text-neutral-600 flex-center hover-bg-main-600 hover-text-white" data-max="<?= (isset($row['total_allowed_quantity']) && !empty($row['total_allowed_quantity'])) ? $row['total_allowed_quantity'] : '0' ?> " data-step="<?= (isset($row['minimum_order_quantity']) && !empty($row['quantity_step_size'])) ? $row['quantity_step_size'] : 1 ?>">
                                                                <i class="ph ph-plus"></i>
                                                            </button>
                                                        </div>
                                                        <?php } ?>
                                                        
                                                </div>
                                            </div>
                                            <div class="item-total-price"><span class="product-line-price text-lg h6 mb-0 fw-semibold" data-value="<?=$row['total']?>"><?= $row['total'] ?></span></div>
                                        </div>
                                    </div>
                                </div>
                            <?php } ?>
                        </div>
                    </div>
                <?php } ?>
            </div>
            <?php $delivery_charge = !empty($cart['sub_total']) ? $cart['delivery_charge_sf_number'] : 0 ?>
            <?php $total = !empty($cart['sub_total']) ? $cart['overall_amount'] : 0 ?>
            <?php $total_num = $cart['overall_amount']?>
            <div class="col-xl-3 col-lg-4">
                <div class="cart-sidebar border border-gray-100 rounded-8 px-24 py-40">
                    <h6 class="text-xl mb-32">購物車總額</h6>
                    <div class="bg-color-three rounded-8 p-24">
                        <div class="mb-32 flex-between gap-8">
                            <span class="text-gray-900 font-heading-two">產品總額</span>
                            <span id="product_total" data-value="<?=$cart['sub_total']?>" class="text-gray-900 fw-semibold"><?= $cart['sub_total'] ?></span>
                        </div>
                        <div class="mb-32 flex-between gap-8">
                            <span class="text-gray-900 font-heading-two">運費</span>
                            <span id="shipping-fee" data-value="<?=$delivery_charge?>" class="text-gray-900 fw-semibold"><?= $cart['delivery_charge_sf'] ?></span>
                        </div>
                        <!--
                        <div class="mb-0 flex-between gap-8">
                            <span class="text-gray-900 font-heading-two">Extimated Taxs</span>
                            <span class="text-gray-900 fw-semibold">USD 10.00</span>
                        </div>
                        -->
                    </div>  
                    <div class="bg-color-three rounded-8 p-24 mt-24">
                        <div class="flex-between gap-8 total-price">
                            <span class="text-gray-900 text-xl fw-semibold">共需支付</span>
                            <span class="text-gray-900 text-xl fw-semibold" style="font-weight: bold !important;" id="final_total" data-value="<?=$total_num?>"><?=$total?></span>
                        </div>
                    </div>  
                    <?php $disabled = empty($cart['sub_total']) ? 'disabled' : '' ?>
                    <a href="<?=base_url('cart/checkout')?>" class="btn btn-main mt-40 py-18 w-100 rounded-8" <?= $disabled ?>>前往付款</a>
                </div>
            </div>
        <?php } else { ?>
        <div class="align-items-center d-flex flex-column">
            <img src="<?= base_url('assets/front_end/classic/images/empty-orders.webp') ?>" alt="Empty Cart" class="w-23" style="width:20%" />
            <h1 class="h2 text-center"><?= '你的購物車是空的' ?></h1>
        </div>
        <?php } ?>
    </div>
 </section>
<!-- ================================ Cart Section End ================================ -->

The layout of template can be found in https://i.ibb.co/BKvZ914H/Test.png
Please view the image above with the code