/* ============================================
 * PORTFOLIO PAGE — V3
 * File: css/components/portfolio.css
 * ============================================
 * 5-tab portfolio: Overview, Stock Analysis (sub-tabs), Performance,
 *                  AI Conclusion, Action Compass
 * Uses --pf-* bridge to official variables.css
 * Reuses .stk-* narrative classes from stock-detail.css
 */

/* ==========================================
 * CSS VARIABLE BRIDGE
 * ========================================== */
:root {
    --pf-bg: var(--color-bg-primary);
    --pf-bg-card: var(--color-bg-secondary);
    --pf-bg-muted: var(--color-bg-tertiary);
    --pf-text: var(--color-text-primary);
    --pf-text-sub: var(--color-text-secondary);
    --pf-text-muted: var(--color-text-muted);
    --pf-border: var(--color-border);
    --pf-border-light: #f1f5f9;
    --pf-green: var(--color-positive);
    --pf-green-bg: var(--color-positive-bg);
    --pf-red: var(--color-negative);
    --pf-red-bg: var(--color-negative-bg);
    --pf-amber: var(--color-neutral);
    --pf-amber-bg: var(--color-neutral-bg);
    --pf-blue: var(--color-accent-primary);
    --pf-indigo: var(--color-accent-secondary);
}
[data-theme="dark"] {
    --pf-border-light: #334155;
}

/* ==========================================
 * CONTAINER
 * ========================================== */
.pf-container {
    max-width: 100%;
    color: var(--pf-text);
}

/* ==========================================
 * TAB 0: OVERVIEW DASHBOARD — Compact
 * ========================================== */
.pf-dashboard-compact {
    background: var(--pf-bg-card);
    border-radius: 12px;
    border: 1px solid var(--pf-border);
    padding: 0.875rem 1.25rem;
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}
.pf-dash-hero {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    min-width: 0;
}
.pf-dash-nav {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--pf-text);
    white-space: nowrap;
}
.pf-dash-pnl {
    font-size: 0.9rem;
    white-space: nowrap;
}
.pf-dash-pnl-sub {
    font-size: 0.8rem;
    opacity: 0.75;
}
.pf-dash-pnl-note {
    font-size: 0.75rem;
    opacity: 0.6;
    margin-left: 0.375rem;
}
.pf-dash-badges {
    display: flex;
    gap: 0.375rem;
    align-items: center;
    flex-wrap: wrap;
}
.pf-dash-meta-item {
    font-size: 0.8rem;
    color: var(--pf-text-sub);
    white-space: nowrap;
}
.pf-dash-stats-strip {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-left: auto;
}
.pf-stat-chip {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.25rem 0.625rem;
    border-radius: 6px;
    background: var(--pf-bg-muted);
    min-width: 52px;
}
.pf-stat-label {
    font-size: 0.6rem;
    text-transform: uppercase;
    color: var(--pf-text-muted);
    letter-spacing: 0.04em;
    line-height: 1;
}
.pf-stat-value {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--pf-text);
    line-height: 1.3;
}

/* Risk & Grade badges */
.pf-risk-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 6px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.03em;
}
.pf-risk-badge.low { background: var(--pf-green-bg); color: var(--pf-green); }
.pf-risk-badge.medium { background: var(--pf-amber-bg); color: var(--pf-amber); }
.pf-risk-badge.high { background: var(--pf-red-bg); color: var(--pf-red); }
.pf-grade-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 6px;
    font-size: 0.7rem;
    font-weight: 700;
    background: rgba(99,102,241,0.12);
    color: var(--pf-indigo);
}

/* AI Overview Banner — prominent, before positions */
.pf-ai-banner {
    display: flex;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    border-left: 4px solid var(--pf-indigo);
    background: rgba(99,102,241,0.06);
    margin-bottom: 0.75rem;
    line-height: 1.55;
    font-size: 0.85rem;
    color: var(--pf-text);
}
[data-theme="dark"] .pf-ai-banner {
    background: rgba(99,102,241,0.1);
}
.pf-ai-banner-icon {
    font-size: 1.25rem;
    flex-shrink: 0;
    margin-top: 1px;
}
.pf-ai-banner-content {
    flex: 1;
    min-width: 0;
}
.pf-ai-banner-content h4 {
    margin: 0.25rem 0;
    font-size: 0.85rem;
}
.pf-ai-banner-content ul {
    margin: 0.25rem 0;
    padding-left: 1.25rem;
}
.pf-ai-banner-content li {
    margin-bottom: 0.15rem;
}
.pf-ai-banner-content p {
    margin: 0.2rem 0;
}

/* Overview body — positions + sector side by side */
.pf-overview-body {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 0.75rem;
    align-items: start;
}
.pf-overview-main {
    min-width: 0;
}
.pf-overview-side {
    min-width: 0;
}

/* ==========================================
 * POSITIONS TABLE
 * ========================================== */
.pf-positions-card {
    background: var(--pf-bg-card);
    border-radius: 12px;
    border: 1px solid var(--pf-border);
    padding: 0.75rem 1rem;
    margin-bottom: 0;
}
.pf-positions-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
    padding-bottom: 0.375rem;
    border-bottom: 1px solid var(--pf-border);
}
.pf-positions-title {
    font-weight: 600;
    color: var(--pf-text);
}
.pf-positions-actions {
    display: flex;
    gap: 0.5rem;
}
.pf-btn {
    padding: 4px 12px;
    border-radius: 6px;
    border: 1px solid var(--pf-border);
    background: var(--pf-bg-muted);
    color: var(--pf-text);
    cursor: pointer;
    font-size: 0.8rem;
    transition: all 0.2s;
}
.pf-btn:hover {
    background: var(--pf-blue);
    color: #fff;
    border-color: var(--pf-blue);
}
.pf-btn-save {
    background: var(--pf-green);
    color: #fff;
    border-color: var(--pf-green);
}
.pf-btn-cancel {
    background: var(--pf-red-bg);
    color: var(--pf-red);
}
.pf-btn-add {
    background: var(--pf-green-bg);
    color: var(--pf-green);
    border-color: var(--pf-green);
}

/* Positions table */
.pf-positions-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}
.pf-positions-table th {
    text-align: left;
    padding: 0.35rem 0.4rem;
    font-weight: 600;
    color: var(--pf-text-sub);
    font-size: 0.7rem;
    text-transform: uppercase;
    border-bottom: 2px solid var(--pf-border);
}
.pf-positions-table td {
    padding: 0.35rem 0.4rem;
    border-bottom: 1px solid var(--pf-border-light);
    vertical-align: middle;
}
.pf-positions-table tr:last-child td {
    border-bottom: none;
}
.pf-positions-table tr.pf-capital-row {
    background: var(--pf-bg-muted);
    font-style: italic;
    opacity: 0.85;
}
.pf-positions-table tr.pf-cash-row {
    background: var(--pf-bg-muted);
    font-style: italic;
}
.pf-positions-table .pf-total-row td {
    border-top: 2px solid var(--pf-border);
    font-weight: 700;
}
.pf-symbol {
    font-weight: 700;
    color: var(--pf-blue);
}
.pf-hl-pos { color: var(--pf-green); font-weight: 600; }
.pf-hl-neg { color: var(--pf-red); font-weight: 600; }

