{{ button_tag = href ? 'a' : 'button' }}
<{{ button_tag }}
    type="{{ type ?? 'submit' }}"
    class="
        uppercase transition-all duration-300
        {{ if size === 'sm' }} py-4 px-16 {{ else }} py-4 px-16 {{ /if }}
        {{ if full-width }} w-full {{ /if }}
        {{ if bg-color }}
            bg-{{ convert_color:bg_to_button_bg :color="" }}
            border-{{ convert_color:bg_to_button_bg :color="" }}
            text-{{ convert_color:bg_to_button_text :color="" }}
            hover:bg-{{ convert_color:bg_to_button_hover_bg :color="" }}
            group-hover:bg-{{ convert_color:bg_to_button_hover_bg :color="" }}
            group-hover:border-{{ convert_color:bg_to_button_hover_bg :color="" }}
        {{ else }}
            bg-red text-white hover:bg-black group-hover:bg-black border-red hover:border-black group-hover:border-black
        {{ /if }}
        {{ if slug == "beesponsible-kids" }}
            pb-[55px] pt-[30px] mt:pb-[47px] md:pb-[30px] lg:pb-[105px]
        {{ /if }}
        {{ class }}
    "
    {{ if href }} href="{{ href }}" {{ /if }}
    {{ if click }} @click="{{ click }}" {{ /if }}
>
    {{ if text }} {{ text }} {{ /if }}
    {{ slot }}
</{{ button_tag }}>