/* .fi-main {
    background-color: grey !important;
} */

.fi-sidebar-nav {
    background-color: #6C3FFF;
}

.fi-sidebar-item-label {
    color:#fff !important;
}

.fi-sidebar-header {
    background-color: #FFF !important;
}

.fi-topbar {
    background-color: #FFF !important;
}

.fi-link-icon {
    color: #FFF !important;
}

.fi-ta-content {
    background-color: #6C3FFF !important;
}

.fi-ta-header-toolbar {
    background-color: #6C3FFF !important;
}

.fi-pagination {
    background-color: #6C3FFF !important;
}

.fi-ta-filter-indicators {
    background-color: #6C3FFF !important;
}

.fi-ta-filter-indicators-button {
    background-color: #6C3FFF !important;
}


.fi-ta-header-toolbar-title {
    color: #000 !important;
}

.fi-input {
    color: #fff !important;
}

.fi-input::placeholder {
    color: #fff !important;
}


.fi-dropdown-trigger button{
    background-color: #6C3FFF !important;
}


/* @layer components { */
.fi-btn {
    background-color: #6C3FFF !important;
}
    /* Primary button and interactive elements */
    .fi-btn-primary {
        @apply bg-[#6C3FFF] hover:bg-[#5B35D9] dark:bg-[#6C3FFF] dark:hover:bg-[#5B35D9];
    }

    /* Active navigation items and selected states */
    .fi-active {
        @apply text-[#6C3FFF] dark:text-[#6C3FFF];
    }

    /* Links and interactive text */
    .fi-link {
        @apply text-[#6C3FFF] hover:text-[#5B35D9] dark:text-[#6C3FFF] dark:hover:text-[#5B35D9];
    }

    /* Selected items in tables and lists */
    .fi-selected {
        @apply bg-[#6C3FFF]/10 dark:bg-[#6C3FFF]/20;
    }

    /* Focus rings and outlines */
    .fi-ring {
        @apply ring-[#6C3FFF]/50 dark:ring-[#6C3FFF]/50;
    }

    /* Progress bars and loading indicators */
    .fi-progress {
        @apply bg-[#6C3FFF] dark:bg-[#6C3FFF];
    }

    /* Checkbox and radio button accents */
    .fi-checkbox, .fi-radio {
        @apply text-[#6C3FFF] dark:text-[#6C3FFF];
    }

    /* Toggle switch active state */
    .fi-toggle-input:checked + .fi-toggle-track {
        @apply bg-[#6C3FFF] dark:bg-[#6C3FFF];
    }

    /* Tabs and navigation active states */
    .fi-tabs-item-active {
        @apply text-[#6C3FFF] dark:text-[#6C3FFF];
    }

    /* Border accents */
    .fi-border-custom {
        @apply border-[#6C3FFF] dark:border-[#6C3FFF];
    }

    /* Text accents */
    .fi-text-custom {
        @apply text-[#6C3FFF] dark:text-[#6C3FFF];
    }
/* } */