@import "./ngbKnownDrugsPanel.variables.scss";

ngb-known-drugs-panel {
    padding: 5px 0 0;
    position: relative;

    .known-drugs-header {
        display: flex;
        flex-direction: row;
        align-items: center;

        .drugs-source-select {
            display: inline-flex;
            align-items: center;
            margin-left: 8px;

            md-input-container,
            label {
                margin: 0;
                padding: 0;
                line-height: $known-drugs-nav-height;
                height: $known-drugs-nav-height;
                color: $known-drugs-color;
                font-size: $known-drugs-font-size;
            }

            label {
                margin-right: 5px;
            }

            md-input-container md-select {
                &:not([disabled]):focus .md-select-value {
                    border-bottom: none;
                }

                md-select-value {
                    border: none;
                    min-height: $known-drugs-nav-height;
                    padding: 0;
                    font-size: $known-drugs-font-size;
                    display: flex;
                    align-items: center;

                    .md-select-icon {
                        margin: 0 4px 0 0;
                        width: 20px;
                    }

                    > span,
                    > span > div {
                        line-height: $known-drugs-nav-height;
                        height: $known-drugs-nav-height;
                        transform: none !important;
                    }
                }
            }
        }
    }

    ngb-drugs-table .ui-grid {
        border-top: $known-drugs-border;
    }

    .loading-indicator {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
    }

    .action-container {
        margin-left: auto;
        display: flex;
    }

    ngb-panel-error-list {
        .layout-padding,
        .layout-padding > * {
            padding: 0 !important;
        }

        md-list-item,
        md-list-item .md-list-item-inner {
            min-height: 24px;
            height: 24px;
            font-size: 14px;
        }
    }

    .export-link,
    .tmap-link {
        color: rgb(102, 153, 255);
        cursor: pointer;
        min-height: 28px;
        line-height: 28px;
        font-size: $known-drugs-font-size;
        min-width: 55px;
        padding: 0 8px;
        margin: 0;

        md-progress-circular {
            margin: 8px;
            margin-left: auto;
            margin-right: auto;
        }
    }
}

.drugs-source-select-container {
    md-select-menu:not(.md-overflow) md-content {
        padding: 0;
    }

    md-option {
        padding: 0 8px;
        height: calc($known-drugs-nav-height + 2px);

        &[selected],
        &:not([disabled]):focus {
            color: $known-drugs-color;
        }
    }

    md-select-menu,
    md-select-menu md-content {
        min-height: calc($known-drugs-nav-height + 2px);
    }
}
