diff --git a/doc/common/presetdoc/index.json b/doc/common/presetdoc/index.json index 0a33f26a..dd2f2568 100644 --- a/doc/common/presetdoc/index.json +++ b/doc/common/presetdoc/index.json @@ -1,76 +1,77 @@ { "accordion": ".p-accordionpanel {\n @apply flex flex-col border-b border-surface-200 dark:border-surface-700\n}\n\n.p-accordionheader {\n @apply cursor-pointer disabled:cursor-auto flex items-center justify-between p-[1.125rem] font-semibold\n bg-surface-0 dark:bg-surface-900\n text-surface-500 dark:text-surface-400\n transition-colors duration-200\n}\n\n.p-accordionpanel:first-child > .p-accordionheader {\n @apply rounded-t-md\n}\n\n.p-accordionpanel:last-child > .p-accordionheader {\n @apply rounded-b-md\n}\n\n.p-accordionpanel:last-child.p-accordionpanel-active > .p-accordionheader {\n @apply rounded-b-md\n}\n\n.p-accordionheader-toggle-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-accordionpanel:not(.p-disabled) .p-accordionheader:focus-visible {\n @apply outline outline-1 outline-offset-[-1px] outline-primary\n}\n\n.p-accordionpanel:not(.p-accordionpanel-active):not(.p-disabled) > .p-accordionheader:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-accordionpanel-active):not(.p-disabled) .p-accordionheader:hover .p-accordionheader-toggle-icon {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader .p-accordionheader-toggle-icon {\n @apply text-surface-700 dark:text-surface-0;\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader:hover .p-accordionheader-toggle-icon {\n @apply text-surface-700 dark:text-surface-0;\n}\n\n.p-accordioncontent-content {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0 pt-0 px-[1.125rem] pb-[1.125rem]\n}", - "autocomplete": ".p-autocomplete {\n @apply inline-flex\n}\n\n.p-autocomplete.p-disabled {\n @apply opacity-100\n}\n\n.p-autocomplete-loader {\n @apply absolute top-1/2 -mt-2 right-3\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-loader {\n @apply right-[3.25rem]\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input {\n @apply flex-auto w-[1%]\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input,\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input-multiple {\n @apply rounded-r-none\n}\n\n.p-autocomplete-dropdown {\n @apply cursor-pointer inline-flex items-center justify-center select-none overflow-hidden relative w-10 rounded-r-md\n bg-surface-100 enabled:hover:bg-surface-200 enabled:active:bg-surface-300\n text-surface-600 enabled:hover:text-surface-700 enabled:hover:active:text-surface-800\n dark:bg-surface-800 dark:enabled:hover:bg-surface-700 dark:enabled:active:bg-surface-600\n dark:text-surface-300 dark:enabled:hover:text-surface-200 dark:enabled:active:text-surface-100\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-autocomplete .p-autocomplete-overlay {\n @apply min-w-full\n}\n\n.p-autocomplete-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-autocomplete-list-container {\n @apply overflow-auto\n}\n\n.p-autocomplete-list {\n @apply m-0 p-1 list-none flex flex-col gap-[2px]\n}\n\n.p-autocomplete-option {\n @apply cursor-pointer whitespace-nowrap relative overflow-hidden flex items-center px-3 py-2 rounded-sm\n text-surface-700 dark:text-surface-0 bg-transparent border-none\n transition-colors duration-200\n}\n\n.p-autocomplete-option:not(.p-autocomplete-option-selected):not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-700 dark:text-surface-0\n}\n\n.p-autocomplete-option-selected {\n @apply bg-highlight\n}\n\n.p-autocomplete-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-autocomplete-option-group {\n @apply m-0 px-3 py-2 text-surface-500 dark:text-surface-400 font-semibold bg-transparent\n}\n\n.p-autocomplete-input-multiple {\n @apply m-0 list-none cursor-text overflow-hidden flex items-center flex-wrap\n px-3 py-1 gap-1 text-surface-700 dark:text-surface-0 bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700 rounded-md w-full\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200 outline-none\n}\n\n.p-autocomplete:not(.p-disabled):hover .p-autocomplete-input-multiple {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-autocomplete:not(.p-disabled).p-focus .p-autocomplete-input-multiple {\n @apply border-primary\n}\n\n.p-autocomplete.p-invalid .p-autocomplete-input-multiple {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-variant-filled.p-autocomplete-input-multiple {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-autocomplete.p-disabled .p-autocomplete-input-multiple {\n @apply opacity-100 cursor-default bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400\n}\n\n.p-autocomplete-chip.p-chip {\n @apply py-1 rounded-sm\n}\n\n.p-autocomplete-input-multiple:has(.p-autocomplete-chip) {\n @apply px-1\n}\n\n.p-autocomplete-chip-item.p-focus .p-autocomplete-chip {\n @apply bg-surface-200 text-surface-800 dark:bg-surface-700 dark:text-surface-0\n}\n\n.p-autocomplete-input-chip {\n @apply flex-auto inline-flex py-1\n}\n\n.p-autocomplete-input-chip input {\n @apply border-none outline-none bg-transparent m-0 p-0 shadow-none rounded-none w-full text-inherit\n}\n\n.p-autocomplete-input-chip input::placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-autocomplete-empty-message {\n @apply px-3 py-2\n}\n\n.p-autocomplete-fluid {\n @apply flex\n}\n\n.p-autocomplete-fluid:has(.p-autocomplete-dropdown) .p-autocomplete-input {\n @apply w-[1%]\n}", + "autocomplete": "@import './inputtext';\n@import './chip';\n\n.p-autocomplete {\n @apply inline-flex\n}\n\n.p-autocomplete.p-disabled {\n @apply opacity-100\n}\n\n.p-autocomplete-loader {\n @apply absolute top-1/2 -mt-2 end-3\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-loader {\n @apply end-[3.25rem]\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input {\n @apply flex-auto w-[1%]\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input,\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input-multiple {\n @apply rounded-e-none\n}\n\n.p-autocomplete-dropdown {\n @apply cursor-pointer inline-flex items-center justify-center select-none overflow-hidden relative w-10 rounded-e-md\n bg-surface-100 enabled:hover:bg-surface-200 enabled:active:bg-surface-300\n text-surface-600 enabled:hover:text-surface-700 enabled:hover:active:text-surface-800\n dark:bg-surface-800 dark:enabled:hover:bg-surface-700 dark:enabled:active:bg-surface-600\n dark:text-surface-300 dark:enabled:hover:text-surface-200 dark:enabled:active:text-surface-100\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-autocomplete .p-autocomplete-overlay {\n @apply min-w-full\n}\n\n.p-autocomplete-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-autocomplete-list-container {\n @apply overflow-auto\n}\n\n.p-autocomplete-list {\n @apply m-0 p-1 list-none flex flex-col gap-[2px]\n}\n\n.p-autocomplete-option {\n @apply cursor-pointer whitespace-nowrap relative overflow-hidden flex items-center px-3 py-2 rounded-sm\n text-surface-700 dark:text-surface-0 bg-transparent border-none\n transition-colors duration-200\n}\n\n.p-autocomplete-option:not(.p-autocomplete-option-selected):not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-700 dark:text-surface-0\n}\n\n.p-autocomplete-option-selected {\n @apply bg-highlight\n}\n\n.p-autocomplete-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-autocomplete-option-group {\n @apply m-0 px-3 py-2 text-surface-500 dark:text-surface-400 font-semibold bg-transparent\n}\n\n.p-autocomplete-input-multiple {\n @apply m-0 list-none cursor-text overflow-hidden flex items-center flex-wrap\n px-3 py-1 gap-1 text-surface-700 dark:text-surface-0 bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700 rounded-md w-full\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200 outline-none\n}\n\n.p-autocomplete:not(.p-disabled):hover .p-autocomplete-input-multiple {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-autocomplete:not(.p-disabled).p-focus .p-autocomplete-input-multiple {\n @apply border-primary\n}\n\n.p-autocomplete.p-invalid .p-autocomplete-input-multiple {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-variant-filled.p-autocomplete-input-multiple {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-autocomplete.p-disabled .p-autocomplete-input-multiple {\n @apply opacity-100 cursor-default bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400\n}\n\n.p-autocomplete-chip.p-chip {\n @apply py-1 rounded-sm\n}\n\n.p-autocomplete-input-multiple:has(.p-autocomplete-chip) {\n @apply px-1\n}\n\n.p-autocomplete-chip-item.p-focus .p-autocomplete-chip {\n @apply bg-surface-200 text-surface-800 dark:bg-surface-700 dark:text-surface-0\n}\n\n.p-autocomplete-input-chip {\n @apply flex-auto inline-flex py-1\n}\n\n.p-autocomplete-input-chip input {\n @apply border-none outline-none bg-transparent m-0 p-0 shadow-none rounded-none w-full text-inherit\n}\n\n.p-autocomplete-input-chip input::placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-autocomplete-empty-message {\n @apply px-3 py-2\n}\n\n.p-autocomplete-fluid {\n @apply flex\n}\n\n.p-autocomplete-fluid:has(.p-autocomplete-dropdown) .p-autocomplete-input {\n @apply w-[1%]\n}\n", "avatar": ".p-avatar {\n @apply inline-flex items-center justify-center\n w-8 h-8 text-base rounded-md\n bg-surface-200 dark:bg-surface-700 \n}\n\n.p-avatar-image {\n @apply bg-transparent\n}\n\n.p-avatar-circle,\n.p-avatar-circle img {\n @apply rounded-full\n}\n\n.p-avatar-icon {\n @apply text-base\n}\n\n.p-avatar img {\n @apply w-full h-full\n}\n\n.p-avatar-lg {\n @apply w-12 h-12 text-2xl\n}\n\n.p-avatar-lg .p-avatar-icon {\n @apply text-2xl\n}\n\n.p-avatar-xl {\n @apply w-16 h-16 text-[2rem]\n}\n\n.p-avatar-xl .p-avatar-icon {\n @apply text-[2rem]\n}\n\n.p-avatar-group {\n @apply flex items-center\n}\n\n.p-avatar-group .p-avatar + .p-avatar {\n @apply -ml-4\n}\n\n.p-avatar-group .p-avatar {\n @apply border-2 border-surface-200 dark:border-surface-700\n}", "badge": ".p-badge {\n @apply inline-flex items-center justify-center rounded-md\n py-0 px-2 text-xs font-bold min-w-6 h-6\n bg-primary text-primary-contrast\n}\n\n.p-badge-dot {\n @apply min-w-2 h-2 rounded-full p-0\n}\n\n.p-badge-circle {\n @apply p-0 rounded-full\n}\n\n.p-badge-secondary {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-600 dark:text-surface-300\n}\n\n.p-badge-success {\n @apply bg-green-500 dark:bg-green-400 text-white dark:text-green-950\n}\n\n.p-badge-info {\n @apply bg-sky-500 dark:bg-sky-400 text-white dark:text-sky-950\n}\n\n.p-badge-warn {\n @apply bg-orange-500 dark:bg-orange-400 text-white dark:text-orange-950\n}\n\n.p-badge-danger {\n @apply bg-red-500 dark:bg-red-400 text-white dark:text-red-950\n}\n\n.p-badge-contrast {\n @apply bg-surface-950 dark:bg-white text-white dark:text-surface-950\n}\n\n.p-badge-sm {\n @apply text-[0.625rem] min-w-5 h-5\n}\n\n.p-badge-lg {\n @apply text-sm min-w-7 h-7\n}\n\n.p-badge-xl {\n @apply text-base min-w-8 h-8\n}", "blockui": ".p-blockui {\n @apply relative\n}\n\n.p-blockui-mask {\n @apply rounded-md\n}\n\n.p-blockui-mask.p-overlay-mask {\n @apply absolute\n}\n\n.p-blockui-mask-document.p-overlay-mask {\n @apply fixed\n}", "breadcrumb": ".p-breadcrumb {\n @apply bg-surface-0 dark:bg-surface-900 p-4 overflow-x-auto\n}\n\n.p-breadcrumb-list {\n @apply m-0 p-0 list-none flex items-center flex-nowrap gap-2\n}\n\n.p-breadcrumb-separator {\n @apply flex items-center text-surface-400 dark:text-surface-500\n}\n\n.p-breadcrumb::-webkit-scrollbar {\n @apply hidden\n}\n\n.p-breadcrumb-item-link {\n @apply no-underline flex items-center gap-2 transition-colors duration-200 rounded-md\n text-surface-500 dark:text-surface-400\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-breadcrumb-item-link:hover .p-breadcrumb-item-label {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-breadcrumb-item-label {\n @apply transition-colors duration-200\n}\n\n.p-breadcrumb-item-icon {\n @apply text-surface-400 dark:text-surface-500 transition-colors duration-200\n}\n\n.p-breadcrumb-item-link:hover .p-breadcrumb-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}", - "button": ".p-button {\n @apply inline-flex cursor-pointer select-none items-center justify-center overflow-hidden relative \n bg-primary enabled:hover:bg-primary-emphasis enabled:active:bg-primary-emphasis-alt text-primary-contrast\n border border-primary enabled:hover:border-primary-emphasis enabled:active:border-primary-emphasis-alt\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n px-3 py-2 transition-colors duration-200 gap-2 rounded-md\n disabled:cursor-default\n}\n\n.p-button-icon-right {\n @apply order-1\n}\n\n.p-button-icon-bottom {\n @apply order-2\n}\n\n.p-button-icon-only {\n @apply w-10 px-0 gap-0\n}\n\n.p-button-icon-only.p-button-rounded {\n @apply rounded-full h-10\n}\n\n.p-button-icon-only .p-button-label {\n @apply invisible w-0\n}\n\n.p-button-sm {\n @apply text-sm px-[0.625rem] py-[0.375rem]\n}\n\n.p-button-sm .p-button-icon {\n @apply text-sm\n}\n\n.p-button-lg {\n @apply text-[1.125rem] px-[0.875rem] py-[0.625rem]\n}\n\n.p-button-lg .p-button-icon {\n @apply text-[1.125rem]\n}\n\n.p-button-vertical {\n @apply flex-col\n}\n\n.p-button-label {\n @apply font-medium\n}\n\n.p-button-fluid {\n @apply w-full\n}\n\n.p-button-fluid.p-button-icon-only { \n @apply w-10\n}\n\n.p-button .p-badge {\n @apply min-w-4 h-4 leading-4\n}\n\n.p-button-raised {\n @apply shadow-[0_3px_1px_-2px_rgba(0,0,0,0.2),0_2px_2px_0_rgba(0,0,0,0.14),0_1px_5px_0_rgba(0,0,0,0.12)]\n}\n\n.p-button-rounded {\n @apply rounded-[2rem]\n}\n\n.p-button-secondary {\n @apply bg-surface-100 enabled:hover:bg-surface-200 enabled:active:bg-surface-300\n border-surface-100 enabled:hover:border-surface-200 enabled:active:border-surface-300\n text-surface-600 enabled:hover:text-surface-700 enabled:active:text-surface-800\n dark:bg-surface-800 dark:enabled:hover:bg-surface-700 dark:enabled:active:bg-surface-600\n dark:border-surface-800 dark:enabled:hover:border-surface-700 dark:enabled:active:border-surface-600\n dark:text-surface-300 dark:enabled:hover:text-surface-200 dark:enabled:active:text-surface-100\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-surface-600 dark:focus-visible:outline-surface-300\n}\n\n.p-button-success {\n @apply bg-green-500 enabled:hover:bg-green-600 enabled:active:bg-green-700\n border-green-500 enabled:hover:border-green-600 enabled:active:border-green-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-green-400 dark:enabled:hover:bg-green-300 dark:enabled:active:bg-green-200\n dark:border-green-400 dark:enabled:hover:border-green-300 dark:enabled:active:border-green-200\n dark:text-green-950 dark:enabled:hover:text-green-950 dark:enabled:active:text-green-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-green-500 dark:focus-visible:outline-green-400\n}\n\n.p-button-info {\n @apply bg-sky-500 enabled:hover:bg-sky-600 enabled:active:bg-sky-700\n border-sky-500 enabled:hover:border-sky-600 enabled:active:border-sky-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-sky-400 dark:enabled:hover:bg-sky-300 dark:enabled:active:bg-sky-200\n dark:border-sky-400 dark:enabled:hover:border-sky-300 dark:enabled:active:border-sky-200\n dark:text-sky-950 dark:enabled:hover:text-sky-950 dark:enabled:active:text-sky-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-sky-500 dark:focus-visible:outline-sky-400\n}\n\n.p-button-warn {\n @apply bg-orange-500 enabled:hover:bg-orange-600 enabled:active:bg-orange-700\n border-orange-500 enabled:hover:border-orange-600 enabled:active:border-orange-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-orange-400 dark:enabled:hover:bg-orange-300 dark:enabled:active:bg-orange-200\n dark:border-orange-400 dark:enabled:hover:border-orange-300 dark:enabled:active:border-orange-200\n dark:text-orange-950 dark:enabled:hover:text-orange-950 dark:enabled:active:text-orange-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-orange-500 dark:focus-visible:outline-orange-400\n}\n\n.p-button-help {\n @apply bg-purple-500 enabled:hover:bg-purple-600 enabled:active:bg-purple-700\n border-purple-500 enabled:hover:border-purple-600 enabled:active:border-purple-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-purple-400 dark:enabled:hover:bg-purple-300 dark:enabled:active:bg-purple-200\n dark:border-purple-400 dark:enabled:hover:border-purple-300 dark:enabled:active:border-purple-200\n dark:text-purple-950 dark:enabled:hover:text-purple-950 dark:enabled:active:text-purple-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-purple-500 dark:focus-visible:outline-purple-400\n}\n\n.p-button-help {\n @apply bg-purple-500 enabled:hover:bg-purple-600 enabled:active:bg-purple-700\n border-purple-500 enabled:hover:border-purple-600 enabled:active:border-purple-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-purple-400 dark:enabled:hover:bg-purple-300 dark:enabled:active:bg-purple-200\n dark:border-purple-400 dark:enabled:hover:border-purple-300 dark:enabled:active:border-purple-200\n dark:text-purple-950 dark:enabled:hover:text-purple-950 dark:enabled:active:text-purple-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-purple-500 dark:focus-visible:outline-purple-400\n}\n\n.p-button-danger {\n @apply bg-red-500 enabled:hover:bg-red-600 enabled:active:bg-red-700\n border-red-500 enabled:hover:border-red-600 enabled:active:border-red-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-red-400 dark:enabled:hover:bg-red-300 dark:enabled:active:bg-red-200\n dark:border-red-400 dark:enabled:hover:border-red-300 dark:enabled:active:border-red-200\n dark:text-red-950 dark:enabled:hover:text-red-950 dark:enabled:active:text-red-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-red-500 dark:focus-visible:outline-red-400\n}\n\n.p-button-contrast {\n @apply bg-surface-950 enabled:hover:bg-surface-900 enabled:active:bg-surface-800\n border-surface-950 enabled:hover:border-surface-900 enabled:active:border-surface-800\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-surface-0 dark:enabled:hover:bg-surface-100 dark:enabled:active:bg-surface-200\n dark:border-surface-100 dark:enabled:hover:border-surface-200 dark:enabled:active:border-surface-300\n dark:text-surface-950 dark:enabled:hover:text-surface-950 dark:enabled:active:text-surface-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-surface-950 dark:focus-visible:outline-surface-0\n}\n\n.p-button-outlined {\n @apply bg-transparent enabled:hover:bg-primary-50 enabled:active:bg-primary-100\n border-primary-200 enabled:hover:border-primary-200 enabled:active:border-primary-200\n text-primary enabled:hover:text-primary enabled:active:text-primary\n dark:bg-transparent dark:enabled:hover:bg-primary/5 dark:enabled:active:bg-primary/15\n dark:border-primary-700 dark:enabled:hover:border-primary-700 dark:enabled:active:border-primary-700\n dark:text-primary dark:enabled:hover:text-primary dark:enabled:active:text-primary\n}\n\n.p-button-outlined.p-button-secondary {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-surface-200 enabled:hover:border-surface-200 enabled:active:border-surface-200\n text-surface-500 enabled:hover:text-surface-500 enabled:active:text-surface-500\n dark:bg-transparent dark:enabled:hover:bg-white/5 dark:enabled:active:bg-white/15\n dark:border-surface-700 dark:enabled:hover:border-surface-700 dark:enabled:active:border-surface-700\n dark:text-surface-400 dark:enabled:hover:text-surface-400 dark:enabled:active:text-surface-400\n}\n\n.p-button-outlined.p-button-success {\n @apply bg-transparent enabled:hover:bg-green-50 enabled:active:bg-green-100\n border-green-200 enabled:hover:border-green-200 enabled:active:border-green-200\n text-green-500 enabled:hover:text-green-500 enabled:active:text-green-500\n dark:bg-transparent dark:enabled:hover:bg-green-400/5 dark:enabled:active:bg-green-400/15\n dark:border-green-700 dark:enabled:hover:border-green-700 dark:enabled:active:border-green-700\n dark:text-green-400 dark:enabled:hover:text-green-400 dark:enabled:active:text-green-400\n}\n\n.p-button-outlined.p-button-info {\n @apply bg-transparent enabled:hover:bg-sky-50 enabled:active:bg-sky-100\n border-sky-200 enabled:hover:border-sky-200 enabled:active:border-sky-200\n text-sky-500 enabled:hover:text-sky-500 enabled:active:text-sky-500\n dark:bg-transparent dark:enabled:hover:bg-sky-400/5 dark:enabled:active:bg-sky-400/15\n dark:border-sky-700 dark:enabled:hover:border-sky-700 dark:enabled:active:border-sky-700\n dark:text-sky-400 dark:enabled:hover:text-sky-400 dark:enabled:active:text-sky-400\n}\n\n.p-button-outlined.p-button-warn {\n @apply bg-transparent enabled:hover:bg-orange-50 enabled:active:bg-orange-100\n border-orange-200 enabled:hover:border-orange-200 enabled:active:border-orange-200\n text-orange-500 enabled:hover:text-orange-500 enabled:active:text-orange-500\n dark:bg-transparent dark:enabled:hover:bg-orange-400/5 dark:enabled:active:bg-orange-400/15\n dark:border-orange-700 dark:enabled:hover:border-orange-700 dark:enabled:active:border-orange-700\n dark:text-orange-400 dark:enabled:hover:text-orange-400 dark:enabled:active:text-orange-400\n}\n\n.p-button-outlined.p-button-help {\n @apply bg-transparent enabled:hover:bg-purple-50 enabled:active:bg-purple-100\n border-purple-200 enabled:hover:border-purple-200 enabled:active:border-purple-200\n text-purple-500 enabled:hover:text-purple-500 enabled:active:text-purple-500\n dark:bg-transparent dark:enabled:hover:bg-purple-400/5 dark:enabled:active:bg-purple-400/15\n dark:border-purple-700 dark:enabled:hover:border-purple-700 dark:enabled:active:border-purple-700\n dark:text-purple-400 dark:enabled:hover:text-purple-400 dark:enabled:active:text-purple-400\n}\n\n.p-button-outlined.p-button-danger {\n @apply bg-transparent enabled:hover:bg-red-50 enabled:active:bg-red-100\n border-red-200 enabled:hover:border-red-200 enabled:active:border-red-200\n text-red-500 enabled:hover:text-red-500 enabled:active:text-red-500\n dark:bg-transparent dark:enabled:hover:bg-red-400/5 dark:enabled:active:bg-red-400/15\n dark:border-red-700 dark:enabled:hover:border-red-700 dark:enabled:active:border-red-700\n dark:text-red-400 dark:enabled:hover:text-red-400 dark:enabled:active:text-red-400\n}\n\n.p-button-outlined.p-button-contrast {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-surface-700 enabled:hover:border-surface-700 enabled:active:border-surface-700\n text-surface-950 enabled:hover:text-surface-950 enabled:active:text-surface-950\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-surface-500 dark:enabled:hover:border-surface-500 dark:enabled:active:border-surface-500\n dark:text-surface-0 dark:enabled:hover:text-surface-0 dark:enabled:active:text-surface-0\n}\n\n.p-button-outlined.p-button-plain {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-surface-200 enabled:hover:border-surface-200 enabled:active:border-surface-200\n text-surface-700 enabled:hover:text-surface-700 enabled:active:text-surface-700\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-surface-600 dark:enabled:hover:border-surface-600 dark:enabled:active:border-surface-600\n dark:text-surface-0 dark:enabled:hover:text-surface-0 dark:enabled:active:text-surface-0\n}\n\n.p-button-text {\n @apply bg-transparent enabled:hover:bg-primary-50 enabled:active:bg-primary-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-primary enabled:hover:text-primary enabled:active:text-primary\n dark:bg-transparent dark:enabled:hover:bg-primary/5 dark:enabled:active:bg-primary/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-primary dark:enabled:hover:text-primary dark:enabled:active:text-primary\n}\n\n.p-button-text.p-button-secondary {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-surface-500 enabled:hover:text-surface-500 enabled:active:text-surface-500\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-surface-400 dark:enabled:hover:text-surface-400 dark:enabled:active:text-surface-400\n}\n\n.p-button-text.p-button-success {\n @apply bg-transparent enabled:hover:bg-green-50 enabled:active:bg-green-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-green-500 enabled:hover:text-green-500 enabled:active:text-green-500\n dark:bg-transparent dark:enabled:hover:bg-green-400/5 dark:enabled:active:bg-green-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-green-400 dark:enabled:hover:text-green-400 dark:enabled:active:text-green-400\n}\n\n.p-button-text.p-button-info {\n @apply bg-transparent enabled:hover:bg-sky-50 enabled:active:bg-sky-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-sky-500 enabled:hover:text-sky-500 enabled:active:text-sky-500\n dark:bg-transparent dark:enabled:hover:bg-sky-400/5 dark:enabled:active:bg-sky-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-sky-400 dark:enabled:hover:text-sky-400 dark:enabled:active:text-sky-400\n}\n\n.p-button-text.p-button-warn {\n @apply bg-transparent enabled:hover:bg-orange-50 enabled:active:bg-orange-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-orange-500 enabled:hover:text-orange-500 enabled:active:text-orange-500\n dark:bg-transparent dark:enabled:hover:bg-orange-400/5 dark:enabled:active:bg-orange-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-orange-400 dark:enabled:hover:text-orange-400 dark:enabled:active:text-orange-400\n}\n\n.p-button-text.p-button-help {\n @apply bg-transparent enabled:hover:bg-purple-50 enabled:active:bg-purple-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-purple-500 enabled:hover:text-purple-500 enabled:active:text-purple-500\n dark:bg-transparent dark:enabled:hover:bg-purple-400/5 dark:enabled:active:bg-purple-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-purple-400 dark:enabled:hover:text-purple-400 dark:enabled:active:text-purple-400\n}\n\n.p-button-text.p-button-danger {\n @apply bg-transparent enabled:hover:bg-red-50 enabled:active:bg-red-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-red-500 enabled:hover:text-red-500 enabled:active:text-red-500\n dark:bg-transparent dark:enabled:hover:bg-red-400/5 dark:enabled:active:bg-red-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-red-400 dark:enabled:hover:text-red-400 dark:enabled:active:text-red-400\n}\n\n.p-button-text.p-button-plain {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-surface-700 enabled:hover:text-surface-700 enabled:active:text-surface-700\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-surface-0 dark:enabled:hover:text-surface-0 dark:enabled:active:text-surface-0\n}\n\n.p-button-link {\n @apply bg-transparent enabled:hover:bg-transparent enabled:active:bg-transparent\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-primary enabled:hover:text-primary enabled:active:text-primary\n}\n\n.p-button-link:not(:disabled):hover .p-button-label {\n @apply underline\n}", + "button": "@import './badge';\n\n.p-button {\n @apply inline-flex cursor-pointer select-none items-center justify-center overflow-hidden relative \n bg-primary enabled:hover:bg-primary-emphasis enabled:active:bg-primary-emphasis-alt text-primary-contrast\n border border-primary enabled:hover:border-primary-emphasis enabled:active:border-primary-emphasis-alt\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n px-3 py-2 transition-colors duration-200 gap-2 rounded-md\n disabled:cursor-default\n}\n\n.p-button-icon-right {\n @apply order-1\n}\n\n.p-button-icon-bottom {\n @apply order-2\n}\n\n.p-button-icon-only {\n @apply w-10 px-0 gap-0\n}\n\n.p-button-icon-only.p-button-rounded {\n @apply rounded-full h-10\n}\n\n.p-button-icon-only .p-button-label {\n @apply invisible w-0\n}\n\n.p-button-sm {\n @apply text-sm px-[0.625rem] py-[0.375rem]\n}\n\n.p-button-sm .p-button-icon {\n @apply text-sm\n}\n\n.p-button-lg {\n @apply text-[1.125rem] px-[0.875rem] py-[0.625rem]\n}\n\n.p-button-lg .p-button-icon {\n @apply text-[1.125rem]\n}\n\n.p-button-vertical {\n @apply flex-col\n}\n\n.p-button-label {\n @apply font-medium\n}\n\n.p-button-fluid {\n @apply w-full\n}\n\n.p-button-fluid.p-button-icon-only { \n @apply w-10\n}\n\n.p-button .p-badge {\n @apply min-w-4 h-4 leading-4\n}\n\n.p-button-raised {\n @apply shadow-[0_3px_1px_-2px_rgba(0,0,0,0.2),0_2px_2px_0_rgba(0,0,0,0.14),0_1px_5px_0_rgba(0,0,0,0.12)]\n}\n\n.p-button-rounded {\n @apply rounded-[2rem]\n}\n\n.p-button-secondary {\n @apply bg-surface-100 enabled:hover:bg-surface-200 enabled:active:bg-surface-300\n border-surface-100 enabled:hover:border-surface-200 enabled:active:border-surface-300\n text-surface-600 enabled:hover:text-surface-700 enabled:active:text-surface-800\n dark:bg-surface-800 dark:enabled:hover:bg-surface-700 dark:enabled:active:bg-surface-600\n dark:border-surface-800 dark:enabled:hover:border-surface-700 dark:enabled:active:border-surface-600\n dark:text-surface-300 dark:enabled:hover:text-surface-200 dark:enabled:active:text-surface-100\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-surface-600 dark:focus-visible:outline-surface-300\n}\n\n.p-button-success {\n @apply bg-green-500 enabled:hover:bg-green-600 enabled:active:bg-green-700\n border-green-500 enabled:hover:border-green-600 enabled:active:border-green-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-green-400 dark:enabled:hover:bg-green-300 dark:enabled:active:bg-green-200\n dark:border-green-400 dark:enabled:hover:border-green-300 dark:enabled:active:border-green-200\n dark:text-green-950 dark:enabled:hover:text-green-950 dark:enabled:active:text-green-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-green-500 dark:focus-visible:outline-green-400\n}\n\n.p-button-info {\n @apply bg-sky-500 enabled:hover:bg-sky-600 enabled:active:bg-sky-700\n border-sky-500 enabled:hover:border-sky-600 enabled:active:border-sky-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-sky-400 dark:enabled:hover:bg-sky-300 dark:enabled:active:bg-sky-200\n dark:border-sky-400 dark:enabled:hover:border-sky-300 dark:enabled:active:border-sky-200\n dark:text-sky-950 dark:enabled:hover:text-sky-950 dark:enabled:active:text-sky-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-sky-500 dark:focus-visible:outline-sky-400\n}\n\n.p-button-warn {\n @apply bg-orange-500 enabled:hover:bg-orange-600 enabled:active:bg-orange-700\n border-orange-500 enabled:hover:border-orange-600 enabled:active:border-orange-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-orange-400 dark:enabled:hover:bg-orange-300 dark:enabled:active:bg-orange-200\n dark:border-orange-400 dark:enabled:hover:border-orange-300 dark:enabled:active:border-orange-200\n dark:text-orange-950 dark:enabled:hover:text-orange-950 dark:enabled:active:text-orange-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-orange-500 dark:focus-visible:outline-orange-400\n}\n\n.p-button-help {\n @apply bg-purple-500 enabled:hover:bg-purple-600 enabled:active:bg-purple-700\n border-purple-500 enabled:hover:border-purple-600 enabled:active:border-purple-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-purple-400 dark:enabled:hover:bg-purple-300 dark:enabled:active:bg-purple-200\n dark:border-purple-400 dark:enabled:hover:border-purple-300 dark:enabled:active:border-purple-200\n dark:text-purple-950 dark:enabled:hover:text-purple-950 dark:enabled:active:text-purple-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-purple-500 dark:focus-visible:outline-purple-400\n}\n\n.p-button-help {\n @apply bg-purple-500 enabled:hover:bg-purple-600 enabled:active:bg-purple-700\n border-purple-500 enabled:hover:border-purple-600 enabled:active:border-purple-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-purple-400 dark:enabled:hover:bg-purple-300 dark:enabled:active:bg-purple-200\n dark:border-purple-400 dark:enabled:hover:border-purple-300 dark:enabled:active:border-purple-200\n dark:text-purple-950 dark:enabled:hover:text-purple-950 dark:enabled:active:text-purple-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-purple-500 dark:focus-visible:outline-purple-400\n}\n\n.p-button-danger {\n @apply bg-red-500 enabled:hover:bg-red-600 enabled:active:bg-red-700\n border-red-500 enabled:hover:border-red-600 enabled:active:border-red-700\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-red-400 dark:enabled:hover:bg-red-300 dark:enabled:active:bg-red-200\n dark:border-red-400 dark:enabled:hover:border-red-300 dark:enabled:active:border-red-200\n dark:text-red-950 dark:enabled:hover:text-red-950 dark:enabled:active:text-red-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-red-500 dark:focus-visible:outline-red-400\n}\n\n.p-button-contrast {\n @apply bg-surface-950 enabled:hover:bg-surface-900 enabled:active:bg-surface-800\n border-surface-950 enabled:hover:border-surface-900 enabled:active:border-surface-800\n text-white enabled:hover:text-white enabled:active:text-white\n dark:bg-surface-0 dark:enabled:hover:bg-surface-100 dark:enabled:active:bg-surface-200\n dark:border-surface-100 dark:enabled:hover:border-surface-200 dark:enabled:active:border-surface-300\n dark:text-surface-950 dark:enabled:hover:text-surface-950 dark:enabled:active:text-surface-950\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 \n focus-visible:outline-surface-950 dark:focus-visible:outline-surface-0\n}\n\n.p-button-outlined {\n @apply bg-transparent enabled:hover:bg-primary-50 enabled:active:bg-primary-100\n border-primary-200 enabled:hover:border-primary-200 enabled:active:border-primary-200\n text-primary enabled:hover:text-primary enabled:active:text-primary\n dark:bg-transparent dark:enabled:hover:bg-primary/5 dark:enabled:active:bg-primary/15\n dark:border-primary-700 dark:enabled:hover:border-primary-700 dark:enabled:active:border-primary-700\n dark:text-primary dark:enabled:hover:text-primary dark:enabled:active:text-primary\n}\n\n.p-button-outlined.p-button-secondary {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-surface-200 enabled:hover:border-surface-200 enabled:active:border-surface-200\n text-surface-500 enabled:hover:text-surface-500 enabled:active:text-surface-500\n dark:bg-transparent dark:enabled:hover:bg-white/5 dark:enabled:active:bg-white/15\n dark:border-surface-700 dark:enabled:hover:border-surface-700 dark:enabled:active:border-surface-700\n dark:text-surface-400 dark:enabled:hover:text-surface-400 dark:enabled:active:text-surface-400\n}\n\n.p-button-outlined.p-button-success {\n @apply bg-transparent enabled:hover:bg-green-50 enabled:active:bg-green-100\n border-green-200 enabled:hover:border-green-200 enabled:active:border-green-200\n text-green-500 enabled:hover:text-green-500 enabled:active:text-green-500\n dark:bg-transparent dark:enabled:hover:bg-green-400/5 dark:enabled:active:bg-green-400/15\n dark:border-green-700 dark:enabled:hover:border-green-700 dark:enabled:active:border-green-700\n dark:text-green-400 dark:enabled:hover:text-green-400 dark:enabled:active:text-green-400\n}\n\n.p-button-outlined.p-button-info {\n @apply bg-transparent enabled:hover:bg-sky-50 enabled:active:bg-sky-100\n border-sky-200 enabled:hover:border-sky-200 enabled:active:border-sky-200\n text-sky-500 enabled:hover:text-sky-500 enabled:active:text-sky-500\n dark:bg-transparent dark:enabled:hover:bg-sky-400/5 dark:enabled:active:bg-sky-400/15\n dark:border-sky-700 dark:enabled:hover:border-sky-700 dark:enabled:active:border-sky-700\n dark:text-sky-400 dark:enabled:hover:text-sky-400 dark:enabled:active:text-sky-400\n}\n\n.p-button-outlined.p-button-warn {\n @apply bg-transparent enabled:hover:bg-orange-50 enabled:active:bg-orange-100\n border-orange-200 enabled:hover:border-orange-200 enabled:active:border-orange-200\n text-orange-500 enabled:hover:text-orange-500 enabled:active:text-orange-500\n dark:bg-transparent dark:enabled:hover:bg-orange-400/5 dark:enabled:active:bg-orange-400/15\n dark:border-orange-700 dark:enabled:hover:border-orange-700 dark:enabled:active:border-orange-700\n dark:text-orange-400 dark:enabled:hover:text-orange-400 dark:enabled:active:text-orange-400\n}\n\n.p-button-outlined.p-button-help {\n @apply bg-transparent enabled:hover:bg-purple-50 enabled:active:bg-purple-100\n border-purple-200 enabled:hover:border-purple-200 enabled:active:border-purple-200\n text-purple-500 enabled:hover:text-purple-500 enabled:active:text-purple-500\n dark:bg-transparent dark:enabled:hover:bg-purple-400/5 dark:enabled:active:bg-purple-400/15\n dark:border-purple-700 dark:enabled:hover:border-purple-700 dark:enabled:active:border-purple-700\n dark:text-purple-400 dark:enabled:hover:text-purple-400 dark:enabled:active:text-purple-400\n}\n\n.p-button-outlined.p-button-danger {\n @apply bg-transparent enabled:hover:bg-red-50 enabled:active:bg-red-100\n border-red-200 enabled:hover:border-red-200 enabled:active:border-red-200\n text-red-500 enabled:hover:text-red-500 enabled:active:text-red-500\n dark:bg-transparent dark:enabled:hover:bg-red-400/5 dark:enabled:active:bg-red-400/15\n dark:border-red-700 dark:enabled:hover:border-red-700 dark:enabled:active:border-red-700\n dark:text-red-400 dark:enabled:hover:text-red-400 dark:enabled:active:text-red-400\n}\n\n.p-button-outlined.p-button-contrast {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-surface-700 enabled:hover:border-surface-700 enabled:active:border-surface-700\n text-surface-950 enabled:hover:text-surface-950 enabled:active:text-surface-950\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-surface-500 dark:enabled:hover:border-surface-500 dark:enabled:active:border-surface-500\n dark:text-surface-0 dark:enabled:hover:text-surface-0 dark:enabled:active:text-surface-0\n}\n\n.p-button-outlined.p-button-plain {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-surface-200 enabled:hover:border-surface-200 enabled:active:border-surface-200\n text-surface-700 enabled:hover:text-surface-700 enabled:active:text-surface-700\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-surface-600 dark:enabled:hover:border-surface-600 dark:enabled:active:border-surface-600\n dark:text-surface-0 dark:enabled:hover:text-surface-0 dark:enabled:active:text-surface-0\n}\n\n.p-button-text {\n @apply bg-transparent enabled:hover:bg-primary-50 enabled:active:bg-primary-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-primary enabled:hover:text-primary enabled:active:text-primary\n dark:bg-transparent dark:enabled:hover:bg-primary/5 dark:enabled:active:bg-primary/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-primary dark:enabled:hover:text-primary dark:enabled:active:text-primary\n}\n\n.p-button-text.p-button-secondary {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-surface-500 enabled:hover:text-surface-500 enabled:active:text-surface-500\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-surface-400 dark:enabled:hover:text-surface-400 dark:enabled:active:text-surface-400\n}\n\n.p-button-text.p-button-success {\n @apply bg-transparent enabled:hover:bg-green-50 enabled:active:bg-green-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-green-500 enabled:hover:text-green-500 enabled:active:text-green-500\n dark:bg-transparent dark:enabled:hover:bg-green-400/5 dark:enabled:active:bg-green-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-green-400 dark:enabled:hover:text-green-400 dark:enabled:active:text-green-400\n}\n\n.p-button-text.p-button-info {\n @apply bg-transparent enabled:hover:bg-sky-50 enabled:active:bg-sky-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-sky-500 enabled:hover:text-sky-500 enabled:active:text-sky-500\n dark:bg-transparent dark:enabled:hover:bg-sky-400/5 dark:enabled:active:bg-sky-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-sky-400 dark:enabled:hover:text-sky-400 dark:enabled:active:text-sky-400\n}\n\n.p-button-text.p-button-warn {\n @apply bg-transparent enabled:hover:bg-orange-50 enabled:active:bg-orange-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-orange-500 enabled:hover:text-orange-500 enabled:active:text-orange-500\n dark:bg-transparent dark:enabled:hover:bg-orange-400/5 dark:enabled:active:bg-orange-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-orange-400 dark:enabled:hover:text-orange-400 dark:enabled:active:text-orange-400\n}\n\n.p-button-text.p-button-help {\n @apply bg-transparent enabled:hover:bg-purple-50 enabled:active:bg-purple-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-purple-500 enabled:hover:text-purple-500 enabled:active:text-purple-500\n dark:bg-transparent dark:enabled:hover:bg-purple-400/5 dark:enabled:active:bg-purple-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-purple-400 dark:enabled:hover:text-purple-400 dark:enabled:active:text-purple-400\n}\n\n.p-button-text.p-button-danger {\n @apply bg-transparent enabled:hover:bg-red-50 enabled:active:bg-red-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-red-500 enabled:hover:text-red-500 enabled:active:text-red-500\n dark:bg-transparent dark:enabled:hover:bg-red-400/5 dark:enabled:active:bg-red-400/15\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-red-400 dark:enabled:hover:text-red-400 dark:enabled:active:text-red-400\n}\n\n.p-button-text.p-button-plain {\n @apply bg-transparent enabled:hover:bg-surface-50 enabled:active:bg-surface-100\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-surface-700 enabled:hover:text-surface-700 enabled:active:text-surface-700\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-transparent dark:enabled:hover:border-transparent dark:enabled:active:border-transparent\n dark:text-surface-0 dark:enabled:hover:text-surface-0 dark:enabled:active:text-surface-0\n}\n\n.p-button-link {\n @apply bg-transparent enabled:hover:bg-transparent enabled:active:bg-transparent\n border-transparent enabled:hover:border-transparent enabled:active:border-transparent\n text-primary enabled:hover:text-primary enabled:active:text-primary\n}\n\n.p-button-link:not(:disabled):hover .p-button-label {\n @apply underline\n}", "buttongroup": ".p-buttongroup .p-button {\n @apply m-0 focus-visible:relative focus-visible:z-10\n}\n\n.p-buttongroup .p-button:not(:last-child) {\n @apply border-r-0\n}\n\n.p-buttongroup .p-button:not(:first-of-type):not(:last-of-type) {\n @apply rounded-none\n}\n\n.p-buttongroup .p-button:first-of-type:not(:only-of-type) {\n @apply rounded-r-none\n}\n\n.p-buttongroup .p-button:last-of-type:not(:only-of-type) {\n @apply rounded-l-none\n}", "card": ".p-card {\n @apply flex flex-col rounded-xl\n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_1px_3px_0_rgba(0,0,0,0.1),0_1px_2px_-1px_rgba(0,0,0,0.1)]\n}\n\n.p-card-caption {\n @apply flex flex-col gap-2\n}\n\n.p-card-body {\n @apply p-5 flex flex-col gap-2\n}\n\n.p-card-title {\n @apply font-medium text-xl\n}\n\n.p-card-subtitle {\n @apply text-surface-500 dark:text-surface-400\n}", - "carousel": ".p-carousel {\n @apply flex flex-col\n}\n\n.p-carousel-content-container {\n @apply flex flex-col overflow-auto\n}\n\n.p-carousel-content {\n @apply flex flex-row gap-1\n}\n\n.p-carousel-viewport {\n @apply overflow-hidden w-full\n}\n\n.p-carousel-item-list {\n @apply flex flex-row\n}\n\n.p-carousel-prev-button,\n.p-carousel-next-button {\n @apply self-center flex-shrink-0\n}\n\n.p-carousel-indicator-list {\n @apply flex flex-row justify-center flex-wrap p-4 gap-2 m-0 list-none\n}\n\n.p-carousel-indicator-button {\n @apply flex items-center justify-center w-8 h-2 border-none rounded-md p-0 m-0 select-none cursor-pointer transition-colors duration-200\n bg-surface-200 hover:bg-surface-300 dark:bg-surface-700 dark:hover:bg-surface-600\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-carousel-indicator-active .p-carousel-indicator-button {\n @apply bg-primary\n}\n\n.p-carousel-vertical .p-carousel-content {\n @apply flex-col\n}\n\n.p-carousel-vertical .p-carousel-item-list {\n @apply flex-col h-full\n}\n\n.p-items-hidden .p-carousel-item {\n @apply invisible\n}\n\n.p-items-hidden .p-carousel-item.p-carousel-item-active {\n @apply visible\n}", - "cascadeselect": ".p-cascadeselect {\n @apply inline-flex cursor-pointer relative select-none rounded-md\n bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-cascadeselect:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600 \n}\n\n.p-cascadeselect:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-cascadeselect.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-cascadeselect.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-cascadeselect.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-cascadeselect-dropdown {\n @apply flex items-center justify-center shrink-0 bg-transparent\n text-surface-500 dark:text-surface-400 w-10 rounded-r-md\n}\n\n.p-cascadeselect-label {\n @apply block whitespace-nowrap overflow-hidden flex-auto w-[1%]\n py-2 px-3 overflow-ellipsis\n text-surface-700 dark:text-surface-0 bg-transparent border-none outline-none\n}\n\n.p-cascadeselect-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-cascadeselect-clearable .p-cascadeselect-label {\n @apply pr-7\n}\n\n.p-cascadeselect.p-disabled .p-cascadeselect-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-cascadeselect-label-empty {\n @apply overflow-hidden opacity-0 \n}\n\n.p-cascadeselect-fluid {\n @apply flex\n}\n\n.p-cascadeselect-fluid .p-cascadeselect-label {\n @apply w-[1%]\n}\n\n.p-cascadeselect-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-cascadeselect .p-cascadeselect-overlay {\n @apply min-w-full\n}\n\n.p-cascadeselect-option-list {\n @apply hidden min-w-full absolute z-10\n}\n\n.p-cascadeselect-list {\n @apply min-w-full m-0 p-0 list-none p-1 flex flex-col gap-[2px]\n}\n\n.p-cascadeselect-option {\n @apply cursor-pointer font-normal whitespace-nowrap \n text-surface-700 dark:text-surface-0 bg-transparent border-none\n transition-colors duration-200 rounded-sm\n}\n\n.p-cascadeselect-option-active {\n @apply overflow-visible\n}\n\n.p-cascadeselect-option-active > .p-cascadeselect-option-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-cascadeselect-option:not(.p-cascadeselect-option-selected):not(.p-disabled).p-focus > .p-cascadeselect-option-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-cascadeselect-option:not(.p-cascadeselect-option-selected):not(.p-disabled).p-focus .p-cascadeselect-group-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-cascadeselect-option-selected .p-cascadeselect-option-content {\n @apply bg-highlight\n}\n\n.p-cascadeselect-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-cascadeselect-option-active > .p-cascadeselect-option-list {\n @apply block left-full top-0\n}\n\n.p-cascadeselect-option-content {\n @apply flex items-center justify-between overflow-hidden relative px-3 py-2\n}\n\n.p-cascadeselect-group-icon {\n @apply text-sm w-[0.875rem] h-[0.875rem] text-surface-400 dark:text-surface-500\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-option-content {\n @apply rounded-sm\n}\n\n.p-cascadeselect-mobile-active-active .p-cascadeselect-list {\n @apply flex flex-col top-full left-0 z-10\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-list > .p-cascadeselect-option > .p-cascadeselect-option-content .p-cascadeselect-group-icon {\n @apply ml-auto transition-transform duration-200\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-list .p-cascadeselect-group-icon {\n @apply transition-transform duration-200 rotate-90\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-option-active > .p-cascadeselect-option-content .p-cascadeselect-group-icon {\n @apply -rotate-90\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-option-list {\n @apply static shadow-none border-none pl-4\n}", - "checkbox": ".p-checkbox {\n @apply relative inline-flex select-none w-5 h-5\n}\n\n.p-checkbox-input {\n @apply cursor-pointer disabled:cursor-default appearance-none absolute left-0 top-0 w-full h-full m-0 p-0 opacity-0 z-10\n border border-transparent rounded-sm\n}\n\n.p-checkbox-box {\n @apply flex justify-center items-center rounded-sm\n border border-surface-300 dark:border-surface-700\n bg-surface-0 dark:bg-surface-950\n w-5 h-5\n transition-colors duration-200\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n}\n\n.p-checkbox-icon {\n @apply text-surface-700 dark:text-surface-0\n text-sm w-[0.875rem] h-[0.875rem]\n transition-colors duration-200\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-checkbox-checked .p-checkbox-box {\n @apply border-primary bg-primary\n}\n\n.p-checkbox-checked .p-checkbox-icon {\n @apply text-primary-contrast\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n @apply bg-primary-emphasis border-primary-emphasis\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-icon {\n @apply text-primary-contrast\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible) .p-checkbox-box {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-checkbox.p-invalid > .p-checkbox-box {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-checkbox.p-variant-filled .p-checkbox-box {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-checkbox.p-disabled {\n @apply opacity-100\n}\n\n.p-checkbox.p-disabled .p-checkbox-box {\n @apply bg-surface-200 dark:bg-surface-400\n border-surface-300 dark:border-surface-700\n}\n\n.p-checkbox.p-disabled .p-checkbox-box .p-checkbox-icon {\n @apply text-surface-700 dark:text-surface-400\n}", + "carousel": "@import './button';\n\n.p-carousel {\n @apply flex flex-col\n}\n\n.p-carousel-content-container {\n @apply flex flex-col overflow-auto\n}\n\n.p-carousel-content {\n @apply flex flex-row gap-1\n}\n\n.p-carousel-viewport {\n @apply overflow-hidden w-full\n}\n\n.p-carousel-item-list {\n @apply flex flex-row\n}\n\n.p-carousel-prev-button,\n.p-carousel-next-button {\n @apply self-center flex-shrink-0\n}\n\n.p-carousel-indicator-list {\n @apply flex flex-row justify-center flex-wrap p-4 gap-2 m-0 list-none\n}\n\n.p-carousel-indicator-button {\n @apply flex items-center justify-center w-8 h-2 border-none rounded-md p-0 m-0 select-none cursor-pointer transition-colors duration-200\n bg-surface-200 hover:bg-surface-300 dark:bg-surface-700 dark:hover:bg-surface-600\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-carousel-indicator-active .p-carousel-indicator-button {\n @apply bg-primary\n}\n\n.p-carousel-vertical .p-carousel-content {\n @apply flex-col\n}\n\n.p-carousel-vertical .p-carousel-item-list {\n @apply flex-col h-full\n}\n\n.p-items-hidden .p-carousel-item {\n @apply invisible\n}\n\n.p-items-hidden .p-carousel-item.p-carousel-item-active {\n @apply visible\n}", + "cascadeselect": ".p-cascadeselect {\n @apply inline-flex cursor-pointer relative select-none rounded-md\n bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-cascadeselect:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-cascadeselect:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-cascadeselect.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-cascadeselect.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-cascadeselect.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-cascadeselect-dropdown {\n @apply flex items-center justify-center shrink-0 bg-transparent\n text-surface-500 dark:text-surface-400 w-10 rounded-e-md\n}\n\n.p-cascadeselect-label {\n @apply block whitespace-nowrap overflow-hidden flex-auto w-[1%]\n py-2 px-3 overflow-ellipsis\n text-surface-700 dark:text-surface-0 bg-transparent border-none outline-none\n}\n\n.p-cascadeselect-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-cascadeselect-clearable .p-cascadeselect-label {\n @apply pe-7\n}\n\n.p-cascadeselect.p-disabled .p-cascadeselect-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-cascadeselect-label-empty {\n @apply overflow-hidden opacity-0\n}\n\n.p-cascadeselect-fluid {\n @apply flex\n}\n\n.p-cascadeselect-fluid .p-cascadeselect-label {\n @apply w-[1%]\n}\n\n.p-cascadeselect-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-cascadeselect .p-cascadeselect-overlay {\n @apply min-w-full\n}\n\n.p-cascadeselect-option-list {\n @apply hidden min-w-full absolute z-10\n}\n\n.p-cascadeselect-list {\n @apply min-w-full m-0 list-none p-1 flex flex-col gap-[2px]\n}\n\n.p-cascadeselect-option {\n @apply cursor-pointer font-normal whitespace-nowrap\n text-surface-700 dark:text-surface-0 bg-transparent border-none\n transition-colors duration-200 rounded-sm\n}\n\n.p-cascadeselect-option-active {\n @apply overflow-visible\n}\n\n.p-cascadeselect-option-active > .p-cascadeselect-option-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-cascadeselect-option:not(.p-cascadeselect-option-selected):not(.p-disabled).p-focus > .p-cascadeselect-option-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-cascadeselect-option:not(.p-cascadeselect-option-selected):not(.p-disabled).p-focus .p-cascadeselect-group-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-cascadeselect-option-selected .p-cascadeselect-option-content {\n @apply bg-highlight\n}\n\n.p-cascadeselect-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-cascadeselect-option-active > .p-cascadeselect-option-list {\n @apply block start-full top-0\n}\n\n.p-cascadeselect-option-content {\n @apply flex items-center justify-between overflow-hidden relative px-3 py-2\n}\n\n.p-cascadeselect-group-icon {\n @apply text-sm w-[0.875rem] h-[0.875rem] text-surface-400 dark:text-surface-500\n}\n\n.p-cascadeselect-group-icon:dir(rtl) {\n @apply rotate-180\n}\n\n\n.p-cascadeselect-mobile-active .p-cascadeselect-option-content {\n @apply rounded-sm\n}\n\n.p-cascadeselect-mobile-active-active .p-cascadeselect-list {\n @apply flex flex-col top-full start-0 z-10\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-list > .p-cascadeselect-option > .p-cascadeselect-option-content .p-cascadeselect-group-icon {\n @apply ms-auto transition-transform duration-200\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-list .p-cascadeselect-group-icon {\n @apply transition-transform duration-200 rotate-90\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-option-active > .p-cascadeselect-option-content .p-cascadeselect-group-icon {\n @apply -rotate-90\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-option-list {\n @apply static shadow-none border-none ps-4\n}\n", + "checkbox": ".p-checkbox {\n @apply relative inline-flex select-none w-5 h-5 align-bottom\n}\n\n.p-checkbox-input {\n @apply cursor-pointer disabled:cursor-default appearance-none absolute start-0 top-0 w-full h-full m-0 p-0 opacity-0 z-10\n border border-transparent rounded-sm\n}\n\n.p-checkbox-box {\n @apply flex justify-center items-center rounded-sm w-5 h-5\n border border-surface-300 dark:border-surface-700\n bg-surface-0 dark:bg-surface-950\n transition-colors duration-200\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n}\n\n.p-checkbox-icon {\n @apply text-surface-700 dark:text-surface-0\n text-sm w-[0.875rem] h-[0.875rem]\n transition-colors duration-200\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-checkbox-checked .p-checkbox-box {\n @apply border-primary bg-primary\n}\n\n.p-checkbox-checked .p-checkbox-icon {\n @apply text-primary-contrast\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n @apply bg-primary-emphasis border-primary-emphasis\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-icon {\n @apply text-primary-contrast\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible) .p-checkbox-box {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-checkbox.p-invalid > .p-checkbox-box {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-checkbox.p-variant-filled .p-checkbox-box {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-checkbox.p-disabled {\n @apply opacity-100\n}\n\n.p-checkbox.p-disabled .p-checkbox-box {\n @apply bg-surface-200 dark:bg-surface-400 border-surface-300 dark:border-surface-700\n}\n\n.p-checkbox.p-disabled .p-checkbox-box .p-checkbox-icon {\n @apply text-surface-700 dark:text-surface-400\n}\n", "chip": ".p-chip {\n @apply inline-flex items-center rounded-2xl gap-2 px-3 py-2\n bg-surface-100 dark:bg-surface-800\n text-surface-800 dark:text-surface-0\n}\n\n.p-chip-icon {\n @apply text-surface-800 dark:bg-surface-0 text-base w-4 h-4\n}\n\n.p-chip-image {\n @apply rounded-full w-8 h-8 -ml-2\n}\n\n.p-chip:has(.p-chip-remove-icon) {\n @apply pr-2\n}\n\n.p-chip:has(.p-chip-image) {\n @apply pt-1 pb-1\n}\n\n.p-chip-remove-icon {\n @apply cursor-pointer text-base w-4 h-4 rounded-full\n text-surface-800 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}", - "colorpicker": ".p-colorpicker {\n @apply inline-block relative;\n}\n\n.p-colorpicker-dragging {\n @apply cursor-pointer\n}\n\n.p-colorpicker-preview {\n @apply w-6 h-6 p-0 border-none rounded-md transition-colors duration-200 cursor-pointer disabled:cursor-auto\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-colorpicker-panel {\n @apply bg-surface-800 dark:bg-surface-900\n border border-surface-900 dark:border-surface-700\n rounded-md shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n w-[193px] h-[166px] absolute top-0 left-0\n}\n\n.p-colorpicker-panel-inline {\n @apply static shadow-none \n}\n\n.p-colorpicker-content {\n @apply relative;\n}\n\n.p-colorpicker-color-selector {\n @apply w-[150px] h-[150px] top-[8px] left-[8px] absolute\n}\n\n.p-colorpicker-color-background {\n @apply w-full h-full bg-[linear-gradient(to_top,#000_0%,rgba(0,0,0,0)_100%),linear-gradient(to_right,#fff_0%,rgba(255,255,255,0)_100%)];\n}\n\n.p-colorpicker-color-handle {\n @apply absolute top-0 left-[150px] rounded-full w-[10px] h-[10px] border border-surface-0 -mt-[5px] mr-0 mb-0 -ml-[5px] cursor-pointer opacity-85\n}\n\n.p-colorpicker-hue {\n @apply w-[17px] h-[150px] top-[8px] left-[167px] absolute opacity-85 bg-[linear-gradient(0deg,red_0,#ff0_17%,#0f0_33%,#0ff_50%,#00f_67%,#f0f_83%,red)];\n}\n\n.p-colorpicker-hue-handle {\n @apply absolute top-[150px] left-0 w-[21px] -ml-[2px] -mt-[5px] h-[10px] border-2 opacity-85 border-surface-0 cursor-pointer\n}", - "confirmdialog": ".p-confirmdialog .p-dialog-content {\n @apply flex items-center gap-4\n}\n\n.p-confirmdialog-icon {\n @apply text-surface-700 dark:text-surface-0 text-[2rem] h-8 w-8\n}", - "confirmpopup": ".p-confirmpopup {\n @apply absolute mt-[10px] top-0 left-0 \n border border-surface-200 dark:border-surface-700 rounded-md\n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n before:bottom-full before:left-5 before:h-0 before:w-0 before:absolute before:pointer-events-none\n before:border-[10px] before:-ml-[10px] before:border-transparent before:border-b-surface-200 dark:before:border-b-surface-700\n after:bottom-full after:left-5 after:h-0 after:w-0 after:absolute after:pointer-events-none\n after:border-[8px] after:-ml-[8px] after:border-transparent after:border-b-surface-0 dark:after:border-b-surface-900\n}\n\n.p-confirmpopup-content {\n @apply flex items-center p-3 gap-4\n}\n\n.p-confirmpopup-icon {\n @apply text-2xl w-6 h-6 text-surface-700 dark:text-surface-0\n}\n\n.p-confirmpopup-footer {\n @apply flex justify-end gap-2 pt-0 px-3 pb-3\n}\n\n.p-confirmpopup-footer button {\n @apply w-auto\n}\n\n.p-confirmpopup-footer button:last-child {\n @apply m-0\n}\n\n.p-confirmpopup-flipped {\n @apply -mt-[10px] mb-[10px]\n}\n\n.p-confirmpopup-enter-from {\n @apply opacity-0 scale-y-75\n}\n\n.p-confirmpopup-leave-to {\n @apply opacity-0\n}\n\n.p-confirmpopup-enter-active {\n @apply [transition:transform_120ms_cubic-bezier(0,0,0.2,1),opacity_120ms_cubic-bezier(0,0,0.2,1)]\n}\n\n.p-confirmpopup-leave-active {\n @apply transition-opacity duration-100 ease-linear\n}\n\n.p-confirmpopup-flipped:after,\n.p-confirmpopup-flipped:before {\n @apply bottom-auto top-full\n}\n\n.p-confirmpopup-flipped:after {\n @apply border-b-transparent border-t-surface-0 dark:border-t-surface-900\n}\n\n.p-confirmpopup-flipped:before {\n @apply border-b-transparent border-t-surface-200 dark:border-t-surface-700\n}", + "colorpicker": ".p-colorpicker {\n @apply inline-block relative;\n}\n\n.p-colorpicker-dragging {\n @apply cursor-pointer\n}\n\n.p-colorpicker-preview {\n @apply w-6 h-6 p-0 border-none rounded-md transition-colors duration-200 cursor-pointer disabled:cursor-auto\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-colorpicker-panel {\n @apply bg-surface-800 dark:bg-surface-900\n border border-surface-900 dark:border-surface-700\n rounded-md shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n w-[193px] h-[166px] absolute top-0 start-0\n}\n\n.p-colorpicker-panel-inline {\n @apply static shadow-none\n}\n\n.p-colorpicker-content {\n @apply relative;\n}\n\n.p-colorpicker-color-selector {\n @apply w-[150px] h-[150px] top-[8px] start-[8px] absolute\n}\n\n.p-colorpicker-color-background {\n @apply w-full h-full bg-[linear-gradient(to_top,#000_0%,rgba(0,0,0,0)_100%),linear-gradient(to_right,#fff_0%,rgba(255,255,255,0)_100%)];\n}\n\n.p-colorpicker-color-handle {\n @apply absolute top-0 start-[150px] rounded-full w-[10px] h-[10px] border border-surface-0 -mt-[5px] me-0 mb-0 -ms-[5px] cursor-pointer opacity-85\n}\n\n.p-colorpicker-hue {\n @apply w-[17px] h-[150px] top-[8px] start-[167px] absolute opacity-85 bg-[linear-gradient(0deg,red_0,#ff0_17%,#0f0_33%,#0ff_50%,#00f_67%,#f0f_83%,red)];\n}\n\n.p-colorpicker-hue-handle {\n @apply absolute top-[150px] start-0 w-[21px] -ms-[2px] -mt-[5px] h-[10px] border-2 opacity-85 border-surface-0 cursor-pointer\n}\n", + "common": ".p-connected-overlay-enter-from {\n @apply opacity-0 scale-y-75\n}\n\n.p-connected-overlay-leave-to {\n @apply opacity-0 \n}\n\n.p-connected-overlay-enter-active {\n @apply transition-[opacity,transform] duration-150 ease-[cubic-bezier(0,0,0.2,1)]\n}\n\n.p-connected-overlay-leave-active {\n @apply transition-opacity duration-100 ease-linear\n}\n\n.p-toggleable-content-enter-from,\n.p-toggleable-content-leave-to {\n @apply max-h-0\n}\n\n.p-toggleable-content-enter-to,\n.p-toggleable-content-leave-from {\n @apply max-h-[1000px]\n}\n\n.p-toggleable-content-leave-active {\n @apply overflow-hidden transition-[max-height] animate-duration-[450ms] ease-[cubic-bezier(0,1,0,1)];\n}\n\n.p-toggleable-content-enter-active {\n @apply overflow-hidden transition-[max-height] duration-1000 ease-in-out\n}\n\n.p-disabled,\n.p-disabled * {\n @apply cursor-default pointer-events-none select-none\n}\n\n.p-disabled,\n.p-component:disabled {\n @apply opacity-60\n}\n\n.pi {\n @apply text-base\n}\n\n.p-icon {\n @apply w-4 h-4\n}\n\n.p-overlay-mask {\n @apply bg-black/50 text-surface-200 transition-colors duration-150 fixed top-0 left-0 w-full h-full\n}\n\n.p-overlay-mask-enter {\n animation: p-overlay-mask-enter-animation 150ms forwards;\n}\n\n.p-overlay-mask-leave {\n animation: p-overlay-mask-leave-animation 150ms forwards;\n}\n\n@keyframes p-overlay-mask-enter-animation {\n from {\n background: transparent;\n }\n to {\n background: rgba(0,0,0,0.5);\n }\n}\n\n@keyframes p-overlay-mask-leave-animation {\n from {\n background: rgba(0,0,0,0.5);\n }\n to {\n background: transparent;\n }\n}", + "confirmdialog": "@import './dialog';\n@import './button';\n\n.p-confirmdialog .p-dialog-content {\n @apply flex items-center gap-4\n}\n\n.p-confirmdialog-icon {\n @apply text-surface-700 dark:text-surface-0 text-[2rem] h-8 w-8\n}", + "confirmpopup": "@import './button';\n\n.p-confirmpopup {\n @apply absolute mt-[10px] top-0 left-0 \n border border-surface-200 dark:border-surface-700 rounded-md\n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n before:bottom-full before:left-5 before:h-0 before:w-0 before:absolute before:pointer-events-none\n before:border-[10px] before:-ml-[10px] before:border-transparent before:border-b-surface-200 dark:before:border-b-surface-700\n after:bottom-full after:left-5 after:h-0 after:w-0 after:absolute after:pointer-events-none\n after:border-[8px] after:-ml-[8px] after:border-transparent after:border-b-surface-0 dark:after:border-b-surface-900\n}\n\n.p-confirmpopup-content {\n @apply flex items-center p-3 gap-4\n}\n\n.p-confirmpopup-icon {\n @apply text-2xl w-6 h-6 text-surface-700 dark:text-surface-0\n}\n\n.p-confirmpopup-footer {\n @apply flex justify-end gap-2 pt-0 px-3 pb-3\n}\n\n.p-confirmpopup-footer button {\n @apply w-auto\n}\n\n.p-confirmpopup-footer button:last-child {\n @apply m-0\n}\n\n.p-confirmpopup-flipped {\n @apply -mt-[10px] mb-[10px]\n}\n\n.p-confirmpopup-enter-from {\n @apply opacity-0 scale-y-75\n}\n\n.p-confirmpopup-leave-to {\n @apply opacity-0\n}\n\n.p-confirmpopup-enter-active {\n @apply [transition:transform_120ms_cubic-bezier(0,0,0.2,1),opacity_120ms_cubic-bezier(0,0,0.2,1)]\n}\n\n.p-confirmpopup-leave-active {\n @apply transition-opacity duration-100 ease-linear\n}\n\n.p-confirmpopup-flipped:after,\n.p-confirmpopup-flipped:before {\n @apply bottom-auto top-full\n}\n\n.p-confirmpopup-flipped:after {\n @apply border-b-transparent border-t-surface-0 dark:border-t-surface-900\n}\n\n.p-confirmpopup-flipped:before {\n @apply border-b-transparent border-t-surface-200 dark:border-t-surface-700\n}", "contextmenu": ".p-contextmenu {\n @apply bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0 \n border border-surface-200 dark:border-surface-700\n rounded-md min-w-52 shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-contextmenu-root-list,\n.p-contextmenu-submenu {\n @apply m-0 p-1 list-none outline-none flex flex-col gap-[2px] \n}\n\n.p-contextmenu-submenu {\n @apply absolute min-w-full z-10 rounded-md\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0 \n border border-surface-200 dark:border-surface-700\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-contextmenu-item {\n @apply relative\n}\n\n.p-contextmenu-item-content {\n @apply transition-colors duration-200 rounded-sm text-surface-700 dark:text-surface-0\n}\n\n.p-contextmenu-item-link {\n @apply cursor-pointer flex items-center no-underline overflow-hidden relative text-inherit\n px-3 py-2 gap-2 select-none outline-none\n}\n\n.p-contextmenu-item-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-contextmenu-submenu-icon {\n @apply text-surface-400 dark:text-surface-500 ml-auto text-sm w-[0.875rem] h-[0.875rem]\n}\n\n.p-contextmenu-item.p-focus > .p-contextmenu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-contextmenu-item.p-focus > .p-contextmenu-item-content .p-contextmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-contextmenu-item.p-focus > .p-contextmenu-item-content .p-contextmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-contextmenu-item:not(.p-disabled) > .p-contextmenu-item-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-contextmenu-item:not(.p-disabled) > .p-contextmenu-item-content:hover .p-contextmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-contextmenu-item:not(.p-disabled) > .p-contextmenu-item-content:hover .p-contextmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-contextmenu-item-active > .p-contextmenu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-contextmenu-item-active > .p-contextmenu-item-content .p-contextmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-contextmenu-item-active > .p-contextmenu-item-content .p-contextmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-contextmenu-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-contextmenu-enter-from,\n.p-contextmenu-leave-active {\n @apply opacity-0\n}\n\n.p-contextmenu-enter-active {\n @apply transition-opacity duration-[250ms]\n}\n\n.p-contextmenu-mobile .p-contextmenu-submenu {\n @apply static shadow-none border-none ps-4 pe-0\n}\n\n.p-contextmenu-mobile .p-contextmenu-submenu-icon {\n @apply transition-transform duration-200 rotate-90\n}\n\n.p-contextmenu-mobile .p-contextmenu-item-active > .p-contextmenu-item-content .p-contextmenu-submenu-icon {\n @apply -rotate-90\n}", - "datatable": ".p-datatable {\n @apply relative\n}\n\n.p-datatable-table {\n @apply border-spacing-0 w-full\n}\n\n.p-datatable-scrollable > .p-datatable-table-container {\n @apply relative\n}\n\n.p-datatable-scrollable-table > .p-datatable-thead {\n @apply top-0 z-10\n}\n\n.p-datatable-scrollable-table > .p-datatable-frozen-tbody {\n @apply sticky z-10\n}\n\n.p-datatable-scrollable-table > .p-datatable-tfoot {\n @apply bottom-0 z-10\n}\n\n.p-datatable-scrollable .p-datatable-frozen-column {\n @apply sticky bg-surface-0 dark:bg-surface-900\n}\n\n.p-datatable-scrollable th.p-datatable-frozen-column {\n @apply z-10\n}\n\n.p-datatable-scrollable > .p-datatable-table-container > .p-datatable-table > .p-datatable-thead,\n.p-datatable-scrollable > .p-datatable-table-container > .p-virtualscroller > .p-datatable-table > .p-datatable-thead {\n @apply bg-surface-0 dark:bg-surface-900 \n}\n\n.p-datatable-scrollable > .p-datatable-table-container > .p-datatable-table > .p-datatable-tfoot,\n.p-datatable-scrollable > .p-datatable-table-container > .p-virtualscroller > .p-datatable-table > .p-datatable-tfoot {\n @apply bg-surface-0 dark:bg-surface-900 \n}\n\n.p-datatable-flex-scrollable {\n @apply flex flex-col h-full\n}\n\n.p-datatable-flex-scrollable > .p-datatable-table-container {\n @apply flex flex-col flex-1 h-full\n}\n\n.p-datatable-scrollable-table > .p-datatable-tbody > .p-datatable-row-group-header {\n @apply sticky z-10\n}\n\n.p-datatable-resizable-table > .p-datatable-thead > tr > th,\n.p-datatable-resizable-table > .p-datatable-tfoot > tr > td,\n.p-datatable-resizable-table > .p-datatable-tbody > tr > td {\n @apply overflow-hidden whitespace-nowrap\n}\n\n.p-datatable-resizable-table > .p-datatable-thead > tr > th.p-datatable-resizable-column:not(.p-datatable-frozen-column) {\n @apply bg-clip-padding relative\n}\n\n.p-datatable-resizable-table-fit > .p-datatable-thead > tr > th.p-datatable-resizable-column:last-child .p-datatable-column-resizer {\n @apply hidden\n}\n\n.p-datatable-column-resizer {\n @apply block absolute top-0 right-0 m-0 w-2 h-full p-0 cursor-col-resize border border-transparent\n}\n\n.p-datatable-column-header-content {\n @apply flex items-center gap-2\n}\n\n.p-datatable-column-resize-indicator {\n @apply w-px absolute z-10 hidden bg-primary\n}\n\n.p-datatable-row-reorder-indicator-up,\n.p-datatable-row-reorder-indicator-down {\n @apply absolute hidden\n}\n\n.p-datatable-reorderable-column,\n.p-datatable-reorderable-row-handle {\n @apply cursor-move\n}\n\n.p-datatable-mask {\n @apply absolute flex items-center justify-center z-20\n}\n\n.p-datatable-inline-filter {\n @apply flex items-center w-full gap-2\n}\n\n.p-datatable-inline-filter .p-datatable-filter-element-container {\n @apply flex-auto w-[1%]\n}\n\n.p-datatable-filter-overlay {\n @apply bg-surface-0 dark:bg-surface-900 rounded-md min-w-52\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-datatable-filter-constraint-list {\n @apply m-0 list-none flex flex-col p-1 gap-[2px]\n}\n\n.p-datatable-filter-constraint {\n @apply px-3 py-2 rounded-sm cursor-pointer transition-colors duration-200 text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-filter-constraint-selected {\n @apply bg-highlight\n}\n\n.p-datatable-filter-constraint:not(.p-datatable-filter-constraint-selected):not(.p-disabled):hover \n{\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-datatable-filter-constraint:focus-visible {\n @apply outline-none bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-datatable-filter-constraint-selected:focus-visible {\n @apply bg-highlight-emphasis\n}\n\n.p-datatable-filter-constraint-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-datatable-popover-filter {\n @apply inline-flex ml-auto\n}\n\n.p-datatable-filter-overlay-popover {\n @apply flex flex-col gap-2 \n bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n border border-surface-200 dark:border-surface-700 rounded-md p-3 min-w-52\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-datatable-filter-operator-dropdown {\n @apply w-full\n}\n\n.p-datatable-filter-rule-list,\n.p-datatable-filter-rule {\n @apply flex flex-col gap-2\n}\n\n.p-datatable-filter-rule {\n @apply border-b border-surface-200 dark:border-surface-700 last:border-b-0\n}\n\n.p-datatable-filter-add-rule-button {\n @apply w-full\n}\n\n.p-datatable-filter-remove-button {\n @apply w-full\n}\n\n.p-datatable-filter-buttonbar {\n @apply p-0 flex items-center justify-between\n}\n\n.p-datatable-virtualscroller-spacer {\n @apply flex\n}\n\n.p-datatable .p-virtualscroller .p-virtualscroller-loading {\n @apply transform-none min-h-0 sticky top-0 left-0\n}\n\n.p-datatable-paginator-top {\n @apply border-b border-surface-200 dark:border-surface-700\n}\n\n.p-datatable-paginator-bottom {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-datatable-header {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-footer {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-header-cell {\n @apply py-3 px-4 font-normal text-left transition-colors duration-200\n border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-column-title {\n @apply font-semibold\n}\n\n.p-datatable-tbody > tr {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0 transition-colors duration-200\n}\n\n.p-datatable-tbody > tr > td {\n @apply text-left py-3 px-4 border-b border-surface-200 dark:border-surface-800\n}\n\n.p-datatable-hoverable .p-datatable-tbody > tr:not(.p-datatable-row-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datatable-tbody > tr.p-datatable-row-selected {\n @apply bg-highlight\n}\n\n.p-datatable-tbody > tr:has(+ .p-datatable-row-selected) > td {\n @apply border-b-primary-100 dark:border-b-primary-900\n}\n\n.p-datatable-tbody > tr.p-datatable-row-selected > td {\n @apply border-b-primary-100 dark:border-b-primary-900\n}\n\n.p-datatable-tbody > tr:focus-visible,\n.p-datatable-tbody > tr.p-datatable-contextmenu-row-selected {\n @apply outline outline-1 -outline-offset-1 outline-primary\n}\n\n.p-datatable-tfoot > tr > td {\n @apply text-left py-3 px-4 border-b border-surface-200 dark:border-surface-800 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-column-footer {\n @apply font-semibold\n}\n\n.p-datatable-sortable-column {\n @apply cursor-pointer select-none focus-visible:outline focus-visible:outline-1 focus-visible:-outline-offset-1 focus-visible:outline-primary\n}\n\n.p-datatable-column-title,\n.p-datatable-sort-icon,\n.p-datatable-sort-badge {\n @apply align-middle\n}\n\n.p-datatable-sort-icon {\n @apply text-surface-500 dark:text-surface-400 transition-colors duration-200\n}\n\n.p-datatable-sortable-column:not(.p-datatable-column-sorted):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datatable-sortable-column:not(.p-datatable-column-sorted):hover .p-datatable-sort-icon {\n @apply text-surface-600 dark:text-surface-300\n}\n\n.p-datatable-column-sorted {\n @apply bg-highlight\n}\n\n.p-datatable-column-sorted .p-datatable-sort-icon {\n @apply bg-highlight\n}\n\n.p-datatable-hoverable .p-datatable-selectable-row {\n @apply cursor-pointer\n}\n\n.p-datatable-tbody > tr.p-datatable-dragpoint-top > td {\n @apply shadow-[inset_0_2px_0_0_theme(colors.primary)]\n}\n\n.p-datatable-tbody > tr.p-datatable-dragpoint-bottom > td {\n @apply shadow-[inset_0_-2px_0_0_theme(colors.primary)]\n}\n\n.p-datatable-loading-icon {\n @apply text-[2rem] w-8 h-8\n}\n\n.p-datatable-gridlines .p-datatable-header {\n @apply border-t border-x\n}\n\n.p-datatable-gridlines .p-datatable-footer {\n @apply border-b border-x\n}\n\n.p-datatable-gridlines .p-datatable-paginator-top {\n @apply border-t border-x\n}\n\n.p-datatable-gridlines .p-datatable-paginator-bottom {\n @apply border-b border-x\n}\n\n.p-datatable-gridlines .p-datatable-thead > tr > th {\n @apply border-t border-x last:border\n}\n\n.p-datatable-gridlines .p-datatable-tbody > tr > td {\n @apply border-t border-l last:border-r\n}\n\n.p-datatable-gridlines .p-datatable-tbody > tr:last-child > td {\n @apply border-y border-l last:border\n}\n\n.p-datatable-gridlines .p-datatable-tfoot > tr > td {\n @apply border-y border-l last:border\n}\n\n.p-datatable.p-datatable-gridlines .p-datatable-thead + .p-datatable-tfoot > tr > td {\n @apply border-b border-l last:border-r\n}\n\n.p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody > tr > td {\n @apply border-b border-l last:border-r\n}\n\n.p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td {\n @apply border-l last:border-r\n}\n\n.p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {\n @apply bg-surface-50 dark:bg-surface-950\n}\n\n.p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-datatable-row-selected {\n @apply bg-highlight\n}\n\n.p-datatable.p-datatable-sm .p-datatable-header {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-sm .p-datatable-thead > tr > th {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-sm .p-datatable-footer {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-lg .p-datatable-header {\n @apply py-4 px-5\n}\n\n.p-datatable.p-datatable-lg .p-datatable-thead > tr > th {\n @apply py-4 px-5\n}\n\n.p-datatable.p-datatable-lg .p-datatable-tbody>tr>td {\n @apply py-4 px-5\n}\n\n.p-datatable.p-datatable-lg .p-datatable-tfoot>tr>td {\n @apply py-4 px-5\n}\n\n.p-datatable.p-datatable-lg .p-datatable-footer {\n @apply py-4 px-5\n}\n\n.p-datatable-row-toggle-button {\n @apply inline-flex items-center justify-center overflow-hidden relative w-7 h-7 cursor-pointer select-none\n transition-colors duration-200 rounded-full border-none bg-transparent \n text-surface-500 enabled:hover:bg-surface-100 enabled:hover:text-surface-700\n dark:text-surface-400 dark:enabled:hover:bg-surface-800 dark:enabled:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n \n}\n\n.p-datatable-tbody > tr.p-datatable-row-selected .p-datatable-row-toggle-button:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-primary\n}", - "dataview": ".p-dataview {\n @apply border-none\n}\n\n.p-dataview-header {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-dataview-content {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-dataview-footer {\n @apply py-3 px-4 border-t border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-dataview-paginator-top {\n @apply border-b border-surface-200 dark:border-surface-700\n}\n\n.p-dataview-paginator-bottom {\n @apply border-t border-surface-200 dark:border-surface-700\n}", - "datepicker": ".p-datepicker {\n @apply inline-flex max-w-full\n}\n\n.p-datepicker-input {\n @apply flex-auto w-[1%]\n}\n\n.p-datepicker:has(.p-datepicker-dropdown) .p-datepicker-input {\n @apply rounded-r-none\n}\n\n.p-datepicker-dropdown {\n @apply inline-flex items-center justify-center overflow-hidden relative cursor-pointer select-none \n w-10 rounded-r-md border border-l-0 border-surface-300 dark:border-surface-700 \n bg-surface-100 enabled:hover:bg-surface-200 enabled:active:bg-surface-300\n text-surface-600 enabled:hover:text-surface-700 enabled:active:text-surface-800\n dark:bg-surface-800 dark:enabled:hover:bg-surface-700 dark:enabled:active:bg-surface-600\n dark:text-surface-300 dark:enabled:hover:text-surface-200 dark:enabled:active:text-surface-100\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-datepicker:has(.p-datepicker-input-icon-container) {\n @apply relative\n}\n\n.p-datepicker:has(.p-datepicker-input-icon-container) .p-datepicker-input {\n @apply pr-10\n}\n\n.p-datepicker-input-icon-container {\n @apply cursor-pointer absolute top-1/2 right-3 -mt-2 text-surface-400\n}\n\n.p-datepicker-fluid {\n @apply flex\n}\n\n.p-datepicker-fluid .p-datepicker-input {\n @apply w-[1%]\n}\n\n.p-datepicker .p-datepicker-panel {\n @apply min-w-full\n}\n\n.p-datepicker-panel {\n @apply w-auto p-3 rounded-md \n border border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-datepicker-panel-inline {\n @apply inline-block overflow-x-auto shadow-none\n}\n\n.p-datepicker-header {\n @apply flex items-center justify-between pt-0 px-0 pb-2 font-medium gap-2\n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n border-b border-surface-200 dark:border-surface-700\n}\n\n.p-datepicker-title {\n @apply flex items-center justify-between gap-2 font-medium\n}\n\n.p-datepicker-select-year,\n.p-datepicker-select-month {\n @apply border-none bg-transparent m-0 cursor-pointer font-medium transition-colors duration-200\n py-1 px-2 rounded-md text-surface-700 dark:text-surface-0\n enabled:hover:bg-surface-100 enabled:hover:text-surface-800\n dark:enabled:hover:bg-surface-800 dark:enabled:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-calendar-container {\n @apply flex\n}\n\n.p-datepicker-calendar-container .p-datepicker-calendar {\n @apply flex-auto border-l border-surface-200 dark:border-surface-700 gap-3\n first:pl-0 first:border-l-0 last:pr-0\n}\n\n.p-datepicker-day-view {\n @apply w-full border-collapse text-base mt-2 mx-0 mb-0\n}\n\n.p-datepicker-weekday-cell {\n @apply p-1\n}\n\n.p-datepicker-weekday {\n @apply font-medium text-surface-700 dark:text-surface-0\n}\n\n.p-datepicker-day-cell {\n @apply p-1\n}\n\n.p-datepicker-day {\n @apply flex items-center justify-center cursor-pointer my-0 mx-auto overflow-hidden relative w-8 h-8 \n rounded-full p-1 transition-colors duration-200 border border-transparent text-surface-700 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-day:not(.p-datepicker-day-selected):not(.p-disabled):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datepicker-day-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-day-selected-range {\n @apply bg-highlight\n}\n\n.p-datepicker-today > .p-datepicker-day {\n @apply bg-surface-200 text-surface-900 dark:bg-surface-700 dark:text-surface-0\n}\n\n.p-datepicker-today > .p-datepicker-day-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-today > .p-datepicker-day-selected-range {\n @apply bg-highlight\n}\n\n.p-datepicker-weeknumber {\n @apply text-center\n}\n\n.p-datepicker-month-view {\n @apply mt-2 mb-0 mx-0\n}\n\n.p-datepicker-month {\n @apply w-1/3 inline-flex items-center justify-center cursor-pointer overflow-hidden relative\n p-[0.375rem] transition-colors duration-200 rounded-md text-surface-700 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-month:not(.p-disabled):not(.p-datepicker-month-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datepicker-month-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-year-view {\n @apply mt-2 mb-0 mx-0\n}\n\n.p-datepicker-year {\n @apply w-1/2 inline-flex items-center justify-center cursor-pointer overflow-hidden relative\n p-[0.375rem] transition-colors duration-200 rounded-md text-surface-700 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-year:not(.p-disabled):not(.p-datepicker-year-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datepicker-year-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-buttonbar {\n @apply flex justify-between items-center pt-2 pb-0 px-0 border-t border-surface-200 dark:border-surface-700\n}\n\n.p-datepicker-buttonbar .p-button {\n @apply w-auto\n}\n\n.p-datepicker-time-picker {\n @apply flex items-center justify-center border-t border-surface-200 dark:border-surface-700 p-0 gap-2\n}\n\n.p-datepicker-calendar-container + .p-datepicker-time-picker {\n @apply pt-2 pb-0 px-0\n}\n\n.p-datepicker-time-picker > div {\n @apply flex items-center flex-col gap-1\n}\n\n.p-datepicker-time-picker span {\n @apply text-base\n}\n\n.p-datepicker-timeonly .p-datepicker-time-picker {\n @apply border-t-0\n}", - "dialog": ".p-dialog {\n @apply max-h-[90%] scale-100 rounded-xl \n border border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_20px_25px_-5px_rgba(0,0,0,0.1),0_8px_10px_-6px_rgba(0,0,0,0.1)]\n}\n\n.p-dialog-content {\n @apply overflow-y-auto pt-0 px-5 pb-5\n}\n\n.p-dialog-header {\n @apply flex items-center justify-between shrink-0 p-5\n}\n\n.p-dialog-title {\n @apply font-semibold text-xl\n}\n\n.p-dialog-footer {\n @apply shrink-0 pt-0 px-5 pb-5 flex justify-end gap-2\n}\n\n.p-dialog-header-actions {\n @apply flex items-center gap-2\n}\n\n.p-dialog-enter-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0,0,0.2,1)]\n}\n\n.p-dialog-leave-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0.4,0,0.2,1)]\n}\n\n.p-dialog-enter-from,\n.p-dialog-leave-to {\n @apply opacity-0 scale-75\n}\n\n.p-dialog-top .p-dialog,\n.p-dialog-bottom .p-dialog,\n.p-dialog-left .p-dialog,\n.p-dialog-right .p-dialog,\n.p-dialog-topleft .p-dialog,\n.p-dialog-topright .p-dialog,\n.p-dialog-bottomleft .p-dialog,\n.p-dialog-bottomright .p-dialog {\n margin: 0.75rem;\n transform: translate3d(0px, 0px, 0px);\n}\n\n.p-dialog-top .p-dialog-enter-active,\n.p-dialog-top .p-dialog-leave-active,\n.p-dialog-bottom .p-dialog-enter-active,\n.p-dialog-bottom .p-dialog-leave-active,\n.p-dialog-left .p-dialog-enter-active,\n.p-dialog-left .p-dialog-leave-active,\n.p-dialog-right .p-dialog-enter-active,\n.p-dialog-right .p-dialog-leave-active,\n.p-dialog-topleft .p-dialog-enter-active,\n.p-dialog-topleft .p-dialog-leave-active,\n.p-dialog-topright .p-dialog-enter-active,\n.p-dialog-topright .p-dialog-leave-active,\n.p-dialog-bottomleft .p-dialog-enter-active,\n.p-dialog-bottomleft .p-dialog-leave-active,\n.p-dialog-bottomright .p-dialog-enter-active,\n.p-dialog-bottomright .p-dialog-leave-active {\n @apply transition-all duration-300 ease-out\n}\n\n.p-dialog-top .p-dialog-enter-from,\n.p-dialog-top .p-dialog-leave-to {\n transform: translate3d(0px, -100%, 0px);\n}\n\n.p-dialog-bottom .p-dialog-enter-from,\n.p-dialog-bottom .p-dialog-leave-to {\n transform: translate3d(0px, 100%, 0px);\n}\n\n.p-dialog-left .p-dialog-enter-from,\n.p-dialog-left .p-dialog-leave-to,\n.p-dialog-topleft .p-dialog-enter-from,\n.p-dialog-topleft .p-dialog-leave-to,\n.p-dialog-bottomleft .p-dialog-enter-from,\n.p-dialog-bottomleft .p-dialog-leave-to {\n transform: translate3d(-100%, 0px, 0px);\n}\n\n.p-dialog-right .p-dialog-enter-from,\n.p-dialog-right .p-dialog-leave-to,\n.p-dialog-topright .p-dialog-enter-from,\n.p-dialog-topright .p-dialog-leave-to,\n.p-dialog-bottomright .p-dialog-enter-from,\n.p-dialog-bottomright .p-dialog-leave-to {\n transform: translate3d(100%, 0px, 0px);\n}\n\n.p-dialog-maximized {\n @apply !w-screen !h-screen top-0 left-0 max-h-full rounded-none \n}\n\n.p-dialog-maximized .p-dialog-content {\n @apply flex-grow\n}", - "divider": ".p-divider-horizontal {\n @apply flex w-full relative items-center my-4 mx-0 py-0 px-4\n}\n\n.p-divider-horizontal:before {\n @apply absolute block top-1/2 left-0 w-full content-[''] border-t border-surface-200 dark:border-surface-700\n}\n\n.p-divider-horizontal .p-divider-content {\n @apply py-0 px-2\n}\n\n.p-divider-vertical {\n @apply min-h-full flex relative justify-center my-0 mx-4 py-2 px-0\n}\n\n.p-divider-vertical:before {\n @apply absolute block top-0 left-1/2 h-full content-[''] border-l border-surface-200 dark:border-surface-700\n}\n\n.p-divider.p-divider-vertical .p-divider-content {\n @apply py-2 px-0\n}\n\n.p-divider-content {\n @apply z-10 bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n @apply border-solid\n}\n\n.p-divider-solid.p-divider-vertical:before {\n @apply border-solid\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n @apply border-dashed\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n @apply border-dashed\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n @apply border-dotted\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n @apply border-dotted\n}", + "datatable": "@import './paginator';\n\n.p-datatable {\n @apply relative\n}\n\n.p-datatable-table {\n @apply border-spacing-0 w-full\n}\n\n.p-datatable-scrollable > .p-datatable-table-container {\n @apply relative\n}\n\n.p-datatable-scrollable-table > .p-datatable-thead {\n @apply top-0 z-10\n}\n\n.p-datatable-scrollable-table > .p-datatable-frozen-tbody {\n @apply sticky z-10\n}\n\n.p-datatable-scrollable-table > .p-datatable-tfoot {\n @apply bottom-0 z-10\n}\n\n.p-datatable-scrollable .p-datatable-frozen-column {\n @apply sticky bg-surface-0 dark:bg-surface-900\n}\n\n.p-datatable-scrollable th.p-datatable-frozen-column {\n @apply z-10\n}\n\n.p-datatable-scrollable > .p-datatable-table-container > .p-datatable-table > .p-datatable-thead,\n.p-datatable-scrollable > .p-datatable-table-container > .p-virtualscroller > .p-datatable-table > .p-datatable-thead {\n @apply bg-surface-0 dark:bg-surface-900 \n}\n\n.p-datatable-scrollable > .p-datatable-table-container > .p-datatable-table > .p-datatable-tfoot,\n.p-datatable-scrollable > .p-datatable-table-container > .p-virtualscroller > .p-datatable-table > .p-datatable-tfoot {\n @apply bg-surface-0 dark:bg-surface-900 \n}\n\n.p-datatable-flex-scrollable {\n @apply flex flex-col h-full\n}\n\n.p-datatable-flex-scrollable > .p-datatable-table-container {\n @apply flex flex-col flex-1 h-full\n}\n\n.p-datatable-scrollable-table > .p-datatable-tbody > .p-datatable-row-group-header {\n @apply sticky z-10\n}\n\n.p-datatable-resizable-table > .p-datatable-thead > tr > th,\n.p-datatable-resizable-table > .p-datatable-tfoot > tr > td,\n.p-datatable-resizable-table > .p-datatable-tbody > tr > td {\n @apply overflow-hidden whitespace-nowrap\n}\n\n.p-datatable-resizable-table > .p-datatable-thead > tr > th.p-datatable-resizable-column:not(.p-datatable-frozen-column) {\n @apply bg-clip-padding relative\n}\n\n.p-datatable-resizable-table-fit > .p-datatable-thead > tr > th.p-datatable-resizable-column:last-child .p-datatable-column-resizer {\n @apply hidden\n}\n\n.p-datatable-column-resizer {\n @apply block absolute top-0 right-0 m-0 w-2 h-full p-0 cursor-col-resize border border-transparent\n}\n\n.p-datatable-column-header-content {\n @apply flex items-center gap-2\n}\n\n.p-datatable-column-resize-indicator {\n @apply w-px absolute z-10 hidden bg-primary\n}\n\n.p-datatable-row-reorder-indicator-up,\n.p-datatable-row-reorder-indicator-down {\n @apply absolute hidden\n}\n\n.p-datatable-reorderable-column,\n.p-datatable-reorderable-row-handle {\n @apply cursor-move\n}\n\n.p-datatable-mask {\n @apply absolute flex items-center justify-center z-20\n}\n\n.p-datatable-inline-filter {\n @apply flex items-center w-full gap-2\n}\n\n.p-datatable-inline-filter .p-datatable-filter-element-container {\n @apply flex-auto w-[1%]\n}\n\n.p-datatable-filter-overlay {\n @apply bg-surface-0 dark:bg-surface-900 rounded-md min-w-52\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-datatable-filter-constraint-list {\n @apply m-0 list-none flex flex-col p-1 gap-[2px]\n}\n\n.p-datatable-filter-constraint {\n @apply px-3 py-2 rounded-sm cursor-pointer transition-colors duration-200 text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-filter-constraint-selected {\n @apply bg-highlight\n}\n\n.p-datatable-filter-constraint:not(.p-datatable-filter-constraint-selected):not(.p-disabled):hover \n{\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-datatable-filter-constraint:focus-visible {\n @apply outline-none bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-datatable-filter-constraint-selected:focus-visible {\n @apply bg-highlight-emphasis\n}\n\n.p-datatable-filter-constraint-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-datatable-popover-filter {\n @apply inline-flex ml-auto\n}\n\n.p-datatable-filter-overlay-popover {\n @apply flex flex-col gap-2 \n bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n border border-surface-200 dark:border-surface-700 rounded-md p-3 min-w-52\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-datatable-filter-operator-dropdown {\n @apply w-full\n}\n\n.p-datatable-filter-rule-list,\n.p-datatable-filter-rule {\n @apply flex flex-col gap-2\n}\n\n.p-datatable-filter-rule {\n @apply border-b border-surface-200 dark:border-surface-700 last:border-b-0\n}\n\n.p-datatable-filter-add-rule-button {\n @apply w-full\n}\n\n.p-datatable-filter-remove-button {\n @apply w-full\n}\n\n.p-datatable-filter-buttonbar {\n @apply p-0 flex items-center justify-between\n}\n\n.p-datatable-virtualscroller-spacer {\n @apply flex\n}\n\n.p-datatable .p-virtualscroller .p-virtualscroller-loading {\n @apply transform-none min-h-0 sticky top-0 left-0\n}\n\n.p-datatable-paginator-top {\n @apply border-b border-surface-200 dark:border-surface-700\n}\n\n.p-datatable-paginator-bottom {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-datatable-header {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-footer {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-header-cell {\n @apply py-3 px-4 font-normal text-left transition-colors duration-200\n border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-column-title {\n @apply font-semibold\n}\n\n.p-datatable-tbody > tr {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0 transition-colors duration-200\n}\n\n.p-datatable-tbody > tr > td {\n @apply text-left py-3 px-4 border-b border-surface-200 dark:border-surface-800\n}\n\n.p-datatable-hoverable .p-datatable-tbody > tr:not(.p-datatable-row-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datatable-tbody > tr.p-datatable-row-selected {\n @apply bg-highlight\n}\n\n.p-datatable-tbody > tr:has(+ .p-datatable-row-selected) > td {\n @apply border-b-primary-100 dark:border-b-primary-900\n}\n\n.p-datatable-tbody > tr.p-datatable-row-selected > td {\n @apply border-b-primary-100 dark:border-b-primary-900\n}\n\n.p-datatable-tbody > tr:focus-visible,\n.p-datatable-tbody > tr.p-datatable-contextmenu-row-selected {\n @apply outline outline-1 -outline-offset-1 outline-primary\n}\n\n.p-datatable-tfoot > tr > td {\n @apply text-left py-3 px-4 border-b border-surface-200 dark:border-surface-800 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-datatable-column-footer {\n @apply font-semibold\n}\n\n.p-datatable-sortable-column {\n @apply cursor-pointer select-none focus-visible:outline focus-visible:outline-1 focus-visible:-outline-offset-1 focus-visible:outline-primary\n}\n\n.p-datatable-column-title,\n.p-datatable-sort-icon,\n.p-datatable-sort-badge {\n @apply align-middle\n}\n\n.p-datatable-sort-icon {\n @apply text-surface-500 dark:text-surface-400 transition-colors duration-200\n}\n\n.p-datatable-sortable-column:not(.p-datatable-column-sorted):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datatable-sortable-column:not(.p-datatable-column-sorted):hover .p-datatable-sort-icon {\n @apply text-surface-600 dark:text-surface-300\n}\n\n.p-datatable-column-sorted {\n @apply bg-highlight\n}\n\n.p-datatable-column-sorted .p-datatable-sort-icon {\n @apply bg-highlight\n}\n\n.p-datatable-hoverable .p-datatable-selectable-row {\n @apply cursor-pointer\n}\n\n.p-datatable-tbody > tr.p-datatable-dragpoint-top > td {\n @apply shadow-[inset_0_2px_0_0_theme(colors.primary)]\n}\n\n.p-datatable-tbody > tr.p-datatable-dragpoint-bottom > td {\n @apply shadow-[inset_0_-2px_0_0_theme(colors.primary)]\n}\n\n.p-datatable-loading-icon {\n @apply text-[2rem] w-8 h-8\n}\n\n.p-datatable-gridlines .p-datatable-header {\n @apply border-t border-x\n}\n\n.p-datatable-gridlines .p-datatable-footer {\n @apply border-b border-x\n}\n\n.p-datatable-gridlines .p-datatable-paginator-top {\n @apply border-t border-x\n}\n\n.p-datatable-gridlines .p-datatable-paginator-bottom {\n @apply border-b border-x\n}\n\n.p-datatable-gridlines .p-datatable-thead > tr > th {\n @apply border-t border-x last:border\n}\n\n.p-datatable-gridlines .p-datatable-tbody > tr > td {\n @apply border-t border-l last:border-r\n}\n\n.p-datatable-gridlines .p-datatable-tbody > tr:last-child > td {\n @apply border-y border-l last:border\n}\n\n.p-datatable-gridlines .p-datatable-tfoot > tr > td {\n @apply border-y border-l last:border\n}\n\n.p-datatable.p-datatable-gridlines .p-datatable-thead + .p-datatable-tfoot > tr > td {\n @apply border-b border-l last:border-r\n}\n\n.p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody > tr > td {\n @apply border-b border-l last:border-r\n}\n\n.p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td {\n @apply border-l last:border-r\n}\n\n.p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {\n @apply bg-surface-50 dark:bg-surface-950\n}\n\n.p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-datatable-row-selected {\n @apply bg-highlight\n}\n\n.p-datatable.p-datatable-sm .p-datatable-header {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-sm .p-datatable-thead > tr > th {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-sm .p-datatable-footer {\n @apply py-1 px-2\n}\n\n.p-datatable.p-datatable-lg .p-datatable-header {\n @apply py-4 px-5\n}\n\n.p-datatable.p-datatable-lg .p-datatable-thead > tr > th {\n @apply py-4 px-5\n}\n\n.p-datatable.p-datatable-lg .p-datatable-tbody>tr>td {\n @apply py-4 px-5\n}\n\n.p-datatable.p-datatable-lg .p-datatable-tfoot>tr>td {\n @apply py-4 px-5\n}\n\n.p-datatable.p-datatable-lg .p-datatable-footer {\n @apply py-4 px-5\n}\n\n.p-datatable-row-toggle-button {\n @apply inline-flex items-center justify-center overflow-hidden relative w-7 h-7 cursor-pointer select-none\n transition-colors duration-200 rounded-full border-none bg-transparent \n text-surface-500 enabled:hover:bg-surface-100 enabled:hover:text-surface-700\n dark:text-surface-400 dark:enabled:hover:bg-surface-800 dark:enabled:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n \n}\n\n.p-datatable-tbody > tr.p-datatable-row-selected .p-datatable-row-toggle-button:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-primary\n}", + "dataview": "@import './paginator';\n\n.p-dataview {\n @apply border-none\n}\n\n.p-dataview-header {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-dataview-content {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-dataview-footer {\n @apply py-3 px-4 border-t border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-dataview-paginator-top {\n @apply border-b border-surface-200 dark:border-surface-700\n}\n\n.p-dataview-paginator-bottom {\n @apply border-t border-surface-200 dark:border-surface-700\n}", + "datepicker": "@import './button';\n@import './inputtext';\n\n.p-datepicker {\n @apply inline-flex max-w-full\n}\n\n.p-datepicker-input {\n @apply flex-auto w-[1%]\n}\n\n.p-datepicker:has(.p-datepicker-dropdown) .p-datepicker-input {\n @apply rounded-e-none\n}\n\n.p-datepicker-dropdown {\n @apply inline-flex items-center justify-center overflow-hidden relative cursor-pointer select-none\n w-10 rounded-e-md border border-s-0 border-surface-300 dark:border-surface-700\n bg-surface-100 enabled:hover:bg-surface-200 enabled:active:bg-surface-300\n text-surface-600 enabled:hover:text-surface-700 enabled:active:text-surface-800\n dark:bg-surface-800 dark:enabled:hover:bg-surface-700 dark:enabled:active:bg-surface-600\n dark:text-surface-300 dark:enabled:hover:text-surface-200 dark:enabled:active:text-surface-100\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-datepicker:has(.p-datepicker-input-icon-container) {\n @apply relative\n}\n\n.p-datepicker:has(.p-datepicker-input-icon-container) .p-datepicker-input {\n @apply pe-10\n}\n\n.p-datepicker-input-icon-container {\n @apply cursor-pointer absolute top-1/2 end-3 -mt-2 text-surface-400\n}\n\n.p-datepicker-fluid {\n @apply flex\n}\n\n.p-datepicker-fluid .p-datepicker-input {\n @apply w-[1%]\n}\n\n.p-datepicker .p-datepicker-panel {\n @apply min-w-full\n}\n\n.p-datepicker-panel {\n @apply w-auto p-3 rounded-md\n border border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-datepicker-panel-inline {\n @apply inline-block overflow-x-auto shadow-none\n}\n\n.p-datepicker-header {\n @apply flex items-center justify-between pt-0 px-0 pb-2 font-medium gap-2\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n border-b border-surface-200 dark:border-surface-700\n}\n\n.p-datepicker-next-button:dir(rtl) {\n @apply order-[-1]\n}\n.p-datepicker-prev-button:dir(rtl) {\n @apply order-1\n}\n\n.p-datepicker-title {\n @apply flex items-center justify-between gap-2 font-medium\n}\n\n.p-datepicker-select-year,\n.p-datepicker-select-month {\n @apply border-none bg-transparent m-0 cursor-pointer font-medium transition-colors duration-200\n py-1 px-2 rounded-md text-surface-700 dark:text-surface-0\n enabled:hover:bg-surface-100 enabled:hover:text-surface-800\n dark:enabled:hover:bg-surface-800 dark:enabled:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-calendar-container {\n @apply flex\n}\n\n.p-datepicker-calendar-container .p-datepicker-calendar {\n @apply flex-auto border-s border-surface-200 dark:border-surface-700 gap-3\n first:ps-0 first:border-s-0 last:pe-0\n}\n\n.p-datepicker-day-view {\n @apply w-full border-collapse text-base mt-2 mx-0 mb-0\n}\n\n.p-datepicker-weekday-cell {\n @apply p-1\n}\n\n.p-datepicker-weekday {\n @apply font-medium text-surface-700 dark:text-surface-0\n}\n\n.p-datepicker-day-cell {\n @apply p-1\n}\n\n.p-datepicker-day {\n @apply flex items-center justify-center cursor-pointer my-0 mx-auto overflow-hidden relative w-8 h-8\n rounded-full p-1 transition-colors duration-200 border border-transparent text-surface-700 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-day:not(.p-datepicker-day-selected):not(.p-disabled):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datepicker-day-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-day-selected-range {\n @apply bg-highlight\n}\n\n.p-datepicker-today > .p-datepicker-day {\n @apply bg-surface-200 text-surface-900 dark:bg-surface-700 dark:text-surface-0\n}\n\n.p-datepicker-today > .p-datepicker-day-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-today > .p-datepicker-day-selected-range {\n @apply bg-highlight\n}\n\n.p-datepicker-weeknumber {\n @apply text-center\n}\n\n.p-datepicker-month-view {\n @apply mt-2 mb-0 mx-0\n}\n\n.p-datepicker-month {\n @apply w-1/3 inline-flex items-center justify-center cursor-pointer overflow-hidden relative\n p-[0.375rem] transition-colors duration-200 rounded-md text-surface-700 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-month:not(.p-disabled):not(.p-datepicker-month-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datepicker-month-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-year-view {\n @apply mt-2 mb-0 mx-0\n}\n\n.p-datepicker-year {\n @apply w-1/2 inline-flex items-center justify-center cursor-pointer overflow-hidden relative\n p-[0.375rem] transition-colors duration-200 rounded-md text-surface-700 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-year:not(.p-disabled):not(.p-datepicker-year-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datepicker-year-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-buttonbar {\n @apply flex justify-between items-center pt-2 pb-0 px-0 border-t border-surface-200 dark:border-surface-700\n}\n\n.p-datepicker-buttonbar .p-button {\n @apply w-auto\n}\n\n.p-datepicker-time-picker {\n @apply flex items-center justify-center border-t border-surface-200 dark:border-surface-700 p-0 gap-2\n}\n\n.p-datepicker-calendar-container + .p-datepicker-time-picker {\n @apply pt-2 pb-0 px-0\n}\n\n.p-datepicker-time-picker > div {\n @apply flex items-center flex-col gap-1\n}\n\n.p-datepicker-time-picker span {\n @apply text-base\n}\n\n.p-datepicker-timeonly .p-datepicker-time-picker {\n @apply border-t-0\n}\n", + "dialog": "@import './button';\n\n.p-dialog {\n @apply max-h-[90%] scale-100 rounded-xl \n border border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_20px_25px_-5px_rgba(0,0,0,0.1),0_8px_10px_-6px_rgba(0,0,0,0.1)]\n}\n\n.p-dialog-content {\n @apply overflow-y-auto pt-0 px-5 pb-5\n}\n\n.p-dialog-header {\n @apply flex items-center justify-between shrink-0 p-5\n}\n\n.p-dialog-title {\n @apply font-semibold text-xl\n}\n\n.p-dialog-footer {\n @apply shrink-0 pt-0 px-5 pb-5 flex justify-end gap-2\n}\n\n.p-dialog-header-actions {\n @apply flex items-center gap-2\n}\n\n.p-dialog-enter-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0,0,0.2,1)]\n}\n\n.p-dialog-leave-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0.4,0,0.2,1)]\n}\n\n.p-dialog-enter-from,\n.p-dialog-leave-to {\n @apply opacity-0 scale-75\n}\n\n.p-dialog-top .p-dialog,\n.p-dialog-bottom .p-dialog,\n.p-dialog-left .p-dialog,\n.p-dialog-right .p-dialog,\n.p-dialog-topleft .p-dialog,\n.p-dialog-topright .p-dialog,\n.p-dialog-bottomleft .p-dialog,\n.p-dialog-bottomright .p-dialog {\n @apply m-3 [transform:translate3d(0,0,0)]\n}\n\n.p-dialog-top .p-dialog-enter-active,\n.p-dialog-top .p-dialog-leave-active,\n.p-dialog-bottom .p-dialog-enter-active,\n.p-dialog-bottom .p-dialog-leave-active,\n.p-dialog-left .p-dialog-enter-active,\n.p-dialog-left .p-dialog-leave-active,\n.p-dialog-right .p-dialog-enter-active,\n.p-dialog-right .p-dialog-leave-active,\n.p-dialog-topleft .p-dialog-enter-active,\n.p-dialog-topleft .p-dialog-leave-active,\n.p-dialog-topright .p-dialog-enter-active,\n.p-dialog-topright .p-dialog-leave-active,\n.p-dialog-bottomleft .p-dialog-enter-active,\n.p-dialog-bottomleft .p-dialog-leave-active,\n.p-dialog-bottomright .p-dialog-enter-active,\n.p-dialog-bottomright .p-dialog-leave-active {\n @apply transition-all duration-300 ease-out\n}\n\n.p-dialog-top .p-dialog-enter-from,\n.p-dialog-top .p-dialog-leave-to {\n @apply [transform:translate3d(0,-100%,0)]\n}\n\n.p-dialog-bottom .p-dialog-enter-from,\n.p-dialog-bottom .p-dialog-leave-to {\n @apply [transform:translate3d(0,100%,0)]\n}\n\n.p-dialog-left .p-dialog-enter-from,\n.p-dialog-left .p-dialog-leave-to,\n.p-dialog-topleft .p-dialog-enter-from,\n.p-dialog-topleft .p-dialog-leave-to,\n.p-dialog-bottomleft .p-dialog-enter-from,\n.p-dialog-bottomleft .p-dialog-leave-to {\n @apply [transform:translate3d(-100%,0,0)]\n}\n\n.p-dialog-right .p-dialog-enter-from,\n.p-dialog-right .p-dialog-leave-to,\n.p-dialog-topright .p-dialog-enter-from,\n.p-dialog-topright .p-dialog-leave-to,\n.p-dialog-bottomright .p-dialog-enter-from,\n.p-dialog-bottomright .p-dialog-leave-to {\n @apply [transform:translate3d(100%,0,0)]\n}\n\n.p-dialog-maximized {\n @apply !w-screen !h-screen top-0 left-0 max-h-full rounded-none \n}\n\n.p-dialog-maximized .p-dialog-content {\n @apply flex-grow\n}", + "divider": ".p-divider-horizontal {\n @apply flex w-full relative items-center my-4 mx-0 py-0 px-4\n before:absolute before:block before:top-1/2 before:left-0 before:w-full\n before:border-t before:border-surface-200 dark:before:border-surface-700\n}\n\n.p-divider-horizontal .p-divider-content {\n @apply py-0 px-2\n}\n\n.p-divider-vertical {\n @apply min-h-full flex relative justify-center my-0 mx-4 py-2 px-0\n before:absolute before:block before:top-0 before:left-1/2 before:h-full\n before:border-l before:border-surface-200 before:dark:border-surface-700\n}\n\n.p-divider.p-divider-vertical .p-divider-content {\n @apply py-2 px-0\n}\n\n.p-divider-content {\n @apply z-10 bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n @apply border-solid\n}\n\n.p-divider-solid.p-divider-vertical:before {\n @apply border-solid\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n @apply border-dashed\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n @apply border-dashed\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n @apply border-dotted\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n @apply border-dotted\n}", "dock": ".p-dock {\n @apply absolute z-10 flex justify-center items-center pointer-events-none\n}\n\n.p-dock-list-container {\n @apply flex pointer-events-auto bg-white/10 border border-white/10 p-2 rounded-xl\n}\n\n.p-dock-list {\n @apply m-0 p-0 list-none flex items-center justify-center outline-none\n}\n\n.p-dock-item {\n @apply transition-all duration-200 ease-[cubic-bezier(0.4,0,0.2,1)] will-change-transform p-2 rounded-md\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-dock-item-link {\n @apply flex flex-col items-center justify-center relative cursor-default w-12 h-12\n}\n\n.p-dock-top {\n @apply left-0 top-0 w-full\n}\n\n.p-dock-top .p-dock-item {\n @apply origin-[center_top]\n}\n\n.p-dock-bottom {\n @apply left-0 bottom-0 w-full\n}\n\n.p-dock-bottom .p-dock-item {\n @apply origin-[center_bottom]\n}\n\n.p-dock-right {\n @apply right-0 top-0 h-full\n}\n\n.p-dock-right .p-dock-item {\n @apply origin-[center_right]\n}\n\n.p-dock-right .p-dock-list {\n @apply flex-col\n}\n\n.p-dock-left {\n @apply left-0 top-0 h-full\n}\n\n.p-dock-left .p-dock-item {\n @apply origin-[center_left]\n}\n\n.p-dock-left .p-dock-list {\n @apply flex-col\n}\n\n.p-dock-mobile.p-dock-top .p-dock-list-container,\n.p-dock-mobile.p-dock-bottom .p-dock-list-container {\n @apply overflow-x-auto w-full\n}\n\n.p-dock-mobile.p-dock-top .p-dock-list-container .p-dock-list,\n.p-dock-mobile.p-dock-bottom .p-dock-list-container .p-dock-list {\n @apply mt-0 mx-auto\n}\n\n.p-dock-mobile.p-dock-left .p-dock-list-container,\n.p-dock-mobile.p-dock-right .p-dock-list-container {\n @apply overflow-y-auto h-full\n}\n\n.p-dock-mobile.p-dock-left .p-dock-list-container .p-dock-list,\n.p-dock-mobile.p-dock-right .p-dock-list-container .p-dock-list {\n @apply mt-auto mx-0\n}\n\n.p-dock-mobile .p-dock-list .p-dock-item {\n @apply transform-none m-0\n}", - "drawer": ".p-drawer {\n @apply flex flex-col pointer-events-auto relative transition-transform duration-300\n border border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_20px_25px_-5px_rgba(0,0,0,0.1),0_8px_10px_-6px_rgba(0,0,0,0.1)]\n}\n\n.p-drawer {\n transform: translate3d(0px, 0px, 0px);\n}\n\n.p-drawer-content {\n @apply overflow-y-auto flex-grow pt-0 pb-5 px-5\n}\n\n.p-drawer-header {\n @apply flex items-center justify-between flex-shrink-0 p-5\n}\n\n.p-drawer-footer {\n @apply px-5\n}\n\n.p-drawer-title {\n @apply font-semibold text-2xl \n}\n\n.p-drawer-full .p-drawer {\n @apply transition-none transform-none w-screen h-screen max-h-full top-0 left-0\n}\n\n.p-drawer-left .p-drawer-enter-from,\n.p-drawer-left .p-drawer-leave-to {\n @apply -translate-x-full\n}\n\n.p-drawer-right .p-drawer-enter-from,\n.p-drawer-right .p-drawer-leave-to {\n @apply translate-x-full\n}\n\n.p-drawer-top .p-drawer-enter-from,\n.p-drawer-top .p-drawer-leave-to {\n @apply -translate-y-full\n}\n\n.p-drawer-bottom .p-drawer-enter-from,\n.p-drawer-bottom .p-drawer-leave-to {\n @apply translate-y-full\n}\n\n.p-drawer-full .p-drawer-enter-from,\n.p-drawer-full .p-drawer-leave-to {\n @apply opacity-0\n}\n\n.p-drawer-full .p-drawer-enter-active,\n.p-drawer-full .p-drawer-leave-active {\n @apply transition-opacity animate-duration-400 ease-[cubic-bezier(0.25,0.8,0.25,1)]\n}\n\n.p-drawer-left .p-drawer {\n @apply w-80 h-full border-r\n}\n\n.p-drawer-right .p-drawer {\n @apply w-80 h-full border-l\n}\n\n.p-drawer-top .p-drawer {\n @apply h-40 w-full border-b\n}\n\n.p-drawer-bottom .p-drawer {\n @apply h-40 w-full border-t\n}\n\n.p-drawer-left .p-drawer-content,\n.p-drawer-right .p-drawer-content,\n.p-drawer-top .p-drawer-content,\n.p-drawer-bottom .p-drawer-content {\n @apply w-full h-full\n}\n\n.p-drawer-open {\n @apply flex\n}", + "drawer": "@import './button';\n\n.p-drawer {\n @apply flex flex-col pointer-events-auto relative transition-transform duration-300\n border border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_20px_25px_-5px_rgba(0,0,0,0.1),0_8px_10px_-6px_rgba(0,0,0,0.1)]\n}\n\n.p-drawer {\n @apply [transform:translate3d(0,0,0)]\n}\n\n.p-drawer-content {\n @apply overflow-y-auto flex-grow pt-0 pb-5 px-5\n}\n\n.p-drawer-header {\n @apply flex items-center justify-between flex-shrink-0 p-5\n}\n\n.p-drawer-footer {\n @apply px-5\n}\n\n.p-drawer-title {\n @apply font-semibold text-2xl \n}\n\n.p-drawer-full .p-drawer {\n @apply transition-none transform-none w-screen h-screen max-h-full top-0 left-0\n}\n\n.p-drawer-left .p-drawer-enter-from,\n.p-drawer-left .p-drawer-leave-to {\n @apply -translate-x-full\n}\n\n.p-drawer-right .p-drawer-enter-from,\n.p-drawer-right .p-drawer-leave-to {\n @apply translate-x-full\n}\n\n.p-drawer-top .p-drawer-enter-from,\n.p-drawer-top .p-drawer-leave-to {\n @apply -translate-y-full\n}\n\n.p-drawer-bottom .p-drawer-enter-from,\n.p-drawer-bottom .p-drawer-leave-to {\n @apply translate-y-full\n}\n\n.p-drawer-full .p-drawer-enter-from,\n.p-drawer-full .p-drawer-leave-to {\n @apply opacity-0\n}\n\n.p-drawer-full .p-drawer-enter-active,\n.p-drawer-full .p-drawer-leave-active {\n @apply transition-opacity animate-duration-400 ease-[cubic-bezier(0.25,0.8,0.25,1)]\n}\n\n.p-drawer-left .p-drawer {\n @apply w-80 h-full border-r\n}\n\n.p-drawer-right .p-drawer {\n @apply w-80 h-full border-l\n}\n\n.p-drawer-top .p-drawer {\n @apply h-40 w-full border-b\n}\n\n.p-drawer-bottom .p-drawer {\n @apply h-40 w-full border-t\n}\n\n.p-drawer-left .p-drawer-content,\n.p-drawer-right .p-drawer-content,\n.p-drawer-top .p-drawer-content,\n.p-drawer-bottom .p-drawer-content {\n @apply w-full h-full\n}\n\n.p-drawer-open {\n @apply flex\n}", "fieldset": ".p-fieldset {\n @apply border border-surface-200 dark:border-surface-700 rounded-md\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n px-[1.125rem] pt-0 pb-[1.125rem]\n}\n\n.p-fieldset-legend {\n @apply border border-transparent rounded-md px-3 py-2\n transition-colors duration-200\n}\n\n.p-fieldset-toggleable > .p-fieldset-legend {\n @apply p-0\n}\n\n.p-fieldset-toggle-button {\n @apply select-none overflow-hidden relative\n flex items-center justify-center gap-2\n px-3 py-2\n border-none rounded-md\n bg-surface-0 dark:bg-surface-900\n hover:bg-surface-100 dark:hover:bg-surface-800\n text-surface-700 dark:text-surface-0\n hover:text-surface-800 dark:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-fieldset-legend-label {\n @apply font-semibold;\n}\n\n.p-fieldset-toggle-icon {\n @apply text-surface-500 dark:text-surface-400\n transition-colors duration-200\n}\n\n.p-fieldset-toggle-button:hover .p-fieldset-toggle-icon {\n @apply text-surface-600 dark:text-surface-300\n}\n\n.p-fieldset .p-fieldset-content {\n @apply p-0\n}", - "fileupload": ".p-fileupload input[type=\"file\"] {\n @apply hidden\n}\n\n.p-fileupload-advanced {\n @apply border border-surface-200 dark:border-surface-700 rounded-md \n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n}\n\n.p-fileupload-header {\n @apply flex items-center p-[1.125rem] gap-2 text-surface-700 dark:text-surface-0\n}\n\n.p-fileupload-content {\n @apply border border-transparent relative transition-colors duration-200 pt-0 px-[1.125rem] pb-[1.125rem]\n}\n\n.p-fileupload-content .p-progressbar {\n @apply w-full absolute top-0 left-0 h-1\n}\n\n.p-fileupload-file-list {\n @apply flex flex-col gap-2 mt-[1.125rem]\n}\n\n.p-fileupload-file {\n @apply flex flex-wrap items-center p-4 border-b border-surface-200 dark:border-surface-700 gap-2 last:border-b-0\n}\n\n.p-fileupload-file-info {\n @apply flex flex-col gap-2\n}\n\n.p-fileupload-file-thumbnail {\n @apply flex-shrink-0\n}\n\n.p-fileupload-file-actions {\n @apply ml-auto\n}\n\n.p-fileupload-highlight {\n @apply border border-dashed border-primary\n}\n\n.p-fileupload-advanced .p-message {\n @apply mt-0\n}\n\n.p-fileupload-basic {\n @apply flex flex-wrap items-center justify-center gap-2\n}", - "floatlabel": ".p-floatlabel {\n @apply block relative\n}\n\n.p-floatlabel label {\n @apply absolute pointer-events-none top-1/2 -translate-y-1/2 transition-all duration-200 ease-out leading-none font-medium\n left-3 text-surface-500 dark:text-surface-400\n}\n\n.p-floatlabel:has(.p-textarea) label {\n @apply top-2 translate-y-0\n}\n\n.p-floatlabel:has(.p-inputicon:first-child) label {\n @apply left-10\n}\n\n.p-floatlabel:has(.p-invalid) label {\n @apply text-red-400 dark:text-red-300\n}\n\n.p-floatlabel:has(input:focus) label,\n.p-floatlabel:has(input.p-filled) label,\n.p-floatlabel:has(input:-webkit-autofill) label,\n.p-floatlabel:has(textarea:focus) label,\n.p-floatlabel:has(textarea.p-filled) label,\n.p-floatlabel:has(.p-inputwrapper-focus) label,\n.p-floatlabel:has(.p-inputwrapper-filled) label {\n @apply -top-5 translate-y-0 text-xs font-normal\n}\n\n.p-floatlabel:has(input.p-filled) label,\n.p-floatlabel:has(textarea.p-filled) label,\n.p-floatlabel:has(.p-inputwrapper-filled) label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-floatlabel:has(input:focus) label,\n.p-floatlabel:has(input:-webkit-autofill) label,\n.p-floatlabel:has(textarea:focus) label ,\n.p-floatlabel:has(.p-inputwrapper-focus) label {\n @apply text-primary\n}\n\n.p-floatlabel-in .p-inputtext,\n.p-floatlabel-in .p-textarea,\n.p-floatlabel-in .p-select-label,\n.p-floatlabel-in .p-multiselect-label,\n.p-floatlabel-in .p-autocomplete-input-multiple,\n.p-floatlabel-in .p-cascadeselect-label,\n.p-floatlabel-in .p-treeselect-label {\n @apply pt-6 pb-2\n}\n\n.p-floatlabel-in:has(input:focus) label,\n.p-floatlabel-in:has(input.p-filled) label,\n.p-floatlabel-in:has(input:-webkit-autofill) label,\n.p-floatlabel-in:has(textarea:focus) label,\n.p-floatlabel-in:has(textarea.p-filled) label,\n.p-floatlabel-in:has(.p-inputwrapper-focus) label,\n.p-floatlabel-in:has(.p-inputwrapper-filled) label {\n @apply top-2\n}\n\n.p-floatlabel-on:has(input:focus) label,\n.p-floatlabel-on:has(input.p-filled) label,\n.p-floatlabel-on:has(input:-webkit-autofill) label,\n.p-floatlabel-on:has(textarea:focus) label,\n.p-floatlabel-on:has(textarea.p-filled) label,\n.p-floatlabel-on:has(.p-inputwrapper-focus) label,\n.p-floatlabel-on:has(.p-inputwrapper-filled) label {\n @apply top-0 -translate-y-1/2 rounded-sm bg-surface-0 dark:bg-surface-950 py-0 px-[0.125rem]\n}", + "fileupload": "@import './button';\n@import './message';\n@import './progressbar';\n\n.p-fileupload input[type=\"file\"] {\n @apply hidden\n}\n\n.p-fileupload-advanced {\n @apply border border-surface-200 dark:border-surface-700 rounded-md \n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n}\n\n.p-fileupload-header {\n @apply flex items-center p-[1.125rem] gap-2 text-surface-700 dark:text-surface-0\n}\n\n.p-fileupload-content {\n @apply border border-transparent relative transition-colors duration-200 pt-0 px-[1.125rem] pb-[1.125rem]\n}\n\n.p-fileupload-content .p-progressbar {\n @apply w-full absolute top-0 left-0 h-1\n}\n\n.p-fileupload-file-list {\n @apply flex flex-col gap-2 mt-[1.125rem]\n}\n\n.p-fileupload-file {\n @apply flex flex-wrap items-center p-4 border-b border-surface-200 dark:border-surface-700 gap-2 last:border-b-0\n}\n\n.p-fileupload-file-info {\n @apply flex flex-col gap-2\n}\n\n.p-fileupload-file-thumbnail {\n @apply flex-shrink-0\n}\n\n.p-fileupload-file-actions {\n @apply ml-auto\n}\n\n.p-fileupload-highlight {\n @apply border border-dashed border-primary\n}\n\n.p-fileupload-advanced .p-message {\n @apply mt-0\n}\n\n.p-fileupload-basic {\n @apply flex flex-wrap items-center justify-center gap-2\n}", + "floatlabel": ".p-floatlabel {\n @apply block relative\n}\n\n.p-floatlabel label {\n @apply absolute pointer-events-none top-1/2 -translate-y-1/2 transition-all duration-200 ease-out leading-none font-medium\n start-3 text-surface-500 dark:text-surface-400\n}\n\n.p-floatlabel:has(.p-textarea) label {\n @apply top-2 translate-y-0\n}\n\n.p-floatlabel:has(.p-inputicon:first-child) label {\n @apply start-10\n}\n\n.p-floatlabel:has(.p-invalid) label {\n @apply text-red-400 dark:text-red-300\n}\n\n.p-floatlabel:has(input:focus) label,\n.p-floatlabel:has(input.p-filled) label,\n.p-floatlabel:has(input:-webkit-autofill) label,\n.p-floatlabel:has(textarea:focus) label,\n.p-floatlabel:has(textarea.p-filled) label,\n.p-floatlabel:has(.p-inputwrapper-focus) label,\n.p-floatlabel:has(.p-inputwrapper-filled) label {\n @apply -top-5 translate-y-0 text-xs font-normal\n}\n\n.p-floatlabel:has(input.p-filled) label,\n.p-floatlabel:has(textarea.p-filled) label,\n.p-floatlabel:has(.p-inputwrapper-filled) label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-floatlabel:has(input:focus) label,\n.p-floatlabel:has(input:-webkit-autofill) label,\n.p-floatlabel:has(textarea:focus) label ,\n.p-floatlabel:has(.p-inputwrapper-focus) label {\n @apply text-primary\n}\n\n.p-floatlabel-in .p-inputtext,\n.p-floatlabel-in .p-textarea,\n.p-floatlabel-in .p-select-label,\n.p-floatlabel-in .p-multiselect-label,\n.p-floatlabel-in .p-autocomplete-input-multiple,\n.p-floatlabel-in .p-cascadeselect-label,\n.p-floatlabel-in .p-treeselect-label {\n @apply pt-6 pb-2\n}\n\n.p-floatlabel-in:has(input:focus) label,\n.p-floatlabel-in:has(input.p-filled) label,\n.p-floatlabel-in:has(input:-webkit-autofill) label,\n.p-floatlabel-in:has(textarea:focus) label,\n.p-floatlabel-in:has(textarea.p-filled) label,\n.p-floatlabel-in:has(.p-inputwrapper-focus) label,\n.p-floatlabel-in:has(.p-inputwrapper-filled) label {\n @apply top-2\n}\n\n.p-floatlabel-on:has(input:focus) label,\n.p-floatlabel-on:has(input.p-filled) label,\n.p-floatlabel-on:has(input:-webkit-autofill) label,\n.p-floatlabel-on:has(textarea:focus) label,\n.p-floatlabel-on:has(textarea.p-filled) label,\n.p-floatlabel-on:has(.p-inputwrapper-focus) label,\n.p-floatlabel-on:has(.p-inputwrapper-filled) label {\n @apply top-0 -translate-y-1/2 rounded-sm bg-surface-0 dark:bg-surface-950 py-0 px-[0.125rem]\n}\n", "galleria": ".p-galleria {\n @apply overflow-hidden border border-surface-200 dark:border-surface-700 rounded-md\n}\n\n.p-galleria-content {\n @apply flex flex-col\n}\n\n.p-galleria-items-container {\n @apply flex flex-col relative\n}\n\n.p-galleria-items {\n @apply relative flex h-full\n}\n\n.p-galleria-nav-button {\n @apply absolute top-1/2 inline-flex justify-center items-center overflow-hidden select-none border-none cursor-pointer\n w-12 h-12 transition-colors duration-200 p-0 -mt-12 mx-2 mb-0 rounded-full\n bg-white/10 text-surface-100 enabled:hover:bg-white/20 enabled:hover:text-surface-0 \n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-galleria-next-icon,\n.p-galleria-prev-icon {\n @apply text-2xl w-6 h-6\n}\n\n.p-galleria-prev-button {\n @apply left-0\n}\n\n.p-galleria-next-button {\n @apply right-0\n}\n\n.p-galleria-item {\n @apply flex justify-center items-center h-full w-full\n}\n\n.p-galleria-hover-navigators .p-galleria-nav-button {\n @apply pointer-events-none opacity-0 transition-opacity duration-200 ease-in-out\n}\n\n.p-galleria-hover-navigators .p-galleria-items-container:hover .p-galleria-nav-button {\n @apply pointer-events-auto opacity-100\n}\n\n.p-galleria-hover-navigators .p-galleria-items-container:hover .p-galleria-nav-button.p-disabled {\n @apply pointer-events-none\n}\n\n.p-galleria-caption {\n @apply absolute bottom-0 left-0 w-full bg-black/5 text-surface-100 p-4\n}\n\n.p-galleria-thumbnails {\n @apply flex flex-col overflow-auto flex-shrink-0\n}\n\n.p-galleria-thumbnail-nav-button {\n @apply self-center flex-grow-0 flex-shrink-0 basis-auto justify-center items-center overflow-hidden relative\n my-0 mx-2 p-0 border-none select-none cursor-pointer w-8 h-8 rounded-md transition-colors duration-200 bg-transparent \n text-surface-600 hover:bg-surface-100 hover:text-surface-700\n dark:text-surface-400 dark:hover:bg-surface-800 dark:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-galleria-thumbnail-nav-button .p-galleria-thumbnail-next-icon,\n.p-galleria-thumbnail-nav-button .p-galleria-thumbnail-prev-icon {\n @apply text-base w-4 h-4\n}\n\n.p-galleria-thumbnails-content {\n @apply flex flex-row bg-surface-0 dark:bg-surface-900 py-4 px-1\n}\n\n.p-galleria-thumbnails-viewport {\n @apply overflow-hidden w-full\n}\n\n.p-galleria-thumbnail-items {\n @apply flex\n}\n\n.p-galleria-thumbnail-item {\n @apply overflow-auto flex items-center justify-center cursor-pointer opacity-50\n}\n\n.p-galleria-thumbnail {\n @apply outline-transparent transition-opacity duration-300 hover:opacity-100\n}\n\n.p-galleria-thumbnail-item-current {\n @apply opacity-100\n}\n\n.p-galleria-thumbnails-left .p-galleria-content,\n.p-galleria-thumbnails-right .p-galleria-content {\n @apply flex-row\n}\n\n.p-galleria-thumbnails-left .p-galleria-items-container,\n.p-galleria-thumbnails-right .p-galleria-items-container {\n @apply flex-row\n}\n\n.p-galleria-thumbnails-left .p-galleria-items-container,\n.p-galleria-thumbnails-top .p-galleria-items-container {\n @apply order-2\n}\n\n.p-galleria-thumbnails-left .p-galleria-thumbnails,\n.p-galleria-thumbnails-top .p-galleria-thumbnails {\n @apply order-1\n}\n\n.p-galleria-thumbnails-left .p-galleria-thumbnails-content,\n.p-galleria-thumbnails-right .p-galleria-thumbnails-content {\n @apply flex-col flex-grow\n}\n\n.p-galleria-thumbnails-left .p-galleria-thumbnail-items,\n.p-galleria-thumbnails-right .p-galleria-thumbnail-items {\n @apply flex-col h-full\n}\n\n.p-galleria-indicator-list {\n @apply flex items-center justify-center p-4 gap-2 m-0 list-none\n}\n\n.p-galleria-indicator-button {\n @apply inline-flex items-center w-4 h-4 rounded-full m-0 p-0 border-none select-none cursor-pointer transition-colors duration-200\n bg-surface-200 hover:bg-surface-300 dark:bg-surface-700 dark:hover:bg-surface-600\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-galleria-indicator-active .p-galleria-indicator-button {\n @apply bg-primary\n}\n\n.p-galleria-indicators-left .p-galleria-items-container,\n.p-galleria-indicators-right .p-galleria-items-container {\n @apply flex-row items-center\n}\n\n.p-galleria-indicators-left .p-galleria-items,\n.p-galleria-indicators-top .p-galleria-items {\n @apply order-2\n}\n\n.p-galleria-indicators-left .p-galleria-indicator-list,\n.p-galleria-indicators-top .p-galleria-indicator-list {\n @apply order-1\n}\n\n.p-galleria-indicators-left .p-galleria-indicator-list,\n.p-galleria-indicators-right .p-galleria-indicator-list {\n @apply flex-col\n}\n\n.p-galleria-inset-indicators .p-galleria-indicator-list {\n @apply absolute flex z-10 bg-black/50\n}\n\n.p-galleria-inset-indicators .p-galleria-indicator-button {\n @apply bg-white/40 hover:bg-white/60\n}\n\n.p-galleria-inset-indicators .p-galleria-indicator-active .p-galleria-indicator-button {\n @apply bg-white/90\n}\n\n.p-galleria-inset-indicators.p-galleria-indicators-top .p-galleria-indicator-list {\n @apply top-0 left-0 w-full items-start\n}\n\n.p-galleria-inset-indicators.p-galleria-indicators-right .p-galleria-indicator-list {\n @apply right-0 top-0 h-full items-end\n}\n\n.p-galleria-inset-indicators.p-galleria-indicators-bottom .p-galleria-indicator-list {\n @apply bottom-0 left-0 w-full items-end\n}\n\n.p-galleria-inset-indicators.p-galleria-indicators-left .p-galleria-indicator-list {\n @apply left-0 top-0 h-full items-start\n}\n\n.p-galleria-mask {\n @apply fixed top-0 left-0 w-full h-full flex items-center justify-center\n}\n\n.p-galleria-close-button {\n @apply absolute top-0 right-0 flex items-center justify-center overflow-hidden m-2 rounded-full \n transition-colors duration-200 select-none cursor-pointer w-12 h-12 p-0 border-none\n bg-white/10 text-surface-50 hover:bg-white/20 hover:text-surface-0 \n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary \n}\n\n.p-galleria-close-icon {\n @apply text-2xl w-6 h-6\n}\n\n.p-galleria-mask .p-galleria-nav-button {\n @apply fixed top-1/2\n}\n\n.p-galleria-enter-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0,0,0.2,1)]\n}\n\n.p-galleria-leave-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0.4,0,0.2,1)]\n}\n\n.p-galleria-enter-from,\n.p-galleria-leave-to {\n @apply opacity-0 scale-75\n}\n\n.p-galleria-enter-active .p-galleria-nav-button {\n @apply opacity-0\n}\n\n.p-items-hidden .p-galleria-thumbnail-item {\n @apply invisible\n}\n\n.p-items-hidden .p-galleria-thumbnail-item.p-galleria-thumbnail-item-active {\n @apply visible\n}", - "global": ".p-disabled,\n.p-component:disabled {\n @apply opacity-60\n}\n\n.p-overlay-mask {\n @apply bg-black/50 text-surface-200 transition-colors duration-150\n fixed top-0 left-0 w-full h-full\n}\n\n.p-overlay-mask-enter {\n animation: p-overlay-mask-enter-animation 150ms forwards;\n}\n\n.p-overlay-mask-leave {\n animation: p-overlay-mask-leave-animation 150ms forwards;\n}\n\n@keyframes p-overlay-mask-enter-animation {\n from {\n background: transparent;\n }\n to {\n background: rgba(0,0,0,0.5);\n }\n}\n\n@keyframes p-overlay-mask-leave-animation {\n from {\n background: rgba(0,0,0,0.5);\n }\n to {\n background: transparent;\n }\n}", - "iconfield": ".p-iconfield {\n @apply relative\n}\n\n.p-inputicon {\n @apply absolute top-1/2 -mt-2 text-surface-400 leading-none\n}\n\n.p-iconfield .p-inputicon:first-child {\n @apply left-3\n}\n\n.p-iconfield .p-inputicon:last-child {\n @apply right-3\n}\n\n.p-iconfield .p-inputtext:not(:first-child) {\n @apply pl-10\n}\n\n.p-iconfield .p-inputtext:not(:last-child) {\n @apply pr-10\n}", - "iftalabel": ".p-iftalabel {\n @apply block relative\n}\n\n.p-iftalabel label {\n @apply absolute pointer-events-none top-2 transition-all ease-out duration-200 leading-none text-xs font-medium left-3 text-surface-500 dark:text-surface-400\n}\n\n.p-iftalabel .p-inputtext,\n.p-iftalabel .p-textarea,\n.p-iftalabel .p-select-label,\n.p-iftalabel .p-multiselect-label,\n.p-iftalabel .p-autocomplete-input-multiple,\n.p-iftalabel .p-cascadeselect-label,\n.p-iftalabel .p-treeselect-label {\n @apply pt-6 pb-2\n}\n\n.p-iftalabel:has(.p-invalid) label {\n @apply text-red-400 dark:text-red-300\n}\n\n.p-iftalabel:has(input:focus) label ,\n.p-iftalabel:has(input:-webkit-autofill) label,\n.p-iftalabel:has(textarea:focus) label ,\n.p-iftalabel:has(.p-inputwrapper-focus) label {\n @apply text-primary\n}\n\n.p-iftalabel .p-inputicon {\n @apply top-6 translate-y-1/4 mt-0\n}", + "iconfield": ".p-iconfield {\n @apply relative\n}\n\n.p-inputicon {\n @apply absolute top-1/2 -mt-2 text-surface-400 leading-none\n}\n\n.p-iconfield .p-inputicon:first-child {\n @apply start-3\n}\n\n.p-iconfield .p-inputicon:last-child {\n @apply end-3\n}\n\n.p-iconfield .p-inputtext:not(:first-child) {\n @apply ps-10\n}\n\n.p-iconfield .p-inputtext:not(:last-child) {\n @apply pe-10\n}\n", + "iftalabel": ".p-iftalabel {\n @apply block relative\n}\n\n.p-iftalabel label {\n @apply absolute pointer-events-none top-2 transition-all ease-out duration-200 leading-none text-xs font-medium start-3 text-surface-500 dark:text-surface-400\n}\n\n.p-iftalabel .p-inputtext,\n.p-iftalabel .p-textarea,\n.p-iftalabel .p-select-label,\n.p-iftalabel .p-multiselect-label,\n.p-iftalabel .p-autocomplete-input-multiple,\n.p-iftalabel .p-cascadeselect-label,\n.p-iftalabel .p-treeselect-label {\n @apply pt-6 pb-2\n}\n\n.p-iftalabel:has(.p-invalid) label {\n @apply text-red-400 dark:text-red-300\n}\n\n.p-iftalabel:has(input:focus) label ,\n.p-iftalabel:has(input:-webkit-autofill) label,\n.p-iftalabel:has(textarea:focus) label ,\n.p-iftalabel:has(.p-inputwrapper-focus) label {\n @apply text-primary\n}\n\n.p-iftalabel .p-inputicon {\n @apply top-6 translate-y-1/4 mt-0\n}\n", "image": ".p-image-mask {\n @apply flex items-center justify-center\n}\n\n.p-image-preview {\n @apply relative inline-flex leading-none\n}\n\n.p-image-preview-mask {\n @apply absolute left-0 top-0 w-full h-full flex items-center justify-center opacity-0\n border-none p-0 cursor-pointer bg-transparent text-surface-200 transition-all duration-200\n}\n\n.p-image-preview:hover > .p-image-preview-mask {\n @apply opacity-100 cursor-pointer bg-black/40 dark:bg-black/60\n}\n\n.p-image-preview-icon {\n @apply text-2xl w-6 h-6\n}\n\n.p-image-toolbar {\n @apply absolute top-4 right-4 left-auto bottom-auto flex z-10 p-2 bg-white/10 border border-white/20 rounded-3xl gap-2;\n}\n\n.p-image-action {\n @apply inline-flex justify-center items-center text-surface-50 bg-transparent w-12 h-12 m-0 p-0 \n border-none cursor-pointer select-none rounded-full transition-colors duration-200\n hover:text-surface-0 hover:bg-white/10\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary \n}\n\n.p-image-action .p-icon {\n @apply text-2xl h-6 w-6\n}\n\n.p-image-action.p-disabled {\n @apply pointer-events-auto\n}\n\n.p-image-original {\n @apply transition-transform duration-150 max-w-[100vw] max-h-[100vh]\n}\n\n.p-image-original-enter-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0,0,0.2,1)]\n}\n\n.p-image-original-leave-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0.4,0,0.2,1)]\n}\n\n.p-image-original-enter-from,\n.p-image-original-leave-to {\n @apply opacity-0 scale-75\n}", "imagecompare": ".p-imagecompare {\n @apply relative overflow-hidden w-full aspect-video\n}\n\n.p-imagecompare img {\n @apply w-full h-full absolute\n}\n\n.p-imagecompare img + img {\n @apply [clip-path:polygon(0_0,50%_0,50%_100%,0_100%)]\n}\n\n.p-imagecompare-slider {\n @apply relative appearance-none w-[calc(100%+1rem)] h-full -ml-2 bg-transparent outline-none transition-all duration-200\n hover:w-[calc(100%+2rem)] hover:-ml-4\n}\n\n.p-imagecompare-slider::-webkit-slider-thumb {\n @apply appearance-none h-4 w-4 bg-white/30 rounded-full bg-contain cursor-ew-resize transition-all duration-200\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-imagecompare-slider::-moz-range-thumb {\n @apply appearance-none h-4 w-4 bg-white/30 rounded-full bg-contain cursor-ew-resize transition-all duration-200\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-imagecompare-slider:hover::-webkit-slider-thumb {\n @apply bg-white/40 h-8 w-8\n}\n\n.p-imagecompare-slider:hover::-moz-range-thumb {\n @apply bg-white/40 h-8 w-8\n}", "inplace": ".p-inplace-display {\n @apply inline cursor-pointer border border-transparent px-3 py-2 rounded-md\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-inplace-display:not(.p-disabled):hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-inplace-content {\n @apply block\n}", - "inputnumber": ".p-inputnumber {\n @apply inline-flex relative\n}\n\n.p-inputnumber-button {\n @apply flex items-center justify-center flex-grow-0 flex-shrink-0 basis-auto cursor-pointer w-10\n bg-transparent enabled:hover:bg-surface-100 enabled:active:bg-surface-200\n border border-surface-300 enabled:hover:border-surface-300 enabled:active:border-surface-300\n text-surface-400 enabled:hover:text-surface-500 enabled:active:text-surface-600\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-surface-700 dark:enabled:hover:border-surface-700 dark:enabled:active:border-surface-700\n dark:text-surface-400 dark:enabled:hover:text-surface-300 dark:enabled:active:text-surface-200\n transition-colors duration-200\n}\n\n.p-inputnumber-stacked .p-inputnumber-button {\n @apply relative flex-auto border-none\n}\n\n.p-inputnumber-stacked .p-inputnumber-button-group {\n @apply flex flex-col absolute top-px right-px h-[calc(100%-2px)] z-10\n}\n\n.p-inputnumber-stacked .p-inputnumber-increment-button {\n @apply p-0 rounded-tr-[5px]\n}\n\n.p-inputnumber-stacked .p-inputnumber-decrement-button {\n @apply p-0 rounded-br-[5px]\n}\n\n.p-inputnumber-horizontal .p-inputnumber-increment-button {\n @apply order-3 rounded-r-md border-l-0\n}\n\n.p-inputnumber-horizontal .p-inputnumber-input {\n @apply order-2 rounded-none\n}\n\n.p-inputnumber-horizontal .p-inputnumber-decrement-button {\n @apply order-1 rounded-l-md border-r-0\n}\n\n.p-floatlabel:has(.p-inputnumber-horizontal) label {\n @apply ms-10\n}\n\n.p-inputnumber-vertical {\n @apply flex-col\n}\n\n.p-inputnumber-vertical .p-inputnumber-button {\n @apply py-2\n}\n\n.p-inputnumber-vertical .p-inputnumber-increment-button {\n @apply order-1 rounded-t-md w-full border-b-0\n}\n\n.p-inputnumber-vertical .p-inputnumber-input {\n @apply order-2 rounded-none text-center\n}\n\n.p-inputnumber-vertical .p-inputnumber-decrement-button {\n @apply order-3 rounded-b-md w-full border-t-0\n}\n\n.p-inputnumber-input {\n @apply flex-auto\n}\n\n.p-inputnumber-fluid {\n @apply w-full\n}\n\n.p-inputnumber-fluid .p-inputnumber-input {\n @apply w-[1%]\n}\n\n.p-inputnumber-fluid.p-inputnumber-vertical .p-inputnumber-input {\n @apply w-full\n}", - "inputotp": ".p-inputotp {\n @apply flex items-center gap-2\n}\n\n.p-inputotp-input {\n @apply text-center w-10\n}", + "inputgroup": ".p-inputgroup,\n.p-inputgroup .p-floatlabel,\n.p-inputgroup .p-iftalabel {\n @apply flex items-stretch w-full\n}\n\n.p-inputgroup .p-inputtext,\n.p-inputgroup .p-inputwrapper {\n @apply flex-auto w-[1%]\n}\n\n.p-inputgroupaddon {\n @apply flex items-center justify-center p-2 min-w-10\n border-y border-surface-300 dark:border-surface-700\n bg-surface-0 dark:bg-surface-950 text-surface-400\n}\n\n.p-inputgroupaddon:first-child,\n.p-inputgroupaddon + .p-inputgroupaddon {\n @apply border-s\n}\n\n.p-inputgroupaddon:last-child {\n @apply border-e\n}\n\n.p-inputgroup > .p-component,\n.p-inputgroup > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-floatlabel > .p-component,\n.p-inputgroup > .p-floatlabel > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-iftalabel > .p-component,\n.p-inputgroup > .p-iftalabel > .p-inputwrapper > .p-component {\n @apply rounded-none m-0\n}\n\n.p-inputgroupaddon:first-child,\n.p-inputgroup > .p-component:first-child,\n.p-inputgroup > .p-inputwrapper:first-child > .p-component,\n.p-inputgroup > .p-floatlabel:first-child > .p-component,\n.p-inputgroup > .p-floatlabel:first-child > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-iftalabel:first-child > .p-component,\n.p-inputgroup > .p-iftalabel:first-child > .p-inputwrapper > .p-component {\n @apply rounded-s-md\n}\n\n.p-inputgroupaddon:last-child,\n.p-inputgroup > .p-component:last-child,\n.p-inputgroup > .p-inputwrapper:last-child > .p-component,\n.p-inputgroup > .p-floatlabel:last-child > .p-component,\n.p-inputgroup > .p-floatlabel:last-child > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-iftalabel:last-child > .p-component,\n.p-inputgroup > .p-iftalabel:last-child > .p-inputwrapper > .p-component {\n @apply rounded-e-md\n}\n\n.p-inputgroup .p-component:focus,\n.p-inputgroup .p-component.p-focus,\n.p-inputgroup .p-inputwrapper-focus,\n.p-inputgroup .p-component:focus ~ label,\n.p-inputgroup .p-component.p-focus ~ label,\n.p-inputgroup .p-inputwrapper-focus ~ label {\n @apply z-10\n}\n\n.p-inputgroup > .p-button:not(.p-button-icon-only) {\n @apply w-auto\n}\n", + "inputnumber": "@import './inputtext';\n\n.p-inputnumber {\n @apply inline-flex relative\n}\n\n.p-inputnumber-button {\n @apply flex items-center justify-center flex-grow-0 flex-shrink-0 basis-auto cursor-pointer w-10\n bg-transparent enabled:hover:bg-surface-100 enabled:active:bg-surface-200\n border border-surface-300 enabled:hover:border-surface-300 enabled:active:border-surface-300\n text-surface-400 enabled:hover:text-surface-500 enabled:active:text-surface-600\n dark:bg-transparent dark:enabled:hover:bg-surface-800 dark:enabled:active:bg-surface-700\n dark:border-surface-700 dark:enabled:hover:border-surface-700 dark:enabled:active:border-surface-700\n dark:text-surface-400 dark:enabled:hover:text-surface-300 dark:enabled:active:text-surface-200\n transition-colors duration-200\n}\n\n.p-inputnumber-stacked .p-inputnumber-button {\n @apply relative flex-auto border-none\n}\n\n.p-inputnumber-stacked .p-inputnumber-button-group {\n @apply flex flex-col absolute top-px end-px h-[calc(100%-2px)] z-10\n}\n\n.p-inputnumber-stacked .p-inputnumber-increment-button {\n @apply p-0 rounded-tr-[5px]\n}\n\n.p-inputnumber-stacked .p-inputnumber-decrement-button {\n @apply p-0 rounded-br-[5px]\n}\n\n.p-inputnumber-horizontal .p-inputnumber-increment-button {\n @apply order-3 rounded-e-md border-s-0\n}\n\n.p-inputnumber-horizontal .p-inputnumber-input {\n @apply order-2 rounded-none\n}\n\n.p-inputnumber-horizontal .p-inputnumber-decrement-button {\n @apply order-1 rounded-s-md border-r-0\n}\n\n.p-floatlabel:has(.p-inputnumber-horizontal) label {\n @apply ms-10\n}\n\n.p-inputnumber-vertical {\n @apply flex-col\n}\n\n.p-inputnumber-vertical .p-inputnumber-button {\n @apply py-2\n}\n\n.p-inputnumber-vertical .p-inputnumber-increment-button {\n @apply order-1 rounded-ss-md rounded-se-md w-full border-b-0\n}\n\n.p-inputnumber-vertical .p-inputnumber-input {\n @apply order-2 rounded-none text-center\n}\n\n.p-inputnumber-vertical .p-inputnumber-decrement-button {\n @apply order-3 rounded-ee-md rounded-es-md w-full border-t-0\n}\n\n.p-inputnumber-input {\n @apply flex-auto\n}\n\n.p-inputnumber-fluid {\n @apply w-full\n}\n\n.p-inputnumber-fluid .p-inputnumber-input {\n @apply w-[1%]\n}\n\n.p-inputnumber-fluid.p-inputnumber-vertical .p-inputnumber-input {\n @apply w-full\n}\n", + "inputotp": "@import './inputtext';\n\n.p-inputotp {\n @apply flex items-center gap-2\n}\n\n.p-inputotp-input {\n @apply text-center w-10\n}", "inputtext": ".p-inputtext {\n @apply appearance-none rounded-md\n border border-surface-300 dark:border-surface-700 \n enabled:hover:border-surface-400 dark:enabled:hover:border-surface-600\n enabled:focus:border-primary\n bg-surface-0 dark:bg-surface-950\n text-surface-700 dark:text-surface-0\n disabled:bg-surface-200 disabled:text-surface-500 dark:disabled:bg-surface-700 dark:disabled:text-surface-400 disabled:opacity-100\n placeholder:text-surface-500 dark:placeholder:text-surface-400\n px-3 py-2\n transition-colors duration-200\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n outline-none\n}\n\n.p-inputtext.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-inputtext.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-inputtext-sm {\n @apply text-sm px-[0.625rem] py-[0.375rem]\n}\n\n.p-inputtext-lg {\n @apply text-lg px-[0.875rem] py-[0.625rem]\n}\n\n.p-inputtext-fluid {\n @apply w-full\n}", "knob": ".p-knob-range {\n @apply fill-none transition-[stroke] duration-100 ease-in\n}\n\n.p-knob-text {\n @apply text-xl text-center\n}\n\n.p-knob svg {\n @apply rounded-full\n transition-colors duration-200\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-knob svg path:first-child {\n @apply stroke-surface-200 dark:stroke-surface-700\n}\n\n.p-knob svg path + path {\n @apply stroke-primary\n}\n\n.p-knob svg text {\n @apply fill-surface-500 dark:fill-surface-400\n}\n\n.p-knob-value {\n animation-name: p-knob-dash-frame;\n animation-fill-mode: forwards;\n fill: none;\n}\n\n@keyframes p-knob-dash-frame {\n 100% {\n stroke-dashoffset: 0;\n }\n}", - "listbox": ".p-listbox {\n @apply bg-surface-0 dark:bg-surface-950 text-surface-700 dark:text-surface-0\n border border-surface-300 dark:border-surface-700 rounded-md\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-listbox.p-focus {\n @apply border-primary\n}\n\n.p-listbox.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-listbox.p-disabled .p-listbox-option {\n @apply text-surface-500 dark:text-surface-400 cursor-default\n}\n\n.p-listbox.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-listbox-header {\n @apply pt-2 pb-1 px-4\n}\n\n.p-listbox-filter {\n @apply w-full\n}\n\n.p-listbox-list-container {\n @apply overflow-auto\n}\n\n.p-listbox-list {\n @apply list-none m-0 p-1 outline-none flex flex-col gap-[2px]\n}\n\n.p-listbox-option {\n @apply flex items-center cursor-pointer relative overflow-hidden px-3 py-2 border-none rounded-sm\n text-surface-700 dark:text-surface-0\n transition-colors duration-200\n}\n\n.p-listbox-striped li:nth-child(even of .p-listbox-option) {\n @apply bg-surface-50 dark:bg-surface-900\n}\n\n.p-listbox .p-listbox-list .p-listbox-option.p-listbox-option-selected {\n @apply bg-highlight\n}\n\n.p-listbox:not(.p-disabled) .p-listbox-option.p-listbox-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-listbox:not(.p-disabled) .p-listbox-option:not(.p-listbox-option-selected):not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-listbox:not(.p-disabled) .p-listbox-option:not(.p-listbox-option-selected):not(.p-disabled):hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-listbox-option-check-icon {\n @apply relative -ms-[0.375rem] me-[0.375rem] text-surface-700 dark:text-surface-0\n}\n\n.p-listbox-option-group {\n @apply m-0 px-3 py-2 text-surface-500 dark:text-surface-400 font-semibold \n}\n\n.p-listbox-empty-message {\n @apply px-3 py-2\n}", + "listbox": "@import './inputtext';\n@import './iconfield';\n\n.p-listbox {\n @apply bg-surface-0 dark:bg-surface-950 text-surface-700 dark:text-surface-0\n border border-surface-300 dark:border-surface-700 rounded-md\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-listbox.p-focus {\n @apply border-primary\n}\n\n.p-listbox.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-listbox.p-disabled .p-listbox-option {\n @apply text-surface-500 dark:text-surface-400 cursor-default\n}\n\n.p-listbox.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-listbox-header {\n @apply pt-2 pb-1 px-4\n}\n\n.p-listbox-filter {\n @apply w-full\n}\n\n.p-listbox-list-container {\n @apply overflow-auto\n}\n\n.p-listbox-list {\n @apply list-none m-0 p-1 outline-none flex flex-col gap-[2px]\n}\n\n.p-listbox-option {\n @apply flex items-center cursor-pointer relative overflow-hidden px-3 py-2 border-none rounded-sm\n text-surface-700 dark:text-surface-0\n transition-colors duration-200\n}\n\n.p-listbox-striped li:nth-child(even of .p-listbox-option) {\n @apply bg-surface-50 dark:bg-surface-900\n}\n\n.p-listbox .p-listbox-list .p-listbox-option.p-listbox-option-selected {\n @apply bg-highlight\n}\n\n.p-listbox:not(.p-disabled) .p-listbox-option.p-listbox-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-listbox:not(.p-disabled) .p-listbox-option:not(.p-listbox-option-selected):not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-listbox:not(.p-disabled) .p-listbox-option:not(.p-listbox-option-selected):not(.p-disabled):hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-listbox-option-check-icon {\n @apply relative -ms-[0.375rem] me-[0.375rem] text-surface-700 dark:text-surface-0\n}\n\n.p-listbox-option-group {\n @apply m-0 px-3 py-2 text-surface-500 dark:text-surface-400 font-semibold \n}\n\n.p-listbox-empty-message {\n @apply px-3 py-2\n}", "megamenu": ".p-megamenu {\n @apply relative flex items-center rounded-md gap-2\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0 \n border border-surface-200 dark:border-surface-700\n}\n\n.p-megamenu-start,\n.p-megamenu-end {\n @apply flex items-center\n}\n\n.p-megamenu-root-list {\n @apply m-0 p-0 list-none outline-none flex items-center flex-wrap gap-2\n}\n\n.p-megamenu-root-list > .p-megamenu-item > .p-menumegamenubar-item-content {\n @apply rounded-md\n}\n\n.p-megamenu-root-list > .p-megamenu-item > .p-megamenu-item-content > .p-megamenu-item-link {\n @apply px-3 py-2\n}\n\n.p-megamenu-item-content {\n @apply transition-colors duration-200 rounded-sm text-surface-700 dark:text-surface-0\n}\n\n.p-megamenu-item-link {\n @apply cursor-pointer flex items-center no-underline overflow-hidden relative text-inherit\n px-3 py-2 gap-2 select-none outline-none\n}\n\n.p-megamenu-item-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-megamenu-submenu-icon {\n @apply text-surface-400 dark:text-surface-500 ml-auto text-sm w-[0.875rem] h-[0.875rem]\n}\n\n.p-megamenu-item.p-focus > .p-megamenu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-megamenu-item.p-focus > .p-megamenu-item-content .p-megamenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-megamenu-item.p-focus > .p-megamenu-item-content .p-megamenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-megamenu-item:not(.p-disabled) > .p-megamenu-item-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-megamenu-item:not(.p-disabled) > .p-megamenu-item-content:hover .p-megamenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-megamenu-item:not(.p-disabled) > .p-megamenu-item-content:hover .p-megamenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-megamenu-item-active > .p-megamenu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-megamenu-item-active > .p-megamenu-item-content .p-megamenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-megamenu-item-active > .p-megamenu-item-content .p-megamenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-megamenu-overlay {\n @apply hidden absolute w-auto z-10 left-0 min-w-full rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-megamenu-root-list > .p-megamenu-item-active > .p-megamenu-overlay {\n @apply block\n}\n\n.p-megamenu-submenu {\n @apply m-0 p-1 list-none min-w-52 flex flex-col gap-[2px]\n}\n\n.p-megamenu-submenu-label {\n @apply px-3 py-2 text-surface-500 dark:text-surface-400 font-semibold bg-transparent\n}\n\n.p-megamenu-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-megamenu-horizontal {\n @apply items-center px-3 py-2\n}\n\n.p-megamenu-horizontal .p-megamenu-root-list {\n @apply flex items-center flex-wrap gap-2\n}\n\n.p-megamenu-horizontal .p-megamenu-end {\n @apply ml-auto self-center\n}\n\n.p-megamenu-vertical {\n @apply inline-flex min-w-52 flex-col items-stretch p-1\n}\n\n.p-megamenu-vertical .p-megamenu-root-list {\n @apply items-stretch flex-col gap-[2px]\n}\n\n.p-megamenu-vertical .p-megamenu-root-list > .p-megamenu-item-active > .p-megamenu-overlay {\n @apply left-full top-0\n}\n\n.p-megamenu-vertical .p-megamenu-root-list > .p-megamenu-item > .p-megamenu-item-content .p-megamenu-submenu-icon {\n @apply ml-auto\n}\n\n.p-megamenu-grid {\n @apply flex\n}\n\n.p-megamenu-col-2,\n.p-megamenu-col-3,\n.p-megamenu-col-4,\n.p-megamenu-col-6,\n.p-megamenu-col-12 {\n @apply flex-grow-0 flex-shrink-0 basis-auto p-2\n}\n\n.p-megamenu-col-2 {\n @apply w-1/6;\n}\n\n.p-megamenu-col-3 {\n @apply w-1/4\n}\n\n.p-megamenu-col-4 {\n @apply w-1/3\n}\n\n.p-megamenu-col-6 {\n @apply w-1/2\n}\n\n.p-megamenu-col-12 {\n @apply w-full\n}\n\n.p-megamenu-button {\n @apply hidden justify-center items-center cursor-pointer w-7 h-7 relative border-none rounded-full\n text-surface-500 dark:text-surface-400 hover:text-surface-600 dark:hover:text-surface-300\n bg-transparent hover:bg-surface-100 dark:hover:bg-surface-800\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-megamenu-mobile {\n @apply flex\n}\n\n.p-megamenu-mobile .p-megamenu-button {\n @apply flex\n}\n\n.p-megamenu-mobile .p-megamenu-root-list {\n @apply absolute hidden flex-col top-full left-0 z-10 w-full p-1 gap-[2px]\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-megamenu-mobile-active .p-megamenu-root-list {\n @apply flex\n}\n\n.p-megamenu-mobile .p-megamenu-root-list .p-megamenu-item {\n @apply w-full static\n}\n\n.p-megamenu-mobile .p-megamenu-overlay {\n @apply static border-none rounded-none shadow-none\n}\n\n.p-megamenu-mobile .p-megamenu-grid {\n @apply flex-wrap overflow-auto max-h-[90%]\n}\n\n.p-megamenu-mobile .p-megamenu-root-list > .p-megamenu-item > .p-megamenu-item-content .p-megamenu-submenu-icon {\n @apply ml-auto transition-transform duration-[200ms]\n}\n\n.p-megamenu-mobile .p-megamenu-root-list > .p-megamenu-item-active > .p-megamenu-item-content .p-megamenu-submenu-icon {\n @apply -rotate-180\n}", "menu": ".p-menu {\n @apply bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0 \n border border-surface-200 dark:border-surface-700\n rounded-md min-w-52\n}\n\n.p-menu-list {\n @apply m-0 p-1 list-none outline-none flex flex-col gap-[2px]\n}\n\n.p-menu-item-content {\n @apply transition-colors duration-200 rounded-sm text-surface-700 dark:text-surface-0\n}\n\n.p-menu-item-link {\n @apply cursor-pointer flex items-center no-underline overflow-hidden relative text-inherit\n px-3 py-2 gap-2 select-none outline-none\n}\n\n.p-menu-item-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-menu-item.p-focus .p-menu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0 \n}\n\n.p-menu-item.p-focus .p-menu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menu-item:not(.p-disabled) .p-menu-item-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-menu-item:not(.p-disabled) .p-menu-item-content:hover .p-menu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menu-overlay {\n @apply shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-menu-submenu-label {\n @apply bg-transparent px-3 py-2 text-surface-500 dark:text-surface-400 font-semibold\n}\n\n.p-menu-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}", "menubar": ".p-menubar {\n @apply flex items-center rounded-md px-3 py-2 gap-2\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0 \n border border-surface-200 dark:border-surface-700\n}\n\n.p-menubar-start,\n.p-megamenu-end {\n @apply flex items-center\n}\n\n.p-menubar-root-list,\n.p-menubar-submenu {\n @apply flex m-0 p-0 list-none outline-none\n}\n\n.p-menubar-root-list {\n @apply items-center flex-wrap gap-2\n}\n\n.p-menubar-root-list > .p-menubar-item > .p-menubar-item-content {\n @apply rounded-md\n}\n\n.p-menubar-root-list > .p-menubar-item > .p-menubar-item-content > .p-menubar-item-link {\n @apply px-3 py-2\n}\n\n.p-menubar-item-content {\n @apply transition-colors duration-200 rounded-sm text-surface-700 dark:text-surface-0\n}\n\n.p-menubar-item-link {\n @apply cursor-pointer flex items-center no-underline overflow-hidden relative text-inherit\n px-3 py-2 gap-2 select-none outline-none\n}\n\n.p-menubar-item-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-menubar-submenu-icon {\n @apply text-surface-400 dark:text-surface-500 ml-auto text-sm w-[0.875rem] h-[0.875rem]\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content .p-menubar-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover .p-menubar-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover .p-menubar-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item-active > .p-menubar-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-menubar-item-active > .p-menubar-item-content .p-menubar-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-submenu {\n @apply hidden absolute min-w-52 z-10 \n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n flex-col p-1 gap-[2px] rounded-md\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-menubar-submenu .p-menubar-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-menubar-submenu .p-menubar-item {\n @apply relative \n}\n\n .p-menubar-submenu > .p-menubar-item-active > .p-menubar-submenu {\n @apply block left-full top-0 \n}\n\n.p-menubar-end {\n @apply ml-auto self-center\n}\n\n.p-menubar-button {\n @apply hidden justify-center items-center cursor-pointer w-7 h-7 relative border-none rounded-full\n text-surface-500 dark:text-surface-400 hover:text-surface-600 dark:hover:text-surface-300\n bg-transparent hover:bg-surface-100 dark:hover:bg-surface-800\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-menubar-mobile {\n @apply relative\n}\n\n.p-menubar-mobile .p-menubar-button {\n @apply flex\n}\n\n.p-menubar-mobile .p-menubar-root-list {\n @apply absolute hidden w-full flex-col top-full left-0 z-10 p-1 gap-[2px] rounded-md\n border border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content > .p-menubar-item-link {\n @apply px-3 py-3\n}\n\n.p-menubar-mobile-active .p-menubar-root-list {\n @apply flex\n}\n\n.p-menubar-mobile .p-menubar-root-list .p-menubar-item {\n @apply w-full static\n}\n\n.p-menubar-mobile .p-menubar-root-list .p-menubar-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply ml-auto transition-transform duration-[200ms]\n}\n\n.p-menubar-mobile .p-menubar-root-list > .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply -rotate-180\n}\n\n.p-menubar-mobile .p-menubar-submenu .p-menubar-submenu-icon {\n @apply transition-transform duration-200 rotate-90\n}\n\n.p-menubar-mobile .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply -rotate-90\n}\n\n.p-menubar-mobile .p-menubar-submenu {\n @apply w-full static shadow-none border-none ps-4 pe-0\n}", "message": ".p-message {\n @apply rounded-md outline outline-1\n}\n\n.p-message-content {\n @apply flex items-center px-3 py-2 gap-2 h-full\n}\n\n.p-message-icon {\n @apply flex-shrink-0\n}\n\n.p-message-close-button {\n @apply flex items-center justify-center flex-shrink-0 ms-auto overflow-hidden relative cursor-pointer select-none\n w-7 h-7 rounded-full bg-transparent transition-colors duration-200 text-inherit p-0 border-none \n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2\n}\n\n.p-message-close-icon {\n @apply text-base w-4 h-4 \n}\n\n.p-message-info {\n @apply bg-blue-50/95 outline-blue-200 text-blue-600 \n dark:bg-blue-500/15 dark:outline-blue-700/35 dark:text-blue-500 \n shadow-[0px_4px_8px_0px_theme(colors.blue.500/0.04)]\n}\n\n.p-message-info .p-message-close-button {\n @apply hover:bg-blue-100 focus-visible:outline-blue-600\n dark:hover:bg-white/5 dark:focus-visible:outline-blue-500\n}\n\n.p-message-success {\n @apply bg-green-50/95 outline-green-200 text-green-600 \n dark:bg-green-500/15 dark:outline-green-700/35 dark:text-green-500 \n shadow-[0px_4px_8px_0px_theme(colors.green.500/0.04)]\n}\n\n.p-message-success .p-message-close-button {\n @apply hover:bg-green-100 focus-visible:outline-green-600\n dark:hover:bg-white/5 dark:focus-visible:outline-green-500\n}\n\n.p-message-warn {\n @apply bg-yellow-50/95 outline-yellow-200 text-yellow-600 \n dark:bg-yellow-500/15 dark:outline-yellow-700/35 dark:text-yellow-500 \n shadow-[0px_4px_8px_0px_theme(colors.yellow.500/0.04)]\n}\n\n.p-message-warn .p-message-close-button {\n @apply hover:bg-yellow-100 focus-visible:outline-yellow-600\n dark:hover:bg-white/5 dark:focus-visible:outline-yellow-500\n}\n\n.p-message-error {\n @apply bg-red-50/95 outline-red-200 text-red-600 \n dark:bg-red-500/15 dark:outline-red-700/35 dark:text-red-500 \n shadow-[0px_4px_8px_0px_theme(colors.red.500/0.04)]\n}\n\n.p-message-error .p-message-close-button {\n @apply hover:bg-red-100 focus-visible:outline-red-600\n dark:hover:bg-white/5 dark:focus-visible:outline-red-500\n}\n\n.p-message-secondary {\n @apply bg-surface-100 outline-surface-200 text-surface-600 \n dark:bg-surface-800 dark:outline-surface-700 dark:text-surface-300 \n shadow-[0px_4px_8px_0px_rgba(0,0,0,0.04)]\n}\n\n.p-message-secondary .p-message-close-button {\n @apply hover:bg-surface-200 focus-visible:outline-surface-600\n dark:hover:bg-surface-700 dark:focus-visible:outline-surface-300\n}\n\n.p-message-contrast {\n @apply bg-surface-900 outline-surface-950 text-surface-50 \n dark:bg-surface-0 dark:outline-surface-100 dark:text-surface-950 \n shadow-[0px_4px_8px_0px_rgba(0,0,0,0.04)]\n}\n\n.p-message-contrast .p-message-close-button {\n @apply hover:bg-surface-800 focus-visible:outline-surface-50\n dark:hover:bg-surface-100 dark:focus-visible:outline-surface-950\n}\n\n.p-message-text {\n @apply text-base font-medium\n}\n\n.p-message-icon {\n @apply text-lg w-[1.125rem] h-[1.125rem]\n}\n\n.p-message-enter-from {\n @apply opacity-0\n}\n\n.p-message-enter-active {\n @apply transition-opacity duration-300\n}\n\n.p-message.p-message-leave-from {\n @apply max-h-[1000px]\n}\n\n.p-message.p-message-leave-to {\n @apply max-h-0 opacity-0 m-0\n}\n\n.p-message-leave-active {\n @apply overflow-hidden [transition:max-height_0.45s_cubic-bezier(0,1,0,1),opacity_0.3s,margin0.3s]\n}\n\n.p-message-leave-active .p-message-close-button {\n @apply opacity-0\n}", "metergroup": ".p-metergroup {\n @apply flex gap-4\n}\n\n.p-metergroup-meters {\n @apply flex bg-surface-200 dark:bg-surface-700 rounded-md\n}\n\n.p-metergroup-label-list {\n @apply flex flex-wrap m-0 p-0 list-none\n}\n\n.p-metergroup-label {\n @apply inline-flex items-center gap-2\n}\n\n.p-metergroup-label-marker {\n @apply inline-flex w-2 h-2 rounded-full\n}\n\n.p-metergroup-label-icon {\n @apply text-base w-4 h-4\n}\n\n.p-metergroup-horizontal {\n @apply flex-col\n}\n\n.p-metergroup-label-list-horizontal {\n @apply gap-4\n}\n\n.p-metergroup-horizontal .p-metergroup-meters {\n @apply h-2\n}\n\n.p-metergroup-horizontal .p-metergroup-meter:first-of-type {\n @apply rounded-l-md\n}\n\n.p-metergroup-horizontal .p-metergroup-meter:last-of-type {\n @apply rounded-r-md\n}\n\n.p-metergroup-vertical {\n @apply flex-row\n}\n\n.p-metergroup-label-list-vertical {\n @apply flex-col gap-2\n}\n\n.p-metergroup-vertical .p-metergroup-meters {\n @apply flex-col w-2 h-full\n}\n\n.p-metergroup-vertical .p-metergroup-label-list {\n @apply items-start\n}\n\n.p-metergroup-vertical .p-metergroup-meter:first-of-type {\n @apply rounded-t-md\n}\n\n.p-metergroup-vertical .p-metergroup-meter:last-of-type {\n @apply rounded-b-md\n}", - "multiselect": ".p-multiselect {\n @apply inline-flex cursor-pointer relative select-none rounded-md\n bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-multiselect:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600 \n}\n\n.p-multiselect:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-multiselect.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-multiselect.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-multiselect.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-multiselect-dropdown {\n @apply flex items-center justify-center shrink-0 bg-transparent\n text-surface-500 dark:text-surface-400 w-10 rounded-r-md\n}\n\n.p-multiselect-label-container {\n @apply overflow-hidden flex-auto\n}\n\n.p-multiselect-label {\n @apply flex items-center gap-1 whitespace-nowrap overflow-hidden text-ellipsis px-3 py-2 text-surface-700 dark:text-surface-0\n}\n\n.p-multiselect-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-multiselect.p-disabled .p-multiselect-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-multiselect-label-empty {\n @apply overflow-hidden opacity-0 \n}\n\n.p-multiselect .p-multiselect-overlay {\n @apply min-w-full\n}\n\n.p-multiselect-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-multiselect-header {\n @apply flex items-center pt-2 pb-1 px-4\n}\n\n.p-multiselect-header .p-checkbox {\n @apply mr-2\n}\n\n.p-multiselect-filter-container {\n @apply flex-auto\n}\n\n.p-multiselect-filter {\n @apply w-full\n}\n\n.p-multiselect-list-container {\n @apply overflow-auto\n}\n\n.p-multiselect-list {\n @apply m-0 p-1 list-none gap-[2px] flex flex-col\n}\n\n.p-multiselect-option {\n @apply cursor-pointer font-normal whitespace-nowrap relative overflow-hidden flex items-center gap-2 px-3 py-2\n rounded-sm text-surface-700 dark:text-surface-0 bg-transparent border-none\n transition-colors duration-200\n}\n\n.p-multiselect-option:not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-600 dark:text-surface-0\n}\n\n.p-multiselect-option-group {\n @apply m-0 px-3 py-2 bg-transparent text-surface-500 dark:text-surface-400 font-semibold\n}\n\n.p-multiselect-empty-message {\n @apply px-3 py-2\n}\n\n.p-multiselect-label .p-chip {\n @apply py-1 rounded-sm\n}\n\n.p-multiselect-label:has(.p-chip) {\n @apply py-1 px-[0.375rem]\n}\n\n.p-multiselect-fluid {\n @apply flex\n}", - "orderlist": ".p-orderlist {\n @apply flex gap-[1.125rem]\n}\n\n.p-orderlist-controls {\n @apply flex flex-col justify-center gap-2\n}", + "multiselect": "@import './checkbox';\n@import './chip';\n@import './inputtext';\n@import './iconfield';\n\n.p-multiselect {\n @apply inline-flex cursor-pointer relative select-none rounded-md\n bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-multiselect:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-multiselect:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-multiselect.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-multiselect.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-multiselect.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-multiselect-dropdown {\n @apply flex items-center justify-center shrink-0 bg-transparent\n text-surface-500 dark:text-surface-400 w-10 rounded-e-md\n}\n\n.p-multiselect-label-container {\n @apply overflow-hidden flex-auto\n}\n\n.p-multiselect-label {\n @apply flex items-center gap-1 whitespace-nowrap overflow-hidden text-ellipsis px-3 py-2 text-surface-700 dark:text-surface-0\n}\n\n.p-multiselect-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-multiselect.p-disabled .p-multiselect-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-multiselect-label-empty {\n @apply overflow-hidden opacity-0\n}\n\n.p-multiselect .p-multiselect-overlay {\n @apply min-w-full\n}\n\n.p-multiselect-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-multiselect-header {\n @apply flex items-center pt-2 pb-1 px-4\n}\n\n.p-multiselect-header .p-checkbox {\n @apply me-2\n}\n\n.p-multiselect-filter-container {\n @apply flex-auto\n}\n\n.p-multiselect-filter {\n @apply w-full\n}\n\n.p-multiselect-list-container {\n @apply overflow-auto\n}\n\n.p-multiselect-list {\n @apply m-0 p-1 list-none gap-[2px] flex flex-col\n}\n\n.p-multiselect-option {\n @apply cursor-pointer font-normal whitespace-nowrap relative overflow-hidden flex items-center gap-2 px-3 py-2\n rounded-sm text-surface-700 dark:text-surface-0 bg-transparent border-none\n transition-colors duration-200\n}\n\n.p-multiselect-option:not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-600 dark:text-surface-0\n}\n\n.p-multiselect-option-group {\n @apply m-0 px-3 py-2 bg-transparent text-surface-500 dark:text-surface-400 font-semibold\n}\n\n.p-multiselect-empty-message {\n @apply px-3 py-2\n}\n\n.p-multiselect-label .p-chip {\n @apply py-1 rounded-sm\n}\n\n.p-multiselect-label:has(.p-chip) {\n @apply py-1 px-[0.375rem]\n}\n\n.p-multiselect-fluid {\n @apply flex\n}\n", + "orderlist": "@import './button';\n@import './listbox';\n\n.p-orderlist {\n @apply flex gap-[1.125rem]\n}\n\n.p-orderlist-controls {\n @apply flex flex-col justify-center gap-2\n}", "organizationchart": ".p-organizationchart-table {\n @apply border-spacing-0 border-separate my-0 mx-auto\n}\n\n.p-organizationchart-table > tbody > tr > td {\n @apply text-center align-top py-0 px-3\n}\n\n.p-organizationchart-node {\n @apply inline-block relative py-3 px-4 rounded-md\n border border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n transition-colors duration-200\n}\n\n.p-organizationchart-node:has(.p-organizationchart-node-toggle-button) {\n @apply pt-3 px-4 pb-5\n}\n\n.p-organizationchart-node.p-organizationchart-node-selectable:not(.p-organizationchart-node-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-organizationchart-node-selected {\n @apply bg-highlight\n}\n\n.p-organizationchart-node-toggle-button {\n @apply absolute -bottom-3 -ml-3 z-20 left-1/2 select-none cursor-pointer w-6 h-6 no-underline rounded-full\n inline-flex items-center justify-center transition-colors duration-200 \n border border-surface-200 dark:border-surface-700\n bg-surface-0 text-surface-500 hover:bg-surface-100 hover:text-surface-700 \n dark:bg-surface-900 dark:text-surface-400 dark:hover:bg-surface-800 dark:hover:text-surface-0 \n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n.p-organizationchart-node-toggle-button-icon {\n @apply relative top-px\n}\n\n.p-organizationchart-connector-down {\n @apply my-0 mx-auto h-6 w-px bg-surface-200 dark:bg-surface-700\n}\n\n.p-organizationchart-connector-right {\n @apply rounded-none\n}\n\n.p-organizationchart-connector-left {\n @apply rounded-none border-r border-surface-200 dark:border-surface-700\n}\n\n.p-organizationchart-connector-top {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-organizationchart-node-selectable {\n @apply cursor-pointer\n}\n\n.p-organizationchart-connectors :nth-child(1 of .p-organizationchart-connector-left) {\n @apply border-r-0\n}\n\n.p-organizationchart-connectors :nth-last-child(1 of .p-organizationchart-connector-left) {\n @apply rounded-tr-md\n}\n\n.p-organizationchart-connectors :nth-child(1 of .p-organizationchart-connector-right) {\n @apply border-l border-surface-200 dark:border-surface-700 rounded-tl-md\n}", - "overlaybadge": ".p-overlaybadge {\n @apply relative\n}\n\n.p-overlaybadge .p-badge {\n @apply absolute top-0 right-0 translate-x-[50%] translate-y-[-50%] origin-[100%_0] m-0 outline outline-2 outline-surface-0 dark:outline-surface-900\n}", + "overlaybadge": "@import './badge';\n\n.p-overlaybadge {\n @apply relative\n}\n\n.p-overlaybadge .p-badge {\n @apply absolute top-0 right-0 translate-x-[50%] translate-y-[-50%] origin-[100%_0] m-0 outline outline-2 outline-surface-0 dark:outline-surface-900\n}", "paginator": ".p-paginator {\n @apply flex items-center justify-center flex-wrap py-2 px-4 rounded-md gap-1\n bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-paginator-content {\n @apply flex items-center justify-center flex-wrap gap-1\n}\n\n.p-paginator-content-start {\n @apply ms-auto\n}\n\n.p-paginator-content-end {\n @apply me-auto\n}\n\n.p-paginator-page,\n.p-paginator-next,\n.p-paginator-last,\n.p-paginator-first,\n.p-paginator-prev {\n @apply cursor-pointer inline-flex items-center justify-center leading-none overflow-hidden relative \n bg-transparent border-none min-w-10 h-10 transition-colors duration-200 rounded-full p-0 m-0\n text-surface-500 dark:text-surface-400\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-paginator-page:not(.p-disabled):not(.p-paginator-page-selected):hover,\n.p-paginator-first:not(.p-disabled):hover,\n.p-paginator-prev:not(.p-disabled):hover,\n.p-paginator-next:not(.p-disabled):hover,\n.p-paginator-last:not(.p-disabled):hover {\n @apply bg-surface-100 text-surface-600 dark:bg-surface-800 dark:text-surface-300\n}\n\n.p-paginator-page.p-paginator-page-selected {\n @apply bg-highlight\n}\n\n.p-paginator-current {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-paginator-pages {\n @apply flex items-center gap-1\n}\n\n.p-paginator-jtp-input .p-inputtext {\n @apply max-w-10\n}", - "panel": ".p-panel {\n @apply border border-surface-200 dark:border-surface-700 rounded-md\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-panel-header {\n @apply flex justify-between items-center p-[1.125rem]\n}\n\n.p-panel-toggleable .p-panel-header {\n @apply py-[0.375rem] px-[1.125rem]\n}\n\n.p-panel-title {\n @apply leading-none font-semibold\n}\n\n.p-panel-content {\n @apply pt-0 pb-[1.125rem] px-[1.125rem] \n}\n\n.p-panel-footer {\n @apply pt-0 pb-[1.125rem] px-[1.125rem] \n}", + "panel": "@import './button';\n\n.p-panel {\n @apply border border-surface-200 dark:border-surface-700 rounded-md\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-panel-header {\n @apply flex justify-between items-center p-[1.125rem]\n}\n\n.p-panel-toggleable .p-panel-header {\n @apply py-[0.375rem] px-[1.125rem]\n}\n\n.p-panel-title {\n @apply leading-none font-semibold\n}\n\n.p-panel-content {\n @apply pt-0 pb-[1.125rem] px-[1.125rem] \n}\n\n.p-panel-footer {\n @apply pt-0 pb-[1.125rem] px-[1.125rem] \n}", "panelmenu": ".p-panelmenu {\n @apply flex flex-col gap-2\n}\n\n.p-panelmenu-panel {\n @apply bg-surface-0 dark:bg-surface-900 rounded-md p-1\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n}\n\n.p-panelmenu-header {\n @apply outline-none\n}\n\n.p-panelmenu-header-content {\n @apply rounded-md transition-colors duration-200 text-surface-700 dark:text-surface-0\n}\n\n.p-panelmenu-header-link {\n @apply flex items-center gap-2 px-3 py-2 select-none cursor-pointer relative no-underline text-inherit\n}\n\n.p-panelmenu-header-icon,\n.p-panelmenu-item-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-panelmenu-submenu-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-panelmenu-header:not(.p-disabled):focus-visible .p-panelmenu-header-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-panelmenu-header:not(.p-disabled):focus-visible .p-panelmenu-header-content .p-panelmenu-header-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-header:not(.p-disabled):focus-visible .p-panelmenu-header-content .p-panelmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-header:not(.p-disabled) .p-panelmenu-header-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-panelmenu-header:not(.p-disabled) .p-panelmenu-header-content:hover .p-panelmenu-header-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-header:not(.p-disabled) .p-panelmenu-header-content:hover .p-panelmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-submenu {\n @apply m-0 py-0 ps-4 outline-none list-none\n}\n\n.p-panelmenu-item-link {\n @apply flex items-center gap-2 px-3 py-2 select-none cursor-pointer no-underline text-inherit relative overflow-hidden\n}\n\n.p-panelmenu-item-content {\n @apply rounded-md transition-colors duration-200 text-surface-700 dark:text-surface-0\n}\n\n.p-panelmenu-item.p-focus > .p-panelmenu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-panelmenu-item.p-focus > .p-panelmenu-item-content .p-panelmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-item.p-focus > .p-panelmenu-item-content .p-panelmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content:hover .p-panelmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content:hover .p-panelmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}", - "password": ".p-password {\n @apply inline-flex relative\n}\n\n.p-password .p-password-overlay {\n @apply min-w-full\n}\n\n.p-password-meter {\n @apply h-3 bg-surface-200 dark:bg-surface-700 rounded-md\n}\n\n.p-password-meter-label {\n @apply h-full w-0 transition-[width] duration-1000 ease-in-out rounded-md\n}\n\n.p-password-meter-weak {\n @apply bg-red-500 dark:bg-red-400\n}\n\n.p-password-meter-medium {\n @apply bg-amber-500 dark:bg-amber-400\n}\n\n.p-password-meter-strong {\n @apply bg-green-500 dark:bg-green-400\n}\n\n.p-password-fluid {\n @apply flex\n}\n\n.p-password-fluid .p-password-input {\n @apply w-full\n}\n\n.p-password-input::-ms-reveal,\n.p-password-input::-ms-clear {\n @apply hidden\n}\n\n.p-password-overlay {\n @apply p-3 rounded-md bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-password-content {\n @apply flex flex-col gap-2\n}\n\n.p-password-toggle-mask-icon {\n @apply right-3 text-surface-500 dark:text-surface-400 absolute top-1/2 -mt-2 w-4 h-4 \n}\n\n.p-password:has(.p-password-toggle-mask-icon) .p-password-input {\n @apply pr-10\n}", - "picklist": ".p-picklist {\n @apply flex gap-[1.125rem]\n}\n\n.p-picklist-controls {\n @apply flex flex-col justify-center gap-2\n}\n\n.p-picklist-list-container {\n @apply flex-grow flex-shrink basis-1/2\n}\n\n.p-picklist .p-listbox {\n @apply h-full\n}", + "password": "@import './inputtext';\n\n.p-password {\n @apply inline-flex relative\n}\n\n.p-password .p-password-overlay {\n @apply min-w-full\n}\n\n.p-password-meter {\n @apply h-3 bg-surface-200 dark:bg-surface-700 rounded-md\n}\n\n.p-password-meter-label {\n @apply h-full w-0 transition-[width] duration-1000 ease-in-out rounded-md\n}\n\n.p-password-meter-weak {\n @apply bg-red-500 dark:bg-red-400\n}\n\n.p-password-meter-medium {\n @apply bg-amber-500 dark:bg-amber-400\n}\n\n.p-password-meter-strong {\n @apply bg-green-500 dark:bg-green-400\n}\n\n.p-password-fluid {\n @apply flex\n}\n\n.p-password-fluid .p-password-input {\n @apply w-full\n}\n\n.p-password-input::-ms-reveal,\n.p-password-input::-ms-clear {\n @apply hidden\n}\n\n.p-password-overlay {\n @apply p-3 rounded-md bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-password-content {\n @apply flex flex-col gap-2\n}\n\n.p-password-toggle-mask-icon {\n @apply right-3 text-surface-500 dark:text-surface-400 absolute top-1/2 -mt-2 w-4 h-4 \n}\n\n.p-password:has(.p-password-toggle-mask-icon) .p-password-input {\n @apply pr-10\n}", + "picklist": "@import './button';\n@import './listbox';\n\n.p-picklist {\n @apply flex gap-[1.125rem]\n}\n\n.p-picklist-controls {\n @apply flex flex-col justify-center gap-2\n}\n\n.p-picklist-list-container {\n @apply flex-grow flex-shrink basis-1/2\n}\n\n.p-picklist .p-listbox {\n @apply h-full\n}", "popover": ".p-popover {\n @apply mt-[10px] bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0 \n border border-surface-200 dark:border-surface-700\n rounded-md shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n before:bottom-full before:left-5 before:h-0 before:w-0 before:absolute before:pointer-events-none\n before:border-[10px] before:-ml-[10px] before:border-transparent before:border-b-surface-200 dark:before:border-b-surface-700\n after:bottom-full after:left-5 after:h-0 after:w-0 after:absolute after:pointer-events-none\n after:border-[8px] after:-ml-[8px] after:border-transparent after:border-b-surface-0 dark:after:border-b-surface-900\n}\n\n.p-popover-content {\n @apply p-3\n}\n\n.p-popover-flipped {\n @apply -mt-[10px] mb-[10px]\n}\n\n.p-popover-enter-from {\n @apply opacity-0 scale-y-75\n}\n\n.p-popover-leave-to {\n @apply opacity-0\n}\n\n.p-popover-enter-active {\n @apply [transition:transform_120ms_cubic-bezier(0,0,0.2,1),opacity_120ms_cubic-bezier(0,0,0.2,1)]\n}\n\n.p-popover-leave-active {\n @apply transition-opacity duration-100 ease-linear\n}\n\n.p-popover-flipped:after,\n.p-popover-flipped:before {\n @apply bottom-auto top-full\n}\n\n.p-popover.p-popover-flipped:after {\n @apply border-b-transparent border-t-surface-0 dark:border-t-surface-900\n}\n\n.p-popover.p-popover-flipped:before {\n @apply border-b-transparent border-t-surface-200 dark:border-t-surface-700\n}", "progressbar": ".p-progressbar {\n @apply relative overflow-hidden h-5 bg-surface-200 dark:bg-surface-700 rounded-md\n}\n\n.p-progressbar-value {\n @apply m-0 bg-primary\n}\n\n.p-progressbar-label {\n @apply text-primary-contrast text-xs font-semibold\n}\n\n.p-progressbar-determinate .p-progressbar-value {\n @apply h-full w-0 absolute flex items-center justify-center overflow-hidden transition-[width] duration-1000 ease-in-out\n}\n\n.p-progressbar-determinate .p-progressbar-label {\n @apply inline-flex\n}\n\n.p-progressbar-indeterminate .p-progressbar-value::before {\n @apply content-[''] absolute bg-inherit top-0 left-0 bottom-0 will-change-[left,right];\n}\n\n.p-progressbar-indeterminate .p-progressbar-value::before {\n animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n}\n\n.p-progressbar-indeterminate .p-progressbar-value::after {\n @apply content-[''] absolute bg-inherit top-0 left-0 bottom-0 will-change-[left,right];\n\n}\n\n.p-progressbar-indeterminate .p-progressbar-value::after {\n animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;\n animation-delay: 1.15s;\n}\n\n@keyframes p-progressbar-indeterminate-anim {\n 0% {\n left: -35%;\n right: 100%;\n }\n 60% {\n left: 100%;\n right: -90%;\n }\n 100% {\n left: 100%;\n right: -90%;\n }\n}\n\n@keyframes p-progressbar-indeterminate-anim-short {\n 0% {\n left: -200%;\n right: 100%;\n }\n 60% {\n left: 107%;\n right: -8%;\n }\n 100% {\n left: 107%;\n right: -8%;\n }\n}", "progressspinner": ".p-progressspinner {\n @apply relative my-0 mx-auto w-[100px] h-[100px] inline-block\n before:block before:pt-[100%]\n}\n\n.p-progressspinner-spin {\n @apply h-full origin-center w-full absolute top-0 bottom-0 left-0 right-0 m-auto;\n}\n\n.p-progressspinner-spin {\n animation: p-progressspinner-rotate 2s linear infinite;\n}\n\n.p-progressspinner-circle {\n stroke-dasharray: 89, 200;\n stroke-dashoffset: 0;\n stroke: theme(colors.red.500);\n stroke-linecap: round;\n animation: p-progressspinner-dash 1.5s ease-in-out infinite, p-progressspinner-color 6s ease-in-out infinite;\n}\n\n@keyframes p-progressspinner-rotate {\n 100% {\n transform: rotate(360deg);\n }\n}\n\n@keyframes p-progressspinner-dash {\n 0% {\n stroke-dasharray: 1, 200;\n stroke-dashoffset: 0;\n }\n 50% {\n stroke-dasharray: 89, 200;\n stroke-dashoffset: -35px;\n }\n 100% {\n stroke-dasharray: 89, 200;\n stroke-dashoffset: -124px;\n }\n}\n\n@keyframes p-progressspinner-color {\n 100%,\n 0% {\n stroke: theme(colors.red.500);\n }\n 40% {\n stroke: theme(colors.blue.500);\n }\n 66% {\n stroke: theme(colors.green.500);\n }\n 80%,\n 90% {\n stroke: theme(colors.yellow.500);\n }\n}", - "radiobutton": ".p-radiobutton {\n @apply relative inline-flex select-none w-5 h-5\n}\n\n.p-radiobutton-input {\n @apply cursor-pointer disabled:cursor-default appearance-none absolute left-0 top-0 w-full h-full m-0 p-0 opacity-0 z-10\n border border-transparent rounded-full\n}\n\n.p-radiobutton-box {\n @apply flex justify-center items-center rounded-full\n border border-surface-300 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-950\n w-5 h-5\n transition-colors duration-200\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n}\n\n.p-radiobutton-icon {\n @apply bg-transparent text-xs w-3 h-3 rounded-full\n transition-colors duration-200\n backface-hidden\n}\n\n.p-radiobutton-icon {\n transform: translateZ(0) scale(0.1);\n}\n\n.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-radiobutton-checked .p-radiobutton-box {\n @apply border-primary bg-primary\n}\n\n.p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {\n @apply bg-primary-contrast visible\n}\n\n.p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {\n transform: translateZ(0) scale(1, 1);\n}\n\n.p-radiobutton-checked:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {\n @apply border-primary-emphasis bg-primary-emphasis\n}\n\n.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:hover).p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {\n @apply bg-primary-contrast\n}\n\n.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:focus-visible) .p-radiobutton-box {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-radiobutton.p-invalid > .p-radiobutton-box {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-radiobutton.p-variant-filled .p-radiobutton-box {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-radiobutton.p-disabled {\n @apply opacity-100\n}\n\n.p-radiobutton.p-disabled .p-radiobutton-box {\n @apply bg-surface-200 dark:bg-surface-400\n border-surface-300 dark:border-surface-700\n}\n\n.p-radiobutton-checked.p-disabled .p-radiobutton-box .p-radiobutton-icon {\n @apply bg-surface-700 dark:bg-surface-400\n}", + "radiobutton": ".p-radiobutton {\n @apply relative inline-flex select-none w-5 h-5\n}\n\n.p-radiobutton-input {\n @apply cursor-pointer disabled:cursor-default appearance-none absolute left-0 top-0 w-full h-full m-0 p-0 opacity-0 z-10\n border border-transparent rounded-full\n}\n\n.p-radiobutton-box {\n @apply flex justify-center items-center rounded-full\n border border-surface-300 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-950\n w-5 h-5\n transition-colors duration-200\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n}\n\n.p-radiobutton-icon {\n @apply bg-transparent text-xs w-3 h-3 rounded-full\n transition-all duration-200 backface-hidden\n}\n\n.p-radiobutton-icon {\n @apply scale-[0.1]\n}\n\n.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-radiobutton-checked .p-radiobutton-box {\n @apply border-primary bg-primary\n}\n\n.p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {\n @apply bg-primary-contrast visible\n}\n\n.p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {\n @apply scale-100\n}\n\n.p-radiobutton-checked:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {\n @apply border-primary-emphasis bg-primary-emphasis\n}\n\n.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:hover).p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {\n @apply bg-primary-contrast\n}\n\n.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:focus-visible) .p-radiobutton-box {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-radiobutton.p-invalid > .p-radiobutton-box {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-radiobutton.p-variant-filled .p-radiobutton-box {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-radiobutton.p-disabled {\n @apply opacity-100\n}\n\n.p-radiobutton.p-disabled .p-radiobutton-box {\n @apply bg-surface-200 dark:bg-surface-400\n border-surface-300 dark:border-surface-700\n}\n\n.p-radiobutton-checked.p-disabled .p-radiobutton-box .p-radiobutton-icon {\n @apply bg-surface-700 dark:bg-surface-400\n}", "rating": ".p-rating {\n @apply relative flex items-center gap-1\n}\n\n.p-rating-option {\n @apply inline-flex items-center cursor-pointer rounded-full\n}\n\n.p-rating-option.p-focus-visible {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-rating-icon {\n @apply text-surface-500 dark:text-surface-400 text-base w-4 h-4 transition-colors duration-200\n}\n\n.p-rating:not(.p-disabled):not(.p-readonly) .p-rating-option:hover .p-rating-icon {\n @apply text-primary\n}\n\n.p-rating-option-active .p-rating-icon {\n @apply text-primary\n}", "ripple": ".p-ink {\n @apply block absolute bg-black/10 dark:bg-white/30 scale-0 rounded-[100%] pointer-events-none\n}\n\n.p-ink-active {\n @apply transition-[opacity,transform] duration-500 scale-[2.5] opacity-0 ease-linear\n}", "scrollpanel": ".p-scrollpanel-content-container {\n @apply overflow-hidden w-full h-full relative z-10 float-left\n}\n\n.p-scrollpanel-content {\n @apply relative overflow-auto \n h-[calc(100%+18px)] w-[calc(100%+18px)]\n pt-0 pl-0 pr-[18px] pb-[18px] [scrollbar-width:none]\n}\n\n.p-scrollpanel-content::-webkit-scrollbar {\n @apply hidden\n}\n\n.p-scrollpanel-bar {\n @apply relative rounded-sm z-20 cursor-pointer opacity-0 \n bg-surface-100 dark:bg-surface-800\n transition-opacity duration-200 border-none\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-scrollpanel-bar-y {\n @apply w-[9px] top-0\n}\n\n.p-scrollpanel-bar-x {\n @apply h-[9px] bottom-0\n}\n\n.p-scrollpanel-hidden {\n @apply invisible\n}\n\n.p-scrollpanel:hover .p-scrollpanel-bar,\n.p-scrollpanel:active .p-scrollpanel-bar {\n @apply opacity-100\n}\n\n.p-scrollpanel-grabbed {\n @apply select-none\n}", - "scrolltop": ".p-scrolltop.p-button {\n @apply fixed bottom-5 right-5\n}\n\n.p-scrolltop-sticky.p-button {\n @apply sticky flex ml-auto\n}\n\n.p-scrolltop-enter-from {\n @apply opacity-0\n}\n\n.p-scrolltop-enter-active {\n @apply transition-opacity duration-150\n}\n\n.p-scrolltop.p-scrolltop-leave-to {\n @apply opacity-0\n}\n\n.p-scrolltop-leave-active {\n @apply transition-opacity duration-150\n}", - "select": ".p-select {\n @apply inline-flex cursor-pointer relative select-none rounded-md\n bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-select:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-select:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-select.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-select.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-select.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-select-clear-icon {\n @apply absolute top-1/2 -mt-2 text-surface-500 dark:text-surface-400 right-10\n}\n\n.p-select-dropdown {\n @apply flex items-center justify-center shrink-0 bg-transparent\n text-surface-500 dark:text-surface-400 w-10 rounded-r-md\n}\n\n.p-select-label {\n @apply block whitespace-nowrap overflow-hidden flex-auto w-[1%]\n py-2 px-3 overflow-ellipsis\n text-surface-700 dark:text-surface-0 bg-transparent border-none outline-none\n}\n\n.p-select-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-select:has(.p-select-clear-icon) .p-select-label {\n @apply pr-7\n}\n\n.p-select.p-disabled .p-select-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-select-label-empty {\n @apply overflow-hidden opacity-0 \n}\n\ninput.p-select-label {\n @apply cursor-default\n}\n\n.p-select .p-select-overlay {\n @apply min-w-full\n}\n\n.p-select-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-select-header {\n @apply pt-2 pb-1 px-4\n}\n\n.p-select-filter {\n @apply w-full\n}\n\n.p-select-list-container {\n @apply overflow-auto\n}\n\n.p-select-option-group {\n @apply m-0 px-3 py-2 bg-transparent text-surface-500 dark:text-surface-400 font-semibold\n}\n\n.p-select-list {\n @apply m-0 p-1 list-none gap-[2px] flex flex-col\n}\n\n.p-select-option {\n @apply cursor-pointer font-normal whitespace-nowrap relative overflow-hidden flex items-center\n px-3 py-2 border-none text-surface-700 dark:text-surface-0 bg-transparent rounded-sm\n transition-colors duration-200 \n}\n\n.p-select-option:not(.p-select-option-selected):not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-select-option.p-select-option-selected {\n @apply bg-highlight\n}\n\n.p-select-option.p-select-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-select-option-check-icon {\n @apply relative -ms-[0.375rem] me-[0.375rem] text-surface-700 dark:text-surface-0\n}\n\n.p-select-empty-message {\n @apply px-3 py-2\n}\n\n.p-select-fluid {\n @apply flex\n}", - "selectbutton": ".p-selectbutton {\n @apply inline-flex select-none rounded-md\n}\n\n.p-selectbutton .p-togglebutton {\n @apply rounded-none border-y border-r border-l-0\n}\n\n.p-selectbutton .p-togglebutton:focus-visible {\n @apply relative z-10\n}\n\n.p-selectbutton .p-togglebutton:first-child {\n @apply border-l rounded-l-md\n}\n\n.p-selectbutton .p-togglebutton:last-child {\n @apply rounded-r-md\n}\n\n.p-selectbutton.p-invalid {\n @apply outline outline-offset-0 outline-red-400 dark:outline-red-300\n}", - "sidebar": "", + "scrolltop": "@import './button';\n\n.p-scrolltop.p-button {\n @apply fixed bottom-5 right-5\n}\n\n.p-scrolltop-sticky.p-button {\n @apply sticky flex ml-auto\n}\n\n.p-scrolltop-enter-from {\n @apply opacity-0\n}\n\n.p-scrolltop-enter-active {\n @apply transition-opacity duration-150\n}\n\n.p-scrolltop.p-scrolltop-leave-to {\n @apply opacity-0\n}\n\n.p-scrolltop-leave-active {\n @apply transition-opacity duration-150\n}", + "select": "@import './button';\n@import './inputtext';\n@import './iconfield';\n\n.p-select {\n @apply inline-flex cursor-pointer relative select-none rounded-md\n bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-select:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-select:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-select.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-select.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-select.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-select-clear-icon {\n @apply absolute top-1/2 -mt-2 text-surface-500 dark:text-surface-400 right-10\n}\n\n.p-select-dropdown {\n @apply flex items-center justify-center shrink-0 bg-transparent\n text-surface-500 dark:text-surface-400 w-10 rounded-r-md\n}\n\n.p-select-label {\n @apply block whitespace-nowrap overflow-hidden flex-auto w-[1%]\n py-2 px-3 overflow-ellipsis\n text-surface-700 dark:text-surface-0 bg-transparent border-none outline-none\n}\n\n.p-select-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-select:has(.p-select-clear-icon) .p-select-label {\n @apply pr-7\n}\n\n.p-select.p-disabled .p-select-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-select-label-empty {\n @apply overflow-hidden opacity-0 \n}\n\ninput.p-select-label {\n @apply cursor-default\n}\n\n.p-select .p-select-overlay {\n @apply min-w-full\n}\n\n.p-select-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-select-header {\n @apply pt-2 pb-1 px-4\n}\n\n.p-select-filter {\n @apply w-full\n}\n\n.p-select-list-container {\n @apply overflow-auto\n}\n\n.p-select-option-group {\n @apply m-0 px-3 py-2 bg-transparent text-surface-500 dark:text-surface-400 font-semibold\n}\n\n.p-select-list {\n @apply m-0 p-1 list-none gap-[2px] flex flex-col\n}\n\n.p-select-option {\n @apply cursor-pointer font-normal whitespace-nowrap relative overflow-hidden flex items-center\n px-3 py-2 border-none text-surface-700 dark:text-surface-0 bg-transparent rounded-sm\n transition-colors duration-200 \n}\n\n.p-select-option:not(.p-select-option-selected):not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-select-option.p-select-option-selected {\n @apply bg-highlight\n}\n\n.p-select-option.p-select-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-select-option-check-icon {\n @apply relative -ms-[0.375rem] me-[0.375rem] text-surface-700 dark:text-surface-0\n}\n\n.p-select-empty-message {\n @apply px-3 py-2\n}\n\n.p-select-fluid {\n @apply flex\n}", + "selectbutton": "@import './togglebutton';\n\n.p-selectbutton {\n @apply inline-flex select-none rounded-md\n}\n\n.p-selectbutton .p-togglebutton {\n @apply rounded-none border-y border-r border-l-0\n}\n\n.p-selectbutton .p-togglebutton:focus-visible {\n @apply relative z-10\n}\n\n.p-selectbutton .p-togglebutton:first-child {\n @apply border-l rounded-l-md\n}\n\n.p-selectbutton .p-togglebutton:last-child {\n @apply rounded-r-md\n}\n\n.p-selectbutton.p-invalid {\n @apply outline outline-offset-0 outline-red-400 dark:outline-red-300\n}", "skeleton": ".p-skeleton {\n @apply overflow-hidden bg-surface-200 dark:bg-surface-700 animate-pulse rounded-md\n}\n\n.p-skeleton-circle {\n @apply rounded-full\n}\n\n.p-skeleton-animation-none::after {\n @apply animate-none\n}\n", "slider": ".p-slider {\n @apply relative bg-surface-200 dark:bg-surface-700 rounded-sm\n}\n\n.p-slider-handle {\n @apply cursor-grab touch-none flex items-center justify-center h-[20px] w-[20px]\n bg-surface-200 dark:bg-surface-700 rounded-full\n transition-colors duration-200\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n before:w-[16px] before:h-[16px] before:block before:rounded-full\n before:bg-surface-0 dark:before:bg-surface-950\n before:shadow-[0px_0.5px_0px_0px_rgba(0,0,0,0.08),0px_1px_1px_0px_rgba(0,0,0,0.14)]\n before:transition-colors before:duration-200\n}\n\n.p-slider-range {\n @apply block bg-primary rounded-sm\n}\n\n.p-slider.p-slider-horizontal {\n @apply h-[3px]\n}\n\n.p-slider-horizontal .p-slider-range {\n @apply top-0 left-0 h-full\n}\n\n.p-slider-horizontal .p-slider-handle {\n @apply top-1/2 -mt-[10px] -ml-[10px]\n}\n\n.p-slider-vertical {\n @apply min-h-[100px] w-[3px]\n}\n\n.p-slider-vertical .p-slider-handle {\n @apply left-1/2 -mb-[10px] -ml-[10px]\n}\n\n.p-slider-vertical .p-slider-range {\n @apply bottom-0 left-0 w-full\n}", - "speeddial": ".p-speeddial {\n @apply static flex gap-2\n}\n\n.p-speeddial-button {\n @apply z-10\n}\n\n.p-speeddial-button.p-speeddial-rotate {\n @apply [transition:transform_250ms_cubic-bezier(0.4,0,0.2,1)_0ms,background_200ms,color_200ms,border-color_200ms] will-change-transform \n}\n\n.p-speeddial-list {\n @apply m-0 p-0 list-none flex items-center justify-center pointer-events-none outline-none z-20 gap-2\n transition-[top] ease-linear duration-200 \n}\n\n.p-speeddial-item {\n @apply scale-0 opacity-0 [transition:transform_200ms_cubic-bezier(0.4,0,0.2,1)_0ms,opacity_0.8s] will-change-transform\n}\n\n.p-speeddial-circle .p-speeddial-item,\n.p-speeddial-semi-circle .p-speeddial-item,\n.p-speeddial-quarter-circle .p-speeddial-item {\n @apply absolute\n}\n\n.p-speeddial-mask {\n @apply absolute left-0 top-0 w-full h-full opacity-0 bg-white/40 dark:bg-white/60 rounded-md transition-opacity duration-150\n}\n\n.p-speeddial-mask-visible {\n @apply pointer-events-none opacity-100 transition-opacity duration-150\n}\n\n.p-speeddial-open .p-speeddial-list {\n @apply pointer-events-auto\n}\n\n.p-speeddial-open .p-speeddial-item {\n @apply scale-100 opacity-100\n}\n\n.p-speeddial-open .p-speeddial-rotate {\n @apply rotate-45\n}", - "splitbutton": ".p-splitbutton {\n @apply inline-flex relative rounded-md\n}\n\n.p-splitbutton-button {\n @apply rounded-r-none border-r-0 enabled:hover:border-r-0 enabled:active:border-r-0 focus-visible:z-10\n}\n\n.p-splitbutton-dropdown {\n @apply rounded-l-none focus-visible:z-10\n}\n\n.p-splitbutton .p-menu {\n @apply min-w-full\n}\n\n.p-splitbutton-fluid {\n @apply w-full\n}\n\n.p-splitbutton-rounded .p-splitbutton-dropdown {\n @apply rounded-r-[2rem]\n}\n\n.p-splitbutton-rounded .p-splitbutton-button {\n @apply rounded-l-[2rem]\n}\n\n.p-splitbutton-raised {\n @apply shadow-[0_3px_1px_-2px_rgba(0,0,0,0.2),0_2px_2px_0_rgba(0,0,0,0.14),0_1px_5px_0_rgba(0,0,0,0.12)]\n}", + "speeddial": "@import './button';\n\n.p-speeddial {\n @apply static flex gap-2\n}\n\n.p-speeddial-button {\n @apply z-10\n}\n\n.p-speeddial-button.p-speeddial-rotate {\n @apply [transition:transform_250ms_cubic-bezier(0.4,0,0.2,1)_0ms,background_200ms,color_200ms,border-color_200ms] will-change-transform \n}\n\n.p-speeddial-list {\n @apply m-0 p-0 list-none flex items-center justify-center pointer-events-none outline-none z-20 gap-2\n transition-[top] ease-linear duration-200 \n}\n\n.p-speeddial-item {\n @apply scale-0 opacity-0 [transition:transform_200ms_cubic-bezier(0.4,0,0.2,1)_0ms,opacity_0.8s] will-change-transform\n}\n\n.p-speeddial-circle .p-speeddial-item,\n.p-speeddial-semi-circle .p-speeddial-item,\n.p-speeddial-quarter-circle .p-speeddial-item {\n @apply absolute\n}\n\n.p-speeddial-mask {\n @apply absolute left-0 top-0 w-full h-full opacity-0 bg-white/40 dark:bg-white/60 rounded-md transition-opacity duration-150\n}\n\n.p-speeddial-mask-visible {\n @apply pointer-events-none opacity-100 transition-opacity duration-150\n}\n\n.p-speeddial-open .p-speeddial-list {\n @apply pointer-events-auto\n}\n\n.p-speeddial-open .p-speeddial-item {\n @apply scale-100 opacity-100\n}\n\n.p-speeddial-open .p-speeddial-rotate {\n @apply rotate-45\n}", + "splitbutton": "@import './button';\n@import './tieredmenu';\n\n.p-splitbutton {\n @apply inline-flex relative rounded-md\n}\n\n.p-splitbutton-button {\n @apply rounded-r-none border-r-0 enabled:hover:border-r-0 enabled:active:border-r-0 focus-visible:z-10\n}\n\n.p-splitbutton-dropdown {\n @apply rounded-l-none focus-visible:z-10\n}\n\n.p-splitbutton .p-menu {\n @apply min-w-full\n}\n\n.p-splitbutton-fluid {\n @apply w-full\n}\n\n.p-splitbutton-rounded .p-splitbutton-dropdown {\n @apply rounded-r-[2rem]\n}\n\n.p-splitbutton-rounded .p-splitbutton-button {\n @apply rounded-l-[2rem]\n}\n\n.p-splitbutton-raised {\n @apply shadow-[0_3px_1px_-2px_rgba(0,0,0,0.2),0_2px_2px_0_rgba(0,0,0,0.14),0_1px_5px_0_rgba(0,0,0,0.12)]\n}", "splitter": ".p-splitter {\n @apply flex flex-wrap\n border border-surface-200 dark:border-surface-700 rounded-md\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-splitter-vertical {\n @apply flex-col\n}\n\n.p-splitter-gutter {\n @apply flex-grow-0 flex-shrink-0 flex items-center justify-center z-10 bg-surface-200 dark:bg-surface-700\n}\n\n.p-splitter-gutter-handle {\n @apply rounded-md bg-transparent \n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-splitter-horizontal.p-splitter-resizing {\n @apply cursor-col-resize select-none\n}\n\n.p-splitter-vertical.p-splitter-resizing {\n @apply cursor-row-resize select-none\n}\n\n.p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {\n @apply h-[24px] w-full\n}\n\n.p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {\n @apply w-[24px] h-full\n}\n\n.p-splitter-horizontal > .p-splitter-gutter {\n @apply cursor-col-resize\n}\n\n.p-splitter-vertical > .p-splitter-gutter {\n @apply cursor-row-resize\n}\n\n.p-splitterpanel {\n @apply flex-grow overflow-hidden\n}\n\n.p-splitterpanel-nested {\n @apply flex\n}\n\n.p-splitterpanel .p-splitter {\n @apply flex-grow border-none\n}", "stepper": ".p-steplist {\n @apply relative flex justify-between items-center m-0 p-0 list-none overflow-x-auto\n}\n\n.p-step {\n @apply relative flex flex-auto items-center gap-4 p-2 last-of-type:flex-initial\n}\n\n.p-step-header {\n @apply border-none inline-flex items-center no-underline cursor-pointer\n transition-colors duration-200 rounded-md bg-transparent p-0 gap-2\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-step.p-disabled .p-step-header {\n @apply cursor-default\n}\n\n\n.p-stepper.p-stepper-readonly .p-step {\n @apply cursor-auto\n}\n\n.p-step-title {\n @apply block whitespace-nowrap overflow-hidden text-ellipsis max-w-full\n text-surface-500 dark:text-surface-400 font-medium transition-colors duration-200\n}\n\n.p-step-number {\n @apply flex items-center justify-center text-surface-500 dark:text-surface-400\n bg-surface-0 dark:bg-surface-900 border-2 border-surface-200 dark:border-surface-700\n min-w-8 h-8 leading-8 text-lg font-medium rounded-full z-10 relative\n after:absolute after:w-full after:h-full after:rounded-full after:shadow-[0px_0.5px_0px_0px_rgba(0,0,0,0.06),0px_1px_1px_0px_rgba(0,0,0,0.12)]\n}\n\n.p-step-active .p-step-header {\n @apply cursor-default\n}\n\n.p-step-active .p-step-number {\n @apply bg-surface-0 dark:bg-surface-900 text-primary border-surface-200 dark:border-surface-700\n}\n\n.p-step-active .p-step-title {\n @apply text-primary\n}\n\n.p-step:not(.p-disabled):focus-visible {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-step:has(~ .p-step-active) .p-stepper-separator {\n @apply bg-primary\n}\n\n.p-stepper-separator {\n @apply flex-1 bg-surface-200 dark:bg-surface-700 w-full h-[2px] transition-colors duration-200\n}\n\n.p-steppanels {\n @apply pt-[0.875rem] pb-[1.125rem] px-2\n}\n\n.p-steppanel {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-stepper:has(.p-stepitem) {\n @apply flex flex-col\n}\n\n.p-stepitem {\n @apply flex flex-col flex-initial\n}\n\n.p-stepitem.p-stepitem-active {\n @apply flex-auto\n}\n\n.p-stepitem .p-step {\n @apply flex-initial\n}\n\n.p-stepitem .p-steppanel-content {\n @apply w-full pl-4\n}\n\n.p-stepitem .p-steppanel {\n @apply flex flex-auto\n}\n\n.p-stepitem .p-stepper-separator {\n @apply flex-grow-0 flex-shrink-0 basis-auto w-[2px] h-auto ml-[1.625rem] relative left-[-2.5px]\n}\n\n.p-stepitem:has(~ .p-stepitem-active) .p-stepper-separator {\n @apply bg-primary\n}\n\n.p-stepitem:last-of-type .p-steppanel {\n @apply ps-8\n}", - "tabs": ".p-tabs {\n @apply flex flex-col\n}\n\n.p-tablist {\n @apply flex relative\n}\n\n.p-tabs-scrollable > .p-tablist {\n @apply overflow-hidden\n}\n\n.p-tablist-viewport {\n @apply overflow-x-auto overflow-y-hidden overscroll-y-contain overscroll-x-auto\n}\n\n.p-tablist-viewport::-webkit-scrollbar {\n @apply hidden\n}\n\n.p-tablist-tab-list {\n @apply relative flex bg-surface-0 dark:bg-surface-900 border-b border-surface-200 dark:border-surface-700\n}\n\n.p-tablist-content {\n @apply flex-grow\n}\n\n.p-tablist-nav-button {\n @apply absolute flex-shrink-0 top-0 z-20 h-full flex items-center justify-center cursor-pointer\n bg-surface-0 dark:bg-surface-900 text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-0 w-10\n shadow-[0px_0px_10px_50px_rgba(255,255,255,0.6)] dark:shadow-[0px_0px_10px_50px] dark:shadow-surface-900/50\n focus-visible:z-10 focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-[-1px] focus-visible:outline-primary\n transition-colors duration-200 \n}\n\n.p-tablist-prev-button {\n @apply left-0\n}\n\n.p-tablist-next-button {\n @apply right-0\n}\n\n.p-tab {\n @apply flex-shrink-0 cursor-pointer select-none relative whitespace-nowrap py-4 px-[1.125rem]\n border-b border-surface-200 dark:border-surface-700 font-semibold\n text-surface-500 dark:text-surface-400\n transition-colors duration-200 -mb-px\n}\n\n.p-tab.p-disabled {\n @apply cursor-default\n}\n\n.p-tab:not(.p-disabled):focus-visible {\n @apply z-10 outline outline-1 outline-offset-[-1px] outline-primary\n}\n\n.p-tab:not(.p-tab-active):not(.p-disabled):hover {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-tab-active {\n @apply border-primary text-primary\n}\n\n.p-tabpanels {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n pt-[0.875rem] pb-[1.125rem] px-[1.125rem] outline-none\n}\n\n.p-tablist-active-bar {\n @apply z-10 block absolute -bottom-px h-px bg-primary transition-[left] duration-200 ease-[cubic-bezier(0.35,0,0.25,1)]\n}\n\n.p-tablist-viewport {\n scroll-behavior: smooth;\n scrollbar-width: none;\n}", + "tabs": ".p-tabs {\n @apply flex flex-col\n}\n\n.p-tablist {\n @apply flex relative\n}\n\n.p-tabs-scrollable > .p-tablist {\n @apply overflow-hidden\n}\n\n.p-tablist-viewport {\n @apply overflow-x-auto overflow-y-hidden overscroll-y-contain overscroll-x-auto\n}\n\n.p-tablist-viewport::-webkit-scrollbar {\n @apply hidden\n}\n\n.p-tablist-tab-list {\n @apply relative flex bg-surface-0 dark:bg-surface-900 border-b border-surface-200 dark:border-surface-700\n}\n\n.p-tablist-content {\n @apply flex-grow\n}\n\n.p-tablist-nav-button {\n @apply absolute flex-shrink-0 top-0 z-20 h-full flex items-center justify-center cursor-pointer\n bg-surface-0 dark:bg-surface-900 text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-0 w-10\n shadow-[0px_0px_10px_50px_rgba(255,255,255,0.6)] dark:shadow-[0px_0px_10px_50px] dark:shadow-surface-900/50\n focus-visible:z-10 focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-[-1px] focus-visible:outline-primary\n transition-colors duration-200 \n}\n\n.p-tablist-prev-button {\n @apply left-0\n}\n\n.p-tablist-next-button {\n @apply right-0\n}\n\n.p-tab {\n @apply flex-shrink-0 cursor-pointer select-none relative whitespace-nowrap py-4 px-[1.125rem]\n border-b border-surface-200 dark:border-surface-700 font-semibold\n text-surface-500 dark:text-surface-400\n transition-colors duration-200 -mb-px\n}\n\n.p-tab.p-disabled {\n @apply cursor-default\n}\n\n.p-tab:not(.p-disabled):focus-visible {\n @apply z-10 outline outline-1 outline-offset-[-1px] outline-primary\n}\n\n.p-tab:not(.p-tab-active):not(.p-disabled):hover {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-tab-active {\n @apply border-primary text-primary\n}\n\n.p-tabpanels {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n pt-[0.875rem] pb-[1.125rem] px-[1.125rem] outline-none\n}\n\n.p-tablist-active-bar {\n @apply z-10 block absolute -bottom-px h-px bg-primary transition-[left] duration-200 ease-[cubic-bezier(0.35,0,0.25,1)]\n}\n\n.p-tablist-viewport {\n @apply [scrollbar-behavior:smooth] [scrollbar-width:none]\n}", "tag": ".p-tag {\n @apply inline-flex items-center justify-center\n bg-primary-100 dark:bg-primary-500/15\n text-primary-700 dark:text-primary-300\n text-sm font-bold py-1 px-2 rounded-md gap-1\n}\n\n.p-tag-icon {\n @apply text-xs w-3 h-3\n}\n\n.p-tag-rounded {\n @apply rounded-2xl\n}\n\n.p-tag-success {\n @apply bg-green-100 dark:bg-green-500/15 text-green-700 dark:text-green-300\n}\n\n.p-tag-info {\n @apply bg-sky-100 dark:bg-sky-500/15 text-sky-700 dark:text-sky-300\n}\n\n.p-tag-warn {\n @apply bg-orange-100 dark:bg-orange-500/15 text-orange-700 dark:text-orange-300\n}\n\n.p-tag-danger {\n @apply bg-red-100 dark:bg-red-500/15 text-red-700 dark:text-red-300\n}\n\n.p-tag-secondary {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-600 dark:text-surface-300\n}\n\n.p-tag-contrast {\n @apply bg-surface-950 dark:bg-surface-0 text-surface-0 dark:text-surface-950\n}", + "tailwind": "@import './common';\n\n/* Form */\n@import './autocomplete';\n@import './cascadeselect';\n@import './checkbox';\n@import './colorpicker';\n@import './datepicker';\n@import './iconfield';\n@import './iftalabel';\n@import './inputgroup';\n@import './inputnumber';\n@import './inputotp';\n@import './inputtext';\n@import './floatlabel';\n@import './knob';\n@import './listbox';\n@import './multiselect';\n@import './password';\n@import './radiobutton';\n@import './rating';\n@import './select';\n@import './selectbutton';\n@import './slider';\n@import './textarea';\n@import './togglebutton';\n@import './toggleswitch';\n@import './treeselect';\n\n/* Button */\n@import './button';\n@import './buttongroup';\n@import './speeddial';\n@import './splitbutton';\n\n/* Data */\n@import './datatable';\n@import './dataview';\n@import './paginator';\n@import './picklist';\n@import './orderlist';\n@import './organizationchart';\n@import './timeline';\n@import './tree';\n@import './treetable';\n\n/* Overlay */\n@import './confirmdialog';\n@import './confirmpopup';\n@import './dialog';\n@import './drawer';\n@import './popover';\n@import './tooltip';\n\n/* Menu */\n@import './breadcrumb';\n@import './contextmenu';\n@import './dock';\n@import './menu';\n@import './menubar';\n@import './megamenu';\n@import './panelmenu';\n@import './tieredmenu';\n\n/* Panel */\n@import './accordion';\n@import './card';\n@import './divider';\n@import './fieldset';\n@import './panel';\n@import './scrollpanel';\n@import './splitter';\n@import './stepper';\n@import './tabs';\n@import './toolbar';\n\n/* File */\n@import './fileupload';\n\n/* Message */\n@import './message';\n@import './toast';\n\n/* Media */\n@import './carousel';\n@import './galleria';\n@import './image';\n@import './imagecompare';\n\n/* Misc */\n@import './avatar';\n@import './badge';\n@import './blockui';\n@import './chip';\n@import './inplace';\n@import './metergroup';\n@import './overlaybadge';\n@import './progressbar';\n@import './progressspinner';\n@import './ripple';\n@import './scrolltop';\n@import './skeleton';\n@import './tag';\n@import './terminal';\n", "terminal": ".p-terminal {\n @apply h-72 overflow-auto px-3 py-2 rounded-md\n border border-surface-300 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-950\n text-surface-700 dark:text-surface-0\n}\n\n.p-terminal-prompt {\n @apply flex items-center\n}\n\n.p-terminal-prompt-value {\n @apply flex-auto border-none bg-transparent text-inherit p-0 outline-none text-base\n}\n\n.p-terminal-prompt-label {\n @apply mr-1\n}\n\n.p-terminal-input::-ms-clear {\n @apply hidden\n}", "textarea": ".p-textarea {\n @apply appearance-none rounded-md\n border border-surface-300 dark:border-surface-700 \n enabled:hover:border-surface-400 dark:enabled:hover:border-surface-600\n enabled:focus:border-primary\n bg-surface-0 dark:bg-surface-950\n text-surface-700 dark:text-surface-0\n disabled:bg-surface-200 disabled:text-surface-500 dark:disabled:bg-surface-700 dark:disabled:text-surface-400\n placeholder:text-surface-500 dark:placeholder:text-surface-400\n px-3 py-2\n transition-colors duration-200\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n outline-none\n}\n\n.p-textarea.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-textarea.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-textarea-fluid {\n @apply w-full\n}\n\n.p-textarea-resizable {\n @apply overflow-hidden resize-none\n}", "tieredmenu": ".p-tieredmenu {\n @apply bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0 \n border border-surface-200 dark:border-surface-700\n rounded-md min-w-52\n}\n\n.p-tieredmenu-root-list,\n.p-tieredmenu-submenu {\n @apply m-0 p-1 list-none outline-none flex flex-col gap-[2px] \n}\n\n.p-tieredmenu-submenu {\n @apply absolute min-w-full z-10 rounded-md\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0 \n border border-surface-200 dark:border-surface-700\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-tieredmenu-item {\n @apply relative\n}\n\n.p-tieredmenu-item-content {\n @apply transition-colors duration-200 rounded-sm text-surface-700 dark:text-surface-0\n}\n\n.p-tieredmenu-item-link {\n @apply cursor-pointer flex items-center no-underline overflow-hidden relative text-inherit\n px-3 py-2 gap-2 select-none outline-none\n}\n\n.p-tieredmenu-item-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-tieredmenu-submenu-icon {\n @apply text-surface-400 dark:text-surface-500 ml-auto text-sm w-[0.875rem] h-[0.875rem]\n}\n\n.p-tieredmenu-item.p-focus > .p-tieredmenu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-tieredmenu-item.p-focus > .p-tieredmenu-item-content .p-tieredmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-tieredmenu-item.p-focus > .p-tieredmenu-item-content .p-tieredmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-tieredmenu-item:not(.p-disabled) > .p-tieredmenu-item-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-tieredmenu-item:not(.p-disabled) > .p-tieredmenu-item-content:hover .p-tieredmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-tieredmenu-item:not(.p-disabled) > .p-tieredmenu-item-content:hover .p-tieredmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-tieredmenu-item-active > .p-tieredmenu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-tieredmenu-item-active > .p-tieredmenu-item-content .p-tieredmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-tieredmenu-item-active > .p-tieredmenu-item-content .p-tieredmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-tieredmenu-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-tieredmenu-overlay {\n @apply shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-tieredmenu-enter-from,\n.p-tieredmenu-leave-active {\n @apply opacity-0\n}\n\n.p-tieredmenu-enter-active {\n @apply transition-opacity duration-[250ms]\n}\n\n.p-tieredmenu-mobile .p-tieredmenu-submenu {\n @apply static shadow-none border-none ps-4 pe-0\n}\n\n.p-tieredmenu-mobile .p-tieredmenu-submenu-icon {\n @apply transition-transform duration-200 rotate-90\n}\n\n.p-tieredmenu-mobile .p-tieredmenu-item-active > .p-tieredmenu-item-content .p-tieredmenu-submenu-icon {\n @apply -rotate-90\n}", @@ -81,6 +82,6 @@ "toolbar": ".p-toolbar {\n @apply flex items-center justify-between flex-wrap p-3 gap-2\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n border border-surface-200 dark:border-surface-700 rounded-md\n}\n\n.p-toolbar-start,\n.p-toolbar-center,\n.p-toolbar-end {\n @apply flex items-center\n}", "tooltip": ".p-tooltip {\n @apply absolute hidden max-w-48\n}\n\n.p-tooltip-right,\n.p-tooltip-left {\n @apply py-0 px-1\n}\n\n.p-tooltip-top,\n.p-tooltip-bottom {\n @apply py-1 px-0\n}\n\n.p-tooltip-text {\n @apply whitespace-pre-line break-words bg-surface-700 text-surface-0 py-2 px-3\n rounded-md shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-tooltip-arrow {\n @apply absolute w-0 h-0 border-solid border-transparent\n}\n\n.p-tooltip-right .p-tooltip-arrow {\n @apply -mt-1 border-[.25rem] border-l-0 border-r-surface-700\n}\n\n.p-tooltip-left .p-tooltip-arrow {\n @apply -mt-1 border-[.25rem] border-r-0 border-l-surface-700\n}\n\n.p-tooltip-top .p-tooltip-arrow {\n @apply -ml-1 border-[.25rem] border-b-0 border-t-surface-700\n}\n\n.p-tooltip-bottom .p-tooltip-arrow {\n @apply -ml-1 border-[.25rem] border-t-0 border-b-surface-700\n}", "tree": ".p-tree {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0 p-4\n}\n\n.p-tree-root-children,\n.p-tree-node-children {\n @apply flex flex-col list-none m-0 gap-[2px]\n}\n\n.p-tree-root-children {\n @apply pt-[2px] pb-0 px-0\n}\n\n.p-tree-node-children {\n @apply pt-[2px] pr-0 pb-0 pl-4\n}\n\n.p-tree-node {\n @apply p-0 outline-none\n}\n\n.p-tree-node-content {\n @apply rounded-md px-2 py-1 flex items-center text-surface-700 dark:text-surface-0 gap-1 transition-colors duration-200\n}\n\n.p-tree-node:focus-visible > .p-tree-node-content {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-tree-node-content.p-tree-node-selectable:not(.p-tree-node-selected):hover {\n @apply bg-surface-100 text-surface-700 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-tree-node-content.p-tree-node-selectable:not(.p-tree-node-selected):hover .p-tree-node-icon {\n @apply text-surface-600 dark:text-surface-300\n}\n\n.p-tree-node-content.p-tree-node-selected {\n @apply bg-highlight\n}\n\n.p-tree-node-content.p-tree-node-selected .p-tree-node-toggle-button {\n @apply text-inherit\n}\n\n.p-tree-node-toggle-button {\n @apply cursor-pointer select-none inline-flex justify-center rounded-full items-center overflow-hidden relative flex-shrink-0\n w-7 h-7 p-0 transition-colors duration-200 border-none \n bg-transparent enabled:hover:bg-surface-100 dark:enabled:hover:bg-surface-800\n text-surface-500 dark:text-surface-400 enabled:hover:text-surface-600 dark:enabled:hover:text-surface-300\n}\n\n.p-tree-node-content.p-tree-node-selected .p-tree-node-toggle-button:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-primary\n}\n\n.p-tree-root {\n @apply overflow-auto\n}\n\n.p-tree-node-selectable {\n @apply cursor-pointer select-none\n}\n\n.p-tree-node-leaf > .p-tree-node-content .p-tree-node-toggle-button {\n @apply invisible\n}\n\n.p-tree-node-icon {\n @apply text-surface-500 dark:text-surface-400 transition-colors duration-200\n}\n\n.p-tree-node-content.p-tree-node-selected .p-tree-node-icon {\n @apply text-primary\n}\n\n.p-tree-filter {\n @apply mb-2\n}\n\n.p-tree-filter-input {\n @apply w-full\n}\n\n.p-tree-loading {\n @apply relative h-full\n}\n\n.p-tree-loading-icon {\n @apply text-[2rem] h-8 w-8\n}\n\n.p-tree .p-tree-mask {\n @apply absolute z-10 flex items-center justify-center\n}\n\n.p-tree-flex-scrollable {\n @apply flex flex-1 h-full flex-col\n}\n\n.p-tree-flex-scrollable .p-tree-root {\n @apply flex-1\n}", - "treeselect": ".p-treeselect {\n @apply inline-flex cursor-pointer relative select-none rounded-md\n bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-treeselect:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-treeselect:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-treeselect.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-treeselect.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-treeselect.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-treeselect-dropdown {\n @apply flex items-center justify-center shrink-0 bg-transparent\n text-surface-500 dark:text-surface-400 w-10 rounded-r-md\n}\n\n.p-treeselect-label-container {\n @apply overflow-hidden flex-auto\n}\n\n.p-treeselect-label {\n @apply flex items-center gap-1 whitespace-nowrap text-ellipsis px-3 py-2 text-surface-700 dark:text-surface-0\n}\n\n.p-treeselect-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-treeselect.p-disabled .p-treeselect-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-treeselect-label-empty {\n @apply overflow-hidden invisible\n}\n\n.p-treeselect .p-treeselect-overlay {\n @apply min-w-full\n}\n\n.p-treeselect-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n\n.p-treeselect-tree-container {\n @apply overflow-auto\n}\n\n.p-treeselect-empty-message {\n @apply px-3 py-2\n}\n\n.p-treeselect-fluid {\n @apply flex\n}\n\n.p-treeselect-overlay .p-tree {\n @apply p-1\n}\n\n.p-treeselect-overlay .p-tree-loading {\n @apply min-h-12\n}\n\n.p-treeselect-label .p-chip {\n @apply pt-1 pb-1 rounded-sm\n}\n\n.p-treeselect-label:has(.p-chip) {\n @apply py-1 px-1\n}", - "treetable": ".p-treetable {\n @apply relative\n}\n\n.p-treetable-table {\n @apply border-spacing-0 w-full\n}\n\n.p-treetable-scrollable > .p-treetable-table-container {\n @apply relative\n}\n\n.p-treetable-scrollable-table > .p-treetable-thead {\n @apply top-0 z-10\n}\n\n.p-treetable-scrollable-table > .p-treetable-frozen-tbody {\n @apply sticky z-10\n}\n\n.p-treetable-scrollable-table>.p-treetable-tfoot {\n @apply bottom-0 z-10\n}\n\n.p-treetable-scrollable .p-treetable-frozen-column {\n @apply sticky bg-surface-0 dark:bg-surface-900\n}\n\n.p-treetable-scrollable th.p-treetable-frozen-column {\n @apply z-10\n}\n\n.p-treetable-scrollable > .p-treetable-table-container > .p-treetable-table > .p-treetable-thead {\n @apply bg-surface-0 dark:bg-surface-900\n}\n\n.p-treetable-scrollable > .p-treetable-table-container > .p-treetable-table > .p-treetable-tfoot {\n @apply bg-surface-0 dark:bg-surface-900\n}\n\n.p-treetable-flex-scrollable {\n @apply flex flex-col h-full\n}\n\n.p-treetable-flex-scrollable > .p-treetable-table-container {\n @apply flex flex-col flex-1 h-full\n}\n\n.p-treetable-scrollable-table > .p-treetable-tbody > .p-treetable-row-group-header {\n @apply sticky z-10\n}\n\n.p-treetable-resizable-table > .p-treetable-thead > tr > th,\n.p-treetable-resizable-table > .p-treetable-tfoot > tr > td,\n.p-treetable-resizable-table > .p-treetable-tbody > tr > td {\n @apply overflow-hidden whitespace-nowrap\n}\n\n.p-treetable-resizable-table > .p-treetable-thead > tr > th.p-treetable-resizable-column:not(.p-treetable-frozen-column) {\n @apply bg-clip-padding relative\n}\n\n.p-treetable-resizable-table-fit > .p-treetable-thead > tr > th.p-treetable-resizable-column:last-child .p-treetable-column-resizer {\n @apply hidden\n}\n\n.p-treetable-column-resizer {\n @apply block absolute top-0 right-0 m-0 w-2 h-full p-0 cursor-col-resize border border-transparent\n}\n\n.p-treetable-column-header-content {\n @apply flex items-center gap-2\n}\n\n.p-treetable-column-resize-indicator {\n @apply w-px absolute z-10 hidden bg-primary\n}\n\n.p-treetable-mask {\n @apply absolute flex items-center justify-center z-20\n}\n\n.p-treetable-paginator-top {\n @apply border-b border-surface-200 dark:border-surface-700\n}\n\n.p-treetable-paginator-bottom {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-treetable-header {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-treetable-footer {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-treetable-header-cell {\n @apply py-3 px-4 font-normal text-left transition-colors duration-200\n border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-treetable-column-title {\n @apply font-semibold\n}\n\n.p-treetable-tbody > tr {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0 transition-colors duration-200\n}\n\n.p-treetable-tbody > tr > td {\n @apply text-left py-3 px-4 border-b border-surface-200 dark:border-surface-800\n}\n\n.p-treetable-hoverable .p-treetable-tbody > tr:not(.p-treetable-row-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-treetable-tbody > tr.p-treetable-row-selected {\n @apply bg-highlight\n}\n\n.p-treetable-tbody > tr:has(+ .p-treetable-row-selected) > td {\n @apply border-b-primary-100 dark:border-b-primary-900\n}\n\n.p-treetable-tbody > tr.p-treetable-row-selected > td {\n @apply border-b-primary-100 dark:border-b-primary-900\n}\n\n.p-treetable-tbody > tr:focus-visible,\n.p-treetable-tbody > tr.p-treetable-contextmenu-row-selected {\n @apply outline outline-1 -outline-offset-1 outline-primary\n}\n\n.p-treetable-tfoot > tr > td {\n @apply text-left py-3 px-4 border-b border-surface-200 dark:border-surface-800 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-treetable-column-footer {\n @apply font-semibold\n}\n\n.p-treetable-sortable-column {\n @apply cursor-pointer select-none focus-visible:outline focus-visible:outline-1 focus-visible:-outline-offset-1 focus-visible:outline-primary\n}\n\n.p-treetable-column-title,\n.p-treetable-sort-icon,\n.p-treetable-sort-badge {\n @apply align-middle\n}\n\n.p-treetable-sort-icon {\n @apply text-surface-500 dark:text-surface-400 transition-colors duration-200\n}\n\n.p-treetable-sortable-column:not(.p-treetable-column-sorted):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-treetable-sortable-column:not(.p-treetable-column-sorted):hover .p-treetable-sort-icon {\n @apply text-surface-600 dark:text-surface-300\n}\n\n.p-treetable-column-sorted {\n @apply bg-highlight\n}\n\n.p-treetable-column-sorted .p-treetable-sort-icon {\n @apply bg-highlight\n}\n\n.p-treetable-hoverable .p-treetable-selectable-row {\n @apply cursor-pointer\n}\n\n.p-treetable-loading-icon {\n @apply text-[2rem] w-8 h-8\n}\n\n.p-treetable-gridlines .p-treetable-header {\n @apply border-t border-x\n}\n\n.p-treetable-gridlines .p-treetable-footer {\n @apply border-b border-x\n}\n\n.p-treetable-gridlines .p-treetable-paginator-top {\n @apply border-t border-x\n}\n\n.p-treetable-gridlines .p-treetable-paginator-bottom {\n @apply border-b border-x\n}\n\n.p-treetable-gridlines .p-treetable-thead > tr > th {\n @apply border-t border-x last:border\n}\n\n.p-treetable-gridlines .p-treetable-tbody > tr > td {\n @apply border-t border-l last:border-r\n}\n\n.p-treetable-gridlines .p-treetable-tbody > tr:last-child > td {\n @apply border-y border-l last:border\n}\n\n.p-treetable-gridlines .p-treetable-tfoot > tr > td {\n @apply border-y border-l last:border\n}\n\n.p-treetable.p-treetable-gridlines .p-treetable-thead + .p-treetable-tfoot > tr > td {\n @apply border-b border-l last:border-r\n}\n\n.p-treetable.p-treetable-gridlines:has(.p-treetable-thead):has(.p-treetable-tbody) .p-treetable-tbody > tr > td {\n @apply border-b border-l last:border-r\n}\n\n.p-treetable.p-treetable-gridlines:has(.p-treetable-tbody):has(.p-treetable-tfoot) .p-treetable-tbody > tr:last-child > td {\n @apply border-x\n}\n\n.p-treetable.p-treetable-sm .p-treetable-header {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-sm .p-treetable-footer {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-lg .p-treetable-header {\n @apply py-4 px-5\n}\n\n.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {\n @apply py-4 px-5\n}\n\n.p-treetable.p-treetable-lg .p-treetable-tbody>tr>td {\n @apply py-4 px-5\n}\n\n.p-treetable.p-treetable-lg .p-treetable-tfoot>tr>td {\n @apply py-4 px-5\n}\n\n.p-treetable.p-treetable-lg .p-treetable-footer {\n @apply py-4 px-5\n}\n\n.p-treetable-body-cell-content {\n @apply flex items-center gap-2\n}\n\n.p-treetable-tbody > tr.p-treetable-row-selected .p-treetable-node-toggle-button {\n @apply text-inherit\n}\n\n.p-treetable-node-toggle-button {\n @apply inline-flex items-center justify-center overflow-hidden relative select-none\n transition-colors duration-200 w-7 h-7 rounded-full border-none bg-transparent cursor-pointer \n enabled:hover:bg-surface-100 dark:enabled:hover:bg-surface-900\n text-surface-500 dark:text-surface-400 enabled:hover:text-surface-700 dark:enabled:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n\n}\n\n.p-treetable-tbody > tr.p-treetable-row-selected .p-treetable-node-toggle-button:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-primary\n}\n" + "treeselect": "@import './chip';\n@import './tree';\n\n.p-treeselect {\n @apply inline-flex cursor-pointer relative select-none rounded-md\n bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-treeselect:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-treeselect:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-treeselect.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-treeselect.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-treeselect.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-treeselect-dropdown {\n @apply flex items-center justify-center shrink-0 bg-transparent\n text-surface-500 dark:text-surface-400 w-10 rounded-r-md\n}\n\n.p-treeselect-label-container {\n @apply overflow-hidden flex-auto\n}\n\n.p-treeselect-label {\n @apply flex items-center gap-1 whitespace-nowrap text-ellipsis px-3 py-2 text-surface-700 dark:text-surface-0\n}\n\n.p-treeselect-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-treeselect.p-disabled .p-treeselect-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-treeselect-label-empty {\n @apply overflow-hidden invisible\n}\n\n.p-treeselect .p-treeselect-overlay {\n @apply min-w-full\n}\n\n.p-treeselect-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n\n.p-treeselect-tree-container {\n @apply overflow-auto\n}\n\n.p-treeselect-empty-message {\n @apply px-3 py-2\n}\n\n.p-treeselect-fluid {\n @apply flex\n}\n\n.p-treeselect-overlay .p-tree {\n @apply p-1\n}\n\n.p-treeselect-overlay .p-tree-loading {\n @apply min-h-12\n}\n\n.p-treeselect-label .p-chip {\n @apply pt-1 pb-1 rounded-sm\n}\n\n.p-treeselect-label:has(.p-chip) {\n @apply py-1 px-1\n}", + "treetable": "@import './paginator';\n\n.p-treetable {\n @apply relative\n}\n\n.p-treetable-table {\n @apply border-spacing-0 w-full\n}\n\n.p-treetable-scrollable > .p-treetable-table-container {\n @apply relative\n}\n\n.p-treetable-scrollable-table > .p-treetable-thead {\n @apply top-0 z-10\n}\n\n.p-treetable-scrollable-table > .p-treetable-frozen-tbody {\n @apply sticky z-10\n}\n\n.p-treetable-scrollable-table>.p-treetable-tfoot {\n @apply bottom-0 z-10\n}\n\n.p-treetable-scrollable .p-treetable-frozen-column {\n @apply sticky bg-surface-0 dark:bg-surface-900\n}\n\n.p-treetable-scrollable th.p-treetable-frozen-column {\n @apply z-10\n}\n\n.p-treetable-scrollable > .p-treetable-table-container > .p-treetable-table > .p-treetable-thead {\n @apply bg-surface-0 dark:bg-surface-900\n}\n\n.p-treetable-scrollable > .p-treetable-table-container > .p-treetable-table > .p-treetable-tfoot {\n @apply bg-surface-0 dark:bg-surface-900\n}\n\n.p-treetable-flex-scrollable {\n @apply flex flex-col h-full\n}\n\n.p-treetable-flex-scrollable > .p-treetable-table-container {\n @apply flex flex-col flex-1 h-full\n}\n\n.p-treetable-scrollable-table > .p-treetable-tbody > .p-treetable-row-group-header {\n @apply sticky z-10\n}\n\n.p-treetable-resizable-table > .p-treetable-thead > tr > th,\n.p-treetable-resizable-table > .p-treetable-tfoot > tr > td,\n.p-treetable-resizable-table > .p-treetable-tbody > tr > td {\n @apply overflow-hidden whitespace-nowrap\n}\n\n.p-treetable-resizable-table > .p-treetable-thead > tr > th.p-treetable-resizable-column:not(.p-treetable-frozen-column) {\n @apply bg-clip-padding relative\n}\n\n.p-treetable-resizable-table-fit > .p-treetable-thead > tr > th.p-treetable-resizable-column:last-child .p-treetable-column-resizer {\n @apply hidden\n}\n\n.p-treetable-column-resizer {\n @apply block absolute top-0 right-0 m-0 w-2 h-full p-0 cursor-col-resize border border-transparent\n}\n\n.p-treetable-column-header-content {\n @apply flex items-center gap-2\n}\n\n.p-treetable-column-resize-indicator {\n @apply w-px absolute z-10 hidden bg-primary\n}\n\n.p-treetable-mask {\n @apply absolute flex items-center justify-center z-20\n}\n\n.p-treetable-paginator-top {\n @apply border-b border-surface-200 dark:border-surface-700\n}\n\n.p-treetable-paginator-bottom {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-treetable-header {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-treetable-footer {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-treetable-header-cell {\n @apply py-3 px-4 font-normal text-left transition-colors duration-200\n border-b border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-treetable-column-title {\n @apply font-semibold\n}\n\n.p-treetable-tbody > tr {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0 transition-colors duration-200\n}\n\n.p-treetable-tbody > tr > td {\n @apply text-left py-3 px-4 border-b border-surface-200 dark:border-surface-800\n}\n\n.p-treetable-hoverable .p-treetable-tbody > tr:not(.p-treetable-row-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-treetable-tbody > tr.p-treetable-row-selected {\n @apply bg-highlight\n}\n\n.p-treetable-tbody > tr:has(+ .p-treetable-row-selected) > td {\n @apply border-b-primary-100 dark:border-b-primary-900\n}\n\n.p-treetable-tbody > tr.p-treetable-row-selected > td {\n @apply border-b-primary-100 dark:border-b-primary-900\n}\n\n.p-treetable-tbody > tr:focus-visible,\n.p-treetable-tbody > tr.p-treetable-contextmenu-row-selected {\n @apply outline outline-1 -outline-offset-1 outline-primary\n}\n\n.p-treetable-tfoot > tr > td {\n @apply text-left py-3 px-4 border-b border-surface-200 dark:border-surface-800 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-treetable-column-footer {\n @apply font-semibold\n}\n\n.p-treetable-sortable-column {\n @apply cursor-pointer select-none focus-visible:outline focus-visible:outline-1 focus-visible:-outline-offset-1 focus-visible:outline-primary\n}\n\n.p-treetable-column-title,\n.p-treetable-sort-icon,\n.p-treetable-sort-badge {\n @apply align-middle\n}\n\n.p-treetable-sort-icon {\n @apply text-surface-500 dark:text-surface-400 transition-colors duration-200\n}\n\n.p-treetable-sortable-column:not(.p-treetable-column-sorted):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-treetable-sortable-column:not(.p-treetable-column-sorted):hover .p-treetable-sort-icon {\n @apply text-surface-600 dark:text-surface-300\n}\n\n.p-treetable-column-sorted {\n @apply bg-highlight\n}\n\n.p-treetable-column-sorted .p-treetable-sort-icon {\n @apply bg-highlight\n}\n\n.p-treetable-hoverable .p-treetable-selectable-row {\n @apply cursor-pointer\n}\n\n.p-treetable-loading-icon {\n @apply text-[2rem] w-8 h-8\n}\n\n.p-treetable-gridlines .p-treetable-header {\n @apply border-t border-x\n}\n\n.p-treetable-gridlines .p-treetable-footer {\n @apply border-b border-x\n}\n\n.p-treetable-gridlines .p-treetable-paginator-top {\n @apply border-t border-x\n}\n\n.p-treetable-gridlines .p-treetable-paginator-bottom {\n @apply border-b border-x\n}\n\n.p-treetable-gridlines .p-treetable-thead > tr > th {\n @apply border-t border-x last:border\n}\n\n.p-treetable-gridlines .p-treetable-tbody > tr > td {\n @apply border-t border-l last:border-r\n}\n\n.p-treetable-gridlines .p-treetable-tbody > tr:last-child > td {\n @apply border-y border-l last:border\n}\n\n.p-treetable-gridlines .p-treetable-tfoot > tr > td {\n @apply border-y border-l last:border\n}\n\n.p-treetable.p-treetable-gridlines .p-treetable-thead + .p-treetable-tfoot > tr > td {\n @apply border-b border-l last:border-r\n}\n\n.p-treetable.p-treetable-gridlines:has(.p-treetable-thead):has(.p-treetable-tbody) .p-treetable-tbody > tr > td {\n @apply border-b border-l last:border-r\n}\n\n.p-treetable.p-treetable-gridlines:has(.p-treetable-tbody):has(.p-treetable-tfoot) .p-treetable-tbody > tr:last-child > td {\n @apply border-x\n}\n\n.p-treetable.p-treetable-sm .p-treetable-header {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-sm .p-treetable-footer {\n @apply py-1 px-2\n}\n\n.p-treetable.p-treetable-lg .p-treetable-header {\n @apply py-4 px-5\n}\n\n.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {\n @apply py-4 px-5\n}\n\n.p-treetable.p-treetable-lg .p-treetable-tbody>tr>td {\n @apply py-4 px-5\n}\n\n.p-treetable.p-treetable-lg .p-treetable-tfoot>tr>td {\n @apply py-4 px-5\n}\n\n.p-treetable.p-treetable-lg .p-treetable-footer {\n @apply py-4 px-5\n}\n\n.p-treetable-body-cell-content {\n @apply flex items-center gap-2\n}\n\n.p-treetable-tbody > tr.p-treetable-row-selected .p-treetable-node-toggle-button {\n @apply text-inherit\n}\n\n.p-treetable-node-toggle-button {\n @apply inline-flex items-center justify-center overflow-hidden relative select-none\n transition-colors duration-200 w-7 h-7 rounded-full border-none bg-transparent cursor-pointer \n enabled:hover:bg-surface-100 dark:enabled:hover:bg-surface-900\n text-surface-500 dark:text-surface-400 enabled:hover:text-surface-700 dark:enabled:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n\n}\n\n.p-treetable-tbody > tr.p-treetable-row-selected .p-treetable-node-toggle-button:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-primary\n}\n" } \ No newline at end of file