/* Client MIS screen. Token colours only, so Ink and Plum both work. Ported from the v4 mis-client.css. */
.sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; }
.mis-screen { min-width: 0; display: grid; gap: 14px; align-content: start; }
.mis-screen .ph1 { margin-bottom: 0; }
.err { display: inline-flex; align-items: center; gap: 6px; color: var(--red); font-size: 13px; font-weight: 700; }
.err .ic { width: 15px; height: 15px; }

.mis-bar { padding: 10px 14px; }
.mis-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.mis-sel select { height: 34px; padding: 0 10px; border: 1px solid var(--ctl); border-radius: 8px; background: var(--paper); font-weight: 700; font-size: 13.5px; max-width: 100%; }
.mis-sel select:focus-visible, .seg button:focus-visible, .mbadge:focus-visible, .btn:focus-visible { outline: none; box-shadow: var(--focus); }

.mis-card { overflow: hidden; }
.mis-card.stale { opacity: .6; transition: opacity .15s; }
.mis-tw { overflow-x: auto; max-width: 100%; }
table.mis th .sub { display: block; font-weight: 600; font-size: 12px; color: var(--ink-3); margin-top: -2px; }
table.mis th .sub { white-space: normal; max-width: 150px; margin-left: auto; line-height: 1.25; }
table.mis th .ptag { color: var(--amber); }
.pl.mis td:first-child { min-width: 280px; }
.pl.mis td.r { min-width: 84px; }
.pl.mis td, .pl.mis th { padding-left: 12px; padding-right: 12px; }
.pl.mis td.r { font-weight: 700; }
.pl.mis td .sub { display: block; font-size: 12.5px; color: var(--ink-3); font-weight: 500; }
.pl.mis td .sub.ref { display: inline; margin-left: 8px; font-size: 11.5px; color: var(--ink-3); }
.pl tr.secr > td { padding: 9px 18px 7px; background: var(--canvas); font-size: 12.5px; font-weight: 800; color: var(--ink-2); letter-spacing: .01em; border-bottom: 1px solid var(--line); position: static; }
.pl tr.secr > td .ic { width: 15px; height: 15px; margin-right: 6px; color: var(--ink-3); }
.pl tr.secr.click { cursor: pointer; }
.pl tr.secr > td:first-child { position: sticky; left: 0; z-index: 1; }
.pl tr.lvl0 > td { font-weight: 800; }
.pl tr.lvl1 > td:first-child { padding-left: 30px; }
.pl tr.lvl2 > td:first-child { padding-left: 46px; color: var(--ink-2); }
.pl tr.lvl2 > td, .pl tr.sg > td { font-size: 13.5px; }
.pl tr.pctrow > td { font-size: 13px; color: var(--ink-3); font-weight: 600; }
.pl tr.memo > td { font-style: italic; color: var(--ink-3); }
.pl tr.sg > td, .pl tr.sg > td:first-child { background: var(--subtle); }
.pl tr.nm > td, .pl tr.nm > td:first-child, .pl tr.pt > td, .pl tr.pt > td:first-child { background: var(--tint); font-size: 15px; border-top: 2px solid var(--brand); border-bottom: 1px solid var(--tint-2); }
.pl tr.eb > td, .pl tr.eb > td:first-child { background: var(--teal-t); font-size: 15px; border-top: 2px solid var(--teal); border-bottom: 1px solid var(--line); }
.pl tr.tot > td { font-weight: 800; border-top: 1px solid var(--line-2); background: var(--paper); }
.pl tr.click { cursor: pointer; }
.pl tr.click:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--brand); }
.pl tr.grp.bridge-h > td { font-weight: 700; font-size: 13.5px; color: var(--ink-2); }
.pl tr.grp.bridge-h > td:first-child .ic { width: 15px; height: 15px; color: var(--ink-3); margin-right: 6px; transition: transform .15s; }
.pl tr.grp.bridge-h[aria-expanded="true"] > td:first-child .ic { transform: rotate(90deg); }
.pl tr.bridge > td:first-child { padding-left: 46px; color: var(--ink-2); }
.pl tr.bridge.bad > td { color: var(--red); font-weight: 800; }
.pl tr.calloutrow > td { padding: 10px 18px; background: var(--paper); white-space: normal; position: static; }
.pl tr.calloutrow > td:first-child { position: static; min-width: 0; }
.pl tr.note-row > td { background: var(--canvas); font-size: 13px; white-space: normal; padding: 8px 18px; }
.pl tr.note-row > td:first-child { position: static; min-width: 0; }
.pl .mg { font-size: 12.5px; color: var(--ink-3); font-weight: 650; }
.callout .kind { margin-bottom: 4px; }
.callout .fl { margin: 2px 0 0; }
.callout .why { color: var(--ink-2); }

