/* ===== Migration hub ===== */
.mig-grid { display: flex; flex-direction: column; gap: 8px; }
.mig-tile { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; padding: 12px 14px; border: 1px solid var(--border); border-radius: 10px; background: var(--white); cursor: pointer; transition: border-color .12s, background .12s; }
.mig-tile:hover { border-color: var(--accent); background: var(--accent-soft); }
.mig-tile .mig-ic { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; background: var(--bg-warm); border-radius: 8px; flex-shrink: 0; color: var(--accent); }
.mig-tile .mig-ic svg { width: 18px; height: 18px; }
.mig-tile .mig-meta { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.mig-tile .mig-title { font-weight: 600; font-size: 13.5px; color: var(--ink); }
.mig-tile .mig-sub { font-size: 11.5px; color: var(--ink-mute); }

/* ===== CSV import preview table ===== */
#csv-import-table th, #csv-import-table td {
  padding: 6px 10px;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
#csv-import-table th:last-child, #csv-import-table td:last-child { border-right: none; }
#csv-import-table tbody tr:last-child td { border-bottom: none; }
#csv-import-table thead th { position: sticky; top: 0; background: var(--bg-cream); z-index: 2; }
#csv-import-table thead #csv-mapping-row th { top: 0; background: var(--white); z-index: 3; padding: 8px; }
#csv-import-table thead #csv-header-row th { top: 41px; }
.csv-map-select {
  width: 100%;
  font-size: 12px;
  padding: 4px 6px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--white);
  color: var(--ink);
  cursor: pointer;
}
.csv-map-select.mapped { border-color: var(--accent); color: var(--accent); font-weight: 600; }
.csv-map-select.skipped { color: var(--ink-mute); }
#csv-import-table tbody tr.row-excluded td { opacity: 0.4; }
#csv-import-table tbody tr.row-excluded td:first-child { opacity: 1; }
.csv-col-skipped { color: var(--ink-mute); }
tbody tr.selected { background: var(--accent-soft) !important; }
tbody tr.selected td { color: var(--ink); }
tbody tr.selected .checkbox { background: var(--accent); border-color: var(--accent); }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
thead { background: var(--bg-cream); }
th {
  text-align: left;
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink-mute);
  padding: 11px 14px;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
td {
  padding: 13px 14px;
  border-bottom: 1px solid var(--border-soft);
  color: var(--ink);
  vertical-align: middle;
}
tbody tr { cursor: pointer; transition: background 0.08s; }
tbody tr:hover { background: var(--bg-cream); }
tbody tr:last-child td { border-bottom: none; }
/* Sticky right-hand actions column. Needs an OPAQUE background (not `inherit`,
   which resolves to the transparent <tr>) + a stacking order, otherwise on a
   table wider than the viewport the data columns scroll through behind it and
   collide with the kebab — looks like Email/Phone overlapping. */
.row-actions-cell { width: 36px; padding: 0 6px !important; text-align: right; position: sticky; right: 0; z-index: 1; background: var(--white); }
tbody tr:hover .row-actions-cell { background: var(--bg-cream); }
tbody tr.selected .row-actions-cell { background: var(--accent-soft); }
.row-actions { position: relative; display: inline-flex; }
.row-kebab {
  display: inline-flex;
  visibility: hidden;
  align-items: center; justify-content: center;
  width: 26px; height: 26px;
  border: none; background: transparent; border-radius: 6px;
  cursor: pointer; color: var(--ink-mute);
  transition: background 0.1s, color 0.1s;
}
.row-kebab:hover { background: var(--border-soft); color: var(--ink); }
tbody tr:hover .row-kebab { visibility: visible; }
.row-dropdown {
  position: fixed;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(37,25,19,.10);
  min-width: 140px;
  z-index: 1000;
  padding: 4px;
}
.row-dropdown-item {
  display: flex; align-items: center; gap: 8px;
  width: 100%; padding: 8px 10px;
  border: none; background: transparent;
  font-family: inherit; font-size: 13px; color: var(--ink);
  cursor: pointer; border-radius: 6px; text-align: left;
}
.row-dropdown-item:hover { background: var(--bg-cream); }
.row-dropdown-item--danger { color: #dc2626; }
.row-dropdown-item--danger:hover { background: #fee2e2; }
td .pill {
  display: inline-flex; align-items: center;
  background: var(--accent-soft);
  color: var(--accent);
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}
.next-activity-link {
  cursor: pointer;
  color: var(--accent);
  border-bottom: 1px dashed transparent;
  transition: border-color .12s;
}
.next-activity-link:hover { border-bottom-color: var(--accent); }
td .linkedin-link {
  display: inline-flex; align-items: center; gap: 4px;
  color: #0077b5;
  text-decoration: none;
  font-size: 12px;
}
td .linkedin-link:hover { text-decoration: underline; }
.checkbox {
  width: 15px; height: 15px;
  border: 1.5px solid var(--border);
  border-radius: 3px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  background: var(--white);
  flex-shrink: 0;
  transition: border-color .1s, background .1s;
}
.checkbox:hover { border-color: var(--accent); }
.checkbox.checked {
  background: var(--accent);
  border-color: var(--accent);
}
.checkbox.checked::after {
  content: '';
  display: block;
  width: 8px;
  height: 5px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translateY(-1px);
}
.email-row.selected { background: var(--accent-soft) !important; }
.email-row.selected .checkbox { background: var(--accent); border-color: var(--accent); }
.email-row.selected .checkbox::after {
  content: '';
  display: block;
  width: 8px; height: 5px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translateY(-1px);
}

.badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 4px;
  letter-spacing: 0.02em;
}
.badge-cold    { background: #e0e7ff; color: #4338ca; }
.badge-warm    { background: #fef3c7; color: #b45309; }
.badge-hot     { background: #fee2e2; color: #b91c1c; }
.badge-customer{ background: #d1fae5; color: #047857; }