/* ═══════════════════════════════════════════════════════════════
   HK IPO — Stock Comparison Page Styles
   ═══════════════════════════════════════════════════════════════ */

.hdr { padding: 0 0 10px; }

.compare-content { max-width: 1400px; margin: 0 auto; padding: 0 40px 20px; }

/* ── Table ──────────────────────────────────────────────────── */
.compare-table-wrap { overflow-x: auto; margin-bottom: 24px; }
.compare-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.compare-table th { padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--c-accent);
  color: var(--c-text); font-weight: 600; font-size: 11px; letter-spacing: 1px;
  background: rgba(var(--c-text-rgb),0.06); white-space: nowrap; }
body.light .compare-table th { color: var(--c-accent); border-bottom-color: var(--c-accent); background: rgba(var(--c-text-rgb),0.04); }
.compare-table td { padding: 10px 14px; border-bottom: 1px solid rgba(var(--c-text-rgb),0.1);
  color: var(--c-text); white-space: nowrap; }
body.light .compare-table td { color: var(--c-text); border-bottom-color: rgba(var(--c-text-rgb),0.08); }
.compare-table tr:hover td { background: rgba(var(--c-text-rgb),0.02); }
body.light .compare-table tr:hover td { background: rgba(var(--c-text-rgb),0.02); }
.compare-table .metric-label { color: var(--c-text); font-weight: 500;
  font-size: 11px; letter-spacing: 0.5px; }
body.light .compare-table .metric-label { color: var(--c-sub); }

/* ── Charts ─────────────────────────────────────────────────── */
.compare-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.compare-charts .cb-wrap { min-height: 380px; }
.compare-charts .cb-wrap .cb { height: 380px; }

/* Radar chart spans full width */
.compare-charts .cb-wrap:last-child:nth-child(odd) { grid-column: 1 / -1; }
.compare-charts .cb-wrap:last-child:nth-child(odd) .cb { height: 420px; }

/* ── Mobile ──────────────────────────────────────────────────── */
@media(max-width:768px){
  .compare-content { padding: 0 16px 16px; }
  .compare-table { font-size: 12px; }
  .compare-table th, .compare-table td { padding: 8px 10px; font-size: 11px; }
  .compare-charts { grid-template-columns: 1fr; }
  .compare-charts .cb-wrap .cb { height: 300px; }
  .compare-charts .cb-wrap:last-child:nth-child(odd) { grid-column: 1; }
}

/* EVA page-specific surfaces and interaction states. */
body.eva:not(.light) .compare-table-wrap,body.eva:not(.light) .compare-charts .cb-wrap{background:#21162c;border:1px solid #61417a;border-top:3px solid #9368bd;border-radius:0}
body.eva:not(.light) .compare-table th{background:#2b1c37;color:#d5bde8;border-color:#61417a}
body.eva:not(.light) .compare-table td{border-color:#35273f}
body.eva:not(.light) .compare-table tr:hover td{background:#2c1d39}
body.eva:not(.light) .compare-table th:first-child,body.eva:not(.light) .compare-table td:first-child{position:sticky;left:0;background:#2b1c37;z-index:1;border-right:1px solid #61417a}
body.eva:not(.light) .compare-charts{grid-template-columns:repeat(2,minmax(0,1fr))}
body.eva:not(.light) .compare-charts .cb-wrap{min-width:0;padding:12px}
@media(max-width:768px){body.eva:not(.light) .compare-charts{grid-template-columns:minmax(0,1fr)}}