{{-- supporting --}}
@push('style-after-global')
<style>
.line-supporting_applications {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

</style>
@endpush

<div class="card-header" style="margin: 0rem 0rem 1rem 0rem; padding: 0rem 1rem 0rem 1rem; background-color: transparent !important; border-radius: 3px;">
    <div class="card-content">
        <div style="margin: 1rem 0rem 1rem 0rem; padding: 0rem 1rem 0rem 1rem;">
            <div class="card-container">

                <section id="widgets-statistics">
                    <h4 class="text-center mt-1" style="font-weight: bold; font-size: 1rem;">Aplikasi Pendukung</h4>

                    @if ($supporting_widgets)
                        <div class="row row-cols-12">

                            {{-- supporting content --}}
                            @foreach($supporting_widgets as $supporting)
                            <div class="card-body">
                                <a href="{{ $supporting['site_url'] }}" target="_blank">
                                    <div class="card-body text-center">
                                        <img class="rounded" src="{{ url( $supporting['images_url']) }}" height="100" width="100">
                                    </div>
                                </a>
                            </div>
                            @endforeach
                            {{-- end supporting content --}}

                        </div>
                    @else
                        <div lass="card-body">
                            <div style="font-size:10px; color : #828D99; text-align:center;">
                                Tidak ditemukan
                            </div>
                        </div>
                    @endif

                </section>

            </div>
        </div>
    </div>
</div>
{{-- end supporting --}}