/* v587 — width (Amanda, 25 Sep 2026): a readable centred column on desktop and tablet; on phones every section is
   an edge-to-edge white band with a 16 px inner margin and a hairline between sections (like an iOS list).
   Scoped to the page views (…view > .card), so pop-ups and dialogs keep their own shape. Loaded last. */
/* v748 (Leadership, 28 Sep 2026): fuller width on desktop, 1120 px; phones unchanged */
.wrap{max-width:1120px}
body:has(#gate:not(.hidden)) .wrap{max-width:520px}
@media (max-width:640px){
  .desk-in{padding-left:0!important;padding-right:0!important}
  .wrap{padding-left:16px;padding-right:16px;box-sizing:border-box}
  .wrap>[id$="view"]>.card{margin:0 -16px 8px;border-radius:0;padding:16px;box-shadow:none;border-left:0;border-right:0}
}

/* v588 — calm records (Amanda, 25 Sep 2026). Visual only; every word, control and confirmation is unchanged.
   Notices (.err/.ok/.warn/.info) keep their look: they carry safety meaning. */
/* one continuous surface per applicant record: sections divided by hairlines, not separate floating cards */
#wf-detail>.card{margin:0;border-radius:0;border-top:1px solid #EEF1F6}
#wf-detail>.card:first-child{border-top:0;border-top-left-radius:22px;border-top-right-radius:22px;margin-top:14px}
#wf-detail>.card:last-child{border-bottom-left-radius:22px;border-bottom-right-radius:22px;margin-bottom:14px}
/* a card inside a card is a section, not another box */
.card .card:not(.err):not(.ok):not(.warn):not(.info){background:none;border:0;border-top:1px solid #EEF1F6;border-radius:0;box-shadow:none;padding:16px 0;margin:0}
/* secondary buttons are quiet; the navy primary stays the one strong action */
button.ghost,.ghost{background:transparent;border:0;color:#0B1A2B;box-shadow:none}
button.ghost:hover,.ghost:hover{background:#E9EEF7}
/* small labels: quieter */
.eyebrow{color:#5E6878;font-weight:400;letter-spacing:.06em}
h2{font-weight:400}h3{font-weight:500}
@media (max-width:640px){
  #wf-detail>.card{margin-left:-16px;margin-right:-16px;padding:16px}
  #wf-detail>.card:first-child,#wf-detail>.card:last-child{border-radius:0}
}
/* the record takes focus when it opens (for screen readers); the outline shows for keyboard users only */
#wf-detail:focus:not(:focus-visible){outline:none}

/* v589 — Replacements & refunds panel and record lists (visual only) */
.case-box{background:#fff;box-shadow:0 20px 60px rgba(11,26,43,.18)}
.case-head{border-bottom:1px solid #EEF1F6}
.case-body .card{background:none;border:0;border-top:1px solid #EEF1F6;border-radius:0;box-shadow:none;padding:16px 0;margin:0}
/* lists look like lists: rows with a hairline, not bordered buttons */
.case-row,.case-pick,#wf-rows>button,button[data-wf-id]{background:none!important;border:0!important;border-top:1px solid #EEF1F6!important;border-radius:0!important;box-shadow:none!important;margin:0!important;padding:14px 4px!important}
.case-row:hover,.case-pick:hover,#wf-rows>button:hover,button[data-wf-id]:hover{background:#E9EEF7!important}
.case-row:first-of-type,.case-pick:first-of-type{border-top:0!important}
@media (max-width:640px){
  .case-panel{padding:0}
  .case-box{border-radius:0;min-height:100%;box-shadow:none}
  .case-head{border-radius:0}
}
/* inbox: the selected mailbox and filter are softly marked (pale blue), not navy; one surface for mailboxes and list */
.inbox-box[aria-pressed="true"],#inbox-toolbar [aria-pressed="true"]{background:#E9EEF7!important;color:#0B1A2B!important}
#inboxview>.card:first-child>.eyebrow{display:none}
#inboxview>.card:first-child{margin-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0;padding-bottom:8px}
#inboxview>#inbox-list-card{margin-top:0;border-top:1px solid #EEF1F6;border-top-left-radius:0;border-top-right-radius:0}

/* v590 — header on every screen (visual only): navigation reads as simple text; only the active item is softly
   marked (pale blue, no shadow); quick actions are quiet text buttons; the department picker reads as a title. */
#desk-toolbar .desk-tab{background:transparent!important;box-shadow:none!important;border:0!important;color:#5E6878!important}
#desk-toolbar .desk-tab[aria-pressed="true"]{background:#E9EEF7!important;color:#0B1A2B!important}
#desk-toolbar .desk-action{background:transparent!important;box-shadow:none!important;border:0!important;color:#0B1A2B!important}
#desk-toolbar .desk-action:hover,#desk-toolbar .desk-tab:hover{background:#E9EEF7!important}
#tabs .department-menu button[aria-current="page"]{box-shadow:none!important;background:#E9EEF7!important}
#department-switch{background-color:transparent!important;border:0!important;font-size:17px!important;font-weight:400!important;padding-left:0!important}
#tabs #desk-actions button,#desk-actions button{background:transparent!important;color:#0B1A2B!important}
#tabs #desk-actions button:hover,#desk-actions button:hover{background:#E9EEF7!important}

/* v591 — contract, funds and family records (visual only; every action, wording and confirmation unchanged) */
/* contract: the next real step is the one navy action: Approve while approval is pending, otherwise Send for signature */
#ct-record #ct-approve:not(.hidden),#ct-record #ct-approve.hidden~#ct-send2:not(.hidden){background:#0B1A2B!important;color:#fff!important}
/* cancelling a contract reads as a quiet stop action (its confirmation is unchanged) */
#ct-record #ct-cancel{color:#B42318!important}
/* view filters everywhere (funds, payments, lists): the selected one is softly marked, not navy */
button[data-view][aria-pressed="true"]{background:#E9EEF7!important;color:#0B1A2B!important}

/* v592 — the department's steps read as one quiet line of text (they only show on the department's own screens) */
#tabs .department-menu{gap:2px!important}
#tabs .department-menu button{font-size:13px!important;min-height:0!important;padding:6px 10px!important;border-radius:8px!important;color:#5E6878!important}
#tabs .department-menu button[aria-current="page"]{color:#0B1A2B!important}
#tabs .department-menu .department-step-number{display:none}