/* ───────────────────────────────────────────────────────────
   Admin Console — Investor Network redesign
   Navy sidebar, rounded cards, soft pills, primary blue actions.
   Tokens scoped to .admin-layout-shell so they never leak to the
   marketing / investor-facing surfaces.
   ─────────────────────────────────────────────────────────── */

.admin-layout-shell {
  /* surfaces */
  --ac-bg: #F4F6FA;
  --ac-surface: #FFFFFF;
  --ac-surface-2: #FAFBFD;
  --ac-border: #E4E8EF;
  --ac-border-strong: #D6DCE6;

  /* sidebar */
  --ac-sidebar: #0F1F38;
  --ac-sidebar-text: rgba(255, 255, 255, 0.78);
  --ac-sidebar-muted: rgba(255, 255, 255, 0.48);
  --ac-sidebar-section: rgba(255, 255, 255, 0.38);
  --ac-sidebar-hover: rgba(255, 255, 255, 0.06);
  --ac-sidebar-active: rgba(86, 144, 255, 0.16);
  --ac-sidebar-rail: #5B9BFF;

  /* text */
  --ac-text: #0F172A;
  --ac-text-2: #475569;
  --ac-text-3: #94A3B8;

  /* brand */
  --ac-brand: #2F7CF6;
  --ac-brand-600: #2167DF;
  --ac-brand-50: #EAF2FE;
  --ac-brand-100: #D6E5FD;

  /* status */
  --ac-green-50: #E6F7EE;
  --ac-green-100: #C9EFD9;
  --ac-green-500: #1EA85C;
  --ac-green-700: #167A43;
  --ac-amber-50: #FFF6E0;
  --ac-amber-100: #FCE7B3;
  --ac-amber-700: #8C5A0C;
  --ac-rose-50: #FEEAEA;
  --ac-rose-100: #FBCFCF;
  --ac-rose-700: #B23232;

  /* violet program pill */
  --ac-violet-50: #F2EEFE;
  --ac-violet-text: #5B36C9;
  --ac-violet-100: #E0D6F9;

  --ac-shadow-sm: 0 1px 2px rgba(15, 31, 56, 0.04);
  --ac-shadow-md: 0 2px 8px rgba(15, 31, 56, 0.06), 0 0 0 0.5px rgba(15, 31, 56, 0.04);
  --ac-shadow-lg: 0 12px 32px rgba(15, 31, 56, 0.12), 0 0 0 0.5px rgba(15, 31, 56, 0.06);
}

.admin-layout-shell { background: var(--ac-bg); }

/* ── Navy sidebar ───────────────────────────────────────────── */
.admin-sidebar {
  background: var(--ac-sidebar);
  color: var(--ac-sidebar-text);
  border-right: 0 !important;
}
.admin-sidebar .admin-sidebar-brand {
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
.admin-sidebar .admin-sidebar-brand:hover { background: var(--ac-sidebar-hover); }
.admin-sidebar .admin-sidebar-eyebrow p {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ac-sidebar-section);
}
.admin-sidebar .nav-section {
  margin-bottom: 4px;
  padding: 0 10px;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ac-sidebar-section);
}
.admin-sidebar .nav-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ac-sidebar-text);
  text-decoration: none;
  transition: background 0.12s, color 0.12s;
}
.admin-sidebar .nav-item:hover { background: var(--ac-sidebar-hover); color: #fff; }
.admin-sidebar .nav-item .nav-count {
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  color: var(--ac-sidebar-muted);
  background: rgba(255, 255, 255, 0.06);
  padding: 2px 7px;
  border-radius: 999px;
  font-weight: 500;
}
/* Unread-style dot for the Jobs item: something failed, or a scheduled task
   missed its window. Deliberately not a count — the number doesn't change
   what you do about it, and a count invites triaging instead of opening. */
.admin-sidebar .nav-item .nav-dot {
  /* .nav-item is a flex row with space-between; pin the basis so the dot
     can't be shrunk by a longer label beside it. */
  display: block;
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  margin-right: 2px;
  border-radius: 999px;
  background: #ef4444;
  box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.25);
}
.admin-sidebar .nav-item.is-active {
  background: var(--ac-sidebar-active);
  color: #fff;
}
.admin-sidebar .nav-item.is-active .nav-count {
  background: rgba(91, 155, 255, 0.18);
  color: #B9D2FF;
}
.admin-sidebar .nav-item.is-active::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--ac-sidebar-rail);
}
.admin-sidebar .admin-sidebar-signout {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.admin-sidebar .admin-sidebar-signout span {
  color: var(--ac-sidebar-muted);
}
.admin-sidebar .admin-sidebar-signout span:hover {
  background: var(--ac-sidebar-hover);
  color: #fff;
}

/* ─────────────────────────────────────────────────────────────
   Investor Network page (.ac-page)
   ───────────────────────────────────────────────────────────── */
.ac-page { color: var(--ac-text); }

/* Page header */
.ac-page .page-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
}
.ac-page .page-head .title-wrap { display: flex; align-items: center; gap: 12px; }
.ac-page .page-icon {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: var(--ac-brand-50);
  color: var(--ac-brand-600);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.ac-page .page-icon svg { width: 19px; height: 19px; }
.ac-page .page-title {
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.018em;
  color: var(--ac-text);
  line-height: 1.2;
}
.ac-page .page-sub {
  font-size: 13px;
  color: var(--ac-text-2);
  margin-top: 2px;
}
.ac-page .page-actions { margin-left: auto; display: flex; gap: 8px; }

/* Buttons */
.ac-page .ac-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid transparent;
  background: var(--ac-brand);
  color: #fff;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: -0.005em;
  padding: 9px 16px;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.12s, transform 0.06s;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 1px 2px rgba(31, 95, 215, 0.18);
}
.ac-page .ac-btn:hover { background: var(--ac-brand-600); }
.ac-page .ac-btn:active { transform: translateY(0.5px); }
.ac-page .ac-btn svg { width: 14px; height: 14px; }
.ac-page .ac-btn.is-success {
  background: var(--ac-green-500);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 1px 2px rgba(22, 122, 67, 0.2);
}
/* Ghost-button flash (e.g. Send reset confirming "Reset sent"). */
.ac-page .ac-btn-ghost.is-success { border-color: var(--ac-green-100); background: var(--ac-green-50); color: var(--ac-green-700); }
.ac-page .ac-btn-ghost.is-error { border-color: var(--ac-rose-100); background: var(--ac-rose-50); color: var(--ac-rose-700); }
.ac-page .ac-btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--ac-border-strong);
  background: var(--ac-surface);
  color: var(--ac-text);
  font-size: 13px;
  font-weight: 500;
  padding: 8px 14px;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
}
.ac-page .ac-btn-ghost:hover { background: var(--ac-surface-2); border-color: #BFC8D6; }
.ac-page .ac-btn-ghost svg { width: 14px; height: 14px; }
.ac-page .ac-btn-ghost.is-danger { color: var(--ac-rose-700); border-color: var(--ac-rose-100); }
.ac-page .ac-btn-ghost.is-danger:hover { background: var(--ac-rose-50); }
.ac-page .ac-btn-sm { padding: 5px 11px; font-size: 12px; border-radius: 8px; }
/* Disabled controls (e.g. Stripe link before HAPI is wired up): greyed and inert. */
.ac-page .ac-btn:disabled,
.ac-page .ac-btn-ghost:disabled { opacity: 0.5; cursor: not-allowed; }
.ac-page .ac-btn:disabled:hover { background: var(--ac-brand); }
.ac-page .ac-btn-ghost:disabled:hover { background: var(--ac-surface); border-color: var(--ac-border); }
.ac-page .ac-link-btn {
  background: transparent;
  border: 0;
  color: var(--ac-text-2);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  padding: 7px 6px;
}
.ac-page .ac-link-btn:hover { color: var(--ac-text); text-decoration: underline; }

/* Filter tabs */
.ac-page .ac-tabs { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 14px; }
.ac-page .ac-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  color: var(--ac-text-2);
  background: transparent;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.12s;
}
.ac-page .ac-tab:hover { background: var(--ac-surface); color: var(--ac-text); }
.ac-page .ac-tab.is-active {
  background: var(--ac-brand-50);
  color: var(--ac-brand-600);
  border-color: var(--ac-brand-100);
  font-weight: 600;
}
.ac-page .ac-tab .ac-tab-count {
  font-size: 11.5px;
  background: rgba(15, 23, 42, 0.06);
  padding: 1px 7px;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
.ac-page .ac-tab.is-active .ac-tab-count {
  background: rgba(47, 124, 246, 0.16);
  color: var(--ac-brand-600);
}

/* Toolbar */
.ac-page .ac-toolbar { display: flex; gap: 10px; align-items: center; margin-bottom: 18px; }
.ac-page .ac-search { flex: 1; position: relative; }
.ac-page .ac-search img,
.ac-page .ac-search svg {
  position: absolute;
  left: 14px; top: 50%;
  transform: translateY(-50%);
  width: 16px; height: 16px;
  opacity: 0.6;
  pointer-events: none;
}
.ac-page .ac-search input {
  width: 100%;
  height: 42px;
  border: 1px solid var(--ac-border-strong);
  border-radius: 10px;
  padding: 0 14px 0 40px;
  font-size: 14px;
  background: var(--ac-surface);
  color: var(--ac-text);
  outline: none;
  transition: border-color 0.12s, box-shadow 0.12s;
}
.ac-page .ac-search input:focus {
  border-color: var(--ac-brand);
  box-shadow: 0 0 0 3px rgba(47, 124, 246, 0.14);
}
.ac-page .ac-search input::placeholder { color: var(--ac-text-3); }

/* Results card */
.ac-page .ac-card {
  background: var(--ac-surface);
  border: 1px solid var(--ac-border);
  border-radius: 14px;
  box-shadow: var(--ac-shadow-md);
  overflow: hidden;
}
.ac-page .ac-card + .ac-card { margin-top: 20px; }
.ac-page .ac-card-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--ac-border);
}
.ac-page .ac-card-title { font-size: 14px; font-weight: 600; letter-spacing: -0.005em; color: var(--ac-text); }
.ac-page .ac-card-meta { font-size: 12.5px; color: var(--ac-text-2); }
.ac-page .ac-card-meta strong { color: var(--ac-text); font-weight: 600; }

