/* Page-scoped rules for templates/adminportal/ (docs/UI.md §5). Prefix every class with the portal's family. */

/* Painel (archetype B): the next step, then two queue columns of the same height */
.adm-home{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:stretch;margin-top:16px}
.adm-col{display:flex;flex-direction:column;min-width:0}
.adm-col .card-head h2{font-size:15px}
.adm-hl{margin-top:2px}
.adm-hl .hl-copy>a{color:var(--ink)}
.adm-hl .hl-copy>a:hover{color:var(--accent-ink)}
.adm-sec{margin-top:18px;padding-top:16px;border-top:1px solid var(--line-2)}
.adm-calm{margin:10px 0 0;font-size:13px;color:var(--sec);line-height:1.6}
.adm-calm .dot{display:inline-block;margin:0 8px 1px 0;vertical-align:middle}
.adm-one .hl-copy{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.adm-one>li{padding-top:10px;padding-bottom:10px}
.adm-calm a,.card-head a{color:var(--accent-ink);font-weight:500}
.adm-foot{margin:auto 0 0;padding-top:14px;font-size:12px}
.adm-more{margin:8px 0 0}
.adm-due{white-space:nowrap}
.adm-due.bad{color:var(--bad)}.adm-due.warn{color:var(--warn)}.adm-due.neu{color:var(--sec)}
.nx-meta.adm-due.bad{color:var(--bad)}.nx-meta.adm-due.warn{color:var(--warn)}
@media (max-width:900px){.adm-home{grid-template-columns:minmax(0,1fr)}}

/* company detail (archetype F): the review next step with its two rings, then profile | side */
.adm-review{margin-bottom:16px}
.adm-review .nx-copy{max-width:none}
.adm-review-rings{border:0;margin:14px 0 4px;max-width:560px}
.adm-review-rings .metric{padding-left:0}
.adm-list-label{margin:12px 0 0;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ter)}
.adm-review .nx-actions form{display:contents}
.adm-detail{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,1fr);gap:16px;align-items:stretch;margin-bottom:16px}
.adm-detail-side{display:flex;flex-direction:column;gap:16px;min-width:0}
.adm-detail-side>.card:last-child{flex:1}
.adm-life-now{margin:0 0 12px;font-size:13.5px;color:var(--sec);line-height:1.5}
.adm-life-actions{display:flex;flex-wrap:wrap;gap:8px}
.adm-life-actions form{display:contents}
.adm-docs,.adm-queue{margin-bottom:16px}
.adm-queue td>a:not(.btn){color:var(--ink);font-weight:550}
.adm-queue td>a:not(.btn):hover{color:var(--accent-ink)}

.nx-row+.adm-queue,.nx-row+.adm-home{margin-top:16px}
.adm-docs-head{padding-bottom:6px}
.adm-docs .card-head .ter{font-size:12.5px}
.adm-versions{display:flex;flex-wrap:wrap;gap:2px 10px;font-size:12.5px}
.adm-na{margin:0;padding:14px 22px;border-top:1px solid var(--line-2);font-size:12.5px;color:var(--sec);line-height:1.55}
@media (max-width:1000px){.adm-detail{grid-template-columns:minmax(0,1fr)}}

/* filtered list: the skeleton overlays the results region so rows land without shifting */
.adm-results{position:relative}
.adm-results .htmx-indicator{position:absolute;inset:0;z-index:1;padding:8px 22px;background:var(--surface);overflow:hidden}
.adm-select{min-width:200px}

