ics-ui-kit 0.1.13 → 0.1.15

package/dist/styles-scoped.css

@@ -62,6 +62,7 @@
 	--tertiary-accent: 215 16% 47%;
 	--muted: 215 16% 47%;
 	--sidebar-bg: 210 40% 98%;
+	--focus: var(--muted);
 
 	/** Inverse **/
 	--inverse-primary-bg: 222 47% 11%;
@@ -229,6 +230,7 @@
 	--tertiary-accent: 215 20% 65%;
 	--muted: 215 20% 65%;
 	--sidebar-bg: 229 84% 5%;
+	--focus: var(--muted);
 
 	/** Inverse **/
 	--inverse-primary-bg: 210 40% 98%;
@@ -1335,6 +1337,9 @@
 .ui-kit .invisible {
 	visibility: hidden;
 }
+.ui-kit .collapse {
+	visibility: collapse;
+}
 .ui-kit .static {
 	position: static;
 }
@@ -1373,6 +1378,9 @@
 .ui-kit .-bottom-9 {
 	bottom: -2.25rem;
 }
+.ui-kit .-bottom-\[5px\] {
+	bottom: -5px;
+}
 .ui-kit .-left-11 {
 	left: -2.75rem;
 }
@@ -1394,6 +1402,9 @@
 .ui-kit .-right-9 {
 	right: -2.25rem;
 }
+.ui-kit .-right-\[5px\] {
+	right: -5px;
+}
 .ui-kit .-top-11 {
 	top: -2.75rem;
 }
@@ -1526,6 +1537,9 @@
 .ui-kit .z-20 {
 	z-index: 20;
 }
+.ui-kit .z-30 {
+	z-index: 30;
+}
 .ui-kit .z-50 {
 	z-index: 50;
 }
@@ -1541,9 +1555,6 @@
 .ui-kit .col-start-2 {
 	grid-column-start: 2;
 }
-.ui-kit .col-start-3 {
-	grid-column-start: 3;
-}
 .ui-kit .m-0 {
 	margin: 0px;
 }
@@ -1773,6 +1784,10 @@
 	width: 0.5rem;
 	height: 0.5rem;
 }
+.ui-kit .size-2\.5 {
+	width: 0.625rem;
+	height: 0.625rem;
+}
 .ui-kit .size-3 {
 	width: 0.75rem;
 	height: 0.75rem;
@@ -1793,6 +1808,10 @@
 	width: 1.5rem;
 	height: 1.5rem;
 }
+.ui-kit .size-8 {
+	width: 2rem;
+	height: 2rem;
+}
 .ui-kit .h-1 {
 	height: 0.25rem;
 }
@@ -1859,6 +1878,9 @@
 .ui-kit .h-8 {
 	height: 2rem;
 }
+.ui-kit .h-80 {
+	height: 20rem;
+}
 .ui-kit .h-9 {
 	height: 2.25rem;
 }
@@ -1988,12 +2010,15 @@
 .ui-kit .max-h-32 {
 	max-height: 8rem;
 }
