﻿/*!
 * Custom styles applied
    ex.
.btn {border-radius: 0px;}

    - Custom btn class/colors
        http://blog.koalite.com/bbg/
        - Does not factor in Bootstrap THEME elements.
    - Customize everything (brand colors etc...)
        http://getbootstrap.com/customize/

    bootstrap PRIMARY = #337ab7
    hrnext "blue" = #143D8D
    hrnext "green" = #78A22F
    ...for now, we are NOT using the "hrnext" blue... we are using the standard PRIMARY blue.
 */


/********* bootstrap btn hrnext (HRnext BLUE) */
.btn-hrnext { 
  color: #ffffff; 
  background-color: #337ab7; 
  border-color: #143D8D; 
} 
 
.btn-hrnext:hover, 
.btn-hrnext:focus, 
.btn-hrnext:active, 
.btn-hrnext.active, 
.open .dropdown-toggle.btn-hrnext { 
  color: #ffffff; 
  background-color: var(--hrnext-primaryblue); 
  border-color: var(--hrnext-primaryblue); 
} 
 
.btn-hrnext:active, 
.btn-hrnext.active, 
.open .dropdown-toggle.btn-hrnext { 
  background-image: none; 
} 
 
.btn-hrnext.disabled, 
.btn-hrnext[disabled], 
fieldset[disabled] .btn-hrnext, 
.btn-hrnext.disabled:hover, 
.btn-hrnext[disabled]:hover, 
fieldset[disabled] .btn-hrnext:hover, 
.btn-hrnext.disabled:focus, 
.btn-hrnext[disabled]:focus, 
fieldset[disabled] .btn-hrnext:focus, 
.btn-hrnext.disabled:active, 
.btn-hrnext[disabled]:active, 
fieldset[disabled] .btn-hrnext:active, 
.btn-hrnext.disabled.active, 
.btn-hrnext[disabled].active, 
fieldset[disabled] .btn-hrnext.active { 
  background-color: #337ab7; 
  border-color: #143D8D; 
} 
 
.btn-hrnext .badge { 
  color: #143D8D; 
  background-color: #ffffff; 
}

/********* bootstrap btn hrnext-green (HRnext GREEN) */
.btn-hrnext-green { 
  color: #ffffff; 
  background-color: var(--hrnext-highlightgreen); 
  border-color: var(--hrnext-highlightgreen); 
} 
 
.btn-hrnext-green:hover, 
.btn-hrnext-green:focus, 
.btn-hrnext-green:active, 
.btn-hrnext-green.active { 
  color: #ffffff; 
  background-color: var(--hrnext-primaryblue); 
  border-color: var(--hrnext-primaryblue); 
} 

.open .dropdown-toggle.btn-hrnext-green { 
  color: #ffffff; 
  background-color: var(--hrnext-highlightgreen); 
  border-color: var(--hrnext-highlightgreen); 
} 
 
.btn-hrnext-green:active, 
.btn-hrnext-green.active, 
.open .dropdown-toggle.btn-hrnext-green { 
  background-image: none; 
} 
 
.btn-hrnext-green.disabled, 
.btn-hrnext-green[disabled], 
fieldset[disabled] .btn-hrnext-green, 
.btn-hrnext-green.disabled:hover, 
.btn-hrnext-green[disabled]:hover, 
fieldset[disabled] .btn-hrnext-green:hover, 
.btn-hrnext-green.disabled:focus, 
.btn-hrnext-green[disabled]:focus, 
fieldset[disabled] .btn-hrnext-green:focus, 
.btn-hrnext-green.disabled:active, 
.btn-hrnext-green[disabled]:active, 
fieldset[disabled] .btn-hrnext-green:active, 
.btn-hrnext-green.disabled.active, 
.btn-hrnext-green[disabled].active, 
fieldset[disabled] .btn-hrnext-green.active { 
  background-color: var(--hrnext-highlightgreen); 
  border-color: var(--hrnext-primaryblue); 
} 
 
.btn-hrnext-green .badge { 
  color: var(--hrnext-highlightgreen); 
  background-color: #ffffff; 
}
.badge.badge-danger { 
  background-color: #d9534f; 
}
a span.badge.badge-danger {color: white;}

/********* bootstrap custom */

/*  NO GUTTER - row/cols */
.no-gutter > [class*='col-'] {
    padding-right:0;
    padding-left:0;
}

/*  bootstrap-alert custom */
/*  Reduce the padding just a bit */
[role='alert'][data-notify='container'] {padding: 15px 5px 15px 10px;}

