/* Minification failed. Returning unminified contents.
(248,29): run-time error CSS1046: Expect comma, found '0'
(248,33): run-time error CSS1046: Expect comma, found '/'
(516,39): run-time error CSS1046: Expect comma, found '243'
(516,47): run-time error CSS1046: Expect comma, found '/'
 */
/*
    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
    !!! THIS FILE IS SHARED BETWEEN WEBADMIN AND STOREFRONT PROJECTS BUT MUST BE KEPT IN SYNC MANUALLY !!!
    !!! WHEN THIS FILE IS CHANGED IN ONE PROJECT, IT SHOULD BE IMMEDIATELY COPIED TO THE OTHER PROJECT !!!
    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
*/

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap');

*,
*:before,
*:after {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    font-family: "Roboto", sans-serif !important;
    font-size: 0.9rem !important;
}

/* Wrapper for page content to push down footer */
#wrap {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto -51px; /* set bottom margin to NEGATIVE effective footer height (height + border)*/
  padding: 0 0 51px; /* Pad bottom by effective footer height (height + border)*/
}



/*Added below these classes by Vineet after upgrading UI*/

.breadcrumbLine {
    margin-top:35px;
    margin-left: 0px;
    background-color: transparent;
    color: #666;
    text-decoration: none;
}

.main-banner{
    margin-top: -40px;
}


/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #ff0000 !important;
}

.field-validation-valid {
    display: none !important;
}

.input-validation-error {
    border: 1px solid #ff0000 !important;
    background-color: #ffeeee !important;
}

.validation-summary-errors {
    font-weight: bold !important;
    color: #ff0000 !important;
}

.validation-summary-valid {
    display: none !important;
}

.error-heading {
    color: #b94a48;
    background-color: #f2dede;
    border-color: #ebccd1;
}

#footer {
    font-size: 0.85rem !important;
    background: #232f3e;
    color: #fff;
    left: 0;
    font-size: 0.9rem;
    position: fixed;
    bottom: 0;
    width: 100%;
    height: auto;
    margin-top: 10px;
}

    #footer .copyright {
        display: flex;
        flex-wrap: wrap;
        justify-content: left;
        align-items: center;
        padding: 5px;
    }

/* the following classes added to support prettier display of data within panels (using div class=row and class=col rather than tables) */
.row-header {
    font-weight: bold;
    padding-bottom: 8px;
    border-bottom: 2px solid #ddd;
}

.row-data {
    padding-top: 7px;
    padding-bottom: 8px;
    border-top: 1px solid #ddd;
}

.row-hover:hover {
    background-color: #F0F0F0;
}

.panel-body-no-footer
.panel-body-no-footer {
    padding-bottom: 0px;
}

.trim-x {
    overflow-x: hidden;
    text-overflow: ellipsis;
}
/* end */

.cell-bullets {
    padding-left: 20px;
    margin-bottom: 0px;
}

/* an <h2> tag has top and bottom margins. How come bootstrap ".h2" class does not also do this? we provide the option here */
.h2-margins {
    margin-top: 20px;
    margin-bottom: 10px;
}

.filter-item {
    margin-left: 10px;
    margin-right: 0px;
    margin-bottom: 15px;
    float: left;
    white-space: nowrap;
}

.filter-item-first {
    margin-left: 10px;
}

.text-inline {
    display: inline;
}

/* support for links that don't look like links until the user hovers over them */
.link-muted a {
    color: black;
    text-decoration: none;
}

    .link-muted a:hover {
        color: black;
        text-decoration: underline;
    }


/* support for collapsable panels */
.card-heading .accordion-toggle:before {
    font-family: 'Glyphicons Halflings';
    content: "\e114";
    float: left;
    color: grey;
    padding-right: 5px;
    margin-left: -5px;
}

.card-heading .collapsed:before {
    content: "\e080";
}

.card-heading > .panel-title > A:focus {
    /*outline: 0;*/
    text-decoration: none;
}

