How to change Ag Grid border color?

Question

Does anyone know is it possible to change Ag Grid component border color? I was trying to do remove it with styling ag-theme-alphine

<div className="ag-theme-alpine" style={{ height: '100%', borderColor: 'white', fontSize: '1vw',}}>

But it doesn't work at all. Also i tried to do it with css, but again no luck.

.ag-root-wrapper {
    border: solid 1px;
    border-color: red;
    border-color: var(--ag-border-color, #babfc7);
}

Answer 1

Use css !important to override theme default styles.

See bellow:

 .ag-root-wrapper { border: solid 1px; border-color: var(--ag-border-color, #babfc7) !important; }

Answer 2

I changed border color of Ag-Grid component with CSS, it works only when '!important' is used.

.ag-root-wrapper {
    border: solid 1px;
    border-color: var(--ag-border-color, #fffff) !important;
}