@props(['links' => [], 'external' => false, 'modo' => 'social'])
<div class="inline-flex gap-2 px-1 py-1 rounded-full border-solid border items-center justify-center border-darkslateblue-300">
    {{-- Facebook --}}
    @if (!$external || isset($links['facebook']) || $modo === 'compartilhar')
        @php
            $link =
                $modo === 'compartilhar'
                    ? 'https://www.facebook.com/sharer/sharer.php?u=' .
                        urlencode(\Illuminate\Support\Facades\Request::url())
                    : $links['facebook'] ?? app(\App\Settings\ConfiguracaoGeral::class)->rede_social_facebook;
        @endphp
        <a class="w-12 h-12 grid items-center justify-center rounded-full hover:bg-babyblue-alt transition-colors"
            href="{{ $link }}" target="_blank">
            <svg xmlns="http://www.w3.org/2000/svg" width="27" height="27">
                <path fill="none" d="M0 0h27v27H0z" />
                <path data-name="Path 1974"
                    d="M15.23 22.317v-7.83h2.628l.394-3.052H15.23V9.487c0-.883.245-1.485 1.512-1.485h1.616V5.27a21.621 21.621 0 0 0-2.355-.12 3.677 3.677 0 0 0-3.925 4.034v2.25H9.443v3.052h2.635v7.83Z"
                    fill="#fff" stroke="currentColor" />
            </svg>
        </a>
    @endif

    {{-- Youtube --}}
    @if ((!$external || isset($links['youtube'])) && $modo !== 'compartilhar')
        <a class="w-12 h-12 grid items-center justify-center rounded-full hover:bg-babyblue-alt transition-colors"
            href="{{ $links['youtube'] ?? app(\App\Settings\ConfiguracaoGeral::class)->rede_social_youtube }}"
            target="_blank">
            <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26">
                <path fill="none" d="M0 0h26v26H0z" />
                <path data-name="Path 1976"
                    d="M21.553 9.33a3.715 3.715 0 0 0-.683-1.7 2.455 2.455 0 0 0-1.72-.727c-2.4-.174-6.006-.174-6.006-.174h-.007s-3.6 0-6.006.174a2.456 2.456 0 0 0-1.72.727 3.714 3.714 0 0 0-.682 1.7 25.925 25.925 0 0 0-.172 2.778v1.3a25.932 25.932 0 0 0 .172 2.778 3.717 3.717 0 0 0 .682 1.7 2.91 2.91 0 0 0 1.893.734c1.374.132 5.837.172 5.837.172s3.607-.005 6.01-.179a2.456 2.456 0 0 0 1.72-.727 3.717 3.717 0 0 0 .683-1.7 25.986 25.986 0 0 0 .172-2.778v-1.3a25.979 25.979 0 0 0-.173-2.778Zm-10.185 5.659v-4.824l4.638 2.42Z"
                    fill="#fff" stroke="currentColor" />
            </svg>
        </a>
    @endif

    {{-- Instagram --}}
    @if ((!$external || isset($links['instagram'])) && $modo !== 'compartilhar')
        <a class="w-12 h-12 grid items-center justify-center rounded-full hover:bg-babyblue-alt transition-colors"
            href="{{ $links['instagram'] ?? app(\App\Settings\ConfiguracaoGeral::class)->rede_social_instagram }}"
            target="_blank">
            <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26">
                <g fill="none">
                    <path d="M0 0h26v26H0z" />
                    <g data-name="Group 2335" transform="translate(4 3.999)">
                        <g data-name="Rectangle 26" fill="white" stroke="currentColor">
                            <rect width="18" height="17" rx="4" stroke="none" />
                            <rect x=".5" y=".5" width="17" height="16" rx="3.5" />
                        </g>
                        <g data-name="Path 4661">
                            <path d="M9.059 4.442a4.292 4.292 0 1 1-4.292 4.292 4.292 4.292 0 0 1 4.292-4.292Z" />
                            <path
                                d="M9.059 5.442a3.295 3.295 0 0 0-3.292 3.292 3.295 3.295 0 0 0 3.292 3.291 3.295 3.295 0 0 0 3.291-3.291A3.295 3.295 0 0 0 9.06 5.442m0-1a4.292 4.292 0 1 1 0 8.583 4.292 4.292 0 0 1 0-8.583Z"
                                fill="currentColor" />
                        </g>
                        <rect data-name="Rectangle 28" width="3" height="2" rx="1"
                            transform="translate(12 3)" />
                    </g>
                </g>
            </svg>
        </a>
    @endif

    {{-- Linkedin --}}
    @if (!$external || isset($links['linkedin']) || $modo === 'compartilhar')
        @php
            $link =
                $modo === 'compartilhar'
                    ? 'https://www.linkedin.com/shareArticle?mini=true&url=' .
                        urlencode(\Illuminate\Support\Facades\Request::url())
                    : $links['linkedin'] ?? app(\App\Settings\ConfiguracaoGeral::class)->rede_social_linkedin;
        @endphp
        <a class="w-12 h-12 grid items-center justify-center rounded-full hover:bg-babyblue-alt transition-colors"
            href="{{ $link }}" target="_blank">
            <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26">
                <path fill="none" d="M0 0h26v26H0z" />
                <g data-name="Group 2336" fill="#fff" stroke="currentColor" fill-rule="evenodd">
                    <path data-name="Path 1452"
                        d="M7.973 20.635V9.563h-3.68v11.072ZM6.133 8.052a2.05 2.05 0 1 0-.024 0Z" />
                    <path data-name="Path 1453"
                        d="M10.228 20.635h3.608v-6.081a2.48 2.48 0 0 1 .119-.883 1.975 1.975 0 0 1 1.851-1.324c1.306 0 1.828 1 1.828 2.463v5.825h3.608v-6.244c0-3.344-1.78-4.9-4.154-4.9a3.592 3.592 0 0 0-3.276 1.835h.024V9.747h-3.608c.047 1.022 0 10.889 0 10.889Z" />
                </g>
            </svg>
        </a>
    @endif

    {{-- Tiktok --}}
    @if (isset($links['tiktok']))
        <a class="w-12 h-12 grid items-center justify-center rounded-full hover:bg-babyblue-alt transition-colors"
            href="{{ $links['tiktok'] ?? app(\App\Settings\ConfiguracaoGeral::class)->rede_social_tiktok }}"
            target="_blank">
            <svg width="20" height="20" stroke="currentColor" fill="#fff" role="img" viewBox="0 0 24 24"
                xmlns="http://www.w3.org/2000/svg">
                <path
                    d="M12.525.02c1.31-.02 2.61-.01 3.91-.02.08 1.53.63 3.09 1.75 4.17 1.12 1.11 2.7 1.62 4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97-.57-.26-1.1-.59-1.62-.93-.01 2.92.01 5.84-.02 8.75-.08 1.4-.54 2.79-1.35 3.94-1.31 1.92-3.58 3.17-5.91 3.21-1.43.08-2.86-.31-4.08-1.03-2.02-1.19-3.44-3.37-3.65-5.71-.02-.5-.03-1-.01-1.49.18-1.9 1.12-3.72 2.58-4.96 1.66-1.44 3.98-2.13 6.15-1.72.02 1.48-.04 2.96-.04 4.44-.99-.32-2.15-.23-3.02.37-.63.41-1.11 1.04-1.36 1.75-.21.51-.15 1.07-.14 1.61.24 1.64 1.82 3.02 3.5 2.87 1.12-.01 2.19-.66 2.77-1.61.19-.33.4-.67.41-1.06.1-1.79.06-3.57.07-5.36.01-4.03-.01-8.05.02-12.07z" />
            </svg>
        </a>
    @endif
</div>