/* PowerShare 2 - FOI request builder view styles
   Tokens only (css/tokens.css) - no raw hex, no inline styles. */

.foi-steps {
  display: flex;
  gap: var(--space-3);
  margin-bottom: var(--space-5);
  flex-wrap: wrap;
}

.foi-step {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: var(--colour-text-muted);
}

.foi-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: var(--colour-surface-alt);
  border: 1.5px solid var(--colour-border-strong);
  font-size: var(--text-xs);
  font-weight: 700;
}

.foi-step.active { color: var(--colour-brand-dark); font-weight: 700; }
.foi-step.active .foi-step-num {
  background: var(--colour-brand);
  border-color: var(--colour-brand);
  color: var(--colour-text-invert);
}

.foi-step.completed .foi-step-num {
  background: var(--colour-brand-pale);
  border-color: var(--colour-brand-light);
  color: var(--colour-brand-dark);
}

.foi-panel { display: grid; gap: var(--space-1); }

.foi-panel-title {
  font-size: var(--text-lg);
  color: var(--colour-brand-dark);
  margin-bottom: var(--space-1);
}

.foi-panel-hint {
  font-size: var(--text-sm);
  color: var(--colour-text-muted);
  margin-bottom: var(--space-2);
}

.foi-field { margin-bottom: var(--space-4); }

.foi-prompt-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
}

.foi-prompt-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-pill);
  border: 1px solid var(--colour-border-strong);
  background: var(--colour-surface);
  font-size: var(--text-sm);
  color: var(--colour-brand-dark);
}
.foi-prompt-btn:hover { background: var(--colour-brand-pale); }

.foi-actions {
  display: flex;
  gap: var(--space-3);
  margin-top: var(--space-3);
  flex-wrap: wrap;
}

.foi-preview {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  padding: var(--space-3);
  border: 1.5px solid var(--colour-border-strong);
  border-radius: var(--radius-md);
  background: var(--colour-surface-alt);
  color: var(--colour-text);
  resize: vertical;
  margin-bottom: var(--space-3);
}

.foi-send-options {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-bottom: var(--space-2);
}

.foi-copy-success {
  color: var(--colour-success);
  font-size: var(--text-sm);
  font-weight: 600;
}