.themer-button {
    min-height: 53px;
    min-width: 53px;
    color: $colortext;
    font-family: Material Symbols Outlined;
    background-image: url('images/svg/beatmappacks.svg');
    background-size: auto 65%;
    background-position: center;
}

.themer-button-true {
    min-height: 53px;
    min-width: 53px;
    color: $colortext;
    font-family: Material Symbols Outlined;
    background-color: $overlay0;
    background-image: url('images/svg/beatmappacks.svg');
    background-size: auto 65%;
    background-position: center;
}

.themer-button-false {
    min-height: 53px;
    min-width: 53px;
    color: $colortext;
    font-family: Material Symbols Outlined;
    background-image: url('images/svg/beatmappacks.svg');
    background-size: auto 65%;
    background-position: center;
}

.themer-action-button {
    // @include rounding;
    min-height: 53px;
    min-width: 53px;
    color: $colortext;
    font-family: Material Symbols Outlined;
}

.themer-action-button:hover {
    background-color: $overlay0;
}

.themer-action-button:active {
    background-color: $overlay0;
}

.themer-action-button:focus {
    border: 2px solid $overlay0;
}

.themer-menu-box {
    // @include window;
    // @include rounding;
    // border-radius: 15px;
    background-color: tint($colorbarbg, 12.5%);
    margin: 14px;
    transition: 250ms cubic-bezier(0.05, 0.7, 0.1, 1);
}

.themer-title {
    font-family: 'Rubik';
    font-size: 15pt;
    padding: .6rem;
    color: $colortext;
    font-size: 14pt;
}

.themer-prompt {
    color: $colortext;
    font-family: 'Rubik';
    font-size: 12pt;
    padding: .6rem;
}

.themer-input {
    font-family: 'Rubik';
    // background-color: $surface0;
    background-color: tint($colorbarbg, 10%);
    color: $colortext;
    // border-radius: 10px;
    padding: 7px;
    margin-top: 2px;
    margin-bottom: 2px;
    border: 2px solid $overlay0;
    caret-color: $colortext;

    selection {
        background-color: rgba(154, 152, 152, 0.5);
    }
}

.themer-input:focus {
    border: 2px solid $colortext;
}

.themer-color-preview-section {
    @include rounding;
}

.themer-color-preview {
    min-height: 25px;
    min-width: 25px;
    // border-radius: 5px;
    border-width: 55px;
}

.preview-0 {
    background-color: $color0;
}

.preview-1 {
    background-color: $color1;
}

.preview-2 {
    background-color: $color2;
}

.preview-3 {
    background-color: $color3;
}

.preview-4 {
    background-color: $color4;
}

.preview-5 {
    background-color: $color5;
}

.preview-6 {
    background-color: $color6;
}

.preview-7 {
    background-color: $color7;
}