/* Shared text-entry behavior. Pages own geometry and material through variables. */
.fc-field-control {
  box-sizing: border-box;
  min-height: var(--fc-touch-target, 44px);
  color: var(--fc-field-color, currentColor);
  caret-color: var(--fc-field-caret, currentColor);
  transition:
    color var(--fc-motion-state, 180ms) var(--fc-state-ease, cubic-bezier(.2, 0, 0, 1)),
    background-color var(--fc-motion-state, 180ms) var(--fc-state-ease, cubic-bezier(.2, 0, 0, 1)),
    border-color var(--fc-motion-state, 180ms) var(--fc-state-ease, cubic-bezier(.2, 0, 0, 1)),
    box-shadow var(--fc-motion-state, 180ms) var(--fc-state-ease, cubic-bezier(.2, 0, 0, 1)),
    opacity var(--fc-motion-state, 180ms) var(--fc-state-ease, cubic-bezier(.2, 0, 0, 1));
}

.fc-field-control:focus {
  outline: none;
  border-color: var(--fc-field-focus-border, currentColor);
  background-color: var(--fc-field-focus-surface, transparent);
  box-shadow: var(--fc-field-focus-shadow, none);
}

.fc-field-control[aria-invalid="true"] {
  border-color: var(--fc-field-invalid-border, #a12323);
  background-color: var(--fc-field-invalid-surface, transparent);
  box-shadow: var(--fc-field-invalid-shadow, none);
}

.fc-field-control:disabled {
  cursor: not-allowed;
  opacity: var(--fc-field-disabled-opacity, .52);
}

@media (prefers-reduced-motion: reduce) {
  .fc-field-control {
    transition-duration: var(--fc-motion-instant, .001ms) !important;
  }
}