.#{$prefix}grid-header-ct {
    border: $grid-header-border-width $grid-header-border-style $panel-body-border-color;

    // Body border provided by headerCt only when in accordion layout.
    border-bottom-color: $grid-header-background-color;

    background-color: $grid-header-background-color;
    @if not is-null($grid-header-background-gradient) {
        @include background-gradient($grid-header-background-color, $grid-header-background-gradient);
    }
}

@if $include-ext-layout-container-accordion {
    .#{$prefix}accordion-item .#{$prefix}grid-header-ct {
        border-width: 0 0 $grid-header-border-width !important;
    }
}

// When hideHeaders: true, we need !important to override above rule
// Left/right headers needs to be measurable by layout
.#{$prefix}grid-header-ct-hidden {
    border-top: 0 !important;
    border-bottom: 0 !important;
}


// create the bottom border of the header container by adding a top border to the
// grid body.  This is necessary because the header container is a docked item, and 
// Dock layout's border-collapsing mechanism removes the bottom border of top docked
// items with a !important.
.#{$prefix}grid-body {
    border-top-color: $grid-header-border-color;
}

.#{$prefix}hmenu-sort-asc {
    @if $enable-font-icons and ($grid-header-menu-sort-asc-glyph != null) {
        @include font-icon($grid-header-menu-sort-asc-glyph, $line-height: $menu-item-icon-size);
        @if $grid-header-menu-glyph-color != $menu-glyph-color {
            color: $grid-header-menu-glyph-color;
        }
    } @else {
        background-image: theme-background-image('grid/hmenu-asc');
    }
}

.#{$prefix}hmenu-sort-desc {
    @if $enable-font-icons and ($grid-header-menu-sort-desc-glyph != null) {
        @include font-icon($grid-header-menu-sort-desc-glyph, $line-height: $menu-item-icon-size);
        @if $grid-header-menu-glyph-color != $menu-glyph-color {
            color: $grid-header-menu-glyph-color;
        }
    } @else {
        background-image: theme-background-image('grid/hmenu-desc');
    }
}

.#{$prefix}cols-icon {
    @if $enable-font-icons and ($grid-header-menu-columns-glyph != null) {
        @include font-icon($grid-header-menu-columns-glyph, $line-height: $menu-item-icon-size);
        @if $grid-header-menu-glyph-color != $menu-glyph-color {
            color: $grid-header-menu-glyph-color;
        }
    } @else {
        background-image: theme-background-image('grid/columns', 'png');
    }
}