@props(['software'])

<div class="col-sm-6 col-lg-4 col-xl-3">
    <div class="restaurant-card restaurant-card_text position-relative border card-scale h-100 rounded-12 wow fadeInUp"
        data-wow-delay="0.3s">
        <div class="thumb rounded-top-3 d-block position-relative">
            <img src="{{ asset('storage/' . $software->image) }}" alt="{{ $software->name }}" class="w-100 software-card-img">
            <div class="restaurant-order-text position-absolute text-center">
                <div class="pt-lg-4 pt-3">
                    <h6 class="fs-15 fw-500 text-white mb-xl-1 mb-0">{{ $software->category }}</h6>
                    <a href="{{ route('software.show', $software) }}"
                        class="theme-btn border bg-white rounded py-2 px-3 theme3-clr">
                        <span class="theme3-clr">{{ __('app.view_details') }}</span>
                    </a>
                </div>
            </div>
        </div>
        <div
            class="position-absolute rounded-pill z-1 top-0 m-xxl-4 m-xl-3 m-lg-2 m-1 theme3-bg fs-12 py-1 lh-base px-2 text-white heading-font fw-500 d-inline-flex align-items-center gap-1">
            <img src="{{ asset('images/offer-icon.svg') }}" alt="" width="14" height="14"
                aria-hidden="true"> {{ __('app.software') }}
        </div>
        <div class="cont py-3 px-xxl-4 px-3">
            <h6 class="mb-2">
                <a href="{{ route('software.show', $software) }}" class="text-black link-effect">
                    {{ $software->name }}
                </a>
            </h6>
            <p class="fs-14 text-clr mb-2">{{ Str::limit($software->description, 200) }}</p>
            <div class="d-flex align-items-center gap-2 fs-14 text-clr">
                <img src="{{ asset('images/layer-icon.svg') }}" alt="" width="16" height="16"
                    aria-hidden="true"> {{ $software->category }}
            </div>
        </div>
    </div>
</div>