/*
 * Copyright (c) 2012 by PROS, Inc.  All Rights Reserved.
 * This software is the confidential and proprietary information of
 * PROS, Inc. ("Confidential Information").
 * You shall not disclose such Confidential Information and shall use it
 * only in accordance with the terms of the license agreement you entered
 * into with PROS.
 */

// PROS colors
// -------------------------
@prosLightBlue:             #00A4E3;
@prosDarkBlue:              #06447B;
@prosOrange:                #F79727;
@prosGreen:                 #54B847;
@prosGrey:                  #708090;
@prosLightGrey:             #EEF2F5;

//Element specific colors
// -------------------------
@backgroundColor:           #F0F3F6;

//Page specific colors
// -------------------------
@loginHeaderBackground:     #FFFFFF;
@loginHeaderBottomBorder:   #D9DEE1;

// Typography
// -------------------------
@prosSansFontFamily:        "Open Sans", Helvetica, Arial, sans-serif;
@prosLightFontFamily:       FuturaBT-Light, Helvetica, Arial, sans-serif;
@prosMediumFontFamily:      FuturaBT-Medium, Helvetica, Arial, sans-serif;
@prosBookFontFamily:        FuturaBT-Book, Helvetica, Arial, sans-serif;
@prosBoldFontFamily:        FuturaBT-Bold, Helvetica, Arial, sans-serif;
@prosHeavyFontFamily:       FuturaBT-Heavy, Helvetica, Arial, sans-serif;
@prosExtraBlackFontFamily:  FuturaBT-ExtraBlack, FuturaBT-Heavy, Helvetica, Arial, sans-serif;

//Base mixins
// -------------------------


// Basic elements
// -------------------------
body {
    background-color: @backgroundColor;
    min-width: 600px;
}

a {
    font-weight: 100;
}

footer {
    border-top: 2px solid @loginHeaderBottomBorder;
    padding: 10px 30px 0px 30px;
    height: 100%;
    font-size: 10px;
    text-align: center;
    position: relative;

    span.version {
        position: absolute;
        right: 10px;
    }

    a {
        margin-left: 30px;
    }
}

.main-container {
    padding: 10px 30px 10px 30px;
    margin-right: auto;
    margin-left: auto;
}

// Forms
// -------------------------
.username-div, .password-div {
    margin-bottom: 15px;
}

legend {
    margin-bottom: 43px;
    font-weight: 100;
    font-size: 35px;
    color: black;
    border-bottom-color: #ddd;
}

label {
    color: #1b1b1b;
    font-size: 18px;
    text-align: left;
}

input {
    font-weight: 300;
    font-size: 18px;
}

input[type=checkbox] {
    margin-right: 5px;
    margin-top:  -4px;
}

input[type=text], input[type=password] {
    border-radius: 0px;
    font-size: 18px;
    letter-spacing: 1px;
}

input[type=submit] {
    border-radius: 7px;
    background-color: @prosGreen;
    border: 0px;
    border-bottom: 4px solid #2F953D;
    color: white;
    opacity: .9;
    letter-spacing: 1px;
}

//
// Login Page
//
#app-splash {
    margin-bottom: 25px;
}

.login-header {
    background-color: @loginHeaderBackground;
    height: 30px;
    padding: 15px 40px 15px 40px;
    border-bottom: 1px solid @loginHeaderBottomBorder;
    border-top: 5px solid @prosLightBlue;

    img {
        width: 129px;
        height: 36px;
    }
}

.login {
    font-family: @prosBookFontFamily;
    margin-top: 10px;
    text-align: center;
    margin: 0 auto;
    padding: 30px 30px 30px 30px;
    width: 400px;

    input[type=text], input[type=password] {
        width: 386px;
        height: 40px;
    }

    input[type=submit] {
        width: 100%;
        height: 42px;
    }

}

.login-helpers {
    margin: 25px 10px 0px 0px;

    label.logged-in {
        display: inline;
        color: #C1C3C5;
        float: left;
    }

    a {
        float: right;
    }
}
