// Use this file to override Twitter Bootstrap variables or define own variables.
/*-----------------------------------------------------------------------*/
/*-----------------------------------------------------------------------*/
/*-----------------------------------------------------------------------*/
/*                       Design variables                                */
/*-----------------------------------------------------------------------*/
/*-----------------------------------------------------------------------*/
/*-----------------------------------------------------------------------*/

/*-----------------------------------------------------------------------*/
/*                          Fonts & Text                                 */
/*-----------------------------------------------------------------------*/
@font-family-sans-serif:             'Lato Regular', Arial, "Helvetica Neue", Helvetica, sans-serif;
@font-family-base:                   @font-family-sans-serif;
@font-path:                          '/dashboard/fonts';
@small:                              11px;
@normal:                             13px;

/*-----------------------------------------------------------------------*/
/*                        Public Page Header                             */
/*-----------------------------------------------------------------------*/
// Simple top header with brand logo - can be enabled/disabled via styleguide configuration
@public-page-header-bg-color:        @bg-inverse-color;
@public-page-header-padding:         10px;

@public-page-header-logo-img:        "mno_enterprise/main-logo.png";
@public-page-header-logo:            { min-height: 61px; max-width: 160px; max-height: 130px; margin: 17px auto 5px auto; };

/*-----------------------------------------------------------------------*/
/*                              Login Page                               */
/*-----------------------------------------------------------------------*/
@login-bg-img:                        "mno_enterprise/login-background.jpg";
@login-bg-color:                      @bg-main-color;
@login-box-grid-position:             { margin-top: 80px; .make-sm-column(4); .make-sm-column-offset(4); };

@login-box-corners:                   0px;
@login-box-title-color:               @text-inverse-color;
@login-box-title:                     { text-transform: uppercase; };
@login-box-title-display-box-arrow:   false;

@login-box-bg-color:                  @bg-inverse-color;
@login-box-padding:                   20px;
@login-box-brand-logo-img:            "mno_enterprise/main-logo.png";
@login-box-brand-logo:                { min-height: 61px; max-width: 160px; max-height: 130px; margin: 17px auto 5px auto; };
@login-box-btn-login:                 { width: 100%; };

@login-box-sso-intuit-logo:           "mno_enterprise/logo-intuit.png";
@login-box-oauth-text-color:          #fff;
@login-box-oauth-bg-color-facebook:   #3b5998;
@login-box-oauth-bg-color-google:     #dd4b39;
@login-box-oauth-bg-color-linkedin:   #0074C4;
@login-box-oauth-bg-color-intuit:     #fff;

/*-----------------------------------------------------------------------*/
/*                           Dashboard Layout                            */
/*-----------------------------------------------------------------------*/
@dashboard-bg-color:                            @bg-main-color;

@dashboard-section-title-color:                 @text-strong-color;
@dashboard-section-title-alignment:             center;
@dashboard-section-title-display-subline:       true;

// Side navbar menu
//--------------------------------------
@dashboard-side-menu-padding:                   30px 0px 0px 14px;
@dashboard-side-menu-bg-color:                  @bg-inverse-color;

@dashboard-side-menu-brand-logo-img:            "../images/main-logo.png";
@dashboard-side-menu-brand-logo:                { background-size: 204px; width: 51px; margin-left: 5px; };
@dashboard-side-menu-brand-logo-expanded:       { width: 201px; background-size: 100%; };

@dashboard-side-menu-link-color:                @text-inverse-color;
@dashboard-side-menu-link-bg-color:             @dashboard-side-menu-bg-color;

@dashboard-side-menu-link-hover-color:          @dashboard-side-menu-bg-color;
@dashboard-side-menu-link-hover-bg-color:       lighten(@bg-main-color,15%);

@dashboard-side-menu-link-active-color:         @dashboard-side-menu-bg-color;
@dashboard-side-menu-link-active-bg-color:      @bg-main-color;

