/* Customer portal shell (2026-09-24): the top-nav app frame from the Pen
   customer set (MoT6e). Shares tokens, header sizing, chips and tables with
   site.css; this file only adds what the docs shell does not have. */

.portal { min-height: 100vh; display: flex; flex-direction: column; background: var(--paper); }
.portal-header { position: sticky; top: 0; z-index: 20; background: var(--paper-pure); }
.portal-nav { display: flex; align-items: center; gap: 28px; margin-left: 36px; }
.portal-nav-link {
  font-family: var(--font-display, "Archivo", sans-serif);
  font-size: 0.875rem; color: var(--ink-70); text-decoration: none; white-space: nowrap;
}
.portal-nav-link:hover, .portal-nav-link:focus-visible { color: var(--ink); text-decoration: none; }
.portal-nav-link.is-current { color: var(--ink); font-weight: 600; }
.portal-main { width: 100%; max-width: var(--docs-max); margin: 0 auto; padding: 28px 2rem 56px; box-sizing: border-box; }
.portal-stub-note { max-width: 560px; }

/* page head: title left, mono status right */
.portal-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 16px; }
.portal-head .doc-h1 { margin: 0; }
.portal-head-meta { font-family: var(--font-mono); font-size: 0.59375rem; letter-spacing: 0.08125rem; color: var(--ink-45); }
.portal-crumb { font-family: var(--font-mono); font-size: 0.59375rem; line-height: 0.8125rem; letter-spacing: 0.08125rem; color: var(--ink-45); text-decoration: none; display: inline-block; margin: 0 0 6px; }  /* same type as .eyebrow */
.portal-crumb:hover { color: var(--ink); text-decoration: none; }
.portal-section { display: flex; align-items: center; gap: 16px; margin: 24px 0 10px; font-family: var(--font-mono); font-size: 0.59375rem; letter-spacing: 0.08125rem; color: var(--ink-45); }
.portal-section-line { flex: 1 1 auto; height: 1px; background: var(--rule); }
.portal-card { background: var(--paper-pure); border: 1px solid var(--rule); border-radius: 4px; padding: 20px 24px; }

/* account switcher (frame k5ag5v, scaled to the header) */
.portal-switcher-summary { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid var(--rule); border-radius: 4px; background: var(--paper); cursor: pointer; font-size: 0.875rem; }
.portal-switcher[open] .portal-chevron { transform: rotate(180deg); }
.portal-chevron { color: var(--ink-70); transition: transform 150ms ease; }
.portal-panel { width: 300px; padding: 0; }
.portal-panel-label { margin: 0; padding: 12px 18px 8px; font-family: "JetBrains Mono", monospace; font-size: 0.625rem; letter-spacing: 0.14em; color: var(--ink-45); }
.portal-account-form { margin: 0; }
.portal-account { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 18px; border: 0; border-top: 1px solid var(--rule); background: transparent; text-align: left; cursor: pointer; font: inherit; color: var(--ink); }
.portal-account:hover, .portal-account.is-current { background: var(--paper); }
.portal-account-check { width: 12px; color: var(--accent); font-size: 0.75rem; }
.portal-account-text { flex: 1 1 auto; display: flex; flex-direction: column; gap: 2px; }
.portal-account-name { font-size: 0.875rem; }
.portal-account-key { font-family: "JetBrains Mono", monospace; font-size: 0.6875rem; color: var(--ink-45); }
.portal-mode-row { display: flex; align-items: center; justify-content: space-between; padding: 8px 18px 10px 0; border-top: 1px solid var(--rule); }
.portal-mode-row .portal-panel-label { padding-top: 0; padding-bottom: 0; }
.portal-mode-form { display: inline-flex; border: 1px solid var(--rule); border-radius: 4px; overflow: hidden; margin: 0; }
.portal-mode { padding: 6px 14px; border: 0; background: var(--paper-pure); font: inherit; font-size: 0.8125rem; color: var(--ink-70); cursor: pointer; }
.portal-mode.is-on { background: var(--ink); color: var(--paper-pure); }
.portal-panel .account-panel-item { font-size: 0.875rem; padding: 8px 18px; }
.docs-header .portal-nav { margin-left: 32px; }

/* settings hub + tabs */
.settings-tabs { display: flex; gap: 24px; margin: 4px 0 20px; border-bottom: 1px solid var(--rule); }
.settings-tab { padding: 8px 0 10px; font-size: 0.9375rem; color: var(--ink-70); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.settings-tab:hover { color: var(--ink); text-decoration: none; }
.settings-tab.is-active { color: var(--ink); font-weight: 600; border-bottom-color: var(--ink); }
.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 20px; max-width: 900px; }
.settings-card { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--ink); }
.settings-card:hover { border-color: var(--ink-45); text-decoration: none; }
.settings-card-title { font-weight: 600; font-size: 1rem; }
.settings-card-desc { font-size: 0.875rem; color: var(--ink-70); }

/* vertical rhythm on portal pages: the docs h1 carries docs-sized margins */
.page-portal .doc-h1 { margin: 0 0 6px; font-size: 2rem; line-height: 1.1; }
.page-portal .eyebrow { margin: 0 0 6px; }
.page-portal .doc-intro { margin: 0 0 16px; }

