@tailwind base;
@tailwind components;
@tailwind utilities;

.htmx-added .fade-in {
    opacity: 0.0 !important;
}

.htmx-added.fade-in {
    opacity: 0.0 !important;
}
.fade-in {
    opacity: 1.0;
}

.htmx-added .slide-up {
    @apply translate-y-5 !important;
}
.hidden .slide-up {
    @apply translate-y-5 !important;
}
.slide-up {
    @apply translate-y-0;
}

.live-added {
    animation: pulse-green 300ms 2;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
}

.dark .live-added {
    animation: pulse-dark-green 300ms 2 !important;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
}
/*
.live-added {
    @apply bg-white;
}
*/

@keyframes pulse-green {
    0% { @apply bg-white; }
    100% { @apply bg-green-300 dark:bg-red-700;}
}

@keyframes pulse-dark-green {
    0% { @apply dark:bg-gray-700; }
    100% { @apply bg-green-700;}
}


.htmx-request .htmx-indicator, .htmx-request.htmx-indicator {
    display: inherit !important;
}
.htmx-indicator {
    display: none;
}

.htmx-request .htmx-indicator-hidden {
    display: none !important;
}

.htmx-indicator-hidden {
    display: inherit;
}

.htmx-swapping .fade-out {
    opacity: 0.0 !important;
}
.fade-out {
    opacity: 1.0;
}

.min-h-content {
    min-height: calc(100vh - 4em);
}


.select2 {
    @apply text-xs !important;
}
.select2-dropdown {
    @apply p-2 mb-6 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 text-xs !important;
}

.select2-selection__choice {
    @apply bg-primary-100 dark:bg-primary-700 text-gray-900 dark:text-gray-200 !important;
    
}
.select2-search {
    @apply h-4 !important;
}
.select2-selection {
    @apply py-2.5 !important;
}