/* Classification badges */
.pf-classification-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
}
.pf-badge-core { background: rgba(16,185,129,0.15); color: #10b981; }
.pf-badge-pot { background: rgba(59,130,246,0.15); color: #3b82f6; }
.pf-badge-drag { background: rgba(239,68,68,0.15); color: #ef4444; }
.pf-badge-noise { background: rgba(107,114,128,0.15); color: #6b7280; }

/* Action column */
.pf-action-cell {
    font-weight: 600;
    font-size: 0.8rem;
}

/* Edit mode inputs */
.pf-positions-table input[type="text"],
.pf-positions-table input[type="number"],
.pf-positions-table input[type="date"],
.pf-positions-table select {
    padding: 4px 6px;
    border: 1px solid var(--pf-border);
    border-radius: 4px;
    background: var(--pf-bg);
    color: var(--pf-text);
    font-size: 0.8rem;
}
.pf-positions-table input[type="text"]:focus,
.pf-positions-table input[type="number"]:focus,
.pf-positions-table input[type="date"]:focus,
.pf-positions-table select:focus {
    outline: none;
    border-color: var(--pf-blue);
    box-shadow: 0 0 0 2px rgba(59,130,246,0.15);
}
.pf-delete-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    opacity: 0.6;
    transition: opacity 0.2s;
}
.pf-delete-btn:hover { opacity: 1; }

/* ==========================================
 * SECTOR BREAKDOWN
 * ========================================== */
.pf-sector-card {
    background: var(--pf-bg-card);
    border-radius: 12px;
    border: 1px solid var(--pf-border);
    padding: 0.75rem 1rem;
    margin-bottom: 0;
}
.pf-sector-title {
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: var(--pf-text);
    font-size: 0.85rem;
}
.pf-sector-bar {
    margin-bottom: 0.375rem;
}
.pf-sector-bar-header {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
    margin-bottom: 0.15rem;
    color: var(--pf-text-sub);
}
.pf-sector-bar-track {
    height: 6px;
    background: var(--pf-bg-muted);
    border-radius: 3px;
    overflow: hidden;
}
.pf-sector-bar-fill {
    height: 100%;
    background: var(--pf-indigo);
    border-radius: 3px;
    transition: width 0.3s;
}

/* ==========================================
 * TAB 1: STOCK NARRATIVE — COMPACT DASHBOARD
 * ========================================== */
.pf-stock-narrative {
    background: var(--pf-bg-card);
    border-radius: 12px;
    border: 1px solid var(--pf-border);
    margin-bottom: 0.75rem;
    overflow: hidden;
}

/* Header row — compact single line */
.pf-sn-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    flex-wrap: wrap;
    border-bottom: 2px solid var(--pf-border);
}
.pf-sn-symbol {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--pf-blue);
}
.pf-sn-sector {
    color: var(--pf-text-sub);
    font-size: 0.8rem;
}
.pf-sn-pnl {
    font-weight: 700;
    font-size: 0.95rem;
}
.pf-sn-stage {
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 0.72rem;
    font-weight: 600;
    background: var(--pf-bg-muted);
    color: var(--pf-text-sub);
}

/* Conclusion badge in header */
.stk-conclusion-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
}
.stk-conclusion-badge--bullish {
    background: var(--pf-green-bg);
    color: var(--pf-green);
}
.stk-conclusion-badge--bearish {
    background: var(--pf-red-bg);
    color: var(--pf-red);
}
.stk-conclusion-badge--neutral {
    background: var(--pf-amber-bg);
    color: var(--pf-amber);
}

/* 2-column grid */
.pf-sn-grid {
    display: grid;
    grid-template-columns: 55% 45%;
    gap: 0.75rem;
    padding: 0.75rem;
}

/* LEFT column */
.pf-sn-left {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Metrics compact table */
.pf-sn-metrics-table {
    width: 100%;
    font-size: 0.82rem;
    border-collapse: collapse;
}
.pf-sn-metrics-table td {
    padding: 0.2rem 0.4rem;
    border-bottom: 1px solid var(--pf-border-light);
}
.pf-sn-metrics-table tr:last-child td {
    border-bottom: none;
}
.pf-sn-metrics-table td:first-child {
    color: var(--pf-text-muted);
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    width: 45%;
    letter-spacing: 0.02em;
}
.pf-sn-metrics-table td:last-child {
    font-weight: 600;
    color: var(--pf-text);
}

/* RIGHT column */
.pf-sn-right {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* AI Verdict — frame-in-frame "khung lồng khung" below grid */
.pf-sn-ai-verdict {
    margin: 0 0.75rem 0.75rem;
    border-radius: 10px;
    border: 2px solid rgba(99,102,241,0.25);
    background: linear-gradient(135deg, rgba(99,102,241,0.06) 0%, rgba(99,102,241,0.01) 100%);
    overflow: hidden;
}
.pf-sn-ai-verdict-header {
    padding: 0.5rem 0.75rem;
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--pf-text);
    background: linear-gradient(135deg, rgba(99,102,241,0.12) 0%, rgba(99,102,241,0.03) 100%);
    border-bottom: 1px solid rgba(99,102,241,0.15);
}
.pf-sn-ai-verdict-inner {
    margin: 0.5rem 0.625rem 0.625rem;
    border-radius: 8px;
    border: 1px solid rgba(99,102,241,0.18);
    border-left: 4px solid var(--pf-indigo);
    background: var(--pf-bg-card);
    box-shadow: 0 1px 4px rgba(99,102,241,0.08);
}
.pf-sn-ai-verdict-body {
    padding: 0.625rem 0.75rem;
    font-size: 0.82rem;
    line-height: 1.6;
    color: var(--pf-text);
}
[data-theme="dark"] .pf-sn-ai-verdict {
    border-color: rgba(99,102,241,0.35);
    background: linear-gradient(135deg, rgba(99,102,241,0.1) 0%, rgba(99,102,241,0.02) 100%);
}
[data-theme="dark"] .pf-sn-ai-verdict-header {
    background: linear-gradient(135deg, rgba(99,102,241,0.18) 0%, rgba(99,102,241,0.05) 100%);
}
[data-theme="dark"] .pf-sn-ai-verdict-inner {
    border-color: rgba(99,102,241,0.25);
    background: var(--pf-bg-muted);
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}

/* Scenario badges inline */
.pf-sn-scenarios {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.pf-sn-scenario-bull,
.pf-sn-scenario-bear {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 0.78rem;
    font-weight: 600;
}
.pf-sn-scenario-bull {
    background: var(--pf-green-bg);
    color: var(--pf-green);
}
.pf-sn-scenario-bear {
    background: var(--pf-red-bg);
    color: var(--pf-red);
}

/* Evidence tags — horizontal pills */
.pf-sn-evidence-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}
.pf-sn-tag {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 4px;
    font-size: 0.72rem;
    font-weight: 500;
    background: var(--pf-bg-muted);
    color: var(--pf-text-sub);
    border: 1px solid var(--pf-border-light);
    white-space: nowrap;
}

/* Action footer — compact strip */
.pf-sn-footer {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    border-top: 2px solid var(--pf-border);
    font-size: 0.82rem;
    color: var(--pf-text-sub);
    flex-wrap: wrap;
}
.pf-sn-footer.pf-action-cut {
    background: var(--pf-red-bg);
    border-top-color: var(--pf-red);
}
.pf-sn-footer.pf-action-hold {
    background: var(--pf-green-bg);
    border-top-color: var(--pf-green);
}
.pf-sn-footer.pf-action-watch {
    background: var(--pf-amber-bg);
    border-top-color: var(--pf-amber);
}
.pf-sn-action-badge {
    font-weight: 700;
    color: var(--pf-text);
    font-size: 0.85rem;
}

/* Link to full detail (reused in footer) */
.pf-detail-link {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 0.78rem;
    background: var(--pf-bg-muted);
    color: var(--pf-blue);
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s;
    border: 1px solid var(--pf-border);
}
.pf-detail-link:hover {
    background: var(--pf-blue);
    color: #fff;
    border-color: var(--pf-blue);
}

/* No data prompt for missing stock_detail */
.pf-stock-no-data {
    text-align: center;
    padding: 2rem;
    color: var(--pf-text-sub);
}
.pf-live-btn {
    margin-top: 0.75rem;
    padding: 8px 20px;
    border-radius: 8px;
    border: none;
    background: var(--pf-indigo);
    color: #fff;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s;
}
.pf-live-btn:hover {
    filter: brightness(1.1);
    transform: translateY(-1px);
}

/* ==========================================
 * TAB 2: PERFORMANCE
 * ========================================== */
.pf-chart-block {
    background: var(--pf-bg-card);
    border-radius: 12px;
    border: 1px solid var(--pf-border);
    padding: 0.75rem 1rem;
    margin-bottom: 0.75rem;
}
.pf-chart-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.375rem;
    flex-wrap: wrap;
    gap: 0.375rem;
}
.pf-chart-title {
    font-weight: 600;
    color: var(--pf-text);
}
.pf-period-selector {
    display: flex;
    gap: 0.25rem;
    flex-wrap: wrap;
}
.pf-period-group {
    display: flex;
    gap: 2px;
    align-items: center;
    margin-right: 0.5rem;
}
.pf-period-group-label {
    font-size: 0.7rem;
    color: var(--pf-text-muted);
    margin-right: 2px;
}
.pf-period-btn {
    padding: 3px 8px;
    border-radius: 4px;
    border: 1px solid var(--pf-border);
    background: var(--pf-bg-muted);
    color: var(--pf-text-sub);
    cursor: pointer;
    font-size: 0.75rem;
    transition: all 0.2s;
}
.pf-period-btn.active,
.pf-period-btn:hover {
    background: var(--pf-indigo);
    color: #fff;
    border-color: var(--pf-indigo);
}
.pf-chart-container {
    height: 220px;
    position: relative;
}
.pf-chart-legend {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
    font-size: 0.8rem;
    color: var(--pf-text-sub);
}
.pf-legend-item {
    display: flex;
    align-items: center;
    gap: 4px;
}
.pf-legend-dot {
    width: 10px;
    height: 3px;
    border-radius: 2px;
}
.pf-chart-note {
    font-size: 0.7rem;
    color: var(--pf-text-muted);
    margin-top: 0.25rem;
}

