/* @import "../../vendor/awcodes/filament-tiptap-editor/resources/css/plugin.css"; */
@import "../../node_modules/animate.css/animate.min.css";
@import "../../node_modules/swiper/swiper-bundle.min.css";

/*  */
@tailwind base;
@tailwind components;
@tailwind utilities;
/* @tailwind variants; */

[x-cloak] {
    display: none;
}


:root {
    --swiper-theme-color: 182 129 60;
    /* #b6813c; /* Replace 'your_color' with your desired color */
    --color-background: 0 154 191;
    /*#009ABF; /* same as #b6813c */


}

@layer base {
    * {
        @apply transition-colors duration-150;
    }


    /* @import url("https://fonts.googleapis.com/css2?family=Russo+One&display=swap"); */


    @font-face {
        font-family: "tufuli";
        src: url("../../public/fonts/Tufuli.ttf");
    }


    /* @font-face {
        font-family: "en";
        src: url("../../public/fonts/en.ttf");
    } */


    /* @font-face {
        font-family: "bold";
        src: url("../../public/fonts/Yuanti-SC-Bold-stub.ttf");
    }

    @font-face {
        font-family: "light";
        src: url("../../public/fonts/Yuanti-SC-Light-stub.ttf");
    }

    @font-face {
        font-family: "sc_regular";
        src: url("../../public/fonts/Yuanti-SC-Regular-stub.ttf");
    } */

    /* @font-face {
        font-family: "roboto_regular";
        src: url("../../public/fonts/roboto/Roboto-Regular.woff");
    } */

    .screen {
        @apply px-4 mx-auto sm:px-6 lg:px-8 lg:max-w-screen-xl;
    }

    .text-normal {
        @apply text-xs sm:text-sm lg:text-lg;
    }

    .text-big {
        @apply text-xs sm:text-sm lg:text-xl;
    }

    .text-extra {
        @apply text-xs sm:text-base lg:text-2xl;
    }

    .title {
        @apply text-base sm:text-xl lg:text-5xl font-extrabold uppercase;
    }

    .subtitle {
        @apply text-base sm:text-lg lg:text-4xl font-bold uppercase;
    }
}

/* html {
    font-size: 1rem; /* 16px by default, adjust as needed */
/* line-height: 0.2rem;
} */

/* body {
    @apply text-base leading-normal; /* Apply Tailwind's text-base class */
/* } */
/* input {
    @apply h-10; /* Set h-10 as the default for buttons and inputs */
/* } */
.text-bordered {
    /* Use a CSS variable for the shadow color */
    text-shadow:
        -1px -1px 0 var(--border-color, #fff),
        1px -1px 0 var(--border-color, #fff),
        -1px 1px 0 var(--border-color, #fff),
        1px 1px 0 var(--border-color, #fff);
}


.btn {
    @apply inline-flex items-center gap-x-1.5 rounded-md bg-curiooRed px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-red-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-red-600
}

.btnsm {
    @apply inline-flex items-center gap-x-1.5 rounded-md bg-curiooRed px-3 py-1 text-xs font-semibold text-white shadow-sm hover:bg-red-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-red-600
}

.shrink {
    height: 60px;
    transition: height 0.3s ease;
}

.expand {
    height: 100px;
    transition: height 0.3s ease;
}

html {
    scroll-behavior: smooth;
}

.transition-transform {
    transition: transform 0.5s ease;
}