/* Basic Beyond Admin overrides relevant to any Telerik theme. Please put theme specific overrides in their theme specific file(s). */

/* This removes enough of the default margin-top to allow the content to start at a visually pleasing
    area since we removed the tertiary header area that was originally in the template */
.navbar.navbar-fixed-top + .main-container {
    margin-top: 6px;
}


/* move the sidebar (menu) collapse/expand element to the LEFT of the above DC logo */
.navbar .sidebar-collapse {
    left: 14px;
}

/* adjustment to make sure fixed header looks right */
.page-header.page-header-fixed {
    display: none;
    height: 0px;
}

/* removes excessive "padding" for checkboxes */
.radio label, 
.checkbox label {
    min-height: 0px;
}

/* removes excessive "padding" for checkboxes */
.checkbox label, 
.radio label {
    min-height: 0px;
}

/* remove excessive margin for checkboxes */
.checkbox, 
.radio {
    margin: 0px;
    padding: 0px;
    display: inline;
}

/* This fixes the 'dissapearing' checkboxes since bootstrap doesn't like normal checkboxes */
input[type="checkbox"], 
input[type="radio"]
{
    opacity: 100;
    position: relative;
    left: initial;
}

/* this puts the bootstrap checkbox rules back in but just for the slider types so they don't have a checkbox sitting on top of them */
input[type="checkbox"].checkbox-slider
{
    opacity: 0;
    position: absolute;
    left: -9999px;
}

/* override beyond admin charts */
.chart-lg {
    height: 350px;
}

.chart-xl {
    height: 450px;
}

.chart-summary {
    top: -25px;
    position: absolute;
}

/* Override bootstrap tooltip for dates to disable html wrap */
.datetooltip + .tooltip > .tooltip-inner {
    white-space: pre;
    max-width: none;
}

/* remove gutter from bootstrap grid */
.row.no-pad {
  margin-right: 0;
  margin-left: 0;
}

.row.no-pad > [class*='col-'] {
  padding-right: 0;
  padding-left: 0;
}

/* shrink from default beyond admin chat */
.page-chatbar .chatbar-contacts .contacts-list .contact .contact-avatar {
    display: inline-block;
    width: 40px;
    height: 40px;
}

.page-chatbar .chatbar-contacts .contacts-list .contact {
    height: 60px;
    padding: 10px;
    position: relative;
}

.contact-menu {
    text-align: right;
    margin: 10px;
}

.input-group-xs > .form-control,
.input-group-xs > .input-group-addon,
.input-group-xs > .input-group-btn > .btn {
    height: 22px;
    padding: 0px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

select.input-group-xs > .form-control,
select.input-group-xs > .input-group-addon,
select.input-group-xs > .input-group-btn > .btn {
    height: 22px;
    line-height: 20px;
}

textarea.input-group-xs > .form-control,
textarea.input-group-xs > .input-group-addon,
textarea.input-group-xs > .input-group-btn > .btn {
    height: auto;
}

/* Makes the side menu scrollable when it's larger than the screen height */
.slimScrollDiv
{
    position: relative; 
    overflow-y: scroll; 
    width: auto; 
    height: auto;
}

/* Chrome - make side menu scrollbar 0 width  (no fix availalbe for FireFox as of 3/10/16) */
.slimScrollDiv::-webkit-scrollbar
{    
    width: 0px;
}

/* used to set the color of the top bar for dev sites */
.skin-local {
    background-color: #33cc33 !important;
}

/* used to set the color of the top bar for dev sites */
.skin-dev {
    background-color: #ff8f32 !important;
}

/* this bootstrap tool tip override ensures tooltips show up on top of other page elements (ex: grid borders, scroll bars, etc.) */
.tooltip {
    position: fixed !important;
}

/* This controls the display of the customer name at the top of the websites */
.customer-name {
    font-weight: bold;
    font-size: 1.5em;
    color: #000;
    padding-top: 8px;
    z-index: 1;    
    width: -moz-fit-content; /* Visual Studio says this value is not valid, but it is */
    width: -webkit-fit-content; /* Visual Studio says this value is not valid, but it is */
}

/* ACTIVE When we're in "full screen" desktop mode...*/
@media (min-width:732px) {
    /* reduce the size of the "wasted" space around the left top DC logo */
    .navbar .navbar-brand {
        width: 125px;
    }

    /* adjust customer name right margin */
    .customer-name {
        margin-right: auto;
        margin-left: auto;
    }

    /* Adjust the avatar/user login area based on screen size */
    .navbar .navbar-inner .navbar-header .navbar-account .account-area .login-area .avatar {
        display: none;
    }

    /* with the page-header.page-header-fixed being hidden, we need to move this entire div up to fill the space - this works for all pages */
    div.page-container {
        margin-top: -85px;
    }
}

/* ACTIVE When we're in "tiny" mobile phone mode...*/
@media (max-width:732px) {
    /* adjust customer name left margin */
    .customer-name {
        margin-left: 20px;
    }

    /* Adjust the avatar/user login area based on screen size */
    .navbar .navbar-inner .navbar-header .navbar-account .account-area .login-area .avatar {
        color: #ffffff;
        display: block;
        border-left: none;
        margin-top: 6px;
        padding-left: 10px;
    }

    /* prevent account area from moving down one line when on small/mobile screen*/
    .navbar .navbar-inner .navbar-header .navbar-account .account-area {
        top: 0px;
    }

    /* stop extra space from being displayed below the customer-name div */
    div.navbar > div.navbar-inner > div.navbar-container > div.navbar-header.pull-right {
        height: 0px;
    }

    /* with the page-header.page-header-fixed being hidden, we need to move this entire div up to fill the space - this only works until the breadcrumbs get too long... */
    div.page-container {
        margin-top: -30px;
    }
}

/* Move account area over to the far right of the screen since we're forcing the menu button to be on the left now, this extra 50px of space is no longer needed */
.navbar .navbar-inner .navbar-header .navbar-account .account-area {
    right: 0px;
}


/***************************************
    Login/Switch user Page Specifics
***************************************/
/* DC logo margins */
.login-logo {
    margin: 10px auto 20px auto;
}

/* sets better margin for the top of the login div */
.widget.login-form {
    margin-top: 40px;
}

/* We only use certain beyondadmin controls however it assumes we are using 
    all of them.  This override prevents it from drawing borders on the hidden
    fields in the kendo wrappers, which was causing double-borders.
*/
input[type="text"], 
input[type="password"],
input[type="datetime"], 
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"], 
input[type="week"],
input[type="number"],
input[type="email"], 
input[type="url"],
input[type="search"],
input[type="tel"] {
    Border: 0;
}

/* 
    This increases Beyond Admin's default z-index of "2" for the order search bar, to "15" to get it 
    to display above the navigation tabs in the main page areas (when the menu is in collapsed mode.) 
    The tabs are currently set to a z-index of 12 (active) and 11 (inactive.)
*/
.page-sidebar .sidebar-header-wrapper .searchinput {
    z-index: 15;
}

/*
    This overrides the text color of the Toastr warning notifications at top right of the web pages.
    The default color is white, which is practically impossible to see/read on the tone of yellow they chose.
*/
.toast.toast-warning > .toast-message {
    color: #000000;
    font-weight: bold;
}