﻿// --------------------------------------------------
// Core variables and mixins
// --------------------------------------------------

@import "../bootstrap/variables.less";
@import "../gmg-variables.less";
@import "../bootstrap/mixins.less";
@import "../ThemeVariables.less";

// --------------------------------------------------
// Theme base colors
// --------------------------------------------------

@sideMenuBarText: #ed1556;
@defaultMainMenuTextColor: #555555;

// --------------------------------------------------
//Main Menu

:root,
:root.light {
    --btn-default-primary-bg-50: @primaryBaseColor-500;
    --btn-default-primary-bg-100: @LightPrimaryBaseColor-400;
    --btn-default-primary-bg-200: @LightPrimaryBaseColor-300;
    --btn-default-primary-bg-300: @LightPrimaryBaseColor-200;
    --btn-default-primary-bg-400: @LightPrimaryBaseColor-100;
    --btn-default-primary-bg-500: @LightPrimaryBaseColor-50;
    --btn-primary-text-color: #fffffff0;
    --btn-upload-primary-text-color: #fffffff0;
    --btn-bagde-text-color: #fffffff0;
    --horizontal-icon-color: #333333;
    --default-theme-feild-focus-color: inset 0 1px 1px @primaryFieldFocusColor, 0 0 8px @secondryFieldFocusColor;
    --horizontal-action-menu-icon-color: #fffffff0;
    --btn-default-blue-background: #125B9C;
}

.darkmode {
    --btn-default-primary-bg-50: @primaryBaseColor-500;
    --btn-default-primary-bg-100: @DarkPrimaryBaseColor-600;
    --btn-default-primary-bg-200: @DarkPrimaryBaseColor-700;
    --btn-default-primary-bg-300: @DarkPrimaryBaseColor-800;
    --btn-default-primary-bg-400: @DarkPrimaryBaseColor-900;
    --btn-default-primary-bg-500: @DarkPrimaryBaseColor-950;
    --btn-primary-text-color: #fffffff0;
    --btn-upload-primary-text-color: #fffffff0;
    --horizontal-icon-color: #bdc1c6;
    --btn-bagde-text-color: #fffffff0;
    --default-theme-feild-focus-color: inset 0 0px 0px @primaryFieldFocusColor, 0 0 8px @secondryFieldFocusColor;
    --horizontal-action-menu-icon-color: #fffffff0;
    --btn-default-blue-background: #075985;
}

// --------------------------------------------------

/*.navbar-inner {
  #gradient > .vertical(@headerTopColor, @headerBottomColor);
      border-bottom: 1px solid @clearThemeNavbarBorder;
}*/

// Brand, links, text, and buttons
.navbar {
    color: @clearThemeNavbarText;

    .brand {
        color: @clearThemeNavbarBrandColor;
    }

    .navbar-link {
        color: @clearThemeNavbarLinkColor;

        &:hover {
            color: @clearThemeNavbarLinkColorHover;
        }
    }
}

/*.navbar-inner a { color: @linksColor; }*/

/*.navbar .nav > li > a:focus,
.navbar .nav > li > a:hover {
  background-color: @clearThemeNavbarLinkBackgroundHover;
  color: @clearThemeNavbarLinkColorHover;
  text-decoration: none;
}*/

.navbar .nav > .active > a,
.navbar .nav > .active > a:hover,
.navbar .nav > .active > a:focus {
    /*color: @clearThemeNavbarLinkColorActive;
    border-bottom:3px solid @clearThemeNavbarLinkBackgroundActive;*/
    color: @clearThemelinkColor ~'!important';
    border-bottom: 3px solid @clearThemelinkColor;
}

.navbar-search {
    .search-query {
        color: @white;
        background-color: @clearThemeNavbarSearchBackground;
        border: 1px solid @clearThemeNavbarSearchBorder;
        .placeholder(@clearThemeNavbarSearchPlaceholderColor);

        &:focus,
        &.focused {
            color: @grayDark;
            background-color: @clearThemeNavbarSearchBackgroundFocus;
        }
    }
}

/*.navbar .nav > li > a {
  color: darken(@clearThemeNavbarLinkColor, 6%);  
}*/

.navbar .divider-vertical {
    background-color: @clearThemeNavbarBackground;
    border-right: 1px solid @clearThemeNavbarBackgroundHighlight;
}

/*.navbar .nav li.dropdown > a:hover .caret {
  border-top-color: @defaultMainMenuTextColor;
  border-bottom-color: @defaultMainMenuTextColor;
}*/

