/* Hosted-only setup; shares the dashboard's dark surfaces and lavender accent. */
.hosted-setup {
  position: fixed;
  z-index: 1600;
  inset: 72px 24px auto auto;
  width: min(540px, calc(100vw - 48px));
  max-height: calc(100dvh - 96px);
  box-sizing: border-box;
  overflow-y: auto;
  padding: 24px;
  color: #fafafa;
  background: #242428;
  border-radius: 12px;
  box-shadow: 0 16px 48px rgb(0 0 0 / 45%);
  font-size: 15px;
  line-height: 1.5;
  scrollbar-width: thin;
  scrollbar-color: #72727c #242428;
}
.hosted-setup * { box-sizing: border-box; }
.hosted-setup h2 { font-size: 23px; line-height: 1.2; margin: 0; text-wrap: balance; }
.hosted-setup p { margin: 0 0 16px; }
.setup-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.setup-header button { flex-shrink: 0; }
.setup-progress, .setup-muted { color: #c3c3cc; font-size: 13px; }
.hosted-setup fieldset { border: 0; padding: 0; margin: 0 0 22px; min-width: 0; }
.hosted-setup legend { font-weight: 600; margin-bottom: 8px; }
.setup-choice { display: flex; gap: 10px; align-items: center; margin-block: 10px; cursor: pointer; }
.setup-choice input { accent-color: #c5adff; width: 18px; height: 18px; flex-shrink: 0; margin: 0; }
.setup-field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.setup-field :is(input, select, textarea) { width: 100%; color: #fafafa; background: #18181b; border: 1px solid #72727c; border-radius: 6px; padding: 10px; font: inherit; caret-color: #c5adff; }
.setup-field textarea { resize: vertical; }
.setup-field textarea::placeholder { color: #b9b9c4; }
.hosted-setup button, .setup-connections a { border: 1px solid #72727c; border-radius: 6px; background: transparent; color: #fafafa; padding: 8px 12px; font: inherit; font-size: 13px; cursor: pointer; }
.hosted-setup button:hover, .setup-connections a:hover { background: #37373f; }
.hosted-setup .setup-primary { background: #c5adff; border-color: #c5adff; color: #18181b; font-weight: 600; }
.hosted-setup .setup-primary:hover { background: #d6c5ff; }
.hosted-setup button:disabled { opacity: .55; cursor: wait; }
.hosted-setup :focus-visible { outline: 2px solid #c5adff; outline-offset: 3px; }
.hosted-setup ::selection { color: #18181b; background: #c5adff; }
.setup-connections { padding: 0; list-style: none; margin: 24px 0 16px; }
.setup-connections li { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 16px; border-bottom: 1px solid #494951; }
.setup-connections small { display: block; color: #c3c3cc; }
.setup-connections a { text-decoration: underline; text-underline-offset: 3px; text-align: center; }
.setup-note { padding-top: 16px; border-top: 1px solid #494951; color: #ded8ec; }
.hosted-setup ol { padding-left: 22px; }
.hosted-setup ol li { margin-bottom: 12px; }
.setup-status { color: #c5adff; min-height: 1.5em; margin-top: 16px !important; }
.setup-status.error { color: #ffb5b5; }
.setup-footer { position: sticky; bottom: -24px; background: #242428; padding-block: 12px; display: flex; justify-content: flex-end; gap: 12px; }
@media (max-width: 600px) {
  .hosted-setup { inset: 12px 12px auto; width: auto; max-height: calc(100dvh - 24px); padding: 20px; }
  .setup-header { flex-direction: column; gap: 12px; }
  .hosted-setup h2 { font-size: 22px; }
  .setup-connections li { gap: 12px; }
}
