@import '../../../utils/colors.less';
@import '../../../utils/fonts.less';

.application.sheet.daggerheart.actor.dh-style.character {
    .tab.biography {
        .items-section {
            display: flex;
            flex-direction: column;
            gap: 10px;
            height: 100%;
            overflow-y: auto;
            mask-image: linear-gradient(0deg, transparent 0%, black 10%, black 98%, transparent 100%);
            padding-bottom: 10px;
            height: 100%;

            scrollbar-width: thin;
            scrollbar-color: light-dark(@dark-blue, @golden) transparent;
        }

        .biography-section {
            prose-mirror {
                --min-height: 50px;
            }

            prose-mirror.inactive .editor-content {
                position: relative;
            }
        }

        &:has(.prosemirror.active) {
            .biography-section {
                flex: 1;
                &:not(:has(prose-mirror.active)) {
                    display: none;
                }
            }
        }
    }
}