/* Table */
.ac-page .ac-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.ac-page .ac-table thead th {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ac-text-3);
  text-align: left;
  padding: 12px 20px;
  background: var(--ac-surface-2);
  border-bottom: 1px solid var(--ac-border);
  white-space: nowrap;
}
.ac-page .ac-table thead th.is-right { text-align: right; }
.ac-page .ac-table--fit thead th,
.ac-page .ac-table--fit thead th.is-right { text-align: center; }
.ac-page .ac-table--fit thead th .ac-sort { justify-content: center; }
/* Text columns keep left-reading headers so the label sits over the text;
   badge/button columns stay centered with centered content beneath. */
.ac-page .ac-table--fit thead th.is-left { text-align: left; }
.ac-page .ac-table--fit thead th.is-left .ac-sort { justify-content: flex-start; }
.ac-page .ac-table thead th .ac-sort {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.ac-page .ac-table thead th .ac-sort:hover { color: var(--ac-text-2); }
.ac-page .ac-table thead th .ac-sort.is-active { color: var(--ac-text-2); }
.ac-page .ac-table thead th .ac-sort .ac-sort-arrow {
  font-size: 10px;
  line-height: 1;
  opacity: 0.45;
}
.ac-page .ac-table thead th .ac-sort.is-active .ac-sort-arrow { opacity: 1; color: var(--ac-brand); }
.ac-page .ac-table tbody td {
  padding: 9px 20px;
  border-bottom: 1px solid var(--ac-border);
  color: var(--ac-text);
  vertical-align: middle;
}
.ac-page .ac-table tbody.ac-row-group:last-child td { border-bottom: 0; }
.ac-page .ac-row { cursor: pointer; transition: background 0.08s; }
.ac-page .ac-row:hover > td { background: var(--ac-surface-2); }
.ac-page .ac-row:focus-visible { outline: none; }
.ac-page .ac-row:focus-visible > td:first-child { box-shadow: inset 3px 0 0 var(--ac-brand); }
.ac-page .ac-row.is-expanded > td {
  background: #EDF2FB;
  border-bottom-color: transparent;
}
.ac-page .ac-row.is-expanded > td:first-child { box-shadow: inset 3px 0 0 var(--ac-brand); }

/* Disabled (inactive) investor accounts — light red so they stand out on the
   All view, which mixes active and disabled accounts. */
.ac-page .ac-row-group.is-disabled > .ac-row > td { background: #fef2f2; }
.ac-page .ac-row-group.is-disabled > .ac-row:hover > td { background: #fde4e4; }
.ac-page .ac-row-group.is-disabled > .ac-row.is-expanded > td { background: #fde4e4; }
.ac-page .ac-row-group.is-disabled > .ac-row > td:first-child { box-shadow: inset 3px 0 0 #ef4444; }
.ac-page .ac-row-group.is-disabled .row-detail-wrap > td { background: #fde4e4; box-shadow: inset 3px 0 0 #ef4444; }

.ac-page .col-company { width: 25%; }
.ac-page .col-contact { width: 15%; }
.ac-page .col-email   { width: 21%; }
.ac-page .col-program { width: 13%; white-space: nowrap; }
.ac-page .col-actions { width: 20%; white-space: nowrap; }
/* Investor table: fixed layout so it always scales to 100% of the card (no
   horizontal scroll), and redistributes the removed USA column. Email
   truncates rather than pushing the table out. */
.ac-page .ac-table--fit { table-layout: fixed; }
.ac-page .ac-table--fit .col-id      { width: 8%; white-space: nowrap; }
.ac-page .ac-table--fit .col-company { width: 29%; }
.ac-page .ac-table--fit .col-contact { width: 16%; }
.ac-page .ac-table--fit .col-email   { width: 22%; }
.ac-page .ac-table--fit .col-program { width: 23%; }
.ac-page .ac-table--fit .col-actions { width: 24%; }
/* Program pills center under the centered Program header. */
.ac-page .ac-table--fit td.cell-program { text-align: center; }
/* Id gutter: centered under its centered header, and quiet enough that the
   company name still leads the row. */
.ac-page .ac-table--fit td.cell-id { text-align: center; }
.ac-page .ac-table--fit td.cell-id .mono { font-size: 12.5px; color: var(--ac-text-2); }
/* Actions cell: buttons on top, last login nested beneath — the buttons lose
   height (not width) so the stacked cell stays close to one row tall. */
.ac-page .ac-table--fit td.cell-actions { padding-top: 5px; padding-bottom: 5px; }
.ac-page .actions-stack { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.ac-page .actions-stack .row-actions .ac-btn,
.ac-page .actions-stack .row-actions .ac-btn-ghost { height: 26px; padding-top: 3px; padding-bottom: 3px; }
.ac-page .actions-lastlogin { line-height: 1.2; }
/* Last login line: quiet by default, loud only for the definitive "Never". */
.ac-page .last-login { font-size: 11.5px; color: var(--ac-text-2); }
.ac-page .last-login.is-never { color: #dc2626; font-weight: 600; }
.ac-page .last-login.is-unknown { color: var(--ac-text-3); }
/* Client Details card: same key/value rhythm as the program tiles. */
.ac-page .ac-client-details {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 34px;
  margin-top: 4px;
}
.ac-page .ac-client-details > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ac-page .ac-client-details .copy-cell { max-width: 260px; }
/* Let program pills wrap rather than spill into the actions column. */
.ac-page .ac-table--fit .program-cell { flex-wrap: wrap; }

/* Company cell */
.ac-page .company { display: flex; align-items: center; gap: 10px; }
.ac-page .expand-toggle {
  width: 22px; height: 22px;
  border: 0;
  background: transparent;
  color: var(--ac-text-3);
  display: grid;
  place-items: center;
  padding: 0;
  border-radius: 6px;
  flex-shrink: 0;
}
.ac-page .expand-caret {
  width: 14px; height: 14px;
  transition: transform 0.18s cubic-bezier(0.3, 0.7, 0.4, 1);
}
.ac-page .ac-row.is-expanded .expand-caret { transform: rotate(90deg); color: var(--ac-brand-600); }
.ac-page .company-mark {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--ac-surface-2);
  border: 1px solid var(--ac-border);
  color: var(--ac-text-2);
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 600;
  flex-shrink: 0;
}
.ac-page .company-mark.is-empty {
  background: repeating-linear-gradient(-45deg, var(--ac-surface-2) 0 6px, transparent 6px 12px);
  color: var(--ac-text-3);
}
.ac-page .company-text { min-width: 0; }
.ac-page .company-name { font-weight: 600; color: var(--ac-text); letter-spacing: -0.005em; line-height: 1.25; }
.ac-page .company-name .is-placeholder { color: var(--ac-text-3); font-weight: 500; }
.ac-page .company-sub { font-size: 12px; color: var(--ac-text-2); margin-top: 1px; }
/* Synced from HomeLight, never authenticated here — a to-do, so amber rather
   than the neutral subtitle it replaces. */
.ac-page .company-sub.is-never-signed-in { color: #b45309; font-weight: 600; }
.ac-page .contact-name { font-weight: 500; }

/* Click-to-copy cell */
.ac-page .copy-cell {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  padding: 5px 9px;
  margin: -5px -9px;
  border: 0;
  background: transparent;
  cursor: pointer;
  border-radius: 6px;
  font: inherit;
  text-align: left;
  position: relative;
  transition: background 0.12s, color 0.12s;
}
.ac-page .copy-cell .copy-cell-text {
  color: var(--ac-text);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--font-mono);
  font-size: 12.5px;
}
.ac-page .copy-cell:hover { background: var(--ac-brand-50); }
.ac-page .copy-cell:hover .copy-cell-text { color: var(--ac-brand-600); }
.ac-page .copy-cell-flash {
  position: absolute;
  right: 9px; top: 50%;
  transform: translateY(-50%);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ac-brand-600);
  background: #fff;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--ac-brand-100);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.12s;
}
.ac-page .copy-cell:hover .copy-cell-flash { opacity: 1; }
.ac-page .copy-cell.is-copied { background: var(--ac-green-50); }
.ac-page .copy-cell.is-copied .copy-cell-text { color: var(--ac-green-700); }
.ac-page .copy-cell.is-copied .copy-cell-flash {
  opacity: 1;
  color: var(--ac-green-700);
  border-color: var(--ac-green-100);
}
.ac-page .cell-empty { color: var(--ac-text-3); font-size: 13px; }

/* Program pills */
.ac-page .program-cell { display: inline-flex; gap: 5px; flex-wrap: nowrap; }
.ac-page .program-pill {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 9px;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: -0.005em;
  border: 1px solid;
}
.ac-page .program-pill.is-offers {
  background: var(--ac-violet-50);
  color: var(--ac-violet-text);
  border-color: var(--ac-violet-100);
}
.ac-page .program-pill.is-ppl {
  background: var(--ac-green-50);
  color: var(--ac-green-700);
  border-color: var(--ac-green-100);
}
.ac-page .program-pill.is-revshare {
  background: var(--ac-amber-50, #FFF8EB);
  color: var(--ac-amber-700, #92400E);
  border-color: var(--ac-amber-100, #FDE9C8);
}
.ac-page .program-pill.is-review {
  background: var(--ac-amber-50);
  color: var(--ac-amber-700);
  border-color: var(--ac-amber-100);
}
.ac-page .program-pill.is-notsetup {
  background: var(--ac-bg);
  color: var(--ac-text-3);
  border-color: var(--ac-border);
}
.ac-page .program-none { color: var(--ac-text-3); font-size: 13px; }

/* Status pill (active/inactive) */
.ac-page .status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.005em;
  white-space: nowrap;
}
.ac-page .status-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ac-page .status-pill.is-active,
.ac-page .status-pill.is-approved { background: var(--ac-green-50); color: var(--ac-green-700); border: 1px solid var(--ac-green-100); }
.ac-page .status-pill.is-inactive { background: #F1F4F9; color: var(--ac-text-2); border: 1px solid var(--ac-border); }
.ac-page .status-pill.is-pending { background: var(--ac-amber-50); color: var(--ac-amber-700); border: 1px solid var(--ac-amber-100); }
.ac-page .status-pill.is-disabled { background: var(--ac-rose-50); color: var(--ac-rose-700); border: 1px solid var(--ac-rose-100); }
.ac-page .status-pill.is-auto { background: var(--ac-amber-50); color: var(--ac-amber-700); border: 1px solid var(--ac-amber-100); }

/* Row actions — Stripe link / Send reset / Magic Link / Edit, compact and
   uniform so all four fit in the actions column before expanding. */
.ac-page .row-actions { display: flex; align-items: center; gap: 6px; justify-content: center; flex-wrap: nowrap; }
/* USA — red with white text; every action button shares one fixed height
   so the magic-key button matches the USA footprint exactly. */
.ac-page .ac-btn-usa { background: #dc2626; border-color: #dc2626; color: #fff; font-weight: 700; }
.ac-page .ac-btn-usa:hover { background: #b91c1c; border-color: #b91c1c; }
.ac-page .ac-btn-usa[disabled] { opacity: 0.55; cursor: not-allowed; }
.ac-page .row-actions .ac-btn,
.ac-page .row-actions .ac-btn-ghost { height: 33px; display: inline-flex; align-items: center; }
.ac-page .row-actions .ac-btn-magic { padding: 6px 12px; }
.ac-page .row-actions .ac-btn-magic svg { width: 15px; height: 15px; }
.ac-page .row-actions .ac-btn,
.ac-page .row-actions .ac-btn-ghost { padding: 6px 10px; font-size: 12px; border-radius: 8px; white-space: nowrap; }
.ac-page .row-actions .ac-btn svg,
.ac-page .row-actions .ac-btn-ghost svg { width: 13px; height: 13px; }
.ac-page .row-actions form.inline { display: inline-flex; }
/* On tighter viewports keep the actions on one line but collapse them to
   icon-only so they don't overflow the (overflow:hidden) table card. Tooltips
   on each button preserve meaning. */
@media (max-width: 1100px) {
  .ac-page .row-actions .ac-btn-label { display: none; }
  .ac-page .row-actions .ac-btn,
  .ac-page .row-actions .ac-btn-ghost { padding: 6px 8px; }
}
/* Last-resort fallback at phone width: allow wrapping so buttons can never be
   clipped, even if the icon-only row still can't fit. */
@media (max-width: 640px) {
  .ac-page .row-actions { flex-wrap: wrap; }
}

/* ── Investor rows on a phone ─────────────────────────────────────────────
   Five columns in ~400px gave every one of them about 70px: company names
   broke one word per line, the contact name overlapped the column beside
   it, and the ID was unreadable next to all of it.

   So the row becomes the company name and its buttons, and everything else
   moves into the panel the row already opens. Nothing is lost — the recap
   in the detail carries the ID, contact, programs and last login — and
   search still reaches any of it.

   The recap is display:none above this width, so desktop is untouched. */
.ac-page .row-recap { display: none; }
.ac-page .row-actions-mobile { display: none; }
/* Status pill leads the panel at every width. */
.ac-page .detail-status { padding: 0 0 12px; }

/* Filter disclosure — phone only. The chip row is the desktop control. */
.ac-page .ac-filter-menu { display: none; }

@media (max-width: 640px) {
  .ac-page .ac-tabs.is-desktop-only { display: none; }

  .ac-page .ac-filter-menu {
    display: block;
    margin: 0 0 14px;
    border: 1px solid var(--ac-border);
    border-radius: 10px;
    background: var(--ac-surface);
  }
  .ac-page .ac-filter-menu > summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    cursor: pointer;
    list-style: none;
    font-size: 13px;
  }
  .ac-page .ac-filter-menu > summary::-webkit-details-marker { display: none; }
  .ac-page .ac-filter-menu-label {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ac-text-3, #64748b);
  }
  .ac-page .ac-filter-menu-current { font-weight: 600; color: var(--ac-text-1, #0f172a); }
  .ac-page .ac-filter-menu > summary svg {
    margin-left: auto;
    width: 16px;
    height: 16px;
    color: var(--ac-text-3, #64748b);
    transition: transform 0.15s;
  }
  .ac-page .ac-filter-menu[open] > summary svg { transform: rotate(180deg); }

  .ac-page .ac-filter-menu-list { border-top: 1px solid var(--ac-border); padding: 6px; }
  .ac-page .ac-filter-menu-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 10px;
    border-radius: 8px;
    font-size: 14px;
    color: var(--ac-text-1, #0f172a);
    text-decoration: none;
  }
  .ac-page .ac-filter-menu-list a.is-active {
    background: var(--ac-brand-50, #eff6ff);
    color: var(--ac-brand-600, #2563eb);
    font-weight: 600;
  }
  .ac-page .ac-filter-menu-count { font-size: 12px; color: var(--ac-text-3, #64748b); }
  .ac-page .ac-filter-menu-list a.is-active .ac-filter-menu-count { color: inherit; }
}

@media (max-width: 640px) {
  /* STACK, don't squeeze. Five columns fighting over 400px is a losing
     argument however the widths are apportioned: give the name room and the
     buttons overflow, cap the buttons and the browser hands the space back,
     because a cell's content minimum always beats a declared width in an
     auto-layout table.

     So the row stops being a row. The name takes the full width on its own
     line, the buttons sit under it, and the columns the row dropped are in
     the recap below. thead goes with it — a header strip can't align to
     stacked cells, and it is only sort controls, which are the one thing
     genuinely lost here. Search still reaches everything. */
  .ac-page .ac-table--fit,
  .ac-page .ac-table--fit tbody,
  .ac-page .ac-table--fit tr.ac-row { display: block; width: auto; }
  .ac-page .ac-table--fit thead { display: none; }
  .ac-page .ac-table--fit tr.ac-row > td {
    display: block;
    width: auto;
    padding: 0 12px;
    border-bottom: 0;
  }

  .ac-page .ac-table--fit tr.ac-row { border-bottom: 1px solid var(--ac-border); }

  /* Buttons left-aligned under the name rather than hugging a right edge
     that no longer exists. */
  /* The actions cell moves into the panel. Left in the row it spanned the
     whole line under the name and carried click->investor-card#stop, so
     most of the row was a dead zone that ate the tap meant to open it. */
  .ac-page .ac-table--fit tr.ac-row > td.cell-actions { display: none; }
  .ac-page .row-actions-mobile { display: block; margin-bottom: 12px; }
  .ac-page .row-actions-mobile .row-actions { justify-content: flex-start; flex-wrap: wrap; }

  /* No caret. The whole line opens the row, so a target to aim at is a
     target you feel obliged to hit. */
  .ac-page .ac-table .company .expand-toggle { display: none; }

  /* A tap target with height, not one line of text. :first-child was the
     wrong hook — the ID cell is still the first child, hidden, so the
     padding landed on a cell nobody can see and the visible row stayed
     20px tall. */
  .ac-page .ac-table--fit tr.ac-row > td.cell-company { padding: 15px 12px; }

  /* The detail row is a single full-width cell already; it just needs to
     stop behaving like a table row now that its siblings don't.
     :not(.hidden) is load-bearing — this selector is 0,3,2 and `.hidden` is
     0,1,0, so without it every row shipped permanently expanded. */
  .ac-page .ac-table--fit tr.row-detail-wrap:not(.hidden) { display: block; }
  .ac-page .ac-table--fit tr.row-detail-wrap > td { display: block; width: auto; }

  /* AFTER the stacking rules, and at the same specificity: `tr.ac-row > td`
     is 0,3,2 and would otherwise out-rank a plainer `.cell-id { display:none }`
     and put every hidden column back on its own line. */
  .ac-page .ac-table--fit tr.ac-row > td.cell-id,
  .ac-page .ac-table--fit tr.ac-row > td.cell-contact,
  .ac-page .ac-table--fit tr.ac-row > td.cell-program { display: none; }
  .ac-page .ac-table .cell-actions .last-login { display: none; }

  /* The initials badge costs ~40px of the line the name now owns. The caret
     already says the row opens. */
  .ac-page .ac-table .company .company-mark { display: none; }
  .ac-page .ac-table .company { gap: 8px; }
  .ac-page .ac-table .company-name {
    white-space: normal;
    /* break-word, NOT anywhere: anywhere hyphenates inside words, and
       "2nd Chance Homes LLC" came out as "2nd Cha / nce Hom / es LLC". */
    overflow-wrap: break-word;
    line-height: 1.35;
  }

  .ac-page .row-recap {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid var(--ac-border);
    border-radius: 10px;
    background: var(--ac-surface-2);
  }
  .ac-page .row-recap > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
  }
  .ac-page .row-recap dt {
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ac-text-3, #64748b);
  }
  .ac-page .row-recap dd {
    margin: 0;
    min-width: 0;
    text-align: right;
    font-size: 13px;
    color: var(--ac-text-1, #0f172a);
  }
  .ac-page .row-recap .program-cell { justify-content: flex-end; }
}
.ac-page .magic-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 11px;
  border-radius: 8px;
  border: 1px solid var(--ac-brand-100);
  background: var(--ac-brand-50);
  color: var(--ac-brand-600);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.ac-page .magic-chip svg { width: 13px; height: 13px; }
.ac-page .magic-chip:hover { background: var(--ac-brand-100); }
.ac-page .magic-chip.is-copied {
  background: var(--ac-green-50);
  border-color: var(--ac-green-100);
  color: var(--ac-green-700);
}
.ac-page .magic-badge {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ac-text-3);
}
.ac-page .open-link {
  display: inline-grid;
  place-items: center;
  width: 30px; height: 30px;
  border-radius: 8px;
  border: 1px solid var(--ac-border);
  background: var(--ac-surface);
  color: var(--ac-text-2);
}
.ac-page .open-link:hover { background: var(--ac-surface-2); color: var(--ac-text); }
.ac-page .open-link svg { width: 14px; height: 14px; }

/* Ready-for-review banner row */
.ac-page .review-banner td {
  background: var(--ac-amber-50);
  color: var(--ac-amber-700);
  font-size: 12px;
  font-weight: 600;
  padding: 8px 20px 8px 56px;
  border-bottom: 1px solid var(--ac-border);
}

/* Expanded detail panel */
.ac-page .row-detail-wrap > td {
  padding: 0;
  background: #EDF2FB;
  border-bottom: 1px solid var(--ac-border);
  /* Continuous left accent bar so the expanded card reads as one block with
     its header row. */
  box-shadow: inset 3px 0 0 var(--ac-brand);
}
.ac-page .row-detail {
  padding: 4px 20px 14px 48px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  /* Cap the panel so it reads as a compact card (~half-width) instead of
     sprawling across the full table. */
  max-width: 700px;
  animation: acRowDetailIn 0.18s cubic-bezier(0.3, 0.7, 0.4, 1);
}
@media (max-width: 900px) { .ac-page .row-detail { max-width: none; } }
@keyframes acRowDetailIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
.ac-page .detail-notice {
  border-radius: 8px;
  border: 1px solid;
  padding: 8px 12px;
  font-size: 13px;
}
.ac-page .detail-notice.is-notice { background: var(--ac-green-50); border-color: var(--ac-green-100); color: var(--ac-green-700); }
.ac-page .detail-notice.is-alert { background: var(--ac-rose-50); border-color: var(--ac-rose-100); color: var(--ac-rose-700); }

.ac-page .detail-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 4px 0;
}
.ac-page .detail-strip-name { font-size: 13px; font-weight: 600; letter-spacing: -0.005em; color: var(--ac-text); }
.ac-page .detail-strip-meta { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--ac-text-2); margin-top: 3px; }
.ac-page .detail-strip-meta .mono { font-family: var(--font-mono); font-size: 11.5px; color: var(--ac-text-3); }
.ac-page .dot-sep { width: 3px; height: 3px; border-radius: 50%; background: var(--ac-text-3); opacity: 0.5; }
/* Status pill + Editing tag share the left of the detail strip. */
.ac-page .detail-strip-left { display: flex; align-items: center; gap: 8px; }
/* Marketplace and other not-yet-live controls render dimmed. */
.ac-page .access-row.is-coming-soon { opacity: 0.55; cursor: default; }
.ac-page .ac-program.is-coming-soon { opacity: 0.6; }
/* Let the results table scroll horizontally instead of being clipped by the
   card's rounded (overflow:hidden) corners on tighter viewports. */
/* Gold key — the magic-link action. */
.ac-page .ac-btn-magic { color: #c08a12; }
.ac-page .ac-btn-magic:hover { color: #9c6f0e; background: #fbf3df; border-color: #ecd9a6; }

.ac-page .detail-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 1100px) { .ac-page .detail-cols { grid-template-columns: 1fr; } }

/* Investor panel (view + edit) runs wider than a single column so Details and
   Programs sit side by side without cramping. */
.ac-page .row-detail-view { max-width: none; }
/* Details (left) beside Programs (right), each taking an equal half. */
.ac-page .detail-split { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: start; }
/* Edit mode stacks Account status above Programs (full-width sections). */
.ac-page .detail-stack { display: flex; flex-direction: column; gap: 10px; }
/* Onboarding documents inside the edit-mode Offers tile. */
.ac-page .ac-offers-docs { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--ac-border); }
.ac-page .ac-offers-docs .doc-row { padding: 3px 0; }
@media (max-width: 900px) { .ac-page .detail-split { grid-template-columns: 1fr; } }
/* Toggle rows stack vertically inside the narrower split columns. */
.ac-page .detail-split .access-grid { grid-template-columns: 1fr; gap: 6px; }

.ac-page .detail-card {
  background: var(--ac-surface);
  border: 1px solid var(--ac-border);
  border-radius: 10px;
  padding: 9px 12px 10px;
  box-shadow: var(--ac-shadow-sm);
}
.ac-page .detail-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 7px;
}
.ac-page .detail-head h4 { margin: 0; font-size: 13px; font-weight: 600; color: var(--ac-text); letter-spacing: -0.005em; }
.ac-page .detail-head-sub { font-size: 11.5px; color: var(--ac-text-3); }

/* Doc rows */
.ac-page .doc-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid var(--ac-border);
}
.ac-page .doc-row:first-of-type { border-top: 0; padding-top: 2px; }
.ac-page .doc-icon {
  width: 36px; height: 36px;
  border-radius: 7px;
  background: var(--ac-surface-2);
  border: 1px solid var(--ac-border);
  color: var(--ac-text-3);
  display: grid;
  place-items: center;
  flex-shrink: 0;
  overflow: hidden;
}
.ac-page .doc-icon svg { width: 16px; height: 16px; }
.ac-page .doc-icon img { width: 100%; height: 100%; object-fit: cover; }
.ac-page .doc-body { flex: 1; min-width: 0; }
.ac-page .doc-label { font-size: 13px; font-weight: 600; color: var(--ac-text); }
.ac-page .doc-status { font-size: 11.5px; color: var(--ac-text-3); margin-top: 1px; }
.ac-page .doc-status.is-ok { color: var(--ac-green-700); }
.ac-page .doc-status.is-ok::before {
  content: "";
  display: inline-block;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--ac-green-500);
  margin-right: 6px;
  vertical-align: middle;
}
.ac-page .doc-links { display: flex; flex-direction: column; gap: 1px; margin-top: 2px; }
.ac-page .doc-links a { font-size: 11.5px; color: var(--ac-brand-600); }
.ac-page .doc-links a.is-muted { color: var(--ac-text-3); }

/* Forms */
.ac-page .form-grid { display: flex; flex-direction: column; gap: 10px; }
.ac-page .form-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ac-page .ac-field { display: flex; flex-direction: column; gap: 4px; }
.ac-page .ac-field-label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--ac-text-3);
}
.ac-page .ac-input {
  height: 34px;
  width: 100%;
  padding: 0 10px;
  border: 1px solid var(--ac-border-strong);
  border-radius: 8px;
  background: var(--ac-surface);
  color: var(--ac-text);
  font-family: inherit;
  font-size: 13px;
  outline: none;
  transition: border-color 0.12s, box-shadow 0.12s;
}
.ac-page .ac-input:focus {
  border-color: var(--ac-brand);
  box-shadow: 0 0 0 3px rgba(47, 124, 246, 0.14);
}

/* Read-only field grid inside a detail card */
.ac-page .ac-readout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px 16px;
}
.ac-page .ac-readout .ac-field-wide { grid-column: 1 / -1; }

/* Compact variant — combined Contact/Company/Internal into one dense grid. */
.ac-page .ac-readout.is-compact { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 18px; }
@media (max-width: 900px) { .ac-page .ac-readout.is-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .ac-page .ac-readout.is-compact { grid-template-columns: 1fr; } }

/* Forms reduced to inline buttons (button_to Edit, cancel sibling form). */
.ac-page form.inline { display: inline; margin: 0; }
.ac-page .ac-hidden-form { display: none; }
.ac-page .ac-field-value {
  font-size: 13px;
  color: var(--ac-text);
  line-height: 1.4;
  min-height: 18px;
}
.ac-page .ac-field-text {
  margin: 0;
  font-size: 13px;
  color: var(--ac-text-2);
  line-height: 1.5;
  white-space: pre-line;
}
.ac-page .ac-email-list { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; }

/* Fields with no upstream data source wired up yet */
.ac-page .ac-needs-connected {
  font-size: 13px;
  font-weight: 600;
  color: #DC2626;
}

/* Edit-mode locked fields (column not yet migrated/connected) */
.ac-page .pending-tag {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 6px;
  border-radius: 5px;
  background: #FDECEA;
  color: #DC2626;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: none;
  vertical-align: middle;
}
.ac-page .ac-input:disabled,
.ac-page .ac-select:disabled,
.ac-page .ac-textarea:disabled {
  background: var(--ac-surface-2);
  color: var(--ac-text-3);
  border-style: dashed;
  cursor: not-allowed;
}
.ac-page .ac-switch:disabled { opacity: 0.45; cursor: not-allowed; }
.ac-page .access-row.is-locked { opacity: 0.65; }
.ac-page .detail-notice.is-pending-note {
  background: var(--ac-amber-50);
  border: 1px solid var(--ac-amber-100);
  color: var(--ac-amber-700);
}

/* Chips (property types, coverage ZIPs) */
.ac-page .ac-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.ac-page .ac-chip {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 6px;
  background: var(--ac-surface-2);
  border: 1px solid var(--ac-border);
  font-size: 12px;
  color: var(--ac-text-2);
}
.ac-page .ac-chip.is-zip { font-family: var(--font-mono); font-size: 11.5px; }
.ac-page .ac-chip.is-more { background: transparent; color: var(--ac-text-3); font-weight: 600; }

/* Read-only program tiles */
.ac-page .ac-programs {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.ac-page .ac-program {
  border: 1px solid var(--ac-border);
  border-radius: 10px;
  padding: 8px 10px;
  background: var(--ac-surface);
}
.ac-page .ac-program.is-offers.is-active { border-color: var(--ac-violet-100); background: linear-gradient(180deg, #FAF7FF 0%, #fff 60%); }
.ac-page .ac-program.is-ppl.is-active { border-color: var(--ac-green-100); background: linear-gradient(180deg, #F4FBF6 0%, #fff 60%); }
.ac-page .ac-program.is-inactive { background: var(--ac-surface-2); }
.ac-page .ac-program-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ac-page .ac-program-name { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--ac-text); }
.ac-page .ac-program.is-inactive .ac-program-name { color: var(--ac-text-2); }
.ac-page .ac-program-mark {
  display: inline-grid;
  place-items: center;
  width: 22px; height: 22px;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.ac-page .ac-program.is-offers .ac-program-mark { background: var(--ac-violet-50); color: var(--ac-violet-text); }
.ac-page .ac-program.is-ppl .ac-program-mark { background: var(--ac-green-50); color: var(--ac-green-700); }
.ac-page .ac-program.is-inactive .ac-program-mark { background: var(--ac-surface-2); color: var(--ac-text-3); border: 1px solid var(--ac-border); }
.ac-page .ac-program-state {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ac-text-3);
}
.ac-page .ac-program-state::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ac-page .ac-program-state.is-onboarded { color: var(--ac-green-700); }
.ac-page .ac-program-state.is-pending { color: var(--ac-amber-700); }
.ac-page .ac-program-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 34px;
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px dashed var(--ac-border);
}
.ac-page .ac-program-stats > div { display: flex; flex-direction: column; gap: 2px; }
.ac-page .ac-stat-k { font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ac-text-3); }
.ac-page .ac-stat-v { font-size: 13px; font-weight: 600; color: var(--ac-text); }
.ac-page .ac-stat-v.is-on { color: var(--ac-green-700); }
/* Card-brand badge rendered next to the masked digits (VISA / MC / AMEX / …). */
.ac-page .ac-card-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 19px; padding: 0 5px; margin-right: 6px;
  border: 1px solid #e2e8f0; border-radius: 4px; background: #fff;
  font-size: 9px; font-weight: 800; letter-spacing: 0.05em; line-height: 1;
  color: #334155; vertical-align: middle;
}
.ac-page .ac-card-badge.is-visa { color: #1A1F71; font-style: italic; font-size: 10px; }
.ac-page .ac-card-badge.is-amex { background: #2E77BB; border-color: #2E77BB; color: #fff; }
.ac-page .ac-card-badge.is-discover { color: #F76B1C; font-size: 8px; }
.ac-page .ac-card-badge.is-mastercard svg { width: 24px; height: 14px; display: block; }
/* Onboarding documents sit inline in the stats row, to the right of Auto Offers. */
.ac-page .ac-program-docs { display: flex; flex-direction: column; gap: 4px; }
.ac-page .ac-program-docs .doc-row { padding: 2px 0; }
.ac-page .ac-stat-v.mono { font-family: var(--font-mono); }
.ac-page .ac-stat-rate { margin-left: 6px; font-size: 11.5px; font-weight: 500; color: var(--ac-text-3); }
/* Where a stat's value came from (e.g. which Stripe rule picked the card). */
.ac-page .ac-stat-note { display: block; margin-top: 2px; font-size: 11px; font-weight: 500; color: var(--ac-text-3); }

/* View-mode footer with action buttons */
.ac-page .view-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 4px 0;
}
.ac-page .view-foot .hint { font-family: var(--font-mono); font-size: 11.5px; color: var(--ac-text-3); }
.ac-page .view-foot-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ac-page .view-foot-actions form.inline { display: inline-flex; }
.ac-page .view-foot-actions .ac-btn-ghost.ac-btn-sm svg { width: 12px; height: 12px; }

/* ─────────────────────────────────────────────────────────────
   Edit mode
   ───────────────────────────────────────────────────────────── */
.ac-page .investor-edit-form { display: flex; flex-direction: column; gap: 10px; }

.ac-page .edit-strip {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 2px 2px 0;
}
.ac-page .edit-strip .company-mark { width: 42px; height: 42px; border-radius: 10px; font-size: 14px; }
.ac-page .edit-strip-name { flex: 1; min-width: 0; }
.ac-page .ac-input-lg { height: 40px; font-size: 16px; font-weight: 600; }
.ac-page .edit-strip-meta { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 12px; color: var(--ac-text-2); }
.ac-page .edit-strip-meta .mono { font-family: var(--font-mono); font-size: 11.5px; color: var(--ac-text-3); }
.ac-page .is-editing-tag { color: var(--ac-amber-700); font-weight: 600; }
.ac-page .edit-strip-actions { display: flex; align-items: center; gap: 8px; flex: none; padding-top: 18px; }

/* Inputs in edit mode */
.ac-page .ac-textarea { height: auto; min-height: 70px; padding: 8px 10px; line-height: 1.45; resize: vertical; }
.ac-page .ac-select { appearance: auto; }
.ac-page .ac-field-hint { font-size: 11.5px; color: var(--ac-text-3); margin-top: 2px; }
.ac-page .ac-subhead {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ac-text-3);
  margin: 11px 0 7px;
}

/* Status segmented control (Approved / Disabled) */
.ac-page .ac-segment { display: inline-flex; border: 1px solid var(--ac-border-strong); border-radius: 9px; overflow: hidden; background: var(--ac-surface); width: max-content; }
.ac-page .ac-segment input { position: absolute; opacity: 0; pointer-events: none; }
.ac-page .ac-segment label {
  padding: 7px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ac-text-2);
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
}
.ac-page .ac-segment label + input + label { border-left: 1px solid var(--ac-border-strong); }
.ac-page .ac-segment input:checked + label { background: var(--ac-green-50); color: var(--ac-green-700); }
.ac-page .ac-segment input[value="1"]:checked + label { background: var(--ac-rose-50); color: var(--ac-rose-700); }

/* Email list editor */
.ac-page .ac-email-edit { display: flex; flex-direction: column; gap: 6px; margin-bottom: 6px; }
.ac-page .ac-email-row { display: flex; gap: 6px; align-items: center; }
.ac-page .ac-btn-icon { padding: 7px 9px; }
.ac-page .ac-btn-icon svg { width: 15px; height: 15px; }

/* Edit chrome now lives in the detail strip (notice + Cancel) with Save up in
   the row's actions — the old bottom editbar is gone. */
.ac-page .strip-unsaved { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ac-text-2); }
.ac-page .detail-strip-right { display: flex; align-items: center; gap: 8px; }
.ac-page .saving-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--ac-amber-700); box-shadow: 0 0 0 3px var(--ac-amber-50); }

/* Standalone account-action rows */
.ac-page .ac-action-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid var(--ac-border);
}
.ac-page .ac-action-row:first-of-type { border-top: 0; }
.ac-page .ac-action-title { font-size: 13px; font-weight: 600; color: var(--ac-text); }
.ac-page .ac-action-desc { font-size: 12px; color: var(--ac-text-2); margin-top: 2px; }
.ac-page .ac-action-row.is-danger .ac-btn-ghost { color: var(--ac-rose-700); border-color: var(--ac-rose-100); }
.ac-page .ac-action-row.is-danger .ac-btn-ghost:hover { background: var(--ac-rose-50); }
.ac-page .stripe-mark {
  display: inline-grid;
  place-items: center;
  width: 16px; height: 16px;
  border-radius: 4px;
  background: #635BFF;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  margin-right: 4px;
}
.ac-page .ac-stripe-panel:empty { display: none; }
.ac-page .ac-stripe-result { display: flex; align-items: center; gap: 8px; padding: 8px 0 2px; }
.ac-page .ac-stripe-result .ac-input { flex: 1; font-size: 11.5px; }
.ac-page .ac-stripe-result.is-error { color: var(--ac-rose-700); font-size: 12.5px; padding: 8px 0 2px; }

/* Access toggle grid */
.ac-page .access-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; align-items: start; }
@media (max-width: 900px) { .ac-page .access-grid { grid-template-columns: 1fr; } }
/* Each toggle is its own form; display:contents lets the row/label below it
   participate directly as a grid item. */
.ac-page .access-grid .access-form { display: contents; }
.ac-page .access-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 11px;
  border: 1px solid var(--ac-border);
  border-radius: 9px;
  background: var(--ac-surface);
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.ac-page .access-row:has(input:checked) {
  background: linear-gradient(0deg, rgba(47, 124, 246, 0.03), rgba(47, 124, 246, 0.03)), var(--ac-surface);
  border-color: var(--ac-brand-100);
}
.ac-page .access-row.is-bypass:has(input:checked) {
  background: linear-gradient(0deg, rgba(30, 168, 92, 0.04), rgba(30, 168, 92, 0.04)), var(--ac-surface);
  border-color: var(--ac-green-100);
}
.ac-page .access-body { flex: 1; min-width: 0; }
.ac-page .access-label { font-size: 13px; font-weight: 600; color: var(--ac-text); letter-spacing: -0.005em; }
.ac-page .access-desc { font-size: 11.5px; color: var(--ac-text-2); margin-top: 2px; line-height: 1.35; }

/* Toggle switch (checkbox based) */
.ac-page .ac-switch {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  flex-shrink: 0;
  width: 34px; height: 20px;
  border: 0;
  margin: 0;
  background: rgba(15, 23, 42, 0.18);
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.15s;
}
.ac-page .ac-switch::after {
  content: "";
  position: absolute;
  top: 2px; left: 2px;
  width: 16px; height: 16px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
  transition: transform 0.15s;
}
.ac-page .ac-switch:checked { background: var(--ac-brand); }
.ac-page .ac-switch:checked::after { transform: translateX(14px); }
.ac-page .access-row.is-bypass .ac-switch:checked { background: var(--ac-green-500); }
.ac-page .access-row.is-danger-toggle:has(input:checked) {
  background: linear-gradient(0deg, rgba(178, 50, 50, 0.04), rgba(178, 50, 50, 0.04)), var(--ac-surface);
  border-color: var(--ac-rose-100);
}
.ac-page .access-row.is-danger-toggle .ac-switch:checked { background: var(--ac-rose-700); }
.ac-page .ac-switch:focus-visible { outline: 2px solid var(--ac-brand); outline-offset: 2px; }

.ac-page .inline-switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; }
.ac-page .inline-switch-label { font-size: 13px; color: var(--ac-text); font-weight: 500; }

/* Expandable "Complete Offers Onboarding" row with nested documents.
   Lives as a cell inside .access-grid (self-aligns to start so expanding it
   doesn't stretch the neighbouring toggle). */
.ac-page .access-expandable {
  align-self: start;
  border: 1px solid var(--ac-border);
  border-radius: 9px;
  background: var(--ac-surface);
  transition: border-color 0.12s, background 0.12s;
}
.ac-page .access-expandable.is-open { border-color: var(--ac-border-strong); }
.ac-page .access-expandable.is-bypass:has(.ac-switch:checked) {
  background: linear-gradient(0deg, rgba(30, 168, 92, 0.04), rgba(30, 168, 92, 0.04)), var(--ac-surface);
  border-color: var(--ac-green-100);
}
.ac-page .access-row-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  cursor: pointer;
}
.ac-page .access-caret { display: inline-flex; color: var(--ac-text-3); transition: transform 0.15s; }
.ac-page .access-caret svg { width: 15px; height: 15px; }
.ac-page .access-expandable.is-open .access-caret { transform: rotate(90deg); }
.ac-page .access-expandable.is-bypass .ac-switch:checked { background: var(--ac-green-500); }
.ac-page .access-toggle-form { margin: 0; display: inline-flex; align-items: center; flex-shrink: 0; }
.ac-page .access-expand-panel {
  padding: 2px 14px 12px 37px;
  border-top: 1px solid var(--ac-border);
}
.ac-page .doc-upload-form { margin: 0; flex-shrink: 0; }
.ac-page .doc-upload-link {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ac-brand-600);
  cursor: pointer;
  white-space: nowrap;
}
.ac-page .doc-upload-link:hover { text-decoration: underline; }

/* Detail footer */
.ac-page .detail-foot { display: flex; align-items: center; gap: 8px; padding: 2px 4px 0; flex-wrap: wrap; }
.ac-page .detail-foot .ac-spacer { flex: 1; }

/* Empty state */
.ac-page .ac-empty { padding: 40px 20px; text-align: center; color: var(--ac-text-2); font-size: 14px; }
.ac-page .ac-results-meta { font-size: 12.5px; color: var(--ac-text-2); margin-bottom: 14px; }
.ac-page .ac-results-meta strong { color: var(--ac-text); font-weight: 600; }

/* Roster pager: windowed page links below the list. */
.ac-page .ac-pager { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 14px 0 4px; }
.ac-page .ac-pager-btn {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border: 1px solid var(--ac-border);
  border-radius: 8px;
  background: #fff;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ac-text-2);
  text-decoration: none;
}
.ac-page a.ac-pager-btn:hover { border-color: var(--ac-text-3, #9ca3af); color: var(--ac-text); }
.ac-page .ac-pager-btn.is-current { background: var(--ac-brand); border-color: var(--ac-brand); color: #fff; cursor: default; }
.ac-page .ac-pager-gap { padding: 0 2px; color: var(--ac-text-2); font-size: 12.5px; }

/* PPL tile quick-set: inline cycle/budget save + payment-method link button. */
/* Quick-set strip: labelled groups, not one flat run of controls. The groups
   wrap as a unit so a narrow card breaks between them and never mid-group. */
.ac-page .ac-billing-quickset { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 20px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--ac-border, #e5e7eb); }
.ac-page .ac-quickset-group { display: flex; flex-direction: column; gap: 4px; }
.ac-page .ac-quickset-legend { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #6b7280; }
.ac-page .ac-quickset-controls { display: flex; align-items: center; gap: 6px; }
.ac-page .ac-quickset-input { border: 1px solid #d1d5db; border-radius: 6px; padding: 4px 8px; font-size: 12.5px; background: #fff; color: #374151; }
/* Dollar fields are 4-5 digits; without a width they take the browser default
   (~20 chars), which is what made two adjacent money boxes fill the row. */
.ac-page .ac-quickset-amount { width: 82px; }
.ac-page .ac-quickset-affix { font-size: 12.5px; font-weight: 600; color: #374151; margin-right: -2px; }
.ac-page .ac-quickset-check { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; color: #374151; cursor: pointer; white-space: nowrap; }
.ac-page .ac-quickset-check input { accent-color: #2563eb; }
.ac-page .ac-quickset-input:disabled { background: #f3f4f6; color: #9ca3af; cursor: not-allowed; }

/* Edit-mode program state control: Onboarded / Needs Setup / Hidden. */
.ac-page .ac-tristate { display: inline-flex; border: 1px solid #d1d5db; border-radius: 8px; overflow: hidden; background: #fff; }
.ac-page .ac-tristate-opt { cursor: pointer; }
.ac-page .ac-tristate-opt span { display: inline-flex; align-items: center; padding: 4px 10px; font-size: 12px; font-weight: 600; color: #6b7280; border-left: 1px solid #e5e7eb; }
.ac-page .ac-tristate-opt:first-child span { border-left: none; }
.ac-page .ac-tristate-opt.is-on input:checked + span { background: #ecfdf5; color: #047857; }
.ac-page .ac-tristate-opt.is-mid input:checked + span { background: #fffbeb; color: #b45309; }
.ac-page .ac-tristate-opt.is-off input:checked + span { background: #f3f4f6; color: #374151; }
.ac-page .ac-tristate-opt.is-danger input:checked + span { background: #fef2f2; color: #b91c1c; }
.ac-page .ac-account-state { margin-top: 4px; }
.ac-page .ac-tristate-opt input:focus-visible + span { outline: 2px solid #3b82f6; outline-offset: -2px; }

/* Account owner (ISM). Sits under the account-status tri-state — an
   account-level fact, not a per-program one. */
.ac-page .ac-owner-field { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.ac-page .ac-owner-field .ac-quickset-input { max-width: 220px; }
.ac-page .ac-owner-hint { margin-top: 4px; font-size: 11px; line-height: 1.45; color: var(--ac-text-3); max-width: 460px; }

/* Account activity — the first audit trail in the app. */
.ac-page .ac-note-form { display: flex; gap: 8px; align-items: center; margin-bottom: 12px; flex-wrap: wrap; }
.ac-page .ac-note-body { flex: 1 1 240px; min-width: 180px; }
.ac-page .ac-activity { display: flex; flex-direction: column; gap: 8px; }
.ac-page .ac-activity-row { display: flex; gap: 10px; align-items: baseline; font-size: 13px; }
.ac-page .ac-activity-kind {
  flex: 0 0 auto; font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; padding: 2px 7px; border-radius: 999px;
  background: var(--ac-surface-2); color: var(--ac-text-3);
}
.ac-page .ac-activity-kind.is-note { background: #eff6ff; color: #1d4ed8; }
.ac-page .ac-activity-kind.is-approval { background: #ecfdf5; color: #047857; }
.ac-page .ac-activity-kind.is-budget { background: #fffbeb; color: #b45309; }
.ac-page .ac-activity-body { flex: 1 1 auto; color: var(--ac-text-1); }
.ac-page .ac-activity-meta { flex: 0 0 auto; font-size: 11px; color: var(--ac-text-3); }
.ac-page .ac-activity-followup {
  margin-left: 6px; font-size: 11px; font-weight: 600; color: #1d4ed8;
}
.ac-page .ac-activity-followup.is-overdue { color: #b91c1c; }
.ac-page .ac-activity-warn { display: block; font-size: 11px; color: #b45309; }

/* Super-admin access panel. Set apart from ordinary edits because granting
   admin is an escalation, not a field change. (.is-danger already exists.) */