/* ============================================================
   MASTER VORTEX — Stock Screener view (screener.js companion).
   Same tokens as styles.css: black base, electric green #1ee308,
   red #ff3b47. Loaded after styles.css; everything is namespaced
   (.scr-*, .view-tab) so it never collides with the chart styles.
   ============================================================ */

/* --- top-bar view tabs (CHART / SCREENER) --- */
.view-tabs{display:flex; gap:8px;}
.view-tab{
  background:#101823; color:#dfe9f5; border:1px solid #1d2c42; border-radius:8px;
  font-size:13px; font-weight:400; letter-spacing:1px; padding:9px 14px;
  cursor:pointer; font-family:inherit;
}
.view-tab:hover{border-color:rgba(30,227,8,.5); color:#fff;}
.view-tab.active{background:var(--green); color:#03140a; border-color:var(--green);
  box-shadow:0 0 14px rgba(30,227,8,.45);}

/* --- layout swap: screener replaces the chart grid --- */
body.mv-screener-open .main{display:none;}
body.mv-screener-open .tf-group{visibility:hidden;}

.scr-view{
  flex:1 1 auto; min-height:0; display:flex; flex-direction:column;
  background:var(--panel); border:1px solid var(--edge); border-radius:10px;
  margin:10px; overflow:hidden;
}
.scr-view[hidden]{display:none;}

.scr-head{
  flex:0 0 auto; padding:10px 14px; border-bottom:1px solid var(--edge);
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  background:var(--panel-2);
}
.scr-title{color:var(--green); font-size:17px; font-weight:400; letter-spacing:2px;}
.scr-controls{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-left:auto;}
.scr-dirs{display:flex; gap:6px;}
.scr-dir{
  background:#101823; color:#dfe9f5; border:1px solid #1d2c42; border-radius:8px;
  font-size:12.5px; font-weight:400; letter-spacing:.6px; padding:8px 12px;
  cursor:pointer; font-family:inherit;
}
.scr-dir:hover{border-color:rgba(30,227,8,.5); color:#fff;}
.scr-dir.active[data-dir="gainers"]{background:var(--green); color:#03140a; border-color:var(--green);}
.scr-dir.active[data-dir="losers"]{background:var(--red); color:#1a0205; border-color:var(--red);}
.scr-dir.active[data-dir="actives"]{background:#ffd84d; color:#1a1402; border-color:#ffd84d;}
.scr-sector-wrap{
  display:flex; align-items:center; gap:8px; color:var(--dim);
  font-size:11.5px; font-weight:400; letter-spacing:1px;
}
.scr-sector-wrap select{
  background:#0a1524; color:var(--ink); border:1.5px solid #1c3350; border-radius:8px;
  font-size:13px; font-weight:400; padding:7px 9px; font-family:inherit; cursor:pointer;
}
.scr-sector-wrap select:focus{outline:none; border-color:rgba(30,227,8,.65);}
.scr-refresh{
  background:transparent; color:var(--green); border:1.5px solid rgba(30,227,8,.65);
  border-radius:8px; font-size:12px; font-weight:400; letter-spacing:.8px;
  padding:8px 13px; cursor:pointer; font-family:inherit;
}
.scr-refresh:hover{background:rgba(30,227,8,.12);}
.scr-refresh:disabled{opacity:.5; cursor:wait;}
.scr-status{font-size:11.5px; font-weight:400; color:#9fb6d8; min-width:120px;}
.scr-status.err{color:var(--red);}

.scr-table-wrap{flex:1 1 auto; overflow:auto; min-height:0;}
.scr-table td.seam{color:#5b6b82;}
.scr-table td.vx{white-space:nowrap;}
.scr-foot{
  flex:0 0 auto; padding:6px 10px; font-size:10.5px; font-weight:400;
  color:#7d8ea6; border-top:1px solid var(--edge);
}
.scr-table{width:100%; border-collapse:collapse; font-size:13.5px;}
.scr-table thead th{
  position:sticky; top:0; z-index:2; background:#0a1322; color:var(--dim);
  font-size:11px; font-weight:400; letter-spacing:1.1px; text-align:left;
  padding:9px 12px; border-bottom:1px solid var(--edge); white-space:nowrap;
}
.scr-table thead th.r, .scr-table td.r{text-align:right;}
.scr-table thead th[data-sort]{cursor:pointer; user-select:none;}
.scr-table thead th[data-sort]:hover{color:var(--green);}
.scr-table tbody td{
  padding:8px 12px; border-bottom:1px solid #101c2e; white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.scr-table tbody tr{cursor:pointer;}
.scr-table tbody tr:hover{background:#0a1524;}
.scr-table .sym{font-weight:400; letter-spacing:.3px; color:var(--ink);}
.scr-table .nm{color:#c6d6ea; max-width:340px; overflow:hidden; text-overflow:ellipsis;}
.scr-table .sec{color:var(--dim); font-size:12px;}
.scr-table .rank{color:var(--dim); font-size:12px; text-align:right;}
.scr-table .up{color:var(--green); font-weight:400;}
.scr-table .dn{color:var(--red); font-weight:400;}
.scr-add{
  background:transparent; color:var(--green); border:1.5px solid rgba(30,227,8,.55);
  border-radius:7px; width:28px; height:26px; font-size:15px; font-weight:400;
  cursor:pointer; font-family:inherit; line-height:1;
}
.scr-add:hover{background:rgba(30,227,8,.14);}
.scr-add:disabled{opacity:.55; cursor:default;}
.scr-add.added{color:#03140a; background:var(--green); border-color:var(--green);}
.scr-empty{
  padding:34px 16px; text-align:center; color:var(--dim);
  font-size:13.5px; font-weight:400; letter-spacing:.4px; line-height:1.5;
}
/* The feed's ceiling under a volume-emptied table (API topVolume):
   the highest-volume name in the served dataset. */
.scr-topvol{color:#9fb6d8; font-size:12.5px; letter-spacing:.3px;}

@media (max-width:1180px){
  .scr-table .nm, .scr-table .c-float, .scr-table .c-dtc{display:none;}
}

@media (max-width:760px){
  .scr-table .sec-h, .scr-table .sec, .scr-table .c-trades, .scr-table .c-flow{display:none;}
}

@media (max-width:900px){
  .scr-view{margin:6px;}
  .scr-head{gap:10px; padding:8px 10px;}
  .scr-controls{margin-left:0;}
  .scr-table .nm{max-width:130px;}
  .scr-table .sec{display:none;}
  .scr-table thead th.sec-h{display:none;}
}