/* ── rail.css · פס-מצב + אקורדיון (ראה rail.js) ────────────────────────
   נטען אחרי mirror.css ודורס בכוונה שני כללים משם:
   · max-height:40vh על #mods-rail — התקרה נולדה כי שמונה כרטיסים פתוחים
     דחפו את «שלח» מתחת לקצה המסך. באקורדיון פתוח כרטיס אחד, ולכן הגובה
     חסום מעצמו והתקרה (עם הגלילה-בתוך-גלילה שלה) מיותרת.
   · הסדר: הפס תמיד ראשון (order:-1), הטיקט אחריו, האקורדיון אחריהם.   */

#mods-rail{max-height:none;overflow:visible}

/* ── פס-המצב ─────────────────────────────────────────────────────── */
#plan-strip{
  order:-1;flex:none;
  padding:7px 10px 6px;border-bottom:1px solid var(--line);
  background:var(--panel2);font-size:12px;line-height:1.35;
}
#plan-strip .ps-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
/*  מסך נמוך (1366×768, נמדד 23.09): המסילה החזיקה 751px ב-722 — הפס נשבר לשתי שורות
    («רצף» ירד שורה כשהרווח היומי דו-ספרתי) וכותרת-הטיקט 42px. דוחסים רק כאן.  */
@media (max-height:800px){
  #plan-strip{padding:4px 8px 3px}
  #plan-strip .ps-row{gap:6px}
  #plan-strip .ps-k{font-size:10.5px}
  #rail > .rail-head{padding-top:4px;padding-bottom:4px}
}
#plan-strip #ps-main{cursor:pointer}
#plan-strip #ps-main:hover .ps-k{color:var(--ink)}
#plan-strip .ps-cell{display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap}
#plan-strip .ps-k{color:var(--dim);font-size:11px}
#plan-strip b{font-weight:700;font-variant-numeric:tabular-nums}
#plan-strip b.up{color:var(--buy)} #plan-strip b.down{color:var(--sell)}
#plan-strip .ps-dim{color:var(--faint);font-size:11px}
#plan-strip .ps-warn{color:var(--amber)}
#plan-strip .ps-lock{font-style:normal;font-size:10px;opacity:.8}
#plan-strip .ps-sub{margin-top:3px;justify-content:space-between;font-size:11px;color:var(--dim)}
#plan-strip .ps-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-inline-end:6px;background:var(--faint);vertical-align:middle}
#plan-strip.st-ok   .ps-dot{background:var(--buy);box-shadow:0 0 6px var(--buy)}
#plan-strip.st-warn .ps-dot{background:var(--amber)}
#plan-strip.st-warn #ps-state{color:var(--amber)}
#plan-strip.st-bad  .ps-dot{background:var(--sell);box-shadow:0 0 6px var(--sell)}
#plan-strip.st-bad  #ps-state{color:var(--sell);font-weight:700}
#plan-strip.st-off  #ps-state{color:var(--faint)}
#plan-strip .ps-edit{
  background:none;border:1px solid var(--line);color:var(--dim);border-radius:6px;
  padding:1px 8px;font:inherit;font-size:11px;cursor:pointer;
}
#plan-strip .ps-edit:hover{border-color:var(--purple-dim);color:var(--ink)}

/* ── אקורדיון ────────────────────────────────────────────────────── */
#mods-rail > .mod-card > .mod-head{cursor:pointer;user-select:none}
#mods-rail > .mod-card > .mod-head h2::before{
  content:"▾";display:inline-block;width:12px;margin-inline-end:4px;
  color:var(--faint);font-size:10px;transition:transform .12s
}
#mods-rail > .mod-card.vm-fold > .mod-head h2::before{transform:rotate(-90deg)}
#mods-rail > .mod-card.vm-ownarrow > .mod-head h2::before{display:none}
#mods-rail > .mod-card.vm-fold > :not(.mod-head){display:none}
#mods-rail > .mod-card.vm-fold{padding-top:6px;padding-bottom:6px}
#mods-rail > .mod-card.vm-fold > .mod-head{margin-bottom:0}
#mods-rail > .mod-card.vm-fold > .mod-head h2{color:var(--faint)}
#mods-rail > .mod-card.vm-fold > .mod-head:hover h2{color:var(--dim)}

/* ── ⚙: שדה סיכון נעול לתכנית ──────────────────────────────────── */
#r-risk:disabled{opacity:.55;cursor:not-allowed}
#r-plan-note button.link,#plan-tab-edit.link{
  background:none;border:0;padding:0;color:var(--cyan);font:inherit;cursor:pointer;text-decoration:underline
}
#plan-tab-kv .mod-kv{margin:6px 0 12px;font-size:13px}