/* detail banner: title on the left, pills + publish/pause on the right */
.adm-banner{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap;margin:4px 0 22px}
.adm-banner .pg-eyebrow{margin-bottom:8px}
.adm-banner-state{display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.adm-kv{grid-template-columns:minmax(120px,auto) 1fr;gap:8px 18px}
.adm-meter{display:flex;flex-direction:column;gap:8px;font-size:13.5px}
/* <progress> styled as the vocabulary's .progress bar (the CSP forbids inline --w styles) */
.adm-progress{display:block;width:100%;border:0;appearance:none;-webkit-appearance:none;background:var(--sunken);color:var(--accent)}
.adm-progress::-webkit-progress-bar{background:var(--sunken);border-radius:999px}
.adm-progress::-webkit-progress-value{background:var(--accent);border-radius:999px;transition:width .4s ease}
.adm-progress::-moz-progress-bar{background:var(--accent);border-radius:999px}
.adm-progress.ok::-webkit-progress-value{background:var(--ok-ico)}.adm-progress.ok::-moz-progress-bar{background:var(--ok-ico)}
.adm-progress.warn::-webkit-progress-value{background:var(--warn-ico)}.adm-progress.warn::-moz-progress-bar{background:var(--warn-ico)}
.adm-pending li{padding:8px 0}
.adm-history summary{cursor:pointer;color:var(--accent-ink);font-weight:600}
.adm-history .list{margin-top:8px}
.adm-history .list li{padding:6px 0;font-size:13px}
.adm-grant{margin-bottom:0}

/* investors / users: row-level error above a table, status panel, member list, invite form */
.adm-table-alert{margin:16px 22px 0}
.adm-status .alert{margin-bottom:0}
.adm-results-multi .htmx-indicator{border-radius:var(--r);box-shadow:var(--shadow)}
.adm-members li>div{min-width:0}
.adm-members .t,.adm-members .d{display:block}
.adm-members .d{margin-top:2px}
.adm-members .empty-note{flex:1}
.adm-invite .form-errors,.adm-invite .field:last-of-type{grid-column:1/-1}

/* document types: extension chips, the deactivate modal lives inside the row form */
.adm-chips{display:inline-flex;gap:6px;flex-wrap:wrap}
.adm-toggle{display:inline}
.adm-confirm{white-space:normal;text-align:left;overflow-wrap:anywhere}
.adm-confirm .form-actions{display:flex;gap:8px;justify-content:flex-start;flex-wrap:wrap}
.adm-fieldset{border:0;margin:0 0 16px;padding:0;min-width:0}
.adm-fieldset legend{padding:0;font-size:13px;font-weight:600;color:var(--sec);margin-bottom:8px}
.adm-ext-list{display:flex;gap:6px 22px;flex-wrap:wrap}
.adm-ext-list .check{margin-bottom:0}
.adm-doctype .field .check{margin-bottom:0}

/* requirements matrix: journey .seg + hint, radio toggles per row, narrow sort input */
.adm-hint{margin:0;font-size:12.5px}
.adm-journeys{max-width:100%;min-width:0;overflow-x:auto;scroll-padding-inline:12px}
.adm-journeys a{flex:none;white-space:nowrap}
.adm-matrix-notes{border-bottom:1px solid var(--line-2)}
.adm-matrix-notes .alert,.adm-matrix-notes .form-errors{margin-bottom:0}
.adm-matrix-notes .alert+.form-errors{margin-top:12px}
.adm-doc-name{display:inline-flex;align-items:center;gap:8px;font-weight:500}
.adm-req-choice{display:flex;gap:6px 18px;flex-wrap:wrap;border:0;margin:0;padding:0;min-width:0}
.adm-req-choice .check{margin-bottom:0;white-space:nowrap}
.adm-req-choice .err{flex-basis:100%}
.adm-sort{margin:0;display:inline-block}
.adm-matrix td.num .adm-sort input[type="number"]{width:88px;text-align:right}
.adm-matrix tbody td{vertical-align:middle}
.adm-matrix .panel-foot small{max-width:60ch}

/* requirements matrix on narrow screens: the table scrolls inside its region, never the page */
.adm-matrix .tbl{max-width:100%;overflow-x:auto}
.adm-matrix .adm-req-choice .check{white-space:normal}

@media (max-width: 768px){
  /* each document becomes a stacked card: name, category, requirement, order */
  .adm-matrix table,.adm-matrix tbody,.adm-matrix tr,.adm-matrix td{display:block;width:100%;min-width:0}
  .adm-matrix thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .adm-matrix tbody tr{padding:12px 16px;border-bottom:1px solid var(--line-2)}
  .adm-matrix tbody td{padding:4px 0;border:0;text-align:left}
  .adm-matrix td.num{text-align:left}
  .adm-matrix td.num .adm-sort input[type="number"]{text-align:left}
  .adm-journeys{display:flex;width:100%}
  .adm-banner-state{align-items:flex-start}
  .adm-matrix .panel-foot{flex-wrap:wrap}
}

/* Fase B part 2: sentence-title heads on the secondary admin screens */
.adm-sub,.pg-head .sub{margin:8px 0 0;color:var(--sec);font-size:13.5px;line-height:1.5;max-width:72ch}
.adm-more-hint{color:var(--ter);font-size:12px}
.adm-pending{margin-top:6px}
.adm-pending>li:first-child{border-top:0}
.panel>.metrics{border-bottom:0}
.panel>.metrics .metric dd>b{font-size:19px;font-weight:650}
.panel>.metrics .metric dd>span{white-space:normal}
.adm-kv dt{color:var(--ter);font-size:12px}
.adm-banner .pg-title{margin:0}
@media (max-width:768px){.pg-head .pg-head-actions{flex-wrap:wrap}}
.panel .tbl,.card .tbl{max-width:100%;overflow-x:auto}

/* Fase B polish (package 14): lists with one head, stacked rows on phones, quiet row actions */
.adm-queue .summary{padding-top:12px}
.adm-queue>div>.summary:first-child{padding-top:14px}
.adm-row-wait td:first-child a{color:var(--ink)}
.adm-since{font-size:12px;margin-left:4px;white-space:nowrap}
.adm-pager{border-top:1px solid var(--line-2)}
.adm-empty-pad{padding-top:4px}
.adm-filter-note{margin:0;padding:12px 22px;border-bottom:1px solid var(--line-2);font-size:13px;color:var(--sec)}
.adm-filter-note a{color:var(--accent-ink);font-weight:500}
.adm-form{max-width:880px}
.adm-thesis{margin:6px 0 14px}
.adm-hl-empty{display:block!important}
.admo-quote{margin:4px 0 0;max-width:46ch;color:var(--sec);font-size:12px;line-height:1.45;white-space:normal}

/* contracts: the totals as one line of figures above the table (never a tile glued to it) */
.adm-totals{display:flex;flex-wrap:wrap;gap:6px 28px;margin:0;padding:14px 22px;border-bottom:1px solid var(--line-2)}
.adm-totals>div{display:flex;align-items:baseline;gap:8px;min-width:0}
.adm-totals dt{order:2;color:var(--ter);font-size:12px}
.adm-totals dd{order:1;margin:0;font-size:15px;font-weight:650;white-space:nowrap}
@media (max-width:600px){
  .tbl-stack td.num.adm-num2{order:2;color:var(--ter);font-size:12px;text-align:left}
  .tbl-stack td.num.adm-num2::before{content:attr(data-label) " "}
  .adm-totals{padding:12px 16px}
}

/* audit: label first, the code as a small token, metadata in the drawer; nothing overflows 1440 */
.adm-audit-bar .search{flex:1 1 260px}
.adm-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:6px;padding:0 5px;border-radius:999px;background:var(--sunken);color:var(--ink);font-size:11px;font-weight:650}
.adm-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}
.adm-audit{table-layout:auto}
.adm-ev{min-width:220px}
.adm-ev-label{display:block;color:var(--ink);font-weight:550}
.adm-ev .admo-code{display:inline-block;margin-top:4px;font-size:11px;padding:1px 6px}
.adm-meta-open{margin-left:8px;font-size:12px}
.adm-obj{font-size:12px;overflow-wrap:anywhere}
.adm-audit time .d{display:block}
.adm-meta-full{max-width:none;white-space:pre-wrap}

