/**
 * 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 autors in the README file.
 * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
 */

/*** Taskmenu ***/

#taskmenu {
    a {
        text-decoration: none;
        padding: .4em 0;
    }

    a.button {
        display: block;
        width: 60px;
        text-align: center;
        color: @color-taskmenu-button;

        &:hover {
            color: @color-taskmenu-button-hover;
        }

        &.selected {
            color: @color-taskmenu-selected-button;
        }

        &:before {
            &:extend(.font-icon-class);
            font-size: 1.5rem;
            height: 2rem;
        }

        &.mail:before {
            content: @fa-var-envelope;
        }
        &.addressbook:before {
            content: @fa-var-user;
        }
        &.settings:before {
            content: @fa-var-cog;
        }
        &.help:before {
            content: @fa-var-life-bouy;
        }
        &.logout:before {
            content: @fa-var-power-off;
        }
        &.about:before {
            content: @fa-var-question;
        }
        &.logout:hover {
            color: @color-taskmenu-logout-button-hover;
        }
        &.refresh:before {
            content: @fa-var-refresh;
        }
        &.compose:before {
            content: @fa-var-edit;
        }
        &.calendar:before {
            content: @fa-var-calendar;
        }
        &.tasklist:before {
            content: @fa-var-tasks;
        }
        &.files:before {
            content: @fa-var-folder;
        }
        &.notes:before {
            content: @fa-var-sticky-note;
        }
    }

    .special-buttons {
        position: absolute;
        bottom: 0;
        left: 0;

        @media screen and (max-width: @screen-width-xs) {
            position: relative;
        }

        a {
            color: @color-taskmenu-special-button;

            &:hover {
                color: @color-taskmenu-special-button-hover;
            }
        }
    }

    .action-buttons {
        a {
            color: @color-taskmenu-action-button;

            &:hover {
                color: @color-taskmenu-action-button-hover;
            }
        }
    }
}