.border-whitesmoke {
    border-color: whitesmoke !important;
}

.border-white {
    border-color: #fff !important;
}



.overview-card {

    border-radius: 4px;
}




.overview-card h4 {

    background-color: #96d0c4;
    color: white;
    margin-bottom: 0px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    text-align: center;

    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}



.overview-card h6 {

    background-color: #337a6c;

    color: white;
    margin-bottom: 0px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    text-align: center;

    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}







.overview-card.smaller {
    box-shadow: 0 5px 10px 2px rgba(36, 105, 92, 0.07) !important;
}

.overview-card.smaller h4 {

    font-size: 18px;
    height: 50px;
    background-color: white;
    color: #69988e;
}



.overview-card.smaller h6 {

    font-size: 13px;
    height: 45px;
    background-color: #69988e;
    
}









.overview-card.smaller {
    box-shadow: 0 5px 10px 2px rgba(36, 105, 92, 0.07) !important;
}

.overview-card.smaller h4 {

    font-size: 18px;
    height: 50px;
    background-color: white;
    color: #111;
}



.overview-card.smaller h6 {

    font-size: 13px;
    height: 45px;
    color: #111;
    background-color: #C5B7B1;
    
}





.overview-card-wrap .overview-card.smaller.v2 {
    border-radius:8px;
    margin-right: 4px !important;
}




.overview-card.smaller.v2 h4 {

    font-size: 13px;
    height: auto;
    background-color: white;
    color: #111;
    padding: 6px 2px;
    border-radius: 0px 0px 8px 8px;
}



.overview-card.smaller.v2 h6 {

    border-radius: 8px 8px 0px 0px;
    font-size: 11px;
    height: auto;
    color: #fff;
    background-color: #69988e;
    padding: 6px 0px 3px;
    overflow: hidden;
    text-overflow: ellipsis;
}






/* --------------------------------------- */


.customer-status {
    position: absolute;
    bottom: 60px;
    left: 0px;
    right: 0px;
    font-weight: 600;
    border-radius: 3px;
    font-size: 12px;
    margin: auto;
    max-width: 77px;
    background-color: white;
    display: inline-block;
}



.weekdays-row div {
    background-color: white;
    border: 1px solid whitesmoke;
    padding: 9px 0px;
}




.weekdays-row input {
    width: 16px;
    height: 16px;
    margin-top: 5px;
    margin-bottom: 8px;
}


.weekdays-row label {
    font-size: 12px;
    font-weight:500;
    display: block;
}




.meal-groups img {

    width: 100%;
    height: 100px;
    object-fit: contain;
    object-position: bottom;
}


.meal-groups h6 {
    text-align: center;
    margin: auto;
    background-color: #69988e;
    color: white;
    height: 43px;
    width: 50px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 0px;
}


.meal-groups h5 {
    text-align: center;
    margin: auto;
    background-color: white;
    color: #337a6c;
    height: 43px;
    width: 50px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0px;
}






/* ----------------------------------------- */


.bag-section img {
    
    width: 100%;
    height:200px;
    object-fit: contain;
}







.btn-whitesmoke {
    background-color: whitesmoke;
    border-color: whitesmoke;
    color:#111;
}



.btn-whitesmoke:hover,
.btn-whitesmoke:focus,
.btn-whitesmoke:active,
.btn-whitesmoke.active {

    background-color: lightgrey;
    border-color: lightgrey;
    color:#111;

}






.btn-blue {
    background-color: #dbefeb;
    border-color: #dbefeb;
    color:#111;
}



.btn-blue:hover,
.btn-blue:focus,
.btn-blue:active,
.btn-blue.active {

    background-color: #96d0c4;
    border-color: #96d0c4;
    color:#111;

}




/* ----------------------------------------- */

/* builder */


.btn-ingredient {
    background-color: #E8FFDE;
    border-color: #E8FFDE;
    color:#111;
}



.btn-ingredient:hover,
.btn-ingredient:focus,
.btn-ingredient:active,
.btn-ingredient.active {

    color: #111;
    background-color: #d9f7cc;
    border-color: #d9f7cc;
}


.btn-outline-ingredient {
    border-color: #E8FFDE;
    color: #111;
}



.btn-outline-ingredient:hover,
.btn-outline-ingredient:focus,
.btn-outline-ingredient:active,
.btn-outline-ingredient.active {

    background-color: #E8FFDE;
    border-color: #E8FFDE;
    color: #111;

}



/* ---------------------- */
/* ---------------------- */




.btn-portion {
    background-color: #FDEAC9;
    border-color: #FDEAC9;
    color:#111;
}



.btn-portion:hover,
.btn-portion:focus,
.btn-portion:active,
.btn-portion.active {

    background-color: #f7e2c0;
    border-color: #f7e2c0;
    color:#111;

}


.btn-outline-portion {
    border-color: #FDEAC9;
    color: #111;
}



.btn-outline-portion:hover,
.btn-outline-portion:focus,
.btn-outline-portion:active,
.btn-outline-portion.active {

    background-color: #FDEAC9;
    border-color: #FDEAC9;
    color: #111;

}









