@import 'tailwindcss';
@import '../../vendor/livewire/flux/dist/flux.css';

@source "../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php";
@source "../../storage/framework/views/*.php";
@source "../**/*.blade.php";
@source "../**/*.js";

@custom-variant dark (&:where(.dark, .dark *));

@theme {
    --font-sans: "IBM Plex Sans", "Segoe UI", sans-serif;
}

body {
    font-family: var(--font-sans);
}

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

.nav-link {
    @apply block rounded-lg px-3 py-2 text-slate-300 transition hover:bg-slate-800 hover:text-white;
}

.nav-link-active {
    @apply bg-slate-700 text-white;
}

.card {
    @apply rounded-2xl border border-slate-200 bg-white shadow-sm;
}

.card-body {
    @apply p-5;
}

.dashboard-chart-wrap {
    height: 280px;
    min-height: 280px;
    max-height: 280px;
    position: relative;
    overflow: hidden;
}

.dashboard-chart-wrap canvas {
    width: 100% !important;
    height: 100% !important;
    max-height: 280px !important;
    display: block;
}