/* ============================================================
   ui/themes/mira.css — Mira theme
   Source: shadcn preset (baseColor: neutral, font: Inter)
   Same font + colors as Vega. Difference: Hugeicons icon library
   (doesn't affect CSS tokens). Colors inherit from :root.
   ============================================================ */

[data-theme="mira"] {
  --font-sans: "Inter", sans-serif;

  /* Button — Mira (very compact, text-xs) */
  --button-radius-xs: var(--radius-sm);
  --button-height-xs: calc(var(--spacing) * 5);
  --button-height-sm: calc(var(--spacing) * 6);
  --button-height-default: calc(var(--spacing) * 7);
  --button-height-lg: calc(var(--spacing) * 8);
  --button-size-icon: calc(var(--spacing) * 7);
  --button-size-icon-xs: calc(var(--spacing) * 5);
  --button-size-icon-sm: calc(var(--spacing) * 6);
  --button-size-icon-lg: calc(var(--spacing) * 8);
  --button-font-size-xs: 0.625rem;
  --button-font-size-sm: var(--text-xs);
  --button-font-size-default: var(--text-xs);
  --button-font-size-lg: var(--text-xs);
  --button-padding-xs: calc(var(--spacing) * 2);
  --button-padding-sm: calc(var(--spacing) * 2);
  --button-padding-default: calc(var(--spacing) * 2);
  --button-padding-lg: calc(var(--spacing) * 2.5);

  /* Badge — Mira (rounded-full, smaller text) */
  --badge-radius: var(--radius-rounded);
  --badge-font-size: 0.625rem;

  /* Label — Mira (text-xs, relaxed line-height) */
  --label-font-size: var(--text-xs);
  --label-line-height: var(--leading-relaxed);

  /* Input — Mira (rounded-md, h-7, text-xs) */
  --input-radius: var(--radius-md);
  --input-height: calc(var(--spacing) * 7);
  --input-height-xs: calc(var(--spacing) * 5);
  --input-height-sm: calc(var(--spacing) * 6);
  --input-height-default: calc(var(--spacing) * 7);
  --input-height-lg: calc(var(--spacing) * 8);

  /* Textarea — Mira (rounded-md, text-xs) */
  --textarea-radius: var(--radius-md);

  /* Small text — Mira (text-xs) */
  --font-size-sm: var(--text-xs);
  --field-legend-font-size: var(--text-sm);

  /* Skeleton — Mira (rounded-md) */
  --skeleton-radius: var(--radius-md);

  /* Kbd — Mira (rounded-sm, h-5) */
  --kbd-radius: var(--radius-sm);
  --kbd-height: calc(var(--spacing) * 5);

  /* Switch — Mira (smaller: 28x16.6, thumb 14) */
  --switch-radius: var(--radius-rounded);
  --switch-width-default: calc(var(--spacing) * 7);
  --switch-height-default: 16.6px;
  --switch-width-sm: calc(var(--spacing) * 6);
  --switch-height-sm: calc(var(--spacing) * 3.5);
  --switch-thumb-width-default: calc(var(--spacing) * 3.5);
  --switch-thumb-height-default: calc(var(--spacing) * 3.5);
  --switch-thumb-width-sm: calc(var(--spacing) * 3);
  --switch-thumb-height-sm: calc(var(--spacing) * 3);
  --switch-border-width: 1px;
  --switch-thumb-translate: calc(100% - 2px);

  /* Native Select — Mira (pl-2, pr-6, py-0.5, icon right-1.5) */
  --native-select-padding-x: calc(var(--spacing) * 2);
  --native-select-padding-right: calc(var(--spacing) * 6);
  --native-select-padding-y: calc(var(--spacing) * 0.5);
  --native-select-icon-right: calc(var(--spacing) * 1.5);

  /* Select — Mira (rounded-md, h-7, text-xs/relaxed, icon 3.5) */
  --select-trigger-radius: var(--radius-md);
  --select-trigger-height-default: calc(var(--spacing) * 7);
  --select-trigger-height-sm: calc(var(--spacing) * 6);
  --select-trigger-font-size: var(--text-xs);
  --select-trigger-padding-x: calc(var(--spacing) * 2);
  --select-trigger-padding-y: calc(var(--spacing) * 1.5);
  --select-trigger-gap: calc(var(--spacing) * 1.5);
  --select-icon-size: calc(var(--spacing) * 3.5);

  /* Field family — Mira (compact gaps) */
  --field-set-gap: calc(var(--spacing) * 4);
  --field-group-gap: calc(var(--spacing) * 4);
  --field-gap: calc(var(--spacing) * 2);
  --field-content-gap: calc(var(--spacing) * 0.5);
}