/*  bootstrap-well custom */
.well-success {background: #5cb85c;}
.well-primary {background: #337ab7;}
.well-warning {background: #f0ad4e;}
.well-danger {background: #d9534f;}
.well-info {background: #5bc0de;}
.well-xs {padding: 3px; border-radius: 3px;}

/*  bootstrap-panel custom */
.panel-default > .panel-heading-hrnextBlue{
  background-image: none;
  background-color: var(--hrnext-primaryblue);
  color: #ffffff;
}
.panel-default > .panel-heading-hrnextGreen{
  background-image: none;
  background-color: var(--hrnext-highlightgreen);
  color: #ffffff;
}

.text-hrnextBlue {
  color: var(--hrnext-primaryblue);
}
a.text-hrnextBlue:hover,
a.text-hrnextBlue:focus {
    color: var(--hrnext-primaryblue);
}
.text-hrnextGreen {
  color: var(--hrnext-highlightgreen);
}
a.text-hrnextGreen:hover,
a.text-hrnextGreen:focus {
    color: var(--hrnext-highlightgreen);
}

.text-bold {font-weight: bold;}

/*  bootstrap page-header - too big of top margin */
.page-header {margin-top: 1em;}

/*  bootstrap-modal custom 
    We need the ability to have some extra wide space...
*/
@media (min-width: 768px) {
  .modal-wide {width: 90%;}
}
/*  bootstrap-modal
    We want our CLOSE button to be the same size (with padding/margins) as the buttons surrounding it.
*/
.modal .close {font-size: 19px;}
.modal .modal-footer.rowCommandBar {padding: 0px; text-align: inherit;}

.modal-body-SSO {
  position: relative;
  padding: 15px;
  background-color: #337ab7; 
  border-color: #337ab7; 
  border-bottom:0px solid #eee;
  border-top:0px solid #eee;
  border-left:0px solid #eee;
  border-right:0px solid #eee;
}
.modal-header-SSO {
  position: relative;
  padding: 15px;
  background-color: #337ab7; 

}
.panel-default-SSO {
  color: #333;
  background-color: #5bc0de;
  border-bottom:0px solid #eee;
  border-top:0px solid #eee;
  border-left:0px solid #eee;
  border-right:0px solid #eee;
}
/*border-bottom:1px solid #eee;
  background-color: #0480be;
  border-color: #143D8D; 

    */
/*  popover custom LARGER sizes
*/
.popover-xxxl {min-width: 1000px;}
.popover-xxl {min-width: 800px;}
.popover-xl {min-width: 580px;}
.popover-lg {min-width: 480px;}
.popover-md {min-width: 350px;}

/* popovers create some issues for us in some cases */
.input-group .popover .form-control {float: none;}

/* navbar-form form-group displays strangely in Firefox when display is set to inline-block, override here */
.navbar-form .form-group {
    display: inline;
}

/* navbar-form input controls lose ability to set width easily without this */
.navbar-form .form-group .input-group .input-group-addon,
.navbar-form .form-group .input-group .input-group-btn 
{width: 1%;}
/* other issues with navbar-form in menu collapsed mode */
@media(max-width:768px) {
    .navbar-form {padding-top: 0; padding-bottom: 0; border: 0;}
    .navbar-form .form-group {margin-bottom: 0;}
}

/*  ICON colors/actionsicote: 'text-danger' (etc...) will "colorize" the icons with the BS standard semantic colors.
*/
.iconaction-help {cursor: help;}


/*  FONT AWESOME overrides */
    /*  For some reason, FA doesn't vertically center things when you use their 2x, 3x, etc... */
.fa-sm {
  text-align: left;
  -webkit-transform:scale(.75, 1.0);
  -moz-transform:scale(.75, 1.0);
  -moz-transform:scale(.75, 1.0);
  -ms-transform:scale(.75, 1.0);
  -o-transform:scale(.75, 1.0);
  transform:scale(.75, 1.0);
}

.fa-2x {vertical-align: -15%;}
.fa-3x {vertical-align: -25%;}
    /*  Center the REQUIRED ASTERISK in input box...with NO LABEL (which means we need less space to account for) */
.form-control-feedback.fv-icon-no-label.fa.fa-asterisk {top: 10px;}
    /*  Center the REQUIRED ASTERISK in input box...WITH LABEL */
.form-control-feedback.fa.fa-asterisk {top: 35px;}
    /*  Center the REQUIRED ASTERISK in input box */
.inputGroupContainer .form-control-feedback {top: 0px; right: 40px;}

/*  yamm megamenu overrides 
    Don't want to do this if we are in the COLLAPSED (mobile) menu... otherwise though, use the viewport height (vh) minus our header to come up with
        a decent (dynamic) max-height.
*/
@media(min-width: 768px) {
.yamm-content {max-height: calc(100vh - 200px); overflow-y: auto;}
}
/*  yamm (form dropdown) overrides
    We are sometimes using yamm for tricky dropdowns that work differently than standard "menus".
    The CSS here might need some work depending on how much and in what situations this is used... like with TONS of data for example.
*/
.yamm.formDropdown .dropdown {position: relative;}
.yamm.formDropdown .yamm-content {max-height: inherit; overflow-y: inherit; padding-top: 0px; padding-bottom: 0px;}

/*  Add some custom hr variations... the standard bootstrap margins are 20px top and bottom creating a BIG gap.  A lot of things
    don't need that much margin.
*/
hr.small
{margin-top: .5em; margin-bottom: .5em;}
hr.normal
{margin-top: 1em; margin-bottom: 1em;}
hr.large
{margin-top: 1.5em; margin-bottom: 1.5em;}


/*  Bootstrap-select v1.13.2 needs some adjustments to hold things like we had them...and fix a few bugs
*/
.dropdown.bootstrap-select > .bs-placeholder.dropdown-toggle, 
    .dropdown.bootstrap-select > .bs-placeholder.dropdown-toggle:active, 
    .dropdown.bootstrap-select > .bs-placeholder.dropdown-toggle:focus, 
    .dropdown.bootstrap-select > .bs-placeholder.dropdown-toggle:hover {
    /*color: #999;*/
    color: #333;
}
.input-group .bootstrap-select.form-control {
        z-index: inherit;
    }

