daisyui 3.6.5 → 3.7.0

package/dist/full.css

@@ -1206,8 +1206,7 @@ hr {
 Add the correct text decoration in Chrome, Edge, and Safari.
 */
 abbr:where([title]) {
-  -webkit-text-decoration: underline dotted;
-          text-decoration: underline dotted;
+  text-decoration: underline dotted;
 }
 /*
 Remove the default font size and weight for headings.
@@ -1540,9 +1539,7 @@ html {
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
     transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
     transition-duration: 200ms;
@@ -1702,17 +1699,14 @@ html {
     display: inline-flex;
     flex-shrink: 0;
     cursor: pointer;
-    -webkit-user-select: none;
-            user-select: none;
+    user-select: none;
     flex-wrap: wrap;
     align-items: center;
     justify-content: center;
     border-color: transparent;
     border-color: hsl(var(--b2) / var(--tw-border-opacity));
     text-align: center;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
     transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
     transition-duration: 200ms;
@@ -1951,7 +1945,8 @@ html {
     grid-row-start: 2;
     min-height: 0px;
     transition: visibility 0.2s;
-    transition: padding 0.2s ease-out, background-color 0.2s ease-out;
+    transition: padding 0.2s ease-out,
+    background-color 0.2s ease-out;
     padding-left: 1rem;
     padding-right: 1rem;
     cursor: unset}
@@ -2041,15 +2036,13 @@ html {
     grid-column-start: 1;
     grid-row-start: 1}
 .drawer-side > *:not(.drawer-overlay) {
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
     transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
     transition-duration: 300ms;
     transform: translateX(-100%)}
 [dir="rtl"] .drawer-side > *:not(.drawer-overlay) {
-    transform: translateX(100%)}
+    transform: translateX(-100%)}
 .drawer-toggle {
     position: fixed;
     height: 0px;
@@ -2066,11 +2059,10 @@ html {
 .drawer-end .drawer-toggle ~ .drawer-content {
     grid-column-start: 1}
 .drawer-end .drawer-toggle ~ .drawer-side {
+    grid-column-start: 2;
     justify-items: end}
 .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) {
     transform: translateX(100%)}
-[dir="rtl"] .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) {
-    transform: translateX(-100%)}
 .drawer-end .drawer-toggle:checked ~ .drawer-side > *:not(.drawer-overlay) {
     transform: translateX(0%)}
 .dropdown {
@@ -2088,9 +2080,7 @@ html {
     --tw-scale-x: .95;
     --tw-scale-y: .95;
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
     transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
     transition-duration: 200ms}
@@ -2301,8 +2291,7 @@ html {
     min-height: 2.875rem;
     flex-shrink: 0;
     cursor: pointer;
-    -webkit-user-select: none;
-            user-select: none;
+    user-select: none;
     flex-wrap: wrap;
     align-items: center;
     justify-content: center;
@@ -2312,9 +2301,7 @@ html {
     font-size: 0.875rem;
     line-height: 1.25rem;
     line-height: 1em;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
     transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
     transition-duration: 200ms;
@@ -2359,8 +2346,7 @@ html {
     flex-direction: column}
 .label {
     display: flex;
-    -webkit-user-select: none;
-            user-select: none;
+    user-select: none;
     align-items: center;
     justify-content: space-between;
     padding-left: 0.25rem;
@@ -2559,12 +2545,10 @@ html {
     align-items: center;
     gap: 0.5rem;
     grid-auto-columns: minmax(auto, max-content) auto max-content;
-    -webkit-user-select: none;
-            user-select: none}
+    user-select: none}
 .menu li.disabled {
     cursor: not-allowed;
-    -webkit-user-select: none;
-            user-select: none;
+    user-select: none;
     color: hsl(var(--bc) / 0.3)}
 .menu :where(li > .menu-dropdown:not(.menu-dropdown-show)) {
     display: none}
@@ -2651,9 +2635,7 @@ html {
     --tw-bg-opacity: 1;
     background-color: hsl(var(--b1) / var(--tw-bg-opacity));
     padding: 1.5rem;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
     transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
     transition-duration: 200ms;
@@ -2737,8 +2719,8 @@ html {
     content: ""}
 .radial-progress:before {
     inset: 0px;
-    background: radial-gradient(farthest-side, currentColor 98%, #0000) top/var(--thickness)
-      var(--thickness) no-repeat,
+    background: radial-gradient(farthest-side, currentColor 98%, #0000) top/var(--thickness) var(--thickness)
+      no-repeat,
     conic-gradient(currentColor calc(var(--value) * 1%), #0000 0);
     -webkit-mask: radial-gradient(
     farthest-side,
@@ -2791,8 +2773,7 @@ html {
 .select {
     display: inline-flex;
     cursor: pointer;
-    -webkit-user-select: none;
-            user-select: none;
+    user-select: none;
     appearance: none;
     height: 3rem;
     padding-left: 1rem;
@@ -2809,8 +2790,10 @@ html {
     border-radius: var(--rounded-btn, 0.5rem);
     background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
     linear-gradient(135deg, currentColor 50%, transparent 50%);
-    background-position: calc(100% - 20px) calc(1px + 50%), calc(100% - 16px) calc(1px + 50%);
-    background-size: 4px 4px, 4px 4px;
+    background-position: calc(100% - 20px) calc(1px + 50%),
+    calc(100% - 16px) calc(1px + 50%);
+    background-size: 4px 4px,
+    4px 4px;
     background-repeat: no-repeat}
 .select[multiple] {
     height: auto}
@@ -2899,8 +2882,7 @@ html {
 .swap {
     position: relative;
     display: inline-grid;
-    -webkit-user-select: none;
-            user-select: none;
+    user-select: none;
     place-content: center;
     cursor: pointer}
 .swap > * {
@@ -2931,8 +2913,7 @@ html {
     position: relative;
     display: inline-flex;
     cursor: pointer;
-    -webkit-user-select: none;
-            user-select: none;
+    user-select: none;
     flex-wrap: wrap;
     align-items: center;
     justify-content: center;
@@ -3017,8 +2998,10 @@ html {
     background-color: hsl(var(--bc) / var(--tw-bg-opacity));
     --tw-bg-opacity: 0.5;
     border-radius: var(--rounded-badge, 1.9rem);
-    transition: background, box-shadow var(--animation-input, 0.2s) ease-out;
-    box-shadow: var(--handleoffsetcalculator) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset,
+    transition: background,
+    box-shadow var(--animation-input, 0.2s) ease-out;
+    box-shadow: var(--handleoffsetcalculator) 0 0 2px var(--tglbg) inset,
+    0 0 0 2px var(--tglbg) inset,
     var(--togglehandleborder)}
 .alert-info {
     border-color: hsl(var(--in) / 0.2);
@@ -3786,7 +3769,8 @@ details.collapse summary::-webkit-details-marker {
 .collapse:not(.collapse-close) :where(input[type="checkbox"]:checked ~ .collapse-content),
 .collapse:not(.collapse-close) :where(input[type="radio"]:checked ~ .collapse-content) {
     padding-bottom: 1rem;
-    transition: padding 0.2s ease-out, background-color 0.2s ease-out}
+    transition: padding 0.2s ease-out,
+    background-color 0.2s ease-out}
 .collapse[open].collapse-arrow .collapse-title:after,
 .collapse-open.collapse-arrow .collapse-title:after,
 .collapse-arrow:focus:not(.collapse-close) .collapse-title:after,
@@ -4182,9 +4166,7 @@ details.collapse summary::-webkit-details-marker {
     padding-top: 0.5rem;
     padding-bottom: 0.5rem;
     text-align: left;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
     transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
     transition-duration: 200ms;
@@ -4247,7 +4229,9 @@ details.collapse summary::-webkit-details-marker {
     width: 0.75rem;
     border-radius: 9999px;
     opacity: 0.3;
-    box-shadow: 1.4em 0, 2.8em 0, 4.2em 0}
+    box-shadow: 1.4em 0,
+        2.8em 0,
+        4.2em 0}
 .mockup-code pre {
     padding-right: 1.25rem}
 .mockup-code pre:before {
@@ -4261,7 +4245,9 @@ details.collapse summary::-webkit-details-marker {
     height: 0.75rem;
     border-radius: 9999px;
     opacity: 0.3;
-    box-shadow: 1.4em 0, 2.8em 0, 4.2em 0}
+    box-shadow: 1.4em 0,
+        2.8em 0,
+        4.2em 0}
 .mockup-phone {
     display: inline-block;
     border: 4px solid #444;
@@ -4319,7 +4305,9 @@ details.collapse summary::-webkit-details-marker {
     height: 0.75rem;
     border-radius: 9999px;
     opacity: 0.3;
-    box-shadow: 1.4em 0, 2.8em 0, 4.2em 0}
+    box-shadow: 1.4em 0,
+          2.8em 0,
+          4.2em 0}
 .mockup-browser .mockup-browser-toolbar .input {
     position: relative;
     margin-left: auto;
@@ -4489,7 +4477,8 @@ details.collapse summary::-webkit-details-marker {
     --tw-bg-opacity: 1;
     background-color: hsl(var(--bc) / var(--tw-bg-opacity));
     animation: radiomark var(--animation-input, 0.2s) ease-out;
-    box-shadow: 0 0 0 4px hsl(var(--b1)) inset, 0 0 0 4px hsl(var(--b1)) inset}
+    box-shadow: 0 0 0 4px hsl(var(--b1)) inset,
+      0 0 0 4px hsl(var(--b1)) inset}
 .radio-primary {
     --chkbg: var(--p);
     --tw-border-opacity: 1;
@@ -4593,11 +4582,14 @@ details.collapse summary::-webkit-details-marker {
     opacity: 0.2}
 @keyframes radiomark {
     0% {
-        box-shadow: 0 0 0 12px hsl(var(--b1)) inset, 0 0 0 12px hsl(var(--b1)) inset}
+        box-shadow: 0 0 0 12px hsl(var(--b1)) inset,
+      0 0 0 12px hsl(var(--b1)) inset}
     50% {
-        box-shadow: 0 0 0 3px hsl(var(--b1)) inset, 0 0 0 3px hsl(var(--b1)) inset}
+        box-shadow: 0 0 0 3px hsl(var(--b1)) inset,
+      0 0 0 3px hsl(var(--b1)) inset}
     100% {
-        box-shadow: 0 0 0 4px hsl(var(--b1)) inset, 0 0 0 4px hsl(var(--b1)) inset}}
+        box-shadow: 0 0 0 4px hsl(var(--b1)) inset,
+      0 0 0 4px hsl(var(--b1)) inset}}
 .radio-mark {
     display: none}
 .range:focus-visible::-webkit-slider-thumb {
@@ -4629,7 +4621,8 @@ details.collapse summary::-webkit-details-marker {
     transform: translateY(-50%);
     --filler-size: 100rem;
     --filler-offset: 0.6rem;
-    box-shadow: 0 0 0 3px hsl(var(--range-shdw)) inset, var(--focus-shadow, 0 0),
+    box-shadow: 0 0 0 3px hsl(var(--range-shdw)) inset,
+      var(--focus-shadow, 0 0),
       calc(var(--filler-size) * -1 - var(--filler-offset)) 0 0 var(--filler-size)}
 .range::-moz-range-thumb {
     position: relative;
@@ -4643,7 +4636,8 @@ details.collapse summary::-webkit-details-marker {
     color: hsl(var(--range-shdw));
     --filler-size: 100rem;
     --filler-offset: 0.5rem;
-    box-shadow: 0 0 0 3px hsl(var(--range-shdw)) inset, var(--focus-shadow, 0 0),
+    box-shadow: 0 0 0 3px hsl(var(--range-shdw)) inset,
+      var(--focus-shadow, 0 0),
       calc(var(--filler-size) * -1 - var(--filler-offset)) 0 0 var(--filler-size)}
 .range-primary {
     --range-shdw: var(--p)}
@@ -4754,7 +4748,8 @@ details.collapse summary::-webkit-details-marker {
     background-image: none;
     padding-right: 1rem}
 [dir="rtl"] .select {
-    background-position: calc(0% + 12px) calc(1px + 50%), calc(0% + 16px) calc(1px + 50%)}
+    background-position: calc(0% + 12px) calc(1px + 50%),
+    calc(0% + 16px) calc(1px + 50%)}
 :where(.stats) > :not([hidden]) ~ :not([hidden]) {
     --tw-divide-x-reverse: 0;
     border-right-width: calc(1px * var(--tw-divide-x-reverse));
@@ -5094,10 +5089,12 @@ details.collapse summary::-webkit-details-marker {
     --tw-border-opacity: 1;
     --tw-bg-opacity: 1;
     box-shadow: calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset,
-      calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset}
+      calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset,
+      0 0 0 2px var(--tglbg) inset}
 [dir="rtl"] .toggle:indeterminate {
     box-shadow: calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset,
-        calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset}
+        calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset,
+        0 0 0 2px var(--tglbg) inset}
 .toggle-primary:focus-visible {
     outline-color: hsl(var(--p) / 1)}
 .toggle-primary:checked,
@@ -22687,9 +22684,7 @@ details.collapse summary::-webkit-details-marker {
 .ring-offset-warning\/95 {
     --tw-ring-offset-color: hsl(var(--wa) / 0.95)}
 .transition {
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
     transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-duration: 150ms}
 .transition-all {
@@ -22743,8 +22738,7 @@ details.collapse summary::-webkit-details-marker {
 .glass,
   .glass.btn-active {
     border: none;
-    -webkit-backdrop-filter: blur(var(--glass-blur, 40px));
-            backdrop-filter: blur(var(--glass-blur, 40px));
+    backdrop-filter: blur(var(--glass-blur, 40px));
     background-color: transparent;
     background-image: linear-gradient(
         135deg,
@@ -22762,8 +22756,7 @@ details.collapse summary::-webkit-details-marker {
 @media (hover: hover) {
     .glass.btn-active {
         border: none;
-        -webkit-backdrop-filter: blur(var(--glass-blur, 40px));
-                backdrop-filter: blur(var(--glass-blur, 40px));
+        backdrop-filter: blur(var(--glass-blur, 40px));
         background-color: transparent;
         background-image: linear-gradient(
           135deg,
@@ -23519,7 +23512,8 @@ details.collapse summary::-webkit-details-marker {
     --tw-text-opacity: 1;
     color: hsl(var(--bc) / var(--tw-text-opacity));
     border-radius: var(--rounded-box, 1rem);
-    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)}
+    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),
+      0 1px 2px 0 rgba(0, 0, 0, 0.06)}
 .avatar.online:before {
     content: "";
     position: absolute;
@@ -23831,9 +23825,7 @@ details.collapse summary::-webkit-details-marker {
 .tooltip:before,
 .tooltip:after {
     opacity: 0;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
     transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
     transition-delay: 100ms;
     transition-duration: 200ms;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)}

package/dist/styled.css

@@ -374,7 +374,8 @@
 .collapse:not(.collapse-close) input[type="radio"]:checked ~ .collapse-content {
   visibility: visible;
   min-height: fit-content;
-}:root .countdown {
+}
+:root .countdown {
   line-height: 1em;
 }
 .countdown {
@@ -452,7 +453,7 @@
       transform: translateX(-100%);
 }
   [dir="rtl"] .drawer-side > *:not(.drawer-overlay) {
-        transform: translateX(100%);
+        transform: translateX(-100%);
       }
   .drawer-toggle {
   position: fixed;
@@ -475,14 +476,12 @@
   grid-column-start: 1;
 }
   .drawer-end .drawer-toggle ~ .drawer-side {
+  grid-column-start: 2;
   justify-items: end;
 }
   .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) {
-          transform: translateX(100%);
-        }
-  [dir="rtl"] .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) {
-            transform: translateX(-100%);
-          }
+        transform: translateX(100%);
+      }
   .drawer-end .drawer-toggle:checked ~ .drawer-side > *:not(.drawer-overlay) {
         transform: translateX(0%);
       }
@@ -963,8 +962,9 @@
 }
 .radial-progress:before {
   inset: 0px;
-  background: radial-gradient(farthest-side, currentColor 98%, #0000) top/var(--thickness)
-      var(--thickness) no-repeat,
+  background:
+    radial-gradient(farthest-side, currentColor 98%, #0000) top/var(--thickness) var(--thickness)
+      no-repeat,
     conic-gradient(currentColor calc(var(--value) * 1%), #0000 0);
   -webkit-mask: radial-gradient(
     farthest-side,
@@ -2498,7 +2498,9 @@ details.collapse summary {
   padding-left: 1rem;
   padding-right: 1rem;
   cursor: unset;
-  transition: padding 0.2s ease-out, background-color 0.2s ease-out;
+  transition:
+    padding 0.2s ease-out,
+    background-color 0.2s ease-out;
 }
 .collapse[open] :where(.collapse-content),
 .collapse-open :where(.collapse-content),
@@ -2506,7 +2508,9 @@ details.collapse summary {
 .collapse:not(.collapse-close) :where(input[type="checkbox"]:checked ~ .collapse-content),
 .collapse:not(.collapse-close) :where(input[type="radio"]:checked ~ .collapse-content) {
   padding-bottom: 1rem;
-  transition: padding 0.2s ease-out, background-color 0.2s ease-out;
+  transition:
+    padding 0.2s ease-out,
+    background-color 0.2s ease-out;
 }
 .collapse[open].collapse-arrow .collapse-title:after,
 .collapse-open.collapse-arrow .collapse-title:after,
@@ -3273,7 +3277,10 @@ details.collapse summary {
       width: 0.75rem;
       border-radius: 9999px;
       opacity: 0.3;
-      box-shadow: 1.4em 0, 2.8em 0, 4.2em 0;
+      box-shadow:
+        1.4em 0,
+        2.8em 0,
+        4.2em 0;
     }
     .mockup-code pre {
       padding-right: 1.25rem;
@@ -3299,7 +3306,10 @@ details.collapse summary {
       height: 0.75rem;
       border-radius: 9999px;
       opacity: 0.3;
-      box-shadow: 1.4em 0, 2.8em 0, 4.2em 0;
+      box-shadow:
+        1.4em 0,
+        2.8em 0,
+        4.2em 0;
     }
   .mockup-phone {
     display: inline-block;
@@ -3367,7 +3377,10 @@ details.collapse summary {
         height: 0.75rem;
         border-radius: 9999px;
         opacity: 0.3;
-        box-shadow: 1.4em 0, 2.8em 0, 4.2em 0;
+        box-shadow:
+          1.4em 0,
+          2.8em 0,
+          4.2em 0;
       }
   .mockup-browser .mockup-browser-toolbar .input {
       position: relative;
@@ -3646,7 +3659,9 @@ details.collapse summary {
   --tw-bg-opacity: 1;
   background-color: hsl(var(--bc) / var(--tw-bg-opacity));
     animation: radiomark var(--animation-input, 0.2s) ease-out;
-    box-shadow: 0 0 0 4px hsl(var(--b1)) inset, 0 0 0 4px hsl(var(--b1)) inset;
+    box-shadow:
+      0 0 0 4px hsl(var(--b1)) inset,
+      0 0 0 4px hsl(var(--b1)) inset;
 }
   .radio-primary {
     --chkbg: var(--p);
@@ -3816,13 +3831,19 @@ details.collapse summary {
 
 @keyframes radiomark {
   0% {
-    box-shadow: 0 0 0 12px hsl(var(--b1)) inset, 0 0 0 12px hsl(var(--b1)) inset;
+    box-shadow:
+      0 0 0 12px hsl(var(--b1)) inset,
+      0 0 0 12px hsl(var(--b1)) inset;
   }
   50% {
-    box-shadow: 0 0 0 3px hsl(var(--b1)) inset, 0 0 0 3px hsl(var(--b1)) inset;
+    box-shadow:
+      0 0 0 3px hsl(var(--b1)) inset,
+      0 0 0 3px hsl(var(--b1)) inset;
   }
   100% {
-    box-shadow: 0 0 0 4px hsl(var(--b1)) inset, 0 0 0 4px hsl(var(--b1)) inset;
+    box-shadow:
+      0 0 0 4px hsl(var(--b1)) inset,
+      0 0 0 4px hsl(var(--b1)) inset;
   }
 }
 
@@ -3872,7 +3893,9 @@ details.collapse summary {
     transform: translateY(-50%);
     --filler-size: 100rem;
     --filler-offset: 0.6rem;
-    box-shadow: 0 0 0 3px hsl(var(--range-shdw)) inset, var(--focus-shadow, 0 0),
+    box-shadow:
+      0 0 0 3px hsl(var(--range-shdw)) inset,
+      var(--focus-shadow, 0 0),
       calc(var(--filler-size) * -1 - var(--filler-offset)) 0 0 var(--filler-size);
 }
   .range::-moz-range-thumb {
@@ -3887,7 +3910,9 @@ details.collapse summary {
     color: hsl(var(--range-shdw));
     --filler-size: 100rem;
     --filler-offset: 0.5rem;
-    box-shadow: 0 0 0 3px hsl(var(--range-shdw)) inset, var(--focus-shadow, 0 0),
+    box-shadow:
+      0 0 0 3px hsl(var(--range-shdw)) inset,
+      var(--focus-shadow, 0 0),
       calc(var(--filler-size) * -1 - var(--filler-offset)) 0 0 var(--filler-size);
 }
   .range-primary {
@@ -3970,8 +3995,12 @@ details.collapse summary {
   .select {
   background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
     linear-gradient(135deg, currentColor 50%, transparent 50%);
-  background-position: calc(100% - 20px) calc(1px + 50%), calc(100% - 16px) calc(1px + 50%);
-  background-size: 4px 4px, 4px 4px;
+  background-position:
+    calc(100% - 20px) calc(1px + 50%),
+    calc(100% - 16px) calc(1px + 50%);
+  background-size:
+    4px 4px,
+    4px 4px;
   background-repeat: no-repeat;
 }
   .select:focus {
@@ -4061,7 +4090,9 @@ details.collapse summary {
 }
 
 [dir="rtl"] .select {
-  background-position: calc(0% + 12px) calc(1px + 50%), calc(0% + 16px) calc(1px + 50%);
+  background-position:
+    calc(0% + 12px) calc(1px + 50%),
+    calc(0% + 16px) calc(1px + 50%);
 }
 .stack {
     place-items: center;
@@ -4628,8 +4659,12 @@ details.collapse summary {
   background-color: hsl(var(--bc) / var(--tw-bg-opacity));
   --tw-bg-opacity: 0.5;
   border-radius: var(--rounded-badge, 1.9rem);
-  transition: background, box-shadow var(--animation-input, 0.2s) ease-out;
-  box-shadow: var(--handleoffsetcalculator) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset,
+  transition:
+    background,
+    box-shadow var(--animation-input, 0.2s) ease-out;
+  box-shadow:
+    var(--handleoffsetcalculator) 0 0 2px var(--tglbg) inset,
+    0 0 0 2px var(--tglbg) inset,
     var(--togglehandleborder);
 }
   [dir="rtl"] .toggle {
@@ -4654,12 +4689,16 @@ details.collapse summary {
   .toggle:indeterminate {
   --tw-border-opacity: 1;
   --tw-bg-opacity: 1;
-    box-shadow: calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset,
-      calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset;
+    box-shadow:
+      calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset,
+      calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset,
+      0 0 0 2px var(--tglbg) inset;
 }
   [dir="rtl"] .toggle:indeterminate {
-      box-shadow: calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset,
-        calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset;
+      box-shadow:
+        calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset,
+        calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset,
+        0 0 0 2px var(--tglbg) inset;
     }
   .toggle-primary:focus-visible {
   outline-color: hsl(var(--p) / 1);