site/src/styles/ariakit.css
/**
 * Copyright 2025-present Ariakit FZ-LLC. All Rights Reserved.
 *
 * This software is proprietary. See the license.md file in the root of this
 * package for licensing terms.
 *
 * SPDX-License-Identifier: UNLICENSED
 */
@import "tailwindcss";
@import "@ariakit/tailwind";

@import "./ak-aurora.css";
@import "./ak-icon.css";
@import "./ak-badge.css";
@import "./ak-command.css";
@import "./ak-button.css";
@import "./ak-checkbox.css";
@import "./ak-radio.css";
@import "./ak-option.css";
@import "./ak-tab.css";
@import "./ak-popover.css";
@import "./ak-dialog.css";
@import "./ak-disclosure.css";
@import "./ak-nav.css";
@import "./ak-tooltip.css";
@import "./ak-select.css";
@import "./ak-container.css";
@import "./ak-input.css";
@import "./ak-kbd.css";
@import "./ak-link.css";
@import "./ak-progress.css";
@import "./ak-list.css";
@import "./ak-heading.css";
@import "./ak-segmented.css";
@import "./ak-table.css";
@import "./ak-sidebar.css";
@import "./ak-prose.css";

@theme {
  --color-canvas: oklch(99.33% 0.0011 197.14);
  --color-primary: oklch(56.7% 0.154556 248.5156);
  --color-secondary: oklch(65.59% 0.2118 354.31);

  --radius-container: var(--radius-xl);
  --spacing-container: --spacing(1);

  --radius-tooltip: var(--radius-lg);
  --spacing-tooltip: --spacing(1);

  --radius-dialog: var(--radius-2xl);
  --spacing-dialog: --spacing(4);

  --radius-playground: calc(var(--radius) * 3.5);
  --spacing-playground: --spacing(0);

  --radius-field: var(--radius-lg);
  --spacing-field: 0.75em;

  --radius-card: var(--radius-xl);
  --spacing-card: --spacing(4);

  --radius-badge: var(--radius-full);
  --spacing-badge: --spacing(1.5);

  --font-sans:
    "Inter Variable", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

:root {
  @variant dark {
    /* --color-canvas: oklch(16.52% 0.0062 285.7); */
    /* --color-canvas: theme(--color-slate-950); */
    --color-canvas: oklch(16.34% 0.0091 264.28);
  }
}

body {
  @apply ak-layer-canvas;
}
