@spear-ai/spectral 1.7.0 → 1.8.0

package/dist/Switch/SwitchBase.js

@@ -1,132 +1,96 @@
 "use client";
 import "../styles/main.css";
-import { jsx as f, jsxs as F } from "react/jsx-runtime";
-import { useControllableState as K } from "../hooks/useControllableState.js";
+import { jsx as a, jsxs as L, Fragment as N } from "react/jsx-runtime";
+import { useControllableState as q } from "../hooks/useControllableState.js";
 import { Slot as v } from "../primitives/slot.js";
-import { cn as w } from "../utils/twUtils.js";
-import { createContext as M, useRef as O, useId as V, useEffect as k, useCallback as a, useContext as $ } from "react";
-const g = M(null), z = ({
+import { createContext as K, useRef as M, useId as O, useEffect as V, useCallback as i, useContext as $ } from "react";
+const w = K(null), z = ({
   asChild: u,
   checked: d,
-  children: l,
-  className: h,
-  defaultChecked: r = !1,
-  disabled: t,
-  form: x,
-  id: y,
-  name: C,
-  onCheckedChange: E,
-  onClick: m,
+  children: h,
+  className: l,
+  defaultChecked: t = !1,
+  disabled: n,
+  form: b,
+  id: C,
+  name: y,
+  onCheckedChange: x,
+  onClick: f,
   onKeyDown: p,
-  ref: S,
-  required: I,
-  value: N = "on",
-  ...P
+  ref: E,
+  required: S,
+  value: g = "on",
+  ...I
 }) => {
-  const c = O(null), R = V(), T = y ?? `swt-${R}`, [n, s] = K({
+  const m = M(null), P = O(), R = C ?? `swt-${P}`, [r, c] = q({
     value: d,
-    defaultValue: r,
-    onChange: E
+    defaultValue: t,
+    onChange: x
   });
-  k(() => {
-    c.current && (c.current.checked = n);
-  }, [n]), k(() => {
-    const e = c.current?.form ?? null;
+  V(() => {
+    const e = m.current?.form ?? null;
     if (!e) return;
-    const o = () => s(r);
+    const o = () => c(t);
     return e.addEventListener("reset", o), () => e.removeEventListener("reset", o);
-  }, [r, s]);
-  const b = a((e) => {
-    const o = c.current;
+  }, [t, c]);
+  const k = i((e) => {
+    const o = m.current;
     if (!o) return;
     o.checked = e;
-    const q = new Event("change", { bubbles: !0 });
-    o.dispatchEvent(q);
-  }, []), i = a(() => {
-    if (t) return;
-    const e = !n;
-    s(e), queueMicrotask(() => b(e));
-  }, [t, b, n, s]), j = a(
+    const F = new Event("change", { bubbles: !0 });
+    o.dispatchEvent(F);
+  }, []), s = i(() => {
+    if (n) return;
+    const e = !r;
+    c(e), queueMicrotask(() => k(e));
+  }, [n, k, r, c]), T = i(
     (e) => {
-      m?.(e), !e.defaultPrevented && i();
+      f?.(e), !e.defaultPrevented && s();
     },
-    [m, i]
-  ), D = a(
+    [f, s]
+  ), j = i(
     (e) => {
-      p?.(e), !e.defaultPrevented && (e.key === " " || e.key === "Enter") && (e.preventDefault(), i());
+      p?.(e), !e.defaultPrevented && (e.key === " " || e.key === "Enter") && (e.preventDefault(), s());
     },
-    [p, i]
-  ), L = u ? v : "button";
-  return /* @__PURE__ */ f(g.Provider, { value: { checked: n, disabled: t }, children: /* @__PURE__ */ F(
-    L,
-    {
-      "aria-checked": n,
-      "aria-disabled": t ?? void 0,
-      className: w(
-        "peer border-input inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border",
-        "bg-input focus-visible:ring-ring transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none",
-        "disabled:cursor-not-allowed disabled:opacity-50",
-        "data-[state=checked]:bg-primary",
-        h
-      ),
-      "data-disabled": t ?? void 0,
-      "data-state": n ? "checked" : "unchecked",
-      disabled: t,
-      id: T,
-      onClick: j,
-      onKeyDown: D,
-      ref: S,
-      role: "switch",
-      type: "button",
-      ...P,
-      children: [
-        /* @__PURE__ */ f(
-          "input",
-          {
-            "aria-hidden": "true",
-            checked: n,
-            disabled: t,
-            form: x,
-            name: C,
-            readOnly: !0,
-            ref: c,
-            required: I,
-            tabIndex: -1,
-            type: "checkbox",
-            value: N,
-            style: {
-              height: 0,
-              opacity: 0,
-              pointerEvents: "none",
-              position: "absolute",
-              width: 0
-            }
-          }
-        ),
-        l
-      ]
-    }
-  ) });
+    [p, s]
+  ), D = u ? v : "button";
+  return /* @__PURE__ */ a(w.Provider, { value: { checked: r, disabled: n }, children: /* @__PURE__ */ L(N, { children: [
+    /* @__PURE__ */ a(D, { "aria-checked": r, className: l, "data-disabled": n ?? void 0, "data-state": r ? "checked" : "unchecked", disabled: n, id: R, onClick: T, onKeyDown: j, ref: E, role: "switch", type: "button", ...I, children: h }),
+    /* @__PURE__ */ a(
+      "input",
+      {
+        "aria-hidden": "true",
+        checked: r,
+        disabled: n,
+        form: b,
+        name: y,
+        readOnly: !0,
+        ref: m,
+        required: S,
+        tabIndex: -1,
+        type: "checkbox",
+        value: g,
+        style: {
+          height: 0,
+          opacity: 0,
+          pointerEvents: "none",
+          position: "absolute",
+          width: 0
+        }
+      }
+    )
+  ] }) });
 };
 z.displayName = "Switch";
 const A = ({
   asChild: u,
   className: d,
-  ref: l,
-  ...h
+  ref: h,
+  ...l
 }) => {
-  const r = $(g);
-  if (!r) throw new Error("SwitchThumb must be used within Switch");
-  return /* @__PURE__ */ f(
-    u ? v : "span",
-    {
-      className: w("bg-background pointer-events-none block h-5 w-5 rounded-full shadow-lg ring-0 transition-transform", "translate-x-0 data-[state=checked]:translate-x-5", d),
-      "data-disabled": r.disabled ?? void 0,
-      "data-state": r.checked ? "checked" : "unchecked",
-      ref: l,
-      ...h
-    }
-  );
+  const t = $(w);
+  if (!t) throw new Error("SwitchThumb must be used within Switch");
+  return /* @__PURE__ */ a(u ? v : "span", { className: d, "data-disabled": t.disabled ?? void 0, "data-state": t.checked ? "checked" : "unchecked", ref: h, ...l });
 };
 A.displayName = "SwitchThumb";
 export {

package/dist/Switch.d.ts

@@ -9,7 +9,7 @@ export type SwitchProps = Omit<SwitchBaseProps, 'onCheckedChange'> & {
     ref?: Ref<HTMLButtonElement>;
     required?: boolean;
     value?: string;
-    variant?: 'default' | 'squared';
+    variant?: 'default' | 'squared' | 'permanent-indicator';
 };
 export declare const Switch: {
     ({ className, disabled, hideLabel, id, labelPosition, labelText, name, onChange, ref, required, value, variant, ...props }: SwitchProps): import("react/jsx-runtime").JSX.Element;

package/dist/Switch.js

@@ -1,45 +1,134 @@
+"use client";
 import "./styles/main.css";
-import { jsxs as p, jsx as t } from "react/jsx-runtime";
-import { Switch as w, SwitchThumb as k } from "./Switch/SwitchBase.js";
-import { Label as r } from "./Label.js";
-import { cn as l } from "./utils/twUtils.js";
-import "react";
-const x = ({ className: o, disabled: d, hideLabel: s = !1, id: e, labelPosition: i = "right", labelText: a, name: h, onChange: b, ref: u, required: c, value: m, variant: f, ...g }) => {
-  const n = f === "squared";
-  return /* @__PURE__ */ p("div", { className: "flex items-center", "data-testid": "spectral-switch-container", children: [
-    i === "left" && !s && /* @__PURE__ */ t(r, { className: "mr-2", "data-testid": "spectral-switch-label-left", htmlFor: e, children: a }),
-    /* @__PURE__ */ t(
-      w,
+import { jsxs as w, jsx as s } from "react/jsx-runtime";
+import { Switch as k, SwitchThumb as x } from "./Switch/SwitchBase.js";
+import { Label as m } from "./Label.js";
+import { cn as u } from "./utils/twUtils.js";
+import { forwardRef as N, createElement as b } from "react";
+const A = (t) => t.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), _ = (t) => t.replace(
+  /^([A-Z])|[\s-_]+(\w)/g,
+  (e, r, a) => a ? a.toUpperCase() : r.toLowerCase()
+), v = (t) => {
+  const e = _(t);
+  return e.charAt(0).toUpperCase() + e.slice(1);
+}, y = (...t) => t.filter((e, r, a) => !!e && e.trim() !== "" && a.indexOf(e) === r).join(" ").trim(), $ = (t) => {
+  for (const e in t)
+    if (e.startsWith("aria-") || e === "role" || e === "title")
+      return !0;
+};
+var j = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+};
+const S = N(
+  ({
+    color: t = "currentColor",
+    size: e = 24,
+    strokeWidth: r = 2,
+    absoluteStrokeWidth: a,
+    className: n = "",
+    children: i,
+    iconNode: d,
+    ...o
+  }, l) => b(
+    "svg",
+    {
+      ref: l,
+      ...j,
+      width: e,
+      height: e,
+      stroke: t,
+      strokeWidth: a ? Number(r) * 24 / Number(e) : r,
+      className: y("lucide", n),
+      ...!i && !$(o) && { "aria-hidden": "true" },
+      ...o
+    },
+    [
+      ...d.map(([c, h]) => b(c, h)),
+      ...Array.isArray(i) ? i : [i]
+    ]
+  )
+);
+const z = (t, e) => {
+  const r = N(
+    ({ className: a, ...n }, i) => b(S, {
+      ref: i,
+      iconNode: e,
+      className: y(
+        `lucide-${A(v(t))}`,
+        `lucide-${t}`,
+        a
+      ),
+      ...n
+    })
+  );
+  return r.displayName = v(t), r;
+};
+const I = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]], L = z("check", I);
+const B = [
+  ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
+  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
+], F = z("x", B), C = "bg-switch-thumb--checked data-[state=checked]:bg-switch-thumb pointer-events-none block rounded-full ring-0 transition-transform motion-reduce:transition-none", P = ({ className: t, disabled: e, hideLabel: r = !1, id: a, labelPosition: n = "right", labelText: i, name: d, onChange: o, ref: l, required: c, value: h, variant: f, ...p }) => {
+  const g = f === "squared";
+  return /* @__PURE__ */ w("div", { className: "flex items-center", "data-testid": "spectral-switch-container", children: [
+    n === "left" && !r && /* @__PURE__ */ s(m, { className: "mr-2", "data-testid": "spectral-switch-label-left", htmlFor: a, children: i }),
+    f === "permanent-indicator" ? /* @__PURE__ */ w("div", { className: "relative inline-grid h-7 grid-cols-[1fr_1fr] items-center text-sm font-medium", children: [
+      /* @__PURE__ */ s(
+        k,
+        {
+          "aria-required": c,
+          className: u(
+            "peer data-[state=checked]:bg-switch-bg--checked data-[state=unchecked]:bg-switch-bg/50 focus-visible:ring-ring focus-visible:ring-offset-background absolute inset-0 inline-flex h-[inherit] w-14 items-center",
+            "cursor-pointer rounded-full border-2 border-transparent shadow-2xs transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none",
+            "disabled:cursor-not-allowed disabled:opacity-50",
+            t
+          ),
+          "data-testid": "spectral-switch",
+          disabled: e,
+          id: a,
+          name: d,
+          onCheckedChange: o,
+          ref: l,
+          required: c,
+          value: h,
+          ...p,
+          children: /* @__PURE__ */ s(x, { className: u(C, "relative z-10 size-6.5 shadow-xs duration-300 ease-[cubic-bezier(0.16,1,0.3,1)] data-[state=checked]:translate-x-[26px] motion-reduce:duration-0 data-[state=checked]:rtl:-translate-x-[26px]") })
+        }
+      ),
+      /* @__PURE__ */ s("span", { className: "pointer-events-none relative ml-0.5 flex min-w-8 items-center justify-center text-center transition-transform duration-300 ease-[cubic-bezier(0.16,1,0.3,1)] peer-data-[state=checked]:invisible peer-data-[state=unchecked]:translate-x-6 motion-reduce:translate-x-0 motion-reduce:transition-none motion-reduce:duration-0 peer-data-[state=unchecked]:rtl:-translate-x-6", children: /* @__PURE__ */ s(F, { "aria-hidden": "true", className: "size-4" }) }),
+      /* @__PURE__ */ s("span", { className: "peer-data-[state=checked]:text-background pointer-events-none relative flex min-w-8 items-center justify-center text-center transition-transform duration-300 ease-[cubic-bezier(0.16,1,0.3,1)] peer-data-[state=checked]:-translate-x-full peer-data-[state=unchecked]:invisible motion-reduce:translate-x-0 motion-reduce:transition-none motion-reduce:duration-0 peer-data-[state=checked]:rtl:translate-x-full", children: /* @__PURE__ */ s(L, { "aria-hidden": "true", className: "size-4" }) })
+    ] }) : /* @__PURE__ */ s(
+      k,
       {
         "aria-required": c,
-        className: l(
-          n ? "peer data-[state=checked]:bg-switch-bg--checked data-[state=unchecked]:bg-switch-bg inline-flex h-6 w-10 shrink-0 items-center rounded-sm border-2 border-transparent transition-all outline-none focus-visible:ring-[3px] focus-visible:ring-black disabled:cursor-not-allowed disabled:opacity-50 [&_span]:rounded-[4px]" : "focus-visible:ring-ring focus-visible:ring-offset-background peer data-[state=checked]:bg-switch-bg--checked data-[state=unchecked]:bg-switch-bg inline-flex h-6 w-10 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-2xs transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
-          o
+        className: u(
+          g ? "peer data-[state=checked]:bg-switch-bg--checked data-[state=unchecked]:bg-switch-bg inline-flex h-6 w-10 shrink-0 items-center rounded-sm border-2 border-transparent transition-all outline-none focus-visible:ring-[3px] focus-visible:ring-black disabled:cursor-not-allowed disabled:opacity-50 [&_span]:rounded-[4px]" : "focus-visible:ring-ring focus-visible:ring-offset-background peer data-[state=checked]:bg-switch-bg--checked data-[state=unchecked]:bg-switch-bg inline-flex h-6 w-10 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-2xs transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
+          t
         ),
         "data-testid": "spectral-switch",
-        disabled: d,
-        id: e,
-        name: h,
-        onCheckedChange: b,
-        ref: u,
+        disabled: e,
+        id: a,
+        name: d,
+        onCheckedChange: o,
+        ref: l,
         required: c,
-        value: m,
-        ...g,
-        children: /* @__PURE__ */ t(
-          k,
-          {
-            className: l(
-              n ? "bg-switch-thumb pointer-events-none block size-5 rounded-full shadow-xs ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0 data-[state=checked]:rtl:-translate-x-4" : "bg-switch-thumb pointer-events-none block h-5 w-5 rounded-full shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
-            )
-          }
-        )
+        value: h,
+        ...p,
+        children: /* @__PURE__ */ s(x, { className: u(C, g ? "size-5 shadow-xs data-[state=checked]:translate-x-4 data-[state=checked]:rtl:-translate-x-4" : "h-5 w-5 shadow-lg data-[state=checked]:translate-x-4") })
       }
     ),
-    i === "right" && !s && /* @__PURE__ */ t(r, { className: "ml-2", "data-testid": "spectral-switch-label-right", htmlFor: e, id: `${e}-label`, children: a }),
-    s && /* @__PURE__ */ t(r, { className: "sr-only", "data-testid": "spectral-switch-label-hidden", htmlFor: e, children: a })
+    n === "right" && !r && /* @__PURE__ */ s(m, { className: "ml-2", "data-testid": "spectral-switch-label-right", htmlFor: a, id: `${a}-label`, children: i }),
+    r && /* @__PURE__ */ s(m, { className: "sr-only", "data-testid": "spectral-switch-label-hidden", htmlFor: a, children: i })
   ] });
 };
-x.displayName = "Switch";
+P.displayName = "Switch";
 export {
-  x as Switch
+  P as Switch
 };

package/dist/Textarea.js

@@ -35,7 +35,6 @@ import "./Icons/KeyboardIcon.js";
 import "./Icons/LabelIcon.js";
 import "./Icons/LassoIcon.js";
 import "./Icons/LineToolIcon.js";
-import "./Icons/LineToolIcon2.js";
 import "./Icons/LiveViewIcon.js";
 import { LoaderIcon as B } from "./Icons/LoaderIcon.js";
 import "./Icons/LocationIcon.js";
@@ -49,6 +48,7 @@ import "./Icons/PanelIconClose.js";
 import "./Icons/PanelIconOpen.js";
 import "./Icons/PlayIcon.js";
 import "./Icons/PlusIcon.js";
+import "./Icons/PolygonIcon.js";
 import "./Icons/ResetIcon.js";
 import "./Icons/ReviewedIcon.js";
 import "./Icons/ScissorsIcon.js";

package/dist/Toast.js

@@ -34,7 +34,6 @@ import "./Icons/KeyboardIcon.js";
 import "./Icons/LabelIcon.js";
 import "./Icons/LassoIcon.js";
 import "./Icons/LineToolIcon.js";
-import "./Icons/LineToolIcon2.js";
 import "./Icons/LiveViewIcon.js";
 import "./Icons/LoaderIcon.js";
 import "./Icons/LocationIcon.js";
@@ -48,6 +47,7 @@ import "./Icons/PanelIconClose.js";
 import "./Icons/PanelIconOpen.js";
 import "./Icons/PlayIcon.js";
 import "./Icons/PlusIcon.js";
+import "./Icons/PolygonIcon.js";
 import "./Icons/ResetIcon.js";
 import "./Icons/ReviewedIcon.js";
 import "./Icons/ScissorsIcon.js";

package/dist/Tray.js

@@ -35,7 +35,6 @@ import "./Icons/KeyboardIcon.js";
 import "./Icons/LabelIcon.js";
 import "./Icons/LassoIcon.js";
 import "./Icons/LineToolIcon.js";
-import "./Icons/LineToolIcon2.js";
 import "./Icons/LiveViewIcon.js";
 import "./Icons/LoaderIcon.js";
 import "./Icons/LocationIcon.js";
@@ -49,6 +48,7 @@ import "./Icons/PanelIconClose.js";
 import "./Icons/PanelIconOpen.js";
 import "./Icons/PlayIcon.js";
 import "./Icons/PlusIcon.js";
+import "./Icons/PolygonIcon.js";
 import "./Icons/ResetIcon.js";
 import "./Icons/ReviewedIcon.js";
 import "./Icons/ScissorsIcon.js";

package/dist/primitives/select.js

@@ -32,7 +32,6 @@ import "../Icons/KeyboardIcon.js";
 import "../Icons/LabelIcon.js";
 import "../Icons/LassoIcon.js";
 import "../Icons/LineToolIcon.js";
-import "../Icons/LineToolIcon2.js";
 import "../Icons/LiveViewIcon.js";
 import "../Icons/LoaderIcon.js";
 import "../Icons/LocationIcon.js";
@@ -46,6 +45,7 @@ import "../Icons/PanelIconClose.js";
 import "../Icons/PanelIconOpen.js";
 import "../Icons/PlayIcon.js";
 import "../Icons/PlusIcon.js";
+import "../Icons/PolygonIcon.js";
 import "../Icons/ResetIcon.js";
 import "../Icons/ReviewedIcon.js";
 import "../Icons/ScissorsIcon.js";

package/dist/styles/horizon/colors.css

@@ -167,9 +167,10 @@
   --color-slider-thumb-bg: var(--horizon-color-neutral-50);
   --color-slider-thumb-ring: var(--horizon-color-neutral-50);
 
-  --color-switch-bg: var(--horizon-color-neutral-500);
-  --color-switch-bg--checked: var(--horizon-color-success-500);
+  --color-switch-bg: var(--horizon-color-neutral-700);
+  --color-switch-bg--checked: var(--horizon-color-white);
   --color-switch-thumb: var(--horizon-color-neutral-950);
+  --color-switch-thumb--checked: var(--horizon-color-white);
 
   --color-tabs-bg: var(--horizon-color-level-one);
   --color-tabs-group-bg: var(--horizon-color-level-one);

package/dist/styles/main.css

@@ -1 +1 @@
-:root{--horizon-color-black: oklch(0% 0 0);--horizon-color-white: oklch(100% 0 0);--horizon-color-transparent: oklch(0 0 0 / 0%);--horizon-color-accent: oklch(92.53% .1976 123.38);--horizon-color-neutral-50: oklch(98.5% 0 0);--horizon-color-neutral-100: oklch(92.19% 0 0);--horizon-color-neutral-200: oklch(86.99% 0 0);--horizon-color-neutral-300: oklch(79.03% 0 0);--horizon-color-neutral-400: oklch(71.55% 0 0);--horizon-color-neutral-500: oklch(55.55% 0 0);--horizon-color-neutral-600: oklch(43.86% 0 0);--horizon-color-neutral-700: oklch(37.15% 0 0);--horizon-color-neutral-800: oklch(32.11% 0 0);--horizon-color-neutral-900: oklch(26.86% 0 0);--horizon-color-neutral-950: oklch(21.78% 0 0);--horizon-color-primary-50: oklch(97.37% .01 238);--horizon-color-primary-100: oklch(93.88% .03 242.35);--horizon-color-primary-200: oklch(89.3% .06 242.83);--horizon-color-primary-300: oklch(83.05% .09 240.33);--horizon-color-primary-400: oklch(74.57% .14 245.84);--horizon-color-primary-500: oklch(66.23% .18 254.28);--horizon-color-primary-600: oklch(58.57% .21 259.12);--horizon-color-primary-700: oklch(52.25% .21 261.44);--horizon-color-primary-800: oklch(42.44% .17 262.29);--horizon-color-primary-900: oklch(39.88% .14 261.51);--horizon-color-primary-950: oklch(29.27% .09 263.49);--horizon-color-level-zero: oklch(23.78% 0 0);--horizon-color-level-one: oklch(26.94% 0 0);--horizon-color-level-two: oklch(29.93% 0 0);--horizon-color-level-three: oklch(32.89% 0 0);--horizon-color-level-four: oklch(35.71% 0 0);--horizon-color-level-five: oklch(38.62% 0 0);--horizon-color-success-50: oklch(96.2% .044 156.743);--horizon-color-success-100: oklch(92.5% .084 155.995);--horizon-color-success-200: oklch(87.1% .15 154.449);--horizon-color-success-300: oklch(79.2% .209 151.711);--horizon-color-success-400: oklch(72.3% .219 149.579);--horizon-color-success-500: oklch(62.7% .194 149.214);--horizon-color-warning-50: oklch(95.4% .038 75.164);--horizon-color-warning-100: oklch(90.1% .076 70.697);--horizon-color-warning-200: oklch(83.7% .128 66.29);--horizon-color-warning-300: oklch(75% .183 55.934);--horizon-color-warning-400: oklch(70.5% .213 47.604);--horizon-color-warning-500: oklch(64.6% .222 41.116);--horizon-color-danger-50: oklch(93.6% .032 17.717);--horizon-color-danger-100: oklch(88.5% .062 18.334);--horizon-color-danger-200: oklch(80.8% .114 19.571);--horizon-color-danger-300: oklch(70.4% .191 22.216);--horizon-color-danger-400: oklch(57.7% .245 27.325);--horizon-color-danger-500: oklch(50.5% .213 27.518)}:root[data-theme=light]{--horizon-color-level-one: oklch(98.51% 0 0)}@theme{ --color-background: var(--horizon-color-neutral-950); --color-text-primary: var(--horizon-color-neutral-50); --color-text-inverted: var(--horizon-color-neutral-950); --color-text-secondary: var(--horizon-color-neutral-300); --color-text-disabled: var(--horizon-color-neutral-600); --color-border-primary: var(--horizon-color-neutral-900); --color-border-secondary: var(--horizon-color-neutral-700); --color-accent: var(--horizon-color-accent); --color-selected-primary: var(--horizon-color-primary-600); --color-divider-primary: var(--horizon-color-level-four); --color-overlay: color-mix(in oklab, var(--horizon-color-neutral-950) 40%, transparent); --color-level-zero: var(--horizon-color-level-zero); --color-level-one: var(--horizon-color-level-one); --color-level-two: var(--horizon-color-level-two); --color-level-three: var(--horizon-color-level-three); --color-level-four: var(--horizon-color-level-four); --color-level-five: var(--horizon-color-level-five); --color-success-50: var(--horizon-color-success-50); --color-success-100: var(--horizon-color-success-100); --color-success-200: var(--horizon-color-success-200); --color-success-300: var(--horizon-color-success-300); --color-success-400: var(--horizon-color-success-400); --color-success-500: var(--horizon-color-success-500); --color-warning-50: var(--horizon-color-warning-50); --color-warning-100: var(--horizon-color-warning-100); --color-warning-200: var(--horizon-color-warning-200); --color-warning-300: var(--horizon-color-warning-300); --color-warning-400: var(--horizon-color-warning-400); --color-warning-500: var(--horizon-color-warning-500); --color-danger-50: var(--horizon-color-danger-50); --color-danger-100: var(--horizon-color-danger-100); --color-danger-200: var(--horizon-color-danger-200); --color-danger-300: var(--horizon-color-danger-300); --color-danger-400: var(--horizon-color-danger-400); --color-danger-500: var(--horizon-color-danger-500); --color-alert-bg: var(--horizon-color-level-two); --color-alert-border: var(--horizon-color-level-three); --color-alert-text: var(--horizon-color-neutral-50); --color-alert-success-bg: var(--horizon-color-success-50); --color-alert-success-border: var(--horizon-color-success-500); --color-alert-success-text: var(--horizon-color-success-500); --color-alert-warning-bg: var(--horizon-color-warning-50); --color-alert-warning-border: var(--horizon-color-warning-500); --color-alert-warning-text: var(--horizon-color-warning-500); --color-alert-danger-bg: var(--horizon-color-danger-50); --color-alert-danger-border: var(--horizon-color-danger-500); --color-alert-danger-text: var(--horizon-color-danger-500); --color-alert-info-bg: var(--horizon-color-primary-50); --color-alert-info-border: var(--horizon-color-primary-700); --color-alert-info-text: var(--horizon-color-primary-700); --color-badge-primary-bg: var(--horizon-color-level-five); --color-badge-primary-bg--hover: var(--horizon-color-level-four); --color-badge-primary-bg--active: var(--horizon-color-primary-600); --color-badge-primary-border: var(--horizon-color-level-five); --color-badge-secondary-bg: var(--horizon-color-accent); --color-badge-secondary-border: var(--horizon-color-accent); --color-badge-secondary-text: var(--horizon-color-neutral-950); --color-badge-outline-bg: var(--horizon-color-transparent); --color-badge-outline-border: var(--horizon-color-level-five); --color-badge-destructive-bg: var(--horizon-color-danger-400); --color-badge-destructive-border: var(--horizon-color-danger-400); --color-button-primary-bg: var(--horizon-color-accent); --color-button-primary-bg--hover: var(--horizon-color-level-two); --color-button-primary-bg--disabled: var(--horizon-color-neutral-500); --color-button-primary-border: var(--horizon-color-accent); --color-button-primary-border--hover: var(--horizon-color-level-two); --color-button-primary-border--disabled: var(--horizon-color-neutral-500); --color-button-primary-text: var(--horizon-color-neutral-900); --color-button-primary-text--hover: var(--horizon-color-accent); --color-button-primary-text--disabled: var(--horizon-color-neutral-200); --color-button-secondary-bg: var(--horizon-color-level-two); --color-button-secondary-bg--hover: var(--horizon-color-accent); --color-button-secondary-bg--disabled: var(--horizon-color-neutral-500); --color-button-secondary-text: var(--horizon-color-neutral-50); --color-button-secondary-text--hover: var(--horizon-color-level-two); --color-button-secondary-text--disabled: var(--horizon-color-neutral-200); --color-button-secondary-border: var(--horizon-color-neutral-900); --color-button-secondary-border--disabled: var(--horizon-color-neutral-500); --color-button-outline-bg: var(--horizon-color-transparent); --color-button-outline-bg--hover: var(--horizon-color-level-two); --color-button-outline-text: var(--horizon-color-neutral-50); --color-button-outline-text--hover: var(--horizon-color-accent); --color-button-outline-text--disabled: var(--horizon-color-neutral-400); --color-button-outline-border: var(--horizon-color-accent); --color-button-outline-border--disabled: var(--horizon-color-neutral-400); --color-button-ghost-bg: var(--horizon-color-transparent); --color-button-ghost-bg--hover: var(--horizon-color-level-two); --color-button-ghost-text: var(--horizon-color-neutral-50); --color-button-ghost-text--hover: var(--horizon-color-accent); --color-button-ghost-text--disabled: var(--horizon-color-neutral-400); --color-button-danger: var(--horizon-color-danger-200); --color-button-danger--hover: color-mix(in oklab, var(--horizon-color-danger-300) 80%, transparent); --color-checkbox-border: var(--horizon-color-neutral-100); --color-checkbox-border--focus: var(--horizon-color-accent); --color-checkbox-border--checked: var(--horizon-color-accent); --color-checkbox-indicator--checked: var(--horizon-color-accent); --color-data-card-description: var(--horizon-color-neutral-300); --color-dialog-bg: var(--horizon-color-level-one); --color-drawer-bg: var(--horizon-color-level-one); --color-input-border: color-mix(in oklab, var(--horizon-color-white) 10%, transparent); --color-input-border--hover: var(--horizon-color-neutral-300); --color-input-border--focus: var(--horizon-color-accent); --color-input-border--disabled: var(--horizon-color-neutral-500); --color-input-bg: var(--horizon-color-level-zero); --color-input-bg--hover: var(--horizon-color-level-four); --color-input-bg--disabled: var(--horizon-color-neutral-700); --color-input-bg--selected: var(--horizon-color-level-four); --color-input-text: var(--horizon-color-neutral-50); --color-input-text-prefix: var(--horizon-color-neutral-200); --color-input-text--disabled: var(--horizon-color-neutral-200); --color-input-text-placeholder: var(--horizon-color-neutral-500); --color-input-primitive-bg: var(--horizon-color-neutral-950); --color-input-primitive-border: var(--horizon-color-neutral-800); --color-input-otp-filled-bg: var(--horizon-color-level-two); --color-input-otp-filled-border: var(--horizon-color-level-two); --color-input-otp-filled-separator: var(--horizon-color-level-five); --color-input-otp-border: var(--horizon-color-neutral-300); --color-input-otp-border--focus: var(--horizon-color-accent); --color-input-otp-caret: var(--horizon-color-neutral-200); --color-kbd-bg: var(--horizon-color-level-two); --color-kbd-text: var(--color-text-secondary); --color-popover-bg: var(--horizon-color-level-one); --color-popover-text: var(--horizon-color-neutral-50); --color-radio-bg: var(--horizon-color-neutral-900); --color-radio-bg--selected: var(--horizon-color-accent); --color-radio-border: var(--horizon-color-neutral-800); --color-radio-border--hover: var(--horizon-color-accent); --color-radio-border--selected: var(--horizon-color-accent); --color-radio-tile-border: color-mix(in oklab, var(--horizon-color-white) 10%, transparent); --color-radio-tile-border--hover: var(--horizon-color-neutral-300); --color-radio-tile-border--selected: var(--horizon-color-accent); --color-select-item-bg--hover: var(--horizon-color-level-four); --color-slider-track: var(--horizon-color-neutral-700); --color-slider-range: var(--horizon-color-neutral-50); --color-slider-thumb-border: var(--horizon-color-neutral-50); --color-slider-thumb-bg: var(--horizon-color-neutral-50); --color-slider-thumb-ring: var(--horizon-color-neutral-50); --color-switch-bg: var(--horizon-color-neutral-500); --color-switch-bg--checked: var(--horizon-color-success-500); --color-switch-thumb: var(--horizon-color-neutral-950); --color-tabs-bg: var(--horizon-color-level-one); --color-tabs-group-bg: var(--horizon-color-level-one); --color-tabs-indicator: var(--horizon-color-accent); --color-tabs-enclosed-indicator: var(--horizon-color-level-two); --color-tabs-border: var(--horizon-color-level-four); --color-toast-bg: var(--horizon-color-level-one); --color-toast-border: var(--horizon-color-level-four); --color-toast-text: var(--horizon-color-neutral-50); --color-toast-icon: var(--horizon-color-neutral-50); --color-toast-success-bg: color-mix(in oklab, var(--horizon-color-success-400) 10%, var(--horizon-color-neutral-950)); --color-toast-success-border: var(--horizon-color-success-400); --color-toast-success-text: var(--horizon-color-success-400); --color-toast-success-icon: var(--horizon-color-success-400); --color-toast-warning-bg: color-mix(in oklab, var(--horizon-color-warning-400) 10%, var(--horizon-color-neutral-950)); --color-toast-warning-border: var(--horizon-color-warning-400); --color-toast-warning-text: var(--horizon-color-warning-400); --color-toast-warning-icon: var(--horizon-color-warning-400); --color-toast-danger-bg: color-mix(in oklab, var(--horizon-color-danger-400) 10%, var(--horizon-color-neutral-950)); --color-toast-danger-border: var(--horizon-color-danger-400); --color-toast-danger-text: var(--horizon-color-danger-400); --color-toast-danger-icon: var(--horizon-color-danger-400); --color-toast-info-bg: color-mix(in oklab, var(--horizon-color-primary-400) 10%, var(--horizon-color-neutral-950)); --color-toast-info-border: var(--horizon-color-primary-400); --color-toast-info-text: var(--horizon-color-primary-400); --color-toast-info-icon: var(--horizon-color-primary-400); --color-toggle-bg: var(--horizon-color-level-two); --color-toggle-bg--active: var(--horizon-color-primary-500); --color-toggle-bg--hover: var(--horizon-color-level-four); --color-toggle-border: var(--horizon-color-transparent); --color-toggle-border--hover: var(--horizon-color-level-four); --color-toggle-border--active: var(--horizon-color-primary-500); --color-toggle-text: var(--horizon-color-neutral-50); --color-toggle-text--hover: var(--horizon-color-neutral-200); --color-toggle-text--active: var(--horizon-color-neutral-50); --color-toggle-outline-border: var(--horizon-color-neutral-600); --color-toggle-outline-border--hover: var(--horizon-color-neutral-400); --color-toggle-group-bg: var(--horizon-color-level-five); --color-tooltip-bg: var(--horizon-color-level-one); --color-tooltip-arrow: var(--horizon-color-level-one); --color-tooltip-outline-border: var(--horizon-color-level-four); --color-tooltip-outline-arrow: var(--horizon-color-level-four); }:root[data-theme=light]{--color-background: var(--horizon-color-neutral-50);--color-ring-offset: var(--horizon-color-neutral-50);--color-text-primary: var(--horizon-color-neutral-900);--color-text-secondary: var(--horizon-color-neutral-600);--color-card-bg: var(--horizon-color-level-one);--color-card-text: var(--horizon-color-neutral-900);--color-switch-bg: var(--horizon-color-neutral-300);--color-switch-bg--checked: var(--horizon-color-neutral-950);--color-switch-thumb: var(--horizon-color-neutral-50);--color-shadow-neumorphic: oklch(92.49% 0 0);--color-shadow-neumorphic-large: oklch(88.56% .0014 286.37)}@theme{ --font-sans: "Work Sans", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji"; --font-serif: "Bitter", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif; --font-mono: "Source Code Pro", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New", monospace; --ring: var(--color-accent); --ring-offset: var(--color-background); --animate-animate-in: animate-in; --animate-animate-out: animate-out; --animate-zoom-in-95: zoom-in-95; --animate-zoom-out-95: zoom-out-95; --animate-fade-in-0: fade-in-0; --animate-fade-out-0: fade-out-0; --animate-fade-in-tabs: fade-in-tabs .5s ease-in-out; --animate-slide-down-from-top: slide-down-from-top .3s ease-out; --animate-slide-up-to-top: slide-up-to-top .3s ease-out; --animate-fade-in-tabs-indicator: fade-in-tabs-indicator .3s ease-out; --animate-caret-blink: caret-blink 1.2s ease-out infinite; --animate-spin-around: spin-around .8s linear infinite; --animate-accordion-down: accordion-down .2s ease-out; --animate-accordion-up: accordion-up .2s ease-out; }@keyframes animate-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes animate-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes caret-blink{0%,70%,to{opacity:1}20%,50%{opacity:0}}@keyframes fade-in-0{0%{opacity:0}to{opacity:1}}@keyframes fade-out-0{0%{opacity:1}to{opacity:0}}@keyframes fade-in-tabs-indicator{0%{opacity:0;transform:translateY(-2rem)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down-from-top{0%{transform:translateY(-100%);opacity:0;scale:.95}to{transform:translateY(0);opacity:1;scale:1}}@keyframes slide-up-to-top{0%{transform:translateY(0);opacity:1;scale:1}to{transform:translateY(-100%);opacity:0;scale:.95}}@keyframes spin-around{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}@keyframes zoom-in-95{0%{opacity:0;transform:translate(-50%) translateY(-50%) scale(.95)}to{opacity:1;transform:translate(-50%) translateY(-50%) scale(1)}}@keyframes zoom-out-95{0%{opacity:1;transform:translate(-50%) translateY(-50%) scale(1)}to{opacity:0;transform:translate(-50%) translateY(-50%) scale(.95)}}@keyframes accordion-down{0%{height:0;opacity:0}to{height:var(--radix-accordion-content-height);opacity:1}}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height);opacity:1}to{height:0;opacity:0}}@plugin "tailwindcss-animate";
+:root{--horizon-color-black: oklch(0% 0 0);--horizon-color-white: oklch(100% 0 0);--horizon-color-transparent: oklch(0 0 0 / 0%);--horizon-color-accent: oklch(92.53% .1976 123.38);--horizon-color-neutral-50: oklch(98.5% 0 0);--horizon-color-neutral-100: oklch(92.19% 0 0);--horizon-color-neutral-200: oklch(86.99% 0 0);--horizon-color-neutral-300: oklch(79.03% 0 0);--horizon-color-neutral-400: oklch(71.55% 0 0);--horizon-color-neutral-500: oklch(55.55% 0 0);--horizon-color-neutral-600: oklch(43.86% 0 0);--horizon-color-neutral-700: oklch(37.15% 0 0);--horizon-color-neutral-800: oklch(32.11% 0 0);--horizon-color-neutral-900: oklch(26.86% 0 0);--horizon-color-neutral-950: oklch(21.78% 0 0);--horizon-color-primary-50: oklch(97.37% .01 238);--horizon-color-primary-100: oklch(93.88% .03 242.35);--horizon-color-primary-200: oklch(89.3% .06 242.83);--horizon-color-primary-300: oklch(83.05% .09 240.33);--horizon-color-primary-400: oklch(74.57% .14 245.84);--horizon-color-primary-500: oklch(66.23% .18 254.28);--horizon-color-primary-600: oklch(58.57% .21 259.12);--horizon-color-primary-700: oklch(52.25% .21 261.44);--horizon-color-primary-800: oklch(42.44% .17 262.29);--horizon-color-primary-900: oklch(39.88% .14 261.51);--horizon-color-primary-950: oklch(29.27% .09 263.49);--horizon-color-level-zero: oklch(23.78% 0 0);--horizon-color-level-one: oklch(26.94% 0 0);--horizon-color-level-two: oklch(29.93% 0 0);--horizon-color-level-three: oklch(32.89% 0 0);--horizon-color-level-four: oklch(35.71% 0 0);--horizon-color-level-five: oklch(38.62% 0 0);--horizon-color-success-50: oklch(96.2% .044 156.743);--horizon-color-success-100: oklch(92.5% .084 155.995);--horizon-color-success-200: oklch(87.1% .15 154.449);--horizon-color-success-300: oklch(79.2% .209 151.711);--horizon-color-success-400: oklch(72.3% .219 149.579);--horizon-color-success-500: oklch(62.7% .194 149.214);--horizon-color-warning-50: oklch(95.4% .038 75.164);--horizon-color-warning-100: oklch(90.1% .076 70.697);--horizon-color-warning-200: oklch(83.7% .128 66.29);--horizon-color-warning-300: oklch(75% .183 55.934);--horizon-color-warning-400: oklch(70.5% .213 47.604);--horizon-color-warning-500: oklch(64.6% .222 41.116);--horizon-color-danger-50: oklch(93.6% .032 17.717);--horizon-color-danger-100: oklch(88.5% .062 18.334);--horizon-color-danger-200: oklch(80.8% .114 19.571);--horizon-color-danger-300: oklch(70.4% .191 22.216);--horizon-color-danger-400: oklch(57.7% .245 27.325);--horizon-color-danger-500: oklch(50.5% .213 27.518)}:root[data-theme=light]{--horizon-color-level-one: oklch(98.51% 0 0)}@theme{ --color-background: var(--horizon-color-neutral-950); --color-text-primary: var(--horizon-color-neutral-50); --color-text-inverted: var(--horizon-color-neutral-950); --color-text-secondary: var(--horizon-color-neutral-300); --color-text-disabled: var(--horizon-color-neutral-600); --color-border-primary: var(--horizon-color-neutral-900); --color-border-secondary: var(--horizon-color-neutral-700); --color-accent: var(--horizon-color-accent); --color-selected-primary: var(--horizon-color-primary-600); --color-divider-primary: var(--horizon-color-level-four); --color-overlay: color-mix(in oklab, var(--horizon-color-neutral-950) 40%, transparent); --color-level-zero: var(--horizon-color-level-zero); --color-level-one: var(--horizon-color-level-one); --color-level-two: var(--horizon-color-level-two); --color-level-three: var(--horizon-color-level-three); --color-level-four: var(--horizon-color-level-four); --color-level-five: var(--horizon-color-level-five); --color-success-50: var(--horizon-color-success-50); --color-success-100: var(--horizon-color-success-100); --color-success-200: var(--horizon-color-success-200); --color-success-300: var(--horizon-color-success-300); --color-success-400: var(--horizon-color-success-400); --color-success-500: var(--horizon-color-success-500); --color-warning-50: var(--horizon-color-warning-50); --color-warning-100: var(--horizon-color-warning-100); --color-warning-200: var(--horizon-color-warning-200); --color-warning-300: var(--horizon-color-warning-300); --color-warning-400: var(--horizon-color-warning-400); --color-warning-500: var(--horizon-color-warning-500); --color-danger-50: var(--horizon-color-danger-50); --color-danger-100: var(--horizon-color-danger-100); --color-danger-200: var(--horizon-color-danger-200); --color-danger-300: var(--horizon-color-danger-300); --color-danger-400: var(--horizon-color-danger-400); --color-danger-500: var(--horizon-color-danger-500); --color-alert-bg: var(--horizon-color-level-two); --color-alert-border: var(--horizon-color-level-three); --color-alert-text: var(--horizon-color-neutral-50); --color-alert-success-bg: var(--horizon-color-success-50); --color-alert-success-border: var(--horizon-color-success-500); --color-alert-success-text: var(--horizon-color-success-500); --color-alert-warning-bg: var(--horizon-color-warning-50); --color-alert-warning-border: var(--horizon-color-warning-500); --color-alert-warning-text: var(--horizon-color-warning-500); --color-alert-danger-bg: var(--horizon-color-danger-50); --color-alert-danger-border: var(--horizon-color-danger-500); --color-alert-danger-text: var(--horizon-color-danger-500); --color-alert-info-bg: var(--horizon-color-primary-50); --color-alert-info-border: var(--horizon-color-primary-700); --color-alert-info-text: var(--horizon-color-primary-700); --color-badge-primary-bg: var(--horizon-color-level-five); --color-badge-primary-bg--hover: var(--horizon-color-level-four); --color-badge-primary-bg--active: var(--horizon-color-primary-600); --color-badge-primary-border: var(--horizon-color-level-five); --color-badge-secondary-bg: var(--horizon-color-accent); --color-badge-secondary-border: var(--horizon-color-accent); --color-badge-secondary-text: var(--horizon-color-neutral-950); --color-badge-outline-bg: var(--horizon-color-transparent); --color-badge-outline-border: var(--horizon-color-level-five); --color-badge-destructive-bg: var(--horizon-color-danger-400); --color-badge-destructive-border: var(--horizon-color-danger-400); --color-button-primary-bg: var(--horizon-color-accent); --color-button-primary-bg--hover: var(--horizon-color-level-two); --color-button-primary-bg--disabled: var(--horizon-color-neutral-500); --color-button-primary-border: var(--horizon-color-accent); --color-button-primary-border--hover: var(--horizon-color-level-two); --color-button-primary-border--disabled: var(--horizon-color-neutral-500); --color-button-primary-text: var(--horizon-color-neutral-900); --color-button-primary-text--hover: var(--horizon-color-accent); --color-button-primary-text--disabled: var(--horizon-color-neutral-200); --color-button-secondary-bg: var(--horizon-color-level-two); --color-button-secondary-bg--hover: var(--horizon-color-accent); --color-button-secondary-bg--disabled: var(--horizon-color-neutral-500); --color-button-secondary-text: var(--horizon-color-neutral-50); --color-button-secondary-text--hover: var(--horizon-color-level-two); --color-button-secondary-text--disabled: var(--horizon-color-neutral-200); --color-button-secondary-border: var(--horizon-color-neutral-900); --color-button-secondary-border--disabled: var(--horizon-color-neutral-500); --color-button-outline-bg: var(--horizon-color-transparent); --color-button-outline-bg--hover: var(--horizon-color-level-two); --color-button-outline-text: var(--horizon-color-neutral-50); --color-button-outline-text--hover: var(--horizon-color-accent); --color-button-outline-text--disabled: var(--horizon-color-neutral-400); --color-button-outline-border: var(--horizon-color-accent); --color-button-outline-border--disabled: var(--horizon-color-neutral-400); --color-button-ghost-bg: var(--horizon-color-transparent); --color-button-ghost-bg--hover: var(--horizon-color-level-two); --color-button-ghost-text: var(--horizon-color-neutral-50); --color-button-ghost-text--hover: var(--horizon-color-accent); --color-button-ghost-text--disabled: var(--horizon-color-neutral-400); --color-button-danger: var(--horizon-color-danger-200); --color-button-danger--hover: color-mix(in oklab, var(--horizon-color-danger-300) 80%, transparent); --color-checkbox-border: var(--horizon-color-neutral-100); --color-checkbox-border--focus: var(--horizon-color-accent); --color-checkbox-border--checked: var(--horizon-color-accent); --color-checkbox-indicator--checked: var(--horizon-color-accent); --color-data-card-description: var(--horizon-color-neutral-300); --color-dialog-bg: var(--horizon-color-level-one); --color-drawer-bg: var(--horizon-color-level-one); --color-input-border: color-mix(in oklab, var(--horizon-color-white) 10%, transparent); --color-input-border--hover: var(--horizon-color-neutral-300); --color-input-border--focus: var(--horizon-color-accent); --color-input-border--disabled: var(--horizon-color-neutral-500); --color-input-bg: var(--horizon-color-level-zero); --color-input-bg--hover: var(--horizon-color-level-four); --color-input-bg--disabled: var(--horizon-color-neutral-700); --color-input-bg--selected: var(--horizon-color-level-four); --color-input-text: var(--horizon-color-neutral-50); --color-input-text-prefix: var(--horizon-color-neutral-200); --color-input-text--disabled: var(--horizon-color-neutral-200); --color-input-text-placeholder: var(--horizon-color-neutral-500); --color-input-primitive-bg: var(--horizon-color-neutral-950); --color-input-primitive-border: var(--horizon-color-neutral-800); --color-input-otp-filled-bg: var(--horizon-color-level-two); --color-input-otp-filled-border: var(--horizon-color-level-two); --color-input-otp-filled-separator: var(--horizon-color-level-five); --color-input-otp-border: var(--horizon-color-neutral-300); --color-input-otp-border--focus: var(--horizon-color-accent); --color-input-otp-caret: var(--horizon-color-neutral-200); --color-kbd-bg: var(--horizon-color-level-two); --color-kbd-text: var(--color-text-secondary); --color-popover-bg: var(--horizon-color-level-one); --color-popover-text: var(--horizon-color-neutral-50); --color-radio-bg: var(--horizon-color-neutral-900); --color-radio-bg--selected: var(--horizon-color-accent); --color-radio-border: var(--horizon-color-neutral-800); --color-radio-border--hover: var(--horizon-color-accent); --color-radio-border--selected: var(--horizon-color-accent); --color-radio-tile-border: color-mix(in oklab, var(--horizon-color-white) 10%, transparent); --color-radio-tile-border--hover: var(--horizon-color-neutral-300); --color-radio-tile-border--selected: var(--horizon-color-accent); --color-select-item-bg--hover: var(--horizon-color-level-four); --color-slider-track: var(--horizon-color-neutral-700); --color-slider-range: var(--horizon-color-neutral-50); --color-slider-thumb-border: var(--horizon-color-neutral-50); --color-slider-thumb-bg: var(--horizon-color-neutral-50); --color-slider-thumb-ring: var(--horizon-color-neutral-50); --color-switch-bg: var(--horizon-color-neutral-700); --color-switch-bg--checked: var(--horizon-color-white); --color-switch-thumb: var(--horizon-color-neutral-950); --color-switch-thumb--checked: var(--horizon-color-white); --color-tabs-bg: var(--horizon-color-level-one); --color-tabs-group-bg: var(--horizon-color-level-one); --color-tabs-indicator: var(--horizon-color-accent); --color-tabs-enclosed-indicator: var(--horizon-color-level-two); --color-tabs-border: var(--horizon-color-level-four); --color-toast-bg: var(--horizon-color-level-one); --color-toast-border: var(--horizon-color-level-four); --color-toast-text: var(--horizon-color-neutral-50); --color-toast-icon: var(--horizon-color-neutral-50); --color-toast-success-bg: color-mix(in oklab, var(--horizon-color-success-400) 10%, var(--horizon-color-neutral-950)); --color-toast-success-border: var(--horizon-color-success-400); --color-toast-success-text: var(--horizon-color-success-400); --color-toast-success-icon: var(--horizon-color-success-400); --color-toast-warning-bg: color-mix(in oklab, var(--horizon-color-warning-400) 10%, var(--horizon-color-neutral-950)); --color-toast-warning-border: var(--horizon-color-warning-400); --color-toast-warning-text: var(--horizon-color-warning-400); --color-toast-warning-icon: var(--horizon-color-warning-400); --color-toast-danger-bg: color-mix(in oklab, var(--horizon-color-danger-400) 10%, var(--horizon-color-neutral-950)); --color-toast-danger-border: var(--horizon-color-danger-400); --color-toast-danger-text: var(--horizon-color-danger-400); --color-toast-danger-icon: var(--horizon-color-danger-400); --color-toast-info-bg: color-mix(in oklab, var(--horizon-color-primary-400) 10%, var(--horizon-color-neutral-950)); --color-toast-info-border: var(--horizon-color-primary-400); --color-toast-info-text: var(--horizon-color-primary-400); --color-toast-info-icon: var(--horizon-color-primary-400); --color-toggle-bg: var(--horizon-color-level-two); --color-toggle-bg--active: var(--horizon-color-primary-500); --color-toggle-bg--hover: var(--horizon-color-level-four); --color-toggle-border: var(--horizon-color-transparent); --color-toggle-border--hover: var(--horizon-color-level-four); --color-toggle-border--active: var(--horizon-color-primary-500); --color-toggle-text: var(--horizon-color-neutral-50); --color-toggle-text--hover: var(--horizon-color-neutral-200); --color-toggle-text--active: var(--horizon-color-neutral-50); --color-toggle-outline-border: var(--horizon-color-neutral-600); --color-toggle-outline-border--hover: var(--horizon-color-neutral-400); --color-toggle-group-bg: var(--horizon-color-level-five); --color-tooltip-bg: var(--horizon-color-level-one); --color-tooltip-arrow: var(--horizon-color-level-one); --color-tooltip-outline-border: var(--horizon-color-level-four); --color-tooltip-outline-arrow: var(--horizon-color-level-four); }:root[data-theme=light]{--color-background: var(--horizon-color-neutral-50);--color-ring-offset: var(--horizon-color-neutral-50);--color-text-primary: var(--horizon-color-neutral-900);--color-text-secondary: var(--horizon-color-neutral-600);--color-card-bg: var(--horizon-color-level-one);--color-card-text: var(--horizon-color-neutral-900);--color-switch-bg: var(--horizon-color-neutral-300);--color-switch-bg--checked: var(--horizon-color-neutral-950);--color-switch-thumb: var(--horizon-color-neutral-50);--color-shadow-neumorphic: oklch(92.49% 0 0);--color-shadow-neumorphic-large: oklch(88.56% .0014 286.37)}@theme{ --font-sans: "Work Sans", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji"; --font-serif: "Bitter", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif; --font-mono: "Source Code Pro", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New", monospace; --ring: var(--color-accent); --ring-offset: var(--color-background); --animate-animate-in: animate-in; --animate-animate-out: animate-out; --animate-zoom-in-95: zoom-in-95; --animate-zoom-out-95: zoom-out-95; --animate-fade-in-0: fade-in-0; --animate-fade-out-0: fade-out-0; --animate-fade-in-tabs: fade-in-tabs .5s ease-in-out; --animate-slide-down-from-top: slide-down-from-top .3s ease-out; --animate-slide-up-to-top: slide-up-to-top .3s ease-out; --animate-fade-in-tabs-indicator: fade-in-tabs-indicator .3s ease-out; --animate-caret-blink: caret-blink 1.2s ease-out infinite; --animate-spin-around: spin-around .8s linear infinite; --animate-accordion-down: accordion-down .2s ease-out; --animate-accordion-up: accordion-up .2s ease-out; }@keyframes animate-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes animate-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes caret-blink{0%,70%,to{opacity:1}20%,50%{opacity:0}}@keyframes fade-in-0{0%{opacity:0}to{opacity:1}}@keyframes fade-out-0{0%{opacity:1}to{opacity:0}}@keyframes fade-in-tabs-indicator{0%{opacity:0;transform:translateY(-2rem)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down-from-top{0%{transform:translateY(-100%);opacity:0;scale:.95}to{transform:translateY(0);opacity:1;scale:1}}@keyframes slide-up-to-top{0%{transform:translateY(0);opacity:1;scale:1}to{transform:translateY(-100%);opacity:0;scale:.95}}@keyframes spin-around{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}@keyframes zoom-in-95{0%{opacity:0;transform:translate(-50%) translateY(-50%) scale(.95)}to{opacity:1;transform:translate(-50%) translateY(-50%) scale(1)}}@keyframes zoom-out-95{0%{opacity:1;transform:translate(-50%) translateY(-50%) scale(1)}to{opacity:0;transform:translate(-50%) translateY(-50%) scale(.95)}}@keyframes accordion-down{0%{height:0;opacity:0}to{height:var(--radix-accordion-content-height);opacity:1}}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height);opacity:1}to{height:0;opacity:0}}@plugin "tailwindcss-animate";