@_default_style:                                { .fa-2x; margin-top: 6px; margin-left: 2px; color: @dashboard-side-menu-link-color; };
@_default_style_active:                         { @_default_style(); color: @dashboard-side-menu-link-active-color; };
@dashboard-side-menu-btn-dashboard:             { .icon-fa(th); @_default_style(); };
@dashboard-side-menu-btn-dashboard-active:      { .icon-fa(th); @_default_style_active(); };
@dashboard-side-menu-btn-impac:                 { .icon-fa(pie-chart); @_default_style(); };
@dashboard-side-menu-btn-impac-active:          { .icon-fa(pie-chart); @_default_style_active(); };
@dashboard-side-menu-btn-account:               { .icon-fa(user); @_default_style(); margin-left: 5px; };
@dashboard-side-menu-btn-account-active:        { .icon-fa(user); @_default_style_active(); margin-left: 5px; };
@dashboard-side-menu-btn-company:               { .icon-fa(briefcase); @_default_style(); };
@dashboard-side-menu-btn-company-active:        { .icon-fa(briefcase); @_default_style_active(); };
@dashboard-side-menu-btn-marketplace:           { .icon-fa(plus-square-o); @_default_style(); margin-left: 5px; };
@dashboard-side-menu-btn-marketplace-active:    { .icon-fa(plus-square-o); @_default_style_active(); margin-left: 5px; };
@dashboard-side-menu-btn-logout:                { .icon-fa(lock); @_default_style(); margin-left: 6px; };
@dashboard-side-menu-btn-logout-active:         { .icon-fa(lock); @_default_style_active(); margin-left: 6px; };

// Company select box (top right)
//--------------------------------------
@dashboard-cpy-select-width:                    280px;
@dashboard-cpy-select-pic-width:                50px;
@dashboard-cpy-select-bg-color:                 @bg-inverse-color;
@dashboard-cpy-select-border-radius:            0 0 0 6px;
@dashboard-cpy-select-border-color:             @text-inverse-color;

@dashboard-cpy-select-header-text-bold-color:   @text-inverse-color;
@dashboard-cpy-select-header-text-color:        @text-inverse-color;
@dashboard-cpy-select-header-text-size:         13px;

@dashboard-cpy-select-link-icon-color:          @decorator-touch-color;

@dashboard-cpy-select-link-color:               @text-inverse-strong-color;
@dashboard-cpy-select-link-hover-color:         @text-strong-color;
@dashboard-cpy-select-link-hover-bg-color:      @text-inverse-strong-color;

// Loaders
//--------------------------------------
@dashboard-loader-color:                        @text-strong-color;
@dashboard-loader-icon:                         { .icon-fa(refresh); .fa-2x; .fa-spin; }; //pass a ruleset

/*-----------------------------------------------------------------------*/
/*                        Dashboard > Apps Section                       */
/*-----------------------------------------------------------------------*/
@dashboard-apps-tile-bg-color:                  @bg-inverse-color;
@dashboard-apps-tile-text-color:                @text-inverse-color;

@dashboard-apps-tile-logo-border-size:          0px;
@dashboard-apps-tile-logo-border-color:         @decorator-main-color;

@dashboard-apps-tile-settings-color:            @dashboard-apps-tile-text-color;
@dashboard-apps-tile-settings-bg-color:         @dashboard-apps-tile-bg-color;

@dashboard-apps-tile-settings-hover-color:      @dashboard-apps-tile-text-color;
@dashboard-apps-tile-settings-hover-bg-color:   @dashboard-apps-tile-bg-color;

@dashboard-apps-tile-add-color:                 @dashboard-apps-tile-text-color;
@dashboard-apps-tile-add-bg-color:              @dashboard-apps-tile-bg-color;

/*-----------------------------------------------------------------------*/
/*                      Dashboard > My account Section                   */
/*-----------------------------------------------------------------------*/
@dashboard-account-tabs-bg-color:                    @bg-on-bg-inverse-color;
@dashboard-account-tabs-text-color:                  @text-inverse-color;
@dashboard-account-panel-header-bg-color:            @bg-inverse-color;
@dashboard-account-panel-header-text-color:          @text-inverse-color;
@dashboard-account-panel-body-bg-color:              @bg-on-bg-inverse-color;
@dashboard-account-panel-text-color:                 @text-strong-color;
@dashboard-account-inline-text-color-checked:        @brand-success;
@dashboard-account-inline-text-color-unchecked:      @decorator-inverse-color;

/*-----------------------------------------------------------------------*/
/*                      Dashboard > Company Section                      */
/*-----------------------------------------------------------------------*/
// Tab Heading
//--------------------------------------
@dashboard-cpy-tabs-bg-color:                    @decorator-main-color;
@dashboard-cpy-tabs-text-color:                  @text-strong-color;
@dashboard-cpy-tabs-border-radius:               2px;

@dashboard-cpy-tabs-subline-size:                0px;
@dashboard-cpy-tabs-subline-color:               transparent;

@dashboard-cpy-tabs-active-text-color:           @decorator-main-color;
@dashboard-cpy-tabs-active-bg-color:             @bg-inverse-color;

@dashboard-cpy-tabs-hover-text-color:            @decorator-main-color;
@dashboard-cpy-tabs-hover-bg-color:              @bg-inverse-color;

