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

:host {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.settings-container {
    display: flex;
    flex-direction: column;
    background-color: $container-background-color;
    border-radius: $border-radius;
    padding: $general_padding_2;
}

.settings-table {
    margin-bottom: $general_margin_2;

    ::ng-deep {
        .ant-table-thead > tr > th {
            font-weight: $bold;
            color: $font-color-primary;
        }

        .ant-table-tbody > tr > td {
            color: $font-color-secondary;
        }
    }
}

.action-buttons {
    display: flex;
    gap: $general_padding_2;

    button {
        min-width: $general_button_min_width;
    }
}

.value-cell {
    max-width: 300px;
}
