/* Asset list component — vertical scrollable list of .ptf-asset-row entries.
 * Reusable across portfolio pages (client_detail, portfolio_detail).
 * Loaded globally via base.html components block.
 * Tenant-aware: colors from --do-* tokens only.
 */

/* ── Asset-category palette — THE definition point ───────────────────────────
 * One colour per canonical category; the slugs match _ASSET_CATEGORIES in
 * mifid/views_portfolios.py. Consumed by:
 *   - the allocation rows + typology badges (pages/portfolio-detail.css)
 *   - the client_detail donut and its legend (js/mifid/pages/client-detail-portfolio.js,
 *     which reads these vars by slug so a category keeps its colour across pages)
 * Deliberately a fixed data-viz palette, NOT tenant-overridable: these encode
 * data, so a tenant's brand colours must not repaint them.
 * Declared on :root because JS resolves them off documentElement.
 */
:root {
    --asset-color-azioni:       #2563eb;
    --asset-color-obbligazioni: #0d9488;
    --asset-color-etf:          #7c3aed;
    --asset-color-fondi:        #db2777;
    --asset-color-etc:          #ea580c;
    --asset-color-etn:          #ca8a04;
    --asset-color-immobiliare:  #65a30d;
    --asset-color-liquidita:    #0891b2;
    --asset-color-custom:       #64748b;
    --asset-color-sconosciuto:  #94a3b8;
}

.ptf-asset-scroll {
    overflow-y: auto;
    max-height: 340px;
    padding: 0 0 0.5rem;
}

.ptf-asset-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    transition: background 0.1s;
}

.ptf-asset-row:last-child {
    border-bottom: none;
}

.ptf-asset-row:hover {
    background: rgba(0, 0, 0, 0.02);
}

/* Colour dot for legend rows (donut external legend). */
.ptf-legend-dot {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-radius: 2px;
}

.ptf-asset-name {
    flex: 1;
    font-size: 0.875rem;
    color: var(--do-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ptf-asset-value {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--do-text);
    white-space: nowrap;
}