// Remove background color from open dropdown
/*.navbar .nav li.dropdown.open > .dropdown-toggle,
.navbar .nav li.dropdown.active > .dropdown-toggle,
.navbar .nav li.dropdown.open.active > .dropdown-toggle {
  background-color: @clearThemeNavbarLinkBackgroundActive;
  color: @clearThemeNavbarLinkColorActive;
}

.navbar .nav li.dropdown.open > .dropdown-toggle .caret,
.navbar .nav li.dropdown.active > .dropdown-toggle .caret,
.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret {
  border-top-color: @defaultMainMenuTextColor;
  border-bottom-color: @defaultMainMenuTextColor;
}
*/
.navbar-inner {
    border-color: #ddd !Important;
}

.navbar .nav li.dropdown.open > .dropdown-toggle, .navbar .nav li.dropdown.active > .dropdown-toggle, .navbar .nav li.dropdown.open.active > .dropdown-toggle,
.navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus {
    /*background-color:#e5e5e5!Important;*/
}

.navbar .nav > li > a {
    text-shadow: none !Important;
}

// --------------------------------------------------
//Secondary Menu
// --------------------------------------------------

/*.subnav .nav li > a{ color: @sideMenuBarText; }*/

/*.nav-tabs > li.active > a {color: #555555!Important;}*/

// --------------------------------------------------
//Body
// --------------------------------------------------

body {
    margin: 0;
    font-family: @clearThemeBaseFontFamily;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-submenu:hover > a,
.dropdown-submenu:focus > a,
.dropdown-menu > li > a {
    color: #FFFFFF !Important;
}

/*.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
    color: #FFFFFF !Important;
}*/

#sliderMenu ul li.active > a,
#sliderMenu ul li.active > a:hover,
.nav-pills .dropdown .dropdown-menu > li > a:hover {
    color: #FFFFFF !Important;
}

#sliderMenu ul li > a,
#sliderMenu .nav-pills li a:hover,
.nav-pills .dropdown .dropdown-menu > li > a,
.thumbnail .btn-group > a > i,
.dropdown-menu > li > a {
    color: #333 !Important;
}

#sliderMenu ul li.active > a {
    background-color: @buttonTopColor ~'!important';
    color: #fff !Important;
}
.help-block a, #footer a {
    color: @buttonTopColor ~'!important';
}
.form-actions .btn[disabled] {
    background-color: @buttonTopColor ~'!important';
}
// --------------------------------------------------
// WIZARD
// --------------------------------------------------

.wizard-steps {
    .active-step a {
        background: @clearThemelinkColor;
    }

    .active-step a:before {
        border-top: 19px solid @clearThemelinkColor;
        border-bottom: 19px solid @clearThemelinkColor;
    }

    .active-step a:after {
        border-left: 19px solid @clearThemelinkColor;
    }
}

// --------------------------------------------------
// NAV LIST
// --------------------------------------------------
.nav-list > .active > a,
.nav-list > .active > a:hover {
    color: @white;
    background-color: @clearThemelinkColor;
}

// --------------------------------------------------
// PILLS
// --------------------------------------------------

.nav-pills > .active > a,
.nav-pills > .active > a:hover {
    /*color: @white;*/
    /*background-color: @clearThemelinkColor;*/
    color: var(--btn-default-primary-bg-50) !important;
    border-bottom: 3px solid var(--btn-default-primary-bg-50) !important;
}

// DROPDOWNS
// ---------

// Hover state
// -----------
.dropdown-menu li > a:hover,
.dropdown-menu li > a:focus,
.dropdown-submenu:hover > a {
    text-decoration: none;
    color: @white;
    background-color: @buttonTopColor ~'!important';
    background-image: none !important;
}

// Default dropdown links
// -------------------------
// Make carets use linkColor to start
.nav-tabs .dropdown-toggle .caret,
.nav-pills .dropdown-toggle .caret {
    border-top-color: @clearThemelinkColor;
    border-bottom-color: var(--btn-default-primary-bg-50) !important;
}

.nav-tabs .dropdown-toggle:hover .caret,
.nav-pills .dropdown-toggle:hover .caret {
    border-top-color: @clearThemelinkColorHover;
    border-bottom-color: @clearThemelinkColorHover;
}

// Navbar button for toggling navbar items in responsive layouts
.navbar .btn-navbar {
    .buttonBackground(@clearThemeNavbarBackgroundHighlight, @clearThemeNavbarBackground);
}


// THUMBNAILS
// ----------
a.thumbnail:hover {
    border-color: #666;
}