/* eliminate transition animation for bootstrap 3; this was done to speed up chosen-delay-collapse. */
.collapsing {
    -webkit-transition: none;
    transition: none;
    transition: height 0.01s;
}


/* eliminate vertical spacing and rounded borders */
.list-group-vertically-squished, .list-group-vertically-squished:first-child, .list-group-vertically-squished:last-child,
.list-group-vertically-squished .list-group-item {
    border: none;
    border-radius: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}


/* support for elements created outside of an editor template that should continue to flow inline with the form created by the template. */
.editor-inline-block FORM.form-inline {
    display: inline-block;
}



/* support for showing items in a fluid multi-column list of cells, listed in a left-to-right fit-as-many-as-you-can on one-row format */

.image-container {
    min-height: 200px;
    min-width: 200px;
    border: 2px dashed #F0F0F0;
    border-radius: 10px;
}

.logo-container {
    width: 30%;
    height: auto;
}

.image-drop-zone {
    border: 1px solid #A0A0A0;
    border-radius: 10px;
    padding: 6px 12px 8px 12px;
}

.image-drop-zone-text {
    color: #A0A0A0;
}

.product-list {
    margin-top: 20px;
}


.search-topmargin {
    margin-top: 35px;
}

.product-card {
    height: auto;
    min-height: 18rem !important;
    padding: 0.7rem !important;
    border: 1px solid rgb(0 0 0 / 20%) !important;
}
    .product-card .card-body {
        font-size: 0.83rem;
    }

    .main-heading {
        margin-top: 30px;
        margin-left: 5px;
    }

@media only screen and (max-width: 428px) {
    .main-heading {
        margin-top: 10px !important;
    }
}

/*@media only screen and (max-width: 1024px) {
    .card {
        width: 17rem !important;
        height: 16rem !important;
    }

    .card-img {
        width: 40%;
        height: 30%;

    }

    .pagination {
        margin-right: 55px !important;
    }
}*/

.dismiss{
    float:right;
    font-size: 1rem;
    font-weight:bold;
}

.accordion-body-listbox {
    padding: 0.5rem 0rem !important;
}

table > thead a {
    color: black !important;
    text-decoration:none !important;
}

.close-btn-sm {
    margin-top: -2px !important;
    height: 0.5em !important;
    width: 0.5em !important;
}

.btn-tblgroup {
    display: flex;
    align-items: center;
    border-bottom: none;
}

.w-14{
    width: 14%;
}

.actions-col {
    width: 18%;
    text-align: center;
}

.role-warning{
    color: white;
    padding:9px;
    font-size: 0.8rem;
}

.calendar-icon {
    padding: 10px;
    position: absolute;
    right: 0px;
}

.text-red {
    color: red;
}

.header-margin {
    margin-bottom: 20px;
}

.btn-vertical {
    display: flex;
    align-items: center
}

.table-wrapper{
    margin-bottom: 10px;
}

.row-header-override {
    font-weight: bold;
    padding-bottom: 8px;
}

.row-data-override {
    padding-top: 7px;
    padding-bottom: 8px;
    border-top: 2px solid #ddd;
}

.chzn-container-multi .chzn-choices .search-field input {
    height: 30px !important;
}

.mt-note{
    margin-top: 100px !important;
}

/*Media Queries*/
@media only screen and (max-width: 700px) {
    select {
        max-width: none !important;
    }

    .product-card {
        width: 19rem !important;
    }

    .mt-note {
        margin-top: 0px !important;
    }
}

@media only screen and (max-width: 480px) {
    .text-position-absolute {
       position: absolute !important;
    }
}

@media only screen and (min-width: 600px) {
    .dobFilter.form-control {
        width: 120px !important;
    }
}

