/* bd-trips.css — the styles of the BD Trips page.
   Moved out of index.html on 2026-10-05 (sustained-load programme Wave 4) and linked from the
   SAME position its <style> block held, so the cascade order is unchanged. index.html is fetched
   fresh on every navigation; a file can come back as 304 Not Modified. Edit it here. */
#page-bt{
  --mn-text:#323338;--mn-text-2:#676879;--mn-text-3:#9699a6;--mn-placeholder:#c5c7d0;
  --mn-line:#e6e9ef;--mn-line-2:#d0d4e4;
  --mn-surface:#fff;--mn-hover:#f5f6f8;--mn-shell:#f6f7fb;
  --mn-primary:#0073ea;--mn-primary-h:#0060b9;--mn-link:#1f76c2;--mn-selected:#cce5ff;
  --mn-green:#00c875;--mn-orange:#fdab3d;--mn-red:#e2445c;--mn-grey:#c4c4c4;
  --mn-row-h:30px;--mn-cell-fs:12.5px;--mn-av:24px;
  font-family:Figtree,-apple-system,'Segoe UI',system-ui,Roboto,sans-serif;
  color:var(--mn-text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;
}
#page-bt *{box-sizing:border-box}
#page-bt button{font-family:inherit;cursor:pointer}

/* Escape the portal's floating-white-card frame so the board can breathe,
   exactly as #page-mt does. */
#tab-staff-portal #page-bt{max-width:none;width:100%;margin:0;border-radius:0;box-shadow:none;
  background:var(--mn-shell);padding:0 0 40px;overflow:visible;color:var(--mn-text)}
#tab-staff-portal:has(#page-bt.active){background:#f6f7fb}

/* ── Specificity overrides ────────────────────────────────────────────────
   #tab-staff-portal's generic element rules carry an ID (1,0,1) and so outrank
   any class-only rule here. These restate the board's own values at higher
   specificity; without them the grid inherits the portal's navy uppercase
   header, zebra striping and 10px cell padding. Same problem, and same fix, as
   the .mnb-board block further up this file. */
#tab-staff-portal #page-bt .bt-tbl{width:100%;min-width:940px;border-collapse:separate;border-spacing:0;
  table-layout:fixed;background:var(--mn-surface);font-size:var(--mn-cell-fs)}
#tab-staff-portal #page-bt .bt-tbl thead th{height:30px;padding:0 8px;text-align:left;background:var(--mn-surface);
  color:var(--mn-text-2);font-size:12.5px;font-weight:400;text-transform:none;letter-spacing:normal;
  border-bottom:1px solid var(--mn-line);border-right:1px solid var(--mn-line);white-space:nowrap;cursor:default}
#tab-staff-portal #page-bt .bt-tbl thead th.bt-c-bar{padding:0;width:6px;border-right:none}
#tab-staff-portal #page-bt .bt-tbl td{height:var(--mn-row-h);padding:0 8px;vertical-align:middle;line-height:normal;
  color:var(--mn-text);border-bottom:1px solid var(--mn-line);border-right:1px solid var(--mn-line);
  overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#tab-staff-portal #page-bt .bt-tbl tbody tr{border-bottom:none;background:transparent}
#tab-staff-portal #page-bt .bt-tbl tbody tr:nth-child(even){background:transparent}
#tab-staff-portal #page-bt .bt-tbl tbody tr:hover td{background:var(--mn-hover)}
#tab-staff-portal #page-bt .bt-tbl tbody tr:focus-visible{outline:2px solid var(--mn-primary);outline-offset:-2px}
#page-bt .bt-tbl td.bt-c-bar{padding:0;border-right:none;background:var(--bt-group,#0086c0)}
#page-bt .bt-tbl td.bt-c-id{color:var(--mn-text-2);font-weight:500;font-variant-numeric:tabular-nums}
#page-bt .bt-tbl td.bt-c-name{font-weight:600}
#page-bt .bt-tbl td.bt-num{text-align:right;font-variant-numeric:tabular-nums}
#page-bt .bt-tbl td.bt-mid{text-align:center}
#page-bt .bt-tbl-wrap{overflow-x:auto;background:var(--mn-surface);border-radius:0 0 6px 6px}

/* ── Head bar ─────────────────────────────────────────────────────────────── */
#page-bt .bt-head{background:var(--mn-surface);margin:12px 16px 0;padding:14px 18px 0;
  border:1px solid var(--mn-line);border-bottom:none;border-radius:10px 10px 0 0;
  box-shadow:0 1px 2px rgba(50,51,56,.05)}
