.analysis-page .select-version {
    margin: 0.25rem 0.5rem;
}

.add-step-component {
    zoom: 1;
}

.analysis-version {
    margin: 0 0 0 8px;
    align-self: center;
    color: var(--theme-fg-secondary-text);
}

.read-only-filler {
    flex: 1;
}

.info-read-only {
    font-size: 14px;
    margin: 0 0 4px 16px;
    background-color: var(--theme-warning-light);
    width: fit-content;
    padding: 4px;
    border-radius: 5px;
    margin: 4px;
}

.info-read-only .material-icons {
    font-size: 18px;
    align-self: center;
}

.analysis-sidenav {
    flex: 0 0 320px;
    border: 1px solid var(--theme-fg-divider);
}

.analysis-btn {
    flex: none;
    margin: 34px auto;
    padding: 0 !important;
    gap: 0 !important;
    display: flex;
    --ripple-color: var(--theme-primary-dark);
}

.analysis-btn--divider {
    border-left: 1px solid var(--theme-fg-divider);
    height: 1.5rem;
}

.analysis-btn-left {
    padding: 0.5rem 0.75rem;
    gap: 0.25rem;
}

.analysis-btn-right {
    align-self: stretch;
}

.analysis-btn-right button {
    height: 100% !important;
}

.analysis-pane {
    transition: flex 0.2s ease-out;
    flex: 0;
}

.analysis-pane-open {
    flex: 1;
}

.analysis-pane-open~.analysis-pane-open {
    border-left: 1px solid var(--theme-fg-divider);
}

.beta-tag::after {
    content: "BETA";
    font-size: 12px;
    margin-left: 10px;
    padding: 2px 5px;
    background-color: #dfdfdf;
    border-radius: 5px;
}

/****************************************************************/
.add-step-popup {
    height: 100vh;
    max-height: 610px;
    width: 100vw;
    max-width: 650px;
    display: grid;
}

.stage.dragging {
    background-color: var(--theme-bg-disabled-button);
    opacity: 0.8;
}

.stage>* {
    transition: transform ease-in 0.1s;
}

.stage.before-drag>* {
    transform: translateY(-7px);
}

.stage.after-drag>* {
    transform: translateY(7px);
}

.analysis-leftnav {
    width: 256px;
    user-select: none;
    transition: width 0.2s ease-out;
}

.analysis-leftnav> :not(.toolbar) {
    border-right: 1px solid var(--theme-fg-divider);
}

.analysis-leftnav-top {
    min-height: 24px;
}

.analysis-leftnav-steps {
    overflow: hidden auto;
    scrollbar-width: thin;
    gap: 5px;
}

.analysis-leftnav-bottom {
    border-top: 1px solid var(--theme-fg-divider);
    min-height: 120px;
}

.analysis-leftnav-filler {
    flex: 1;
}

.analysis-leftnav a,
.analysis-leftnav span {
    overflow: hidden;
    max-width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.analysis-leftnav.compact {
    width: 65px;
}

.analysis-leftnav.compact .navitem {
    justify-content: center !important;
}

.analysis-leftnav.compact .navitem :not(.material-icons) {
    display: none;
}

.analysis-leftnav.compact .analysis-leftnav-bottom {
    min-height: 111px;
}

.analysis-leftnav.compact .title-stack .navigation-part {
    visibility: hidden;
}

.analysis-leftnav.compact .analysis-version {
    display: none;
}

.analysis-leftnav.compact .read-only-filler {
    display: none;
}

.analysis-leftnav.compact .toolbar {
    justify-content: center;
}

.analysis-leftnav.compact .select-version {
    margin: 0.25rem 0.5rem;
}

.analysis-leftnav.compact .info-read-only>span:not(.material-icons) {
    display: none;
}

.analysis-leftnav.compact .info-read-only .material-icons {
    margin: 0;
}

.analysis-leftnav.compact .add-button {
    justify-content: center;
    padding: 19px 8px 19px 8px;
}

.analysis-leftnav.compact .add-button>span:not(.material-icons) {
    display: none;
}

.analysis-leftnav.compact .add-button .material-icons {
    margin: 0px;
}

.analysis-leftnav.compact .stage {
    justify-content: center;
    padding: 8px;
    padding-right: 6px;
}

.analysis-leftnav.compact .stage>span:not(.material-icons) {
    display: none;
}

.analysis-leftnav.compact .stage .material-icons {
    margin: 0;
}

.analysis-leftnav.compact .analysis-btn {
    margin: 7px auto;
}

.analysis-leftnav.compact .analysis-btn-left {
    padding: 0.5rem;
}

.analysis-leftnav.compact .navtitle {
    align-self: center;
    margin: 0;
}

.analysis-leftnav .compact-toggle {
    display: flex;
    justify-content: right;
    padding-right: 18px;
    cursor: pointer;
    border-top: 1px solid var(--theme-fg-divider);
}

.analysis-leftnav .compact-toggle:hover {
    background: var(--theme-bg-hover);
}

.analysis-leftnav .bottom-group {
    position: sticky;
    flex-shrink: 0;
    z-index: 2;
    bottom: 0px;
    border-right: 1px solid var(--theme-fg-divider);
}

.disabled-step {
    opacity: 0.8;
}

.disabled-step .material-icons {
    color: var(--theme-fg-disabled-text);
}

.disabled-step :not(span.material-icons) {
    text-decoration: line-through !important;
}