daisyui 5.0.0-alpha.9 → 5.0.0-beta.2

package/components/tab.css

@@ -1 +1 @@
-/*! 🌼 daisyUI 5.0.0-alpha.9 – MIT License */ .tabs{vertical-align:bottom;align-items:flex-end;display:inline-grid}.tab{height:var(--spacing-8,2rem);cursor:pointer;appearance:none;text-align:center;font-size:var(--font-size-sm,.875rem);line-height:var(--tw-leading,var(--font-size-sm--line-height,1.25rem));--tw-leading:var(--line-height-loose,2);line-height:var(--line-height-loose,2);color:var(--tab-color);-webkit-user-select:none;user-select:none;--tab-padding:1rem;--tab-color:var(--color-base-content);--tab-bg:var(--color-base-100);--tab-border-color:var(--color-base-300);flex-wrap:wrap;grid-row-start:1;justify-content:center;align-items:center;padding-inline-start:var(--tab-padding,1rem);padding-inline-end:var(--tab-padding,1rem);display:inline-flex;position:relative;&:hover{@media (hover:hover){&{color:var(--color-base-content,oklch(27.8078% .029596 256.848))}}}&:is(input[type=radio]){border-bottom-right-radius:0;border-bottom-left-radius:0;width:auto;&:after{--tw-content:attr(aria-label);content:var(--tw-content)}}&:checked,&:is(.tab-active,[aria-selected=true]){&+.tab-content{display:block}}&:not(input):empty{cursor:default;grid-column-start:span 9999}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled):not([disabled]),&:is(input:checked){border-color:var(--color-base-content,oklch(27.8078% .029596 256.848))}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&-disabled,&[disabled]{cursor:not-allowed;color:color-mix(in srgb,var(--color-base-content,oklch(27.8078% .029596 256.848))20%,transparent)}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in srgb,var(--color-base-content,oklch(27.8078% .029596 256.848))29%,transparent)}}.tabs-bordered{&>.tab{border-color:color-mix(in srgb,var(--color-base-content,oklch(27.8078% .029596 256.848))20%,transparent);border-style:solid;border-width:0;border-bottom-width:calc(var(--spacing-tab-border,1px) + 1px)}}.tabs-lifted{&>.tab:focus-visible{border-end-end-radius:0;border-end-start-radius:0}&:has(.tab-content[class^=rounded-]) .tab:first-child:not(:is(.tab-active,[aria-selected=true])),&:has(.tab-content[class*=\ rounded-]) .tab:first-child:not(:is(.tab-active,[aria-selected=true])){border-bottom-color:#0000}&>.tab{border:var(--spacing-tab-border,1px)solid transparent;border-width:0 0 var(--spacing-tab-border,1px)0;border-bottom-color:var(--tab-border-color);padding-inline-start:var(--tab-padding,1rem);padding-inline-end:var(--tab-padding,1rem);padding-top:var(--spacing-tab-border,1px);border-start-start-radius:var(--tab-radius,.5rem);border-start-end-radius:var(--tab-radius,.5rem);&:is(.tab-active,[aria-selected=true]):not(.tab-disabled):not([disabled]),&:is(input:checked){background-color:var(--tab-bg);border-width:var(--spacing-tab-border,1px)var(--spacing-tab-border,1px)0 var(--spacing-tab-border,1px);border-inline-start-color:var(--tab-border-color);border-inline-end-color:var(--tab-border-color);border-top-color:var(--tab-border-color);padding-inline-start:calc(var(--tab-padding,1rem) - var(--spacing-tab-border,1px));padding-inline-end:calc(var(--tab-padding,1rem) - var(--spacing-tab-border,1px));padding-bottom:var(--spacing-tab-border,1px);padding-top:0;&:before{z-index:1;content:"";width:calc(100% + var(--tab-radius,.5rem)*2);height:var(--tab-radius,.5rem);background-size:var(--tab-radius,.5rem);--tab-grad:calc(69% - var(--spacing-tab-border,1px));--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--spacing-tab-border,1px)),var(--tab-bg)calc(var(--tab-grad) + var(--spacing-tab-border,1px) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--spacing-tab-border,1px)),var(--tab-bg)calc(var(--tab-grad) + var(--spacing-tab-border,1px) + .25px));background-position:0 0,100% 0;background-repeat:no-repeat;background-image:var(--radius-start),var(--radius-end);display:block;position:absolute;bottom:0}&:first-child:before{background-image:var(--radius-end);background-position:100% 0;[dir=rtl] &{background-image:var(--radius-start);background-position:0 0}}&:last-child:before{background-image:var(--radius-start);background-position:0 0;[dir=rtl] &{background-image:var(--radius-end);background-position:100% 0}}}}}.tabs-lifted{&>:is(.tab-active,[aria-selected=true]):not(.tab-disabled):not([disabled])+.tabs-lifted :is(.tab-active,[aria-selected=true]):not(.tab-disabled):not([disabled]),&>.tab:is(input:checked)+.tabs-lifted .tab:is(input:checked){&:before{background-image:var(--radius-end);background-position:100% 0}}}.tabs-boxed{border-radius:var(--radius-btn,.5rem);background-color:var(--color-base-200,oklch(96.1151% 0 0));padding:var(--spacing-1,.25rem);& .tab{border-radius:var(--radius-btn,.5rem)}& :is(.tab-active,[aria-selected=true]):not(.tab-disabled):not([disabled]),& :is(input:checked){background-color:var(--color-primary,oklch(49.12% .3096 275.75));color:var(--color-primary-content,oklch(89.824% .06192 275.75));&:hover{@media (hover:hover){&{color:var(--color-primary-content,oklch(89.824% .06192 275.75))}}}}}.tab-content{border-color:#0000;border-width:var(--spacing-tab-border,1px);margin-top:calc(var(--spacing-tab-border)*-1);grid-column:1/span 9999;grid-row-start:2;min-width:calc(100% + 1.5rem);display:none;:checked+&:nth-child(2),:is(.tab-active,[aria-selected=true])+&:nth-child(2){border-start-start-radius:0}}.tabs-md{& :where(.tab){height:var(--spacing-8,2rem);font-size:var(--font-size-sm,.875rem);line-height:var(--tw-leading,var(--font-size-sm--line-height,1.25rem));--tw-leading:var(--line-height-loose,2);line-height:var(--line-height-loose,2);--tab-padding:1rem}}.tabs-lg{& :where(.tab){height:var(--spacing-12,3rem);font-size:var(--font-size-lg,1.125rem);line-height:var(--tw-leading,var(--font-size-lg--line-height,1.75rem));--tw-leading:var(--line-height-loose,2);line-height:var(--line-height-loose,2);--tab-padding:1.25rem}}.tabs-sm{& :where(.tab){height:var(--spacing-6,1.5rem);font-size:var(--font-size-sm,.875rem);line-height:var(--tw-leading,var(--font-size-sm--line-height,1.25rem));--tw-leading:var(--line-height-3,.75rem);line-height:var(--line-height-3,.75rem);--tab-padding:.75rem}}.tabs-xs{& :where(.tab){height:var(--spacing-5,1.25rem);font-size:var(--font-size-xs,.75rem);line-height:var(--tw-leading,var(--font-size-xs--line-height,1rem));--tw-leading:var(--line-height-3,.75rem);line-height:var(--line-height-3,.75rem);--tab-padding:.5rem}}
+/*! 🌼 daisyUI 5.0.0-beta.2 - MIT License */ .tabs{--tabs-height:auto;--tabs-direction:row;height:var(--tabs-height);flex-wrap:wrap;flex-direction:var(--tabs-direction);display:flex}.tab{cursor:pointer;appearance:none;text-align:center;-webkit-user-select:none;user-select:none;--tab-p:1rem;--tab-bg:var(--color-base-100);--tab-border-color:var(--color-base-300);--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:0;--tab-radius-ee:0;--tab-order:0;--tab-radius-min:calc(.75rem - var(--border));flex-wrap:wrap;order:var(--tab-order);height:calc(var(--size-field,.25rem)*10);border-color:#0000;justify-content:center;align-items:center;padding-inline-start:var(--tab-p);padding-inline-end:var(--tab-p);font-size:.875rem;display:inline-flex;position:relative;&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}&:is(input[type=radio]){min-width:fit-content;&:after{content:attr(aria-label)}}&:checked,&:is(.tab-active,[aria-selected=true]){&+.tab-content{height:100%;display:block}}&:not(:checked,:hover,.tab-active,[aria-selected=true]){color:color-mix(in oklab,var(--color-base-content)50%,transparent)}&:not(input):empty{cursor:default;flex-grow:1}&:focus{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled]{pointer-events:none;opacity:.4}}.tab-disabled{pointer-events:none;opacity:.4}.tabs-border{& .tab{--tab-border-color:transparent transparent var(--tab-border-color)transparent;border-radius:var(--radius-field);position:relative;&:before{--tw-content:"";content:var(--tw-content);background-color:var(--tab-border-color);border-radius:var(--radius-field);width:80%;height:3px;transition:background-color .2s;position:absolute;bottom:0;left:10%}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){&:before{--tab-border-color:currentColor;border-top:3px solid}}}}.tabs-lift{--tabs-height:auto;--tabs-direction:row;&>.tab{--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;border-width:var(--tab-border);padding:var(--tab-paddings);border-color:var(--tab-border-colors);border-start-start-radius:var(--tab-radius-ss);border-start-end-radius:var(--tab-radius-se);border-end-end-radius:var(--tab-radius-ee);border-end-start-radius:var(--tab-radius-es);&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - var(--border));--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));background-color:var(--tab-bg);&:before{z-index:1;content:"";width:var(--tab-corner-width);height:var(--tab-corner-height);background-position:var(--tab-corner-position);background-image:var(--radius-start),var(--radius-end);background-size:min(var(--radius-field),var(--tab-radius-min))min(var(--radius-field),var(--tab-radius-min));inset:var(--tab-inset);background-repeat:no-repeat;display:block;position:absolute}&:first-child:before{--radius-start:none}[dir=rtl] &:first-child:before{transform:rotateY(180deg)}&:last-child:before{--radius-end:none}[dir=rtl] &:last-child:before{transform:rotateY(180deg)}}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-order:1;--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:var(--border)0 0 0;--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:min(var(--radius-field),var(--tab-radius-min));--tab-radius-ee:min(var(--radius-field),var(--tab-radius-min));--tab-border-colors:var(--tab-border-color)transparent transparent transparent;--tab-paddings:0 var(--tab-p)var(--border)var(--tab-p);--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 var(--border)var(--border)var(--border);--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:var(--border)calc(var(--tab-p) - var(--border))0 calc(var(--tab-p) - var(--border));--tab-inset:0 auto auto auto;--radius-start:radial-gradient(circle at bottom left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at bottom right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color)}}}& .tab-content{--tabcontent-order:0;--tabcontent-margin:0 0 calc(-1*var(--border))0;--tabcontent-radius-ss:var(--radius-box);--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:0;--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-es:var(--radius-box)}}}.tabs-box{background-color:var(--color-base-200);border-radius:calc(var(--radius-field) + min(.25rem,calc(var(--radius-field) + var(--radius-field) + var(--radius-field))));box-shadow:0 -.5px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 .5px oklch(0% 0 0/calc(var(--depth)*.05))inset;padding:.25rem;& .tab{border-radius:var(--radius-field);border-style:none;&:focus-visible{outline-offset:2px}}& :is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),& :is(input:checked){background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:0 1px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*50%),transparent),0 1px 6px -4px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*100%),transparent);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}@media (forced-colors:active){&{border:1px solid}}}}.tab-content{--tabcontent-radius-ss:0;--tabcontent-radius-se:0;--tabcontent-radius-es:0;--tabcontent-radius-ee:0;--tabcontent-order:1;width:100%;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-color:#0000;border-width:var(--border);border-start-start-radius:var(--tabcontent-radius-ss);border-start-end-radius:var(--tabcontent-radius-se);border-end-end-radius:var(--tabcontent-radius-ee);border-end-start-radius:var(--tabcontent-radius-es);display:none}.tabs-xs{& :where(.tab){height:calc(var(--size-field,.25rem)*6);--tab-p:.375rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.75rem}}.tabs-sm{& :where(.tab){height:calc(var(--size-field,.25rem)*8);--tab-p:.5rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.875rem}}.tabs-md{& :where(.tab){height:calc(var(--size-field,.25rem)*10);--tab-p:.75rem;--tab-radius-min:calc(.75rem - var(--border));font-size:.875rem}}.tabs-lg{& :where(.tab){height:calc(var(--size-field,.25rem)*12);--tab-p:1rem;--tab-radius-min:calc(1.5rem - var(--border));font-size:1.125rem}}.tabs-xl{& :where(.tab){height:calc(var(--size-field,.25rem)*14);--tab-p:1.25rem;--tab-radius-min:calc(2rem - var(--border));font-size:1.125rem}}@media (width>=640px){.sm\:tabs{--tabs-height:auto;--tabs-direction:row;height:var(--tabs-height);flex-wrap:wrap;flex-direction:var(--tabs-direction);display:flex}.sm\:tab{cursor:pointer;appearance:none;text-align:center;-webkit-user-select:none;user-select:none;--tab-p:1rem;--tab-bg:var(--color-base-100);--tab-border-color:var(--color-base-300);--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:0;--tab-radius-ee:0;--tab-order:0;--tab-radius-min:calc(.75rem - var(--border));flex-wrap:wrap;order:var(--tab-order);height:calc(var(--size-field,.25rem)*10);border-color:#0000;justify-content:center;align-items:center;padding-inline-start:var(--tab-p);padding-inline-end:var(--tab-p);font-size:.875rem;display:inline-flex;position:relative;&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}&:is(input[type=radio]){min-width:fit-content;&:after{content:attr(aria-label)}}&:checked,&:is(.tab-active,[aria-selected=true]){&+.tab-content{height:100%;display:block}}&:not(:checked,:hover,.tab-active,[aria-selected=true]){color:color-mix(in oklab,var(--color-base-content)50%,transparent)}&:not(input):empty{cursor:default;flex-grow:1}&:focus{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled]{pointer-events:none;opacity:.4}}.sm\:tab-disabled{pointer-events:none;opacity:.4}.sm\:tabs-border{& .tab{--tab-border-color:transparent transparent var(--tab-border-color)transparent;border-radius:var(--radius-field);position:relative;&:before{--tw-content:"";content:var(--tw-content);background-color:var(--tab-border-color);border-radius:var(--radius-field);width:80%;height:3px;transition:background-color .2s;position:absolute;bottom:0;left:10%}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){&:before{--tab-border-color:currentColor;border-top:3px solid}}}}.sm\:tabs-lift{--tabs-height:auto;--tabs-direction:row;&>.tab{--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;border-width:var(--tab-border);padding:var(--tab-paddings);border-color:var(--tab-border-colors);border-start-start-radius:var(--tab-radius-ss);border-start-end-radius:var(--tab-radius-se);border-end-end-radius:var(--tab-radius-ee);border-end-start-radius:var(--tab-radius-es);&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - var(--border));--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));background-color:var(--tab-bg);&:before{z-index:1;content:"";width:var(--tab-corner-width);height:var(--tab-corner-height);background-position:var(--tab-corner-position);background-image:var(--radius-start),var(--radius-end);background-size:min(var(--radius-field),var(--tab-radius-min))min(var(--radius-field),var(--tab-radius-min));inset:var(--tab-inset);background-repeat:no-repeat;display:block;position:absolute}&:first-child:before{--radius-start:none}[dir=rtl] &:first-child:before{transform:rotateY(180deg)}&:last-child:before{--radius-end:none}[dir=rtl] &:last-child:before{transform:rotateY(180deg)}}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.sm\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-order:1;--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.sm\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:var(--border)0 0 0;--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:min(var(--radius-field),var(--tab-radius-min));--tab-radius-ee:min(var(--radius-field),var(--tab-radius-min));--tab-border-colors:var(--tab-border-color)transparent transparent transparent;--tab-paddings:0 var(--tab-p)var(--border)var(--tab-p);--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 var(--border)var(--border)var(--border);--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:var(--border)calc(var(--tab-p) - var(--border))0 calc(var(--tab-p) - var(--border));--tab-inset:0 auto auto auto;--radius-start:radial-gradient(circle at bottom left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at bottom right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color)}}}& .tab-content{--tabcontent-order:0;--tabcontent-margin:0 0 calc(-1*var(--border))0;--tabcontent-radius-ss:var(--radius-box);--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:0;--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-es:var(--radius-box)}}}.sm\:tabs-box{background-color:var(--color-base-200);border-radius:calc(var(--radius-field) + min(.25rem,calc(var(--radius-field) + var(--radius-field) + var(--radius-field))));box-shadow:0 -.5px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 .5px oklch(0% 0 0/calc(var(--depth)*.05))inset;padding:.25rem;& .tab{border-radius:var(--radius-field);border-style:none;&:focus-visible{outline-offset:2px}}& :is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),& :is(input:checked){background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:0 1px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*50%),transparent),0 1px 6px -4px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*100%),transparent);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}@media (forced-colors:active){&{border:1px solid}}}}.sm\:tab-content{--tabcontent-radius-ss:0;--tabcontent-radius-se:0;--tabcontent-radius-es:0;--tabcontent-radius-ee:0;--tabcontent-order:1;width:100%;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-color:#0000;border-width:var(--border);border-start-start-radius:var(--tabcontent-radius-ss);border-start-end-radius:var(--tabcontent-radius-se);border-end-end-radius:var(--tabcontent-radius-ee);border-end-start-radius:var(--tabcontent-radius-es);display:none}.sm\:tabs-xs{& :where(.tab){height:calc(var(--size-field,.25rem)*6);--tab-p:.375rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.75rem}}.sm\:tabs-sm{& :where(.tab){height:calc(var(--size-field,.25rem)*8);--tab-p:.5rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.875rem}}.sm\:tabs-md{& :where(.tab){height:calc(var(--size-field,.25rem)*10);--tab-p:.75rem;--tab-radius-min:calc(.75rem - var(--border));font-size:.875rem}}.sm\:tabs-lg{& :where(.tab){height:calc(var(--size-field,.25rem)*12);--tab-p:1rem;--tab-radius-min:calc(1.5rem - var(--border));font-size:1.125rem}}.sm\:tabs-xl{& :where(.tab){height:calc(var(--size-field,.25rem)*14);--tab-p:1.25rem;--tab-radius-min:calc(2rem - var(--border));font-size:1.125rem}}}@media (width>=768px){.md\:tabs{--tabs-height:auto;--tabs-direction:row;height:var(--tabs-height);flex-wrap:wrap;flex-direction:var(--tabs-direction);display:flex}.md\:tab{cursor:pointer;appearance:none;text-align:center;-webkit-user-select:none;user-select:none;--tab-p:1rem;--tab-bg:var(--color-base-100);--tab-border-color:var(--color-base-300);--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:0;--tab-radius-ee:0;--tab-order:0;--tab-radius-min:calc(.75rem - var(--border));flex-wrap:wrap;order:var(--tab-order);height:calc(var(--size-field,.25rem)*10);border-color:#0000;justify-content:center;align-items:center;padding-inline-start:var(--tab-p);padding-inline-end:var(--tab-p);font-size:.875rem;display:inline-flex;position:relative;&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}&:is(input[type=radio]){min-width:fit-content;&:after{content:attr(aria-label)}}&:checked,&:is(.tab-active,[aria-selected=true]){&+.tab-content{height:100%;display:block}}&:not(:checked,:hover,.tab-active,[aria-selected=true]){color:color-mix(in oklab,var(--color-base-content)50%,transparent)}&:not(input):empty{cursor:default;flex-grow:1}&:focus{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled]{pointer-events:none;opacity:.4}}.md\:tab-disabled{pointer-events:none;opacity:.4}.md\:tabs-border{& .tab{--tab-border-color:transparent transparent var(--tab-border-color)transparent;border-radius:var(--radius-field);position:relative;&:before{--tw-content:"";content:var(--tw-content);background-color:var(--tab-border-color);border-radius:var(--radius-field);width:80%;height:3px;transition:background-color .2s;position:absolute;bottom:0;left:10%}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){&:before{--tab-border-color:currentColor;border-top:3px solid}}}}.md\:tabs-lift{--tabs-height:auto;--tabs-direction:row;&>.tab{--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;border-width:var(--tab-border);padding:var(--tab-paddings);border-color:var(--tab-border-colors);border-start-start-radius:var(--tab-radius-ss);border-start-end-radius:var(--tab-radius-se);border-end-end-radius:var(--tab-radius-ee);border-end-start-radius:var(--tab-radius-es);&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - var(--border));--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));background-color:var(--tab-bg);&:before{z-index:1;content:"";width:var(--tab-corner-width);height:var(--tab-corner-height);background-position:var(--tab-corner-position);background-image:var(--radius-start),var(--radius-end);background-size:min(var(--radius-field),var(--tab-radius-min))min(var(--radius-field),var(--tab-radius-min));inset:var(--tab-inset);background-repeat:no-repeat;display:block;position:absolute}&:first-child:before{--radius-start:none}[dir=rtl] &:first-child:before{transform:rotateY(180deg)}&:last-child:before{--radius-end:none}[dir=rtl] &:last-child:before{transform:rotateY(180deg)}}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.md\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-order:1;--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.md\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:var(--border)0 0 0;--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:min(var(--radius-field),var(--tab-radius-min));--tab-radius-ee:min(var(--radius-field),var(--tab-radius-min));--tab-border-colors:var(--tab-border-color)transparent transparent transparent;--tab-paddings:0 var(--tab-p)var(--border)var(--tab-p);--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 var(--border)var(--border)var(--border);--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:var(--border)calc(var(--tab-p) - var(--border))0 calc(var(--tab-p) - var(--border));--tab-inset:0 auto auto auto;--radius-start:radial-gradient(circle at bottom left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at bottom right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color)}}}& .tab-content{--tabcontent-order:0;--tabcontent-margin:0 0 calc(-1*var(--border))0;--tabcontent-radius-ss:var(--radius-box);--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:0;--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-es:var(--radius-box)}}}.md\:tabs-box{background-color:var(--color-base-200);border-radius:calc(var(--radius-field) + min(.25rem,calc(var(--radius-field) + var(--radius-field) + var(--radius-field))));box-shadow:0 -.5px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 .5px oklch(0% 0 0/calc(var(--depth)*.05))inset;padding:.25rem;& .tab{border-radius:var(--radius-field);border-style:none;&:focus-visible{outline-offset:2px}}& :is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),& :is(input:checked){background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:0 1px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*50%),transparent),0 1px 6px -4px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*100%),transparent);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}@media (forced-colors:active){&{border:1px solid}}}}.md\:tab-content{--tabcontent-radius-ss:0;--tabcontent-radius-se:0;--tabcontent-radius-es:0;--tabcontent-radius-ee:0;--tabcontent-order:1;width:100%;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-color:#0000;border-width:var(--border);border-start-start-radius:var(--tabcontent-radius-ss);border-start-end-radius:var(--tabcontent-radius-se);border-end-end-radius:var(--tabcontent-radius-ee);border-end-start-radius:var(--tabcontent-radius-es);display:none}.md\:tabs-xs{& :where(.tab){height:calc(var(--size-field,.25rem)*6);--tab-p:.375rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.75rem}}.md\:tabs-sm{& :where(.tab){height:calc(var(--size-field,.25rem)*8);--tab-p:.5rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.875rem}}.md\:tabs-md{& :where(.tab){height:calc(var(--size-field,.25rem)*10);--tab-p:.75rem;--tab-radius-min:calc(.75rem - var(--border));font-size:.875rem}}.md\:tabs-lg{& :where(.tab){height:calc(var(--size-field,.25rem)*12);--tab-p:1rem;--tab-radius-min:calc(1.5rem - var(--border));font-size:1.125rem}}.md\:tabs-xl{& :where(.tab){height:calc(var(--size-field,.25rem)*14);--tab-p:1.25rem;--tab-radius-min:calc(2rem - var(--border));font-size:1.125rem}}}@media (width>=1024px){.lg\:tabs{--tabs-height:auto;--tabs-direction:row;height:var(--tabs-height);flex-wrap:wrap;flex-direction:var(--tabs-direction);display:flex}.lg\:tab{cursor:pointer;appearance:none;text-align:center;-webkit-user-select:none;user-select:none;--tab-p:1rem;--tab-bg:var(--color-base-100);--tab-border-color:var(--color-base-300);--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:0;--tab-radius-ee:0;--tab-order:0;--tab-radius-min:calc(.75rem - var(--border));flex-wrap:wrap;order:var(--tab-order);height:calc(var(--size-field,.25rem)*10);border-color:#0000;justify-content:center;align-items:center;padding-inline-start:var(--tab-p);padding-inline-end:var(--tab-p);font-size:.875rem;display:inline-flex;position:relative;&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}&:is(input[type=radio]){min-width:fit-content;&:after{content:attr(aria-label)}}&:checked,&:is(.tab-active,[aria-selected=true]){&+.tab-content{height:100%;display:block}}&:not(:checked,:hover,.tab-active,[aria-selected=true]){color:color-mix(in oklab,var(--color-base-content)50%,transparent)}&:not(input):empty{cursor:default;flex-grow:1}&:focus{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled]{pointer-events:none;opacity:.4}}.lg\:tab-disabled{pointer-events:none;opacity:.4}.lg\:tabs-border{& .tab{--tab-border-color:transparent transparent var(--tab-border-color)transparent;border-radius:var(--radius-field);position:relative;&:before{--tw-content:"";content:var(--tw-content);background-color:var(--tab-border-color);border-radius:var(--radius-field);width:80%;height:3px;transition:background-color .2s;position:absolute;bottom:0;left:10%}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){&:before{--tab-border-color:currentColor;border-top:3px solid}}}}.lg\:tabs-lift{--tabs-height:auto;--tabs-direction:row;&>.tab{--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;border-width:var(--tab-border);padding:var(--tab-paddings);border-color:var(--tab-border-colors);border-start-start-radius:var(--tab-radius-ss);border-start-end-radius:var(--tab-radius-se);border-end-end-radius:var(--tab-radius-ee);border-end-start-radius:var(--tab-radius-es);&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - var(--border));--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));background-color:var(--tab-bg);&:before{z-index:1;content:"";width:var(--tab-corner-width);height:var(--tab-corner-height);background-position:var(--tab-corner-position);background-image:var(--radius-start),var(--radius-end);background-size:min(var(--radius-field),var(--tab-radius-min))min(var(--radius-field),var(--tab-radius-min));inset:var(--tab-inset);background-repeat:no-repeat;display:block;position:absolute}&:first-child:before{--radius-start:none}[dir=rtl] &:first-child:before{transform:rotateY(180deg)}&:last-child:before{--radius-end:none}[dir=rtl] &:last-child:before{transform:rotateY(180deg)}}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.lg\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-order:1;--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.lg\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:var(--border)0 0 0;--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:min(var(--radius-field),var(--tab-radius-min));--tab-radius-ee:min(var(--radius-field),var(--tab-radius-min));--tab-border-colors:var(--tab-border-color)transparent transparent transparent;--tab-paddings:0 var(--tab-p)var(--border)var(--tab-p);--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 var(--border)var(--border)var(--border);--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:var(--border)calc(var(--tab-p) - var(--border))0 calc(var(--tab-p) - var(--border));--tab-inset:0 auto auto auto;--radius-start:radial-gradient(circle at bottom left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at bottom right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color)}}}& .tab-content{--tabcontent-order:0;--tabcontent-margin:0 0 calc(-1*var(--border))0;--tabcontent-radius-ss:var(--radius-box);--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:0;--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-es:var(--radius-box)}}}.lg\:tabs-box{background-color:var(--color-base-200);border-radius:calc(var(--radius-field) + min(.25rem,calc(var(--radius-field) + var(--radius-field) + var(--radius-field))));box-shadow:0 -.5px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 .5px oklch(0% 0 0/calc(var(--depth)*.05))inset;padding:.25rem;& .tab{border-radius:var(--radius-field);border-style:none;&:focus-visible{outline-offset:2px}}& :is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),& :is(input:checked){background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:0 1px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*50%),transparent),0 1px 6px -4px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*100%),transparent);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}@media (forced-colors:active){&{border:1px solid}}}}.lg\:tab-content{--tabcontent-radius-ss:0;--tabcontent-radius-se:0;--tabcontent-radius-es:0;--tabcontent-radius-ee:0;--tabcontent-order:1;width:100%;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-color:#0000;border-width:var(--border);border-start-start-radius:var(--tabcontent-radius-ss);border-start-end-radius:var(--tabcontent-radius-se);border-end-end-radius:var(--tabcontent-radius-ee);border-end-start-radius:var(--tabcontent-radius-es);display:none}.lg\:tabs-xs{& :where(.tab){height:calc(var(--size-field,.25rem)*6);--tab-p:.375rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.75rem}}.lg\:tabs-sm{& :where(.tab){height:calc(var(--size-field,.25rem)*8);--tab-p:.5rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.875rem}}.lg\:tabs-md{& :where(.tab){height:calc(var(--size-field,.25rem)*10);--tab-p:.75rem;--tab-radius-min:calc(.75rem - var(--border));font-size:.875rem}}.lg\:tabs-lg{& :where(.tab){height:calc(var(--size-field,.25rem)*12);--tab-p:1rem;--tab-radius-min:calc(1.5rem - var(--border));font-size:1.125rem}}.lg\:tabs-xl{& :where(.tab){height:calc(var(--size-field,.25rem)*14);--tab-p:1.25rem;--tab-radius-min:calc(2rem - var(--border));font-size:1.125rem}}}@media (width>=1280px){.xl\:tabs{--tabs-height:auto;--tabs-direction:row;height:var(--tabs-height);flex-wrap:wrap;flex-direction:var(--tabs-direction);display:flex}.xl\:tab{cursor:pointer;appearance:none;text-align:center;-webkit-user-select:none;user-select:none;--tab-p:1rem;--tab-bg:var(--color-base-100);--tab-border-color:var(--color-base-300);--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:0;--tab-radius-ee:0;--tab-order:0;--tab-radius-min:calc(.75rem - var(--border));flex-wrap:wrap;order:var(--tab-order);height:calc(var(--size-field,.25rem)*10);border-color:#0000;justify-content:center;align-items:center;padding-inline-start:var(--tab-p);padding-inline-end:var(--tab-p);font-size:.875rem;display:inline-flex;position:relative;&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}&:is(input[type=radio]){min-width:fit-content;&:after{content:attr(aria-label)}}&:checked,&:is(.tab-active,[aria-selected=true]){&+.tab-content{height:100%;display:block}}&:not(:checked,:hover,.tab-active,[aria-selected=true]){color:color-mix(in oklab,var(--color-base-content)50%,transparent)}&:not(input):empty{cursor:default;flex-grow:1}&:focus{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled]{pointer-events:none;opacity:.4}}.xl\:tab-disabled{pointer-events:none;opacity:.4}.xl\:tabs-border{& .tab{--tab-border-color:transparent transparent var(--tab-border-color)transparent;border-radius:var(--radius-field);position:relative;&:before{--tw-content:"";content:var(--tw-content);background-color:var(--tab-border-color);border-radius:var(--radius-field);width:80%;height:3px;transition:background-color .2s;position:absolute;bottom:0;left:10%}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){&:before{--tab-border-color:currentColor;border-top:3px solid}}}}.xl\:tabs-lift{--tabs-height:auto;--tabs-direction:row;&>.tab{--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;border-width:var(--tab-border);padding:var(--tab-paddings);border-color:var(--tab-border-colors);border-start-start-radius:var(--tab-radius-ss);border-start-end-radius:var(--tab-radius-se);border-end-end-radius:var(--tab-radius-ee);border-end-start-radius:var(--tab-radius-es);&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - var(--border));--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));background-color:var(--tab-bg);&:before{z-index:1;content:"";width:var(--tab-corner-width);height:var(--tab-corner-height);background-position:var(--tab-corner-position);background-image:var(--radius-start),var(--radius-end);background-size:min(var(--radius-field),var(--tab-radius-min))min(var(--radius-field),var(--tab-radius-min));inset:var(--tab-inset);background-repeat:no-repeat;display:block;position:absolute}&:first-child:before{--radius-start:none}[dir=rtl] &:first-child:before{transform:rotateY(180deg)}&:last-child:before{--radius-end:none}[dir=rtl] &:last-child:before{transform:rotateY(180deg)}}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.xl\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-order:1;--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.xl\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:var(--border)0 0 0;--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:min(var(--radius-field),var(--tab-radius-min));--tab-radius-ee:min(var(--radius-field),var(--tab-radius-min));--tab-border-colors:var(--tab-border-color)transparent transparent transparent;--tab-paddings:0 var(--tab-p)var(--border)var(--tab-p);--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 var(--border)var(--border)var(--border);--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:var(--border)calc(var(--tab-p) - var(--border))0 calc(var(--tab-p) - var(--border));--tab-inset:0 auto auto auto;--radius-start:radial-gradient(circle at bottom left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at bottom right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color)}}}& .tab-content{--tabcontent-order:0;--tabcontent-margin:0 0 calc(-1*var(--border))0;--tabcontent-radius-ss:var(--radius-box);--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:0;--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-es:var(--radius-box)}}}.xl\:tabs-box{background-color:var(--color-base-200);border-radius:calc(var(--radius-field) + min(.25rem,calc(var(--radius-field) + var(--radius-field) + var(--radius-field))));box-shadow:0 -.5px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 .5px oklch(0% 0 0/calc(var(--depth)*.05))inset;padding:.25rem;& .tab{border-radius:var(--radius-field);border-style:none;&:focus-visible{outline-offset:2px}}& :is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),& :is(input:checked){background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:0 1px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*50%),transparent),0 1px 6px -4px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*100%),transparent);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}@media (forced-colors:active){&{border:1px solid}}}}.xl\:tab-content{--tabcontent-radius-ss:0;--tabcontent-radius-se:0;--tabcontent-radius-es:0;--tabcontent-radius-ee:0;--tabcontent-order:1;width:100%;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-color:#0000;border-width:var(--border);border-start-start-radius:var(--tabcontent-radius-ss);border-start-end-radius:var(--tabcontent-radius-se);border-end-end-radius:var(--tabcontent-radius-ee);border-end-start-radius:var(--tabcontent-radius-es);display:none}.xl\:tabs-xs{& :where(.tab){height:calc(var(--size-field,.25rem)*6);--tab-p:.375rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.75rem}}.xl\:tabs-sm{& :where(.tab){height:calc(var(--size-field,.25rem)*8);--tab-p:.5rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.875rem}}.xl\:tabs-md{& :where(.tab){height:calc(var(--size-field,.25rem)*10);--tab-p:.75rem;--tab-radius-min:calc(.75rem - var(--border));font-size:.875rem}}.xl\:tabs-lg{& :where(.tab){height:calc(var(--size-field,.25rem)*12);--tab-p:1rem;--tab-radius-min:calc(1.5rem - var(--border));font-size:1.125rem}}.xl\:tabs-xl{& :where(.tab){height:calc(var(--size-field,.25rem)*14);--tab-p:1.25rem;--tab-radius-min:calc(2rem - var(--border));font-size:1.125rem}}}@media (width>=1536px){.\32 xl\:tabs{--tabs-height:auto;--tabs-direction:row;height:var(--tabs-height);flex-wrap:wrap;flex-direction:var(--tabs-direction);display:flex}.\32 xl\:tab{cursor:pointer;appearance:none;text-align:center;-webkit-user-select:none;user-select:none;--tab-p:1rem;--tab-bg:var(--color-base-100);--tab-border-color:var(--color-base-300);--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:0;--tab-radius-ee:0;--tab-order:0;--tab-radius-min:calc(.75rem - var(--border));flex-wrap:wrap;order:var(--tab-order);height:calc(var(--size-field,.25rem)*10);border-color:#0000;justify-content:center;align-items:center;padding-inline-start:var(--tab-p);padding-inline-end:var(--tab-p);font-size:.875rem;display:inline-flex;position:relative;&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}&:is(input[type=radio]){min-width:fit-content;&:after{content:attr(aria-label)}}&:checked,&:is(.tab-active,[aria-selected=true]){&+.tab-content{height:100%;display:block}}&:not(:checked,:hover,.tab-active,[aria-selected=true]){color:color-mix(in oklab,var(--color-base-content)50%,transparent)}&:not(input):empty{cursor:default;flex-grow:1}&:focus{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled]{pointer-events:none;opacity:.4}}.\32 xl\:tab-disabled{pointer-events:none;opacity:.4}.\32 xl\:tabs-border{& .tab{--tab-border-color:transparent transparent var(--tab-border-color)transparent;border-radius:var(--radius-field);position:relative;&:before{--tw-content:"";content:var(--tw-content);background-color:var(--tab-border-color);border-radius:var(--radius-field);width:80%;height:3px;transition:background-color .2s;position:absolute;bottom:0;left:10%}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){&:before{--tab-border-color:currentColor;border-top:3px solid}}}}.\32 xl\:tabs-lift{--tabs-height:auto;--tabs-direction:row;&>.tab{--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;border-width:var(--tab-border);padding:var(--tab-paddings);border-color:var(--tab-border-colors);border-start-start-radius:var(--tab-radius-ss);border-start-end-radius:var(--tab-radius-se);border-end-end-radius:var(--tab-radius-ee);border-end-start-radius:var(--tab-radius-es);&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - var(--border));--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));background-color:var(--tab-bg);&:before{z-index:1;content:"";width:var(--tab-corner-width);height:var(--tab-corner-height);background-position:var(--tab-corner-position);background-image:var(--radius-start),var(--radius-end);background-size:min(var(--radius-field),var(--tab-radius-min))min(var(--radius-field),var(--tab-radius-min));inset:var(--tab-inset);background-repeat:no-repeat;display:block;position:absolute}&:first-child:before{--radius-start:none}[dir=rtl] &:first-child:before{transform:rotateY(180deg)}&:last-child:before{--radius-end:none}[dir=rtl] &:last-child:before{transform:rotateY(180deg)}}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.\32 xl\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 var(--border)0;--tab-radius-ss:min(var(--radius-field),var(--tab-radius-min));--tab-radius-se:min(var(--radius-field),var(--tab-radius-min));--tab-radius-es:0;--tab-radius-ee:0;--tab-paddings:var(--border)var(--tab-p)0 var(--tab-p);--tab-border-colors:transparent transparent var(--tab-border-color)transparent;--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:var(--border)var(--border)0 var(--border);--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-p) - var(--border))var(--border)calc(var(--tab-p) - var(--border));--tab-inset:auto auto 0 auto;--radius-start:radial-gradient(circle at top left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at top right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color)}}}& .tab-content{--tabcontent-order:1;--tabcontent-margin:calc(-1*var(--border))0 0 0;--tabcontent-radius-ss:0;--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:var(--radius-box);--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-ss:var(--radius-box)}}}.\32 xl\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:var(--border)0 0 0;--tab-radius-ss:0;--tab-radius-se:0;--tab-radius-es:min(var(--radius-field),var(--tab-radius-min));--tab-radius-ee:min(var(--radius-field),var(--tab-radius-min));--tab-border-colors:var(--tab-border-color)transparent transparent transparent;--tab-paddings:0 var(--tab-p)var(--border)var(--tab-p);--tab-corner-width:calc(100% + min(var(--radius-field),var(--tab-radius-min))*2);--tab-corner-height:min(var(--radius-field),var(--tab-radius-min));--tab-corner-position:top left,top right;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 var(--border)var(--border)var(--border);--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:var(--border)calc(var(--tab-p) - var(--border))0 calc(var(--tab-p) - var(--border));--tab-inset:0 auto auto auto;--radius-start:radial-gradient(circle at bottom left,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px));--radius-end:radial-gradient(circle at bottom right,transparent var(--tab-grad),var(--tab-border-color)calc(var(--tab-grad) + .25px),var(--tab-border-color)calc(var(--tab-grad) + var(--border)),var(--tab-bg)calc(var(--tab-grad) + var(--border) + .25px))}}&:has(.tab-content){&>.tab:first-child{&:not(.tab-active,[aria-selected=true]){--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color)}}}& .tab-content{--tabcontent-order:0;--tabcontent-margin:0 0 calc(-1*var(--border))0;--tabcontent-radius-ss:var(--radius-box);--tabcontent-radius-se:var(--radius-box);--tabcontent-radius-es:0;--tabcontent-radius-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--tabcontent-radius-es:var(--radius-box)}}}.\32 xl\:tabs-box{background-color:var(--color-base-200);border-radius:calc(var(--radius-field) + min(.25rem,calc(var(--radius-field) + var(--radius-field) + var(--radius-field))));box-shadow:0 -.5px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 .5px oklch(0% 0 0/calc(var(--depth)*.05))inset;padding:.25rem;& .tab{border-radius:var(--radius-field);border-style:none;&:focus-visible{outline-offset:2px}}& :is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),& :is(input:checked){background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:0 1px oklch(100% 0 0/calc(var(--depth)*.1))inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*50%),transparent),0 1px 6px -4px color-mix(in oklab,var(--color-neutral)calc(var(--depth)*100%),transparent);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}@media (forced-colors:active){&{border:1px solid}}}}.\32 xl\:tab-content{--tabcontent-radius-ss:0;--tabcontent-radius-se:0;--tabcontent-radius-es:0;--tabcontent-radius-ee:0;--tabcontent-order:1;width:100%;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-color:#0000;border-width:var(--border);border-start-start-radius:var(--tabcontent-radius-ss);border-start-end-radius:var(--tabcontent-radius-se);border-end-end-radius:var(--tabcontent-radius-ee);border-end-start-radius:var(--tabcontent-radius-es);display:none}.\32 xl\:tabs-xs{& :where(.tab){height:calc(var(--size-field,.25rem)*6);--tab-p:.375rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.75rem}}.\32 xl\:tabs-sm{& :where(.tab){height:calc(var(--size-field,.25rem)*8);--tab-p:.5rem;--tab-radius-min:calc(.5rem - var(--border));font-size:.875rem}}.\32 xl\:tabs-md{& :where(.tab){height:calc(var(--size-field,.25rem)*10);--tab-p:.75rem;--tab-radius-min:calc(.75rem - var(--border));font-size:.875rem}}.\32 xl\:tabs-lg{& :where(.tab){height:calc(var(--size-field,.25rem)*12);--tab-p:1rem;--tab-radius-min:calc(1.5rem - var(--border));font-size:1.125rem}}.\32 xl\:tabs-xl{& :where(.tab){height:calc(var(--size-field,.25rem)*14);--tab-p:1.25rem;--tab-radius-min:calc(2rem - var(--border));font-size:1.125rem}}}

package/components/table/class.json

@@ -5,5 +5,6 @@
   "table-xs",
   "table-sm",
   "table-md",
-  "table-lg"
+  "table-lg",
+  "table-xl"
 ]

package/components/table/index.js

@@ -1 +1,7 @@
-export default {".table":{"@apply relative w-full rounded-box text-left text-sm rtl:text-right":{},"tr.row-hover":{"&,\n    &:nth-child(even)":{"@apply hover:bg-base-200":{}}},":where(th, td)":{"@apply px-4 py-3 align-middle":{}},":where(thead, tfoot)":{"@apply text-base-content/60 whitespace-nowrap text-xs font-bold":{}},":where(tfoot)":{"@apply border-t-base-200 border-t":{}},":where(.table-pin-rows thead tr)":{"@apply bg-base-100 sticky top-0 z-[1]":{}},":where(.table-pin-rows tfoot tr)":{"@apply bg-base-100 sticky bottom-0 z-[1]":{}},":where(.table-pin-cols tr th)":{"@apply bg-base-100 sticky left-0 right-0":{}},":where(thead tr, tbody tr:not(:last-child), tbody tr:first-child:last-child)":{"@apply border-b-base-200 border-b":{}}},".table-zebra":{"tbody":{"tr":{"&:nth-child(even)":{"@apply bg-base-200":{},":where(.table-pin-cols tr th)":{"@apply bg-base-200":{}}},"&.row-hover":{"&,\n        &:nth-child(even)":{"@apply hover:bg-base-300":{}}}}}},".table-xs":{":not(thead):not(tfoot) tr":{"@apply text-xs":{}},":where(th, td)":{"@apply px-2 py-1":{}}},".table-sm":{":not(thead):not(tfoot) tr":{"@apply text-sm":{}},":where(th, td)":{"@apply px-3 py-2":{}}},".table-md":{":not(thead):not(tfoot) tr":{"@apply text-sm":{}},":where(th, td)":{"@apply px-4 py-3":{}}},".table-lg":{":not(thead):not(tfoot) tr":{"@apply text-base":{}},":where(th, td)":{"@apply px-6 py-4":{}}}};
+import table from './object.js';
+import { addPrefix } from '../../functions/addPrefix.js';
+
+export default ({ addComponents, prefix = '' }) => {
+  const prefixedtable = addPrefix(table, prefix);
+  addComponents({ ...prefixedtable });
+};

package/components/table/object.js

@@ -0,0 +1 @@
+export default {".table":{"font-size":"0.875rem","position":"relative","width":"100%","border-radius":"var(--radius-box)","text-align":"left","&:where(:dir(rtl), [dir=\"rtl\"], [dir=\"rtl\"] *)":{"text-align":"right"},"tr.row-hover":{"&, &:nth-child(even)":{"&:hover":{"@media (hover: hover)":{"background-color":"var(--color-base-200)"}}}},":where(th, td)":{"padding-inline":"calc(0.25rem * 4)","padding-block":"calc(0.25rem * 3)","vertical-align":"middle"},":where(thead, tfoot)":{"white-space":"nowrap","color":"color-mix(in oklab, var(--color-base-content) 60%, transparent)","font-size":"0.875rem","font-weight":600},":where(tfoot)":{"border-top":"var(--border) solid color-mix(in oklch, var(--color-base-content) 5%, transparent)"},":where(.table-pin-rows thead tr)":{"position":"sticky","top":"calc(0.25rem * 0)","z-index":1,"background-color":"var(--color-base-100)"},":where(.table-pin-rows tfoot tr)":{"position":"sticky","bottom":"calc(0.25rem * 0)","z-index":1,"background-color":"var(--color-base-100)"},":where(.table-pin-cols tr th)":{"position":"sticky","right":"calc(0.25rem * 0)","left":"calc(0.25rem * 0)","background-color":"var(--color-base-100)"},":where(thead tr, tbody tr:not(:last-child), tbody tr:first-child:last-child)":{"border-bottom":"var(--border) solid color-mix(in oklch, var(--color-base-content) 5%, transparent)"}},".table-zebra":{"tbody":{"tr":{"&:nth-child(even)":{"background-color":"var(--color-base-200)",":where(.table-pin-cols tr th)":{"background-color":"var(--color-base-200)"}},"&.row-hover":{"&, &:nth-child(even)":{"&:hover":{"@media (hover: hover)":{"background-color":"var(--color-base-300)"}}}}}}},".table-xs":{":not(thead, tfoot) tr":{"font-size":"0.6875rem"},":where(th, td)":{"padding-inline":"calc(0.25rem * 2)","padding-block":"calc(0.25rem * 1)"}},".table-sm":{":not(thead, tfoot) tr":{"font-size":"0.75rem"},":where(th, td)":{"padding-inline":"calc(0.25rem * 3)","padding-block":"calc(0.25rem * 2)"}},".table-md":{":not(thead, tfoot) tr":{"font-size":"0.875rem"},":where(th, td)":{"padding-inline":"calc(0.25rem * 4)","padding-block":"calc(0.25rem * 3)"}},".table-lg":{":not(thead, tfoot) tr":{"font-size":"1.125rem"},":where(th, td)":{"padding-inline":"calc(0.25rem * 5)","padding-block":"calc(0.25rem * 4)"}},".table-xl":{":not(thead, tfoot) tr":{"font-size":"1.375rem"},":where(th, td)":{"padding-inline":"calc(0.25rem * 6)","padding-block":"calc(0.25rem * 5)"}}};

package/components/table.css

@@ -1 +1 @@
-/*! 🌼 daisyUI 5.0.0-alpha.9 – MIT License */ .table{border-radius:var(--radius-box,1rem);text-align:left;font-size:var(--font-size-sm,.875rem);line-height:var(--tw-leading,var(--font-size-sm--line-height,1.25rem));width:100%;position:relative;&:where(:dir(rtl),[dir=rtl],[dir=rtl] *){text-align:right}& tr.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-200,oklch(96.1151% 0 0))}}}}}& :where(th,td){padding-top:var(--spacing-3,.75rem);padding-bottom:var(--spacing-3,.75rem);padding-left:var(--spacing-4,1rem);padding-right:var(--spacing-4,1rem);vertical-align:middle}& :where(thead,tfoot){white-space:nowrap;font-size:var(--font-size-xs,.75rem);line-height:var(--tw-leading,var(--font-size-xs--line-height,1rem));--tw-font-weight:700;color:color-mix(in srgb,var(--color-base-content,oklch(27.8078% .029596 256.848))60%,transparent);font-weight:700}& :where(tfoot){border-top-style:var(--tw-border-style);border-top-width:1px;border-top-color:var(--color-base-200,oklch(96.1151% 0 0))}& :where(.table-pin-rows thead tr){top:var(--spacing-0,0px);z-index:1;background-color:var(--color-base-100,oklch(100% 0 0));position:sticky}& :where(.table-pin-rows tfoot tr){bottom:var(--spacing-0,0px);z-index:1;background-color:var(--color-base-100,oklch(100% 0 0));position:sticky}& :where(.table-pin-cols tr th){right:var(--spacing-0,0px);left:var(--spacing-0,0px);background-color:var(--color-base-100,oklch(100% 0 0));position:sticky}& :where(thead tr,tbody tr:not(:last-child),tbody tr:first-child:last-child){border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-bottom-color:var(--color-base-200,oklch(96.1151% 0 0))}}.table-zebra{& tbody{& tr{&:nth-child(2n){background-color:var(--color-base-200,oklch(96.1151% 0 0));& :where(.table-pin-cols tr th){background-color:var(--color-base-200,oklch(96.1151% 0 0))}}&.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-300,oklch(92.4169% .00108 197.138))}}}}}}}}.table-xs{& :not(thead):not(tfoot) tr{font-size:var(--font-size-xs,.75rem);line-height:var(--tw-leading,var(--font-size-xs--line-height,1rem))}& :where(th,td){padding-top:var(--spacing-1,.25rem);padding-bottom:var(--spacing-1,.25rem);padding-left:var(--spacing-2,.5rem);padding-right:var(--spacing-2,.5rem)}}.table-sm{& :not(thead):not(tfoot) tr{font-size:var(--font-size-sm,.875rem);line-height:var(--tw-leading,var(--font-size-sm--line-height,1.25rem))}& :where(th,td){padding-top:var(--spacing-2,.5rem);padding-bottom:var(--spacing-2,.5rem);padding-left:var(--spacing-3,.75rem);padding-right:var(--spacing-3,.75rem)}}.table-md{& :not(thead):not(tfoot) tr{font-size:var(--font-size-sm,.875rem);line-height:var(--tw-leading,var(--font-size-sm--line-height,1.25rem))}& :where(th,td){padding-top:var(--spacing-3,.75rem);padding-bottom:var(--spacing-3,.75rem);padding-left:var(--spacing-4,1rem);padding-right:var(--spacing-4,1rem)}}.table-lg{& :not(thead):not(tfoot) tr{font-size:var(--font-size-base,1rem);line-height:var(--tw-leading,var(--font-size-base--line-height,1.5rem))}& :where(th,td){padding-top:var(--spacing-4,1rem);padding-bottom:var(--spacing-4,1rem);padding-left:var(--spacing-6,1.5rem);padding-right:var(--spacing-6,1.5rem)}}
+/*! 🌼 daisyUI 5.0.0-beta.2 - MIT License */ .table{border-radius:var(--radius-box);text-align:left;width:100%;font-size:.875rem;position:relative;&:where(:dir(rtl),[dir=rtl],[dir=rtl] *){text-align:right}& tr.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-200)}}}}}& :where(th,td){vertical-align:middle;padding-block:.75rem;padding-inline:1rem}& :where(thead,tfoot){white-space:nowrap;color:color-mix(in oklab,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}& :where(.table-pin-rows thead tr){z-index:1;background-color:var(--color-base-100);position:sticky;top:0}& :where(.table-pin-rows tfoot tr){z-index:1;background-color:var(--color-base-100);position:sticky;bottom:0}& :where(.table-pin-cols tr th){background-color:var(--color-base-100);position:sticky;left:0;right:0}& :where(thead tr,tbody tr:not(:last-child),tbody tr:first-child:last-child){border-bottom:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}}.table-zebra{& tbody{& tr{&:nth-child(2n){background-color:var(--color-base-200);& :where(.table-pin-cols tr th){background-color:var(--color-base-200)}}&.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-300)}}}}}}}}.table-xs{& :not(thead,tfoot) tr{font-size:.6875rem}& :where(th,td){padding-block:.25rem;padding-inline:.5rem}}.table-sm{& :not(thead,tfoot) tr{font-size:.75rem}& :where(th,td){padding-block:.5rem;padding-inline:.75rem}}.table-md{& :not(thead,tfoot) tr{font-size:.875rem}& :where(th,td){padding-block:.75rem;padding-inline:1rem}}.table-lg{& :not(thead,tfoot) tr{font-size:1.125rem}& :where(th,td){padding-block:1rem;padding-inline:1.25rem}}.table-xl{& :not(thead,tfoot) tr{font-size:1.375rem}& :where(th,td){padding-block:1.25rem;padding-inline:1.5rem}}@media (width>=640px){.sm\:table{border-radius:var(--radius-box);text-align:left;width:100%;font-size:.875rem;position:relative;&:where(:dir(rtl),[dir=rtl],[dir=rtl] *){text-align:right}& tr.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-200)}}}}}& :where(th,td){vertical-align:middle;padding-block:.75rem;padding-inline:1rem}& :where(thead,tfoot){white-space:nowrap;color:color-mix(in oklab,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}& :where(.table-pin-rows thead tr){z-index:1;background-color:var(--color-base-100);position:sticky;top:0}& :where(.table-pin-rows tfoot tr){z-index:1;background-color:var(--color-base-100);position:sticky;bottom:0}& :where(.table-pin-cols tr th){background-color:var(--color-base-100);position:sticky;left:0;right:0}& :where(thead tr,tbody tr:not(:last-child),tbody tr:first-child:last-child){border-bottom:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}}.sm\:table-zebra{& tbody{& tr{&:nth-child(2n){background-color:var(--color-base-200);& :where(.table-pin-cols tr th){background-color:var(--color-base-200)}}&.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-300)}}}}}}}}.sm\:table-xs{& :not(thead,tfoot) tr{font-size:.6875rem}& :where(th,td){padding-block:.25rem;padding-inline:.5rem}}.sm\:table-sm{& :not(thead,tfoot) tr{font-size:.75rem}& :where(th,td){padding-block:.5rem;padding-inline:.75rem}}.sm\:table-md{& :not(thead,tfoot) tr{font-size:.875rem}& :where(th,td){padding-block:.75rem;padding-inline:1rem}}.sm\:table-lg{& :not(thead,tfoot) tr{font-size:1.125rem}& :where(th,td){padding-block:1rem;padding-inline:1.25rem}}.sm\:table-xl{& :not(thead,tfoot) tr{font-size:1.375rem}& :where(th,td){padding-block:1.25rem;padding-inline:1.5rem}}}@media (width>=768px){.md\:table{border-radius:var(--radius-box);text-align:left;width:100%;font-size:.875rem;position:relative;&:where(:dir(rtl),[dir=rtl],[dir=rtl] *){text-align:right}& tr.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-200)}}}}}& :where(th,td){vertical-align:middle;padding-block:.75rem;padding-inline:1rem}& :where(thead,tfoot){white-space:nowrap;color:color-mix(in oklab,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}& :where(.table-pin-rows thead tr){z-index:1;background-color:var(--color-base-100);position:sticky;top:0}& :where(.table-pin-rows tfoot tr){z-index:1;background-color:var(--color-base-100);position:sticky;bottom:0}& :where(.table-pin-cols tr th){background-color:var(--color-base-100);position:sticky;left:0;right:0}& :where(thead tr,tbody tr:not(:last-child),tbody tr:first-child:last-child){border-bottom:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}}.md\:table-zebra{& tbody{& tr{&:nth-child(2n){background-color:var(--color-base-200);& :where(.table-pin-cols tr th){background-color:var(--color-base-200)}}&.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-300)}}}}}}}}.md\:table-xs{& :not(thead,tfoot) tr{font-size:.6875rem}& :where(th,td){padding-block:.25rem;padding-inline:.5rem}}.md\:table-sm{& :not(thead,tfoot) tr{font-size:.75rem}& :where(th,td){padding-block:.5rem;padding-inline:.75rem}}.md\:table-md{& :not(thead,tfoot) tr{font-size:.875rem}& :where(th,td){padding-block:.75rem;padding-inline:1rem}}.md\:table-lg{& :not(thead,tfoot) tr{font-size:1.125rem}& :where(th,td){padding-block:1rem;padding-inline:1.25rem}}.md\:table-xl{& :not(thead,tfoot) tr{font-size:1.375rem}& :where(th,td){padding-block:1.25rem;padding-inline:1.5rem}}}@media (width>=1024px){.lg\:table{border-radius:var(--radius-box);text-align:left;width:100%;font-size:.875rem;position:relative;&:where(:dir(rtl),[dir=rtl],[dir=rtl] *){text-align:right}& tr.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-200)}}}}}& :where(th,td){vertical-align:middle;padding-block:.75rem;padding-inline:1rem}& :where(thead,tfoot){white-space:nowrap;color:color-mix(in oklab,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}& :where(.table-pin-rows thead tr){z-index:1;background-color:var(--color-base-100);position:sticky;top:0}& :where(.table-pin-rows tfoot tr){z-index:1;background-color:var(--color-base-100);position:sticky;bottom:0}& :where(.table-pin-cols tr th){background-color:var(--color-base-100);position:sticky;left:0;right:0}& :where(thead tr,tbody tr:not(:last-child),tbody tr:first-child:last-child){border-bottom:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}}.lg\:table-zebra{& tbody{& tr{&:nth-child(2n){background-color:var(--color-base-200);& :where(.table-pin-cols tr th){background-color:var(--color-base-200)}}&.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-300)}}}}}}}}.lg\:table-xs{& :not(thead,tfoot) tr{font-size:.6875rem}& :where(th,td){padding-block:.25rem;padding-inline:.5rem}}.lg\:table-sm{& :not(thead,tfoot) tr{font-size:.75rem}& :where(th,td){padding-block:.5rem;padding-inline:.75rem}}.lg\:table-md{& :not(thead,tfoot) tr{font-size:.875rem}& :where(th,td){padding-block:.75rem;padding-inline:1rem}}.lg\:table-lg{& :not(thead,tfoot) tr{font-size:1.125rem}& :where(th,td){padding-block:1rem;padding-inline:1.25rem}}.lg\:table-xl{& :not(thead,tfoot) tr{font-size:1.375rem}& :where(th,td){padding-block:1.25rem;padding-inline:1.5rem}}}@media (width>=1280px){.xl\:table{border-radius:var(--radius-box);text-align:left;width:100%;font-size:.875rem;position:relative;&:where(:dir(rtl),[dir=rtl],[dir=rtl] *){text-align:right}& tr.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-200)}}}}}& :where(th,td){vertical-align:middle;padding-block:.75rem;padding-inline:1rem}& :where(thead,tfoot){white-space:nowrap;color:color-mix(in oklab,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}& :where(.table-pin-rows thead tr){z-index:1;background-color:var(--color-base-100);position:sticky;top:0}& :where(.table-pin-rows tfoot tr){z-index:1;background-color:var(--color-base-100);position:sticky;bottom:0}& :where(.table-pin-cols tr th){background-color:var(--color-base-100);position:sticky;left:0;right:0}& :where(thead tr,tbody tr:not(:last-child),tbody tr:first-child:last-child){border-bottom:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}}.xl\:table-zebra{& tbody{& tr{&:nth-child(2n){background-color:var(--color-base-200);& :where(.table-pin-cols tr th){background-color:var(--color-base-200)}}&.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-300)}}}}}}}}.xl\:table-xs{& :not(thead,tfoot) tr{font-size:.6875rem}& :where(th,td){padding-block:.25rem;padding-inline:.5rem}}.xl\:table-sm{& :not(thead,tfoot) tr{font-size:.75rem}& :where(th,td){padding-block:.5rem;padding-inline:.75rem}}.xl\:table-md{& :not(thead,tfoot) tr{font-size:.875rem}& :where(th,td){padding-block:.75rem;padding-inline:1rem}}.xl\:table-lg{& :not(thead,tfoot) tr{font-size:1.125rem}& :where(th,td){padding-block:1rem;padding-inline:1.25rem}}.xl\:table-xl{& :not(thead,tfoot) tr{font-size:1.375rem}& :where(th,td){padding-block:1.25rem;padding-inline:1.5rem}}}@media (width>=1536px){.\32 xl\:table{border-radius:var(--radius-box);text-align:left;width:100%;font-size:.875rem;position:relative;&:where(:dir(rtl),[dir=rtl],[dir=rtl] *){text-align:right}& tr.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-200)}}}}}& :where(th,td){vertical-align:middle;padding-block:.75rem;padding-inline:1rem}& :where(thead,tfoot){white-space:nowrap;color:color-mix(in oklab,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}& :where(.table-pin-rows thead tr){z-index:1;background-color:var(--color-base-100);position:sticky;top:0}& :where(.table-pin-rows tfoot tr){z-index:1;background-color:var(--color-base-100);position:sticky;bottom:0}& :where(.table-pin-cols tr th){background-color:var(--color-base-100);position:sticky;left:0;right:0}& :where(thead tr,tbody tr:not(:last-child),tbody tr:first-child:last-child){border-bottom:var(--border)solid color-mix(in oklch,var(--color-base-content)5%,transparent)}}.\32 xl\:table-zebra{& tbody{& tr{&:nth-child(2n){background-color:var(--color-base-200);& :where(.table-pin-cols tr th){background-color:var(--color-base-200)}}&.row-hover{&,&:nth-child(2n){&:hover{@media (hover:hover){&{background-color:var(--color-base-300)}}}}}}}}.\32 xl\:table-xs{& :not(thead,tfoot) tr{font-size:.6875rem}& :where(th,td){padding-block:.25rem;padding-inline:.5rem}}.\32 xl\:table-sm{& :not(thead,tfoot) tr{font-size:.75rem}& :where(th,td){padding-block:.5rem;padding-inline:.75rem}}.\32 xl\:table-md{& :not(thead,tfoot) tr{font-size:.875rem}& :where(th,td){padding-block:.75rem;padding-inline:1rem}}.\32 xl\:table-lg{& :not(thead,tfoot) tr{font-size:1.125rem}& :where(th,td){padding-block:1rem;padding-inline:1.25rem}}.\32 xl\:table-xl{& :not(thead,tfoot) tr{font-size:1.375rem}& :where(th,td){padding-block:1.25rem;padding-inline:1.5rem}}}

