/* widgets.css — internal styling for the widget bodies (the dock chrome lives in dock.css). */
.dk-content { font: 12px/1.4 -apple-system, "IBM Plex Sans", system-ui, sans-serif; color: var(--dk-txt); }
.dk-content .mono { font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace; }
.dk-content .up { color: var(--dk-up); } .dk-content .down { color: var(--dk-down); } .dk-content .dim { color: var(--dk-dim); }
.w-msg { display: grid; place-items: center; height: 100%; color: var(--dk-dim); font-size: 12px; }
.w-badge { position: absolute; top: 6px; left: 8px; z-index: 5; font-size: 10px; padding: 2px 7px; border-radius: 6px; background: rgba(0,0,0,.5); color: var(--dk-dim); pointer-events: none; }

/* generic table */
.w-table { display: flex; flex-direction: column; height: 100%; overflow: auto; }
.w-thead { display: flex; position: sticky; top: 0; background: var(--dk-bg2); color: var(--dk-dim); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; padding: 6px 10px; border-bottom: 1px solid var(--dk-line); }
.w-thead span, .w-tr span { flex: 1 1 0; min-width: 0; }
.w-thead span:not(:first-child), .w-tr span:not(:first-child) { text-align: right; }
.w-tbody { flex: 1 1 0; }
.w-tr { display: flex; align-items: center; padding: 5px 10px; border-bottom: 1px solid rgba(255,255,255,.03); }
.w-tr:hover { background: var(--dk-bg2); }
.spark { width: 84px; height: 24px; vertical-align: middle; }

/* order book */
.w-ob { display: flex; flex-direction: column; height: 100%; font-family: "IBM Plex Mono", monospace; font-size: 11px; }
.w-ob .ob-side { flex: 1 1 0; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; }
.w-ob .ob-side.bids { justify-content: flex-start; }
.ob-r { position: relative; display: flex; justify-content: space-between; padding: 2px 10px; }
.ob-r i { position: absolute; right: 0; top: 0; bottom: 0; opacity: .12; }
.ob-r.up i { background: var(--dk-up); } .ob-r.down i { background: var(--dk-down); }
.ob-r span { position: relative; z-index: 1; }
.ob-mid { text-align: center; padding: 5px; background: var(--dk-bg2); border-block: 1px solid var(--dk-line); font-weight: 600; }

/* time & sales */
.w-tape { height: 100%; overflow: hidden; font-family: "IBM Plex Mono", monospace; font-size: 11px; }
.tp-r { display: flex; justify-content: space-between; padding: 3px 10px; border-bottom: 1px solid rgba(255,255,255,.03); }
.tp-r.up { background: rgba(48,209,88,.05); } .tp-r.down { background: rgba(255,69,58,.05); }

/* movers */
.w-movers { display: flex; height: 100%; }
.mv-col { flex: 1 1 0; overflow: auto; } .mv-col:first-child { border-right: 1px solid var(--dk-line); }
.mv-h { padding: 6px 10px; font-size: 10px; text-transform: uppercase; color: var(--dk-dim); position: sticky; top: 0; background: var(--dk-bg1); }