-.ui-kit .max-h-64 {
-	max-height: 16rem;
+.ui-kit .max-h-52 {
+	max-height: 13rem;
 }
 .ui-kit .max-h-8 {
 	max-height: 2rem;
 }
+.ui-kit .max-h-80 {
+	max-height: 20rem;
+}
 .ui-kit .max-h-96 {
 	max-height: 24rem;
 }
@@ -2159,24 +2184,33 @@
 .ui-kit .w-\[1000px\] {
 	width: 1000px;
 }
-.ui-kit .w-\[100px\] {
-	width: 100px;
-}
 .ui-kit .w-\[11\.25rem\] {
 	width: 11.25rem;
 }
 .ui-kit .w-\[11\.5rem\] {
 	width: 11.5rem;
 }
+.ui-kit .w-\[140px\] {
+	width: 140px;
+}
+.ui-kit .w-\[153px\] {
+	width: 153px;
+}
 .ui-kit .w-\[164px\] {
 	width: 164px;
 }
 .ui-kit .w-\[168px\] {
 	width: 168px;
 }
+.ui-kit .w-\[178px\] {
+	width: 178px;
+}
 .ui-kit .w-\[183px\] {
 	width: 183px;
 }
+.ui-kit .w-\[191px\] {
+	width: 191px;
+}
 .ui-kit .w-\[2\.0625rem\] {
 	width: 2.0625rem;
 }
@@ -2198,6 +2232,9 @@
 .ui-kit .w-\[268px\] {
 	width: 268px;
 }
+.ui-kit .w-\[280px\] {
+	width: 280px;
+}
 .ui-kit .w-\[3\.75rem\] {
 	width: 3.75rem;
 }
@@ -2207,9 +2244,15 @@
 .ui-kit .w-\[300px\] {
 	width: 300px;
 }
+.ui-kit .w-\[320px\] {
+	width: 320px;
+}
 .ui-kit .w-\[334px\] {
 	width: 334px;
 }
+.ui-kit .w-\[360px\] {
+	width: 360px;
+}
 .ui-kit .w-\[3px\] {
 	width: 3px;
 }
@@ -2243,9 +2286,6 @@
 .ui-kit .w-\[7\.5rem\] {
 	width: 7.5rem;
 }
-.ui-kit .w-\[70px\] {
-	width: 70px;
-}
 .ui-kit .w-\[87px\] {
 	width: 87px;
 }
@@ -2261,6 +2301,9 @@
 .ui-kit .w-full {
 	width: 100%;
 }
+.ui-kit .w-max {
+	width: max-content;
+}
 .ui-kit .w-px {
 	width: 1px;
 }
@@ -2342,9 +2385,6 @@
 .ui-kit .max-w-3xl {
 	max-width: 48rem;
 }
-.ui-kit .max-w-4xl {
-	max-width: 56rem;
-}
 .ui-kit .max-w-\[--skeleton-width\] {
 	max-width: var(--skeleton-width);
 }
@@ -2414,12 +2454,23 @@
 .ui-kit .grow-0 {
 	flex-grow: 0;
 }
+.ui-kit .table-fixed {
+	table-layout: fixed;
+}
 .ui-kit .caption-bottom {
 	caption-side: bottom;
 }
 .ui-kit .border-collapse {
 	border-collapse: collapse;
 }
+.ui-kit .border-separate {
+	border-collapse: separate;
+}
+.ui-kit .border-spacing-0 {
+	--tw-border-spacing-x: 0px;
+	--tw-border-spacing-y: 0px;
+	border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
+}
 .ui-kit .origin-\[--radix-context-menu-content-transform-origin\] {
 	transform-origin: var(--radix-context-menu-content-transform-origin);
 }
@@ -2443,10 +2494,18 @@
 	--tw-translate-y: -50%;
 	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));
 }
+.ui-kit .translate-x-0 {
+	--tw-translate-x: 0px;
+	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));
+}
 .ui-kit .translate-x-0\.5 {
 	--tw-translate-x: 0.125rem;
 	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));
 }
+.ui-kit .translate-x-1\/2 {
+	--tw-translate-x: 50%;
+	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));
+}
 .ui-kit .translate-x-11 {
 	--tw-translate-x: 2.75rem;
 	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));
@@ -2521,12 +2580,24 @@
 .ui-kit .animate-spin {
 	animation: spin 1s linear infinite;
 }
+.ui-kit .cursor-cell {
+	cursor: cell;
+}
+.ui-kit .cursor-col-resize {
+	cursor: col-resize;
+}
+.ui-kit .cursor-crosshair {
+	cursor: crosshair;
+}
 .ui-kit .cursor-default {
 	cursor: default;
 }
 .ui-kit .cursor-ew-resize {
 	cursor: ew-resize;
 }
+.ui-kit .cursor-grab {
+	cursor: grab;
+}
 .ui-kit .cursor-ns-resize {
 	cursor: ns-resize;
 }
@@ -2539,6 +2610,9 @@
 .ui-kit .select-none {
 	user-select: none;
 }
+.ui-kit .select-text {
+	user-select: text;
+}
 .ui-kit .resize-none {
 	resize: none;
 }
@@ -2563,14 +2637,8 @@
 .ui-kit .grid-cols-5 {
 	grid-template-columns: repeat(5, minmax(0, 1fr));
 }