/* Quick stats row */
.pf-quick-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}
.pf-quick-stat {
    background: var(--pf-bg-card);
    border-radius: 10px;
    border: 1px solid var(--pf-border);
    padding: 0.75rem 1rem;
    text-align: center;
}
.pf-qs-label {
    font-size: 0.7rem;
    text-transform: uppercase;
    color: var(--pf-text-muted);
    letter-spacing: 0.05em;
}
.pf-qs-value {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--pf-text);
    margin: 0.25rem 0;
}
.pf-qs-sub {
    font-size: 0.75rem;
    color: var(--pf-text-sub);
}

/* Stock performance table (Tab 2) */
.pf-perf-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}
.pf-perf-table th {
    text-align: left;
    padding: 0.5rem;
    font-weight: 600;
    color: var(--pf-text-sub);
    font-size: 0.75rem;
    text-transform: uppercase;
    border-bottom: 2px solid var(--pf-border);
}
.pf-perf-table td {
    padding: 0.5rem;
    border-bottom: 1px solid var(--pf-border-light);
}

/* ==========================================
 * TAB 1: STOCK SUB-TABS
 * ========================================== */
.pf-stock-subtabs {
    display: flex;
    gap: 0.375rem;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--pf-border);
}
.pf-stock-tab {
    padding: 6px 14px;
    border-radius: 8px;
    border: 1px solid var(--pf-border);
    background: var(--pf-bg-card);
    color: var(--pf-text);
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 6px;
    position: relative;
}
.pf-stock-tab::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}
.pf-stock-tab-ok::before { background: var(--pf-green); }
.pf-stock-tab-warn::before { background: var(--pf-amber); }
.pf-stock-tab-danger::before { background: var(--pf-red); }
.pf-stock-tab.active {
    background: var(--pf-indigo);
    color: #fff;
    border-color: var(--pf-indigo);
}
.pf-stock-tab.active .pf-stock-tab-pnl {
    color: rgba(255,255,255,0.85);
}
.pf-stock-tab:hover:not(.active) {
    background: var(--pf-bg-muted);
    border-color: var(--pf-indigo);
}
.pf-stock-tab-pnl {
    font-size: 0.75rem;
    font-weight: 500;
}
.pf-stock-contents {
    min-height: 200px;
}
.pf-stock-tab-content {
    display: none;
}
.pf-stock-tab-content.active {
    display: block;
}

/* ==========================================
 * EMBEDDED AI BLOCKS (reuses .stk-ai-block from stock-detail.css)
 * ========================================== */
.pf-embedded-ai {
    margin-top: 1.5rem;
}

/* ==========================================
 * TAB 3: AI CONCLUSION
 * ========================================== */
.pf-conclusion-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.pf-conclusion-title {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--pf-text);
}
.pf-conclusion-meta {
    font-size: 0.75rem;
    color: var(--pf-text-muted);
}
.pf-conclusion-section {
    background: var(--pf-bg-card);
    border-radius: 10px;
    border: 1px solid var(--pf-border);
    margin-top: 1rem;
    overflow: hidden;
}
.pf-conclusion-section-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--pf-text);
    transition: background 0.15s;
    user-select: none;
}
.pf-conclusion-section-header:hover {
    background: var(--pf-bg-muted);
}
.pf-conclusion-toggle {
    font-size: 0.7rem;
    transition: transform 0.2s;
    color: var(--pf-text-muted);
}
.pf-conclusion-section.collapsed .pf-conclusion-toggle {
    transform: rotate(-90deg);
}
.pf-conclusion-body {
    padding: 0 1rem 1rem;
    line-height: 1.6;
    color: var(--pf-text);
    font-size: 0.9rem;
}
.pf-conclusion-body h4 { margin: 0.75rem 0 0.5rem; color: var(--pf-text); }
.pf-conclusion-body ul { margin: 0.5rem 0; padding-left: 1.5rem; }
.pf-conclusion-body li { margin-bottom: 0.25rem; }
.pf-conclusion-section.collapsed .pf-conclusion-body {
    display: none;
}

/* ==========================================
 * TAB 4: ACTION — 3 Sub-tabs
 * ========================================== */
.pf-action-subtabs {
    margin-bottom: 0.75rem;
}
.pf-action-sub {
    min-height: 100px;
}

/* 1-col stacked layout: sentiment + stats */
.pf-action-2col {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.pf-action-2col-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}
.pf-action-2col-stats .pf-stat-chip {
    flex: 1;
    min-width: 70px;
}