package/components/textarea/class.json

@@ -0,0 +1,17 @@
+[
+  "textarea",
+  "textarea-ghost",
+  "textarea-neutral",
+  "textarea-primary",
+  "textarea-secondary",
+  "textarea-accent",
+  "textarea-info",
+  "textarea-success",
+  "textarea-warning",
+  "textarea-error",
+  "textarea-xs",
+  "textarea-sm",
+  "textarea-md",
+  "textarea-lg",
+  "textarea-xl"
+]

package/components/textarea/index.js

@@ -0,0 +1,7 @@
+import textarea from './object.js';
+import { addPrefix } from '../../functions/addPrefix.js';
+
+export default ({ addComponents, prefix = '' }) => {
+  const prefixedtextarea = addPrefix(textarea, prefix);
+  addComponents({ ...prefixedtextarea });
+};

package/components/textarea/object.js

@@ -0,0 +1 @@
+export default {".textarea":{"border":"var(--border) solid transparent","min-height":"calc(0.25rem * 20)","flex-shrink":1,"appearance":"none","border-radius":"var(--radius-field)","background-color":"var(--color-base-100)","padding-block":"calc(0.25rem * 2)","vertical-align":"middle","width":"clamp(3rem, 20rem, 100%)","padding-inline-start":"0.75rem","padding-inline-end":"0.75rem","font-size":"0.875rem","border-color":"var(--input-color)","box-shadow":"0 1px color-mix(in oklab, var(--input-color) calc(var(--depth) * 10%), transparent) inset, 0 -1px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset","--input-color":"color-mix(in oklab, var(--color-base-content) 20%, transparent)","textarea":{"appearance":"none","background-color":"transparent","border":"none","&:focus, &:focus-within":{"outline-style":"none","@media (forced-colors: active)":{"outline":"2px solid transparent","outline-offset":"2px"}}},"&:focus, &:focus-within":{"--input-color":"var(--color-base-content)","box-shadow":"0 1px color-mix(in oklab, var(--input-color) calc(var(--depth) * 10%), transparent)","outline":"2px solid var(--input-color)","outline-offset":"2px","isolation":"isolate"},"&:has(> textarea[disabled]), &:is(:disabled, [disabled])":{"cursor":"not-allowed","border-color":"var(--color-base-200)","background-color":"var(--color-base-200)","color":"color-mix(in oklab, var(--color-base-content) 40%, transparent)","&::placeholder":{"color":"color-mix(in oklab, var(--color-base-content) 20%, transparent)"},"box-shadow":"none"},"&:has(> textarea[disabled]) > textarea[disabled]":{"cursor":"not-allowed"}},".textarea-ghost":{"background-color":"transparent","box-shadow":"none","border-color":"transparent","&:focus, &:focus-within":{"background-color":"var(--color-base-100)","color":"var(--color-base-content)","border-color":"transparent","box-shadow":"none"}},".textarea-neutral":{"&, &:focus, &:focus-within":{"--input-color":"var(--color-neutral)"}},".textarea-primary":{"&, &:focus, &:focus-within":{"--input-color":"var(--color-primary)"}},".textarea-secondary":{"&, &:focus, &:focus-within":{"--input-color":"var(--color-secondary)"}},".textarea-accent":{"&, &:focus, &:focus-within":{"--input-color":"var(--color-accent)"}},".textarea-info":{"&, &:focus, &:focus-within":{"--input-color":"var(--color-info)"}},".textarea-success":{"&, &:focus, &:focus-within":{"--input-color":"var(--color-success)"}},".textarea-warning":{"&, &:focus, &:focus-within":{"--input-color":"var(--color-warning)"}},".textarea-error":{"&, &:focus, &:focus-within":{"--input-color":"var(--color-error)"}},".textarea-xs":{"font-size":"0.6875rem"},".textarea-sm":{"font-size":"0.75rem"},".textarea-md":{"font-size":"0.875rem"},".textarea-lg":{"font-size":"1.125rem"},".textarea-xl":{"font-size":"1.375rem"}};

