daisyui 5.0.0-alpha.39 → 5.0.0-alpha.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/base/properties.css +1 -1
- package/base/reset.css +1 -1
- package/base/rootcolor.css +1 -1
- package/base/rootscrollgutter.css +1 -1
- package/base/rootscrolllock.css +1 -1
- package/base/scrollbar.css +1 -1
- package/chunks.css +2 -2
- package/colors/properties.css +1 -1
- package/colors/responsive.css +1 -1
- package/colors/states.css +1 -1
- package/components/alert.css +1 -1
- package/components/avatar.css +1 -1
- package/components/badge/object.js +1 -1
- package/components/badge.css +1 -1
- package/components/breadcrumbs.css +1 -1
- package/components/button.css +1 -1
- package/components/calendar/index.js +7 -0
- package/components/calendar/object.js +1 -0
- package/components/calendar.css +1 -0
- package/components/card/object.js +1 -1
- package/components/card.css +1 -1
- package/components/carousel.css +1 -1
- package/components/chat.css +1 -1
- package/components/checkbox.css +1 -1
- package/components/collapse.css +1 -1
- package/components/countdown/object.js +1 -1
- package/components/countdown.css +1 -1
- package/components/divider.css +1 -1
- package/components/dock.css +1 -1
- package/components/drawer/object.js +1 -1
- package/components/drawer.css +1 -1
- package/components/dropdown/object.js +1 -1
- package/components/dropdown.css +1 -1
- package/components/fieldset/index.js +7 -0
- package/components/fieldset/object.js +1 -0
- package/components/fieldset.css +1 -0
- package/components/fileinput.css +1 -1
- package/components/footer.css +1 -1
- package/components/hero.css +1 -1
- package/components/indicator.css +1 -1
- package/components/input.css +1 -1
- package/components/kbd/object.js +1 -1
- package/components/kbd.css +1 -1
- package/components/link.css +1 -1
- package/components/loading.css +1 -1
- package/components/mask.css +1 -1
- package/components/menu/object.js +1 -1
- package/components/menu.css +1 -1
- package/components/mockup.css +1 -1
- package/components/modal/object.js +1 -1
- package/components/modal.css +1 -1
- package/components/navbar.css +1 -1
- package/components/progress.css +1 -1
- package/components/radialprogress.css +1 -1
- package/components/radio.css +1 -1
- package/components/range.css +1 -1
- package/components/rating.css +1 -1
- package/components/select.css +1 -1
- package/components/skeleton.css +1 -1
- package/components/stack.css +1 -1
- package/components/stat.css +1 -1
- package/components/status.css +1 -1
- package/components/steps.css +1 -1
- package/components/swap.css +1 -1
- package/components/tab.css +1 -1
- package/components/table.css +1 -1
- package/components/textarea.css +1 -1
- package/components/timeline.css +1 -1
- package/components/toast.css +1 -1
- package/components/toggle.css +1 -1
- package/components/tooltip.css +1 -1
- package/daisyui.css +1 -1
- package/imports.js +4 -4
- package/package.json +2 -2
- package/theme/acid/object.js +1 -1
- package/theme/acid.css +16 -16
- package/theme/aqua/object.js +1 -1
- package/theme/aqua.css +18 -18
- package/theme/autumn/object.js +1 -1
- package/theme/autumn.css +19 -19
- package/theme/black/object.js +1 -1
- package/theme/black.css +15 -15
- package/theme/bumblebee/object.js +1 -1
- package/theme/bumblebee.css +2 -2
- package/theme/business/object.js +1 -1
- package/theme/business.css +19 -19
- package/theme/cmyk/object.js +1 -1
- package/theme/cmyk.css +16 -16
- package/theme/coffee/object.js +1 -1
- package/theme/coffee.css +20 -20
- package/theme/corporate/object.js +1 -1
- package/theme/corporate.css +8 -8
- package/theme/cupcake/object.js +1 -1
- package/theme/cupcake.css +12 -12
- package/theme/cyberpunk/object.js +1 -1
- package/theme/cyberpunk.css +7 -7
- package/theme/dark/object.js +1 -1
- package/theme/dark.css +6 -6
- package/theme/dim/object.js +1 -1
- package/theme/dim.css +20 -20
- package/theme/dracula/object.js +1 -1
- package/theme/dracula.css +20 -20
- package/theme/emerald/object.js +1 -1
- package/theme/emerald.css +7 -7
- package/theme/fantasy/object.js +1 -1
- package/theme/fantasy.css +6 -6
- package/theme/forest/object.js +1 -1
- package/theme/forest.css +11 -11
- package/theme/garden/object.js +1 -1
- package/theme/garden.css +11 -11
- package/theme/halloween/object.js +1 -1
- package/theme/halloween.css +16 -16
- package/theme/lemonade/object.js +1 -1
- package/theme/lemonade.css +9 -9
- package/theme/light/object.js +1 -1
- package/theme/light.css +9 -9
- package/theme/lofi/object.js +1 -1
- package/theme/lofi.css +7 -7
- package/theme/luxury/object.js +1 -1
- package/theme/luxury.css +18 -18
- package/theme/night/object.js +1 -1
- package/theme/night.css +19 -19
- package/theme/nord/object.js +1 -1
- package/theme/nord.css +20 -20
- package/theme/object.js +1 -1
- package/theme/pastel/object.js +1 -1
- package/theme/pastel.css +10 -10
- package/theme/retro/object.js +1 -1
- package/theme/retro.css +19 -19
- package/theme/sunset/object.js +1 -1
- package/theme/sunset.css +15 -15
- package/theme/synthwave/object.js +1 -1
- package/theme/synthwave.css +19 -19
- package/theme/valentine/object.js +1 -1
- package/theme/valentine.css +19 -19
- package/theme/winter/object.js +1 -1
- package/theme/winter.css +17 -17
- package/theme/wireframe/object.js +1 -1
- package/theme/wireframe.css +17 -17
- package/themes.css +1 -1
- package/utilities/join.css +1 -1
- package/utilities/radius.css +1 -1
- package/utilities/typography.css +1 -1
- package/base/startingstyle/index.js +0 -7
- package/base/startingstyle/object.js +0 -1
- package/base/startingstyle.css +0 -1
- package/components/formcontrol/index.js +0 -7
- package/components/formcontrol/object.js +0 -1
- package/components/formcontrol.css +0 -1
package/components/tab.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! 🌼 daisyUI 5.0.0-alpha.39 – 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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.sm\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.sm\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.sm\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.sm\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.sm\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.sm\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.sm\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.sm\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.sm\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.sm\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.sm\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.md\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.md\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.md\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.md\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.md\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.md\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.md\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.md\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.md\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.md\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.md\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.lg\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.lg\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.lg\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.lg\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.lg\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.lg\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.lg\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.lg\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.lg\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.lg\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.lg\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.xl\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.xl\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.xl\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.xl\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.xl\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.xl\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.xl\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.xl\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.xl\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.xl\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.xl\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.\32 xl\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.\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}}}}.\32 xl\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.\32 xl\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.\32 xl\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.\32 xl\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.\32 xl\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.\32 xl\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.\32 xl\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.\32 xl\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.\32 xl\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.\32 xl\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;font-size:1.125rem}}}
|
|
1
|
+
/*! 🌼 daisyUI 5.0.0-alpha.40 – 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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.sm\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.sm\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.sm\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.sm\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.sm\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.sm\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.sm\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.sm\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.sm\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.sm\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.sm\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.md\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.md\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.md\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.md\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.md\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.md\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.md\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.md\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.md\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.md\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.md\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.lg\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.lg\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.lg\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.lg\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.lg\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.lg\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.lg\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.lg\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.lg\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.lg\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.lg\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.xl\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.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}}}}.xl\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.xl\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.xl\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.xl\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.xl\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.xl\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.xl\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.xl\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.xl\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.xl\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;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;color:color-mix(in oklch,var(--color-base-content)50%,transparent);-webkit-user-select:none;user-select:none;--tab-padding: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:1rem;flex-wrap:wrap;order:var(--tab-order);border-color:#0000;justify-content:center;align-items:center;height:2.25rem;padding-inline-start:var(--tab-padding);padding-inline-end:var(--tab-padding);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(input):empty{cursor:default}&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){color:var(--color-base-content)}&:focus{outline-offset:2px;outline:2px solid #0000}&:focus-visible{outline-offset:-5px;outline:2px solid}&[disabled],&[disabled]:hover{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}.\32 xl\:tab-disabled{cursor:not-allowed;color:color-mix(in oklch,var(--color-base-content)20%,transparent)}.\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}}}}.\32 xl\:tabs-lift{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;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:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--tab-inset:auto auto 0 auto;--tab-grad:calc(69% - 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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}&:last-child:before{--radius-end:none}}&:last-of-type{margin:var(--last-tab-margin)}}&: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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.\32 xl\:tabs-top{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:0;--tab-border:0 0 1px 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:1px var(--tab-padding)0 var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:1px 1px 0 1px;--tab-border-colors:var(--tab-border-color)var(--tab-border-color)transparent var(--tab-border-color);--tab-paddings:0 calc(var(--tab-padding) - 1px)1px calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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:-1px 0 0 0;--radius-tabcontent-ss:0;--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:var(--radius-box);--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-ss:var(--radius-box)}}}.\32 xl\:tabs-bottom{--tabs-height:auto;--tabs-direction:row;& .tab{--tab-order:1;--tab-border:1px 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-padding)1px var(--tab-padding);--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;--last-tab-margin:0 var(--tab-padding)0 0;&:is(.tab-active,[aria-selected=true]):not(.tab-disabled,[disabled]),&:is(input:checked){--tab-border:0 1px 1px 1px;--tab-border-colors:transparent var(--tab-border-color)var(--tab-border-color)var(--tab-border-color);--tab-paddings:1px calc(var(--tab-padding) - 1px)0 calc(var(--tab-padding) - 1px);--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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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) + 1px),var(--tab-bg)calc(var(--tab-grad) + 1px + .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 -1px 0;--radius-tabcontent-ss:var(--radius-box);--radius-tabcontent-se:var(--radius-box);--radius-tabcontent-es:0;--radius-tabcontent-ee:var(--radius-box)}& :checked,& :is(.tab-active,[aria-selected=true]){&+.tab-content:not(:nth-child(2)){--radius-tabcontent-es:var(--radius-box)}}}.\32 xl\:tabs-box{border-radius:var(--radius-field);background-color:var(--color-base-200);padding:.25rem;box-shadow:inset 0 -.5px oklch(100% 0 0/.1),inset 0 .5px oklch(0% 0 0/.05);& .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/.1) inset,0 1px 1px -1px color-mix(in oklab,var(--color-neutral),transparent),0 1px 6px -4px var(--color-neutral);&:hover{@media (hover:hover){&{color:var(--color-base-content)}}}}}.\32 xl\:tab-content{--radius-tabcontent-ss:0;--radius-tabcontent-se:0;--radius-tabcontent-es:0;--radius-tabcontent-ee:0;--tabcontent-order:1;margin:var(--tabcontent-margin);order:1;order:var(--tabcontent-order);border-width:1px;border-color:#0000;border-start-start-radius:var(--radius-tabcontent-ss);border-start-end-radius:var(--radius-tabcontent-se);border-end-end-radius:var(--radius-tabcontent-ee);border-end-start-radius:var(--radius-tabcontent-es);width:100%;display:none}.\32 xl\:tabs-xs{& :where(.tab){--tab-padding:.375rem;--tab-radius-min:.5rem;height:1.25rem;font-size:.75rem}}.\32 xl\:tabs-sm{& :where(.tab){--tab-padding:.5rem;--tab-radius-min:.5rem;height:1.75rem;font-size:.875rem}}.\32 xl\:tabs-md{& :where(.tab){--tab-padding:.75rem;--tab-radius-min:1rem;height:2.25rem;font-size:.875rem}}.\32 xl\:tabs-lg{& :where(.tab){--tab-padding:1rem;--tab-radius-min:1.5rem;height:2.75rem;font-size:1.125rem}}.\32 xl\:tabs-xl{& :where(.tab){--tab-padding:1.25rem;--tab-radius-min:2rem;height:3.5rem;font-size:1.125rem}}}
|
package/components/table.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! 🌼 daisyUI 5.0.0-alpha.39 – 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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.\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}}}
|
|
1
|
+
/*! 🌼 daisyUI 5.0.0-alpha.40 – 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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.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 oklch,var(--color-base-content)60%,transparent);font-size:.875rem;font-weight:600}& :where(tfoot){border-top:1px solid var(--color-base-200)}& :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:1px solid var(--color-base-200)}}.\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.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! 🌼 daisyUI 5.0.0-alpha.39 – MIT License */ .textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}@media (width>=640px){.sm\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}@media (width>=768px){.md\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}@media (width>=1024px){.lg\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}@media (width>=1280px){.xl\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}@media (width>=1536px){.\32 xl\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}
|
|
1
|
+
/*! 🌼 daisyUI 5.0.0-alpha.40 – MIT License */ .textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}@media (width>=640px){.sm\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}@media (width>=768px){.md\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}@media (width>=1024px){.lg\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}@media (width>=1280px){.xl\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}@media (width>=1536px){.\32 xl\:textarea{appearance:none;border-radius:var(--radius-field);background-color:var(--color-base-100);vertical-align:middle;--spacing-field-size:.25rem;--field-size:calc(var(--spacing-field-size)*9);border:1px solid #0000;flex-shrink:1;width:100%;max-width:20rem;min-height:5rem;padding-block:.5rem;padding-inline:.75rem;font-size:.875rem;& textarea{background-color:#0000;border:none;&:focus{outline-offset:2px;outline:2px solid #0000}}&:focus,&:focus-within{border-color:color-mix(in srgb,var(--color-base-content)20%,transparent);outline:2px solid color-mix(in srgb,var(--color-base-content)20%,transparent);outline-offset:2px}&: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 oklch,var(--color-base-content)40%,transparent);box-shadow:none;&::placeholder{color:color-mix(in oklch,var(--color-base-content)20%,transparent)}}&:has(>textarea[disabled])>textarea[disabled]{cursor:not-allowed}&.textarea-border{border-color:color-mix(in oklch,var(--color-base-content)10%,transparent);box-shadow:inset 0 1px oklch(0% 0 0/.1),inset 0 -1px oklch(100% 0 0/.1);&:focus{box-shadow:0 1px oklch(0% 0 0/.1)}}&.textarea-ghost{background-color:color-mix(in oklch,var(--color-base-100)5%,transparent);box-shadow:none;&:focus,&:focus-within{background-color:var(--color-base-100);color:var(--color-base-content);box-shadow:none}}&.textarea-primary{border-color:var(--color-primary);background-color:color-mix(in oklab,var(--color-primary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-primary);outline-color:var(--color-primary)}}&.textarea-secondary{border-color:var(--color-secondary);background-color:color-mix(in oklab,var(--color-secondary)2%,transparent);&:focus,&:focus-within{border-color:var(--color-secondary);outline-color:var(--color-secondary)}}&.textarea-accent{border-color:var(--color-accent);background-color:color-mix(in oklab,var(--color-accent)2%,transparent);&:focus,&:focus-within{border-color:var(--color-accent);outline-color:var(--color-accent)}}&.textarea-neutral{border-color:var(--color-neutral);background-color:color-mix(in oklab,var(--color-neutral)2%,transparent);&:focus,&:focus-within{border-color:var(--color-neutral);outline-color:var(--color-neutral)}}&.textarea-info{border-color:var(--color-info);background-color:color-mix(in oklab,var(--color-info)2%,transparent);&:focus,&:focus-within{border-color:var(--color-info);outline-color:var(--color-info)}}&.textarea-success{border-color:var(--color-success);background-color:color-mix(in oklab,var(--color-success)2%,transparent);&:focus,&:focus-within{border-color:var(--color-success);outline-color:var(--color-success)}}&.textarea-warning{border-color:var(--color-warning);background-color:color-mix(in oklab,var(--color-warning)2%,transparent);&:focus,&:focus-within{border-color:var(--color-warning);outline-color:var(--color-warning)}}&.textarea-error{border-color:var(--color-error);background-color:color-mix(in oklab,var(--color-error)2%,transparent);&:focus,&:focus-within{border-color:var(--color-error);outline-color:var(--color-error)}}&.textarea-xs{font-size:.75rem}&.textarea-sm,&.textarea-md{font-size:.875rem}&.textarea-lg,&.textarea-xl{font-size:1.125rem}}}
|
package/components/timeline.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! 🌼 daisyUI 5.0.0-alpha.39 – 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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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}}}}}
|
|
1
|
+
/*! 🌼 daisyUI 5.0.0-alpha.40 – 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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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%;&: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-radius:var(--radius-box);border:1px solid;border-color:var(--color-base-300);background-color:var(--color-base-100);padding-block:.5rem;padding-inline:1rem;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}}}}}
|