/*
 * Template Variable Supplements
 * These variables are used by template.css but defined inline or via JS in the original site.
 * Values extracted from mengxi computed styles.
 */

:root {
  /* Gap system — used via inline style --gap: var(--space-X) */
  --gap: 0px;
  --row-gap: 0px;
  --column-gap: 0px;
  --gap-small: 0px;
  --row-gap-small: 0px;
  --column-gap-small: 0px;
  --gap-small-medium: 0px;
  --row-gap-small-medium: 0px;
  --column-gap-small-medium: 0px;
  --gap-medium: 0px;
  --row-gap-medium: 0px;
  --column-gap-medium: 0px;
  --gap-large: 0px;
  --row-gap-large: 0px;
  --column-gap-large: 0px;

  /* Font */
  --font-family: Roobert, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, helvetica, arial, sans-serif;
  --line-height-base: 1.5;

  /* Button variants */
  --button-primary-text: #fff;
  --button-primary-background: var(--brand);
  --button-secondary-text: var(--text-primary);
  --button-secondary-background: var(--background-secondary);
  --button-secondary-border: var(--border-primary);
  --button-secondary-disabled-text: var(--gray-400);

  /* Additional semantic tokens */
  --text-brand: var(--brand);
  --text-color: var(--text-primary);
  --color-primary: var(--deep-green-300);
  --color-error: var(--red-300);
  --divider-primary: var(--border-divider);
  --fade-color: var(--background-primary);
  --radius-large: 12px;
  --deep-geen-300: var(--deep-green-300);

  /* Scrollbar */
  --scrollbar-width: 0px;

  /* Copy input */
  --copy-input-color: var(--text-primary);

  /* Focus */
  --focus-ring-color: var(--deep-green-300);

  /* Grid */
  --column-width: 227px;
  --rows: auto;
}