/* ═══════════════════════════════════════════════
   CHART PAGE STYLES
   ═══════════════════════════════════════════════ */

.chart-header {
  flex-shrink:0;
  background:var(--bg2);
  border-bottom:1px solid var(--gold);
  padding:10px 14px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
}

.ch-left {
  display:flex;
  flex-direction:column;
  gap:4px;
}

.stock-name-big {
  font-family:'Orbitron',sans-serif;
  font-size:20px;
  font-weight:900;
  color:var(--gold);
  letter-spacing:2px;
}

.stock-legend {
  display:flex;
  gap:12px;
  font-size:9px;
  color:var(--dim);
}

.legend-item {
  display:flex;
  align-items:center;
  gap:4px;
}

.leg-line {
  width:14px;
  height:2px;
  background:var(--gold);
}

.leg-line.dashed {
  background:repeating-linear-gradient(
    90deg,
    #64b5f6 0 4px,
    transparent 4px 7px
  );
}

.ch-right {
  text-align:right;
}

.stock-price-big {
  font-family:'Orbitron',sans-serif;
  font-size:22px;
  font-weight:900;
}

.stock-chg {
  font-size:11px;
  margin-top:2px;
}

.stock-fv {
  font-size:9px;
  color:var(--dim);
  margin-top:3px;
}

.stock-fv b {
  color:var(--gold);
}

/* Timeframe + Search Row */
.tf-row {
  flex-shrink:0;
  display:flex;
  gap:4px;
  padding:8px 10px;
  background:var(--bg2);
  border-bottom:1px solid var(--border);
  align-items:center;
}

.tf-btn {
  padding:5px 12px;
  background:var(--bg3);
  border:1px solid var(--border);
  color:var(--dim);
  font-size:11px;
  font-weight:700;
  cursor:pointer;
  letter-spacing:0.5px;
}

.tf-btn.active {
  background:var(--gold);
  color:#000;
  border-color:var(--gold);
}

.stock-search {
  flex:1;
  margin-left:4px;
  background:var(--bg3);
  border:1px solid var(--bordergold);
  padding:5px 10px;
  color:var(--gold);
  font-size:11px;
  font-weight:700;
  letter-spacing:1px;
  text-align:center;
  outline:none;
  min-width:0;
}

.stock-search:focus { border-color:var(--gold); }

/* Chart Wrap */
.chart-wrap {
  flex:1;
  background:var(--bg);
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--border);
  min-height:0;
}

.chart-svg {
  width:100%;
  height:100%;
  display:block;
}

.chart-price-label {
  position:absolute;
  right:4px;
  top:50%;
  background:var(--gold);
  color:#000;
  padding:3px 8px;
  font-size:11px;
  font-weight:800;
  font-family:'Orbitron',sans-serif;
  transform:translateY(-50%);
  z-index:5;
}

/* Zoom Bar */
.zoom-bar {
  flex-shrink:0;
  background:var(--bg2);
  padding:5px 10px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid var(--border);
}

.zoom-info {
  font-size:10px;
  color:var(--dim);
}

.zoom-btns {
  display:flex;
  gap:4px;
}

.zoom-btn {
  width:26px;
  height:22px;
  background:var(--bg3);
  border:1px solid var(--border);
  color:var(--text);
  font-size:14px;
  font-weight:700;
  cursor:pointer;
}

.zoom-btn.minus {
  color:var(--red);
  border-color:var(--red);
}

.zoom-btn.plus {
  color:var(--green);
  border-color:var(--green);
}

/* Indicators Grid (16 cells, 4×4) */
.ind-grid {
  flex-shrink:0;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border-bottom:1px solid var(--border);
}

.ind-cell {
  padding:6px 4px;
  text-align:center;
  border:1px solid var(--border);
  background:var(--bg2);
}

.ind-cell.buy {
  background:#002a14;
  border-color:var(--green);
}

.ind-cell.sell {
  background:#2a0000;
  border-color:var(--red);
}

.ind-cell.ntrl {
  background:var(--bg3);
  border-color:var(--bordergold);
}

.ind-name {
  font-size:8px;
  font-weight:700;
  letter-spacing:0.5px;
}

.ind-cell.buy .ind-name { color:#66ff99; }
.ind-cell.sell .ind-name { color:#ff8888; }
.ind-cell.ntrl .ind-name { color:var(--gold); }

.ind-val {
  font-size:12px;
  font-weight:800;
  color:var(--text);
  font-family:'Orbitron',sans-serif;
  margin-top:1px;
}

.ind-sig {
  font-size:8px;
  font-weight:700;
  margin-top:1px;
  letter-spacing:1px;
}

.ind-cell.buy .ind-sig { color:var(--green); }
.ind-cell.sell .ind-sig { color:var(--red); }
.ind-cell.ntrl .ind-sig { color:var(--dim); }