/* Stock hover card (_ticker_card.html: Screener, Insiders, Earnings, Watchlist) in Attio's look — DRAFT 2026-10-25,
   only under html.at-shell (?tbl=attio-full). User: "fix the popups, restyle them". Attio's record preview: 12px corners,
   hairline ring + soft shadow, sentence-case 12px labels (no tracked caps), tag pills, rows without rules. */
html.at-shell #sc-hover-card:not(#_) {
  width: 360px; padding: 16px; border: 0; border-radius: 12px; background: var(--at-pop-bg, var(--a-bg));
  box-shadow: 0 0 0 1px var(--a-line), 0 12px 32px rgba(15,17,21,.12), 0 2px 6px rgba(15,17,21,.06);
  color: var(--a-ink); font: 500 13px/18px Inter, system-ui, sans-serif; letter-spacing: -0.05px; }
html.at-shell[data-theme="dark"] #sc-hover-card:not(#_) { box-shadow: 0 0 0 1px var(--a-line), 0 16px 40px rgba(0,0,0,.5); }

/* header: logo tile · ticker / name / place · price + change pill */
html.at-shell #sc-hover-card .schc-hd { gap: 12px; align-items: center; }
html.at-shell #sc-hover-card .schc-logo { width: 36px; height: 36px; border-radius: 9px; background: var(--a-bg); box-shadow: inset 0 0 0 1px var(--a-line); padding: 3px; }
html.at-shell #sc-hover-card .schc-tkr { font-size: 15px; line-height: 20px; font-weight: 600; }
html.at-shell #sc-hover-card .schc-name { font-size: 13px; line-height: 18px; color: var(--a-mute); margin: 0; max-width: 200px; }
html.at-shell #sc-hover-card .schc-meta { font-size: 12px; line-height: 16px; color: var(--a-faint); text-transform: none; letter-spacing: 0; margin: 0; }
html.at-shell #sc-hover-card .schc-px-val { font-size: 15px; line-height: 20px; font-weight: 600; }
html.at-shell #sc-hover-card .schc-px-chg { display: inline-flex; margin-top: 4px; height: 20px; padding: 0 6px; border-radius: 6px; align-items: center;
  font-size: 12px; font-weight: 500; }
html.at-shell #sc-hover-card .schc-px-chg.schc-up { background: var(--a-pos-bg); color: var(--a-pos-ink); }
html.at-shell #sc-hover-card .schc-px-chg.schc-down { background: var(--a-neg-bg); color: var(--a-neg-ink); }
html.at-shell #sc-hover-card .schc-px-chg.schc-flat { background: var(--a-fill); color: var(--a-mute); }

/* labels: sentence case, 12px, muted */
html.at-shell #sc-hover-card :is(.schc-range-top, .schc-chart-hd, .schc-col-title, .schc-class-k) {
  text-transform: none; letter-spacing: 0; font-size: 12px; line-height: 16px; font-weight: 500; color: var(--a-mute); }
html.at-shell #sc-hover-card .schc-range { margin: 16px 0 0; }
html.at-shell #sc-hover-card .schc-range-top { margin-bottom: 8px; }
html.at-shell #sc-hover-card .schc-range-top b { color: var(--a-ink); font-weight: 600; }
html.at-shell #sc-hover-card .schc-track { height: 4px; border-radius: 4px; background: var(--a-fill); box-shadow: inset 0 0 0 1px var(--a-line); }
html.at-shell #sc-hover-card .schc-dot { width: 10px; height: 10px; background: var(--a-blue, #266DF0); box-shadow: 0 0 0 2px var(--at-pop-bg, var(--a-bg)); }
html.at-shell #sc-hover-card .schc-range-lbl { font-size: 12px; color: var(--a-mute); margin-top: 6px; }
html.at-shell #sc-hover-card .schc-chart-hd { margin: 16px 0 6px; }
html.at-shell #sc-hover-card #schc-chart-slot .skel { border-radius: 8px !important; }

/* sector / industry as Attio tag pills, side by side */
html.at-shell #sc-hover-card .schc-class { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--a-line); gap: 0 12px; }
html.at-shell #sc-hover-card .schc-class-k { margin-bottom: 6px; }
html.at-shell #sc-hover-card .schc-class-v { display: inline-block; vertical-align: top; box-sizing: border-box; max-width: 100%; height: 22px; padding: 0 7px;   /* inline-block: an inline-flex box never draws the … (long industries were sliced, 2026-11-07) */
  border-radius: 6px;
  background: var(--a-fill); box-shadow: inset 0 0 0 1px var(--a-line); font-size: 12px; font-weight: 500; line-height: 22px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* metrics: two columns, 26px rows, no rules */
html.at-shell #sc-hover-card .schc-cols { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--a-line); gap: 0 20px; }
html.at-shell #sc-hover-card .schc-cols > div + div { padding-left: 0; border-left: 0; }
html.at-shell #sc-hover-card .schc-col-title { margin-bottom: 4px; }
html.at-shell #sc-hover-card .schc-row { height: 26px; padding: 0; align-items: center; border-bottom: 0; font-size: 13px; }
html.at-shell #sc-hover-card .schc-k { color: var(--a-mute); }
html.at-shell #sc-hover-card .schc-v { font-weight: 500; color: var(--a-ink); }
html.at-shell #sc-hover-card .schc-row.is-plotted { margin: 0 -6px; padding: 0 6px; border-radius: 6px; background: rgba(38,109,240,.08); }
html.at-shell #sc-hover-card .schc-row.is-plotted :is(.schc-k, .schc-v) { color: var(--a-blue, #266DF0); }
