/* ============================================================
   position-card.css
   Usage: A single trading position (stock, spread, covered call)
   Anatomy: Ticker/qty header | P&L right | Details below
   ============================================================ */

.position-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-4) var(--space-5);
    background: var(--bg-elevated);
    border-bottom: 0.5px solid var(--separator);
    transition: background-color var(--duration-fast) var(--ease-smooth);
}

.position-card:last-child {
    border-bottom: none;
}

.position-card:hover {
    background: var(--bg-tertiary);
}

.position-card__main {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    min-width: 0; /* allow truncation */
}

.position-card__header {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.position-card__ticker {
    font-size: var(--text-headline);
    font-weight: var(--weight-semibold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-normal);
}

.position-card__meta {
    font-size: var(--text-caption);
    color: var(--text-tertiary);
    font-variant-numeric: tabular-nums;
}

.position-card__details {
    font-size: var(--text-footnote);
    color: var(--text-secondary);
}

.position-card__side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: var(--space-1);
    text-align: right;
}

.position-card__pnl {
    font-size: var(--text-callout);
    font-weight: var(--weight-semibold);
    font-variant-numeric: tabular-nums;
    letter-spacing: var(--tracking-normal);
}

.position-card__pnl--positive {
    color: var(--success);
}

.position-card__pnl--negative {
    color: var(--danger);
}

.position-card__pnl-pct {
    font-size: var(--text-footnote);
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
}

/* Alert state: position that needs attention */
.position-card--alert {
    background: var(--warning-subtle);
    border-left: 3px solid var(--warning);
}

/* Rule 7 state: position at +50%, stop should move to BE */
.position-card--rule7 {
    background: var(--success-subtle);
    border-left: 3px solid var(--success);
}