import { twJoin } from '@/utils'

export const rootStyles = twJoin({
	position: 'sticky z-40 top-4',
	display: 'flex h-15.5 items-center px-6 py-3',
	text: 'text-gray-800',
	visual: 'shadow-sm rounded-md bg-white',
	childs: ['lg:[&_[data-type=sidebar-trigger]]:hidden'],
	//
	adaptive: '[&_[data-type=sidebar-trigger]]:flex',
	//
	dark: {
		text: 'dark:text-dark-gray-300',
		visual: 'dark:bg-dark-gray-900 dark:shadow-dark-sm'
	}
})
