daisyui 3.0.4 → 3.0.5

package/README.md

@@ -54,7 +54,7 @@ Loading CSS files from CDN is not recommended for production. It's better to ins
 
 ```html
 <link
-  href="https://cdn.jsdelivr.net/npm/daisyui@3.0.3/dist/full.css"
+  href="https://cdn.jsdelivr.net/npm/daisyui@3.0.4/dist/full.css"
   rel="stylesheet"
   type="text/css" />
 <script src="https://cdn.tailwindcss.com"></script>

package/dist/full.css

@@ -1716,7 +1716,8 @@ html {
     --tw-bg-opacity: 1;
     background-color: hsl(var(--b2) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--bc) / var(--tw-text-opacity))}
+    color: hsl(var(--bc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--bc) / 1)}
 .btn-disabled,
   .btn[disabled],
   .btn:disabled {
@@ -1943,9 +1944,10 @@ html {
     cursor: unset}
 .collapse[open],
 .collapse-open,
-.collapse:focus:not(.collapse-close),
-.collapse:not(.collapse-close):has(input[type="checkbox"]:checked),
-.collapse:not(.collapse-close):has(input[type="radio"]:checked) {
+.collapse:focus:not(.collapse-close) {
+    grid-template-rows: auto 1fr}
+.collapse:not(.collapse-close):has(> input[type="checkbox"]:checked),
+.collapse:not(.collapse-close):has(> input[type="radio"]:checked) {
     grid-template-rows: auto 1fr}
 .collapse[open] .collapse-content,
 .collapse-open .collapse-content,
@@ -2239,9 +2241,11 @@ html {
         --tw-scale-x: 1;
         --tw-scale-y: 1;
         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))}
-    .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):hover, .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):hover {
+    .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):not(.active):hover, .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):not(.active):hover {
         cursor: pointer;
         background-color: hsl(var(--bc) / 0.1);
+        --tw-text-opacity: 1;
+        color: hsl(var(--bc) / var(--tw-text-opacity));
         outline: 2px solid transparent;
         outline-offset: 2px}
     .tab[disabled],
@@ -3150,129 +3154,119 @@ html {
 .btn:focus-visible {
     outline-style: solid;
     outline-width: 2px;
-    outline-offset: 2px;
-    outline-color: hsl(var(--bc) / 1)}
+    outline-offset: 2px}
 .btn-primary {
     --tw-border-opacity: 1;
     border-color: hsl(var(--p) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--p) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--pc) / var(--tw-text-opacity))}
+    color: hsl(var(--pc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--p) / 1)}
 .btn-primary.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--pf) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--pf) / var(--tw-bg-opacity))}
-.btn-primary:focus-visible {
-    outline-color: hsl(var(--p) / 1)}
 .btn-secondary {
     --tw-border-opacity: 1;
     border-color: hsl(var(--s) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--s) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--sc) / var(--tw-text-opacity))}
+    color: hsl(var(--sc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--s) / 1)}
 .btn-secondary.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--sf) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--sf) / var(--tw-bg-opacity))}
-.btn-secondary:focus-visible {
-    outline-color: hsl(var(--s) / 1)}
 .btn-accent {
     --tw-border-opacity: 1;
     border-color: hsl(var(--a) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--a) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--ac) / var(--tw-text-opacity))}
+    color: hsl(var(--ac) / var(--tw-text-opacity));
+    outline-color: hsl(var(--a) / 1)}
 .btn-accent.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--af) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--af) / var(--tw-bg-opacity))}
-.btn-accent:focus-visible {
-    outline-color: hsl(var(--a) / 1)}
 .btn-neutral {
     --tw-border-opacity: 1;
     border-color: hsl(var(--n) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--n) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--nc) / var(--tw-text-opacity))}
+    color: hsl(var(--nc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--n) / 1)}
 .btn-neutral.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--nf) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--nf) / var(--tw-bg-opacity))}
-.btn-neutral:focus-visible {
-    outline-color: hsl(var(--n) / 1)}
 .btn-info {
     --tw-border-opacity: 1;
     border-color: hsl(var(--in) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--in) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--inc) / var(--tw-text-opacity))}
+    color: hsl(var(--inc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--in) / 1)}
 .btn-info.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--in) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--in) / var(--tw-bg-opacity))}
-.btn-info:focus-visible {
-    outline-color: hsl(var(--in) / 1)}
 .btn-success {
     --tw-border-opacity: 1;
     border-color: hsl(var(--su) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--su) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--suc) / var(--tw-text-opacity))}
+    color: hsl(var(--suc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--su) / 1)}
 .btn-success.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--su) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--su) / var(--tw-bg-opacity))}
-.btn-success:focus-visible {
-    outline-color: hsl(var(--su) / 1)}
 .btn-warning {
     --tw-border-opacity: 1;
     border-color: hsl(var(--wa) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--wa) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--wac) / var(--tw-text-opacity))}
+    color: hsl(var(--wac) / var(--tw-text-opacity));
+    outline-color: hsl(var(--wa) / 1)}
 .btn-warning.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--wa) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--wa) / var(--tw-bg-opacity))}
-.btn-warning:focus-visible {
-    outline-color: hsl(var(--wa) / 1)}
 .btn-error {
     --tw-border-opacity: 1;
     border-color: hsl(var(--er) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--er) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--erc) / var(--tw-text-opacity))}
+    color: hsl(var(--erc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--er) / 1)}
 .btn-error.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--er) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--er) / var(--tw-bg-opacity))}
-.btn-error:focus-visible {
-    outline-color: hsl(var(--er) / 1)}
 .btn.glass {
     --tw-shadow: 0 0 #0000;
     --tw-shadow-colored: 0 0 #0000;
-    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}
+    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+    outline-color: currentColor}
 .btn.glass.btn-active {
     --glass-opacity: 25%;
     --glass-border-opacity: 15%}
-.btn.glass:focus-visible {
-    outline-color: currentColor}
 .btn-ghost {
     border-width: 1px;
     border-color: transparent;
@@ -3280,13 +3274,12 @@ html {
     color: currentColor;
     --tw-shadow: 0 0 #0000;
     --tw-shadow-colored: 0 0 #0000;
-    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}
+    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+    outline-color: currentColor}
 .btn-ghost.btn-active {
     --tw-border-opacity: 0;
     background-color: hsl(var(--bc) / var(--tw-bg-opacity));
     --tw-bg-opacity: 0.2}
-.btn-ghost:focus-visible {
-    outline-color: currentColor}
 .btn-link {
     border-color: transparent;
     background-color: transparent;
@@ -3295,13 +3288,12 @@ html {
     text-decoration-line: underline;
     --tw-shadow: 0 0 #0000;
     --tw-shadow-colored: 0 0 #0000;
-    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}
+    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+    outline-color: currentColor}
 .btn-link.btn-active {
     border-color: transparent;
     background-color: transparent;
     text-decoration-line: underline}
-.btn-link:focus-visible {
-    outline-color: currentColor}
 .btn-outline {
     border-color: currentColor;
     background-color: transparent;
@@ -3683,8 +3675,8 @@ details.collapse summary::-webkit-details-marker {
     outline-offset: 2px;
     outline-color: hsl(var(--bc) / 1)}
 .collapse:has(.collapse-title:focus-visible),
-.collapse:has(input[type="checkbox"]:focus-visible),
-.collapse:has(input[type="radio"]:focus-visible) {
+.collapse:has(> input[type="checkbox"]:focus-visible),
+.collapse:has(> input[type="radio"]:focus-visible) {
     outline-style: solid;
     outline-width: 2px;
     outline-offset: 2px;
@@ -3781,6 +3773,10 @@ details.collapse summary::-webkit-details-marker {
     cursor: pointer;
     background-color: transparent;
     transition: background-color 0.2s cubic-bezier(0, 0, 0.58, 1)}
+.drawer-toggle:focus-visible ~ .drawer-content label.drawer-button {
+    outline-style: solid;
+    outline-width: 2px;
+    outline-offset: 2px}
 .dropdown.dropdown-open .dropdown-content,
 .dropdown:focus .dropdown-content,
 .dropdown:focus-within .dropdown-content {
@@ -4133,12 +4129,14 @@ details.collapse summary::-webkit-details-marker {
     width: 1px;
     background-color: hsl(var(--bc) / 0.1);
     content: ""}
-.menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)).focus,
-    .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):focus,
-    .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)).focus,
-    .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):focus {
+.menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):not(.active).focus,
+    .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):not(.active):focus,
+    .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):not(.active).focus,
+    .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):not(.active):focus {
     cursor: pointer;
     background-color: hsl(var(--bc) / 0.1);
+    --tw-text-opacity: 1;
+    color: hsl(var(--bc) / var(--tw-text-opacity));
     outline: 2px solid transparent;
     outline-offset: 2px}
 .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):active,
@@ -5006,7 +5004,7 @@ details.collapse summary::-webkit-details-marker {
     --tw-text-opacity: 1;
     color: hsl(var(--ac) / var(--tw-text-opacity))}
 .toggle-success:focus-visible {
-    outline-color: hsl(var(--in) / 1)}
+    outline-color: hsl(var(--su) / 1)}
 .toggle-success:checked,
     .toggle-success[checked="true"],
     .toggle-success[aria-checked="true"] {
@@ -5017,7 +5015,7 @@ details.collapse summary::-webkit-details-marker {
     --tw-text-opacity: 1;
     color: hsl(var(--suc) / var(--tw-text-opacity))}
 .toggle-warning:focus-visible {
-    outline-color: hsl(var(--su) / 1)}
+    outline-color: hsl(var(--wa) / 1)}
 .toggle-warning:checked,
     .toggle-warning[checked="true"],
     .toggle-warning[aria-checked="true"] {
@@ -5028,7 +5026,7 @@ details.collapse summary::-webkit-details-marker {
     --tw-text-opacity: 1;
     color: hsl(var(--wac) / var(--tw-text-opacity))}
 .toggle-info:focus-visible {
-    outline-color: hsl(var(--wa) / 1)}
+    outline-color: hsl(var(--in) / 1)}
 .toggle-info:checked,
     .toggle-info[checked="true"],
     .toggle-info[aria-checked="true"] {
@@ -22087,6 +22085,8 @@ details.collapse summary::-webkit-details-marker {
 .divider-vertical:after {
     height: 0.125rem;
     width: 100%}
+.drawer-open > .drawer-toggle {
+    display: none}
 .drawer-open > .drawer-toggle ~ .drawer-side {
     pointer-events: auto;
     visibility: visible;
@@ -22920,12 +22920,14 @@ details.collapse summary::-webkit-details-marker {
     width: max-content}
 .tooltip.tooltip-open:before,
 .tooltip.tooltip-open:after,
-.tooltip:has(:focus-visible):after,
-.tooltip:has(:focus-visible):before,
 .tooltip:hover:before,
 .tooltip:hover:after {
     opacity: 1;
     transition-delay: 75ms}
+.tooltip:has(:focus-visible):after,
+.tooltip:has(:focus-visible):before {
+    opacity: 1;
+    transition-delay: 75ms}
 .tooltip:not([data-tip]):hover:before,
 .tooltip:not([data-tip]):hover:after {
     visibility: hidden;
@@ -23110,56 +23112,52 @@ details.collapse summary::-webkit-details-marker {
     --tw-bg-opacity: 1;
     background-color: hsl(var(--in) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--inc) / var(--tw-text-opacity))}
+    color: hsl(var(--inc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--in) / 1)}
 .hover\:btn-info:hover.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--in) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--in) / var(--tw-bg-opacity))}
-.hover\:btn-info:hover:focus-visible {
-    outline-color: hsl(var(--in) / 1)}
 .hover\:btn-success:hover {
     --tw-border-opacity: 1;
     border-color: hsl(var(--su) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--su) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--suc) / var(--tw-text-opacity))}
+    color: hsl(var(--suc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--su) / 1)}
 .hover\:btn-success:hover.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--su) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--su) / var(--tw-bg-opacity))}
-.hover\:btn-success:hover:focus-visible {
-    outline-color: hsl(var(--su) / 1)}
 .hover\:btn-warning:hover {
     --tw-border-opacity: 1;
     border-color: hsl(var(--wa) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--wa) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--wac) / var(--tw-text-opacity))}
+    color: hsl(var(--wac) / var(--tw-text-opacity));
+    outline-color: hsl(var(--wa) / 1)}
 .hover\:btn-warning:hover.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--wa) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--wa) / var(--tw-bg-opacity))}
-.hover\:btn-warning:hover:focus-visible {
-    outline-color: hsl(var(--wa) / 1)}
 .hover\:btn-error:hover {
     --tw-border-opacity: 1;
     border-color: hsl(var(--er) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--er) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--erc) / var(--tw-text-opacity))}
+    color: hsl(var(--erc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--er) / 1)}
 .hover\:btn-error:hover.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--er) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--er) / var(--tw-bg-opacity))}
-.hover\:btn-error:hover:focus-visible {
-    outline-color: hsl(var(--er) / 1)}
 .hover\:btn-success:hover.btn-outline {
     --tw-text-opacity: 1;
     color: hsl(var(--su) / var(--tw-text-opacity))}
@@ -23525,7 +23523,7 @@ details.collapse summary::-webkit-details-marker {
 .hover\:textarea-error:hover:focus {
     outline-color: hsl(var(--er) / 1)}
 .hover\:toggle-success:hover:focus-visible {
-    outline-color: hsl(var(--in) / 1)}
+    outline-color: hsl(var(--su) / 1)}
 .hover\:toggle-success:hover:checked,.hover\:toggle-success:hover[checked="true"],.hover\:toggle-success:hover[aria-checked="true"] {
     border-color: hsl(var(--su) / var(--tw-border-opacity));
     --tw-border-opacity: 0.1;
@@ -23534,7 +23532,7 @@ details.collapse summary::-webkit-details-marker {
     --tw-text-opacity: 1;
     color: hsl(var(--suc) / var(--tw-text-opacity))}
 .hover\:toggle-warning:hover:focus-visible {
-    outline-color: hsl(var(--su) / 1)}
+    outline-color: hsl(var(--wa) / 1)}
 .hover\:toggle-warning:hover:checked,.hover\:toggle-warning:hover[checked="true"],.hover\:toggle-warning:hover[aria-checked="true"] {
     border-color: hsl(var(--wa) / var(--tw-border-opacity));
     --tw-border-opacity: 0.1;
@@ -23543,7 +23541,7 @@ details.collapse summary::-webkit-details-marker {
     --tw-text-opacity: 1;
     color: hsl(var(--wac) / var(--tw-text-opacity))}
 .hover\:toggle-info:hover:focus-visible {
-    outline-color: hsl(var(--wa) / 1)}
+    outline-color: hsl(var(--in) / 1)}
 .hover\:toggle-info:hover:checked,.hover\:toggle-info:hover[checked="true"],.hover\:toggle-info:hover[aria-checked="true"] {
     border-color: hsl(var(--in) / var(--tw-border-opacity));
     --tw-border-opacity: 0.1;
@@ -23724,56 +23722,52 @@ details.collapse summary::-webkit-details-marker {
     --tw-bg-opacity: 1;
     background-color: hsl(var(--in) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--inc) / var(--tw-text-opacity))}
+    color: hsl(var(--inc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--in) / 1)}
 .focus\:btn-info:focus.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--in) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--in) / var(--tw-bg-opacity))}
-.focus\:btn-info:focus:focus-visible {
-    outline-color: hsl(var(--in) / 1)}
 .focus\:btn-success:focus {
     --tw-border-opacity: 1;
     border-color: hsl(var(--su) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--su) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--suc) / var(--tw-text-opacity))}
+    color: hsl(var(--suc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--su) / 1)}
 .focus\:btn-success:focus.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--su) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--su) / var(--tw-bg-opacity))}
-.focus\:btn-success:focus:focus-visible {
-    outline-color: hsl(var(--su) / 1)}
 .focus\:btn-warning:focus {
     --tw-border-opacity: 1;
     border-color: hsl(var(--wa) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--wa) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--wac) / var(--tw-text-opacity))}
+    color: hsl(var(--wac) / var(--tw-text-opacity));
+    outline-color: hsl(var(--wa) / 1)}
 .focus\:btn-warning:focus.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--wa) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--wa) / var(--tw-bg-opacity))}
-.focus\:btn-warning:focus:focus-visible {
-    outline-color: hsl(var(--wa) / 1)}
 .focus\:btn-error:focus {
     --tw-border-opacity: 1;
     border-color: hsl(var(--er) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--er) / var(--tw-bg-opacity));
     --tw-text-opacity: 1;
-    color: hsl(var(--erc) / var(--tw-text-opacity))}
+    color: hsl(var(--erc) / var(--tw-text-opacity));
+    outline-color: hsl(var(--er) / 1)}
 .focus\:btn-error:focus.btn-active {
     --tw-border-opacity: 1;
     border-color: hsl(var(--er) / var(--tw-border-opacity));
     --tw-bg-opacity: 1;
     background-color: hsl(var(--er) / var(--tw-bg-opacity))}
-.focus\:btn-error:focus:focus-visible {
-    outline-color: hsl(var(--er) / 1)}
 .focus\:btn-success:focus.btn-outline {
     --tw-text-opacity: 1;
     color: hsl(var(--su) / var(--tw-text-opacity))}
@@ -24139,7 +24133,7 @@ details.collapse summary::-webkit-details-marker {
 .focus\:textarea-error:focus:focus {
     outline-color: hsl(var(--er) / 1)}
 .focus\:toggle-success:focus:focus-visible {
-    outline-color: hsl(var(--in) / 1)}
+    outline-color: hsl(var(--su) / 1)}
 .focus\:toggle-success:focus:checked,.focus\:toggle-success:focus[checked="true"],.focus\:toggle-success:focus[aria-checked="true"] {
     border-color: hsl(var(--su) / var(--tw-border-opacity));
     --tw-border-opacity: 0.1;
@@ -24148,7 +24142,7 @@ details.collapse summary::-webkit-details-marker {
     --tw-text-opacity: 1;
     color: hsl(var(--suc) / var(--tw-text-opacity))}
 .focus\:toggle-warning:focus:focus-visible {
-    outline-color: hsl(var(--su) / 1)}
+    outline-color: hsl(var(--wa) / 1)}
 .focus\:toggle-warning:focus:checked,.focus\:toggle-warning:focus[checked="true"],.focus\:toggle-warning:focus[aria-checked="true"] {
     border-color: hsl(var(--wa) / var(--tw-border-opacity));
     --tw-border-opacity: 0.1;
@@ -24157,7 +24151,7 @@ details.collapse summary::-webkit-details-marker {
     --tw-text-opacity: 1;
     color: hsl(var(--wac) / var(--tw-text-opacity))}
 .focus\:toggle-info:focus:focus-visible {
-    outline-color: hsl(var(--wa) / 1)}
+    outline-color: hsl(var(--in) / 1)}
 .focus\:toggle-info:focus:checked,.focus\:toggle-info:focus[checked="true"],.focus\:toggle-info:focus[aria-checked="true"] {
     border-color: hsl(var(--in) / var(--tw-border-opacity));
     --tw-border-opacity: 0.1;