/* MatryxCap partner portal — builds on site.css (tokens, buttons, fields, alerts). */

body.portal { font-size: 15.5px; }
.portal .wrap { max-width: 1120px; }
.ptop { position: sticky; top: 0; z-index: 20; background: rgba(250, 250, 247, .95); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.ptop .wrap { display: flex; align-items: center; gap: 24px; min-height: 64px; flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; }
.ptop .brand small { font: 500 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); border: 1px solid var(--line); border-radius: 6px; padding: 2px 6px; margin-left: 2px; }
.pnav { display: flex; gap: 22px; font: 500 15px var(--body); color: var(--ink2); }
.pnav a { padding: 6px 0; border-bottom: 2px solid transparent; }
.pnav a:hover, .pnav a.on { color: var(--ink); border-color: var(--ink); }
.pwho { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.pwho form { margin: 0; }
.pname { display: flex; flex-direction: column; line-height: 1.2; text-align: right; font-size: 14px; }
.pname small { color: var(--muted); font-size: 11.5px; }
.pmain { padding-top: 32px; padding-bottom: 64px; min-height: 70vh; }
.pfoot { border-top: 1px solid var(--line); padding: 20px 0; font-size: 13px; color: var(--muted); }

.phead { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.phead h1 { font-size: clamp(26px, 3vw, 34px); font-weight: 800; }
.phead .sub { color: var(--muted); font-size: 14.5px; margin-top: 4px; }
.phead .spacer { margin-left: auto; display: flex; gap: 10px; flex-wrap: wrap; }

.pstats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 28px; }
.pstat { display: block; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 18px 20px; transition: .15s; }
.pstat:hover { border-color: var(--ink2); }
.pstat b { display: block; font: 500 32px var(--mono); letter-spacing: -.02em; }
.pstat span { color: var(--muted); font-size: 13.5px; }

.pcard { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 22px; }
.pcard + .pcard { margin-top: 18px; }
.pcard h2 { font-size: 18px; margin-bottom: 14px; }
.pcard h2 small { font: 400 13px var(--body); color: var(--muted); margin-left: 6px; letter-spacing: 0; }
.pgrid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 20px; align-items: start; }
.pgrid > div > .pcard:first-child { margin-top: 0; }

