/* Forms */

.form {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.form__group {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.form__label {
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text-secondary);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.form__input,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="date"],
textarea,
select {
  width: 100%;
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-primary);
  background: var(--color-bg-input);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  outline: none;
  transition: all var(--transition-fast);
}

.form__input:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
textarea:focus,
select:focus {
  border-color: var(--color-border-focus);
  background: rgba(255, 255, 255, 0.06);
  box-shadow: 0 0 0 3px var(--color-accent-glow);
}

.form__input::placeholder,
input::placeholder {
  color: var(--color-text-muted);
}

input[type="date"] {
  color-scheme: dark;
}

fieldset {
  border: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.form-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.form-actions--center {
  justify-content: center;
}