/*
 * Default (light) theme — aligned to Factorial's f0 design system.
 * Accent / primary = radical (pink-red), focus & selection = viridian (teal),
 * danger = red, neutrals = f0 alpha-on-ink greys. Values mirror
 * @factorialco/f0-core (light mode); see the f0-look-and-feel skill.
 */
:root {
  --ycf-accent-color: hsl(348 80% 50%); /* radical.50 */
  --ycf-accent-color-darker: hsl(348 80% 42%); /* radical.60 */

  --ycf-selected-color: hsl(184 92% 35%); /* viridian.50 — focus / selection */
  --ycf-selected-color-darker: hsl(184 92% 28%); /* viridian.60 */

  --ycf-base-text-color: hsl(218 48% 10%); /* neutral-100 */
  --ycf-light-text-color: hsl(217 96% 11% / 0.61); /* neutral-50 */
  --ycf-danger-color: hsl(5 100% 65%); /* red.50 / critical */
  --ycf-danger-color-lighten: hsl(5 100% 65% / 0.1);
  --ycf-danger-color-darker: hsl(4 61% 49%); /* red.60 */
  --ycf-base-border-color: hsl(213 87% 15% / 0.2); /* neutral-30 */
  --ycf-skeleton-color: hsl(214 70% 20% / 0.1); /* neutral-20 */
  --ycf-base-x-spacing: 16px;

  --ycf-form-font-family: "Inter", ui-sans-serif, system-ui, -apple-system,
    BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ycf-form-font-family-monospace: "Consolas", monospace;

  --ycf-form-max-width: 720px;
  --ycf-form-background-color: hsl(0 0% 100%); /* f0 background */
  --ycf-form-border-width: 1px;
  --ycf-form-border-color: var(--ycf-base-border-color);
  --ycf-form-border-radius: 1rem; /* f0 xl (16px) */
  --ycf-form-title-size: 1.375rem; /* f0 2xl */
  --ycf-form-group-title-size: 1.125rem; /* f0 xl */
  --ycf-form-title-margin-bottom: 1.5rem;
  --ycf-form-group-title-border-color: var(--ycf-base-border-color);

  --ycf-link-color: var(--ycf-base-text-color);

  --ycf-field-text-color: var(--ycf-base-text-color);
  --ycf-field-placeholder-color: var(--ycf-light-text-color);
  --ycf-field-helper-text-color: var(--ycf-light-text-color);
  --ycf-field-background-color: hsl(0 0% 100%);
  --ycf-field-border-color: var(--ycf-base-border-color);
  --ycf-field-border-color-focus: var(--ycf-selected-color); /* viridian ring */
  --ycf-field-border-width: 1px;
  --ycf-field-border-radius: 0.625rem; /* f0 DEFAULT (10px) */
  --ycf-boolean-field-border-color: var(--ycf-field-border-color);
  --ycf-boolean-field-background-color: var(--ycf-field-background-color);
  --ycf-boolean-field-background-color-checked: var(--ycf-selected-color); /* viridian */
  --ycf-boolean-field-border-radius: 0.25rem; /* f0 2xs (4px) */

  --ycf-button-border-radius: 0.5rem; /* f0 sm (8px) */

  --ycf-button-primary-text-color: hsl(0 0% 100%);
  --ycf-button-primary-background-color: var(--ycf-accent-color);
  --ycf-button-primary-background-color-hover: var(--ycf-accent-color-darker);
  --ycf-button-primary-background-color-disabled: var(--ycf-accent-color-darker);
  --ycf-button-primary-border-color: var(--ycf-accent-color);
  --ycf-button-primary-border-color-hover: var(--ycf-accent-color-darker);
  --ycf-button-primary-border-color-disabled: var(--ycf-accent-color-darker);
  --ycf-button-primary-focus-visible-color: var(--ycf-accent-color-darker);

  --ycf-button-danger-text-color: hsl(0 0% 100%);
  --ycf-button-danger-background-color: var(--ycf-danger-color);
  --ycf-button-danger-background-color-hover: var(--ycf-danger-color-darker);
  --ycf-button-danger-background-color-disabled: var(--ycf-danger-color);
  --ycf-button-danger-border-color: var(--ycf-danger-color);
  --ycf-button-danger-border-color-hover: var(--ycf-danger-color-darker);
  --ycf-button-danger-border-color-disabled: var(--ycf-danger-color);
  --ycf-button-danger-focus-visible-color: var(--ycf-danger-color-darker);

  --ycf-button-light-text-color: hsl(218 48% 10%); /* neutral-100 */
  --ycf-button-light-background-color: hsl(216 89% 18% / 0.06); /* neutral-10 */
  --ycf-button-light-background-color-hover: hsl(214 70% 20% / 0.1); /* neutral-20 */
  --ycf-button-light-background-color-disabled: hsl(220 88% 17% / 0.04); /* neutral-5 */
  --ycf-button-light-border-color: hsl(216 89% 18% / 0.06);
  --ycf-button-light-border-color-hover: hsl(214 70% 20% / 0.1);
  --ycf-button-light-border-color-disabled: hsl(220 88% 17% / 0.04);
}