@use '../../../../styles/mixins.scss';

.ydb-query-editor-button {
    &__run-button {
        width: 76px;
        min-width: 76px;
        max-width: 76px;
    }

    &__explain-analyze-button {
        width: 111px;
        min-width: 111px;
        max-width: 111px;
    }

    &__stop-button {
        width: 76px;
        min-width: 76px;
        max-width: 76px;

        &_explain-analyze {
            width: 111px;
            min-width: 111px;
            max-width: 111px;
        }

        .g-root_theme_dark &,
        .g-root_theme_dark-hc & {
            --g-button-text-color: var(--g-color-text-dark-primary);
            --g-button-text-color-hover: var(--g-color-text-dark-primary);
            --g-button-background-color: var(--g-color-base-light);
            --g-button-background-color-hover: var(--g-color-base-light-hover);
            --g-button-focus-outline-color: var(--g-color-line-light);
        }

        &_error {
            @include mixins.query-buttons-animations();
        }
    }
}