/* Shared customer portal workspace; document cards intentionally replace admin tables. */
.customer-portal-page {
    --portal-ink: #14213a;
    --portal-muted: #526179;
    --portal-border: #dce3ee;
    color: var(--portal-ink);
    min-height: 100%;
    padding: clamp(16px, 3vw, 40px);
    background: #f7f8fc;
}
.customer-portal-page *, .customer-portal-page *::before, .customer-portal-page *::after { box-sizing: border-box; }
.customer-portal-shell { width: min(100%, 1180px); margin: 0 auto; display: grid; gap: 24px; min-width: 0; }
.customer-portal-card, .customer-portal-auth-card {
    min-width: 0; padding: clamp(20px, 2.8vw, 32px); border: 1px solid var(--portal-border, #dce3ee);
    border-radius: 20px; background: #fff; color: #14213a; box-shadow: 0 3px 14px #172b4d04;
}
.customer-portal-page--auth { display: grid; place-items: center; }
.customer-portal-auth-card { width: min(100%, 520px); margin: 0 auto; }
.customer-portal-page h1, .customer-portal-page h2, .customer-portal-page h3 { color: var(--portal-ink); margin: 0; font-weight: 750; line-height: 1.25; letter-spacing: -.025em; overflow-wrap: anywhere; }
.customer-portal-page h1 { font-size: clamp(1.7rem, 3.2vw, 2.6rem); }
.customer-portal-page h2 { font-size: clamp(1.15rem, 2vw, 1.4rem); }
.customer-portal-page h3 { font-size: 1.05rem; }
.customer-portal-page p { color: var(--portal-muted); line-height: 1.6; margin: 8px 0 0; }
.customer-portal-page small { color: var(--portal-muted); font-size: .82rem; line-height: 1.5; }
.customer-portal-page .customer-portal-eyebrow { font-size: .72rem; letter-spacing: .13em; text-transform: uppercase; font-weight: 800; color: #335d97; margin: 0 0 12px; }
.customer-portal-overview-head { display: block; align-items: center; justify-content: space-between; gap: 20px; padding: clamp(24px, 3.5vw, 42px); background: linear-gradient(135deg, #dbeafe 0%, #eff6ff 100%); border-color: #e5e7eb; }
.customer-portal-overview-head:has(.portal-hero-icon) { display: flex; }
.customer-portal-overview-head p { max-width: 640px; }
.portal-hero-icon { font-size: 68px; color: #35659e; padding: 20px; border-radius: 24px; background: #ffffff80; }
.portal-navigation { display: flex; gap: 6px; flex-wrap: wrap; padding: 6px; border: 1px solid var(--portal-border); border-radius: 14px; background: #edf1f7; width: fit-content; max-width: 100%; }
.portal-navigation a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 20px; border-radius: 10px; color: #42526a; font-size: .9rem; font-weight: 700; text-decoration: none; }
.portal-navigation a:hover { color: #14213a; background: #dde5f0; }
.portal-navigation a.active { background: #14213a; color: #fff; box-shadow: 0 2px 4px #14213a20; }
.customer-portal-section-head, .customer-portal-document-group-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.customer-portal-section-head p { font-size: .9rem; }
.portal-count { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; margin-left: 6px; padding: 0 8px; vertical-align: middle; background: #e8effd; color: #244fa6; border-radius: 8px; font-size: .8rem; letter-spacing: 0; }
.customer-portal-page .customer-portal-secondary-link { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; color: #2355ae; font-size: .85rem; font-weight: 700; text-decoration: none; flex-shrink: 0; }
.customer-portal-secondary-link:hover { color: #173977; text-decoration: underline; }
.customer-portal-document-list { display: grid; gap: 12px; }
.customer-portal-document-item { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; column-gap: 18px; row-gap: 16px; padding: 22px; background: #fff; border: 1px solid var(--portal-border); border-radius: 14px; }
.portal-document-icon { width: 48px; height: 54px; display: grid; place-items: center; color: #3866b0; border-radius: 12px; background: #edf3fc; }
.portal-document-icon i { font-size: 26px; }
.portal-document-content { min-width: 0; }
.portal-document-labels { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.customer-portal-document-kind { font-size: .68rem; font-weight: 800; letter-spacing: .1em; color: #526179; text-transform: uppercase; }
.portal-status { display: inline-flex; align-items: center; min-height: 24px; padding: 3px 9px; font-size: .72rem; line-height: 1.3; font-weight: 700; border-radius: 6px; color: #526179; background: #edf1f5; }
.portal-status--open { background: #fff3db; color: #82510b; }
.portal-status--success { background: #e2f4ea; color: #24613e; }
.customer-portal-page .portal-document-provider { color: #334155; margin: 6px 0 1px; font-size: .86rem; font-weight: 600; }
.customer-portal-document-meta { text-align: right; font-variant-numeric: tabular-nums; }
.customer-portal-document-meta strong, .customer-portal-document-meta small { display: block; }
.portal-amount { font-size: 1.15rem; font-weight: 800; white-space: nowrap; }
.portal-document-actions { grid-column: 2 / -1; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: flex-start; gap: 10px; }
.customer-portal-primary-button, .customer-portal-secondary-button { display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 44px; padding: 10px 16px; border: 1px solid transparent; border-radius: 10px; font: inherit; font-size: .85rem; line-height: 1.4; font-weight: 700; text-decoration: none; cursor: pointer; }
.customer-portal-page .customer-portal-primary-button { background: #2563eb; color: #fff; }
.customer-portal-page .customer-portal-primary-button:hover { background: #1949b5; color: #fff; }
.customer-portal-page .customer-portal-secondary-button { background: #fff; color: #31445f; border-color: #a9b7ca; }
.customer-portal-page .customer-portal-secondary-button:hover { background: #edf2f9; border-color: #6b83a5; color: #162d50; }
.customer-portal-page button:disabled { cursor: not-allowed; opacity: .55; }
.customer-portal-page .fas { flex-shrink: 0; }
.customer-portal-secondary-button .fas { font-size: 19px; }
.portal-download { max-width: 100%; }
.customer-portal-page .portal-download-error { max-width: 320px; font-size: .82rem; color: #b42336; text-align: left; }
.customer-portal-document-groups { display: grid; gap: 26px; }
.customer-portal-document-group { border-top: 1px solid #e6ebf2; padding-top: 20px; min-width: 0; }
.customer-portal-document-group-head { margin-bottom: 14px; }
.customer-portal-empty { display: flex; align-items: center; gap: 14px; border: 1px dashed #bac8da; border-radius: 12px; padding: 22px; background: #f8fafd; color: #526179; }
.customer-portal-empty > i { font-size: 28px; color: #657b99; }
.customer-portal-empty strong { color: #42536c; font-size: .95rem; }
.customer-portal-empty p { margin-top: 4px; font-size: .85rem; }
.customer-portal-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 28px 0 0; padding-top: 22px; border-top: 1px solid #e1e7f0; }
.customer-portal-facts dt { color: #526179; font-size: .78rem; margin-bottom: 5px; }
.customer-portal-facts dd { margin: 0; font-size: 1rem; font-weight: 750; font-variant-numeric: tabular-nums; }
.customer-portal-facts > div:last-child dd { color: #1e51a8; font-size: 1.2rem; }
.customer-portal-offer-head { background: linear-gradient(120deg, #fff 55%, #edf4ff); }
.customer-portal-offer-head .customer-portal-eyebrow { margin: 0; }
.customer-portal-provider { font-size: .88rem; font-weight: 600; }
.customer-portal-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 20px; }
.customer-portal-lines { margin-top: 20px; }
.customer-portal-line { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; padding: 20px 0; border-bottom: 1px solid #e6ebf2; }
.customer-portal-line:last-child { border-bottom: 0; padding-bottom: 0; }
.customer-portal-line strong { display: block; font-size: .95rem; line-height: 1.5; }
.customer-portal-line span { display: block; font-size: .83rem; line-height: 1.6; color: #526179; margin-top: 6px; }
.customer-portal-line > div:last-child { white-space: nowrap; font-size: .93rem; font-weight: 750; font-variant-numeric: tabular-nums; }
.customer-portal-field { display: flex; flex-direction: column; gap: 8px; margin-top: 18px; font-size: .87rem; font-weight: 600; }
.customer-portal-field:has(input[type=checkbox]) { flex-direction: row; align-items: flex-start; padding: 14px; background: #f3f6fb; border-radius: 10px; line-height: 1.5; }
.customer-portal-field input[type=checkbox] { width: 20px; height: 20px; flex-shrink: 0; accent-color: #2563eb; margin: 2px 0 0; }
.customer-portal-input { width: 100%; min-height: 112px; resize: vertical; border: 1px solid #94a3b8; border-radius: 10px; background: #fff; padding: 12px 14px; color: #14213a; font: inherit; font-weight: 400; line-height: 1.6; }
.portal-conversation-column { display: grid; align-content: start; gap: 20px; min-width: 0; }
.portal-conversation-column .customer-portal-card { padding: 24px; }
.portal-conversation-column article { margin-top: 18px; padding: 14px; border-radius: 10px; background: #f2f5fa; overflow-wrap: anywhere; }
.portal-conversation-column article strong { font-size: .78rem; color: #526179; }
.portal-conversation-column article p { white-space: pre-wrap; }
.portal-conversation-column .customer-portal-secondary-button { margin-top: 16px; }
.portal-conversation-column .customer-portal-actions { margin-top: 0; }
.customer-portal-decision-summary { display: flex; gap: 16px; flex-wrap: wrap; justify-content: space-between; padding: 20px 0; font-variant-numeric: tabular-nums; }
.customer-portal-decision-state { border-color: #a5d4b8; background: #f0faf4; }
.customer-portal-page :is(a, button, textarea, input):focus-visible { outline: 3px solid #2563eb; outline-offset: 4px; }
@media (min-width: 1000px) {
    .customer-portal-shell--detail { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); align-items: start; }
    .portal-detail-navigation, .customer-portal-offer-head { grid-column: 1 / -1; }
    .customer-portal-shell--detail > .customer-portal-card:not(.customer-portal-offer-head) { grid-column: 1; }
    .portal-conversation-column { grid-column: 2; grid-row: 3 / span 5; }
    .customer-portal-document-item { grid-template-columns: 48px minmax(0, 1fr) auto; }
    .portal-document-actions { margin-top: -4px; }
}
@media (max-width: 599px) {
    .customer-portal-page { padding: 16px 12px 28px; }
    .customer-portal-shell { gap: 16px; }
    .customer-portal-card { padding: 20px 16px; border-radius: 16px; }
    .portal-hero-icon { display: none; }
    .portal-navigation { width: 100%; gap: 4px; }
    .portal-navigation a { flex: 1 1 40%; padding: 8px 10px; }
    .customer-portal-section-head { align-items: flex-start; flex-direction: column; gap: 4px; margin-bottom: 16px; }
    .customer-portal-document-item { padding: 16px; gap: 14px; grid-template-columns: 36px minmax(0, 1fr); }
    .portal-document-icon { width: 36px; height: 44px; }
    .portal-document-icon i { font-size: 22px; }
    .portal-document-labels { gap: 6px; }
    .customer-portal-document-meta { grid-column: 2; text-align: left; }
    .portal-document-actions { grid-column: 1 / -1; justify-content: stretch; flex-direction: column; gap: 8px; }
    .portal-document-actions > *, .portal-document-actions button { width: 100%; }
    .portal-amount { font-size: 1.2rem; }
    .customer-portal-facts { grid-template-columns: 1fr 1fr; gap: 18px 10px; }
    .customer-portal-facts > div:last-child { grid-column: 1 / -1; }
    .customer-portal-facts > div:last-child dd { font-size: 1.65rem; }
    .customer-portal-line { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .portal-conversation-column .customer-portal-card { padding: 20px 16px; }
    .customer-portal-empty { padding: 18px 14px; }
}

.portal-signature { margin-top: 24px; }
.portal-signer-name { width: 100%; min-height: 44px; border: 1px solid #94a3b8; border-radius: 10px; padding: 12px; color: #14213a; background: #fff; }
.portal-signature-method { margin: 20px 0; padding: 16px; border: 1px solid #cbd5e1; border-radius: 12px; }
.portal-signature-method legend { font-size: .9rem; font-weight: 700; }
.portal-signature-method label { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.portal-signature-canvas { display: block; width: 100%; height: 180px; touch-action: none; border: 1px solid #94a3b8; border-radius: 12px; background: #fff; margin: 12px 0; }
.portal-signature-consent { padding: 16px !important; border: 1px solid #a9b7ca; }
.portal-typed-signature { font: italic 1.7rem Georgia, serif; padding: 20px 8px; border-bottom: 1px solid #94a3b8; overflow-wrap: anywhere; }
.portal-contract-preview { padding: 16px; margin-top: 20px; border: 1px solid #cbd5e1; border-radius: 12px; max-height: 420px; overflow: auto; }
.portal-contract-preview summary { font-weight: 700; cursor: pointer; min-height: 44px; }
.portal-contract-preview p { white-space: pre-wrap; font-size: .85rem; overflow-wrap: anywhere; }
.portal-contract-hash { font-family: monospace; overflow-wrap: anywhere; }

.portal-signature.is-disabled .portal-signature-canvas { pointer-events: none; opacity: .7; }