/**
 * @class Ext.grid.HeaderContainer
 */
 
/**
 * @var {number}
 * Header container border-width
 */
$headercontainer-border-width: dynamic(null);
 
/**
 * @var {string}
 * Header container border-style
 */
$headercontainer-border-style: dynamic(null);
 
/**
 * @var {color}
 * Header container border-color
 */
$headercontainer-border-color: dynamic(null);
 
/**
 * Creates a visual theme for a grid header container.
 *
 * @param {string} $ui
 * The name of the UI being created. Can not included spaces or special punctuation
 * (used in CSS class names).
 *
 * @param {number} $border-width
 * Header container border-width
 *
 * @param {string} $border-style
 * Header container border-style
 *
 * @param {color} $border-color
 * Header container border-color
 */
@mixin headercontainer-ui(
    $ui: null,
    $border-width: null,
    $border-style: null,
    $border-color: null,
 
    // This is a private parameter. 
    // It exists purely to enable the column header background color 
    // to be propagated into the column header container because 
    // of https://sencha.jira.com/browse/EXTJS-22515 
    $background-color: null
) {
    $ui-suffix: ui-suffix($ui);
 
    .#{$prefix}headercontainer#{$ui-suffix} {
        // In Safari, stretched box items can not fill container height leaving 
        // a small margin of transparency through which scrolling content can be seen. 
        // So extend the view background into the header 
        // https://sencha.jira.com/browse/EXTJS-22515 
        background-color: $background-color;
        @include border($border-width, $border-style, $border-color);
    }
}