const sidebarTheme = {
    baseStyle: 'flex flex-col h-full bg-[var(--color-background)] overflow-hidden',
    variants: {
        sidebar: 'relative',
        floating: 'rounded-[var(--radius-base)] shadow-lg border border-[var(--color-border)]',
        inset: 'rounded-[var(--radius-base)] bg-[var(--color-background-secondary)] border border-[var(--color-border)]',
    },
    sides: {
        left: 'border-r border-[var(--color-border)]',
        right: 'border-l border-[var(--color-border)]',
    },
    collapsed: 'w-16',
    expanded: 'w-[280px]',
    mobileOverlay: 'fixed inset-0 z-50 flex flex-col bg-[var(--color-background)]',
    mobileBackdrop: 'fixed inset-0 z-40 bg-black/50 backdrop-blur-sm',
};

export { sidebarTheme };
