.hana-back-recipe {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 30.73%), linear-gradient(180deg, rgba(0, 0, 0, 0) 57.29%, rgba(0, 0, 0, 0.2) 100%), #2F9BC8 !important;
    background-blend-mode: overlay, overlay, normal;
    box-shadow: inset 0px 2px 0px rgb(255 255 255 / 25%);
    border-radius: 4px;
}

.hana-back-icon {
    font-size: 1.8em;
    line-height: 1em;
}

.hana-recipe-lbl {
    font-family: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    color: #444444;
}

.hana-div-recipe-lb {
    display: flex;
    margin: 1px !important;
}

.hana-div-rcplbl-pl {
    padding-left: 10px;
}

.hana-hr {
    border: 1px solid #E7EAE9;
    margin: 10px 0px 10px 0px;
}

.hana-row {
    margin: 1px !important;
}

.hana-setting-icon {
    /*Modified by ashmita on 26/08/2022 for #133108*/
    float: left;
    /*padding: 1px 0px 0px 1px;*/
    font-size: 14px;
}

.hana-setting-btn {
    border: 1px solid #2F9BC8;
    border-radius: 4px;
    box-sizing: border-box;
    background: #FAFAFA;
    font-family: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 16px;
    color: #2F9BC8;
    height: 34px; /*Modified By Nishant On 16-09-2022 for #133108*/
    width: 115px;
    margin: 24px 0px 0px 10px; /*Modified By Nishant On 16-09-2022 for #133108*/
    display: flex;
    align-items: center; /*Added by Nishant on 22-09-2022 for #133108*/
}
    /*Added by Nishant on 22-09-2022 for #133108*/
    .hana-setting-btn i {
        padding-right: 15px;
    }
/*End #133108*/
/*Added by Nishant on 22-09-2022 for #133108*/
.hana-div-rcp-setting {
    display: flex;
    justify-content: end;
    align-items: flex-end;
}
/*Added By Nishant On 16-09-2022 for #133108*/
#recalculate-btn {
    height: 34px;
}
/*End #133108*/
.hana-hr-2 {
    border: 0; /*Modify By umang on 08/26/2022 for #133108*/
    border-bottom: 1px solid #E7EAE9; /*Modify By umang on 08/26/2022 for #133108*/
    margin: 0px 0px 10px 0px;
}

.hana-btn-delete {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 30.73%), linear-gradient(180deg, rgba(0, 0, 0, 0) 57.29%, rgba(0, 0, 0, 0.2) 100%), #2F9BC8 !important;
    background-blend-mode: overlay, overlay, normal;
    box-shadow: inset 0px 2px 0px rgb(255 255 255 / 25%);
    border-radius: 4px !important;
    border: 0;
    padding: 7px 11px 7px 11px !important;
}

.hana-d-none {
    display: none;
}

.hana-divGrid {
    margin: 1px !important;
}

.hana-component-variant-table-head {
    background: #EDEDED;
    opacity: 0.5;
    border-radius: 6px 6px 0px 0px;
    font-family: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #666666;
}

.ui-autocomplete {
    position: absolute;
    cursor: default;
    z-index: 999999 !important;
    max-height: 250px;
    width: auto;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding for vertical scrollbar */
    padding-right: 10px; /*Modified by nishant on 13/09/2022 for #133108*/
}

.RecipeWrap .modal {
    z-index: 2500 !important;
}

body #_addRecipe .modal-dialog {
    width: 90% !important;
}

body #markupsettings .modal-dialog {
    width: 65% !important;
}

body #addcomponentmodal .modal-dialog {
    width: 90% !important;
}

#_addRecipe .modal-dialog, #markupsettings .modal-body {
    max-height: calc(100vh - 60px);
    overflow-y: auto;
    overflow-x: hidden; /*Modify By umang on 08/26/2022 for #133108*/
}

.hana-file {
    background: #FFFFFF;
    border: 1px dashed #2F9BC8;
    border-radius: 8px;
    height: 38px;
}

.hana-small {
    padding: 14px 0px 0px 15px;
}

.hana-d-flex-space-between {
    display: flex;
    -ms-flex-wrap: wrap; /*Modify By umang on 08/26/2022 for #133108*/
    -webkit-flex-wrap: wrap; /*Modify By umang on 08/26/2022 for #133108*/
    flex-wrap: wrap; /*Modify By umang on 08/26/2022 for #133108*/
    justify-content: space-between;
}

    .hana-d-flex-space-between label {
        font-family: 'Atkinson Hyperlegible';
        font-style: normal;
        font-weight: 700;
        font-size: 16px;
        line-height: 20px;
        color: #444444;
        margin: 6px 0px 0px 14px !important;
    }