.mchip { display: inline-flex; align-items: center; gap: 5px; margin-left: 8px; padding: 1px 7px; border-radius: 5px; background: var(--amber-t); color: var(--amber); font-size: 12px; font-weight: 800; vertical-align: 1px; }
.mchip.bad { background: var(--red-t); color: var(--red); }
.mchip.oneoff { background: var(--tint); color: var(--brand-2); }
.mbadge { display: inline-flex; align-items: center; gap: 4px; height: 20px; margin-left: 8px; padding: 0 6px; border: 1px solid var(--warn-bd); border-radius: 6px; background: var(--amber-t); color: var(--amber); font-size: 12px; font-weight: 800; vertical-align: 1px; }
.mbadge .ic { width: 12px; height: 12px; }
.mbadge.wb { background: var(--teal-t); border-color: var(--teal); color: var(--teal); }
.mbadge:hover { background: var(--sunk); }
.sm-link { margin-left: 10px; font-size: 12.5px; }

.lease-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px 14px; align-items: end; }
.lease-act { display: flex; gap: 8px; }
.lease-form .err { grid-column: 1 / -1; }
.fx-rate .fx-line { margin: 4px 0 8px; display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; }
.fx-rate .callout { margin: 6px 0; }
.fx-rate.blocking h4 { color: var(--red); }

.mis-leg { padding: 12px 18px 14px; border-top: 1px solid var(--line); color: var(--ink-3); font-size: 13px; }
.mis-leg p { margin: 2px 0; }
.mis-leg .ic { width: 14px; height: 14px; color: var(--amber); }

.ctl-panel .ctl-group h4 { margin: 14px 0 8px; font-size: 13.5px; font-weight: 800; }
.ctl-panel .ctl-group:first-child h4 { margin-top: 0; }
.ctl-panel ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ctl-panel .callout { padding: 9px 12px; }
.unm { margin-top: 16px; }
.unm h4 { margin: 0 0 8px; font-size: 14px; font-weight: 800; color: var(--red); }

.bd-item { padding: 12px 0; border-top: 1px solid var(--line); display: grid; gap: 6px; }
.bd-item:first-child { border-top: 0; }
.bd-top { display: flex; align-items: center; gap: 10px; justify-content: space-between; }

.mis-skel .skel { height: 18px; margin: 14px 0; border-radius: 6px; background: linear-gradient(90deg, var(--sunk), var(--hover), var(--sunk)); background-size: 200% 100%; animation: misshim 1.2s linear infinite; }
@keyframes misshim { to { background-position: -200% 0; } }
.stt { text-align: center; padding: 36px 20px; color: var(--ink-3); background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); }
.stt b { display: block; color: var(--ink); font-size: 15px; margin: 6px 0 4px; }

@media (max-width: 640px) {
  .pl.mis td:first-child { min-width: 150px; max-width: 170px; white-space: normal; padding-left: 12px; }
  .pl.mis td:first-child, .pl.mis th:first-child { min-width: 150px; }
  .pl.mis tr.lvl1 > td:first-child { padding-left: 18px; } .pl.mis tr.lvl2 > td:first-child { padding-left: 26px; }
  .pl tr.secr > td { white-space: normal; }
  .pl tr.secr > td:first-child { max-width: calc(100vw - 32px); }
  .mis-ctl { gap: 8px; }
  .mis-ctl .seg { max-width: 100%; overflow-x: auto; }
}