.thumbnail-view {
    .approval-grid {
        li.block {
            .thumbnail {
                .approval {
                    .cell {
                        a {
                            .img-frame {
                                // Add a hover state for linked versions only
                                &:hover {
                                    border-color: @clearThemelinkColor;
                                }
                            }
                            // img-frame
                        }
                        //a
                    }
                    //cell
                }
                //approval
            }
            //thumbnail
        }
        //block
    }
    //approval-grid
}
//thumbnail-view

// Alternate buttons
// --------------------------------------------------

// Set text color
// -------------------------
/*.btn-primary,
.btn-primary:hover, {
  color: @white;
  text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}*/
/*.btn-primary.active{
  color: rgba(255,255,255,.75);
}*/
// Set the backgrounds
// -------------------------

.btn-primary {
    .buttonBackground(@buttonTopColor, @buttonTopColor)!important;
}

/*.widget-header {
	.widget-links {	
    	li a:hover {
		    color:@clearThemeWidgetHeaderLinkColorHover;
    	}
    }
}*/

.subnav.accoutnSettingdNav ul li.active > a {
    background-color: @buttonTopColor ~'!important';
}
// RESPONSIVE
// --------------------------------------------------
@media (max-width: 979px) {
    .nav-collapse .nav .nav-header {
        color: @clearThemeNavbarText;
    }

    .nav-collapse .nav > li > a,
    .nav-collapse .dropdown-menu a {
        color: @clearThemeNavbarLinkColor;
    }

    .nav-collapse .nav > li > a:hover,
    .nav-collapse .dropdown-menu a:hover {
        background-color: @clearThemeNavbarBackground;
    }

    .nav-collapse .navbar-form,
    .nav-collapse .navbar-search {
        border-top: 1px solid @clearThemeNavbarBackground;
        border-bottom: 1px solid @clearThemeNavbarBackground;
    }
}

// --------------------------------------------------

//Footer
// --------------------------------------------------

/*#footer {background : @footerColor}*/

// --------------------------------------------------


#login-form input.input-xlarge {
    height: 30px !Important;
    width: 285px !Important;
}

/*.navbar .nav li.dropdown > .dropdown-toggle .caret
{
    border-top-color: @linksColor;
    border-bottom-color: @linksColor;
}*/
.navbar .nav > li > a {
    text-shadow: none !Important;
}

#approvalsFoldersSideBar ul li .title a {
    color: #333333;
}

#approvalsFoldersSideBar ul li .dropdown-menu li a:hover {
    color: #fff !Important;
}

.modal-header .close {
    color: rgb(0, 0, 0) !important;
}

.czn-profile .czn-profile-item:hover .selectable,
.czn-approval-item.czn-profile.active,
.czn-profile .czn-profile-item:hover .fa-dot-circle-o,
.czn-profile-item:hover .fa.fa-circle-o {
    color: #FFF !important;
    background-color: @buttonTopColor ~'!important';
}

.czn-approval-item.czn-profile.active {
    background-color: @buttonTopColor ~'!important';
}
// CHOSEN
// ---------------

.chzn-container .chzn-results .highlighted {
    background-color: var(--btn-default-primary-bg-50) !important;
    /*#gradient > .vertical(@greenThemeDropdownLinkBackgroundHover, darken(@greenThemeDropdownLinkBackgroundHover, 5%));
    color: #fff;*/
}

.chzn-container-active .chzn-choices {
    border: 1px solid @buttonTopColor ~'!important';
}

/*Start CA-903 Dark Theme handle in setting*/

.btn-primary {
    color: var(--btn-upload-primary-text-color) !important;
    background: var(--btn-default-primary-bg-50);
    border: 1px solid var(--btn-default-primary-bg-50);
}

.navbar .nav > .active > a,
.navbar .nav > .active > a:hover,
.navbar .nav > .active > a:focus {
    color: var(--btn-default-primary-bg-50) !important;
    border-bottom: 3px solid var(--btn-default-primary-bg-50);
}

.btn-primary.active, .btn-primary[disabled] {
    background: var(--btn-default-primary-bg-300) !important;
    border: 1px solid var(--btn-default-primary-bg-300) !important;
    color: var(--btn-upload-primary-text-color) !important;
}

.label-info, .badge-info {
    background-color: var(--btn-default-primary-bg-50) !important;
}

.chzn-container-active .chzn-choices {
    border: 1px solid var(--btn-default-primary-bg-50) !important;
}

.thumbnail-view .approval-grid li.block .thumbnail label.selected {
    border: 1px solid var(--btn-default-primary-bg-50) !important;
}