/* ---------------------- */
/* ---------------------- */




.btn-side {
    background-color: #C9E5FD;
    border-color: #C9E5FD;
    color:#111;
}



.btn-side:hover,
.btn-side:focus,
.btn-side:active,
.btn-side.active {

    background-color: #b7dbfa;
    border-color: #b7dbfa;
    color:#111;

}












/* ---------------------- */
/* ---------------------- */




.btn-snack {
    background-color: #FBD0D3;
    border-color: #FBD0D3;
    color:#111;
}



.btn-snack:hover,
.btn-snack:focus,
.btn-snack:active,
.btn-snack.active {

    background-color: #f8c8cb;
    border-color: #f8c8cb;
    color:#111;

}











/* ---------------------- */
/* ---------------------- */




.btn-drink {
    background-color: #E2E2E2;
    border-color: #E2E2E2;
    color:#111;
}



.btn-drink:hover,
.btn-drink:focus,
.btn-drink:active,
.btn-drink.active {

    background-color: #d6d5d5;
    border-color: #d6d5d5;
    color:#111;

}



.btn-meal {
    background-color: #fcefef;
    border-color: #fcefef;
    color:#111;
}



.btn-meal:hover,
.btn-meal:focus,
.btn-meal:active,
.btn-meal.active {

    background-color: #fcefef;
    border-color: #fcefef;
    color:#111;

}







/* ---------------------- */
/* ---------------------- */




.btn-sauce {
    background-color: #ebc9fdf2;
    border-color: #ebc9fdf2;
    color:#111;
}



.btn-sauce:hover,
.btn-sauce:focus,
.btn-sauce:active,
.btn-sauce.active {

    background-color: #deb4f5f2;
    border-color: #deb4f5f2;
    color:#111;

}



/* ---------------------- */
/* ---------------------- */



.bg-ingredient{
    background-color: #E8FFDE !important;
    border-color: #E8FFDE !important;
}
.bg-portion{
    background-color: #FDEAC9 !important;
    border-color: #FDEAC9 !important;
}
.bg-sauce{
    background-color: #ebc9fdf2 !important;
    border-color: #ebc9fdf2 !important;
}
.bg-snack{
    background-color: #FBD0D3 !important;
    border-color: #FBD0D3 !important;
}
.bg-side{
    background-color: #C9E5FD !important;
    border-color: #C9E5FD !important;
}
.bg-drink{
    background-color: #E2E2E2 !important;
    border-color: #E2E2E2 !important;
}


.table-styling-inputs.table-primary tbody tr.tr-ingredient {

    background-color: #E8FFDE !important;

}

.table-styling-inputs.table-primary tbody tr.tr-ingredient .form-control[readonly] {

    background-color: transparent !important;

}




/* ---------------------- */


.table-styling-inputs.table-primary tbody tr.tr-portion {
    
    background-color: #FDEAC9 !important;
}



.table-styling-inputs.table-primary tbody tr.tr-portion .form-control[readonly] {

    background-color: transparent !important;

}









/* ---------------------- */


.table-styling-inputs.table-primary tbody tr.tr-snack {

    background-color: #FBD0D3 !important;
}



.table-styling-inputs.table-primary tbody tr.tr-snack .form-control[readonly] {

    background-color: transparent !important;

}





/* ---------------------- */


.table-styling-inputs.table-primary tbody tr.tr-side {

    background-color: #C9E5FD !important;
}



.table-styling-inputs.table-primary tbody tr.tr-side .form-control[readonly] {

    background-color: transparent !important;

}





/* ---------------------- */


.table-styling-inputs.table-primary tbody tr.tr-drink {
    
    background-color: #E2E2E2 !important;
}



.table-styling-inputs.table-primary tbody tr.tr-drink .form-control[readonly] {

    background-color: transparent !important;

}



.table-styling-inputs.table-primary tbody tr.tr-meal {
    
    background-color: #fcefef !important;
}



.table-styling-inputs.table-primary tbody tr.tr-meal .form-control[readonly] {

    background-color: transparent !important;

}


/* ---------------------- */


.table-styling-inputs.table-primary tbody tr.tr-sauce {

    background-color: #ebc9fdf2 !important;
}



.table-styling-inputs.table-primary tbody tr.tr-sauce .form-control[readonly] {

    background-color: transparent !important;

}








/* --------------------------------------- */
/* --------------------------------------- */
/* --------------------------------------- */





/* Kitchen */


.text-theme-alt {
    color: #9e8e71;
}

.btn-theme-blue {
    background-color: #fff !important;
    border: none;
    box-shadow: 0px 3px 6px #00000047;
    padding: 14px 14px;
    border-radius: 18px;
    color: #111;
    font-size: 16px;
    min-width: 180px;
    font-weight:600;
}




.btn-theme-blue:hover,
.btn-theme-blue:focus,
.btn-theme-blue:active,
.btn-theme-blue.active {
    
    background-color: #96D0C4 !important;
    box-shadow: 0px 3px 6px #00000047;
    font-weight: 700;
}