.hana-item-gallery-dropdown-div {
    width: 116px;
    margin-right: 15px;
}

.hana-item-gallery-dropdown {
    background: #FFFFFF;
    border: 1px solid #B9B9B9;
    border-radius: 4px;
    margin-bottom: 11px;
}

.hana-item-gallery-search {
    width: 95%;
    padding: 9px 9px 9px 37px;
    margin: 0px 0px 10px 12px;
    background: #FFFFFF;
    border: 1px solid #B9B9B9;
    border-radius: 4px;
}

.hana-galeery-search-icon {
    position: absolute;
    width: 5.53px;
    height: 5.5px;
    left: 25px; /*Modified by Nishant on 16-09-2022 For #133108*/
    top: 12px;
    color: #B9B9B9; /*Modified by Nishant on 14-09-2022 for #133108*/
}
/*Added By umang on 08/26/2022 for #133108*/
.item-serach-box {
    position: relative;
}
/*End #133108*/
div#gvRecipeItem {
    border-radius: 6px;
    height: 100%; /*Added by shailja for #133007*/
}

.hana-gallery-div {
    background: #FFFFFF;
    border: 1px solid #E7EAE9;
    border-radius: 8px;
    /*padding: 11px 0px 0px 0px;*/
}

body .hana-item-gallery-photos-div {
    height: 215px !important;
    overflow-y: auto !important;
}

.hana-item-image {
    border-radius: 8px;
    /*min-width: 50%;*/
    max-width: 142px;
    max-height: 142px;
    width: 100%;
    height: 142px;
    /*max-height: 50%;*/
    object-fit: cover;
}

.hana-label-componentname {
    font-family: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: normal; /*Modified by Nishant on 15-09-2022 for #133108*/
    font-size: 14px;
    line-height: 16px;
    /* identical to box height, or 133% */
    /* dark grey text */
    color: #444444;
    margin-top: 10px;
}

.hana-txt-componentqty {
    background: #FFFFFF;
    border: 1px solid #B9B9B9;
    border-radius: 4px;
}

.hana-btn-add-component {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 30.73%), linear-gradient(180deg, rgba(0, 0, 0, 0) 57.29%, rgba(0, 0, 0, 0.2) 100%), #2F9BC8 !important;
    background-blend-mode: overlay, overlay, normal;
    box-shadow: inset 0px 2px 0px rgba(255, 255, 255, 0.25);
    border-radius: 4px;
    width: 80px;
    height: 35px;
    border-color: transparent !important;
}

.hana-div-item-gallery-footer {
    padding: 5px;
    background: #FFFFFF;
    border: 1px solid #E7EAE9;
    border-radius: 8px;
    border-left: 0;
    border-right: 0
}

.recipe-nav .active a {
    background-color: #FFFFFF !important;
    background: #FFFFFF !important;
}

.hana-tabcontent-padding {
    padding: 8px !important;
    border-radius: 8px; /*Modified by nishant on 15/09/2022 for #133108*/
}

.hana-tab-textarea {
    background: #FFFFFF !important;
    border: 1px solid #B9B9B9 !important;
    border-radius: 4px !important;
    width: 100% !important;
    height: 253px !important;
    padding: 10px !important; /*Added by Umang Ramani on 08/29/2022 for #133108*/
}

.hana-RecipeBgImage {
    width: 100%;
    height: 58px;
    cursor: pointer !important;
    border: 1px solid #B9B9B9;
    border-radius: 4px;
}

.hana-remove-image-div {
    display: flex;
    justify-content: center;
}

.hana-add-note-div {
    font-family: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    color: #444444;
    margin: 0px 0px 6px 14px !important;
}

.hana-totalreview-div {
    background: #FFFFFF;
    border: 1px solid #E7EAE9;
    border-radius: 8px;
    padding-top: 11px !important;
    height: 100%; /*Added by nishant on 22-09-2022 for #133108*/
}

.hana-tbody-tr-ml {
    margin-left: 6px !important;
}

.hana-pl {
    padding-left: 2% !important;
}

.hana-d-flex {
    display: flex;
    justify-content: end;
    padding-right: 5%;
}

