/* Board and admin extras (spec/30 section 3, extras.css row, and 9.6). Only what the approved files
   hold outside ap.css: their inline <style> block and every style="..." attribute, moved to a class
   because the site's content policy forbids inline styles; plus the few states the approved files do
   not draw. Nothing here restyles a rule ap.css already sets. ap.css itself is never edited. */

/* The approved files' inline <style> block */
body{margin:0}
a{color:#002950}
a:hover{color:#0a4a8a}

/* The hidden attribute must win over a class that sets display (pager, empty box, buttons). */
[hidden]{display:none!important}

/* style="..." attributes of the approved files, one class each (spec/30 9.6) */
div.sp18{height:18px}
div.sp10{height:10px}
div.sp12{height:12px}
div.sp22{height:22px}
.mt20{margin-top:20px}
.mt-10{margin-top:-10px}
.mt24{margin-top:24px}
.tbl.mw0{min-width:0}
.radios.bare{border:0;margin:0;padding:0}
.linkrow{display:flex;flex-wrap:wrap;gap:4px 22px}
.mut13{font-size:13px}
tr.bad td{background:#fdf6f5}
.plist a{color:inherit;text-decoration:none;font-weight:700}

/* Board: skeleton rows on the first load (no animation) */
.lrow.skel .sk{display:block;height:18px;background:#eef1f5;border-radius:4px}
.lrow.skel .sk.tall{height:44px}

/* Board: reloading keeps the old rows, dimmed */
#results.is-loading .lrow{opacity:.55}

/* Board: the industry panel under the industry button */
#fx-industry{position:relative}
.indpanel{position:absolute;left:0;right:0;top:100%;z-index:5;min-width:260px;margin-top:6px;padding:8px 14px 14px;background:#fff;border:1px solid #dde2ea;border-radius:6px;box-shadow:0 24px 48px -28px rgba(0,41,80,.45)}
.indpanel .opts{max-height:300px;overflow-y:auto;margin:0 0 10px}
.indpanel .btn{width:100%}

/* Board: the phone chip panels (under 1000 px only; from 1000 px every control already shows) */
@media (max-width:999.98px){
form.fbar.show-industry .grid>#fx-industry,
form.fbar.show-revenue .grid>#fx-revenue,
form.fbar.show-sde .grid>#fx-sde,
form.fbar.show-sort .grid>#fx-sort{display:block}
}

/* Board: a phone chip whose panel is open looks selected (board gate 2, find-experience LOW 6) */
.chipb[aria-expanded="true"]{background:#002950;border-color:#002950;color:#fff}

/* Board: the empty-state chips are buttons with the approved span.fchip look */
button.fchip{border:0;font-family:inherit;line-height:inherit;cursor:pointer}

/* Board and listing: the retry line under an interest button */
p.msg.err.interest-error{flex-basis:100%;margin:8px 0 0;padding:10px 14px;font-size:14px}

/* Listing page: the state box (access off, load error) inside main.lpage */
.lpage .empty.lstate{grid-column:1/-1}

/* Admin: a message box placed above a section keeps the approved spacing */
.amain2 .msg.gap{margin:0 0 18px}

/* Board: the SDE definition as a visible line under the filters, every width (board gate 2 ruling) */
.fbar .sdenote{margin:12px 0 0}

/* Admin review: the one line above the buttons (board gate 2 ruling, deck admin.review.approve_note) */
.abar .apnote{flex-basis:100%;margin:0;font-size:14px;color:#46536a}

/* Admin at phone width only. The approved admin set is drawn at 1440 px (desktop-first, spec/40 4.3:
   "readable at phone width: wide tables scroll inside div.tscroll"); under 760 px the header and menu
   wrap onto 16 px gutters instead of running off the screen. Nothing at 760 px and wider changes. */
@media (max-width:759.98px){
.atop .in{flex-wrap:wrap;gap:10px 16px;padding:12px 16px}
.atop .rt{flex-wrap:wrap;gap:6px 16px}
.goto .inp{width:120px}
.anav ul{flex-wrap:wrap;padding:0 16px;gap:0}
.anav a{padding:0 10px}
.amain2{padding:24px 16px 40px}
/* Board gate 2 ruling (find-experience MEDIUM 4): in the admin tables the deal ID and its status come
   first and stay in view (sticky) while the other columns scroll sideways inside div.tscroll. Listings:
   Deal ID, Status. Interest log: Listing (the deal ID), Team Slack ping. Queue: Deal ID (the queue has
   no status column; the tab is the state). Buyers: no sticky column (b17 final verify ruling): the
   table scrolls inside its box as the approved design does, so every row's buttons stay pressable.
   A cell holding a button sits above the sticky cells, so a sticky cell never covers a button. Rows
   lay out as flex lines of fixed cells so every row lines up with its header. */
.kv dd{overflow-wrap:anywhere}
.tscroll .tbl{display:block;min-width:0;width:max-content}
.tscroll .tbl>thead,.tscroll .tbl>tbody{display:block}
.tscroll .tbl tr{display:flex;align-items:stretch}
.tscroll .tbl thead tr{background:#f3f5f9}
.tscroll .tbl tbody tr{background:#fff}
.tscroll .tbl tbody tr.sel{background:#f7f3e6}
.tscroll .tbl tbody tr.bad{background:#fdf6f5}
.tscroll .tbl th,.tscroll .tbl td{flex:0 0 150px;box-sizing:border-box;white-space:normal;overflow-wrap:anywhere}
.tscroll .tbl td[colspan]{flex:1 0 320px}
.tbl:has(#q-rows) tr>:nth-child(1):not([colspan]),
.tbl:has(#l-rows) tr>:nth-child(1):not([colspan]),
.tbl:has(#i-rows) tr>:nth-child(3){order:-2;position:sticky;left:0;z-index:2;flex-basis:112px;background:inherit}
.tbl:has(#l-rows) tr>:nth-child(5),
.tbl:has(#i-rows) tr>:nth-child(4){order:-1;position:sticky;left:112px;z-index:2;flex-basis:132px;background:inherit;box-shadow:6px 0 8px -6px rgba(0,41,80,.25)}
.tscroll .tbl td:has(button){position:relative;z-index:3;background:inherit}
}