/* heatmap */
.w-heatmap { display: grid; grid-template-columns: repeat(auto-fill, minmax(74px, 1fr)); gap: 3px; padding: 6px; height: 100%; overflow: auto; align-content: start; }
.hm-c { border-radius: 6px; padding: 8px 6px; display: flex; flex-direction: column; gap: 2px; color: #fff; }
.hm-c b { font-size: 12px; } .hm-c span { font-size: 10px; opacity: .9; font-family: "IBM Plex Mono", monospace; }

/* calendar impact */
.imp { font-size: 10px; padding: 1px 6px; border-radius: 5px; }
.imp-high { background: rgba(255,69,58,.18); color: var(--dk-down); }
.imp-med { background: rgba(255,159,10,.18); color: #ff9f0a; }
.imp-low { background: rgba(125,138,160,.18); color: var(--dk-dim); }

/* news */
.w-news { height: 100%; overflow: auto; }
.nw-r { padding: 8px 12px; border-bottom: 1px solid var(--dk-line); cursor: pointer; }
.nw-r:hover { background: var(--dk-bg2); }
.nw-t { font-size: 12.5px; margin-bottom: 3px; } .nw-m { font-size: 10px; }

/* order ticket */
.w-ticket { padding: 12px; display: flex; flex-direction: column; gap: 9px; }
.tk-seg { display: flex; gap: 0; border: 1px solid var(--dk-line); border-radius: 7px; overflow: hidden; }
.tk-seg.sm button { padding: 5px; font-size: 11px; }
.tk-seg button { flex: 1; background: var(--dk-bg2); color: var(--dk-dim); border: none; padding: 8px; cursor: pointer; font: inherit; }
.tk-seg button.on.up { background: rgba(48,209,88,.18); color: var(--dk-up); }
.tk-seg button.on.down { background: rgba(255,69,58,.18); color: var(--dk-down); }
.tk-seg button.on { background: var(--dk-accent-soft); color: var(--dk-txt); }
.w-ticket label { display: flex; justify-content: space-between; align-items: center; font-size: 11px; color: var(--dk-dim); }
.w-ticket input { width: 120px; background: var(--dk-bg2); border: 1px solid var(--dk-line); border-radius: 6px; color: var(--dk-txt); padding: 6px 8px; font: inherit; text-align: right; }
.tk-submit { background: rgba(48,209,88,.85); color: #04210f; border: none; border-radius: 8px; padding: 11px; font: 600 12px/1 inherit; cursor: pointer; }

/* account / perf / backtest */
.w-account { padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.ac-row { display: flex; justify-content: space-between; align-items: baseline; }
.ac-spark { margin-top: 6px; }
.bt-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 12px; }
.bt-stats > div { display: flex; flex-direction: column; gap: 2px; } .bt-stats span { font-size: 10px; } .bt-stats b { font-size: 16px; }
.bt-eq, .ac-spark { padding: 0 10px; }
.w-perf { padding-top: 4px; }

/* script editor */
.w-script { display: flex; flex-direction: column; height: 100%; }
.code { flex: 1; margin: 0; padding: 12px; overflow: auto; font-family: "IBM Plex Mono", monospace; font-size: 11.5px; line-height: 1.6; color: #c9d3e0; background: var(--dk-bg0); }
.code .kw { color: #ff7ab2; } .code .dec { color: #ffd479; } .code .str { color: #9fe88d; } .code .fn { color: #82aaff; }
.sc-bar { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-top: 1px solid var(--dk-line); }
.sc-bar button { background: var(--dk-bg2); border: 1px solid var(--dk-line); border-radius: 6px; color: var(--dk-txt); padding: 5px 12px; cursor: pointer; font: inherit; }
.sc-bar button.up { background: rgba(48,209,88,.18); color: var(--dk-up); border-color: transparent; }

/* correlation */
.w-corr { padding: 8px; height: 100%; overflow: auto; }
.cm-grid { display: grid; gap: 2px; font-size: 10px; font-family: "IBM Plex Mono", monospace; }
.cm-h { color: var(--dk-dim); text-align: center; padding: 4px; } .cm-c { text-align: center; padding: 6px 2px; border-radius: 4px; color: #fff; }

/* symbol info */
.w-syminfo { padding: 12px; }
.si-top { display: flex; gap: 10px; align-items: center; margin-bottom: 12px; }
.si-ico { width: 40px; height: 40px; border-radius: 50%; background: var(--dk-accent-soft); display: grid; place-items: center; font-size: 20px; color: var(--dk-accent); }
.si-name { font-size: 14px; } .si-px { font-size: 18px; margin-top: 2px; }

/* notes */
.w-notes { height: 100%; } .w-notes textarea { width: 100%; height: 100%; box-sizing: border-box; background: transparent; border: none; color: var(--dk-txt); padding: 12px; font: 12.5px/1.6 "IBM Plex Mono", monospace; resize: none; outline: none; }

/* DOM ladder */
.w-dom { height: 100%; overflow: auto; font-family: "IBM Plex Mono", monospace; font-size: 11px; }
.dom-r { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1px; padding: 2px 8px; text-align: center; }
.dom-r > span:first-child { text-align: right; } .dom-r > span:last-child { text-align: left; }
.dom-mid { background: var(--dk-bg2); font-weight: 600; border-block: 1px solid var(--dk-line); }

/* ── batch-1 widgets + improvements ────────────────────────────────────────── */
/* sortable headers + watchlist selection */
.w-thead .sortable { cursor: pointer; user-select: none; }
.w-thead .sortable:hover { color: var(--dk-txt); }
.w-thead .sortable.on { color: var(--dk-accent); }
.wl-row { cursor: pointer; }
.wl-row.sel { background: var(--dk-accent-soft); box-shadow: inset 2px 0 0 var(--dk-accent); }
.wl-cls { font-size: 9px; opacity: .5; }

/* liquidations */
.lq-r { display: grid; grid-template-columns: 52px 1fr 1fr 1fr; align-items: center; gap: 6px; padding: 4px 10px; font-size: 11px; border-bottom: 1px solid rgba(255,255,255,.03); }
.lq-r.up { background: rgba(48,209,88,.05); } .lq-r.down { background: rgba(255,69,58,.05); }
.lq-side { font-size: 9px; font-weight: 700; letter-spacing: .04em; padding: 1px 5px; border-radius: 4px; text-align: center; }
.lq-r.up .lq-side { background: rgba(48,209,88,.2); color: var(--dk-up); }
.lq-r.down .lq-side { background: rgba(255,69,58,.2); color: var(--dk-down); }

/* options chain */
.w-options { height: 100%; overflow: auto; font-size: 11px; }
.opt-h, .opt-r { display: grid; grid-template-columns: 1fr 46px 64px 46px 1fr; text-align: center; align-items: center; }
.opt-h { position: sticky; top: 0; background: var(--dk-bg2); color: var(--dk-dim); font-size: 10px; text-transform: uppercase; padding: 6px 0; border-bottom: 1px solid var(--dk-line); }
.opt-r { padding: 4px 0; border-bottom: 1px solid rgba(255,255,255,.03); }
.opt-c { color: var(--dk-up); } .opt-p { color: var(--dk-down); }
.opt-c.itm { background: rgba(48,209,88,.08); } .opt-p.itm { background: rgba(255,69,58,.08); }
.opt-iv { color: var(--dk-dim); font-size: 10px; }
.opt-k { font-weight: 600; } .opt-k.atm { color: var(--dk-accent); }

/* sentiment gauge */
.w-sentiment { display: grid; place-items: center; height: 100%; }
.sg-gauge { text-align: center; } .sg-gauge svg { width: 200px; max-width: 80%; }
.sg-val { font: 700 34px/1 "IBM Plex Mono", monospace; margin-top: -8px; }
.sg-lbl { color: var(--dk-dim); font-size: 13px; margin-top: 2px; }

/* badge: keep clear of table headers (right-align + clip in table/options/funding widgets) */
.w-badge { max-width: 62%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dk-content:has(.w-table) .w-badge, .dk-content:has(.w-options) .w-badge { left: auto; right: 8px; background: rgba(11,14,20,.78); }

/* ── batch-2 widgets + improvements ────────────────────────────────────────── */
.tp-r.big { font-weight: 700; box-shadow: inset 2px 0 0 currentColor; }

/* calendar (richer) */
.w-cal { height: 100%; overflow: auto; }
.cal-day { padding: 8px 12px; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--dk-dim); position: sticky; top: 0; background: var(--dk-bg1); border-bottom: 1px solid var(--dk-line); }
.cal-r { display: grid; grid-template-columns: 44px 34px 1fr auto; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid rgba(255,255,255,.03); border-left: 2px solid transparent; }
.cal-r.imp-l-high { border-left-color: var(--dk-down); } .cal-r.imp-l-med { border-left-color: #ff9f0a; } .cal-r.imp-l-low { border-left-color: var(--dk-dim); }
.cal-t { font-size: 12px; } .cal-cur { font-weight: 700; font-size: 11px; }
.cal-ev { font-size: 12px; } .cal-fc { font-size: 10px; margin-top: 1px; }

/* news tags + filter */
.nw-filter { display: flex; gap: 4px; padding: 8px 10px; position: sticky; top: 0; background: var(--dk-bg1); border-bottom: 1px solid var(--dk-line); flex-wrap: wrap; }
.nw-filter button { background: var(--dk-bg2); border: 1px solid var(--dk-line); color: var(--dk-dim); border-radius: 14px; padding: 3px 11px; font: inherit; font-size: 11px; cursor: pointer; }
.nw-filter button.on { background: var(--dk-accent-soft); border-color: var(--dk-accent); color: var(--dk-txt); }
.nw-m { display: flex; align-items: center; gap: 8px; }
.nw-tag { font-size: 9px; padding: 1px 7px; border-radius: 4px; font-weight: 600; }
.tag-crypto { background: rgba(247,147,26,.18); color: #f7931a; } .tag-macro { background: rgba(94,131,255,.18); color: #5e83ff; }
.tag-stocks { background: rgba(48,209,88,.18); color: var(--dk-up); } .tag-fx { background: rgba(229,38,126,.18); color: var(--dk-accent); } .tag-commodities { background: rgba(212,160,23,.2); color: #d4a017; }

/* currency strength */
.w-strength { padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.str-r { display: grid; grid-template-columns: 36px 1fr 56px; align-items: center; gap: 8px; }
.str-c { font-weight: 700; font-size: 12px; }
.str-track { height: 8px; background: var(--dk-bg2); border-radius: 4px; overflow: hidden; }
.str-track i { display: block; height: 100%; border-radius: 4px; } .str-track i.up { background: var(--dk-up); } .str-track i.down { background: var(--dk-down); }
.str-r .mono { text-align: right; font-size: 11px; }

/* risk calculator */
.w-risk { padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.w-risk label { display: flex; justify-content: space-between; align-items: center; font-size: 11px; color: var(--dk-dim); }
.w-risk input { width: 120px; background: var(--dk-bg2); border: 1px solid var(--dk-line); border-radius: 6px; color: var(--dk-txt); padding: 6px 8px; font: inherit; text-align: right; }
.r-out { margin-top: 6px; border-top: 1px solid var(--dk-line); padding-top: 10px; display: flex; flex-direction: column; gap: 7px; }
.r-row { display: flex; justify-content: space-between; align-items: baseline; }

/* trade journal */
.w-journal { display: flex; flex-direction: column; height: 100%; }
.jr-body { overflow: auto; }

/* market sessions */
.w-sessions { padding: 10px 12px; display: flex; flex-direction: column; gap: 10px; }
.ses-clock { font-size: 16px; font-weight: 600; text-align: center; }
.ses-r { display: grid; grid-template-columns: 12px 80px 56px; grid-template-rows: auto auto; align-items: center; gap: 4px 8px; }
.ses-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--dk-line2); } .ses-dot.on { background: var(--dk-up); box-shadow: 0 0 8px var(--dk-up); }
.ses-n { font-size: 12px; } .ses-st { font-size: 10px; text-align: right; font-weight: 600; }
.ses-track { grid-column: 1 / -1; position: relative; height: 6px; background: var(--dk-bg2); border-radius: 3px; overflow: hidden; }
.ses-track i { position: absolute; top: 0; bottom: 0; background: var(--dk-accent-soft); border-radius: 3px; }
.ses-now { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--dk-accent); border-radius: 1px; }

/* dominance */
.w-dominance { padding: 12px; display: flex; flex-direction: column; gap: 12px; }
.dm-top { display: flex; justify-content: space-between; } .dm-top span { font-size: 10px; } .dm-top b { font-size: 18px; display: block; }
.dm-bar { display: flex; height: 16px; border-radius: 8px; overflow: hidden; }
.dm-bar i { height: 100%; } .dm-btc { background: #f7931a; } .dm-eth { background: #5e83ff; } .dm-oth { background: #3a4860; }
.dm-leg { display: flex; gap: 14px; flex-wrap: wrap; font-size: 11px; color: var(--dk-dim); }
.dm-leg i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 4px; vertical-align: middle; }