.settings-facts { display: grid; grid-template-columns: 140px 1fr; gap: 14px 24px; margin: 20px 0 0; max-width: 720px; font-size: 0.9375rem; }
.settings-facts dt { font-family: "JetBrains Mono", monospace; font-size: 0.6875rem; letter-spacing: 0.12em; color: var(--ink-45); padding-top: 3px; }
.settings-facts dd { margin: 0; }
.settings-hint { color: var(--ink-45); }
.settings-roles, .team-role-hints { list-style: none; margin: 6px 0 0; padding: 0; font-size: 0.8125rem; line-height: 1.5; }

/* Sheets on portal pages open as right-side drawers (like the evidence
   drawer), with room to breathe: add partner, new requirement set,
   invite teammate, create key. */
.page-portal .account-scrim { justify-content: flex-end; align-items: stretch; background: rgba(11, 11, 12, 0.18); }
.page-portal .account-sheet { width: 560px; max-width: 100vw; height: 100%; border-radius: 0; border-width: 0 0 0 1px;
  padding: 36px 44px 40px; overflow-y: auto; box-sizing: border-box; box-shadow: -8px 0 24px rgba(11, 11, 12, 0.06); }
.page-portal .account-sheet .eyebrow { margin-bottom: 12px; }
.page-portal .account-sheet .field { margin: 22px 0 0; }
.page-portal .account-sheet .field-label { margin-bottom: 8px; }
.page-portal .account-sheet .field input, .page-portal .account-sheet .field select { height: 40px; }
.page-portal .account-sheet .doc-note, .page-portal .account-sheet .auth-lead { margin: 0 0 8px; line-height: 1.5; }
.page-portal .account-sheet [class*="-options"], .page-portal .account-sheet .partners-start-from { margin-top: 12px; display: flex; flex-direction: column; gap: 12px; }
.page-portal .account-sheet .btn-primary, .page-portal .account-sheet .btn-secondary { padding: 12px 20px; }
.page-portal .account-sheet form > .account-actions, .page-portal .account-sheet .partners-sheet-actions { margin-top: 28px; }

/* Insureds (G61, design/images/customer/RPWmG.png): the account's roster
   of every insured it has asked IVE to verify. Shares .verif-table,
   .verif-tab/.verif-filter/.verif-search and .partners-set-chip with the
   Verifications and Partners screens; only the layout below (the combined
   tab+filters row, the verdict dot+word line, and the coverage chip row)
   is specific to this screen. */
.ins-head { margin-bottom: 16px; }

.ins-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding-bottom: 8px;
  margin: 0 0 22px;
  border-bottom: 1px solid var(--rule);
}
.ins-toolbar-tab .verif-tab { padding-bottom: 8px; }
.ins-toolbar-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.ins-table .col-insured { width: 300px; }
.ins-table .col-contact { width: 200px; }
.ins-table .col-partners { width: 260px; }
.ins-table .col-verdict { width: 280px; }
.ins-table .col-coverage { width: 280px; }
.ins-table td.col-lastactivity, .ins-table th.col-lastactivity { text-align: right; white-space: nowrap; }
.ins-table td.col-lastactivity {
  font-family: var(--font-mono); font-size: 0.625rem; letter-spacing: 0.03125rem; color: var(--ink-70);
}

.ins-tabs { display: flex; gap: 26px; }
.ins-tabs a.verif-tab:hover { color: var(--ink); text-decoration: none; }
.ins-contact-action { font-size: 0.8125rem; }
.ins-table .chip-pending { margin-bottom: 2px; }
.page-portal .account-sheet .sheet-actions { display: flex; align-items: center; gap: 18px; margin-top: 28px; }

.ins-coverage { display: flex; flex-wrap: wrap; gap: 5px; }
.ins-coverage-chip { border-color: var(--ink-45); font-size: 0.59375rem; letter-spacing: 0.025rem; text-transform: uppercase; }

@media (max-width: 720px) {
  .ins-toolbar { align-items: stretch; }
  .ins-toolbar-filters { width: 100%; }
  .verif-search { width: 100%; }
}


/* ---- staff view banner ------------------------------------------------- */
.staff-banner { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 24px; background: var(--ink); color: #fff; font: 400 13px/1.3 var(--font-display); }
.staff-banner strong { font-weight: 600; }
.staff-banner-btn { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,0.4); border-radius: 2px; padding: 6px 12px; font: 500 13px/1 var(--font-display); cursor: pointer; }
.staff-banner-btn:hover { background: #fff; color: var(--ink); }

/* Portal pages on the unified shell (portal_page.html): the rail is the nav, so
   the page keeps its own width inside the main area (U3). */
.portal-main-shell { max-width: none; padding: 16px 40px 64px; }

/* Under the rail shell there is no top header: sticky offsets and the strip's pull-up start at 0. */
.page-portal-shell { --header-h: 0px; }
.page-portal-shell .req-strip { margin-top: 0; }
