@import "../variables";
@import "~cosmoUiVariables";

// filter tray
$tray-height: $tray-header-height !default;
$tray-border-radius: 4px !default;
$tray-border-radius-left: $tray-border-radius 0 0 $tray-border-radius !default;
$tray-border-radius-right: 0 $tray-border-radius $tray-border-radius 0 !default;

.container {
    background: $accent_color;
    border-radius: $tray-border-radius;
    padding: 0;
    margin: 0;
    height: $tray-height;
    width: 100%;
    color: $white;
    position: relative; // required for absolute positioning of tray overflow

    > :first-child {
        border-radius: $tray-border-radius 0 0 $tray-border-radius;

        * {
            border-radius: 0;
        }
    }

    > :last-child {
        border-radius: 0 $tray-border-radius $tray-border-radius 0;

        * {
            border-radius: 0;
        }
    }

    > :first-child:last-child {
        border-radius: $tray-border-radius;

        * {
            border-radius: 0;
        }
    }
}