-.ui-kit .grid-cols-\[50px_repeat\(3\2c 1fr\)_80px\] {
-	grid-template-columns: 50px repeat(3,1fr) 80px;
-}
-.ui-kit .grid-cols-\[50px_repeat\(6\2c 1fr\)\] {
-	grid-template-columns: 50px repeat(6,1fr);
-}
-.ui-kit .grid-cols-\[auto_1fr_auto\] {
-	grid-template-columns: auto 1fr auto;
+.ui-kit .grid-cols-\[auto_1fr\] {
+	grid-template-columns: auto 1fr;
 }
 .ui-kit .flex-row {
 	flex-direction: row;
@@ -2683,11 +2751,6 @@
 	margin-right: calc(-5px * var(--tw-space-x-reverse));
 	margin-left: calc(-5px * calc(1 - var(--tw-space-x-reverse)));
 }
-.ui-kit :is(.space-x-2 > :not([hidden]) ~ :not([hidden])) {
-	--tw-space-x-reverse: 0;
-	margin-right: calc(0.5rem * var(--tw-space-x-reverse));
-	margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
-}
 .ui-kit :is(.space-x-3 > :not([hidden]) ~ :not([hidden])) {
 	--tw-space-x-reverse: 0;
 	margin-right: calc(0.75rem * var(--tw-space-x-reverse));
@@ -2749,15 +2812,15 @@
 .ui-kit .self-start {
 	align-self: flex-start;
 }
-.ui-kit .self-end {
-	align-self: flex-end;
-}
 .ui-kit .self-center {
 	align-self: center;
 }
 .ui-kit .self-stretch {
 	align-self: stretch;
 }
+.ui-kit .justify-self-end {
+	justify-self: end;
+}
 .ui-kit .overflow-auto {
 	overflow: auto;
 }
@@ -2784,12 +2847,18 @@
 .ui-kit .overflow-ellipsis {
 	text-overflow: ellipsis;
 }
+.ui-kit .whitespace-normal {
+	white-space: normal;
+}
 .ui-kit .whitespace-nowrap {
 	white-space: nowrap;
 }
 .ui-kit .whitespace-pre-line {
 	white-space: pre-line;
 }
+.ui-kit .whitespace-pre-wrap {
+	white-space: pre-wrap;
+}
 .ui-kit .text-wrap {
 	text-wrap: wrap;
 }
@@ -2861,10 +2930,6 @@
 	border-top-left-radius: 1rem;
 	border-top-right-radius: 1rem;
 }
-.ui-kit .rounded-t-lg {
-	border-top-left-radius: var(--radius);
-	border-top-right-radius: var(--radius);
-}
 .ui-kit .rounded-t-none {
 	border-top-left-radius: 0px;
 	border-top-right-radius: 0px;
@@ -3028,6 +3093,12 @@
 .ui-kit .border-t-transparent {
 	border-top-color: transparent;
 }
+.ui-kit .bg-\[color\:var\(--table-row-bg\)\] {
+	background-color: var(--table-row-bg);
+}
+.ui-kit .bg-\[hsl\(var\(--status-info\)_\/_10\%\)\] {
+	background-color: hsl(var(--status-info) / 10%);
+}
 .ui-kit .bg-alpha-20 {
 	background-color: hsl(var(--alpha-80));
 }
@@ -3126,9 +3197,6 @@
 .ui-kit .bg-primary\/10 {
 	background-color: hsl(var(--primary) / 0.1);
 }
-.ui-kit .bg-primary\/\[0\.03\] {
-	background-color: hsl(var(--primary) / 0.03);
-}
 .ui-kit .bg-purple-100 {
 	--tw-bg-opacity: 1;
 	background-color: rgb(243 232 255 / var(--tw-bg-opacity, 1));
@@ -3241,6 +3309,9 @@
 	--tw-bg-opacity: 1;
 	background-color: rgb(234 179 8 / var(--tw-bg-opacity, 1));
 }
+.ui-kit .bg-\[image\:var\(--table-row-tints\2c none\)\] {
+	background-image: var(--table-row-tints,none);
+}
 .ui-kit .bg-gradient-to-b {
 	background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
 }
@@ -3447,10 +3518,6 @@
 	padding-top: 0.375rem;
 	padding-bottom: 0.375rem;
 }
-.ui-kit .py-10 {
-	padding-top: 2.5rem;
-	padding-bottom: 2.5rem;
-}
 .ui-kit .py-2 {
 	padding-top: 0.5rem;
 	padding-bottom: 0.5rem;
@@ -3507,6 +3574,9 @@
 .ui-kit .pb-4 {
 	padding-bottom: 1rem;
 }
+.ui-kit .pb-px {
+	padding-bottom: 1px;
+}
 .ui-kit .pe-3 {
 	padding-inline-end: 0.75rem;
 }
@@ -3588,6 +3658,9 @@
 .ui-kit .pt-\[0\.625rem\] {
 	padding-top: 0.625rem;
 }
+.ui-kit .pt-px {
+	padding-top: 1px;
+}
 .ui-kit .text-left {
 	text-align: left;
 }
@@ -3600,6 +3673,9 @@
 .ui-kit .text-start {
 	text-align: start;
 }
+.ui-kit .align-top {
+	vertical-align: top;
+}
 .ui-kit .align-middle {
 	vertical-align: middle;
 }
@@ -3647,6 +3723,9 @@
 .ui-kit .text-\[0\.8rem\] {
 	font-size: 0.8rem;
 }
+.ui-kit .text-\[10px\] {
+	font-size: 10px;
+}
 .ui-kit .text-\[8px\] {
 	font-size: 8px;
 }
@@ -3934,7 +4013,7 @@
 	opacity: 0.8;
 }
 .ui-kit .\!shadow-focus {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent)) !important;
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus)) !important;
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color) !important;
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
 }