#page-bt .bt-head-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap}
#page-bt .bt-title{font-size:22px;font-weight:700;letter-spacing:-.2px;line-height:1.15;margin:0;color:var(--mn-text)}
#page-bt .bt-eyebrow{font-size:12px;color:var(--mn-text-2);margin-top:3px;font-weight:500}
#page-bt .bt-live{font-size:11.5px;font-weight:500;color:var(--mn-text-2);white-space:nowrap;padding-top:5px;min-height:17px}
#page-bt .bt-live:not(:empty)::before{content:'\25C9';font-size:8px;margin-right:5px;color:var(--mn-placeholder)}
#page-bt .bt-live.saving::before{color:var(--mn-orange)}
#page-bt .bt-live.saved::before{color:var(--mn-green)}
#page-bt .bt-live.error::before{color:var(--mn-red)}
#page-bt .bt-views{display:flex;gap:16px;margin-top:13px;flex-wrap:wrap}
#page-bt .bt-view{border:none;background:transparent;padding:0 0 9px;font-size:13px;font-weight:400;
  color:var(--mn-text-2);border-bottom:2px solid transparent;margin-bottom:-1px}
#page-bt .bt-view:hover{color:var(--mn-text)}
#page-bt .bt-view.on{font-weight:600;color:var(--mn-text);border-bottom-color:var(--mn-primary)}
#page-bt .bt-view:focus-visible{outline:2px solid var(--mn-primary);outline-offset:2px;border-radius:3px}

/* ── Toolbar ──────────────────────────────────────────────────────────────── */
#page-bt .bt-tools{background:var(--mn-surface);margin:0 16px;padding:9px 18px;
  border:1px solid var(--mn-line);border-top:none;border-radius:0 0 10px 10px;
  box-shadow:0 1px 2px rgba(50,51,56,.05);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#page-bt .bt-new{height:30px;border:none;border-radius:4px;background:var(--mn-primary);color:#fff;
  font-size:13px;font-weight:600;padding:0 14px}
#page-bt .bt-new:hover{background:var(--mn-primary-h)}
#page-bt .bt-search{height:30px;border:1px solid var(--mn-line-2);border-radius:5px;background:#fff;
  font-size:12.5px;color:var(--mn-text);padding:0 10px;width:200px;font-family:inherit}
#page-bt .bt-search::placeholder{color:var(--mn-placeholder)}
#page-bt .bt-sel{height:30px;border:1px solid var(--mn-line-2);border-radius:5px;background:#fff;
  font-size:12.5px;font-weight:500;color:var(--mn-text);padding:0 26px 0 10px;font-family:inherit;
  -webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath fill='%23676879' d='M0 0l4 5 4-5z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 9px center}
#page-bt .bt-tb{height:30px;border:1px solid transparent;border-radius:5px;background:transparent;
  font-size:12.5px;color:var(--mn-text-2);padding:0 10px}
#page-bt .bt-tb:hover{background:var(--mn-hover);color:var(--mn-text)}
#page-bt .bt-spacer{flex:1}
#page-bt .bt-search:focus,#page-bt .bt-sel:focus{outline:none;border-color:var(--mn-primary);
  box-shadow:0 0 0 3px rgba(0,115,234,.13)}

/* ── KPI tiles ────────────────────────────────────────────────────────────── */
#page-bt .bt-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 16px 0}
#page-bt .bt-kpi{background:var(--mn-surface);border:1px solid var(--mn-line);border-radius:10px;
  padding:13px 16px;position:relative;overflow:hidden;box-shadow:0 1px 2px rgba(50,51,56,.05)}
#page-bt .bt-kpi-band{height:3px;position:absolute;top:0;left:0;right:0;background:var(--mn-line)}
#page-bt .bt-kpi-n{font-size:10.5px;font-weight:600;color:var(--mn-text-3);text-transform:uppercase;
  letter-spacing:.065em;margin-bottom:7px}
#page-bt .bt-kpi-v{font-size:30px;font-weight:700;letter-spacing:-.05em;line-height:1;margin-bottom:4px;
  font-variant-numeric:tabular-nums;color:var(--mn-text)}
