/* Web/Field/Select (193:40), Web/Field/Text (214:41), Web/Field/Textarea (214:72) */

.aht-field {
  display: flex;
  flex-direction: column;
  gap: var(--aht-spacing-8);
  width: 100%;
}

.aht-field__label {
  color: var(--aht-color-text-secondary);
}

.aht-field__control {
  width: 100%;
  min-height: 48px;
  padding: var(--aht-spacing-12) var(--aht-spacing-16);
  background: var(--aht-color-background-raised);
  border: 1px solid var(--aht-color-border-default);
  border-radius: var(--aht-radius-6);
  color: var(--aht-color-text-primary);
  font-size: var(--aht-type-body-size);
  line-height: var(--aht-type-body-line);
  transition: border-color var(--aht-duration-fast) var(--aht-ease-standard);
}

select.aht-field__control {
  appearance: none;
  padding-right: var(--aht-spacing-40);
  /* Tabler chevron-down, stroked in the brand burgundy. */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23641c36' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--aht-spacing-12) center;
}

.aht-field__control--textarea {
  min-height: 148px;
  resize: vertical;
}

.aht-field__control:hover {
  border-color: var(--aht-color-border-strong);
}

.aht-field__control:focus {
  outline: 2px solid var(--aht-color-border-focus);
  outline-offset: 0;
  border-color: var(--aht-color-border-focus);
}

.aht-field__control:disabled {
  background: var(--aht-color-background-disabled);
  color: var(--aht-color-text-secondary);
  cursor: not-allowed;
}

.aht-field--error .aht-field__control {
  border-color: var(--aht-color-border-error);
}

.aht-field__error {
  color: var(--aht-color-status-error-foreground);
}

.aht-field__hint {
  color: var(--aht-color-text-secondary);
}