/*
    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
    !!! THIS FILE IS SHARED BETWEEN WEBADMIN AND STOREFRONT PROJECTS BUT MUST BE KEPT IN SYNC MANUALLY !!!
    !!! WHEN THIS FILE IS CHANGED IN ONE PROJECT, IT SHOULD BE IMMEDIATELY COPIED TO THE OTHER PROJECT !!!
    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

    contains classses that supplement or modify bootstrap.
    This css should take precendence over stock bootstrap css. (It should be loaded after.)
*/


/* fix the pagedlist css which ruins any attempt to center the component */
.text-center .pagination a, .text-center .pagination span, .text-center .pagination .btn
{
    float: none;
}

/* simple nowrap class */
.text-nowrap
{
    white-space: nowrap;
}

.btn-primary {
    background-color: #00338E !important;
    border-color: #00338E !important;
}

.btn-danger {
    background-color: #EB5757 !important;
    border-color: #EB5757 !important;
}

.btn-success {
    background-color: #39892F !important;
    border-color: #39892F !important;
}

.text-success {
    color: #39892F !important;
}

.bg-success {
    background-color: #39892F !important;
    border-color: #39892F !important;
}

.badge-success {
    background-color: #39892F !important;
    border-color: #39892F !important;
}

/* support for filter description items that should try to stay on one line but wrap the whole item when necessary */

select option {
    line-height: 20px !important;
}

textarea.textarea-height-sm
{
    min-height: 100px;
}

textarea.textarea-height-md
{
    min-height: 200px;
}

.date-picker
{
    width: calc(100% - 37px);
    display: inline;
}

.form-control{
    font-size: 0.9rem !important;
}

.list-group-item.active {
    background-color: #212529;
    border-color: #212529d4;
}

.list-group-item{
    font-size: 0.83rem !important;
    border:none !important;
}

.col {
    margin-bottom: 0.7rem !important;
}

.navbar-brand {
    font-size: 1.5rem !important;
}

.btn {
    font-size: 0.8rem !important;
}

button,
ul {
    font-size: 0.9rem !important;
}


select {
    max-width: 350px;
    font-size: 0.85rem !important;
}

label {
    font-size: 0.9rem !important;
}

.control-label{
    font-weight: 500;
}

.accordion-button {
    background: #f3f3f3 !important;
    font-weight: 500 !important;
    color: #474040 !important;
    box-shadow: 0 0 0 0.25rem rgb(243 243 243 / 25%);
    padding: 0.5rem 0.75rem !important;
}

.text-secondary {
    color: #474040 !important;
}

b,
strong {
    font-weight: 600 !important;
    font-size: 0.83rem !important;
}

.accordion-button:not(.collapsed) {
    box-shadow: none !important;
}

.card-img {
    width: 42%;
    height: 42%;
}

.card-footer {
    background: none !important;
    border: none !important;
    padding-top: 0 !important;
    margin-top: -20px !important;
}

.page-item.active .page-link {
    color: #fff !important;
    background-color: #212529 !important;
    border-color: #212529 !important;
}

.dropdown-menu {
    width: 80%;
}

table th {
    font-size: 0.90rem !important;
}

tbody{
    font-size: 0.83rem !important;
}

table tr{
    vertical-align: text-top;
}

td{
    height: 100%;
}

.table > :not(:first-child) {
    border-top: 1.3px solid grey !important;
}

tbody {
    vertical-align: middle !important;
    font-size: 0.8rem;
}

.pagination {
    display: flex;
    align-items: center;
    justify-content: left;
    /*  margin-right: 30px;*/
}

.pagination li {
    color: black;
    float: left;
    padding: 8px 16px;
    text-decoration: none;
    transition: background-color .3s;
    border: 1px solid #ddd;
}

.pagination li a {
    text-decoration: none;
}

.pagination li.active {
    background-color: #000;
    color: white;
    border: 1px solid #5c5858;
}

.pagination li:hover:not(.active) {
    background-color: #ddd;
}

.badge {
    font-size: 0.7rem !important;
}

.input-group-text {
    width: 40px;
}

tr:hover {
    background-color: rgba(0, 0, 0, 0.075);
}