package/components/textarea.css

@@ -0,0 +1 @@
+/*! 🌼 daisyUI 5.0.0-beta.2 - MIT License */ .textarea{border:var(--border)solid transparent;appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;border-color:var(--input-color);width:clamp(3rem,20rem,100%);min-height:5rem;box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent)inset,0 -1px oklch(100% 0 0/calc(var(--depth)*.1))inset;--input-color:color-mix(in oklab,var(--color-base-content)20%,transparent);flex-shrink:1;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{appearance:none;background-color:#0000;border:none;&:focus,&:focus-within{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}}&:focus,&:focus-within{--input-color:var(--color-base-content);box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent);outline:2px solid var(--input-color);outline-offset:2px;isolation:isolate}&:has(>textarea[disabled]),&:is(:disabled,[disabled]){cursor:not-allowed;border-color:var(--color-base-200);background-color:var(--color-base-200);color:color-mix(in oklab,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklab,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}}.textarea-ghost{box-shadow:none;background-color:#0000;border-color:#0000;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none;border-color:#0000}}.textarea-neutral{&,&:focus,&:focus-within{--input-color:var(--color-neutral)}}.textarea-primary{&,&:focus,&:focus-within{--input-color:var(--color-primary)}}.textarea-secondary{&,&:focus,&:focus-within{--input-color:var(--color-secondary)}}.textarea-accent{&,&:focus,&:focus-within{--input-color:var(--color-accent)}}.textarea-info{&,&:focus,&:focus-within{--input-color:var(--color-info)}}.textarea-success{&,&:focus,&:focus-within{--input-color:var(--color-success)}}.textarea-warning{&,&:focus,&:focus-within{--input-color:var(--color-warning)}}.textarea-error{&,&:focus,&:focus-within{--input-color:var(--color-error)}}.textarea-xs{font-size:.6875rem}.textarea-sm{font-size:.75rem}.textarea-md{font-size:.875rem}.textarea-lg{font-size:1.125rem}.textarea-xl{font-size:1.375rem}@media (width>=640px){.sm\:textarea{border:var(--border)solid transparent;appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;border-color:var(--input-color);width:clamp(3rem,20rem,100%);min-height:5rem;box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent)inset,0 -1px oklch(100% 0 0/calc(var(--depth)*.1))inset;--input-color:color-mix(in oklab,var(--color-base-content)20%,transparent);flex-shrink:1;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{appearance:none;background-color:#0000;border:none;&:focus,&:focus-within{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}}&:focus,&:focus-within{--input-color:var(--color-base-content);box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent);outline:2px solid var(--input-color);outline-offset:2px;isolation:isolate}&:has(>textarea[disabled]),&:is(:disabled,[disabled]){cursor:not-allowed;border-color:var(--color-base-200);background-color:var(--color-base-200);color:color-mix(in oklab,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklab,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}}.sm\:textarea-ghost{box-shadow:none;background-color:#0000;border-color:#0000;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none;border-color:#0000}}.sm\:textarea-neutral{&,&:focus,&:focus-within{--input-color:var(--color-neutral)}}.sm\:textarea-primary{&,&:focus,&:focus-within{--input-color:var(--color-primary)}}.sm\:textarea-secondary{&,&:focus,&:focus-within{--input-color:var(--color-secondary)}}.sm\:textarea-accent{&,&:focus,&:focus-within{--input-color:var(--color-accent)}}.sm\:textarea-info{&,&:focus,&:focus-within{--input-color:var(--color-info)}}.sm\:textarea-success{&,&:focus,&:focus-within{--input-color:var(--color-success)}}.sm\:textarea-warning{&,&:focus,&:focus-within{--input-color:var(--color-warning)}}.sm\:textarea-error{&,&:focus,&:focus-within{--input-color:var(--color-error)}}.sm\:textarea-xs{font-size:.6875rem}.sm\:textarea-sm{font-size:.75rem}.sm\:textarea-md{font-size:.875rem}.sm\:textarea-lg{font-size:1.125rem}.sm\:textarea-xl{font-size:1.375rem}}@media (width>=768px){.md\:textarea{border:var(--border)solid transparent;appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;border-color:var(--input-color);width:clamp(3rem,20rem,100%);min-height:5rem;box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent)inset,0 -1px oklch(100% 0 0/calc(var(--depth)*.1))inset;--input-color:color-mix(in oklab,var(--color-base-content)20%,transparent);flex-shrink:1;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{appearance:none;background-color:#0000;border:none;&:focus,&:focus-within{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}}&:focus,&:focus-within{--input-color:var(--color-base-content);box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent);outline:2px solid var(--input-color);outline-offset:2px;isolation:isolate}&:has(>textarea[disabled]),&:is(:disabled,[disabled]){cursor:not-allowed;border-color:var(--color-base-200);background-color:var(--color-base-200);color:color-mix(in oklab,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklab,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}}.md\:textarea-ghost{box-shadow:none;background-color:#0000;border-color:#0000;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none;border-color:#0000}}.md\:textarea-neutral{&,&:focus,&:focus-within{--input-color:var(--color-neutral)}}.md\:textarea-primary{&,&:focus,&:focus-within{--input-color:var(--color-primary)}}.md\:textarea-secondary{&,&:focus,&:focus-within{--input-color:var(--color-secondary)}}.md\:textarea-accent{&,&:focus,&:focus-within{--input-color:var(--color-accent)}}.md\:textarea-info{&,&:focus,&:focus-within{--input-color:var(--color-info)}}.md\:textarea-success{&,&:focus,&:focus-within{--input-color:var(--color-success)}}.md\:textarea-warning{&,&:focus,&:focus-within{--input-color:var(--color-warning)}}.md\:textarea-error{&,&:focus,&:focus-within{--input-color:var(--color-error)}}.md\:textarea-xs{font-size:.6875rem}.md\:textarea-sm{font-size:.75rem}.md\:textarea-md{font-size:.875rem}.md\:textarea-lg{font-size:1.125rem}.md\:textarea-xl{font-size:1.375rem}}@media (width>=1024px){.lg\:textarea{border:var(--border)solid transparent;appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;border-color:var(--input-color);width:clamp(3rem,20rem,100%);min-height:5rem;box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent)inset,0 -1px oklch(100% 0 0/calc(var(--depth)*.1))inset;--input-color:color-mix(in oklab,var(--color-base-content)20%,transparent);flex-shrink:1;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{appearance:none;background-color:#0000;border:none;&:focus,&:focus-within{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}}&:focus,&:focus-within{--input-color:var(--color-base-content);box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent);outline:2px solid var(--input-color);outline-offset:2px;isolation:isolate}&:has(>textarea[disabled]),&:is(:disabled,[disabled]){cursor:not-allowed;border-color:var(--color-base-200);background-color:var(--color-base-200);color:color-mix(in oklab,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklab,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}}.lg\:textarea-ghost{box-shadow:none;background-color:#0000;border-color:#0000;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none;border-color:#0000}}.lg\:textarea-neutral{&,&:focus,&:focus-within{--input-color:var(--color-neutral)}}.lg\:textarea-primary{&,&:focus,&:focus-within{--input-color:var(--color-primary)}}.lg\:textarea-secondary{&,&:focus,&:focus-within{--input-color:var(--color-secondary)}}.lg\:textarea-accent{&,&:focus,&:focus-within{--input-color:var(--color-accent)}}.lg\:textarea-info{&,&:focus,&:focus-within{--input-color:var(--color-info)}}.lg\:textarea-success{&,&:focus,&:focus-within{--input-color:var(--color-success)}}.lg\:textarea-warning{&,&:focus,&:focus-within{--input-color:var(--color-warning)}}.lg\:textarea-error{&,&:focus,&:focus-within{--input-color:var(--color-error)}}.lg\:textarea-xs{font-size:.6875rem}.lg\:textarea-sm{font-size:.75rem}.lg\:textarea-md{font-size:.875rem}.lg\:textarea-lg{font-size:1.125rem}.lg\:textarea-xl{font-size:1.375rem}}@media (width>=1280px){.xl\:textarea{border:var(--border)solid transparent;appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;border-color:var(--input-color);width:clamp(3rem,20rem,100%);min-height:5rem;box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent)inset,0 -1px oklch(100% 0 0/calc(var(--depth)*.1))inset;--input-color:color-mix(in oklab,var(--color-base-content)20%,transparent);flex-shrink:1;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{appearance:none;background-color:#0000;border:none;&:focus,&:focus-within{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}}&:focus,&:focus-within{--input-color:var(--color-base-content);box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent);outline:2px solid var(--input-color);outline-offset:2px;isolation:isolate}&:has(>textarea[disabled]),&:is(:disabled,[disabled]){cursor:not-allowed;border-color:var(--color-base-200);background-color:var(--color-base-200);color:color-mix(in oklab,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklab,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}}.xl\:textarea-ghost{box-shadow:none;background-color:#0000;border-color:#0000;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none;border-color:#0000}}.xl\:textarea-neutral{&,&:focus,&:focus-within{--input-color:var(--color-neutral)}}.xl\:textarea-primary{&,&:focus,&:focus-within{--input-color:var(--color-primary)}}.xl\:textarea-secondary{&,&:focus,&:focus-within{--input-color:var(--color-secondary)}}.xl\:textarea-accent{&,&:focus,&:focus-within{--input-color:var(--color-accent)}}.xl\:textarea-info{&,&:focus,&:focus-within{--input-color:var(--color-info)}}.xl\:textarea-success{&,&:focus,&:focus-within{--input-color:var(--color-success)}}.xl\:textarea-warning{&,&:focus,&:focus-within{--input-color:var(--color-warning)}}.xl\:textarea-error{&,&:focus,&:focus-within{--input-color:var(--color-error)}}.xl\:textarea-xs{font-size:.6875rem}.xl\:textarea-sm{font-size:.75rem}.xl\:textarea-md{font-size:.875rem}.xl\:textarea-lg{font-size:1.125rem}.xl\:textarea-xl{font-size:1.375rem}}@media (width>=1536px){.\32 xl\:textarea{border:var(--border)solid transparent;appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;border-color:var(--input-color);width:clamp(3rem,20rem,100%);min-height:5rem;box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent)inset,0 -1px oklch(100% 0 0/calc(var(--depth)*.1))inset;--input-color:color-mix(in oklab,var(--color-base-content)20%,transparent);flex-shrink:1;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{appearance:none;background-color:#0000;border:none;&:focus,&:focus-within{outline-style:none;@media (forced-colors:active){&{outline-offset:2px;outline:2px solid #0000}}}}&:focus,&:focus-within{--input-color:var(--color-base-content);box-shadow:0 1px color-mix(in oklab,var(--input-color)calc(var(--depth)*10%),transparent);outline:2px solid var(--input-color);outline-offset:2px;isolation:isolate}&:has(>textarea[disabled]),&:is(:disabled,[disabled]){cursor:not-allowed;border-color:var(--color-base-200);background-color:var(--color-base-200);color:color-mix(in oklab,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklab,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}}.\32 xl\:textarea-ghost{box-shadow:none;background-color:#0000;border-color:#0000;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none;border-color:#0000}}.\32 xl\:textarea-neutral{&,&:focus,&:focus-within{--input-color:var(--color-neutral)}}.\32 xl\:textarea-primary{&,&:focus,&:focus-within{--input-color:var(--color-primary)}}.\32 xl\:textarea-secondary{&,&:focus,&:focus-within{--input-color:var(--color-secondary)}}.\32 xl\:textarea-accent{&,&:focus,&:focus-within{--input-color:var(--color-accent)}}.\32 xl\:textarea-info{&,&:focus,&:focus-within{--input-color:var(--color-info)}}.\32 xl\:textarea-success{&,&:focus,&:focus-within{--input-color:var(--color-success)}}.\32 xl\:textarea-warning{&,&:focus,&:focus-within{--input-color:var(--color-warning)}}.\32 xl\:textarea-error{&,&:focus,&:focus-within{--input-color:var(--color-error)}}.\32 xl\:textarea-xs{font-size:.6875rem}.\32 xl\:textarea-sm{font-size:.75rem}.\32 xl\:textarea-md{font-size:.875rem}.\32 xl\:textarea-lg{font-size:1.125rem}.\32 xl\:textarea-xl{font-size:1.375rem}}

package/components/timeline/index.js

@@ -1 +1,7 @@
-export default {".timeline":{"@apply relative flex":{},">li":{"@apply relative grid shrink-0 items-center":{},"gridTemplateRows":"var(--timeline-row-start, minmax(0, 1fr)) auto var(--timeline-row-end,\n        minmax(0, 1fr))","gridTemplateColumns":"var(--timeline-col-start, minmax(0, 1fr)) auto var(--timeline-col-end,\n        minmax(0, 1fr))",">hr":{"@apply w-full border-0":{},"&:first-child":{"@apply col-start-1 row-start-2":{}},"&:last-child":{"@apply col-start-3 col-end-[none] row-start-2 row-end-auto":{}}}},":where(hr)":{"@apply h-1 bg-base-300":{}},"&:has(.timeline-middle hr)":{"&:first-child":{"@apply rounded-e-badge rounded-s-none":{}},"&:last-child":{"@apply rounded-s-badge rounded-e-none":{}}},"&:not(:has(.timeline-middle))":{":first-child hr:last-child":{"@apply rounded-s-badge rounded-e-none":{}},":last-child hr:first-child":{"@apply rounded-e-badge rounded-s-none":{}}}},".timeline-box":{"@apply rounded-box bg-base-100 border-base-300 border px-4 py-2 shadow-sm":{}},".timeline-start":{"@apply col-start-1 col-end-4 row-start-1 row-end-2 m-1 self-end justify-self-center":{}},".timeline-middle":{"@apply col-start-2 row-start-2":{}},".timeline-end":{"@apply col-start-1 col-end-4 row-start-3 row-end-4 m-1 self-start justify-self-center":{}},".timeline-compact":{"--timeline-row-start":"0",".timeline-start":{"@apply col-start-1 col-end-4 row-start-3 row-end-4 m-1 self-start justify-self-center":{}},"li:has(.timeline-start)":{".timeline-end":{"@apply col-start-[none] row-start-auto":{}}},"&.timeline-vertical":{">li":{"--timeline-col-start":"0"},".timeline-start":{"@apply col-start-3 col-end-4 row-start-1 row-end-4 self-center justify-self-start":{}},"li:has(.timeline-start)":{".timeline-end":{"@apply col-start-auto row-start-[none]":{}}}}},".timeline-snap-icon":{">li":{"--timeline-col-start":"0.5rem","--timeline-row-start":"minmax(0, 1fr)"}},".timeline-vertical":{"@apply flex-col":{},">li":{"@apply justify-items-center":{},"--timeline-row-start":"minmax(0, 1fr)","--timeline-row-end":"minmax(0, 1fr)",">hr":{"@apply w-1 h-full":{},"&:first-child":{"@apply col-start-2 row-start-1":{}},"&:last-child":{"@apply col-start-2 col-end-auto row-start-3 row-end-[none]":{}}}},".timeline-start":{"@apply col-start-1 col-end-2 row-start-1 row-end-4 self-center justify-self-end":{}},".timeline-end":{"@apply col-start-3 col-end-4 row-start-1 row-end-4 self-center justify-self-start":{}},"&:has(.timeline-middle)":{">li":{">hr":{"&:first-child":{"@apply rounded-b-badge rounded-t-none":{}},"&:last-child":{"@apply rounded-t-badge rounded-b-none":{}}}}},"&:not(:has(.timeline-middle))":{":first-child":{">hr:last-child":{"@apply rounded-t-badge rounded-b-none":{}}},":last-child":{">hr:first-child":{"@apply rounded-b-badge rounded-t-none":{}}}},"&.timeline-snap-icon":{">li":{"--timeline-col-start":"minmax(0, 1fr)","--timeline-row-start":"0.5rem"}}},".timeline-horizontal":{"@apply flex-row":{},">li":{"@apply items-center":{},">hr":{"@apply w-full h-1":{},"&:first-child":{"@apply col-start-1 row-start-2":{}},"&:last-child":{"@apply col-start-3 col-end-[none] row-start-2 row-end-auto":{}}}},".timeline-start":{"@apply col-start-1 col-end-4 row-start-1 row-end-2 self-end justify-self-center":{}},".timeline-end":{"@apply col-start-1 col-end-4 row-start-3 row-end-4 self-start justify-self-center":{}},"&:has(.timeline-middle)":{">li":{">hr":{"&:first-child":{"@apply rounded-e-badge rounded-s-none":{}},"&:last-child":{"@apply rounded-s-badge rounded-e-none":{}}}}},"&:not(:has(.timeline-middle))":{":first-child":{">hr:last-child":{"@apply rounded-s-badge rounded-e-none":{}}},":last-child":{">hr:first-child":{"@apply rounded-e-badge rounded-s-none":{}}}}}};
+import timeline from './object.js';
+import { addPrefix } from '../../functions/addPrefix.js';
+
+export default ({ addComponents, prefix = '' }) => {
+  const prefixedtimeline = addPrefix(timeline, prefix);
+  addComponents({ ...prefixedtimeline });
+};

package/components/timeline/object.js

@@ -0,0 +1 @@
+export default {".timeline":{"position":"relative","display":"flex","> li":{"position":"relative","display":"grid","flex-shrink":0,"align-items":"center","grid-template-rows":"var(--timeline-row-start, minmax(0, 1fr)) auto var( --timeline-row-end, minmax(0, 1fr) )","grid-template-columns":"var(--timeline-col-start, minmax(0, 1fr)) auto var( --timeline-col-end, minmax(0, 1fr) )","> hr":{"border":"none","width":"100%","@media print":{"border":".1px solid var(--color-base-300)"},"&:first-child":{"grid-column-start":"1","grid-row-start":"2"},"&:last-child":{"grid-column-start":"3","grid-column-end":"none","grid-row-start":"2","grid-row-end":"auto"}}},":where(hr)":{"height":"calc(0.25rem * 1)","background-color":"var(--color-base-300)"},"&:has(.timeline-middle hr)":{"&:first-child":{"border-start-start-radius":"0","border-end-start-radius":"0","border-start-end-radius":"var(--radius-selector)","border-end-end-radius":"var(--radius-selector)"},"&:last-child":{"border-start-start-radius":"var(--radius-selector)","border-end-start-radius":"var(--radius-selector)","border-start-end-radius":"0","border-end-end-radius":"0"}},"&:not(:has(.timeline-middle))":{":first-child hr:last-child":{"border-start-start-radius":"var(--radius-selector)","border-end-start-radius":"var(--radius-selector)","border-start-end-radius":"0","border-end-end-radius":"0"},":last-child hr:first-child":{"border-start-start-radius":"0","border-end-start-radius":"0","border-start-end-radius":"var(--radius-selector)","border-end-end-radius":"var(--radius-selector)"}}},".timeline-box":{"border":"var(--border) solid","border-radius":"var(--radius-box)","border-color":"var(--color-base-300)","background-color":"var(--color-base-100)","padding-inline":"calc(0.25rem * 4)","padding-block":"calc(0.25rem * 2)","font-size":"0.75rem","box-shadow":"0 1px 2px 0 oklch(0% 0 0/0.05)"},".timeline-start":{"grid-column-start":"1","grid-column-end":"4","grid-row-start":"1","grid-row-end":"2","margin":"calc(0.25rem * 1)","align-self":"flex-end","justify-self":"center"},".timeline-middle":{"grid-column-start":"2","grid-row-start":"2"},".timeline-end":{"grid-column-start":"1","grid-column-end":"4","grid-row-start":"3","grid-row-end":"4","margin":"calc(0.25rem * 1)","align-self":"flex-start","justify-self":"center"},".timeline-compact":{"--timeline-row-start":"0",".timeline-start":{"grid-column-start":"1","grid-column-end":"4","grid-row-start":"3","grid-row-end":"4","align-self":"flex-start","justify-self":"center"},"li:has(.timeline-start)":{".timeline-end":{"grid-column-start":"none","grid-row-start":"auto"}},"&.timeline-vertical":{"> li":{"--timeline-col-start":"0"},".timeline-start":{"grid-column-start":"3","grid-column-end":"4","grid-row-start":"1","grid-row-end":"4","align-self":"center","justify-self":"flex-start"},"li:has(.timeline-start)":{".timeline-end":{"grid-column-start":"auto","grid-row-start":"none"}}}},".timeline-snap-icon":{"> li":{"--timeline-col-start":"0.5rem","--timeline-row-start":"minmax(0, 1fr)"}},".timeline-vertical":{"flex-direction":"column","> li":{"justify-items":"center","--timeline-row-start":"minmax(0, 1fr)","--timeline-row-end":"minmax(0, 1fr)","> hr":{"height":"100%","width":"calc(0.25rem * 1)","&:first-child":{"grid-column-start":"2","grid-row-start":"1"},"&:last-child":{"grid-column-start":"2","grid-column-end":"auto","grid-row-start":"3","grid-row-end":"none"}}},".timeline-start":{"grid-column-start":"1","grid-column-end":"2","grid-row-start":"1","grid-row-end":"4","align-self":"center","justify-self":"flex-end"},".timeline-end":{"grid-column-start":"3","grid-column-end":"4","grid-row-start":"1","grid-row-end":"4","align-self":"center","justify-self":"flex-start"},"&:has(.timeline-middle)":{"> li":{"> hr":{"&:first-child":{"border-top-left-radius":"0","border-top-right-radius":"0","border-bottom-right-radius":"var(--radius-selector)","border-bottom-left-radius":"var(--radius-selector)"},"&:last-child":{"border-top-left-radius":"var(--radius-selector)","border-top-right-radius":"var(--radius-selector)","border-bottom-right-radius":"0","border-bottom-left-radius":"0"}}}},"&:not(:has(.timeline-middle))":{":first-child":{"> hr:last-child":{"border-top-left-radius":"var(--radius-selector)","border-top-right-radius":"var(--radius-selector)","border-bottom-right-radius":"0","border-bottom-left-radius":"0"}},":last-child":{"> hr:first-child":{"border-top-left-radius":"0","border-top-right-radius":"0","border-bottom-right-radius":"var(--radius-selector)","border-bottom-left-radius":"var(--radius-selector)"}}},"&.timeline-snap-icon":{"> li":{"--timeline-col-start":"minmax(0, 1fr)","--timeline-row-start":"0.5rem"}}},".timeline-horizontal":{"flex-direction":"row","> li":{"align-items":"center","> hr":{"height":"calc(0.25rem * 1)","width":"100%","&:first-child":{"grid-column-start":"1","grid-row-start":"2"},"&:last-child":{"grid-column-start":"3","grid-column-end":"none","grid-row-start":"2","grid-row-end":"auto"}}},".timeline-start":{"grid-column-start":"1","grid-column-end":"4","grid-row-start":"1","grid-row-end":"2","align-self":"flex-end","justify-self":"center"},".timeline-end":{"grid-column-start":"1","grid-column-end":"4","grid-row-start":"3","grid-row-end":"4","align-self":"flex-start","justify-self":"center"},"&:has(.timeline-middle)":{"> li":{"> hr":{"&:first-child":{"border-start-start-radius":"0","border-end-start-radius":"0","border-start-end-radius":"var(--radius-selector)","border-end-end-radius":"var(--radius-selector)"},"&:last-child":{"border-start-start-radius":"var(--radius-selector)","border-end-start-radius":"var(--radius-selector)","border-start-end-radius":"0","border-end-end-radius":"0"}}}},"&:not(:has(.timeline-middle))":{":first-child":{"> hr:last-child":{"border-start-start-radius":"var(--radius-selector)","border-end-start-radius":"var(--radius-selector)","border-start-end-radius":"0","border-end-end-radius":"0"}},":last-child":{"> hr:first-child":{"border-start-start-radius":"0","border-end-start-radius":"0","border-start-end-radius":"var(--radius-selector)","border-end-end-radius":"var(--radius-selector)"}}}}};

package/components/timeline.css

@@ -1 +1 @@
-/*! 🌼 daisyUI 5.0.0-alpha.9 – MIT License */ .timeline{display:flex;position:relative;&>li{grid-template-rows:var(--timeline-row-start,minmax(0,1fr))auto var(--timeline-row-end,minmax(0,1fr));grid-template-columns:var(--timeline-col-start,minmax(0,1fr))auto var(--timeline-col-end,minmax(0,1fr));flex-shrink:0;align-items:center;display:grid;position:relative;&>hr{border-style:var(--tw-border-style);border-width:0;width:100%;&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& :where(hr){height:var(--spacing-1,.25rem);background-color:var(--color-base-300,oklch(92.4169% .00108 197.138))}&:has(.timeline-middle hr){&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-badge,1.9rem);border-end-end-radius:var(--radius-badge,1.9rem);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-badge,1.9rem);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-badge,1.9rem)}}&:not(:has(.timeline-middle)){& :first-child hr:last-child{border-start-start-radius:var(--radius-badge,1.9rem);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-badge,1.9rem)}}&:not(:has(.timeline-middle)){& :last-child hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-badge,1.9rem);border-end-end-radius:var(--radius-badge,1.9rem);border-end-start-radius:0}}}.timeline-box{border-radius:var(--radius-box,1rem);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-base-300,oklch(92.4169% .00108 197.138));background-color:var(--color-base-100,oklch(100% 0 0));padding-top:var(--spacing-2,.5rem);padding-bottom:var(--spacing-2,.5rem);padding-left:var(--spacing-4,1rem);padding-right:var(--spacing-4,1rem);--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.timeline-start{margin:var(--spacing-1,.25rem);grid-area:1/1/2/4;place-self:flex-end center}.timeline-middle{grid-row-start:2;grid-column-start:2}.timeline-end{margin:var(--spacing-1,.25rem);grid-area:3/1/4/4;place-self:flex-start center}.timeline-compact{--timeline-row-start:0;& .timeline-start{margin:var(--spacing-1,.25rem);grid-area:3/1/4/4;place-self:flex-start center}& li:has(.timeline-start){& .timeline-end{grid-row-start:auto;grid-column-start:none}}&.timeline-vertical{&>li{--timeline-col-start:0}& .timeline-start{grid-area:1/3/4/4;place-self:center flex-start}& li:has(.timeline-start){& .timeline-end{grid-row-start:none;grid-column-start:auto}}}}.timeline-snap-icon{&>li{--timeline-col-start:.5rem;--timeline-row-start:minmax(0,1fr)}}.timeline-vertical{flex-direction:column;&>li{--timeline-row-start:minmax(0,1fr);--timeline-row-end:minmax(0,1fr);justify-items:center;&>hr{width:var(--spacing-1,.25rem);height:100%;&:first-child{grid-row-start:1;grid-column-start:2}&:last-child{grid-area:3/2/none}}}& .timeline-start{grid-area:1/1/4/2;place-self:center flex-end}& .timeline-end{grid-area:1/3/4/4;place-self:center flex-start}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-badge,1.9rem);border-bottom-left-radius:var(--radius-badge,1.9rem)}&:last-child{border-top-left-radius:var(--radius-badge,1.9rem);border-top-right-radius:var(--radius-badge,1.9rem);border-bottom-right-radius:0;border-bottom-left-radius:0}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-top-left-radius:var(--radius-badge,1.9rem);border-top-right-radius:var(--radius-badge,1.9rem);border-bottom-right-radius:0;border-bottom-left-radius:0}}& :last-child{&>hr:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-badge,1.9rem);border-bottom-left-radius:var(--radius-badge,1.9rem)}}}&.timeline-snap-icon{&>li{--timeline-col-start:minmax(0,1fr);--timeline-row-start:.5rem}}}.timeline-horizontal{flex-direction:row;&>li{align-items:center;&>hr{height:var(--spacing-1,.25rem);width:100%;&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& .timeline-start{grid-area:1/1/2/4;place-self:flex-end center}& .timeline-end{grid-area:3/1/4/4;place-self:flex-start center}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-badge,1.9rem);border-end-end-radius:var(--radius-badge,1.9rem);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-badge,1.9rem);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-badge,1.9rem)}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-start-start-radius:var(--radius-badge,1.9rem);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-badge,1.9rem)}}& :last-child{&>hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-badge,1.9rem);border-end-end-radius:var(--radius-badge,1.9rem);border-end-start-radius:0}}}}
+/*! 🌼 daisyUI 5.0.0-beta.2 - MIT License */ .timeline{display:flex;position:relative;&>li{grid-template-rows:var(--timeline-row-start,minmax(0,1fr))auto var(--timeline-row-end,minmax(0,1fr));grid-template-columns:var(--timeline-col-start,minmax(0,1fr))auto var(--timeline-col-end,minmax(0,1fr));flex-shrink:0;align-items:center;display:grid;position:relative;&>hr{border:none;width:100%;@media print{&{border:.1px solid var(--color-base-300)}}&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& :where(hr){background-color:var(--color-base-300);height:.25rem}&:has(.timeline-middle hr){&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}&:not(:has(.timeline-middle)){& :first-child hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}& :last-child hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}.timeline-box{border:var(--border)solid;border-radius:var(--radius-box);border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;font-size:.75rem;box-shadow:0 1px 2px oklch(0% 0 0/.05)}.timeline-start{grid-area:1/1/2/4;place-self:flex-end center;margin:.25rem}.timeline-middle{grid-row-start:2;grid-column-start:2}.timeline-end{grid-area:3/1/4/4;place-self:flex-start center;margin:.25rem}.timeline-compact{--timeline-row-start:0;& .timeline-start{grid-area:3/1/4/4;place-self:flex-start center}& li:has(.timeline-start){& .timeline-end{grid-row-start:auto;grid-column-start:none}}&.timeline-vertical{&>li{--timeline-col-start:0}& .timeline-start{grid-area:1/3/4/4;place-self:center flex-start}& li:has(.timeline-start){& .timeline-end{grid-row-start:none;grid-column-start:auto}}}}.timeline-snap-icon{&>li{--timeline-col-start:.5rem;--timeline-row-start:minmax(0,1fr)}}.timeline-vertical{flex-direction:column;&>li{--timeline-row-start:minmax(0,1fr);--timeline-row-end:minmax(0,1fr);justify-items:center;&>hr{width:.25rem;height:100%;&:first-child{grid-row-start:1;grid-column-start:2}&:last-child{grid-area:3/2/none}}}& .timeline-start{grid-area:1/1/4/2;place-self:center flex-end}& .timeline-end{grid-area:1/3/4/4;place-self:center flex-start}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}&:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}& :last-child{&>hr:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}}}&.timeline-snap-icon{&>li{--timeline-col-start:minmax(0,1fr);--timeline-row-start:.5rem}}}.timeline-horizontal{flex-direction:row;&>li{align-items:center;&>hr{width:100%;height:.25rem;&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& .timeline-start{grid-area:1/1/2/4;place-self:flex-end center}& .timeline-end{grid-area:3/1/4/4;place-self:flex-start center}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}& :last-child{&>hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}}@media (width>=640px){.sm\:timeline{display:flex;position:relative;&>li{grid-template-rows:var(--timeline-row-start,minmax(0,1fr))auto var(--timeline-row-end,minmax(0,1fr));grid-template-columns:var(--timeline-col-start,minmax(0,1fr))auto var(--timeline-col-end,minmax(0,1fr));flex-shrink:0;align-items:center;display:grid;position:relative;&>hr{border:none;width:100%;@media print{&{border:.1px solid var(--color-base-300)}}&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& :where(hr){background-color:var(--color-base-300);height:.25rem}&:has(.timeline-middle hr){&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}&:not(:has(.timeline-middle)){& :first-child hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}& :last-child hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}.sm\:timeline-box{border:var(--border)solid;border-radius:var(--radius-box);border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;font-size:.75rem;box-shadow:0 1px 2px oklch(0% 0 0/.05)}.sm\:timeline-start{grid-area:1/1/2/4;place-self:flex-end center;margin:.25rem}.sm\:timeline-middle{grid-row-start:2;grid-column-start:2}.sm\:timeline-end{grid-area:3/1/4/4;place-self:flex-start center;margin:.25rem}.sm\:timeline-compact{--timeline-row-start:0;& .timeline-start{grid-area:3/1/4/4;place-self:flex-start center}& li:has(.timeline-start){& .timeline-end{grid-row-start:auto;grid-column-start:none}}&.timeline-vertical{&>li{--timeline-col-start:0}& .timeline-start{grid-area:1/3/4/4;place-self:center flex-start}& li:has(.timeline-start){& .timeline-end{grid-row-start:none;grid-column-start:auto}}}}.sm\:timeline-snap-icon{&>li{--timeline-col-start:.5rem;--timeline-row-start:minmax(0,1fr)}}.sm\:timeline-vertical{flex-direction:column;&>li{--timeline-row-start:minmax(0,1fr);--timeline-row-end:minmax(0,1fr);justify-items:center;&>hr{width:.25rem;height:100%;&:first-child{grid-row-start:1;grid-column-start:2}&:last-child{grid-area:3/2/none}}}& .timeline-start{grid-area:1/1/4/2;place-self:center flex-end}& .timeline-end{grid-area:1/3/4/4;place-self:center flex-start}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}&:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}& :last-child{&>hr:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}}}&.timeline-snap-icon{&>li{--timeline-col-start:minmax(0,1fr);--timeline-row-start:.5rem}}}.sm\:timeline-horizontal{flex-direction:row;&>li{align-items:center;&>hr{width:100%;height:.25rem;&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& .timeline-start{grid-area:1/1/2/4;place-self:flex-end center}& .timeline-end{grid-area:3/1/4/4;place-self:flex-start center}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}& :last-child{&>hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}}}@media (width>=768px){.md\:timeline{display:flex;position:relative;&>li{grid-template-rows:var(--timeline-row-start,minmax(0,1fr))auto var(--timeline-row-end,minmax(0,1fr));grid-template-columns:var(--timeline-col-start,minmax(0,1fr))auto var(--timeline-col-end,minmax(0,1fr));flex-shrink:0;align-items:center;display:grid;position:relative;&>hr{border:none;width:100%;@media print{&{border:.1px solid var(--color-base-300)}}&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& :where(hr){background-color:var(--color-base-300);height:.25rem}&:has(.timeline-middle hr){&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}&:not(:has(.timeline-middle)){& :first-child hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}& :last-child hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}.md\:timeline-box{border:var(--border)solid;border-radius:var(--radius-box);border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;font-size:.75rem;box-shadow:0 1px 2px oklch(0% 0 0/.05)}.md\:timeline-start{grid-area:1/1/2/4;place-self:flex-end center;margin:.25rem}.md\:timeline-middle{grid-row-start:2;grid-column-start:2}.md\:timeline-end{grid-area:3/1/4/4;place-self:flex-start center;margin:.25rem}.md\:timeline-compact{--timeline-row-start:0;& .timeline-start{grid-area:3/1/4/4;place-self:flex-start center}& li:has(.timeline-start){& .timeline-end{grid-row-start:auto;grid-column-start:none}}&.timeline-vertical{&>li{--timeline-col-start:0}& .timeline-start{grid-area:1/3/4/4;place-self:center flex-start}& li:has(.timeline-start){& .timeline-end{grid-row-start:none;grid-column-start:auto}}}}.md\:timeline-snap-icon{&>li{--timeline-col-start:.5rem;--timeline-row-start:minmax(0,1fr)}}.md\:timeline-vertical{flex-direction:column;&>li{--timeline-row-start:minmax(0,1fr);--timeline-row-end:minmax(0,1fr);justify-items:center;&>hr{width:.25rem;height:100%;&:first-child{grid-row-start:1;grid-column-start:2}&:last-child{grid-area:3/2/none}}}& .timeline-start{grid-area:1/1/4/2;place-self:center flex-end}& .timeline-end{grid-area:1/3/4/4;place-self:center flex-start}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}&:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}& :last-child{&>hr:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}}}&.timeline-snap-icon{&>li{--timeline-col-start:minmax(0,1fr);--timeline-row-start:.5rem}}}.md\:timeline-horizontal{flex-direction:row;&>li{align-items:center;&>hr{width:100%;height:.25rem;&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& .timeline-start{grid-area:1/1/2/4;place-self:flex-end center}& .timeline-end{grid-area:3/1/4/4;place-self:flex-start center}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}& :last-child{&>hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}}}@media (width>=1024px){.lg\:timeline{display:flex;position:relative;&>li{grid-template-rows:var(--timeline-row-start,minmax(0,1fr))auto var(--timeline-row-end,minmax(0,1fr));grid-template-columns:var(--timeline-col-start,minmax(0,1fr))auto var(--timeline-col-end,minmax(0,1fr));flex-shrink:0;align-items:center;display:grid;position:relative;&>hr{border:none;width:100%;@media print{&{border:.1px solid var(--color-base-300)}}&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& :where(hr){background-color:var(--color-base-300);height:.25rem}&:has(.timeline-middle hr){&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}&:not(:has(.timeline-middle)){& :first-child hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}& :last-child hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}.lg\:timeline-box{border:var(--border)solid;border-radius:var(--radius-box);border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;font-size:.75rem;box-shadow:0 1px 2px oklch(0% 0 0/.05)}.lg\:timeline-start{grid-area:1/1/2/4;place-self:flex-end center;margin:.25rem}.lg\:timeline-middle{grid-row-start:2;grid-column-start:2}.lg\:timeline-end{grid-area:3/1/4/4;place-self:flex-start center;margin:.25rem}.lg\:timeline-compact{--timeline-row-start:0;& .timeline-start{grid-area:3/1/4/4;place-self:flex-start center}& li:has(.timeline-start){& .timeline-end{grid-row-start:auto;grid-column-start:none}}&.timeline-vertical{&>li{--timeline-col-start:0}& .timeline-start{grid-area:1/3/4/4;place-self:center flex-start}& li:has(.timeline-start){& .timeline-end{grid-row-start:none;grid-column-start:auto}}}}.lg\:timeline-snap-icon{&>li{--timeline-col-start:.5rem;--timeline-row-start:minmax(0,1fr)}}.lg\:timeline-vertical{flex-direction:column;&>li{--timeline-row-start:minmax(0,1fr);--timeline-row-end:minmax(0,1fr);justify-items:center;&>hr{width:.25rem;height:100%;&:first-child{grid-row-start:1;grid-column-start:2}&:last-child{grid-area:3/2/none}}}& .timeline-start{grid-area:1/1/4/2;place-self:center flex-end}& .timeline-end{grid-area:1/3/4/4;place-self:center flex-start}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}&:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}& :last-child{&>hr:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}}}&.timeline-snap-icon{&>li{--timeline-col-start:minmax(0,1fr);--timeline-row-start:.5rem}}}.lg\:timeline-horizontal{flex-direction:row;&>li{align-items:center;&>hr{width:100%;height:.25rem;&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& .timeline-start{grid-area:1/1/2/4;place-self:flex-end center}& .timeline-end{grid-area:3/1/4/4;place-self:flex-start center}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}& :last-child{&>hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}}}@media (width>=1280px){.xl\:timeline{display:flex;position:relative;&>li{grid-template-rows:var(--timeline-row-start,minmax(0,1fr))auto var(--timeline-row-end,minmax(0,1fr));grid-template-columns:var(--timeline-col-start,minmax(0,1fr))auto var(--timeline-col-end,minmax(0,1fr));flex-shrink:0;align-items:center;display:grid;position:relative;&>hr{border:none;width:100%;@media print{&{border:.1px solid var(--color-base-300)}}&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& :where(hr){background-color:var(--color-base-300);height:.25rem}&:has(.timeline-middle hr){&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}&:not(:has(.timeline-middle)){& :first-child hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}& :last-child hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}.xl\:timeline-box{border:var(--border)solid;border-radius:var(--radius-box);border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;font-size:.75rem;box-shadow:0 1px 2px oklch(0% 0 0/.05)}.xl\:timeline-start{grid-area:1/1/2/4;place-self:flex-end center;margin:.25rem}.xl\:timeline-middle{grid-row-start:2;grid-column-start:2}.xl\:timeline-end{grid-area:3/1/4/4;place-self:flex-start center;margin:.25rem}.xl\:timeline-compact{--timeline-row-start:0;& .timeline-start{grid-area:3/1/4/4;place-self:flex-start center}& li:has(.timeline-start){& .timeline-end{grid-row-start:auto;grid-column-start:none}}&.timeline-vertical{&>li{--timeline-col-start:0}& .timeline-start{grid-area:1/3/4/4;place-self:center flex-start}& li:has(.timeline-start){& .timeline-end{grid-row-start:none;grid-column-start:auto}}}}.xl\:timeline-snap-icon{&>li{--timeline-col-start:.5rem;--timeline-row-start:minmax(0,1fr)}}.xl\:timeline-vertical{flex-direction:column;&>li{--timeline-row-start:minmax(0,1fr);--timeline-row-end:minmax(0,1fr);justify-items:center;&>hr{width:.25rem;height:100%;&:first-child{grid-row-start:1;grid-column-start:2}&:last-child{grid-area:3/2/none}}}& .timeline-start{grid-area:1/1/4/2;place-self:center flex-end}& .timeline-end{grid-area:1/3/4/4;place-self:center flex-start}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}&:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}& :last-child{&>hr:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}}}&.timeline-snap-icon{&>li{--timeline-col-start:minmax(0,1fr);--timeline-row-start:.5rem}}}.xl\:timeline-horizontal{flex-direction:row;&>li{align-items:center;&>hr{width:100%;height:.25rem;&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& .timeline-start{grid-area:1/1/2/4;place-self:flex-end center}& .timeline-end{grid-area:3/1/4/4;place-self:flex-start center}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}& :last-child{&>hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}}}@media (width>=1536px){.\32 xl\:timeline{display:flex;position:relative;&>li{grid-template-rows:var(--timeline-row-start,minmax(0,1fr))auto var(--timeline-row-end,minmax(0,1fr));grid-template-columns:var(--timeline-col-start,minmax(0,1fr))auto var(--timeline-col-end,minmax(0,1fr));flex-shrink:0;align-items:center;display:grid;position:relative;&>hr{border:none;width:100%;@media print{&{border:.1px solid var(--color-base-300)}}&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& :where(hr){background-color:var(--color-base-300);height:.25rem}&:has(.timeline-middle hr){&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}&:not(:has(.timeline-middle)){& :first-child hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}& :last-child hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}.\32 xl\:timeline-box{border:var(--border)solid;border-radius:var(--radius-box);border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;font-size:.75rem;box-shadow:0 1px 2px oklch(0% 0 0/.05)}.\32 xl\:timeline-start{grid-area:1/1/2/4;place-self:flex-end center;margin:.25rem}.\32 xl\:timeline-middle{grid-row-start:2;grid-column-start:2}.\32 xl\:timeline-end{grid-area:3/1/4/4;place-self:flex-start center;margin:.25rem}.\32 xl\:timeline-compact{--timeline-row-start:0;& .timeline-start{grid-area:3/1/4/4;place-self:flex-start center}& li:has(.timeline-start){& .timeline-end{grid-row-start:auto;grid-column-start:none}}&.timeline-vertical{&>li{--timeline-col-start:0}& .timeline-start{grid-area:1/3/4/4;place-self:center flex-start}& li:has(.timeline-start){& .timeline-end{grid-row-start:none;grid-column-start:auto}}}}.\32 xl\:timeline-snap-icon{&>li{--timeline-col-start:.5rem;--timeline-row-start:minmax(0,1fr)}}.\32 xl\:timeline-vertical{flex-direction:column;&>li{--timeline-row-start:minmax(0,1fr);--timeline-row-end:minmax(0,1fr);justify-items:center;&>hr{width:.25rem;height:100%;&:first-child{grid-row-start:1;grid-column-start:2}&:last-child{grid-area:3/2/none}}}& .timeline-start{grid-area:1/1/4/2;place-self:center flex-end}& .timeline-end{grid-area:1/3/4/4;place-self:center flex-start}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}&:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-top-left-radius:var(--radius-selector);border-top-right-radius:var(--radius-selector);border-bottom-right-radius:0;border-bottom-left-radius:0}}& :last-child{&>hr:first-child{border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:var(--radius-selector);border-bottom-left-radius:var(--radius-selector)}}}&.timeline-snap-icon{&>li{--timeline-col-start:minmax(0,1fr);--timeline-row-start:.5rem}}}.\32 xl\:timeline-horizontal{flex-direction:row;&>li{align-items:center;&>hr{width:100%;height:.25rem;&:first-child{grid-row-start:2;grid-column-start:1}&:last-child{grid-area:2/3/auto/none}}}& .timeline-start{grid-area:1/1/2/4;place-self:flex-end center}& .timeline-end{grid-area:3/1/4/4;place-self:flex-start center}&:has(.timeline-middle){&>li{&>hr{&:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}&:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}}}&:not(:has(.timeline-middle)){& :first-child{&>hr:last-child{border-start-start-radius:var(--radius-selector);border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:var(--radius-selector)}}& :last-child{&>hr:first-child{border-start-start-radius:0;border-start-end-radius:var(--radius-selector);border-end-end-radius:var(--radius-selector);border-end-start-radius:0}}}}}

