daisyui/components/dropdown.css

daisyUI 5 - The Tailwind CSS Component Library

/*! 🌼 daisyUI 5.7.17 - MIT License */ @layer utilities{@layer daisyui.l1.l2.l3{.dropdown{position-area:var(--anchor-v,bottom) var(--anchor-h,span-right);display:inline-block;position:relative}.dropdown>:not(:has(~[class*=dropdown-content])):focus{--tw-outline-style:none;outline-style:none;@media (forced-colors:active){outline-offset:2px;outline:2px solid #0000}}.dropdown .dropdown-content{position:absolute}.dropdown.dropdown-close .dropdown-content,.dropdown:not(details,.dropdown-open,.dropdown-hover:hover,:focus-within) .dropdown-content,.dropdown.dropdown-hover:not(:hover) [tabindex]:first-child:focus:not(:focus-visible)~.dropdown-content{transform-origin:top;opacity:0;display:none;scale:.95}.dropdown[popover],.dropdown .dropdown-content{z-index:999;@media (prefers-reduced-motion:no-preference){transition-behavior:allow-discrete;transition-property:opacity,scale,display,overlay;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation:.2s dropdown}}@starting-style{.dropdown[popover],.dropdown .dropdown-content{opacity:0;scale:.95}}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within)>[tabindex]:first-child{pointer-events:none}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within) .dropdown-content,.dropdown:not(.dropdown-close).dropdown-hover:hover .dropdown-content{opacity:1;scale:1}.dropdown:is(details){overflow:revert-layer;& summary{&::-webkit-details-marker{display:none}}}.dropdown:where([popover]){background:0 0}.dropdown[popover]{color:inherit;position:fixed;@supports not (position-area:bottom){margin:auto;&.dropdown-close,&.dropdown-open:not(:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}&::backdrop{background-color:oklab(0% none none/.3)}}&.dropdown-close,&:not(.dropdown-open,:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}}}@layer daisyui.l1.l2{.dropdown-start{--anchor-h:span-right}.dropdown-start :where(.dropdown-content){inset-inline-end:auto;translate:0;[dir=rtl] &{translate:0}}.dropdown-start.dropdown-left{--anchor-h:left;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.dropdown-start.dropdown-right{--anchor-h:right;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.dropdown-center{--anchor-h:center}.dropdown-center :where(.dropdown-content){inset-inline-end:50%;translate:50%;[dir=rtl] &{translate:-50%}}.dropdown-center.dropdown-left{--anchor-h:left;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.dropdown-center.dropdown-right{--anchor-h:right;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.dropdown-end{--anchor-h:span-left}.dropdown-end :where(.dropdown-content){inset-inline-end:0;translate:0;[dir=rtl] &{translate:0}}.dropdown-end.dropdown-left{--anchor-h:left;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.dropdown-end.dropdown-right{--anchor-h:right;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.dropdown-left{--anchor-h:left;--anchor-v:span-bottom}.dropdown-left .dropdown-content{inset-inline-end:100%;transform-origin:100%;top:0;bottom:auto}.dropdown-right{--anchor-h:right;--anchor-v:span-bottom}.dropdown-right .dropdown-content{inset-inline-start:100%;transform-origin:0;top:0;bottom:auto}.dropdown-bottom{--anchor-v:bottom}.dropdown-bottom .dropdown-content{transform-origin:top;top:100%;bottom:auto}.dropdown-top{--anchor-v:top}.dropdown-top .dropdown-content{transform-origin:bottom;top:auto;bottom:100%}}@media (width>=640px){@layer daisyui.l1.l2.l3{.sm\:dropdown{position-area:var(--anchor-v,bottom) var(--anchor-h,span-right);display:inline-block;position:relative}.sm\:dropdown>:not(:has(~[class*=dropdown-content])):focus{--tw-outline-style:none;outline-style:none;@media (forced-colors:active){outline-offset:2px;outline:2px solid #0000}}.sm\:dropdown .dropdown-content{position:absolute}.sm\:dropdown.dropdown-close .dropdown-content,.sm\:dropdown:not(details,.dropdown-open,.dropdown-hover:hover,:focus-within) .dropdown-content,.sm\:dropdown.dropdown-hover:not(:hover) [tabindex]:first-child:focus:not(:focus-visible)~.dropdown-content{transform-origin:top;opacity:0;display:none;scale:.95}.sm\:dropdown[popover],.sm\:dropdown .dropdown-content{z-index:999;@media (prefers-reduced-motion:no-preference){transition-behavior:allow-discrete;transition-property:opacity,scale,display,overlay;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation:.2s dropdown}}@starting-style{.sm\:dropdown[popover],.sm\:dropdown .dropdown-content{opacity:0;scale:.95}}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within)>[tabindex]:first-child{pointer-events:none}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within) .dropdown-content,.sm\:dropdown:not(.dropdown-close).dropdown-hover:hover .dropdown-content{opacity:1;scale:1}.sm\:dropdown:is(details){overflow:revert-layer;& summary{&::-webkit-details-marker{display:none}}}.sm\:dropdown:where([popover]){background:0 0}.sm\:dropdown[popover]{color:inherit;position:fixed;@supports not (position-area:bottom){margin:auto;&.dropdown-close,&.dropdown-open:not(:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}&::backdrop{background-color:oklab(0% none none/.3)}}&.dropdown-close,&:not(.dropdown-open,:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}}}@layer daisyui.l1.l2{.sm\:dropdown-start{--anchor-h:span-right}.sm\:dropdown-start :where(.dropdown-content){inset-inline-end:auto;translate:0;[dir=rtl] &{translate:0}}.sm\:dropdown-start.dropdown-left{--anchor-h:left;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.sm\:dropdown-start.dropdown-right{--anchor-h:right;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.sm\:dropdown-center{--anchor-h:center}.sm\:dropdown-center :where(.dropdown-content){inset-inline-end:50%;translate:50%;[dir=rtl] &{translate:-50%}}.sm\:dropdown-center.dropdown-left{--anchor-h:left;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.sm\:dropdown-center.dropdown-right{--anchor-h:right;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.sm\:dropdown-end{--anchor-h:span-left}.sm\:dropdown-end :where(.dropdown-content){inset-inline-end:0;translate:0;[dir=rtl] &{translate:0}}.sm\:dropdown-end.dropdown-left{--anchor-h:left;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.sm\:dropdown-end.dropdown-right{--anchor-h:right;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.sm\:dropdown-left{--anchor-h:left;--anchor-v:span-bottom}.sm\:dropdown-left .dropdown-content{inset-inline-end:100%;transform-origin:100%;top:0;bottom:auto}.sm\:dropdown-right{--anchor-h:right;--anchor-v:span-bottom}.sm\:dropdown-right .dropdown-content{inset-inline-start:100%;transform-origin:0;top:0;bottom:auto}.sm\:dropdown-bottom{--anchor-v:bottom}.sm\:dropdown-bottom .dropdown-content{transform-origin:top;top:100%;bottom:auto}.sm\:dropdown-top{--anchor-v:top}.sm\:dropdown-top .dropdown-content{transform-origin:bottom;top:auto;bottom:100%}}}@media (width>=768px){@layer daisyui.l1.l2.l3{.md\:dropdown{position-area:var(--anchor-v,bottom) var(--anchor-h,span-right);display:inline-block;position:relative}.md\:dropdown>:not(:has(~[class*=dropdown-content])):focus{--tw-outline-style:none;outline-style:none;@media (forced-colors:active){outline-offset:2px;outline:2px solid #0000}}.md\:dropdown .dropdown-content{position:absolute}.md\:dropdown.dropdown-close .dropdown-content,.md\:dropdown:not(details,.dropdown-open,.dropdown-hover:hover,:focus-within) .dropdown-content,.md\:dropdown.dropdown-hover:not(:hover) [tabindex]:first-child:focus:not(:focus-visible)~.dropdown-content{transform-origin:top;opacity:0;display:none;scale:.95}.md\:dropdown[popover],.md\:dropdown .dropdown-content{z-index:999;@media (prefers-reduced-motion:no-preference){transition-behavior:allow-discrete;transition-property:opacity,scale,display,overlay;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation:.2s dropdown}}@starting-style{.md\:dropdown[popover],.md\:dropdown .dropdown-content{opacity:0;scale:.95}}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within)>[tabindex]:first-child{pointer-events:none}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within) .dropdown-content,.md\:dropdown:not(.dropdown-close).dropdown-hover:hover .dropdown-content{opacity:1;scale:1}.md\:dropdown:is(details){overflow:revert-layer;& summary{&::-webkit-details-marker{display:none}}}.md\:dropdown:where([popover]){background:0 0}.md\:dropdown[popover]{color:inherit;position:fixed;@supports not (position-area:bottom){margin:auto;&.dropdown-close,&.dropdown-open:not(:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}&::backdrop{background-color:oklab(0% none none/.3)}}&.dropdown-close,&:not(.dropdown-open,:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}}}@layer daisyui.l1.l2{.md\:dropdown-start{--anchor-h:span-right}.md\:dropdown-start :where(.dropdown-content){inset-inline-end:auto;translate:0;[dir=rtl] &{translate:0}}.md\:dropdown-start.dropdown-left{--anchor-h:left;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.md\:dropdown-start.dropdown-right{--anchor-h:right;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.md\:dropdown-center{--anchor-h:center}.md\:dropdown-center :where(.dropdown-content){inset-inline-end:50%;translate:50%;[dir=rtl] &{translate:-50%}}.md\:dropdown-center.dropdown-left{--anchor-h:left;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.md\:dropdown-center.dropdown-right{--anchor-h:right;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.md\:dropdown-end{--anchor-h:span-left}.md\:dropdown-end :where(.dropdown-content){inset-inline-end:0;translate:0;[dir=rtl] &{translate:0}}.md\:dropdown-end.dropdown-left{--anchor-h:left;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.md\:dropdown-end.dropdown-right{--anchor-h:right;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.md\:dropdown-left{--anchor-h:left;--anchor-v:span-bottom}.md\:dropdown-left .dropdown-content{inset-inline-end:100%;transform-origin:100%;top:0;bottom:auto}.md\:dropdown-right{--anchor-h:right;--anchor-v:span-bottom}.md\:dropdown-right .dropdown-content{inset-inline-start:100%;transform-origin:0;top:0;bottom:auto}.md\:dropdown-bottom{--anchor-v:bottom}.md\:dropdown-bottom .dropdown-content{transform-origin:top;top:100%;bottom:auto}.md\:dropdown-top{--anchor-v:top}.md\:dropdown-top .dropdown-content{transform-origin:bottom;top:auto;bottom:100%}}}@media (width>=1024px){@layer daisyui.l1.l2.l3{.lg\:dropdown{position-area:var(--anchor-v,bottom) var(--anchor-h,span-right);display:inline-block;position:relative}.lg\:dropdown>:not(:has(~[class*=dropdown-content])):focus{--tw-outline-style:none;outline-style:none;@media (forced-colors:active){outline-offset:2px;outline:2px solid #0000}}.lg\:dropdown .dropdown-content{position:absolute}.lg\:dropdown.dropdown-close .dropdown-content,.lg\:dropdown:not(details,.dropdown-open,.dropdown-hover:hover,:focus-within) .dropdown-content,.lg\:dropdown.dropdown-hover:not(:hover) [tabindex]:first-child:focus:not(:focus-visible)~.dropdown-content{transform-origin:top;opacity:0;display:none;scale:.95}.lg\:dropdown[popover],.lg\:dropdown .dropdown-content{z-index:999;@media (prefers-reduced-motion:no-preference){transition-behavior:allow-discrete;transition-property:opacity,scale,display,overlay;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation:.2s dropdown}}@starting-style{.lg\:dropdown[popover],.lg\:dropdown .dropdown-content{opacity:0;scale:.95}}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within)>[tabindex]:first-child{pointer-events:none}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within) .dropdown-content,.lg\:dropdown:not(.dropdown-close).dropdown-hover:hover .dropdown-content{opacity:1;scale:1}.lg\:dropdown:is(details){overflow:revert-layer;& summary{&::-webkit-details-marker{display:none}}}.lg\:dropdown:where([popover]){background:0 0}.lg\:dropdown[popover]{color:inherit;position:fixed;@supports not (position-area:bottom){margin:auto;&.dropdown-close,&.dropdown-open:not(:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}&::backdrop{background-color:oklab(0% none none/.3)}}&.dropdown-close,&:not(.dropdown-open,:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}}}@layer daisyui.l1.l2{.lg\:dropdown-start{--anchor-h:span-right}.lg\:dropdown-start :where(.dropdown-content){inset-inline-end:auto;translate:0;[dir=rtl] &{translate:0}}.lg\:dropdown-start.dropdown-left{--anchor-h:left;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.lg\:dropdown-start.dropdown-right{--anchor-h:right;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.lg\:dropdown-center{--anchor-h:center}.lg\:dropdown-center :where(.dropdown-content){inset-inline-end:50%;translate:50%;[dir=rtl] &{translate:-50%}}.lg\:dropdown-center.dropdown-left{--anchor-h:left;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.lg\:dropdown-center.dropdown-right{--anchor-h:right;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.lg\:dropdown-end{--anchor-h:span-left}.lg\:dropdown-end :where(.dropdown-content){inset-inline-end:0;translate:0;[dir=rtl] &{translate:0}}.lg\:dropdown-end.dropdown-left{--anchor-h:left;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.lg\:dropdown-end.dropdown-right{--anchor-h:right;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.lg\:dropdown-left{--anchor-h:left;--anchor-v:span-bottom}.lg\:dropdown-left .dropdown-content{inset-inline-end:100%;transform-origin:100%;top:0;bottom:auto}.lg\:dropdown-right{--anchor-h:right;--anchor-v:span-bottom}.lg\:dropdown-right .dropdown-content{inset-inline-start:100%;transform-origin:0;top:0;bottom:auto}.lg\:dropdown-bottom{--anchor-v:bottom}.lg\:dropdown-bottom .dropdown-content{transform-origin:top;top:100%;bottom:auto}.lg\:dropdown-top{--anchor-v:top}.lg\:dropdown-top .dropdown-content{transform-origin:bottom;top:auto;bottom:100%}}}@media (width>=1280px){@layer daisyui.l1.l2.l3{.xl\:dropdown{position-area:var(--anchor-v,bottom) var(--anchor-h,span-right);display:inline-block;position:relative}.xl\:dropdown>:not(:has(~[class*=dropdown-content])):focus{--tw-outline-style:none;outline-style:none;@media (forced-colors:active){outline-offset:2px;outline:2px solid #0000}}.xl\:dropdown .dropdown-content{position:absolute}.xl\:dropdown.dropdown-close .dropdown-content,.xl\:dropdown:not(details,.dropdown-open,.dropdown-hover:hover,:focus-within) .dropdown-content,.xl\:dropdown.dropdown-hover:not(:hover) [tabindex]:first-child:focus:not(:focus-visible)~.dropdown-content{transform-origin:top;opacity:0;display:none;scale:.95}.xl\:dropdown[popover],.xl\:dropdown .dropdown-content{z-index:999;@media (prefers-reduced-motion:no-preference){transition-behavior:allow-discrete;transition-property:opacity,scale,display,overlay;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation:.2s dropdown}}@starting-style{.xl\:dropdown[popover],.xl\:dropdown .dropdown-content{opacity:0;scale:.95}}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within)>[tabindex]:first-child{pointer-events:none}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within) .dropdown-content,.xl\:dropdown:not(.dropdown-close).dropdown-hover:hover .dropdown-content{opacity:1;scale:1}.xl\:dropdown:is(details){overflow:revert-layer;& summary{&::-webkit-details-marker{display:none}}}.xl\:dropdown:where([popover]){background:0 0}.xl\:dropdown[popover]{color:inherit;position:fixed;@supports not (position-area:bottom){margin:auto;&.dropdown-close,&.dropdown-open:not(:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}&::backdrop{background-color:oklab(0% none none/.3)}}&.dropdown-close,&:not(.dropdown-open,:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}}}@layer daisyui.l1.l2{.xl\:dropdown-start{--anchor-h:span-right}.xl\:dropdown-start :where(.dropdown-content){inset-inline-end:auto;translate:0;[dir=rtl] &{translate:0}}.xl\:dropdown-start.dropdown-left{--anchor-h:left;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.xl\:dropdown-start.dropdown-right{--anchor-h:right;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.xl\:dropdown-center{--anchor-h:center}.xl\:dropdown-center :where(.dropdown-content){inset-inline-end:50%;translate:50%;[dir=rtl] &{translate:-50%}}.xl\:dropdown-center.dropdown-left{--anchor-h:left;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.xl\:dropdown-center.dropdown-right{--anchor-h:right;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.xl\:dropdown-end{--anchor-h:span-left}.xl\:dropdown-end :where(.dropdown-content){inset-inline-end:0;translate:0;[dir=rtl] &{translate:0}}.xl\:dropdown-end.dropdown-left{--anchor-h:left;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.xl\:dropdown-end.dropdown-right{--anchor-h:right;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.xl\:dropdown-left{--anchor-h:left;--anchor-v:span-bottom}.xl\:dropdown-left .dropdown-content{inset-inline-end:100%;transform-origin:100%;top:0;bottom:auto}.xl\:dropdown-right{--anchor-h:right;--anchor-v:span-bottom}.xl\:dropdown-right .dropdown-content{inset-inline-start:100%;transform-origin:0;top:0;bottom:auto}.xl\:dropdown-bottom{--anchor-v:bottom}.xl\:dropdown-bottom .dropdown-content{transform-origin:top;top:100%;bottom:auto}.xl\:dropdown-top{--anchor-v:top}.xl\:dropdown-top .dropdown-content{transform-origin:bottom;top:auto;bottom:100%}}}@media (width>=1536px){@layer daisyui.l1.l2.l3{.\32 xl\:dropdown{position-area:var(--anchor-v,bottom) var(--anchor-h,span-right);display:inline-block;position:relative}.\32 xl\:dropdown>:not(:has(~[class*=dropdown-content])):focus{--tw-outline-style:none;outline-style:none;@media (forced-colors:active){outline-offset:2px;outline:2px solid #0000}}.\32 xl\:dropdown .dropdown-content{position:absolute}.\32 xl\:dropdown.dropdown-close .dropdown-content,.\32 xl\:dropdown:not(details,.dropdown-open,.dropdown-hover:hover,:focus-within) .dropdown-content,.\32 xl\:dropdown.dropdown-hover:not(:hover) [tabindex]:first-child:focus:not(:focus-visible)~.dropdown-content{transform-origin:top;opacity:0;display:none;scale:.95}.\32 xl\:dropdown[popover],.\32 xl\:dropdown .dropdown-content{z-index:999;@media (prefers-reduced-motion:no-preference){transition-behavior:allow-discrete;transition-property:opacity,scale,display,overlay;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation:.2s dropdown}}@starting-style{.\32 xl\:dropdown[popover],.\32 xl\:dropdown .dropdown-content{opacity:0;scale:.95}}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within)>[tabindex]:first-child{pointer-events:none}:is(.dropdown:not(.dropdown-close).dropdown-open,.dropdown:not(.dropdown-close):not(.dropdown-hover):focus,.dropdown:not(.dropdown-close):focus-within) .dropdown-content,.\32 xl\:dropdown:not(.dropdown-close).dropdown-hover:hover .dropdown-content{opacity:1;scale:1}.\32 xl\:dropdown:is(details){overflow:revert-layer;& summary{&::-webkit-details-marker{display:none}}}.\32 xl\:dropdown:where([popover]){background:0 0}.\32 xl\:dropdown[popover]{color:inherit;position:fixed;@supports not (position-area:bottom){margin:auto;&.dropdown-close,&.dropdown-open:not(:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}&::backdrop{background-color:oklab(0% none none/.3)}}&.dropdown-close,&:not(.dropdown-open,:popover-open){transform-origin:top;opacity:0;display:none;scale:.95}}}@layer daisyui.l1.l2{.\32 xl\:dropdown-start{--anchor-h:span-right}.\32 xl\:dropdown-start :where(.dropdown-content){inset-inline-end:auto;translate:0;[dir=rtl] &{translate:0}}.\32 xl\:dropdown-start.dropdown-left{--anchor-h:left;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.\32 xl\:dropdown-start.dropdown-right{--anchor-h:right;--anchor-v:span-bottom;& .dropdown-content{top:0;bottom:auto}}.\32 xl\:dropdown-center{--anchor-h:center}.\32 xl\:dropdown-center :where(.dropdown-content){inset-inline-end:50%;translate:50%;[dir=rtl] &{translate:-50%}}.\32 xl\:dropdown-center.dropdown-left{--anchor-h:left;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.\32 xl\:dropdown-center.dropdown-right{--anchor-h:right;--anchor-v:center;& .dropdown-content{top:auto;bottom:50%;translate:0 50%}}.\32 xl\:dropdown-end{--anchor-h:span-left}.\32 xl\:dropdown-end :where(.dropdown-content){inset-inline-end:0;translate:0;[dir=rtl] &{translate:0}}.\32 xl\:dropdown-end.dropdown-left{--anchor-h:left;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.\32 xl\:dropdown-end.dropdown-right{--anchor-h:right;--anchor-v:span-top;& .dropdown-content{top:auto;bottom:0}}.\32 xl\:dropdown-left{--anchor-h:left;--anchor-v:span-bottom}.\32 xl\:dropdown-left .dropdown-content{inset-inline-end:100%;transform-origin:100%;top:0;bottom:auto}.\32 xl\:dropdown-right{--anchor-h:right;--anchor-v:span-bottom}.\32 xl\:dropdown-right .dropdown-content{inset-inline-start:100%;transform-origin:0;top:0;bottom:auto}.\32 xl\:dropdown-bottom{--anchor-v:bottom}.\32 xl\:dropdown-bottom .dropdown-content{transform-origin:top;top:100%;bottom:auto}.\32 xl\:dropdown-top{--anchor-v:top}.\32 xl\:dropdown-top .dropdown-content{transform-origin:bottom;top:auto;bottom:100%}}}@keyframes dropdown{0%{opacity:0}}}