#page-bt .bt-kpi-d{font-size:11px;color:var(--mn-text-3)}
#page-bt .k-warn .bt-kpi-band{background:var(--mn-orange)}#page-bt .k-warn .bt-kpi-v{color:#b26b00}
#page-bt .k-brand .bt-kpi-band{background:var(--mn-primary)}#page-bt .k-brand .bt-kpi-v{color:var(--mn-primary)}
#page-bt .k-crit .bt-kpi-band{background:var(--mn-red)}#page-bt .k-crit .bt-kpi-v{color:var(--mn-red)}
#page-bt .k-ok .bt-kpi-band{background:var(--mn-green)}#page-bt .k-ok .bt-kpi-v{color:#0a8f57}

/* ── Board groups ─────────────────────────────────────────────────────────── */
#page-bt .bt-board{margin:16px 16px 0}
#page-bt .bt-group{margin-bottom:22px}
#page-bt .bt-group-hd{display:flex;align-items:center;gap:8px;padding:0 0 6px 2px;flex-wrap:wrap}
#page-bt .bt-group-name{font-size:14px;font-weight:700;letter-spacing:-.1px}
#page-bt .bt-group-count{font-size:12.5px;color:var(--mn-text-3);font-weight:500}
#page-bt .bt-people{display:flex;align-items:center}
#page-bt .bt-av{width:var(--mn-av);height:var(--mn-av);border-radius:50%;display:inline-flex;
  align-items:center;justify-content:center;font-size:11px;font-weight:500;letter-spacing:.2px;color:#fff;
  border:2px solid var(--mn-surface);flex:none}
#page-bt .bt-av-sm{width:18px;height:18px;font-size:8.5px;border-width:1.5px}
#page-bt td.bt-st{padding:0;border-right:1px solid var(--mn-line)}
#page-bt .bt-st-btn{display:flex;align-items:center;justify-content:center;width:100%;height:var(--mn-row-h);
  font-size:12.5px;font-weight:500;color:#fff;padding:0 6px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
/* Admins set a trip status straight from the board. Full-bleed and coloured
   like the pill it replaces, so the column still scans as a status column
   rather than as a row of form controls. */
#page-bt .bt-st-sel{width:100%;height:var(--mn-row-h);border:none;font-family:inherit;
  font-size:12.5px;font-weight:500;color:#fff;padding:0 20px 0 8px;cursor:pointer;
  -webkit-appearance:none;appearance:none;text-overflow:ellipsis;
  background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%278%27 height=%275%27%3E%3Cpath fill=%27%23ffffff%27 fill-opacity=%27.8%27 d=%27M0 0l4 5 4-5z%27/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 6px center}
#page-bt .bt-st-sel:hover{filter:brightness(1.06)}
#page-bt .bt-st-sel:focus-visible{outline:2px solid var(--mn-text);outline-offset:-2px}
#page-bt .bt-st-sel option{background:#fff;color:var(--mn-text);font-weight:500}
#page-bt .bt-linkish{border:none;background:transparent;color:var(--mn-link);font-size:inherit;
  font-variant-numeric:tabular-nums;padding:0;text-decoration:underline}

/* ── States ───────────────────────────────────────────────────────────────── */
#page-bt .bt-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:52px 24px;gap:7px;background:var(--mn-surface);border:1px solid var(--mn-line);border-radius:8px}
#page-bt .bt-state-i{font-size:30px;opacity:.7}
#page-bt .bt-state-t{font-size:15px;font-weight:700}
#page-bt .bt-state-d{font-size:12.5px;color:var(--mn-text-2);max-width:56ch;line-height:1.55}
#page-bt .bt-state-a{margin-top:10px}
#page-bt .bt-skel{height:11px;border-radius:3px;margin-bottom:9px;
  background:linear-gradient(90deg,#f5f6f8 25%,#e6e9ef 37%,#f5f6f8 63%);background-size:400% 100%;
  animation:btShim 1.4s ease-in-out infinite}
@keyframes btShim{0%{background-position:100% 50%}100%{background-position:0 50%}}
@media(prefers-reduced-motion:reduce){#page-bt .bt-skel{animation:none}}
#page-bt .bt-hint{margin:14px 16px 0;background:#eaf4ff;border:1px solid #bcdcff;border-radius:8px;
  padding:11px 15px;font-size:12.5px;color:#0b4a8f;line-height:1.55;display:flex;gap:9px;align-items:flex-start}
#page-bt .bt-muted{color:var(--mn-text-3)}

/* ── Form kit ─────────────────────────────────────────────────────────────── */
#page-bt .bt-form-wrap{padding:24px 16px 46px;display:flex;justify-content:center}
#page-bt .bt-form{width:100%;max-width:680px;background:var(--mn-surface);border:1px solid var(--mn-line);
  border-radius:10px;box-shadow:0 1px 2px rgba(50,51,56,.05);overflow:hidden}