// Tab Content
//--------------------------------------
@dashboard-cpy-tabcontent-header-bg-color:       @bg-inverse-color;
@dashboard-cpy-tabcontent-body-bg-color:         @bg-on-bg-inverse-color;
@dashboard-cpy-tabcontent-bg-color:              @bg-inverse-color;
@dashboard-cpy-tabcontent-text-color:            @text-inverse-strong-color;

// Teams section
//--------------------------------------
@dashboard-cpy-teams-matrix-bg-color:            @bg-inverse-color;
@dashboard-cpy-teams-matrix-border-color:        @bg-inverse-color;
@dashboard-cpy-teams-matrix-text-color:          @text-inverse-color;
@dashboard-cpy-teams-matrix-text-hover-color:    @text-inverse-color;
@dashboard-cpy-teams-matrix-text-edit-color:     @text-strong-color;

/*-----------------------------------------------------------------------*/
/*                              Dock                                     */
/*-----------------------------------------------------------------------*/
@mno-dock-bg-color:                             @decorator-inverse-color;

@mno-dock-add-app-border-color:                 white;
@mno-dock-add-app-text-color:                   white;
@mno-dock-expand-arrow-color:                   white;
@mno-dock-expand-arrow-color-hover:             darken(@mno-dock-expand-arrow-color, 5%);
@mno-dock-expand-left-border-color:             white;
@mno-dock-app-title-color:                      white;
@mno-dock-app-logo-square-width:                70px;
@mno-dock-app-logo-minimized-square-width:      50px;
@mno-dock-app-box-shadow:                       0 6px 12px rgba(0, 0, 0, 0.175);
@mno-dock-app-box-border:                       1px solid rgba(0, 0, 0, 0.15);

@mno-dock-sub-menu-box-shadow:                  0 6px 12px rgba(0, 0, 0, 0.175);
@mno-dock-sub-menu-bg-color:                    @bg-inverse-color;
@mno-dock-sub-menu-hover:                       @decorator-main-color;
@mno-dock-sub-menu-icon:                        @decorator-touch-color;
@mno-dock-sub-menu-text-color:                  @text-inverse-color;
@mno-dock-sub-menu-text-hover-color:            darken(@mno-dock-sub-menu-text-color, 10%);

// Mobile dock
@mno-dock-mobile-bg-color:                      @bg-on-bg-inverse-color;
@mno-dock-mobile-button-color:                  @text-inverse-strong-color;
@mno-dock-mobile-button-bg-color:               @decorator-inverse-color;
@mno-dock-mobile-app-active-color:              lighten(@mno-dock-mobile-button-bg-color, 20%);
@mno-dock-mobile-app-border-bottom:             1px solid darken(@mno-dock-bg-color, 10%);
@mno-dock-mobile-add-app-color:                 @text-strong-color;
@mno-dock-mobile-app-name-color:                @text-strong-color;

/*-----------------------------------------------------------------------*/
/*                              Dock Settings                            */
/*-----------------------------------------------------------------------*/
@mno-dock-settings-app-running:                 #33d375;
@mno-dock-settings-app-terminating:             #ffe6ea;
@mno-dock-settings-app-upgrading:               #ffdb99;
@mno-dock-settings-app-neutral:                 #E0FFFF;

/*-----------------------------------------------------------------------*/
/*                              IMPAC                                    */
/*-----------------------------------------------------------------------*/
// Dashboard
//--------------------------------------
@impac-dashboard-padding-top:                   33px;
@impac-dashboard-margin-left:                   0px;

// Title
@impac-dashboard-title-label-color:             @text-strong-color;
@impac-dashboard-title-color:                   @decorator-inverse-color;
@impac-dashboard-source-color:                  @impac-dashboard-title-label-color;
@impac-dashboard-buttons-border-radius:         4px;

// Widgets container
@impac-placeholder-border:                      2px dashed @bg-inverse-color;
@impac-padding-between-widgets:                 12px;
@impac-minimum-widget-size:                     258px;

// Widgets
//--------------------------------------
// Global
@impac-widget-background-color:                 @bg-on-bg-inverse-color;
@impac-widget-text-color:                       black;
@impac-widget-text-color-light:                 lighten(@impac-widget-text-color,70%);
@impac-widget-borders-color:                    lighten(@impac-widget-text-color-light,10%);
@impac-widget-link-color:                       @decorator-inverse-color;

// Title
@impac-widget-title-text-color:                 white;
@impac-widget-title-bg:                         @bg-inverse-color;
@impac-widget-title-border:                     solid 1px @impac-widget-borders-color;
@impac-widget-title-text-transform:             uppercase;
@impac-widget-title-text-size:                  12px;
@impac-widget-title-border-radius:              5px 5px 0px 0px;

