/* The settings that belong to auto-generation, revealed with it by the
   auto-generation Stimulus controller. They sit tighter than a form field of
   their own and are ruled off against the switch above, so the pair reads as a
   detail of that choice rather than as two more questions in the form. */
.generated-settings {
  margin: 12px 0 20px;
  padding-left: 16px;
  border-left: 2px solid var(--border-primary);
}

.generated-settings .form-field {
  margin-bottom: 12px;
}

.generated-settings .form-field:last-child {
  margin-bottom: 0;
}

/* Label and its info icon on one row: the icon otherwise wraps below the input
   it belongs to, which costs a line per setting and reads as unattached. */
.generated-settings .setting-label {
  display: flex;
  align-items: center;
  margin-bottom: 4px;
}

.generated-settings .form-field label {
  margin-bottom: 0;
  font-size: 0.9em;
}

.generated-settings .form-field select,
.generated-settings .form-field textarea {
  padding: 8px 12px;
}

.generated-settings .form-field textarea {
  min-height: 76px;
}

/* Link out to the FAQ comparison. Muted like a form hint, but it has to read as
   something you can click, and there is no global anchor style to inherit. */
.generated-settings .setting-link {
  display: inline-block;
  margin-top: 6px;
  color: var(--text-muted);
  font-size: 0.85em;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.generated-settings .setting-link:hover {
  color: var(--accent-primary);
}