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

.application.sheet.daggerheart.actor.dh-style.adversary {
    --left-indent: 16px;
    --sidebar-width: 265px;

    .window-content {
        display: grid;
        grid-template-columns: var(--sidebar-width) 1fr;
        grid-template-rows: auto 1fr;
        height: 100%;
        width: 100%;
        padding-bottom: 0;
    }

    .adversary-sidebar-sheet {
        grid-row: 1 / span 2;
        grid-column: 1;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    .adversary-header-sheet {
        grid-row: 1;
        grid-column: 2;
    }

    .tab {
        grid-row: 2;
        grid-column: 2;
        &.active {
            overflow: hidden;
            display: flex;
            flex-direction: column;
            margin: 0 0 10px 0;
            padding: 0;
            position: relative;
                    
            .scroll-container,
            > prose-mirror.inactive .editor-content {
                scrollbar-gutter: stable;
                overflow-y: auto;
                padding: var(--spacer-16) calc(var(--left-indent) - 6px) 4px var(--left-indent);
                .with-scroll-shadows();
                > fieldset {
                    margin-left: -10px; // align content with indent
                    margin-right: -10px;
                    &:first-child {
                        margin-top: 0;
                    }
                }
            }
            > prose-mirror.inactive button.toggle {
                top: var(--spacer-16);
            }
            &:has(> prose-mirror.active) {
                padding: var(--spacer-12) 0 0 var(--left-indent);
            }
        }
    }
}