@tailwind components;
@tailwind utilities;


.tiptap-content a[data-as-button="true"],
div.tiptap-editor div.ProseMirror a[data-as-button="true"] {

    @apply inline-block px-5 py-2.5 rounded-md font-semibold text-center transition-all duration-200 no-underline shadow-sm;

    /* --- SIZES (Leyendo el atributo hreflang) --- */

    /* Small (sm) */
    &[hreflang="sm"] {
        @apply px-3 py-1.5 text-xs;
    }

    /* Large (lg) */
    &[hreflang="lg"] {
        @apply px-20 py-5 text-lg;
    }

    /* Medium (md) - Por defecto o si no tiene hreflang */
    &[hreflang="md"],
    &:not([hreflang="sm"]):not([hreflang="lg"]) {
        @apply px-5 py-2.5 text-sm;
    }@apply px-8 py-4 text-lg;


    &[data-as-button-theme="button_secondary"] {
        @apply bg-gray-500 hover:bg-gray-600 !text-white;
    }

    &[data-as-button-theme="button_danger"] {
        @apply bg-red-600 hover:bg-red-700 !text-white;
    }

    &[data-as-button-theme="button_dark"] {
        @apply bg-gray-800 hover:bg-gray-900 !text-white;
    }

    &[data-as-button-theme="button_main_color"] {
        @apply bg-main-color hover:opacity-80 !text-white;
    }

    &[data-as-button-theme="button_color_one"] {
        @apply bg-main-one hover:bg-main-two !text-white;
    }

    &[data-as-button-theme="button_color_two"] {
        @apply bg-main-two hover:opacity-80 !text-white;
    }

    &[data-as-button-theme="button_msb"] {
        @apply bg-main-one hover:bg-main-two !text-white;
    }

    &[data-as-button-theme="button_m-yellow"] {
        @apply bg-m-yellow hover:opacity-80 !text-gray-800;
    }
}