.recipeSaveSwitchWrap {
    display: flex;
    align-items: center;
}

    .recipeSaveSwitchWrap label {
        margin-left: 0px;
        padding-right: 6px;
    }

.slider {
    position: absolute !important;
    cursor: pointer !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background-color: #fff !important; /*Modify by Umang on 07/05/2022 for #130397*/
    -webkit-transition: .4s !important;
    transition: .4s !important;
    border: 1px solid #C5E7F4; /*Added by Umang on 07/05/2022 for #130397*/
}

    .slider:before {
        position: absolute !important;
        content: "" !important;
        height: 26px !important;
        width: 26px !important;
        left: 4px !important;
        bottom: 3px !important; /*Modify by Umang on 07/05/2022 for #130397*/
        background-color: #2F9BC8 !important; /*Modify by Umang on 07/05/2022 for #130397*/
        -webkit-transition: .4s !important;
        transition: .4s !important;
    }

input:checked + .slider {
    background-color: #1ab394 !important; /*Modify by Umang on 07/05/2022 for #130397*/ /*Added by kishna for #176763*/
}

input:focus + .slider {
    box-shadow: 0 0 1px #1ab394 !important;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px) !important;
    -ms-transform: translateX(26px) !important;
    transform: translateX(40px) !important; /*Added by kishna for #176763*/
}

.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

.slider_red .noUi-connect {
    background: none repeat scroll 0 0 #ed5565;
    box-shadow: none;
}

.slider.round {
    border-radius: 25px;
}

    .slider.round:before {
        border-radius: 50%;
    }

@media print {
    .hidden-print {
        display: none !important;
    }
}

.switch {
    position: relative;
    display: inline-block;
    width: 75px; /*Added by kishna for #176763*/
    height: 34px;
}

    .switch input {
        display: none;
    }

input[type=checkbox] {
    position: relative;
    height: 16px !important; /*Added by umang on 07/22/2022 for #134088*/
    width: 16px !important; /*Added by umang on 07/22/2022 for #134088*/
}

.hana-d-flex-end {
    display: flex;
    justify-content: end;
    padding-right: 2% !important;
}

.hana-btn-save-recipe {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 30.73%), linear-gradient(180deg, rgba(0, 0, 0, 0) 57.29%, rgba(0, 0, 0, 0.2) 100%), #2F9BC8 !important;
    background-blend-mode: overlay, overlay, normal !important;
    box-shadow: inset 0px 2px 0px rgba(255, 255, 255, 0.25);
    border-radius: 4px;
    width: 25%;
    height: 35px;
}

.hana-save-recipe-div-pt {
    padding-top: 77px !important; /*Modified by Nishant on 16-09-2022 For #133108*/
    padding-bottom: 10px; /*Modified by nishant on 15/09/2022 for #133108*/
    padding-left: 15px; /*Added By Nishant on 22-09-2022 for #133108*/
}

.d-none {
    display: none !important;
}

.hana-markup-setting-table {
    background: #dcdcdc !important;
}

/*commented by shailja for #133108*/
/*.recipe-input {
    height: 30px;
    width: 75%;
}*/

.hana-gallery-div .hana-d-flex-space-between {
    padding: 12px 0 0px;
}
/*Change by kishna for #176763*/
/*#gvRecipeItem .create-recipe-grid-image-col {
    width: calc(90px + (80 - 90) * ((100vw - 320px) / (1920 - 320)));
}

#gvRecipeItem .create-recipe-grid-item-col {
    width: calc(160px + (190 - 160) * ((100vw - 320px) / (1920 - 320)));*/ /*Modified By Nishant On 16-09-2022 for #133108*/
/*}

#gvRecipeItem .create-recipe-grid-cost-col {
    width: calc(80px + (90 - 80) * ((100vw - 320px) / (1920 - 320)));
}

#gvRecipeItem .create-recipe-grid-retail-col {
    width: calc(80px + (90 - 80) * ((100vw - 320px) / (1920 - 320)));
}

#gvRecipeItem .create-recipe-grid-quantity-col {
    width: calc(80px + (90 - 80) * ((100vw - 320px) / (1920 - 320)));
}

#gvRecipeItem .create-recipe-grid-totalcost-col {
    width: calc(80px + (90 - 80) * ((100vw - 320px) / (1920 - 320)));
}

#gvRecipeItem .create-recipe-grid-totalretail-col {
    width: calc(80px + (90 - 80) * ((100vw - 320px) / (1920 - 320)));
}

#gvRecipeItem .create-recipe-grid-action-col {*/
/*width: calc(40px + (50 - 40) * ((100vw - 320px) / (1920 - 320)));*/
/*width: auto;*/
/*}*/
/*#176763*/

