/******  BOM  *************/
.input-icon {
    position: absolute;
    margin-top: 3px;
    font-weight: bold;
    animation: bounce 1s infinite;
}
.input-icon:hover{
    animation: none;
}
@keyframes bounce {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(2.5px);
    }

    100% {
        transform: translateY(5px);
    }
}

.border-td-increase {
    border-color: #dc3545 !important;
}

.border-td-increase a i {
    background: #dc3545!important;
    color: white;
    border-radius: 50%;
    font-weight: bold;
}

.border-td-reduced {
    border-color: #17a2b8 !important;

}

.border-td-reduced a i {
   background: #17a2b8!important;
    color: white;
    border-radius: 50%;
    font-weight: bold;
}
.bom-consumption-table-body {
    max-height: calc(100vh - 350px);
}

#body-bom .list-group {
    height: calc(100vh - 300px);
}

.meal-list {
    pointer-events: none;
}

/****** END BOM ***********/

.weekly-menu-sidebar{
    height:calc(100vh - 333px);
}



/******************Card**************************/
.card-header-mrp {
    padding-top: 0.75rem;
    background: #5bc0de;
    color: #fff;
    border-bottom: 1px solid rgba(0,0,0,.125);
    min-height: 41px;
}

    .card-header-mrp:first-child {
        border-radius: calc(.75rem - 1px) calc(.75rem - 1px) 0 0;
    }

    .card-header-mrp .card-top-buttons {
        padding: 0.25rem;
    }

/******************END Card**************************/
.list-group-item {
    padding: 0.25rem 0.25rem !important;
    background-color: transparent;
}

.btn-save-bom {
    padding: 15px 20px;
    margin: -4px;
    border-radius: 0px;
    border-top-right-radius: 10px;
    border-top-left-radius: 0px;
    padding-bottom: 9px;
}

.bom-title-meal {
    background-color: #f7f7f7;
}
.bom-food > td {
    background-color: #dee2e6;
}
.bom-food-link {
    color: #212529;
}
.bom-footer {
    background-color: #f7f7f7;
}
.scroll-table {
    max-height: calc(100vh - 445px);
}

select.form-control {
    padding: 0 0.2rem !important;
}

.context-menu-active {
    background: #F0F8FD;
    transform: scale(1,1);
    -webkit-transform: scale(1,1);
    -moz-transform: scale(1,1);
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

.bottomright {
    position: fixed;
    right: 60px;
    bottom: 0px;
    transition: all 0.2s ease-in-out;
    min-width: 780px;
}

    .bottomright.isHide {
        height: 42px;
    }
    .bottomright .card-header-mrp {
        font-size: 1.2rem;
        line-height: 1.3;
    }

    .rounded .card.bottomright {
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .progressbar {
        counter-reset: step;
        padding: 0;
        /* New */
        display: table;
        table-layout: fixed;
        width: 100%;
    }

    .progressbar li {
        list-style: none;
        position: relative;
        text-align: center;
        z-index: 1;
        /* New */
        display: table-cell;
    }

        .progressbar li:before {
            background: #fff;
            border: 2px solid #bebebe;
            border-radius: 50%;
            color: #bebebe;
            content: counter(step);
            counter-increment: step;
            display: block;
            font-weight: 700;
            height: 30px;
            line-height: 27px;
            margin: 0 auto 5px;
            text-align: center;
            width: 30px;
        }

        .progressbar li:after {
            background: #979797;
            content: '';
            height: 3px;
            left: 50%;
            position: absolute;
            top: 15px;
            width: 100%;
            z-index: -1;
        }

        .progressbar li:last-child:after {
            content: none;
        }

        .progressbar li.complete:after {
            background: #3aac5d;
        }

        .progressbar li.active:before {
            background: #5bc0de;
            border-color: #5bc0de;
            color: #fff;
        }

        .progressbar li.complete:before {
            background: #3aac5d;
            border-color: #3aac5d;
            color: #fff;
        }

        .progressbar li.active {
            color: #5bc0de;
            font-weight: 700;
        }

        .progressbar li.complete {
            color: #333;
            font-weight: 700;
        }

/****************************** Autocomplete ********************/
.twitter-typeahead { width: 100%; } 
.card-autocomplete {
    position: relative;
    padding: 8px;
}

    .card-autocomplete:hover,
    .card-autocomplete.is-active {
        color: #fff;
        background: #55acee;
    }


.card-autocomplete-content {
    padding-left: 70px;
    min-height: 60px;
}

.autocomplete-content-title {
    font-weight: 700;
}

.autocomplete-image {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 60px;
    height: 60px;
}

.autocomplete-spinner {
    position: absolute;
    display: none;
    top: 7px;
    right: 7px;
    width: 28px;
    height: 28px;
}

.autocomplete-menu {
    position: absolute;
    z-index: 100;
    display: none;
    width: 100%;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #fff;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 0px 0px 8px 8px;
    box-shadow: 0px 0px 0px 1px green;
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

    .autocomplete-menu.scrollbar {
        max-height: 350px;
        /*height:350px;*/
    }

    .autocomplete-menu.is-open {
        display: block;
    }

.autocomplete-selectable {
    cursor: pointer;
}

    .autocomplete-selectable + .autocomplete-selectable {
        border-top: 1px solid #ccd6dd;
    }

.autocomplete-stats {
    text-align: right;
}

.autocomplete-stat {
    display: inline-block;
    font-size: 12px;
    line-height: 16px;
}

.autocomplete-stat-label {
    color: #8899a6;
    font-weight: 500;
}

.card-autocomplete:hover .autocomplete-stat-label {
    color: #fff;
}


.food-checking-steps .tab-pane {
    height: calc(100vh - 400px) !important;
}

.mini-progress {
    width: 200px;
    height: 30px;
    padding-top: 10px;
    text-align: center;
}

    .mini-progress .middle-line {
        height: 1px;
        background-color: lightgray;
        position: relative;
        top: 6px;
        left: 0px;
        width: 100%;
        z-index: 0 !important;
    }

    .mini-progress ul {
        list-style: none;
        padding-left: 0px;
        text-align: center;
    }

        .mini-progress ul li {
            text-decoration: none;
            float: left;
            margin-left: 10px;
            margin-right: 10px;
            color: lightgray;
        }

.full-content-height-su {
    height: calc(100vh - 300px)
}

.DTFC_LeftBodyLiner {
    overflow-x: clip;
}

@media (max-width: 767px) {
}