@@ -3949,7 +4028,7 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .shadow-focus {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4092,6 +4171,9 @@
 	--tw-grayscale: grayscale(100%);
 	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
+.ui-kit .\!filter {
+	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;
+}
 .ui-kit .filter {
 	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
@@ -4223,6 +4305,15 @@
 .ui-kit .ease-out {
 	animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
 }
+.ui-kit .\@container {
+	container-type: inline-size;
+}
+.ui-kit .\[--table-row-bg-hover\:hsl\(var\(--alpha-high-03\)\)\] {
+	--table-row-bg-hover: hsl(var(--alpha-high-03));
+}
+.ui-kit .\[--table-row-bg\:transparent\] {
+	--table-row-bg: transparent;
+}
 .ui-kit .\[fill\:url\(\#cloud-left\)\] {
 	fill: url(#cloud-left);
 }
@@ -4268,6 +4359,37 @@
 .ui-kit .placeholder\:opacity-50::placeholder {
 	opacity: 0.5;
 }
+.ui-kit .before\:absolute::before {
+	content: var(--tw-content);
+	position: absolute;
+}
+.ui-kit .before\:left-1\/2::before {
+	content: var(--tw-content);
+	left: 50%;
+}
+.ui-kit .before\:top-1\/2::before {
+	content: var(--tw-content);
+	top: 50%;
+}
+.ui-kit .before\:size-6::before {
+	content: var(--tw-content);
+	width: 1.5rem;
+	height: 1.5rem;
+}
+.ui-kit .before\:-translate-x-1\/2::before {
+	content: var(--tw-content);
+	--tw-translate-x: -50%;
+	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));
+}
+.ui-kit .before\:-translate-y-1\/2::before {
+	content: var(--tw-content);
+	--tw-translate-y: -50%;
+	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));
+}
+.ui-kit .after\:pointer-events-none::after {
+	content: var(--tw-content);
+	pointer-events: none;
+}
 .ui-kit .after\:absolute::after {
 	content: var(--tw-content);
 	position: absolute;
@@ -4276,6 +4398,10 @@
 	content: var(--tw-content);
 	inset: -0.5rem;
 }
+.ui-kit .after\:inset-0::after {
+	content: var(--tw-content);
+	inset: 0px;
+}
 .ui-kit .after\:inset-y-0::after {
 	content: var(--tw-content);
 	top: 0px;
@@ -4289,14 +4415,26 @@
 	content: var(--tw-content);
 	left: 50%;
 }
+.ui-kit .after\:top-0::after {
+	content: var(--tw-content);
+	top: 0px;
+}
 .ui-kit .after\:h-1::after {
 	content: var(--tw-content);
 	height: 0.25rem;
 }
+.ui-kit .after\:h-full::after {
+	content: var(--tw-content);
+	height: 100%;
+}
 .ui-kit .after\:w-0::after {
 	content: var(--tw-content);
 	width: 0px;
 }
+.ui-kit .after\:w-0\.5::after {
+	content: var(--tw-content);
+	width: 0.125rem;
+}
 .ui-kit .after\:w-1::after {
 	content: var(--tw-content);
 	width: 0.25rem;
@@ -4314,14 +4452,46 @@
 	content: var(--tw-content);
 	background-color: hsl(var(--secondary-bg)) !important;
 }
