@import  "../../lib/components/list/list.scss";
@import "../../themes/core/colors";

.mat-menu-item{
    &.qms-dropdown-menu-item{
        display: flex;
        line-height: normal;
        align-items: center;
        box-sizing: border-box;
        padding: 0px;
        border-bottom: 1px solid $border-bottom-item;

        .mat-menu-ripple{
            display: none;
        }

        .mat-checkbox.qms-group-options, .qms-dropdown-menu-item__content{
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
        }

        .mat-checkbox-layout{
            padding: 8px 16px;
        }

        .qms-dropdown-menu-item__content{
            padding: 8px 16px;
            &:hover {
                &:not([aria-disabled="true"]) {
                background: black(0.08);
                }
            }
        
            &:active {
                &:not([aria-disabled="true"]) {
                background: black(0.12);
                }
            }   
        
            
            &.cdk-keyboard-focused {
                border: 2px solid $primary;
                border-radius: $border-radius-default;
            }
        
            &.active-item {
                color: $primary;
                .mat-icon{
                    color: #1954A9;
                }
                
                @include color-inherit;
            }
        }

        .mat-icon{
            margin-right: 0;
            flex: 0 0 auto;
        }

        .qms-list-header {
            display: inline-flex;
            flex-direction: column;
            flex: 1 1 auto;
            .default-subtitle{
                font-size: 14px;
                font-family: Open Sans, Arial, Sans-Serif;

                &.size-lg {
                    @include size($size-md);
                  }
            }
            
            .caption{
                font-size: 14px;
                font-family: Open Sans, Arial, Sans-Serif;
            }
        }
    }
}