/* ------------------------------------------------------------------------------
 *
 *  # Login and related forms
 *
 *  Styles related to user login - logins, registration, password revovery, unlock etc.
 *
 *  Version: 1.1
 *  Latest update: Nov 25, 2015
 *
 * ---------------------------------------------------------------------------- */


// Cover image
.login-cover {
    background: url('../images/login_cover.jpg') no-repeat;
    background-size: cover;
}


// Login container
.login-container {
    display: table;
    width: 100%;
    height: 100%; // default height


    // Does your page has navbar?
    @use_navbar: true;

    // Re-calculate height if page has default navbar
    .navbar + & when (@use_navbar = true) {
        height: calc(~"100% - "@navbar-height + 2);
    }

    // Re-calculate height if page has large navbar
    .navbar-lg + & when (@use_navbar = true) {
        height: calc(~"100% - "@navbar-height-large + 2);
    }

    // Re-calculate height if page has small navbar
    .navbar-sm + & when (@use_navbar = true) {
        height: calc(~"100% - "@navbar-height-small + 2);
    }

    // Re-calculate height if page has mini navbar
    .navbar-xs + & when (@use_navbar = true) {
        height: calc(~"100% - "@navbar-height-mini + 2);
    }


    // Make content full height
    .page-content {
        display: table-row;
        height: 100%;
    }

    // Add fixed width
    .login-form {
        width: 320px;
    }

    // Add vertical margin
    .login-form,
    .registration-form {
        margin: 0 auto @line-height-computed auto;

        @media (max-width: @screen-xs) {
            width: 100%;
        }
    }

    // Centered footer
    .footer {
        left: 0;
        right: 0;
        text-align: center;
    }

    // Align forms vertically
    .content-wrapper {
        vertical-align: middle;
        display: table-cell; // dublicate to keep content always vertically centereed
    }

    // Tabs
    .nav-tabs.nav-justified {
        margin-bottom: 0;

        // Nav items
        > li {

            // Links
            > a {
                border-top: 0!important;
                padding-left: @content-padding-base;
                padding-right: @content-padding-base;
                background-color: #f5f5f5;
            }

            // Remove left border in first item
            &:first-child > a {
                border-right: 0;
                border-radius: 0 @border-radius-base 0 0;
            }

            // Remove right border in last item
            &:last-child > a {
                border-left: 0;
                border-radius: @border-radius-base 0 0 0;
            }

            &.active > a {
                background-color: transparent;
            }
        }

        // Mobile view
        @media (max-width: @screen-xs-max) {
            padding: 0;
            border-width: 0 0 1px 0;
            border-radius: 0;

            // Remove defalt text label
            &:before {
                content: none;
            }

            // Remove left borders
            > li > a {
                border-width: 0!important;
            }
        }
    }
}


// Responsive login options
@media (max-width: @screen-xs-max) {
    .login-options {
        &,
        .text-right {
            text-align: center;
        }
    }
}