#page-bt .bt-form-hd{padding:20px 26px 17px;border-bottom:1px solid var(--mn-line)}
#page-bt .bt-form-hd h3{margin:0;font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--mn-text)}
#page-bt .bt-form-hd p{margin:5px 0 0;font-size:12.5px;color:var(--mn-text-2);line-height:1.55}
#page-bt .bt-fs{padding:20px 26px 4px;border-bottom:1px solid var(--mn-line)}
#page-bt .bt-fs-t{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--mn-text-3);margin-bottom:14px}
#page-bt .bt-fld{display:flex;flex-direction:column;gap:6px;margin-bottom:17px}
#page-bt .bt-fld-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
#page-bt .bt-fld label{font-size:12.5px;font-weight:600;color:var(--mn-text-2)}
#page-bt .bt-rq{color:var(--mn-red);margin-left:2px}
#page-bt .bt-hint-x,#page-bt .bt-hint2,#page-bt .bt-fld .bt-hint{font-size:11.5px;color:var(--mn-text-3);
  font-weight:400;background:none;border:none;padding:0;margin:0;display:inline}
#page-bt .bt-inp{height:38px;border:1px solid var(--mn-line-2);border-radius:5px;background:#fff;
  font-size:13.5px;color:var(--mn-text);padding:0 11px;font-family:inherit;width:100%}
#page-bt .bt-inp::placeholder{color:var(--mn-placeholder)}
#page-bt .bt-inp:focus,#page-bt .bt-ta:focus,#page-bt .bt-inp-mini:focus{outline:none;
  border-color:var(--mn-primary);box-shadow:0 0 0 3px rgba(0,115,234,.13)}
#page-bt .bt-inp:disabled{background:var(--mn-hover);color:var(--mn-text-3)}
#page-bt .bt-sel-wrap{position:relative;display:flex}
#page-bt .bt-sel-wrap::after{content:'\25BC';font-size:9px;color:var(--mn-text-2);position:absolute;
  right:11px;top:50%;transform:translateY(-50%);pointer-events:none}
#page-bt select.bt-inp{-webkit-appearance:none;appearance:none;padding-right:28px;font-weight:500}
/* resize:none + overflow:hidden because height is now driven by bd-trips.js'
   wireAutoGrow() — a box that grows to fit what was typed has nothing left for
   a manual drag handle or an inner scrollbar to do. */
#page-bt .bt-ta{border:1px solid var(--mn-line-2);border-radius:5px;background:#fff;font-size:13px;
  color:var(--mn-text);padding:9px 11px;font-family:inherit;width:100%;min-height:66px;resize:none;
  overflow:hidden;line-height:1.5}
/* Guidance under a field. The existing .bt-hint is display:inline for the
   "optional" tag that sits inside a label, so it cannot carry a paragraph. */
#page-bt .bt-fld-help{font-size:11.5px;color:var(--mn-text-3);margin:-1px 0 0;line-height:1.5}
/* The business case in the trip drawer. Given its own panel rather than a
   definition-list row: it is prose, often several paragraphs, and the thing an
   approver is actually deciding on. */
#page-bt .bt-case{margin-top:13px;padding:11px 13px;background:var(--mn-hover);
  border-left:3px solid var(--mn-blue,#0073ea);border-radius:4px}
#page-bt .bt-case-t{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--mn-text-3);margin-bottom:5px}
#page-bt .bt-case-b{font-size:13px;color:var(--mn-text);line-height:1.6;white-space:normal}
/* Clipped to a seven-line preview. A business case runs to several paragraphs,
   and left whole it pushes the approval, recap and contact log off the panel.
   Seven rather than four or five because the blank line between paragraphs is
   itself a clamped line: a tighter preview spends half its height on the gap
   and shows two sentences. The toggle is revealed by measuring the rendered
   text (renderDrawer), never by counting characters — the same length wraps to
   a different number of lines depending on where the breaks fall. */
#page-bt .bt-case.clip .bt-case-b{display:-webkit-box;-webkit-box-orient:vertical;
  -webkit-line-clamp:7;line-clamp:7;overflow:hidden}