+.ui-kit .after\:bg-\[color\:var\(--table-row-bg\)\]::after {
+	content: var(--tw-content);
+	background-color: var(--table-row-bg);
+}
 .ui-kit .after\:bg-primary::after {
 	content: var(--tw-content);
 	background-color: hsl(var(--primary));
 }
+.ui-kit .after\:bg-primary-border::after {
+	content: var(--tw-content);
+	background-color: hsl(var(--primary-border));
+}
 .ui-kit .after\:bg-primary-foreground::after {
 	content: var(--tw-content);
 	background-color: hsl(var(--primary-foreground));
 }
+.ui-kit .after\:bg-\[image\:var\(--table-row-tints\2c none\)\]::after {
+	content: var(--tw-content);
+	background-image: var(--table-row-tints,none);
+}
+.ui-kit .after\:opacity-0::after {
+	content: var(--tw-content);
+	opacity: 0;
+}
+.ui-kit .after\:opacity-100::after {
+	content: var(--tw-content);
+	opacity: 1;
+}
+.ui-kit .after\:transition-colors::after {
+	content: var(--tw-content);
+	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+	transition-duration: 150ms;
+}
+.ui-kit .after\:transition-opacity::after {
+	content: var(--tw-content);
+	transition-property: opacity;
+	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+	transition-duration: 150ms;
+}
 .ui-kit .first\:rounded-l-md:first-child {
 	border-top-left-radius: calc(var(--radius) - 2px);
 	border-bottom-left-radius: calc(var(--radius) - 2px);
@@ -4339,6 +4509,9 @@
 	border-top-right-radius: calc(var(--radius) - 2px);
 	border-bottom-right-radius: calc(var(--radius) - 2px);
 }
+.ui-kit .last\:border-r-0:last-child {
+	border-right-width: 0px;
+}
 .ui-kit .last\:pb-0:last-child {
 	padding-bottom: 0px;
 }
@@ -4401,8 +4574,17 @@
 	.ui-kit .hover\:\!bg-inverse-hover:hover {
 		background-color: hsl(var(--inverse-hover)) !important;
 	}
-	.ui-kit .hover\:bg-alpha-high-97:hover {
-		background-color: hsl(var(--alpha-high-03));
+	.ui-kit .hover\:bg-\[color\:var\(--table-row-bg-hover\)\]:hover {
+		background-color: var(--table-row-bg-hover);
+	}
+	.ui-kit .hover\:bg-\[hsl\(var\(--status-info\)_\/_16\%\)\]:hover {
+		background-color: hsl(var(--status-info) / 16%);
+	}
+	.ui-kit .hover\:bg-alpha-high-90:hover {
+		background-color: hsl(var(--alpha-high-10));
+	}
+	.ui-kit .hover\:bg-alpha-high-95:hover {
+		background-color: hsl(var(--alpha-high-05));
 	}
 	.ui-kit .hover\:bg-amber-100:hover {
 		--tw-bg-opacity: 1;
@@ -4458,6 +4640,9 @@
 	.ui-kit .hover\:bg-status-success-hover:hover {
 		background-color: hsl(var(--status-success-hover));
 	}
+	.ui-kit .hover\:bg-status-warning-bg:hover {
+		background-color: hsl(var(--status-warning-bg));
+	}
 	.ui-kit .hover\:bg-status-warning-bg-hover:hover {
 		background-color: hsl(var(--status-warning-bg-hover));
 	}
@@ -4496,7 +4681,7 @@
 		opacity: 0.65;
 	}
 	.ui-kit .hover\:shadow-focus:hover {
-		--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+		--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 		--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}
@@ -4527,6 +4712,10 @@
 		content: var(--tw-content);
 		border-color: hsl(var(--primary-border));
 	}
+	.ui-kit .hover\:after\:opacity-100:hover::after {
+		content: var(--tw-content);
+		opacity: 1;
+	}
 	.ui-kit .invalid\:hover\:border-status-error-primary-border:hover:invalid {
 		border-color: hsl(var(--status-error-primary-border));
 	}