/* Action cards 1-col stacked */
.pf-action-cards-grid {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Compact verdict table */
.pf-verdict-compact {
    font-size: 0.8rem;
}
.pf-verdict-compact td {
    padding: 4px 8px;
}
.pf-verdict-compact th {
    padding: 4px 8px;
    font-size: 0.7rem;
}
.pf-verdict-compact-reason {
    font-size: 0.72rem;
    color: var(--pf-text-sub);
}

/* ==========================================
 * TAB 4: ACTION COMPASS (legacy)
 * ========================================== */
.pf-action-compass {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.pf-action-top-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    align-items: start;
}

/* Market Mode Strip */
.pf-market-mode-strip {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    border: 1px solid var(--pf-border);
}
.pf-market-mode-icon { font-size: 1.2rem; }
.pf-market-mode-label { font-weight: 700; font-size: 1rem; }
.pf-market-mode-breadth { font-weight: 400; color: var(--pf-text-sub); font-size: 0.85rem; }
.pf-market-mode-advice { font-weight: 400; color: var(--pf-text-sub); font-size: 0.85rem; }
.pf-market-mode-overbought { background: rgba(239,68,68,0.08); border-color: rgba(239,68,68,0.3); color: var(--pf-red); }
.pf-market-mode-optimal { background: rgba(16,185,129,0.08); border-color: rgba(16,185,129,0.3); color: var(--pf-green); }
.pf-market-mode-normal { background: rgba(59,130,246,0.08); border-color: rgba(59,130,246,0.3); color: var(--pf-blue); }
.pf-market-mode-cautious { background: rgba(245,158,11,0.08); border-color: rgba(245,158,11,0.3); color: var(--pf-amber); }
.pf-market-mode-defensive { background: rgba(239,68,68,0.1); border-color: rgba(239,68,68,0.4); color: var(--pf-red); }

/* Action Cards Section */
.pf-action-cards-section {
    background: var(--pf-bg-card);
    border-radius: 10px;
    border: 1px solid var(--pf-border);
    padding: 0.75rem;
}
.pf-action-cards-title {
    font-weight: 700;
    margin-bottom: 0.5rem;
    color: var(--pf-text);
    font-size: 0.85rem;
}

/* Enhanced Action Card */
.pf-action-card {
    border-radius: 8px;
    border-left: 4px solid;
    margin-bottom: 0.5rem;
    background: var(--pf-bg-card);
    border: 1px solid var(--pf-border);
    overflow: hidden;
}
.pf-action-card.pf-urgency-5 { border-left: 4px solid #ef4444; background: rgba(239,68,68,0.04); }
.pf-action-card.pf-urgency-4 { border-left: 4px solid #f97316; background: rgba(249,115,22,0.04); }
.pf-action-card.pf-urgency-3 { border-left: 4px solid #f59e0b; background: rgba(245,158,11,0.04); }
.pf-action-card.pf-urgency-2 { border-left: 4px solid #10b981; background: rgba(16,185,129,0.04); }
.pf-action-card.pf-urgency-1 { border-left: 4px solid #6b7280; }
.pf-action-card-header {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 0.75rem 0.125rem;
}
.pf-action-card-icon { font-size: 1rem; }
.pf-action-card-symbol {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--pf-blue);
}
.pf-action-card-label {
    font-weight: 700;
    font-size: 0.75rem;
    padding: 1px 6px;
    border-radius: 3px;
    background: var(--pf-bg-muted);
    color: var(--pf-text);
}
.pf-action-card-body {
    padding: 0.125rem 0.75rem 0.5rem;
}
.pf-action-card-metrics {
    font-size: 0.75rem;
    color: var(--pf-text-sub);
    margin-bottom: 0.125rem;
}
.pf-action-card-instruction {
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--pf-text);
}

/* 3-layer signal rows */
.pf-action-signal {
    display: flex;
    gap: 8px;
    align-items: baseline;
    font-size: 0.75rem;
    line-height: 1.45;
    padding: 3px 0;
    border-bottom: 1px dashed var(--pf-border-light);
}
.pf-action-signal:last-of-type { border-bottom: none; }
.pf-action-signal-label {
    flex-shrink: 0;
    font-weight: 600;
    min-width: 62px;
}
.pf-action-signal--tech .pf-action-signal-label { color: var(--pf-blue); }
.pf-action-signal--ai .pf-action-signal-label { color: var(--pf-indigo); }
.pf-action-signal-text { color: var(--pf-text-sub); }
.pf-action-signal--ai .pf-action-signal-text { color: var(--pf-text); }
.pf-action-conclusion {
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--pf-text);
    padding-top: 4px;
    margin-top: 2px;
    border-top: 1.5px solid var(--pf-border);
}

/* Golden Rules */
.pf-golden-rules {
    background: var(--pf-bg-card);
    border-radius: 10px;
    border: 1px solid var(--pf-border);
    padding: 0.75rem;
}
.pf-golden-rules-title {
    font-weight: 700;
    margin-bottom: 0.5rem;
    color: var(--pf-text);
    font-size: 0.85rem;
}
.pf-rule-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0;
    font-size: 0.85rem;
    color: var(--pf-text);
}
.pf-rule-icon { font-size: 1rem; }
.pf-rule-text { flex: 1; }

/* ==========================================
 * DISCLAIMER
 * ========================================== */
.pf-disclaimer {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    background: var(--pf-bg-muted);
    color: var(--pf-text-muted);
    font-size: 0.8rem;
    margin-top: 1rem;
}

/* ==========================================
 * TAB 2: COMPACT PERFORMANCE STATS STRIP
 * ========================================== */
.pf-perf-stats-strip {
    display: flex;
    gap: 0.375rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
    padding: 0.375rem 0.75rem;
    background: var(--pf-bg-card);
    border-radius: 10px;
    border: 1px solid var(--pf-border);
}

/* ==========================================
 * TAB 3: ALLOCATION
 * ========================================== */
.pf-alloc-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}
.pf-alloc-bar-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0;
}
.pf-alloc-label {
    min-width: 70px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--pf-text);
}
.pf-alloc-bar-container {
    flex: 1;
    height: 8px;
    background: var(--pf-bg-muted);
    border-radius: 4px;
    overflow: hidden;
}
.pf-alloc-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s;
}
.pf-alloc-pct {
    min-width: 40px;
    text-align: right;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--pf-text);
}

/* ==========================================
 * TAB 4: VERDICT TABLE
 * ========================================== */
