@use 'tailwind';
@use 'stylesheets/base';
@use 'stylesheets/font';
@use 'stylesheets/layer';  
@use 'stylesheets/header';  
@use 'stylesheets/footer';  
@use 'stylesheets/logo';
@use 'stylesheets/pagination';
@use 'stylesheets/scrollbar';
@use '../../views/components/components';
@use 'custom';

// Header
.navbar{
    @apply bg-white text-dark
}
.navbar-brand{
    @apply py-1
}
.header-dropdown-style{
    @apply flex items-center gap-2 bg-gray-100 rounded-full px-3 py-2 border border-[#eaeaea] transition-colors duration-300;
    &:hover{
        @apply bg-gray-50;
    }
    &~.dropdown-menu{
        @apply bg-white min-w-[initial] w-[88px];
    }
}   

.animate-[spin_3s_linear_infinite]{
    animation: spin 3s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}