/* Verdannet UI - Design tokens v0.3.0 */
:root {
  color-scheme: light;

  /* Brand - blue refresh */
  --vd-blue-950: #203f56;
  --vd-blue-900: #294e69;
  --vd-blue-800: #365f7e;
  --vd-blue-700: #47769a;
  --vd-blue-600: #5f8eae;
  --vd-blue-400: #79a8c4;
  --vd-blue-100: #e4f0f7;
  --vd-blue-50: #f0f7fb;

  /* Legacy aliases kept for local application CSS compatibility */
  --vd-green-950: var(--vd-blue-950);
  --vd-green-900: var(--vd-blue-900);
  --vd-green-800: var(--vd-blue-800);
  --vd-green-700: var(--vd-blue-700);
  --vd-green-100: var(--vd-blue-100);
  --vd-green-50: var(--vd-blue-50);
  --vd-orange-500: #c28b3c;
  --vd-orange-700: #966825;

  /* Semantic - never themed by seasonal ambience */
  --vd-success: #198754;
  --vd-info: #236fa1;
  --vd-warning: #a96700;
  --vd-danger: #b42318;

  /* Surfaces and text */
  --vd-bg: #f6fafd;
  --vd-bg-soft: #f9fbfd;
  --vd-surface: #ffffff;
  --vd-surface-2: #eef6fb;
  --vd-text: #20313f;
  --vd-text-muted: #657786;
  --vd-border: #d9e5ec;
  --vd-border-strong: #c5d6e0;
  --vd-hover: #f0f7fb;

  /* Interaction */
  --vd-primary: var(--vd-blue-700);
  --vd-primary-hover: var(--vd-blue-800);
  --vd-primary-active: var(--vd-blue-900);
  --vd-primary-soft: var(--vd-blue-50);
  --vd-primary-contrast: #ffffff;
  --vd-accent: var(--vd-blue-400);
  --vd-accent-action: var(--vd-blue-800);
  --vd-focus: var(--vd-blue-700);

  /* Ambience hooks */
  --vd-ambience-tint: transparent;
  --vd-ambience-accent: var(--vd-accent);
  --vd-ambience-highlight: var(--vd-primary-soft);
  --vd-ambience-pattern: none;

  /* Typography */
  --vd-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --vd-font-mono: ui-monospace, "Cascadia Mono", "SFMono-Regular", Consolas, monospace;
  --vd-text-xs: 0.75rem;
  --vd-text-sm: 0.875rem;
  --vd-text-md: 0.9375rem;
  --vd-text-base: 1rem;
  --vd-text-lg: 1.125rem;
  --vd-text-xl: 1.375rem;
  --vd-text-2xl: 1.75rem;
  --vd-text-hero: clamp(2.5rem, 6vw, 4rem);

  /* Spacing - 4px grid */
  --vd-space-1: 0.25rem;
  --vd-space-2: 0.5rem;
  --vd-space-3: 0.75rem;
  --vd-space-4: 1rem;
  --vd-space-6: 1.5rem;
  --vd-space-8: 2rem;
  --vd-space-12: 3rem;
  --vd-space-16: 4rem;

  /* Shape */
  --vd-radius-sm: 0.625rem;
  --vd-radius-md: 0.875rem;
  --vd-radius-lg: 1.5rem;
  --vd-radius-pill: 999px;
  --vd-shadow-card: 0 7px 22px rgb(38 74 99 / 0.055);
  --vd-shadow-float: 0 14px 32px rgb(38 74 99 / 0.09);
  --vd-shadow-modal: 0 18px 55px rgb(25 55 75 / 0.15);

  /* Layout */
  --vd-shell-max: 90rem;
  --vd-portal-max: 73.75rem;
  --vd-header-height: 4.75rem;

  /* Density */
  --vd-control-height: 2.5rem;
  --vd-control-pad-x: 0.875rem;
  --vd-table-pad-y: 0.625rem;
  --vd-table-pad-x: 0.75rem;

  /* Motion */
  --vd-duration-fast: 150ms;
  --vd-duration-base: 200ms;
  --vd-ease: cubic-bezier(.2,.8,.2,1);
}

:root[data-vd-theme="dark"] {
  color-scheme: dark;
  --vd-bg: #101923;
  --vd-bg-soft: #14202b;
  --vd-surface: #192733;
  --vd-surface-2: #213340;
  --vd-text: #edf5fa;
  --vd-text-muted: #a8bac7;
  --vd-border: #304653;
  --vd-border-strong: #405d6d;
  --vd-hover: #203746;
  --vd-primary: #86b7d3;
  --vd-primary-hover: #9bc5dc;
  --vd-primary-active: #b2d3e5;
  --vd-primary-soft: #18364a;
  --vd-primary-contrast: #102534;
  --vd-focus: #9bc5dc;
  --vd-accent: #9bc5dc;
  --vd-accent-action: #b2d3e5;
  --vd-shadow-card: 0 8px 24px rgb(0 0 0 / 0.22);
  --vd-shadow-float: 0 14px 32px rgb(0 0 0 / 0.3);
  --vd-shadow-modal: 0 18px 55px rgb(0 0 0 / 0.45);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-vd-theme]) {
    color-scheme: dark;
    --vd-bg: #101923;
    --vd-bg-soft: #14202b;
    --vd-surface: #192733;
    --vd-surface-2: #213340;
    --vd-text: #edf5fa;
    --vd-text-muted: #a8bac7;
    --vd-border: #304653;
    --vd-border-strong: #405d6d;
    --vd-hover: #203746;
    --vd-primary: #86b7d3;
    --vd-primary-hover: #9bc5dc;
    --vd-primary-active: #b2d3e5;
    --vd-primary-soft: #18364a;
    --vd-primary-contrast: #102534;
    --vd-focus: #9bc5dc;
    --vd-accent: #9bc5dc;
    --vd-accent-action: #b2d3e5;
    --vd-shadow-card: 0 8px 24px rgb(0 0 0 / 0.22);
    --vd-shadow-float: 0 14px 32px rgb(0 0 0 / 0.3);
    --vd-shadow-modal: 0 18px 55px rgb(0 0 0 / 0.45);
  }
}

[data-vd-density="compact"] {
  --vd-control-height: 2.125rem;
  --vd-control-pad-x: 0.75rem;
  --vd-table-pad-y: 0.375rem;
  --vd-table-pad-x: 0.625rem;
}

[data-vd-density="comfortable"] {
  --vd-control-height: 2.75rem;
  --vd-control-pad-x: 1rem;
  --vd-table-pad-y: 0.75rem;
  --vd-table-pad-x: 1rem;
}

[data-vd-profile="technical"] {
  --vd-radius-sm: 0.25rem;
  --vd-radius-md: 0.375rem;
  --vd-radius-lg: 0.5rem;
  --vd-shadow-card: none;
}