/* Tenant mailbox inventory. Platform plane, dense like Clients, responsive by
   horizontal table scroll. Every value comes from the console token set. */

#view-mailboxes .mbhead{display:flex;flex-wrap:wrap;align-items:flex-end;
  justify-content:space-between;gap:var(--s-3)}
#view-mailboxes .mbhead h2,#view-mailboxes .mbhead p{margin:0}
#view-mailboxes .mbtools{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--s-3);
  font-size:var(--text-sm)}
#view-mailboxes .mbtools label{display:flex;flex-direction:column;gap:var(--s-1)}
#view-mailboxes .mbtools input,#view-mailboxes .mbtools select,#view-mailboxes .mbtools button,
#view-mailboxes .mbactions button,#view-mailboxes .mbdialogactions button,
#view-mailboxes .mbdialogactions a{font:inherit;font-size:var(--text-sm);padding:var(--s-1) var(--s-3);
  border:1px solid var(--btn-border);border-radius:var(--radius);background:var(--btn-bg);
  color:var(--btn-fg)}
#view-mailboxes .mbtools input,#view-mailboxes .mbtools select{background:var(--bg);color:var(--fg);
  border-color:var(--line)}
#view-mailboxes .mbsummary{display:flex;flex-wrap:wrap;gap:var(--s-5);padding:var(--s-3) 0;
  border-bottom:1px solid var(--line);font-size:var(--text-sm)}
#view-mailboxes .mbsummary b{font-size:var(--text-lg);font-variant-numeric:tabular-nums}
#view-mailboxes .mbscroll{overflow-x:auto;max-width:100%}
#view-mailboxes table{min-width:72rem}
#view-mailboxes th,#view-mailboxes td{vertical-align:top}
#view-mailboxes th[scope=row]{text-transform:none;letter-spacing:0;font-size:var(--text-sm)}
#view-mailboxes th[data-mbsort] button{white-space:nowrap}
#view-mailboxes .mbsub,#view-mailboxes .mbactivity span{display:block;color:var(--muted);
  font-size:var(--text-xs)}
#view-mailboxes .mbaddress{max-width:16rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#view-mailboxes .mbactivity{font-variant-numeric:tabular-nums;white-space:nowrap}
#view-mailboxes .mbactions{display:flex;gap:var(--s-1);white-space:nowrap}
#view-mailboxes .mbactions button.danger,#view-mailboxes .mbdialogactions button.danger,
#view-mailboxes #mbconfirm-go.danger{background:var(--btn-danger-bg);color:var(--btn-danger-fg);
  border-color:var(--btn-danger-border)}
#view-mailboxes .mbstate-enabled{color:var(--ok);border-color:currentColor}
#view-mailboxes .mbstate-disabled,#view-mailboxes .mbstate-paused,
#view-mailboxes .mbstate-needs_credential,#view-mailboxes .mbstate-needs_test{
  color:var(--warn);border-color:currentColor;background:var(--warnbg)}
#view-mailboxes .mbstate-attention{color:var(--bad);border-color:currentColor}
#view-mailboxes .mbstate-not_configured,#view-mailboxes .mbstate-unknown{border-style:dashed}

/* Two switches per company (cleanup C10/C11): the sending chip and one reading
   chip per connected mailbox, stacked, each labelled in words so neither is
   carried by colour alone (CON-MBX-007). */
#view-mailboxes .mbstates{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-1)}
#view-mailboxes .mbread-connected{color:var(--ok);border-color:currentColor}
#view-mailboxes .mbread-paused,#view-mailboxes .mbread-awaiting_terms{
  color:var(--warn);border-color:currentColor;background:var(--warnbg)}
#view-mailboxes .mbread-credential_invalid,#view-mailboxes .mbread-warn{
  color:var(--bad);border-color:currentColor}
#view-mailboxes .mbread-none,#view-mailboxes .mbread-unknown{border-style:dashed}
/* Broa's own Sign in with Microsoft secret (TODO #15): one line under the
   summary, toned by the .mbcheck-* rules below, which come after it. */
#view-mailboxes .mbbroaapp{margin:var(--s-2) 0 0;color:var(--muted)}
/* When Broa last looked at each connected mailbox (cleanup C15), under its chip:
   a line of words, toned as well, and the reader's own problem when it has one. */
#view-mailboxes .mbcheck{font-size:var(--text-xs);color:var(--muted)}
#view-mailboxes .mbcheck-ok{color:var(--ok)}
#view-mailboxes .mbcheck-bad,#view-mailboxes .mbcheck-stale{color:var(--bad);font-weight:var(--weight-bold)}
/* A Microsoft 365 secret 90 days or fewer from expiring (owner 2026-09-29): amber,
   then the red above from 7 days and once expired. */
#view-mailboxes .mbcheck-warn{color:var(--warn);font-weight:var(--weight-bold)}
#view-mailboxes .mbcheck-problem{display:block;max-width:22rem;font-size:var(--text-xs);color:var(--bad);
  white-space:normal;overflow-wrap:anywhere}
/* Up to four actions on a row now; they wrap inside the cell rather than
   widening the table without end. */
#view-mailboxes .mbactions{flex-wrap:wrap;white-space:normal}
#view-mailboxes .mbactions button{white-space:nowrap}

#view-mailboxes .mbdialoghead{display:flex;align-items:center;justify-content:space-between;
  gap:var(--s-3);margin:0 0 var(--s-3);padding:0;border:0}
#view-mailboxes .mbdialoghead h3{margin:0}
#view-mailboxes .mbdetails{display:grid;grid-template-columns:minmax(9rem,max-content) 1fr;
  gap:var(--s-1) var(--s-4);margin:0}
#view-mailboxes .mbdetails dt{color:var(--muted);font-size:var(--text-xs);font-weight:var(--weight-bold);
  text-transform:uppercase;letter-spacing:.04em}
#view-mailboxes .mbdetails dd{margin:0;overflow-wrap:anywhere}
#view-mailboxes .mbdialogactions{display:flex;flex-wrap:wrap;justify-content:flex-end;
  gap:var(--s-2);margin-top:var(--s-4)}
#view-mailboxes .mbdialogactions a{text-decoration:none}

@media (max-width:40rem){
  body:has(#view-mailboxes:not([hidden]))>header{flex-wrap:wrap}
  body:has(#view-mailboxes:not([hidden]))>header .who{margin-left:0;max-width:100%;flex-wrap:wrap}
  #view-mailboxes .mbtools,#view-mailboxes .mbtools label,#view-mailboxes .mbtools input,
  #view-mailboxes .mbtools select,#view-mailboxes .mbtools button{width:100%}
  #view-mailboxes .mbsummary{gap:var(--s-3)}
  #view-mailboxes .mbsummary span{flex:1 1 8rem}
  #view-mailboxes .mbdetails{grid-template-columns:1fr;gap:0}
  #view-mailboxes .mbdetails dd{margin-bottom:var(--s-2)}
}
/* ERP connections (TODO #131): the state in words, coloured only as a second cue. */
#view-mailboxes .mberp-ok{color:var(--ok);border-color:currentColor}
#view-mailboxes .mberp-bad{color:var(--bad);border-color:currentColor}
#view-mailboxes .mberp-calm{border-style:dashed}