/*
 * Rules of the account in the pro terminal: the survival rail (daily loss, max loss, target, daily reset, status;
 * base styles in terminal.css), the dock's actions (close a group of positions by holding the button, cancel all),
 * the order history.
 */

/* ---------- survival rail ---------- */
#hudReset .hud-val { color: var(--mute); }
@media (max-width: 1499px) {
  .hud-item { gap: 8px; padding: 0 12px; }
  .hud-bar { width: 56px; }
}
@media (max-width: 759px) {
  .hud { gap: 0; padding: 0 8px; }
  .hud-item, .hud-item:first-child { flex: 1 1 0; gap: 3px; padding: 6px 6px; }
  .hud-label { display: block; font-size: 8.5px; letter-spacing: 0.06em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .hud-val { font-size: 11px; }
  #hudState .hud-label { display: none; }
}

/* ---------- closest loss limit: a word, not only a colour (limits.js) ---------- */
.limit-flag {
  display: none; flex: 0 0 auto; padding: 1px 6px; border: 1px solid currentColor; border-radius: var(--r-pill);
  font-size: 9px; font-weight: 700; line-height: 1.4; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; color: var(--acc);
}
[data-closest="true"] > .limit-flag, [data-closest="true"] > .gauge-head > .limit-flag { display: inline-block; }
.gauge-head .limit-flag { margin: 0 auto 0 8px; }
@media (max-width: 759px) {
  /* no room for the word beside the label: a bar on top of the item (a shape, not a colour) and the word kept for screen readers */
  .hud-item[data-closest="true"] { box-shadow: inset 0 3px 0 var(--acc); }
  .hud-item[data-closest="true"] > .limit-flag {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; border: 0; clip-path: inset(50%); white-space: nowrap;
  }
}

/* ---------- dock: tabs, then the actions of the selected tab ---------- */
.dock-head { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--line); }
.dock-head .dock-tabs { flex: 1 1 auto; min-width: 0; border-bottom: 0; }
.dock-actions { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; padding-right: 8px; }
.close-group { display: inline-flex; align-items: center; gap: 4px; }
.close-group select { width: auto; min-width: 0; min-height: 30px; padding: 0 26px 0 8px; font-size: 12px; }
.dock-actions .btn { white-space: nowrap; }
.hold-btn { position: relative; overflow: hidden; isolation: isolate; }
.hold-fill {
  position: absolute; inset: 0; z-index: -1; transform: scaleX(0); transform-origin: left center;
  background: color-mix(in srgb, var(--down) 55%, transparent);
}
.hold-btn.holding .hold-fill { transform: scaleX(1); transition: transform 800ms linear; }

/* ---------- order history ---------- */
.hist-status small.hist-why { display: block; font-size: 11px; color: var(--dim); white-space: normal; }
#histBody td[data-tone="up"] { color: var(--up); }
#histBody td[data-tone="down"] { color: var(--down); }
#histMsg:empty { display: none; }

/* ---------- dock: misc ---------- */
.dlg-close .field { margin-top: 0; }
#posBody .js-limit { margin-right: 4px; }

@media (prefers-reduced-motion: reduce) {
  .hold-btn.holding .hold-fill { transition-duration: 0ms; }
}