diff --git a/doc/common/presetdoc/index.json b/doc/common/presetdoc/index.json index 5fcb945a..0257632f 100644 --- a/doc/common/presetdoc/index.json +++ b/doc/common/presetdoc/index.json @@ -39,9 +39,9 @@ "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": "@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}", + "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 ms-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 start-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 ms-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 start-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 ms-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 start-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 ms-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}\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}", + "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 ms-auto text-sm w-[0.875rem] h-[0.875rem]\n}\n\n.p-menubar-submenu-icon:dir(rtl) {\n @apply rotate-180\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 start-full top-0\n}\n\n.p-menubar-end {\n @apply ms-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 start-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 ms-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}\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": "@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", @@ -50,7 +50,7 @@ "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}\n\n.p-paginator-first:dir(rtl) {\n @apply order-2\n}\n.p-paginator-prev:dir(rtl) {\n @apply order-1\n}\n.p-paginator-next:dir(rtl) {\n @apply order-[-1]\n}\n.p-paginator-last:dir(rtl) {\n @apply order-[-2]\n}\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}", + "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-panelmenu-header-active) .p-panelmenu-submenu-icon:dir(rtl) {\n @apply rotate-180;\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}\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 end-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 pe-10\n}\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}", @@ -74,7 +74,7 @@ "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}", + "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 ms-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}\n", "timeline": ".p-timeline {\n @apply flex flex-col flex-grow\n}\n\n.p-timeline-left .p-timeline-event-opposite {\n @apply text-end\n}\n\n.p-timeline-left .p-timeline-event-content {\n @apply text-start\n}\n\n.p-timeline-right .p-timeline-event {\n @apply flex-row-reverse\n}\n\n.p-timeline-right .p-timeline-event-opposite {\n @apply text-start\n}\n\n.p-timeline-right .p-timeline-event-content {\n @apply text-end\n}\n\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n @apply flex-row-reverse\n}\n\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n @apply text-end\n}\n\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n @apply text-start\n}\n\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n @apply text-start\n}\n\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n @apply text-end\n}\n\n.p-timeline-vertical .p-timeline-event-opposite,\n.p-timeline-vertical .p-timeline-event-content {\n @apply py-0 px-4 leading-none\n}\n\n.p-timeline-vertical .p-timeline-event-connector {\n @apply w-[2px]\n}\n\n.p-timeline-event {\n @apply flex relative min-h-20 last:min-h-0\n}\n\n.p-timeline-event-opposite {\n @apply flex-1\n}\n\n.p-timeline-event-content {\n @apply flex-1\n}\n\n.p-timeline-event-separator {\n @apply flex-none flex flex-col items-center\n}\n\n.p-timeline-event-marker {\n @apply inline-flex items-center justify-center relative self-baseline\n border-2 rounded-full border-surface-200 dark:border-surface-700 w-[1.125rem] h-[1.125rem]\n bg-surface-0 dark:bg-surface-900\n before:rounded-full before:w-[0.375rem] before:h-[0.375rem] before:bg-primary\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-timeline-event-connector {\n @apply flex-grow bg-surface-200 dark:bg-surface-700\n}\n\n.p-timeline-horizontal {\n @apply flex-row\n}\n\n.p-timeline-horizontal .p-timeline-event {\n @apply flex-col flex-1\n}\n\n.p-timeline-horizontal .p-timeline-event:last-child {\n @apply flex-none\n}\n\n.p-timeline-horizontal .p-timeline-event-separator {\n @apply flex-row\n}\n\n.p-timeline-horizontal .p-timeline-event-connector {\n @apply w-full h-[2px]\n}\n\n.p-timeline-horizontal .p-timeline-event-opposite,\n.p-timeline-horizontal .p-timeline-event-content {\n @apply py-4 px-0\n}\n\n.p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n @apply flex-col-reverse\n}\n\n.p-timeline-bottom .p-timeline-event {\n @apply flex-col-reverse\n}\n", "toast": ".p-toast {\n @apply w-96 rounded-md whitespace-pre-line break-words\n}\n\n.p-toast-message {\n @apply mb-4\n}\n\n.p-toast-message-icon {\n @apply flex-shrink-0 text-lg w-[1.125rem] h-[1.125rem]\n}\n\n.p-toast-message-content {\n @apply flex items-start p-3 gap-2\n}\n\n.p-toast-message-text {\n @apply flex-auto flex flex-col gap-2\n}\n\n.p-toast-summary {\n @apply font-medium text-base\n}\n\n.p-toast-detail {\n @apply font-medium text-sm\n}\n\n.p-toast-close-button {\n @apply flex items-center justify-center overflow-hidden relative cursor-pointer bg-transparent select-none\n transition-colors duration-200 text-inherit w-7 h-7 rounded-full -mt-[25%] -right-1/4 p-0 border-none \n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2\n}\n\n.p-toast-message-info,\n.p-toast-message-success,\n.p-toast-message-warn,\n.p-toast-message-error,\n.p-toast-message-secondary,\n.p-toast-message-contrast {\n @apply border backdrop-blur-sm dark:backdrop-blur-md rounded-md\n}\n\n.p-toast-close-icon {\n @apply text-base w-4 h-4\n}\n\n.p-toast-message-info {\n @apply bg-blue-50/95 border-blue-200 text-blue-600\n dark:bg-blue-500/15 dark:border-blue-700/35 dark:text-blue-500\n shadow-[0px_4px_8px_0px_theme(colors.blue.500/0.04)]\n}\n\n.p-toast-message-info .p-toast-detail {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-toast-message-info .p-toast-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-toast-message-success {\n @apply bg-green-50/95 border-green-200 text-green-600\n dark:bg-green-500/15 dark:border-green-700/35 dark:text-green-500\n shadow-[0px_4px_8px_0px_theme(colors.green.500/0.04)]\n}\n\n.p-toast-message-success .p-toast-detail {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-toast-message-success .p-toast-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-toast-message-warn {\n @apply bg-yellow-50/95 border-yellow-200 text-yellow-600\n dark:bg-yellow-500/15 dark:border-yellow-700/35 dark:text-yellow-500\n shadow-[0px_4px_8px_0px_theme(colors.yellow.500/0.04)]\n}\n\n.p-toast-message-warn .p-toast-detail {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-toast-message-warn .p-toast-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-toast-message-error {\n @apply bg-red-50/95 border-red-200 text-red-600\n dark:bg-red-500/15 dark:border-red-700/35 dark:text-red-500\n shadow-[0px_4px_8px_0px_theme(colors.blue.500/0.04)]\n}\n\n.p-toast-message-error .p-toast-detail {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-toast-message-error .p-toast-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-toast-message-secondary {\n @apply bg-surface-100 border-surface-200 text-surface-600\n dark:bg-surface-800 dark:border-surface-700 dark:text-surface-300\n shadow-[0px_4px_8px_0px_rgba(0,0,0,0.04)]\n}\n\n.p-toast-message-secondary .p-toast-detail {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-toast-message-secondary .p-toast-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-toast-message-contrast {\n @apply bg-surface-900 border-surface-950 text-surface-50\n dark:bg-surface-0 dark:border-surface-100 dark:text-surface-950\n shadow-[0px_4px_8px_0px_rgba(0,0,0,0.04)]\n}\n\n.p-toast-message-contrast .p-toast-detail {\n @apply text-surface-0 dark:text-surface-950\n}\n\n.p-toast-message-contrast .p-toast-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-toast-top-center {\n @apply -translate-x-1/2;\n}\n\n.p-toast-bottom-center {\n @apply -translate-x-1/2;\n}\n\n.p-toast-center {\n @apply min-w-[20vw] -translate-x-1/2 -translate-y-1/2\n}\n\n.p-toast-message-enter-from {\n @apply opacity-0 translate-y-1/2\n}\n\n.p-toast-message-leave-from {\n @apply max-h-[1000px]\n}\n\n.p-toast .p-toast-message.p-toast-message-leave-to {\n @apply max-h-0 opacity-0 mb-0 overflow-hidden\n}\n\n.p-toast-message-enter-active {\n @apply [transition:transform_0.3s,opacity_0.3s]\n}\n\n.p-toast-message-leave-active {\n @apply [transition:max-height_0.45s_cubic-bezier(0,1,0,1),opacity_0.3s,margin-bottom_0.3s]\n}", "togglebutton": ".p-togglebutton {\n @apply inline-flex items-center justify-center overflow-hidden relative cursor-pointer select-none\n border border-surface-100 dark:border-surface-950 rounded-md\n bg-surface-100 dark:bg-surface-950\n text-surface-500 dark:text-surface-400 text-base font-medium\n px-4 py-2\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n disabled:opacity-100 disabled:cursor-default\n disabled:bg-surface-200 disabled:border-surface-200 disabled:text-surface-500\n disabled:dark:bg-surface-700 disabled:dark:border-surface-700 disabled:dark:text-surface-400\n transition-colors duration-300\n before:bg-transparent before:absolute before:start-1 before:top-1 before:rounded-md before:w-[calc(100%-0.5rem)] before:h-[calc(100%-0.5rem)]\n before:transition-colors before:duration-200\n}\n\n.p-togglebutton-content {\n @apply relative inline-flex items-center justify-center gap-2\n}\n\n.p-togglebutton-label,\n.p-togglebutton-icon {\n @apply relative transition-none\n}\n\n.p-togglebutton.p-togglebutton-checked::before {\n @apply bg-surface-0 dark:bg-surface-800 shadow-[0px_1px_2px_0px_rgba(0,0,0,0.02),0px_1px_2px_0px_rgba(0,0,0,0.04)]\n}\n\n.p-togglebutton:not(:disabled):not(.p-togglebutton-checked):hover {\n @apply bg-surface-100 dark:bg-surface-950 text-surface-700 dark:text-surface-300\n}\n\n.p-togglebutton.p-togglebutton-checked {\n @apply bg-surface-100 dark:bg-surface-950 border-surface-100 dark:border-surface-950 text-surface-900 dark:text-surface-0\n}\n\n.p-togglebutton.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-togglebutton-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-togglebutton:not(:disabled):not(.p-togglebutton-checked):hover .p-togglebutton-icon {\n @apply text-surface-700 dark:text-surface-300\n}\n\n.p-togglebutton.p-togglebutton-checked .p-togglebutton-icon {\n @apply text-surface-900 dark:text-surface-0\n}\n\n.p-togglebutton:disabled .p-togglebutton-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n",