/* SymbolInsight — per-symbol charts and alerts, reusable across surfaces.
   Chart internals are styled by review.css; this file only handles layout,
   captions, and the alert grouping wrapper. */

.symbol-insight-charts {
    display: grid;
    gap: 14px;
}

.symbol-insight-charts--pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.symbol-insight-chart {
    min-width: 0;
    margin: 0;
}

.symbol-insight-chart-caption {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 2px;
}

.symbol-insight-chart-symbol {
    color: var(--text-primary);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.symbol-insight-chart-label {
    color: var(--text-secondary);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* The sparkline contract adds a top margin intended for card layouts. */
.symbol-insight-chart .review-allocation-sparkline-wrap {
    margin-top: 6px;
}

.symbol-insight-chart--lg .review-allocation-sparkline-inner,
.symbol-insight-chart--lg .review-allocation-sparkline-canvas {
    height: 150px;
}

.symbol-insight-alert-group + .symbol-insight-alert-group {
    margin-top: 16px;
}

.symbol-insight-alert-group-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.symbol-insight-alert-group-symbol {
    color: var(--text-primary);
    font-size: 14px;
    font-weight: 800;
}

.symbol-insight-alert-group-count {
    color: var(--text-secondary);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.symbol-insight-alerts-status {
    margin: 0;
    padding: 16px;
    border: 1px dashed var(--border-color);
    border-radius: 12px;
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.5;
    text-align: center;
}

.symbol-insight-alerts .alert-card-modern + .alert-card-modern {
    margin-top: 8px;
}

@media (max-width: 640px) {
    .symbol-insight-charts--pair {
        grid-template-columns: 1fr;
    }
}