#page-bt .bt-case-more{display:none;margin:8px 0 0;padding:0;border:0;background:none;
  font:inherit;font-size:12px;font-weight:600;color:var(--mn-primary);cursor:pointer}
#page-bt .bt-case-more.on{display:inline-block}
#page-bt .bt-case-more:hover{text-decoration:underline}
#page-bt .bt-lockchip{display:flex;align-items:center;gap:9px;height:38px;padding:0 12px;
  border:1px solid var(--mn-line);border-radius:5px;background:var(--mn-hover)}
#page-bt .bt-lockchip-n{font-size:13.5px;font-weight:600}
#page-bt .bt-lockchip-w{margin-left:auto;font-size:11px;color:var(--mn-text-3)}
#page-bt .bt-form-ft{background:var(--mn-hover);border-top:1px solid var(--mn-line);padding:16px 26px 20px}
#page-bt .bt-summary{font-size:12.5px;color:var(--mn-text-2);margin-bottom:13px;line-height:1.6}
#page-bt .bt-summary b{color:var(--mn-text);font-weight:600}
#page-bt .bt-summary-bad{color:var(--mn-red);font-weight:600}
#page-bt .bt-submit{width:100%;height:42px;border:none;border-radius:5px;background:var(--mn-primary);
  color:#fff;font-size:14px;font-weight:600}
#page-bt .bt-submit:hover:not(:disabled){background:var(--mn-primary-h)}
#page-bt .bt-submit:disabled{background:#c3c6d4;cursor:not-allowed}
#page-bt .bt-note{font-size:11.5px;color:var(--mn-text-3);text-align:center;margin:10px 0 0;line-height:1.5}
#page-bt .bt-radio-row{display:flex;gap:7px;height:38px;align-items:center}
#page-bt .bt-radio{flex:1;height:38px;border:1.5px solid var(--mn-line-2);border-radius:5px;background:#fff;
  font-size:13px;font-weight:600;color:var(--mn-text-2)}
#page-bt .bt-radio.on{border-color:var(--mn-primary);background:#eaf4ff;color:var(--mn-primary)}
#page-bt .bt-radio:disabled{opacity:.55;cursor:not-allowed}
#page-bt .bt-btn-primary{height:36px;border:none;border-radius:5px;background:var(--mn-primary);color:#fff;
  font-size:13px;font-weight:600;padding:0 17px}
#page-bt .bt-btn-primary:hover{background:var(--mn-primary-h)}
#page-bt .bt-btn-quiet{height:36px;border:1px solid var(--mn-line-2);border-radius:5px;background:#fff;
  color:var(--mn-text-2);font-size:13px;font-weight:600;padding:0 15px}
#page-bt .bt-inp-mini{height:26px;border:1px solid var(--mn-line-2);border-radius:4px;background:#fff;
  font-size:12px;padding:0 8px;font-family:inherit;width:100%;text-align:right;font-variant-numeric:tabular-nums}
#page-bt .bt-inline-acts{display:flex;gap:6px;justify-content:center}
#page-bt .bt-mini{height:22px;border-radius:4px;border:1px solid var(--mn-line-2);background:#fff;
  font-size:11px;font-weight:600;padding:0 9px;color:var(--mn-text-2)}
#page-bt .bt-mini.ok{background:var(--mn-green);border-color:var(--mn-green);color:#fff}
#page-bt .bt-mini.no:hover{border-color:var(--mn-red);color:var(--mn-red)}
#page-bt .bt-btn-ok{height:32px;border:none;border-radius:4px;background:var(--mn-green);color:#fff;
  font-size:12.5px;font-weight:600;padding:0 15px}
#page-bt .bt-btn-no{height:32px;border:1px solid var(--mn-line-2);border-radius:4px;background:#fff;
  color:var(--mn-red);font-size:12.5px;font-weight:600;padding:0 15px}

/* ── Drawer ───────────────────────────────────────────────────────────────── */
/* Fixed, not absolute: the portal page can be taller than the viewport, and an
   absolute drawer would scroll away from the reader. z-index sits above the
   portal's own modals (1000) and below the Claude panel (100000). */
