.feature-company-client-import,
.feature-company-client-import .container,
.feature-company-client-import .clients-workspace {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.feature-company-client-import__steps {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  margin: 0 0 var(--space-4);
  padding: 0;
  list-style: none;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  border-bottom: 1px solid var(--color-border-subtle);
  scrollbar-width: thin;
}

.feature-company-client-import__steps li {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 0.35rem;
  min-height: 44px;
  margin: 0;
  padding: 0 0.75rem;
  border-bottom: 2px solid transparent;
  color: var(--color-text-secondary);
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: var(--font-weight-medium, 500);
  white-space: nowrap;
}

.feature-company-client-import__steps li[aria-current="step"] {
  color: var(--color-text-primary);
  font-weight: var(--font-weight-semibold, 600);
  border-bottom-color: var(--color-accent);
}

.feature-company-client-import__panel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.feature-company-client-import__panel > p,
.feature-company-client-import__panel > .feature-company-workspace__meta {
  margin: 0;
}

.feature-company-client-import__map-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  width: 100%;
}

.feature-company-client-import fieldset {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
}

.feature-company-client-import__panel,
.feature-company-client-import__map-list,
.feature-company-client-import__field,
.feature-company-client-import__map-row,
.feature-company-client-import__file {
  max-width: 100%;
  min-width: 0;
}

.feature-company-client-import__field,
.feature-company-client-import__map-row,
.feature-company-client-import__file {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin: 0;
  width: 100%;
}

.feature-company-client-import__file {
  position: relative;
  align-items: flex-start;
}

.feature-company-client-import__file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.feature-company-client-import__file-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  min-width: 0;
  max-width: 100%;
}

.feature-company-client-import__field input,
.feature-company-client-import__field select,
.feature-company-client-import__map-row select,
.feature-company-client-import .action-btn,
.feature-company-client-import .ui-select,
.feature-company-client-import .ui-text-input {
  max-width: 100%;
  box-sizing: border-box;
}

.feature-company-client-import .clients-table-wrap {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.feature-company-client-import__error {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2);
  margin: 0 0 var(--space-3);
  color: inherit;
  overflow-wrap: break-word;
  word-break: normal;
  max-width: 100%;
  min-width: 0;
}

.feature-company-client-import__status {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2);
  min-width: 0;
  max-width: 100%;
}

.feature-company-client-import__pill {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--color-border-default);
  background: var(--color-bg-subtle);
  color: var(--color-text-primary);
  font-size: var(--font-size-xs, 0.75rem);
  font-weight: var(--font-weight-semibold, 600);
  line-height: 1.4;
  overflow-wrap: break-word;
  word-break: normal;
}

.feature-company-client-import__pill--ready {
  background: var(--color-success-soft);
  color: var(--color-success);
  border-color: rgba(21, 163, 106, 0.25);
}

.feature-company-client-import__pill--warning {
  background: rgba(201, 132, 2, 0.12);
  color: var(--color-warning);
  border-color: rgba(201, 132, 2, 0.28);
}

.feature-company-client-import__pill--error {
  background: var(--color-danger-soft);
  color: var(--color-danger);
  border-color: rgba(214, 69, 69, 0.28);
}

.feature-company-client-import__diagnostic {
  display: block;
  min-width: 0;
  max-width: 100%;
  color: var(--color-text-secondary, inherit);
  font-size: var(--font-size-xs, 0.75rem);
  line-height: 1.4;
  overflow-wrap: break-word;
  word-break: normal;
}

.feature-company-client-import__status-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2);
  margin: 0;
  min-width: 0;
  max-width: 100%;
}

.feature-company-client-import .clients-table {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

/*
 * Desktop receipts stay a table. Narrow widths reuse the Property import
 * stacked receipt: one full-width card per row, label from data-label.
 */
@media (min-width: 992px) {
  .feature-company-client-import .clients-table {
    table-layout: fixed;
  }
}

@media (max-width: 991px) {
  .clients-page.feature-company-client-import .clients-table-wrap {
    overflow-x: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .clients-page.feature-company-client-import .clients-table {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    table-layout: auto;
    border-collapse: separate;
    border-spacing: 0 var(--space-3);
  }

  .clients-page.feature-company-client-import .clients-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .clients-page.feature-company-client-import .clients-table tbody {
    display: grid;
    gap: var(--space-3);
  }

  .clients-page.feature-company-client-import .clients-table tbody tr {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    min-width: 0;
    max-width: 100%;
    padding: var(--space-4);
    background: var(--color-bg-elevated);
    border: 1px solid var(--color-border-subtle);
    border-radius: calc(var(--radius-lg) + 6px);
    box-shadow: var(--shadow-sm);
    grid-template-columns: none;
    grid-template-areas: none;
  }

  .clients-page.feature-company-clients.feature-company-client-import .clients-table tbody th,
  .clients-page.feature-company-clients.feature-company-client-import .clients-table tbody td,
  .clients-page.feature-company-client-import .clients-table tbody td {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
    min-width: 0;
    max-width: 100%;
    padding: 0;
    text-align: left;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
    grid-area: auto;
  }

  .clients-page.feature-company-client-import .clients-table tbody td::before {
    content: attr(data-label);
    font-size: 10px;
    font-weight: var(--font-weight-semibold, 600);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-tertiary);
  }
}

@media (max-width: 1440px) {
  .feature-company-client-import .clients-workspace {
    max-width: 100%;
  }
}

@media (max-width: 768px) {
  .feature-company-client-import__steps li {
    padding: 0 0.6rem;
  }
}

@media (max-width: 390px) {
  .feature-company-client-import .action-btn {
    width: 100%;
  }
}

@media (max-width: 320px) {
  .feature-company-client-import,
  .feature-company-client-import .container,
  .feature-company-client-import .clients-table-wrap {
    max-width: 100%;
    min-width: 0;
  }
}