/**************************** Content for component view  ********************************/
body.com_quantummanager #content,
body.com_quantummanager #content > *,
body.com_quantummanager #content > * > *
{
    height: 100%;
    padding: 0 !important;
    margin: 0 !important;
}

/**************************** Links ********************************/
.quantummanager a {
    display: flex;
    align-content: center;
    align-items: center;
}

/**************************** Background ********************************/
.quantummanager-backgrounds-muted {
    background: rgb(244, 247, 250);
}

/******************************** Buttons ********************************/
.qm-btn {
    margin-bottom: 0;
    padding: 4px 12px;
    background-color: #fff;
    color: var(--template-text-dark);
    border: 1px solid hsl(var(--hue), 20%, 80%);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    /*box-shadow: 0 1px 2px rgb(0 0 0 / 5%);*/
    font-weight: normal;
    font-size: 13px;
    line-height: 18px;
}

.qm-btn:hover,
.qm-btn:focus {
    background-color: #e6e6e6;
}

.qm-btn:focus {
    outline: thin dotted #333;
    outline-offset: -2px;
}

.qm-btn.active,
.qm-btn:active {
    background-image: none;
    outline: 0;
}

.qm-btn-primary {
    background: var(--template-bg-dark-60);
    color: var(--template-text-light);
    border: 1px solid transparent;
}

.qm-btn-primary:hover,
.qm-btn-primary:focus,
.qm-btn-primary:active {
    background-color: var(--template-bg-dark-70);
    border-color: var(--template-bg-dark-90);
    color: #fff;
}

.qm-btn-primary:focus {
    box-shadow: 0 0 0 .25rem rgba(54,78,109,.5);
}


/******************************** Dropdown *******************************/
.quantummanager-dropdown-content {
    background-color: #f9f9f9;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.quantummanager-dropdown-content a {
    color: black;
}

.quantummanager-dropdown-content a:hover {
    background-color: #f1f1f1;
}

.quantummanager-dropdown:hover .quantummanager-dropdown-title {
    color: #78abde;
}


/************************** Upload module **********************************/
.quantumupload-module .drop-area .button {
}


/************************** Toolbar module *********************************/
.quantumtoolbar-module .quantumtoolbar-module-buttons-group .qm-btn-wrap:last-child button {
    border-right-color: hsl(var(--hue),20%,80%);
}


/************************** Tree catalogs module *********************************/
.quantumtreecatalogs-module ul li span.tree-path:after {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='16' viewBox='0 0 20 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 0H2C0.9 0 0.01 0.9 0.01 2L0 14C0 15.1 0.9 16 2 16H18C19.1 16 20 15.1 20 14V4C20 2.9 19.1 2 18 2H10L8 0Z' fill='%238596ad'/%3E%3C/svg%3E%0A");
}

.quantumtreecatalogs-module ul li span.tree-path.empty:after {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='16' viewBox='0 0 20 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 2H18C19.1 2 20 2.9 20 4V14C20 15.1 19.1 16 18 16H2C0.9 16 0 15.1 0 14L0.01 2C0.01 0.9 0.9 0 2 0H8L10 2ZM2 4V14H18V4H2Z' fill='%238596ad'/%3E%3C/svg%3E%0A");
}

.quantumtreecatalogs-module ul li span.tree-caret-down ~ .tree-path:after {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='16' viewBox='0 0 24 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0)'%3E%3Cpath d='M17 16H19.8C20.9 16 21.9 15.1 22 14L23.2 4C23.3 2.9 22.5 2 21.4 2H17V16Z' fill='%238596ad'/%3E%3Cpath d='M7.79999 0H1.79999C0.699993 0 -0.100007 0.9 -6.55651e-06 2L1.49999 14C1.59999 15.1 2.59999 16 3.69999 16H19.7C20.8 16 21.6 15.1 21.5 14L20.3 4C20.2 2.9 19.2 2 18.1 2H10.1L7.79999 0Z' fill='%238596ad'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0'%3E%3Crect x='-7.62939e-06' width='23.2' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}


/************************** Viewfiles *********************************/
.quantumviewfiles-module .field-list-files .list-grid .directory-item .directory .directory-icon {
    background-image: url("data:image/svg+xml,%3Csvg width='80' height='64' viewBox='0 0 80 64' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 4C0 1.79086 1.79083 0 4 0H40L48 8H76C78.2092 8 80 9.79086 80 12V60C80 62.2091 78.2092 64 76 64H4C1.79083 64 0 62.2091 0 60V4Z' fill='%238596ad'/%3E%3Cg style='mix-blend-mode:overlay' opacity='0.5'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M48 8L40 0H32L40 8H48Z' fill='black'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.quantumviewfiles-module .field-list-files .list-grid .directory-item.empty .directory .directory-icon {
    background-image: url("data:image/svg+xml,%3Csvg width='80' height='64' viewBox='0 0 80 64' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M47.2929 8.70711L47.5858 9H48H76C77.6569 9 79 10.3431 79 12V60C79 61.6569 77.6569 63 76 63H4C2.34312 63 1 61.6569 1 60V4C1 2.34314 2.34312 1 4 1H39.5858L47.2929 8.70711Z' stroke='%238596ad' stroke-width='2'/%3E%3C/svg%3E%0A");
}

.quantumviewfiles-module .field-list-files .list-grid .file-item .file .file-exs.file-icons svg {
    font-family: var(--body-font-family);
}

.quantumviewfiles-module .field-list-files .list-table .directory-item .directory .directory-icon {
    background-image: url("data:image/svg+xml,%3Csvg width='80' height='64' viewBox='0 0 80 64' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 4C0 1.79086 1.79083 0 4 0H40L48 8H76C78.2092 8 80 9.79086 80 12V60C80 62.2091 78.2092 64 76 64H4C1.79083 64 0 62.2091 0 60V4Z' fill='%238596ad'/%3E%3Cg style='mix-blend-mode:overlay' opacity='0.5'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M48 8L40 0H32L40 8H48Z' fill='black'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.quantumviewfiles-module .field-list-files .list-table .directory-item.empty .directory .directory-icon {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='16' viewBox='0 0 20 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 2H18C19.1 2 20 2.9 20 4V14C20 15.1 19.1 16 18 16H2C0.9 16 0 15.1 0 14L0.01 2C0.01 0.9 0.9 0 2 0H8L10 2ZM2 4V14H18V4H2Z' fill='%238596ad'/%3E%3C/svg%3E%0A");
}


/************************** Cropperjs *********************************/
.quantummanager-full-component-wrap .quantumcropperjs-module .toolbar {
    width: 18%;
}

.quantumcropperjs-module .editor {
    max-width: 82%;
}

.quantumcropperjs-module .qm-input-range-wrap > div input[type=range] {
    background-color: #eee;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #78abde), color-stop(100%, #78abde));
    background-image: -webkit-linear-gradient(var(--template-bg-dark-60), var(--template-bg-dark-60));
    background-image: -moz-linear-gradient(var(--template-bg-dark-60), var(--template-bg-dark-60));
    background-image: -o-linear-gradient(var(--template-bg-dark-60), var(--template-bg-dark-60));
    background-image: linear-gradient(var(--template-bg-dark-60), var(--template-bg-dark-60));
}