#page-bt .bt-scrim{position:fixed;inset:0;z-index:9000;background:rgba(50,51,56,.45)}
#page-bt .bt-drawer{position:fixed;top:0;right:0;bottom:0;z-index:9001;width:min(760px,94vw);
  background:var(--mn-surface);box-shadow:-14px 0 44px rgba(50,51,56,.24);display:flex;flex-direction:column;
  animation:btSlideIn .22s ease-out}
@keyframes btSlideIn{from{transform:translateX(102%)}to{transform:none}}
@media(prefers-reduced-motion:reduce){#page-bt .bt-drawer{animation:none}}
#page-bt .bt-drawer:focus{outline:none}
#page-bt .bt-dw-hd{padding:17px 20px 15px;border-bottom:1px solid var(--mn-line);flex:none}
#page-bt .bt-dw-top{display:flex;align-items:flex-start;gap:12px}
#page-bt .bt-dw-eyebrow{font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--mn-text-3);
  font-variant-numeric:tabular-nums}
#page-bt .bt-dw-title{font-size:18px;font-weight:700;letter-spacing:-.02em;margin:3px 0 0;line-height:1.25}
#page-bt .bt-dw-x{margin-left:auto;border:none;background:transparent;color:var(--mn-text-2);font-size:17px;
  width:28px;height:28px;border-radius:4px;flex:none;line-height:1}
#page-bt .bt-dw-x:hover{background:var(--mn-hover);color:var(--mn-text)}
#page-bt .bt-dw-chips{display:flex;align-items:center;gap:8px;margin-top:11px;flex-wrap:wrap}
#page-bt .bt-pill{font-size:11.5px;font-weight:600;color:#fff;padding:3px 10px;border-radius:4px;
  display:inline-flex;align-items:center;gap:5px}
#page-bt .bt-pill.ghost{background:var(--mn-hover);color:var(--mn-text-2);border:1px solid var(--mn-line);font-weight:500}
#page-bt .bt-dw-body{flex:1;overflow-y:auto;padding:0 20px 30px}
#page-bt .bt-dw-sec{padding:17px 0;border-bottom:1px solid var(--mn-line)}
#page-bt .bt-dw-sec:last-child{border-bottom:none}
#page-bt .bt-dw-sec-hd{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
#page-bt .bt-dw-sec-t{font-size:13.5px;font-weight:700;letter-spacing:-.01em}
#page-bt .bt-dw-sec-n{font-size:11.5px;color:var(--mn-text-3);font-weight:500;white-space:nowrap}
#page-bt .bt-dw-sec-n.saving{color:#b26b00}
#page-bt .bt-dw-sec-n.saved{color:#0a8f57}
#page-bt .bt-dw-sec-n.error{color:var(--mn-red)}
/* A read-only record renders as a definition list, not disabled inputs —
   greyed-out fields read as broken, a list reads as a document. */
#page-bt .bt-dl{display:grid;grid-template-columns:auto 1fr;gap:9px 18px;font-size:12.5px;margin:0}
#page-bt .bt-dl dt{color:var(--mn-text-3);font-weight:500;white-space:nowrap}
#page-bt .bt-dl dd{margin:0;color:var(--mn-text);font-weight:500}
/* An email's Approve/Deny button landed the reviewer here — ring the decision
   box once so the eye finds it. Static ring, no animation. */
#page-bt .bt-approve.bt-approve-cue{box-shadow:0 0 0 3px rgba(0,115,234,.28)}
#page-bt .bt-approve{background:#fff8ec;border:1px solid #f5dda6;border-radius:7px;padding:13px 15px;
  display:flex;flex-direction:column;gap:11px}
#page-bt .bt-approve.done{background:#eefaf3;border-color:#bfe8d3}
#page-bt .bt-approve.denied{background:var(--mn-hover);border-color:var(--mn-line)}
#page-bt .bt-approve-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12.5px}
#page-bt .bt-approve-row .bt-lb{color:var(--mn-text-2);font-weight:500}
#page-bt .bt-approve-row .bt-inp-mini{width:112px}
#page-bt .bt-approve-acts{display:flex;gap:8px;margin-left:auto}
#page-bt .bt-approve-row.bt-muted{color:var(--mn-text-3)}

/* ── After-action report: draft vs submitted ─────────────────────────
   The panel exists to answer one question before anyone types: has this been
   sent, and who hears about it when it is. The old form answered neither, and
   sent the email on a blur. The "ready" state changes the border only — nothing
   flashes or animates, because a remote save can repaint this block. */