.pf-verdict-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}
.pf-verdict-table th {
    text-align: left;
    padding: 0.4rem 0.5rem;
    font-weight: 600;
    color: var(--pf-text-sub);
    font-size: 0.75rem;
    text-transform: uppercase;
    border-bottom: 2px solid var(--pf-border);
}
.pf-verdict-table td {
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid var(--pf-border-light);
    vertical-align: middle;
}
.pf-verdict-action {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 700;
}
.pf-verdict-cut { background: var(--pf-red-bg); color: var(--pf-red); }
.pf-verdict-watch { background: rgba(249,115,22,0.12); color: #f97316; }
.pf-verdict-tp { background: var(--pf-amber-bg); color: var(--pf-amber); }
.pf-verdict-hold { background: var(--pf-bg-muted); color: var(--pf-text-sub); }
.pf-verdict-buy { background: var(--pf-green-bg); color: var(--pf-green); }

/* ==========================================
 * TAB 5: SWAP & NEW BUY CARDS
 * ========================================== */
.pf-swap-section {
    background: var(--pf-bg-card);
    border-radius: 10px;
    border: 1px solid var(--pf-border);
    padding: 0.75rem;
}
.pf-swap-cards-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.pf-swap-card {
    border-radius: 8px;
    border: 1px solid var(--pf-border);
    border-left: 4px solid var(--pf-blue);
    padding: 0.5rem 0.75rem;
    background: var(--pf-bg-card);
}
.pf-swap-card-header {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-weight: 600;
    font-size: 0.8rem;
    margin-bottom: 0.125rem;
}
.pf-swap-arrow {
    font-size: 1.1rem;
    color: var(--pf-blue);
    font-weight: 700;
}
.pf-swap-from {
    font-weight: 600;
}
.pf-swap-to {
    font-weight: 700;
    color: var(--pf-green);
}
.pf-swap-card-body {
    font-size: 0.75rem;
    color: var(--pf-text-sub);
}
.pf-swap-card-reason {
    font-size: 0.72rem;
    color: var(--pf-text-muted);
    margin-top: 0.125rem;
    font-style: italic;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.pf-swap-card-ai {
    font-size: 0.72rem;
    color: var(--pf-indigo);
    margin-top: 0.25rem;
    padding-top: 0.25rem;
    border-top: 1px dashed var(--pf-border-light);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.pf-new-buy-card {
    border-radius: 8px;
    border: 1px solid var(--pf-border);
    border-left: 4px solid var(--pf-green);
    padding: 0.5rem 0.75rem;
    background: var(--pf-bg-card);
}

/* AI Detail — full-width below the 2-col grid */
.pf-action-ai-detail {
    margin-top: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* ==========================================
 * ENTRY-AWARE — V5 ADDITIONS
 * ========================================== */

/* Entry Info Banner (Tab 1 — shows entry date, cost, holding days, alpha) */
.pf-entry-info-banner {
    display: flex;
    gap: 1rem;
    padding: 0.6rem 0.8rem;
    background: var(--pf-bg-muted);
    border-radius: 8px;
    border: 1px solid var(--pf-border);
    margin: 0.5rem 0;
    flex-wrap: wrap;
}
.pf-entry-info-item {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 80px;
}
.pf-entry-info-label {
    color: var(--pf-text-muted);
    text-transform: uppercase;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.03em;
}
.pf-entry-info-value {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--pf-text);
}

/* Dual SL/TP Strip (Tab 1 — user vs technical comparison) */
.pf-dual-sl-strip {
    border: 1px solid var(--pf-border);
    border-radius: 8px;
    overflow: hidden;
    margin: 0.5rem 0;
    font-size: 0.82rem;
}
.pf-dual-sl-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.45rem 0.8rem;
    border-bottom: 1px solid var(--pf-border);
    flex-wrap: wrap;
}
.pf-dual-sl-row:last-child {
    border-bottom: none;
}
.pf-dual-sl-label {
    min-width: 140px;
    font-weight: 600;
    color: var(--pf-text-sub);
    font-size: 0.75rem;
}
.pf-dual-sl-item {
    font-weight: 500;
    color: var(--pf-text);
}
.pf-dual-sl-recommend {
    padding: 0.45rem 0.8rem;
    background: var(--pf-green-bg);
    color: var(--pf-green);
    font-weight: 600;
    font-size: 0.82rem;
}
.pf-dual-sl-refs {
    padding: 0.3rem 0.8rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    border-top: 1px solid var(--pf-border);
}
.pf-dual-sl-ref-item {
    font-size: 0.72rem;
    color: var(--pf-text-sub);
    background: var(--pf-bg-surface);
    padding: 0.15rem 0.5rem;
    border-radius: 3px;
    white-space: nowrap;
}

/* Entry cell in positions table (compact) */
.pf-entry-cell {
    font-size: 0.78rem;
    color: var(--pf-text-sub);
    white-space: nowrap;
}

/* SL comparison in action cards */
.pf-action-card-sl-compare {
    padding: 0.3rem 0;
    font-size: 0.78rem;
    color: var(--pf-text-sub);
    background: var(--pf-bg-muted);
    padding: 0.3rem 0.5rem;
    border-radius: 4px;
    margin: 0.25rem 0;
}

/* Close Position Button */
.pf-cg-close-btn {
    margin-top: 8px;
    padding: 6px 14px;
    border: 1px solid var(--pf-border);
    border-radius: 6px;
    background: var(--pf-bg-card);
    color: var(--pf-text);
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s;
}
.pf-cg-close-btn:hover {
    background: var(--pf-red);
    color: #fff;
    border-color: var(--pf-red);
}

/* Close Position Modal */
.pf-modal-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}
.pf-modal-content {
    background: var(--pf-bg-card);
    border-radius: 12px;
    border: 1px solid var(--pf-border);
    width: 420px;
    max-width: 90vw;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.pf-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid var(--pf-border);
    font-weight: 600;
    font-size: 15px;
}
.pf-modal-close {
    cursor: pointer;
    font-size: 22px;
    opacity: 0.6;
    line-height: 1;
}
.pf-modal-close:hover { opacity: 1; }
.pf-modal-body {
    padding: 20px;
}
.pf-modal-body label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    opacity: 0.8;
}

/* Toast */
.pf-toast {
    position: fixed;
    bottom: 24px;
    right: 24px;
    padding: 12px 24px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    z-index: 10000;
    animation: pf-toast-in 0.3s ease;
}
.pf-toast-success { background: var(--pf-green); color: #fff; }
@keyframes pf-toast-in {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ==========================================
 * PORTFOLIO REANALYZE PIPELINE
 * ========================================== */

/* Button in dashboard badges — prominent CTA */
.pf-reanalyze-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 5px 14px;
    border-radius: 8px;
    border: 1.5px solid var(--pf-indigo);
    background: var(--pf-indigo);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(99,102,241,0.3);
    letter-spacing: 0.01em;
}
.pf-reanalyze-btn:hover {
    background: #5b5bd6;
    border-color: #5b5bd6;
    box-shadow: 0 3px 10px rgba(99,102,241,0.4);
    transform: translateY(-1px);
}
.pf-reanalyze-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}
.pf-reanalyze-btn.pf-reanalyze-loading {
    background: var(--pf-indigo);
    color: #fff;
    position: relative;
    overflow: hidden;
}
.pf-reanalyze-btn.pf-reanalyze-loading::after {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    animation: pf-pra-shimmer 1.5s infinite;
}
@keyframes pf-pra-shimmer {
    to { left: 100%; }
}

/* Pipeline progress section */
.pf-pra-section {
    background: var(--pf-bg-card);
    border-radius: 10px;
    border: 1px solid var(--pf-border);
    padding: 0.75rem 1rem;
    margin-bottom: 0.75rem;
}
.pf-pra-header {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--pf-text);
    margin-bottom: 0.5rem;
}

/* Progress bar */
.pf-pra-progress-bar {
    height: 6px;
    background: var(--pf-bg-muted);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 0.25rem;
}
.pf-pra-progress-fill {
    height: 100%;
    background: var(--pf-indigo);
    border-radius: 3px;
    transition: width 0.4s ease;
}
.pf-pra-pct {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--pf-text-sub);
    text-align: right;
    margin-bottom: 0.5rem;
}

/* Steps list */
.pf-pra-steps {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.pf-pra-step {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.82rem;
    color: var(--pf-text);
}
.pf-pra-step-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    border: 2px solid var(--pf-border);
    background: transparent;
    transition: all 0.3s;
}
.pf-pra-step-dot.pf-pra-pending {
    border-color: var(--pf-border);
    background: transparent;
}
.pf-pra-step-dot.pf-pra-running {
    border-color: var(--pf-indigo);
    background: var(--pf-indigo);
    animation: pf-pra-pulse 1s infinite;
}
.pf-pra-step-dot.pf-pra-done {
    border-color: var(--pf-green);
    background: var(--pf-green);
}
@keyframes pf-pra-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(99,102,241,0.4); }
    50% { box-shadow: 0 0 0 4px rgba(99,102,241,0); }
}
.pf-pra-step-label {
    flex: 1;
    min-width: 0;
}
.pf-pra-step-detail {
    font-size: 0.72rem;
    color: var(--pf-text-muted);
    white-space: nowrap;
}

/* Result banner */
.pf-pra-result {
    margin-top: 0.5rem;
    padding: 0.4rem 0.6rem;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
}
.pf-pra-result.pf-pra-success {
    background: var(--pf-green-bg);
    color: var(--pf-green);
}
.pf-pra-result.pf-pra-error {
    background: var(--pf-red-bg);
    color: var(--pf-red);
}

/* ==========================================
 * AI REPORT BLOCK (money-flow style: outer block → nested sub-sections)
 * ========================================== */