package/components/toast/class.json

@@ -0,0 +1,9 @@
+[
+  "toast",
+  "toast-start",
+  "toast-center",
+  "toast-end",
+  "toast-bottom",
+  "toast-middle",
+  "toast-top"
+]

package/components/toast/index.js

@@ -0,0 +1,7 @@
+import toast from './object.js';
+import { addPrefix } from '../../functions/addPrefix.js';
+
+export default ({ addComponents, prefix = '' }) => {
+  const prefixedtoast = addPrefix(toast, prefix);
+  addComponents({ ...prefixedtoast });
+};

package/components/toast/object.js

@@ -0,0 +1 @@
+export default {".toast":{"position":"fixed","inset-inline-start":"auto","inset-inline-end":"calc(0.25rem * 0)","top":"auto","bottom":"calc(0.25rem * 0)","margin":"calc(0.25rem * 4)","display":"flex","min-width":"fit-content","flex-direction":"column","gap":"calc(0.25rem * 2)","background-color":"transparent","white-space":"nowrap","translate":"var(--toast-x, 0) var(--toast-y, 0)","& > *":{"animation":"toast 0.25s ease-out"},"&:where(.toast-start)":{"inset-inline-start":"calc(0.25rem * 0)","inset-inline-end":"auto","--toast-x":"0"},"&:where(.toast-center)":{"inset-inline-start":"calc(1/2 * 100%)","inset-inline-end":"calc(1/2 * 100%)","--toast-x":"-50%"},"&:where(.toast-end)":{"inset-inline-start":"auto","inset-inline-end":"calc(0.25rem * 0)","--toast-x":"0"},"&:where(.toast-bottom)":{"top":"auto","bottom":"calc(0.25rem * 0)","--toast-y":"0"},"&:where(.toast-middle)":{"top":"calc(1/2 * 100%)","bottom":"auto","--toast-y":"-50%"},"&:where(.toast-top)":{"top":"calc(0.25rem * 0)","bottom":"auto","--toast-y":"0"}},"@keyframes toast":{"0%":{"scale":"0.9","opacity":0},"100%":{"scale":"1","opacity":1}}};

