@import "tw-animate-css";

/* src/index.css */
@source "./";
@custom-variant light (&:where([data-theme="light"], [data-theme="light"] *));
@custom-variant dark (&:where([data-theme="dark"], [data-theme="dark"] *));
:root,
[data-theme=light] {
  --seq-color-positive: var(--color-green-600);
  --seq-color-negative: var(--color-red-600);
  --seq-color-info: var(--color-indigo-600);
  --seq-color-warning: var(--color-yellow-500);
  --seq-color-destructive: var(--color-red-600);
  --seq-color-primary: var(--color-slate-800);
  --seq-color-secondary: var(--color-slate-800);
  --seq-color-muted: var(--color-slate-500);
  --seq-color-inverse: var(--color-slate-50);
  --seq-color-button-primary: var(--color-white);
  --seq-color-background-primary: var(--color-slate-50);
  --seq-color-background-secondary: white;
  --seq-color-background-muted: var(--color-slate-100);
  --seq-color-background-inverse: var(--color-slate-950);
  --seq-color-background-overlay: color-mix( in oklab, var(--color-slate-300) 80%, transparent );
  --seq-color-background-raised: white;
  --seq-color-background-input: var(--color-slate-50);
  --seq-color-background-hover: var(--color-slate-100);
  --seq-color-background-active: var(--color-slate-200);
  --seq-color-border-normal: var(--color-slate-300);
  --seq-color-border-hover: var(--color-slate-400);
  --seq-color-border-focus: var(--color-violet-600);
  --seq-color-border-card: var(--color-slate-200);
  --seq-color-border-button: var(--color-slate-300);
  --seq-color-drop-shadow: color-mix( in oklab, var(--color-slate-950) 15%, transparent );
  --seq-color-gradient-backdrop:
    linear-gradient(
      
      243.18deg,
      rgba(86, 52, 189, 0.85) 0%,
      rgba(49, 41, 223, 0.85) 63.54%,
      rgba(7, 98, 149, 0.85) 100% );
  --seq-color-gradient-primary:
    linear-gradient(
      
      89.69deg,
      #4411e1 0.27%,
      #7537f9 99.73% );
  --seq-color-gradient-secondary:
    linear-gradient(
      
      32.51deg,
      #951990 -15.23%,
      #3a35b1 48.55%,
      #20a8b0 100% );
  --seq-color-gradient-skeleton:
    linear-gradient(
      
      -45deg,
      transparent,
      var(--color-slate-300),
      transparent );
}
[data-theme=dark] {
  --seq-color-positive: var(--color-green-500);
  --seq-color-negative: var(--color-red-500);
  --seq-color-info: var(--color-indigo-500);
  --seq-color-warning: var(--color-yellow-500);
  --seq-color-destructive: var(--color-red-500);
  --seq-color-primary: white;
  --seq-color-secondary: white;
  --seq-color-muted: var(--color-zinc-500);
  --seq-color-inverse: black;
  --seq-color-button-primary: var(--color-white);
  --seq-color-background-primary: black;
  --seq-color-background-secondary: var(--color-zinc-900);
  --seq-color-background-muted: var(--color-zinc-950);
  --seq-color-background-inverse: white;
  --seq-color-background-overlay: color-mix( in oklab, var(--color-zinc-700) 90%, transparent );
  --seq-color-background-raised: var(--color-zinc-800);
  --seq-color-background-input: var(--color-zinc-950);
  --seq-color-background-hover: var(--color-zinc-900);
  --seq-color-background-active: var(--color-zinc-700);
  --seq-color-border-normal: var(--color-zinc-700);
  --seq-color-border-hover: var(--color-zinc-600);
  --seq-color-border-focus: var(--color-violet-500);
  --seq-color-border-card: var(--color-zinc-800);
  --seq-color-border-button: var(--color-zinc-700);
  --seq-color-drop-shadow: color-mix( in oklab, var(--color-zinc-950) 40%, transparent );
  --seq-color-gradient-backdrop:
    linear-gradient(
      
      243.18deg,
      rgba(86, 52, 189, 0.85) 0%,
      rgba(49, 41, 223, 0.85) 63.54%,
      rgba(7, 98, 149, 0.85) 100% );
  --seq-color-gradient-primary:
    linear-gradient(
      
      89.69deg,
      #4411e1 0.27%,
      #7537f9 99.73% );
  --seq-color-gradient-secondary:
    linear-gradient(
      
      32.51deg,
      #951990 -15.23%,
      #3a35b1 48.55%,
      #20a8b0 100% );
  --seq-color-gradient-skeleton:
    linear-gradient(
      
      -45deg,
      transparent,
      var(--color-zinc-700),
      transparent );
}
@theme inline { --font-body: "Inter", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-mono: "Roboto", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --color-primary: var(--seq-color-primary); --color-secondary: var(--seq-color-secondary); --color-muted: var(--seq-color-muted); --color-inverse: var(--seq-color-inverse); --color-positive: var(--seq-color-positive); --color-negative: var(--seq-color-negative); --color-info: var(--seq-color-info); --color-warning: var(--seq-color-warning); --color-success: var(--seq-color-positive); --color-destructive: var(--seq-color-destructive); --color-button-primary: var(--seq-color-button-primary); --color-background-primary: var(--seq-color-background-primary); --color-background-secondary: var(--seq-color-background-secondary); --color-background-muted: var(--seq-color-background-muted); --color-background-inverse: var(--seq-color-background-inverse); --color-background-overlay: var(--seq-color-background-overlay); --color-background-raised: var(--seq-color-background-raised); --color-background-input: var(--seq-color-background-input); --color-background-hover: var(--seq-color-background-hover); --color-background-active: var(--seq-color-background-active); --color-border-normal: var(--seq-color-border-normal); --color-border-hover: var(--seq-color-border-hover); --color-border-focus: var(--seq-color-border-focus); --color-border-card: var(--seq-color-border-card); --color-border-button: var(--seq-color-border-button); --color-drop-shadow: var(--seq-color-drop-shadow); --background-image-gradient-backdrop: var(--seq-color-gradient-backdrop); --background-image-gradient-primary: var(--seq-color-gradient-primary); --background-image-gradient-secondary: var(--seq-color-gradient-secondary); --background-image-gradient-skeleton: var(--seq-color-gradient-skeleton); --animate-skeleton: skeleton 3s ease infinite; --animate-swipe-out: swipe-out 200ms ease-out; --shadow-primary: 0 0 16px 0 var(--seq-color-drop-shadow); @keyframes skeleton { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } @keyframes swipe-out { from { transform: translateX(var(--radix-toast-swipe-end-x)); } to { transform: translateX(100%); } } }
:root {
  --base-unit: 16;
  color: var(--color-primary);
}
@utility grid-stack { @apply grid grid-cols-1 grid-rows-1 *:col-start-1 *:row-start-1; }
@utility text-* { font-size: calc(--value(integer) / var(--base-unit) * 1rem); }
@utility text-xxxlarge { @apply font-body font-bold text-6xl tracking-normal leading-15; }
@utility text-xxlarge { @apply font-body font-bold text-4xl tracking-widest leading-10; }
@utility text-xlarge { @apply font-body font-bold text-2xl tracking-normal leading-8; }
@utility text-large { @apply font-body font-semibold text-xl tracking-normal leading-7; }
@utility text-medium { @apply font-body font-bold text-base tracking-normal leading-6; }
@utility text-normal-bold { @apply font-body font-bold text-sm tracking-wide leading-5; }
@utility text-normal { @apply font-body font-medium text-sm tracking-wide leading-5; }
@utility text-small-bold { @apply font-body font-bold text-xs tracking-normal leading-4; }
@utility text-small { @apply font-body font-medium text-xs tracking-wide leading-4; }
@utility text-xsmall-bold { @apply font-body font-bold text-[0.625rem] tracking-wide leading-4; }
@utility text-xsmall { @apply font-body font-bold text-[0.625rem] tracking-wide leading-4; }
@utility text-code { @apply font-mono font-normal text-sm tracking-normal leading-5; }
