/**
 * Roundcube webmail styles for the Elastic skin
 *
 * Copyright (c) 2017, The Roundcube Dev Team
 *
 * The contents are subject to the Creative Commons Attribution-ShareAlike
 * License. It is allowed to copy, distribute, transmit and to adapt the work
 * by keeping credits to the original authors in the README.md file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */

/*** Dialogs and popovers ***/

.popupmenu {
    display: none;
    padding: 0;
    min-width: 180px;

    li > a {
        width: 100%;
    }
}

.popover-body {
    padding: 0;
    overflow-x: hidden;

    & > .popupmenu {
        display: block !important;
    }
}

.popover {
    box-shadow: 3px 3px 5px @color-popover-shadow;
    overflow: hidden;
    padding: 0;

    & > h3 {
        /* On mobile don't display popup arrows and titles */
        display: none;
    }
}

html.layout-small,
html.layout-phone {
    .popover {
        margin: 0 !important;
        padding: 0;
        left: initial !important;
        right: 0;
        bottom: 0;
        width: 276px;
        transform: none !important;
        border-radius: 0;
        border: 0;
        display: flex;
        flex-direction: column;

        div.arrow {
            display: none;
        }

        & > h3 {
            display: block;
            border-radius: 0;
            padding: 0 .5em;
            height: @layout-touch-header-height;
            line-height: @layout-touch-header-height;
            font-size: @layout-touch-header-font-size;
            color: @color-popover-header;
            background-color: @color-popover-header-background;

            a {
                display: inline-block;
                width: 100%;
            }
        }

        .popover-body > * {
            max-height: 100% !important;
        }

        .listing li:last-child {
            border-bottom: 1px solid @color-list-border;
        }

        .folderlist li {
            padding-left: .5em;
        }
    }

    .popover-overlay {
        z-index: 1000;
        opacity: .5;
        background-color: @color-dialog-overlay-background;
        position: absolute;
        top: 0;
        bottom: 0;
        width: 100%;
    }

    #rcmKSearchpane {
        bottom: auto;
        box-shadow: none;
        border: 1px solid @color-input-border;
    }
}

html.touch .popover {
    .listing {
        li a {
            line-height: @layout-touch-menu-record-height;
            font-size: @layout-touch-menu-record-font-size;
            padding: 0 .5em;

            &:before {
                float: left; /* overwrite icon float to have unified element height */
            }
        }
    }
}

.pgpkeyimport {
    /* TODO */
}