@@ -4579,7 +4768,7 @@
 	color: hsl(var(--primary-fg));
 }
 .ui-kit .focus\:shadow-focus:focus {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4653,12 +4842,12 @@
 	background-color: hsl(var(--secondary-bg-hover));
 }
 .ui-kit .focus-visible\:\!shadow-focus:focus-visible {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent)) !important;
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus)) !important;
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color) !important;
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
 }
 .ui-kit .focus-visible\:shadow-focus:focus-visible {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4696,9 +4885,15 @@
 	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
 	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
+.ui-kit .focus-visible\:ring-inset:focus-visible {
+	--tw-ring-inset: inset;
+}
 .ui-kit .focus-visible\:ring-primary:focus-visible {
 	--tw-ring-color: hsl(var(--primary));
 }
+.ui-kit .focus-visible\:ring-primary-accent:focus-visible {
+	--tw-ring-color: hsl(var(--primary-accent));
+}
 .ui-kit .focus-visible\:ring-ring\/50:focus-visible {
 	--tw-ring-color: hsl(var(--ring) / 0.5);
 }
@@ -4848,7 +5043,7 @@
 	opacity: 1;
 }
 .ui-kit :is(.group\/search-select-trigger:focus-within .group-focus-within\/search-select-trigger\:shadow-focus) {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4940,9 +5135,6 @@
 .ui-kit .has-\[input\[aria-invalid\=true\]\]\:has-\[input\:focus\]\:border-status-error-secondary-border:has(input:focus):has(input[aria-invalid=true]) {
 	border-color: hsl(var(--status-error-secondary-border));
 }
-.ui-kit .has-\[\[data-variant\=inset\]\]\:bg-primary-bg:has([data-variant=inset]) {
-	background-color: hsl(var(--primary-bg));
-}
 .ui-kit .has-\[div\[data-input-group-element\=\'contenteditable\'\]\:focus\]\:bg-secondary-bg:has(div[data-input-group-element='contenteditable']:focus) {
 	background-color: hsl(var(--secondary-bg));
 }
@@ -4968,7 +5160,7 @@
 	opacity: 0.5;
 }
 .ui-kit .has-\[div\[data-input-group-element\=\'contenteditable\'\]\:focus\]\:shadow-focus:has(div[data-input-group-element='contenteditable']:focus) {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4978,7 +5170,7 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .has-\[input\:focus\]\:shadow-focus:has(input:focus) {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4993,7 +5185,7 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .has-\[input\:read-only\:not\(\[type\=\'file\'\]\)\]\:has-\[input\:focus\]\:shadow-focus:has(input:focus):has(input:read-only:not([type='file'])) {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5190,24 +5382,30 @@
 .ui-kit .data-\[state\=checked\]\:bg-primary-accent[data-state="checked"] {
 	background-color: hsl(var(--primary-accent));
 }
+.ui-kit .data-\[state\=checked\]\:bg-secondary-bg-hover[data-state="checked"] {
+	background-color: hsl(var(--secondary-bg-hover));
+}
 .ui-kit .data-\[state\=completed\]\:bg-primary-accent[data-state="completed"] {
 	background-color: hsl(var(--primary-accent));
 }
 .ui-kit .data-\[state\=indeterminate\]\:bg-primary-accent[data-state="indeterminate"] {
 	background-color: hsl(var(--primary-accent));
 }
+.ui-kit .data-\[state\=on\]\:bg-alpha-high-80[data-state="on"] {
+	background-color: hsl(var(--alpha-high-20));
+}
 .ui-kit .data-\[state\=on\]\:bg-inverse-active[data-state="on"] {
 	background-color: hsl(var(--inverse-active));
 }
 .ui-kit .data-\[state\=on\]\:bg-primary-bg-hover[data-state="on"] {
 	background-color: hsl(var(--primary-bg-hover));
 }
-.ui-kit .data-\[state\=on\]\:bg-primary-border[data-state="on"] {
-	background-color: hsl(var(--primary-border));
-}
 .ui-kit .data-\[state\=on\]\:bg-secondary-bg-hover[data-state="on"] {
 	background-color: hsl(var(--secondary-bg-hover));
 }
+.ui-kit .data-\[state\=open\]\:bg-alpha-high-80[data-state="open"] {
+	background-color: hsl(var(--alpha-high-20));
+}
 .ui-kit .data-\[state\=open\]\:bg-inverse-active[data-state="open"] {
 	background-color: hsl(var(--inverse-active));
 }
@@ -5217,9 +5415,6 @@
 .ui-kit .data-\[state\=open\]\:bg-primary-bg-hover[data-state="open"] {
 	background-color: hsl(var(--primary-bg-hover));
 }
-.ui-kit .data-\[state\=open\]\:bg-primary-border[data-state="open"] {
-	background-color: hsl(var(--primary-border));
-}
 .ui-kit .data-\[state\=open\]\:bg-secondary[data-state="open"] {
 	background-color: hsl(var(--secondary));
 }
@@ -5229,9 +5424,6 @@
 .ui-kit .data-\[state\=open\]\:bg-secondary-border[data-state="open"] {
 	background-color: hsl(var(--secondary-border));
 }
-.ui-kit .data-\[state\=selected\]\:bg-alpha-high-95[data-state="selected"] {
-	background-color: hsl(var(--alpha-high-05));
-}
 .ui-kit .data-\[state\=unchecked\]\:bg-inverse-active[data-state="unchecked"] {
 	background-color: hsl(var(--inverse-active));
 }
@@ -5456,9 +5648,6 @@
 	.ui-kit .data-\[state\=open\]\:hover\:bg-primary-bg-hover:hover[data-state="open"] {
 		background-color: hsl(var(--primary-bg-hover));
 	}
-	.ui-kit .data-\[state\=selected\]\:hover\:bg-alpha-high-92:hover[data-state="selected"] {
-		background-color: hsl(var(--alpha-high-08));
-	}
 	.ui-kit .data-\[active\=true\]\:data-\[state\=open\]\:hover\:text-primary-accent:hover[data-state="open"][data-active="true"] {
 		color: hsl(var(--primary-accent));
 	}
@@ -5480,12 +5669,12 @@
 	}
 }
 .ui-kit .data-\[state\=checked\]\:focus-visible\:shadow-focus:focus-visible[data-state="checked"] {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .data-\[state\=indeterminate\]\:focus-visible\:shadow-focus:focus-visible[data-state="indeterminate"] {
-	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--primary-accent));
+	--tw-shadow: 0 0 0 1px hsl(var(--primary-bg)), 0 0 0 2px hsl(var(--focus));
 	--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5699,6 +5888,23 @@
 .ui-kit :is(.peer\/menu-button[data-active="true"] ~ .peer-data-\[active\=true\]\/menu-button\:text-primary-accent) {
 	color: hsl(var(--primary-accent));
 }
+@container (min-width: 24rem) {
+	.ui-kit .\@sm\:col-start-3 {
+		grid-column-start: 3;
+	}
+	.ui-kit .\@sm\:ml-3 {
+		margin-left: 0.75rem;
+	}
+	.ui-kit .\@sm\:grid-cols-\[auto_1fr_auto\] {
+		grid-template-columns: auto 1fr auto;
+	}
+	.ui-kit .\@sm\:self-end {
+		align-self: flex-end;
+	}
+	.ui-kit .\@sm\:justify-self-auto {
+		justify-self: auto;
+	}
+}
 @media (prefers-reduced-motion: no-preference) {
 	@keyframes collapsible-up {
 		from {
@@ -5809,12 +6015,6 @@
 	}
 }
 @media (min-width: 768px) {
-	.ui-kit .md\:block {
-		display: block;
-	}
-	.ui-kit .md\:flex {
-		display: flex;
-	}
 	.ui-kit .md\:min-w-\[450px\] {
 		min-width: 450px;
 	}
@@ -5874,12 +6074,18 @@
 	.ui-kit .lg\:mt-5 {
 		margin-top: 1.25rem;
 	}
+	.ui-kit .lg\:block {
+		display: block;
+	}
 	.ui-kit .lg\:flex {
 		display: flex;
 	}
 	.ui-kit .lg\:grid {
 		display: grid;
 	}
+	.ui-kit .lg\:hidden {
+		display: none;
+	}
 	.ui-kit .lg\:h-10 {
 		height: 2.5rem;
 	}
@@ -5942,6 +6148,9 @@
 	.ui-kit .lg\:flex-row {
 		flex-direction: row;
 	}
+	.ui-kit .lg\:flex-col {
+		flex-direction: column;
+	}
 	.ui-kit .lg\:items-start {
 		align-items: flex-start;
 	}
@@ -5951,6 +6160,9 @@
 	.ui-kit .lg\:justify-center {
 		justify-content: center;
 	}
+	.ui-kit .lg\:gap-0\.5 {
+		gap: 0.125rem;
+	}
 	.ui-kit .lg\:gap-1 {
 		gap: 0.25rem;
 	}
@@ -5986,6 +6198,9 @@
 	.ui-kit .lg\:p-1 {
 		padding: 0.25rem;
 	}
+	.ui-kit .lg\:p-4 {
+		padding: 1rem;
+	}
 	.ui-kit .lg\:p-6 {
 		padding: 1.5rem;
 	}
@@ -6038,6 +6253,9 @@
 	.ui-kit .lg\:pb-6 {
 		padding-bottom: 1.5rem;
 	}
+	.ui-kit .lg\:pb-px {
+		padding-bottom: 1px;
+	}
 	.ui-kit .lg\:pl-0 {
 		padding-left: 0px;
 	}
@@ -6059,6 +6277,9 @@
 	.ui-kit .lg\:pt-6 {
 		padding-top: 1.5rem;
 	}
+	.ui-kit .lg\:pt-px {
+		padding-top: 1px;
+	}
 	.ui-kit .lg\:text-left {
 		text-align: left;
 	}
@@ -6213,9 +6434,18 @@
 .ui-kit .\[\&\:has\(\[data-menu-item-action\]\:hover\)\]\:bg-secondary-border:has([data-menu-item-action]:hover) {
 	background-color: hsl(var(--secondary-border));
 }
+.ui-kit .\[\&\:has\(\[data-state\=open\]\)\]\:bg-primary-bg-hover:has([data-state=open]) {
+	background-color: hsl(var(--primary-bg-hover));
+}
 .ui-kit .\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
 	padding-right: 0px;
 }
+.ui-kit :is(.\[\&\>\*\]\:border-b>*) {
+	border-bottom-width: 1px;
+}
+.ui-kit :is(.\[\&\>\*\]\:border-secondary-border>*) {
+	border-color: hsl(var(--secondary-border));
+}
 .ui-kit :is(.\[\&\>button\]\:hidden>button) {
 	display: none;
 }
@@ -6288,7 +6518,13 @@
 		color: hsl(var(--primary-fg));
 	}
 }
