


input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="tel"],
input[type="number"],
input[type="date"],
textarea,
select {
  width: 100%;
  padding: var(--space-3) var(--space-4);
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
  border: var(--border-width-1) solid var(--color-border, var(--color-neutral-300));
  border-radius: var(--radius-md);
  background-color: var(--color-bg-primary, var(--color-neutral-0));
  color: var(--color-text-primary);
  transition: var(--transition-fast);
}

input:hover,
textarea:hover,
select:hover {
  border-color: var(--color-primary);
}

input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--color-primary);
}


input::placeholder,
textarea::placeholder {
  color: var(--color-text-muted, var(--color-neutral-500));
  opacity: 1;
}


textarea {
  min-height: 120px;
  resize: vertical;
}


select {
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23868e96' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--space-4) center;
  padding-right: var(--space-10);
}


input[type="checkbox"],
input[type="radio"] {
  width: var(--space-5);
  height: var(--space-5);
  cursor: pointer;
  accent-color: var(--color-primary);
}


input:disabled,
textarea:disabled,
select:disabled,
button:disabled {
  opacity: var(--opacity-50);
  cursor: not-allowed;
}


label {
  display: inline-block;
  font-weight: var(--font-weight-medium);
  margin-bottom: var(--space-2);
  cursor: pointer;
}


fieldset {
  border: var(--border-width-1) solid var(--color-border, var(--color-neutral-300));
  border-radius: var(--radius-md);
  padding: var(--space-6);
  margin-bottom: var(--space-6);
}

legend {
  padding: 0 var(--space-2);
  font-weight: var(--font-weight-semibold);
}