// Content
@impac-widget-content-border-radius:            0px 0px 5px 5px;
@impac-widget-lines-container-max-height: 			210px;

// Hist Mode Choser
@impac-widget-hist-text-transform:              uppercase;
@impac-widget-hist-text-size:                   12px;
@impac-widget-hist-text-color:                  @impac-widget-text-color-light;

// Price
@impac-widget-price-color:                      @impac-widget-text-color;
@impac-widget-price-positive-color:             @brand-success;
@impac-widget-price-negative-color:             @brand-danger;
@impac-widget-currency-color:                   @impac-widget-text-color-light;
@impac-widget-legend-color:                     lighten(@impac-widget-text-color,30%);

// Edit settings
@impac-widget-sub-bg-color:                     darken(@impac-widget-background-color,10%);
@impac-widget-sub-bg-color-light:               lighten(@impac-widget-sub-bg-color,5%);

// Invoices list
@impac-widget-line-hover-bg:                    lighten(@bg-inverse-color,10%);
@impac-widget-line-hover-text:                  @text-inverse-color;

// Accounts Comparison
@impac-big-widget-size:                         581px;
@impac-big-widget-bottom-padding:               30px;
@impac-widget-accounts-comparison-lines-container-max-height: 250px;

/*-----------------------------------------------------------------------*/
/*                 Mno Enterprise > Marketplace Section                  */
/*-----------------------------------------------------------------------*/
@dashboard-marketplace-search-text-color:             @text-strong-color;
@dashboard-marketplace-search-border-color:           @text-strong-color;

@dashboard-marketplace-tile-bg-color:                 @bg-on-bg-inverse-color;
@dashboard-marketplace-tile-text-color:               @text-strong-color;
@dashboard-marketplace-tile-img-border-color:         @decorator-main-color;

@dashboard-marketplace-tile-hover-bg-color:           @decorator-main-color;
@dashboard-marketplace-tile-hover-text-color:         @dashboard-marketplace-tile-text-color;
@dashboard-marketplace-tile-hover-img-border-color:   darken(@decorator-main-color,10%);
@dashboard-marketplace-tile-hover-arrow-color:        @text-strong-color;

@dashboard-marketplace-show-header-text-color:        @text-strong-color;
@dashboard-marketplace-show-sections-bg-color:        @bg-on-bg-inverse-color;
@dashboard-marketplace-show-sections-text-color:      @text-strong-color;

@dashboard-marketplace-app-card:                      { display: block; padding: 10px; height: 120px; margin-bottom: 10px; font-weight: 300; };

/*-----------------------------------------------------------------------*/
/*                     Responsive Table (cell table)                     */
/*-----------------------------------------------------------------------*/
@table-cell-header-row-spacing:        10px;
@table-cell-header-row-padding:        3px;
@table-cell-row-spacing:               0px;
@table-cell-row-padding:               3px;

@table-cell-header-text-size:          12px;
@table-cell-header-text-color:         @text-inverse-strong-color;
@table-cell-header-bg-color:           lighten(@bg-inverse-color, 5%);
@table-cell-header-additional-rule:    { text-transform: uppercase; };

@table-cell-row-text-size:             13px;
@table-cell-row-odd-bg-color:          darken(@bg-main-color,4%);
@table-cell-row-even-bg-color:         darken(@bg-main-color,0%);

@table-inverse-cell-header-text-color: @text-inverse-strong-color;
@table-inverse-cell-header-bg-color:   lighten(@bg-inverse-color, 5%);
@table-inverse-cell-row-odd-bg-color:  darken(@bg-main-color,4%);
@table-inverse-cell-row-even-bg-color: darken(@bg-main-color,0%);

/*-----------------------------------------------------------------------*/
/*                          Navbar Customization                         */
/*-----------------------------------------------------------------------*/
@navbar-inverse-bg:              @bg-inverse-color;
@navbar-height:                  40px;
@navbar-inverse-link-color:      @decorator-inverse-color;
@navbar-border-radius:           0px;
@navbar-inverse-border:          @bg-inverse-color;
@navbar-desktop-height:          120px;
@navbar-inverse-link-active-bg:  @navbar-inverse-bg;

/*-----------------------------------------------------------------------*/
/*                          Form Customization                           */
/*-----------------------------------------------------------------------*/
@input-bg:                      @bg-on-bg-inverse-color;
@input-color:                   @text-strong-color;
@input-color-placeholder:       @input-color;
@input-label-color:             @text-inverse-color;