/*
 * Make quick commands transparent during mouseout
 * Forum link: https://forum.vivaldi.net/topic/50773/quick-commands-peekaboo-v2
 */

/* Compact QC */
#modal-bg.qc-modal.float.top:not(:hover) > div {
    background: transparent;
    box-shadow: none;
}

#modal-bg.qc-modal.float.top:not(:hover) .quick-command-container .quick-commands {
    opacity: 0;
}

#modal-bg.qc-modal.float.top:not(:hover) .qc-entry input {
    font-weight: 500;
    color: #00cc99;
    text-shadow: 2px 2px 6px black;
    background: linear-gradient(45deg, #00000099, transparent 80%);
    border-radius: 10px;
}

#modal-bg.qc-modal.float.top > div {
    transition: background .4s !important;
}

.quick-command-container .quick-commands {
    transition: opacity .4s !important;
}
/* expand width */
.quick-command-container, .quick-command-container .quick-commands > div {
    min-width: 86vw;
    cursor: auto;
}

.quick-command-container .quick-commands > div > div {
    max-width: 100% !important;
}

.quick-command-container .quick-command {
    cursor: pointer;
}