/* screener.css - Screener page only. Colours and base styles come from styles.css
   (--bg, --panel, --p2, --line, --ink, --mute, --acc, --up, --dn, --warn). */
.wn{color:var(--warn)}.ac{color:var(--acc)}
/* header meta: data source, scan time, next scan */
.hh p{max-width:none}
.meta{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.meta span{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;font-size:12px;color:var(--mute);background:var(--panel);border:1px solid var(--line);border-radius:7px;white-space:nowrap}
.meta b{color:var(--ink);font-weight:500}
.meta .ico{width:13px;height:13px}
.meta .sd{width:7px;height:7px;border-radius:50%;background:var(--mute);flex:none}
.meta.ok .sd{background:var(--up);box-shadow:0 0 0 3px color-mix(in srgb,var(--up) 20%,transparent)}.meta.wn .sd{background:var(--warn)}.meta.dn .sd{background:var(--dn)}
.ico{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}

/* controls bar: one row of icon fields */
.ctl{display:flex;flex-wrap:wrap;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:6px;margin-bottom:12px}
.fld{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 4px 0 8px;color:var(--mute);background:var(--p2);border:1px solid var(--line);border-radius:7px}
.fld:hover,.fld:focus-within{border-color:color-mix(in srgb,var(--acc) 55%,var(--line))}
.fld select,.fld input{font:inherit;color:var(--ink);background:transparent;border:0;outline:0;padding:0 2px;height:28px}
.fld select{cursor:pointer;padding-right:0}
.fld input[type=number]{width:40px;text-align:right}
.fld .pre,.fld .suf{color:var(--mute)}.fld .suf{padding-right:4px}
.fld.srch{flex:1;min-width:120px;padding-right:8px}.fld.srch input{flex:1;min-width:0}
.fb{font:inherit;color:var(--ink);gap:6px;padding:0 10px;cursor:pointer}.fb .ico{color:var(--mute)}
.ctl .go{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 14px}
.ctl .go .ico{stroke:var(--onacc)}
.ctl .go:disabled{opacity:.6;cursor:wait}
.pl{display:flex;background:var(--p2);border:1px solid var(--line);border-radius:7px;padding:2px;height:30px}
.pl button{padding:0 12px;border-radius:5px;color:var(--mute)}.pl button:hover{color:var(--ink)}
.pl .on{background:var(--acc);color:var(--onacc)}
.ms{display:none!important}
.ms button{width:28px;height:26px;border:1px solid var(--line);border-radius:7px;background:var(--p2)}

/* columns menu */
.cm{position:relative}
#colBtn[aria-expanded=true]{border-color:var(--acc)}
.cmp{position:absolute;right:0;top:calc(100% + 6px);z-index:20;width:230px;max-height:70vh;overflow:auto;padding:6px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 40px rgba(0,0,0,.35)}
.cmp label{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:7px;color:var(--ink);cursor:pointer}
.cmp label:hover{background:var(--p2)}.cmp label.lk{color:var(--mute);cursor:default}
.cmp input{accent-color:var(--acc)}
.cmp .cmf{display:flex;justify-content:space-between;gap:6px;border-top:1px solid var(--line);margin-top:4px;padding:6px 4px 2px}
.cmp .cmf button{font:inherit;font-size:12px;color:var(--acc)}

/* summary cards */
.sts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:12px}
.st{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:9px 12px}
.st b{display:block;font-size:18px;font-weight:500;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st span{color:var(--mute);font-size:12px}

/* table */
.tbx{background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow-x:auto}
#tbl{width:100%;border-collapse:collapse}
#tbl th,#tbl td{padding:7px 9px;text-align:right;white-space:nowrap;vertical-align:middle}
#tbl th:first-child,#tbl td:first-child{text-align:left;padding-left:12px}
#tbl th:last-child,#tbl td:last-child{padding-right:12px}
#tbl th{font-weight:500;font-size:12px;color:var(--mute);border-bottom:1px solid var(--line);cursor:pointer;user-select:none;white-space:normal;line-height:1.2;vertical-align:bottom;position:sticky;top:0;background:var(--panel)}
#tbl th.ns{cursor:default}#tbl th:hover:not(.ns),#tbl th.on{color:var(--ink)}
#tbl th.on::after{content:" ↓";color:var(--acc)}#tbl th[aria-sort=ascending]::after{content:" ↑"}
#tbl tbody tr{border-bottom:1px solid var(--line);cursor:pointer}
#tbl tbody tr:last-child{border-bottom:0}
#tbl tbody tr:hover,#tbl tbody tr:focus-visible{background:var(--p2)}
#tbl td small{display:block;color:var(--mute);font-size:11px;font-family:'IBM Plex Sans',system-ui,sans-serif}
#tbl td small.up{color:var(--up)}#tbl td small.dn{color:var(--dn)}#tbl td small.wn{color:var(--warn)}
.coin b{font-size:13px;font-weight:600}
.coin em{font-style:normal;font-size:10px;font-weight:500;color:var(--mute);border:1px solid var(--line);border-radius:5px;padding:0 5px;margin-left:6px;vertical-align:1px}
.coin em.perp{color:var(--acc);border-color:color-mix(in srgb,var(--acc) 45%,transparent)}
.x{display:inline-block;min-width:36px;font-weight:500}
.mt{display:inline-block;width:46px;height:5px;background:var(--p2);border:1px solid var(--line);border-radius:9px;margin-left:6px;vertical-align:middle;position:relative}
.mt i{display:block;height:100%;background:var(--mute);border-radius:9px}.mt i.wn{background:var(--warn)}.mt i.up{background:var(--up)}
.mt::after{content:"";position:absolute;left:36%;top:-2px;bottom:-2px;width:1px;background:var(--mute)}
.spk{vertical-align:middle}.spk rect{fill:var(--acc);opacity:.55}.spk .lv{fill:var(--warn);opacity:1}
.sg{display:inline-block;font-size:11.5px;font-weight:600;border:1px solid currentColor;border-radius:999px;padding:1px 9px;cursor:help}
.sg.mu{border-color:var(--line)}
.empty{padding:36px!important;text-align:center!important;color:var(--mute);cursor:default}

/* phones: rows become cards, controls stack */
@media(max-width:760px){
  .sts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fld select,.fld input{font-size:16px}
  .fld.srch{flex:1 1 100%}.meta{justify-content:flex-start}
  .ms{display:flex!important}
  .tbx{overflow:visible;background:none;border:0}
  #tbl,#tbl tbody{display:block}
  #tbl thead{display:none}
  #tbl tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px;padding:10px 12px;margin-bottom:8px;background:var(--panel);border:1px solid var(--line);border-radius:10px}
  #tbl tbody tr:last-child{border-bottom:1px solid var(--line)}
  #tbl tbody td{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:0!important;text-align:left;white-space:normal;min-width:0}
  #tbl tbody td::before{content:attr(data-l);font-size:11px;color:var(--mute)}
  #tbl tbody td.coin{grid-column:1/-1;flex-direction:row;align-items:baseline;gap:8px}
  #tbl tbody td.coin::before{content:none}
  #tbl tbody td[data-l="Key levels"],#tbl tbody td[data-l="Divergence"],#tbl tbody td[data-l="Signal"]{grid-column:1/-1}
  #tbl tbody tr:has(.empty){display:block}
  #tbl tbody td.empty{display:block}
}