.scroll-x-div {
    white-space: nowrap;
    padding-bottom: 17px;
    overflow-x: auto;
}






*::-webkit-scrollbar {
  width: 4px;
  height:4px;
}
 
*::-webkit-scrollbar-track {
  background-color:#EBEBEB;
  border-radius: 150px;
}
 
*::-webkit-scrollbar-thumb {
  background-color: lightgrey;
  outline: 1px solid lightgrey;
  border-radius: 150px;
}






/* ------------------------- */



.kitchen-card {
    width:100%;
    box-shadow: 0px 3px 6px #00000047;
    border-radius: 18px;
    background-color: white;
    text-align: center;
    margin-top:80px;
}



.kitchen-card.exclude {
    background-color:#FFD5D5;
}


.kitchen-card img {
    margin-top: -100px;
    width: 100%;
    object-position: bottom;
    max-height: 320px;
    object-fit: contain;
    height: 100%;
}


.overview-kitchenCard {
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 10px;
    background-color: white;
}


.overview-kitchenCard h6 {
    background-color: #96D0C4;
    border-radius: 0px 0px 10px 10px;
    padding: 8px 0px;
}





.packingPlate img {
    width: 100%;
    height: 100%;
    max-height: 160px;
    margin-top: -67px;
    object-fit: contain;
    object-position: top;
}



.badge-with-note span:nth-of-type(1){
    white-space: normal;
    border-radius: 10px 10px 0px 0px;
}



.badge-with-note span:nth-of-type(2){
    white-space: normal;
    border: 1px solid whitesmoke;
    border-radius: 0px 0px 10px 10px;
    font-size: 14px;
    line-height: 22px;
}




.kitchen-packingItem {
    margin: 0px 15px;
    border: 1px solid #96D0C466;
    border-radius: 3px;
}





.kitchen-packingItem h6 {
    background-color: #96D0C4;
    color: #111;
    border-radius: 3px;
    padding:5px 4px 5px 8px;
    line-height:23px;
}





.kitchen-btn-warning {
    background-color: #F6C85C;
    border:1px solid #96D0C466;
    border-radius:4px;
    font-weight:700;
    cursor: pointer;
}


.kitchen-btn-warning:hover,
.kitchen-btn-warning:focus,
.kitchen-btn-warning:active,
.kitchen-btn-warning.active {

    background-color: #f8c755;
    border-color: #96D0C466;
    color:black;

}



.kitchen-small-square {
    display: inline-block;
    padding: 3px 8px;
    font-weight: 700;
    border-radius: 3px;
    background-color: #dbefeb;
    margin-bottom: 5px;
}
/* ---------------------------------- */



.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet,
.singleDot {
    border-radius: 4px;
    width: 20px;
    height: 10px;
    display:inline-block;
    opacity:1;
    background-color: transparent;
    border: 1px solid #efefef;
}


.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet:last-of-type,
.singleDot:last-of-type {
    margin-right:0px;
}


.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active,
.singleDot.active,
.singleDot:hover,
.singleDot:focus {
    border: 1px solid #96d0c4;
    background-color: #96d0c4;
}






/* ------------------------------- */

.overview-kitchenCard.v2 {
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 10px;
    background-color: white;
    width: 95px;
    margin-right:10px;
    margin-bottom:10px;
}


.overview-kitchenCard.v2:last-of-type {
    margin-right: 0px;
}


.overview-kitchenCard.v2 h6 {
    background-color: #96D0C4;
    border-radius: 0px 0px 10px 10px;
    padding: 8px 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}



.overview-kitchenCard.v2 .fa-times {
 
    color: #ff6767;
    position: absolute;
    top: 0px;
    left: 0px;
    font-size: 85px;
    width: 100%;
    opacity: 0.4;
    height: 100%;
}



/* ----------------------------- */

.source-badge {
    font-size: 13px;
    padding: 1px 7px;
    margin-bottom: 2px;
    margin-top: -15px;
}





/* -------------------------------- */


.plate-ingredient {

    text-align:center;
}


.plate-ingredient img {
    
    width: 100%;
    height: 100%;
    max-height: 55px;
    max-width: 60px;
    margin: auto;
    object-fit: contain;
    margin-bottom:8px;
}


.plate-ingredient .img-holder {

    width: 100%;
    height: 55px;
    max-width: 60px;
    margin: auto;
    margin-bottom: 8px;
    border:1px solid #d5d5d5;
    border-radius: 13px;
}






/* ================== */




.intakeMacros-popup h4 {

    font-size: 14px;
    font-weight: 700;
    text-align: center;
}



.intakeMacros-popup .overview-card.smaller h6 {
    font-size: 11px;
    height: auto;
    padding: 5px 1px;
}


.intakeMacros-popup .overview-card.smaller h4 {
    font-size: 11px;
    height: auto;
    padding: 8px 0px;
    border-radius: 0px 0px 8px 8px;
}