.ptbl { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.ptbl th { text-align: left; font: 600 11.5px var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); padding: 10px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.ptbl td { padding: 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.ptbl tr:last-child td { border-bottom: 0; }
.ptbl tbody tr:hover td { background: #FBFBF8; }
.ptbl .num { text-align: right; font-family: var(--mono); white-space: nowrap; }
.ptbl a.case { font: 500 13.5px var(--mono); color: var(--indigo); }
.ptbl a.case:hover { text-decoration: underline; }
.twrap { overflow-x: auto; }
.empty { text-align: center; padding: 36px 16px; color: var(--muted); }
.empty b { display: block; color: var(--ink); font: 700 18px var(--display); margin-bottom: 6px; }

.badge { display: inline-block; font: 600 12px var(--body); padding: 3px 10px; border-radius: 999px; white-space: nowrap; background: #F3F4F6; color: #4B5563; }
.badge.st-draft, .badge.st-discarded, .badge.st-withdrawn { background: #F3F4F6; color: #6B7280; }
.badge.st-logged, .badge.st-doc_verification, .badge.st-submitted, .badge.st-under_review { background: var(--indigo-soft); color: #3730A3; }
.badge.st-docs_pending, .badge.st-duplicate { background: var(--warn-bg); color: var(--warn); }
.badge.st-sanctioned, .badge.st-disbursed { background: var(--ok-bg); color: var(--ok); }
.badge.st-rejected { background: var(--bad-bg); color: var(--bad); }
.badge.d-uploaded { background: var(--indigo-soft); color: #3730A3; }
.badge.d-verified { background: var(--ok-bg); color: var(--ok); }
.badge.d-rejected { background: var(--bad-bg); color: var(--bad); }

.pfilter { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 18px; }
.pfilter input[type=text] { width: 260px; }
.pfilter select { width: auto; min-width: 190px; }
.pager { display: flex; gap: 6px; margin-top: 18px; flex-wrap: wrap; }
.pager a { padding: 7px 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; background: #fff; }
.pager a.on { background: var(--ink); color: #fff; border-color: var(--ink); }

/* progress bar on a case */
.stepper { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 6px; margin: 4px 0 24px; }
.stepper li { list-style: none; font: 500 12px var(--mono); color: var(--muted); border-top: 4px solid var(--line); padding-top: 8px; }
.stepper li.done { border-color: var(--indigo); color: var(--indigo); }
.stepper li.now { border-color: var(--amber); color: var(--ink); font-weight: 500; }
.stepper.dead li.now { border-color: var(--bad); color: var(--bad); }
.stepper { padding: 0; }

.callout { border-radius: 14px; padding: 16px 18px; margin-bottom: 18px; font-size: 15px; }
.callout b { display: block; margin-bottom: 4px; }
.callout.warn { background: var(--warn-bg); color: var(--warn); }
.callout.bad { background: var(--bad-bg); color: var(--bad); }
.callout.ok { background: var(--ok-bg); color: var(--ok); }
.callout form { margin-top: 12px; }

.kv { display: grid; grid-template-columns: 150px 1fr; gap: 10px 14px; font-size: 14.5px; }
.kv dt { color: var(--muted); font: 600 12px var(--mono); text-transform: uppercase; letter-spacing: .04em; padding-top: 2px; }
.kv dd { margin: 0; word-break: break-word; }

/* document checklist */
.doclist { display: grid; gap: 12px; }
.doc { border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; }
.doc.need { border-color: #FCD34D; background: #FFFDF5; }
.doc-h { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.doc-h b { font-size: 15px; }
.doc-h .req { font: 500 11px var(--mono); color: var(--warn); background: var(--warn-bg); border-radius: 6px; padding: 2px 7px; }
.doc-h .have { margin-left: auto; font: 600 13px var(--body); }
.doc-h .have.yes { color: var(--ok); }
.doc-h .have.no { color: var(--muted); }
.files { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 8px; }
.files li { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 14px; padding: 8px 10px; background: var(--paper); border-radius: 10px; }
.files .fname { font-weight: 600; word-break: break-all; }
.files .fmeta { color: var(--muted); font: 400 12px var(--mono); }
.files .why { flex-basis: 100%; color: var(--bad); font-size: 13px; }
.files form { display: inline; margin: 0; }
.files .grow { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.linkbtn { background: none; border: 0; padding: 0; font: 600 13px var(--body); color: var(--indigo); cursor: pointer; }
.linkbtn:hover { text-decoration: underline; }
.linkbtn.bad { color: var(--bad); }
.upload { display: grid; grid-template-columns: 1fr 1.4fr auto; gap: 10px; align-items: end; margin-top: 4px; }
.upload .field { margin: 0; }
input[type=file] { width: 100%; font: 400 14px var(--body); padding: 9px 10px; border: 1px dashed #A8A29E; border-radius: 12px; background: #fff; }

/* timeline */
.tl { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.tl li { position: relative; padding: 0 0 18px 22px; border-left: 2px solid var(--line); margin-left: 6px; font-size: 14.5px; }
.tl li:last-child { border-color: transparent; padding-bottom: 0; }
.tl li::before { content: ""; position: absolute; left: -7px; top: 5px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 2px solid var(--line); }
.tl li.status::before { border-color: var(--indigo); background: var(--indigo); }
.tl li.message::before { border-color: var(--amber); background: var(--amber); }
.tl .who { font: 400 12px var(--mono); color: var(--muted); margin-bottom: 2px; }
.tl .body { color: var(--ink2); white-space: pre-line; }
.tl .internal { font: 600 11px var(--mono); color: var(--warn); background: var(--warn-bg); border-radius: 6px; padding: 1px 6px; margin-left: 6px; }

.formgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.formgrid .full { grid-column: 1 / -1; }
.formactions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.subtle { color: var(--muted); font-size: 13.5px; }
details.more { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 14px; }
details.more summary { cursor: pointer; font: 600 14px var(--body); color: var(--ink2); }
details.more form { margin-top: 12px; }
.btn-danger { background: var(--bad-bg); color: var(--bad); border-color: #FCA5A5; }

/* login */
.loginbox { max-width: 440px; margin: 40px auto 0; }
.loginbox h1 { font-size: 30px; margin-bottom: 8px; }
.loginbox .lede { font-size: 16px; margin-bottom: 24px; color: var(--ink2); }

@media (max-width: 900px) {
  .pstats { grid-template-columns: 1fr 1fr; }
  .pgrid { grid-template-columns: 1fr; }
  .formgrid { grid-template-columns: 1fr; }
  .upload { grid-template-columns: 1fr; }
  .pname { display: none; }
  .kv { grid-template-columns: 1fr; gap: 2px 0; }
  .kv dt { margin-top: 8px; }
  .stepper { grid-auto-flow: row; }
  .ptbl .hide-s { display: none; }
}