:root {
  --ty-form-error-color: #ff4d4f;
  --ty-form-error-hover: #ff7875;
  --ty-form-item-margin-bottom: 22px;
  --ty-form-label-line-height: 30px;
  --ty-form-label-color: var(--ty-color-text);
  --ty-form-label-font-size: var(--ty-font-size-base);
  --ty-form-label-required-margin-end: 3px;
  --ty-form-label-colon-margin: 0 8px 0 2px;
  --ty-form-input-min-height: 32px;
  --ty-form-notice-font-size: 13px;
  --ty-form-notice-radius: var(--ty-border-radius);
  --ty-form-notice-padding: 5px;
  --ty-form-notice-margin-top: 5px;
  --ty-form-helper-color: var(--ty-color-text-tertiary);
  --ty-form-feedback-font-size: 13px;
  --ty-form-feedback-line-height: 22px;
  --ty-form-error-shadow: 0 0 0 3px rgb(255 77 79 / 20%);
  --ty-form-notice-bg: #fff7cc;
  --ty-form-notice-color: #555;
}

[data-tiny-theme='dark'] {
  --ty-form-error-color: #e84749;
  --ty-form-error-hover: #d32029;
  --ty-form-item-margin-bottom: 22px;
  --ty-form-label-line-height: 30px;
  --ty-form-label-color: var(--ty-color-text);
  --ty-form-label-font-size: var(--ty-font-size-base);
  --ty-form-label-required-margin-end: 3px;
  --ty-form-label-colon-margin: 0 8px 0 2px;
  --ty-form-input-min-height: 32px;
  --ty-form-notice-font-size: 13px;
  --ty-form-notice-radius: var(--ty-border-radius);
  --ty-form-notice-padding: 5px;
  --ty-form-notice-margin-top: 5px;
  --ty-form-helper-color: var(--ty-color-text-tertiary);
  --ty-form-feedback-font-size: 13px;
  --ty-form-feedback-line-height: 22px;
  --ty-form-error-shadow: 0 0 0 3px rgb(255 77 79 / 20%);
  --ty-form-notice-bg: #2b2111;
  --ty-form-notice-color: rgba(255, 255, 255, 0.65);
}

@media (prefers-color-scheme: dark) {
  [data-tiny-theme='system'] {
  --ty-form-error-color: #e84749;
  --ty-form-error-hover: #d32029;
  --ty-form-item-margin-bottom: 22px;
  --ty-form-label-line-height: 30px;
  --ty-form-label-color: var(--ty-color-text);
  --ty-form-label-font-size: var(--ty-font-size-base);
  --ty-form-label-required-margin-end: 3px;
  --ty-form-label-colon-margin: 0 8px 0 2px;
  --ty-form-input-min-height: 32px;
  --ty-form-notice-font-size: 13px;
  --ty-form-notice-radius: var(--ty-border-radius);
  --ty-form-notice-padding: 5px;
  --ty-form-notice-margin-top: 5px;
  --ty-form-helper-color: var(--ty-color-text-tertiary);
  --ty-form-feedback-font-size: 13px;
  --ty-form-feedback-line-height: 22px;
  --ty-form-error-shadow: 0 0 0 3px rgb(255 77 79 / 20%);
  --ty-form-notice-bg: #2b2111;
  --ty-form-notice-color: rgba(255, 255, 255, 0.65);
}
}