@import "tailwindcss";

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

/* Tailwind v4 sources */
@source '../views';
@source '../../vendor/filament/**/*.blade.php';
@source '../../vendor/andrewdwallo/filament-selectify/resources/views/**/*.blade.php';
@source '../../vendor/ysfkaya/filament-phone-input/resources/views/**/*.blade.php';
@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../vendor/livewire/flux-pro/stubs/**/*.blade.php';
@source '../../vendor/livewire/flux/stubs/**/*.blade.php';

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

/* Theme tokens only */
@theme {
    --font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif;
}

/* BASE = resets only */
@layer base {

    *,
    ::before,
    ::after {
        border-color: var(--color-gray-200, currentColor);
    }
}

.choices__list--dropdown,
.choices__list[aria-expanded],
.fi-dropdown-panel,
.fi-scrollable {
    margin-top: -40px !important;
}

.fi-logo {
    height: 2.5rem !important;
    margin: 10px auto 0px;
}


/* COMPONENTS = Filament overrides */
@layer components {

    /* .fi-sidebar {
        @apply rounded-2xl shadow-lg bg-white/90 backdrop-blur-md;
    } */

    /* Wrap instead of margin */
    /* .fi-layout {
        @apply p-6;
    }

    .fi-main {
        @apply pl-2;
    }

    .dark .fi-sidebar {
        @apply bg-zinc-900 shadow-black/40;
    }

    .fi-sidebar-header {
        @apply border-none;
    } */
    /* Sidebar styling */
    .fi-sidebar {
        border-radius: 1rem;
        /* rounded-2xl */
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
        /* shadow-lg */
        /* background-color: rgba(255, 255, 255, 0.9) !important; */
        /* bg-white/90 */
        /* backdrop-filter: blur(12px) !important; */
        /* backdrop-blur-md */
        margin: 1rem 0 0 0 !important;
        height: calc(100vh - 2rem) !important;
        /* box-sizing: content-box !important; */
        border: 1px solid oklch(0.792 0.209 151.711) !important;
    }

    /* Layout padding instead of margin */
    .fi-layout {
        padding: 0 0 0 1rem !important;
        /* p-6 */
    }

    /* First sidebar item button */
    .fi-sidebar-item:first-child {
        .fi-sidebar-item-btn {
            /* background-color: oklch(0.792 0.209 151.711); */
            /* Tailwind's primary blue, adjust if your theme primary differs */
            /* color: white; */
            /* Text color */
            /* text-align: center; */
            /* Center text */
            /* border-radius: 0.5rem; */
            /* Optional: rounded-md */
            /* padding: 0.5rem 1rem; */
            /* Optional: padding like Tailwind */
            /* font-weight: 500; */
            /* Optional: medium font weight */
            /* margin: 0.5rem 0rem 0.5rem 0rem !important; */
        }

        .fi-sidebar-item-btn:hover {
            /* background-color: oklch(0.6 0.209 151.711); */
        }

        .fi-sidebar-item-icon {
            /* color: black; */
        }

        .fi-sidebar-item-label {
            /* color: white; */
        }
    }

    /* Optional hover effect to match Tailwind primary hover */
    .fi-sidebar-item-btn:first-child:hover {
        background-color: #2563eb;
        /* Slightly darker blue on hover */
    }


    /* .fi-main { */
    /* padding-left: 0.5rem !important; */
    /* pl-2 */
    /* } */

    /* Dark mode sidebar */
    .dark .fi-sidebar {
        /* background-color: #18181b !important; */
        /* bg-zinc-900 */
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.4) !important;
        /* shadow-black/40 */
    }

    /* Sidebar header */
    .fi-sidebar-header {
        border: none !important;
    }

}