@import '../../styles/variables.less';


:host {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    & mat-card {
        margin: 12px 6px 12px 12px;
        & mat-card-title {
            color: var(--scheme-color-1);
            font-size: 16px;
        }
        & mat-card-subtitle {
            color: var(--scheme-color-3);
            font-size: 12px;
        }
        &.no-left-margin {
            margin-left: 6px;
        }
    }
    & h1 {
        font-size: 14px;
    }
    & div.left {
        position: absolute;
        display: flex;
        flex-direction: column;
        top: 0;
        bottom: 0;
        left: 0;
        right: 330px;
        overflow: hidden;
        justify-content: stretch;
        justify-items: stretch;
        & div.filter {
            position: absolute;
            z-index: 1000;
            padding: 6px 12px;
            background: var(--scheme-color-warning-light);
            top: 6px;
            right: 6px;
            box-shadow: 3px 3px 3px rgb(0 0 0 / 40%);
            border-radius: 3px;
        }
        & .fill {
            overflow: auto;
        }
    }
    & div.right {
        position: absolute;
        width: 320px;
        right: 6px;
        bottom: 0;
        top: 0;
        overflow-y: auto;
        overflow-x: hidden;
        display: flex;
        flex-direction: column;
        & div.spacer{
            flex: auto 100;
        }
    }


}