.grid-table {
    .grid-header {
        display: flex;
        flex-direction: row;
        background: #f7f7f7;
        color: #0f1114;
        border-bottom: 1px solid #f2f3f4;

        .grid-header-item {
            position: relative;

            .header-group-inner-box {
                width: 100%;
                height: 100%;

                .header-group-row {
                    width: 100%;
                    top: 0;
                    position: absolute;
                    border-bottom: 1px solid #f2f3f4;
                }

                .header-column-row {
                    width: 100%;
                    position: absolute;
                }

                .header-cell {
                    position: absolute;
                    overflow: hidden;
                    padding: 0 18px;
                    display: inline-flex;
                    align-items: center;
                    -webkit-box-align: center;

                    .header-column-title {
                        justify-content: space-between;
                        flex-direction: row-reverse;
                        width: 100%;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                        color: #6b717b;
                        font-weight: 400;
                        font-size: 14px;
                    }

                    .resizer {
                        height: 100%;
                        width: 8px;
                        position: absolute;
                        top: 0;
                        right: -4px;
                        cursor: ew-resize;

                        &:after {
                            content: '';
                            position: absolute;
                            z-index: 1;
                            display: block;
                            right: 2px;
                            width: 3px;
                            height: 32%;
                            top: 50%;
                            transform: translateY(-50%);
                            background-color: rgba(186, 191, 199, 0.5);
                        }
                    }
                }
            }

            &.grid-header-view {
                overflow: hidden;
                -webkit-box-flex: 1;
                flex: 1 1 auto;
            }

            &.header-pin-right {
                border-left: 1px solid #f2f3f4;
            }

            &.header-pin-left {
                border-right: 1px solid #f2f3f4;
            }
        }
    }
}