Untitled

<div>
    @foreach($escorts as $escort)
    <div class="card bg-white p-2 w-[22rem] h-[18.2rem] mt-2 rounded-lg">
        <div class="p-2 max-w-sm w-full mx-auto">

            <div class="flex flex-nowrap">
                <img class="w-40 h-[14rem] rounded-lg object-cover" src="{{$escort['main_image']}}">

                <div class="p-2 pt-0 text-rose-300 w-[50%] text-sm">
                    <!-- инфо -->
                    <label class="text-black font-semibold text-lg">{{$escort['name']}}</label>

                    <span class="flex flex-nowrap justify-start text-start items-center mb-2">
                        <x-gmdi-location-on-s class="w-4 h-4" />
                        <label> {{$escort['city']}}</label>
                    </span>


                    <div class="flex flex-nowrap w-100">
                        <div class="flex justify-start w-1/2">
                            <label>Возраст:</label>
                        </div>
                        <div class="flex justify-end text-black w-1/2">
                            <label>{{$escort['age']}}</label>
                        </div>
                    </div>

                    <div class="flex flex-nowrap w-100">
                        <div class="flex justify-start w-1/2">
                            <label>Грудь:</label>
                        </div>
                        <div class="flex justify-end text-black w-1/2">
                            <label>{{$escort['breasts']}}</label>
                        </div>
                    </div>

                    <div class="flex flex-nowrap w-100">
                        <div class="flex justify-start w-1/2">
                            <label>Вес:</label>
                        </div>
                        <div class="flex justify-end text-black w-1/2">
                            <label>{{$escort['weight']}}кг</label>
                        </div>
                    </div>

                    <div class="flex flex-nowrap w-100">
                        <div class="flex justify-start w-1/2">
                            <label>Рост:</label>
                        </div>
                        <div class="flex justify-end text-black w-1/2">
                            <label>{{$escort['height']}}см</label>
                        </div>
                    </div>

                    <!-- теги -->

                    <div class="flex flex-wrap mt-2 gap-2">
                        <div class="bg-[#FFAFBF] rounded-md text-white text-sm p-1 pl-2 pr-2">
                            Эскорт
                        </div>
                        <div class="bg-[#FFAFBF] rounded-md text-white text-sm p-1 pl-2 pr-2">
                            Бдсм
                        </div>
                        <div class="bg-[#FFAFBF] rounded-md text-white text-sm p-1 pl-2 pr-2">
                            Апартменты
                        </div>
                        <div class="bg-[#FFAFBF] rounded-md text-white text-sm p-1 pl-2 pr-2">
                            ...
                        </div>
                    </div>

                </div>
            </div>
            <div class="flex flex-nowrap justify-between gap-2 w-full mt-2 text-sm">
                <button
                    class="text-white flex items-center text-center justify-center rounded-md bg-[#FF5E7D] h-8 w-full p-2"><x-vaadin-phone
                        class="w-5 h-5 mr-1" /> Показать телефон</button>
                <button
                    class="text-white flex items-center text-center justify-center rounded-md bg-[#FF5E7D] h-8 w-8"><x-ri-whatsapp-fill
                        class="w-5 h-5" /></button>
            </div>
        </div>
    </div>
    @endforeach
</div>