/* Shared Top Chips (Filters / Account / Demo / Reset)
   Single source of truth used by Trade Analysis + Trade Labeling.
*/

.topchip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 16px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.43);
  background:rgba(15,23,42,.8);
  color:#e2e8f0;
  font-weight:600;
  font-size:11px;
  line-height:1;
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  gap:6px;
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .12s ease;
}

/* Explicit size variants (avoid page-specific selectors). */
.topchip--sm{
  padding:6px 12px;
  font-size:10px;
}

.topchip--primary{
  background:linear-gradient(120deg,#36d2d9,#6bf0b5);
  border-color:rgba(54,210,217,.55);
  color:#020617;
  box-shadow:0 10px 25px rgba(15,23,42,.7);
}

.topchip--active{
  background:rgba(54,210,217,.2);
  border-color:rgba(54,210,217,.6);
  color:#6bf0b5;
}

.topchip:hover:not(:disabled){
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(15,23,42,.9);
}

.topchip:disabled{
  opacity:.55;
  cursor:default;
  box-shadow:none;
}

/* Earlier wrap & compact controls to avoid right-edge clipping */
@media (max-width:1100px){
  .topchip{ padding:6px 12px; }
}

/* Light theme parity with Trade Analysis */
body.theme-light .topchip{
  background:#e2e8f0;
  color:#0b162c;
  border-color:rgba(0,0,0,.08);
}