
@import "@synerty/peek-plugin-base-js/src/styles/_variables";

:host {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.settings-container {
    width: 100%;
    overflow: auto;
}

.action-buttons {
    display: flex;
    gap: $general_padding_1;
    margin-top: $general_margin_2;
}

:host ::ng-deep {
    .ant-table-wrapper {
        width: 100%;
    }

    .ant-table-tbody > tr > td {
        padding: $general_padding_1;
    }

    .bool-button {
        min-width: 80px;

        &.true {
            background-color: $success;
            border-color: $success;
            &:hover {
                background-color: $success_dark;
                border-color: $success_dark;
            }
        }

        &.false {
            background-color: $danger;
            border-color: $danger;
            &:hover {
                background-color: $danger_dark;
                border-color: $danger_dark;
            }
        }
    }
}