-.ui-kit :is(.\[\&\>tr\]\:last\:border-b-0:last-child>tr) {
+.ui-kit :is(.\[\&\>tr\:first-child\>\*\]\:border-t>tr:first-child>*) {
+	border-top-width: 1px;
+}
+.ui-kit :is(.\[\&\>tr\:first-child\>\*\]\:border-secondary-border>tr:first-child>*) {
+	border-color: hsl(var(--secondary-border));
+}
+.ui-kit :is(.\[\&\>tr\:last-child\>\*\]\:border-b-0>tr:last-child>*) {
 	border-bottom-width: 0px;
 }
 .ui-kit :is(.\[\&\[data-active\=true\]\>svg\]\:text-primary-accent[data-active=true]>svg) {
@@ -6421,12 +6657,18 @@
 .ui-kit :is(.\[\&_svg\]\:shrink-0 svg) {
 	flex-shrink: 0;
 }
-.ui-kit :is(.\[\&_tr\:last-child\]\:border-0 tr:last-child) {
-	border-width: 0px;
-}
-.ui-kit :is(.\[\&_tr\]\:border-b tr) {
+.ui-kit :is(.\[\&_th\]\:border-b th) {
 	border-bottom-width: 1px;
 }
+.ui-kit :is(.\[\&_th\]\:border-secondary-border th) {
+	border-color: hsl(var(--secondary-border));
+}
+.ui-kit :is(.\[\&_tr\:last-child\>\*\]\:border-b-0 tr:last-child>*) {
+	border-bottom-width: 0px;
+}
+.ui-kit :is(.\[\&_tr\]\:\[--table-row-bg-hover\:transparent\] tr) {
+	--table-row-bg-hover: transparent;
+}
 .ui-kit :is([data-side=left][data-collapsible=offcanvas] .\[\[data-side\=left\]\[data-collapsible\=offcanvas\]_\&\]\:-right-\[2\.5px\]) {
 	right: -2.5px;
 }
@@ -6439,3 +6681,7 @@
 .ui-kit :is([data-slot=popover-content] .\[\[data-slot\=popover-content\]_\&\]\:bg-transparent) {
 	background-color: transparent;
 }
+.ui-kit :is(tr:hover>.\[tr\:hover\>\&\]\:after\:bg-\[color\:var\(--table-row-bg-hover\)\])::after {
+	content: var(--tw-content);
+	background-color: var(--table-row-bg-hover);
+}