/* ── QA 30.09 · every control reachable at the minimum window (1024×640) ───────
   Measured: at 1024×640 the rail held 783px in 563 — «Check & send», the journal
   row, the ♪/⚙ of Level proximity and «More ▴» were below the window and the rail
   itself scrolled (mirror.css:62 says it never should). Now:
   · the rail is a fixed column: status strip + proposal on top, the ticket in the
     middle, the plugin cards and the drawer handle at the bottom — none of them move;
   · only the ticket gives way: it scrolls INSIDE itself, and its «Check & send» row
     is pinned (sticky) to the ticket's bottom edge, so opening «Price ▾» or a long
     sizing block can never push the send button out again;
   · the plugin cards get a ceiling and scroll inside their own box.            */
/*  (mirror.css:60 keeps #rail{overflow-y:auto} as the safety net — with the ticket flexing it never triggers) */
#rail > #plan-strip,#rail > .rail-head,#rail > #tk-prop{flex:none}
#rail > #ticket{
  flex:1 1 auto;min-height:150px;overflow-y:auto;overscroll-behavior:contain;padding-bottom:0;
  scrollbar-width:thin;scrollbar-color:var(--line) transparent;
}
#rail > #ticket::-webkit-scrollbar{width:6px}
#rail > #ticket::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
#rail > #ticket > .tk-acts{
  position:sticky;bottom:0;z-index:3;margin-bottom:0;
  margin-inline:-10px;padding:5px 10px 5px;
  background:var(--panel);box-shadow:0 -8px 10px -6px rgba(0,0,0,.35);
}
html[data-theme="light"] #rail > #ticket > .tk-acts{box-shadow:0 -8px 10px -6px rgba(30,34,52,.12)}
/*  The journal row (setup + note) rides with the send row: it is what you tag right before sending,
    and at 1024×640 with «Price ▾» open it was the one thing left below the window. The ticket becomes
    a flex column only to put the journal row directly above the send row (DOM order untouched).
    --tk-acts-h is the send row's measured height (layout.js).  */
#rail > #ticket{display:flex;flex-direction:column}
#rail > #ticket > *{flex-shrink:0}
#rail > #ticket > #mod-journal-tag{
  order:1;position:sticky;bottom:var(--tk-acts-h,50px);z-index:3;
  margin:0 -10px;padding:4px 10px 0;background:var(--panel);
}
#rail > #ticket > .tk-acts{order:2}
#rail > #ticket > .tk-acts2,#rail > #ticket > #tk-err{order:3}
#rail > #mods-rail{
  flex:0 0 auto;max-height:34%;overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:var(--line) transparent;
}
#rail > #ws-draw-h{flex:none}

/*  Low window (≤760px tall): trim what repeats elsewhere, so the ticket has less to
    scroll at 1024×640–1280×720 (measured 1024×640: 520px of ticket → 456px).
    · «No position» — the position strip under the chart says exactly that;
    · the idle size hint — «Pick a side…» is already the calculator line above it;
    · the Alt-click tip drops under the two level buttons as one line.  */
@media (max-height:760px){
  #rail #tk-state:not(.in-pos):not(.working){display:none}
  #rail #tk-size:has(> .ts-hint:only-child){display:none}
  #rail #mod-views-i5{flex-wrap:wrap;row-gap:1px;margin-bottom:4px}
  #rail #mod-views-i5 .mv-hint{flex:1 1 100%}
  #rail #mod-views-i5 .mv-hint br{display:none}
  #rail #mod-journal-tag select,#rail #mod-journal-tag input{padding-block:2px}
}

/* ── 01.10 (parity M13 · GROUPING_SPEC §1-4) · the boxes in the rail ─────────────────────────────
   The tokens and the base .vx-grp are in mirror.css. Here: the rail's compact sizes, rule 3 (no box inside a
   box), control edges ≥3:1, dividers between sections, and the plugin cards as boxes. Nothing here changes
   what the QA 30.09 block above pins: .tk-acts and #mod-journal-tag stay direct children of #ticket (layout.js
   moves the journal row out of the Risk box). A sticky element cannot leave its parent, so a box around it
   would unpin PLACE.  */