.btn-toolbar .btn-border.btn {
    color: var(--btn-default-primary-bg-50) !important;
    border: 1px solid var(--btn-default-primary-bg-50) !important;
}

.btn-toolbar .btn-border.btn:hover {
    color: var(--btn-primary-text-color) !important;
    background: var(--btn-default-primary-bg-50) !important;
}

.a-user-selector li.active .role-selector .btn-group .label-inverse, .a-user-selector li.active .role-selector .btn-group .badge-inverse {
    color: var(--btn-bagde-text-color) !important;
    background-color: var(--btn-default-primary-bg-50) !important;
    border: 1px solid var(--btn-default-primary-bg-50) !important;
}

.report-container .page-header .btn.btn-primary.pull-right {
    color: var(--btn-primary-text-color) !important;
    background: var(--btn-default-primary-bg-50) !important;
    border: 1px solid var(--btn-default-primary-bg-50) !important;
}

.form-actions .btn.btn-primary.upper.pull-right {
    color: var(--btn-primary-text-color) !important;
    background: var(--btn-default-primary-bg-50) !important;
    border: 1px solid var(--btn-default-primary-bg-50) !important;
}

.decisions .label.labelVideo {
    color: var(--btn-upload-primary-text-color) !important;
}

.accoutnSettingdNav ul li.active > a {
    color: var(--btn-primary-text-color) !important;
    background: var(--btn-default-primary-bg-50) !important;
}

.subnav.accoutnSettingdNav ul li.active > a {
    background: var(--btn-default-primary-bg-50);
    color: var(--btn-upload-primary-text-color);
}

#btnChooseFile {
    color: var(--btn-upload-primary-text-color) !important;
    background-color: var(--btn-default-primary-bg-50) !important;
    border: 1px solid var(--btn-default-primary-bg-50) !important;
}

#btnCaptureFromWeb {
    color: var(--btn-upload-primary-text-color) !important;
    background-color: var(--btn-default-primary-bg-50) !important;
    border: 1px solid var(--btn-default-primary-bg-50) !important;
}

#sliderMenu ul li.active > a {
    background-color: var(--btn-default-primary-bg-50) !important;
}

.nav-colored .badge-inverse {
    background-color: var(--btn-default-primary-bg-200) !important;
    color: var(--btn-bagde-text-color) !important;
}

.label-info, .badge-info {
    background-color: var(--btn-default-primary-bg-50) !important;
}

.a-user-selector li.active .role-selector .btn-group .ellipsisButton {
    color: var(--btn-bagde-text-color) !important;
    background-color: var(--btn-default-primary-bg-50) !important;
    border: 1px solid var(--btn-default-primary-bg-50) !important;
}

a {
    color: var(--btn-default-primary-bg-50);
}

.ellipsisButton .icon-ellipsis-horizontal, .ellipsisButtonList .icon-ellipsis-horizontal {
    color: var(--horizontal-icon-color) !important;
}

textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus {
    box-shadow: var(--default-theme-feild-focus-color) !important;
}

input[type=checkbox], input[type=radio] {
    accent-color: var(--btn-default-primary-bg-50) !important;
}

.a-user-selector li.active .role-selector .btn.btn-mini.ellipsisButton .icon-ellipsis-horizontal {
    color: var(--horizontal-action-menu-icon-color) !important;
}

.filter-bar-bottom .dropdown.dropup.open .dropdown-menu li a:hover {
    color: #fff !important;
}

.totalfileCount {
    color: var(--btn-default-primary-bg-50);
}

.tabs-container .nav-tabs > li.active a {
    color: var(--btn-default-primary-bg-50) !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--btn-default-primary-bg-50) !important;
    color: white;
}

.breadcrumb a {
    color: var(--btn-default-primary-bg-50) !important;
}
.a-user-selector li.active dl {
    background-color: var(--btn-default-primary-bg-300) !important;
    border: 1px solid var(--btn-default-primary-bg-300) !important;
}
.a-user-selector li.active dt {
    color: var(--btn-upload-primary-text-color) !important;
}
.a-user-selector li.active.disabled dl {
    background-color: var(--btn-default-primary-bg-300) !important;
    border: 1px solid var(--btn-default-primary-bg-300) !important;
}
.a-user-selector li.active dl dd {
    color: var(--btn-upload-primary-text-color) !important;
}
.thumbnail-view .approval-grid li.block .thumbnail label:hover {
    background-color: var(--btn-default-primary-bg-500) !important;
}
.report-container .page-header .btn.btn-primary.pull-right {
    background-color: var(--btn-default-primary-bg-200) !important;
}
/*End CA-903 Dark Theme handle in setting*/