<?php /* filepath: resources\views\AutoGestionCliente\items.blade.php */ ?>
<div class="row w-100">
    <?php $__empty_1 = true; foreach($items as $item): $__empty_1 = false; ?>
        <div class="col-lg-4 col-md-6 col-12 mb-3 d-flex" style="margin-bottom: 4%;">
            <div class="card shadow-sm border-0 flex-fill d-flex flex-column" style="background: rgba(0,0,0,0.03); border-radius: 10px;">
                <div class="card-body text-center d-flex flex-column">
                    <h5 class="card-title-clamped">
                        <?php if($tipo === 'producto'): ?>
                            <?php echo e($item->Nombre_Produc); ?>

                        <?php else: ?>
                            <?php echo e($item->nombre_combo); ?>

                        <?php endif; ?>
                    </h5>

                    <p class="card-text fw-bold text-success mb-2">
                        <?php if($tipo === 'producto'): ?>
                            $<?php echo e(number_format($item->valor_unitario, 0, ',', '.')); ?>

                        <?php else: ?>
                            $<?php echo e(number_format($item->valor_combo, 0, ',', '.')); ?>

                        <?php endif; ?>
                    </p>

                    <div class="mt-auto">
                        <button class="btn btn-primary btn-agregar-item w-100"
                                data-id="<?php echo e($item->getKey()); ?>"
                                data-tipo="<?php echo e($tipo); ?>"
                                <?php if(!session('cliente_autogestion')): ?> disabled title="Inicie pedido primero" <?php endif; ?>>
                            <i class="fas fa-cart-plus"></i> Agregar
                        </button>
                    </div>
                </div>
            </div>
        </div>
    <?php endforeach; if ($__empty_1): ?>
        <div class="col-12">
            <div class="alert alert-warning text-center mb-0">
                No hay <?php echo e($tipo); ?> disponibles por el momento.
            </div>
        </div>
    <?php endif; ?>
</div>

<style>
    .card-title-clamped {
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Máximo 2 líneas */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;

    /*
     * ESTABLECER UNA ALTURA Y LINE-HEIGHT FIJOS
     * Esto reserva un espacio consistente para dos líneas de texto,
     * asegurando que tanto los precios como los botones de abajo se alineen
     * perfectamente entre las tarjetas.
     */
    height: 3em; /* Se calcula: 2 líneas * 1.5em de interlineado */
    line-height: 1.5em; /* Un valor de interlineado estándar y legible */
}
</style>