@import 'tippy.js/dist/tippy.css';
@import './components/tooltip.css';
@import './plugins/flatpickr.css';
@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

@import '@yaireo/tagify/dist/tagify.css';

[x-cloak] {
  display: none !important;
}

:root {
    --primary-25: 245 248 255;
        --primary-50: 239 244 255;
        --primary-100: 209 224 255;
        --primary-200: 178 204 255;
        --primary-300: 132 173 255;
        --primary-400: 82 139 255;
        --primary-500: 41 91 255;
        --primary-600: 21 58 239;
        --primary-700: 0 12 235;
        --primary-800: 0 172 193;
        --primary-900: 0 137 158;

        --gray-25: 250 252 255;
        --gray-50: 248 250 252;
        --gray-100: 241 245 249;
        --gray-200: 226 232 240;
        --gray-300: 203 213 225;
        --gray-400: 148 163 184;
        --gray-500: 100 116 139;
        --gray-600: 71 85 105;
        --gray-700: 51 65 85;
        --gray-800: 30 41 59;
        --gray-900: 15 23 42;
}

@media screen and (min-width: 768px) {
    .aura-content {
        width: calc(100% - 18rem);
    }
}

.aura-card {
    @apply p-4 mb-8 bg-white border shadow-sm border-gray-400/30 rounded-xl;
}

.dark .aura-card {
    @apply bg-gray-900 border-gray-700;
}

.aura-card-small {
    @apply p-2 bg-white border rounded-lg shadow-sm border-gray-400/30;
}
.dark .aura-card-small {
    @apply bg-gray-900 border-gray-700;
}


.left-sidebar-small, .left-sidebar-small > div {
    @apply w-16;
}

.left-sidebar-large, .left-sidebar-large > div {
    @apply w-72;
}

.sidebar-item svg {
    width: 24px;
}

.sidebar-item-compact svg {
    width: 20px;
}

.sidebar-item-icon svg {
    @apply w-6 h-6;
}