#gvRecipeItem .create-recipe-grid-action-col button {
    height: 32px;
    width: 32px;
    padding: 0 !important;
}

    #gvRecipeItem .create-recipe-grid-action-col button i {
        font-size: 16px;
        line-height: 20px;
    }

#itemComponentTypeFilterDataWrap::-webkit-scrollbar {
    width: 10px;
}
/* Track */
#itemComponentTypeFilterDataWrap::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
#itemComponentTypeFilterDataWrap::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.3);
}

.create-recipe-div-boxes {
    margin-bottom: 15px;
    /*min-height: 371px;*/
}
/*Added by nishant on 22-09-2022 for #133108*/
.hana-divGrid {
    display: flex;
}
/*Added by nishant on 06/09/2022 for #133108*/
.create-recipe-div-boxes table {
    border: 0;
    border-top: 1px solid #E7EAE9;
}

.hana-gallery-div {
    padding: 0;
}
/*End #133108*/
.add-note-title {
    padding-top: 13px;
}

.nav-tabs.recipe-nav .active a {
    border: none !important;
    border-bottom: 3px solid #2f9bc8 !important;
    border-radius: 0 !important;
    font-weight: 700 !important;
}

.nav-tabs.recipe-nav > li > a:hover {
    border-color: transparent;
}

#BtnSaveProductDowns {
    width: 100px;
    border-color: transparent !important;
}

#_addRecipe .hana-modal-dialog::-webkit-scrollbar, #gvRecipeItem ::-webkit-scrollbar { /*Added by kishna for #176763*/
    width: 10px;
}
/* Track */
#_addRecipe .hana-modal-dialog::-webkit-scrollbar-track, #gvRecipeItem ::-webkit-scrollbar-track { /*Added by kishna for #176763*/
    background: #f1f1f1;
}

/* Handle */
#_addRecipe .hana-modal-dialog::-webkit-scrollbar-thumb, #gvRecipeItem ::-webkit-scrollbar-thumb { /*Added by kishna for #176763*/
    box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.3);
}

/*Added by kishna for #176763*/
#itemComponentTypeFilterDataWrap {
    min-height: 370px; /*Change by krishna for #176016*/
    padding-left: 15px !important;
}

.hana-gallery-images-div {
    min-height: 370px;
}
/*Added by Umang Ramani on 08/29/2022 for #133108*/
#gvRecipeItem .k-grid-content.k-auto-scrollable {
    min-height: 430px; /*Change by nishant on 30/8/2022 for #133108*/
    overflow-x: auto;
    overflow-y: auto;
    max-height: 430px; /*Change by nishant on 30/8/2022 for #133108*/
}
/*End #133108*/
/*#176763*/
.col-md-4.dataComponentGallary {
    min-height: 200px;
}

#_addRecipe .modal-header {
    padding: 15px 30px;
}

#gvRecipeItem td input {
    width: 100%;
    box-sizing: border-box;
}

#gvRecipeItem td label {
    margin: 0;
}
/*Added by krishna for #176016*/
#gvRecipeItem th, #gvRecipeItem td {
    padding-left: 6px !important;
    padding-right: 6px !important;
}
/* #176016*/

.recipe-nav li {
    width: 33.33%;
    text-align: center;
}

.hana-totalreview-div label {
    color: #444444;
}
/*Added by Umang Ramani on 08/29/2022 for #133108*/
.dataRecipeGallary {
    width: 90px;
}
/*End #133108*/
/*Modified by Nishant on 14-09-2022 for #133108*/
.create-recipe-div-boxes .table tbody tr td p {
    color: #444444;
    margin: 0;
}

.create-recipe-div-boxes .table tbody tr td {
    vertical-align: middle;
}

#drdItemComponentType {
    color: #444444;
}
/*End #133108*/
/*Modified by Nishant on 16-09-2022 For #133108*/
.saveasrecipe-btn {
    padding-right: 15px !important;
    margin-left: 10px !important; /*Added by kishna for #176763*/
}
/*End #133108*/
/*Added By Nishant On 16-09-2022 for #133108*/
.create-recipe-header-input-col .form-group {
    width: 250px;
    padding-left: 15px;
}

.create-recipe-header-input-col {
    display: flex;
    width: 70%;
}