#rail{--vx-group-pad:3px 8px 7px;--vx-group-gap:6px}
#rail fieldset.vx-grp > legend{font-size:11px}
@media (max-height:760px){
  #rail{--vx-group-pad:1px 7px 5px;--vx-group-gap:4px}
  #rail fieldset.vx-grp > legend{font-size:10.5px}
}
/*  the rows inside a box keep their own layout; the box gives the spacing  */
#rail #ticket fieldset.vx-grp > :not(legend){margin-top:0;margin-bottom:0}
#rail #ticket fieldset.vx-grp > :not(legend) ~ :not(legend){margin-top:5px}
#rail #ticket fieldset.vx-grp > .tk-gone + :not(legend),#rail #ticket fieldset.vx-grp > .hidden + :not(legend){margin-top:5px}
/*  rule 3: the entry bar (order type · price) and the calculator were framed panels — inside a box they are plain rows  */
#rail #ticket fieldset.vx-grp #mod-entry-bar{background:none;border:0;padding:0;border-radius:0}
#rail #ticket fieldset.vx-grp > .tk-calc{background:none;padding:2px 8px;min-height:0}
/*  the ticket's account label (theme.js ::after, top-start) moved to the top-END corner, so the first box's legend stays readable  */
#rail #ticket::after{inset-inline-start:auto;inset-inline-end:12px;top:3px;padding:0 4px;background:var(--panel);border-radius:3px;z-index:4}
/*  control edges (spec: #7a8594 on an unselected chip, input or button) · selected = --vx-sel-*  */
#rail #ticket .tk-px label:not(.s):not(.t) input,#rail #ticket #tk-qty,#rail #ticket #tk-flip,
#rail #ticket .ts-opt:not(.on),#rail #ticket .tk-acts2 button,#rail #mod-journal-tag select,#rail #mod-journal-tag input,
#rail #mod-entry-bar .seg button:not(.on),#rail #tk-prop-modes button:not(.on){border-color:var(--vx-border-control)}
#rail #ticket .tk-side button:not(.on){border-color:var(--vx-border-control) !important}   /* theme.js sets it !important */
#rail #mod-entry-bar .seg button.on{background:var(--vx-sel-bg);border-color:var(--vx-sel-border);color:#fff}
#rail #ticket .ts-opt.on,#rail #tk-prop-modes button.on{border-color:var(--vx-sel-border)}
#rail :focus-visible{outline:2px solid var(--vx-focus);outline-offset:2px}
/*  rule 5: the «Close» box (close position · cancel orders) — shown only when one of them is (ticket.js hides them)  */
#rail > #ticket > #tkg-close{order:3}
#rail #tkg-close:not(:has(.tk-acts2 > button:not(.tk-gone))){display:none}
#rail #tkg-close .tk-acts2 button{border-color:var(--vx-danger-border)}
/*  rule 4: dividers between sections — the status strip, the section heads, and above the pinned footer (journal · PLACE)  */
#rail > #plan-strip{border-bottom-color:var(--vx-divider)}
#rail > .rail-head{border-bottom-color:var(--vx-divider)}
#rail > .rail-head.sep{border-top-color:var(--vx-divider)}
#rail > #ticket > #mod-journal-tag{border-top:var(--vx-bw) solid var(--vx-divider);padding-top:5px}
#rail #tk-prop{border-color:var(--vx-border-group)}
/*  the plugin cards (Level touches, Plan, Guard, Trail…) are boxes too; their title is the label  */
#rail > #mods-rail{padding:6px 6px 0}
#rail > #mods-rail > .mod-card{margin:0 0 6px;background:var(--vx-bg-group);border:var(--vx-bw) solid var(--vx-border-group);
  border-radius:var(--vx-r-group);padding-inline:8px}
#rail > #mods-rail > .mod-card > .mod-head h2{color:var(--vx-group-label)}
/*  «Manage position» · «Protect · close» · «Close»: the position chips (tools.js), grouped by layout.js  */
#rail #mod-tools-chips{gap:4px 5px;padding:3px 9px 6px;border-bottom-color:var(--vx-divider);align-items:flex-end}
#rail #mod-tools-chips > fieldset.vx-grp{display:flex;flex-wrap:wrap;align-items:center;gap:3px 4px;margin:0;padding:0 5px 4px;flex:1 1 auto}
#rail #mod-tools-chips > fieldset.vx-grp > legend{font-size:10.5px;padding:0 4px}
#rail #mod-tools-chips > fieldset.vx-grp button{padding:0 6px;font-size:11px;line-height:1.45}
#rail #mod-tools-chips > fieldset.vx-grp:nth-of-type(2){flex:1 1 0}   /* «Protect · close» shares its row with «Close» */
#rail #mod-tools-chips > fieldset.vx-grp.vx-danger{flex:0 0 auto}
#rail #mod-tools-chips button:not(.danger):not(:disabled){border-color:var(--vx-border-control)}
#rail #mod-tools-chips button.danger{border-color:var(--vx-danger-border)}
/*  the P&L (tools.js .pnl) rides on the first box's top edge, at the far end, so it costs no row of its own  */
#rail #mod-tools-chips{position:relative}
#rail #mod-tools-chips > .pnl{position:absolute;top:0;inset-inline-end:16px;margin:0;padding:0 5px;background:var(--panel);line-height:14px;font-size:11px}
