@layer components {
    .portfolio-breakdown-report {
            display: grid;
            gap: 1.25rem;
            margin-top: 2.5rem;
        }

    .portfolio-breakdown-report__header {
            border-bottom: 1px solid var(--dashboard-color-border);
            padding-bottom: 1.25rem;
        }

    .portfolio-breakdown-report__title {
            background: var(--dashboard-color-surface);
            color: var(--dashboard-color-text);
            font-size: 1.25rem;
            font-weight: 650;
            line-height: 1.5rem;
        }

    .portfolio-breakdown-report__grid {
            align-items: flex-start;
            display: grid;
            gap: 1.25rem;
        }

    .portfolio-breakdown-report__chart {
            max-height: 34rem;
            overflow-y: auto;
            padding: 3rem;
        }

    .portfolio-breakdown-report__table {
            overflow-x: auto;
        }

    .portfolio-breakdown-report__name-cell {
            position: relative;
        }

    .portfolio-breakdown-report__weight-bg {
            background: rgb(var(--dashboard-color-brand-rgb) / 0.08);
            border-radius: 0.75rem;
            bottom: 0.3125rem;
            left: 0.625rem;
            position: absolute;
            top: 0.3125rem;
        }

    .portfolio-breakdown-report__asset {
            align-items: center;
            display: flex;
            min-width: 0;
            position: relative;
            z-index: 1;
        }

    .portfolio-breakdown-report__asset-name {
            color: var(--dashboard-color-text-muted);
            font-size: 0.875rem;
            font-weight: 600;
            line-height: 1.25rem;
            max-width: 20rem;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .portfolio-breakdown-report__asset-name--with-logo {
            margin-left: 1rem;
        }

    @media (min-width: 48rem) {
        .portfolio-breakdown-report__grid {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                }
    }
}