/* Outer container — like .block in money-flow */
.pf-ai-report {
    background: var(--pf-bg-card);
    border-radius: 12px;
    border: 1px solid var(--pf-border);
    overflow: hidden;
    margin-bottom: 0.75rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
[data-theme="dark"] .pf-ai-report {
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

/* Report header — gradient accent bar */
.pf-ai-report-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--pf-text);
    background: linear-gradient(135deg, rgba(99,102,241,0.1) 0%, rgba(99,102,241,0.02) 100%);
    border-bottom: 2px solid rgba(99,102,241,0.15);
}
[data-theme="dark"] .pf-ai-report-header {
    background: linear-gradient(135deg, rgba(99,102,241,0.15) 0%, rgba(99,102,241,0.04) 100%);
}

/* Report body — vertical stack of sub-sections */
.pf-ai-report-body {
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

/* Sub-section card within report */
.pf-ai-section {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    border: 1px solid var(--pf-border);
    border-left: 4px solid var(--pf-blue);
    background: var(--pf-bg-muted);
}
.pf-ai-section-title {
    font-weight: 700;
    font-size: 0.82rem;
    color: var(--pf-text);
    margin-bottom: 0.375rem;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}
.pf-ai-section-body {
    font-size: 0.82rem;
    line-height: 1.55;
    color: var(--pf-text);
}
.pf-ai-section-body strong { color: var(--pf-text); }
.pf-ai-section-body ul { margin: 0.25rem 0; padding-left: 1.25rem; }
.pf-ai-section-body li { margin-bottom: 0.15rem; }
.pf-ai-section-body p { margin: 0.2rem 0; }

/* Highlight variant — prominent conclusion/health (like .overall-conclusion-box) */
.pf-ai-section--highlight {
    border-left-color: var(--pf-indigo);
    background: linear-gradient(135deg, rgba(99,102,241,0.1) 0%, rgba(99,102,241,0.03) 100%);
    border-color: rgba(99,102,241,0.2);
    border-left-width: 4px;
    box-shadow: 0 2px 8px rgba(99,102,241,0.08);
}
.pf-ai-section--highlight .pf-ai-section-title { font-size: 0.85rem; }
.pf-ai-section--highlight .pf-ai-section-body { font-size: 0.85rem; font-weight: 500; }
[data-theme="dark"] .pf-ai-section--highlight {
    background: linear-gradient(135deg, rgba(99,102,241,0.15) 0%, rgba(99,102,241,0.05) 100%);
}

/* Warning variant — risks/alerts */
.pf-ai-section--warning {
    border-left-color: var(--pf-amber);
    background: linear-gradient(135deg, rgba(245,158,11,0.08) 0%, rgba(245,158,11,0.02) 100%);
    border-color: rgba(245,158,11,0.2);
}
[data-theme="dark"] .pf-ai-section--warning {
    background: linear-gradient(135deg, rgba(245,158,11,0.1) 0%, rgba(245,158,11,0.03) 100%);
}

/* Positive variant — opportunities/recommendations */
.pf-ai-section--positive {
    border-left-color: var(--pf-green);
    background: linear-gradient(135deg, rgba(16,185,129,0.08) 0%, rgba(16,185,129,0.02) 100%);
    border-color: rgba(16,185,129,0.2);
}
[data-theme="dark"] .pf-ai-section--positive {
    background: linear-gradient(135deg, rgba(16,185,129,0.1) 0%, rgba(16,185,129,0.03) 100%);
}

/* ==========================================
 * PERFORMANCE 2-COLUMN LAYOUT
 * ========================================== */
.pf-perf-2col {
    display: grid;
    grid-template-columns: 60% 40%;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    align-items: stretch;
}
.pf-perf-2col > div > .pf-chart-block {
    margin-bottom: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.pf-perf-2col .pf-chart-container {
    flex: 1;
    min-height: 180px;
}
.pf-perf-2col .pf-perf-table {
    flex: 1;
}
.pf-perf-2col .pf-chart-block .pf-perf-table-wrap {
    flex: 1;
    overflow-y: auto;
}

/* ==========================================
 * ACTION CARD ADDITIONS
 * ========================================== */
.pf-action-card-reason {
    font-size: 0.75rem;
    color: var(--pf-text-sub);
    font-style: italic;
    padding: 0.25rem 0.75rem 0.375rem;
    border-left: 2px solid var(--pf-border);
    margin: 0 0.75rem 0.5rem;
    line-height: 1.45;
}
/* Color-coded action labels */
.pf-action-label-cut { background: var(--pf-red-bg); color: var(--pf-red); }
.pf-action-label-watch { background: rgba(249,115,22,0.12); color: #f97316; }
.pf-action-label-tp { background: var(--pf-amber-bg); color: var(--pf-amber); }
.pf-action-label-hold-trail { background: var(--pf-green-bg); color: var(--pf-green); }
.pf-action-label-hold { background: var(--pf-bg-muted); color: var(--pf-text-muted); }

/* Source tags for enhanced action cards */
.pf-action-card-sources { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.pf-source-tag { font-size: 11px; padding: 2px 8px; border-radius: 10px; font-weight: 500; }
.pf-source-tag.pf-source-sell { background: rgba(239,68,68,0.15); color: var(--pf-red); }
.pf-source-tag.pf-source-conc { background: rgba(245,158,11,0.15); color: var(--pf-amber); }
.pf-source-tag.pf-source-ai { background: rgba(99,102,241,0.15); color: var(--pf-indigo); }
.pf-source-tag.pf-source-rebal { background: rgba(16,185,129,0.15); color: var(--pf-green); }
[data-theme="dark"] .pf-source-tag { opacity: 0.9; }

/* SL auto-update banner */
.pf-sl-auto-banner {
    font-size: 0.75rem;
    color: var(--pf-green);
    background: var(--pf-green-bg);
    padding: 0.375rem 0.75rem;
    border-radius: 8px;
    margin-top: 0.5rem;
    line-height: 1.4;
}

/* ==========================================
 * WEALTH MANAGEMENT
 * ========================================== */

/* Warning highlight */
.pf-hl-warn { color: var(--pf-amber); font-weight: 600; }

/* Wealth Management Strip */
.pf-wealth-strip {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding: 0.375rem 0;
    border-top: 1px dashed var(--pf-border);
    margin-top: 0.25rem;
}
.pf-wealth-strip .pf-stat-label {
    white-space: nowrap;
    font-size: 0.58rem;
}
.pf-wealth-strip .pf-stat-chip {
    min-width: 72px;
}

/* Backtest Accuracy Strip */
.pf-backtest-strip {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding: 0.375rem 0;
    border-top: 1px dashed var(--pf-border);
    margin-top: 0.125rem;
}
.pf-backtest-strip .pf-stat-label {
    white-space: nowrap;
    font-size: 0.58rem;
}
.pf-backtest-strip .pf-stat-chip {
    min-width: 60px;
}
.pf-backtest-note {
    font-size: 0.65rem;
    opacity: 0.6;
    text-align: center;
    padding: 0.125rem 0 0.25rem;
}

/* Recovery Banner */
.pf-recovery-banner {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    border-left: 4px solid var(--pf-amber);
    background: linear-gradient(135deg, rgba(245,158,11,0.08), rgba(245,158,11,0.02));
    margin-bottom: 0.75rem;
}
.pf-recovery-banner.pf-recovery-challenging {
    border-left-color: var(--pf-red);
    background: linear-gradient(135deg, rgba(239,68,68,0.08), rgba(239,68,68,0.02));
}
.pf-recovery-banner.pf-recovery-medium {
    border-left-color: var(--pf-amber);
}
.pf-recovery-header {
    font-weight: 700;
    font-size: 0.9rem;
}
.pf-recovery-phases {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.78rem;
    margin-top: 0.375rem;
}
.pf-recovery-phase {
    padding: 0.25rem 0.625rem;
    background: var(--pf-bg-muted);
    border-radius: 4px;
}
.pf-recovery-timeline {
    font-size: 0.75rem;
    opacity: 0.75;
    margin-top: 0.25rem;
}

/* Dark mode overrides */
[data-theme="dark"] .pf-recovery-banner {
    background: linear-gradient(135deg, rgba(245,158,11,0.12), rgba(245,158,11,0.04));
}
[data-theme="dark"] .pf-recovery-banner.pf-recovery-challenging {
    background: linear-gradient(135deg, rgba(239,68,68,0.12), rgba(239,68,68,0.04));
}

/* ==========================================
 * RESPONSIVE
 * ========================================== */
@media (max-width: 768px) {
    .pf-dashboard-compact { flex-direction: column; gap: 0.5rem; }
    .pf-dash-stats-strip { margin-left: 0; }
    .pf-overview-body { grid-template-columns: 1fr; }
    .pf-alloc-grid { grid-template-columns: 1fr; }
    .pf-perf-stats-strip { gap: 0.25rem; }
    .pf-stock-subtabs { gap: 0.25rem; }
    .pf-stock-tab { padding: 5px 10px; font-size: 0.8rem; }
    .pf-market-mode-strip { flex-wrap: wrap; font-size: 0.8rem; }
    .pf-conclusion-header { flex-direction: column; align-items: flex-start; }
    .pf-action-card-header { flex-wrap: wrap; }
    .pf-swap-card-header { flex-wrap: wrap; }
    .pf-action-top-grid { grid-template-columns: 1fr; }
    /* already 1-col by default */
    .pf-perf-2col { grid-template-columns: 1fr; }
    .pf-ai-report-header { font-size: 0.82rem; }
    .pf-entry-info-banner { gap: 0.5rem; }
    .pf-entry-info-item { min-width: 60px; }
    .pf-dual-sl-label { min-width: 100px; }
    .pf-sn-grid { grid-template-columns: 1fr; }
    .pf-sn-header { gap: 0.375rem; }
    .pf-sn-footer { gap: 0.5rem; font-size: 0.78rem; }
    .pf-wealth-strip { margin-left: 0; }
    .pf-recovery-phases { flex-direction: column; gap: 0.125rem; }
    .pf-sell-strip { margin-top: 0.25rem; }
    .pf-heat-header { font-size: 0.78rem; }
}

/* ==========================================
 * SELL SIGNAL BADGES & STRIP (Momentum Masters)
 * ========================================== */
.pf-sell-badge {
    display: inline-flex; align-items: center; gap: 0.25rem;
    padding: 0.125rem 0.5rem; border-radius: 999px;
    font-size: 0.72rem; font-weight: 600; white-space: nowrap;
}
.pf-sell-badge--critical { background: var(--color-danger-bg, #fecaca); color: var(--color-danger, #dc2626); }
.pf-sell-badge--high { background: var(--color-warning-bg, #fed7aa); color: var(--color-warning, #ea580c); }
.pf-sell-badge--moderate { background: var(--color-info-bg, #fef9c3); color: var(--color-info-text, #ca8a04); }
.pf-sell-badge--low { background: var(--pf-bg-muted); color: var(--pf-text-sub); }

.pf-sell-strip {
    margin: 0.5rem 0; padding: 0.5rem 0.75rem; border-radius: 0.5rem;
    border-left: 3px solid var(--pf-border);
    background: var(--pf-bg-card);
}
.pf-sell-strip--critical { border-left-color: var(--color-danger, #dc2626); background: var(--color-danger-bg, #fef2f2); }
.pf-sell-strip--high { border-left-color: var(--color-warning, #ea580c); background: var(--color-warning-bg, #fff7ed); }
.pf-sell-strip--moderate { border-left-color: var(--color-info-text, #ca8a04); background: var(--color-info-bg, #fefce8); }
.pf-sell-strip--low { border-left-color: var(--pf-text-muted); }

.pf-sell-strip-header {
    font-weight: 600; font-size: 0.82rem; margin-bottom: 0.375rem;
    color: var(--pf-text);
}
.pf-sell-strip-signals, .pf-sell-strip-warnings {
    display: flex; flex-wrap: wrap; gap: 0.25rem; margin-bottom: 0.25rem;
}
.pf-sell-sig {
    display: inline-block; padding: 0.125rem 0.5rem; border-radius: 0.25rem;
    font-size: 0.75rem; font-weight: 500; cursor: help;
}
.pf-sell-sig--danger { background: var(--color-danger-bg, #fecaca); color: var(--color-danger, #dc2626); }
.pf-sell-sig--warning { background: var(--color-warning-bg, #fed7aa); color: var(--color-warning, #ea580c); }
.pf-sell-sig--info { background: var(--pf-bg-muted); color: var(--pf-text-sub); }

.pf-sell-warn {
    display: inline-block; padding: 0.125rem 0.5rem; border-radius: 0.25rem;
    font-size: 0.72rem; background: var(--pf-bg-muted); color: var(--pf-text-muted);
    border: 1px dashed var(--pf-border); cursor: help;
}

.pf-sell-strip-rec {
    font-size: 0.8rem; font-style: italic; margin-top: 0.25rem;
    color: var(--pf-text-sub); padding-top: 0.25rem;
    border-top: 1px solid var(--pf-border);
}

/* ==========================================
 * BASE PATTERN STRIP
 * ========================================== */
.pf-base-strip {
    display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap;
    margin: 0.375rem 0; padding: 0.375rem 0.75rem; border-radius: 0.375rem;
    font-size: 0.78rem; border-left: 3px solid var(--pf-border);
    background: var(--pf-bg-card);
}
.pf-base--good { border-left-color: var(--color-success, #16a34a); }
.pf-base--ok { border-left-color: var(--color-info-text, #ca8a04); }
.pf-base--weak { border-left-color: var(--pf-text-muted); }

.pf-base-type { font-weight: 600; color: var(--pf-text); }
.pf-base-detail { color: var(--pf-text-sub); }
.pf-base-pivot { color: var(--color-primary, #2563eb); font-weight: 500; }

/* ==========================================
 * HEAT GAUGE (Portfolio Aggregate Risk)
 * ========================================== */
.pf-heat-gauge {
    margin: 0.5rem 0; padding: 0.5rem 0.75rem; border-radius: 0.5rem;
    background: var(--pf-bg-card); border: 1px solid var(--pf-border);
}
.pf-heat-header {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 0.82rem; margin-bottom: 0.375rem; gap: 0.5rem;
    color: var(--pf-text);
}
.pf-heat-label { font-weight: 600; }
.pf-heat-bar {
    height: 6px; background: var(--pf-bg-muted); border-radius: 3px;
    overflow: hidden;
}
.pf-heat-fill {
    height: 100%; border-radius: 3px; transition: width 0.5s ease;
}
.pf-heat--cool .pf-heat-fill { background: var(--color-success, #16a34a); }
.pf-heat--warm .pf-heat-fill { background: var(--color-info-text, #ca8a04); }
.pf-heat--hot .pf-heat-fill { background: var(--color-warning, #ea580c); }
.pf-heat--overheated .pf-heat-fill { background: var(--color-danger, #dc2626); }
.pf-heat--overheated { border-color: var(--color-danger, #dc2626); }

.pf-heat-warning {
    font-size: 0.75rem; color: var(--color-danger, #dc2626); margin-top: 0.25rem;
    padding-left: 0.25rem;
}

/* ==========================================
 * DARK MODE OVERRIDES — Momentum Masters
 * ========================================== */
[data-theme="dark"] .pf-sell-badge--critical { background: rgba(220, 38, 38, 0.2); }
[data-theme="dark"] .pf-sell-badge--high { background: rgba(234, 88, 12, 0.2); }
[data-theme="dark"] .pf-sell-badge--moderate { background: rgba(202, 138, 4, 0.2); }
[data-theme="dark"] .pf-sell-strip--critical { background: rgba(220, 38, 38, 0.08); }
[data-theme="dark"] .pf-sell-strip--high { background: rgba(234, 88, 12, 0.08); }
[data-theme="dark"] .pf-sell-strip--moderate { background: rgba(202, 138, 4, 0.08); }
[data-theme="dark"] .pf-sell-sig--danger { background: rgba(220, 38, 38, 0.15); }
[data-theme="dark"] .pf-sell-sig--warning { background: rgba(234, 88, 12, 0.15); }
[data-theme="dark"] .pf-base--good { border-left-color: var(--color-success); }
[data-theme="dark"] .pf-heat--overheated { border-color: var(--color-danger); }

/* ============================================
 * Save Status Toast
 * ============================================ */
.pf-save-status {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 10000;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transition: opacity 0.3s ease, transform 0.3s ease;
    opacity: 1;
    transform: translateY(0);
}
.pf-save-status--success { background: var(--color-success); color: #fff; }
.pf-save-status--error   { background: var(--color-danger);  color: #fff; }
.pf-save-status--warning { background: var(--color-warning); color: #1a1a2e; }
.pf-save-status--hide {
    opacity: 0;
    transform: translateY(10px);
}
[data-theme="dark"] .pf-save-status--warning { color: #fff; }

/* ─── Wave Context Strip ────── */
.pf-wave-strip {
    display: flex; align-items: center; gap: 8px;
    padding: 6px 14px; margin-top: 6px;
    background: var(--pf-bg-card);
    border: 1px solid var(--pf-border);
    border-radius: 8px; font-size: 12px;
}
.pf-wave-regime {
    padding: 2px 8px; border-radius: 4px;
    font-weight: 700; font-size: 11px; color: #fff;
}
.pf-wave-regime--bull { background: var(--color-positive, #10b981); }
.pf-wave-regime--early-bull { background: var(--color-positive, #10b981); opacity: 0.8; }
.pf-wave-regime--accumulation { background: var(--color-neutral, #6b7280); }
.pf-wave-regime--distribution { background: var(--color-warning, #f59e0b); }
.pf-wave-regime--bear { background: var(--color-negative, #ef4444); }
.pf-wave-regime--unknown { background: var(--color-neutral, #6b7280); }
.pf-wave-detail { color: var(--pf-text-sub); }
.pf-wave-avg { color: var(--pf-text-sub); font-style: italic; margin-left: auto; }

/* ═══════════════════════════════════════════════════
   AI LEARNING TAB (Tab 5)
   ═══════════════════════════════════════════════════ */
.pf-learn-section { margin-bottom: 1rem; }
.pf-learn-title {
    font-size: 0.8rem; font-weight: 700; margin-bottom: 0.5rem;
    color: var(--pf-text); display: flex; align-items: center; gap: 0.375rem;
}
.pf-learn-strip {
    display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.75rem;
}
.pf-learn-card {
    flex: 1 1 100px; min-width: 80px; padding: 0.5rem; border-radius: 8px;
    background: var(--pf-bg-card); border: 1px solid var(--pf-border); text-align: center;
}
.pf-learn-card-label { font-size: 0.6rem; opacity: 0.7; }
.pf-learn-card-value { font-size: 0.9rem; font-weight: 700; }
.pf-learn-card-value.positive { color: var(--color-positive, #10b981); }
.pf-learn-card-value.negative { color: var(--color-negative, #ef4444); }
.pf-learn-card-value.warn { color: #f59e0b; }

/* Consistency issue cards */
.pf-learn-issue {
    padding: 0.5rem 0.75rem; border-radius: 6px; margin-bottom: 0.375rem;
    border-left: 3px solid; font-size: 0.7rem; line-height: 1.4;
}
.pf-learn-issue.high {
    border-color: var(--color-negative, #ef4444);
    background: color-mix(in srgb, var(--color-negative, #ef4444) 8%, var(--pf-bg-card));
}
.pf-learn-issue.moderate {
    border-color: #f59e0b;
    background: color-mix(in srgb, #f59e0b 8%, var(--pf-bg-card));
}
.pf-learn-issue.low {
    border-color: var(--pf-border);
    background: var(--pf-bg-card);
}
.pf-learn-issue-type {
    font-weight: 700; font-size: 0.65rem; text-transform: uppercase; margin-bottom: 0.125rem;
}

/* Grade distribution bar */
.pf-grade-bar {
    display: flex; height: 22px; border-radius: 4px; overflow: hidden; margin: 0.375rem 0;
}
.pf-grade-bar span {
    display: flex; align-items: center; justify-content: center;
    font-size: 0.55rem; font-weight: 600; color: #fff; min-width: 18px;
}
.pf-grade-a { background: var(--color-positive, #10b981); }
.pf-grade-b { background: #3b82f6; }
.pf-grade-c { background: #6b7280; }
.pf-grade-d { background: #f59e0b; }
.pf-grade-f { background: var(--color-negative, #ef4444); }

/* Pattern blocks */
.pf-learn-pattern {
    padding: 0.5rem 0.75rem; border-radius: 6px; margin-bottom: 0.375rem;
    font-size: 0.7rem; background: var(--pf-bg-card); border: 1px solid var(--pf-border);
    line-height: 1.4;
}
.pf-learn-pattern.failure { border-left: 3px solid var(--color-negative, #ef4444); }
.pf-learn-pattern.success { border-left: 3px solid var(--color-positive, #10b981); }
.pf-learn-pattern-name { font-weight: 700; font-size: 0.7rem; margin-bottom: 0.125rem; }
.pf-learn-pattern-stat { font-size: 0.6rem; opacity: 0.7; }

/* Sector table */
.pf-learn-table {
    width: 100%; border-collapse: collapse; font-size: 0.7rem;
    margin-bottom: 0.5rem;
}
.pf-learn-table th {
    text-align: left; padding: 0.375rem 0.5rem; font-weight: 700;
    border-bottom: 2px solid var(--pf-border); font-size: 0.6rem; opacity: 0.7;
}
.pf-learn-table td {
    padding: 0.3rem 0.5rem; border-bottom: 1px solid var(--pf-border);
}
.pf-learn-table tr:last-child td { border-bottom: none; }

/* AI self-assessment */
.pf-learn-assess {
    padding: 0.75rem; border-radius: 8px; background: var(--pf-bg-card);
    border: 1px solid var(--pf-border); font-size: 0.7rem; line-height: 1.5;
}

/* Empty state */
.pf-learn-empty {
    text-align: center; padding: 2rem 1rem; opacity: 0.5; font-size: 0.75rem;
}

/* ==========================================
 * MOBILE RESPONSIVE — Portfolio
 * ========================================== */
@media (max-width: 992px) {
    .pf-positions-table,
    .pf-perf-table,
    .pf-sn-metrics-table,
    .pf-learn-table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}
@media (max-width: 768px) {
    .pf-dashboard-compact { flex-direction: column; gap: 0.5rem; }
    .pf-dash-stats-strip { margin-left: 0; }
    .pf-overview-body { grid-template-columns: 1fr; }
    .pf-alloc-grid { grid-template-columns: 1fr; }
    .pf-perf-stats-strip { gap: 0.25rem; }
    .pf-action-cards-grid { grid-template-columns: 1fr; }
    .pf-chart-container { min-height: 200px; }
}