/* =============================================================================
   Import Clients — the download-then-upload wizard
   =============================================================================
   The same shapes the other import pages carry inline. They live in a file here
   because a rule kept in a `<style>` block is a rule the next page cannot use
   and nobody can find.
   ========================================================================== */

/* The wizard's Next/Back sit in the card header, not under the table: a long
   review table would otherwise have to be scrolled past to advance. */
.wiz-nav { display: inline-flex; gap: 8px; align-items: center; }

/* Step 1 is one sentence in three columns — take the template, THEN send it
   back. Side by side, because the order is the instruction. */
.upload-3col {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto minmax(240px, 1fr);
  gap: 18px; align-items: stretch;
}
@media (max-width: 720px) { .upload-3col { grid-template-columns: 1fr; } }
.or-col { position: relative; display: flex; align-items: center; justify-content: center; }
.or-badge { font-weight: 700; font-size: 15px; letter-spacing: 1.5px; color: var(--color-text-muted); }
@media (min-width: 721px) {
  .or-col::before { content: ''; position: absolute; top: 8px; bottom: 8px; width: 1px; background: var(--color-border); }
  .or-badge { position: relative; background: var(--color-surface); padding: 8px 4px; }
}

/* What the file has to contain, said before it is uploaded rather than as an
   error afterwards. Chips, not a table: it is a checklist, not data. */
.exp-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.exp-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; padding: 5px 10px;
  border: 1px solid var(--color-border); border-radius: 5px;
  background: var(--color-control); color: var(--color-text);
}
.exp-chip::before { content: ''; flex: 0 0 auto; width: 5px; height: 5px; border-radius: 999px; background: var(--color-success); }
