/* Aedonyx client portal — the admin's few extra parts, on portal.css's tokens. Denser than the client side, same parts.
   No new colours, no side stripes, no shadows beyond the tokens. */

/* small spacing helpers */
.ax-mt{margin-top:18px}.ax-mt-s{margin-top:8px}.ax-mb{margin-bottom:16px}.ax-mb-s{margin-bottom:8px}
.ax-grow{flex:1;min-width:0}
.ax-gap{margin-bottom:20px}
.ax-show-sm{display:none}

/* a page title with its status lamp beside it */
.ax-title{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.ax-title .pill,.ax-title .tag{margin-top:4px}

/* a lamp and a word, inline (last check, DNS, two-step) */
.ax-lw{display:inline-flex;align-items:center;gap:8px;color:var(--film);white-space:nowrap}

.ax-urgent{color:var(--brick);border-color:rgba(178,58,38,.35);background:var(--brick-wash)}
.ax-lnk-q{color:inherit}
.ax-lnk-q:hover{color:var(--film)}
.ax-note{margin-left:auto;color:var(--dim);font-size:13px}
.ax-filter{display:inline-flex}
.ax-totals{color:var(--muted);font-size:14px}
.ax-totals b{color:var(--film);font-weight:600;margin-left:4px}
.ax-totals .bad b{color:var(--brick)}

/* the client page's section tabs */
.ax-tabs{margin-bottom:24px}

/* needs attention: one linked line each */
.ax-attn li+li{border-top:1px dashed var(--dash)}
.ax-attn a{display:grid;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;gap:14px;padding:13px 22px;color:var(--plate);transition:background .16s var(--ease)}
.ax-attn a:hover{background:var(--paper)}
.ax-attn a:hover .ax-attn-t{color:var(--steel)}
.ax-attn-t{color:var(--film);overflow-wrap:anywhere}
.ax-attn-t .tag{margin-left:6px;vertical-align:1px}
.ax-attn-m{color:var(--dim);font-size:13px;white-space:nowrap;font-variant-numeric:tabular-nums}

/* a short list in a side sheet (coming up, payments, administrators) */
.ax-mini li+li{border-top:1px dashed var(--dash)}
.ax-mini a,.ax-mini-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 22px;color:var(--plate)}
.ax-mini a{transition:background .16s var(--ease)}
.ax-mini a:hover{background:var(--paper)}
.ax-mini a:hover b{color:var(--steel)}
.ax-mini span{min-width:0}
.ax-mini b{display:block;color:var(--film);font-weight:600;font-size:14.5px;overflow-wrap:anywhere}
.ax-mini small{display:block;margin-top:1px;color:var(--muted);font-size:13px}
.ax-mini .r{flex:0 0 auto;text-align:right}
.ax-mini .r small{white-space:nowrap}
.ax-mini small.bad{color:var(--brick)}
.ax-links{display:grid;gap:4px}

/* the users tab: the picked row, and the list of things you can do to one person */
.table tbody tr.ax-sel td{background:var(--steel-wash)}
.table tbody tr.ax-sel:last-child td:first-child{border-bottom-left-radius:var(--r-lg)}
.table tbody tr.ax-sel:last-child td:last-child{border-bottom-right-radius:var(--r-lg)}
.ax-acts{border-top:1px dashed var(--dash)}
.ax-acts li{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 22px}
.ax-acts li+li{border-top:1px dashed var(--dash)}
.ax-acts p{min-width:0}
.ax-acts b{display:block;color:var(--film);font-weight:600;font-size:14.5px}
.ax-acts small{display:block;color:var(--muted);font-size:13px;line-height:1.45}
.ax-acts li.ax-act-wide{display:grid;gap:10px}
.ax-reason{display:flex;align-items:flex-end;gap:12px}
.ax-reason .field{flex:1}
.ax-reason .field input{min-height:38px;padding:6px 2px;font-size:15px}
.sheet>.ax-acts:first-child{border-top:0}

/* view the portal as one of the client's users */
.ax-view-as{display:inline-flex;align-items:flex-end;gap:10px}
.ax-view-as label{display:grid;gap:2px}
.ax-view-as .filter{max-width:220px;min-height:34px}
.ax-view-as .key{margin-bottom:2px}

/* a status / priority change: a select and a key on one line */
.ax-status{flex-wrap:nowrap;gap:12px;align-items:flex-end}
.ax-status .filter{width:100%}
.ax-status .field-l{display:block}

/* the change log under its form */
.ax-log{padding:20px 22px 22px;border-top:1px dashed var(--dash)}
.ax-log-head{flex-wrap:nowrap;align-items:flex-start;gap:10px}
.ax-log-head .cmd{min-height:24px;font-size:12px}

