/**
 * @package    quantummanager
 * @author     Dmitry Tsymbal <cymbal@delo-design.ru>
 * @copyright  Copyright © 2019 Delo Design & NorrNext. All rights reserved.
 * @license    GNU General Public License version 3 or later; see license.txt
 * @link       https://www.norrnext.com
 */

.quantumtoolbar-module {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.quantumtoolbar-module > div {
    display: flex;
    align-items: center;
}

.quantumtoolbar-module .left {
    width: auto;
}

.quantumtoolbar-module .center {
    width: 65%;
    padding-left: 15px;
    padding-right: 15px;
}

.quantumtoolbar-module .right {
    flex: 1;
    justify-content: flex-end;
}

.quantumtoolbar-module button {
    display: flex;
    align-items: center;
    transition: all 0.2s;
    height: 30px;
    font-size: 13px;
    line-height: 18px;
    border-radius: 0;
    border-right-color: transparent;
}

.quantumtoolbar-module .quantumtoolbar-module-buttons-group .qm-btn-wrap:first-child button {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.quantumtoolbar-module .quantumtoolbar-module-buttons-group .qm-btn-wrap:last-child button {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.quantumtoolbar-module button.qm-btn-hide {
    pointer-events: none;
    color: #ccc;
}

.quantumtoolbar-module button.qm-btn-hide .quantummanager-icon {
    opacity: .4;
}

.quantumtoolbar-module button:hover {
    transition: all 0.2s;
}

.quantumtoolbar-module button .quantummanager-icon + span {
    margin-left: 5px;
}

.quantumtoolbar-module button span {
    white-space: nowrap;
}

.quantumtoolbar-module .quantumtoolbar-module-buttons-group {
    display: flex;
    align-items: center;
    margin-right: 15px;
}

.quantumtoolbar-module .quantumtoolbar-module-buttons-group:last-child {
    margin-right: 0;
}

.quantumtoolbar-module .qm-btn-wrap {
    position: relative;
}

.quantumtoolbar-module .qm-btn-dropdown {
    visibility: hidden;
    position: absolute;
    width: auto;
    background-color: #f9f9f9;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    transition: visibility 100ms;
    z-index: 6;
}

.quantumtoolbar-module .qm-btn-wrap:hover .qm-btn-dropdown {
    visibility: visible;
    transition: visibility 100ms;
}

.quantumtoolbar-module .qm-btn-dropdown .qm-btn {
    border-top: none;
}

.quantumtoolbar-module .qm-btn-dropdown > * {
    width: 100%;
    border: none;
}

.quantumtoolbar-module .qm-btn-dropdown > *:last-child {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

.quantumtoolbar-module .qm-btn-dropdown > .qm-btn-width-small {
    width: 170px;
    max-width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.quantumtoolbar-module .qm-btn-dropdown .qm-btn-divider {
    height: 0;
    padding: 0;
    border-bottom: 1px solid #d2d2d2;
}

.quantumtoolbar-module .qm-btn-dropdown > .qm-btn-width-small > .quantummanager-icon {
    min-width: 14px;
    min-height: 14px;
}

@media screen and (max-width: 1360px) {
    .quantumtoolbar-module button.hidden-label span:not(.quantummanager-icon) {
        display: none;
    }
}

@media screen and (max-width: 800px) {
    .quantumtoolbar-module .left {
        width: 25%;
    }
    .quantumtoolbar-module .center {
        width: 65%;
    }
    .quantumtoolbar-module .right {
        width: 10%;
    }
}