
/* Quanxum Portfolio Frontend v2 — Phase A */

.portfolio-chart-toolbar{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin:4px 0 8px;
}

.portfolio-chart-toolbar button{
  border:1px solid rgba(0,255,157,.22);
  background:rgba(4,24,22,.72);
  color:rgba(235,255,249,.68);
  border-radius:999px;
  padding:7px 12px;
  font:600 10px/1 inherit;
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
}

.portfolio-chart-toolbar button.active{
  color:#00ff9d;
  border-color:rgba(0,255,157,.58);
  background:rgba(0,255,157,.10);
}

.weekly-bar.up{
  fill:#00ff9d;
  opacity:.82;
}

.weekly-bar.down{
  fill:#ff6c62;
  opacity:.82;
}

.public-positions-panel{
  min-width:0;
  overflow:hidden;
}

.public-position-head,
.public-position-row{
  display:grid;
  grid-template-columns:minmax(120px,1.35fr) minmax(90px,.95fr) 70px 90px 90px 90px;
  gap:12px;
  align-items:center;
}

.public-position-head{
  padding:8px 10px;
  color:rgba(225,255,246,.46);
  font-size:9px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  border-bottom:1px solid rgba(0,255,157,.10);
}

#portfolio-open-positions{
  max-height:210px;
  overflow:auto;
}

.public-position-row{
  padding:9px 10px;
  border-bottom:1px solid rgba(0,255,157,.07);
  color:rgba(240,255,250,.84);
  font-size:11px;
}

.public-position-symbol{
  color:#fff;
  font-weight:700;
}

.portfolio-position-class{
  color:rgba(225,255,246,.56);
}

.portfolio-position-side,
.trade-side{
  color:#54f5bd;
  font-weight:700;
}

.portfolio-position-pnl.up,
.trade-pnl.up{
  color:#00ff9d;
}

.portfolio-position-pnl.down,
.trade-pnl.down{
  color:#ff6c62;
}

.portfolio-phase-a-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:12px;
}

.rotation-panel,
.track-record-panel{
  border:1px solid rgba(0,255,157,.16);
  background:rgba(3,18,17,.76);
  border-radius:14px;
  padding:14px;
  min-width:0;
}

.panel-title-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}

.panel-title-row small{
  color:#00ff9d;
  font-size:8px;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.panel-title-row h4{
  margin:3px 0 0;
}

.panel-title-row > span{
  border:1px solid rgba(0,255,157,.26);
  border-radius:999px;
  color:#00ff9d;
  padding:5px 9px;
  font-size:9px;
  font-weight:700;
}

.rotation-head,
.rotation-row{
  display:grid;
  grid-template-columns:1.15fr 1fr .75fr .65fr;
  align-items:center;
  gap:10px;
}

.rotation-head{
  padding:7px 8px;
  color:rgba(225,255,246,.42);
  font-size:8px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.rotation-row{
  padding:9px 8px;
  border-top:1px solid rgba(0,255,157,.07);
  font-size:10px;
}

.rotation-row strong{
  color:#fff;
}

.rotation-row span{
  color:rgba(225,255,246,.58);
}

.rotation-row em{
  color:#00ff9d;
  font-style:normal;
}

.rotation-row b{
  color:#52d9ff;
}

.track-record-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}

.track-record-grid > div{
  border:1px solid rgba(0,255,157,.10);
  background:rgba(7,28,26,.66);
  border-radius:10px;
  padding:10px;
}

.track-record-grid span{
  display:block;
  color:rgba(225,255,246,.45);
  font-size:8px;
  letter-spacing:.06em;
  text-transform:uppercase;
  margin-bottom:5px;
}

.track-record-grid strong{
  color:#fff;
  font-size:14px;
}

.public-trade-row,
.trade-blotter-head{
  grid-template-columns:70px minmax(110px,1.2fr) 70px 90px 90px 90px minmax(110px,1fr) !important;
}

.trade-date,
.trade-reason{
  color:rgba(225,255,246,.62);
}

.trade-reason{
  font-size:9px;
  letter-spacing:.04em;
}

@media (max-width: 980px){
  .portfolio-phase-a-grid{
    grid-template-columns:1fr;
  }

  .public-position-head,
  .public-position-row{
    grid-template-columns:1.3fr .9fr 60px 80px 80px;
  }

  .portfolio-position-current{
    display:none;
  }
}

@media (max-width: 720px){
  .public-position-head{
    display:none;
  }

  .public-position-row{
    grid-template-columns:1fr auto auto;
  }

  .portfolio-position-class,
  .portfolio-position-entry,
  .portfolio-position-current{
    display:none;
  }

  .track-record-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .public-trade-row,
  .trade-blotter-head{
    grid-template-columns:58px 1fr 55px 72px 72px 78px !important;
  }

  .trade-reason{
    display:none;
  }
}


/* PATCH 12A — Pair Position Leg Model */

.pair-position-parent{
  background:
    linear-gradient(
      90deg,
      rgba(0,255,157,.075),
      rgba(82,217,255,.025)
    );
  border-top:
    1px solid
    rgba(0,255,157,.16);
}

.pair-position-parent
.portfolio-position-symbol{
  display:flex;
  flex-direction:column;
  gap:3px;
}

.pair-position-parent
.portfolio-position-symbol small{
  color:rgba(225,255,246,.52);
  font-size:8px;
  font-weight:500;
  letter-spacing:.03em;
  white-space:normal;
}

.pair-side{
  color:#52d9ff !important;
}

.pair-leg-row{
  background:rgba(0,0,0,.13);
  padding-top:7px;
  padding-bottom:7px;
}

.pair-leg-row
.portfolio-position-symbol{
  padding-left:18px;
  color:rgba(240,255,250,.8);
}

.pair-leg-row
.portfolio-position-symbol i{
  display:inline-block;
  min-width:38px;
  margin-right:5px;
  color:rgba(82,217,255,.66);
  font-size:8px;
  font-style:normal;
  letter-spacing:.07em;
}

.portfolio-position-side.short{
  color:#ff776f;
}

.portfolio-position-side.long{
  color:#00ff9d;
}

.trade-symbol small{
  display:block;
  margin-top:2px;
  color:rgba(225,255,246,.46);
  font-size:8px;
  font-weight:500;
  white-space:normal;
}

@media (max-width:720px){
  .pair-position-parent
  .portfolio-position-symbol small{
    display:block;
  }

  .pair-leg-row
  .portfolio-position-symbol{
    padding-left:8px;
  }
}
