﻿
.panel {
    overflow: hidden;
    background-color: rgb(var(--color-secondary-500-rgb));
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    border: 1px solid rgb(var(--color-secondary-0-rgb));
    box-shadow: 0 0 5px 0 var(--color-mask-shade-20), 0 0 1px 0 var(--color-mask-shade-20), 0 2px 4px 0 var(--color-mask-shade-10);
    user-select: auto;
    pointer-events: auto;
}

    .panel.fullspace {
        width: 100%;
        height: 100%;
    }

    .panel.bounded-width{
        max-width: 1400px;
        width: auto;
        height: 100%;
    }

    .panel.level0 {
        border-radius: var(--size-radius-xl);
    }
    .panel.level1 {
        border-radius: var(--size-radius-l);
    }

    .panel.vertical-with-data {
        padding: var(--size-spacing-16);
        display: flex;
        flex-direction: column;
        width: fit-content;
        height: 100%;
        gap: var(--size-spacing-16);
    }

    .panel.control-panel {
        display: flex;
        flex-direction: row;
        width: fit-content;
        height: fit-content;
        padding: var(--size-spacing-8);
        gap: var(--size-spacing-8);
        pointer-events: auto;
        align-items: center;
    }