/* requirements: neutral radios (the orange is the save), tabs that scroll with an edge fade,
   and the save bar that stays at the bottom of the screen while the matrix scrolls */
.adm-req-choice .check input{accent-color:var(--ink)}
:root[data-theme="dark"] .adm-req-choice .check input{accent-color:var(--sec)}
.adm-tabs-wrap{position:relative;max-width:100%;min-width:0}
@media (max-width:700px){
  .adm-tabs-wrap::after{content:"";position:absolute;top:0;right:0;bottom:0;width:28px;pointer-events:none;background:linear-gradient(to right,transparent,var(--bg))}
  .adm-tabs-wrap .adm-journeys{flex-wrap:nowrap;padding-right:24px}
}
.adm-matrix-help{margin:6px 0 0;font-size:13px;max-width:72ch}
@media (max-width:600px){.adm-docs-head .card-head{flex-direction:column;align-items:flex-start;gap:2px}}
.adm-savebar{background:var(--surface);border-top:1px solid var(--line-2)}
.adm-savebar.is-dirty{position:sticky;bottom:0;z-index:2;box-shadow:0 -6px 16px rgba(0,0,0,.08)}
.adm-unsaved{color:var(--warn);font-weight:600}
@media (max-width:768px){
  /* one line on phones: the warning and the button, nothing else */
  .adm-matrix .panel-foot.adm-savebar{flex-wrap:nowrap;align-items:center;gap:10px;padding-top:10px;padding-bottom:10px}
  .adm-savebar .adm-unsaved{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .adm-savebar .adm-unsaved-x{display:none}
  .adm-savebar .btn{flex:none;padding:9px 14px}
}

/* key/values of the detail pages: one column on phones, long e-mails and URLs wrap */
.adm-kv dd{min-width:0;overflow-wrap:anywhere}
@media (max-width:600px){.kv.adm-kv{grid-template-columns:minmax(0,1fr);gap:2px 0}.kv.adm-kv dd{margin-bottom:10px}}