.hana-div-rcp-setting {
    width: 30%;
}

.create-recipe-header-input-col .recipe-quantity-col {
    width: 150px;
}
/*Change by krishna for #176016*/
.componentRecipe {
    white-space: nowrap;
    width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
}
/*Added by kishna for #176763*/
#gvRecipeItem .k-grid-header {
    padding-right: 0px !important;
}
#gvRecipeItem .create-recipe-grid-action-col {
    overflow: visible;
}
/*#176763*/
@media (max-width: 1650px) {
    .componentRecipe {
        width: 120px;
    }
}

@media (max-width: 1600px) {
    #gvRecipeItem .create-recipe-grid-action-col {
        width: calc(40px + (50 - 40) * ((100vw - 320px) / (1920 - 320)));
        /*width: auto;*/
    }
    .componentRecipe {
        width: 100px;
    }
}
@media (max-width: 1300px) {
    .componentRecipe {
        width: 80px;
    }
}
/*#176016*/
@media (max-width: 1140px) {
    .create-recipe-header-input-col {
        width: 100%;
    }

    .hana-div-rcp-setting {
        width: 100%;
        justify-content: start;
    }

    .hana-setting-btn {
        margin-top: 0;
    }
    /*Added by krishna for #176016*/
    .componentRecipe {
        width: 80px;
    }
    /* #176016*/
}
/*End #133108*/
@media (max-width: 1024px) {
    #gvRecipeItem {
        min-height: 370px !important; /*Added by kishna for #176763*/
    }
    /*Added by shailja for #133007*/
    body .hana-item-gallery-photos-div .dataComponentGallary {
        width: 100% !important;
        text-align: center;
    }
    /*Added by krishna for #176016*/
    .componentRecipe {
        width: 100%;
    }
    /* #176016*/
}

@media (max-width: 991px) {
    .hana-item-gallery-dropdown-div {
        width: 100%;
        padding-left: 15px;
        padding-top: 5px;
    }

    .col-md-4.dataComponentGallary {
        text-align: center;
    }

    .hana-item-gallery-search {
        width: 90%;
    }

    .compontent-lable {
        padding: 0;
    }

    .recipe-input {
        height: 34px;
    }

    .recipe-nav li {
        width: 50%;
    }

    .recipe-nav .photos-tab {
        text-align: center;
        width: 100%;
    }

    body .saveasrecipe-btn {
        justify-content: flex-start;
        padding-left: 0px;
        padding-bottom: 0px; /*Modified for #182322*/
    }

    body .hana-save-recipe-div-pt {
        padding-top: 50px !important;
        padding-left: 15px;
    }

    #gvRecipeItem .k-grid-content.k-auto-scrollable {
        min-height: 370px; /*Added by kishna for #176763*/
    }

    .top-navigation .nav-tabs.recipe-nav .active a, .top-navigation .nav-tabs.recipe-nav a {
        padding: 10px 10px;
    }
}
/*Added by shailja for #133108*/
#RecipeTopMenus {
    display: flex;
    height: 100%;
    align-items: end;
    flex-wrap: wrap;
}
/*End #133108*/
/*Added by kishna for #176763*/
.hana-divGrid .hana-item-div-box {
    margin-left: 15px;
}

/*Added For #250421*/
#recipeLabel {
    color: #000;
    border-bottom: 1px solid #ededed;
    border-top: 1px solid #ededed;
    padding: 10px 10px;
    margin: 2.5rem 0 2rem 0;
    background-color: #E6F2F7 !important;
}
/*End #250421*/

@media (max-width: 768px) {
    .totalpreview .recipeSaveToProduct {
        display: block;
    }
    body .saveasrecipe-btn {
        justify-content: flex-end;
        padding-top: 10px;
    }
}
/*#176763*/
/*Added by krishna for #176016*/
@media (max-width: 1023px) {
    .hana-divGrid .hana-item-div-box {
        max-width: 594px !important;
        width: 594px;
        overflow: scroll;
    }
    /*Added by kishna for #176763*/
    .hana-divGrid .hana-item-div-box, #gvRecipeItem, #gvRecipeItem .k-grid-content {
        max-width: 570px !important;
        width: 570px;
    }

    input:checked + .slider:before {
        -webkit-transform: translateX(35px) !important;
        -ms-transform: translateX(35px) !important;
        transform: translateX(35px) !important;
    }
    /*#176763*/
}
/*#176016*/