.zr-auxiliary-dialog--settings.bp3-dialog
    --zr-dialog-gutter: 2.5%
    --zr-dialog-margin: 15vw
    height: 90vh
    overflow-y: scroll

    &::-webkit-scrollbar
        width: 5px


.zr-settings-tabs-wrapper > .bp3-tab-list
    background: var(--zr-box-bg)
    border-right: 1px var(--zr-border-co) solid
    height: 90vh


/* Settings TabPanels */

.zr-settings-panel.bp3-tab-panel
    max-height: 90vh
    overflow-y: scroll
    padding: 0.5em 1em
    width: 100%

    &::-webkit-scrollbar
        width: 0px

    h4.bp3-heading
        color: var(--zr-text-co)
        margin: 0px
        font-size: 1.05rem

    .zr-definition
        &--wrapper
            margin: 5px

        &--item
            border: none
            box-shadow: none
            color: hsla(var(--zr-accent-1-hsl), 0.8)
            display: inline-block
            margin-right: 10px

    [zr-role="settings-row"] > [zr-role="input-text"]
        flex: auto
        text-align: right

    .scite-badge
        align-self: center
        margin-bottom: 10px
        max-width: 100%
        width: fit-content