@deriv-ds/design-intelligence-layer 0.1.0 → 0.2.0

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/dist/index.js CHANGED
@@ -81,7 +81,7 @@ function AccordionTrigger(_a) {
81
81
  }, props), {
82
82
  children: [
83
83
  children,
84
- /* @__PURE__ */ jsx(ChevronDownIcon, { className: "pointer-events-none size-4 shrink-0 translate-y-0.5 text-on-subtle transition-transform duration-200" })
84
+ /* @__PURE__ */ jsx(ChevronDownIcon, { className: "pointer-events-none size-4 shrink-0 translate-y-0.5 text-subtle transition-transform duration-200" })
85
85
  ]
86
86
  })
87
87
  ) });
@@ -113,8 +113,8 @@ var alertVariants = cva(
113
113
  {
114
114
  variants: {
115
115
  variant: {
116
- info: "bg-transparent text-alert-info-text border-alert-info-border *:data-[slot=alert-description]:text-on-subtle [&>svg]:text-current",
117
- error: "bg-transparent text-alert-error-text border-alert-error-border *:data-[slot=alert-description]:text-on-subtle [&>svg]:text-current"
116
+ info: "bg-transparent text-alert-info-text border-alert-info-border *:data-[slot=alert-description]:text-subtle [&>svg]:text-current",
117
+ error: "bg-transparent text-alert-error-text border-alert-error-border *:data-[slot=alert-description]:text-subtle [&>svg]:text-current"
118
118
  }
119
119
  },
120
120
  defaultVariants: {
@@ -178,14 +178,13 @@ import { cva as cva2 } from "class-variance-authority";
178
178
  import { Slot } from "radix-ui";
179
179
  import { jsx as jsx3 } from "react/jsx-runtime";
180
180
  var buttonVariants = cva2(
181
- "inline-flex shrink-0 items-center justify-center whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 active:opacity-60 disabled:pointer-events-none disabled:opacity-24 aria-invalid:border-destructive aria-invalid:ring-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 font-display font-bold",
181
+ "inline-flex shrink-0 items-center justify-center whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-24 aria-invalid:border-destructive aria-invalid:ring-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 font-display font-bold",
182
182
  {
183
183
  variants: {
184
184
  variant: {
185
- // Primary brand blue (#2323FF)
186
- primary: "bg-primary text-on-prominent-static-inverse hover:bg-primary-hover",
187
- secondary: "bg-transparent border-[1.5px] border-border-prominent text-on-prominent hover:bg-secondary-hover",
188
- tertiary: "bg-transparent text-primary hover:bg-primary/[0.08]"
185
+ primary: "bg-primary text-prominent-static-inverse hover:bg-primary-hover active:bg-primary-hover",
186
+ secondary: "bg-transparent border-[1.5px] border-[var(--button-secondary-normal-border)] text-[var(--button-secondary-normal-text)] hover:bg-[var(--button-secondary-normal-bg-hover)] active:bg-[var(--button-secondary-normal-bg-pressed)]",
187
+ tertiary: "bg-[var(--button-tertiary-normal-bg-default)] text-[var(--button-tertiary-normal-text)] hover:bg-[var(--button-tertiary-normal-bg-hover)] active:bg-[var(--button-tertiary-normal-bg-pressed)]"
189
188
  },
190
189
  size: {
191
190
  lg: "h-12 w-fit gap-3 rounded-xs px-6 py-[14px] text-base [&_svg:not([class*='size-'])]:size-4",
@@ -280,7 +279,7 @@ function AlertDialogContent(_a) {
280
279
  "data-slot": "alert-dialog-content",
281
280
  "data-size": size,
282
281
  className: cn(
283
- "group/alert-dialog-content fixed top-[50%] left-[50%] z-50 flex h-auto w-full max-w-[calc(100%-2rem)] flex-col translate-x-[-50%] translate-y-[-50%] gap-6 rounded-sm border border-border-subtle bg-prominent p-6 shadow-lg duration-base data-[size=sm]:max-w-xs data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[size=default]:sm:max-w-lg",
282
+ "group/alert-dialog-content fixed top-[50%] left-[50%] z-50 flex h-auto w-full max-w-[calc(100%-2rem)] flex-col translate-x-[-50%] translate-y-[-50%] gap-6 rounded-sm border border-default bg-primary-surface p-6 shadow-lg duration-base data-[size=sm]:max-w-xs data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[size=default]:sm:max-w-lg",
284
283
  className
285
284
  )
286
285
  }, props)
@@ -348,7 +347,7 @@ function AlertDialogDescription(_a) {
348
347
  AlertDialogPrimitive.Description,
349
348
  __spreadValues({
350
349
  "data-slot": "alert-dialog-description",
351
- className: cn("text-sm text-on-subtle", className)
350
+ className: cn("text-sm text-subtle", className)
352
351
  }, props)
353
352
  );
354
353
  }
@@ -363,7 +362,7 @@ function AlertDialogMedia(_a) {
363
362
  __spreadValues({
364
363
  "data-slot": "alert-dialog-media",
365
364
  className: cn(
366
- "mb-2 inline-flex size-16 items-center justify-center rounded-md bg-subtle sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8",
365
+ "mb-2 inline-flex size-16 items-center justify-center rounded-md bg-secondary-surface sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8",
367
366
  className
368
367
  )
369
368
  }, props)
@@ -460,7 +459,7 @@ function AvatarFallback(_a) {
460
459
  __spreadValues({
461
460
  "data-slot": "avatar-fallback",
462
461
  className: cn(
463
- "flex size-full items-center justify-center overflow-hidden rounded-full bg-subtle text-sm text-on-subtle group-data-[size=sm]/avatar:text-xs group-data-[size=xl]/avatar:text-base",
462
+ "flex size-full items-center justify-center overflow-hidden rounded-full bg-secondary-surface text-sm text-subtle group-data-[size=sm]/avatar:text-xs group-data-[size=xl]/avatar:text-base",
464
463
  className
465
464
  )
466
465
  }, props)
@@ -473,7 +472,7 @@ function AvatarBadge(_a) {
473
472
  __spreadValues({
474
473
  "data-slot": "avatar-badge",
475
474
  className: cn(
476
- "absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-on-prominent-static-inverse ring-2 ring-prominent select-none",
475
+ "absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-prominent-static-inverse ring-2 ring-primary-surface select-none",
477
476
  "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden",
478
477
  "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2",
479
478
  "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2",
@@ -490,7 +489,7 @@ function AvatarGroup(_a) {
490
489
  __spreadValues({
491
490
  "data-slot": "avatar-group",
492
491
  className: cn(
493
- "group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-prominent",
492
+ "group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-primary-surface",
494
493
  className
495
494
  )
496
495
  }, props)
@@ -507,7 +506,7 @@ function AvatarGroupCount(_a) {
507
506
  __spreadValues({
508
507
  "data-slot": "avatar-group-count",
509
508
  className: cn(
510
- "relative flex size-8 shrink-0 items-center justify-center rounded-full bg-subtle text-sm text-on-subtle ring-2 ring-prominent group-has-data-[size=sm]/avatar-group:size-6 group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=xl]/avatar-group:[width:var(--avatar-size-xl)] group-has-data-[size=xl]/avatar-group:[height:var(--avatar-size-xl)] [&>svg]:size-4 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=xl]/avatar-group:[&>svg]:size-6",
509
+ "relative flex size-8 shrink-0 items-center justify-center rounded-full bg-secondary-surface text-sm text-subtle ring-2 ring-primary-surface group-has-data-[size=sm]/avatar-group:size-6 group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=xl]/avatar-group:[width:var(--avatar-size-xl)] group-has-data-[size=xl]/avatar-group:[height:var(--avatar-size-xl)] [&>svg]:size-4 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=xl]/avatar-group:[&>svg]:size-6",
511
510
  className
512
511
  )
513
512
  }, props)
@@ -524,20 +523,20 @@ var badgeVariants = cva3(
524
523
  variants: {
525
524
  variant: {
526
525
  // Default (solid)
527
- default: "bg-primary text-on-prominent-static-inverse [a&]:hover:bg-primary/90",
528
- "default-success": "bg-semantic-win text-on-prominent-static-inverse [a&]:hover:bg-semantic-win/90",
529
- "default-fail": "bg-semantic-loss text-on-prominent-static-inverse [a&]:hover:bg-semantic-loss/90",
530
- "default-warning": "bg-semantic-warning text-on-prominent-static-inverse [a&]:hover:bg-semantic-warning/90",
526
+ default: "bg-primary text-prominent-static-inverse [a&]:hover:bg-primary/90",
527
+ "default-success": "bg-[var(--badge-bg-status-green)] text-[var(--badge-text-default)] [a&]:hover:bg-[var(--badge-bg-status-green)]/90",
528
+ "default-fail": "bg-[var(--badge-bg-status-red)] text-[var(--badge-text-default)] [a&]:hover:bg-[var(--badge-bg-status-red)]/90",
529
+ "default-warning": "bg-warning text-prominent-static-inverse [a&]:hover:bg-warning/90",
531
530
  // Fill (tint)
532
531
  fill: "bg-primary/10 border-transparent text-primary",
533
- "fill-success": "bg-semantic-win/10 border-transparent text-semantic-win",
534
- "fill-fail": "bg-semantic-loss/10 border-transparent text-semantic-loss",
535
- "fill-warning": "bg-semantic-warning/10 border-transparent text-semantic-warning",
532
+ "fill-success": "bg-[var(--badge-bg-status-green)]/10 border-transparent text-[var(--badge-bg-status-green)]",
533
+ "fill-fail": "bg-[var(--badge-bg-status-red)]/10 border-transparent text-[var(--badge-bg-status-red)]",
534
+ "fill-warning": "bg-warning/10 border-transparent text-warning",
536
535
  // Ghost (transparent)
537
536
  ghost: "bg-transparent border-transparent text-primary [a&]:hover:bg-secondary-hover [a&]:hover:text-primary",
538
- "ghost-success": "bg-transparent border-transparent text-semantic-win [a&]:hover:bg-semantic-win/10 [a&]:hover:text-semantic-win",
539
- "ghost-fail": "bg-transparent border-transparent text-semantic-loss [a&]:hover:bg-semantic-loss/10 [a&]:hover:text-semantic-loss",
540
- "ghost-warning": "bg-transparent border-transparent text-semantic-warning [a&]:hover:bg-semantic-warning/10 [a&]:hover:text-semantic-warning"
537
+ "ghost-success": "bg-transparent border-transparent text-[var(--badge-bg-status-green)] [a&]:hover:bg-[var(--badge-bg-status-green)]/10",
538
+ "ghost-fail": "bg-transparent border-transparent text-[var(--badge-bg-status-red)] [a&]:hover:bg-[var(--badge-bg-status-red)]/10",
539
+ "ghost-warning": "bg-transparent border-transparent text-warning [a&]:hover:bg-warning/10 [a&]:hover:text-warning"
541
540
  },
542
541
  size: {
543
542
  sm: "h-6 px-2.5 py-0.5 text-xs",
@@ -589,7 +588,7 @@ function BreadcrumbList(_a) {
589
588
  __spreadValues({
590
589
  "data-slot": "breadcrumb-list",
591
590
  className: cn(
592
- "flex flex-wrap items-center gap-1.5 text-sm break-words text-on-subtle sm:gap-2.5",
591
+ "flex flex-wrap items-center gap-1.5 text-sm break-words text-subtle sm:gap-2.5",
593
592
  className
594
593
  )
595
594
  }, props)
@@ -618,7 +617,7 @@ function BreadcrumbLink(_a) {
618
617
  Comp,
619
618
  __spreadValues({
620
619
  "data-slot": "breadcrumb-link",
621
- className: cn("transition-colors hover:text-on-prominent", className)
620
+ className: cn("transition-colors hover:text-prominent", className)
622
621
  }, props)
623
622
  );
624
623
  }
@@ -713,7 +712,7 @@ function Calendar(_a) {
713
712
  __spreadValues({
714
713
  showOutsideDays,
715
714
  className: cn(
716
- "group/calendar bg-prominent p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent",
715
+ "group/calendar bg-primary-surface p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent",
717
716
  String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`,
718
717
  String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`,
719
718
  className
@@ -756,18 +755,18 @@ function Calendar(_a) {
756
755
  defaultClassNames.dropdown_root
757
756
  ),
758
757
  dropdown: cn(
759
- "absolute inset-0 bg-popover opacity-0",
758
+ "absolute inset-0 bg-primary-surface opacity-0",
760
759
  defaultClassNames.dropdown
761
760
  ),
762
761
  caption_label: cn(
763
762
  "font-body font-medium select-none",
764
- captionLayout === "label" ? "text-sm" : "flex h-8 items-center gap-1 rounded-md pr-1 pl-2 text-sm [&>svg]:size-3.5 [&>svg]:text-on-subtle",
763
+ captionLayout === "label" ? "text-sm" : "flex h-8 items-center gap-1 rounded-md pr-1 pl-2 text-sm [&>svg]:size-3.5 [&>svg]:text-subtle",
765
764
  defaultClassNames.caption_label
766
765
  ),
767
766
  table: "w-full border-collapse",
768
767
  weekdays: cn("flex", defaultClassNames.weekdays),
769
768
  weekday: cn(
770
- "flex-1 rounded-md text-[0.8rem] font-body font-normal text-on-subtle select-none",
769
+ "flex-1 rounded-md text-[0.8rem] font-body font-normal text-subtle select-none",
771
770
  defaultClassNames.weekday
772
771
  ),
773
772
  week: cn("mt-2 flex w-full", defaultClassNames.week),
@@ -776,7 +775,7 @@ function Calendar(_a) {
776
775
  defaultClassNames.week_number_header
777
776
  ),
778
777
  week_number: cn(
779
- "text-[0.8rem] text-on-subtle select-none",
778
+ "text-[0.8rem] text-subtle select-none",
780
779
  defaultClassNames.week_number
781
780
  ),
782
781
  day: cn(
@@ -795,11 +794,11 @@ function Calendar(_a) {
795
794
  defaultClassNames.today
796
795
  ),
797
796
  outside: cn(
798
- "text-on-subtle aria-selected:text-on-subtle",
797
+ "text-subtle aria-selected:text-subtle",
799
798
  defaultClassNames.outside
800
799
  ),
801
800
  disabled: cn(
802
- "text-on-subtle opacity-50",
801
+ "text-subtle opacity-50",
803
802
  defaultClassNames.disabled
804
803
  ),
805
804
  hidden: cn("invisible", defaultClassNames.hidden)
@@ -869,7 +868,7 @@ function CalendarDayButton(_a) {
869
868
  "data-range-end": modifiers.range_end,
870
869
  "data-range-middle": modifiers.range_middle,
871
870
  className: cn(
872
- "flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-body font-normal bg-transparent border-transparent shadow-none text-on-prominent hover:!bg-secondary-hover hover:text-on-prominent hover:no-underline hover:shadow-none group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:text-primary [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:relative [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:absolute [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:bottom-0.5 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:left-1/2 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:-translate-x-1/2 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:size-1 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:rounded-full [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:bg-primary data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-end=true]:bg-secondary-hover data-[range-end=true]:border-transparent data-[range-end=true]:text-primary data-[range-end=true]:font-bold data-[range-end=true]:hover:!bg-secondary-hover data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-secondary-hover data-[range-middle=true]:text-primary data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md data-[range-start=true]:bg-secondary-hover data-[range-start=true]:border-transparent data-[range-start=true]:text-primary data-[range-start=true]:font-bold data-[range-start=true]:hover:!bg-secondary-hover data-[selected-single=true]:bg-secondary-hover data-[selected-single=true]:border-transparent data-[selected-single=true]:text-primary data-[selected-single=true]:font-bold data-[selected-single=true]:hover:!bg-secondary-hover [&>span]:text-xs [&>span]:opacity-70",
871
+ "flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-body font-normal bg-transparent border-transparent shadow-none text-prominent hover:!bg-secondary-hover hover:text-prominent hover:no-underline hover:shadow-none group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:text-primary [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:relative [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:absolute [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:bottom-0.5 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:left-1/2 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:-translate-x-1/2 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:size-1 [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:rounded-full [&[data-today='true']:not([data-selected-single='true']):not([data-range-start='true']):not([data-range-end='true'])]:after:bg-primary data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-end=true]:bg-secondary-hover data-[range-end=true]:border-transparent data-[range-end=true]:text-primary data-[range-end=true]:font-bold data-[range-end=true]:hover:!bg-secondary-hover data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-secondary-hover data-[range-middle=true]:text-primary data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md data-[range-start=true]:bg-secondary-hover data-[range-start=true]:border-transparent data-[range-start=true]:text-primary data-[range-start=true]:font-bold data-[range-start=true]:hover:!bg-secondary-hover data-[selected-single=true]:bg-secondary-hover data-[selected-single=true]:border-transparent data-[selected-single=true]:text-primary data-[selected-single=true]:font-bold data-[selected-single=true]:hover:!bg-secondary-hover [&>span]:text-xs [&>span]:opacity-70",
873
872
  defaultClassNames.day,
874
873
  className
875
874
  )
@@ -886,7 +885,7 @@ function Card(_a) {
886
885
  __spreadValues({
887
886
  "data-slot": "card",
888
887
  className: cn(
889
- "flex flex-col gap-6 rounded-sm border border-border-subtle bg-card py-6 text-card-foreground",
888
+ "flex flex-col gap-6 rounded-sm border border-default bg-primary-surface py-6 text-prominent",
890
889
  className
891
890
  )
892
891
  }, props)
@@ -921,7 +920,7 @@ function CardDescription(_a) {
921
920
  "div",
922
921
  __spreadValues({
923
922
  "data-slot": "card-description",
924
- className: cn("text-sm text-on-subtle", className)
923
+ className: cn("text-sm text-subtle", className)
925
924
  }, props)
926
925
  );
927
926
  }
@@ -1284,7 +1283,7 @@ function ChartTooltipContent({
1284
1283
  "div",
1285
1284
  {
1286
1285
  className: cn(
1287
- "grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border-subtle/50 bg-prominent px-2.5 py-1.5 text-xs shadow-xl",
1286
+ "grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-default/50 bg-primary-surface px-2.5 py-1.5 text-xs shadow-xl",
1288
1287
  className
1289
1288
  ),
1290
1289
  children: [
@@ -1297,7 +1296,7 @@ function ChartTooltipContent({
1297
1296
  "div",
1298
1297
  {
1299
1298
  className: cn(
1300
- "flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-on-subtle",
1299
+ "flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-subtle",
1301
1300
  indicator === "dot" && "items-center"
1302
1301
  ),
1303
1302
  children: formatter && (item == null ? void 0 : item.value) !== void 0 && item.name ? formatter(item.value, item.name, item, index, item.payload) : /* @__PURE__ */ jsxs5(Fragment, { children: [
@@ -1329,9 +1328,9 @@ function ChartTooltipContent({
1329
1328
  children: [
1330
1329
  /* @__PURE__ */ jsxs5("div", { className: "grid gap-1.5", children: [
1331
1330
  nestLabel ? tooltipLabel : null,
1332
- /* @__PURE__ */ jsx12("span", { className: "text-on-subtle", children: (itemConfig == null ? void 0 : itemConfig.label) || item.name })
1331
+ /* @__PURE__ */ jsx12("span", { className: "text-subtle", children: (itemConfig == null ? void 0 : itemConfig.label) || item.name })
1333
1332
  ] }),
1334
- item.value && /* @__PURE__ */ jsx12("span", { className: "font-mono font-medium text-on-prominent tabular-nums", children: item.value.toLocaleString() })
1333
+ item.value && /* @__PURE__ */ jsx12("span", { className: "font-mono font-medium text-prominent tabular-nums", children: item.value.toLocaleString() })
1335
1334
  ]
1336
1335
  }
1337
1336
  )
@@ -1371,7 +1370,7 @@ function ChartLegendContent({
1371
1370
  "div",
1372
1371
  {
1373
1372
  className: cn(
1374
- "flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-on-subtle"
1373
+ "flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-subtle"
1375
1374
  ),
1376
1375
  children: [
1377
1376
  (itemConfig == null ? void 0 : itemConfig.icon) && !hideIcon ? /* @__PURE__ */ jsx12(itemConfig.icon, {}) : /* @__PURE__ */ jsx12(
@@ -1421,7 +1420,7 @@ function Checkbox(_a) {
1421
1420
  __spreadProps(__spreadValues({
1422
1421
  "data-slot": "checkbox",
1423
1422
  className: cn(
1424
- "peer size-4 shrink-0 rounded-[2px] border border-input shadow-xs transition-shadow outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-on-prominent-static-inverse",
1423
+ "peer size-4 shrink-0 rounded-[2px] border border-input shadow-xs transition-shadow outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-prominent-static-inverse",
1425
1424
  className
1426
1425
  )
1427
1426
  }, props), {
@@ -1481,8 +1480,8 @@ function Input(_a) {
1481
1480
  type,
1482
1481
  "data-slot": "input",
1483
1482
  className: cn(
1484
- "h-9 w-full min-w-0 rounded-sm border border-border-subtle bg-white/5 px-3 py-1 text-base text-on-prominent font-body shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-on-prominent-static-inverse file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-on-prominent placeholder:text-on-subtle disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
1485
- "focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/[0.08]",
1483
+ "h-9 w-full min-w-0 rounded-sm border border-[var(--field-outline-border-default)] bg-[var(--field-outline-bg-default)] px-3 py-1 text-base text-[var(--field-text-prominent)] font-body shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-prominent-static-inverse file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-[var(--field-text-prominent)] placeholder:text-[var(--field-text-subtle)] hover:bg-[var(--field-outline-bg-hover)] focus-visible:bg-[var(--field-outline-bg-focus)] disabled:bg-[var(--field-outline-bg-disabled)] disabled:pointer-events-none disabled:cursor-not-allowed disabled:text-[var(--field-text-disabled)] disabled:opacity-50 md:text-sm",
1484
+ "focus-visible:border-[var(--field-outline-border-focus)] focus-visible:ring-[3px] focus-visible:ring-primary/[0.08]",
1486
1485
  className
1487
1486
  )
1488
1487
  }, props)
@@ -1498,7 +1497,7 @@ function Textarea(_a) {
1498
1497
  __spreadValues({
1499
1498
  "data-slot": "textarea",
1500
1499
  className: cn(
1501
- "flex field-sizing-content min-h-16 w-full rounded-sm border border-border-subtle bg-white/5 px-3 py-2 text-base text-on-prominent font-body shadow-xs transition-[color,box-shadow] outline-none placeholder:text-on-subtle focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/[0.08] disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 md:text-sm",
1500
+ "flex field-sizing-content min-h-16 w-full rounded-sm border border-[var(--field-outline-border-default)] bg-[var(--field-outline-bg-default)] px-3 py-2 text-base text-[var(--field-text-prominent)] font-body shadow-xs transition-[color,box-shadow] outline-none placeholder:text-[var(--field-text-subtle)] hover:bg-[var(--field-outline-bg-hover)] focus-visible:bg-[var(--field-outline-bg-focus)] focus-visible:border-[var(--field-outline-border-focus)] focus-visible:ring-[3px] focus-visible:ring-primary/[0.08] disabled:bg-[var(--field-outline-bg-disabled)] disabled:text-[var(--field-text-disabled)] disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 md:text-sm",
1502
1501
  className
1503
1502
  )
1504
1503
  }, props)
@@ -1515,7 +1514,7 @@ function InputGroup(_a) {
1515
1514
  "data-slot": "input-group",
1516
1515
  role: "group",
1517
1516
  className: cn(
1518
- "group/input-group relative flex w-full items-center rounded-sm border border-border-subtle bg-white/5 shadow-xs transition-[color,box-shadow] outline-none",
1517
+ "group/input-group relative flex w-full items-center rounded-sm border border-default bg-white/5 shadow-xs transition-[color,box-shadow] outline-none",
1519
1518
  "h-9 min-w-0 has-[>textarea]:h-auto",
1520
1519
  // Variants based on alignment.
1521
1520
  "has-[>[data-align=inline-start]]:[&>input]:pl-2",
@@ -1532,7 +1531,7 @@ function InputGroup(_a) {
1532
1531
  );
1533
1532
  }
1534
1533
  var inputGroupAddonVariants = cva4(
1535
- "flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-on-subtle select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4",
1534
+ "flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-subtle select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4",
1536
1535
  {
1537
1536
  variants: {
1538
1537
  align: {
@@ -1616,7 +1615,7 @@ function InputGroupText(_a) {
1616
1615
  "span",
1617
1616
  __spreadValues({
1618
1617
  className: cn(
1619
- "flex items-center gap-2 text-sm text-on-subtle [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
1618
+ "flex items-center gap-2 text-sm text-subtle [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
1620
1619
  className
1621
1620
  )
1622
1621
  }, props)
@@ -1684,7 +1683,7 @@ function ComboboxTrigger(_a) {
1684
1683
  ChevronDownIcon3,
1685
1684
  {
1686
1685
  "data-slot": "combobox-trigger-icon",
1687
- className: "pointer-events-none size-4 text-on-subtle"
1686
+ className: "pointer-events-none size-4 text-subtle"
1688
1687
  }
1689
1688
  )
1690
1689
  ]
@@ -1774,7 +1773,7 @@ function ComboboxContent(_a) {
1774
1773
  "data-slot": "combobox-content",
1775
1774
  "data-chips": !!anchor,
1776
1775
  className: cn(
1777
- "group/combobox-content relative max-h-96 w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-md bg-popover text-popover-foreground shadow-md ring-1 ring-border-subtle duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
1776
+ "group/combobox-content relative max-h-96 w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-md bg-primary-surface text-prominent shadow-md ring-1 ring-default duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
1778
1777
  className
1779
1778
  )
1780
1779
  }, props)
@@ -1808,7 +1807,7 @@ function ComboboxItem(_a) {
1808
1807
  __spreadProps(__spreadValues({
1809
1808
  "data-slot": "combobox-item",
1810
1809
  className: cn(
1811
- "relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-highlighted:bg-primary/10 data-highlighted:text-on-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
1810
+ "relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-highlighted:bg-primary/10 data-highlighted:text-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
1812
1811
  className
1813
1812
  )
1814
1813
  }, props), {
@@ -1847,7 +1846,7 @@ function ComboboxLabel(_a) {
1847
1846
  __spreadValues({
1848
1847
  "data-slot": "combobox-label",
1849
1848
  className: cn(
1850
- "px-2 py-1.5 text-xs text-on-subtle pointer-coarse:px-3 pointer-coarse:py-2 pointer-coarse:text-sm",
1849
+ "px-2 py-1.5 text-xs text-subtle pointer-coarse:px-3 pointer-coarse:py-2 pointer-coarse:text-sm",
1851
1850
  className
1852
1851
  )
1853
1852
  }, props)
@@ -1864,7 +1863,7 @@ function ComboboxEmpty(_a) {
1864
1863
  __spreadValues({
1865
1864
  "data-slot": "combobox-empty",
1866
1865
  className: cn(
1867
- "hidden w-full justify-center py-2 text-center text-sm text-on-subtle group-data-empty/combobox-content:flex",
1866
+ "hidden w-full justify-center py-2 text-center text-sm text-subtle group-data-empty/combobox-content:flex",
1868
1867
  className
1869
1868
  )
1870
1869
  }, props)
@@ -1916,7 +1915,7 @@ function ComboboxChip(_a) {
1916
1915
  __spreadProps(__spreadValues({
1917
1916
  "data-slot": "combobox-chip",
1918
1917
  className: cn(
1919
- "flex h-[calc(--spacing(5.5))] w-fit items-center justify-center gap-1 rounded-sm bg-subtle px-1.5 text-xs font-medium whitespace-nowrap text-on-prominent has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pr-0",
1918
+ "flex h-[calc(--spacing(5.5))] w-fit items-center justify-center gap-1 rounded-sm bg-secondary-surface px-1.5 text-xs font-medium whitespace-nowrap text-prominent has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pr-0",
1920
1919
  className
1921
1920
  )
1922
1921
  }, props), {
@@ -2013,7 +2012,7 @@ function DialogContent(_a) {
2013
2012
  __spreadProps(__spreadValues({
2014
2013
  "data-slot": "dialog-content",
2015
2014
  className: cn(
2016
- "fixed top-[50%] left-[50%] z-50 flex h-auto w-full max-w-[calc(100%-2rem)] flex-col translate-x-[-50%] translate-y-[-50%] gap-6 rounded-sm border border-border-subtle bg-prominent p-6 shadow-lg duration-base outline-none data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg",
2015
+ "fixed top-[50%] left-[50%] z-50 flex h-auto w-full max-w-[calc(100%-2rem)] flex-col translate-x-[-50%] translate-y-[-50%] gap-6 rounded-sm border border-default bg-primary-surface p-6 shadow-lg duration-base outline-none data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg",
2017
2016
  className
2018
2017
  )
2019
2018
  }, props), {
@@ -2023,7 +2022,7 @@ function DialogContent(_a) {
2023
2022
  DialogPrimitive.Close,
2024
2023
  {
2025
2024
  "data-slot": "dialog-close",
2026
- className: "absolute top-4 right-4 rounded-xs opacity-70 ring-offset-prominent transition-opacity hover:opacity-100 focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-on-subtle [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
2025
+ className: "absolute top-4 right-4 rounded-xs opacity-70 ring-offset-primary-surface transition-opacity hover:opacity-100 focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-subtle [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
2027
2026
  children: [
2028
2027
  /* @__PURE__ */ jsx19(XIcon2, {}),
2029
2028
  /* @__PURE__ */ jsx19("span", { className: "sr-only", children: "Close" })
@@ -2095,7 +2094,7 @@ function DialogDescription(_a) {
2095
2094
  DialogPrimitive.Description,
2096
2095
  __spreadValues({
2097
2096
  "data-slot": "dialog-description",
2098
- className: cn("text-base text-on-subtle", className)
2097
+ className: cn("text-base text-subtle", className)
2099
2098
  }, props)
2100
2099
  );
2101
2100
  }
@@ -2113,7 +2112,7 @@ function Command(_a) {
2113
2112
  __spreadValues({
2114
2113
  "data-slot": "command",
2115
2114
  className: cn(
2116
- "flex h-full w-full flex-col overflow-hidden rounded-sm bg-popover text-popover-foreground",
2115
+ "flex h-full w-full flex-col overflow-hidden rounded-sm bg-primary-surface text-prominent",
2117
2116
  className
2118
2117
  )
2119
2118
  }, props)
@@ -2143,7 +2142,7 @@ function CommandDialog(_a) {
2143
2142
  {
2144
2143
  className: cn("overflow-hidden p-0", className),
2145
2144
  showCloseButton,
2146
- children: /* @__PURE__ */ jsx20(Command, { className: "**:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-on-subtle [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
2145
+ children: /* @__PURE__ */ jsx20(Command, { className: "**:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-subtle [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
2147
2146
  }
2148
2147
  )
2149
2148
  ] }));
@@ -2166,7 +2165,7 @@ function CommandInput(_a) {
2166
2165
  __spreadValues({
2167
2166
  "data-slot": "command-input",
2168
2167
  className: cn(
2169
- "flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden placeholder:text-on-subtle disabled:cursor-not-allowed disabled:opacity-50",
2168
+ "flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden placeholder:text-subtle disabled:cursor-not-allowed disabled:opacity-50",
2170
2169
  className
2171
2170
  )
2172
2171
  }, props)
@@ -2213,7 +2212,7 @@ function CommandGroup(_a) {
2213
2212
  __spreadValues({
2214
2213
  "data-slot": "command-group",
2215
2214
  className: cn(
2216
- "overflow-hidden p-1 text-on-prominent [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-on-subtle",
2215
+ "overflow-hidden p-1 text-prominent [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-subtle",
2217
2216
  className
2218
2217
  )
2219
2218
  }, props)
@@ -2244,7 +2243,7 @@ function CommandItem(_a) {
2244
2243
  __spreadValues({
2245
2244
  "data-slot": "command-item",
2246
2245
  className: cn(
2247
- "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 data-[selected=true]:bg-primary/10 data-[selected=true]:text-on-prominent [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-on-subtle",
2246
+ "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 data-[selected=true]:bg-primary/10 data-[selected=true]:text-prominent [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-subtle",
2248
2247
  className
2249
2248
  )
2250
2249
  }, props)
@@ -2261,7 +2260,7 @@ function CommandShortcut(_a) {
2261
2260
  __spreadValues({
2262
2261
  "data-slot": "command-shortcut",
2263
2262
  className: cn(
2264
- "ml-auto text-xs tracking-widest text-on-subtle",
2263
+ "ml-auto text-xs tracking-widest text-subtle",
2265
2264
  className
2266
2265
  )
2267
2266
  }, props)
@@ -2317,7 +2316,7 @@ function ContextMenuSubTrigger(_a) {
2317
2316
  "data-slot": "context-menu-sub-trigger",
2318
2317
  "data-inset": inset,
2319
2318
  className: cn(
2320
- "flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-accent-foreground data-[inset]:pl-8 data-[state=open]:bg-secondary-hover data-[state=open]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-on-subtle",
2319
+ "flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-accent-foreground data-[inset]:pl-8 data-[state=open]:bg-secondary-hover data-[state=open]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-subtle",
2321
2320
  className
2322
2321
  )
2323
2322
  }, props), {
@@ -2339,7 +2338,7 @@ function ContextMenuSubContent(_a) {
2339
2338
  __spreadValues({
2340
2339
  "data-slot": "context-menu-sub-content",
2341
2340
  className: cn(
2342
- "z-50 min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-md border border-border-subtle bg-popover p-1 text-popover-foreground shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
2341
+ "z-50 min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-md border border-default bg-primary-surface p-1 text-prominent shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
2343
2342
  className
2344
2343
  )
2345
2344
  }, props)
@@ -2356,7 +2355,7 @@ function ContextMenuContent(_a) {
2356
2355
  __spreadValues({
2357
2356
  "data-slot": "context-menu-content",
2358
2357
  className: cn(
2359
- "z-50 max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border border-border-subtle bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
2358
+ "z-50 max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border border-default bg-primary-surface p-1 text-prominent shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
2360
2359
  className
2361
2360
  )
2362
2361
  }, props)
@@ -2379,7 +2378,7 @@ function ContextMenuItem(_a) {
2379
2378
  "data-inset": inset,
2380
2379
  "data-variant": variant,
2381
2380
  className: cn(
2382
- "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-on-subtle data-[variant=destructive]:*:[svg]:text-destructive!",
2381
+ "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-subtle data-[variant=destructive]:*:[svg]:text-destructive!",
2383
2382
  className
2384
2383
  )
2385
2384
  }, props)
@@ -2450,7 +2449,7 @@ function ContextMenuLabel(_a) {
2450
2449
  "data-slot": "context-menu-label",
2451
2450
  "data-inset": inset,
2452
2451
  className: cn(
2453
- "px-2 py-1.5 text-sm font-medium text-on-prominent data-[inset]:pl-8",
2452
+ "px-2 py-1.5 text-sm font-medium text-prominent data-[inset]:pl-8",
2454
2453
  className
2455
2454
  )
2456
2455
  }, props)
@@ -2481,7 +2480,7 @@ function ContextMenuShortcut(_a) {
2481
2480
  __spreadValues({
2482
2481
  "data-slot": "context-menu-shortcut",
2483
2482
  className: cn(
2484
- "ml-auto text-xs tracking-widest text-on-subtle",
2483
+ "ml-auto text-xs tracking-widest text-subtle",
2485
2484
  className
2486
2485
  )
2487
2486
  }, props)
@@ -2551,16 +2550,16 @@ function DrawerContent(_a) {
2551
2550
  __spreadProps(__spreadValues({
2552
2551
  "data-slot": "drawer-content",
2553
2552
  className: cn(
2554
- "group/drawer-content fixed z-50 flex h-auto flex-col bg-prominent",
2555
- "data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=top]:border-border-subtle",
2556
- "data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=bottom]:border-border-subtle",
2557
- "data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:border-border-subtle data-[vaul-drawer-direction=right]:sm:max-w-sm",
2558
- "data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:border-border-subtle data-[vaul-drawer-direction=left]:sm:max-w-sm",
2553
+ "group/drawer-content fixed z-50 flex h-auto flex-col bg-primary-surface",
2554
+ "data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=top]:border-default",
2555
+ "data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=bottom]:border-default",
2556
+ "data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:border-default data-[vaul-drawer-direction=right]:sm:max-w-sm",
2557
+ "data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:border-default data-[vaul-drawer-direction=left]:sm:max-w-sm",
2559
2558
  className
2560
2559
  )
2561
2560
  }, props), {
2562
2561
  children: [
2563
- /* @__PURE__ */ jsx23("div", { className: "mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-subtle group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
2562
+ /* @__PURE__ */ jsx23("div", { className: "mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-secondary-surface group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
2564
2563
  children
2565
2564
  ]
2566
2565
  })
@@ -2600,7 +2599,7 @@ function DrawerTitle(_a) {
2600
2599
  DrawerPrimitive.Title,
2601
2600
  __spreadValues({
2602
2601
  "data-slot": "drawer-title",
2603
- className: cn("font-semibold font-display text-on-prominent", className)
2602
+ className: cn("font-semibold font-display text-prominent", className)
2604
2603
  }, props)
2605
2604
  );
2606
2605
  }
@@ -2614,7 +2613,7 @@ function DrawerDescription(_a) {
2614
2613
  DrawerPrimitive.Description,
2615
2614
  __spreadValues({
2616
2615
  "data-slot": "drawer-description",
2617
- className: cn("text-sm text-on-subtle", className)
2616
+ className: cn("text-sm text-subtle", className)
2618
2617
  }, props)
2619
2618
  );
2620
2619
  }
@@ -2654,7 +2653,7 @@ function DropdownMenuContent(_a) {
2654
2653
  "data-slot": "dropdown-menu-content",
2655
2654
  sideOffset,
2656
2655
  className: cn(
2657
- "z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-sm border border-border-subtle bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
2656
+ "z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-sm border border-default bg-primary-surface p-1 text-prominent shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
2658
2657
  className
2659
2658
  )
2660
2659
  }, props)
@@ -2681,7 +2680,7 @@ function DropdownMenuItem(_a) {
2681
2680
  "data-inset": inset,
2682
2681
  "data-variant": variant,
2683
2682
  className: cn(
2684
- "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-on-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-on-subtle data-[variant=destructive]:*:[svg]:text-destructive!",
2683
+ "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-subtle data-[variant=destructive]:*:[svg]:text-destructive!",
2685
2684
  className
2686
2685
  )
2687
2686
  }, props)
@@ -2702,7 +2701,7 @@ function DropdownMenuCheckboxItem(_a) {
2702
2701
  __spreadProps(__spreadValues({
2703
2702
  "data-slot": "dropdown-menu-checkbox-item",
2704
2703
  className: cn(
2705
- "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-on-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
2704
+ "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
2706
2705
  className
2707
2706
  ),
2708
2707
  checked
@@ -2736,7 +2735,7 @@ function DropdownMenuRadioItem(_a) {
2736
2735
  __spreadProps(__spreadValues({
2737
2736
  "data-slot": "dropdown-menu-radio-item",
2738
2737
  className: cn(
2739
- "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-on-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
2738
+ "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
2740
2739
  className
2741
2740
  )
2742
2741
  }, props), {
@@ -2792,7 +2791,7 @@ function DropdownMenuShortcut(_a) {
2792
2791
  __spreadValues({
2793
2792
  "data-slot": "dropdown-menu-shortcut",
2794
2793
  className: cn(
2795
- "ml-auto text-xs tracking-widest text-on-subtle",
2794
+ "ml-auto text-xs tracking-widest text-subtle",
2796
2795
  className
2797
2796
  )
2798
2797
  }, props)
@@ -2818,7 +2817,7 @@ function DropdownMenuSubTrigger(_a) {
2818
2817
  "data-slot": "dropdown-menu-sub-trigger",
2819
2818
  "data-inset": inset,
2820
2819
  className: cn(
2821
- "flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-on-prominent data-[inset]:pl-8 data-[state=open]:bg-secondary-hover data-[state=open]:text-on-prominent [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-on-subtle",
2820
+ "flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-prominent data-[inset]:pl-8 data-[state=open]:bg-secondary-hover data-[state=open]:text-prominent [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-subtle",
2822
2821
  className
2823
2822
  )
2824
2823
  }, props), {
@@ -2840,7 +2839,7 @@ function DropdownMenuSubContent(_a) {
2840
2839
  __spreadValues({
2841
2840
  "data-slot": "dropdown-menu-sub-content",
2842
2841
  className: cn(
2843
- "z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-sm border border-border-subtle bg-popover p-1 text-popover-foreground shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
2842
+ "z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-sm border border-default bg-primary-surface p-1 text-prominent shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
2844
2843
  className
2845
2844
  )
2846
2845
  }, props)
@@ -2882,7 +2881,7 @@ var emptyMediaVariants = cva5(
2882
2881
  variants: {
2883
2882
  variant: {
2884
2883
  default: "bg-transparent",
2885
- icon: "flex size-10 shrink-0 items-center justify-center rounded-lg bg-subtle text-on-prominent [&_svg:not([class*='size-'])]:size-6"
2884
+ icon: "flex size-10 shrink-0 items-center justify-center rounded-lg bg-secondary-surface text-prominent [&_svg:not([class*='size-'])]:size-6"
2886
2885
  }
2887
2886
  },
2888
2887
  defaultVariants: {
@@ -2924,7 +2923,7 @@ function EmptyDescription(_a) {
2924
2923
  __spreadValues({
2925
2924
  "data-slot": "empty-description",
2926
2925
  className: cn(
2927
- "text-sm/relaxed text-on-subtle [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
2926
+ "text-sm/relaxed text-subtle [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
2928
2927
  className
2929
2928
  )
2930
2929
  }, props)
@@ -3140,7 +3139,7 @@ function FieldDescription(_a) {
3140
3139
  __spreadValues({
3141
3140
  "data-slot": "field-description",
3142
3141
  className: cn(
3143
- "text-sm leading-normal font-normal text-on-subtle group-has-[[data-orientation=horizontal]]/field:text-balance",
3142
+ "text-sm leading-normal font-normal text-subtle group-has-[[data-orientation=horizontal]]/field:text-balance",
3144
3143
  "last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5",
3145
3144
  "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
3146
3145
  className
@@ -3171,7 +3170,7 @@ function FieldSeparator(_a) {
3171
3170
  children && /* @__PURE__ */ jsx28(
3172
3171
  "span",
3173
3172
  {
3174
- className: "relative mx-auto block w-fit bg-prominent px-2 text-on-subtle",
3173
+ className: "relative mx-auto block w-fit bg-primary-surface px-2 text-subtle",
3175
3174
  "data-slot": "field-separator-content",
3176
3175
  children
3177
3176
  }
@@ -3311,7 +3310,7 @@ function FormDescription(_a) {
3311
3310
  __spreadValues({
3312
3311
  "data-slot": "form-description",
3313
3312
  id: formDescriptionId,
3314
- className: cn("text-sm text-on-subtle", className)
3313
+ className: cn("text-sm text-subtle", className)
3315
3314
  }, props)
3316
3315
  );
3317
3316
  }
@@ -3363,7 +3362,7 @@ function HoverCardContent(_a) {
3363
3362
  align,
3364
3363
  sideOffset,
3365
3364
  className: cn(
3366
- "z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border border-border-subtle bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
3365
+ "z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border border-default bg-primary-surface p-4 text-prominent shadow-md outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
3367
3366
  className
3368
3367
  )
3369
3368
  }, props)
@@ -3422,7 +3421,7 @@ function InputOTPSlot(_a) {
3422
3421
  "data-slot": "input-otp-slot",
3423
3422
  "data-active": isActive,
3424
3423
  className: cn(
3425
- "relative flex h-9 w-9 items-center justify-center border border-border-subtle bg-white/5 text-sm font-body text-on-prominent shadow-xs transition-[color,box-shadow] outline-none first:rounded-l-sm last:rounded-r-sm aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[active=true]:z-10 data-[active=true]:border-primary data-[active=true]:ring-[3px] data-[active=true]:ring-primary/[0.08] data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20",
3424
+ "relative flex h-9 w-9 items-center justify-center border border-default bg-white/5 text-sm font-body text-prominent shadow-xs transition-[color,box-shadow] outline-none first:rounded-l-sm last:rounded-r-sm aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[active=true]:z-10 data-[active=true]:border-primary data-[active=true]:ring-[3px] data-[active=true]:ring-primary/[0.08] data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20",
3426
3425
  className
3427
3426
  )
3428
3427
  }, props), {
@@ -3473,9 +3472,9 @@ var itemVariants = cva7(
3473
3472
  {
3474
3473
  variants: {
3475
3474
  variant: {
3476
- default: "bg-transparent",
3477
- outline: "border-border-subtle text-on-prominent hover:bg-secondary-hover",
3478
- muted: "bg-subtle/50"
3475
+ default: "bg-[var(--list-item-primary-bg-default)] hover:bg-[var(--list-item-primary-bg-hover)] active:bg-[var(--list-item-primary-bg-pressed)]",
3476
+ outline: "border-[var(--list-item-border-selected)] text-[var(--list-item-text-prominent)] hover:bg-[var(--list-item-primary-bg-hover)] active:bg-[var(--list-item-primary-bg-pressed)]",
3477
+ muted: "bg-[var(--list-item-secondary-bg-default)] hover:bg-[var(--list-item-secondary-bg-hover)] active:bg-[var(--list-item-secondary-bg-pressed)]"
3479
3478
  },
3480
3479
  size: {
3481
3480
  default: "gap-4 p-4",
@@ -3517,7 +3516,7 @@ var itemMediaVariants = cva7(
3517
3516
  variants: {
3518
3517
  variant: {
3519
3518
  default: "bg-transparent",
3520
- icon: "size-8 rounded-sm border bg-subtle [&_svg:not([class*='size-'])]:size-4",
3519
+ icon: "size-8 rounded-sm border bg-secondary-surface [&_svg:not([class*='size-'])]:size-4",
3521
3520
  image: "size-10 overflow-hidden rounded-sm [&_img]:size-full [&_img]:object-cover"
3522
3521
  }
3523
3522
  },
@@ -3563,7 +3562,7 @@ function ItemTitle(_a) {
3563
3562
  __spreadValues({
3564
3563
  "data-slot": "item-title",
3565
3564
  className: cn(
3566
- "flex w-fit items-center gap-2 text-sm leading-snug font-medium",
3565
+ "flex w-fit items-center gap-2 text-sm leading-snug font-medium text-[var(--list-item-text-prominent)]",
3567
3566
  className
3568
3567
  )
3569
3568
  }, props)
@@ -3576,7 +3575,7 @@ function ItemDescription(_a) {
3576
3575
  __spreadValues({
3577
3576
  "data-slot": "item-description",
3578
3577
  className: cn(
3579
- "line-clamp-2 text-sm leading-normal font-normal text-balance text-on-subtle",
3578
+ "line-clamp-2 text-sm leading-normal font-normal text-balance text-subtle",
3580
3579
  "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
3581
3580
  className
3582
3581
  )
@@ -3629,9 +3628,9 @@ function Kbd(_a) {
3629
3628
  __spreadValues({
3630
3629
  "data-slot": "kbd",
3631
3630
  className: cn(
3632
- "pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm bg-subtle px-1 font-sans text-xs font-medium text-on-subtle select-none",
3631
+ "pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm bg-secondary-surface px-1 font-sans text-xs font-medium text-subtle select-none",
3633
3632
  "[&_svg:not([class*='size-'])]:size-3",
3634
- "[[data-slot=tooltip-content]_&]:bg-border [[data-slot=tooltip-content]_&]:text-on-prominent",
3633
+ "[[data-slot=tooltip-content]_&]:bg-border [[data-slot=tooltip-content]_&]:text-prominent",
3635
3634
  className
3636
3635
  )
3637
3636
  }, props)
@@ -3653,7 +3652,7 @@ import { cva as cva8 } from "class-variance-authority";
3653
3652
  import { Slot as Slot6 } from "radix-ui";
3654
3653
  import { jsx as jsx34 } from "react/jsx-runtime";
3655
3654
  var linkVariants = cva8(
3656
- "inline-flex shrink-0 items-center gap-1.5 whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 active:opacity-60 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:inline font-display font-bold normal-case tracking-wide text-primary hover:underline decoration-2 underline-offset-4",
3655
+ "inline-flex shrink-0 items-center gap-1.5 whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 active:opacity-60 disabled:pointer-events-none disabled:text-[var(--link-primary-disabled)] disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:inline font-display font-bold normal-case tracking-wide text-[var(--link-primary-default)] hover:underline decoration-2 underline-offset-4",
3657
3656
  {
3658
3657
  variants: {
3659
3658
  size: {
@@ -3703,7 +3702,7 @@ function Menubar(_a) {
3703
3702
  __spreadValues({
3704
3703
  "data-slot": "menubar",
3705
3704
  className: cn(
3706
- "flex h-9 items-center gap-1 rounded-md border border-border-subtle bg-prominent p-1 shadow-xs",
3705
+ "flex h-9 items-center gap-1 rounded-md border border-default bg-primary-surface p-1 shadow-xs",
3707
3706
  className
3708
3707
  )
3709
3708
  }, props)
@@ -3736,7 +3735,7 @@ function MenubarTrigger(_a) {
3736
3735
  __spreadValues({
3737
3736
  "data-slot": "menubar-trigger",
3738
3737
  className: cn(
3739
- "flex items-center rounded-sm px-2 py-1 text-sm font-medium outline-hidden select-none hover:bg-secondary-hover hover:text-on-prominent focus:bg-secondary-hover focus:text-on-prominent data-[state=open]:bg-secondary-hover data-[state=open]:text-primary",
3738
+ "flex items-center rounded-sm px-2 py-1 text-sm font-medium outline-hidden select-none hover:bg-secondary-hover hover:text-prominent focus:bg-secondary-hover focus:text-prominent data-[state=open]:bg-secondary-hover data-[state=open]:text-primary",
3740
3739
  className
3741
3740
  )
3742
3741
  }, props)
@@ -3762,7 +3761,7 @@ function MenubarContent(_a) {
3762
3761
  alignOffset,
3763
3762
  sideOffset,
3764
3763
  className: cn(
3765
- "z-50 min-w-[12rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border border-border-subtle bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
3764
+ "z-50 min-w-[12rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border border-default bg-primary-surface p-1 text-prominent shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
3766
3765
  className
3767
3766
  )
3768
3767
  }, props)
@@ -3785,7 +3784,7 @@ function MenubarItem(_a) {
3785
3784
  "data-inset": inset,
3786
3785
  "data-variant": variant,
3787
3786
  className: cn(
3788
- "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none hover:bg-secondary-hover hover:text-on-prominent focus:bg-secondary-hover focus:text-on-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-on-subtle data-[variant=destructive]:*:[svg]:text-destructive!",
3787
+ "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none hover:bg-secondary-hover hover:text-prominent focus:bg-secondary-hover focus:text-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-subtle data-[variant=destructive]:*:[svg]:text-destructive!",
3789
3788
  className
3790
3789
  )
3791
3790
  }, props)
@@ -3806,7 +3805,7 @@ function MenubarCheckboxItem(_a) {
3806
3805
  __spreadProps(__spreadValues({
3807
3806
  "data-slot": "menubar-checkbox-item",
3808
3807
  className: cn(
3809
- "relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none hover:bg-secondary-hover hover:text-on-prominent focus:bg-secondary-hover focus:text-on-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
3808
+ "relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none hover:bg-secondary-hover hover:text-prominent focus:bg-secondary-hover focus:text-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
3810
3809
  className
3811
3810
  ),
3812
3811
  checked
@@ -3831,7 +3830,7 @@ function MenubarRadioItem(_a) {
3831
3830
  __spreadProps(__spreadValues({
3832
3831
  "data-slot": "menubar-radio-item",
3833
3832
  className: cn(
3834
- "relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none hover:bg-secondary-hover hover:text-on-prominent focus:bg-secondary-hover focus:text-on-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
3833
+ "relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none hover:bg-secondary-hover hover:text-prominent focus:bg-secondary-hover focus:text-prominent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
3835
3834
  className
3836
3835
  )
3837
3836
  }, props), {
@@ -3887,7 +3886,7 @@ function MenubarShortcut(_a) {
3887
3886
  __spreadValues({
3888
3887
  "data-slot": "menubar-shortcut",
3889
3888
  className: cn(
3890
- "ml-auto text-xs tracking-widest text-on-subtle",
3889
+ "ml-auto text-xs tracking-widest text-subtle",
3891
3890
  className
3892
3891
  )
3893
3892
  }, props)
@@ -3913,7 +3912,7 @@ function MenubarSubTrigger(_a) {
3913
3912
  "data-slot": "menubar-sub-trigger",
3914
3913
  "data-inset": inset,
3915
3914
  className: cn(
3916
- "flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none hover:bg-secondary-hover hover:text-on-prominent focus:bg-secondary-hover focus:text-on-prominent data-[inset]:pl-8 data-[state=open]:bg-secondary-hover data-[state=open]:text-on-prominent",
3915
+ "flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none hover:bg-secondary-hover hover:text-prominent focus:bg-secondary-hover focus:text-prominent data-[inset]:pl-8 data-[state=open]:bg-secondary-hover data-[state=open]:text-prominent",
3917
3916
  className
3918
3917
  )
3919
3918
  }, props), {
@@ -3935,7 +3934,7 @@ function MenubarSubContent(_a) {
3935
3934
  __spreadValues({
3936
3935
  "data-slot": "menubar-sub-content",
3937
3936
  className: cn(
3938
- "z-50 min-w-[8rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border border-border-subtle bg-popover p-1 text-popover-foreground shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
3937
+ "z-50 min-w-[8rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border border-default bg-primary-surface p-1 text-prominent shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
3939
3938
  className
3940
3939
  )
3941
3940
  }, props)
@@ -3965,7 +3964,7 @@ function NativeSelect(_a) {
3965
3964
  "data-slot": "native-select",
3966
3965
  "data-size": size,
3967
3966
  className: cn(
3968
- "h-9 w-full min-w-0 appearance-none rounded-md border border-input bg-transparent px-3 py-2 pr-9 text-sm shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-on-prominent-static-inverse placeholder:text-on-subtle disabled:pointer-events-none disabled:cursor-not-allowed data-[size=sm]:h-8 data-[size=sm]:py-1",
3967
+ "h-9 w-full min-w-0 appearance-none rounded-md border border-input bg-transparent px-3 py-2 pr-9 text-sm shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-prominent-static-inverse placeholder:text-subtle disabled:pointer-events-none disabled:cursor-not-allowed data-[size=sm]:h-8 data-[size=sm]:py-1",
3969
3968
  "focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50",
3970
3969
  className
3971
3970
  )
@@ -3974,7 +3973,7 @@ function NativeSelect(_a) {
3974
3973
  /* @__PURE__ */ jsx36(
3975
3974
  ChevronDownIcon4,
3976
3975
  {
3977
- className: "pointer-events-none absolute top-1/2 right-3.5 size-4 -translate-y-1/2 text-on-subtle opacity-50 select-none",
3976
+ className: "pointer-events-none absolute top-1/2 right-3.5 size-4 -translate-y-1/2 text-subtle opacity-50 select-none",
3978
3977
  "aria-hidden": "true",
3979
3978
  "data-slot": "native-select-icon"
3980
3979
  }
@@ -4066,7 +4065,7 @@ function NavigationMenuItem(_a) {
4066
4065
  );
4067
4066
  }
4068
4067
  var navigationMenuTriggerStyle = cva9(
4069
- "group inline-flex h-9 w-max items-center justify-center rounded-md bg-prominent px-4 py-2 text-sm font-medium transition-[color,box-shadow] outline-none hover:bg-secondary-hover hover:text-on-prominent focus:bg-secondary-hover focus:text-on-prominent focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-secondary-hover data-[state=open]:text-on-prominent data-[state=open]:hover:bg-secondary-hover data-[state=open]:focus:bg-secondary-hover"
4068
+ "group inline-flex h-9 w-max items-center justify-center rounded-md bg-primary-surface px-4 py-2 text-sm font-medium transition-[color,box-shadow] outline-none hover:bg-secondary-hover hover:text-prominent focus:bg-secondary-hover focus:text-prominent focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-secondary-hover data-[state=open]:text-prominent data-[state=open]:hover:bg-secondary-hover data-[state=open]:focus:bg-secondary-hover"
4070
4069
  );
4071
4070
  function NavigationMenuTrigger(_a) {
4072
4071
  var _b = _a, {
@@ -4108,7 +4107,7 @@ function NavigationMenuContent(_a) {
4108
4107
  "data-slot": "navigation-menu-content",
4109
4108
  className: cn(
4110
4109
  "top-0 left-0 w-full p-2 pr-2.5 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out md:absolute md:w-auto",
4111
- "group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:border-border-subtle group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-base **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95",
4110
+ "group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:border-default group-data-[viewport=false]/navigation-menu:bg-primary-surface group-data-[viewport=false]/navigation-menu:text-prominent group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-base **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95",
4112
4111
  className
4113
4112
  )
4114
4113
  }, props)
@@ -4131,7 +4130,7 @@ function NavigationMenuViewport(_a) {
4131
4130
  __spreadValues({
4132
4131
  "data-slot": "navigation-menu-viewport",
4133
4132
  className: cn(
4134
- "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border border-border-subtle bg-popover text-popover-foreground shadow data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",
4133
+ "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border border-default bg-primary-surface text-prominent shadow data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",
4135
4134
  className
4136
4135
  )
4137
4136
  }, props)
@@ -4150,7 +4149,7 @@ function NavigationMenuLink(_a) {
4150
4149
  __spreadValues({
4151
4150
  "data-slot": "navigation-menu-link",
4152
4151
  className: cn(
4153
- "flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none hover:bg-secondary-hover hover:text-on-prominent focus:bg-secondary-hover focus:text-on-prominent focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 data-[active=true]:bg-secondary-hover data-[active=true]:text-primary data-[active=true]:hover:bg-secondary-hover data-[active=true]:focus:bg-secondary-hover [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-on-subtle",
4152
+ "flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none hover:bg-secondary-hover hover:text-prominent focus:bg-secondary-hover focus:text-prominent focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 data-[active=true]:bg-secondary-hover data-[active=true]:text-primary data-[active=true]:hover:bg-secondary-hover data-[active=true]:focus:bg-secondary-hover [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-subtle",
4154
4153
  className
4155
4154
  )
4156
4155
  }, props)
@@ -4231,7 +4230,7 @@ function PaginationLink(_a) {
4231
4230
  "data-active": isActive,
4232
4231
  className: cn(
4233
4232
  "inline-flex shrink-0 items-center justify-center size-10 rounded-xs text-sm font-display font-bold uppercase tracking-wide whitespace-nowrap transition-[color,background-color,border-color] outline-none border",
4234
- isActive ? "bg-primary/10 border-primary text-primary" : "bg-transparent border-transparent text-on-prominent hover:bg-secondary-hover",
4233
+ isActive ? "bg-[var(--pagination-bg-number-selected)] border-[var(--pagination-border-number-selected)] text-[var(--pagination-text-default)]" : "bg-[var(--pagination-bg-number-default)] border-transparent text-[var(--pagination-text-default)] hover:bg-[var(--pagination-bg-number-hover)] active:bg-[var(--pagination-bg-number-pressed)]",
4235
4234
  className
4236
4235
  )
4237
4236
  }, props)
@@ -4302,7 +4301,7 @@ function PopoverContent(_a) {
4302
4301
  align,
4303
4302
  sideOffset,
4304
4303
  className: cn(
4305
- "z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border border-border-subtle bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
4304
+ "z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border border-default bg-primary-surface p-4 text-prominent shadow-md outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
4306
4305
  className
4307
4306
  )
4308
4307
  }, props)
@@ -4342,7 +4341,7 @@ function PopoverDescription(_a) {
4342
4341
  "p",
4343
4342
  __spreadValues({
4344
4343
  "data-slot": "popover-description",
4345
- className: cn("text-on-subtle", className)
4344
+ className: cn("text-subtle", className)
4346
4345
  }, props)
4347
4346
  );
4348
4347
  }
@@ -4363,7 +4362,7 @@ function Progress(_a) {
4363
4362
  __spreadProps(__spreadValues({
4364
4363
  "data-slot": "progress",
4365
4364
  className: cn(
4366
- "relative h-2 w-full overflow-hidden rounded-2xs bg-primary/20",
4365
+ "relative h-2 w-full overflow-hidden rounded-2xs bg-[var(--progress-bar-bg-normal-track-default)]",
4367
4366
  className
4368
4367
  )
4369
4368
  }, props), {
@@ -4371,7 +4370,7 @@ function Progress(_a) {
4371
4370
  ProgressPrimitive.Indicator,
4372
4371
  {
4373
4372
  "data-slot": "progress-indicator",
4374
- className: "h-full w-full flex-1 bg-primary transition-all",
4373
+ className: "h-full w-full flex-1 bg-[var(--progress-bar-bg-normal-progress-default)] transition-all",
4375
4374
  style: { transform: `translateX(-${100 - (value || 0)}%)` }
4376
4375
  }
4377
4376
  )
@@ -4570,7 +4569,7 @@ function SelectTrigger(_a) {
4570
4569
  "data-readonly": readOnly ? "" : void 0,
4571
4570
  disabled: readOnly || props.disabled,
4572
4571
  className: cn(
4573
- "flex w-fit items-center justify-between gap-2 rounded-sm border border-input bg-prominent appearance-none px-3 py-2 text-sm whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[placeholder]:text-on-subtle data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-on-subtle data-[readonly]:cursor-default data-[readonly]:opacity-100",
4572
+ "flex w-fit items-center justify-between gap-2 rounded-sm border border-[var(--dropdown-field-outline-border-default)] bg-[var(--dropdown-field-outline-bg-default)] appearance-none px-3 py-2 text-sm text-[var(--dropdown-field-text-prominent)] whitespace-nowrap transition-[color,box-shadow] outline-none hover:bg-[var(--dropdown-field-outline-bg-hover)] focus-visible:bg-[var(--dropdown-field-outline-bg-focus)] focus-visible:border-[var(--dropdown-field-outline-border-focus)] focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[placeholder]:text-[var(--dropdown-field-text-subtle)] data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-[var(--dropdown-field-text-subtle)] data-[readonly]:cursor-default data-[readonly]:opacity-100",
4574
4573
  className
4575
4574
  )
4576
4575
  }, props), {
@@ -4598,7 +4597,7 @@ function SelectContent(_a) {
4598
4597
  __spreadProps(__spreadValues({
4599
4598
  "data-slot": "select-content",
4600
4599
  className: cn(
4601
- "relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-sm border border-border-subtle bg-popover text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
4600
+ "relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-sm border border-[var(--menu-border)] bg-[var(--menu-background)] text-[var(--dropdown-field-text-prominent)] shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
4602
4601
  position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
4603
4602
  className
4604
4603
  ),
@@ -4632,7 +4631,7 @@ function SelectLabel(_a) {
4632
4631
  SelectPrimitive.Label,
4633
4632
  __spreadValues({
4634
4633
  "data-slot": "select-label",
4635
- className: cn("px-2 py-1.5 text-xs text-on-subtle", className)
4634
+ className: cn("px-2 py-1.5 text-xs text-subtle", className)
4636
4635
  }, props)
4637
4636
  );
4638
4637
  }
@@ -4649,7 +4648,7 @@ function SelectItem(_a) {
4649
4648
  __spreadProps(__spreadValues({
4650
4649
  "data-slot": "select-item",
4651
4650
  className: cn(
4652
- "relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-on-prominent data-[state=checked]:text-primary data-[state=checked]:font-medium data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-on-subtle *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
4651
+ "relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none focus:bg-secondary-hover focus:text-prominent data-[state=checked]:text-primary data-[state=checked]:font-medium data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-subtle *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
4653
4652
  className
4654
4653
  )
4655
4654
  }, props), {
@@ -4776,11 +4775,11 @@ function SheetContent(_a) {
4776
4775
  __spreadProps(__spreadValues({
4777
4776
  "data-slot": "sheet-content",
4778
4777
  className: cn(
4779
- "fixed z-50 flex flex-col gap-4 bg-prominent shadow-lg transition ease-standard data-[state=closed]:animate-out data-[state=closed]:duration-slow data-[state=open]:animate-in data-[state=open]:duration-open",
4780
- side === "right" && "inset-y-0 right-0 h-full w-3/4 border-l border-border-subtle data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
4781
- side === "left" && "inset-y-0 left-0 h-full w-3/4 border-r border-border-subtle data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
4782
- side === "top" && "inset-x-0 top-0 h-auto border-b border-border-subtle data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
4783
- side === "bottom" && "inset-x-0 bottom-0 h-auto border-t border-border-subtle data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
4778
+ "fixed z-50 flex flex-col gap-4 bg-primary-surface shadow-lg transition ease-standard data-[state=closed]:animate-out data-[state=closed]:duration-slow data-[state=open]:animate-in data-[state=open]:duration-open",
4779
+ side === "right" && "inset-y-0 right-0 h-full w-3/4 border-l border-default data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
4780
+ side === "left" && "inset-y-0 left-0 h-full w-3/4 border-r border-default data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
4781
+ side === "top" && "inset-x-0 top-0 h-auto border-b border-default data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
4782
+ side === "bottom" && "inset-x-0 bottom-0 h-auto border-t border-default data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
4784
4783
  className
4785
4784
  )
4786
4785
  }, props), {
@@ -4825,7 +4824,7 @@ function SheetTitle(_a) {
4825
4824
  SheetPrimitive.Title,
4826
4825
  __spreadValues({
4827
4826
  "data-slot": "sheet-title",
4828
- className: cn("font-semibold text-on-prominent", className)
4827
+ className: cn("font-semibold text-prominent", className)
4829
4828
  }, props)
4830
4829
  );
4831
4830
  }
@@ -4839,7 +4838,7 @@ function SheetDescription(_a) {
4839
4838
  SheetPrimitive.Description,
4840
4839
  __spreadValues({
4841
4840
  "data-slot": "sheet-description",
4842
- className: cn("text-sm text-on-subtle", className)
4841
+ className: cn("text-sm text-subtle", className)
4843
4842
  }, props)
4844
4843
  );
4845
4844
  }
@@ -4875,7 +4874,7 @@ function Skeleton(_a) {
4875
4874
  "div",
4876
4875
  __spreadValues({
4877
4876
  "data-slot": "skeleton",
4878
- className: cn("animate-pulse rounded-md bg-subtle", className)
4877
+ className: cn("animate-pulse rounded-md bg-secondary-surface", className)
4879
4878
  }, props)
4880
4879
  );
4881
4880
  }
@@ -4921,13 +4920,13 @@ function TooltipContent(_a) {
4921
4920
  "data-slot": "tooltip-content",
4922
4921
  sideOffset,
4923
4922
  className: cn(
4924
- "z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-md bg-primary border-0 px-3 py-1.5 text-xs font-medium text-balance text-on-prominent-static-inverse fade-in-0 zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
4923
+ "z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-md bg-[var(--tooltip-bg-default)] border-0 px-3 py-1.5 text-xs font-medium text-balance text-[var(--tooltip-text-default)] fade-in-0 zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
4925
4924
  className
4926
4925
  )
4927
4926
  }, props), {
4928
4927
  children: [
4929
4928
  children,
4930
- /* @__PURE__ */ jsx47(TooltipPrimitive.Arrow, { className: "fill-primary" })
4929
+ /* @__PURE__ */ jsx47(TooltipPrimitive.Arrow, { className: "fill-[var(--tooltip-bg-default)]" })
4931
4930
  ]
4932
4931
  })
4933
4932
  ) });
@@ -5184,7 +5183,7 @@ function SidebarInset(_a) {
5184
5183
  __spreadValues({
5185
5184
  "data-slot": "sidebar-inset",
5186
5185
  className: cn(
5187
- "relative flex w-full flex-1 flex-col bg-prominent",
5186
+ "relative flex w-full flex-1 flex-col bg-primary-surface",
5188
5187
  "md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2",
5189
5188
  className
5190
5189
  )
@@ -5202,7 +5201,7 @@ function SidebarInput(_a) {
5202
5201
  __spreadValues({
5203
5202
  "data-slot": "sidebar-input",
5204
5203
  "data-sidebar": "input",
5205
- className: cn("h-8 w-full bg-prominent shadow-none", className)
5204
+ className: cn("h-8 w-full bg-primary-surface shadow-none", className)
5206
5205
  }, props)
5207
5206
  );
5208
5207
  }
@@ -5357,7 +5356,7 @@ var sidebarMenuButtonVariants = cva10(
5357
5356
  variants: {
5358
5357
  variant: {
5359
5358
  default: "",
5360
- outline: "bg-prominent ring-1 ring-sidebar-border hover:ring-primary/40 data-[active=true]:ring-primary/40"
5359
+ outline: "bg-primary-surface ring-1 ring-sidebar-border hover:ring-primary/40 data-[active=true]:ring-primary/40"
5361
5360
  },
5362
5361
  size: {
5363
5362
  default: "h-8 text-sm",
@@ -5613,7 +5612,7 @@ function Slider(_a) {
5613
5612
  {
5614
5613
  "data-slot": "slider-track",
5615
5614
  className: cn(
5616
- "relative grow overflow-hidden rounded-full bg-subtle data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
5615
+ "relative grow overflow-hidden rounded-full bg-secondary-surface data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
5617
5616
  ),
5618
5617
  children: /* @__PURE__ */ jsx49(
5619
5618
  SliderPrimitive.Range,
@@ -5666,10 +5665,12 @@ var Toaster = (_a) => {
5666
5665
  loading: /* @__PURE__ */ jsx50(Loader2Icon, { className: "size-4 animate-spin" })
5667
5666
  },
5668
5667
  style: {
5669
- "--normal-bg": "var(--popover)",
5670
- "--normal-text": "var(--popover-foreground)",
5668
+ "--normal-bg": "var(--snackbar-bg-default)",
5669
+ "--normal-text": "var(--snackbar-text)",
5671
5670
  "--normal-border": "var(--border)",
5672
- "--border-radius": "var(--radius)"
5671
+ "--border-radius": "var(--radius)",
5672
+ "--error-bg": "var(--snackbar-bg-fail)",
5673
+ "--error-text": "var(--snackbar-text-fail)"
5673
5674
  }
5674
5675
  }, props)
5675
5676
  );
@@ -5849,7 +5850,7 @@ function Spinner(_a) {
5849
5850
  width: "12%",
5850
5851
  height: "30%",
5851
5852
  borderRadius: "9999px",
5852
- backgroundColor: "currentColor",
5853
+ backgroundColor: "var(--loading-spinner-bg-default)",
5853
5854
  transformOrigin: "50% 167%",
5854
5855
  transform: `translateX(-50%) rotate(${i * 45}deg)`,
5855
5856
  animation: `spinner-fade 0.8s linear ${i * 0.8 / PILL_COUNT}s infinite`
@@ -5942,7 +5943,7 @@ function TableFooter(_a) {
5942
5943
  __spreadValues({
5943
5944
  "data-slot": "table-footer",
5944
5945
  className: cn(
5945
- "border-t bg-subtle/50 font-medium [&>tr]:last:border-b-0",
5946
+ "border-t bg-secondary-surface/50 font-medium [&>tr]:last:border-b-0",
5946
5947
  className
5947
5948
  )
5948
5949
  }, props)
@@ -5955,7 +5956,7 @@ function TableRow(_a) {
5955
5956
  __spreadValues({
5956
5957
  "data-slot": "table-row",
5957
5958
  className: cn(
5958
- "border-b transition-colors hover:bg-subtle/50 data-[state=selected]:bg-subtle",
5959
+ "border-b transition-colors hover:bg-secondary-surface/50 data-[state=selected]:bg-secondary-surface",
5959
5960
  className
5960
5961
  )
5961
5962
  }, props)
@@ -5968,7 +5969,7 @@ function TableHead(_a) {
5968
5969
  __spreadValues({
5969
5970
  "data-slot": "table-head",
5970
5971
  className: cn(
5971
- "h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-on-prominent [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
5972
+ "h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-prominent [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
5972
5973
  className
5973
5974
  )
5974
5975
  }, props)
@@ -5997,7 +5998,7 @@ function TableCaption(_a) {
5997
5998
  "caption",
5998
5999
  __spreadValues({
5999
6000
  "data-slot": "table-caption",
6000
- className: cn("mt-4 text-sm text-on-subtle", className)
6001
+ className: cn("mt-4 text-sm text-subtle", className)
6001
6002
  }, props)
6002
6003
  );
6003
6004
  }
@@ -6028,7 +6029,7 @@ function Tabs(_a) {
6028
6029
  );
6029
6030
  }
6030
6031
  var tabsListVariants = cva11(
6031
- "group/tabs-list inline-flex w-fit items-center justify-center text-on-subtle group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none has-[[data-icon-position=top]]:h-auto",
6032
+ "group/tabs-list inline-flex w-fit items-center justify-center text-subtle group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none has-[[data-icon-position=top]]:h-auto",
6032
6033
  {
6033
6034
  variants: {
6034
6035
  variant: {
@@ -6063,7 +6064,7 @@ function TabsList(_a) {
6063
6064
  "data-slot": "tabs-list",
6064
6065
  "data-variant": variant,
6065
6066
  "data-size": size,
6066
- className: cn(tabsListVariants({ variant, size }), className)
6067
+ className: cn(tabsListVariants({ variant, size }), "text-[var(--tab-text-default)]", className)
6067
6068
  }, props)
6068
6069
  );
6069
6070
  }
@@ -6081,11 +6082,11 @@ function TabsTrigger(_a) {
6081
6082
  "data-slot": "tabs-trigger",
6082
6083
  "data-icon-position": iconPosition,
6083
6084
  className: cn(
6084
- "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-3 py-1 text-sm font-normal whitespace-nowrap text-on-prominent/60 transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:bg-secondary-hover hover:text-on-prominent focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-none group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
6085
+ "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-3 py-1 text-sm font-normal whitespace-nowrap text-[var(--tab-text-default)] transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:bg-[var(--tab-bg-hover)] focus-visible:border-[var(--tab-border-focus)] focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:text-[var(--tab-text-disabled)] disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-none group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
6085
6086
  "group-data-[size=sm]/tabs-list:gap-1 group-data-[size=sm]/tabs-list:rounded-sm group-data-[size=sm]/tabs-list:px-2 group-data-[size=sm]/tabs-list:text-xs",
6086
6087
  "group-data-[size=lg]/tabs-list:gap-2 group-data-[size=lg]/tabs-list:rounded-lg group-data-[size=lg]/tabs-list:px-4 group-data-[size=lg]/tabs-list:text-base",
6087
6088
  "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:hover:bg-transparent group-data-[variant=line]/tabs-list:hover:text-primary group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent",
6088
- "data-[state=active]:bg-tabs-active data-[state=active]:border-transparent data-[state=active]:text-primary data-[state=active]:font-semibold",
6089
+ "data-[state=active]:bg-tabs-active data-[state=active]:border-transparent data-[state=active]:text-[var(--tab-text-selected)] data-[state=active]:font-semibold",
6089
6090
  "after:absolute after:bg-primary after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100",
6090
6091
  iconPosition === "top" && "h-auto flex-col gap-1 py-2",
6091
6092
  iconPosition === "top" && "group-data-[size=sm]/tabs-list:gap-0.5 group-data-[size=sm]/tabs-list:py-1.5",
@@ -6129,28 +6130,28 @@ function TicketCard({
6129
6130
  "data-slot": "ticket-card",
6130
6131
  className: cn(
6131
6132
  "relative flex w-full items-stretch rounded-sm",
6132
- "bg-subtle",
6133
+ "bg-secondary-surface",
6133
6134
  className
6134
6135
  ),
6135
6136
  children: [
6136
6137
  /* @__PURE__ */ jsxs26("div", { className: "relative flex min-w-0 flex-1 items-center gap-3 px-4 py-4 sm:gap-4 sm:px-5", children: [
6137
6138
  icon && /* @__PURE__ */ jsx56("div", { className: "flex shrink-0 size-11 rounded-full border-2 border-primary items-center justify-center text-primary sm:size-12", children: icon }),
6138
6139
  /* @__PURE__ */ jsxs26("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5 overflow-hidden", children: [
6139
- label && /* @__PURE__ */ jsx56("span", { className: "text-on-subtle uppercase tracking-widest text-xs font-semibold", children: label }),
6140
- value && /* @__PURE__ */ jsx56("span", { className: "truncate text-lg font-bold text-on-prominent sm:text-xl", children: value })
6140
+ label && /* @__PURE__ */ jsx56("span", { className: "text-subtle uppercase tracking-widest text-xs font-semibold", children: label }),
6141
+ value && /* @__PURE__ */ jsx56("span", { className: "truncate text-lg font-bold text-prominent sm:text-xl", children: value })
6141
6142
  ] }),
6142
6143
  /* @__PURE__ */ jsx56(
6143
6144
  "div",
6144
6145
  {
6145
6146
  "aria-hidden": true,
6146
- className: "pointer-events-none absolute right-0 top-0 z-10 size-5 -translate-y-1/2 translate-x-1/2 rounded-full bg-prominent"
6147
+ className: "pointer-events-none absolute right-0 top-0 z-10 size-5 -translate-y-1/2 translate-x-1/2 rounded-full bg-primary-surface"
6147
6148
  }
6148
6149
  ),
6149
6150
  /* @__PURE__ */ jsx56(
6150
6151
  "div",
6151
6152
  {
6152
6153
  "aria-hidden": true,
6153
- className: "pointer-events-none absolute bottom-0 right-0 z-10 size-5 translate-x-1/2 translate-y-1/2 rounded-full bg-prominent"
6154
+ className: "pointer-events-none absolute bottom-0 right-0 z-10 size-5 translate-x-1/2 translate-y-1/2 rounded-full bg-primary-surface"
6154
6155
  }
6155
6156
  ),
6156
6157
  /* @__PURE__ */ jsx56(
@@ -6189,8 +6190,8 @@ function TicketCard({
6189
6190
  }
6190
6191
  }
6191
6192
  ),
6192
- stubIcon != null ? stubIcon : /* @__PURE__ */ jsx56(ArrowRight2, { className: "relative size-5 shrink-0 text-on-prominent-static-inverse" }),
6193
- stubLabel && /* @__PURE__ */ jsx56("span", { className: "max-w-full text-balance text-center text-xs font-bold uppercase leading-tight tracking-wide text-on-prominent-static-inverse sm:tracking-widest", children: stubLabel })
6193
+ stubIcon != null ? stubIcon : /* @__PURE__ */ jsx56(ArrowRight2, { className: "relative size-5 shrink-0 text-prominent-static-inverse" }),
6194
+ stubLabel && /* @__PURE__ */ jsx56("span", { className: "max-w-full text-balance text-center text-xs font-bold uppercase leading-tight tracking-wide text-prominent-static-inverse sm:tracking-widest", children: stubLabel })
6194
6195
  ]
6195
6196
  }
6196
6197
  )
@@ -6206,12 +6207,12 @@ import { cva as cva12 } from "class-variance-authority";
6206
6207
  import { Toggle as TogglePrimitive } from "radix-ui";
6207
6208
  import { jsx as jsx57 } from "react/jsx-runtime";
6208
6209
  var toggleVariants = cva12(
6209
- "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-[color,box-shadow] outline-none hover:bg-secondary-hover hover:text-on-prominent focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=on]:bg-secondary-hover data-[state=on]:border-transparent data-[state=on]:text-primary [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
6210
+ "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-[color,box-shadow] outline-none hover:bg-secondary-hover hover:text-prominent focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=on]:bg-secondary-hover data-[state=on]:border-transparent data-[state=on]:text-primary [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
6210
6211
  {
6211
6212
  variants: {
6212
6213
  variant: {
6213
6214
  default: "bg-transparent",
6214
- outline: "border border-border-prominent bg-transparent text-on-prominent shadow-xs hover:bg-secondary-hover"
6215
+ outline: "border border-selected bg-transparent text-prominent shadow-xs hover:bg-secondary-hover"
6215
6216
  },
6216
6217
  size: {
6217
6218
  default: "h-9 min-w-9 px-2",