/* setup: code wells with a copy key that stays out of the copied text */
.ax-well{position:relative}
.ax-well .well{padding-right:92px}
.ax-well>.key{position:absolute;top:10px;right:10px;background:rgba(241,245,248,.08);border-color:rgba(241,245,248,.16);color:#f1f5f8;box-shadow:none}
.ax-well>.key:hover{background:rgba(241,245,248,.16);border-color:rgba(241,245,248,.28)}
.table.ax-tight td,.table.ax-tight th{padding-top:9px;padding-bottom:9px}
.sheet-body .table.ax-tight th:first-child,.sheet-body .table.ax-tight td:first-child{padding-left:0}
.sheet-body .table.ax-tight th:last-child,.sheet-body .table.ax-tight td:last-child{padding-right:0}

/* files: the name is the download */
.ax-file{display:inline-flex;align-items:center;gap:8px;max-width:340px;color:var(--film);font-weight:500}
.ax-file span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ax-file .ico{color:var(--steel)}
.ax-file:hover{color:var(--steel)}

.ax-admin-only{color:var(--muted);font:600 11px/1 var(--label);letter-spacing:.06em;text-transform:uppercase}
.ax-kv .kv-row{grid-template-columns:minmax(96px,36%) minmax(0,1fr);padding:9px 0}
.ax-activity td{vertical-align:top}

/* the invoice line editor (portal.js [data-repeat]) */
.ax-lines-head,.ax-line{display:grid;grid-template-columns:minmax(0,1fr) 72px 132px 112px 34px;gap:14px;align-items:end}
.ax-lines-head{padding-bottom:8px;border-bottom:1px solid var(--rule);color:var(--dim);font:600 12px/1.3 var(--label);letter-spacing:.06em;text-transform:uppercase}
.ax-lines-head .r,.ax-l-amt{text-align:right}
.ax-line{padding:4px 0}
.ax-line+.ax-line{border-top:1px dashed var(--dash)}
.ax-line .field input{min-height:42px}
.ax-l-qty input{text-align:right}
.ax-l-amt{padding-bottom:11px;color:var(--film);font-variant-numeric:tabular-nums;white-space:nowrap}
.ax-l-rm{width:34px;padding:0;margin-bottom:6px;color:var(--muted)}
.ax-l-rm:hover{color:var(--brick)}
.ax-lines>.err{margin-top:10px}
.ax-lines-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;margin-top:14px;padding-top:14px;border-top:1px solid var(--rule)}
.ax-lines-total{display:flex;align-items:baseline;gap:14px}
.ax-lines-total output{color:var(--film);font:600 20px/1 var(--sans);letter-spacing:-.01em}

/* files: the share form, drop zone beside the fields */
.ax-share{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px 28px;align-items:start}
.ax-share .drop{min-height:100%;align-content:center}
.ax-share>div:first-of-type{height:100%}

/* the invoice page: the document and its sticky actions */
.ax-inv-doc .doc{max-width:none}
/* a long domain in a hosting line must not push the amount column off a phone screen */
.ax-inv-doc .doc td.cell-main{overflow-wrap:anywhere}
.ax-add-admin{border-top:1px dashed var(--dash)}

/* access requests (Clients page, Access requests): one person per line, set up or decline under it */
.ax-wait li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 18px;padding:16px 22px}
.ax-wait li+li{border-top:1px dashed var(--dash)}
.ax-wait-main{min-width:0}
.ax-wait-t{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;color:var(--film)}
.ax-wait-t b{font-weight:600;overflow-wrap:anywhere}
.ax-wait-s{margin-top:2px;color:var(--muted);font-size:13.5px;overflow-wrap:anywhere}
.ax-wait-msg{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;max-width:76ch;margin-top:6px;color:var(--plate);font-size:14px;white-space:pre-line;overflow-wrap:anywhere}
.ax-wait-when{color:var(--dim);font-size:13px;white-space:nowrap}
.ax-wait-acts{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:4px 24px;margin-top:4px}
.ax-decline>summary{list-style:none;width:fit-content}
.ax-decline>summary::-webkit-details-marker{display:none}
.ax-decline[open]{flex-basis:100%}
.ax-decline-f{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 16px;margin-top:4px}
.ax-decline-f .field{flex:1 1 260px;max-width:440px}
.ax-decline-f .field input{min-height:38px;padding:6px 2px;font-size:15px}

/* set up a client: the request it came from, company name beside its code, a seam before the address */
.ax-from{align-items:flex-start}
.ax-from .lamp{margin-top:8px}
.ax-from>div{flex:1;min-width:0}
.ax-from-msg{margin-top:10px;padding:12px 14px;border:1px solid var(--rule);border-radius:10px;background:var(--paper-hi);white-space:pre-line;overflow-wrap:anywhere}
.ax-name-code{grid-template-columns:minmax(0,1fr) minmax(150px,200px)}
.ax-seam{margin-top:22px;padding-top:22px;border-top:1px dashed var(--dash)}

@media (max-width:1200px){
  .ax-inv-grid .sticky{position:static}
}
@media (max-width:960px){
  .ax-share{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .ax-show-sm{display:block}
  .ax-attn a{padding:12px 16px;grid-template-columns:8px minmax(0,1fr);row-gap:2px}
  .ax-attn-m{grid-column:2}
  .ax-mini a,.ax-mini-row,.ax-acts li{padding-inline:16px}
  .ax-log{padding-inline:16px}
  .ax-acts li{flex-wrap:wrap}
  .ax-reason{flex-wrap:wrap}
  .ax-view-as{width:100%}
  .ax-view-as label{flex:1}
  .ax-view-as .filter{max-width:none;width:100%}
  .ax-lines-head{display:none}
  .ax-line{grid-template-columns:64px minmax(0,1fr) auto 34px;row-gap:2px;padding:10px 0}
  .ax-l-desc{grid-column:1/-1}
  .ax-note{margin-left:0}
  .ax-file{max-width:220px}
  .ax-wait li{padding-inline:16px;grid-template-columns:minmax(0,1fr)}
  .ax-name-code{grid-template-columns:minmax(0,1fr)}
}