#page-bt .bt-aar-box{margin-top:16px;border:1px solid var(--mn-line-2);border-radius:8px;
  background:var(--mn-hover);padding:14px 16px}
#page-bt .bt-aar-box.ready{border-color:#bfe8d3;background:#f3fbf7}
#page-bt .bt-aar-box.bt-aar-wait{background:#fff8ec;border-color:#f5dda6}
#page-bt .bt-aar-box.bt-aar-draft{background:var(--mn-hover)}
#page-bt .bt-aar-note{font-size:12.5px;color:var(--mn-text-2);line-height:1.6}
#page-bt .bt-aar-note b{color:var(--mn-text)}
#page-bt .bt-aar-check{margin-top:11px;font-size:12.5px}
#page-bt .bt-aar-ok{color:#0a8f57;font-weight:600}
#page-bt .bt-aar-todo{color:var(--mn-text-2);font-weight:600}
#page-bt ul.bt-aar-list{margin:5px 0 0;padding-left:20px;color:var(--mn-text-2);font-size:12.5px;line-height:1.7}
#page-bt .bt-aar-acts{display:flex;justify-content:flex-end;margin-top:13px}
#page-bt .bt-aar-acts .bt-btn-primary:disabled{background:var(--mn-line-2);color:#fff;cursor:not-allowed}
/* The filed strip states the outcome as a fact, above the controls that could
   change it — so "already sent" is read before "send again" is pressed. */
#page-bt .bt-aar-filed{margin-top:16px;display:flex;gap:11px;align-items:flex-start;flex-wrap:wrap;
  background:#eefaf3;border:1px solid #bfe8d3;border-radius:8px;padding:13px 15px}
#page-bt .bt-aar-tick{width:20px;height:20px;border-radius:50%;background:#0a8f57;color:#fff;flex:none;
  font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}
#page-bt .bt-aar-filed-t{flex:1;min-width:190px;font-size:12.5px;line-height:1.6}
#page-bt .bt-aar-filed-t b{display:block;color:var(--mn-text);font-size:13px}
#page-bt .bt-aar-filed-t span{color:var(--mn-text-2)}
#page-bt .bt-aar-doc{display:flex;gap:7px;flex-wrap:wrap;width:100%;margin-left:31px}
#page-bt .bt-aar-doc .bt-mini{height:26px;background:#fff}
#page-bt .bt-aar-doc .bt-mini:hover{border-color:var(--mn-primary);color:var(--mn-primary)}

/* ── Contact log ──────────────────────────────────────────────────────────── */
#page-bt .bt-clog-form{background:var(--mn-hover);border:1px solid var(--mn-line);border-radius:8px;padding:15px 16px 16px}
#page-bt .bt-clog-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
#page-bt .bt-clog-grid .bt-fld{margin-bottom:0}
#page-bt .bt-clog-grid .bt-span{grid-column:1/-1}
#page-bt .bt-clog-acts{display:flex;justify-content:flex-end;gap:9px;margin-top:15px}
#page-bt .bt-clog-list{display:flex;flex-direction:column;gap:6px;margin-top:14px}
#page-bt .bt-clog-empty{font-size:12.5px;color:var(--mn-text-3);padding:14px 2px}
/* Expenses filed on a trip. A plain table rather than the expandable cards the
   contact log uses: an expense is six short facts with nothing to expand into,
   and rows that all line up are what makes a column of amounts readable. */
#page-bt .bt-xp-wrap{margin-top:12px;overflow-x:auto;border:1px solid var(--mn-line);border-radius:6px;background:#fff}
#page-bt table.bt-xp{width:100%;border-collapse:collapse;font-size:12px}
#page-bt table.bt-xp th{text-align:left;font-weight:600;font-size:10.5px;letter-spacing:.4px;text-transform:uppercase;
  color:var(--mn-text-3);padding:8px 10px;border-bottom:1px solid var(--mn-line);white-space:nowrap}
#page-bt table.bt-xp td{padding:8px 10px;border-bottom:1px solid var(--mn-line);color:var(--mn-text);vertical-align:top}
#page-bt table.bt-xp tr:last-child td{border-bottom:none}
#page-bt table.bt-xp .bt-xp-id{font-variant-numeric:tabular-nums;color:var(--mn-text-2);white-space:nowrap}
#page-bt table.bt-xp .bt-xp-amt{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}
#page-bt .bt-clog-item{border:1px solid var(--mn-line);border-radius:6px;background:#fff}
#page-bt .bt-clog-item summary{display:flex;align-items:center;gap:10px;padding:9px 11px;font-size:12.5px;
  cursor:pointer;list-style:none}