package/components/toast.css

@@ -0,0 +1 @@
+/*! 🌼 daisyUI 5.0.0-beta.2 - MIT License */ .toast{inset-inline:auto 0;white-space:nowrap;min-width:fit-content;translate:var(--toast-x,0)var(--toast-y,0);background-color:#0000;flex-direction:column;gap:.5rem;margin:1rem;display:flex;position:fixed;top:auto;bottom:0;&>*{animation:.25s ease-out toast}&:where(.toast-start){--toast-x:0;inset-inline:0 auto}&:where(.toast-center){--toast-x:-50%;inset-inline:50%}&:where(.toast-end){--toast-x:0;inset-inline:auto 0}&:where(.toast-bottom){--toast-y:0;top:auto;bottom:0}&:where(.toast-middle){--toast-y:-50%;top:50%;bottom:auto}&:where(.toast-top){--toast-y:0;top:0;bottom:auto}}@keyframes toast{0%{opacity:0;scale:.9}to{opacity:1;scale:1}}@media (width>=640px){.sm\:toast{inset-inline:auto 0;white-space:nowrap;min-width:fit-content;translate:var(--toast-x,0)var(--toast-y,0);background-color:#0000;flex-direction:column;gap:.5rem;margin:1rem;display:flex;position:fixed;top:auto;bottom:0;&>*{animation:.25s ease-out toast}&:where(.toast-start){--toast-x:0;inset-inline:0 auto}&:where(.toast-center){--toast-x:-50%;inset-inline:50%}&:where(.toast-end){--toast-x:0;inset-inline:auto 0}&:where(.toast-bottom){--toast-y:0;top:auto;bottom:0}&:where(.toast-middle){--toast-y:-50%;top:50%;bottom:auto}&:where(.toast-top){--toast-y:0;top:0;bottom:auto}}}@media (width>=768px){.md\:toast{inset-inline:auto 0;white-space:nowrap;min-width:fit-content;translate:var(--toast-x,0)var(--toast-y,0);background-color:#0000;flex-direction:column;gap:.5rem;margin:1rem;display:flex;position:fixed;top:auto;bottom:0;&>*{animation:.25s ease-out toast}&:where(.toast-start){--toast-x:0;inset-inline:0 auto}&:where(.toast-center){--toast-x:-50%;inset-inline:50%}&:where(.toast-end){--toast-x:0;inset-inline:auto 0}&:where(.toast-bottom){--toast-y:0;top:auto;bottom:0}&:where(.toast-middle){--toast-y:-50%;top:50%;bottom:auto}&:where(.toast-top){--toast-y:0;top:0;bottom:auto}}}@media (width>=1024px){.lg\:toast{inset-inline:auto 0;white-space:nowrap;min-width:fit-content;translate:var(--toast-x,0)var(--toast-y,0);background-color:#0000;flex-direction:column;gap:.5rem;margin:1rem;display:flex;position:fixed;top:auto;bottom:0;&>*{animation:.25s ease-out toast}&:where(.toast-start){--toast-x:0;inset-inline:0 auto}&:where(.toast-center){--toast-x:-50%;inset-inline:50%}&:where(.toast-end){--toast-x:0;inset-inline:auto 0}&:where(.toast-bottom){--toast-y:0;top:auto;bottom:0}&:where(.toast-middle){--toast-y:-50%;top:50%;bottom:auto}&:where(.toast-top){--toast-y:0;top:0;bottom:auto}}}@media (width>=1280px){.xl\:toast{inset-inline:auto 0;white-space:nowrap;min-width:fit-content;translate:var(--toast-x,0)var(--toast-y,0);background-color:#0000;flex-direction:column;gap:.5rem;margin:1rem;display:flex;position:fixed;top:auto;bottom:0;&>*{animation:.25s ease-out toast}&:where(.toast-start){--toast-x:0;inset-inline:0 auto}&:where(.toast-center){--toast-x:-50%;inset-inline:50%}&:where(.toast-end){--toast-x:0;inset-inline:auto 0}&:where(.toast-bottom){--toast-y:0;top:auto;bottom:0}&:where(.toast-middle){--toast-y:-50%;top:50%;bottom:auto}&:where(.toast-top){--toast-y:0;top:0;bottom:auto}}}@media (width>=1536px){.\32 xl\:toast{inset-inline:auto 0;white-space:nowrap;min-width:fit-content;translate:var(--toast-x,0)var(--toast-y,0);background-color:#0000;flex-direction:column;gap:.5rem;margin:1rem;display:flex;position:fixed;top:auto;bottom:0;&>*{animation:.25s ease-out toast}&:where(.toast-start){--toast-x:0;inset-inline:0 auto}&:where(.toast-center){--toast-x:-50%;inset-inline:50%}&:where(.toast-end){--toast-x:0;inset-inline:auto 0}&:where(.toast-bottom){--toast-y:0;top:auto;bottom:0}&:where(.toast-middle){--toast-y:-50%;top:50%;bottom:auto}&:where(.toast-top){--toast-y:0;top:0;bottom:auto}}}

package/components/toggle/class.json

@@ -1,10 +1,9 @@
 [
   "toggle",
-  "1s",
-  "2s",
   "toggle-primary",
   "toggle-secondary",
   "toggle-accent",
+  "toggle-neutral",
   "toggle-success",
   "toggle-warning",
   "toggle-info",
@@ -12,5 +11,6 @@
   "toggle-xs",
   "toggle-sm",
   "toggle-md",
-  "toggle-lg"
+  "toggle-lg",
+  "toggle-xl"
 ]

package/components/toggle/index.js

@@ -1 +1,7 @@
-export default {".toggle":{"@apply rounded-badge text-base-content/50 inline-flex h-6 w-12 shrink-0 cursor-pointer appearance-none rounded-[var(--radius-badge)] border border-current p-[.1875rem] align-middle":{},"boxShadow":"0 1px color-mix(in oklab, currentColor, transparent 90%) inset","transition":"color .3s","&:before":{"@apply block h-full grow-0":{},"content":"\"\"","transition":"flex-grow 0.2s"},"&:after":{"@apply relative start-0 block aspect-square h-full translate-x-0 [border-radius:calc(var(--radius-badge)-3px)] bg-current":{},"content":"\"\"","transition":"background-color 0.1s,\n      translate 0.2s,\n      inset-inline-start 0.2s","boxShadow":"0 -1px oklch(0% 0 0 / 0.1) inset,\n      0 8px 0 -4px oklch(100% 0 0 / 0.1) inset,\n      0 1px color-mix(in oklab, currentColor, transparent 90%)"},"&:focus-visible":{"@apply outline outline-2 outline-offset-2 outline-current":{}},"&:checked,\n  &[aria-checked=\"true\"]":{"@apply bg-base-100 text-base-content":{},"&:before":{"@apply grow":{}},"&:after":{"@apply bg-current":{},"@starting-style":{"opacity":0}}},"&:indeterminate":{"&:before":{"@apply grow-0":{}},"&:after":{"@apply start-1/2 -translate-x-1/2":{}}},"&:disabled":{"@apply cursor-not-allowed opacity-30":{},"&:after":{"@apply border border-current bg-transparent":{}}}},".toggle-primary":{"&:checked,\n  &[aria-checked=\"true\"]":{"@apply text-primary":{}}},".toggle-secondary":{"&:checked,\n  &[aria-checked=\"true\"]":{"@apply text-secondary":{}}},".toggle-accent":{"&:checked,\n  &[aria-checked=\"true\"]":{"@apply text-accent":{}}},".toggle-success":{"&:checked,\n  &[aria-checked=\"true\"]":{"@apply text-success":{}}},".toggle-warning":{"&:checked,\n  &[aria-checked=\"true\"]":{"@apply text-warning":{}}},".toggle-info":{"&:checked,\n  &[aria-checked=\"true\"]":{"@apply text-info":{}}},".toggle-error":{"&:checked,\n  &[aria-checked=\"true\"]":{"@apply text-error":{}}},".toggle-xs":{"&:is([type=\"checkbox\"])":{"@apply p-[.0625rem] h-4 w-6":{}}},".toggle-sm":{"&:is([type=\"checkbox\"])":{"@apply p-[.125rem] h-5 w-8":{}}},".toggle-md":{"&:is([type=\"checkbox\"])":{"@apply p-[.1875rem] h-6 w-12":{}}},".toggle-lg":{"&:is([type=\"checkbox\"])":{"@apply p-[.25rem] h-8 w-16":{}}}};
+import toggle from './object.js';
+import { addPrefix } from '../../functions/addPrefix.js';
+
+export default ({ addComponents, prefix = '' }) => {
+  const prefixedtoggle = addPrefix(toggle, prefix);
+  addComponents({ ...prefixedtoggle });
+};

package/components/toggle/object.js

@@ -0,0 +1 @@
+export default {".toggle":{"border":"var(--border) solid currentColor","color":"var(--input-color)","position":"relative","display":"inline-grid","flex-shrink":0,"cursor":"pointer","appearance":"none","place-content":"center","vertical-align":"middle","webkit-user-select":"none","user-select":"none","grid-template-columns":"0fr 1fr 1fr","border-radius":"calc( var(--radius-selector) + min( var(--toggle-p), calc(var(--radius-selector) + var(--radius-selector) + var(--radius-selector)) ) + min( var(--border), calc(var(--radius-selector) + var(--radius-selector) + var(--radius-selector)) ) )","padding":"var(--toggle-p)","box-shadow":"0 1px color-mix(in oklab, currentColor calc(var(--depth) * 10%), transparent) inset","transition":"color 0.3s, grid-template-columns 0.2s","--input-color":"color-mix(in oklab, var(--color-base-content) 50%, transparent)","--toggle-p":"0.1875rem","--size":"calc(var(--size-selector, 0.25rem) * 6)","width":"calc((var(--size) * 2) - (var(--border) + var(--toggle-p)) * 2)","height":"var(--size)","> *":{"z-index":1,"grid-column":"span 1 / span 1","grid-column-start":"2","grid-row-start":"1","height":"100%","cursor":"pointer","appearance":"none","background-color":"transparent","padding":"calc(0.25rem * 0.5)","transition":"opacity 0.2s, rotate 0.4s","border":"none","&:focus":{"outline-style":"none","@media (forced-colors: active)":{"outline":"2px solid transparent","outline-offset":"2px"}},"&:nth-child(2)":{"color":"var(--color-base-100)","rotate":"0deg"},"&:nth-child(3)":{"color":"var(--color-base-100)","opacity":"0%","rotate":"-15deg"}},"&:has(:checked)":{"> :nth-child(2)":{"opacity":"0%","rotate":"15deg"},"> :nth-child(3)":{"opacity":"100%","rotate":"0deg"}},"&:before":{"position":"relative","inset-inline-start":"calc(0.25rem * 0)","grid-column-start":"2","grid-row-start":"1","aspect-ratio":"1 / 1","height":"100%","border-radius":"var(--radius-selector)","background-color":"currentColor","@media print":[{"outline":".25rem solid"},{"outline-offset":"-1rem"}],"translate":"0","--tw-content":"\"\"","content":"var(--tw-content)","transition":"background-color 0.1s, translate 0.2s, inset-inline-start 0.2s","box-shadow":"0 -1px oklch(0% 0 0 / calc(var(--depth) * 0.1)) inset, 0 8px 0 -4px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset, 0 1px color-mix(in oklab, currentColor calc(var(--depth) * 10%), transparent)","background-size":"calc(var(--noise) * 1000px)","background-image":"url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.34' numOctaves='4' stitchTiles='stitch'%3E%3C/feTurbulence%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)' opacity='0.2'%3E%3C/rect%3E%3C/svg%3E\")","@media (forced-colors: active)":{"outline-style":"var(--tw-outline-style)","outline-width":"1px","outline-offset":"calc(1px * -1)"}},"&:focus-visible, &:has(:focus-visible)":{"outline":"2px solid currentColor","outline-offset":"2px"},"&:checked, &[aria-checked=\"true\"], &:has(> input:checked)":{"grid-template-columns":"1fr 1fr 0fr","background-color":"var(--color-base-100)","--input-color":"var(--color-base-content)","&:before":{"background-color":"currentColor","@starting-style":{"opacity":0}}},"&:indeterminate":{"grid-template-columns":"0.5fr 1fr 0.5fr"},"&:disabled":{"cursor":"not-allowed","opacity":"30%","&:before":{"background-color":"transparent","border":"var(--border) solid currentColor"}}},".toggle-primary":{"&:checked, &[aria-checked=\"true\"]":{"--input-color":"var(--color-primary)"}},".toggle-secondary":{"&:checked, &[aria-checked=\"true\"]":{"--input-color":"var(--color-secondary)"}},".toggle-accent":{"&:checked, &[aria-checked=\"true\"]":{"--input-color":"var(--color-accent)"}},".toggle-neutral":{"&:checked, &[aria-checked=\"true\"]":{"--input-color":"var(--color-neutral)"}},".toggle-success":{"&:checked, &[aria-checked=\"true\"]":{"--input-color":"var(--color-success)"}},".toggle-warning":{"&:checked, &[aria-checked=\"true\"]":{"--input-color":"var(--color-warning)"}},".toggle-info":{"&:checked, &[aria-checked=\"true\"]":{"--input-color":"var(--color-info)"}},".toggle-error":{"&:checked, &[aria-checked=\"true\"]":{"--input-color":"var(--color-error)"}},".toggle-xs":{"&:is([type=\"checkbox\"]), &:has([type=\"checkbox\"])":{"--toggle-p":"0.0625rem","--size":"calc(var(--size-selector, 0.25rem) * 4)"}},".toggle-sm":{"&:is([type=\"checkbox\"]), &:has([type=\"checkbox\"])":{"--toggle-p":"0.125rem","--size":"calc(var(--size-selector, 0.25rem) * 5)"}},".toggle-md":{"&:is([type=\"checkbox\"]), &:has([type=\"checkbox\"])":{"--toggle-p":"0.1875rem","--size":"calc(var(--size-selector, 0.25rem) * 6)"}},".toggle-lg":{"&:is([type=\"checkbox\"]), &:has([type=\"checkbox\"])":{"--toggle-p":"0.25rem","--size":"calc(var(--size-selector, 0.25rem) * 7)"}},".toggle-xl":{"&:is([type=\"checkbox\"]), &:has([type=\"checkbox\"])":{"--toggle-p":"0.3125rem","--size":"calc(var(--size-selector, 0.25rem) * 8)"}}};