#page-bt .bt-clog-item summary::-webkit-details-marker{display:none}
#page-bt .bt-clog-item:hover{background:var(--mn-hover)}
#page-bt .bt-clog-item[open]{background:var(--mn-hover)}
#page-bt .bt-clog-id{font-size:11px;font-weight:700;color:var(--mn-text-3);font-variant-numeric:tabular-nums;flex:none}
#page-bt .bt-clog-who{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#page-bt .bt-clog-who b{font-weight:600}
#page-bt .bt-clog-who span{color:var(--mn-text-2)}
#page-bt .bt-dot{width:8px;height:8px;border-radius:50%;flex:none}
/* Sample data (migration 110) — unmistakable wherever it appears, so a
   fabricated trip is never read as a real one. */
#page-bt .bt-sample{display:inline-block;font-size:9.5px;font-weight:800;letter-spacing:.06em;
  color:#5b3fa8;background:#efe9fd;border:1px solid #d9cdf7;border-radius:3px;padding:0 5px;
  vertical-align:1px;margin-right:5px}
#page-bt .bt-dw-title .bt-sample{font-size:10px;vertical-align:3px}
#page-bt .bt-sample-note{margin-top:11px;font-size:11.5px;line-height:1.55;color:#5b3fa8;
  background:#f7f4fe;border:1px solid #e4dbf9;border-radius:6px;padding:9px 11px}
#page-bt .bt-gov{font-size:10.5px;font-weight:700;color:#6b4d00;background:#fff3d4;border-radius:3px;
  padding:1px 6px;flex:none}
/* Contact status is editable in place — it is the one field that genuinely
   moves after a trip (Open -> Follow-up -> Closed). Styled as a coloured pill
   so it still reads as a status, not as a form control. */
#page-bt .bt-clog-status-sel,#page-bt .bt-clog-status-fixed{flex:none;height:22px;border:none;border-radius:4px;
  font-family:inherit;font-size:11.5px;font-weight:600;padding:0 22px 0 8px;max-width:160px;
  -webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%278%27 height=%275%27%3E%3Cpath fill=%27%23ffffff%27 fill-opacity=%27.75%27 d=%27M0 0l4 5 4-5z%27/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 7px center}
#page-bt .bt-clog-status-fixed{padding-right:8px;background-image:none;display:inline-flex;align-items:center}
#page-bt .bt-clog-status-sel:hover{filter:brightness(1.06)}
#page-bt .bt-clog-status-sel:focus-visible{outline:2px solid var(--mn-text);outline-offset:1px}
#page-bt .bt-clog-status-sel option{background:#fff;color:var(--mn-text);font-weight:500}
/* Opt sample rows into an export on purpose; off by default. */
#page-bt .bt-tb-check{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 9px;
  font-size:12px;color:var(--mn-text-2);border:1px dashed var(--mn-line-2);border-radius:5px;cursor:pointer}
#page-bt .bt-tb-check:hover{background:var(--mn-hover);color:var(--mn-text)}
#page-bt .bt-tb-check input{margin:0;accent-color:var(--mn-primary)}
#page-bt .bt-clog-detail{padding:2px 12px 12px 40px;font-size:12px;color:var(--mn-text-2);line-height:1.6;
  display:flex;flex-direction:column;gap:3px}
#page-bt .bt-clog-status{font-weight:600;color:var(--mn-text)}

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media(max-width:900px){
  #page-bt .bt-kpis{grid-template-columns:repeat(2,1fr)}
  #page-bt .bt-drawer{width:100vw}
  #page-bt .bt-clog-grid{grid-template-columns:1fr}
  #page-bt .bt-fld-2{grid-template-columns:1fr}
}
@media(max-width:600px){
  #page-bt .bt-head,#page-bt .bt-tools{margin-left:8px;margin-right:8px}
  #page-bt .bt-kpis,#page-bt .bt-board{margin-left:8px;margin-right:8px}
  #page-bt .bt-search{width:100%}
  #page-bt .bt-form-wrap{padding:16px 8px 34px}
  #page-bt .bt-fs{padding:18px 16px 4px}
  #page-bt .bt-form-hd,#page-bt .bt-form-ft{padding-left:16px;padding-right:16px}
}